@charset "utf-8";
/* CSS Document */

/* ARTICLE */
.mag .box_gris {
   font-weight:bold;
}
.mag .date {
	padding-bottom:12px;
}

.sous_titre {
    color:#7F8591;
    font-style:italic;
    margin:6px 0px 6px 0px;
    font-weight:bold;
    font-size:14px;
}
.icones {
    float:right;
    padding:0px 0px 0px 20px;

}
.photo_article {
    float:right;
    padding:4px 0px 7px 17px;
}
.photo_left {
    float:left;
    padding:0px 10px 10px 0px;
}
.box_rech_actus label {
	font-size:1.3em;
	font-weight:500;
	margin-right:10px;
}
.box_rech_actus input[type="text"] {
	width:540px;
}
.box_rech_actus input[type="submit"] {
	margin:1px 0px 0px 20px;
}



/* Version Laptop */
@media (min-width: 640px) {

/*  CES ARTICLES POURRAIENT VOUS PLAIRE  */


	div.td_img2{
		float:left;
	}

	div.box_recommandations {
		float: left;
		width: 100%;
		text-align: justify;
	}
	hr.box_recommandations {
		height: 1px;
		border-bottom: 1px solid#c2c2c2;
    	border-top: 0px;
    	border-left: 0px;
    	border-right: 0px;
    	padding: 0px;
		margin: 15px 0px 30px 0px;
		width: 50%;
}
	}
	div.date_recommandation_article1 {
		margin-top: 5px;
		
    }
    div.date_recommandation_article2 {
		margin-top: 5px;
		margin-left:20px;
	}
	div.h5_recommandation_article1 h5{
		margin-top:-10px; 
		
	}
	div.h5_recommandation_article2 h5{
		margin-top:-10px; 
		margin-left:20px;
	}
	div.image_recommandations img {
		width: 382px;
		border: black solid 1px;
	}
	div.box_text_recommandations {
		float: right;
		width:600px;
		/*text-overflow: ellipsis;
		text-align: justify;*/
	}
	div.chapo_recommandations {
		margin-left: 20px; 
		width: 600px;
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: justify;
		height:104px;
    }
    
/* ///////////////// PAGE ACTUALITE //////////////// */

	div.image_interview img{
		min-width:512px;
		min-height:210px;
		background-size: contain;
		border:1px solid black;
	}
	div.texteInterview{
		display:table-cell;
		vertical-align: middle;
	}
	div.text_interview{	
		max-height:88px;
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: justify;
	}
	div.box_dossiers{
		float:left;
		width:59%;
	}
	div.box_villes{
		float:right;
		width:40%;	
		margin-left:5px;
	}
	div.date_interview{
		padding-bottom:2px;
	}
	div.box_interim_handicap_metier .box_interim{
		display: inline-block;
		width:33%;
		height:220px;
	}
	div.box_interim_handicap_metier .box_handicap{
		display: inline-block;
		width:32.5%;
		height:220px;
	}
	div.box_interim_handicap_metier .box_metier{
		display: inline-block;
		width:33%;
		height:220px;
	}
	div.box_cabinet_stage_alternance .box_cabinet{
		display: inline-block;
		width:33%;
		height:200px;
	}
	div.box_cabinet_stage_alternance .box_stage{
		display: inline-block;
		width:32.5%;
		height:200px;
	}
	div.box_cabinet_stage_alternance .box_alternance{
		display: inline-block;
		width:33%;
		height:200px;
	}
	div.image_dossier1 img{
		width:290px;
	}
	div.image_dossier2 img{
		width:290px;
		margin-top:8px;
	}
	div.box_text_dossier{
		margin-top: -5px;
		margin-left:10px;
		float: right;
		width:290px;	
	}
	div.box_text_dossier2{
		margin-top: 2px;
		margin-left:10px;
		float: right;
		width:290px;	
	}
	div.chapodossier{
		margin-top: -5px;
		margin-left:10px;
		float: right;
		width:290px;
		height:70px;
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: justify;
	}

	div.chapodossier_cadre{
		margin-top: -5px;
		/* margin-left:10px; */
		/* float: right;
		width:290px; */
		height:39px;
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: justify;
	}

	div.image_ville{
		width:397px;
		height:165px;
		background-size: contain;
		border:1px solid black;
	}
	div.image_carres_themes{
		width:320px;
		height:131px;
		background-size: contain;
		border:1px solid black;
	}
	div.image_region_departement{
		width:661px;
		height:271px;
		background-size: contain;
		border:1px solid black;
	}
	div.lien_voirtous{
		margin-top:-35px;
	}
	div.box_text_villes{
		margin-top: 5px;
		margin-left:10px;
		width:390px;
		height:120px;
		overflow: hidden;
		text-overflow: ellipsis;	
	}
	div.chapo_villes{
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: justify;
		height: 71px;
	}
	div.box_text_region_departement{
		margin-top: -270px;
		float: right;
		width:319px;	
	}
	div.chapo_region_departement{
		float: right;
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: justify;
	}
	div.carre_titre{
		overflow: hidden;
		text-overflow: ellipsis;
		width:320px;
		height:80px;
		border:1px solid black;
		display: flex; /* contexte sur le parent */
  		flex-direction: column; /* direction d'affichage verticale */
  		justify-content: center; /* alignement vertical */
  		text-align:center;
	}
	div.carres_theme_text{
		overflow: hidden;
		text-overflow: ellipsis;
		width:320px;
		height:100px;
		border:1px solid black;	
	}
	p.carres_theme_txt{
		margin:11px;
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: center;
		height:64px;
		text-align: justify;
	}
	div.lien_interim{
		margin-right:62px;
		display: block;
    	text-decoration: underline;
    	float: right;
    	padding-top: 13px;
		font-size: 1.1em;
		text-align:center;
	}
	div.lien_handicap{
		margin-right:44px;
		display: block;
    	text-decoration: underline;
    	float: right;
    	padding-top: 13px;
		font-size: 1.1em;
		text-align:center;
	}
	div.lien_metier{
		margin-right:62px;
		display: block;
    	text-decoration: underline;
    	float: right;
    	padding-top: 13px;
		font-size: 1.1em;
		text-align:center;
	}
	div.lien_cabinet{
		margin-left:-2px;
		display: block;
    	text-decoration: underline;
    	float: right;
    	padding-top: 13px;
		font-size: 1.1em;
		text-align:center;
	}
	div.lien_stage{
		margin-right:58px;
		display: block;
    	text-decoration: underline;
    	float: right;
    	padding-top: 13px;
    	font-size: 1.1em;
	}
	div.lien_alternance{
		margin-right:46px;
		display: block;
    	text-decoration: underline;
    	float: right;
    	padding-top: 13px;
		font-size: 1.1em;
	}
	.actu_third {
		display: block;
		clear: right;
		width: 317px;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		margin-bottom: 10px;
		padding: 90px 0px 1px 0px;
		min-width:400px;
		min-height:165px;
		width:400px;
		margin-bottom: -1px;
		
	}
}

/* Version Mobile */

@media (max-width: 640px) {
    
/*  CES ARTICLES POURRAIENT VOUS PLAIRE  */

    .mag .date_recommandation_article1 {
        padding-top:10px;
    }
    .mag .date_recommandation_article2 {
        padding-top:10px;
    }

	div.box_recommandations {
		float: left;
		/* width: 100%; */
		width: 95%;
		margin-left:10px;
		margin-right:10px;
		text-align: justify;
	}

	div.h5_recommandation_article1 h5{
		margin-top: 0px;
		margin-bottom: 10px;
	}

	div.h5_recommandation_article2 h5{
		margin-top: 0px;
		margin-bottom: 10px;
	}

	div.date_recommandation_article {
		margin-top: 10px;
	}

	div.image_recommandations img{
		width:100%;
		background-size: contain;
		border:1px solid black;
	}

/* ///////////////// PAGE ACTUALITE //////////////// */

	div.image_interview img{
		min-width:310px;
		min-height:140px;
		background-size: contain;
		border:1px solid black;
	}
	div.image_dossier1 img{
		min-width:400px;
		min-height:165px;
		background-size: contain;	
		border:1px solid black;
	}
	div.image_dossier2 img{
		min-width:400px;
		min-height:165px;
		background-size: contain;	
		border:1px solid black;
	}
	div.image_ville img{		
		min-width:400px;
		min-height:165px;
		background-size: contain;
		border:1px solid black;	
	}
	
	div.text_interview{	
		max-height:90px;
		overflow: hidden;
		text-overflow: ellipsis;
		text-align: justify;
	}
	div.image_carres_themes{
		width:400px;
		height:165px;
		background-size: contain;	
		border:1px solid black;
	}
	div.image_region_departement{
		width:400px;
		height:165px;
		background-size: contain;	
		border:1px solid black;
	}
	div.lien_interim{
    	text-decoration: underline;
    	float: right;
		font-size: 1.1em;
	}
	div.lien_handicap{
    	text-decoration: underline;
    	float: right;
		font-size: 1.1em;
	}
	div.lien_metier{
    	text-decoration: underline;
    	float: right;
		font-size: 1.1em;
	}
	div.lien_cabinet{
		display: block;
    	text-decoration: underline;
		font-size: 1.1em;
		text-align: end;
	}
	div.lien_stage{
		display: block;
    	text-decoration: underline;
		font-size: 1.1em;
		text-align: end;
	}
	div.lien_alternance{
		display: block;
    	text-decoration: underline;
		font-size: 1.1em;
		text-align: end;
	}
	
}