html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.clear {display:block; clear:both;}
a:hover, button:hover, button:focus {cursor: pointer;}

body {font-family:arial;font-size:12px;background: #000;}
#container { position: relative; display: block; width: 1024px; height: 748px; margin: 0 auto; border-top: 20px solid #000; background: #F3F3F3; }
#id3 #container, #id4 #container , #id5 #container , #id6 #container , #id93 #container  {  height:100%;  }
header {position: relative; display: block; width: 1024px; height: 144px;}
header hgroup { display: none; }
header nav { position: absolute; display: block; left: 0; bottom: 0; width: 100%; height: 48px; }
header nav ul li a { display: block; float: left; width: 162px; height: 24px; padding: 24px 0 0 0;  margin-left: 7px; text-align: center; background: url(../images/sprite.png) -10px -70px no-repeat; font-weight: bold; color: #666; text-decoration: none;}
header nav ul li.active a, header nav ul li a:hover { background: url(../images/sprite.png) -260px -70px no-repeat; color: #333; }
header aside { position: absolute; display: block; top: -16px; right: 0px; width: auto; height: 20px; }
header aside a { text-decoration: none; padding-left: 20px; background: url(../images/sprite.png) -20px -348px no-repeat; color: #fff; }
header aside a:hover { color: #59BFE8; }
footer {position: absolute; left: 0; bottom: 8px; display: block; }
footer p { display: block; width: 1014px; text-align: right; padding-right: 10px; font-size:10px; color: #999;}
footer p a {  text-decoration: none; color: #999;}
footer p a:hover {text-decoration: underline;}

#content { padding: 60px 18px 0 18px; }

#dashboard div {display: block;  clear: both; border-top: 1px solid #999; border-bottom: 1px solid #999; padding: 32px 0;  }
#dashboard h3 {  display: block; float: right; width: 163px; height: 24px; border: none; background: url(../images/sprite.png) 0 0 no-repeat; color: #59BFE8; font-size: 12px; text-align: center; padding-top: 10px; margin-bottom: 30px; }

#listEtangs li a { position: relative; display: block; float: left; width: 116px; height: 24px; margin-right: 8px; padding-top: 10px; text-align: center; background: url(../images/sprite.png) -150px -200px no-repeat; text-decoration: none; color: #333;}
#listEtangs li.last a {margin-right:0; }
#listEtangs li.active a, #listEtangs li a:hover { background: url(../images/sprite.png) 0 -200px no-repeat; color: #59BFE8; }

#sliderEtangsContainer { position: relative; display: block; width: 986px; height: /*492px*/ 2400px;  overflow: hidden; margin-top: 20px; border-top: 1px solid #999; }
#sliderEtangsContainer #sliderEtangs {  position: absolute; display: block; top: 0; left: 0; width: 100000px; /*height: 455px;*/  }
#sliderEtangsContainer .etang { position: relative; display: block;  width: 986px; /*height: 455px;*/ float: left; overflow:hidden; padding-top: 32px;}
#sliderEtangsContainer .listePontons { position: absolute; left: 0;display: block; width: 100000px; /*height: 455px;*/ }
.sliderPontonContainer {position:relative;  display: block; width: 880px; height: /*455px*/ 2400px;  overflow:hidden; }
#sliderEtangsContainer .ponton { display: block; width: 62px; height :100%;  float: left; border-left: 1px solid #d0d0d0; }
#sliderEtangsContainer .ponton h4 { display: block; width: 61px;height:38px; text-align: center; font-size: 10px; font-weight: bold; color: #59BFE8; text-transform: uppercase; padding-top: 0;  }
#sliderEtangsContainer .ponton.listeMois { padding-top: 38px; width: 105px; border-left: 0;}
#sliderEtangsContainer .ponton.listeMois h5 { display: block; width: 100px; height:22px; text-align: left; font-weight: bold; color: #333; text-transform: uppercase; padding-top:13px; margin-bottom: 8px; background: url(../images/sprite.png) 0 -250px no-repeat; padding-left:5px; font-size:10px;  }
.navPonton { position: absolute; top: 10px; font-size: 11px; color: #999; }
.prevPonton { left: 0; padding-left: 20px; background: url(../images/sprite.png) 0 -395px no-repeat; }
.nextPonton { right: 0; padding-right: 20px; background: url(../images/sprite.png) 78px -445px no-repeat; }
.navPonton:hover { color: #444; }
.datesMois { position: relative; display: block; clear: both; width: 58px; height :31px;  padding:2px; margin-bottom: 8px; background: url(../images/sprite.png) -10px -250px no-repeat;  }
.datesMois a {/** position: relative;  **/display: block; width: 54px; height:27px; background: #fff; border: 1px solid #999; float: left; font-size: 9px; text-align: center; margin:1px 0 0 1px; overflow:hidden;}
.datesMois a:hover { background: #fff; }
.datesMois a span { display: none; position: absolute; top: 22px; left: 0;width: 145px; background: #fff; z-index:52; padding: 5px; border: 1px solid #444; z-index: 90; font-size: 9px; }
.datesMois a:hover span { display: block; }
.datesMois p { text-align: center; color :#666; padding-top: 2px; line-height: 16px; }
.datesMois p strong { font-weight: bold; color: #dc0c0c;}
.datesMois p strong.green { color: #5fa203;}
#legend { position: absolute;  right: 0; bottom: 25px; display: none; width: 300px; height: 22px; }
#legend li { display: block; width: 100px; float: left; font-size: 13px; color: #666; padding-rop: 4px;}
#legend li a { display: block;  float: left; width: 20px; height : 20px; background: #BFBFBF; border: 1px solid #999; margin: -4px 4px 0 0; }
/**.datesMois a.option, #legend li a.option {background:#FFA022; border: 1px solid #BC7B20;}**/
.datesMois a.option, .datesMois a.option:hover, #legend li a.option { background: #F4A460;}
.datesMois a.option span , .datesMois a.option:hover, #legend li a.option span { opacity: 1; background: #fff; }
.datesMois a.reserve, #legend li a.reserve {background:#FF401A; border: 1px solid #B2391D;}


#popup , #popupOK { position: fixed; display: none; top:50%; left: 50%; margin: -232px 0 0 -296px;  width: 592px; height: 464px; background: url(../images/background-popup.png) repeat; }
#popup div#main { position: relative; display: block; width: 552px; height: 412px; padding: 16px 20px; }
#popup div#main a#close , #closeOK { position: absolute; top: 10px; right: 10px; display: block; width: 10px; height: 10px; background: url(../images/sprite.png) 0 -350px no-repeat; }
#popup div#main a#close:hover, #closeOK:hover{ background: url(../images/sprite.png) -20px -350px no-repeat; }
#popup div#main h3, #popupOK h3 { font-weight: bold; color: #59BFE8; font-size: 13px; text-transform: uppercase; padding-bottom: 16px;}
#popup div#main .popInfos { position: relative; padding: 16px 0;border-top: 1px solid #666; }
.popInfos {font-size: 13px; color: #ccc; line-height: 24px;}
.dateReservation { display: block; width: 218px; height: 75px; float: left; text-transform: uppercase; color: #ccc; font-size: 13px; }
.dateReservation input , .popInfos input.long, .popInfos textarea { display: block; width: 122px; height: 32px; margin: 0; padding: 0; border: 1px solid #666; background: #ccc; color:#666; font-size: 13px; padding: 0 10px;}
.popInfos input.long { width: 340px; }
.popInfos textarea { width: 534px; height: 108px; resize: none;  margin-top: 15px;}
#popup .cgv { color:#ccc; margin-top: 10px; }
#popup button { display: block; float: right; width: 116px; height: 34px; border: 0; background: url(../images/sprite.png) 0 -200px no-repeat; color:#59BFE8; font-size:14px; font-weight: bold; text-transform: uppercase; }
#popup button:hover, #popup button:focus { color:#000; background: url(../images/sprite.png) -150px -200px no-repeat; }
#popup aside {position: absolute; top: 16px; right: 0; text-transform: uppercase;}
#popupOK { display: block; width: 300px; height: 50px; margin: -25px 0 0 -150px; border: 1px solid #59BFE8;}
#popupOK h3 { display: block; width: 300px; text-align: center; padding-top: 18px; }

#popupEdit { position: fixed; display: none; top:50%; left: 50%; margin: -232px 0 0 -296px;  width: 592px; height: 464px; background: url(../images/background-popup.png) repeat; }
#popupEdit div#mainEdit { position: relative; display: block; width: 552px; height: 412px; padding: 16px 20px; }
#popupEdit div#mainEdit a#closeEdit , #closeEditOK { position: absolute; top: 10px; right: 10px; display: block; width: 10px; height: 10px; background: url(../images/sprite.png) 0 -350px no-repeat; }
#popupEdit div#mainEdit a#closeEdit:hover, #closeEditOK:hover{ background: url(../images/sprite.png) -20px -350px no-repeat; }
#popupEdit div#mainEdit h3, #popupEditOK h3 { font-weight: bold; color: #59BFE8; font-size: 13px; text-transform: uppercase; padding-bottom: 16px;}
#popupEdit div#mainEdit .popInfos { position: relative; padding: 16px 0;border-top: 1px solid #666; }
#popupEdit .cgv { color:#ccc; margin-top: 10px; }
#popupEdit button { display: block; float: right; width: 116px; height: 34px; border: 0; background: url(../images/sprite.png) 0 -200px no-repeat; color:#59BFE8; font-size:14px; font-weight: bold; text-transform: uppercase; }
#popupEdit button:hover, #popup button:focus { color:#000; background: url(../images/sprite.png) -150px -200px no-repeat; }
#popupEdit aside {position: absolute; top: 16px; right: 0; text-transform: uppercase;}


/** page de contact **/
#id7 #left {position: relative; display: block; width:560px;float: left; }
#id7 #left article {position: relative; display: block; width:280px; height: 90px; float:left; margin-bottom: 30px; color: #666; }
#id7 #left article img { float: left; margin-right: 10px; }
#id7 #left article h4 { margin-top: 22px; font-weight: bold; font-size: 13px;}
#id7 #left article h5{ font-size: 13px; margin: 10px 0; }

#id7 form { display: block; width: 360px; margin-top: 60px; float: right;  }
#id7 form h3 { text-transform: uppercase; color: #59BFE8;  }
#id7 form p {display: block; color:#666; padding: 5px 0; font-size: 11px; }
#id7 form label { display: block; width: 358px; margin: 10px 0;}
#id7 form label input { display: block; width: 358px; height: 35px; border: 1px solid #666; background: #ccc;}
#id7 form label textarea { display: block; width: 358px; height: 174px; border: 1px solid #666; background: #ccc;}
#id7 form button { display: block; float: right; border:0; width: 116px; height: 36px; margin:0; padding: 0px; text-align: center; background: url(../images/sprite.png) 0px -200px no-repeat;  font-weight: bold; font-size: 14px; color: #59BFE8; }
#id7 form button:focus, #id7 form button:hover { background: url(../images/sprite.png) -150px -200px no-repeat; color: #000; }
/** home page **/
#id1 #content { padding: 80px 0 0 206px !important; }
#id1 #content #presentation { position: relative; display: block; width: 342px; float: left; border-right: 1px solid #999; padding-right: 24px; margin-right: 18px; }
#id1 #content #presentation h3 { font-size: 14px; font-weight: bold; line-height: 29px; text-transform: uppercase; }
#id1 #content #presentation p, #home-fade p{ font-size: 12px; line-height: 22px; color: #666; }
#id1 #content label.loginRemembermeLabel { display: block; width: 214px; height: 32px;padding: 0 0 0 10px; margin-top: 18px; background: none; font-size: 12px;  }
#id1 #content input { display: block; width: 214px; height: 32px; border: 1px solid #666; padding: 0 0 0 10px; margin-top: 18px; background: #ccc; font-size: 12px; }
#id1 #content label.loginRemembermeLabel input { float: right;width: 20px;margin: 0;padding: 0;margin-top:-12px; }
#id1 #content button { display: block; width: 163px; height: 34px; border: none; background: url(../images/sprite.png) 0 0 no-repeat; color: #59BFE8; font-size: 12px; }
#id1 #content button:hover { background: url(../images/sprite.png) -180px 0 no-repeat; color: #000; }
#home-fade { position: relative; display: block; float: left; width:  225px; height:220px; margin: 0;}
.lgnForgotLink {display: block; display: block; width: 224px; text-align: right; margin: 8px 0; font-size: 11px; font-style: italic; color: #999; }
.lgnForgotLink:hover { text-decoration: underline; }
#home-login, #home-forgot {position:absolute; top:0; left: 0; display: block; width:  225px; height:220px; }
#home-fade #home-forgot {display:none;}
#home-fade .forgot #home-forgot {display:block;}
#home-fade .forgot #home-login {display:none;}
#home-fade p {line-height:16px;}
/** end of home page **/

#selectionAnnee {position: absolute; display: block; top: 150px; right: 20px; color: #666; font-weight: bold; padding: 10px; background: #BFBFBF; border: 1px solid #999; }
#selectionAnnee select { background: #fff; border: 1px solid #59BFE8; } 

.disableBrie .e17_p72, .disableBrie .e17_p71 h4 span { display: none !important; }

/* admin */
.user10, .user15 {background:#fed100 !important;}
/* Fisherman */
.user12 {background:#fea100 !important;}
/* Anglinglines */
.user14 {background:#00bf12 !important;}
/* La Horre */
.user6, .user11 {background:#000 !important; color:#fff !important;}
/* FS */
.user13 {background:#5395d8 !important;}

.close {background:red !important;}

#close_swim_label {display: none;}

#id6 #listEtangs li a { position: relative; display: block; float: left; width: 116px; height: 24px; margin-right: 8px; padding-top: 10px; text-align: center; background: url(../images/sprite.png) -150px -200px no-repeat; text-decoration: none; color: #333;}
#id6 #listEtangs li.last a {margin-right:0; }
#id6 #listEtangs li.active a, #id6 #listEtangs li a:hover { background: url(../images/sprite.png) 0 -200px no-repeat; color: #59BFE8; }

#id6 #sliderEtangsContainer { position: relative; display: block; width: 986px; height: 492px;  overflow: hidden; margin-top: 20px; border-top: 1px solid #999; }
#id6 #sliderEtangsContainer #sliderEtangs {  position: absolute; display: block; top: 0; left: 0; width: 100000px; height: 455px;  }
#id6 #sliderEtangsContainer .etang { position: relative; display: block;  width: 986px; height: 455px; float: left; overflow:hidden; padding-top: 32px;}
#id6 #sliderEtangsContainer .listePontons { position: absolute; left: 0;display: block; width: 100000px; height: 455px; }
#id6 .sliderPontonContainer {position:relative;  display: block; width: 790px; height: 455px;  overflow:hidden; }
#id6 #sliderEtangsContainer .ponton { display: block; width: 157px; height :100%;  float: left; border-left: 1px solid #d0d0d0; }
#id6 #sliderEtangsContainer .ponton h4 { display: block; width: 156px;height :26px; text-align: center; font-size: 12px; font-weight: bold; color: #59BFE8; text-transform: uppercase; padding-top: 12px;  }
#id6 #sliderEtangsContainer .ponton.listeMois { padding-top: 38px; width: 196px; border-left: 0;}
#id6 #sliderEtangsContainer .ponton.listeMois h5 { display: block; height :23px; text-align: center; font-weight: bold; color: #333; text-transform: uppercase; padding-top: 12px; margin-bottom: 18px; background: url(../images/sprite.png) 0 -250px no-repeat;  }
#id6 .navPonton { position: absolute; top: 10px; font-size: 11px; color: #999; }
#id6 .prevPonton { left: 0; padding-left: 20px; background: url(../images/sprite.png) 0 -395px no-repeat; }
#id6 .nextPonton { right: 0; padding-right: 20px; background: url(../images/sprite.png) 78px -445px no-repeat; }
#id6 .navPonton:hover { color: #444; }
#id6 .datesMois { position: relative; display: block; clear: both; width: 147px; height :31px;  padding-left: 10px; margin-bottom: 18px; background: url(../images/sprite.png) -10px -250px no-repeat;  }
#id6 .datesMois a {/** position: relative;  **/display: block; width: 20px; height : 14px; background: #BFBFBF; border: 1px solid #999; float: left; font-size: 10px; margin: 7px 6px 0 0; text-align: center; padding-top: 6px; }
#id6 .datesMois a:hover { background: #fff; }
#id6 .datesMois a span { display: none; position: absolute; top: 22px; left: 0;width: 145px; background: #fff; z-index:52; padding: 5px; border: 1px solid #444; z-index: 90; font-size: 9px; }
#id6 .datesMois a:hover span { display: block; }
#id6 .datesMois p { text-align: center; color :#666; padding-top: 2px; line-height: 16px; }
#id6 .datesMois p strong { font-weight: bold; color: #dc0c0c;}
#id6 .datesMois p strong.green { color: #5fa203;}
#id6 #legend { position: absolute;  right: 0; bottom: 25px; display: block; width: 300px; height: 22px; }
#id6 #legend li { display: block; width: 100px; float: left; font-size: 13px; color: #666; padding-rop: 4px;}
#id6 #legend li a { display: block;  float: left; width: 20px; height : 20px; background: #BFBFBF; border: 1px solid #999; margin: -4px 4px 0 0; }
#id6 .datesMois a.option, #id6 .datesMois a.option:hover, #id6 #legend li a.option { background: #F4A460;}
#id6 .datesMois a.option span , #id6 .datesMois a.option:hover, #id6 #legend li a.option span { opacity: 1; background: #fff; }
#id6 .datesMois a.reserve, #id6 #legend li a.reserve {background:#FF401A; border: 1px solid #B2391D;}