* {
margin: 0;
padding: 0;
}
body {
margin: 0;
padding: 0;
background: #FFF url(../images/bg_body.jpg) repeat-x top center;
font-family: 'Open Sans', sans-serif;
font-size: 13px;
color: #333;
font-weight: 400;
overflow-x: hidden
}
/*header*/
#header { }
#header .head_cont {
width: 966px;
margin: 0 auto;
position: relative;
}
#header .head_cont h1 {
float: left;
display: inline;
width: 258px;
height: 80px;
}
#header .head_cont h1 a {
display: block;
width: 258px;
height: 80px;
background: url(../images/logo.gif) no-repeat 0 0;
}
#header .head_cont h1 a span { display: none; }
#header .head_cont .links {
float: right;
height: 16px;
text-align: right;
margin: 9px 10px 0 0;
}
#header .head_cont .links li {
display: inline;
font-weight: bold;
color: #666;
}
#header .head_cont .links li a {
float: left;
display: inline;
height: 20px;
text-decoration: none;
color: #fff;
font-size: 12px;
padding: 1px 0 0 30px;
margin-left: 16px;
}
#header .head_cont .links li a:hover { color: #FF7B22; }
#header .head_cont .links li.connexion a { background: url(../images/icon_connexion.png) no-repeat 0 0; }
#header .head_cont .links li.enregistrer a { background: url(../images/icon_enregistrer.png) no-repeat 0 0; }
#header .head_cont .links li.deconnexion a { background: url(../images/icon_out.png) no-repeat 0 0; }
#header .head_cont h2 {
float: left;
display: inline;
color: #ff7b22;
font-weight: bold;
font-style: italic;
font-size: 16px;
margin: 30px 0 0 70px;
}
#header .head_cont .panier {
   
    float: right;
    display: inline;
    height: 38px;
    margin: 20px 0px 0 18px;
    padding: 0px 0 0 35px;
    font-size: 14px;
    text-decoration: none;
    background: url(../images/icone_panier.png) no-repeat bottom left;

}
#header .head_cont .panier strong { color: #303038; }
#header .head_cont .panier a { color: #303038; }
#header .head_cont .panier .price, #header .head_cont .panier .price a {color: #e64c26}
#header .head_cont .menu {
list-style-type: none;
margin: 0 0 0 0;
height: 45px;
background: #009cde;
clear: both;
position: relative
}
#header .head_cont .menu:before {
background: #009cde;
content: " ";
display: block;
height: 100%;
left: -10000px;
position: absolute;
top: 0;
width: 20000px;
z-index: -1;
}
#header .head_cont .menu li {
float: left;
width: auto;
font-weight: normal;
}
#header .head_cont .menu li a {
display: block;
height: 45px;
padding: 0px 25px;
color: #FFF;
font-weight: 400;
font-size: 13px;
text-decoration: none;
text-transform: uppercase;
line-height: 44px;
}
:root #header .head_cont .menu li a { padding: 0px 20px \0/IE9; } /*IE9 hack*/
#header .head_cont .menu li:hover a { background: #ff7b22; }
#header .head_cont .menu li a.on { background: #ff7b22; }
#header .head_cont .menu li a.first { background: #ff7b22; }
#header .head_cont .menu li:hover a.first { background: #ff7b22; }
#header .head_cont .menu .sub {
position: absolute;
z-index: 1000;
width: 200px;
padding: 0 0;
list-style: none;
background: #005B8A;
top: auto;
left: -9999em;
}
#header .head_cont .menu .sub li a {
display: block;
width: 186px;
height: inherit !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none;
padding: 2px 7px  !important; line-height:20px;
}
#header .head_cont .menu .sub li a:hover { background: #FF7B22 !important; }
#header .head_cont .menu li:hover ul, #header .head_cont .menu li.sfhover ul {
left: auto;
display: block;
}
/* banner */
#banner {
width: 100%;
height: 600px;
margin: 0 auto;
padding: 0px;
position: relative;
}
#banner .slide {
position: absolute;
z-index: 500;
width: 100%;
height: 600px;
padding: 0px;
background: url(../images/bg_slide.png) no-repeat 0 0;
overflow: hidden;
}
#banner .slide ul {
display: block;
width: 100%!important;
height: 600px;
list-style-type: none; overflow:visible!important
}
#banner .slide ul li { display: inline; width: 100%;
height: 600px!important;}
#banner .slide ul li a {
float: left;
display: inline;
width: 100%;
height: 600px;
color: #FFF;
text-decoration: none;
}
#banner .slide ul li a span {
display: block;
    width: 350px;
    max-height: 117px; height:107px;
    padding: 10px 10px 0px 10px;
    position: absolute;
    /* margin-top: 130px; */
    background: #009cde;
    font-size: 26px;
    font-weight: 300;
    bottom: 30px;
    left: 50%;
    margin-left: -470px;
}

.visitez_showroom{    position: absolute;
    z-index: 10000;
    bottom: 30px;
    left: 50%;
    margin-right: -134px; background:url(../images/visitez_showroom.png) no-repeat; width:238px; height:117px;
	}
#banner .service {
float: right;
display: inline;
width: 232px;
height: 176px;
padding: 4px 0 0 40px;
margin: 0 0 0 0;
background: url(../images/bg_service.png) no-repeat 0 0;
color: #FFF;
}
#banner .service h3 {
font-size: 20px;
color: #FF7B22;
}
#banner .service .phone {
height: 27px;
padding: 3px 0 0 37px;
margin: 4px 0 8px 0;
background: url(../images/icon_phone.png) no-repeat 0 0;
font-size: 20px;
font-weight: bold;
}
#banner .service a {
font-size: 13px;
text-decoration: none;
color: #FFF;
display: block;
margin-bottom: 3px;
}
#banner .service a:hover { text-decoration: underline; }
#banner .service .hours {
font-size: 18px;
font-weight: bold;
margin: 5px 0;
}
#banner .service .hours span {
display: block;
color: #BEE2F5;
font-size: 12px;
font-weight: normal;
}
#banner .service .showroom {
width: 140px;
color: #FFF;
font-weight: bold;
display: inline-block;
height: 15px;
margin: 7px 0 0 0;
padding: 1px 0 0 21px;
font-size: 12px;
text-transform: uppercase;
background: url(../images/icon_out2.png) no-repeat 0 0;
}
#banner .service .showroom:hover { text-decoration: none; }
#banner .brl, #banner .brr {
position: absolute;
z-index: 999;
top: 14px;
}
#banner .brl { left: 4px; }
#banner .brr { right: 251px; }
/*nav*/
#nav-cont {
width: 100%;
background: url(../images/bg_nav.jpg) repeat-x top center;
}
#nav {
width: 960px;
height: 25px;
font-size: 11px;
padding: 12px 4px;
margin: 0 auto;
}
#nav a, #nav span { color: #008DD9; }
/* menu 2 */
#menu2-cont {
width: 100%;
background: #ff7b22;
position:relative; padding:10px 0px;
}
#menu2-cont:before {
    background:#ff7b22;
    content: " ";
    display: block;
    height: 100%;
    left: -10000px;
    position: absolute;
    top: 0;
    width: 20000px;
    z-index: -1;
}

#menu2-cont .menu2 {
max-width: 966px;
margin: 0 auto;
width:100%;

}
#menu2-cont .menu2 li {

    position: relative;
    height: 40px;
    line-height: 40px;
    border-radius: 5px;
    width: 20%;
    margin: 0px;
    float: left;
    padding: 0px;

}#menu2-cont .menu2 li li {

  width:100%
}
#menu2-cont .menu2 li a {

 
    color: #FFF;
    text-decoration: none;
    font-size: 14px;
    padding: 0px 0px 0px 30px;
    background: url(../images/puce.png) no-repeat 5px 7px;
    /* white-space: nowrap; */
    display: block;
    line-height: 15px;
    padding-top: 5px;

}

#menu2-cont .menu2 li:hover  {background: #269FE0 ;}

#menu2-cont .menu2 li:hover ul { left: 0; }
#menu2-cont .menu2 li:hover li a:hover,  #menu2-cont .menu2 li.active li.active a {  }
#menu2-cont .menu2 li.active li a {  }
#menu2-cont .menu2 ul {
position: absolute;
left: -999em;
top: 35px;
z-index: 1000;
background: #0072AE;
 -webkit-border-radius: 5px;
-webkit-border-top-left-radius: 0;
-moz-border-radius: 5px;
-moz-border-radius-topleft: 0;
border-radius: 5px;
border-top-left-radius: 0;
}
#menu2-cont .menu2 ul li { float: none; }
#menu2-cont .menu2 ul li a {
float: none;
display: block;
font-weight: normal;
text-transform: none;
white-space: nowrap;
}
/*content*/
#content {
width: 966px;
margin: 0 auto;
}
#center {
float: none;
width: 100%; text-align:justify
}
#center h3, #center h4 {
color: #008DD9;
font-size: 18px;
margin: 0 0 3px 3px;
}
.prods {
width: 100%;
overflow: hidden;
margin-top: 20px; margin-bottom:50px;
}
.prods ul { list-style-type: none; }
.prods ul li {display:block;float:left;width:24%;margin-bottom:20px;margin-right:1%;}
.prods ul li a {
float: left;
display: inline;
height:265px;
margin: 0 5px 10px;
text-align: center;
font-weight: bold;
text-decoration: none;
cursor: pointer;
color: #333; width:100%; text-align:center;
}
.prods ul li a span {
display: block;

margin-bottom: 20px;
background: #FFF;
}
.prods ul li a:hover { color: #008DD9; }
#right {
    float: none;
    width: 100%;
    background: #fe7b21;
    position: relative;
    color: #fff;
    padding: 20px 0px;
    max-width: 990px;
    margin: 0 auto;
}
#right:before {
    background:#fe7b21;
    content: " ";
    display: block;
    height: 100%;
    left: -10000px;
    position: absolute;
    top: 0;
    width: 20000px;
    z-index: -1;
}
float: none;
    width: 100%; background:#fe7b21; position:relative
}
#left {
float: left;
width: 212px;
margin-right: 35px;
}
#right h3, #right h4, #left h3, #left h4 {
color: #008DD9;
font-size: 18px;
margin: 0 0 3px 3px;
}
.box1 {
border: 1px solid #DFDFDF;
padding: 10px;
margin-bottom: 15px;
background: #FFF;
}
.box1.recherche { 
    padding: 20px 0px;
    float: right;
    margin-left: 10px;
    border: none;}
.box1.recherche input[type=text] { float: left; width:385px; height:38px; line-height:38px; text-indent:10px; background:#f5f5f5; border:none; padding:0px }

.box1.recherche .ok {
float: right;
}
.box1.cms { }
.box1.cms p { margin-bottom: 20px; }
.box1.cms p:last-child { margin-bottom: 0; }
.box1.cms ul { margin-bottom: 20px; }
.box1.cms ul:last-child { margin-bottom: 0; }
.box1.cms ul li {
margin-bottom: 5px;
background: url(../images/arrow1.gif) no-repeat 0 5px;
padding-left: 9px;
}
.map { text-align: center; }
.list1 { list-style-type: none; }
.list1 li {

}
.list1 li a {
color: #666;
text-decoration: none;
font-weight: bold;
}
.list1 li a:hover { text-decoration: underline; }
.list1 li.client {
font-weight: bold;
color: #FF7B22;
font-style: italic;
font-size: 12px;
padding: 0;
background: none;
margin-bottom: 10px;
}
.list2 {
list-style-type: none;
text-align: center;
}
.list2 li {
padding: 0 0 20px 0;
margin-bottom: 15px;
border-bottom: 1px solid #DDDDE4;
overflow: hidden;
}
.list2 li.last {
border: none;
margin-bottom: 0;
}
.list2 li a {
text-decoration: none;
font-weight: bold;
cursor: pointer;
color: #333;
}
.list2 li a:hover { color: #008DD9; }
.list2 li a .title {
display: block;
margin: 5px 0;
}
.list2 li a .prix {
float: left;
font-size: 14px;
color: #008DD9;
text-align: center;
width: 90px;
}
.list2 li a .old_prix {
float: right;
color: #999;
text-decoration: line-through;
font-weight: normal;
font-size: 14px;
text-align: center;
width: 90px;
}
.list2 li a .designation {
float: left;
display: block;
width: 200px;
font-weight: normal;
text-decoration: underline;
margin-top: 14px;
text-align: center;
font-size: 11px;
}
.list2 li a:hover .designation { color: #333; }
.list3 { list-style-type: none; }
.list3 li {
margin: 0 0 3px 0;
font-weight: bold;
color: #333;
font-size: 12px;
text-transform: uppercase;
}
.list3 ul { margin: 3px 0 15px 0; }
.list3 ul li {
padding: 0 0 0 8px;
background: url(../images/arrow1.gif) no-repeat 0 5px;
color: #666;
text-transform: none;
}
.list3 ul li a {
color: #666;
text-decoration: none;
font-weight: normal;
}
.list3 li li a:hover { text-decoration: underline; }
.list3 li li:last-child,  .list3 li:last-child ul:last-child { margin-bottom: 0; }
.home #center { width: 510px; }
.home #center p { margin: 0 0 15px 0; }
.home #center .box1 { height: 257px; }
.home #right { width: 441px; }
.home #right .fl, .home #right .fr { width: 215px; }
.home #right .box1 { min-height: 90px; }
.home #right .buletin input {
float: left;
margin-top: 10px;
}
.home #right .buletin .inp1 {
margin-right: 4px;
width: 132px;
}
.home #right .promo .prix {
font-weight: bold;
color: #269FE0;
}
.home #right .promo .old_prix {
text-decoration: line-through;
color: #999;
}
.table1, .table2 { margin: 25px auto 10px auto; }
.table1 th {
padding: 3px 2px !important;
text-align: right;
}
.table1 td { padding: 3px 3px !Important; }
.table1.contact .inp1, .table1.contact .inp2, .table1.login .inp1 { width: 250px; }
.table1.contact .inp2, .table1.livraison .inp2 { height: 100px; }
.table1.enregistrer .inp1,  .table1.enregistrer select { width: 188px; }
.table1.livraison .inp1, .table1.livraison .inp2 { width: 230px; }
.table1.livraison select { width: 238px; }
.table1.recapitulatif { margin: 0 auto 25px auto; }
.table1.resume { margin: 0 0 0 0; }
.table2.panier { margin: 0 auto; }
.table2 td, .table2 td.none {
padding: 5px 4px;
text-align: center;
border-bottom: 1px solid #EDEDF1;
}
.table2 th {
padding: 5px 4px;
background: #EDEDF1;
}
.table2 td.none { border: none; }
.table2.panier .inp4 {
width: 35px;
text-align: center;
}
.table2.panier .inp5 {
width: 170px;
padding: 1px;
}
.table2.prod_detail, .table2.commandes { margin: 0; }
.table2.prod_detail .last td, .table2.commandes .last td { border: none; }
.table2.commandes .total {
color: #FF7B22;
font-weight: bold;
background: #EDEDF1;
}
.table2.adresse { margin: 30px 0 0 0; }
.table2.adresse td {
text-align: left !important;
border: none;
}
/*radius*/
.prods ul li a span, .box1 {
z-index: 1;
position: relative;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
behavior: url(pie.htc);
}
.prods ul li a span {height:225px;overflow:hidden;border:1px solid #dfdfdf;width:225px;}
/*footer*/
#footer {
width: 962px;
margin: 15px auto 10px auto;
padding: 8px 2px;
font-size: 11px;
border-top: 1px solid #CCC;
}
#footer a {
font-weight: bold;
text-decoration: none;
color: #008DD9;
}
#footer a:hover { text-decoration: underline; }
#footer .fr span {
float: left;
margin: 5px 5px 0 0;
}
/*hacks*/
*+html #header .head_cont .menu .sub { left: -1px; }
*+html #header .head_cont .menu .sub li a { height: auto; }
*+html #header .head_cont .menu .sub { display: none; }
/*items*/
.cleaner { clear: both; }
.fl { float: left; }
.fr { float: right; }
.b { font-weight: bold !important; }
.uc { text-transform: uppercase !important; }
.ac { text-align: center !important; }
.al { text-align: left !important; }
.ar { text-align: right !important; }
.un { text-decoration: underline !important; }
.f10 { font-size: 10px !important; }
.f11 { font-size: 11px !important; }
.f12 { font-size: 12px !important; }
.f13 { font-size: 13px !important; }
.f14 { font-size: 14px !important; }
.f15 { font-size: 15px !important; }
.f16 { font-size: 16px !important; }
.f18 { font-size: 18px !important; }
p, ul, dd, dt, li, form, table, tr, td, h1, h2, h3, h4, h5 {
margin: 0px;
padding: 0px;
}
ul { list-style-type: none; }
table { border-collapse: collapse; }
img {
vertical-align: middle;
border: 0px;
}
a {
color: #269FE0;
outline: 0 none;
font-weight: normal;
}
a:hover { text-decoration: none; }
input, select, textarea, button {
font: 12px Arial, Helvetica, sans-serif;
color: #333;
}
textarea { overflow: auto; }
select { padding: 2px; }
.inp1, .inp2 { padding: 3px 3px; }
.orange { color: #FF7B22; }
.space { margin-top: 5px; }
.space2 { margin-top: 15px; }
.white { color: #FFF; }
.red {
color: #ff0000;
font-weight: bold;
text-align: center;
}
.prod_image {
float: left;
margin: 0 15px 15px 0;
}
.help { cursor: help; }
.status-info { margin: 20px 0; }
.status-info li {
display: block;
width: 200px;
height: 16px;
margin: 0 0 5px 0;
overflow: hidden;
}
.status-info li img,  .status-info li span { float: left; }
.status-info li span { margin: 0 0 0 5px; }
.pinky {
left: 230px;
position: absolute;
z-index: 1000;
}
.legend {
float: right;
width: 225px;
}
/* Clearfix */
.clearfix:after {
content: ".";
display: block;
height: 0;
font-size: 0;
clear: both;
visibility: hidden;
}
.clearfix { display: inline-block; }
* html .clearfix { height: 1px; }
.clearfix { display: block; }
*+html .clearfix { clear: both; }
.like-buttons {
position: absolute;
left: 0;
text-align: right;
top: 9px;
}
.left_link {
float: left;
padding-top: 9px;
height: 40px;
}
.left_link li {
float: left;
margin-right: 10px;
color: #fff;
height: 20px;
}
.left_link li a {
text-decoration:none;
color: #fff;

}
.icon_tel {
background: url(../images/icon_tel.png) no-repeat 0 0;
padding-left: 30px; line-height:18px; font-size:24px;
}
.icon_email {
background: url(../images/icon_email.png) no-repeat 0 0;
padding-left: 30px
}
.icon_facebook {
background: url(../images/icon_facebook.png) no-repeat 0 0;
display: block;
height: 20px;
width: 20px
}
.icon_twitter {
background: url(../images/icon_twitter.png) no-repeat 0 0;
display: block;
height: 20px;
width: 20px
}
.icon_gplus {
background: url(../images/icon_googleplus.png) no-repeat 0 0;
display: block;
height: 20px;
width: 20px
}
#center h2 { color:#262530; font-size:30px; font-weight:600; letter-spacing:-0.5px}

#center h3 { color:#ff7b22; font-size:17px; font-weight:400; margin-bottom:20px}

#center .prods h3 {
    color: #009cde;
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 20px;
}

.actu { float:left; width:31%}
.promos { float:right; width:65%}
.actu .list1 li a { 
    color: #fff;
    font-weight: 400;
    background: url(../images/puce.png) no-repeat 0px center;
    padding: 5px 0px 5px 20px;
    display: block; }


#right .actu h3,  #right .promos h3{     color: #fff;
    padding-bottom: 20px;
    font-size: 24px;
    font-weight: 300;}

#right .blockpromos { background:#fff; border-radius:3px; padding:10px;}


#right .blockpromos .list2 li {
  
      margin-bottom: 15px;
    border-bottom: none;
    overflow: hidden;
    float: left;
    width: 31%;
    min-height: 178px;
    padding: 0px 1% 5px;
}
.block_img { height:140px; overflow:hidden}


.blockpromos .list2 li a .title {
    display: block;
    margin: 0px 0 5px;
    min-height: 35px;
}
.home_presentation { background:url(../images/energy.jpg) no-repeat right top}

hr { border:0px; height:1px; background:#333; margin-bottom:20px}

@media (max-width: 767px) {
   
   #header .head_cont , #content{
    width: 100%;
   
}

.left_link {
   
       float: none;
    padding-top: 9px;
    height: 69px;
    background: #0094de;
    padding: 0px 15px;
    width: 100%;
}

#header .head_cont .links {
       float: none;
    height: 26px;
    text-align: right;
    margin: 0;
    clear: both;
    background: #0094de;
    border-top: 2px solid #0086db;
    padding-top: 7px;
}
#center {
    float: none;
    width: 90%;
    text-align: justify;
    padding: 0px 5%;
}
.home_presentation {
     background: none; 
}

.prods ul li {
    display: block;
    float: none;
    width: 90%;
    margin:0px 5% 20px;
}

.actu {
    float: none;
    width: 100%;
}

.promos {
    float: none;
    width: 100%;
}

#center h2 , 
#center h3,

#center h4 { text-align:center }


#right .blockpromos .list2 li {

    float: none;
    width: 100%;
  
}

.box1.recherche .ok {
    float: right;
    width: 20%;
    background: #fe7b21;
    height: 39px;
}
#menu2-cont .menu2 {
    width: 100%;
    margin: 0 auto;
}


nav + * {
		position: relative;
	}

	/* Theming opened nav */	
	nav ul {		
		
		/* maximum height */
		max-height: 25em;

		/* translate with hardware acceleration */
		-webkit-transform: translateZ(0); 
		-ms-transform: translateZ(0);
		        transform: translateZ(0);
		-webkit-transition: max-height .4s;
		        transition: max-height .4s;
		will-change: max-height;

		/* global styles */
		margin: 0;
		padding: 0;
		list-style: none;
	}
	nav a {
		display: block;
		padding: 1.2rem;
		color: #333;
		background: #fff;
		text-decoration: none;
		margin-bottom: 2px;
	}
	nav a:hover, 
	nav a:focus,
	nav a:active
	{
		background: #eee;
	}
	
	/* Theming closed nav */
	nav.is-closed ul {
		max-height: 0;
		overflow: hidden;
	}

	/* Global styling nav button */	
	nav > button {
		position: absolute;
			top: .8rem; right: 1rem;
		z-index: 1;
		height: 4rem; width: 4rem;
		background-color: transparent;
		padding: 0;
		outline: 0;
		border: 1px solid #333;
		border-radius: 50%;
		cursor: pointer;
		-webkit-tap-highlight-color:rgba(0,0,0,0);
		-webkit-transition: -webkit-transform .2s;
		        transition: transform .2s;
	}
	
	/*  Removing Firefox's dotted outline on button */	
	nav > button::-moz-focus-inner {
		border: 0;
	}
	
	nav > button::after, nav > button::before {
		content: "";
		position: absolute;
		top: 15%; right: 40%; bottom: 15%; left: 40%;
		background-color: #333;
		border-radius: 10px;
		-webkit-transition: -webkit-transform .2s;
		        transition: transform .2s;
	}
	nav > button::before {
		top: 40%; right: 15%; bottom: 40%; left: 15%;
	}
	
	
	/* Theming opened nav button */	
	nav:not(.is-closed) > button,
	nav:not(.is-closed) > button::before {
		-webkit-transform: rotate(90deg) translateZ(0);
		-ms-transform: rotate(90deg) translateZ(0);
		        transform: rotate(90deg) translateZ(0);
	}

	/* Hide alternate text except from screen readers */
	.visually-hidden {
		position: absolute !important;
		clip: rect(1px, 1px, 1px, 1px);
		overflow: hidden;
		height: 1px;
		width: 1px;
	}
}