/*===| I. MAIN LAYOUT  |=====================================================*/
* {margin: 0; outline: 0px;}
html, body {height: 100%;width: 100%;}
ul, li{list-style: none;list-style-position: outside;	margin: 0;	padding: 0;}
p{padding: 0;}
.left{float: left;} .right{float: right;}
.left1{float: left; padding-right: 7px;} .right1{float: right;padding-left: 6px;}
.left2{float: left; padding: 3px 0 10px 0;}   .left3{float: left; padding: 20px 0 0 0;}
#push, .clr	{clear: both;}
.clear{clear: both; font-size: 0px; line-height: 0px; height: 0px;width: 100%;}
.clear1{clear: both; font-size: 0px; line-height: 0px; height: 10px; border: none !important; width: 100%;}
.clear2{clear: both; font-size: 0px; line-height: 0px; height: 10px;  border: none !important; width: 100%;}

body{ background: #ffffff;}
#bg1{position:absolute;z-index: 1; width:100%; background:url("images/bg0.gif") 50% 0% repeat-y;}
#bg2{position:absolute;z-index: 2; width:100%; background:url("images/bg1.jpg") 50% 0% repeat-x;}
#bg3{position:absolute;z-index: 3; background:url("images/bg2.jpg") 50% 0% no-repeat;}

#wrap-container{position:relative;z-index:4; width: 100%;}
#container{background:url("images/bg0.gif") 50% 50% repeat-y; margin:0 auto;	text-align: left;}
#content{}

/* ===| II. HEADER ELEMENTS |================================================*/
#site-header.outter{background:url("images/header.jpg") 50% 0 no-repeat;}
#site-header .inner{}

/* ===| III. LEFT COLUMN ELEMENTS |===========================================*/
#left-outter{float:left; margin: 0; overflow: hidden;}
#left-outter div.outter{background: url(images/box1.gif) 50% 0% no-repeat;padding: 0 0 10px; min-height: 159px; height: auto!important;height: 159px; }
#left-outter div.inner{padding: 0px 5px 0px;}

#actualite{ width: 222px; height: 237px; padding: 56px 8px 0px 30px; float: left; background: url(images/bg-actualites.jpg) no-repeat top left; }
#actualite-inner{ width: 222px; height: 145px;float: left; }
.mdm-img{  border: solid 1px #197ac7; margin: 3px 9px 0 0; float: left;}

#text-animation{ width: 223px; height: 59px; float: left; padding: 12px 0 0 0;}

#contact-info{ width: 222px; height: 145px; padding: 50px 8px 0px 30px; float: left; background: url(images/bg-coordonnees.jpg) no-repeat top left; }
#contact-info .text1{ padding: 7px 0 10px 0;}


#contact-info .tel{ width: 190px; height: 22px; padding: 0px 0 5px 30px; float: left; background: url(../../images/charte/icon-tel.jpg) no-repeat top left;}
#contact-info .tel p{ padding: 3px 0 0 0;}

#contact-info .mail{ width: 190px; height: 17px; padding: 0px 0 0 30px; float: left; background: url(../../images/charte/icon-mail.jpg) no-repeat top left;}

#plan{ width: 232px; height: 123px; padding: 0px 8px 0px 20px; float: left; background: #ffffff;}
/* ===| IV. RIGHT COLUMN ELEMENTS |===========================================*/
#right-outter{	float:left;	margin:0; padding: 0px; overflow: hidden;}
#right-inner{padding: 10px 20px 10px 10px; }
#right-inner1{padding: 0px 18px 10px 10px; background: #e4f3ff url(images/bg-right-inner.jpg) no-repeat top left;min-height: 497px; height: auto!important;height: 497px;}


#newsletter{ width: 266px; height: 46px; padding: 19px 0 0 384px; float: left; background: url(images/bg-newsletter.jpg) no-repeat top left; }
#titre-page{ width: 622px; height: 39px; float: left; background: url(../../images/charte/titre-page.jpg) no-repeat top left;padding-top: 4px; }

.encart1{ width: 347px; height: 144px; padding: 8px 12px 0 12px; float: left; background: url(../../images/charte/encart1.jpg) no-repeat top left; border: solid 3px #ffffff;}
.encart2{ width: 379px; height: 103px; padding: 5px 15px 0 8px; float: left; background: url(../../images/charte/encart2.jpg) no-repeat top left; border: solid 3px #ffffff;}

.encart3{ width: 379px; padding: 8px 12px 0 12px; float: left; background: #6fbefd url(../../images/charte/bg-encart1.jpg) repeat-x top left; border: solid 3px #ffffff;}

#diapo1{ width: 238px; height: 158px; float: left;}
#diapo2{ width: 203px; height: 277px; float: right; padding-left: 10px;}

#box{
  padding: 13px 0 0 27px;
  float: left;
  width: 595px;
  height: 127px;
  background: url(../../images/charte/box.jpg) no-repeat top left;
}

#box img
{
  float: left;
  margin-right: 25px;
}


/* ----------------- catalogue ----------- */
#recherche
{
    float:left;
    width: 620px;
    text-align: left;
    height:21px;
    padding: 10px 0 10px 0px;
    color: #054c95;
    border: 0px;
}

#recherche label{ width: 104px; padding-left: 3px; float: left;}

#recherche select
{
  width: 150px;  color: #5E4B2B;  margin-right: 10px; padding: 0px !important; float: left; font-family: Arial, Helvetica, sans-serif; font-size: 12px;
  color: #005ebd; border: solid 1px #004378;
}

#recherche option{ width: 120px !important;}

.buttonRecherche
{
    background: url(../../images/charte/recherche.jpg) no-repeat top left;
	border: none;
    width: 80px;
	height: 22px;
}

.buttonRechercheOver
{
    background: url(../../images/charte/recherche-over.jpg) no-repeat top left;
	border: none;
	width: 80px;
    cursor: pointer;
	height: 22px;
}

.encart-catalog{ width: 284px; height: 175px; margin: 0px 5px 5px 0px; padding: 8px 8px 8px 8px; float: left; background: #6fbefd url(../../images/charte/bg-encart1.jpg) repeat-x top left; border: solid 3px #ffffff;}
.encart-catalog .titre{ height: 34px;float: left; width: 100%;}
.encart-content{ height: 100px;float: left; width:100%; border-top: solid 1px #a5cae7; padding-top: 10px;}


.catalog-img{width:77px;height:77px;float:left;text-align:center; margin-right: 10px;}
.catalog-img img{  border:1px solid #ffffff;}

.catalog-big{width: 252px;height: 252px;float:left;text-align:center;}
.catalog-big img{  border:1px solid #ffffff;}

.page {float: left; width: 620px;; text-align:center; border: none !important; }
.page p{ color: #2680c6; text-align: center;font-size:12px; font-weight:bold;}

.page span{padding:1px; margin: 0 0px 0 0px; font-size:12px !important;}
.page a:link, .pagination a:visited{font-family:Arial; font-size:12px !important; font-weight:bold !important; color: #008fff !important;text-decoration:none;  border: none !important;}
.page a:hover, .pagination a:active{font-family:Arial; font-size:12px !important; font-weight:bold !important; color: #3cafff!important;text-decoration:none;  border: none !important;}

/* ===| V. FOOTER BOXES |=====================================================*/
#wrap-footer {position:relative; z-index: 4; width: 100%; text-align: left;}
#fwrap1 {position:absolute; z-index: -3; left:0; background:url("images/footer-bg-0.gif") 50% 0% repeat-y; width:100%;}
#fwrap2 {position:absolute; z-index: -2; left:0; background:url("images/footer-bg-1.gif") 50% 100% no-repeat; width:100%;}
#fwrap3 {position:absolute; z-index: -1; left:0; }

#footer.outter	{ margin: 0 auto; padding: 0px;}
#footer .inner	{background: url(images/bg-footer.jpg) no-repeat 50% 0%; float: left; min-height: 40px; height: auto!important;height: 40px; width:940px; }

.digitalage
{
    float: left;
    padding-left: 20px;
    padding-top: 10px;
    width: 240px;
	height: 40px;
}

#menu2
{
    float: right;
    padding: 10px 20px 0 0px;
    width:660px;
    text-align: right !important;

}
.copyright
{
    float: right;
    padding:0px 20px 0 0px;
    width:660px;
}


#menu2 ul li{
    display: inline;
    margin: 0px !important;
    padding: 0px !important;
    color: #000000;
   text-align: right !important;
	 font-size: 11px;
	 line-height: 18px;
  }
#menu2 a:link, #menu2 a:visited{
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
    color: #000000;

  }
#menu2 a:hover, #menu2 a:active{
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
    color: #007ddc;
  }

.copyright a:link, .copyright a:visited{
	text-decoration: none;
    color: #007ddc;
  }
.copyright a:hover, .copyright a:active{
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
    color: #000000;
}

.digitalage a:link, .digitalage a:visited{
    font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
    color: #007ddc;
  }
.digitalage a:hover, .digitalage a:active{
  font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
    color: #000000;
}

/* ===| VI. OTHER ELEMENTS |====================================================*/
img {border: 0;}
#menu2 ul li{display: inline;}