/*=====================================================
// Version  : 2.0
// Project  : École de danse Cadence
//=====================================================*/


/* ----- HTML TAG RESET & CLEARFIX ----- */
body,div,dl,dt,dd,ul,ol,li,h1,
h2,h3,h4,h4,h6,pre,form,fieldset,
input,textarea,p,blockquote,th,td       { margin: 0; padding: 0; }
table                                   { border-collapse: collapse; border-spacing: 0; }
fieldset,img                            { border: 0; vertical-align: bottom; }
a,h1                                    { overflow: hidden; }
ol,ul                                   { list-style: none; }
caption,th                              { text-align: left; }
h1,h2,h3,h4,h4,h6                       { font-size: 100%; font-weight: normal; overflow: hidden; }
q:before,q:after                        { content: ''; }
abbr,acronym                            { border: 0;}
.clearfix:after                         { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix                               { display: inline-block; }
html[xmlns] .clearfix                   { display: block; }
* html .clearfix                        { height: 1%; }
.clear                                  { clear: both }


/* ---------- GENERAL */
body                                    { font-family: arial,tahoma,sans-serif; font-size: 12px; background: #d9d8d4 url(../images/bg.png) repeat-x; color: #000; }
#container                              { width: 966px; padding: 0 3px; margin: 0 auto; position: relative }


/* ---------- GRID */
.w420                                   { width: 420px; }
.w300                                   { width: 300px; }
.w600                                   { width: 600px; }
.w920                                   { width: 920px; }
.left                                   { float: left }
.right                                  { float: right }
.box                                    { }


/* ---------- MENU */
#menu                                   { width: 740px; height: 72px; margin: 0 auto; }
#menu li                                { position: relative; float: left; height: 72px; text-align: center; padding: 0 33px; }
#menu li a                              { color: #fff; text-decoration: none; outline: none; font-size: 16px; text-indent: -9999px; font-weight: bold; display: block; height: 72px; }
.link-hover                             { background: transparent url(../images/link_hover.png) repeat-x; padding: 0 32px !important; border-left: 1px solid #810000; border-right: 1px solid #810000 }
#link_01                                { background: transparent url(../images/link_01.png) no-repeat center center; width: 61px; }
#link_02                                { background: transparent url(../images/link_02.png) no-repeat center center; width: 48px; }
#link_03                                { background: transparent url(../images/link_03.png) no-repeat center center; width: 97px; }
#link_04                                { background: transparent url(../images/link_04.png) no-repeat center center; width: 96px; }
#link_05                                { background: transparent url(../images/link_05.png) no-repeat center center; width: 102px; }
#menu ul                                { display: none; width: 180px; position: absolute; top: 72px; left: -1px; z-index: 5000 }
#menu ul li                             { font-weight: normal; width: 210px; height: 33px; padding: 0; background: #7f0000; border-bottom: 1px solid #990000; float: none; text-align: left; }
#menu ul li a                           { border-right: none; text-indent: 0; font-size: 12px; font-weight: normal; width: 200px; height: 23px; padding: 10px 0 0 10px; display: inline-block; color: #fff; }
#menu ul li a:hover                     { background: none; font-style: italic; padding: 10px 0 0 10px; border: 0; }
#menu li:hover > ul                     { display: block; }


/* ---------- HEADER */
#whitebox                               { background: transparent url(../images/whitebox_bg.png) repeat-y; width: 960px; padding: 0 3px 3px 3px; }
#whitebox_footer                        { clear: both; margin: 0 auto; background: transparent url(../images/whitebox_footer.png) no-repeat; width: 966px; height: 11px; }
#logo                                   { float: left; width: 320px; height: 330px; }
#logo h1                                { background: transparent url(../images/logo.png) repeat-y; text-indent: -9999px; width: 215px; height: 110px; margin: 100px auto 0 auto; }
#logo ul                                { text-align: center; margin: 5px 0 0 0 }
#logo ul li                             { margin: 0 0 2px 0; }
#slideshow                              { float: right; width: 630px; height: 320px; z-index: 4000; margin: 10px 10px 0 0; position: relative; overflow: hidden; }
#slideshow div                          { width: 630px; height: 320px; }
#slideshow img                          { display: block; width: 630px; height: 320px; position: absolute: top; 0; left: 0; z-index: 50000; }
#slideshow div p                        { color: #fff; text-transform: uppercase; font-weight: bold; font-size: 28px; background: transparent url(../images/overlay.png) repeat; text-align: right; padding: 10px; position: absolute; bottom: 10px; right: 10px; z-index: 600000; }
#schedule                               { float: right; width: 630px; margin: 10px 10px 0 0; position: relative; }
#schedule h2                            { text-transform: uppercase; font-size: 18px; font-weight: bold; color: #990000; margin: 15px 0 10px 0 }
#schedule_table                         { width: 595px; background: transparent url(../images/schedule_column.png) repeat-y; border-top: 1px solid #000; border-bottom: 1px solid #000; }
#schedule_table div                     { float: left; width: 85px; }
#schedule_table div strong              { text-align: center; display: block }
#schedule_table div div                 { float: none; height: auto; padding: 2px; width: 81px; border-right: 0; border-bottom: 1px solid #000; position: relative; top: 1px; }
#schedule_infos                         { clear: both; padding: 10px 0 0 0; }
#schedule_table .date                   { background: #c3c4be; margin: 0 0 5px 0; color: #990000; }
#schedule_table .classes                { margin: 0 0 5px 0; }
#white_content                          { float: right; width: 630px; margin: 20px 10px 0 0; position: relative; }


/* ---------- CONTENT */
#billboard                              { clear: both; padding: 10px 0 0 3px }
#billboard .box                         { float: left; background: #f4f2e6; border: 1px solid #dbd5bc; width: 220px; height: 110px; margin: 0 8px; display: inline }
#billboard h2                           { font-size: 14px; font-weight: bold; background: #dbd5bc; padding: 7px 0 7px 7px; border-bottom: 2px solid #c3bda4 }
#billboard a                            { text-decoration: none; color: #000; }
#billboard .box div                     { margin: 10px 0 0 10px; line-height: 15px; }
#billboard .box ul li                   { float: left; padding: 20px 5px 0 6px; }
#content                                { padding: 20px 0 20px 0; width: 960px; margin: 0 auto; }
.separator                              { background: transparent url(../images/hr.png) no-repeat; width: 911px; height: 15px; margin: 10px auto; }

/* ----- accueil */
.home                                   { width: 932px; }
.home .w420 .box                        { width: 420px; height: 220px; min-height: 220px; margin: 0 0 40px 0; }
.home .w420 .box h3                     { color: #990000; text-transform: uppercase; font-size: 15px; font-weight: bold; padding: 10px 0 0 10px; }
.home .w420 .box h3 img                 { margin: 0 5px 0 0 }
.home .w420 .box div                    { margin: 10px 0 0 10px; width: 350px; line-height: 18px; }

/* ----- description */
.description .w920                      { margin: 0 auto; position: relative }
.description .w920 .box                 { padding: 10px 10px }
.description .w920 h2                   { text-transform: uppercase; font-size: 16px; font-weight: bold; color: #990000; padding: 0 0 5px 0 }
.description .w920 h2 strong            { color: #000 }
.description .w920 h2 span              { color: #990000 !important; }
.description .style                     { padding: 5px 0 10px 0; width: 880px; clear: both; }
.description .style ul                  { float: left; padding: 25px 0 0 30px; }
.description .style li                  { float: left; margin: 10px 10px 0 0 }
.description .style li a                { border: 1px solid #969695; display: block }
.style_content                          { float: left; width: 500px; padding: 10px 10px 0 0; }

/* ----- saviez vous que */
.faq .w920                              { margin: 0 auto; position: relative }
.faq .w920 .box                         { padding: 10px }
.faq .w920 h2                           { text-transform: uppercase; font-size: 18px; font-weight: bold; color: #990000; }
.answer                                 { width: 700px; padding: 10px 0 20px 0; }
.answer img                             { border: 1px solid #969695; }
.answer div                             { float: left }
.answer_text                            { float: left; width: 550px; line-height: 18px; padding: 0 30px 0 0; }

/* -----  horaire et reglements */
.rules .w920                            { margin: 0 auto; position: relative }
.rules .w920 .box                       { padding: 10px }
.rules .w920 ul                         { list-style-type: disc; padding: 0 0 0 20px; }
.rules .w920 ul li ul                   { list-style-type: circle; padding: 0 0 0 20px; }
.rules .w920 ul li ul li ul             { list-style-type: square; padding: 0 0 0 20px; }
.rules .w920 h2                         { text-transform: uppercase; font-size: 18px; font-weight: bold; color: #990000; }
.rules .box div                         { line-height: 18px; width: 700px; margin: 10px 0 0 0 }

/* ----- contact */
.contact .w920                          { margin: 0 auto; position: relative }
.contact .w920 .box                     { padding: 10px }
.contact .w920 h2                       { text-transform: uppercase; font-size: 18px; font-weight: bold; color: #990000; }
.contact #address                       { margin: 10px 0 0 0 }
.contact #address li                    { margin: 0 0 2px 0; }
#coord                                  { margin: 40px 0 0 0; height: 360px; }
#coord img                              { border: 1px solid #969695; display: block; }
#coord p                                { margin: 5px 0 0 0 }
.contact form                           { width: 290px; position: absolute; top: 20px; left: 355px;  }
.contact form #success                  { margin: 0 0 10px 0; color: #22a200; font-weight: bold }
.contact form #error                    { margin: 0 0 10px 0; color: #990000; font-weight: bold }
.contact form div                       { clear: both; margin: 0 0 10px 0 }
.contact form label                     { display: block; margin: 0 0 5px 0; color: #000; font-weight: bold }
#contact_email                          { width: 230px; padding: 2px; font-family: arial; font-size: 11px; border: 1px solid #000 }
#contact_tel,#contact_nom               { width: 110px; padding: 2px; font-family: arial; font-size: 11px; border: 1px solid #000 }
#nom_tel                                { height: 40px }
#nom_tel p                              { float: left; padding: 0 4px 0 0; }
#capt                                   { height: 60px }
#capt img                               { float: left; border: 1px solid #969695; }
#capt p                                 { float: left; padding: 3px 0 0 10px; }
#captcha_response                       { width: 110px; padding: 2px; font-family: arial; font-size: 11px; border: 1px solid #000 }
#contact_message                        { width: 230px; height: 120px; padding: 2px; font-family: arial; font-size: 11px; border: 1px solid #000 }
#contact_submit                         { clear: both }
#contact_img                            { position: absolute; top: 35px; left: 660px; padding: 2px }
#contact_img img                        { border: 1px solid #969695 }
#contact_img a img                      { border: 0; }

/* ----- spectacles */
.shows .w300                            { margin: 0 20px; display: inline }
.shows .w300 #years                     { margin: 10px 0 }
.shows .w300 #years li                  { margin: 0 0 5px 0 }
.shows .w300 #years a                   { color: #000; font-size: 14px; text-decoration: none }
.shows .w300 #years a:hover             { font-weight: bold }
.shows .box                             { padding: 10px }
.shows h2                               { text-transform: uppercase; font-size: 16px; font-weight: bold; color: #990000; }
#show_pics                              { margin: 10px 0 0 0 }
#show_pics li                           { float: left; margin: 5px 8px 5px 0; }
#show_pics img                          { border: 1px solid #969695 }
#shows_text                             { margin: 0 0 10px 20px; padding: 10px; width: 900px }

/* ----- professeurs */
.professeurs .w920                      { margin: 0 auto; position: relative }
.professeurs .w920 .box                 { padding: 10px }
.professeurs .w920 h2                   { text-transform: uppercase; font-size: 18px; font-weight: bold; color: #990000; margin: 0 0 10px 0 }
.professeurs #top_text 	            { margin: 0 0 25px 0; width: 900px; line-height: 1.6em }
#persons li                             { margin: 0 0 10px 0; clear: both; }
.person_img                             { float: left; border: 1px solid #969695; }
.person_content                         { float: left; margin: 0 0 0 10px; width: 700px; line-height: 1.6em }
#persons li strong                      { display: block }

/* ----- troupe */
.troupe .w920                           { margin: 0 auto; position: relative }
.troupe .w920 .box                      { padding: 10px }
.troupe h2                              { font-weight: bold; font-size: 18px; }
.troupe ul                              { list-style: square; margin: 10px 0 0 15px; }
.troupe li                              { margin: 0 0 5px 0; }
#troupe                                 { width: 900px; }
#troupe_text, #folk_text                { float: left; width: 500px; padding: 10px 0 10px 0 }
#troupe_pics,#folk_pics                 { float: left; list-style: none; padding: 10px 0 0 30px; }
#troupe_pics li,#folk_pics li           { float: left; margin: 0 10px 0 0; border: 1px solid #969695; }
#folk                                   { clear: both; width: 900px; }

/* ---------- FOOTER */
#footer                                 { clear: both; background: transparent url(../images/hr.png) no-repeat; width: 911px; height: 55px; margin: 10px auto; }
#cmnd                                   { width: 500px; float: left; margin: 20px 0 0 0; text-align: justify }
#cmnd img                               { display: block; margin: 0 0 5px 0; }
#copyright                              { float: right; text-align: right; margin: 20px 0 0 0 }
#copyright p                            { margin: 0 0 4px 0; }
#copyright p a                          { text-decoration: none; color: #000 }