/* Feuille de style pour le site ADDUFU.org */

/*Ceci est la feuille de style pour un site avec menu vertical */

body,div,ul {margin:0;padding:0;}

p {margin:5px 0;}

body {background-color:#cccccc; background-repeat:no-repeat;background-size:cover; font-family:Times,serif;font-size:16px;}

/* l'ensemble de la page est centré et fixé */
#global {width:1200px;margin:0 auto;
	background-color:lavender;
	background-image:url(bardagefond.jpg);
	background-repeat:no-repeat;
	background-size:cover;
}

#globalhistoire {width:1000px;margin:0 auto;
	background-color:lavender;
	background-image:url(cathedrale.jpg);
	background-repeat:no-repeat;
	background-size:cover;
}

#globalnousjoindre {width:1000px;margin:0 auto;
	background-color:lavender;
	background-image:url(bardagefond.jpg);
	background-repeat:no-repeat;
	background-size:cover;
}



/*Bandeau d'entête */
#entete {height:20px;padding:10px;}
#entete h1{margin:3px 30px;color:white;font-size:53px;font-weight:normal;}

/*Colonne de gauche contenant le menu*/
#blocmenu {width:200px;float:left;}


/*Colonne de droite - contenu de la page */
#contenu {width:760px;float:left;padding:0 10px 10px 30px;} 

/*Colonne de droite - menu horizontal */
#blocmenuhorizontal {height:36px;background-color:lightsteelblue;}
#menuhorizontal li {float:left;list-style-type:none;}
#menuhorizontal li a,#menuhorizontal li a:visited{
	padding:10px;margin-left:20px;margin-right:15px;line-height:36px;font-size:14px;text-decoration:none;color:black;}
#menuhorizontal li a:hover{background-color:lightsteelblue;font-weight:bold;color:black;}


//h1 {font-style:italic;font-family:Times,serif,font-size:36px;color:#005f36;}-->
//h1 {font-family:Times,serif,font-size:30px;color:#339966;}
h1 {font-family:Times,serif,font-size:30px;color:#FFFFFF;}
hO {font-family:Times,serif,font-size:36px;color:#339966;}
h2 {font-family:Arial,sans-serif;font-size:22px;font-weight:normal;color:#003060;}
h3 {font-family:Arial,sans-serif;font-size:18px;font-weight:normal;color:black;}
li {font-family:Arial,sans-serif;font-size:18px;font-weight:normal;color:#003060;}

/*Classes pourl'alignement d'un texte ou des éléments en ligne (textes,images..) */
.centre {text-align:center;color:white;}
.gauche {float:left;margin-right:10px;}
.droite {float:right;margin-left:10px;}

.clear {clear:both;}
#suite {position:relative;left:30px;top;140px;color:white;}
#suitephotos {position:relative;left:30px;top;200px;color:white;}

#compteur {width:150px;background-color:#006400;
		font-family:Times,serif;font-style:italic;
		font-size:18px;color:white;
		margin-left:25px;
		border:1px solid;border-color:#000000;padding:5px 10px 5px 5px;border-radius:5px;}


/*Pied de page*/
#pied 	{clear:both;margin-bottom:10px;
	padding:10px 10px 10px 20px;
	background-color:white;
	font-family:Times,serif;font-style:italic;
	font-size:16px;color:#005f36;
	}


/* Détails pour le menu de navigation */
#menu li {list-style-type:none;}

#menu li a, #menu li a:visited {
	background:url(bouton1.jpg);
	display:block;line-height:15px;	
	margin:20px 0;padding:10px 5px 10px 40px;
	text-decoration:none;
	font-family:Times,serif;font-style:italic;
	font-weight:bold;font-size:18px;color:white;
}

#menu li a:hover {background-image:url(bouton2.jpg);color:white;}

/*Paragraphe avec photo à gauche (essai personnel) */
#photogauche img {margin:10px;border:solid 1px;float:left;}
#photogauche p {color:#003060;text-align:justify;font-family:Arial,sans-serif;font-size:18px;font-weight:normal;;}

#photodroite img {margin:10px;border:solid 1px;float:right;}
#photodroite p {color:white;text-align:justify;}


#textedroite {font-family:Times,serif;font-style:italic;color:white;}

/* Container de photos */
#photos {position:relative;left:30px;top:30px;}
 /* #photos img {margin:10px;border:solid 1px;float:left;}*/
/*  #photos p {color:white;clear:both;} */

#photos p{clear:both;}

.left {float:left;}

/* #photos img {margin:20px;width:252px;height:367px;border:solid 1px;} */
#photos img {margin:10px;height:300px;border:solid 1px;} 

div#photos {position:relative;left:5px;top:40px;}
<!--On est obligé de mettre une position relative, sinon on démolit toutes les positions des lignes suivantes -->

/* Formulaires */
#cadre1 {background-color:lightgray;}
#conteneur {width:650px;margin:auto;height:auto;}
#enhaut {font:Verdana,Geneva,sans-serif;font-size:25px;
		  color:#40427f;text-align:center;padding:20px;
                  margin:0px 0 30px 0;border:1px solid #777879;
                  border:radius:5px;
		  background-color:#EAFDFF;
	          }
					    
#conteneur label {clear:left;margin:10px 20px 0 0;
		font:Verdana,Geneva,sans-serif;
		font-size:14px;color:white;text-align:right;
	        }
.margetext
{margin-left:50px;}
#conteneur p  {margin:50px 50px 50 50;font:Verdana,Geneva,sans-serif;
	      font-size:18px;color:#000000;text-align:left;
	      }
p#centre  {font:Verdana,Geneva,sans-serif;font-size:25px;color:#9EFR38;text-align: center; }
#conteneur input {font:Verdana,Geneva,sans-serif;font-size:14px;color:#4b4b4b;
		 width:270px;height:30px;padding:5px 10px 0px 10px;margin: 0 0 20px 0;
		 background:#f1f2f4;
		 border:1px solid #b6b7b9;border-radius:5px;
		 }

#conteneur textarea {font-family:Verdana,Geneva,sans-serif;font-size:14px;color:4b4b4b;
		    width:270px;height:80px;padding:5px 10px 0px 10px;margin: 0 0 20px 0;
		    background:#f1f2f4;
		    border:1px solid #b6b7b9;border-radius:5px;
		    }
#conteneur input[type=submit]{
		  float:right;cursor:pointer;width:80px;height:42px;
                  padding: 5px 10px;margin: 0 40px 0 0;
		  border:1px solid  #275682;
                  border-radius:21px;
		  background-color:#0080FF;color:#effaff;font-weight:bold;
	          }
#conteneur input:focus {background:yellow;}

#conteneur textarea:focus {background:yellow;}
//#conteneur img {margin:50px;height:300px;border:solid 1px;} 
#conteneur img {margin:20px;border:solid 1px;} 
		    

#conteneur input[type=submit]:hover {border:1px solid #1a3957;background-color:#51A8FF;}

#conteneur input[type=submit]:active {background-color:#0079F2;}

#conteneur fieldset {margin-left: 0px; box-shadow: 4px 4px 2px #BABABA; background-color:lemonchiffon;border-radius:10px;}

#conteneur legend {background-color:palegreen;font:Verdana,Geneva,sans-serif;font-size:18px;color:#000000;
		   border:1px solid;border-color:#000000;padding:5px 10px 5px 5px;border-radius:5px;}

#conteneur select {font:Verdana,Geneva,sans-serif;font-size:14px;color:#4b4b4b;
		 width:120px;height:30px;padding:5px 10px 0px 10px;margin: 0 0 20px 0;
		 background:#f1f2f4;
		 border:1px solid #b6b7b9;border-radius:5px;
		 }
#moisagenda {font:Comic;font-size:18px;color:white;}
#remerciement {background-color:#E6F2FF;font:Verdana,Geneva,sans-serif;font-size:18px;color:#445668;
		   border:1px solid;border-color:#000000;padding:5px 10px 5px 5px;border-radius:5px;}


/*Eléments pour le diaporama type galerie */
#galleria {height:500px;}
#content {color:#777;width:620px;margin:20px auto;}

/*Elements pour une animation simple */
#animationsimple {backgroung-color:#00000;position:relative;left:100px;width:600px;height:500px;border:1px solid #00000;}
#animationsimple img {width:480px;height:360px;border:15px solid;border-color:#00000;}
#cadrenoir {background-color:#000000;border:1px solid;border-color:#000000;padding:15px 15px 15px 15px;}


/* Message devant être encadré */

#messagetexte {width:700px;padding:5px 10px 0px 10px;margin: 0 0 20px 0;
		    background:#f1f2f4;
		    border:1px solid #b6b7b9;border-radius:5px;}


#titre {font:Arial,sans-serif;font-size:20px;color:blue;font-weight:bold;padding:5px 10px 0px 10px;}
#messagetexte p {color:#000000;text-align:justify;}
#soustitre {font:Arial,sans-serif;font-size:15px;color:blue;font-weight:normal;padding:5px 10px 0px 10px;}

/*** ZOOMER IMAGE AU SURVOL***/
/***.zoom {

height:400px;
margin:2px;

}
.zoom p {
tetxt-align: left;

}
.zoom img{
height:127px;
width:200px;

}
.zoom img:hover{

height:400px;
top:0px;

width:500px;
}***/
/***IMAGE AU SURVOL***/

/*Elements pour une animation simple */
#animationsimple {backgroung-color:#00FF00;position:relative;left:100px;width:600px;height:500px;border:1px solid #00000;}
#animationsimple img {width:480px;height:360px;border:15px solid;border-color:#00000;}
#cadrenoir {background-color:#00FF00;border:1px solid;border-color:#000000;padding:15px 15px 15px 15px;}