/* police ecriture des liens*/
@font-face { 	
	font-family: "rexlia_rg"; 	src: url('../font/rexlia_rg.ttf'); 
}

/*redimenssionement de la page en fonction de la taille d'ecran*/
@media screen and (max-width: 1024px){
	div.mainevacuation{
	flex-wrap: wrap;
	}
	div.header{
	flex-wrap: wrap;
	}
	div.pliage{
	width: 90%;
	}
	div.ral img{
		width: 90%;
	}
	div.ral:hover {
	transform: scale(1.3);
	transition: 0.3s;
	}
	div.mainmap{
		flex-wrap: wrap;
	}
}

/*lien NAV*/
a{ 
	font-family: 'rexlia_rg'; 
	font-size: 1em;
}

/*définition de la taille general de la police pour utiliser les em */
html{
	font-size: 100%;
}

body{
	/*background-image: url(../img/texturealu.jpg);*/
	background: #ffffff;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
}

/*couleur header*/
header{
	background-color: #ffffff;
	display: flex;
	justify-content: center;
	box-shadow: 1px 1px 10px 1px #015873;
	order: 1;
}

/*menu + image alignement*/
div.header{
	display: flex;
	/*background-color: beige;*/
	justify-content: center;
    align-items: center;
}

/*menu de navigation*/
/* sans puce et cote a cote */

nav{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
}

nav ul{
	display: flex;
	flex-wrap: wrap;
	margin-right: 20px;
}

nav ul li{
	list-style-type: none;
	display: inline-block;
	/*background-color: red;*/
	margin-left: 10px;
}

/*couleur des liens et fond*/
nav ul li a{
	color:  #000000;
	text-decoration: none;
	/*background-color: #e1e1e1;*/
}

/*couleur lien survol*/
nav ul li:hover a{
	color: #018fbb;
}

/*li adresse*/
li.adresse{
	font-family: monospace;
	font-size: 1em;
}

/*integration googlemap*/
div.gmap_canvas{
	display: flex;
	border-radius: 10px;
}

div.mainmap{
	width: 100%;
	display: flex;
}

div.map{
	width: 100%;
	height: 100%;
	margin:  15px;

}

div.superdiv{
	width: 100%;
}
div.formulaire{
	text-align: justify;
	background-color: #60d9ff ;
	border-radius: 10px;
	margin: 15px;
}

div.formulaire p{ 
	padding: 5px;
}

div.boxcontact{
	/*display: flex;
	flex-direction: column;*/
	background-color: #bfedfc ;
	border-radius: 10px;
	margin: 15px;
	padding: 15px;
	font-family:'verdana';
	font-size: 1em;
	font-weight: 600;
	text-align: left;
}

div.boxcontact input{
	padding: 10px;
	border: 1px solid #015873;
	border-radius: 10px;
	outline-color: #000000;
}

div.nomprenom input{
	width: 80%;
	padding: 10px;
}

div.a{
	margin-top: 20px;
	padding: 1px;
}

div.nomprenom2{
	display: flex;
	width: 100%;
}

div.b{
	display: flex;
	flex-direction: column;
	margin-top: 20px;
	padding: 1px;
}

textarea{
	padding: 10px;
	border: 1px solid #015873;
	border-radius: 10px;
}

div.boxcontact input.envoyer{
	background-color: #cfd4d6;
	border: 1px solid #015873;
	border-radius: 10px;
	width: 25%;
}

div.boxcontact input.envoyer:hover{
	background-color: #60d9ff ;
	border-color: #000000;
}


/* centre de la page */	
/* alignement du contenu par rapport au bloc central */	
div#contenu div.contenucenter{
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: #ffffff;
	text-align: center;
	width: 90%;
	margin-left: 5%;
	margin-top: 15px;
	/*height:  90vh;*/
	box-shadow: 1px 1px 10px 1px #015873; 
	/* 	valeur1= décalage horizontal de l'ombre  
		valeur2= décalage vertical de l'ombre
		valeur3= flou
		valeur4= agrandissement de l'ombre
	 */ 
}

div#contenu div.contenucenter2{
	display: flex;
	flex-direction: column;
	background-color: #ffffff;
	text-align: center;
	width: 80%;
	margin-left: 10%;
	margin-top: 15px;
	/*height:  90vh;*/
	box-shadow: 1px 1px 10px 1px #015873; 
	/* 	valeur1= décalage horizontal de l'ombre  
		valeur2= décalage vertical de l'ombre
		valeur3= flou
		valeur4= agrandissement de l'ombre
	 */ 
}

div#contenu div.contenucenter3{
	display: flex;
	flex-direction: column;
	background-color: ffffff;
	text-align: center;
	width: 80%;
	margin-left: 10%;
	margin-top: 15px;
	border-radius: 10px;
	/*height:  90vh;*/
	box-shadow: 1px 1px 10px 1px #015873; 
	/* 	valeur1= décalage horizontal de l'ombre  
		valeur2= décalage vertical de l'ombre
		valeur3= flou
		valeur4= agrandissement de l'ombre
	 */ 
}

div#contenu div.contenucenter4{
	display: flex;
	flex-direction: column;
	background-color: ffffff;
	text-align: center;
	width: 80%;
	margin-left: 10%;
	margin-top: 15px;
	/*height:  90vh;*/
	border-radius: 10px;
	box-shadow: 1px 1px 10px 1px #015873; 
	/* 	valeur1= décalage horizontal de l'ombre  
		valeur2= décalage vertical de l'ombre
		valeur3= flou
		valeur4= agrandissement de l'ombre
	 */ 
}

#contenu{
	order: 2;
}

.contenucenter{
	border-radius: 10px;
}

/*taille des images en fonction de l'original*/
div.photo img{
	width: 40%;
	height: 40%;
}

/* page evaciation */
div.mainevacuation{
	display: flex;
	align-items: center;
	justify-content: space-between;
	/*background-color: gray;*/
}

div.photo{
	margin: 15px;
	width: 100%;
	transition: 0.3s;
	/*background-color: blue;*/
}

div.photo:hover {
	transform: scale(1.3);
	transition: 0.3s;
}

div.text{
	/*background-color: blue;*/
	width: 100%;
}

div.separateur{
	background-color: black;
	width: 100%;
	height: 1px;
}

/*couleur de police interieur*/
div#contenu div.contenucenter p{
	color: #black;
	font-family:'verdana';
	font-size: 1em;
	margin-left: 20px;
	margin-right: 20px;
}	

div#contenu div.contenucenter2{
	color: #black;
	font-family:'verdana';
	font-size: 1em;
}

strong{
	font-weight: 600;
	font-size: 1em;
}

h1{
	font-family: 'rexlia_rg';
	font-size: 1em;
	background-color: #60d9ff;
	border-radius: 10px;
	width: 90%;
	margin-left: 5%;
}

h2{	
	font-family: 'rexlia_rg';
	font-size: 1em;
	background-color: #60d9ff;
	border-radius: 10px;
	width: 100%;
	margin:  0 auto;
}

div.mainpliage{
	display: flex;
	flex-direction: column;
	align-items: center;
	/*background-color: gray;*/
	width: 100%;
}

.pliage{
	text-align: center;
	width: 50%;
	/*background-color: blueviolet;*/
}

.ral{
	margin-top: 15px;
	margin-bottom: 15px;
	width: 100%;
	transition: 0.3s;
	/*background-color: blueviolet;*/
}

.ral img{
	width: 50%;
	height: 50%;
	border-radius: 10px;
	cursor: zoom-in;
}

.ral:active {
	transform: scale(1.3);
	transition: 0.3s;
}

p.titre{
	font-family: 'rexlia_rg';
	font-size: 1em;
	background-color: #60d9ff;
	border-radius: 10px;
	width: 90%;
	margin-left: 5%;
}

p.diametre{
	background-color: #bfedfc;
	border-radius: 10px;
	width: 90%;
	margin-left: 5%;
}

p.plus{
	background-color: #bfedfc;
	border-radius: 10px;
	width: 90%;
	margin-left: 5%;
}

p.diametrepliage{
	color: #black;
	font-family:'verdana';
	font-size: 1em;
	background-color: #bfedfc;
	border-radius: 10px;
	width: 100%;
	margin:  0 auto;
}

/*Accessoires*/
.haut{
	width: 100%;
}
.conteneurphoto{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-content: space-around;
	align-items: center;
	/*background-color: #bfedfc ;*/
	border-radius: 10px;
	width: 80%;
	margin:  0 auto;
	padding: 15px;
}
.photoaccess img{
	width: 80%;
	height:80%;
	border-radius: 10px;
}

p.info{
	color: #black;
	font-family:'verdana';
	font-size: 1em;
	background-color: #bfedfc;
	border-radius: 10px;
	width: 80%;
	margin: 0 auto;
	margin-bottom: 15px;
}

.txttop{
	text-align: justify;
	margin-left: 10%;
	margin-right: 10%;
	padding-top: 5px;
}
.imgmid{
	width: 95%;
 	border-radius: 20px;
 	overflow: hidden;
}

.slides{
	width: 200%;
	height: 100%;
	display: flex;
}

.slides input{
	display:  none;
}

.slide{
	transition: 4s;
}

.navman{
	position: relative;
	margin-top: -40px;
	margin-bottom: 20px;
	display: flex;
	justify-content: center;
}

.manbtn{
	/*border: 2px solid #018fbb;*/
	padding: 5px;
	border-radius: 10px;
	cursor: pointer;
	transition: 0.7s;
}

.manbtn:not(last-child){
	margin-right: 35px ;
}

.manbtn:hover{
	/*background-color: #00c3ff;*/
}

#radio1:checked ~ .first{
	margin-left: 0px;
}
#radio2:checked ~ .first{
	margin-left: -667px;
}
#radio3:checked ~ .first{
	margin-left: -1500px;
}
#radio4:checked ~ .first{
	margin-left: -2200px;
}
#radio5:checked ~ .first{
	margin-left: -2800px;
}
#radio6:checked ~ .first{
	margin-left: -3100px;
}

.navauto{
	position: relative;
	margin-top: -40px;
	margin-bottom: 20px;
	display: flex;
	justify-content: center;
}

.navauto div{
	/*border:  2px solid #018fbb;*/
	padding: 5px;
	border-radius: 10px;
	transition: 4s;
}

.navauto div:not(last-child){
	margin-right: 35px;
}

#radio1:checked ~ .navauto .autobtn1{
	/*background: #018fbb;*/
}
#radio2:checked ~ .navauto .autobtn2{
	/*background: #018fbb;*/
}
#radio3:checked ~ .navauto .autobtn3{
	/*background: #018fbb;*/
}
#radio4:checked ~ .navauto .autobtn4{
	/*background: #018fbb;*/
}
#radio5:checked ~ .navauto .autobtn5{
	/*background: #018fbb;*/
}
#radio6:checked ~ .navauto .autobtn6{
	/*background: #018fbb;*/
}

.txtbottom{
	text-align: justify;
	margin-left: 10%;
	margin-right: 10%;
	padding-bottom: 5px;
}

/*couleur pied de page*/
footer{
	box-shadow: 3px 3px 10px 1px #015873;
	background-color: #ffffff;
	order: 3;
	margin-top: 15px;
}
p.footer{
	text-align: center;
	font-family: 'verdana';
	font-size: 0.8em;
}