body {font-family: Arial; font-size: 12px; color: #666565; background: #D0E5F4 url(/themes/images/fond.png) repeat center; margin: 0px; padding: 0px; border-top: 1px solid #E5F1F9}
img {border: 0}
a {text-decoration: none; color: inherit;}
a:hover {text-decoration: underline;}
form {margin: 0px; padding: 0px;}
.nofloat{clear: both; height: 0px;}
.noleft{clear: left; height: 0px;}

#login {position: fixed; background-color: #729CBC; height: 25px; text-align: center; z-index: 100; width: 100%; padding:10px;}
#login form {width: 992px; margin-left: auto; margin-right: auto; color: #ffffff; font-size: 14px; text-align: right;}
#login form label {margin-right: 10px;}
#login form input[type=text], #login form input[type=password]{font-size: 12px;}
#login form a{ color: #ffffff; font-size: 10px;}

#logout {position: relative; background-color: #729CBC; height: 10px; text-align: center; z-index: 100; width: 100%; padding:5px;}


#main {position: relative; width: 992px;margin-left: auto; margin-right: auto;  min-height: 600px;}
#logo{position: relative; margin-top: 26px; margin-bottom: 24px;}
#logoHome{position: relative; margin-top: 46px; margin-bottom: 24px;}
#homep {position: relative; height: 1520px;}
#home {position: absolute; top: 0px;}
#home .top {position: relative; height: 27px; width: 992px;}
#home .bottom {position: relative; height: 27px; width: 992px;}
#home .milieu {position: relative; background: #E5F1F9 url(/themes/images/milieu-arrondi.png) repeat-y; width: 938px; padding-left: 30px; padding-right: 24px; min-height: 300px;}

#newMembre {position: absolute; top:610px;}
#newMembre .top {position: relative; height: 27px; width: 992px;}
#newMembre .bottom {position: relative; height: 27px; width: 992px;}
#newMembre .milieu {position: relative; background: #E5F1F9 url(/themes/images/milieu-arrondi.png) repeat-y; width: 938px; padding-left: 30px; padding-right: 24px;}

#newVoySortie {position: absolute; top:1190px;}
#newSortie {width: 490px;}
#newSortie .milieu {position: relative; background: #E5F1F9 url(/themes/images/minmilieu-arrondi.png) repeat-y; width: 436px; padding-left: 30px; padding-right: 24px;}
#newVoySortie p {margin-bottom: 4px !important;}
#newVoyage {width: 490px;}
#newVoyage .milieu {position: relative; background: #E5F1F9 url(/themes/images/minmilieu-arrondi.png) repeat-y; width: 436px; padding-left: 30px; padding-right: 24px;}
#newVoyage p {margin-bottom: 4px !important;}

#ambiance{ position: relative; float: left; border: 1px dotted #A1A1A1; padding: 10px; width: 448px; margin-right: 15px; height: 521px;}
#pitch {position: absolute; top: 10px; right: 10px;}

#inscription{ position: relative; float: left; border: 1px dotted #A1A1A1; padding: 10px; width: 410px; height: 521px; padding-left: 20px;}
#inscription label {float: left; font-size: 13px; color: #C91363; width: 228px;}
#inscription input[type=text], #inscription input[type=file], #inscription input[type=password] {float: left; border: 1px solid #C91363; width: 160px; font-size: 12px;}
#inscription select {float: left; border: 1px solid #C91363; width: 163px; font-size: 12px;}
#inscription select.min {float: left; border: 1px solid #C91363; width: 50px !important; font-size: 12px; margin-right: 6px;}
.t1 {height: 4px;}
.t2 {height: 8px;}
#inscription .mention {color: #7A7979; font-size: 10px;}
#inscription a {color: #C91363; text-decoration: none;}
#inscription a:hover {text-decoration: underline;}

#inscriptionManuel{ position: relative; padding: 20px; width: 410px; padding-left: 20px;}
#inscriptionManuel label {float: left; font-size: 13px; color: #C91363; width: 180px;}
#inscriptionManuel input[type=text], #inscriptionManuel input[type=file], #inscriptionManuel input[type=password], #inscriptionManuel textarea {float: left; border: 1px solid #C91363; width: 200px; font-size: 12px;}
#inscriptionManuel select {float: left; border: 1px solid #C91363; width: 203px; font-size: 12px;}
#inscriptionManuel input[type=submit] {float: left; border: 1px solid #C91363; width: 200px; font-size: 12px; font-weight: bold; background-color: #ffffff;}
#inscriptionManuel .t1 {height: 4px;}
#inscriptionManuel .mention {color: #7A7979; font-size: 10px;}

#confirmation label{float: left; font-size: 13px; color: #666565; width: 180px;}
#confirmation input[type=text], #confirmation input[type=file], #confirmation input[type=password] {float: left; border: 1px solid #C91363; width: 160px; font-size: 12px;}

.onglet label{float: left; font-size: 13px; color: #666565; width: 200px; text-align: left;}
.onglet input[type=text], .onglet input[type=file], .onglet input[type=password], .onglet select {float: left; border: 1px solid #C91363; width: 200px; font-size: 12px;}
.onglet select { width: 203px;}

#blocs {position: absolute; top: 1220px;}

.bloc {float: left; width: 322px; height: 302px;}
.bloc .top { height: 11px; width: 322px;}
.bloc .milieu { background: #E5F1F9 url(/themes/images/milieu-droit.png) repeat-y; width: 282px; height: 277px; padding: 10px; padding-left: 20px; padding-right: 20px; text-align: justify;}
.bloc .bottom {height: 14px; width: 322px;}

.interval {margin-left: 13px; margin-right: 13px;}

/* PORTAIL */
#box {background-color: #737272; height: 7px;}
#bar {background-color: #C91363; height: 7px;}
#blcRecherche, #blocStat, #blcNextSortie {height: 133px;}
#blcNextVoyage {min-height: 133px;}

#blocStat {width: 255px !important;margin-left: 3px;}
#blcNextSortie p, #blcNextVoyage p {margin-left: 10px;}

#contenu .milieuInt {position: relative; background: #E5F1F9 url(/themes/images/milieu-arrondi.png) repeat-y; width: 968px; padding-left: 13px; padding-right: 10px; min-height: 300px; text-align: justify;}
#contenu .milieuInt .espace {margin: 0 3px 0 3px;}

#contenu .milieuLarge {position: relative; background: #E5F1F9 url(/themes/images/milieu-arrondi.png) repeat-y; width: 860px; padding-left: 80px; padding-right: 50px; min-height: 300px; text-align: justify;}
#contenu .milieuLarge .espace {margin: 0 0 0 15px;}

.col {position: relative; float: left}
.portlet {padding: 4px; margin-bottom: 10px;}

.pointille{border: 1px dotted #A1A1A1;}
.b1 {position: relative; width: 182px; }
.b2 {position: relative; width: 260px; }
.b3 {position: relative; width: 530px; }
.b4 {position: relative; width: 220px; }
.b5 {position: relative; width: 600px; }
.b6 {position: relative; width: 170px; }
.b7 {position: relative; width: 260px; }
.b8 {position: relative; width: 550px;}
.b9 {position: relative; width: 470px; }
.b10 {position: relative; width: 435px; margin-left: 100px; margin-right: 100px;}
.b11 {position: relative; width: 400px; }
.b12 {position: relative; width: 210px; height: 85px; margin-right: 14px;}
.b12 .avatar {width: 75px !important; height: 75px !important;}
.b12 p {margin: 1px 0 3px 0 !important}
.b13 {position: relative; width: 360px;  }
.b13 p {font-size: 14px;}
.b14 {position: relative; width: 310px; }
.portlet .titre {color: #ffffff !important; font-size: 12px !important; font-weight: bold !important; height:20px; padding: 2px 0 2px 3px; background-color: #C91363; background-image: url(/themes/images/coupe.gif); background-position: right top; background-repeat: no-repeat;}
.bleu .titre {background-image: url(/themes/images/coupe_bleu.gif) !important;}
.gris .titre {background-image: url(/themes/images/coupe_gris.gif) !important;}

.portlet .titre a {color: #ffffff; text-decoration: none;}
.portlet .titreDegrade {color: #ffffff; font-weight: bold; height:20px; padding: 2px 0 2px 3px; background-color: #C91363; background-image: url(/themes/images/degrade.png); background-position: right top; background-repeat: no-repeat;}

.portlet p {margin: 0 0 2px 0;}
.portlet p a {color: #666565}
.portlet .avatar {margin-top: 3px; width:100px;}
.portlet .avatarBig {margin-top: 3px; width:150px;}
.portlet .avatarMin {margin-top: 3px; width: 60px; float: left; margin-right: 10px;}
.portlet .avatarMinb {margin-top: 3px; width: 50px; float: left; margin-right: 10px;}
.picto {float: left; margin-left: 10px; margin-top: 4px; width: 30px;}
.picto img {margin-top: 2px}

/* STATISTIQUE */
.itemStat {position: relative; width:90px; height: 32px; margin: 10px 18px 10px 18px;}
.itemStat span {display: block; position: absolute; width: 25px; text-align: center; top: 20px; left: 58px; color: #ffffff; font-size: 10px; margin: 0px; padding: 0px;}

/* AGENDA */
.itemAgenda {position: relative; width: 98px; height: 97px; margin: 10px 20px 10px 20px; padding: 5px 15px; font-size: 11px; text-align: left; background-image: url(/themes/images/cadre_agenda.png); cursor: pointer;}
.itemAgenda p {text-align: center; font-size: 18px; font-weight: bold;}

/* ONGLET PROFIL */
#listeOnglets {position: absolute; top: 12px; left: 462px; width: 165px; z-index: 10; cursor: pointer;}
.ongletLnk {color: #ffffff; font-weight: bold; padding: 5px; background: #E5F1F9 url(/themes/images/onglet-profil.png) no-repeat; width: 154px; height: 17px; margin-bottom: 30px; }

#contenu .onglet {position: relative;  }
#contenu .onglet .top {position: relative; height: 6px; width: 462px;}
#contenu .onglet .bottom {position: relative; height: 6px; width: 462px;}
#contenu .onglet .milieu {position: relative; padding-top: 10px; background: #E5F1F9 url(/themes/images/milieu-profil.png) repeat-y; width: 442px; padding-left: 10px; padding-right: 10px; min-height: 360px; }
#contenu .onglet .milieu .titre{color: #ffffff !important; font-size: 12px !important; font-weight: bold !important; height:20px; padding: 2px 0 2px 10px; background-color: #C91363; background-image: url(/themes/images/coupe.gif); background-position: right top; background-repeat: no-repeat;}


#formSearch label {position: relative; float: left; color: #7E7F81; width: 126px; text-align: left;}
#formSearch input[type=text], #formSearch select {position: relative; float: left; color: #7E7F81; width: 126px; border: 1px solid #C91363}
#formSearch select { width: 130px;}
#formSearch input[type=checkbox] { border: 1px solid #C91363}

.bouton1 {background-image: url(/themes/images/btn_videt1.png); background-repeat: no-repeat; color: #7E7F81; width: 83px; height: 21px; border: 0; padding-left:13px;}
.bouton2 {background-image: url(/themes/images/btn_videt2.png); background-repeat: no-repeat; color: #7E7F81; width: 95px; height: 21px; border: 0; padding-left:13px;}
.bouton3 {background-image: url(/themes/images/btn_videt3.png); background-repeat: no-repeat; color: #7E7F81; width: 110px; height: 21px; border: 0; padding-left:13px;}

#formSearch select.min {position: relative; float: none !important; color: #7E7F81; width: 45px !important; margin-right: 10px; border: 1px solid #C91363}
#formDesc textarea {width: 455px; border: 1px solid #C91363}
#formDesc .petit {font-size: 10px; font-style: italic; width: 455px;}
.desc {margin: 20px;}
#contenuPop { width: 500px; min-height: 330px; padding: 5px 20px 20px 20px; background-color: #ffffff;}
#contenuBigPop { width: 850px; min-height: 330px; padding: 5px 20px 20px 20px; background-color: #ffffff;}

#formPhoto label {position: relative; color: #7E7F81; width: 120px;}
#formPhoto input[type=file] {border: 1px solid #C91363; width: 200px; font-size: 12px;}

/* ABONNEMENT */
#formAbo .abo {padding: 10px;}
#formAbo .abo:hover, #formAbo .aboHover {background-color: #cccccc; color: #BB2153;}
p.titreAbo {font-size: 15px; font-weight: bold; color: #BB2153; margin:0;}
p.soustitreAbo {font-size: 12px; font-weight: normal; color: #BB2153; margin:0;}
#formAbo table {font-weight: bold; text-align: left;}
#formAbo .decal {margin-top: 10px;}

/* MESSAGERIE */
#formMessage label {position: relative; float: left; color: #7E7F81; width: 120px;}
#formMessage input[type=text], #formMessage input[type=file], #formMessage select, #formMessage textarea, #formComment textarea {position: relative; float: left; color: #7E7F81; width: 350px;}
#formMessage select{width: 354px;}
#formMessage select.min {width:50px !important; margin-right: 5px;}
#msgBoxListe {height: 150px; overflow: auto;}
#msgBoxEntete{font-weight: bold; margin:10px 0 20px 10px;}
.l1 {position: relative; float: left; width: 110px; }
.l2 {position: relative; float: left; width: 100px; }
.l3 {position: relative; float: left; width: 250px; }
.l4 {position: relative; float: left; width: 100px; }
.msgBoxItem {margin:5px 0 5px 10px; cursor: pointer;}
.msgBoxItem:hover {background-color: lightgrey;}
#msg {min-height: 200px;}

.msgSujet {font-weight: bold; font-size: 13px; width: 380px; margin:10px;}
.msgInfo {font-style: italic;width: 380px; margin:10px;}
.msgCorps {font-weight: normal; width: 380px; margin:10px;}

#activite {position: relative; width: 750px; min-height: 110px; margin-left: 40px; margin-bottom: 0px !important; margin-top: 10px;}
#activite .vsepar { position: relative; float: left; width: 1px; border-left: 1px dotted #BA0051; height: 100px; margin-left:5px; padding-left: 5px;}

#formDetSearch label{float: left; font-size: 13px; color: #666565; width: 200px; text-align: left; margin-left: 10px;}
#formDetSearch input[type=text], .onglet input[type=file], .onglet input[type=password], .onglet select {float: left; border: 1px solid #C91363; width: 200px; font-size: 12px;}
#formDetSearch select { width: 203px;}

/* SORTIE */
.bleu {background-color: #D9E9F6}
.gris {background-color: #BFBEBE; color: #FCFAFA}
#formSortie label{float: left; font-size: 13px; color: #818080; width: 170px; text-align: left; margin-left: 10px;}
#formSortie select { float: left; border: 1px solid #C91363; width: 200px; font-size: 12px;}
#formSortie input[type=text] {border: 1px solid #C91363; font-size: 12px;}

#formNewSortie label {float: left; font-size: 13px; color: #818080; width: 180px; text-align: left; margin-left: 30px;}
#formNewSortie input[type=text], #formNewSortie input[type=file], #formNewSortie select, #formNewSortie textarea {float: left; border: 1px solid #C91363; width: 350px; font-size: 12px;}
#formNewSortie select{width: 354px;}
#formNewSortie select.min {width:50px !important; margin-right: 5px;}


.blocSortie {margin: 0 10px 10px 20px; border-bottom: 1px dotted #BA0051; padding: 0 0 10px 0;}
.blocSortie .vign {float: left; margin: 0 10px 0 0;}
.blocSortie .titreSortie {font-weight: normal; font-size: 17px;}
.blocComment {border-bottom: 1px dotted #cccccc; padding: 10px;}
/* VOYAGE */
.bleu {background-color: #D9E9F6}
.gris {background-color: #BFBEBE; color: #FCFAFA}
#formVoyage label{float: left; font-size: 13px; color: #818080; width: 70px; text-align: left; margin-left: 10px;}
#formVoyage select { float: left; border: 1px solid #C91363; width: 200px; font-size: 12px;}
#formVoyage input[type=text] {border: 1px solid #C91363; font-size: 12px;}
.blocVoyage {margin: 0 10px 10px 20px; border-bottom: 1px dotted #BA0051; padding: 0 0 10px 0;}
.blocVoyage .vign {float: left; margin: 0 10px 0 0;}
.blocVoyage .titreVoyage {font-weight: normal; font-size: 17px;}
.infoVoyage {font-size: 14px; color: #686767; margin-top: 10px !important;}
.ongletVoyage {cursor: pointer; font-size: 11px; width: 85px; height: 19px; padding-top: 12px; margin-right: 12px; float: left; text-align: center; background-image: url(/themes/images/onglet-voyage.png); text-decoration: none;}
#sejour, #hebgt, #activ, #particip, #tarif, #reserv {min-height: 400px; padding: 20px;}


#footer .top {position: relative; height: 27px; width: 992px;}
#footer .bottom {position: relative; height: 27px; width: 992px;}
#footer .milieu {position: relative; background: #E5F1F9 url(/themes/images/milieu-arrondi.png) repeat-y; width: 938px; padding-left: 30px; padding-right: 24px; }
#footer .bloc{ float: left; width: 310px; height: auto !important}
#footer .espace {border-left: 1px solid #ABABAB; padding-left: 20px; width: 290px !important;}
#footer a {color: #6E6D6D; font-size: 12px;}

#contenu .top {position: relative; height: 27px; width: 992px;}
#contenu .bottom {position: relative; height: 27px; width: 992px;}
#contenu .milieu {position: relative; background: #E5F1F9 url(/themes/images/milieu-arrondi.png) repeat-y; width: 938px; padding-left: 30px; padding-right: 24px; min-height: 300px; text-align: justify;}
#contenu .milieu .titre {font-size: 18px; font-weight: bold; color:#C91363; margin-bottom: 20px;}

/* MENU */
#menu {position: relative; border-top: 1px solid #BA0051; border-bottom: 1px solid #BA0051; background-color: #A0C1D9; height: 25px; padding: 5px; padding-left: 17px;}

/* VALIDATION */
.validation-advice {display: block; color: red; fon-weiht: bold; text-align: right;}
.validation-failed {background-color: red; color: #000000 !important;}

/* POP UP DIV */
#popup_div { border: 1px solid #000000; z-index: 1002; background: #D0E5F4 url(/themes/images/fond.png) repeat center; }
#popup_div handle { cursor: move }
#popup_div_mask { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1001; background-color :#000000; -moz-opacity: 0.5; opacity: 0.5; filter: alpha(opacity=50) }
#popup_div .lien {color: #0560A7; font-size: 12px; text-decoration: none;}
#popup_div .lien:hover {text-decoration: underline;}

/* Autocompletion */ 
.update{position:absolute; width:250px; background-color:white; border:1px solid #888; margin:0px; padding:0px; z-index: 10;}

ul.elts { list-style-type: none; margin:0px; padding:0px; text-align: left;} 
ul.elts li.selected { background-color: #ffb; cursor: pointer; } 
li.elt { list-style-type: none; display:block; margin:0; padding:2px; height:20px; }

.left {float: left}
.right {float: right}