
/* ----------------------------------------------------------------
	Custom CSS
-----------------------------------------------------------------*/
@import url("dark-custom.css");
@import url("fonts-custom.css");
@import url("colors-custom.css");



/*-------------STRUCTURE-------------*/
.css3-spinner { background-color:#be1522}
body {background-color: #fff;}
body { color:#474746}


.text-color { color:#be1522}

/*-------------HEADER-------------*/
#top-bar {border: none !important; }
#top-bar > div { padding-right: 0}
#top-bar .top-links { background-color: #ececec; padding-right: 60px}
#top-bar .top-links ul {padding: 0 30px;}
#top-bar .top-links li { border: none !important}
#top-bar .top-links li a { font-weight: 400; letter-spacing: 1px}
#top-bar .top-links li a:hover {color:#000}
#top-bar .top-links li:not(.reseaux) i {
    margin-right: 0;
    position: relative;
    right: -10px;
	color:#be1522;
}
#top-bar .top-links li.reseaux i { font-size: 20px; margin: 0}
#top-bar .top-links li.reseaux a:hover i { color:#fff}

.header-extras h4 { color:#a5a4a4; letter-spacing: 2px; font-weight: 400;display: inline-block;}
.header-extras h4 strong { color:#be1522}
.header-extras img.certications { margin-left: 20px; margin-top: -20px}

#header.sticky-style-2 {height: 160px;}

#primary-menu {
    border: none !important;
    background-color: #be1522;
	height: 60px;
}

#primary-menu ul li a { color: #fff}
#primary-menu ul li a:hover,
#primary-menu ul li.current > a { color:#fff !important; background-color: #000}

.displaymobile { display: none}

/*-------------CONTENT-------------*/
.container {max-width: 90%}

#content {border-top: 2px solid #000;}
#content p {text-align: justify;}

.lien-texte { font-weight: bold; border-bottom: 1px dotted}

.title-block .line { margin: 10px 0}
.title-block h2 { text-transform: uppercase; color:#be1522}
.title-block > span {color: #000;font-weight: 700;}

#page-title { padding: 250px 0}
#page-title h1 {
    font-weight: 700;
    letter-spacing: 3px;
    font-size: 40px;
    text-transform: uppercase;
}

blockquote {
    padding: 10px 20px 10px 30px;
    font-size: 14px;
    border-left: 5px solid #be1522;
    text-align: justify;

}
blockquote ul {
    padding-left: 15px;
    list-style: square;
}


/*Accueil*/
#slider h2 {
    bottom: 10px;
    right: 0;
    position: absolute;
    margin-bottom: 0;
    text-transform: uppercase;
    letter-spacing: 4px;
    font-size: 28px;
	color: #be1522;
}

#liste-activites .portfolio-item { width: 100%;}

#liste-activites .portfolio-item > a {
    border: 1px solid #ddd;
    display: block;
    text-align: center;
}
#liste-activites .portfolio-image { padding-bottom: 30px; background-color: rgba(0,0,0,0.1)}
#liste-activites h3 {
	text-transform: uppercase;
    position: absolute;
    bottom: 15px;
    display: inline-block;
    margin: auto;
    width: 100%;
	left: 0;
	height: 30px;
	line-height: 30px;
	z-index: 10;}
#liste-activites h3 span { background-color: #be1522; width: 80%; display: block; margin: auto; font-size: 13px; color:#fff; line-height: 18px;
  padding-top: 5px;
  padding-bottom: 5px; }

#liste-activites .portfolio-overlay { height: calc(100% - 30px); }


#liste-activites .portfolio-desc {padding: 10px;}
#liste-activites .portfolio-desc span {
    display: block;
    margin-top: 0;
    max-width: 250px;
    margin: auto;
}

#liste-activites .pub {
    border: 1px solid #ddd;
    display: block;
    text-align: center;
	margin: 0 12px 12px 0;
	padding: 20px;
}

.degrade {background: -moz-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a000000', endColorstr='#00000000',GradientType=0 );}

#liste-activites .portfolio-item a,#liste-activites .pub { height: 350px}
@media (max-width: 1800px) {
	#liste-activites .portfolio-item a,	#liste-activites .pub { height: 310px}
}
@media (max-width: 1600px) {
	#liste-activites .portfolio-item a,	#liste-activites .pub { height: 290px}
}
@media (max-width: 1500px) {
	#liste-activites .portfolio-item a,	#liste-activites .pub { height: 270px}
	#liste-activites .pub p { font-size: 12px !important}
	#liste-activites .pub h2 { font-size: 20px !important}
	#liste-activites .pub a.button { font-size: 10px !important}
}
@media (max-width: 1400px) {
	#liste-activites .portfolio-item a,	#liste-activites .pub { height: 250px}
	#liste-activites h3 span {
		font-size: 13px;
		padding: 5px 10px;
		line-height: 18px;}
	#liste-activites .portfolio-desc span {font-size: 12px;line-height: 15px;}	
}
@media (min-width: 992px) and (max-width: 1199px) {
	#liste-activites .portfolio-item a,	#liste-activites .pub { height: 270px}
}
@media (min-width: 768px) and (max-width: 991px) {
	#liste-activites .portfolio-item a,	#liste-activites .pub { height: 370px}
	#liste-activites .portfolio-desc span {font-size: 13px;line-height: 17px;}
}
@media (max-width: 767px) {
	#liste-activites .portfolio-item a,	#liste-activites .pub { height: auto;}
	#liste-activites .portfolio-item {padding-right: 0}
	#liste-activites .pub {margin-right: 0}
}
.legende {text-align: center !important; line-height: 14px !important; font-size: 11px; padding: 5px; background-color: #eee;}

/*Galerie d'images*/
.section {background-color: #eee;}
.portfolio .portfolio-item { width: 20%}
.portfolio-overlay a.left-icon { margin-left: -20px;}
.mfp-counter { display: none}

/*Bloc pub*/
.bloc-pub { background-color: #be1522; padding: 20px; color:#fff; text-align: center}

/*Video*/
.lien-video {display: block; position: relative; border: 1px solid;}

/*boutons*/
.button.button-border {border: 1px solid #000;color: #000;}

/*Logo des partenaires*/
.partenaires { border: 1px solid #eee; margin-bottom: 10px; margin-top: 10px}

/*Formulaire*/
#contact-form .col_full,
#contact-form .col_half { margin-bottom: 10px}
.sm-form-control {
    padding: 5px 14px;
    font-size: 13px;
	border-width: 1px;
	background-color: rgba(0,0,0,0.03)}
label { margin-bottom: 5px}

.contact-widget .rgpd {
    font-size: 10px;
    color: #ccc;
    line-height: 1 !important;
    letter-spacing: -0.1px;
    margin-top: 10px;
	margin-bottom: 5px;
    max-width: none;
	}
.contact-widget .rgpd a {color: #ccc;}
.contact-widget .mention { font-size: 10px;color: #999;margin-bottom: 10px;}

/*Slider*/
.flex-prev, .flex-next { top: auto; bottom: 0;}

/*Maps*/
#google-map {border: 2px solid #fff;}

/*pop/up*/
.mention-ajax-modal {
    position: relative;
	width:  1000px !important;
    margin: 0 auto;
}
.mention-ajax-modal .modal-padding {background-color: #fff;}

.mfp-bottom-bar { display: none}
.ajax-modal-title {padding: 5px 20px;;background-color: #000 !important;}
.ajax-modal-title h2 {font-size: 20px; font-weight: normal; letter-spacing: 2px; color: #fff;}
.mention-ajax-modal p,
.mention-ajax-modal a { color: #000 !important}

/*-------------FOOTER-------------*/
#footer {background-color: #be1522 !important; border-top: 2px solid #000 !important;}
#copyrights {padding: 15px 0; color: #fff !important; letter-spacing: 1px;}
#copyrights a {color: #fff !important;}
#copyrights a:hover { border-bottom: 1px dotted}
#copyrights .mentions a {font-size: 11px;}
/* ----------------------------------------------------------------
	Contenu Responsive 
-----------------------------------------------------------------*/


@media (min-width: 1600px) {
}

@media (max-width: 1700px) {		
	/*HEADER*/
	/*CONTENT*/
	/*FOOTER*/
}

@media (max-width: 1600px) {		
	/*HEADER*/
	/*CONTENT*/
	#page-title { padding: 200px 0}
	/*FOOTER*/
}
@media (min-width: 1400px) and (max-width: 1600px) {
	/*HEADER*/
	#primary-menu ul li a { font-size: 11px; letter-spacing: 0px;}
	.header-extras h4 { font-size: 16px}
	/*CONTENT*/	
	/*FOOTER*/
}

@media (max-width: 1400px) {		
	/*HEADER*/
	#primary-menu .container-fullwidth { padding-left: 20px; padding-right: 20px}
	/*CONTENT*/
	#page-title { padding: 160px 0}
	/*FOOTER*/
}

@media (min-width: 1200px) and (max-width: 1399px) {
	/*HEADER*/
	#primary-menu ul li a { font-size: 11px; letter-spacing: 0px; padding-left: 10px; padding-right: 10px}
	.header-extras h4 { font-size: 14px}
	#logo img { height: 80px; margin: 10px 0}
	
	/*CONTENT*/
	/*FOOTER*/
}



@media (max-width: 1024px) {
	/*HEADER*/	
	/*CONTENT*/
	#page-title { padding: 120px 0}
	#page-title h1 { font-size: 30px}
	.mention-ajax-modal {width:  100% !important;}
	.mention-ajax-modal .modal-padding { padding: 10px}
	/*FOOTER*/
}

@media (min-width: 992px) and (max-width: 1199px) {
	/*HEADER*/
	#primary-menu ul li a { font-size: 10px; letter-spacing: 0.3px; padding-left: 8px; padding-right: 8px}
	.header-extras h4 { font-size: 12px; letter-spacing:1px }
	#logo img { height: 70px; margin: 15px 0}
	.header-extras img.certications {margin-left: 10px; height: 40px;}
	#top-bar .top-links li a { font-size: 10px}
	.header-extras img.certications { margin-top: 0}
	/*CONTENT*/
	/*FOOTER*/
}



@media (max-width: 991px) {
	/*HEADER*/
	#top-bar { display: none}
	#logo img { height: auto;}
	#header-wrap {background-color: #be1522}
	#primary-menu { height: auto}	
	#primary-menu-trigger {top: 5px;color: #fff;font-size: 20px;}
	.displaymobile { display: block}
	#primary-menu.style-2 > div > ul > li > a {padding: 7px 5px !important;font-size: 12px; font-weight: 400; letter-spacing: 2px;}
	#primary-menu ul li a:hover,
	#primary-menu ul li.current > a { color:#000 !important; background-color: transparent}
	/*CONTENT*/
	.container {max-width: 100%;padding-left: 40px !important; padding-right: 40px !important;}
	.col-padding {padding: 20px 0;}
	
	.portfolio .portfolio-item {width: 33.33333333%;}
	.portfolio .portfolio-item:last-child { display: none}
	
	/*FOOTER*/
	#copyrights { font-size: 11px; line-height: 16px;}
	#copyrights p { margin-bottom: 10px}
}


@media (min-width: 768px) and (max-width: 991px) {
	/*HEADER*/	
	/*CONTENT*/
	/*FOOTER*/
}


@media (max-width: 768px) {
}


@media (max-width: 767px) {
	/*HEADER*/
	
	/*CONTENT*/
	.portfolio .portfolio-item:last-child {display: block;}
	.portfolio .portfolio-item { width: 50%;}
	/*FOOTER*/
	
}

@media (min-width: 576px) and (max-width: 767px) {
	/*HEADER*/
	/*CONTENT*/
	.swiper_wrapper:not(.force-full-screen),
	.swiper_wrapper:not(.force-full-screen):not(.canvas-slider-grid) .swiper-slide { height: 400px !important}
	#slider h2 { bottom: 0px;letter-spacing: 3px;font-size: 22px;}
	
	#content .container-fullwidth { width: 100% !important;}
	
	/*FOOTER*/
}
@media (max-width: 575px) {
	/*HEADER*/
	
	/*CONTENT*/
	.swiper_wrapper:not(.force-full-screen),
	.swiper_wrapper:not(.force-full-screen):not(.canvas-slider-grid) .swiper-slide { height: 300px !important}
	#slider h2 { bottom: 0px;letter-spacing: 2px;font-size: 20px;}
	
	.portfolio .portfolio-item {padding: 5px;}
	img.alignleft {float: none;margin: 0;}
	/*FOOTER*/
}







