/*------ css reset -----*/
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,font,img,ins,kbd,q,s,samp, small,strike,strong,sub,sup,tt,var, dl,dt,dd,ol,ul,li, fieldset,form,label,legend, table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline; }
:focus{outline:0;}
body{line-height:1;color:black;background:white;}
ol,ul{list-style:none;}
table{border-collapse:separate;border-spacing:0;}
caption,th,td{text-align:left;font-weight:normal;}
blockquote:before,blockquote:after, q:before,q:after{content:"";}
blockquote,q{quotes:"" "";}
/*------ general -----*/
html,body{height:100%;}
html{overflow-y:scroll;}
body{font:normal 0.9em Arial,Geneva,sans-serif;background-color:#FFF;text-align:center;margin:0;padding:0;}
a{text-decoration:none;}
a:hover{text-decoration:underline}
.message{width:50%; margin:2em auto; padding:1em 1em 1em 30px}
.msgerreur{background:#fff6bf url(../img/icon_exclamation.png) center no-repeat;background-position:15px 50%; text-align:left;padding:10px 20px 10px 45px;border-top:2px solid #e86857;border-bottom:2px solid #e86857;}
.msgok{background:#fff6bf url(../img/icon_accept.png) center no-repeat;background-position:15px 50%; text-align:left;padding:10px 20px 10px 45px;border-top:2px solid #71b85a;border-bottom:2px solid #71b85a;}
/* ----- wrapper (sticky footer) -----*/
#wrapper{min-height:100%;height:auto !important;height:100%;margin:0 auto -4em;background:#FFF}
/* ----- header -----*/
#header{height:136px;background:#336 url('../img/background.gif') repeat top left;}
#header h1{position:absolute;top:0;left:50%;margin-left:-490px;height:136px;width:360px;}
#header h1 a{display:block;position:absolute;top:0;left:50%;height:136px;margin-left:-190px;width:360px;background:transparent url('../img/logo.png') no-repeat top left;}
#header h1 a span{display:none;}
#menu{position:absolute;top:10px;left:50%;width:490px;text-align:right;}
#menu ul{float:right;list-style:none; margin-top:30px}
#menu li{float:left;}
#menu a{display:block;margin-left:15px;padding:0 1em;font:bold 1.2em Arial,Geneva,sans-serif;color:#FFF; border-bottom:4px solid #F33}
#menu a:hover{text-decoration:none;color:#FF0; border-bottom:4px solid #FFF}
#formrecherche {}
#formrecherche label{font:normal 0.8em Arial,Geneva,sans-serif; color:#DDD;}
#motclef:focus{background:#FEF;}
#recherche {background-color: #99c; color:#FFF; width:2em;}
#recherche:hover {background-color: #F0F; }
/* ----- main layout-----*/
#main{width:960px;padding:20px 0;margin:0 auto; overflow:hidden; text-align:left;background:#FFF}
#main h1{font:bold 1.5em Arial,Geneva,sans-serif;margin:0 20px 20px 20px;padding:5px 15px;border-bottom:3px solid #336;color:#336}
#main h2{font:bold 1em Arial,Geneva,sans-serif;margin:0 20px 20px 50px;padding:2px 10px;border-bottom:2px solid #c9F;color:#93F;}
#main h3{font:bold 1.2em Arial,Geneva,sans-serif;margin:0 20px 20px 0px;padding:2px 10px;border-bottom:2px solid #c9F;color:red;}
#main ul {margin-left:100px; margin-bottom:20px;list-style:disc}
#main p {font:normal 1.2em "times new roman", Times,serif;color:#333;margin:1em 50px; text-align:justify; line-height:1.5em}
#main iframe {margin-right:10px;}
#boite {width:100%; overflow:hidden;}
#col1, #col2 {width:50%; float:left; background:#FFF}
/*------ menu lateral -----*/
#principal {float:left;width:720px}
#principal p a {font:normal 0.9em "times new roman", Times,serif;color:#F00; margin-right:1em;}
#menulateral {background:#f5f5dc; border:1px solid #336;float:left; width:200px;margin-left:20px}
#menulateral h1{font:bold 1em Arial,Geneva,sans-serif;margin:0 0 20px 0;padding:5px 15px;border-bottom:3px solid #336;color:#336}
#menulateral h2{font:bold 1em Arial,Geneva,sans-serif;margin:0 20px 20px 20px;padding:2px 10px;border-bottom:2px solid #c9F;color:#93F;}
#menulateral ul {margin-left:60px; margin-bottom:20px;list-style:disc}
#pubgoogle {width:120px;margin:0 auto;}
#pubamazon {width:120px;margin:0 auto;}
.navigation {background:#f5f5dc;padding:2px; overflow:hidden}
.navigation a {display:block; font:normal 0.8em Arial,Geneva,sans-serif;width:2em; border:1px solid #336; float:left; margin:2px; text-align:center; text-decoration:none}
.navigation a:hover {background:#93f; color:#FFF; text-decoration:none}
.navigation b {display:block; float:left; margin:2px; }
.navigation .actif {background:#336;color:#FFF}
/*------ formulaire-----*/
#formcontact{margin:2em auto 0 auto;width:550px; text-align:right}
#formcontact label{width:200px;float:left;display:block;text-align:right;padding-right:1em;}
#formcontact input,#formcontact textarea{width:300px;background:#e6e3d7;height:1.5em;margin-bottom:1em}
#formcontact textarea{height:7em;margin-bottom:2em}
#formcontact input:focus,#formcontact textarea:focus{background:#FFF;}
/* ----- footer -----*/
#footer,#push{height:4em;line-height:4em;font:normal 1em Arial,Geneva,sans-serif;}
#footer p{font:normal 0.75em Arial,Geneva,sans-serif;padding-top:0.5em;border-top:1px solid #d6c6c6}
#footer a{font:normal 1em Arial,Geneva,sans-serif;color:#FFF}
#footer{background:#FFF url('../img/background.gif') repeat top left;color:#FFF}