@media screen and (max-width: 1000px) {
	h1, #relative, .zoeBox
	{
		width:100%;
		/*height:auto;*/
	}
	.details h3, .details p
	{
		width:98%;
		padding:0 1%;
	}
	.details
	{
		float:none;
		width:100%;
		height:auto;
	}
	
}
@media screen and (max-width: 590px) {
	.details, .zoeBox
	{
		height:auto;
	}
	div#left {
    float: left;
    width: 100%;
	text-align: center;
}
	div#right {
    float: leftright;
    width: 100%;
	text-align: center;
}
}
@media screen and (max-width: 450px) {
/*Ajout*/
	.details p {
	  width: 355px;
	}
	.details h3 {
	  font-size: 16px;
	}

	.bordureImg
	{
	margin-left:50px;
	}
	.rond2 {
	  top: 180px;
	}
	.rond3 {
	  top: 267px;
	}
	
		.offreul li p
	{
		font-size:12px;
		}
	.imagebox
	{
	width: 320px;
	}
/*Fin Ajout*/
}

@media screen and (max-width: 375px) {
/*Ajout*/
	.details p {
	  width: 320px;
	}
	h3 {
	  font-size: 16px;
	}

	.bordureImg
	{
	margin-left:30px;
	}
	.rond2 {
	  top: 200px;
	}
	.rond3 {
	  top: 285px;
	}
	
		.offreul li p
	{
		font-size:12px;
	}
/*Fin Ajout*/
}

	
@media screen and (max-width: 360px) {
	h3
	{
		font-size:16px !important;
	}
	
	/*Ajout*/
	.details p {
	  width: 305px;
	}

	.bordureImg
	{
	margin-left:20px;
	}
	.rond2 {
	  top: 198px;
	}
	.rond3 {
	  top: 283px;
	}
	
		.offreul li p
	{
		font-size:12px;
	}
	/*Fin Ajout*/
}
@media screen and (max-width: 320px) {
	/*Ajout*/
	.bordureImg
	{
	margin-left:5px;
	}

	.rond2 {
	  top: 215px;
	}
	.rond3 {
	  top: 320px;
	}
	.details p {
	  width: 270px;
	}
	.rond2 {
	  top: 215px;
	}
	.rond3 {
	  top: 320px;
	}
	
	
	.offreul
	{
		width:100%;
	}
	.offreul li
	{
		width:100%;
	}
	.offreul li p
	{
		font-size:11px; /*13px*/
	}
	/*Fin Ajout*/
}