/* RESET CSS */
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;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
    color: #23296b;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
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: "" "";
}

/* STYLES ETCHANDY */

body {
	text-align:center;
	background: url("../images/bg_body.jpg") top repeat-x;
}

h1 a {
	color:blue;
}

#contenu h1 {
  text-align: left;
	font-size:22px;
	text-transform: uppercase;
	padding-top: 4px;
	margin-bottom:14px;
	font-weight: normal;
}

#contenu h2 {
	font-size:16px;
	text-transform: uppercase;
	margin-bottom:14px;
	font-weight: bold;
  border-bottom:1px solid #23296b;
}

#contenu h3 {
	font-size:16px;
	margin-bottom:14px;
	margin-left:20px;
	padding-left:5px;
	background:#E7E7E7;
}

#contenu h2 a {
	color:blue;
}

#contenu ul {
	list-style:disc;
	margin-left:40px;
}

#contenu ul li {
	margin:5px 0px;
}

#conteneur {
	margin: 0 auto;
	width:980px;
	min-height: 648px;
	background: url("../images/bg_nuages.jpg") top no-repeat;
text-align: left;
	
}

/****** BANDEAU ******/

#bandeau {
	text-align:left;
	width:980px;
	height:155px;
	display: block;
	border-bottom: 1px solid white;
}
  .goutte {
    float: left;
    width:  25px;
    height: 141px;
    background: url("../images/mozaik_png.png") -396px 0px no-repeat;
    display:block;
  }
  
  #bandeau_middle {
    float: left;
    width: 930px;
    height: 155px;
    display: block;
  }
    
    #bandeau_middle_top {
      width: 930px;
      height: 123px;
      display: block;
    }
    
      #top_logo {
        height: 30px;
        width: 930px;
        display:block;
      }
      
      #logo {
        width: 192px;
        height: 73px;
        margin: 0 auto;
        background: url("../images/mozaik_png.png") -204px 0px no-repeat;
        display: block;
      }
      
      #espace_client {
        float: right;
        width: 149px;
        height: 42px;
        margin-top: -70px;
        background: url("../images/mozaik_png.png") -421px -117px no-repeat;
        display: block;
        text-indent: -9999px;
        text-decoration: none; 
      }
      
      #espace_client:hover {
        float: right;
        width: 149px;
        height: 42px;
        background: url("../images/mozaik_png.png") -421px -160px no-repeat;
        display: block;
        text-indent: -9999px;
        text-decoration: none; 
      }
  
    #menu {
      text-align: center;
      width: 930px;
      height: 32px;
      display: block;
    }
      
      #menu ul li {
        float: left;
        width: 155px;
        height: 32px;
        display: block;
      }
    
      #menu ul li a {
        width: 155px;
        height: 25px;
        padding-top: 7px;
        font-family:Times New Roman, Times, serif;
        font-size: 16px;      
        text-transform: uppercase;
        color: #fff;
        text-decoration: none;
        background: none;
        display: block;
      }
      
      #menu ul li a:hover {
        background: url("../images/mozaik_png.png") -204px -115px no-repeat;
      }
      
    .ss_menu {
      position: relative;
      width: 155px;
      z-index: 10;
    }
    
      .ss_menu ul {
        width: 155px;
      }
      
      .ss_menu ul, .ss_menu li {
        list-style-type: none;
        list-style-position:outside;
        z-index: 10;
      }

        .ss_menu ul li {
          /*margin-top: 2px;*/
          display: block;
          text-align: center;
        }
      
          .ss_menu ul li a {
						border-top:#dbeff1 1px solid;
						border-bottom:#8fb6bb 1px solid;
            width: 155px;
            height: 17px;
            padding-top: 3px;
            font-family:Times New Roman, Times, serif;
            font-size: 11px;      
            text-transform: uppercase;
            color: #073753;
            text-decoration: none;
            /*background: url("../images/mozaik_png.png") -204px -167px no-repeat;*/
						background:#AFDFE6;
            display: block;
          }
          
          .ss_menu ul li a:hover {
            /*background: url("../images/mozaik_png.png") -204px -147px no-repeat;*/	
						background:#073753;
            color: #fff;
						border-bottom:#dbeff1 1px solid;
						border-top:#8fb6bb 1px solid;
          }

					

/****** CONTENU ******/

#contenu_index {
  width: 980px;
  height: 530px;
  background: url("../images/crayonne.png") bottom no-repeat;
  display: block;  
  text-align: left;
}

  #baseline {
    line-height: 120%;
    margin: 20px auto;
    width: 572px;
    height: 48px;
    padding-top: 5px;
    background: url("../images/mozaik_png.png") 0px -202px no-repeat;
    font-family:Times New Roman, Times, serif;
    font-size: 18px;      
    text-transform: uppercase;
    color: #23296b;
    display: block;
    text-align: center;
  }
  
  #plus {
    width: 550px;
    height: 120px;
    margin: 0 auto;
    text-align: center;
    display: block;
  }
	
	#plus a {
		cursor:default;
		text-decoration:none;
	}
      
    .link_activites {
      width: 270px;
    }
      
    .txt_plus {
      float: left;
      font-family:Times New Roman, Times, serif;
      font-size: 27px;      
      text-transform: uppercase;
      color: #23296b;
      width: 190px;
      padding: 0 10px;
      line-height: 220%;
      text-decoration: none;
      display: block;
      filter:alpha(opacity=0);
      opacity: 0;
      -moz-opacity:0;
    }
    
    /*.link_activites:hover .txt_plus {
      filter:alpha(opacity=100);
      opacity: 1;
      -moz-opacity:1;
      text-decoration: none;
    }*/
    
    .left {
      float: left;
      text-align: left;
    }
    
    .right {
      clear: both;
      float: left;
      text-align: right;
    }
    
    .cadreplus {
      float: left;
      line-height: 120%;
      width: 60px;
      height: 58px;
      display: block;
    }
    
      .plusefficace {
        background: url("../images/mozaik_png.png") -542px 0px;
      }
      
      /*.link_activites:hover .plusefficace {
        background-position: -421px 0px;
      }*/

			#dif0 {
        background-position: -421px 0px;
      }
      
      .plussecurite {
        background: url("../images/mozaik_png.png") -603px 0px;
      }
      
      #dif1 {
        background-position: -482px 0px;
      }
      
      .plusrapide {
        background: url("../images/mozaik_png.png") -542px -59px;
      }
      
      #dif2 {
        background-position: -421px -59px;
      }
      
      .pluseconomie {
        background: url("../images/mozaik_png.png") -603px -59px;
      }
      
      #dif3 {
        background-position: -482px -59px;
      }
  
  #clients {
    width: 358px;
    height: 115px;
    margin-left: 140px;
    padding: 90px 45px 5px 180px;
    background: url("../images/mozaik_png.png") 0px -255px no-repeat;
    font-family:Times New Roman, Times, serif;
    font-size: 14px;      
    text-transform: uppercase;
    color: #fff;
    line-height: 120%;
    display: block;
    text-align: center;
  }
  
    #liste_clients ul {
      width: 436px;
      margin-top: -70px;
      margin-left: 280px;
    }
    
      #liste_clients ul li {
        float: left;
        width: 103px;
        height: 16px;
        padding-top: 1px;
        margin: 2px 3px;
        text-align: center;
        background: url("../images/mozaik_png.png") 0px 0px no-repeat;
        font-family:Times New Roman, Times, serif;
        font-size: 14px;      
        color: #fff;
      }

 /*** page contenu ***/

#contenu {
  width: 910px;
  padding-top: 10px;
  margin: 0 auto;
  display: block;
  z-index: 5;
  	line-height:19px;
}
  
  #contenu_gtitle {
    float: left;
    width: 95px;
    height: 94px;
    background: url("../images/mozaik_png.png") 0px -17px no-repeat;
    display: block;
    z-index: 5;
  }
  
  #contenu_title {
    float: left;
    width: 810px;
    padding-top: 24px;
    padding-left: 5px;
    text-align: left;    
    font-family:Times New Roman, Times, serif;
    font-size: 30px;      
    text-transform: uppercase;
    color: #23296b;
    display: block;
  }

  #contenu_cadre {
    float: left;
    width: 845px;
		min-height:400px;
    margin-left: 61px;
    margin-top: -35px;
    background: url("../images/bg_cadre.png") repeat;
    display: block;
  } 
  
    .contenu_detail {
      clear: both;
      width: 825px;
      margin-bottom: 20px;
      padding: 10px;
      display: block;
    }
  
      .contenu_txt {
        float: left;
        width: 475px;
        padding: 5px;
        font-family:Times New Roman, Times, serif;
        font-size: 14px;      
        color: #23296b;
      }
      
      .contenu_photos {
        float: left;
        text-align: center;
        width: 330px;
        padding: 14px 5px;
      } 
  
  #content_right {
    float: right;
    margin-right: 40px;
    width: 160px;
  }
  


 /*** page accueil ***/



/****** FOOTER ******/

#footer {

} 


/****** ELEMENTS ******/

strong {
  font-weight: bold;
}

em {
  font-style: italic;
}

#contenu label {
  clear: both;
  float: left;
	text-align: left;
	width: 130px;
	height: 20px;
	margin: 5px;
	font-family:Times New Roman, Times, serif;
  font-size: 14px;      
  color: #23296b;
}

#contenu input {
  float: left;
	text-align: left;
	height:20px;
	width:675px;
	margin: 3px;
	background: url("../images/bg_cadre.png") repeat;
	border: none;
	font-family:Times New Roman, Times, serif;
  font-size: 14px;      
  color: #23296b;
	border:1px solid #00A6C0;
}

#contenu input#igorri, #contenu input.login,  #contenu input.submit {
  clear: both;
  float: right;
	text-align: center;
	height:20px;
	width:100px;
	margin: 5px;
	background: #a0dee8;
	border: none;
	font-family:Times New Roman, Times, serif;
  font-size: 14px;  
  text-transform: uppercase;    
  color: #fff;
	cursor:pointer;
}

#contenu textarea {
  float: left;
	text-align: left;
	height:200px;
	width:675px;
	overflow:auto;
	margin: 3px;
	background: url("../images/bg_cadre.png") repeat;
	border: none;
	font-family:Times New Roman, Times, serif;
  font-size: 14px;      
  color: #23296b;
	border:1px solid #00A6C0;
}

div#error_msg {
	color:red;
	text-align:left;
	line-height:150%;
}


#contenu p {
	text-align:justify;
	font-family:Times New Roman, Times, serif;
  font-size: 14px;      
  color: #23296b;
}

#contenu_title p{
    font-size: 30px;
  }

#contenu p a {
	color:blue;
}

.form_error {
	color:red;
	float:left;
}

label span {
	color:red;
}

hr {
	clear:both;
	height:0px;
	margin-bottom:5px;
	border:none;
}

/******* editor_box **********
Préfixer les h1 input label etc... de #contenu 
pour ne pas altérer la mise en page de la box

*/
#editor_box * {
	line-height:110%;
	margin:2px 0px;
}

#cms_toolbox_mode div {
	line-height:220%;
}

.tooltip{
    position:absolute;
    z-index:999;
    left:-9999px;
    background-color:#222;
    padding:5px;
    width:250px;
}

.tooltip p{
    margin:0;
    padding:0;
    color:#fff;
    padding:2px 7px;
    font-family:Times New Roman, Times, serif;
    font-size: 14px;      
}

div.error {
	color:red;
}

.box {
margin:10px 20px;
background: #161613;
border: solid 2px #666;
overflow: hidden;
position: relative;
width:294px;
height:221px;
float:left;
}
.box img {
position: absolute;
top: 0;
left: 0;
border: 0;
}

.caption {
text-align: center;
padding: 1px;
padding-top:5px;
color: #fff;
font-family: Times New Roman, Times, serif;
float: left;
position: absolute;
top: 100%;
background: #000;
height: 40%;
width: 100%;
opacity: .8;
/* For IE 5 to 7 */
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
/* For IE 8 */
-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}

#menu_admin a {
	color:#fff;
	font-size:20px;
	padding:15px;
	background-color:#555555;
	font-family:Arial;
}


#menu_admin {
	clear:both;
	position:fixed;
	bottom:0;
	color:#555555;
	font-size:20px;
	width:100%;
	text-align:right;
	padding-bottom:15px;
}

#footer {
	clear:both;
	font-size:12px;
	font-family:Times;
	float:left;
	width:100%;
	margin-top:50px;
	margin-bottom:10px;
}

#footer a {
	color:blue;
	font-size:13px;
}

.phototheque p {
	overflow:hidden;	
}