@import url('general.css');
/* CSS Document */

/* bloc categorie */
.categorie{ margin-top:2em; clear:both;}
.categorie ul > li{ display:inline-block; vertical-align:middle; width:84%}
.categorie ul > li:first-child{ width:15%; height:7.8em; background:url(../images/cat_list.png) top left no-repeat}
.categorie ul h3{ font-family:'RobotoLight'; font-size:1.5em; color:#FFFFFF; margin:7% 10%; font-weight:normal}
.categorie ul li h3 span{ font-size:1.1em;}
.categorie ul li h3 strong{ color:#0476BD; font-weight:normal}

#list-cat{ margin:0 1em}
#list-cat > li{ display:inline-block; vertical-align:middle; margin:0 1em; width:17%}
#list-cat > li figure{ text-align:center}
#list-cat > li figcaption{ text-transform:uppercase; color:#333333; font-size:1.2em;}
#list-cat > li a:hover figcaption{ color:#078BDD}


/* bloc brands */
.brands{ margin-top:2em; clear:both;}
.brands h3{font-family:'RobotoLight'; font-size:14px; color:#FFFFFF; margin:1.4em; font-weight:normal; margin:0 auto; padding:0em 1em;
height: 0;line-height:17px;
   /*width: 80px;*/
   border-bottom: 20px solid #000;
   border-left: 15px solid transparent;
   border-right: 15px solid transparent;
width:290px; text-align:center;
width:max-content; 
width:-moz-max-content; 
width:-webkit-max-content; 
width:-o-max-content; 
-webkit-border-top-left-radius: 50px;
-webkit-border-top-right-radius: 50px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 50px;
border-top-right-radius: 50px;

}
.brands h3 span{ font-size:13px;}
.brands h3 strong{ color:#0476BD; font-weight:normal}

.contentNews{ position:relative;}
a.prev, a.next{display: block; height: 5.1em; text-decoration: none; width: 4.5em; position:absolute; top:1.3em; z-index:999;}
a.prev{ background: left 0 url(../images/fleche.png) no-repeat; opacity:1;}
a.next{ background: right 0 url(../images/fleche.png) no-repeat;  opacity:1; right:0}
a:hover{ opacity:0.8;}
div.carousel{ border:1px solid #BBBBBB; padding:0 1.5em; margin:0 auto; z-index:1; height:69px!important; max-width:938px!important; width:100%!important;
-moz-border-radius: .5em;
-webkit-border-radius: .5em;
-o-border-radius: .5em;
border-radius: .5em;

}
div.carousel ul{}
div.carousel ul li{ display:inline-block; vertical-align:middle; width:8.4%; height:5em; text-align:center; margin:0 2.7em; padding:1em 0; line-height:7.2em}
div.carousel ul li a{}
div.carousel ul li img{ max-height:5em;}

/* other */
.other{ margin-top:2em;}
.other > *{ display:inline-block; vertical-align:top}
.other > aside{ width: 24%; }
.other > div{ width: 73%; float:right; margin-bottom:2em}

/* page liste */
.contentList{ width: 73%;}
.contentList h2{font-family:'RobotoLight'; font-size:2.7em; color:#080A09; font-weight:normal}
.contentList h2 b{ color:#0078BD}
.contentList ul li{ width:22%; float:left; margin:1.5em 0em .5em; padding:.5em .9em;}
.contentList ul li img{ /*width:100%*/ position:relative}
.contentList ul li a{ color:#000; font-size:1.1em; line-height:130%}
.contentList ul li figcaption{ height:6.5em; overflow:hidden}
.contentList ul li a:hover b{ color:#0B96EB}
.contentList ul li span a{ display:inline-block; width:100%; height:2em; border:1px solid #02466D; margin-top:.5em; text-align:center; color:#FFFFFF; text-transform:uppercase; font-size:11px; line-height:2em;
background:#0075BA;
background:-webkit-gradient(linear, left top, left bottom, from(#0075BA), to(#004D7B));
background:-ms-linear-gradient(top, #0075BA 0%, #004D7B 100%);
background :-moz-linear-gradient(top, #0075BA 0%, #004D7B 100%);
-pie-background: linear-gradient(#0075BA, #004D7B);
box-shadow:rgba(50, 50, 50, 0.5) .0em .0em .2em;/*inset*/
-moz-box-shadow:rgba(50, 50, 50, 0.5) .0em .0em .2em;/*inset*/
-webkit-box-shadow:rgba(50, 50, 50, 0.5) .0em .0em .2em;/*inset*/
-o-box-shadow:rgba(50, 50, 50, 0.5) .0em .0em .2em;/*inset*/
box-shadow:rgba(50, 50, 50, 0.5) .0em .0em .2em;/*inset*/
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
-o-border-radius: .3em;
border-radius: .3em;

}
.contentList ul li span a:hover{
background:#004D7B	;
background:-webkit-gradient(linear, left top, left bottom, from(#004D7B), to(#004D7B));
background :-moz-linear-gradient(top, #004D7B 100%, #004D7B 100%);
background :-ms-linear-gradient(top, #004D7B 0%, #004D7B 100%);
}
.contentList ul li{ border-left:1px solid #FCFCFC; border-right:1px solid #D2D2D2}
.contentList ul li:first-child, .contentList ul li:nth-of-type(5){ border-left:none}
.contentList ul li:last-child, .contentList ul li:nth-of-type(4){ border-right:none}
.contentList ul li p{ display:block; /*! height:13.8em; */ overflow:hidden; margin-bottom:1em; position:relative}
.contentList ul li p img.offre{ position:absolute; left:2px; top:auto!important; bottom:0px!important;}


.contentList footer{ text-align:right; clear:both	}
.contentList footer a{ display:inline-block; font-size:11px; color:#080A09; padding:.6em .8em; background-color:#fff; border:1px solid #B2B2B2;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
-o-border-radius: .3em;
border-radius: .3em;

}
.contentList footer a:hover, .contentList footer a.active{ color:#FFF; padding:.6em .8em; background-color:#080A09; border:1px solid #080A09;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
-o-border-radius: .3em;
border-radius: .3em;

}

.contentNews{
   border: 1px solid #bbbbbb;
   border-radius: 0.5em;
   overflow: hidden;
}