/* Sur toute la page */
body
{
    font-family: Times, Arial, Verdana, sans-serif;
	background-color:#315D27;
	background-image:url('fond.jpg');
	background-repeat:no-repeat;
	background-attachment: fixed;
	color:#606060;	
}

a {text-decoration:none; color:#606060;}
.lienvisible {text-decoration:none; color:#B8401E;}

#page
		{
		width:60%;
		margin:auto;
		background-color:white;		
		}

header, #album {
		display:flex; 
		flex-direction:column;
		}
		
nav 
{
    margin: auto;
    height: 100px;
}
 
nav .menuet
{
    display: flex;
    justify-content: space-around;
    align-items: center;
}

label
{
    display: none;
}


label, #toggle
{
    display: none;
}
	
		
#entetemobile {display:none; }
img {box-shadow: 2px 2px 5px #303030;}
.sansombre {box-shadow:none;}
#introduction {width:95%; margin:auto; text-align:center;}
#recit {width:95%; margin:auto; text-align:justify; font-style:italic; font-size:1em; padding-bottom:10px;}
#bulles {width:95%; margin-top:30px; display:flex; justify-content:space-around; flex-wrap:wrap;}

.categorie {display: flex;   justify-content: center;   align-items: center;  width:350px; height:50px; background-color:#F4EAB5; background-image:url('ardoise.jpg'); border-radius:30px; margin-bottom:20px; color:#FFFEE9; text-shadow: 2px 2px 2px #303030; box-shadow: 2px 2px 5px #303030;}
.categorie:hover {background-image:url('ardoise1.jpg'); background-color:#F4EAB5; color:#606060; text-shadow:none;}

.cartouche {display: flex;   justify-content: center;   align-items: center; width:350px; margin:auto; background-color:#F4EAB5;  border-radius:30px; background-image:url('ardoise.jpg'); color:#FFFEE9; text-shadow: 2px 2px 2px #303030; box-shadow: 2px 2px 5px #303030;}

.article {width:75%; margin-bottom:5px;}
.aside {width:176px; text-align:center; padding-right:5px;}
.rang {width:100%; display: flex; justify-content:space-around; align-items:top; }
.explication {padding-left:2%; padding-right:2%; font-size:1.2em; text-align:justify;}
.imagetexte {display:flex; flex-direction:column; align-items:center; width:45%;}

h1 {font-family:Lucida sans; font-size:2.5em; text-align:center; color:#66814E; text-shadow: 2px 2px 2px #C0C0C0;}
h2 {font-size:1.3em;}
h3 {font-size:1.1em; }
h4 {font-size:0.9em;}
h5{font-size:1.3em; color:#A36646;text-align:center;  }

p {font-size:1.5em;}
/* zomm sur image
.feuille {padding-bottom:5px; width: 10px;
transition: transform .1s;}
.feuille:hover{
-ms-transform: scale(1.5); 
-webkit-transform: scale(1.5); 
transform: scale(1.5);
}
*/
.feuille {padding-bottom:5px;}
.legende { font-size:1.2em; text-align:justify;}
.texte {font-size:1.2em; text-align:justify;}
.texte a {color:#5A883D;}
.italique {font-style:italic;}
.carte {text-align:center;  padding-bottom:15px; padding-top:15px;}
iframe {height:315px; width:98%; border-color:red;}
.fort {font-weight:bold;}
.centre {font-size:1.2em; margin:0 0 3% 0; text-align:center;}
.textepetit {font-size:0.8em;}
.petit {font-size:0.8em;}
.ligne {display:flex; flex-direction:column; align-items:center; font-size:1em; margin-top:10px; padding-bottom:10px;}
.lignedans {display:flex; flex-direction:column; align-items:center; font-size:1.2em; }
hr {color:#82B75D; width:30%; margin:auto;  margin-top:15px;}
.lignejaune {color:#FFF3B0; width:100%; margin-top:15px;}
#pied {height:97px; background-image:url('lignebas.jpg'); background-repeat:no-repeat; background-position:center;}

nav { height:auto; }
	
	
 
    nav .menuet {
        display: none;
        justify-content:space-around; flex-wrap:wrap;
		margin-bottom:15px;
		}
 
    nav .menuet a {width: 40%;}
	
	nav .onglet{height:25px; background-image:url('ardoise.jpg'); border-radius:30px; color:#FFFEE9; text-shadow: 2px 2px 2px #303030; box-shadow: 2px 2px 5px #303030; text-align:center; margin-bottom:10px;}
	
	
    label 
    {
        width: 30px;
        display: flex;
        justify-content: center;
        align-items: right;
        margin: 0 auto;
        font-size: 40px;
        color: black;
        cursor: pointer;
    }
	
	#toggle:checked + .menuet {
        display: flex;
    }
	
	

@media all and (max-device-width: 800px)
	{ 
	
	
	
		body {background-image:none;}
		#entetemobile {display:block; width:100%; height:212px; background-image:url('fondmini.jpg'); }
		#introduction {width:98%;}
		#bulles, .rang {width:100%; display:flex; flex-direction:column; align-items:center;}
		.texte {font-size:1.2em; margin:0 0 3% 0; text-align:justify;}
		.centre {font-size:1.2em; margin:0 0 3% 0; text-align:justify;}
		.categorie {width:330px; height:50px; background-color:#F4EAB5; background-image:url('ardoise.jpg'); border-radius:30px; color:#FFFEE9; text-shadow: 2px 2px 2px #303030; box-shadow: 2px 2px 5px #303030;}
		
		.cartouche {width:330px; }
		
		#page, .article, .aside {width:100%; padding-right:0;}
		.explication {width:95%;}
		.textepetit {display:none;}
		.legende {font-size:1.2em; text-align:center; margin-top:1px; }
		.imagetexte {display:flex; flex-direction:column; align-items:center; width:75%;}
		h1 {font-size:2em;}
		
	}
	
@media all and (min-device-width: 1500px)
	{ 
		
		
		body {background-image:none;}
		
		
	}