
@media screen {

	* html body * { height: 100%; }
	body {
		background-color: #000;
		overflow: hidden;
		font-family: Arial, Helvetica, sans-serif;
	}
	.hotspot	{ cursor: pointer; }
	.no-default-cursor { cursor: url('invisible_1pt.ico'), default;	}
	.no-pointer-cursor { cursor: url('invisible_1pt.ico'), pointer;	}

	#body_ {
		position: absolute;
		width: 100%;
		top: 0%; 
		bottom: 0%;		
		height: auto;
		background-color: #000;
	}

	#main {
		position: absolute;
		width: 100%;
		top: 0%; 
		bottom: 0%;		
		height: auto;
		overflow: hidden;
		background: rgb(248,248,248); /* Old browsers */
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI1JSIgc3RvcC1jb2xvcj0iI2Y4ZjhmOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk1JSIgc3RvcC1jb2xvcj0iI2Q0ZDRkNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
		background: -moz-linear-gradient(top,  rgba(248,248,248,1) 5%, rgba(212,212,212,1) 95%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(5%,rgba(248,248,248,1)), color-stop(95%,rgba(212,212,212,1))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  rgba(248,248,248,1) 5%,rgba(212,212,212,1) 95%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  rgba(248,248,248,1) 5%,rgba(212,212,212,1) 95%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  rgba(248,248,248,1) 5%,rgba(212,212,212,1) 95%); /* IE10+ */
		background: linear-gradient(to bottom,  rgba(248,248,248,1) 5%,rgba(212,212,212,1) 95%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#d4d4d4',GradientType=0 ); /* IE6-8 */
	}
	#BannerTop {
		position: absolute;
		overflow: hidden;
		width: 100%;
/*		top: 2.778%;
		height: 8.333%; */
top: 5.5%;
height: 7.2%;
		background-color: #E2001A;
	}
	#BannerTop #RoofVentHead  { position: absolute; left:4%; height:100%; }
	#BannerTop #Logo { position: absolute; right:0%; height:100%; background-color:rgba(248,248,248,1); }
	
	#BannerMenu {
		position: absolute;
		bottom: 0%;
		width: 100%;
/*		height: 8.333%; */
height: 10%;
		background-color: #E2001A;
	}

	#StageArea {
		position: absolute;
		width: 100%;
		left: 0%;
/*		top: 11.111%;
		bottom: 8.333%; */
top: 12.5%;
bottom: 10%;
	}
	#StageAreaI {
		position: absolute;
		top: 4%;
		left: 4%;
		width: 92%;
		height: 91%;
	}
	#StageAreaII {
		position: absolute;
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;		
	}
	.normalview {
		top: 4%;
		left: 4%;
		width: 92%;
		height: 92%;		
	}
	.fullview {
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;		
	}

	#ViewGround {
		position: absolute;
		width: 41.667%;
		top: 0%;
		bottom: 0%;
		left: 50% !important;
		text-align: center;
		display: none;
		z-index: 2;
	}	
	#ViewGround > div {
		position: absolute;
		top: 0%; left: -50%;
		width: 100%; height: 100%;
		border: 2px solid #000;
		background-color: #fff;
	}	
	#View3DGround {
		position: absolute;
		top: 0%; left: 0%;
		width: 41.667%; /* 19.366%; */
		bottom: 0%; /* 53.462%; */
		border: 4px solid #000;
		border-right-width: 5px;
		z-index: 3;
		transform-origin: top left;
		-ms-transform-origin: top left;
		-webkit-transform-origin: top left;
		-moz-transform-origin: top left;
		-o-transform-origin: top left;				
		display: none;
	}
	#View3DGround > div {
		position: absolute;
		top: 0%; left: 0%;
		width: 100%; height: 100%;
		background-color: #fff;		
	}
	#View2DGround {
		position: absolute;
		top: 0%; /* 53.462%; */
		left: 0%;
		bottom: -1%;
		width: 41.667%; /* 19.366%; */
		border: 4px solid #000;
		border-right-width: 5px;
		z-index: 4;
		transform-origin: bottom left;
		-ms-transform-origin: bottom left;
		-webkit-transform-origin: bottom left;
		-moz-transform-origin: bottom left;
		-o-transform-origin: bottom left;
		transform: scale3d(0.46538, 0.46538, 1.0);
		-webkit-transform: scale3d(0.46538, 0.46538, 1.0); 
		-moz-transform: scale3d(0.46538, 0.46538, 1.0);
		-o-transform: scale3d(0.46538, 0.46538, 1.0);				
		display: none;
	}
	#View2DGround > div {
		position: absolute;
		top: 0%; left: 0%;
		width: 100%; height: 100%;
		background-color: #fff;
	}
	#ViewHallGround {
		position: absolute;
		top: 0%;
		right: 0%;
		bottom: 0%;
		width: 41.667%; /* 19.366%; */
		border: 4px solid #000;
		z-index: 5;
		transform-origin: top right;
		-ms-transform-origin: top right;
		-webkit-transform-origin: top right;
		-moz-transform-origin: top right;
		-o-transform-origin: top right;
		display: none;		
	}
	#ViewHallGround > div {
		position: absolute;
		top: 0%; left: 0%;
		width: 100%; height: 100%;
		background-color: #fff;		
	}
	#ViewInfoGround {
		position: absolute;
		top: 50%;
		right: 0%;
		bottom: -1%;
		width: 41.667%; /* 19.366%; */
		border: 4px solid #000;
		z-index: 6;
		transform-origin: bottom right;
		-ms-transform-origin: bottom right;
		-webkit-transform-origin: bottom right;
		-moz-transform-origin: bottom right;
		-o-transform-origin: bottom right;
		display: none;
	}
	#ViewInfoGround > div {
		position: absolute;
		top: 0%; left: 0%;
		width: 100%; height: 100%;
		background-color: #fff;
	}
	#View3DGround > div > span, 
	#View2DGround > div > span, 
	#ViewHallGround > div > span, 
	#ViewInfoGround > div > span { 
		position:absolute; top:45%; left:0%;
		font-size:3em; font-weight:bold; color:#E2001A; 
		width:100%;	text-align:center; display:inline-block; 
	}
	#ViewInfoGround > div > span { top:39%; }
		
	div#View3D {
		position: absolute;
		visibility: hidden;
		z-index: 10;
		top: 0%;
		width: 41.667%;
		left: 0%;
		bottom: 0%;
		transform-origin: top left;
		-ms-transform-origin: top left;
		-webkit-transform-origin: top left;
		-moz-transform-origin: top left;
		-o-transform-origin: top left;
	}
	div#View3DI {
		position: absolute;
		top: 0%; left: 0%;
		width: 100%; height: 100%;
		border: 4px solid #000;
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
	}
	div#View3DCon {
		position: absolute;
		visibility: hidden;
		z-index: 1;
		width: 41.667%;
		height: 5%;
		top: 24%;
		left: 0%;
		border-top: 2px solid #000;
		transform-origin: top left;
		-ms-transform-origin: top left;
		-webkit-transform-origin: top left;
		-moz-transform-origin: top left;
		-o-transform-origin: top left;
	}
	div#RV3D_svg {
		position: absolute;
		top: 0%;
		left: 0%;
		background-image: url(3DSchnitt.jpg);
		background-repeat: no-repeat;
		background-size: cover;
	}
	div#View3D_but {
		position: absolute;
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;		
		cursor: pointer;
/*		border: 1px solid #000;		*/
		background-color: transparent;
	}
	div#View3D_but:hover {
		background-color: #ff0;
		opacity: 0.3;
	}
	
	div#View2D {
		position: absolute;
		visibility: hidden;
		z-index: 11;
		top: 0%; /* 53.462%; */
		left: 0%;
		bottom: 0%;
		width: 41.667%; /* 19.366%; */
/*		height: 46.538%;  710px  780px */
/*		border: 2px solid #888; */
/*		overflow: hidden; */
		transform-origin: bottom left;
		-ms-transform-origin: bottom left;
		-webkit-transform-origin: bottom left;
		-moz-transform-origin: bottom left;
		-o-transform-origin: bottom left;
	}
	div#View2DI {
		position: absolute;
		top: 0%; left: 0%;
		width: 100%; height: 100%;
		border: 4px solid #000;
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;		
	}	
	div#View2DCon {
		position: absolute;
		visibility: hidden;
		z-index: 1;
		width: 41.667%;
		height: 5%;
		bottom: 18%;
		left: 0%;
		border-top: 2px solid #000;		
		transform-origin: bottom left;
		-ms-transform-origin: bottom left;
		-webkit-transform-origin: bottom left;
		-moz-transform-origin: bottom left;
		-o-transform-origin: bottom left;
	}
	div#RV2D_svg {
		position: absolute;
		top: 0%;
		left: 0%;
		background-image: url(2DSchnitt.jpg);
		background-repeat: no-repeat;
		background-size: cover;
	}
/*	
	canvas#RV2D_exhaust,
	canvas#RV2D_exhaust_M { position: absolute; top: 10.513%; left: 12.5%; width: 59.718%; height: 54.872%;
	canvas#RV2D_supply    { position: absolute; top: 12.178%; left: 32.394%; width: 54.93%;  height: 85.897%;
	canvas#RV2D_recirc    { position: absolute; top: 10.513%; left: 32.394%; width: 38.028%; height: 86.923%;
*/
	.ShowHL {
/*		transition: opacity 0.05s linear;
		-webkit-transition: opacity 0.05s linear;
		-moz-transition: opacity 0.05s linear;
		-o-transition: opacity 0.05s linear;
		opacity: 1; */
		visibility: visible;
	}
	.HideHL {
/*		
		transition: opacity 0.5s linear;
		-webkit-transition: opacity 0.5s linear;
		-moz-transition: opacity 0.5s linear;
		-o-transition: opacity 0.5s linear;
		opacity: 0;	*/
		visibility: hidden;
	}
	.ShowOpMode {
		transition: opacity 1.3s ease-in-out;
		-webkit-transition: opacity 1.3s ease-in-out;
		-moz-transition: opacity 1.3s ease-in-out;
		-o-transition: opacity 1.3s ease-in-out;
		opacity: 1;		
	}
	.HideOpMode {
		transition: opacity 1.3s ease-in-out;
		-webkit-transition: opacity 1.3s ease-in-out;
		-moz-transition: opacity 1.3s ease-in-out;
		-o-transition: opacity 1.3s ease-in-out;
		opacity: 0;		
	}

	div#View2D_but {
		position: absolute;
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;		
		cursor: pointer;
/*		border: 1px solid #000;		*/
	}
	div#View2D_but:hover {
		background-color: #ff0;
		opacity: 0.3;
	}

	div#ViewHall {
		position: absolute;
		visibility: hidden;
		z-index: 12;
		top: 0%;
		width: 41.667%;
		right: 0%;
		bottom: 0%;
		transform-origin: top right;
		-ms-transform-origin: top right;
		-webkit-transform-origin: top right;
		-moz-transform-origin: top right;
		-o-transform-origin: top right;
	}
	div#ViewHallI {
		position: absolute;
		top: 0%; right: 0%;
		width: 100%; height: 100%;
		border: 4px solid #000;
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
	}	
	div#ViewHallCon {
		position: absolute;
		visibility: hidden;
		z-index: 1;
		width: 41.667%;
		height: 5%;
		top: 24%;
		right: 0%;
		border-top: 2px solid #000;		
		transform-origin: top right;
		-ms-transform-origin: top right;
		-webkit-transform-origin: top right;
		-moz-transform-origin: top right;
		-o-transform-origin: top right;
	}
	div#ViewHall_bg {
		position: absolute;
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;		
	}
	div#ViewHall_bg img {
		position: absolute;
		top: 0%;
		right: 0%;
		width: 100%;
		height: 100%;
	}
	div#ViewHall_but {
		position: absolute;
		top: 0%;
		right: 0%;
		width: 100%;
		height: 100%;		
		cursor: pointer;
	}
	div#ViewHall_but:hover {
		background-color: #ff0;
		opacity: 0.3;
	}
	div#ViewHall_K           { position: absolute; top: 40.5%; left: 14%; width: 85.07%; height: 69.577%; overflow: hidden; }
	img#ViewHall_K_arr       { position: absolute; top: 0%; left: 0%; width: 93.708%; height: 53.455%; }
	canvas#ViewHall_K_canvas { position: absolute; top: -4%; left: 1.656%; width: 98.344%; height: 100%; /* background-color:#f88; */ }
	
	div#ViewHall_I           { position: absolute; top: 40.6%; left: 16.5%; width: 75.35%; height: 58.59%; overflow: hidden; }
	img#ViewHall_I_arr       { position: absolute; top: -2%; left: 0%; width: 100%; height: 79.21%; }
	canvas#ViewHall_I_canvas { position: absolute; top: -10%; left: 2%; width: 100%; height: 100%; /* background-color:#f88; */ }
	
	div#ViewHall_H           { position: absolute; top: 40.5%; left: 29.5%; width: 48.45%; height: 69.36%; overflow: hidden; }
	img#ViewHall_H_arr       { position: absolute; top: -2%; left: 4.07%; width: 93%; height: 83.73%; }
	canvas#ViewHall_H_canvas { position: absolute; top: -10%; left: 0%; width: 100%; height: 100%; /* background-color:#f88; */ }


	.LayerActive {
		display: block;
		opacity: 0.01;	
	}
	.LayerInactive {
		display: none;	
		opacity: 0.01;	
	}
	.ShowAppMode {
		transition: opacity 1.3s ease-in-out;
		-webkit-transition: opacity 1.3s ease-in-out;
		-moz-transition: opacity 1.3s ease-in-out;
		-o-transition: opacity 1.3s ease-in-out;
		opacity: 1;	
	}
	.HideAppMode {
		transition: opacity 1.3s ease-in-out;
		-webkit-transition: opacity 1.3s ease-in-out;
		-moz-transition: opacity 1.3s ease-in-out;
		-o-transition: opacity 1.3s ease-in-out;
		opacity: 0;
	}


	div#ViewInfo {
		position: absolute;
		visibility: hidden;
		z-index: 13;
		top: 0%; /* 53.462%; */
		right: 0%;
		bottom: 0%;
		width: 41.667%;
		transform-origin: bottom right;
		-ms-transform-origin: bottom right;
		-webkit-transform-origin: bottom right;
		-moz-transform-origin: bottom right;
		-o-transform-origin: bottom right;
	}
	div#ViewInfoI {
		position: absolute;
		top: 0%; right: 0%;
		width: 100%; height: 100%;
		border: 4px solid #000;
		background-color: #fff;
		background-image: url(RoofVent_Vorteile.jpg);
		background-size: contain;
		background-repeat: no-repeat;
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
	}	
	div#ViewInfoCon {
		position: absolute;
		visibility: hidden;
		z-index: 1;
		width: 41.667%;
		height: 5%;
		bottom: 7%;
		right: 0%;
		border-top: 2px solid #000;		
		transform-origin: bottom right;
		-ms-transform-origin: bottom right;
		-webkit-transform-origin: bottom right;
		-moz-transform-origin: bottom right;
		-o-transform-origin: bottom right;
	}
	div#ViewInfo.MoveCorner {
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		top: 50%;
	}
	div#ViewInfo_cover {
		position: absolute;
		top: 0%;
		left: 0%;
		width: 100% !important;
		height: 100% !important;
		background-image: url(Halle.jpg);
		background-size: cover;
		background-position: right center;
		cursor: pointer;
	}
	div#ViewInfo_cover img {
		position: absolute;
		left: 0%;
		border: 0;
		height: 100% !important;
	}
	div#ViewInfo_cover.ShowInfo {
		transition: opacity 1s ease-in-out;
		-webkit-transition: opacity 1s ease-in-out;
		-moz-transition: opacity 1s ease-in-out;
		-o-transition: opacity 1s ease-in-out;
		opacity: 0;		
	}
	div#ViewInfo_cover.HideInfo {
		transition: opacity 1s ease-in-out;
		-webkit-transition: opacity 1s ease-in-out;
		-moz-transition: opacity 1s ease-in-out;
		-o-transition: opacity 1s ease-in-out;
		opacity: 1;		
	}
	div#ViewInfo.MoveCenter div#ViewInfo_cover img {
		transition: left 1s ease-in-out;
		-webkit-transition: left 1s ease-in-out;
		-moz-transition: left 1s ease-in-out;
		-o-transition: left 1s ease-in-out;
/*		left: -50%; */
		left: -98%;
	}
	div#ViewInfo.MoveCorner div#ViewInfo_cover img {
		transition: left 1s ease-in-out;
		-webkit-transition: left 1s ease-in-out;
		-moz-transition: left 1s ease-in-out;
		-o-transition: left 1s ease-in-out;
		left: -1%;
	}
	div#ViewInfo_but {
		position: absolute;
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;
		cursor: pointer;
/*		border: 1px solid #000;	*/
	}
	div#ViewInfo_but:hover {
		background-color: #ff0;
		opacity: 0.3;
	}
	
	div#Slides {
		position: absolute;
		visibility: hidden;
		z-index: 20;
		top: 0%;
		left: 0%;
		bottom: 0%;
		width: 100%;
/*		
		transform-origin: 95.2% 63%;
		-ms-transform-origin: 95.2% 63%;
		-webkit-transform-origin:95.2% 63%;
		-moz-transform-origin: 95.2% 63%;
		-o-transform-origin: 95.2% 63%;
*/
		transform-origin: 100% 65%;
		-ms-transform-origin: 100% 65%;
		-webkit-transform-origin: 100% 65%;
		-moz-transform-origin: 100% 65%;
		-o-transform-origin: 100% 65%;
	}
	div#SlidesI {
		position: absolute;
		top: 0%; left: -18px;
		width: 100%; height: 100%;
		border: 12px solid #000;
		overflow: hidden;
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;		
	}
	div#Slides_img {
		position: absolute;
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;		
	}
	div#Slides_img img {
		position: absolute;
		left: 0%;
		border: 0;
	}
	div#Slides_but {
		position: absolute;
		top: 0%;
		right: 0%;
		width: 100%;
		height: 100%;
		cursor: pointer;
		z-index: 100;
	}
	div#Slides_but:hover {
		background-color: #ff0;
		opacity: 0.3;
	}
/*
	.SlidesCorner {
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		transform: scale3d(0.19391, 0.19391, 1.0);
		-webkit-transform: scale3d(0.19391, 0.19391, 1.0);
		-moz-transform: scale3d(0.19391, 0.19391, 1.0);
		-o-transform: scale3d(0.19391, 0.19391, 1.0);
	}
*/
	.SlidesCenter {
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		transform: scale3d(1.0, 1.0, 1.0);
		-webkit-transform: scale3d(1.0, 1.0, 1.0);
		-moz-transform: scale3d(1.0, 1.0, 1.0);
		-o-transform: scale3d(1.0, 1.0, 1.0);
	}
	
	.MoveCenter {
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		transform: scale3d(1.0, 1.0, 1.0);
		-webkit-transform: scale3d(1.0, 1.0, 1.0);
		-moz-transform: scale3d(1.0, 1.0, 1.0);
		-o-transform: scale3d(1.0, 1.0, 1.0);
	}
	.MoveCorner {
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		transform: scale3d(0.46538, 0.46538, 1.0);
		-webkit-transform: scale3d(0.46538, 0.46538, 1.0); 
		-moz-transform: scale3d(0.46538, 0.46538, 1.0);
		-o-transform: scale3d(0.46538, 0.46538, 1.0);
	}
	.MoveCenterCon {
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		transform: scale3d(1.0, 1.0, 1.0);
		-webkit-transform: scale3d(1.0, 1.0, 1.0);
		-moz-transform: scale3d(1.0, 1.0, 1.0);
		-o-transform: scale3d(1.0, 1.0, 1.0);
	}
	.MoveCornerCon {
		transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		transform: scale3d(0.4, 1.0, 1.0);
		-webkit-transform: scale3d(0.4, 1.0, 1.0);
		-moz-transform: scale3d(0.4, 1.0, 1.0);
		-o-transform: scale3d(0.4, 1.0, 1.0);
	}
	.NoTrans {
		transition: none;
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: all 0s ease-in-out;		
	}
	
	.FadeOut {
		zoom:1; filter:alpha(opacity=0); opacity:0;
		transition: all 0.8s linear;
		-webkit-transition: all 0.8s linear;
		-moz-transition: all 0.8s linear;
		-o-transition: all 0.8s linear;
	}
	.FadeIn {
		zoom:1; filter:alpha(opacity=100); opacity:1;
		transition: all 0.8s linear;
		-webkit-transition: all 0.8s linear;
		-moz-transition: all 0.8s linear;
		-o-transition: all 0.8s linear;		
	}
	
	#ViewInfo_content {
		color:#444;
		position: absolute;
		width:84%; height:90%; bottom:4%; left:11%;
		overflow: hidden;
		font-size: 1.7em;
	}
	#ViewInfo_content.InfoHide {
		zoom:1; filter:alpha(opacity=0); opacity:0; z-index:-1;
		transform:scale3d(0.1, 0.1, 1);
		-ms-transform:scale3d(0.1, 0.1, 1);
		-moz-transform:scale3d(0.1, 0.1, 1);
		-webkit-transform:scale3d(0.1, 0.1, 1);
		-o-transform:scale3d(0.1, 0.1, 1);
		transition: all 0.8s ease-in-out;
		-webkit-transition: all 0.8s ease-in-out;
		-moz-transition: all 0.8s ease-in-out;
		-o-transition: all 0.8s ease-in-out;
	}
	#ViewInfo_content.InfoShow {
		zoom:1; filter:alpha(opacity=100); opacity:1; z-index:1;
		transform:scale3d(1, 1, 1);
		-ms-transform:scale3d(1, 1, 1);
		-moz-transform:scale3d(1, 1, 1);
		-webkit-transform:scale3d(1, 1, 1);
		-o-transform:scale3d(1, 1, 1);
		transition: all 0.8s ease-in-out;
		-webkit-transition: all 0.8s ease-in-out;
		-moz-transition: all 0.8s ease-in-out;
		-o-transition: all 0.8s ease-in-out;
	}
/*	#ViewInfo_content div { padding-left:12%; padding-right:4%; padding-top:20%; padding-bottom:3%; font-size:175%; } */
	#ViewInfo_content h2 { margin:0%; margin-bottom:7%; padding:0%; font-weight:bold; font-size:125%; }
	#ViewInfo_content ul {	margin:0%; margin-left:5%; padding:0%; list-style-type:square; }
	#ViewInfo_content ul li { margin:0%; margin-bottom:1.4em; padding:0%; padding-left:1%; }
	
	#ViewInfo_box1, #ViewInfo_box2, #ViewInfo_box3, #ViewInfo_box4, #ViewInfo_box5 {
		position: absolute;
		left: 6.5%;	
		width: 86%;
    height: auto;
    max-height: 22%;
    overflow: hidden;
		font-size: 1em;
		line-height: 1.35em;
		color: #444;
	}
	#ViewInfo_box1 { bottom: 82.9%;	}
	#ViewInfo_box2 { bottom: 65.3%;	}
	#ViewInfo_box3 { bottom: 52.8%;	}
	#ViewInfo_box4 { bottom: 36.8%;	}
	#ViewInfo_box5 { bottom: auto; top: 75%; }
	
/* MENU ===========================================================================================================*/
/* style the outer div to give it width */
.menu {
position:absolute;
z-index: 100;
width:92%;
left:4%;
top:25%;
height:40%;
font-size:100%;
}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul { position:relative; padding:0; margin:0; list-style-type:none; }
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu ul li { position:relative; float:left; width:20%; padding:0; margin:0; margin-right:5%; }
.menu ul li ul { width:100%; padding:0; margin:0% !important; list-style-type:none; left:0%; }
.menu ul li ul li { position:relative; float:left; width:100%; padding:0; margin:0% !important; }
.menu ul li.mright { 
/*	float:right; margin-right:5%; */
	position: absolute; top:0%; right:0%; /* width:15.5%; */ margin-right:0%;
}

/* style the links for the top level */
.menu div {
display: inline-block;
width:100%; 
height:auto;
line-height:100%; 
margin:0% !important;
/* padding:3% 10%; */
font-size:160%;
text-decoration:none; 
color:#000; 
border:1px solid #000;
background-color:#fff;
background-image:url(menu-arrup.png);
background-position: right 50%;
background-repeat: no-repeat;
background-size: contain;
}
.menu div > span {
	display: inline-block;
	padding: 3% 10%;
}

.menu ul li ul li div { border-bottom-style: none; }

/* style the second level background */
.menu div div.drop, .menu ul ul div.drop:visited { background:#fff; }

/* style the second level hover */
.menu ul ul div.drop:hover { background:#ffffb8; }
.menu ul ul :hover > div.drop { background:#ffffb8; }

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
margin:0% !important;
bottom:97%;
left:0; 
width:100%; height:auto;
/* border-bottom:1px solid #000; */
}
* html .menu ul ul { bottom:30px; }

/* style the second level links */
.menu ul ul div, 
.menu ul ul div:visited {
background:#fff; 
color:#000; 
height:auto; 
line-height:120%; 
/* padding:3% 10%; */
margin:0% !important;
width:100%
}
.menu ul ul div > span {
	display: inline-block;
	padding: 3% 10%;
}

/* style the top level hover */
.menu div:hover, 
.menu ul ul div:hover { 
	color:#000; 
	background-color:#ffffb8; 
}
.menu :hover > div, 
.menu ul ul :hover > div { 
	color:#000; 
	background-color:#ffffb8; 
}
.menu ul li#mExitBut div > span:hover {
	background-color:#ffffb8; 
}

/* make the second level visible when hover on first level list OR link */

/*.menu ul li:hover ul,
.menu ul div:hover ul { visibility:visible; height:auto; } */

.menu div.MSubLast { border-bottom:1px solid #000; }

.menu ul li#mExitBut {
	display: none;
	margin-right:-9.2%;
}
.menu ul li#mExitBut div {
	width: auto !important;
	display: block;
	background-image: none;
	background-color: transparent;
	border: 0;	
}
.menu ul li#mExitBut div > span {
	background-color: #fff;
	border: 1px solid #000;
}
.menu ul li#mOpBut {
	display: none;
	position: relative;
	float: none;
	margin-left: auto;
	margin-right: auto;
}
.menu ul li#mApBut {
	display: none;
	position: relative;
	float: none;
	margin-left: auto;
	margin-right: auto;
}


/*===========================================================================================================*/
#Carousel {
	position: absolute;
	z-index: 110;
	width: 50%;
	left: 25%;
	top: 21%;
/*	height: 55%; */
}
#Carousel.flexslider {
	margin: 0px;
	background-color: transparent !important;
	border: 0;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	box-shadow: 0 0 0 rgba(0,0,0,0);
	-webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
	-moz-box-shadow: 0 0 0 rgba(0,0,0,0);
}
#Carousel .slides img {
	height: 100%;
	width: auto !important;
	border: 2px solid #fff;
	margin-top: 4px;
}
#Carousel .slides img:hover {
	opacity: 0.85;
}

#Carousel .slides > li {
	margin-right: 3px;
	cursor: pointer;
}

#Carousel .flex-direction-nav {
/*	display: none; */
}

#Slider {
	position: absolute;
	width: 101%; height: 101%;	
	top: -0.5%; left: -0.5%;
	transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;			
}
#Slider.FullView {
	position: absolute;
	width: 100%; height: 100%;	
	top: 0%; right: 0%;
}
#Slider .slides img {
	width: 100%;
	height: 100%;
}
#Slider.flexslider {
	margin: 0px;
	border: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	box-shadow: 0 0 0 rgba(0,0,0,0);
	-webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
	-moz-box-shadow: 0 0 0 rgba(0,0,0,0);
}

#Slider .flex-viewport {
	max-height: 1024px;
}

.flex-caption {
/*	display: none; */
	width: 100%;
	padding: 0.5%;
	margin: 0px;
	position: absolute;
	left: 0;
	top: 0;
	background: rgba(255,255,255,0.7);
	color: #000;
	text-align: center;
	text-shadow: 0 0 0 rgba(0,0,0,0);
	font-size: 18px;
	line-height: 20px;	
}

/*===========================================================================================================*/
#DebugInfo { position:absolute; left:0%; bottom:20%; width:100%; height:20%; padding:0; text-align:center; }
#LBLInfo {	padding:0; padding-left:4%; padding-right:4%; background-color: transparent; color:#FFF; font-size:66%; line-height:66%; }
	

}

/* reset fallback values in modern browsers */
@media screen and ( min-width: 0px ) {

	body > header,
	body > nav,
	body > #main,
	body > footer {
		min-width: 0;
	}
}
