@charset "utf-8";
/* CSS Document */
*  { box-sizing:border-box; }

a:link, a:visited { color:#000; text-decoration:none; }
a:hover, a:active { color:#000; text-decoration:none; }

/* Petites annonces */
.diversContainer { width:100%; display:flex; flex-wrap:wrap; }
	.diversAnnonce { width:31.3333%; margin:1%; }
	 	.diversAnnonceBande { display:flex; max-height:72px; min-height:72px; overflow:hidden; background-color:#FF9966; margin:auto 0%; padding:2% 0%; text-align:center; }
			.diversAnnonceBande h4 { margin:auto; text-transform:uppercase; }
		.diversAnnoncePicture { width:100%; display:flex; background-color:#FFFFFF; position:relative; margin:auto; text-align:center }
			.picture {
				opacity: 1;
				display: block;
				width: 100%;
				height:auto;
				transition: .5s ease;
				backface-visibility: hidden;
				margin:5%;
				overflow:hidden;
			}
			
			.picture img { width:75%; height:auto; }
			
			.pictureHover {
				width:100%;
				transition: .5s ease;
				opacity: 0;
				position: absolute;
				top:50%;
				left:1%;
				transform: translate(-1%, -50%);
				-ms-transform: translate(-1%, -50%);
				text-align: center;
			}

			.diversAnnoncePicture:hover .picture { opacity:0.1; }
			.diversAnnoncePicture:hover .pictureHover { opacity:1; }
			.pictureHover div  { width:100%; color:#FF9900; font-size:16px; padding:5%; }
			.pictureHover div a:link, .pictureHover div a:visited { 
				width:100%;
				margin-top:20px;
				background-color:#FF9900;
				text-decoration:none;
				color:#000000;
				padding:10px 20px;
				border-radius:7px;
			}
		
			.pictureHover div a:hover, .pictureHover div a:active { text-decoration:none; color:#FFFFFF; }

	.paDiversDetails { width:95%; margin:2% auto; }
		.paDiversDetails a:link, .paDiversDetails a:visited { color:#FF9900; text-decoration:none; }
		.paDiversDetails a:hover, .paDiversDetails a:active { color:#000000; text-decoration:none; }
		
		a.btnClose:link, a.btnClose:visited { color:#000; text-decoration:none; font-weight:bold }
		a.btnClose:hover, a.btnClose:active { color:#FFF; text-decoration:none; font-weight:bold }
		
		.paDiversDetailsBande { twidth:100%; background-color:#FF9900; padding:2% 0%; display:flex; }
			.paDiversDetailsBande h4 { margin:auto; font-size:14px; text-transform:uppercase; }
				.paDiversDetailsBande h4 a:link, .paDiversDetailsBande h4 a:visited { color:#000; }
				.paDiversDetailsBande h4 a:hover, .paDiversDetailsBande h4 a:active { color:#FFFFFF; }
			.paDiversDetailsBande div { float:right; margin:0% 2%; border:#FF0000 1px solid; border-radius:6px; padding:1%; text-align:center; background-color:#F00; }
	
		.paDiversDetailsContainer { width:100%; display:flex; }
			.paDiversDetailsPict {width:35%; background-color:#FFF; padding:2%; margin-right:1%; display:flex; text-align:center; }
				.paDiversDetailsPict div { margin:auto; }
				.paDiversDetailsPict div img { max-width:90%; height:auto; }
			.paDiversDetailsText { width:65%; margin-left:1%; padding:2%; border-right:#FF9900 1px solid; }
				.paDiversDetailsText div { width:100%; margin:2% 0%; }
				.paDiversDetailsText div:first-child { margin:0% 0% 2% 0%; }			
				.paDiversDetailsText div:last-child { margin:5% 0% 0% 0%;  }
	

.paDiversForm { width:100%; }
 	.paDiversForm input { width:100%; border:#FF9900 1px solid; padding:5px 10px; margin-bottom:10px; border-radius:6px; }
 	.paDiversForm textarea { width:100%; border:#FF9900 1px solid; padding:5px 10px; margin-bottom:10px; border-radius:6px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#000000; }
	.paDiversFormButton { max-width:25%; margin:auto; cursor:pointer; }
		.paDiversFormButton:hover { background-color:#FF0000; }
		
	.formContainer { width:100%; display:flex; }
		.formContainerLeft { width:30%; padding:1%; vertical-align:top; border-left:#FF9900 1px solid; border-right:#FF9900 1px solid; }
			.formContainerLeft p { padding:0 0 5px 0; margin:0 0 15px 0; text-align:left; }
			.formErrorContainer { width:90%; display:block; margin:2% auto; padding:2%; background-color:#F7DCDC; border:#FF0000 1px solid; border-radius:6px; color:#000; }
				.formErrorMessageTop { display:flex; width:100%; }
					.formErrorMessageTopPict { width:20%; padding-right:2%; }
						.formErrorMessageTopPict img { width:100%; height:auto; }
					.formErrorMessageTopText { width:80%; }
						.formErrorMessageTopText ul { list-style-type:square; margin-top:0px; padding-top:0px; }

		.formContainerRight { width:70%; padding:1%; border-right:#FF9900 1px solid; }
			.formFieldContainer { display:block; width:90%; margin:auto; }
				.formFieldLine { width:100%; display:block; }
	
	
/* Shopping */
/* Shopping - Index */
.shopContainer { width:100%; display:flex; flex-wrap:wrap; }
	.shopAnnonce { width:31.3333%; margin:1%; }
	 	.shopAnnonceBande { display:flex; max-height:72px; min-height:72px; overflow:hidden; background-color:#FF9966; margin:auto 0%; padding:2% 0%; text-align:center; }
			.shopAnnonceBande h4 { margin:auto; text-transform:uppercase; }
		.shopAnnoncePicture { width:100%; display:flex; background-color:#FFFFFF; position:relative; margin:auto; text-align:center }
			.shopAnnoncePicturePict { opacity:1; display:flex; width: 100%; height:auto; min-height:220px; transition: .5s ease; backface-visibility: hidden; margin:5%; overflow:hidden; }
				.shopAnnoncePicturePict img { width:75%; height:auto; margin:auto }
			.shopAnnoncePicturePictHover { width:100%; transition: .5s ease; opacity: 0; position: absolute; top:50%; left:1%; transform: translate(-1%, -50%); -ms-transform: translate(-1%, -50%); text-align:justify; padding:0% 15%; overflow:hidden; }
			.shopAnnoncePicture:hover .shopAnnoncePicturePict { opacity:0; }
			.shopAnnoncePicture:hover .shopAnnoncePicturePictHover { opacity:1; }
			.shopAnnoncePicturePictHover div  { width:100%; color:#FF9900; font-size:16px; padding:25%; }
			.shopAnnoncePicturePictHover div a:link, .shopAnnoncePicturePictHover div a:visited { 
				width:100%;
				margin-top:20px;
				background-color:#FF9900;
				text-decoration:none;
				color:#000000;
				padding:10px 20px;
				border-radius:7px;
			}
		
			.shopAnnoncePicturePictHover div a:hover, .shopAnnoncePicturePictHover div a:active { text-decoration:none; color:#FFFFFF; background-color:#CCC; }

/* Shopping - Details */
.shopArticleContainer { width:100%; padding-top:10px; display:table; }
	.shopArticlePict {  width:100%; display:table-row; background-color:#FFF; }
		.shopArticlePict img { width:100%; height:auto; }
	.shopArticlePrix { width:100%; display:table-row; background-color:#FF9966; text-align:center; padding:0px 0px 20px 0px; color:#000; }
		.shopArticlePrix p { text-align:center; }
	.shopArticleButton { width:100%; background-color:#000000; text-align:center; color:#FFFFFF; }
		.shopArticleButtonInside { width:100%; display:flex; }
			.shopArticleButtonPict { width:30%; text-align:center; margin:auto; }
				.shopArticleButtonPict img { width:75%; height:auto; padding:10%; }
			.shopArticleButtonText { width:70%; text-align:center; display:flex; vertical-align:middle; }
				.shopArticleButtonText a:link, .shopArticleButtonText a:visited { color:#FFFFFF; background-color:#FF9966; padding:5px 15px; text-decoration:none; border-radius:6px; font-weight:bold; font-size:14px; }
				.shopArticleButtonText a:hover, .shopArtilceButtonText a:active { color:#000000; background-color:#FFFFFF; padding:5px 15px; text-decoration:none; border-radius:6px; font-weight:bold; font-size:14px; }
		
	
