/* ******************************** */
/* A SUUUUP ?????????????????????????????? 

.list-group-item{background-color:rgba(255,255,255,0.1);border:none;}

#jumbotron-salaries{
    background-image:url('../img/salaries_btn.png');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
    height: 300px;
}
.jumbotron-home{background: gradient(linear, left top, left bottom, color-stop(0,#668dcf), color-stop(0.5,#69c9a0), color-stop(1,#bbd9a9));}
.jumbotron{text-align:center;margin-bottom:0;}


.main-button{font-weight:bold;font-size:1.2em;min-width:180px;padding:15px 20px;color:#FFF;}
.main-button .btn-outline-dark{border:1px solid #FFF;}
.justify-content-center{text-align:center;}


#breadcrumb{text-align: left;}
#breadcrumb a{color:rgba(255,255,255,1);}
#breadcrumb span{}

******************************** */


/* ******************************** */
/* GENERAL */
/* ******************************** */
@font-face{font-family:ssp-Regular;src:url("../fonts/source-sans-pro/OTF/SourceSansPro-Regular.otf");}
:root{
	--fa-secondary-opacity:1.0;
	--fa-primary-color:rgba(55,55,55,0.8);
	--fa-secondary-color:rgba(255,255,255,0.6);
}

html{height:100%;}
body{font-family:ssp-Regular;letter-spacing:1px;margin:0;}
#body-content{
	background:url('../img/peoples.png') no-repeat,
               url('../img/bg-pattern.png'),
               linear-gradient(to bottom,rgba(102,141,207,1) 0,rgba(105,201,160,1) 50%,rgba(187,217,169,1) 100%);
	background-position:1% bottom,0,0;
	background-size:135%,auto,auto;
	/*animation:movebuilding 100s linear alternate infinite;*/
	position:relative;
	width:100%;
	overflow-y:hidden;
	color:white;
    padding:0;
}

@keyframes movebuilding {
	0%{background-position:1% bottom,0,0;}
	100%{background-position:100% bottom,0,0;}
}

a {text-decoration:none;color:rgba(255,255,255,0.6);transition:0.5s color linear;}
a:hover,a:focus{text-decoration:none;outline:none;color:rgba(255,255,255,1);transition:0.5s color linear;}

ul{list-style:none;text-align:left;}

.row{margin-bottom:25px;}
.btn-outline-dark{border-radius:1px;background-color:rgba(0,0,0,0.2);border:none;}

.disparition{opacity:0;transition:1s opacity linear;display:none;}
.apparition{opacity:1;transition:1s opacity linear;display:block!important;}

#beforetheend{padding:0;height:150px;width:100%;background-color:rgba(0,0,0,0.10);}

/* ******************************** */
/* INDEX */
/* ******************************** */

/* HEADER */
#main-navbar.fixed-navbar{position:fixed;left:0;right:0;top:0;box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.15);z-index:10;}

#header{position:relative;z-index:10;}
#header .navbar {margin-bottom:0;border-radius:0;border:none;}
#header .nav li a:hover,#header .nav li a:focus{background-color:transparent;}
#navbar {
  background-color: #f1f1f1;
  padding: 30px; /* Large padding which will shrink on scroll (using JS) */
  transition: 0.4s; /* Adds a transition effect when the padding is decreased */
  position: fixed; /* Sticky/fixed navbar */
  width: 100%;
  top: 0; /* At the top */
  z-index: 99;
}
#navbar li{margin-right: 15px;}

.navbar-header{margin:0 auto;padding-top:30px;text-align:center;}
.navbar-header h2{padding:100px 0 30px 0;}

.navbar-brand{padding:0;}
.navbar-brand img{height:45px;width:auto;transition:0.5s linear;}
.nav-link{font-size: 1.1em;transition:0.5s linear;}

.btn-blog{background-color:rgba(187,217,169,1);line-height: 1.5;border-radius: .25rem;}
.btn-blog:hover{
	color:rgba(255,255,255,1);
	font-weight:bold;
	background: rgb(102,141,207);
	background: linear-gradient(90deg, rgba(102,141,207,1) 0%, rgba(105,201,160,1) 50%, rgba(187,217,169,1) 100%);
}


.scrolled{font-size:0.9em;padding:15px!important;transition:all 0.5s linear;}
.scrolled #navbar-logo{height:30px;}
.scrolled li{margin-right: 5px;}

/* MENU HOME SalEnt */

#btn-salent{position:absolute;right:14px;top:15px;z-index:99;}
#home-bbtn{text-align:center;padding:0;}

.bbtns{width:100%;margin:0!important;height:350px;border-bottom:2px black solid;}
.bbtns span{font-size:2em;}
.bbtns a{color:white;width:100%;height:100%;}
.bbtns i{font-size:2.2em;--fa-primary-color:rgb(255,255,255);--fa-secondary-color:rgb(0,0,0);
						 --fa-primary-opacity:0.5;--fa-secondary-opacity:0.5;}

.home-bbtn{padding:0;width:200px;padding:10px;position:absolute;bottom:65px;background-color:rgba(255,255,255,0.5)}

#bbtn-salaries{background-image:url('../img/salaries_btn.png');background-repeat:no-repeat;background-position:right center;background-size:cover;
	/*filter: grayscale(1);
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
    -ms-filter: grayscale(1);*/}
#bbtn-entreprise{background-image:url('../img/entreprise_btn.png');background-repeat:no-repeat;background-position:left center;background-size:cover;
	/*filter: grayscale(1);
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
    -ms-filter: grayscale(1);*/}

#bbtn-gauche{border-right:1px solid white;border-radius:15px 0 0 15px;text-align:right;right:0;}
#bbtn-droite{border-left:1px solid white;border-radius:0 15px 15px 0;text-align:left;left:0;}

.bbtns-colored{filter:none!important;transition:0.5s filter linear;}
.bbtns-blur{
	filter:blur(2px) grayscale(1)!important;
    -webkit-filter:blur(2px) grayscale(1)!important;
    -moz-filter:blur(2px) grayscale(1)!important;
    -o-filter:blur(2px) grayscale(1)!important;
    -ms-filter:blur(2px) grayscale(1)!important;
	transition:0.5s filter linear;}



/* MODULE RAPPEL */
#rappel{position:fixed;right:-100vw;z-index:9;display:none;top:0;}
#rappel_icon{color:#FFFFFF;width:60px;height:50px;background-color:#000000;float:left;position:fixed;right:0;z-index:10;border-radius:0;border:0;}
#rappel_icon i{font-size:30px;line-height:50px;text-align:center;width:100%}
#rappel_icon_close{display:none}
#rappel_form{text-align:center;width:100vw;background-color:white;padding:0 10% 20px 10%}
#rappel_form h3{margin-top:0;padding-top:20px}
#formRappel .row{margin-bottom:25px}
#div-recaptcha{padding-top:25px}
#messagePostForm{display:none}
#messagePostForm .bg-success{padding:15px;font-weight:bold;text-align:center;font-size:1.2em}
#messagePostForm-erreur{display:none}
#messagePostForm-erreur .bg-danger{padding:15px;font-weight:bold}

/* MODULE POPOPTIN */
#popoptin{color:white;}
input::-webkit-input-placeholder{color:white!important;}
input:-moz-placeholder{color:white!important;}
input::-moz-placeholder{color:white!important;}
input:-ms-input-placeholder{color:white!important;}

#popoptin .modal-content{border:0;border-radius:1rem;}
#popoptin_button{background-color:rgba(187,217,169,1);}
#popoptin_button:hover{
	color:rgba(255,255,255,1.00);
	font-weight:bold;
	background: rgb(102,141,207);
	background: linear-gradient(90deg, rgba(102,141,207,1) 0%, rgba(105,201,160,1) 50%, rgba(187,217,169,1) 100%);
}
#popoptin_form .row{margin:0;}

#conf_popoptin_form{display:none}
#conf_popoptin_form .bg-success{padding:15px;font-weight:bold;text-align:center;font-size:1.2em}
#conf_popoptin_form-erreur{display:none}
#conf_popoptin_form-erreur .bg-danger{padding:15px;font-weight:bold}

/* MODULE POPERIN */
#poperin{color:white;}
#poperin .modal-content{border:0;border-radius:1rem;}
#poperin_button{background-color:rgba(187,217,169,1);}
#poperin_button:hover{
	color:rgba(255,255,255,1.00);
	font-weight:bold;
	background: rgb(102,141,207);
	background: linear-gradient(90deg, rgba(102,141,207,1) 0%, rgba(105,201,160,1) 50%, rgba(187,217,169,1) 100%);
}
#poperin_form .row{margin:0;}

#conf_poperin_form{display:none}
#conf_poperin_form .bg-success{padding:15px;font-weight:bold;text-align:center;font-size:1.2em}
#conf_poperin_form-erreur{display:none}
#conf_poperin_form-erreur .bg-danger{padding:15px;font-weight:bold}

/* MENU DISPOSITIFS */
#home-dispositifs{padding:20px 0;background-color:rgba(0,0,0,0.10);text-align:center;}
#home-dispositifs h4{padding:30px 0 0 0;text-align:center;}
#home-dispositifs .fa-chevron-double-down{margin:35px 0;font-size:2em;--fa-primary-color:rgb(255,255,255);}

#menu-dispositifs{padding:20px 0;background-color:rgba(0,0,0,0.10);text-align:center;}
#menu-dispositifs .fa-chevron-double-down{--fa-secondary-color:rgba(255,255,255,0.4);}
#menu-dispositifs .btn-outline-dark{min-width:50%;}

.dispo-group{text-align:center;background-color:rgba(255,255,255,0.10);border-radius:15px;}
.dispo-group i{margin:5px 0;font-size:1.5em;}

.dispo-libelle{
    height:100px;
    color:rgba(0,0,0,0.9);
    margin: 0 auto;
    background-color:rgba(255,255,255,0.30);
    border-radius:0 0 15px 15px;}

.dispo-libelle .titre{font-size:1.2em;font-weight:bold;display:block;color:rgba(255,255,255,1.00);}
.dispo-libelle .description{font-size:0.9em;color:rgba(255,255,255,0.90);}

.dispo-illus{height:200px;width:100%;}

#part-int .dispo-illus{
    transition:0.5s filter linear;
    background-image:url("../img/illus_part-int.png");background-repeat:no-repeat;background-size:contain;background-position:center;
}
#pee .dispo-illus{
    transition:0.5s filter linear;
    background-image:url("../img/illus_PEE.png");background-repeat:no-repeat;background-size:contain;background-position:center;
}
#per .dispo-illus{
    transition:0.5s filter linear;
    background-image:url("../img/illus_PER.png");background-repeat:no-repeat;background-size:contain;background-position:center;
}

.dispo-group{transition:0.2s color;}
.dispo-group:hover{color:rgba(35,35,35,1.00);transition:0.2s color;}



/* FORM PRINCIPAL */
#form_ent{}
#barre_form{
	height:250px;
	width:100%; 
	background: url("../img/perdu_es.png") no-repeat;background-position: center; background-size: cover;
    border-bottom:1px rgba(0,0,0,0.4) solid;
	padding:0;background-color:rgba(0,0,0,0.10);
}

#barre_postform{
	height:50px;
	width:100%; 
    border-top:1px rgba(0,0,0,0.4) solid;
	padding:0;background-color:rgba(0,0,0,0.10);
}
#formEntSal{margin-top:50px;}
.col-md-6{margin-bottom:25px;}

#etape0 label{width:100%;color:white;background-color:rgba(255,255,255,0.20);line-height:50px;transition:0.5s linear;}
#etape0 label:hover{background-color:rgba(255,255,255,0.80);color:rgba(0,0,0,0.60);transition:0.5s linear;}
#toggle_sal-ent{min-width:400px;}

.active{
    color:rgba(55,55,55,0.8)!important;
    background-color:rgba(255,255,255,0.80)!important;
    font-weight:bold;
}

.question{font-size:1.3em;}
#etape0_cond_ent i, #etape0_cond_sal i{font-size:1.8em;margin:15px 0;}

#toggle_sal{border-radius:10px 0 0 10px;}
#toggle_ent{border-radius:0 10px 10px 0;}

.form-input{background-color:rgba(255,255,255,0.20);border:0;color:rgba(255,255,255,1);width:100%;}
.form-btn{background-color:rgba(255,255,255,0.20);border:0;color:rgba(255,255,255,1);}

#formEntSal input::placeholder{color:rgba(255,255,255,1);}
#formEntSal input::-webkit-input-placeholder{color:rgba(255,255,255,1)!important;}
#formEntSal input:-moz-placeholder{color:rgba(255,255,255,1)!important;}
#formEntSal input::-moz-placeholder{color:rgba(255,255,255,1)!important;}
#formEntSal input:-ms-input-placeholder{color:rgba(255,255,255,1)!important;}

#formEntSal #etape1{opacity:0;display:none;}
#formEntSal #etape2{opacity:0;display:none;}
#formEntSal #etape3{opacity:0;display:none;}
#etape0_cond_ent{opacity:0;display:none;}
#etape0_cond_sal{opacity:0;display:none;}

/* BLOG */
#blog{background-color:rgba(0,0,0,0.10);}
.blog-img{position: relative;border-bottom:4px solid rgba(105,201,160,1);min-height:210px;}
.blog-img a > img{width:100%;}
.blog-meta{margin-top:15px;margin-bottom:15px;border-bottom:1px solid #EEE;padding-bottom:10px;}
.blog-meta li{display:inline-block;font-size:14px;}

.blog{margin-top:15px;margin-bottom:15px;}
.blog .blog-img{position:relative;border-bottom:4px solid rgba(105,201,160,1);min-height:210px;}
.blog .blog-img > a > img{width:100%;}
.blog .blog-meta{margin-top:15px;margin-bottom:15px;border-bottom:1px solid #EEE;padding-bottom:10px;}
.blog .blog-meta li {display:inline-block;font-size:14px;}

.text-link > span {position: relative;z-index: 1;}
.text-link:hover > span {color:#1F2733;}
.text-link > span:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:0%;background-color:rgba(105,201,160,1);z-index:-1;-webkit-transition:0.2s height;transition:0.2s height;}
.text-link:hover > span:after{height:100%;}
#troisarticles{margin-bottom:0!important;}

/* COOKIEBANNER */
#cookieBanner{padding:25px;width:80%;}
#cookieBanner .col-sm-2{text-align:center;}
#cookieBanner p{line-height:27px;color:#122844;width:75%;display:inline;}


/* FOOTER */
.bg-dark{background:no-repeat,url('../img/bg-pattern.png'),rgba(0,0,0,0.8)!important;}

.footer-logo .logo{display:inline-block;margin-bottom: 30px;}
.footer-logo .logo > img{max-height: 50px;}
.footer-widget{margin-top:15px;margin-bottom:15px;}
.footer-contact li{margin-top:10px;}
.footer-contact li a{color:#FFFFFF;}
.footer-contact li a i{color:#FFFFFF;margin-right:15px;}
.footer-links li{margin-top:10px;}
.footer-links li a{display:inline-block;font-size:14px;color:#FFFFFF;transition: 0.2s transform, 0.2s color;}
.footer-links li a:hover{transform: translateX(3px);color:#FFF;}
.footer-social{margin-top:30px;}
.footer-social li{display:inline-block;}
.footer-social li a{
	display:inline-block;
	height:35px;
	width:35px;
	text-align:center;
	line-height:30px;
	color:#FFFFFF;
	border:2px solid #FFFFFF;
	border-radius:50%;
	margin-right:10px;
	font-size:14px;
	transition:0.2s all;
}
.footer-social li a:hover{background-color:#FFFFFF;color:#FFFFFF;}



#footer .fad{--fa-primary-color:rgb(255,255,255);}/*--fa-secondary-color:rgb(0,0,0);*/
#footer #bottom-footer a{color:#FFFFFF;}
#top-footer .row{margin-bottom:0;}



/* ******************************** */
/* PAGE ANNEX */
/* ******************************** */

/* MENU HOME ANNEX */
.bbtns-anex{width:100%;margin:0!important;height:275px;border-bottom:1px rgba(0,0,0,0.5) solid;}

#barre-intpart{background-image:url('../img/illus_home_part-int.png');background-repeat:no-repeat;background-position:center bottom;background-size:contain;}
#barre-peeig{background-image:url('../img/illus_home_PEE.png');background-repeat:no-repeat;background-position:center bottom;background-size:contain;}
#barre-per{background-image:url('../img/illus_home_PER.png');background-repeat:no-repeat;background-position:center bottom;background-size:contain;}

#barre-sal{background-image:url('../img/illus_home_sal.png');background-repeat:no-repeat;background-position:center bottom;background-size:contain;}
#barre-agr{background-image:url('../img/illus_home_agreg.png');background-repeat:no-repeat;background-position:center bottom;background-size:contain;}
#barre-ent{background-image:url('../img/illus_home_ent.png');background-repeat:no-repeat;background-position:center bottom;background-size:contain;}

#breadcrumb-info-anex{text-align:left;padding:10px 0 20px 0;}
#barre-info-anex{text-align:center;background-color:rgba(0,0,0,0.10);}
#barre-info-anex h1{padding-top:20px;}
#barre-info-anex a i{margin:35px 0;font-size:2em;--fa-primary-color:rgb(255,255,255);}


/* CONTENTS ANNEX */
#links-sous-cat{text-align:center;padding-bottom:20px;}
#links-sous-cat a{margin-bottom:10px;}


#coup-doeil-content{text-align:center;}
#coup-doeil-content h5{text-align:left;}
#coup-doeil-content img{width:80%;margin:25px 0 45px 0; }

#definitions-content p{font-style:italic;font-size:0.8em;}
#definitions-content p .def-mots{font-style:normal;font-size:0.9em;font-weight:bold;text-decoration:underline;}
#definitions-content p a{font-size:0.7em;}
.def-content{font-size:1em;}
		
#simulateur-content a{margin-top:5px;}

#s-informer-content{padding-top:25px;}

#menu-page-annex{background-color:rgba(0,0,0,0.10);}
#menu-page-annex .row{margin-bottom:0;padding-bottom:25px;}
#nous-contacter .dispo-illus{background-image:url("../img/ma_nous-contacter.png");background-repeat:no-repeat;background-size:contain;background-position:center;}
#s-informer .dispo-illus{background-image:url("../img/ma_s-infromer.png");background-repeat:no-repeat;background-size:contain;background-position:center;}
#comprendre .dispo-illus{background-image:url("../img/ma_comprendre.png");background-repeat:no-repeat;background-size:contain;background-position:center;}
#echanger .dispo-illus{background-image:url("../img/ma_echanger.png");background-repeat:no-repeat;background-size:contain;background-position:center;}

#content-post-menu{background-color:rgba(0,0,0,0.10);}


/* Liste Acces Comptes ES */
.card{background-color:transparent;border:0!important;}
.card img{
	filter: contrast(12%) brightness(190%) grayscale(1);
    -webkit-filter: contrast(12%) brightness(190%) grayscale(1);
    -moz-filter: contrast(12%) brightness(190%) grayscale(1);
    -o-filter: contrast(12%) brightness(190%) grayscale(1);
    -ms-filter: contrast(12%) brightness(190%) grayscale(1);
}

.card img:hover{
	filter: contrast(100%) brightness(100%) grayscale(0);
    -webkit-filter: contrast(100%) brightness(100%) grayscale(0);
    -moz-filter: contrast(100%) brightness(100%) grayscale(0);
    -o-filter: contrast(100%) brightness(100%) grayscale(0);
    -ms-filter: contrast(100%) brightness(100%) grayscale(0);
	transition: 0.2s filter linear;
}
.card-img-top{width:75%!important;height:auto;width:100%;}



/* Liens Utiles */
.list-group-item{background-color:rgba(255,255,255,0.2);}
.btn-dark{background-color:rgba(255,255,255,0.20);border:0;color:rgba(255,255,255,1);transition:0.5s linear;}
.btn-dark:hover{background-color:rgba(255,255,255,0.60);border:0;color:rgba(0,0,0,1);transition:0.5s linear;}



/* ******************************** */
/* RESPONSIVENESS */
/* ******************************** */

/* Style des mobiles */
@media only screen and (max-width:767px){
	/* Général */
	.btn-outline-dark{min-width:100%;}
    #breadcrumb-info-anex{text-align:center;}
    
    /* Header */
    #main-navbar{text-align:center;padding-top:0;padding-bottom:0;}
    header{text-align:center;}
	#navbar {padding: 20px 10px !important;}
	#navbar a {float: none;display:block;text-align:left;}
	.navbar-brand{margin:2vh 0 2vh 0;}
	.navbar-brand img{height:40px;width:auto;}
	
	#barre-intpart{background-size:cover;}
	#barre-peeig{background-size:cover;}
	#barre-per{background-size:cover;}
	#barre-sal{background-size:cover;}
	#barre-agr{background-size:cover;}
	#barre-ent{background-size:cover;}
	
	.main-navbar{
		margin:0 -15px;
		max-height:0;
		overflow-y:scroll;
		transition:0.3s max-height;
	}
	.navbar-header h2{font-size:1.5em;padding-bottom:0;}
    
	.bbtns-anex{height:220px;}
	
    /* Menu Home SalEnt */
	#btn-salent{right:5px;top:135px;}
	#bbtn-salaries{background-position:86% 0%;}
	#bbtn-entreprise{background-position:12% 0%;}
	
	/* Menu Dispositifs */
    .dispo-illus{height:150px;}
    .dispo-libelle{margin-bottom:15px;}
    
    /* Form Principal */
    #toggle_sal-ent{min-width:100%;}
    #etape0 label{padding:0;}
    
    /* CookieBanner */
	#cookieBanner{padding:25px 25px 60px 25px;}
	#cookieBanner .secondary-button{float:none;}
}

/* Style des tablette et moins */
@media only screen and (max-width:1024px){
	#home-dispositifs .fa-chevron-double-down{margin:0;}
	.dispo-illus{height:130px;}
}


/* Style des tablettes */
@media only screen and (min-width:767px) and (max-width:1024px){
    /* Menu Dispositifs */
    .dispo-libelle{min-height:175px;}
}

/* Style Grand Ecran */
@media only screen and (min-width:1650px){
    .bbtns-anex{height:300px;}
}