body{background:#fff;font-size:12px;}
a{text-decoration:none!important;}

.titleHome{
	background:#f0f0f0;
	border-top:2px solid #4399f0;
	margin:0 0 20px 0;
	padding:30px 0;
}
.titleHome > h1{
	color:#757575;
	font-size:18px;
	font-weight:bold;
	text-align: center;
	text-transform:uppercase;
}
.titleHome > h2{
	color:#9f9fa3;
	font-size:14px;
	text-align: center;
}

.wrap{margin:50px auto;width:100%;}

/* SIDE NEWS */
.blockNews{margin:0 auto 30px;min-height:250px;min-width:175px;width:calc(100% - 10px);}
.blockNews > #border{border: 1px solid rgba(57, 130, 204, 0.7);border-top:0;margin:5px auto 0;width:calc(100% - 10px);}
.blockNews .headAnnonce{background-color:#bbdaee;box-shadow: 0px 0px 1px 0px rgba(0,117,135,1);padding:0 5px;height:26px;}
.blockNews .headAnnonce > h3{background-color:#fff;border:1px solid #d7d8d9;border-top:3px solid #4399f0;border-radius:1px;color:#757575;
							   display:inline-block;font-size:14px;font-weight:bold;margin:0;padding:5px;position:relative;top:-3px;min-width:50%;}
.fa-ellipsis-v{font-size:10px;margin:0 5px;position:relative;top:-1px;}
.blockNews .headAnnonce > span{float:right;margin:0;padding:2px;}
.fa-newspaper{color:#4399f0;font-size:18px;position:relative;top:1px;}

.blockNews .list{border-top: 1px solid rgba(57, 130, 204, 0.7);padding:5px;}
.blockNews .list > p{background-color:#ecf8ff;border:1px solid #bbdaee;color:#505050;font-size:10px;text-align:justify;padding:5px 5px;}

#newsL, #newsR{color:#333333;display:inline-block;font-size:14px;}
#newsL{border:1px solid #4399f0;border-radius:10%;font-weight:bold;overflow:hidden;text-align:center;width:40px;}
#newsL > span{display:block;}
#newsL > span:first-child{color:#4399f0;}
#newsL > span:last-child{background-color:#4399f0;color:#e8eef0;font-weight:bold;}

#newsR{background-color:#f7f8f9;border:1px solid#d7d8d9;max-height:42px;position:relative;vertical-align:top;width:calc(100% - 43px);}
#newsR h4{border-bottom:1px solid #d7d8d9;color:#7c7c7c;font-size:9px;font-weight:bold;margin-top:2px;min-height:18px;}
#newsR > .arrow{border-bottom:20px solid transparent;border-left:5px solid #4399f0;border-top:20px solid transparent;float:left;height:0;margin:0 5px 0 0;width:0;}
#newsR > span{bottom:0;color:#1087b3;font-size:9px;font-style:italic;padding:0 0 3px 0;position:absolute;}



/* SIDE ÉTAT */
.blockEtat{border-radius:3px;margin-bottom:30px;min-width:175px;width:calc(100% - 10px);}
.blockEtat .headEtat{background-color: rgba(57, 130, 204, 0.7);border-bottom:3px solid #0572df;padding:5px;}
.blockEtat .headEtat > h3{color:#fff;font-size:14px;font-weight:bold;margin:0;text-shadow: 0 0 1px #000;}
.fa-tags{font-size:10px;margin:0 5px;position:relative;top:-1px;}

.blockEtat > .row{margin:0 auto;width:100%;}
.blockEtat .etat{border:1px solid #d7d8d9;margin:0;padding:0;}
.blockEtat .etat:first-child{border-right:0;}
.blockEtat .list:not(:last-child), .blockEtat #headSub{border-bottom:1px solid #d7d8d9;}

.blockEtat #headSub{background:#f7f8f9;color:#757575;font-size:14px;font-weight:bold;text-align:center;}
#etatSub > .list{color:#505050;font-size:12px;padding:3px 10px;}
#etatSub > .list > i > a{color:#505050;margin-left:5px;text-decoration:none;transition-duration:.5s;transition-timing-function:ease-out;}
#etatSub > .list > i > a:hover{color:#4399f0;}
.fa-arrow-alt-circle-right{font-size:14px;position:relative;vertical-align: middle;}

/* SIDE GROUPE */
.blockGroup{border-radius:3px;margin-bottom:30px;min-width:175px;width:calc(100% - 10px);}
.blockGroup .headGroup{background-color: rgba(57, 130, 204, 0.7);border-bottom:3px solid #0572df;padding:5px;}
.blockGroup .headGroup > h3{color:#fff;font-size:14px;font-weight:bold;margin:0;text-shadow: 0 0 1px #000;}
.fa-tags{font-size:10px;margin:0 5px;position:relative;top:-1px;}

.blockGroup > .row{margin:0 auto;width:100%;}
.blockGroup .group{border:1px solid #d7d8d9;margin:0;padding:0;}
.blockGroup .group:nth-child(2){border-left:0;border-right:0;}
.blockGroup .list:not(:last-child), .blockGroup #headSub{border-bottom:1px solid #d7d8d9;}

.blockGroup #headSub{background:#f7f8f9;color:#757575;font-size:14px;font-weight:bold;text-align:center;}
#groupSub > .list{color:#505050;font-size:12px;padding:3px 10px;}
#groupSub > .list > i > a{color:#505050;margin-left:5px;text-decoration:none;transition-duration:.5s;transition-timing-function:ease-out;}
#groupSub > .list > i > a:hover{color:#4399f0;}
.fa-arrow-alt-circle-right{font-size:13px;position:relative;vertical-align:middle;}



.border-separator{margin:50px 0;border:1px solid #757575;}
.prodCard{height: 260px;width:303px;}
.nr_h3, .bs_h3{color:#757575;font-weight:bold;margin-bottom:10px;text-align:center;text-transform:uppercase;width:100%;}
.old-price{color:red;text-decoration: line-through;}
.new-price{color:green;font-size:14px;}
.unitTitle{
	background: linear-gradient(to top, #0572df 50%, #fff 50%);
    background-position:top left;
    background-size: 100% 200%;
	border-bottom: 3px solid #0572df;
	color:#fff;
	font-weight:bold;
	margin-bottom:3px;
	padding-top:2px;
	text-align:center;
    transition:all .2s ease;
	width:100%;
}
.unitTitle > span{font-size:14px;}
.unitPic{
	background-color:#f3f3f3;
	height:200px;
	line-height: 200px;
	overflow-y:hidden;
	position:relative;
}
#panelInfo > span{
	background-color:rgba(5,114,223,.8);
	color:#fff;
	font-size:11px;
	left:-20px;
	line-height: normal;
	opacity:0;
	padding:3px 10px;
	position:absolute;
	text-shadow:1px 1px 2px #000;
	transition:all .5s ease;
}
#panelInfo > span:first-child{left:5px;top:20%;}
#panelInfo > span:nth-child(2){left:5px;top:35%;}
#panelInfo > span:nth-child(3){left:5px;top:50%;}
#panelInfo > span:last-child{left:5px;top:65%;}

.unitFoot{
	padding-top:10px;
	position:relative;
}
.unitFoot span{
	position:absolute;
	font-weight:bold;
}
.unitFoot span:first-child{
	max-width:200px;
	padding:5px 0;
	left:0;
}
.unitFoot span:last-child{
	background-color:#4399f0;
	border-radius:5px;
	color:#fff;
	
	padding:5px 10px;
	right:0;
}


@media screen and (max-width:768px){
	.row > div{
		margin:20px 0;
		width:303px;
	}
	.blockEtat .etat:first-child {
		border-right: 1px solid #d7d8d9;
	}
	.blockGroup .group:nth-child(2) {
		border-left: 1px solid #d7d8d9;
		border-right: 1px solid #d7d8d9;
	}
}
@media screen and (max-width:576px){
	.row > div{
		width:100%;
	}
	.blockEtat .etat:first-child {
		border-right: 1px solid #d7d8d9;
	}
	.blockGroup .group:nth-child(2) {
		border-left: 1px solid #d7d8d9;
		border-right: 1px solid #d7d8d9;
	}
}











































@media screen and (min-width:768px) and (max-width:1120px){	
	.wrap{width:calc(100% - 20px);}
}


@media screen and (max-width:530px){	
	.wrap{width:calc(100% - 20px);}
}
