/*
Theme Name: REDSTAR AGENCY | Laurent Plenet
Theme URI: http://www.redstar-agency.com
Author: Laurent Plenet
Author URI: http://www.redstar-agency.com
Description: Template réalisé pour P.DELMAS.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* ---------------------------- */
/*	   DEFAULT STYLES						*/
/* ---------------------------- */
@keyframes fadeIn { from { opacity:0;} to { opacity:1;}}
body { font: normal 13px/16px 'Montserrat', sans-serif; animation: fadeIn 1s;}
.container { width: 960px; margin: 0 auto;}

p { font : normal 13px/16px Arial, helvetica, sans-serif; color: #868686; margin: 0 0 10px 0;}

a, input { noFocusLine: expression(this.onFocus=this.blur());outline: none; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; text-decoration: none;}

.btn, .button { font: bold 14px/14px 'Montserrat', Arial, Helvetica, sans-serif; color: #FFFFFF; background: #004d99; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; display: inline-block; border-radius: 50px; padding: 10px 25px; border: none;}
a.btn:hover, .button:hover { background: #dc001b; color: #FFF;}

.btnred { font: bold 14px/14px 'Montserrat', Arial, Helvetica, sans-serif; color: #FFFFFF; background: #dc001b; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; display: inline-block; border-radius: 50px; padding: 10px 25px; border: none;}
a.btnred:hover { background: #ffffff; color: #004d99;}


p,li { font-size: 13px; line-height: 16px; font-weight: 300; color: #48636c;}

ul,li { padding: 0; margin: 0; list-style: none;}

.clear { clear: both;}
.hide { display: none;}
.center { text-align: center;}
.small { font-size: 11px !important;}

/* ---------------------------- */
/*	   SELECTIONS								*/
/* ---------------------------- */
*:focus, a:focus { outline: none !important; border: none;}
*::-moz-focus-inner {border: none;}
img, *[contenteditable=true] { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
::-moz-selection 	{ color: #FFFFFF; background: #004d99;}
::selection      	{ color: #FFFFFF; background: #004d99;}
p::-moz-selection { color: #FFFFFF; background: #004d99;}
p::selection      { color: #FFFFFF; background: #004d99;}

/* ---------------------------- */
/*	   COLORS										*/
/* ---------------------------- */
/** TEXT COLORS **/
.blue 			{ color: #004d99 !important;}
.blue-dark 	{ color: #002f5d !important;}
.red 				{ color: #dc001b !important;}
.grey 			{ color: #8c8c8c !important;}
.white 			{ color: #000000 !important;}

/** BACKGROUND COLORS **/
.bg-blue { background: #004d99; color: #FFFFFF;}
.bg-grey { background: url('images/grey_pattern.jpg') center center; color: #FFFFFF;}
.bg-blue h2,.bg-grey h2 { color: #FFFFFF;}
.bg-blue p { color: #a2c4e6;}
.bg-grey p { color: #FFFFFF;}

.bg-blue p strong { color: #FFFFFF;}

/* ---------------------------- */
/*	   TITLES										*/
/* ---------------------------- */
h1 { font: normal 30px/30px 'Montserrat', Arial, Helvetica, sans-serif; text-transform: uppercase; color: #282828;}
h2 { font: bold 30px/30px 'Montserrat', Arial, Helvetica, sans-serif; text-transform: uppercase; color: #282828; margin: 0 0 15px 0; text-align: center;}
h3 { font: 100 16px/20px 'Montserrat', Arial, Helvetica, sans-serif; margin: 0 0 15px 0;}
h4 { font: 100 24px/24px 'Montserrat', Arial, Helvetica, sans-serif; margin: 0 0 15px 0;}

/* ---------------------------- */
/*	   HEADER										*/
/* ---------------------------- */
.header-container { height: 560px; background: url('images/bg_header.jpg') bottom center repeat-x; animation: fadeIn 1s;}
.header-container .wrapper { height: 560px; background: url('images/header_2021.jpg') bottom center no-repeat;}
.header-container a.logo { width: 160px; display: inline-block; margin: 30px 0 75px 0;}
.header-container a.logo img { width: 100%; height: auto;}
.header-container h1 { font: normal 33px/36px 'Montserrat', Arial, Helvetica, sans-serif; margin: 0 0 24px 0; animation: fadeIn 2s;}

/* ---------------------------- */
/*	   BLOC CONTENT							*/
/* ---------------------------- */
article { padding: 40px 0;}
article section { padding: 0 10px;}
article.separator:before { content: ''; display: block; width: 100%; height: 10px; background: #004d99; margin: -40px auto 40px auto;}

#domaines { margin: 20px 0 0 0;}
#domaines li { text-align: center; width: 31%; display: inline-block; padding: 0 1%;}
#domaines img.icon { margin: 0 auto 10px auto; display: block;}
#domaines h4 { font: bold 16px/16px 'Montserrat', Arial, Helvetica, sans-serif; text-transform: uppercase; color: #282828; margin: 0 0 10px 0;}
#domaines p { color: #868686;}

#publications { margin: 20px 0 0 0;}
#publications li { width: 43.5%; display: inline-block; padding: 0 2.4%; margin-bottom: 30px;}
#publications li.pdf { background: url('images/pdf.svg') top left no-repeat; padding: 0 0 0 60px;}
#publications li a { color: inherit;}
#publications li p { font-size: 11px;}
#publications li p.date { background: url('images/date.svg') left 1px no-repeat; padding: 0 0 0 18px; color: #ffffff; font-weight: bold; margin: 0 0 5px 0;}
#publications li p.btn { background: #004d99; border: 2px solid rgba(255,255,255,.10); padding: 8px 15px;}
#publications li p.btn:hover { background: #dc001b;}
#publications li h4 { font: normal 16px/18px 'Montserrat', Arial, Helvetica, sans-serif; color: #FFFFFF; margin: 0 0 5px 0;}

#experts li { text-align: center; width: 28.2%; display: inline-block; padding: 0 2.4%; vertical-align: top;}
#experts li img { border-radius: 100%; border: 6px solid #f3f3f3; display: inline-block; margin: 20px auto 20px auto;}
#experts li h4 { font: bold 18px/18px 'Montserrat', Arial, Helvetica, sans-serif; text-transform: uppercase; color: #282828; margin: 0 0 5px 0;}
#experts li p.fonction { font: normal 12px/12px 'Montserrat', Arial, Helvetica, sans-serif; color: #282828; margin: 0 0 10px 0;}
#experts li p { color: #868686; font-size: 12px;}

#references { margin: 40px 0 20px 0;}
#references li { width: 28.2%; display: inline-block; text-align: center; min-height: 200px; height: 200px; line-height: 200px; vertical-align: middle; overflow: hidden;}
#references li img { width: 60%; height: auto;}

#simulateur { background: url('images/simulateur.jpg'); background-position: center center; background-repeat: no-repeat; background-size: cover !important; padding: 150px 0;}
#simulateur .btn { background: #dc001b;}
#simulateur .btn:hover { background: #004d99;}

#fidapv { background: url('images/fidapv.jpg'); background-position: center center; background-repeat: no-repeat; background-size: cover !important; padding: 150px 0;}
#fidpav .btn { background: #dc001b;}
#fidapv .btn:hover { background: #dc001b;}

#video { background: #8c8c8c; background-position: center center; background-repeat: no-repeat; background-size: cover !important; padding: 80px 0;}
#video .btn { background: #dc001b;}
#video .btn:hover { background: #004d99;}

#clicvideo { background-position: center center; background-repeat: no-repeat; background-size: cover !important; padding: 0px 0;}
#clicvideo .btn { background: #004d99;}
#clicvideo .btn:hover { background: #dc001b;}

/* ---------------------------- */
/*	   NAVIGATION								*/
/* ---------------------------- */
.customBtns { margin:15px 0; text-align: center;}
.customBtns a,
.customBtns .icon-arrow-left,
.customBtns .icon-arrow-right { font-size:12px; cursor:pointer; margin:0 3px; font: normal 14px/22px 'Anivers', Arial, sans-serif; text-transform: uppercase;  color:#b9b9b9; display: inline-block; border-radius: 50px; width: 30px; height: 30px; text-align: center; vertical-align: middle; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease;}
.customBtns .icon-arrow-left-domaines:hover,.customBtns .icon-arrow-right-domaines:hover { color: #333;}
.customBtns .icon-arrow-left-publications:hover,.customBtns .icon-arrow-right-publications:hover { color: #FFFFFF;}
.customBtns .icon-arrow-left-publications,
.customBtns .icon-arrow-right-publications { color: #dc001b;}
.customBtns .icon-arrow-left:before,.customBtns .icon-arrow-right:before { line-height: 26px; font-size: 20px;}
.customBtns a { border: 2px solid transparent;}
.customBtns a:hover { background-color:#a7a28e; color:#FFFFFF;}
.customBtns a.jp-previous { margin-right:15px;}
.customBtns a.jp-next { margin-left:15px;}
.customBtns a.jp-current,a.jp-current:hover { color:#46114e; border: 2px solid #f0f0f0;}
.customBtns a.jp-disabled,a.jp-disabled:hover { color:#bbb;}
.customBtns a.jp-current,a.jp-current:hover,.customBtns a.jp-disabled,a.jp-disabled:hover { cursor:default; background:none;}
.customBtns span { margin:0 5px;}
.customBtns .holder { display: inline-block;}

/* ---------------------------- */
/*	   FORMULAIRE								*/
/* ---------------------------- */
#contact { padding: 40px 0;}
.form input,
.form textarea { background: none; font: bold 12px/12px 'Montserrat', Arial, Helvetica, sans-serif; color: #FFFFFF; padding: 10px 2% 10px 2%; margin: 0 10px 5px 0; border: 2px solid rgba(255,255,255,.1); border-radius: 50px; width: 43.7%; cursor: pointer;}
.form input:hover,
.form textarea:hover { border: 2px solid rgba(255,255,255,1);}
.form input:nth-child(2n+2){ margin: 0 0 5px;}
.form #submit { background: #FFFFFF; color: #282828; width: auto; padding: 10px 20px;}
.form #submit:hover { background: #dc001b; color: #FFFFFF; border-color: transparent;}
.form textarea { width: 95.7%; margin: 0 0 5px 0; border-radius: 10px;}

#social { margin: 20px 0 0 0;}
#social li { display: inline-block; padding: 0 5px;}
#social li a { width: 40px; height: 40px; text-indent: -9999px; display: inline-block; box-shadow: 0 0 0 4px #1767b5; border-radius: 100%; background: #1b5c9d;}
#social li.facebook a { background: url('images/social-facebook.svg') center center no-repeat;}
#social li.twitter a { background: url('images/social-twitter.svg') center center no-repeat;}
#social li.linkedin a { background: url('images/social-linkedin.svg') center center no-repeat;}
#social li a:hover { box-shadow: 0 0 0 4px #FFFFFF;}

.col-left { float: left; width: 50%;}
.col-left h2 { text-align: left; margin: 0 0 10px 0;}
.col-right { float: right; width: 46%; padding: 90px 0 0 0;}

.contacts li,.contacts li a { color: #FFFFFF;}
.contacts li.call { margin: 0 0 10px 0; position: relative; padding-left: 25px; font-family: Arial, helvetica, sans-serif; font-size: 12px;}
.contacts li.call span.icon-call { position: absolute; top: 0; left: 0; font-size: 18px;}
.contacts li a { margin: 10px 0 0 0; display: block;}

.adresse { padding-left: 25px; position: relative;}
.adresse span.icon-pin { position: absolute; top: 0; left: 0; font-size: 18px;}
.adresse h5 { margin: 0 0 10px 0; font-size: 14px; line-height: 14px; text-transform: uppercase;}

.col-right .contacts { float: left; width: 44%;}
.col-right .adresse { float: right; width: 45%;}

p.credits { font: normal 12px/16px Arial, Helvetica, sans-serif; font-size: 11px; color: #74a3d2; text-align: right; margin: 60px 0 0 0;}
p.credits a { color: #74a3d2; font-weight: bold;}

::-webkit-input-placeholder { color: rgba(255,255,255,.95);}
:-moz-placeholder { color: rgba(255,255,255,.95);}
::-moz-placeholder { color: rgba(255,255,255,.95);}
:-ms-input-placeholder { color: rgba(255,255,255,.95);}

/* Generated by Glyphter (http://www.glyphter.com) on  Tue Sep 27 2016*/
@font-face {
    font-family: 'icones';
    src: url('css/icones/icones.eot');
    src: url('css/icones/icones.eot?#iefix') format('embedded-opentype'),
         url('css/icones/icones.woff') format('woff'),
         url('css/icones/icones.ttf') format('truetype'),
         url('css/icones/icones.svg#icones') format('svg');
    font-weight: normal;
    font-style: normal;
}
[class*='icon-']:before{
	display: inline-block;
   font-family: 'icones';
   font-style: normal;
   font-weight: normal;
   line-height: 1;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

.icon-arrow-breadcrumb:before{content:'\0041';}
.icon-arrow-left:before{content:'\0042';}
.icon-arrow-right:before{content:'\0043';}
.icon-call:before{content:'\0044';}
.icon-email:before{content:'\0045';}
.icon-facebook:before{content:'\0046';}
.icon-house:before{content:'\0047';}
.icon-pin:before{content:'\0048';}
.icon-tel:before{content:'\004f';}
.icon-gear:before{content:'\0050';}
.icon-date:before{content:'\0051';}



/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

/* Mobile */
@media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
	.container { width: 90%; margin: 0 auto;}
	h2 { font: bold 26px/28px 'Montserrat', Arial, Helvetica, sans-serif; margin: 0 0 15px 0;}
	h3 { font: 100 14px/18px 'Montserrat', Arial, Helvetica, sans-serif;}
	p { font : normal 18px/20px Arial, helvetica, sans-serif !important; color: #868686; margin: 0 0 10px 0;}
	.header-container a.logo { width: 70%; margin: 20px auto;}
	.header-container .wrapper { width: 80%; padding: 0 10%; margin: 0 auto; text-align: center;}
	#domaines li { width: 100%; padding: 0;}
	#publications li { width: 100%; margin-bottom: 10px; background: none !important; padding: 0 !important; text-align: center;}
	#publications li p.date { background: none;}
	#experts li { width: 100%; padding: 0;}
	#references li { width: 40%;}
	#references li img { width: 55%;}
	.col-left { width: 100%; text-align: center;}
	.col-right { width: 100%; padding: 30px 0 0 0;}
	.col-right .contacts { width: 100%;}
	.col-right .contacts li.call { padding: 0; text-align: center;}
	.col-right .contacts li.call span.icon-call { display: none;}
	.col-right .adresse { width: 100%; text-align: center; padding: 0; margin: 10px 0 0 0;}
	.col-right .adresse span.icon-pin { display: none;}
	.col-left h2 { text-align: center;}
	.col-right p.credits { text-align: center; margin: 20px 0 0 0;}
	.form input, .form textarea { text-align: center; padding: 10px 0; width: 100%;}
}

/* iPads (portrait and landscape) ----------- */
@media all and (min-width: 485px) and (max-width: 1170px){
	.container { width: 90%; margin: 0 auto;}
	h2 { font: bold 30px/32px 'Montserrat', Arial, Helvetica, sans-serif; margin: 0 0 15px 0;}
	h3 { font: 100 16px/22px 'Montserrat', Arial, Helvetica, sans-serif;}
	p { font : normal 14px/20px Arial, helvetica, sans-serif !important; color: #868686; margin: 0 0 10px 0;}
	.header-container .wrapper { width: 80%; padding: 0 10%; margin: 0 auto;}
	#domaines li { width: 100%; padding: 0;}
	#publications li { width: 41%;}
	#experts li { width: 44.9%;}
	#references li { width: 30%;}
	#references li img { width: 40%;}
	.col-right .contacts { width: 80%; float: right; margin: 0 0 20px 0;}
	.col-right .adresse { width: 72%;}
	.form input, .form textarea { text-align: center; padding: 10px 0; width: 100%;}
	.col-right p.credits { margin: 20px 0 0 0; font-size: 11px !important; line-height: 12px !important;}
}

/* iPad PORTRAIT */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
}

@media only screen and (min-width:320px) {
}
@media only screen and (min-width:480px) {
}
@media only screen and (min-width:768px) {
}
@media only screen and (min-width:1024px) {
}
@media only screen and (min-width:1140px) {
}
@media only screen and (min-width:1280px) {
}
@media only screen and (min-width:1920px) {
}
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:144dpi) {
}