html {
	margin-left:-8px;
}

body
{
font-family:Tahoma,Geneva,sans-serif;
font-weight:400;
overflow:hidden;

}

#Callouts { display:none;}

.Explore {
padding: 5px;
color: #fff;
font-size: 1.75em;
font-weight: bold;
}

.MainBuildingTitle {
font-size:.9em;
color:#000;
padding: 120px 0 0 5px;
font-weight:bold;
}

.MainBuildingTitle:hover {
font-size:.9em;
color:#fff;
padding: 120px 0 0 5px;
font-weight:bold;
}

.MainBuildingMapTitle {
font-size: .9em;
color: #000;
padding-top: 63px;
font-weight: bold;
margin-left: -30px;
width: 200px;
-webkit-text-stroke:1px white;
}
	
.MainBuildingMap {
background-image: url("../images/Main_building_hotspot_inactive.png");
background-repeat: no-repeat;
position: fixed;
display: inline-block;
top: 550px;
right: 800px;
width: 36px;
height: 77px;
font-size:2em;
}

.MainBuildingMap:hover {
background-image: url("../images/Main_building_hotspot_hover.png");
background-repeat: no-repeat;
position: fixed;
display: inline-block;
top: 550px;
right: 800px;
width: 36px;
height: 77px;
font-size:2em;
}

.BlowerBuildingTitle {
font-size:.9em;
color:#000;
padding: 120px 0 0 5px;
font-weight:bold;
}

.BlowerBuildingTitle:hover {
font-size:.9em;
color:#fff;
padding: 120 5px;
font-weight:bold;
}

.BlowerBuildingMapTitle {
font-size: 2em;
color: #000;
padding-top: 100px;
font-weight: bold;
margin-left: -35px;
width: 200px;
-webkit-text-stroke:1px white;
}

.BlowerBuildingMap {
background-image: url("../images/Blower_building_hotspot_inactive.png");
background-repeat: no-repeat;
position: fixed;
display: inline-block;
top: 500px;
right: 100px;
width: 115px;
height: 115px;	
}

.BlowerBuildingMap:hover {
background-image: url("../images/Blower_building_hotspot_hover.png");
background-repeat: no-repeat;
position: fixed;
display: inline-block;
top: 500px;
right: 100px;
width: 115px;
height: 115px;
}

.DewateringBuildingMapTitle {
font-size: .9em;
color: #000;
padding-top: 100px;
font-weight: bold;
margin-left: -10px;
width: 200px;
-webkit-text-stroke:1px white;
}

.DewateringBuildingTitle {
font-size:.9em;
color:#fff;
padding: 120px 0 0 5px;
font-weight:bold;
}

.DewateringBuildingTitle:hover {
font-size:.9em;
color:#fff;
padding: 120 5px;
font-weight:bold;
}


.DewateringBuildingMap {
background-image: url("../images/Dewatering_building_hotspot_inactive.png");
background-repeat: no-repeat;
position: fixed;
display: inline-block;
top: 500px;
left: 70px;
width: 115px;
height: 115px;	
font-size:2em;
}

.DewateringBuildingMap:hover {
background-image: url("../images/Dewatering_building_hotspot_hover.png");
background-repeat: no-repeat;
position: fixed;
display: inline-block;
top: 500px;
left: 70px;
width: 115px;
height: 115px;
font-size:2em;
}

.MainBuildingThumb {
background-image: url("../images/main_thumbnail_gradient_inactive.png");
background-repeat: no-repeat;
height:250px;
width:250px;
font-size:2em;
color:#fff;
}

.MainBuildingThumb:hover {
background-image: url("../images/main_thumbnail_gradient_hover.png");
background-repeat: no-repeat;
height:250px;
width:250px;
}

.MainBuildingThumb:active {
background-image: url("../images/main_thumbnail_gradient_active.png");
background-repeat: no-repeat;
height:250px;
width:250px;
}



.BlowerBuildingThumb {
background-image: url("../images/blower_thumbnail_gradient_inactive.png");
background-repeat: no-repeat;
height:250px;
width:250px;
font-size:2em;
}

.BlowerBuildingThumb:hover {
background-image: url("../images/blower_thumbnail_gradient_hover.png");
background-repeat: no-repeat;
height:250px;
width:250px;
}

.BlowerBuildingThumb:active {
background-image: url("../images/blower_thumbnail_gradient_active.png");
background-repeat: no-repeat;
height:250px;
width:250px;
}

.DewateringBuildingThumb {
background-image: url("../images/dewatering_thumbnail_gradient_inactive.png");
background-repeat: no-repeat;
height:250px;
width:250px;
font-size:2em;
}

.DewateringBuildingThumb:hover {
background-image: url("../images/dewatering_thumbnail_gradient_hover.png");
background-repeat: no-repeat;
height:250px;
width:250px;
}

.DewateringBuildingThumb:active {
background-image: url("../images/dewatering_thumbnail_gradient_active.png");
background-repeat: no-repeat;
height:250px;
width:250px;
}

iframe{
overflow:hidden;
margin-top:-8px;
}

.container{
	min-width:100%;
	display:block;
	position:relative
	}

.menu{
	width:40px;
	height:40px;
	display:block;
	position:relative;
	z-index:999;
	}

.list,.intro{
	height:800px;
	top:0;
	display:flex;
	position:fixed;
	align-items:center;
	flex-flow:column wrap;
	justify-content:center;
	z-index:-1;
	transition:all .75s ease
	
	}

.list{
	background:transparent;
	width:250px;
	left:-250px;
	opacity:0
	
	}

.list span{
	background:#fff;
	width:100px;
	margin:5px 0;
	padding:10px 0;
	text-align:center;
	border-radius:4px;
	
	}

.intro{

	padding:0 0px;
	left:0;
	text-align:center
	}

.btn{

    background: #008a91;
    width: 200px;
    height: 50px;
    top: 22%;
    left: 0px;
    display: block;
    position: absolute;
    border-radius: 3%;
	}
	
.menu:focus-within .btn{
display:none;
	}

.btn:before,
.btn:after{
	
	width:20px;
	height:2px;
	left:10px;
	display:block;
	position:absolute;
	content:"";
	transition:all .75s ease

	}
	
.btn:before{top:16px}
.btn:after{bottom:16px}

.menu:focus-within .list{left:0;opacity:1}
.menu:focus-within .intro{width:calc(100% - 470);left:120px}
.menu:focus-within .btn:before{transform:rotate(45deg) translate(2px,2px)}
.menu:focus-within .btn:after{transform:rotate(-45deg) translate(2px,-2px)}