#main_menu {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	overflow: hidden;
}
#main_menu .logo {
	display: block;
	position: relative;
	top: calc(50vh - 8.85vw);
	font-size: 17.7vw;
    line-height: 17.7vw;
	text-align: center;
	text-transform: uppercase;
	text-shadow: 0 0.3vw 0 #f00, 0.15vw 0.3vw 0 #f00;
	cursor: default;
}
#main_menu a {
	position: absolute;
	font-size: 1.6vw;
    line-height: 1.8vw;
	text-transform: uppercase;
}
#main_menu .videos { top: 1.5vw; left: 1.5vw; }
#main_menu .bio { top: 1.5vw; right: 1.5vw; }
#main_menu .contact { bottom: 1.5vw; left: 1.5vw; }
#main_menu .arch { bottom: 1.5vw; right: 1.5vw; }

.content {
	position: absolute;
	max-height: calc(50vh - 9vw);
	z-index: 3;
}
.content ul {
	display: inline-block;
	list-style: none;
}
.content ul  li { line-height: 1.7vw; }
.content ul li a { 
	font-size: 1.2vw;
	text-transform: uppercase;
}
.content ul li a .small { text-transform: lowercase; }

#videos {
	top: -100%;
	left: 1.5vw;
	padding-left: 4.2vw;
	-webkit-transition: top .3s; /* For Safari 3.1 to 6.0 */
	-moz-transition: top .3s; 
    transition: top .3s;
}
#videos.open {
	top: 4vw;
	-webkit-transition: top .5s; /* For Safari 3.1 to 6.0 */
	-moz-transition: top .5s; 
    transition: top .5s;
}
#videos.content ul { vertical-align: top; }
#videos.content ul li { padding-right: 2vw; }
#videos.content ul li .small { display: none; }

#arch {
	bottom: -100%;
	right: 1.5vw;
	text-align: right;
	-webkit-transition: bottom .3s; /* For Safari 3.1 to 6.0 */
	-moz-transition: bottom .3s; 
    transition: bottom .3s;
}
#arch.open {
	bottom: 5vw;
	-webkit-transition: bottom .5s; /* For Safari 3.1 to 6.0 */
	-moz-transition: bottom .5s; 
    transition: bottom .5s;
}
#arch.content ul { vertical-align: bottom; }
#arch.content ul li { padding-left: 2vw; }

#contact {
	bottom: 1.7vw;
	left: -100vw;
	width: 65vw;
	font-size: 1.4vw;
	line-height: 1.4vw; 
	-webkit-transition: left .3s; /* For Safari 3.1 to 6.0 */
	-moz-transition: left .3s; 
    transition: left .3s;
}
#contact.open {
	left: 1.5vw;
	-webkit-transition: left .5s; /* For Safari 3.1 to 6.0 */
	-moz-transition: left .5s; 
    transition: left .5s;
}
#contact span {
	display: inline-block;
	margin-left: 2vw;
}
#contact .mail {  }
#contact .phone { font-size: 1.8vw; }

#overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	background: rgba(0,0,0,0.7);
	z-index: 1000;
	-webkit-transition: width .5s, height .5s; /* For Safari 3.1 to 6.0 */
	-moz-transition: width .5s, height .5s; 
    transition: width .5s, height .5s;
}
#overlay.open {
	width: 100%;
	height: 100%;
	-webkit-transition: width .2s, height .2s; /* For Safari 3.1 to 6.0 */
	-moz-transition: width .2s, height .2s; 
    transition: width .2s, height .2s;
}
#video_player {
	position: absolute;
	top: 10vh;
	left: 10vw;
	width: 0;
	height: 0;
	border: 0;
	background-color: #fff;
	overflow: hidden;
	z-index: 1001;
	-webkit-transition: width .2s, height .2s; /* For Safari 3.1 to 6.0 */
	-moz-transition: width .2s, height .2s; 
    transition: width .2s, height .2s;
}
#video_player.open {
	width: 80vw;
	height: 80vh;
	-webkit-transition: width .5s, height .5s; /* For Safari 3.1 to 6.0 */
	-moz-transition: width .5s, height .5s; 
    transition: width .5s, height .5s;
}
#slideshow {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 0;
}
#slideshow .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
@media screen and (max-width:810px), screen and (max-device-width:810px) {
	#main_menu a { font-size: 2vw; line-height: 2vw; }
	.content ul li { line-height: 2vw; }
}
@media screen and (max-width:810px) and (max-device-width:810px) and (orientation:portrait) { 
	#main_menu a { font-size: 2vh; line-height: 2.2vh; }
	#main_menu .videos { top: 1.5vh; left: 1.5vh; }
	#main_menu .bio { top: 1.5vh; right: 1.5vh; }
	#main_menu .contact { bottom: 1.5vh; left: 1.5vh; }
	#main_menu .arch { bottom: 1.5vh; right: 1.5vh; }
	.content ul li { line-height: 2.4vh; }
	.content ul li a { font-size: 1.6vh; }
	
	#videos { left: 1.5vh; padding-left: 4.6vh; }
	#videos.open { top: 4.4vh; }
	#videos.content ul li { padding-right: 2vh; }
	#arch { right: 1.5vh; }
	#arch.open { bottom: 5.4vh; }
	#arch.content ul li { padding-left: 2vh; }
	#contact { bottom: 1.7vh; font-size: 1.6vh; line-height: 2.2vh; }
	#contact a { display: block; }
	#contact a span { margin-left: 2vh; }
	#contact .phone { font-size: 1.8vh; }
}