/*
Configuration of specific parts defined by an id or a class. 
<style */


	
	
	
	
	#fenetre {
		position : relative;
		display: block;
		height: 100%; width: 100%;
	}	

			
		.nextImageBtn, .prevImageBtn{
			display:block; 
			position:absolute; 
			top: 	0;
			width:	40px; 
			height:	100%; 
			
			z-index:1;
			opacity:	0.4;
		}
		.nextImageBtn:hover,.prevImageBtn:hover{
			opacity:	1.0;
		}
		.nextImageBtn{
			right:			0;	
			margin-left:	-40px;
			background: 	#FFF url(https://sea.archi/00_StrImg/bouttons/next.png) center center  no-repeat;
			background-size: 20px;
		}
		.prevImageBtn{
			left:			0;
			margin-right:	-40px;
			background: 	#FFF url(https://sea.archi/00_StrImg/bouttons/prev.png) center center  no-repeat;
			background-size: 20px;
		}
		
		
		
		#FenetreContact {
			display: block;
			overflow:visible;
		}
			
			.coordonnees{
					display:block;
					text-align:right;
				}
					
					.nom, .addresse1, .addresse2, .tel, .mail, .naissance{
						display:	block;
						position:	relative;
						margin: 	0 0 2.0em 0;
					}
					
					.nom{
						top:			0;
						margin: 		0 0 0 0;
						font-size:		1rem; 	
						font-family: 	'TechnicLite', 'Orator Std', 'Arial', 'sans-serif'; 
					}
					
					.portrait, .titre, .addresse1, .addresse2{
						margin: 			0 0 1.0rem 0;
						font-size:0.8em;
					}
					
						img.portrait{
							height:			100px;
						}
						
						.company{
							margin-bottom:	1.0rem;
							font-size:		1.4rem; 
							font-family: 	'TechnicLite', 'Orator Std', 'Arial', 'sans-serif'; 
						}
						
						.address_title{
							margin-bottom:	0.3rem;
							font-size:		1.2rem; 
							font-family: 	'Anaheim', 'Arial narrow', sans-serif; 
							font-weight:	normal; 
						}
						
						.pays{
							font-size:		1rem; 
							font-family: 	'Anaheim', 'Arial narrow', sans-serif; 
							font-weight:	normal; 
						}
						
						.tel{
							margin-top:		0.3rem;
						}
					
					
					.mail{
						bottom:			0;
						text-align:		right;
					}
					.mail:hover{
						font-weight:	bold;
						color:			#000;
					}




		#FenetreActivites{
			position:			relative;
			display: 			block;
			height: 			0; 
			width: 				50%;
			padding-bottom: 	50%;
			margin: 			0 auto;
			background-color:	#FFF;
		}
		
			#FenetreActivites_inner{
				position:	absolute;
				left: 10px;
				right: 10px;
				top: 10px;
				bottom: 10px;
				
			}
				.IconeActivite{
					display: block;
					position: absolute;
					width: 49.3%; height: 49.3%;
					overflow:hidden;
				}
				
				#IconeActivite1{
					top:0; left:0;
				}
					
				#IconeActivite2{
					top:0; right:0;
				}
					
				#IconeActivite3{
					bottom:0; left:0;
				}
					
				#IconeActivite4{
					bottom:0; right:0;
				}
					#IconeActivite3 img{
						bottom:0; 
					}
						
					#IconeActivite4 img{
						bottom:0; 
					}
				
					.IconeActivite img{
						position: absolute;
						width: 100%; 
					}
					
		
		
		#FenetreTexte{
			display: 	block;
			height:		100%;
			overflow:	auto;
			text-align:	justify;
			color:		#000;

			font-size:	1.0rem;
		}
			
			.paragraph_container{
				width: 		100%;
				padding: 	1rem 0 0 0;
			}
			#lyr1.paragraph_container{
				padding: 	0 0 0 0;
			}
				
				.paragraph_title{
					width: 	100%;
					font-weight:	bold;
					font-variant: 	small-caps;
				}
				
				.paragraph_container p{
					padding: 	0.5rem 0 0 0;
				}

				/*Enclosing div not mandatory: You can float the container with the image in order to align the caption*/
				#FenetreTexte .div_img{
					width:	40%;
				}
					#FenetreTexte .div_img img{
							width:	100%;
					}
				
				
					#FenetreTexte img{
						width: 		40%;
						padding:	0.37em 0 0 0;
					}
					
					
						#FenetreTexte img.L, .div_img.L{
							float: 		left;
							padding-right:	1.5em;
						}
						
						#FenetreTexte img.R, .div_img.R{
							float: 			right;
							padding-left:	1.5em;
						}
						
						#FenetreTexte img.C, .div_img.C{
							display: 	block;
							margin: 	0.5em auto;
							text-align: center;
						}
					
					#FenetreTexte .caption{
						font-size: 		80%;
						padding-top: 	0;
					}
				
				
				
				/*Vieille solution 
				#FenetreTexte .div_img{
					display: 	inline-block;
					width:		100%;
					text-align: center;
				}
					#FenetreTexte img.center {
						position:	relative;
						display: 	inline-block;
						width:		100%;
						margin: 	0;
						text-align: center;
					}
				*/
				
				
				/**/


		#LienFenetre {
			position: 	relative;
			display:	block; 
			height:		100%;
			margin: 	0 40px;
			
			overflow:	hidden;
			
			border: 			none;
			background-color:	transparent;
		}
		
			#Speed {
				display:	block; 
				position:	absolute; 
				top:		0;
				width:		100%; 
				margin-left:	auto;
				margin-right:	auto; 
				margin-top:		10%; 

				text-align:			center; 
				text-transform: 	uppercase; 
				text-decoration: 	none; 
				font-weight: 		lighter; 
				font-size: 			1em; 
				color:				#333;
			}
			
			
			
			#fenetre_image{
				display:		none; 
				position:		absolute;
				left:			50%; 
				top:			50%; 
				transform: 		translate(-50%, -50%);

				-ms-interpolation-mode: bicubic;
				border: 		none;
			}
			
			#Description{
				box-sizing: border-box;
				position: 	absolute;
				display:	none;
				top: 		0;
				
				max-height: 80%; 
				width: 		100%;
				overflow-y: scroll;
				margin: 	0; 
				padding: 	0.5rem 0.5rem 0.5rem 1.2rem;
				z-index: 	100;
				
				background-color:	#FFF;
				opacity : 			1; 
				text-align:			justify;
				font-size:			1.0rem;
			}
			
			#Description a{
				
			}
			
			#InstructionEntree{
				position: 	absolute;
				display:	none;
				bottom: 		0;
				width: 		100%;
				height:		2.0rem;
				margin: 	3.0rem auto 0 auto; 
				
				z-index: 	101;
				
				text-align:			center;
				text-transform: 	uppercase; 
				text-decoration: 	none; 
				font-weight: 		bold;
				font-size: 			1.2rem; 
				color:				#000;
			}
		
		
		
		
		
		#Credits_boutton {
			display: block;
			text-align: right;
		}
			#Credits_boutton a{
				display:inline-block;
				opacity : 0.4;
			}
			#Credits_boutton a:hover {
				opacity: 	1;
				cursor: 	pointer;
			}
			
			#Credits_boutton a span{
				margin: 		0 0.3rem 1.0rem 0;
				font-size:		1.0rem;
			}
			
			#Credits_boutton a img{
				height:		1.0em;
			}
			
			
		
		#Credits{	
			display:	block; 
			
			max-height: 50vh;
			width : 	100%; 
			text-align:		right; 

			padding: 0 0.3rem 0 0.5rem;

			font-size: 	1.0rem; 
			color:		#333; 
			overflow:	auto;
			
			direction: rtl; /* position the scrollbar on the left hand side */
		}
			#Credits div{
				direction: ltr; /* position the scrollbar on the left hand side : restablish direction*/
			}
			
			.credits_group_container, .credits_obj_fld_container{
				margin : 0 0 1rem 0; 
			}
			
			
				#Credits p, #Credits div.info_info{
					margin : 0 0 0.5rem 0; 	
				}
				#Credits .clef{
					display:		inline-block;
					padding-top: 	0.3rem;
					vertical-align:	top;
					
					font-weight:	normal;
				}	
				#Credits .info{
					
					font-size: 		0.7rem;
					color:			#999;
				}
				#Credits .info_info{
					font-size: 1.0rem;
					color:#000;
				}
				#Credits .info_info ul{
					margin-left:2.0em;
					color:#999;
				}
				#Credits .not_last_inline:after{
					content: ", ";
				}
				
			#Credits h1{
				margin : 		0 0 1% 0;
				font-size: 		1.3rem; 
				font-family: 	'TechnicLite', 'Orator Std', 'Arial', 'sans-serif'; 
				font-weight:	normal;
			}
			#Credits h2{
				margin : 		0 0 1% 0;
				font-size: 		1.1rem; 
				font-family: 	'TechnicLite', 'Orator Std', 'Arial', 'sans-serif'; 
				font-weight:	normal;
			}
			#Credits h3{
				margin : 		0 0 1% 0;
				font-size: 		1.0rem; 
				font-family: 	'TechnicLite', 'Orator Std', 'Arial', 'sans-serif'; 
				font-weight:	normal;
			}
			.credits_sub_table{
				display:block; 
				width: 100%;
				text-align:right;
			}
				.credits_sub_table tbody{
					display:block; 
					width: 100%;
				}
					.credits_sub_table tr{
						width: 100%;
					}
					.credits_sub_table tr td{
						vertical-align:top;
					}
					.credits_sub_table tr td:first-child {
						text-align: left;
						
					}
					.credits_sub_table tr td:last-child {
						width: 100%; /*makes the tds fill the table width with priority to the last-childs content*/
						text-align: right;
					}
		



		
		#Titre {
			box-sizing:	border-box;
			display: 	block;
			float: 		right;
			
			height: 	4.5rem; 
			width: 		85%;
			z-index:	9;
			
			margin: 		1.0rem 0 0 0; 
			text-align: 	right; 
			color: 			#000;
		}

			#Titre0 {
				font-size:		1.4rem; 
				text-transform:	none;
				font-family: 	'Anaheim', 'Arial narrow', sans-serif; 
				opacity:		0.8;
			}
			
			#Titre1 {
				font-size:		1.0rem; text-transform:none;
				font-family: 	'Anaheim', 'Arial narrow', sans-serif; 
				opacity:		0.8;
			}
			
			#Titre2 {
				font-size:		0.8rem; 
				text-transform:	none;
				font-family: 	'Anaheim', 'Arial narrow', sans-serif; 
				color:			#000;
				opacity:		0.6;
			}
			
			#Titre a{
				text-align:		justify;
			}
			
			#Titre a:hover {
				color:			#000;
				opacity:		1;
				cursor:			pointer;
				font-weight:	bold;
			}
			
			
	/*Controles affichage fenêtre*/
		#Aspects {
			position:	relative;
			display: 	block;
			height:		2.0rem;
			text-align: right;
			
			font-size:		1.0rem;
		}
			
			#Aspects a{
				position:	relative;
				padding:	0;

				top:0;
				opacity : 0.4;
			}
			
				#Aspects a span{
					display:	inline-block;
					margin:	0 0.5% 0 1.0%; 

					overflow:		hidden;
					text-align: 	right;

				}
				
				#Aspects a img{
					padding:	0.0rem 0.5rem;
					height:		1.0rem;
					//background:	#FFFF00;
				}
			
			#Aspects a:hover {
				opacity : 1;
			}
				
		#Modes {
			display: 	inline-block;
			
			height: 	2em; 
			//width:		10%;
			z-index:	20;
			
			text-align: left;
			white-space: 	nowrap;
		}
		
		#Modes img {
			height:			100%;
			max-width:		1.5rem;
			max-height:		1.5rem;
			margin-right:	1.5rem;
		}
			
			#PlayPause {
				display: 	inline-block;
				height:		100%;
				position:	relative;
				opacity : 	0.4;
			}
			
			
			
	#slide{
		position:	relative;	/*Notwending für das Hochgleiten beim Laden der Seite, Notwendig für die positionierung 'absolute' der Knöpfe*/
		display: 	block;
		width:		100%; 
		height:		7rem;
		z-index:	10;
		
		overflow: 	visible;
		white-space: nowrap;
	}
		/*
		Thumbnail scroller jQuery plugin
		scrollers styling
		*/


		#Scroller{
			display:	inline-block;
			position:relative; bottom: 0; 
			width:100%; 
			padding:0; margin:0 auto; 
			overflow:hidden; 
		}

		#Scroller , .ScrollerCoMobil, .ScrollerCoIndiv, .ScrollerCoIndiv div, .ScrollerCoIndiv div a{height:100%;}

		.ScrollerCoMobil{position:relative; left:0}

		.ScrollerCoIndiv{float:left;}
		.ScrollerCoIndiv div{height:100%;}/*Marge ajouté par code : margin-left: 5px; margin-right: 5px; */
		.ScrollerCoIndiv div a{display:block; padding:0;}
		.ScrollerCoIndiv div a img{border: none; height:100px;}	/*code doit ajuster la hauteur à celle du ScrollerCoMobil*/
			

			/*NextPrevBouttons*/	
			.ScrollerButtonNext, .ScrollerButtonPrev{
				display:	block; 
				position:	absolute; 
				
				width:40px; height:	7rem; 
				
				opacity:0.6;
			}
			.ScrollerButtonNext{
				right:0;
				bottom:0;
				
				margin:0 -40px 0 0;
				background:transparent url(https://sea.archi/00_StrImg/bouttons/next.png) center center no-repeat;
				background-size: 20px;
			}
			.ScrollerButtonPrev{
				left:0;
				bottom:0;

				margin:0 0 0 -40px;
				background:transparent url(https://sea.archi/00_StrImg/bouttons/prev.png) center center no-repeat;
				background-size: 20px;
			}
			
			.ScrollerButtonNext:hover, .ScrollerButtonPrev:hover{
				opacity:1;
			}
			
			
			.ArrowUpUbersicht,.ArrowDownUbersicht{
				display:	block; 
				position:	absolute; 
				bottom: 0;
				margin-bottom: -2.5rem;
				
				width:100%; height:2rem; 
				
				opacity:0.6;
				z-index:300;
			}
			.ArrowUpUbersicht{
				background:transparent url(https://sea.archi/00_StrImg/bouttons/down.png) center center no-repeat;	
				background-size: 33px;
			}
			.ArrowDownUbersicht{
				background:transparent url(https://sea.archi/00_StrImg/bouttons/up.png) center center no-repeat;
				background-size: 33px;
			}
			.ArrowUpUbersicht:hover, .ArrowDownUbersicht:hover{
				opacity:1;
			}





	/*Text_paragraphes*/
		#Paragraphes {
			display: 	block;
			z-index:	3;
			margin: 	0 auto; 

			text-align: right ; 
			color: 		#000;
		}
		
		#Paragraphes div div div {
			margin-bottom:	0.5rem;
		}
		
		#Paragraphes a:hover {
			font-weight:	bold;
			color:			#000;
		}
		


/*Only whith JAVASCRIPT*/
	#slide {display:none;} 

/*Only whith IE=false (autre que Internet Explorer)*/
	#slide {bottom:-100%;}
}