*
{
	font-family:"Trebuchet MS", "arial", "times new roman";
}

table
{
	width:100%;
}

.centrer
{
	text-align:center;
}
.droite
{
	text-align:right;
}
.gris
{
	color: rgba(255, 255, 255, 0.2)
}

.oeil
{
	display:inline-block;
	vertical-align:top;
}
.oeil2
{
	display:inline-block;
	vertical-align:top;
}
.ssimg
{
	margin-top:0px;
	margin-bottom:0px;
	margin-right:15px;
	text-align:right;
	font-size:0.8em;
}





/*Corps de la page*/
.CorpsPage
	{
		background-color: rgba(0, 0, 0, 0.7);
		margin:auto;
		margin-top:50px;
		min-width:800px;
		max-width: 1150px;
		border-radius: 15px;
		width:90%;
		padding:20px;
		padding-top:1px;
		opacity:1;
	}

	a
	{
		text-decoration: none;
		color:white;
	}
	a:hover
	{
		text-decoration: underline;
	}

	
	
	
	
	
/*Titre dans la page*/
	h1  
	{
		font-size:3em;
	}

	h2
	{
		line-height:0em;
	}

	
	
	
	
	
	
	
/*Grand titre en arrière plan*/
	.GrandTexteFond
	{
		position:absolute;
		top:5px;
		right:10px;
		font-size:7em;
		color:white;
		opacity:0.3;
		z-index:-1;
	}











/*Menus sur la droite*/
	.TitreMenu
	{
		font-size:2em;
		font-weight:bold;
		color: rgba(255, 255, 255, 0.5);
		margin-left: 20px;
	}
	.ContenuMenu
	{
		margin-left: 30px;
	}
	.textemenu
	{
		line-height:0em;
	}
	.drapeaux
	{
		display:inline-block;
		vertical-align:-1px;
	}
	
	
	/* Menu 1*/
		.Titre1Menu1
		{
			position:absolute;
			height:40px;
			width:200px;
			right:-60px;
			top:140px;
			font-size:1.5em;
			z-index:-1;
			transform:rotate(270deg);
			-webkit-transform:rotate(270deg);
		}
		.MenuDroite1
		{
			position:absolute;
			right:0px;
			top:90px;
			width:10px;
			height:170px;
			padding:10px;
			border-radius: 10px 0 0 10px;
			background-color: rgba(0, 0, 0, 1);
			transition: width 2s, background 2s;
			-webkit-transition: width 2s, background 2s;
			font-size:1em;
			white-space: nowrap;
			overflow : hidden;
		}
		.MenuDroite1:hover
		{
			width:300px;
			background-color: rgba(0, 0, 0, 0.8);
			font-size:1em;
			transition: width 0.5s, background 0.5s;
			-webkit-transition: width 0.5s, background 0.5s;
		}




	/*Menu 2*/
		.Titre1Menu2
		{
			position:absolute;
			height:40px;
			width:200px;
			right:-60px;
			top:380px;
			font-size:1.5em;
			z-index:-1;
			transform:rotate(270deg);
			-webkit-transform:rotate(270deg);
		}
		.MenuDroite2
		{
			position:absolute;
			right:0px;
			top:290px;
			width:10px;
			height:210px;
			padding:10px;
			border-radius: 10px 0 0 10px;
			background-color: rgba(0, 0, 0, 1);
			transition: width 2s, background 2s;
			-webkit-transition: width 2s, background 2s;
			font-size:1em;
			white-space: nowrap;
			overflow : hidden;
		}
		.MenuDroite2:hover
		{
			width:300px;
			background-color: rgba(0, 0, 0, 0.8);
			font-size:1em;
			transition: width 0.5s, background 0.5s;
			-webkit-transition: width 0.5s, background 0.5s;
		}


	/*Menu 3*/
		.Titre1Menu3
		{
			position:absolute;
			height:40px;
			width:200px;
			right:-60px;
			top:580px;
			font-size:1.5em;
			z-index:-1;
			transform:rotate(270deg);
			-webkit-transform:rotate(270deg);
		}
		.MenuDroite3
		{
			position:absolute;
			right:0px;
			top:530px;
			width:10px;
			height:170px;
			padding:10px;
			border-radius: 10px 0 0 10px;
			background-color: rgba(0, 0, 0, 0.8);
			transition: width 2s, background 2s;
			-webkit-transition: width 2s, background 2s;
			font-size:1em;
			white-space: nowrap;
			overflow : hidden;
		}
		.MenuDroite3:hover
		{
			width:300px;
			background-color: rgba(0, 0, 0, 0.8);
			font-size:1em;
			transition: width 0.5s, background 0.5s;
			-webkit-transition: width 0.5s, background 0.5s;
		}
		
		
		
		
	
	
	
	
	
	
	

	
	
	
	
	
	
/*Formulaires*/
	form
	{
		display:inline-block;
	}

	.form_commentaire
	{
		width:100%;
	}
	
	.upload
	{
		width:400px;
		height:50px;
	}

	input
	{
		border:none;
		border-radius: 5px;
		background-color: rgba(255, 255, 255, 0.2);
		color: white;
		padding-left:10px;
		padding-right: 10px;
		padding-top:3px;
		padding-bottom:3px;
		min-width:50px;
		outline: none;
	}
	input:hover
	{
		background-color: rgba(0, 0, 50, 0.5);
		color: white;	
		cursor: pointer;
	}

	.bouton_affichage
	{
		width:100px;
		/*height:25px;*/
		padding-left:0px;
		padding-right: 0px;
		margin:0px;
	}

	.faux_bouton
	{
		display:inline-block;
		/*margin-top:5px;*/
		border:none;
		border-radius: 5px;
		background-color: rgba(255, 255, 255, 0.2);
		color: gray;
		padding-top:3px;
		padding-bottom:3px;
		width:100px;
		outline: none;
		font-size:0.8em;
		text-align:center;
	}
	.vraifaux_bouton
	{
		display:inline-block;
		margin-top:5px;
		border:none;
		border-radius: 5px;
		background-color: rgba(255, 255, 255, 0.2);
		color: white;
		padding-top:3px;
		padding-bottom:3px;
		width:100px;
		outline: none;
		font-size:0.8em;
		text-align:center;
	}
	.vraifaux_bouton:hover
	{
		background-color: rgba(0, 0, 50, 0.5);
	}	

	.boutonmodifsuppr
	{
		margin-left:20px;
	}

	.form_modif_creer
	{
		width:300px;
		height:1.5em;
		display:inline-block;
		vertical-align:top;
		border-radius: 5px;
		background-color: rgba(255, 255, 255, 0.2);
		resize: none;
		font-family:"Trebuchet MS", "arial", "times new roman";
		color: white;
		outline: none;
	}

	
	
	
/*Affichage modif/suppr*/
	.modif_suppr
	{
		position:fixed;
		bottom:0px;
		border-radius: 10px 10px 0 0;
		background-color: rgba(20, 20, 50, 0.95);
		padding: 10px;
		text-align:center;
		min-width:770px;
		max-width: 1130px;
		width:90%;
	}

	
	
	
	
	
/*Affichage Photo */
	#FondPhoto
	{
		width:100%;
		height:100%;
		background-color: rgba(0, 0, 0, 0.7);
		position:fixed;
		top:0px;
		left:0px;
		visibility:hidden;
	}
	#PagePhoto
	{
		height:100%;
		overflow:auto;
		text-align:center;
		min-width:500px;
	}
	#droite
	{
		position:absolute;
		right:50px;
		top:50%;
	}
	#gauche
	{
		position:absolute;
		left:50px;
		top:50%;
	}
	#croix
	{
		position:absolute;
		right:55px;
		top:20px;
	}
	#imgcroix,#imgdroite,#imggauche
	{
		border:none;
	}
	#fondnoir
	{
		background:linear-gradient(to right, rgba(0,0,0,0), black 80%);
		position:absolute;
		top:0px;
		right:0px;
		width:200px;
		height:100%;
		z-index:-1;
	}
	#cadrephoto
	{
		/*border: 1px blue solid;*/
		width:auto;
		height:100%;
		display:inline-block;
		margin:auto;
	}
	#photo
	{
		height:90%;
		max-height:700px;
		min-height:300px;
		margin-top:20px;
		padding:15px;
		background-color: rgba(0, 0, 0, 1);
	}
	#fondbandeau
	{
		position:relative;
		bottom:310px;
		width:100%;
		height:300px;
		text-align:center;
	}
	#bandeaunoir
	{
		position:absolute;
		bottom:0px;
		width:100%;
		height:150px;
		background:linear-gradient(to bottom, rgba(0,0,0,0), black 65%);
		visibility:hidden;
	}
	#legende
	{
		position:absolute;
		width:100%;
		text-align:center;
		bottom:0.5em;
	}
	#divcelldroite
	{
		position:absolute;
		right:20px;
		bottom:1.3em;
		width:80px;
		height:1.5em;
	}
	
	
	.ModifLegende
	{
		margin-left:30px;
		margin-top:20px;
	}
	.CadreImgLegende
	{
		width:220px;
		display:inline-block;
		vertical-align:middle;
		text-align:center;
	}
	.form_modif_legende
	{
		width:500px;
		height:2.7em;
		display:inline-block;
		vertical-align:middle;
		border-radius: 5px;
		background-color: rgba(255, 255, 255, 0.2);
		resize: none;
		font-family:"Trebuchet MS", "arial", "times new roman";
		color: white;
		outline: none;
	}
	
	
	
	
/*----images pour selection des photo à supprimer---*/
	.FondImageSuppr
	{
		background-color: rgba(40, 40, 40, 1);	
		display:inline-block;
		margin-left: 10px;
		margin-bottom: 10px;
		height:104px;
		width:104px;
	}
	.FondImageSuppr:hover
	{
		background-color: rgba(255, 255, 255, 1);	
	}
	
	.SelectFondImageSuppr
	{
		background-color: rgba(2, 40, 200, 1);
		display:inline-block;
		margin-left: 10px;
		margin-bottom: 10px;
		height:104px;
		width:104px;
	}
	.ImageSuppr
	{
		border: none;
		padding:2px;
	}
	.SelectImageSuppr
	{
		border: none;
		padding:2px;
		
		filter: grayscale(100%);	
		/*firefox*/filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'saturate\' values=\'0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
		/*chrome*/-webkit-filter: grayscale(100%);
		-ms-filter: grayscale(100%);
		-o-filter: grayscale(100%);
		/*-moz-filter: grayscale(100%);*/
		
		/*filter: blur(5px);
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);*/
		
		filter: brightness(20%);
        -webkit-filter: brightness(20%);
        -moz-filter: brightness(20%);
        -o-filter: brightness(20%);
        -ms-filter: brightness(20%);
	}

	.BoutonSupprim
	{
		border:none;
		border-radius: 5px;
		background-color: rgba(30, 30, 30, 1);
		color: grey;
		padding-left:10px;
		padding-right: 10px;
		padding-top:3px;
		padding-bottom:3px;
		min-width:50px;
		outline: none;
	}
	.BoutonSupprim:hover /*permet d'annuler l'effet du hover de input*/
	{
		background-color: rgba(30, 30, 30, 1);
		color: gray;
		cursor:default;
	}

	
	
	
	
/*affichage des nom d'utilisateur bas de page*/
	#autoutil
	{
		text-align:center;
		font-size:0.8em;
		visibility:hidden;
		margin-top:20px;
	}
	.BasGalerie
	{
		text-align:center;
		font-size:0.8em;
		/*width:350px;*/
		margin:auto;
		margin-top:5px;
		margin-bottom:0px;
	}

	
	
/*pour choix couleur du site*/
	#couleur {
		width:auto;
		height:auto;
		display:inline-block;
		vertical-align:middle;
	}
	#blanc {
		background-color:white;
		width:15px;
		height:15px;
		display:inline-block;
		vertical-align:middle;
		border: 1px grey solid;
	}
	#noir {
		background-color:black;
		width:15px;
		height:15px;
		display:inline-block;
		vertical-align:middle;
		border: 1px grey solid;
	}
	
/*Deconnexion*/
	#connecte{
		display:inline-block;
	}
	#deco{
		display:none;
	}
	
/*barre sous le bas*/
	.floatgauche{
		float:left;
		margin-left:10px;
	}
	.floatdroite{
		float:right;
		margin-right:10px;
	}
	.BarreSousBas{
		font-size:0.8em;
		text-align:center;
		margin:auto;
		margin-top:0px;
		min-width:800px;
		max-width: 1150px;
		width:90%;
		padding:20px;
		padding-top:1px;
	}
	#barrebasgauche{
		opacity:0;
	}