/*  -------------------------------------------------------------
    * Filename:         style.css
    * Version:          1.6
-------------------------------------------------------------- */

/*  -------------------------------------------------------------
    1. Main layout
-------------------------------------------------------------- */
#container{width: 950px; min-height: 100%; height: auto !important; height: 100%;}
    #header{height: 220px;}
    #content{width: 950px;}
        #left-outer{float: left; width: 555px; padding: 7px 15px 7px 50px;}
        #left-inner{float: left; width: 555px; text-align: justify;}
        #right-outer{float: left; width: 280px; padding: 0 50px 7px 0;}
        #right-inner{float: left; width: 280px;}
#footer{width: 950px; font-size: 11px; line-height: 18px;}

/*  -------------------------------------------------------------
    2. Header elements
-------------------------------------------------------------- */

/*  -------------------------------------------------------------
    3. Content elements
-------------------------------------------------------------- */ 
/*  Titles  */
#page-title{float: left; padding: 0 0 23px 0;}

/*  MDM  */
#mdm{float: left; width: 265px; padding: 0 0 18px 15px;}
#mdm .inner{float: left; width: 265px; height: 77px; padding: 26px 0 0 0; background: url(../images/charte/mdm-title.jpg) no-repeat left top; font-size: 11px; line-height: 18px;}
#mdm .title{ font-weight: bold; }
#mdm .desc{ text-align: justify; }
#mdm #mdm-details-outer{ float:left; width: 265px; height: 23px; background: url(../images/charte/mdm-bg1.jpg) repeat-x 0 0;}

/*  Coordonnees  */
#coordonnees{ float: left; width: 265px; padding: 0 0 0 15px;  font-size: 11px; line-height: 18px;}
#coordonnees .inner{ float: left; width: 265px; padding: 31px 0 0 0; background: url(../images/charte/coordonnees-title.jpg) no-repeat 0 0; }
.envelope{float: left; height: 21px; padding: 0 0 0 42px; background: url(../images/charte/envelope.jpg) no-repeat 0 0;}
.loupe{float: left; height: 24px; padding: 2px 0 0 42px; background: url(../images/charte/loupe.jpg) no-repeat 0 0;}

/*  Diaporama  */
#diapo1{float: left; width: 280px; height: 250px; /*background: url(../images/charte/diapo-bg.jpg) no-repeat 0 0;*/}
#diapo2{float: left; width: 555px; height: 83px; background: white no-repeat 0 10px; padding: 10px 0;}
#diapo3{float: left; width: 555px; height: 83px; background: white no-repeat 0 10px; padding: 10px 0;}

/*  Separators  */
.separator{overflow: hidden; display: block; line-height: 0; font-size: 0;}
.hr1{height: 19px;}

/*  Lists  */
.list1{float: left;}
.list1 li{padding: 0 0 0 15px; background: url(../images/charte/bullet1.jpg) no-repeat 2px 7px;}
.list1 li.inline{float: left; padding: 0 15px 0 15px;}
.list1 li.last{padding-right: 0;}

/*  Thumbnails  */
.thumb1{display: block; border: 1px solid #969696; background: #FFFFFF;}
a.thumb1:hover{border: 1px solid #707070; background: #FFFFFF;}

/*  -------------------------------------------------------------
    4. Footer elements
-------------------------------------------------------------- */
#footer .inner{text-align: left; padding: 12px 50px;}
#footer #footer-left{float: left; width: 240px;}
#footer #footer-right{float: left; width: 610px; text-align: right;}
#footer .copyright{text-align: center;}
#footer .client{color: #003d6a;}
#footer .client a:link, #footer .client a:visited{color: #003d6a; text-decoration: none;}
#footer .client a:hover, #footer .client a:active{color: #003d6a; text-decoration: underline;}
#footer .mentions{}
#footer .mentions a:link, #footer .mentions a:visited{color: #003d6a; text-decoration: none;}
#footer .mentions a:hover, #footer .mentions a:active{color: #003d6a; text-decoration: underline;}

/*  -------------------------------------------------------------
    5. Menus
-------------------------------------------------------------- */
#menu2 ul{float: right;}
#menu2 ul li{float: left; display: inline; color: #015996;}
#menu2 ul li a:link, #menu2 ul li a:visited{color: #015996; text-decoration: none;}
#menu2 ul li a:hover, #menu2 ul li a:active{color: #003d6a; text-decoration: underline;}

/*  -------------------------------------------------------------
    6. Pages
-------------------------------------------------------------- */
/*  Contact  */
#frmContact{width: 550px;}
#frmContact .col1{float: left; width: 265px; padding: 0 20px 0 0;}
#frmContact .col2{float: left; width: 265px;}

#frmContact .field label{float: left; width: 90px;}
#frmContact .field input{ width: 155px; }
#frmContact .field textarea{ width: 161px; }
#frmContact .buttons{padding: 10px 0 8px 0; text-align: center; margin: 0  auto;}
#frmContact .buttons input{ width: 100px; padding: 2px; }