#caddie
     {
     	top:40px;
     	right:80px;
     }       

         
.divarticle, .avis, #enqueteblog
{
    margin-left:4vw;
    margin-right:4vw;
}

img
{
	max-width:100%;
}

#astuces
{
	position:fixed;
	width:250px;
	height:auto;
	right:-250px;
	overflow:auto;
	bottom:20px;
	z-index:400;
	background-color: #D8C5E7;
	transition: right 1s;
	border-radius:10px 0px 0px 10px;
	box-shadow: 6px 6px 8px #AAAAAA;
	padding-bottom:10px;
}

#fermeastuces
{
	position:absolute;
	color:  #FFFFFF;
	left:5px;
	top:5px;
	width:30px;
	height:30px;
	border:1px solid #555555;
	border-radius:15px;
	display:flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(0,0,0,0.3);
}

#fermeastuces:hover
{
	cursor:pointer;
}

#astuces p
{
	line-height: 20px;
	text-align: left;
	padding-left:10px;
	padding-right:10px;
	margin-bottom: 3px
}

#astuces input[type="button"],
#astuces button {
	border: none;	
	background-color:  #FFFFFF; 
	color: #a994c5;
	font-weight: 600;
	line-height:10px;
	text-transform:none;
	cursor: pointer;
	padding: 10px 15px;
	font-size: 16px;
	box-shadow: 6px 6px 8px #AAAAAA;
	transition: 500ms;
	margin-top: 5px;
	border-radius:5px;
	transition:500ms;
	margin-left:10px;
}

#astuces input[type="button"]:hover 
{
	transform:scale(1.2,1.2);
}


#astuces.visible
{	
	right:0px;
}

.avis
{
    color:#000000;
    border:1px solid #a48dc3;
    min-height:50px;
    margin-bottom:20px;
}      
.avis form
{
    padding-left:min(1vw, 15px);
    padding-right:min(1vw, 15px);
    padding-bottom:15px;
}

.avis h2
{
    text-align: center;
}   

h3
{
	font-size: min(calc(2vw + 0.5em),1.1em);
}

.ib49
{
    width:49%;
}

.avis
{
	background: linear-gradient(to right, #f1c4db,#a48dc3,#b7dcf6);
}

.avis label, .avis span .avis p
{
	color:#FFFFFF;
}

.avis h2
{	
	color:#FFFFFF !important;
}

.avis p
{
    font-weight: 600;
} 

         
        .survey-container {
            display: flex;
            justify-content: space-between;
        }
        .survey {
            width: 95%;
            text-align: center;
        }
        .survey p {
            font-weight: bold;
        }
        .survey .options {
            display: flex;
            justify-content: center;
            gap: 20px;
        }
        .survey .options label {
            margin-right: 10px;
        }
        .survey input[type="submit"] {
            margin-top: 20px;
        }
        
        .flexcentre {
	display: flex;
	align-items: center;
	justify-content: center;
}
        
        .colonne
        {
            display: inline-block;
            vertical-align: middle;
            min-width: 320px;
        }
        
        .colonne img
        {
        	max-width:100%;
        }
        
        .colonne.gauche { width:58%; }
         .colonne.droite  {  width:38%; }
         .colonne.l20  {  width:18%; }
         .colonne.l25  {  width:22%; }
         .colonne.l30  {  width:28%; }
         .colonne.l40  {  width:38%; }
         .colonne.l50  {  width:48%; }
         .colonne.l60  {  width:58%; }
         .colonne.l70  {  width:68%; }
         .colonne.l80  {  width:78%; }
         
         
        
        #contenu
        {
            padding-top:20px;
            min-width:320px;
        }
        
       
        #listeBlogs
        {
        	margin-top:15px;
        	text-align: center;
        }
        
        
        
        .conteneurUnBlog
        {
        	position:relative;
        	display:inline-block;
        	vertical-align: top;
        	padding:10px;
        	margin:0.5%;
        	/*border:1px solid #888888;*/
        	border-radius:10px;
        	width:23%;     
			min-width:320px;  	
			min-height:160px;
			/*background-color: #FFFFFF;*/
			user-select:none;
			overflow:hidden;
			margin-bottom: min(3vw,20px);
        }
        
        .conteneurUnBlog:hover
        {
        	cursor:pointer;
        }
        
       
        .unblog
        {
			position:absolute;
        	left: 0px;
        	top: 0px;
        	right: 0px;
        	bottom: 5px;
        	transition:1s;
        	opacity:1;
        	overflow:hidden;
        }
        
        .conteneurImage
        {
        height:auto;
        }
        
        .conteneurImage img
        {
        	height:100%;
        }
        
        .unblog h2
        {
        	background-color: transparent;
        	font-size:min(0.8em, 15px);
        	color: #9068ad;
        	padding:0px 1vw;
        }
        
        .unblog img
        {
        	width:100%;
        }
        
        .unteaser
        {
        	position:absolute;
        	left: 0px;
        	top: 0px;
        	right: 0px;
        	bottom: 0px;
        	display:flex;
        	align-items: center;
        	justify-content: center;
        	padding:10px;
        	line-height:25px;
        	opacity:0;
        	transition:1s;
        	background-color: #d8c5e7;
        }
        
        .lireenquete
        {
        	position:absolute;
        	right:3px;
        	bottom:3px;
        	font-size: 0.9em;
        	font-style: italic;
        }
        
        .lireenquete:hover
        {
        	cursor:pointer;
        	text-decoration: underline;
        	color:#0000FF;
        }
        
         .iblock
         {
            display:inline-block;
            vertical-align: top;
         } 
         
        button 
         {
        	border: none;
        	text-transform: uppercase;
        	background-color: #a994c5;
        	color: #FFFFFF;
        	font-weight: 600;
        	cursor: pointer;
        	padding: 10px 15px;
        	font-size: 16px;
        	box-shadow: 6px 6px 8px #AAAAAA;
        	transition: 500ms;
        	margin-top: 10px;
        }
        
        button:hover {
	background-color: #a994c5;
	color: #FFFFFF;
	font-weight: 600;
	cursor: pointer;
	transform: scale(1.1);
}

.question,
.reponse
{
	display: inline-block;
	vertical-align: top;
}

.reponse
{
	padding-left:5px;
	font-weight: 600;
	
}

    @media (max-width: 940px)
    {

.max400
         {
         	display:block;
         	width:100%;
         }
    }
    @media (max-width: 940px)
    {
        .colonne.gauche,
        .colonne.droite
        {
            width:100%;
            padding-left:10px;
            padding-right:10px;
        }
        
        .colonne
        {
            display: inline;
        }
        
  .question
  {
  	width:calc(100% - 50px);
  	font-size: 0.8em;
  }
.reponse
{
	width:45px;
	padding-left:0px;
	font-size: 0.8em;
}

        
    }