/* CSS Document */
/* Feuille de style concours photo
version 1 - 02/2023

/* *** GENERAL *** */
body{font-family: "Open Sans", Arial, sans-serif; line-height: 1.2;}
em {font-size: 0.9em;}
#page{margin: 10px auto; max-width:900px; }
#intro{padding: 10px 0 30px 5px;}
#page #banniere{position:relative; left:-1px; max-width:100%;}
#page h2{font-size: 1.2em; font-weight: bold; padding-top: 2px;}
section{ position:relative; margin:2px 0; max-width: 100vh; border-width: 2px; border-style: outset; }
	.photoFlex{ flex-direction: row;}
	.cibler{visibility:hidden}
		.large{max-width: 100%; max-height: 74vh;}
		.haute{max-width: 100%; }
	.descriptFlex{width: 99%; min-height:100px; }
		.descriptFlex .commentaire{min-width: 250px; max-width: 500px; padding: 20px 0 20px 10px; text-align: left; font-size:13px;}
		.descriptFlex .titre{text-align: right; max-width: 250px; min-width: 200px; padding-right: 10px; font-size:0.8em;}
		.descriptFlex .titre span{font-size:0.8em; padding-left:5px;}
	.affImg img{position: relative;}
	.descript{text-align: right; padding-right: 10px; min-width: 200px; max-width: 350px;}
		.descript .commentaire{ min-width: 200px; padding: 20px 0 20px 10px; text-align: left; font-size:13px;}
		.descript .titre{text-align: right; padding-right: 10px; font-size:0.8em;}
		.descript .titre span{font-size:0.8em; padding-left:5px;}
aside{ text-align: center; max-width: 900px; margin:10px 0;}
	.Vphoto{/*display: flex;*/ list-style:none; float:left; background-color: lightgray; font-size:0.8em; border:1px solid #FFF; height:70px;}
	.Vphoto img{z-index:1;  height:100%;} 
	.Vphoto:hover{border:1px solid #944E2E;}
	.numPhoto{position:absolute; display:block; width:15px; height:15px; border-radius:9px; z-index:2; padding:2px; background-color: rgba(255,255,255,0.8);}
	.vign{ width:90px; height:50px;  border: 2px solid #CCC;}
	#neutreImg{position:absolute; top:0; bottom:0; left:0; right:0;}
	#neutreImg img{ display: inline; width: 100%; height:100%;}
#iframe{width: 100%;}
/** **DISPLAY ** **/
#page{display: block;}
.descriptFlex, .photoFlex{ display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: space-between;}
aside, .commentaire, .titre{display: inline-block;}

/* POUR VOTE */
body{font-family: sans-serif;}
h2{margin:0 0 10px 5px;}
		#page{margin: auto; max-width: 900px;}
		.nav{ width:100%; padding-bottom: 3px;}

@media screen and (max-width: 700px) {
	body{font-size: 0.9em;}
	#page{min-width: 420px}
	section{ width:100%; min-width: 420px;}
	.descript .commentaire{padding: 10px 0 10px 5px; text-align: left; width: 180px;}
	.descriptFlex .titre{width: 180px; padding-right: 5px;}
}

/* ****** CSS GENERAL ****** -------------------------------------------------------------------------

body {font-family:Arial, Verdana, sans-serif; font-size:14px;  background-color:#EFEFEF; }

/* ***** HEADER ET SON CONTENU ****** 
#header, header
{background-color:rgb(148,78,46); height:262px; border:0; margin:0; padding:0;}*

.cadrePhoto{ display: flex; flex-direction: row; }
/*menu*
#aside, aside
{ max-width: 900px; padding: 10px 5px; display: inline-block;}

/* *****formulaire***** *
#formDiv{position: fixed; top:20px; right:10px; }
#formVote{display: block; max-height:520px; max-width:480px; border:solid 1px #000;background-color: #003147;}
#formDiv{position: fixed; top:20px; right:10px; }
#formVote{display: block; height:520px; width:480px; border:solid 1px #000;background-color: #003147;}
.post{height: 100vh; margin-bottom: 10px;}
				


		/*
		.flexDiv{display:flex; flex-direction: row;}*
		.commentaire{display: inline-block; padding-left: 10px;}
		.infoPhoto{font-size:0.8em;}
		.lieu{font-weight: bold; }
		/*.images{ display: flex; flex-basis: 70vh; flex-shrink: 1;}*
		.images{display: inline-block; width:79%;}
		.images img {width:auto;}
		.large{max-width: 100%; max-height: 74vh; padding-left: 10px; }
		.haute{max-height: 61vh;}
		.commentaire{ display: inline; font-size: 1.1em;}
		.descript{overflow: auto; max-height: 750px;}
		
		@media screen and (max-width: 1030px) {
			.images{display: inline-block; max-width: 100%; float:left; }
			.commentaire{display: inline-block; width:100%; padding-left: 10px;}
			}*/