* {
	padding: 0;
	margin: auto;
}

body {
	width: 100%;
	background-color: lightgrey;
	font-family: "Arial"

}

/*** HEADER ***/

/* NAV */

	.header nav {
		background-color: black;
		height: 100px;
		border-bottom: solid 1px;
	}

	.header nav ul li {
		display: inline-block;
		list-style-type: none;
		font-family: "Myriad Pro";
		font-size: 120%;
		padding-left: 7%;
		padding-top: 3%;
		text-align: center;


	}

	.header nav ul li a {
		text-decoration: none;
		color: white;



	}

	.header nav ul li a:hover {
		text-decoration: none;
		color: blue;


	}

/* FIN NAV */


/* GAUCHE DROITE */

	.sign, .cart{
		height: 200px;
		width: 40%;
		float: left;
		border-bottom: solid;
		border-width: 1px;
	}


/* ZONE LOGO */

	.logo {
		height: 200px;
		width: 20%;
		float: left;
		background-color: white;
		border-bottom: solid;
		border-width: 1px;

	}

	.logo img {

		width: 78%;
		margin-left:10%;

	}

/* FIN ZONE LOGO */ 


/* ZONE DROITE */ 

	.sign {
		background-color: white;

	}

	.sign h4 {
		padding-left: 20%;
		padding-top: 50px;
		font-size: 14px;
	}

		#form {
	    padding-left: 30%;
	    padding-top: 20px;
		}

		#form input {
		    width: 50%;
		    height: 25px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: black;
		    border-width: 1px;
		    transition: 0.5s;
		    color: black;
		    font-size: 10px;

		}

		#form input:hover {
		    background: grey;
		}




		.cart {
		background-color: white;

	}

		.cart p {
			font-style: italic;
			padding-top: 20px;
			padding-left: 50%;
			font-size: 14px;
		}

		 #shop {
			width: 10%;
			float: right;
			background-color: white;
			margin-top: -30px;


		}


		#recherche {
width:30%;
height:24px;
background:white;
box-shadow:1px 1px 2px rgba(0,0,0,.3) inset;
border-radius:2em;
margin-top: 80px;
margin-left: 50%;

}
  
#recherche .loupe {
background:url(http://www.larevuedekenza.fr/wp-content/themes/quarter/images/sidebar/loupe.png) no-repeat 0 0;
width:24px;
}
  
#recherche input {
border: 0;
outline: 0;
height:24px;
}
  
#recherche input[type=text] {
background:none;
width:100%;
padding:0 9px;
color:#666;
}

/* FIN ZONE DROITE */

/*** FIN HEADER ***/


.plus, .article {
	width: 70%;
	height: 500px;
	margin-left: 16%;
	float: left;
}


/*** GAUCHE PRODUIT ***/ 

.produit {
	background-color: grey;
	width: 70%;
	height: 700px;
	margin-left: 16%;
	float: left;
}

	#photo{
		width: 70%;
		padding-left: 18%;
		padding-top: 8%;
	}

 	#art {
 		width: 55%;
 		height: 500px;
 		float: left;

 	}


 	.icones {
 		padding-left: 18%;
 	}

 	.icones img {
 		width: 14%;
 		padding: 7%;
 		background-color: white;
 	}

 	.icones img:hover {
 		opacity: 0.7;
 	}

/*** FIN GAUCHE PRODUIT ***/ 


/*** DROITE PRODUIT ***/ 

 	#descrip {
 		background-color: grey;
 		width: 45%;
 		height: 700px;
 		float: left;
 	}


 		#form2 {
	    padding-top: 40px;
	    padding-left: 20%;
		}

		#form2 input {
		    width: 60%;
		    height: 40px;
		    padding-left: 10px;
		    background: transparent;
		    border-style: solid;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 15px;

		}

		#form2 input:hover {
		    background: grey;
		}


		#form2 select {
			width: 60%;
		    height: 40px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: white;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 15px;
		}

		#form2 select:hover {
			background: grey;
		}

		#submit {
			padding-right: 10px;
		}

		#details {
			width: 80%;
			padding-top: 15%;
		}

/*** FIN DROITE PRODUIT ***/ 


/*** ZONE PLUS ***/ 

.plus {
	background-color: white;
}

	.chap {
		float: left;
		width: 15%;
		padding-left: 8%;
		padding-top: 50px;
		display: block;
	}

	.chap img {
		width: 120%;
		background-color: white;
		border-style: solid;
		border-width: 1px;
		
	}

	.chap img:hover {
		opacity: 0.7;
	}

	.chap h3 {
		text-align: center;
	}

	.chap p {
		text-align: center;
	}

/*** FIN ZONE PLUS ***/ 

/*** ZONE ARTICLE ***/ 

.article {
	background-color: grey;
	height: 600px;


}

#up img {
	width: 50px;
	float: left;
	margin-left: 50%;
	margin-top: 50px;
}

	.view {
		float: left;
		display: block;
		width: 25%;
		padding-left: 6%;
		padding-top: 8%;
	}

	.view h3 {
		text-align: center;
	}

	.view img {
		width: 100%;
	}

	.view p {
		text-align: justify;
	}

	.view h5 {
		float: right;
		font-style: italic;
	}

	#fedora {
		width: 50%;
		padding-left: 20%;
	}

/*** FIN ZONE ARTICLE ***/ 


/*** FOOTER ***/ 

.footer {
	background-color: black;
	height: 500px;
	float: left;
	width: 100%;
}

	.footer h3 {
		color: white;
		margin-left: 25%;
		margin-top: 5%;
		font-family: "Arial";
		font-size: 19px;

	}

	.footer nav {
		background-color: black;
		height: 350px;

	}

	.footer nav ul li {
		display: block;
		list-style-type: none;
		font-size: 14px;
		text-align: left;
		color: white;

	}

	.footer nav ul li a {
		margin-left: 20%;
		text-decoration: none;
		color: white;

	}

	.footer nav ul li a:hover {
		margin-left: 20%;
		text-decoration: underline;
		color: white;

	}

	.footer .links {
		float: left;
		width: 20%;
		background-color: black;
	}


#reseaux {
	padding-left: 30px;

}
	#reseaux img {
		width: 50px;
	}

	#reseaux a:hover img {
		opacity: 0.8;
		transition: 0.5s;
	}


#copy {
	float: right;
	background-color: black;
	color: white;
}

/*** FIN FOOTER ***/ 


h2 {
	margin-top: 5%;
}




/***** Ecran moyen ***********************************************************************************/

@media (max-width: 1024px){

/*** HEADER ***/

/* NAV */

	.header{width: auto;height: 200px;}


	.header nav ul li {
		display: inline-block;
		list-style-type: none;
		font-family: "Myriad Pro";
		font-size: 90%;
		padding-left: 8%;
		padding-top: 4%;
		text-align: center;
	}

/* FIN NAV */


/* GAUCHE DROITE */

.sign, .cart{
		height: 200px;
		width: 30%;
		float: left;
	}


/* ZONE LOGO */

	.logo {
		height: 200px;
		width: 40%;
		float: left;
		background-color: white;

	}

	.logo img {

		width: 47%;
		margin-left:20%;
		margin-top: 10px;

	}

/* FIN ZONE LOGO */ 


/* ZONE GAUCHE */ 

	.sign {
		background-color: white;

	}

	.sign h4 {
		padding-left: 5%;
		padding-top: 50px;
		font-size: 10px;
	}

		#form {
	    padding-left: 5%;
	    padding-top: 20px;
		}

		#form input {
		    width: 50%;
		    height: 20px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: black;
		    border-width: 1px;
		    transition: 0.5s;
		    color: black;
		    font-size: 8px;

		}

		#form input:hover {
		    background: grey;
		}

/* FIN ZONE GAUCHE */ 

/* ZONE DROITE */

		.cart {
		background-color: white;

	}

		.cart p {
			font-style: italic;
			padding-top: 20px;
			padding-left: 25%;
			font-size: 10px;
		}

		 #shop {
			width: 10%;
			float: right;
			background-color: white;
			margin-top: -15px;


		}



		#recherche {
width:40%;
height:24px;
background:white;
box-shadow:1px 1px 2px rgba(0,0,0,.3) inset;
border-radius:2em;
margin-top: 80px;
margin-left: 25%;

}
  
#recherche .loupe {
background:url(http://www.larevuedekenza.fr/wp-content/themes/quarter/images/sidebar/loupe.png) no-repeat 0 0;
width:24px;
}
  
#recherche input {
outline:0;
border:0;
height:24px;
}
  
#recherche input[type=text] {
background:none;
padding:0 9px;
color:#666;
}

/* FIN ZONE DROITE */

/*** FIN HEADER ***/


/*** GAUCHE PRODUIT ***/ 

	#photo{
		width: 100%;
		padding-left: 0%;
	}

 	#art {
 		width: 55%;
 		height: 500px;
 		float: left;

 	}


 	.icones {
 		padding-left: 0%;
 	}

 	.icones img {
 		width: 18%;
 		padding: 7%;
 		background-color: white;
 	}

/** FIN GAUCHE PRODUIT ***/ 


/*** DROITE PRODUIT ***/ 

#form2 {
	    padding-top: 40px;
	    padding-left: 20%;
		}

		#form2 input {
		    width: 70%;
		    height: 30px;
		    padding-left: 10px;
		    background: transparent;
		    border-style: solid;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 8px;

		}


		#form2 input:hover {
		    background: grey;
		}


		#form2 select {
			width: 60%;
		    height: 30px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: white;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 12px;
		}

		#form2 select:hover {
			background: grey;
		}

		#submit {
			padding-right: 10px;
		}


		#details {
			width: 80%;
			padding-top: 15%;
			font-size: 12px;
		}

		#descrip {
 		background-color: grey;
 		width: 45%;
 		height: 700px;
 		float: left;
 	}

/*** FIN DROITE PRODUIT ***/ 

	.plus, .article {
	height: 700px;
	margin-left: 16%;
	float: left;
}


/*** ZONE PLUS ***/

	.chap {
		float: left;
		width: 40%;
		padding-left: 5%;
		padding-top: 60px;
		display: block;
	}

	.chap img {
		width: 60%;
		background-color: white;
		border-style: solid ;
		border-width: 1px;
		margin-left: 20%;
		
	}

	.chap img:hover {
		opacity: 0.7;
	}

	.chap h3 {
		text-align: center;
		font-size: 16px;
	}

	.chap p {
		text-align: center;
		font-size: 12px;
	}

/*** FIN ZONE PLUS ***/


/*** ZONE ARTICLE ***/

	.article {
		height: 900px;
	}

	#up img {
	width: 50px;
	float: left;
	margin-left: 45%;
	margin-top: 70px;
}



	.view {
		float: left;
		display: block;
		width: 40%;
		padding-left: 6%;
		padding-top: 4%;
	}

	.view h3 {
		text-align: center;
		font-size: 14px;
	}

	.view img {
		width: 100%;
	}

	.view p {
		text-align: justify;
		font-size: 12px;
	}

	.view h5 {
		float: right;
		font-style: italic;
		font-size:10px;
	}

	#video {
		width: 50%;
		padding-left: 25%;
		padding-top: 10%;	
	}

/*** FIN ZONE ARTICLE ***/


/*** FOOTER ***/

	.footer {
	background-color: black;
	height: 500px;


	}

	.footer h3 {
		color: white;
		margin-left: 10%;
		margin-top: 5%;
		font-family: "Arial";
		font-size: 15px;

	}

	.footer nav ul li {
		display: block;
		list-style-type: none;
		font-size: 12px;
		text-align: left;
		color: white;

	}

	.footer nav ul li a {
		margin-left: 2%;
		text-decoration: none;
		color: white;

	}

	.footer nav ul li a:hover {
		margin-left: 2%;
		text-decoration: underline;
		color: white;

	}



	.links {

	}

	#reseaux {
	padding-left: 30px;

}


	#reseaux img {
		width: 50px;

	}

	#copy {
	float: right;
	background-color: black;
	color: white;
}
	

/*** FIN FOOTER  ***/

}




/***** Ecran petits ***********************************************************************************/

@media all and (max-device-width: 500px) {

/*** HEADER ***/

/* NAV */

	.header{width: auto;height: 200px;}


	.header nav ul li {
		font-size: 100%;
	}	

/* FIN NAV */


/* GAUCHE DROITE */

.sign, .cart{
		height: 250px;
		width: 30%;
		float: left;
	}

/* ZONE LOGO */

	.logo {
		height: 250px;
		width: 40%;
		float: left;
		background-color: white;

	}

	

/* FIN ZONE LOGO */ 


/* ZONE GAUCHE */ 

	.sign {
		background-color: white;

	}

	.sign h4 {
		padding-left: 5%;
		padding-top: 50px;
		font-size: 6px;
	}

		#form {
	    padding-left: 5%;
	    padding-top: 20px;
		}

		#form input {
		    width: 50%;
		    height: 15px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: black;
		    border-width: 1px;
		    transition: 0.5s;
		    color: black;
		    font-size: 5px;

		}

		#form input:hover {
		    background: grey;
		}

/* FIN ZONE GAUCHE */ 


/* ZONE DROITE */

		.cart {
		background-color: white;

	}

		.cart p {
			font-style: italic;
			padding-top: 20px;
			padding-left: 20%;
			font-size: 8px;
		}

		 #shop {
			width: 10%;
			float: right;
			background-color: white;
			margin-top: -12px;


		}


		#recherche {
width:55%;
height:24px;
background:white;
box-shadow:1px 1px 2px rgba(0,0,0,.3) inset;
border-radius:2em;
margin-top: 80px;
margin-left: 20%;
}
  
#recherche .loupe {
background:url(http://www.larevuedekenza.fr/wp-content/themes/quarter/images/sidebar/loupe.png) no-repeat 0 0;
width:24px;
}
  
#recherche input {
outline:0;
border:0;
height:24px;
}
  
#recherche input[type=text] {
background:none;
padding:0 9px;
color:#666;
}

/* FIN ZONE DROITE */

/*** FIN HEADER ***/


/*** GAUCHE PRODUIT ***/ 

	.produit {
		width: 100%;
		margin: 0;
		height: 900px;
	}


	h2 {
		font-size: 16px;
	}


/*** ZONE GAUCHE PRODUIT ***/

	#photo{
		width: 100%;

	}

 	

/*** FIN ZONE GAUCHE PRODUIT ***/


/*** ZONE DROITE PRODUIT ***/

#form2 {
	    padding-top: 40px;
	    padding-left: 20%;
		}

		#form2 input {
		    width: 70%;
		    height: 25px;
		    padding-left: 10px;
		    background: transparent;
		    border-style: solid;
		    border-color: white;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 8px;

		}

		#form2 input:hover {
		    background: grey;
		}


		#form2 select {
			width: 60%;
		    height: 25px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: white;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 10px;
		}

		#form2 select:hover {
			background: grey;
		}

		#submit {
			padding-right: 10px;
		}


		#details {
			width: 80%;
			padding-top: 15%;
			font-size: 18px;
		}


		#descrip {
 		background-color: grey;
 		width: 45%;
 		height: 1000px;
 		float: left;
 	}

/*** FIN ZONE DROITE PRODUIT ***/


	.plus, .article {
	height: 500px;
	margin-left: 16%;
	float: left;
}


/*** ZONE PLUS ***/

	.plus {
		height: 1000px;
		width: 100%;
		margin: 0;
	}


	.chap {
		float: left;
		width: 28%;
		padding-left: 14%;
		padding-top: 60px;
		display: block;
	}

	.chap img {
		width: 90%;
		background-color: white;
		border-style: solid;
		border-width: 1px; 
		margin-left: 0%;
		
	}

	.chap img:hover {
		opacity: 0.7;
	}

	.chap h3 {
		text-align: center;
		font-size: 13px;
	}

	.chap p {
		text-align: center;
		font-size: 12px;
	}

/*** FIN ZONE PUS ***/


/*** ZONE ARTICLE ***/


	.article {
		height: 2200px;
		width: 100%;
		margin: 0;
	}


	.view {
		float: left;
		display: block;
		width: 75%;
		padding-left: 12%;
		padding-top: 12%;
	}

	.view h3 {
		text-align: center;
		font-size: 22px;
	}

	.view img {
		width: 90%;
		padding-left: 5%;
	}

	.view p {
		text-align: justify;
		font-size: 20px;
	}

	.view h5 {
		float: right;
		font-style: italic;
		font-size: 18px;
	}

	#video {
		width: 75%;
		padding-left: 12%;
		padding-top: 12%;	}


/*** FIN ZONE ARTICLE ***/

/*** FOOTER ***/ 

	.footer {
	background-color: black;
	height: 500px;
	width: 100%;

	}

	.footer h3 {
		color: white;
		margin-left: 10%;
		margin-top: 5%;
		font-family: "Arial";
		font-size: 10px;

	}

	.footer nav ul li {
		display: block;
		list-style-type: none;
		font-size: 10px;
		text-align: left;
		color: white;

	}

	.footer nav ul li a {
		margin-left: 2%;
		text-decoration: none;
		color: white;

	}

	.footer nav ul li a:hover {
		margin-left: 2%;
		text-decoration: underline;
		color: white;

	}

	.links {
		
	}

	#reseaux {
	padding-right: 30px;

}

	#reseaux img {
		width: 40px;

	}

	#copy {
	background-color: black;
	color: white;
}

/*** FIN FOOTER ***/ 


h2 {
	font-size: 150%;
	margin-left: 5%;
}

}





/***** Ecran petits VU ORDI ***********************************************************************************/

@media (max-width: 480px) {

/*** HEADER ***/

/* NAV */

	.header{width: auto;height: 200px;}


	.header nav ul li {
		display: inline-block;
		list-style-type: none;
		font-family: "Myriad Pro";
		font-size: 65%;
		padding-left: 3%;
		padding-top: 10%;
		text-align: center;


	}

/* FIN NAV */


/* GAUCHE DROITE */

.sign, .cart{
		height: 200px;
		width: 30%;
		float: left;
	}

/* ZONE LOGO */

	.logo {
		height: 200px;
		width: 40%;
		float: left;
		background-color: white;

	}

	.logo img {

		width: 100%;
		margin-left:0%;
		margin-top: 10px;

	}

/* FIN ZONE LOGO */ 


/* ZONE GAUCHE */ 

	.sign {
		background-color: white;

	}

	.sign h4 {
		padding-left: 5%;
		padding-top: 50px;
		font-size: 6px;
	}

		#form {
	    padding-left: 5%;
	    padding-top: 20px;
		}

		#form input {
		    width: 50%;
		    height: 15px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: black;
		    border-width: 1px;
		    transition: 0.5s;
		    color: black;
		    font-size: 5px;

		}

		#form input:hover {
		    background: grey;
		}

/* FIN ZONE GAUCHE */ 


/* ZONE DROITE */

		.cart {
		background-color: white;

	}

		.cart p {
			font-style: italic;
			padding-top: 20px;
			padding-left: 20%;
			font-size: 8px;
		}

		 #shop {
			width: 10%;
			float: right;
			background-color: white;
			margin-top: -12px;


		}


		#recherche {
width:55%;
height:24px;
background:white;
box-shadow:1px 1px 2px rgba(0,0,0,.3) inset;
border-radius:2em;
margin-top: 80px;
margin-left: 30%;
}
  
#recherche .loupe {
background:url(http://www.larevuedekenza.fr/wp-content/themes/quarter/images/sidebar/loupe.png) no-repeat 0 0;
width:24px;
}
  
#recherche input {
outline:0;
border:0;
height:24px;
}
  
#recherche input[type=text] {
background:none;
padding:0 9px;
color:#666;
}

/* FIN ZONE DROITE */

/*** FIN HEADER ***/


/*** GAUCHE PRODUIT ***/ 

	.produit {
		width: 100%;
		margin: 0;
	}


	h2 {
		font-size: 16px;
	}


/*** ZONE GAUCHE PRODUIT ***/

	#photo{
		width: 100%;

	}

 	#art {
 		width: 55%;
 		height: 500px;
 		float: left;

 	}

 	.icones img {
 		width: 30%;
 		background-color: white;
 		margin-left: 25%;
 		margin-top: 2%;
 	}

/*** FIN ZONE GAUCHE PRODUIT ***/


/*** ZONE DROITE PRODUIT ***/

#form2 {
	    padding-top: 40px;
	    padding-left: 20%;
		}

		#form2 input {
		    width: 70%;
		    height: 25px;
		    padding-left: 10px;
		    background: transparent;
		    border-style: solid;
		    border-color: white;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 8px;

		}

		#form2 input:hover {
		    background: grey;
		}


		#form2 select {
			width: 60%;
		    height: 25px;
		    padding-left: 15px;
		    background: transparent;
		    border-style: solid;
		    border-color: white;
		    border-width: 2px;
		    transition: 0.5s;
		    color: white;
		    font-size: 10px;
		}

		#form2 select:hover {
			background: grey;
		}

		#submit {
			padding-right: 10px;
		}


		#details {
			width: 80%;
			padding-top: 15%;
			font-size: 14px;
		}


		#descrip {
 		background-color: grey;
 		width: 45%;
 		height: 700px;
 		float: left;
 	}

/*** FIN ZONE DROITE PRODUIT ***/


	.plus, .article {
	height: 500px;
	margin-left: 16%;
	float: left;
}


/*** ZONE PLUS ***/

	.plus {
		height: 700px;
		width: 100%;
		margin: 0;
	}


	.chap {
		float: left;
		width: 28%;
		padding-left: 14%;
		padding-top: 60px;
		display: block;
	}

	.chap img {
		width: 120%;
		background-color: white;
		border-style: solid;
		border-width: 1px; 
		margin-left: 0%;
		
	}

	.chap img:hover {
		opacity: 0.7;
	}

	.chap h3 {
		text-align: center;
		font-size: 13px;
	}

	.chap p {
		text-align: center;
		font-size: 12px;
	}

/*** FIN ZONE PUS ***/


/*** ZONE ARTICLE ***/


	.article {
		height: 1300px;
		width: 100%;
		margin: 0;
	}


	.view {
		float: left;
		display: block;
		width: 75%;
		padding-left: 12%;
		padding-top: 12%;
	}

	.view h3 {
		text-align: center;
	}

	.view img {
		width: 100%;
	}

	.view p {
		text-align: justify;
	}

	.view h5 {
		float: right;
		font-style: italic;
	}

	#video {
		width: 75%;
		padding-left: 12%;
		padding-top: 12%;	}


/*** FIN ZONE ARTICLE ***/

/*** FOOTER ***/ 

	.footer {
	background-color: black;
	height: 500px;
	width: auto;

	}

	.footer h3 {
		color: white;
		margin-left: 10%;
		margin-top: 5%;
		font-family: "Arial";
		font-size: 10px;

	}

	.footer nav ul li {
		display: block;
		list-style-type: none;
		font-size: 10px;
		text-align: left;
		color: white;

	}

	.footer nav ul li a {
		margin-left: 2%;
		text-decoration: none;
		color: white;

	}

	.footer nav ul li a:hover {
		margin-left: 2%;
		text-decoration: underline;
		color: white;

	}

	.links {
		
	}

	#reseaux {
	padding-right: 30px;

}

	#reseaux img {
		width: 40px;

	}

	#copy {
	background-color: black;
	color: white;
}

/*** FIN FOOTER ***/ 

	


}