*{margin:0px; padding:0px; font-family:calibri;}

@font-face{font-family:'delicat'; src:url('charte/HARNGTON.TTF');}

body{background:url(charte/bg.jpg) fixed no-repeat, rgb(240,240,240); background-size:cover;}

a{text-decoration:none; color:white; font-weight:bold; }
	article a{color:tomato;}
	a:hover, aside div:hover p{color:peachpuff;}
	
	h1{font-family:delicat, calibri;}
	
	header{height:280px; max-width:1100px; margin:auto;}
	header div{margin:75px 0px 0px 0px; color:white; font-weight:bold;}
		header h1{float:left; font-size:2.5em; text-shadow:-1px 1px 0px black, -2px 2px 0px black;}
		header h2{float:left; font-size:2.5em; text-shadow:-1px 1px 0px black, -2px 2px 0px black;}
			header h1 a{font-family:delicat, calibri;}
			header h2 a{font-family:delicat, calibri;}
		header span{font-weight:bold; text-shadow:0px 2px 0px black;}
			#le0892 a{font-family:calibri; color:goldenrod; font-size:1.1em;}
		
		header p{color:rgb(20,20,20); font-weight:bold; background:rgba(200,200,200,0.5); border-radius:10px; padding:0px 5px; font-family:delicat; float:right; text-align:right; margin-top:15px; font-style:italic; font-size:1.45em; text-shaow:0px 1px 0px rgb(30,30,30), 0px 2px 0px rgb(30,30,30);}
			#textcb{background:blanchedalmond; border-bottom:solid 2px darkgoldenrod; border-right:solid 2px darkgoldenrod; color:rgb(50,50,50); font-family:calibri; text-align:center; font-style:normal; font-size:1.65em;}
			#textcb a{color:rgb(50,50,50);}
			#textcb span a{color:goldenrod;font-size:1.1em;}
	
	nav{background:linear-gradient(to bottom, tomato 0%, tomato 50%, crimson 50%, crimson 100%); padding:10px 0px; text-align:center; height:25px;}
	nav div{max-width:1100px; margin:auto;}
		nav p, nav ul{display:inline-block;}
		nav p{float:left; color:white; font-family:delicat;}
	
	nav input, nav label {display:none;}
		
		nav li{list-style-type:none; display:inline-block; width:170px; color:white; font-weight:bold; vertical-align:top; text-align:left; text-indent:5px;}
		nav li a{display:block;}
			nav ul li ul{height:0px; font-size:0px; background:crimson;}
			nav ul li ul li {display:block; padding:5px 5px 5px 0px;}
			nav ul li:hover ul{height:auto; font-size:1em;}


	section{background:snow; max-width:1100px; margin:-35px auto 0px auto; border-top:45px solid tomato; font-size:1.1em;}
		section img{max-width:100%;}
		
		article{display:inline-block; width:65%; min-height:590px; padding:3.5%; color:rgb(50,50,50);}
			article h1{font-size:2em;}
			article p{margin-bottom:10px;}
			article ul{margin:0px 0px 10px 1.5em;}
			
		aside{display:inline-block; float:left; width:25%; margin-top:-85px; padding:1.5%; font-weight:bold;}
			aside div{width:100%; height:250px; margin-bottom:10px; border:outset 0px tomato;}
				aside div:hover{filter:contrast(180%); filter:brightness(1.5); transition:0.25s;}
				aside div p{background:crimson; padding:5px; text-align:center; text-shadow:1px 1px 0px black; box-shadow:0px 2px 2px black; color:white;}
				
			#a1{background:url(charte/icovoyance.jpg) no-repeat center; background-size:cover;}
			#a2{background:url(charte/icosecret.jpg) no-repeat center; background-size:cover;}
			#a3{background:url(charte/icofindlove.jpg) no-repeat center; background-size:cover;}
			#aV{background:url(img/voyance.jpg) no-repeat center; background-size:cover}
			#aVA{background:url(img/voyance-amour.jpg) no-repeat center; background-size:cover}
			#aVG{background:url(img/voyance-gratuite.jpg) no-repeat center; background-size:cover}
			#aVGA{background:url(img/voyance-gratuite-amour.jpg) no-repeat center; background-size:cover}
			
		section h1{text-align:center; padding-bottom:20px;}
		section p{text-align:justify;}
		
		footer{background:rgba(250,250,250,0.5); text-align:center; margin-top:100px; padding:20px 0px;}
			footer a{color:rgb(20,20,20); font-weight:normal;}
			
	/* SPECIAUX */
		.imgd{float:right; margin-left:10px;}
		.imgg{float:left; margin-right:10px;}
		.imgc{display:block; margin:10px auto; border:1px solid white;}

	#compilationArticles{display:flex; flex-wrap:wrap; justify-content:space-between;}
			#compilationArticles p{text-align:left; margin:20px 25px; width:25%;}

	@media screen and (max-width: 640px) 
	{	
		body{background:none;}
		
		header{height:auto; background:url(img/bg-amour.jpg) center; background-size:cover;}
		header div{padding:10px 0px 0px 0px; margin:0px;}
		header h1{padding:0px; text-align:center; float:none;}
			#le0892{font-size:0.85em; font-family:calibri;}
			
			header p{border-radius:0px; padding:0px 5px; font-family:delicat; float:none; text-align:center; margin-top:15px; font-size:1.05em;}
			#textcb{border-right:none; text-align:center; font-style:normal; font-size:1.15em; height:;}
			
		section{margin-top:0px;}
			section p{text-align:left;}
			
		article{width:95%; padding:10px; min-height:auto;}
			article h1{font-size:1.5em;}
		
		aside{display:block; float:none; width:95%; margin:auto;}
		aside div{height:250px; width:95%; margin:0px auto 10px auto;}
		
		footer{margin-top:10px;}
		
		nav{padding:0px; height:auto; background:crimson;}
			nav p{display:none;}
			nav ul{width:100%;}
				nav li{display:block; width:100%;}
				nav li a{display:block; padding:10px 0px;}
					nav ul li ul{transition:0.2s;}
					nav ul li ul li{background:tomato;}

		nav ul li:hover ul{height:0px; font-size:0px; padding:0px;}
		
			nav input:not(:checked) ~ ul {max-height:0; overflow:hidden; transition:0.2s;}
				nav input:checked ~ ul {max-height:25em; transition:0.2s;}

			nav #li1 input:not(:checked) ~ ul {height:0px; transition:0.2s;}
			nav #li1 input:checked ~ ul {height:auto; font-size:1em; transition:0.2s;}
			nav #li2 input:not(:checked) ~ ul {height:0px; transition:0.2s;}
			nav #li2 input:checked ~ ul {height:auto; font-size:1em; transition:0.2s;}
			nav #li3 input:not(:checked) ~ ul {height:0px; transition:0.2s;}
			nav #li3 input:checked ~ ul {height:auto; font-size:1em; transition:0.2s;}
			
			#li1 label, #li2 label, #li3 label{float:right; width:30px; height:30px; background:url("charte/arrow-down.png")no-repeat center; background-size:contain; margin:-40px 20px 0px 0px;}
			nav ul li ul label {display:block; position:static; padding:10px 0px; margin:auto; font-size:1.5em; text-align:center; color:white; transition:0.2s;}
			nav #li1 input:checked + label, nav #li2 input:checked + label, nav #li3 input:checked + label{background:url("charte/arrow-up.png") no-repeat center; background-size:contain;}
				
			nav label {display:block; position:static; padding:10px 0px 0px 0px; margin:auto; font-size:1.6em; font-weight:bold; text-align:center; color:white; transition:0.2s;}
				nav input:checked + label {-webkit-transform: scale(.8); transform: scale(.8); transition:0.1s;}
	}