/* Couleurs : 

Voir commun.css

 */

/* PAGE ACCUEIL --------------------------------------------------------------------- */


/* Zone contextuelle */

#div-zone-contextuelle{
	margin-top : 1.5625em;
    min-width: 100%;
	height: auto;
    align-items: center;
    position: relative;
    display: flex;
}

#div-zone-contextuelle-cadre{
	margin: auto;
	min-width: 95%;
	padding-bottom: 1.25em;
}
#div-zone-contextuelle-cadre a{
	color : #0051a7 !important; 
	/*text-decoration: underline;*/
}

#div-zone-contextuelle-gauche{
	padding: 0 0 0 1.25em;
}
#div-zone-contextuelle-droite{
	padding: 0;
}
#div-zone-contextuelle-gauche{
	padding-top: 2em;
}

.div-zone-contextuelle-gauche-cadre{
	min-width: 100%;
	float: right;
}

.div-tuile{
	background-color: transparent;
	color : #3D566E; /* bleu */
	font-weight: 600;
	min-width: 40%;
	padding: 0;
	padding-right : 1.25em;
}

.div-tuile-cadre{
	background-color: white;
	height: 17.5rem;
	min-width : 100%;
	margin : 0 0 1.25em 0;
	padding : 5.625em 1.875em 7.625em 1.875em ;
	background-repeat:no-repeat;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}

#div-tuile-cadre-0{
	background-image: url('../images/background/tuile-0.png');
}
#div-tuile-cadre-1{
	background-image: url('../images/background/tuile-1.png');
}
#div-tuile-cadre-2{
	background-image: url('../images/background/tuile-2.png');
}
#div-tuile-cadre-3{
	background-image: url('../images/background/apprentissage.png');
}
#div-tuile-cadre-4{
	background-image: url('../images/background/echanger.png');
}
#div-tuile-cadre-5{
	background-image: url('../images/background/bourses.png');
}
#div-tuile-cadre-6{
	background-image: url('../images/background/parcoursplus.png');
}

.div-tuile-cadre span{
    box-shadow: inset 0 -1.0em 0 0 white;
    line-height: 1;
	color: #3d566e;
	font-size : 1.5em;
	font-weight: 700;
	cursor: pointer;
}

.div-tuile-cadre button{
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    text-align: left;
}

.div-tuile-cadre-overlay-arrow{
	position:absolute;
	right: 4.5%;
	bottom : 5%;
	background-color : white;
	min-width: 3.125rem; 
	min-height: 3.125rem;
	text-align: center;
	line-height: 3.5;
	cursor: pointer;
}
.div-tuile-cadre-overlay-arrow a{
	color: #3d566e;
}
.div-tuile-cadre-overlay-arrow span{
	font-size: 1.5em;
}

#div-tuile-twitter-cadre{
	margin : 0;
	min-width: 100%;
	float: left;
	padding: 0 1.25em 0 0 ;
}

#div-tuile-twitter-cadre iframe{
	min-width: 87%;
	min-height : 24.75em !important;
	border: 0.125em solid #e5eaef !important; /* light grey*/
}

.iframe-full-height iframe{
	min-height : 24.75em !important;
}
.iframe-small-height iframe{
	min-height : 21.5625em !important;
}

.div-tuile-jaune{
	padding: 0.4375em 0.9375em 0 0 ;
}

.div-tuile-jaune-cadre{
	background-color: #e2c838;	
	padding: 0.265em 0 0.265em 0 ;
	width: 100%;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	color : #3D566E; /* blue*/
	font-size: 1.19em;
	font-weight: 700;
	line-height: 1.20em;
	margin : 0;
}

.div-tuile-jaune-cadre > div{
	width: 90%;
}

.div-tuile-jaune-cadre > div:nth-child(1){
	min-width: 1.875em !important;
	padding-right: 0;
}
.div-tuile-jaune-cadre > div:nth-child(2){
	padding-right: 0.625em;
	padding-left: 0;
}

.div-tuile-jaune-cadre img{
	text-align: center;
	padding-top: 0.3125em; 
}

.div-tuile-grise-cadre span.fa{
	text-align: center;
	font-size: 1.6em;
}

.div-tuile-grise-cadre a{
	color : #3D566E; /* blue*/
	text-decoration: none;
}

.modal-video-parcoursup{
  	text-align: center;
    min-width: 100%;
}
.modal-video-parcoursup .modal-content{
    min-width: 100%;
    position: relative;
    min-height: 0;
}

.modal-video-parcoursup iframe{
    min-width: 100%;
    min-height: 29.375em;
    position: absolute;
    top: 0;
    left: 0;
}

/* RESPONSIVE ------------------------------------------------------------------------------------------------*/


@media (max-width: 1707px) {
  #div-tuile-twitter-cadre {
	min-width: 12.5em;
	margin: auto;
	display: block;
	text-align: center;
  }
}
@media (max-width: 1633px) {
  .div-tuile-jaune-cadre div:nth-child(1){
  	padding: 0 0 0 0.625em;
  }
   .div-tuile-jaune-cadre div:nth-child(2){
  	padding: 0 0.625em 0 0;
  }
@media (max-width: 1281px) {
    div-tuile-jaune-cadre{
		font-size: 0.9375em;
  	}
}
@media (max-width: 1209px) {
   .div-tuile-jaune-cadre{
		font-size: 0.9375em;
  	}
	.div-tuile-jaune-cadre img{
	  	width: 1.875em;
	}
    
}
@media (max-width: 991px) {
	#div-tuile-twitter {
		text-align: center;
	}
	#div-tuile-twitter-cadre {
		padding : 0 ;
	}
    #div-tuile-twitter iframe {
		text-align: center;
		min-width: 24.0625em !important;
	}
	.div-tuile-jaune{
		text-align: center;
		padding: 0 ;
  	}
	.div-tuile-jaune-cadre{
		font-size: 1.125em;
  	}
  	.div-tuile-jaune-cadre img{
		min-height: 2.25em;
  	}
    .div-tuile-jaune-cadre div:nth-child(1){
		padding-left: 0.3125em;
    }
     .div-tuile-jaune-cadre div:nth-child(2){
		padding-left: 0;
		text-align: center !important;
    }
    .div-tuile-cadre-overlay-arrow{
		height: 2.5rem;
		width: 2.5rem;
		line-height: 3.2;
		right: 4.5%;
		bottom : 6.5%;
	}
    
}

@media (max-width: 896px) {
	.btn-bloc-phase-couleur{
		font-size: 0.6875em !important;
	}
	 .div-tuile-cadre span{
		font-size: 1.25em ;  	
	  }
}

@media (max-width: 844px) {

  #div-zone-contextuelle-gauche{
	margin-bottom: 0.9375em;
  }
  
  .div-tuile-cadre{
  	padding-top : 5.625rem;
  }
		
	#div-tuile-twitter {
	margin: auto;
  }
  
  #div-tuile-twitter-cadre {
	min-width: 12.5em;
	margin: auto;
	display: block; 
	text-align: center;
  }
  #div-tuile-reseaux,
  #div-tuile-contactez-nous{
  	text-align: center !important;
  }
   .div-tuile-cadre-overlay-arrow{
		height: 2rem;
		width: 2rem;
		line-height: 3.25;
		right: 4.5%;
		bottom : 6.5%;
	}
}

@media (max-width: 767px) {
  .div-tuile-cadre span{
		font-size: 1.5rem !important;  	
  }
    .div-tuile-jaune-cadre{
		font-size: 1.25em;
  	}
  	.div-tuile-jaune-cadre img{
		min-height: 2.5625em;
  	}
    .div-tuile-jaune-cadre div:nth-child(1){
		padding-left: 1.5625em;
		min-width: 70% !important;
    }
   	.div-tuile-jaune-cadre div:nth-child(2){
  		padding-left: 1.5625em;
  		min-width: 30% !important;
  	}	
	.div-tuile-cadre-overlay-arrow{
		right: 2.3%;
		bottom : 6%;
		height: 1.375rem;
		width: 1.375rem;
	}
}

@media (max-width: 532px) {
   .div-tuile-jaune-cadre div:nth-child(1){
		padding-left: 0.625em;
		min-width: 70% !important;
    }
   	.div-tuile-jaune-cadre div:nth-child(2){
  		padding-left: 0;
  		min-width: 30% !important;
  	}	
  	.div-tuile-cadre-overlay-arrow{
		bottom : 5%;
		
	}
}

@media (max-width: 474px) {
  
  #div-tuile-twitter {
	margin: auto;
  }
  
  #div-tuile-twitter-cadre {
	min-width: 12.5em;
	margin: auto;
	display: block;
	text-align: center;
  }
  .div-tuile-jaune-cadre div:nth-child(1){
		padding-left: 1.5625em;
		width: 100% !important;
    }
   	.div-tuile-jaune-cadre div:nth-child(2){
  		padding-left: 1.5625em;
  		width: 100% !important;
  	}	
  
}