@charset "utf-8"; 
/* Site sankyogo.com (c) 2008 FFh Lab / Eric Lequien, pour discipline Sankyôgô (c) 2007, Thierry Noens */

/* no border & scroll if in iframe, 	
   no border & scroll if in object,
   height solves IE5-Mac bug on vertical CSS centering */
html {margin: 0; height: 100%}
body {margin: 10px 10px 0 10px; border: none}
html, body {overflow-x: hidden; overflow-y: auto; padding:0}

a:link, a:visited {color: #9F9F9F}
/* a:hover, a:active, a:focus {font-weight: bold} */
a:hover {border: 0; position: relative; z-index: 500}

hr {margin: 0; height: 1px} 

.lnk, .lnk_over {color: #226AFF; text-decoration: underline; cursor: pointer} /* will require onclick() for the action to take */
.lnk_over {font-variant: small-caps} /* will be applied on MouseOver event using a ChangeClass() */

.r {color: #FF3939}
.g {color: #86C348}
.b {color: #337BFF}
.grey {color: #9F9F9F}					  

.fr, .en {visibility: hidden; display: none} /* visibilit gre ultrieurement via specific.js/SwitchLang() */

.nb {font-size: 8pt; color: #6F6F6F}
.small .small_cap {font-size: 8pt}
.small_cap {font-variant: small-caps}
.exposant {vertical-align: super; font-size: 7pt}

.xxl {width: 72%} /* will indicate several larger for horizontal menu bar depending of its left origine */
.xl {width: 68%}

.spacer {clear: both; visibility: hidden}

#header {height: 484px; width: 100%; z-index: 10; padding: 10px; font-family: Arial, Helvetica, Verdana, Sans-Serif}
div#header h1 {margin: 0; display: inline; visibility: hidden}  
div#header h2 {margin: 0; visibility: hidden}	  

div#header span#ctc-id-IE567 {float: right; margin-top: -35px; clear: both}
div#header span#ctc-id {float: right; cursor: pointer; width: 180px; text-align: right; margin: 0 50px 0 0}
div#header span#ctc-id p {margin: 0 0 10px 0; text-align: right; font-size: 9pt}  
div#header span#ctc-id p#thierry-id {margin: 40px 0 10px 0; color: #9F9F9F}  
div#header span#ctc-id p#thierry-id img {margin: 0 0 0 8px; padding: 0; border: 1px #9F9F9F}
div#header span#ctc-id p#thierry-id u {position: relative; top: 10px}
div#header span#ctc-id p a:link, div#header span p a:visited {font-size: 10pt}  

div#header div#en-part {position: absolute; top: 48px}


#menu {position: absolute; top: 215px; left: 240px; z-index: 150; display: table; background: #9F9F9F; height: 27px; font-family: Arial, Helvetica, Verdana, Sans-Serif}
div#menu img#go-home {margin: 0 10px 0 0}
div#menu ul {display: table-cell; vertical-align: middle; list-style: none; padding: 5px; margin: 0; width: 100%}
div#menu li {float: left; font-size: 10pt; text-align: center}

div#menu li#curr span {border-left: 5px solid #86C348; position: relative; top: 5px}
div#menu li#curr span span {border-left: 6px solid #FF3939}
div#menu li#curr span span span {border-left: 8px solid #337BFF; border-right: double #C0C0C0; background-color: #FCFCFC; color: #7D7D7D; font-size: 11pt}

div#menu a {text-decoration: none}
div#menu a:link, div#menu a:visited {color: #FFFFFF}
div#menu a:hover, div#menu a:active, div#menu a:focus {font-weight: bold}
div#menu a:hover {border: 0; position: relative; z-index: 500}

div#menu a em {display: none; font-weight: normal; font-style: normal; color: #000000; background-color: #FFFFCC; position: absolute; top: 22px; left: -4px; padding: 5px; border: 1px solid #BBBBBB; width: 170px}
div#menu a:hover em {display: block; font-family: sans-serif}
div#menu a:hover em span {position: absolute; top: -7px; left: 15px; height: 7px; width: 11px; background: transparent url(img/symbulle.gif) no-repeat; margin:0; padding: 0; border: 0}

div#menu li#lang {float: right; font-size: 9pt; font-weight: bold; color: #FFFFFF}
div#menu li#lang a.on {color: #000000; cursor: pointer}
div#menu li#lang a.off {color: #C0C0C0; cursor: pointer}

#content {position: relative; top: -260px; width: 98%; margin: 0; font: 9pt Georgia, Times New Roman; text-align: justify}
div#content h5 {font-size: 12pt; color: #9F9F9F; font-weight: bold; margin: 0; text-align: center; letter-spacing: 0; font-variant: small-caps}
.cleft {float: left; margin: 250px 0 0 0; padding: 0; width: 198px; text-align: justify}	

.cleft #rss_encart img {margin: 1px 0 0 0; padding: 0}
.cleft #rss_encart {font-size: 8pt; font-variant: small-caps; color: #999999; 
							position: relative; top: -30px; text-align: center; vertical-align: middle}

.cright {-float: right; margin-left: 180px !important; margin: 0; padding: 20px; width: auto; text-align: justify; color: #333333; font-size: 11pt} /* bidouille float/margin-left pour que positionnement soir ok ds IE6/IE7/Firefox/Opera/Safari en 800x600 */

.cright h5 {font: 12pt Verdana, Sans-Serif; font-weight: bold; margin: 0; padding: 0 0 20px 0; font-variant: small-caps}
.cright img#ani {margin: 0 0 0 10px}

img.rounded {background: url(img/anim_intro_frm.gif) no-repeat; border: none; padding: 6px}

img.thumbright {border: none; margin: -3px 0 0 10px; float: right}
img.thumbleft {border: none; margin: -3px 10px 0 0; float: left}

img.tl, img.tr, img.bl, img.br {border: 1px outset #FF7606; padding: 3px; width: 37%}
img.tl {margin: 2px 15px 3px 3px; float: left}
img.tr {margin: 2px 3px 3px 15px; float: right}
img.bl {margin: 3px 15px 2px 3px; float: left}
img.br {margin: 3px 3px 2px 15px; float: right}

.encart .top div, .encart .top, .encart .bottom div, .encart .bottom {width: 100%; height: 20px; font-size: 1px}
.encart .mid, .encart .bottom {margin-top: -19px}
.encart .mid {padding: 0 20px}
.encart .mid {_overflow: visible; _zoom: 1; _padding-top: 20px} /* to solve the italic bug in IE5.5/6 ; ce hack ne drange pas IE7 */

.encart#main {zoom: 1; position: relative; height: 1%} /* to solve the peek-a-boo bug in IE6/7 */
.encart#main {background: url(img/mainencart_tl.png) no-repeat top left}
.encart#main .top {background: url(img/mainencart_tr.png) no-repeat top right}
.encart#main .bottom {background: url(img/mainencart_bl.png) no-repeat bottom left}
.encart#main .bottom div {background: url(img/mainencart_br.png) no-repeat bottom right}
.encart#main .mid {background: url(img/mainencart_r.png) top right repeat-y}


#footer {position: relative; clear: both; margin: 20px 10px 0 0; padding: 0; top: -250px}
div#footer p {margin: 0 5px 0 10px; color: #858585; font: 9pt monospace; font-variant: small-caps; text-align: right}
div#footer p font {font-size: 11pt}


#qui {position: absolute; top: 110px; left: 195px; width: 80%; z-index: 700; font-family: Dotum; color: #FFFFFF; visibility: hidden; display: none}
div#qui h5 {font-size: 16pt; font-weight: bold; text-align: center; font: small-caps; margin: 19px}
div#qui div#bandeau {height: 844px; float: left; overflow: scroll; overflow-x: visible; margin: 0 15px 0 0}
div#qui div#bandeau img {margin: 0 20px 0 0; padding: 0; border: 1px #9F9F9F}
div#qui img#qui_close {float: right; margin: -50px -10px 0 0}
div#qui ul {list-style: none; padding-left: -15px; margin: 30px 10px 0 0; font-size: 12pt; font-weight: bold; text-align: right}
div#qui li {list-style: none; margin: 10px 0 0 0; font-size: 11pt; text-align: justify}

.encart#qui .top div {background: url(img/quiencart_tl.gif) no-repeat top left}
.encart#qui .top {background: url(img/quiencart_tr.gif) no-repeat top right}
.encart#qui .bottom div {background: url(img/quiencart_bl.gif) no-repeat bottom left}
.encart#qui .bottom {background: url(img/quiencart_br.gif) no-repeat bottom right}
.encart#qui .mid {background-color: #414141}
.encart#qui .mid, .encart#qui .bottom {margin-top: -19px; margin-bottom: 19px}
.encart#qui .top div p, .encart#qui .bottom div p {background-color: #414141; margin: 0 19px 0 19px; padding: 0; width: auto; height: 20px}	 

/* ***TODO : fusionner la partie commune  #qui et ne laisser que la diffrenciation ici : */
#enfants {position: absolute; top: 160px; left: 145px; width: 80%; z-index: 700; font-family: Dotum; color: #FFFFFF; font-size: 10pt; visibility: hidden; display: none}
div#enfants h5 {font-size: 14pt; font-weight: bold; text-align: center; font: small-caps; margin: 19px}
div#enfants div#bandeau {float: left; margin: 0 0 0 0}
div#enfants div#bandeau img {margin: 0 20px 0 0; padding: 0; border: 1px #9F9F9F}
div#enfants img#enfants_close {float: right; margin: -50px -10px 0 0}

.encart#enfants .top div {background: url(img/quiencart_tl.gif) no-repeat top left}
.encart#enfants .top {background: url(img/quiencart_tr.gif) no-repeat top right}
.encart#enfants .mid {background-color: #414141}
.encart#enfants .mid, .encart#qui .bottom {margin-top: -19px; margin-bottom: 19px}
.encart#enfants .top div p, .encart#qui .bottom div p {background-color: #414141; margin: 0 19px 0 19px; padding: 0; width: auto; height: 20px}