body{
	background: #FFFFFF fixed no-repeat center;
	font-family: 'Source code Pro', Calibri, Serif;
	margin: auto;
	padding: auto;
}

nav{
	width: 100%;
	background-color: #808080;  /*Couleur menu*/
}

nav > ul{   /* > -> enfant direct: nav enfant direct de ul. On cible seulement les éléments ul qui sont des éléments directs de nav*/
	margin: 0px;
	padding: 0px;
}

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

nav > ul > li{  					/* Les éléments li correspondant uniquement au menu principal*/

	float: left;
	position: relative;
}

nav > ul > li > a{
	padding: 20px 170px;
	color: #FFFFFF;
}

nav > ul > li:hover a{
	padding: 15px 170px 20px 170px;

}

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

.submenu{
	display: none;
}

nav input[type=checkbox]{
	display: none;
}

nav label{
	display: none;
}

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

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

.submenu li{  /*  Concerne tous les éléments li + submenu*/
	border-bottom: 1px solid #CCCCCC;   /**/
}

.submenu li a {   /*  Concerne tous les éléments li ainsi que tous les+ submenu*/
	padding: 15px 30px;
	font-size: 13px;
	color: #222538;
	width: 270px;
}

 /*On règle les couleurs*/
 .menu-jardinage:hover{
 	border-top: 5px solid #e44d26;
 	background-color: rgba(228, 77, 38, 0.15);
 }

 .menu-informatique:hover{
 	border-top: 5px solid #3388E8;
 	background-color: rgba(000, 112, 192, 0.15);
 }

 .menu-sport:hover{
 	border-top: 5px solid #BBBBBB;
 	background-color: rgba(220, 220, 220, 0.15);
 }

 /*Couleur de fond sous-menu*/
 .menu-jardinage .submenu{
 	background-color: rgb(230, 100, 40);
 }

 .menu-informatique .submenu{
 	background-color: rgb(000, 160, 240);
 }

 .menu-sport .submenu{
 	background-color: rgb(250, 215, 100);
 }

 /*Changement couleur passage souris*/
 .submenu li:hover a{
 	color: #FFFFFF;  /*blanc*/
 	font-weight: bold;
 }

 .menu-jardinage .submenu li:hover{
 	background-color: rgb(210, 77, 60);
 }

 .menu-informatique .submenu li:hover{
 	background-color: rgb(000, 115, 200);
 }

.menu-sport .submenu li:hover{
	background-color: rgb(200, 165, 75);
}

nav input[type=checkbox]:checked ~ ul{
	display: block;
}

@media screen and (max-width: 780px){
	.menu-mobile{
		display: block;
		color: #FFFFFF;
		background-color: #406969;
		opacity: 0.97;
		text-align: center;
		padding: 12px 0px;
	}
	nav ul{
		display: none; /*Le menu s'affiche au clic*/
	}
	nav ul li, nav ul li a{
		width: 100%;
		text-align: center;
	}
	nav ul li a, nav ul li:hover a{
		padding: 10px 0px;
	}
	nav li:hover .submenu{
		display: block;
		position: static;
	}
}
		/*Titre princiale*/

  /* Reste de la page*/

h4{   /* titre sous le panier*/
	float: right;
	position: absolute;
	font-family: 'Lobster', Georgia, Times, Serif;
	top: 9%;
	left: 90%;
	opacity: 0.99;	
}

h1{
	text-align: center;
	color:#3388E8;
}

p{    /*Paragraphe*/
	font-family: 'Crimson Text', Georgia, Times, serif;
	font-size: 25px;
	line-height: 25px;
	text-align: center;
	color:black ;
	
}
article{
	text-align: center;
}

	/*Background*/

	

footer{
	display: flex;
	font-family: 'Source code Pro', Calibri, Serif;
	color: black;
	background-color: #FFFFFF;
	border-top: solid;
	border-color: #808080;
	border-width: 1px;
	font-size: 15px;

}

section{
	display: flex;
	font-family: 'Source code Pro', Calibri, Serif;
	color: black;
	background-color: #FFFFFF;
	border-color: #808080;
	border-width: 1px;
}

aside{
	display: flex;
	font-family: 'Source code Pro', Calibri, Serif;
	color: black;
	background-color: #FFFFFF;
	border-color: #808080;
	border-width: 1px;
}



.vente {
	position: absolute;
	width: 100%;
	height: 25%;
	top: 0%;
	left: 0%;
	}

.adresse_mail{
	color: #000000;
	text-decoration: none;
	font-size: 15px;
}




.photos{
	left:50%;
	height: 90px;
	width: 90px;
	margin-left: 50%;
}

 

.titre{
	color:#3388E8;
	font-size: 30px;
	text-decoration: underline;
	text-align: center;
	font-family: 'Crimson Text', Georgia, Times, serif;
	opacity: 0.99;

}

.titre1{
	text-align: center;
	font-family: 'Lobster', Georgia, Times, Serif;
	font-size: 50px;
	line-height: 100px;
	margin-top: 3%;
	opacity: 0.99;
	color: #000000;
	

	}
	
.caddie {   /*pannier*/
	width: 50px;
	height: 50px;
	float: right;
	position: absolute;
	top: 4%;
	left: 90%;
	border: outset;
	color: black;
}
	/*Lorsque l'on passe la souris sur le panier*/
.caddie:hover {
	color: #000000;
	border-color: #FFFFFF;
	flex-direction: right;
}


.validation_panier{
	text-align: center;
	border: outset;
	box-shadow: 2px 2px 2px black ;
	text-decoration: underline;
	color: black;
	margin-left: 40%;
	margin-right:40%;
}

.validation_panier:active{
	background-color: black;
	color: white;
}

.votre_panier{
	text-align: center;
	color: black;
	text-decoration: underline;

}

.retour_mdp{
	text-align: center;
	text-decoration: underline;
	color: black;
}

