.fenetre
        {
        	box-shadow: 2px 2px 4px #000000;
        }
        
        .fenetre .fenetreEntete
        {
        background-color: #a591c6;
        }
        
        .texteAstuces p,
        .texteAstuces ul,
        .texteAstuces h4
        {
            font-size: 16px;
        }
        
        .astucemauve
        {
        	position:relative;
        	margin-bottom:10px;
        	background-color: #a591c6;
        }

		.astucemauve h2
		{
			padding-left: 50px;
		}

		.astucemauve .disponibleVente
			{
				display:inline; 
				cursor:pointer;
			}
        
        h2
        {
        	position:relative;
        	min-height:35px;
        }
        
       .logoDeplier
        {
        	height:30px;
        	position:absolute;
        	top:5px;
        	left:10px;
        	cursor:pointer;
        	transition: 500ms;
        	transform:rotate(90deg);
        	z-index:10;
        }
        
         .logoDeplier.ouvert
         {
         transform:rotate(-90deg);
         top:0px;
         }
        
       #suggestions
       {
       	 margin-bottom:25px;
       }
       
       #suggestions2
       {
       	text-align: center;
       	margin-bottom:20px;
       }
       
       a:visited 
       {
		  color: #dfa9e8;
		  background-color: transparent;
		  text-decoration: none;
		}
       
        button
       {      	
	border: none;
	
	background-color: #a994c5;
	color: #FFFFFF;
	font-weight: 600;	
	padding: 10px 15px;
	font-size: 16px;
	box-shadow: 6px 6px 8px #AAAAAA;
	transition: 500ms;
	margin-top: 10px;
	margin-left:15px;
	margin-right:15px;
	
}

button:hover
{
	transform:scale(1.1,1.1);
	cursor:pointer;
}

input[type="text"],
input[type="email"]
{
	font-family: inherit;
	font-size: inherit;
	height:30px;
}
        
         .texteAstuces p
         {
            line-height: 22px;
            margin-top:5px;
         }
        
        .imageAlphabet
        {
            display:inline-block;
            vertical-align: top;
            position:relative;
            width:150px;
        }
        
        .imageAlphabet img
        {
        border-radius:10px;
        box-shadow: 2px 2px 5px #000000;
        width:150px;
        }
       
       .texteAstuces 
       {
        	display: inline-block;
        	vertical-align: top;
        	width: calc(100% - 155px);
        	padding-left: 20px;
        }
        
         .astuce h3
         {
         	margin-top:5px; margin-bottom:10px;
         	color: #cc85c1;
         	transition:500ms;
         }
         
         h3.cache {
	height: 0px;
	overflow: hidden;
	margin: 0px;
}
        
        .astuce h3.deplier
        {
        	cursor:pointer;
        }
        
        .disponiblevente
        {
        	color: black; 
        	font-size: 13px; 
        	vertical-align: middle;
        	padding-left:10px;
        }

		.texteAstuce
		{
			
			height:0;
			overflow:hidden;
			transition:1s;
		}
		
		.astuce
		{
			padding-left:3vw;
			overflow:hidden;
			height:0px;
			transition:500ms;
		}
		
		.astuce.ouvert
		{
			height:auto;
		}
		
		.astuce:last-child .texteAstuce
		{
			margin-bottom:15px;
		}
		
		.texteAstuce.visible
		{
			height:auto;
		} 
		
		.entetepage
		{
		
		}
		.texteAstuce h4
		{
			text-align: right;
			font-style: italic;
			color : #9068ad;
			text-decoration: underline;
			margin-top:10px;
			margin-bottom:5px;
			padding-right:6vw;
		}

        img.lien {
	width: 30px;
	height: 20px;
	vertical-align: middle;
	margin-left: 10px;
	 color: inherit; 
	 text-decoration: none;
        }
#lettres
{
	width:30px; 
	position:fixed;
	top:90px;
	right:15px;
	font-size:23px;
	height:calc(100vh - 140px);
	display:flex;
	justify-content:center;
	flex-direction: column;
	z-index:100;
}

#lettres div {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 35px;
	height: auto;
	border: 1px solid #888888;
	margin-top: 5px;
	background-color: #9068AD;
	color: #FFFFFF;
	transition:500ms;
}

#lettres div:hover
{
	cursor:pointer;
	transform:scale(1.2,1.2);
}

	.corpsFenetre
	{
		height:calc(100% - 62px);
		overflow:auto;
	}

	.piedFenetre
	{
		height:60px;
		display:flex;
		align-items: center;
		justify-content: center;
	}
	
	.piedFenetre button
	{
		min-width:10px;
	}

#plusRecentes,
 #nouvellesAstuces
 {
 	display: inline-block;
 	vertical-align: top;
 	
 }

#plusRecentes { width: min(20vw, 150px); }
#plusRecentes img { width:100%;}


    #nouvellesAstuces
    {
    width: calc(100% - 155px);
    min-height:150px;
    margin:auto;
    padding-top:12px;
    padding-left:20px;
    text-align: center;
    

    }
    .nouvelleAstuce
    {
    	display: inline-block;
    	vertical-align: top;
    	width : 45%;
    	min-width:280px;
    	margin:2px;
    	border:2px solid #a591c6;    	
    	text-align: left;
    	padding : 7px;
    }
    
    .nouvelleAstuce:hover
    {
    	cursor:pointer;
    	
    }
    
    .titreNouvelle
    {
    	display: inline-block;
    	vertical-align: middle;
		text-align: center;
		font-weight: 600;		
		background-color: transparent;		
		font-size:15px;
		color:#9068ad;
    }

	.soustitreNouvelle
	{
    	display: inline;
    	color: #cc85c1;
    	vertical-align: middle;
    	font-style: italic;
    	font-size: 1.17em;
		text-align: center;
		margin-left:10px;
		font-size:15px;
}

	#listeAstuces
	{
	 	display:inline-block; 
	 	width:calc(100% - 25px); 
	 	vertical-align:top;
	 }



@media (max-width: 650px)
{

	#plusRecentes { margin-left:3vw }
	
	
    #contenupage {
	margin-left: 2vw;
	margin-right: 2vw;
}	
	
	#nouvellesAstuces 
	{
  		width :100%;
  		padding-left: 1vw;  		
	}
	
	.nouvelleAstuce
	{
		width:90%;
	}
	
	  .astucemauve
      {
      min-height:55px;
      display:flex;
      align-items: center;
      }
	
	.astucemauve .disponibleVente
	{
		display:block; 
		padding-left: 0px;

	}
	
	.astucemauve .disponibleVente img.lien {
	margin-left: 0px;
	}
	 
	
	.alphabet
	{
	position:relative;
	padding-top:100px;
	}
	
	.imageAlphabet 
	{
	height: 90px;
	text-align: center;
	margin-top: -90px;
	display: block;
	text-align: center;
	width: 100%;
}

	.imageAlphabet img
	{
		height:80px;
		width:auto;
	}
	
	#listeAstuces
	{
	 	width:calc(100% - 5px); 
	 }
	
	.texteAstuces 
	{
	padding-left: 1vw;
	display: block;
	width: 100%;
	}
	
	.texteAstuces h2
	{
		font-size: min(calc(2vw + 0.5em), 1.2em);
	}
	
	.texteAstuces h3
	{
		font-size: min(calc(2vw + 0.5em), 1em);
	}
	#lettres
	{
		display:none;
	}
	
	
}