﻿
	@font-face{font-family:'bahn'; src:url('../charte/Lilly_.ttf');}
	@font-face{font-family:'hp'; src:url('../charte/HPSimplified_Bd.ttf');}

/*	@font-face{font-family:'lucida'; src:url('../charte/LBRITED.TTF');}
	@font-face{font-family:'foot'; src:url('../charte/FTLTLT.TTF');}
*/

	*{font-family:cambria, tahoma;}
	
	h1, h2, h3, h4, h5, h6, header p, header a, header span, .big-listing h2 a, #TOP_tel{font-family:hp, bahn, arial, helvetica, sans-serif;}

.big-listing{height:500px; overflow:auto; max-width:100%; background:darkslateblue;}
	.big-listing img{max-width:40%;}
	.big-listing p{text-align:justify; font-size:1em; padding:0px 10px 15px 10px; color:rgb(200,200,255);}
	.big-listing a{color:rgb(230,220,170);}
	
mark{text-decoration:underline; background:none; color:white;}

.imgg{float:left; margin-right:7px; border-radius:7px;}
.imgd{float:right; margin-left:7px; border-radius:7px;}
.imgc{display:block; margin:auto; border-radius:7px;}

/* DOSSIER : VOYANCE PAR REGION */
.vtregion{width:100px; border-radius:3px; box-shadow:2px 2px 2px black; float:left; margin-right:10px;}
#parislist li{list-style-type:none; display:inline-block; width:45%; margin-bottom:15px; text-align:left;}
#parislist img{width:75px; height:75px; border-radius:3px; box-shadow:1px 1px 1px black; display:inline-block;}

/* FEUILLE DE STYLE BASE */
body {margin:auto; color:white; background:url('../charte/bg.jpg') no-repeat top fixed,black; background-size:cover;}
	#global{max-width:1000px; margin:auto;}
	
h1 {font-size:1.5em; font-weight:normal; text-align:left; margin:0px 0px 0px 0px; color:papayawhip;}
	h2 {font-size:1.05em; font-weight:bold; text-align:left; margin:0px; margin-bottom:5px;} /*display :inline; */
		h3 {font-size:1.2em;  font-weight:bold; text-align:left; margin:0px;}
			h4, h5, h6 {font-size:1.1em; font-weight:bold; text-align:left; margin:0px;}

.topline{font-weight:bold;}
p{font-size:1em; margin:0px; text-align:left; padding:2px;}

a{color:gold; text-decoration:none;}
	#rub0_titre h3 a{color:papayawhip;}
	
/* id présente sur l'index, il calibre la zone de la roue originelle */	 
		linear-gradient(to bottom, white, rgb(65,70,120));
		
#paveindex{padding:10px;}
#paveindex p, #paveindex h2{text-align:justify; padding:0px 20px; margin:15px 0px 5px 0px;}
	#paveindex h2{font-weight:normal;}
	
	#indextablelinks{display:flex; flex-wrap:wrap; justify-content:space-around; max-height:; overflow:auto; margin:1em 0em;}
		#indextablelinks img{max-width:300px; border:solid 8px rgba(250,150,250,0.8); transition:0.15s; margin-bottom:1em;}
		#indextablelinks img:hover{border:solid 8px rgba(250,150,250,1); box-shadow:0px 6px 8px black;}
		#indextablelinks a:hover{filter:brightness(125%); transition:0.2s;}

/* HEADER HEADER HEADER */

#linetop, #linebot{display:flex; padding:10px;}
#linetop{flex-wrap:wrap; background:url(../charte/bgtop.jpg) center; background-size:cover; border-bottom:3px solid lightblue; overflow:hidden;}
#linetop *{color:rgb(30,30,30);}
#linetop span{color:gold; text-shadow:0px 0px 0px black; text-transform:uppercase;}
	#ltl{align-items:center; }
		#VAE a{font-size:1.11em; font-weight:bold;}
		#ltl p a{font-size:1.8em;}
		#mascotte{max-width:140px; padding:0px; margin:0px 0px -20px 0px; float:left;}
		#numerov{width:250px; margin:0px 0px 0px 0px;}
	#ltr{display:flex; align-items:center; flex:1 1 auto; justify-content:flex-end;}
		#ltr p{text-align:right; padding:0px; margin:0px;}
		#ltr p span{font-size:1.5em; padding:0px; margin:0px;}
		#ltr img{max-width:140px; padding:0px; margin:0px -10px -33px 0px;}
		
#linebot{flex-wrap:non-wrap; background:linear-gradient(to bottom, rgb(55,50,85),rgb(65,60,95)), rgb(55,50,85);}
	#lbr{flex-grow:1; display:flex; align-items:center; justify-content:flex-end; flex-direction:row; background:;}
		#lbr p{font-family:tahoma; text-align:right;}
		#lbr p span{text-decoration:underline;}
	#lbl{padding-top:1em; display:flex;  align-items:center; flex-direction:row;}
		#lbl h2{background:midnightblue; width:auto; font-weight:normal; border:3px solid cornflowerblue; border-radius:15px; box-shadow:2px 5px 8px rgb(20,20,20); color:white; padding:5px; text-align:center;}
		#lbl p{text-align:center; }
		#lbl a{color:yellow; font-size:1.1em;}
		#lbl img{width:110px; margin:0px 15px 10px 0px;}
	
		
@media screen and (max-width: 860px) {
	#linebot{flex-wrap:wrap;}
	#ltr img{max-width:140px; padding:0px; margin:0px -10px -10px 0px;}
	#lbr p{font-family:tahoma; text-align:center;}

	}


header{background:; background-size:contain; overflow:hidden;}
		
	.labrique{background:linear-gradient(to bottom, rgb(30,30,65),rgb(55,50,85)), rgb(55,50,85); font-family:tahoma; padding:10px 0px 10px 10px;}

	.sect-flyer{background-image: url(../charte/fond_vide.jpg);}
	.sect-kabbale{background-image: url(../charte/fond_kabbale.jpg);}
	.sect-astro{background-image: url(../charte/fond_astrologie.jpg);}
	.sect-numbers{background-image: url(../charte/fond_numerologie.jpg);}
	.sect-tarot{background-image: url(../charte/fond_tarots.jpg);}
	.sect-voyance{background-image: url(../charte/fond_voyance.jpg);}
	.sect-revive{background-image: url(../charte/fond_reincarnation.jpg);}

	
section{position:relative; width:100%; margin:auto; z-index:1; height:634px; background-repeat:no-repeat; background-position:center;}
	section h2{padding:10px 0px 0px 0px;}
		section p{text-align:justify; font-size:0.9em; padding-bottom:10px;}
    		     
#rub0_titre, #rub1_titre, #rub1{position:relative; max-width:465px; margin:auto;}
	#rub0_titre img, #rub1_titre img, #rub1 img{max-width:100%;}
	
    #rub0_titre{top:50px; height:40px; overflow:hidden;}
		#rub0_titre h1, #rub0_titre h3, .big-listing h2{text-align:center; font-size:1.2em; font-weight:bold; line-height:20px; vertical-align:top;}
		 #rub0_titre h2{text-align:center; font-weight:normal; font-size:1.25em;}
		 
	#rub1_titre{top:70px; height:40px; overflow:hidden;}
		#rub1_titre h1, #rub1_titre h2{text-align:center; font-size:1.4em; font-weight:normal;}
	
	#rub1{top:90px; height:350px; overflow:auto; color:black; text-align:justify; padding-right:5px;}
		#rub1 h2{font-weight:normal;}
		#rub1 img{margin-bottom:10px;}
		#rub1 a{color:darkslateblue;}

    #image{position:absolute; top:100px; right:0px; width:170px; height:280px; color:black;}
    
    #menu_droite{position:relative; bottom:60px; left:810px; max-width:170px; height:220px; overflow:auto; text-align:left; vertical-align:middle;}
		#menu_droite a{color:white; text-decoration:underline;}
    
	#menu_droite_haut{position:absolute; top:100px; left:780px; width:220px; height:220px; overflow:auto; text-align:center; vertical-align:middle; font-size:14px;}
		#menu_droite_haut a{color:white; text-decoration:underline;}
    
	#article_suite{position:relative; top:120px; margin:auto; max-width:330px; height:20px; text-align:center; color:black;}
		#article_suite p{text-align:center;}
		#article_suite a{font-size:1.15em; font-weight:normal;}
			
footer, .index-global{width:100%; margin:auto; padding-top:25px; background:url(../charte/fond_footer.png) repeat-x; background-color:rgb(45,42,76); overflow:hidden;}
	footer h2{font-family:tahoma; font-weight:normal; font-size:1.25em; text-align:center; color:rgb(220,180,10); padding:10px 50px;}
	footer h2 a{color:rgb(220,180,10);}
	footer h3{text-align:center; font-weight:normal; text-decoration:underline;}
	footer p{text-align:center; padding:10px 50px;}
	
	footer a:hover{color:white;}
	
		#footermap{overflow:auto; margin-bottom:20px;}
			#footermap ul li{list-style-type:none; display:inline-block; padding:10px;}
	
		#boutonsfooter{display:flex; justify-content:space-between; align-items:center;}
			#retour{width:90px; height:90px; background:url('../charte/bouton-retour.png') no-repeat center; transition:0.15s; margin-left:15px;}
			#suite{width:90px; height:90px; background:url('../charte/bouton-suivant.png') no-repeat center; transition:0.15s; margin-right:15px;}
			#nopush{width:90px; height:90px; margin-right:15px;}
			#retour:hover, #suite:hover{filter:brightness(150%); transition:0.1s;}
	
		
#table-index{max-width:100%; margin:auto;}
	#table-index li{vertical-align:top; list-style-type:none; display:inline-block; width:15%; padding:15px 10px 15px 10px;}
	
.table-tarot{width:100%; text-align:center; border:none; padding:0px;}
.table-tarot td img{height:150px;}

/* ASTROLOGIE SPECIAUX */

#horoscope2021{display:flex; flex-wrap:wrap; overflow:auto; justify-content:space-between; }
	#horoscope2021 a{font-family:hp; text-align:center; background:rgba(220,220,220,0.8); margin-top:30px; border-radius:7px; border:1px solid grey;}
	#horoscope2021 h2{text-align:center; margin:8px 0px 0px 0px;}
	#horoscope2021 img{max-width:190px; margin-bottom:0px; padding-bottom:0px; margin-bottom:-3px;}

#celebrites{text-align:center; display:flex; flex-wrap:wrap;}
	#celebrites a{margin:15px 25px; background:rgba(220,220,220,0.8); border:1px solid black;} 
	#celebrites h2{margin-bottom:0px; text-align:center;}
	#celebrites img{max-width:170px; margin-bottom:-3px;}
.themepeople{margin-top:60px; border-radius:50%; box-shadow:2px 2px 5px black; width:150px;}
	
	#planetes-table{display:flex; flex-wrap:wrap; justify-content:space-between;}
		#planetes-table div{width:45%;}
		#planetes-table p{text-align:left;}
		
#parlons-voyance{display:flex; flex-wrap:wrap; justify-content:space-between;}
	#parlons-voyance p{width:195px; height:195px; margin:10px;}
	#parlons-voyance p a{color:yellow; font-size:1.3em; text-align:left; font-weight:bold; display:inline-block; width:180px; height:180px; padding:5px; margin:0px; text-shadow:1px 1px 1px black;}
	
#colombe{width:200px; position:absolute; bottom:10px; right:10px;}
#tampon{position:absolute; top:-10px; left:175px; width:145px;}
	
	nav {margin:0px; padding:0px; list-style-type:none; position:absolute; width:185px; z-index:100;}
		nav input, nav label {display: none;}
		nav ul{padding:0px; margin:0px;}
		nav li {padding:0px; margin:0px; position:relative; z-index:100; text-align:left; list-style-type:none; font-size: 1.1em; width:185px; background:rgb(90,95,130);}
		nav li a, nav li a:visited {display:block; text-decoration:none; color:white;}
      
	nav li li {display:none;}
		nav li:hover, nav li a:hover{background:rgb(70,75,120) linear-gradient(to bottom, white, rgb(65,70,120)); color:yellow; }
		nav li:hover li, nav li a:hover li {display:block;}
		nav li:hover ul, nav li a:hover ul{max-height:250px; background:rgb(70,75,120) linear-gradient(to right, rgb(65,70,120), rgb(130,140,240));}
	nav ul li ul {max-height:0px; transition:all 0.5s; margin:0px; padding:0px; font-size:0.85em; border-top:1px solid #cce; background:rgb(70,75,120);}
		nav li a, nav li a:visited {padding:5px 5px 5px 10px; background:rgb(70,75,120) linear-gradient(to bottom, rgb(160,150,180), rgb(65,70,120));}
		nav li li a, nav li li a:visited{color:white; padding:4px 5px 4px 20px; background:rgb(70,75,120) linear-gradient(to right, rgb(65,70,120), rgb(130,140,240));}
		nav li li a:hover {background:white; color:rgb(20,25,45);}
		
	.navindex{position:absolute; float:right; right:0px;}

#imgindex {margin:auto; width:100%; z-index:1; height:471px; position:relative; z-index:1;} 
	#topindex{height:471px; border-bottom:solid 7px white; background: url(../charte/banniere.jpg) no-repeat; background-size:cover;}
	#topassion{width:100% ; border-bottom:solid 7px white; margin-bottom:-15px;}
		.index-global h1 a, .index-global h1{text-align:center; color:white; font-weight:bold; margin:20px 0px;}
		
#pierres{text-align:center;}
#pierres div{display:inline-block; width:40%; margin:30px 15px; height:150px;}
#pierres p{text-align:center; margin-top:-180px; color:black;}

.nouveaute{border:4px solid rgb(180,180,180); float:right; max-width:400px; margin:-19px -50px 10px 10px;}

	#astuce-button{position:absolute; max-height:100%;}

/* VERSION MOBILE /!\/!\/!\ VERSION MOBILE */
	
	@media screen and (max-width: 1024px) 
	{
		#astuce-button, #menu_droite, #tampon{display:none;}
		
	}
	@media screen and (max-width: 640px) 
		{
		body{background:black;}
		
		header{border-bottom:5px midnightblue solid; }
		#topindex{background: url(../charte/bannieremobile.jpg) no-repeat; background-size:cover;}

		nav{width:100%; position:static; display:block; margin:auto; height:0px; font-size:0.95em;}
			nav li{display:inline-block; width:100%; vertical-align:top; text-align:center;}
			nav ul, nav li{overflow:hidden;}
			nav li li{display:inline-block; float:left;}
			nav ul li ul{max-height:;}
		nav li:hover li, nav li a:hover li {display:none;}
		nav li:hover ul, nav li a:hover li {max-height:0px; overflow:hidden; background:rgb(70,75,120);}		
				
		section{background-repeat:repeat; border-top:5px midnightblue solid; border-bottom:5px midnightblue solid; height:auto; padding:20px 0px;}
			section h1{color:darkmagenta; padding-bottom:10px;}
			section h3{color:black;}
		.sect-flyer, .sect-astro, .sect-numbers, .sect-tarot, .sect-kabbale, .sect-voyance, .sect-revive{background-image: url(../charte/fond_mobile.jpg);}

		.index-global{border-top:5px midnightblue solid;}
			.index-global img{max-width:100%;}

	.imgg, .imgd, .imgc{display:block; margin:auto; float:none; border-radius:7px;}

	#parlons-voyance p{max-width:90%;}

		#rub0_titre, #rub1_titre, #rub1, #article_suite {height:auto; position:static; padding:0px 5px;}
			
			#menu_droite_haut{display:none;}
			
		#image{display:none;}
		#colombe{display:none;}		
		#img-amour{height:183px; margin:0px; padding:0px; background-image: url(../charte/amour-little.jpg);}
			#img-amour img{display:none;}
		.big-listing{height:500px; overflow:auto;}
		
		#table-index li{width:45%; padding:15px 10px 15px 10px;}
		
		#footermap{height:auto; overflow:auto; margin-bottom:20px;}
			#footermap ul li{padding:5px 0px; font-size:0.9em;}
	
		#page{display:none;}
		
	nav input:not(:checked) ~ ul { max-height: 0; overflow: hidden; transition:0.5s;}
	nav input:checked ~ ul {max-height: 33em; transition:0.5s;}
	

	nav label {display:inline-block; position:absolute; top:0px; right:0px; z-index:1; height:60px; width:60px; background:white; text-align:center; font-size:0.8em; line-height:1.6; color:black;}
	
	nav label:before {content:""; display:block; height:1.6rem; width:2rem; background-color:transparent;
		background-image: -webkit-gradient(linear, left top, right top, from(black), to(black)), -webkit-gradient(linear, left top, right top, from(black), to(black)), -webkit-gradient(linear, left top, right top, from(black), to(black)); background-image: -webkit-linear-gradient(left, black, black), -webkit-linear-gradient(left, black, black), -webkit-linear-gradient(left, black, black);
		background-image: linear-gradient(to right, black, black), linear-gradient(to right, black, black), linear-gradient(to right, black, black); background-position:center top, center, center bottom; background-repeat:no-repeat; -webkit-background-size: 2rem .3rem; background-size: 2rem .3rem; margin:.8em auto 0; padding:0; outline:0; border:0; cursor:pointer; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-transition: .2s cubic-bezier(0, 1.8, 1, 1.2); transition: .2s cubic-bezier(0, 1.8, 1, 1.2); transition-property: background; }
	
	nav input:checked + label {-webkit-transform: scale(.8); transform: scale(.8);}
	nav input:checked + label::before {background-position: center, center, center;}

		}