body { background: #105080 url(../img/bodybg.jpg) repeat-x fixed top center; font: 11px "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif; margin: 0; padding: 0; text-align: center; }
#container { margin: auto; padding-bottom: 20px; width: 800px; }

/* basic styles */
h1,h2,h3,h4,h5,h6,h7 { color: #222; font-family: "Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: lighter; margin: 5px 0 0; }
h1 { font-size: 28px; }
h2 { color: #357; font-size: 25px; }
h3 { color: #336; font-size: 22px; }
h4 { color: #911322; font-size: 18px; }
h5 { color: #af3d0a; font-size: 16px; }
h6 { color: #60A0E0; font-size: 12px; background: #6C7B9C; margin: 1px 0 0; padding: 3px; cursor: pointer; }
h6 a:link { letter-spacing: 1px; text-decoration: none; color: #60A0E0; }
h7 a:link, h7 a:visited { font-weight: normal; letter-spacing: 2px; text-decoration: none; color: #60A0E0; }
h7 a:hover, h7 a:active { color: #80C0FF; }

del { color: #999; }

acronym { background: url(../img/dottedborder_dark.gif) repeat-x bottom center; border: none; cursor: help; padding-bottom: 1px; }
hr { background-color: #777; border: 0; color: #777; height: 1px; margin: 5px 0 !important; width: 100%; }
a { color:  #02C; cursor: pointer; text-decoration: none; }
a:hover { color:  #04F; }
a.courriel { font-size: 11px; }
p { line-height: 16px; margin: 5px 0 15px; }
.noborder { border: 0; }

#content ul { list-style-type: none; margin: 0px; padding: 0px 10px 5px 10px; }
#content ol { margin: 0; padding: 0 10px 5px 33px; }
#content ul li { background: transparent url(../img/arrow.gif) no-repeat 0 5px; padding-bottom: 7px; padding-left: 10px; }
#content ul li.disk { background: transparent url(../img/disk.gif) no-repeat 0 5px; padding-top: 1px; padding-left: 10px; }
#content ol li { padding-bottom: 7px; }
#content ul li ul { margin: 8px 0 -7px; }

/* I can't get <pre> to display inline very well so just use <span class="pre"> */
#content .pre { color: #af454a; font: 11px "Courier New",Courier,sans-serif; }
img { border: none; }
img.floatright,img.floatleft,#left img { border: none; /* 1px solid #222; */ }
a:hover img.floatright,a:hover img.floatleft,#left a:hover img { border: 1px solid #af2639; }

/* floats, positioning, and widths */
.floatleft { float: left; }
.floatright { float: right; }
.w50 { width: 50%; }
.floatleft p { padding: 0 10px 0 0; }
.floatright p { padding: 0 0 0 10px; }
img.floatleft { margin: 15px 15px 5px 0; }
img.floatright { margin: 15px 0 5px 15px; }

/* rounded corners * /
.tl { background: #465878 url(../img/corners/tl.gif) no-repeat top left; }
*/
.tl { background: #6C7C9C url(../img/corners/tl.gif) no-repeat top left; }
.tr { background: transparent url(../img/corners/tr.gif) no-repeat top right; }
.br { background: transparent url(../img/corners/br.gif) no-repeat bottom right; }
.bl { background: transparent url(../img/corners/bl.gif) no-repeat bottom left; }
.ltl { background: #efefef url(../img/corners/l_tl.gif) no-repeat top left; }
.ltr { background: transparent url(../img/corners/l_tr.gif) no-repeat top right; }
.lbr { background: transparent url(../img/corners/l_br.gif) no-repeat bottom right; }
.lbl { background: transparent url(../img/corners/l_bl.gif) no-repeat bottom left; }

/* blockquotes and code*/
blockquote { background: transparent url(../img/blockquote/quote.gif) no-repeat 10px 10px; display: block; margin: 10px auto; min-height: 35px; width: 100%; }
* html blockquote { height: auto !important; min-height: 35px; }
blockquote p { line-height: 17px; margin: 0; padding: 10px 10px 10px 50px; }
blockquote span { color: #999; display: block; font-size: 9px; padding-top: 5px; }
blockquote span a { color: #555; text-decoration: none; }
blockquote.go { background: transparent url(../img/blockquote/go.gif) no-repeat 10px 50%; }
blockquote.stop { background: transparent url(../img/blockquote/stop.gif) no-repeat 11px 50%; }
blockquote.exclamation { background: transparent url(../img/blockquote/exclamation.gif) no-repeat 23px 50%; }
code { display: block; line-height: 17px; margin: 0 auto 15px; width: 92%; }
code .red { color: #af454a; }

/* forms */
form select,form input,form textarea { border: 1px solid #888; font: 11px Verdana,Arial,Helvetica,sans-serif; }
form input:hover,form input:focus,form textarea:hover,form textarea:focus,form select:hover,form select:focus { background-color: #f9f9f9; border: 1px solid #444; }
form label { color: #777; display: block; }
form textarea { line-height: 16px; padding: 1px; }
form p { margin: 10px 0; }

/* top section */
#top { background: url(../img/contentbg.gif) repeat-y top center; }

/* very bottom curve */
#bottom { background: url(../img/container_b.gif) no-repeat bottom center; height: 9px; }
* html #bottom { margin-top: -4px; }

/* header */
#header { font: 30px "Trebuchet MS",Arial,Helvetica,sans-serif; height: 200px; margin: auto; text-align: left; width: 780px; }
#header.h0 { background: url(../img/headers/h0.jpg) no-repeat top center; }
#header.h1 { background: url(../img/headers/h1.jpg) no-repeat top center; }
#header.h2 { background: url(../img/headers/h2.jpg) no-repeat top center; }
#header.h3 { background: url(../img/headers/h3.jpg) no-repeat top center; }
#header.h4 { background: url(../img/headers/h4.jpg) no-repeat top center; }
#header.h5 { background: url(../img/headers/h5.jpg) no-repeat top center; }
#header.h6 { background: url(../img/headers/h6.jpg) no-repeat top center; }
#title { background-color: transparent; color: #fff; cursor: default; margin-left: 13px; margin-top: 125px; position: absolute; }
#pensee { visibility:hidden; background-color: transparent; border: #FF0; color: #037; cursor: default; font: 11px "Trebuchet MS",Arial,Helvetica,sans-serif; height: 15px; margin: 0px; padding: 0px 15px; top: 295px; position: absolute; text-align: left; width: 780px; }

/* menubar 
.nav { background-color: #105080; border-bottom: #AAA 1px solid; border-top: #09F 1px solid; color: #fff; cursor: default; font-size: 11px; height: 40px; margin: auto; text-align: left; width: 780px; }
*/
.nav { /* border-bottom: #AAA 1px solid; */ color: #fff; cursor: default; font-size: 14px; height: auto; margin: auto; text-align: left; width: 780px; }
.nav1, .nav2, .nav3 { height: 40px; }
.nav1 { background: url(../img/titre.jpg) no-repeat top center; }
.nav2 { background-color: #6C7C9C; /* border-top: #09F 1px solid; */ }
.nav3 { background: url(../img/separation_haut.jpg) no-repeat top center; }
#slogan { font-size: 14px; margin: 11px 0 0 15px; position: absolute; }
#navdiv { text-align: left; }
#navlist { list-style-type: none; margin: 0; padding: 13px 8px 0px 8px; }
#navlist li { display: inline; }
#navlist li a { color: #fff; height: 40px; padding: 8px 6px 9px; text-decoration: none; }
#navlist li a:hover,#navlist li a.selected { color: #9CC1DC; }
#navlist li a.selected:hover { color: #C2D7E8; }

/* content */
#content { color: #222; margin: auto; min-height: 400px; text-align: left; width: 780px; }
* html #content { height: auto !important; min-height: 400px; }
#left { float: left; padding: 10px 10px 20px; width: 545px; margin-bottom:5px; }
.justifie p  { text-align:justify; }
div.sideitem h4 { background-color: black; color: #733; font: 11px "Trebuchet MS",Arial,Helvetica,sans-serif;  }
* html #left { padding-top: 20px; }

/* sidebar */
#right { float: right; padding: 20px 10px 20px 10px; width: 195px; height: 350px; background: url(../img/bande_droite.jpg) no-repeat top center; margin-bottom:5px; }
* html #right { padding-top: 30px; }
#right .sideitem { margin-bottom: 25px; }
#right .sideitem h4 { background-color: transparent; background: url(../img/dottedborder.gif) repeat-x bottom center; color: #FFF; font: 12px "Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: 700; margin-bottom: 13px; padding-bottom: 3px; width: 100%; }
#right .sideitem p { padding: 0px 5px; color:#FFF; }
#right .sideitem ul { margin-left: -4px; }

/* footer */
.footer { clear: both; color: #fff; height: 30px; margin: auto; text-align: left; width: 780px; }
.footer div { height: 30px; }
#copyright { color: #C2D7E8; float: left; margin-bottom: -16px; margin-top: 0 !important; padding: 8px; text-align: left; }
#designcredit { color: #037; float: right; margin-bottom: -16px; padding: 8px; text-align: right; }
#designcredit a { color: #fff; }
#designcredit a:hover { color: #9CC1DC; text-decoration: none; }
a:hover,blockquote span a:hover { text-decoration: underline; }
form select,form input { padding: 1px; }