/*---------CSS pour PC -------------*/
/*MEDIA QUERY*/    /*valeur de travail écran à 1600px */
@media only screen and (min-width : 1500px) 
{

html, body {
height:100%;
width:100%;
margin: 0; 
padding: 0;
}

body {
	width: 100%;
	margin: 0 0 50 0;
	padding: 0;
	font: 80% verdana, arial, sans-serif;
	
	background: -webkit-linear-gradient(#1818E0 5%, #18C9E0 20%, #18C9E0 80%, #1818E0 95%); /*Pour Chrome 25, Safari 6 */
	background: -o-linear-gradient(#1818E0, #3FBFBF); /*Pour Opera (11.1 à 12.0) */
	background: -moz-linear-gradient(#51B6F4 5%, #18C9E0 20%, #18C9E0 80%, #1818E0 95%); /*Pour Firefox (3.6 à 15) */
	background: linear-gradient(#1818E0 5%, #18C9E0 20%, #18C9E0 80%, #1818E0 95%); /*Autres navigateurs */
	/* background-color: #93B874; */
	/* dégradé linéaire de bleu sur 10% puis vert-bleu sur 60% suivants, puis bleu.... */
	/* background-color: linear-gradient(#1818E0 10%, #3FBFBF 70%, #1818E0 90%); */
    /* transition-property: background-color;
    transition-duration: 1s; */
    /* transition-delay: 0.4s;  Démarre au bout de 0,4s */
}

head {
		
	width: 100%;	
		/* position: absolute; */
	}

	
/*---------MENU MOBILE -------------*/
	
dl, dt, dd, ul, li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}	


object {

		position: absolute; 
		width: 1450px;
		top: 410px; 
		/* left: 40px; */
		height: 200px;
		z-index:5;
		margin:0 auto;
		overflow:auto;
		/* bordure pour matérialiser la DIV
		border: 4px inset blue; */
}

	
#menu-icon {
		display:hidden;
		width: 40px;
		height: 40px;
		z-index:10;
		background: #4C8FEC url(../images/menu-icon-blanc-transp-40x40.png) center;
}
	
a:hover#menu-icon {

	background-color: #444;
	border-radius: 4px 4px 0 0;

}

#menu_horizontal {

		position: absolute; 
		width: 1500px;
		top: 410px; 
		left: 50px;

		/* top: 50%; left: 50%;  à 50%/50% du parent référent */
		/* transform: translate(-50%, -50%);  décalage de 50% de sa propre taille */
		z-index:5;
		margin:0 auto;
		
		/* bordure pour matérialiser la DIV
		border: 4px inset blue; */
}


#menu_horizontal ul{ 
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;

}
	

	
	


#menu_horizontal ul .menu {
	float:left;	
	cursor: pointer;
	/* margin: 2px 0; */
	margin: auto;
	height: 25px;
	line-height: 25px;
	text-align: center;
	font-weight: bold;
	border: 1px solid gray;
	cursor: pointer;
	background: #ccc; /* gris clair */
	color:#0B1616; /* texte menus noir fumée bleutée */
	
	/* effet de transition sur case menu , pour preparation du ul .menu:hover  */
	transition-property: background-color, display ;
	transition-duration: 1s ;
	}	

#menu_horizontal ul .menu:hover {
	background: #606060; /* gris foncé */
	color:#FFFFFF; /* texte menus blanc */
	}
	
#menu_horizontal ul .menu span{
	display:block;
	width:350px; /* largeur des cases du Menu */
	
	font-weight: bold;
	font-family: Arial,serif;
	font-variant: small-caps;
	font-size: 2.0em;
	
	border-bottom: 1px solid blue;
		
}



#menu_horizontal ul .menu .bloc_sousmenu{
	display:none;
	/* effet de transition sur bloc sous-menu , pour preparation du display ul .menu:hover .bloc_sousmenu - NE fonctionne PAS */
	transition-property: display ;
	transition-duration: 1s ;
}

#menu_horizontal ul .menu .bloc_sousmenu {   /* pour éviter que le sous menu décale les parties inférieures  - ancienne formuke pour ul li*/
	position: absolute;
}	
	
#menu_horizontal ul .menu:hover .bloc_sousmenu{	/* pour ouvrir le sous menu au survol de la souris */
	display:block;
}
	

	
#menu_horizontal ul .menu .bloc_sousmenu .sousmenu{
	/* float:right; */	
	width:350px; /* largeur des cases du SousMenu */
	left: 160px; 
	margin: 1px auto;
	/* margin-left:-40px;  décalage à droite du sous-menus */
	min-height: 20px;
	line-height: 20px;
	text-align: center;
	font-weight: bold;
	font-size: 1.2em;
	border: 1px inset #170797; /* textes sous-menus bleu foncé */
	background: #E5F8FA; /* fond sous-menus bleu clair */
	z-index:10;
	
	/* effet de transition sur case sous-menu , pour preparation du ul .menu .bloc_sousmenu .sousmenu:hover  */
	transition-property: background-color, ;
	transition-duration: 500ms ;
	
	}

#menu_horizontal ul .menu .bloc_sousmenu .sousmenu:hover{
	background: #ccc; /* gris clair */
	
	}

#menu_horizontal ul .menu .bloc_sousmenu .sousmenu a{
	text-decoration: none;
	color:#170797; /* textes sous-menus bleu foncé */
}	

/* mise en perspective des pages déjà réalisées dans le menu */
#menu_horizontal ul .menu .bloc_sousmenu .page_realisee{
	border: 1px inset #170797; /* textes sous-menus bleu foncé */
	background: #FA58F4; /* rose */
	
	}

/*---------PARTIES HAUTES du site -------------*/	
	

/*--------- Bandeau VIDEO -------------*/


#bandeau-video {
	/* container bandeau 2 videos + plaque marbre centrale */
	height: 230px;
	width:1350px; 
	
/* 	position:relative; 
	left:0px; 
	top:75px; */
	
	margin:0 auto;
	/* bordure pour matérialiser la DIV */
	border: 3px inset blue;
	overflow: hidden;

}

#video-gauche {
	/* video-gauche */
	display:none;
	
	height: 230px;
	width:350px; 
	position:relative;
	float:left; 
	left:10px; 

}

.slide-show-gauche {
	/* photos remplacement video sur pages chapitres du site */
	
	height: 230px;
	width:350px; 
	position:relative;
	float:left; 
	left:10px; 

}

#plaque-centre {
	/* plaque marbre centrale */
	display: inline;
	height: 212px;
	width:350px; 
	position:relative;
	float:left; 
	left:20px; 
	top:7px;
	
	border-style:none;
	opacity:0.9;
}
.plaque-centre-seule {
	/* plaque marbre centrale */
	height: 212px;
	width:350px; 
	position:relative;
	/* left:20px;  */
	top:7px;
	margin:0 auto;
	
	z-index:10;
	border-style:none;
	opacity: 0.9;
}

.video-centre-seule {
	/* video marbre centrale */
	height: 230px;
	width:350px; 
	position:relative;
	/* left:20px;  */
	/* top:7px; */
	margin:0 auto;
	
	z-index:10;
	border-style:none;
	opacity: 0.9;
}

#video-droite {
	/* video-droite */
	display: inline;
	height: 230px;
	width:350px; 
	position:relative;
	float:left; 
	left:40px; 
	top:0px; /* pour ratrapper le décalage vertical - origine ? */

}



/*--------- Bandeau HAUT étroit -------------*/



#bandeau_haut {
	
	height: 155px;
	width: 95%;
	
	position:relative; 
/* 	left:10px; 
	top:650px; */
	
	margin:0 auto;
	padding: 0 10px;

	background:url(../images/background/background_haut_10x155_374.jpg) repeat-x;
	/* bordure pour matérialiser la DIV
	border: 6px inset blue; */
}	

.image_text-honnetete{
	
	height: 121px;
	width:111px; 
	
	position:relative; 
	display: inline;
	float:left;
	top:15px;
	left:50px;
	margin:0 auto;
	z-index:5;
}

.image_text-qualite{
	display:inline;
	height: 76px;
	width:849px;
	
	position:relative; 
	display: inline;
	float:left;
	top:30px;
	left:250px;
	margin:0 auto;
	z-index:10;

}

.logo_NB{
	display:inline;
	height: 130px;
	width:140px;
	
	position:relative; 
	display: inline;
	float:right;
	top:-5px;
	right:50px;
	z-index:3;
}
	
#bandeau_titre_page{
	height: auto;
	width:500px;
	
	position:relative; 
	top:30px;
	/* left:300px; */
	margin:0 auto;
	z-index:12;
	
	/* background-color:white;
	border: 4px inset red; */
	
	background-color:#C0C0C0;

	box-shadow:2px 2px 2px gray,-2px -2px 2px #00FFFC;
	
}

.bandeau_titre_page_texte{
	/* height: 35px; */
	width:300px;
	/* display:table-cell; */
	margin: 0 auto;
	
	font-weight: bold;
	font-family: Arial,serif;
	font-variant: small-caps;
	font-size: 2.5em;
	
	vertical-align : middle;
	text-align: center;
	padding-bottom: 5px;
	text-shadow:0 0 2px #00FFFC,0 0 30px #00FFFC,0px 0px 5px #00FFFC, 0 0 150px #00FFFC;
	color:#4CB2B2;
	/* background-color:#262626; */
	
/* 	text-shadow:3px 1px 10px 0 #fff; */
	
/* 	text-shadow:  white 0.006em 0.006em 0.007em,
    #9c9c9c 1px 1px 1px,
    #9c9c9c 1px 2px 1px,
    #9c9c9c 1px 3px 1px,
    #9c9c9c 1px 4px 1px,
    #9c9c9c 1px 5px 1px,
    #9c9c9c 1px 6px 1px,
    #9c9c9c 1px 7px 1px,
    #9c9c9c 1px 8px 1px,
    #9c9c9c 1px 9px 1px,
    #9c9c9c 1px 10px 1px,
    #9c9c9c 1px 11px 1px,
    #9c9c9c 1px 12px 1px,
    rgba(16, 16, 16, 0.4) 1px 18px 6px,
    rgba(16, 16, 16, 0.2) 1px 22px 10px,
    rgba(16, 16, 16, 0.2) 1px 26px 35px,
    rgba(16, 16, 16, 0.4) 1px 30px 65px,
    white -0.15em -0.1em 100px;
	color:#fff; */
	
	
	
	/* background-color:#9BD5D4; */

}





/*---------PARTIES CENTRE HAUT du site -------------*/		
	
	
#bandeau_centre_haut {
	
	min-height: 500px;
/* 	max-height: 100%; */
/* min-width:600px;  */
	width: 95%;
	
	position:relative; 
	left:10px; 
	top:50px;
	
	margin:0 auto;
	
	border-width:1px;
	border-style:none;

	background:url(../images/background/background_centre_10x505_374.jpg) repeat-x;
	
	/* essais pour bordure avec image de fond
	border-image-source:url(../images/background_centre_pricipal_10x20_bottom.jpg) ;
	border-image-slice:30;
	border-image-width:30px;
	border-image-outset:15px;
	border-image-repeat:round stretch;
	border-image-repeat:space; */
	
}


#bloc_gauche_centre_haut {
	
	min-height: 200px;
	min-width:600px; 
	max-width: 40%;
	
	display: block;
	position:relative;
	float: left;	
	left:0px; 
	
	padding: 10px 20px;
	
	/* bordure pour matérialiser la DIV */
	/* border-style:solid;
	border-color:#FFCC33;
	border-width:2px; */

	
}

#sous-bloc_G1_centre_haut {
	
	min-height: 200px;
	max-height: 100%;
	min-width:300px; 
	max-width: 95%;
	
	display: block;
	position:relative;
	/* clear: left; */
	float: left;	
	left:10px; 
	top:20px;
	
	margin-top: -20px ;
	padding: 10px 20px;
	

	
	/* bordure pour matérialiser la DIV
	border-style:solid;
	border-color:#FF0000;
	border-width:2px; */

}

.sous-bloc_G1_centre_haut_fondTrans {
	
	/* pour un fond blanc transparent à 40% ( en 4eme chiffre) */
	background-color: rgba(255, 255, 255, 0.4);

}

#sous-bloc_G2_centre_haut {
	
	min-height: 200px;
	max-height: 100%;
	min-width:300px; 
	max-width: 95%;
	
	display: block;
	position:relative;
	/* clear: left; */
	float: left;	
	left:10px; 
	top:20px;
	margin: 25px auto;
	padding: 10px 20px;
	
	/* bordure pour matérialiser la DIV */
	/* border-style:solid;
	border-color:#FF0000;
	border-width:2px; */

}


#bloc_gauche_centre_haut h1, #bloc_droit_centre_haut h1 {
	text-align: center;
	font-family: arial;
	font-size: 1.8em;
	font-weight: bold;
	text-decoration: underline;
	color: #E53F41;
}

#bloc_gauche_centre_haut h2, #bloc_droit_centre_haut h2 {
	/* text-align: center; */
	font-family: Tahoma;
	font-size: 1.5em;
	font-weight: bold;
	text-decoration: none;
	color: #353635; /* gris plus foncé */
}

#bloc_gauche_centre_haut span, #bloc_droit_centre_haut span {
	font-family: Tahoma;
	font-size: 1.3em;
	font-weight: bold;
	text-decoration: none;
	color: #555654; /* gris très foncé - pour les span */
}


#bloc_gauche_centre_haut ul, #bloc_droit_centre_haut ul  {
	padding-left : 25px;
}

#bloc_gauche_centre_haut li, #bloc_droit_centre_haut li  {
	/* padding-left : 25px; */ 
	/* attention - le padding la tabulation 3 poesies ! */
	list-style-type: square;
	font-family: Tahoma;
	font-size: 1.2em;
	font-weight: bold;
	text-decoration: none;
	color: #848583;  /* gris foncé */
}


.rose_rose{
	
	height: 197px;
	width:205px; 
	
	position:relative; 
	display: inline;
	float:left;
	left:400px;
	bottom:200px;
	z-index:3;
	opacity:0.2;
}



#bloc_droit_centre_haut {
	
	min-height: 200px;
	min-width:40%; 
	width: 600px;
	
	display: block;
	position:relative;
	/* clear: left; */
	/* float: right;	
	right:60px; */ 
	float: left;	
	left:60px;
	top: -10px;

	
	/* margin-top: -20px ; */
	padding: 10px 20px;
	
	/* bordure pour matérialiser la DIV */
	/* border-style:solid;
	border-color:#FFCC33;
	border-width:2px; */

}


#sous-bloc_D1_centre_haut {
	
	display: flex;
    flex-direction: column;
	/* justify-content: flex-end; */
	
	/* min-height: 200px; */
	/* max-height: 100%; */
	/* min-width:300px;  */
	/* max-width: 50%; */
	
	/* display: block; */
	/* position:relative; */
	/* float: left; */	
	/* float: right;	 */
	right:10px; 
	top:20px;
	
	margin: 0px auto ;
	padding: 10px 20px;
	
	/* bordure pour matérialiser la DIV
	border-style:solid;
	border-color:#FF0000;
	border-width:2px; */

}

.box2_caracteres_machinetapper {
	/* photos remplacement video sur pages chapitres du site */
	
	height: 130px;
	width:300px; 
	padding:5px ;
	background:#FFFFFF;
	color:#000000;
	font-family:Verdana;
	font-size:1.1em;
	border-style:solid;
	border:1px solid #888;
	border-radius:5px;
	
	margin: 0px auto ;
	
}

.boite_loi{
	min-height: 150px;
	/* min-width:425px; */
	float:right;
	/* top:-60px;
	right:50px; */
	margin:5px;
	padding:10px;
	
	background-color:#FFF;

}

#sous-bloc_D2_centre_haut {
	
	min-height: 200px;
	max-height: 100%;
	min-width:300px; 
	max-width: 100%;
	
	display: block;
	position:relative;
	clear: right;
	float: left;	
	/* float: right; */	
	right:10px; 
	top:20px;
	
	margin: 25px auto;
	padding: 10px 20px;
	
	/* background:#FFF; */
	/* opacity: 0.3; */
	
	/* pour un fond blanc transparent à 40% ( en 4eme chiffre) */
	background-color: rgba(255, 255, 255, 0.4);
	
	/* bordure pour matérialiser la DIV */
	/* border-style:solid;
	border-color:#FF0000;
	border-width:2px; */

}







	
/*---------PARTIES CENTRE BAS du site -------------*/		
	
	
#bandeau_centre_bas {
	
	min-height: 450px;
	width: 100%;
	
	position:relative; 
	left:10px; 
	top: 50px;
	
	margin:0 auto;
	
	/* bordure pour matérialiser la DIV
	border: 8px inset blue; */

	background:url(../images/background/background_bas_10x440_374.jpg) repeat ;
	/* overflow: auto; */
	
	/* Pour Animer le Fond de l écran - ne fonctionne pas
	-moz-animation:move-background 150s linear infinite;
	-webkit-animation:move-background 150s linear infinite;
	animation:move-background 150s linear infinite;
	-ms-animation:move-background 150s linear infinite;
	-o-animation:move-background 150s linear infinite;
	
	animation-duration: 5s;
	animation-direction: alternate;
	animation-iteration-count: infinite; */
	
}

#bande_haute_Centre_Bas {
	
	display: flex;
    /* flex-direction: column; */
	flex-wrap: wrap;
		
	width: 100%;
	
	
	margin: 0px auto ;
	padding: 10px 20px;
	
	/* bordure pour matérialiser la DIV
	border-style:solid;
	border-color:#FF0000;
	border-width:2px; */
	
	background:url(../images/background/background_bas_10x440_374.jpg) repeat ;

}

#bande_haute_Centre_Bas-block{

    position: relative;
	min-height: 450px;
	min-height: 100%;
    width: 90%;
    /* float: left; */
    left: 10px;
    /* top: 20px; */
    margin: 0px auto;
    padding: 10px 20px;
    background: url(../images/background/background_bas_10x440_374.jpg) repeat;
    ;

}


#bande_cones_fine{
	 
	height: 250px;
	/* height: auto; */
	width: 100%;
	
	position:relative; 
	/* left:10px;  */
	top: 50px;
	
	margin:0 auto;
	background:url(../images/background/background_bas_10x250_374.jpg) repeat ;
}

#bande_cones{
	 
	/* height: 250px; */
	/* height: auto; */
	width: 100%;
	position:relative; 

	margin:0 auto;
}


.image_vertical_AMG_confort_plus_Haut{
	height: 450px;
	width:75px; 
	
	position:relative; 
	display: inline;
	float:left;
	top:20px;
	left:10px;
	clear: left;
	z-index:2;

}

.image_vertical_AMG_confort_plus_Haut_gauche{
	height: 460px;
	width:65px; 
	
	position:relative; 
	display: inline;
	float:left;
	top:20px;
	left:10px;
	clear: left;
	z-index:2;

}

.image_vertical_AMG_confort_plus_Haut_droite{
	height: 450px;
	width:75px; 
	
	position:absolute; 
	display: inline;
	float:right;
	right: 5px;
	top:20px;
	/* left:10px; */
	clear: right;
	z-index:2;

}

.image_vertical_AMG_confort_plus_Bas{
	height: 450px;
	width:75px; 
	
	position:relative; 
	display: inline;
	float:left;
	/* top:-90px;
	left:10px; */
	clear: left;
	z-index:2;

}

.Leaflet{
	
	height: 1000px;
	width:341px; 
	
	position:relative;
	float:left;
	top:10px;
	left:50px; 

	
	border-width:0px;
	border-style:none;
	margin:100px;
	
	background-color: #ff9999;

}	
	
	
/*---------PARTIES BASSES du site -------------*/
	
	
	


	
.maison3d_graphics{
	
	height: 300px;
	width:400px; 
	
	position:relative; 
	display: inline;
	float:left;
	left:50px;
	bottom: 0px;
	z-index:3;
}	

.plaque_metal{
	
	height: 288px;
	width:500px; 
	
	position:relative; 
	display: inline;
	float:left;
	left:50px;
	top: 30px;
	z-index:4;
}	
	
.paroi_verre{
	
	height: 325px;
	width:325px; 
	
	position:relative; 
	display: inline;
	float:left;
	top:10px;
	left:-100px;
	bottom: 0px;
	z-index:6;
}

.porte-ouverte{
	
	height: 387px;
	width:256px; 
	
	position:relative; 
	display: inline;
	float:left;
	top:0px;
	left:-30px;
	bottom: 0px;
	z-index:4;
}








.Cone_orange1{
	 
	height: 182px;
	width:100px;
	position:relative; 
	display: inline;
	float:left;
	top:-200px;
	left:100px;
	bottom: 0px;
	z-index:5;
}
.Cone_orange2{
	
	height: 182px;
	width:100px; 
	/* height: 91px;
	width:50px; */
	position:relative; 
	display: inline;
	float:right;
	top:-200px;
	right:30px;
	bottom: 0px;
	z-index:5;
}

.feu-bougie-candle1{
	 
	position:relative; 
	display: inline;
	float:left;
	/* top:-200px; */
	left:100px;
	z-index:9;
}

.feu-bougie-candle2{
	 
	position:relative; 
	display: inline;
	float: right;
	/* top:-150px; */
	right:50px;;
	z-index:10;
}

.feu-bougie-candle3{
	

	position:relative; 
	display: inline;
	float:right;
	top:-200px;
	right:30px;
	z-index:9;
}
	





#video-bas {
	/* video-droite */
	display:none;
	height: 230px;
	width:350px; 
	position:relative;
	float:left; 
	left:10px; 
	top:-130px; /* pour ratrapper le décalage vertical - origine ? */
	
	border-style:none;
}

/* ----------- FOOTER - copyright ------------ */



#footer {
	
	height: 50px;
	width: 95%;
	bottom: -50px;
	position:relative; 

	margin:0 auto;
	padding: 0 10px;
	z-index:15;
	text-align:center;
	/* bordure pour matérialiser la DIV
	border: 6px inset blue; */
}



/* ----------- DIVERS ------------ */

.clearfix {
  overflow: auto;
}

.barre_clear_complete {
	height: 5px;
	width:500px;
	
	clear: both;
	position: relative; 
	overflow: hidden;
	margin: 0 auto;
	z-index:5;
	background-color:black;
	}
	
.barre_clear_complete_trans {
	height: 2px;
	min-width:500px;
	
	clear: both;
	position: relative; 
	overflow: hidden;
	margin: 0 auto;
	z-index:5;
	background-color:black;
	}

.barre_clear_simple_trans {
	height: 5px;
	width:500px;
	
	clear: both;
	position: relative; 
	overflow: hidden;
	
	}

.image_Droite_texteAgauche{
	
	height:min-content;
	width:min-content; 
	
	position:relative; 
	display: inline;
	float:right;
	top:15px;
	right:10px;
	
	margin: 5px 10px;
	
}

.image_Droite_SANS_texte{
	
	height:min-content;
	width:min-content; 
	
	position:relative; 
	display: inline;
	float:right;
	top:15px;
	right:10px;
	
	margin: 5px 10px;
	
	clear: both;
}

.image_Gauche_texteAdroite{
	
	height:min-content;
	width:min-content; 
	
	position:relative; 
	display: inline;
	float:left;
	top:15px;
	left:10px;
	
	margin: 5px 10px;
	
}

.image_Centre_texteHautBas{
	
	height: min-content;
	width: min-content;
	
	margin: 0px auto;
	clear: both;	
}



}