/**************************************Corps du site et données de bases ************************************************************************************/
					
@font-face {
	font-family: 'poule';
	src: url("calibri.ttf");
}


body{
	font-family: 'poule' ,serif;
	background-color: #FFF ;
	padding: 0px ;
	margin: 0px;

}
	/*Mise en forme pour certaines images (le bd est un indice quelconque)*/
.img_bd{
	max-height: 100%;
	max-width: 100%;
}












/**************************************Header (logo + navigation)************************************************************************************/


header{
	color : #001489;
	align-items: center;
	display: flex;
	justify-content: center;
	width: 100%;
	height: 20%;
	margin : 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;


}

	/*Mise en place du logo du header*/
.logo{
	padding: 0px 0px 0px 0px ;
	width: 29%;
	height:100%;
	background-color: #EDEDF7;
	display: flex;
	justify-content: center;
}


	/*Mise en place de la navigation (forme et onglet déroulant)*/

.nav{
	width: 71%;
	height: 100%;
}


.nav> ul{
	margin: 0px;
	padding: 0px;
	height: 25%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	background-color: #212147;
}

.bandeau{
	height: 75%;
	width: 100%;
	background-color: #212147;
}

.nav >ul >li{
	float: left;
	position: relative;
	display: flex;
}

.nav li{
	list-style-type: none;
}

.nav > ul::after{
	content: "" ;
	display: block;
	clear: both;
}

.nav a{
	display: inline-block;
	text-decoration: none;
}

.nav > ul >li > a {
	padding: 0% 30px;
	height: 100%;
	color: #FFF;
	font-size: 1.3vw;
}

.submenu{
	display: none;
}

.nav li:hover .submenu{
	display: inline-block;
	position: absolute;
	top: 95.5%;
	left: 0px;
	padding: 0px;
	z-index: 100000;
}

.submenu li{
	border-bottom: 1px solid #CCC;
}

.submenu li a{
	padding:15px 30px;
	font-size: 1.3vw;
	color: #FFF;
	width: 200px;
}

.menu_prestation  .submenu{
	background-color: #212147;
}

po{  
	color:#bdbdbd;
}

.menu_connection{
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 10%;
	height: 100%;
}	

.menu_connection div{
	height: auto;
	max-height: 100%;
}

.img_hd{
	max-width: 100%;
	max-height: 100%;
	height: 100%;
}

		/* Code pour les écrans de plus de 1500px*/
@media all and (min-device-width: 1500px){
	.submenu li a{
	padding:15px 30px;
	width: 200px;}

	.nav > ul >li > a {
	padding: 0px 30px;}

	.nav li:hover .submenu{
	top: 84%;}

	.bandeau{height: 68%;}

	.nav> ul{height: 32%;}
}
		

















/**************************************Footer (logo + sommaire)************************************************************************************/


footer{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	background-color: #EDEDF7;
	font-size: 0.9vw;
	color:#000;
	height:27%;
}

@media only screen and (min-width: 1370px){
	footer{
	height:25%;
	}
}

.f_sommaire{
	list-style-type: none;
	text-decoration: none;
}

.f_sommaire>a{
	text-decoration: none;
	color:#000
}

.f_sommaire>Z>a{
	text-decoration: none;
	color:#000
}

Z{						
	font-size: 1.1vw;
}

.f_prestation{
	margin: 0px 5% 0px 0px;
	width: 25%;
}

.f_logo{
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 1.5% 5% 2% 2%;
	width: 20%;
	height: 70%;
}

.f_coordonnées{
	margin: 0px 5% 0px 0px;
	width: 23%;
}

.f_mentions{
	margin: 0px 5% 0px 0px;
	width: 20%;
} 
















/**************************************Mise en forme des différentes pages************************************************************************************/





		/*Mise en Forme de la page d'accueil*/

.accueil_section{
	width: 100%;
	height: 79%;
	margin-top: 10px;
	display: flex;
	justify-content: flex-start;

}

.carte_accueil{
	width: 46%;
	height: 100%;
	text-align: center;
	margin-right: 2%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.accueil_texte{
	height: 100%;
	width: 46%;
	text-align: justify;
	font-size: 1.39vw; 
	margin-left: 4%;
}

.accueil_texte p{
	margin-top: 3%;
}

.accueil_texte_img{
	width: 47%;
	height: 45%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 5%;
}

.accueil_img{
	height: 80%;
	margin: auto;
}






		/*Mise en Forme de la page Logistique */

.logi_section{
	width: 100%;
	height: 79%;
	font-size: 1.16vw;
}

.logi_titre{
	font-size: 1.39vw;
	font-weight: bold;
	height: 5%;
	margin: 1% 2% 0.5% 2%;
}

.logi_section li{
	list-style-type: none;
}

.logi_para1{
	margin: 0px 2% 0px 2%;
	text-align: justify;
}

.logi_para2{
	display: flex;
	justify-content: flex-start;
	width: 100%;
}

.logi_para2 li{
	margin-bottom: 0.6%;
}

.li_para_1_1{
	margin-bottom: 0.8%;
}

.li_para_1_2{
	margin-bottom: 0.6%;
}

.logi_p2_texte{
	margin-left: 2%;
	width: 63%;
	text-align: justify;
}

.logi_img{
	margin: 20px 2% 0px 3%;
	width: 30%;
}






		/*Mise en Forme de la page Administration */
.admi_section{
	width: 96%;
	height: 79%;
	font-size: 1.3vw;
	margin: 0px 2% 0px 2%;
}

.admi_titre{
	font-size: 1.39vw;
	list-style: none;
	font-weight: bold;
	height: 2%;
	margin: 1% 2% 2% 0%;
}

.admi_middle{
	height: 92%;
	display: flex;
	text-align: justify;
}

.admi_graphique{
	text-align: center;
	height: 98%;
	width: 66%;
}

.admi_texte{
	width: 34%;
	height: 98%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}





		/*Mise en Forme de la page Livraison */

.liv_section{
	width: 100%;
	height: 79%;
	font-size: 1.15vw;
}

.titre_liv{
	font-size: 1.39vw;
	list-style: none;
	font-weight: bold;
	height: 2%;
	margin: 1% 2% 0px 2%;
}

.liv_para_1{
	margin: 0px 2% 0px 2%;
	height: 20%;
	list-style: none;
	text-align: justify;
}

.liv_para_2{
	margin-left: 2%;
	display: flex;
	justify-content: flex-start;
	list-style: none;
	height: 60%;
}

.liv_text{
	width: 65%;
	text-align: justify;

}

.liv_image{
	width: 31%;
	height: 110%;
	margin-top: 3%;
	margin-left: 2%;
	text-align: center;
}





		/*Mise en Forme de la page Montage / Mise en service */

.montage_section{
	width: 100%;
	height: 80%;
	font-size: 1.3vw;
}

.titre_montage{
	font-size: 1.39vw;
	list-style: none;
	font-weight: bold;
	height: 2%;
	margin: 1% 2% 0px 2%;
}

.montage_texte-images{
	width:96%;
	height: 98%;
	margin: 0px 2% 0px 2%;
	display: flex;
	justify-content: flex-start;
	text-align: justify;
}

.montage_partie1{
	width: 39%;
}

.montage_partie2{
	width: 61%;
	text-align: center;
	display: flex;
	justify-content: space-around;
}

.montage_texte li{
	list-style: none;
}

.montage_img_p1{
	height: 60%;*
	width: 100%;
	margin-top: 2%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.montage_img1_p1{
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}

.montage_img1_p2{
	width: 50%;
}

.montage_img2_p2{
	width: 50%;
	margin-top: 15%;
}





		/*Mise en Forme de la page Point Retrait */

.ptr_section{
	width: 100%;
	height: 80%;
	font-size: 1.3vw;
}

.ptr_article{
	margin-left: 2%;
	align-items: center;
	width: 50%;
	height: 100%;
}

.ptr_texte{
	height: 40%;
	margin-top: 5%;
}

.ptr_img{
	width: 100%;
	height: 50%;
	display: flex;
}

.ptr_img1{
	margin: 17% 0px 0px 0px;
	height: 50%;
}

.ptr_img2{
	height: 105%;
	margin-left: 30%;
}






		/*Mise en Forme de la page Développement Durable */

.dvpt_section{
	width: 100%;
	height: 80%;
	font-size: 1.6vw;
	display: flex;
}

.dvpt_partie1{
	width: 66%;
}

.dvpt_partie2{
	width: 34%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

@media only screen and (min-width: 1370px){
	.dvpt_section{
	width: 100%;
	height: 80%;
	font-size: 27px;
	}
}

.dvpt_para_1{
	margin-top: : 0px;
	padding-top: : 0px;
	margin-left: 2%;
	width: 96%;
	height: 35%;
	display: flex;
	justify-content: flex-start;
}

.dvpt_para1_img{
	width: 23%;
	margin-left: 6%;
	margin-top: 2%;
}

.dvpt_para1_texte{
	margin-left: 6%;
	margin-top: 4%;
	text-align: center;
}

.dvpt_para_2{
	margin-top: : 0px;
	padding-top: : 0px;
	margin-left: 2%;
	width: 96%;
	height: 35%;
	display: flex;
	justify-content: flex-start;
}

.dvpt_para2_img{
	width: 25%;
	margin-left: 6%;
	margin-top: 3%;
}

.dvpt_para2_texte{
}

.dvpt_para_3{
	margin-top: : 0px;
	padding-top: : 0px;
	margin-left: 2%;
	width: 96%;
	height: 30%;
	display: flex;
	justify-content: flex-start;
}

.dvpt_para3_img{
	width: 38%;
	margin-left: 1.5%;
	margin-top: 2%;
}

.dvpt_para3_texte{
	margin-left: 4%;
	margin-top: 2%;
	text-align: center;
}

.dvpt_p2_img{
	height: 98%;
	text-align: center;
}






		/*Mise en Forme de la page Mentions légales / Données Personnelles */

.ment-don_section{
	width: 100%;
	height: 80%;
	display: flex;
	margin-top: 7px;
	justify-content: flex-start;
}

.ment-don_section li{
	list-style-type: none;
}

.ment-don_para1{
	margin-left: 3%;
	font-size: 1.17vw;
	margin-right: 4%;
	width: 30%;
}

.ment-don_para2{
	font-size: 1.17vw;
	margin-right: 3%;
	width: 60%;
}




		/*Mise en Forme de la page Mentions légales / Nous contacter/localiser */

.contact_section{
	width: 100%;
	height: 80%;
}

.contact_para{
	margin-left: 2%;
	margin-right: 2%;
	height: 100%;
	display: flex;
	justify-content: flex-start;
}

.ns_contacter{
	width: 50%;
	font-size: 1.2vw;
}

.ns_localiser{
	width: 50%;
	justify-content: center;
}

.ns_localiser_texte{
	font-size: 1.39vw;
	font-weight: bold;
	text-align: center;
}

.ns_localiser_img{
	text-align: center;
	margin-top: 3%;
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}

ncl1{
	display: none;
}

ncl2{
	display: flex;
	justify-content: center;
}

@media only screen and (min-width: 1370px){
	ncl1{
	display: flex;
	justify-content: center;
	height: 70%;}

	ncl2{
	display: none;}
}

.ns_contacter_titre{
	font-size: 1.39vw;
	font-weight: bold;
	text-align: center;
}
.ns_contacter_img{
	width: 80%;
	margin-left: 10%;
	margin-top: 5%;
}

.ns_contacter_texte{
	margin: 7% 0px 0px 17%;
}

.contact_section li{
	list-style-type: none;
	font-size: 0.9vw;
}



/**************************************Modification générale************************************************************************************/
 tdm{
 	font-size: 1.5vw;
 	font-weight: bold;
 }

 tdm1{
 	color: red;
 }

 tdm3{
 	font-weight: bold;
 }

 pe{
	color:#001489; 
	font-size: 1.3vw;
	font-weight: bold;
}

re{
	font-weight: bold;
	color: #212147;
}


@media only screen and (max-width: 500px){ 
	header{
		height: 8.5%;
	}

	footer{
		height:15%;
		width: 100%;
		font-size: 1.7vw;
	}

	Z {
		font-size: 1.9vw;
	}

	.f_prestation{
	width: 22%;
	}

	.f_logo{
	width: 37%;
	height: 70%;
	}

	.f_coordonnées{
	width: 21.5%;
	}

	.f_mentions{
	width: 21.5%;
	} 




	.accueil_section{
	width: 100%;
	height: 100%;
	margin-top: 10px;
	margin-right: auto;
	margin-left: auto;
	text-align: justify;
	display: flex;
	flex-direction: column;
	}

	.carte_accueil{
	width: 50%;
	text-align: center;
	margin-right: 2%;
	margin-right: auto;
	margin-left: auto;
	display: flex;
	flex-direction: column;
	}

	.accueil_texte{
	width: 65%;
	text-align: justify;
	font-size: 2.5vw; 
	margin-right: auto;
	margin-left: auto;
	display: flex;
	flex-direction: column;
	}

	.accueil_texte p{
	margin-top: 3%;
	margin-left: auto;
	margin-right: auto;
	padding-left: auto;
	padding-right: auto;
	}

	.accueil_texte_img{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	}

	.accueil_img{
	height: 70%;
	margin-left: auto;
	margin-right: auto;
	}




	.submenu li a{
	padding: 15px 30px;
	color: #FFF;
	width: 200px;
	}

	.nav > ul >li > a {
	padding: 0% 10px;
	}


	
}

@media only screen and (max-width: 1200px) {
	.submenu li a{
	font-size: 1.2vw;
	}
}