* {
	box-sizing: border-box;
	outline: none;
	text-decoration: none;
	transition: all .2s ease 0s;
}

*:hover {
	transition: all 0.2s ease 0s;
}

html {font-size: 62.5%}

body {
	font-family: "Open Sans", Arial;
	margin: 0 auto;
	line-height: 1.8;
	color: #FAF9FA;
	background-image:url(../img/fond3.jpg);
}

h1, h2, h3 {
	font-weight: normal;
}

								/*---------------------------*/
								/*---------RESPONSIVE--------*/
								/*---------------------------*/


/*Responsive pour Galaxy S6*/

								/*---------------------------*/
								/*----------HEADER-----------*/
								/*---------------------------*/



	body
		{
			background-image:url(../img/fondsite3.jpg);
			background-position: left;
			background-repeat:repeat;
		}
	header
	{
		width:80%;
		background-color:#D4BD8B;
		margin:0 auto;
		text-align:center;
	}


	a
	 {
	color: #f0f0f0;
	text-decoration: none;
	}

	header img
	{
		width:100%;
	}

	header img:hover
	{
		opacity:0.7;
	}

	
	a {
		color: #f0f0f0;
		text-decoration: none;
	}

	a:hover {
		color: #195F87;
	}

	.logo, h1 {
	    display: inline-block;
	    vertical-align: middle;
	    font-style: italic;
	}

	nav {
		border-bottom: 20px solid pink;
		background-image:url(../img/erable2.jpg);
	}

	/*header nav img 
	{
		width: 2%;
		padding:0;
		margin:0;
	}*/

	/* Le ul du 1er niveau */
	nav ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
	    text-align: center;
	}

	/* Les li du 1er niveau */
	nav > ul > li {
		display: inline-block;
		font-family: 'Courgette', cursive;
	}

	/* Les liens du 1er niveau */
	nav > ul > li > a {
		font-weight: bold;
		padding: 20px 30px;
		color: black;
		display: inline-block;
	}

	nav > ul > li > a:hover {
		color: white;
		background-color: #633B31;
	}

	/* La partie bleu, le 2eme niveau */
	nav .menu {
		display: none;
		position: absolute;
		background:#633B31;
		left: 10%;
	    right: 10%;
	}

	/* Le 2eme niveau s'affiche au hover */
	nav ul li:hover .menu {
		display: block;
		padding-bottom: 50px;
	}



	.menu a {
		line-height: 1.8;
	}

	.menu h2 {
		color: white;
		padding: 50px 0 15px ;
		margin: 0;
		font-size: 1.5em;
		font-family: 'Courgette', cursive;
	}

	.menu-left a:hover
{
	padding:0 10% 0 10%;
	background-color: white;
	color:black;
}


								/* MAIN */
main {
    width: 80%;
    margin:0 auto;
    line-height: 2;
    background-color: white;
    
}

main h2 
	{
	padding:3% 0 2% 0;
	text-align:center;
    font-size: 2em;
    color: black;
    font-family: 'Courgette', cursive;
   
	}

main h6
	{
	padding:3% 0 2% 0;
	text-align:center;
    font-size: 5rem;
    color: red;
    font-family: 'Courgette', cursive;
   
	}

main article h3 
{
	width: 100%;
	text-align:center;
	color: black;
	margin:0 auto;
	background-image:url(../img/erable2.jpg);
	text-align: center;
	margin-top:4%;
	font-size: 2rem;
	font-family: 'Wendy One', sans-serif;
	
}

main article h3 span
{
	margin-left: 5%;
}



main h4
{
	color: red;
	text-align: right;
	font-family: 'Wendy One', sans-serif;
	font-size: 2rem;
	margin-bottom:4%;
}

main article 
	{
		
		width:80%;
		margin:0 auto;
		color:black;
		/*background-color: yellow;*/
	}
main article img
	{
		width:25%;
		float:left;
		padding:1%;
		border-radius: 47%;
	}



main article p
	{
		padding:1% ;
		text-align:left;
		padding-bottom:0%;
		font-family: 'Courgette', cursive;
		
	}

main article span
	{
		
		text-align:right;
		padding-bottom:2%;
		padding-left: 82%;
		font-family: 'Courgette', cursive; 
		color:red;
		font-size: 2rem;
		display:inline-block;
	}

main .demo p
	{
		padding:1% ;
		text-align:left;
		padding-bottom:8%;
		font-family: 'Courgette', cursive;
		
	}


main .demo h5
	{
		font-family: 'Courgette', cursive; 
		text-align: center;
		color: blue;
		font-size: 1.2rem;
		padding:2% 0% 5% 0%;
	}

main .vidcentre
	{
		width:75%;
		display:block;
		margin-left: auto;
		margin-right: auto;
		
	}



						/*placement image a droite*/
main .imdte
	{
		
		width:100%;
		margin:0 auto;
		color:black;
		/*background-color: yellow;*/
	}

main .imdte img
	{
		width:25%;
		float:right;
		padding:1%;
	}

						/*placement image a droite non arrondie*/
main .imdtecarree
	{
		
		width:100%;
		margin:0 auto;
		color:black;
		/*background-color: yellow;*/
	}

main .imdtecarree img
	{
		width:25%;
		float:right;
		padding:1%;
		border-radius:initial;
	}

						/*differenciation des articles de vente*/
main .demo1
	{
		
		width:80%;
		margin:0 auto;
		color:black;
		/*background-color: yellow;*/
	}

main .demo1 img
	{
		width:25%;
		float:right;
		padding:1%;
	}


main .demo1 p
	{
		padding:1% ;
		text-align:left;
		padding-bottom:0%;
		font-family: 'Courgette', cursive;
		
	}

main .demo1 span
	{
		
		text-align:right;
		padding-bottom:2%;
		padding-left: 60%;
		font-family: 'Courgette', cursive; 
		color:red;
		font-size: 2rem;
		display:inline-block;
	}	
	
	
main .demo2 span
	{
		
		text-align:right;
		padding-bottom:2%;
		padding-left: 60%;
		font-family: 'Courgette', cursive; 
		color:blue;
		font-size: 2rem;
			
	}	
					/*aligner plusieurs images sur une ligne*/

#imagebloc
	{
  		display:table;

	}
#imagebloc li
	{
  		display: table-cell;
  		text-align:center;
  		table-layout: fixed;
	}
#imagebloc li img 
	{
		width:100%;
		float:none;
		padding:10%;
		display:table-cell;
		border-radius: unset;
	}
	
#imagebloc li span
	{
  		text-align:center;
  		font-size: 0.9rem;
  		color:blue;
  		padding: 0%;
  		margin-top: -30%;
  		overflow: hidden;	
	}

					/*CAROUSSEL*/


main .carrousel
	{
		text-align:center;
		width:80%;
		margin:0 auto;
		padding-bottom:5%;
		
		
	}
main .carrousel img
	{
		width:20%;
		padding:2%;
		margin-left:2%;
		margin-right:2%;

	}

main .carrousel2
	{
		text-align:center;
		
	}
main .carrousel2 img
	{
		width:10%;
		margin:10% 1% 1% 0;
	}

main .reglages h2
	{
		margin:2% 0 2% 5% ;
		text-align:center;
		font-family: 'Courgette', cursive;
		font-size: 2rem;
	}

main .reglages img
	{
		
		width:25%;
		margin-left: 38%;	
	}



						/* FOOTER */

footer
	{
		background-color: green;
		width:80%;
		margin:0 auto;
	}

footer li{
	color:black;
	padding:0 4% 0 4%;
	font-family: 'Courgette', cursive;
}

footer p
	{
		font-family: 'Courgette', cursive;
		font-weight:bold;

	}





@media only screen and (max-width: 1500px) 
{

	main article
	{
		text-align:center;
	}
	main article img
	{
		width:40%;
		padding:1%;
		float:none;
		
	}

main article p
	{
		padding:2% ;
		text-align:center;
		padding-bottom:5%;
		font-family: 'Courgette', cursive;
		font-size:1.5rem;
	}

main .imdte img
	{
		width:40%;
		padding:1%;
		float:none;
		
	}
main .demo1 p
	{
		text-align:center;
		padding:2% ;
		text-align:center;
		padding-bottom:5%;
		font-family: 'Courgette', cursive;
		font-size:1.5rem;
	}

main .demo1 img
	{
		width:40%;
		padding:1%;
		float:none;
		
	}

main .carrousel
	{
		text-align:center;
		width:80%;
		margin:0 auto;
		padding-bottom:5%;
		
		
	}
main .carrousel img
	{
		width:40%;
		padding:2%;
		margin-left:2%;
		margin-right:2%;

	}



footer li{
	color:black;
	padding:0 8% 0 10%;
	font-family: 'Courgette', cursive;
	font-size:1.3rem;
}

footer>nav>ul>li:nth-child(3)
	{
		margin-right:10%;
		margin-left:7%;
	}	


}