/* script pour l'affichage des images en taille réelle en pop-up dans les catalogues */

.twAudessus {
  /* Le trame de fond */
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 100000;
  top: 0;
  left: 0;
  display: none;
  background: rgba(0,0,0,0.7);
}

.twAudessus a {
  /* Le truc pour centrer l’image */
  display: table-cell; 
  vertical-align: middle; 
  text-align: center;
}

.twAudessus img {
  /* Le contour de l’image */
  max-width:1200px;
  padding: 10px;
  background: #ffffff;
}

/* Slecteur « target pour afficher l’image » */
.twAudessus:target { display: table; }

function twPopConstructeur2(){
  var anchors = document.getElementsByTagName("a");
  for (var i=0; i<anchors.length; i++){
    var anchor = anchors[i];
    var relAttribute = String(anchor.getAttribute("class"));
    if (anchor.getAttribute("href") && (relAttribute.toLowerCase().match("twpop"))){
      var oParent = anchor.parentNode;
      var oImage=document.createElement("img");
      oImage.src = anchor.getAttribute("href");
      oImage.alt = anchor.getAttribute("title")
           
      var oLien=document.createElement("a");
      oLien.href = "#ferme";
      oLien.title = anchor.getAttribute("title");
      oLien.onclick = "return false;";
      oLien.appendChild(oImage);
           
      var sNumero = "id"+i;
           
      var node=document.createElement("div");
      node.id = sNumero;
      node.className = "twAudessus";
      node.appendChild(oLien);
      anchor.setAttribute("href","#"+sNumero);
      oParent.appendChild(node);
    }
  }
}

body, div, ul { margin: 0; padding: 0; }

body {
	font-family: Times New Roman;
	background-color: burlywood ; }
	
h1 { font-size: 60px;
	font-weight: bold;
	margin: 20px; }

h2 { font-size: 30px;
	margin: 15px;
	line-height: 2em;
	font-weight: bold;
	font-family: Lucida Calligraphy; }
	
h3 { font-size: 20px;
	text-align: center;
	font-family: Arial Black;
	font-weight: normal;
	margin: 5px; }
	
h4 { font-size: 25px;
	text-align: center;
	font-weight: normal;
	margin: 5px; }
	
h5 { font-size: 27px;
	text-align: center;
	font-weight: bold;
	font-style: italic;
	margin: 5px; }
	
p { text-align: justify;
	padding: 5px 50px;
	font-size: 25px;
	color: black; }
	
th { font-size: 20px; }

td { font-size: 16px; }

/* définition des différents blocs : taille, alignements de bloc et de texte, marges, couleur) */

.colonne_3 { float: left;
	width: 270px;
	margin: 10px }

.colonne_2 { float: left;
	width: 400px;
	margin: 10px }

.global { width: 1900px; margin: 0 auto;
	background-color: white; }

.top { height: 30px;
	margin-top: 25px;
	background-color: white; }
/*	background-color: sandybrown; } */

.entete-left { height: 270px;
		width: 400px;
		height: 180px;
		padding: 0px;
		float: left;
		text-align: center;
		background-color: white;}
		
.entete-right { height: 270px;
		width: 400px;
		height: 180px;
		padding: 0px;
		float: left;
		text-align: center;
		background-color: white;}
	
.entete { height: 180px;
		width: 1100px;
		float: left;
		text-align: center;
		background-color: white;}

.menu_left { float: left;
		width: 250px;
		height: 100px;
	background-color: white; }
/*	background-color: beige; } */

.blocmenu { float: left;
		width: 1400px;
		height: 100px;
		vertical-align: up;
	background-color: white; }
/*	background-color: beige; } */

.blocmenu_large { float: left;
		width: 1500px;
		height: 50px;
		text-align: center;
	background-color: white; }
/*	background-color: beige; } */

.menu_right { float: left;
		width: 250px;
		height: 100px;
	background-color: white; }
/*	background-color: beige; } */

.marge_left { width: 300px;
		height: 500px;
		padding-top: 50px;
		padding-left: 25px;
		float: left;
		text-align: center;
		background-color: white;}

.marge_right { width: 300px;
		height: 500px;
		padding-top: 50px;
		float: left;
		text-align: center;
		background-color: white;}

.contenu { width: 1300px;
		height: 500px;
		padding: 10px;
		text-align: center;
		float: left;
		background-color: white;}

.catalogue { width: 633px;
		height: 500px;
		padding-top: 50px;
		float: left;
		text-align: center;
		background-color: white;}
		
.catalogue2 { width: 1300px;
		padding: 0px;
		float: left;
		background-color: white;}

.catalogue_central { width: 634px;
		height: 500px;
		padding-top: 50px;
		float: left;
		text-align: center;
		background-color: white;}
		
.cellule { 	margin: 0px;
			padding: 0px;
			width: 250px;
			height: 200px;
			float: left;
			text-align: center;
			display: flex;
			align-items: center;
			justify-content: center; }
		
.contact { width: 1300px;
		text-align: center;
		padding: 10px;
		float: left;
		background-color: white;}

.diaporama { width: 533px;
			position: relative;
/*			top: 25px;	*/
			left: 50px;
			text-align: center;}

.pied_right { width: 300px;
		float: left;
		height: 60px;
		padding-top: 5px;
		margin-bottom: 25px;
	background-color: white; }
/*	background-color: beige; } */

.pied_left { width: 300px;
		float: left;
		height: 60px;
		padding-top: 5px;
		margin-bottom: 25px;
	background-color: white; }
/*	background-color: beige; } */

.pied_center { width: 1300px;
		float: left;
		height: 60px;
		padding-top: 20px;
		margin-bottom: 25px;
	background-color: white; }
/*	background-color: beige; } */
				
.carousel-inner > .item > a > img, .carousel-inner > .item > img {
	margin-left: auto;
	margin-right: auto; }

.green { color: green; }

.red { color: red; }

.brown { color: brown; }

.orange { color: orange; }

.chocolate { color: chocolate; }

.grand { font-size: 45px; }

#menu li {float: left; list-style-type: none; }

#menu-droite li {float: right; list-style-type: none; }

#menu li a, #menu li a:visited {
	padding-left: 60px; padding-right: 60px; line-height: 50px; font-size: 30px; font-weight: bold;
	text-decoration: none; color: black; }
	
#menu li a:hover { color: brown; }

#titre-gauche img {  position: relative; top: 5px; left: 5px; }

#titre-droit img {  position: relative; top: 5px; left: 1395px; }

#galerie img { float: left; margin: 50px; }

.zoom {
width: 320px;
height: 240px;
}
.image {
width: 50%;
height: 50%;
}
.image img {
/* La transition s'applique à la fois sur la largeur et la hauteur, avec une durée d'une seconde. */
-webkit-transition: all 1s ease; /* Safari et Chrome */
-moz-transition: all 1s ease; /* Firefox */
-ms-transition: all 1s ease; /* Internet Explorer 9 */
-o-transition: all 1s ease; /* Opera */
transition: all 1s ease;
}
.image:hover img {
/* L'image est grossie de 25% */
-webkit-transform:scale(2.5); /* Safari et Chrome */
-moz-transform:scale(2.5); /* Firefox */
-ms-transform:scale(2.5); /* Internet Explorer 9 */
-o-transform:scale(2.5); /* Opera */
transform:scale(2.5);
}

