/*RESPONSIVE*/
@media only screen and (max-width: 1000px) {
	.bgZoe
	{
	display:inline;
	}
	.zoeBox
	{
	background:none;
	height:auto;
	}
	.accroche, .zoe, .box, .zoeBox span, .accroche2
	{
	display:none;
	}
}
@media only screen and (max-width: 980px) {
	.etapes div[class*="etape"], .blogueuse div[class*="etape"] 
	{
	margin: 0 28px;
	}
	.derAccroche div:nth-child(1) 
	{
	  padding-left: 10px;
	  font-size:20px;
	  margin-top:5px;
	}
}
/*@media only screen and (max-width: 800px) {
	.btTop
	{
	position:relative;
	margin:10px -92px;
	top:0;
	left:50%;
	}
	.etapes div[class*="etape"] 
	{
	margin: 0;
	}
	.blogueuse div[class*="etape"] {
	margin:0 1px;
	width: 244px;
	}
}
*/
/*@media only screen and (max-width: 768px) {*/
@media only screen and (max-width: 800px) {
	.etapes
	{
	height:auto;
	}
	.etapes div[class*="etape"],.blogueuse div[class*="etape"]  
	{
	margin: 0 60px;
	}
	.etapes div[class*="etape"]:nth-child(3),.blogueuse div[class*="etape"]:nth-child(4)  
	{
	margin-left:257px;
	}
	img[src*="merciJaune"] 
	{
	  bottom: 370px;
	  right:2px;
	}
	.h2Gris
	{
	width:100%;
	}
	.derAccroche div:nth-child(1) 
	{
	  margin-top:5px;
	  padding-left: 10px;
	}
	.derAccroche 
	{
	  font-size: 20px;
	}
	.derAccroche .btDecouvre 
	{
	  right: 10px;
	}
	.btDecouvre 
	{
	display:block !important;
	}
	img[src*="vueTV"] 
	{
	right: 300px;
	}	
}
@media (max-width: 768px) {
    #blog {
        display: block; /* Or any other desired layout */
        margin: 0;
    }

	#relative {
        display: block; /* Or any other desired layout */
        margin: 0;
    }
}
@media only screen and (max-width: 640px) {
	.etapes
	{
	height:auto;
	}
	.etapes div[class*="etape"],.blogueuse div[class*="etape"]  
	{
	margin: 0 26px;
	}
	.etapes div[class*="etape"]:nth-child(3),.blogueuse div[class*="etape"]:nth-child(4)  
	{
	margin-left:187px;
	}
	img[src*="merciJaune"] 
	{
	  bottom:455px;
	  max-height:50px;
	}
	.derAccroche div:nth-child(1) 
	{
	  margin-top:5px;
	  padding-left: 10px;
	}
	.derAccroche 
	{
	  font-size: 20px;
	  text-align:center;
	}
	.derAccroche .btDecouvre {
	  right: none;
	  bottom:none;
	  position:relative;
	  margin:10px auto;
	  
	}
}
@media only screen and (max-width: 480px) {
	.bgZoe
	{
	display:none;
	}
	.box, .accrocheMobile, .phrase3, .phrase4, .phrase6, .phrase5, .accroche2, .btDecouvreMobile, .btDecouvreMobile2 /*.zoe*/
	{
	display:block !important;
	}
	.zoeBox
	{
	/* avant 02.08.2024
	height:313px;
		OLD background-image: url("../images/background_section.jpg");
	background-image: url("../images/slider3mobileavril24.png");
	*/
	width: 100%;
	height: 610px;
	background-image: url("../images/slider3mobilejuin25.png") !important; 
	background-repeat: no-repeat;
	background-size: cover;
	 -webkit-background-size: cover; /* pour anciens Chrome et Safari */
	background-position: center center;
	}
	.accrocheMobile
	{
		position:absolute;
		top:200px;
		right:15px;
		width:414px;
		text-align:right;
		font-family:olivier;
		font-weight:bold;
		font-size:40px;
		height:70px;
		
	}
	.accrocheMobile span
	{
		display:inline !important;
		font-size:40px !important;
		position:relative !important;
	}
	.zoe
	{
		display:none;
		/*left:10px;
		top:10px;
		bottom:none;
		max-height:200px;*/
	}
	.phrase3, .phrase4, .phrase6, .phrase5
	{
		font-size:22px !important;
	}
	.phrase3 {	  
	  right: 213px;	  
	}
	.phrase4
	{
		top:2px;
	}
	.phrase6
	{
		right: 15px;
		top: 158px;
	}
	.phrase5
	{
		overflow:hidden;
		width:71px;
		height:44px;
		top:160px;
		right:255px;
	}
	.box
	{
		right:10px;
		max-width:270px;
	}
	
	/*Ajout 01.11.2016*/
	.btDecouvre 
	{
	display:none !important;
	}
	.btTop 
	{
	display:none !important;
	}
	.btDecouvreMobile
	{
	/*position:absolute;*/
	top:1px;
	/*right: 10px;*/
	margin:auto;
	/*background-image:url(../images/deco_fleche_vert.png);*/
	/*width:192px;*/
	height:61px;
	color:#ffffff;
	font-family:DKLemonYellowSun;
	font-size:30px;
	/*padding-left:100px; /*55*/
	line-height:50px;
	cursor:pointer;
	text-align:center; /*left*/
 	}
	.btDecouvreMobile:hover
	{
	/*background-image:url(../images/deco_fleche_vert_over.png);*/
	color:#ffffff;	
	}
	.btDecouvreMobile a
	{
	color:inherit;
	text-decoration:none;
	}
	.btDecouvreMobile2
	{
	position:absolute;
	top:1px;
	right: 10px;
	background-image:url(../images/deco_fleche_vert.png);
	width:192px;
	height:61px;
	color:#ffffff;
	font-family:DKLemonYellowSun;
	font-size:30px;
	padding-left:55px;
	line-height:50px;
	cursor:pointer;
	text-align:left;
	margin-top :70px;
	}
	.btDecouvreMobile2:hover
	{
	background-image:url(../images/deco_fleche_vert_over.png);
	color:#ffffff;	
	}
	.btDecouvreMobile2 a
	{
	color:inherit;
	text-decoration:none;
	}
	.etapes div[class*="etape1"]
	{
	  top: 40px; /*40px*/
	  width: 90%;
	}
	.etapes div[class*="etape1"] div ul 
	{
    margin-top:32px;
    }
	.etapes div[class*='etape'] div:not([id*='rond'])
	{
	height: 220px;	
	}
	.etapes div[class*="etape1"] div ul li
	{
    line-height: 24px; /*22px*/
    }	
	.etapes div[class*="etape2"]
	{
	  top: 40px; /*40px*/
	  width: 90%;	  
	}
	.etapes div[class*="etape3"]
	{
	  top: 40px; /*40px*/
	  width: 90%;	
	  height: 400px; /*height: 320px;*/  
	}
	.etapes div[class*="etape3"] div ul 
	{
    margin-top:32px;
    }
	.etapes div[class*="etape3"] div ul li
	{
    line-height: 27px; /*22px*/
    }
	.etapes div[class*='etape'] div:not([id*='rond']) img[src*="abonnement-v3"]
	{
	height: 100% !important;
	}
	/*Fin Ajout 01.11.2016*/
	
	.etapes div[class*="etape"], .blogueuse div[class*="etape"] {
	  float:none;
	  margin: 0 auto !important;
	}
	.blogueuse div[class*="etape"] 
	{
	margin-top:15px !important;
	}
	.h2Gris 
	{
	  height: auto;
	  width: 100%;
	  font-size: 19px;
	}
	img[src*="merciJaune"] {
	  bottom: 1600px; /*610px*/
	}
	.derAccroche div:nth-child(1) {
	  text-align:center;
	   width: 92%;
	}
	.derAccroche .btDecouvre {
	  right: none;
	  bottom:none;
	  position:relative;
	  margin:10px auto;
	}
	.derAccroche .btDecouvreMobile2 {
	/* ajout 14.04.2017*/
	  right: none;
	  bottom:none;
	  position:relative;
	  margin:10px auto;
	 /*height: 100px; */
	}
	.logoTV
	{
	height:25px; /* ajout 14.04.2017*/
	margin-right:0px;
	}
	
	div[class*='3m']
	{
	width:90%;
	padding:7px;
	margin:10px 5px 0 5px;
	}
	div[class*='3m'] img
	{
	width:100%;
	text-align:center;
	}
		.bloglien
	{
	color:#F7B9B0;
	font-size:17px;
	text-align:center;
	text-decoration: none;
 	}
		.blogtexte
	{
	color:#000000;
	font-size:15px;
	text-align:justify;
 	}	

}
@media only screen and (max-width: 414px) {
	.accroche2
	{
		font-size:23px;
	}
	img[src*="vueTV"] 
	{
	bottom:807px;
	right: 277px;
	}	
	.etapes div[class*='etape'] div ul li
	{
	margin:3px 0;
	line-height: 27px;
	}
	.newsletter-form input 
	{
	width: 200px;
	}
	
}
@media only screen and (max-width: 375px) {
	.box {
	  max-width: 210px;
	  top:20px;
	}
	.zoe {
	display: none;
	/*
	  left: 3px;
	  max-height: 180px;
	  top: 10px;
	  */
	}
	.phrase3 {
	  top:5px;
	  right: 170px;
	}
	.phrase5 {
	  right: 215px;
	  top: 150px;
	}
	.phrase6 {
	  top: 135px;
	  right:5px;
	}
	.accroche2
	{
	font-size:21px;
	}
	.phrase5 {
	  right: 198px;
	  top:108px;
	}
	.accrocheMobile {
	  top: 190px;
	}
	img[src*="vueTV"] 
	{
	bottom:807px;
	right: 257px;
	}	
}
@media only screen and (max-width: 320px) {
	.zoe {
	display: none;	 
	/* max-height: 130px !important;*/
	}
	.accroche2
	{
		bottom:0;
		font-size:20px; /*21px*/
	}
	.blogueuse h2
	{
		font-size:19px;
	}
	img[src*="merciJaune"] {
	  bottom: 1600px; /*603px*/
	}
	img[src*="vueTV"] 
	{
	bottom:807px;
	right: 227px;
	}	
	.btDecouvreMobile
	{
	right: -15px;
	}
	.btDecouvreMobile2
	{
	right: -15px;
	}
}