/* CSS Document */

*{font-family: 'Lato', sans-serif;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

html{height:100%;}
body{padding:0px; margin:0px; color:#FFFFFF; font-size:14px; font-weight:400; text-align:left; background:#FFFFFF; min-height:100%; border: 10px #FFFFFF solid;}

a, a:visited{color:#FFFFFF; text-decoration:none;}
a:hover, a:active{color:#fff200;}
img{max-width:100%; height:auto;}

#background{position: fixed; width: 100%; height:100%; box-sizing: border-box; z-index:-1;}
#container{margin:0px; width:100%; min-height:100%;}

#header{background:#ff6b00; color:#FFFFFF; font-size:14px; width:193px; right:0px; margin:0px; padding-top:40px; height:100%; position:fixed; text-align:center; z-index:3; border-bottom:20px solid #FFFFFF;}
#header #logo{position:relative; text-align:center; background: #ff6b00; margin-top:44px;}
#main-navs{}
ul.navs{list-style:none; text-align:center; margin:30px 0px 0px 0px; padding:0px; width:100%; display:block;}
ul.navs li{display:block; color:#FFFFFF; padding:3px 0px;}
ul.navs li.menuBar{display:none;}
ul.navs li a, ul.navs li a:visited{text-decoraction:none; color:#FFFFFF; font-weight:400;}
ul.navs li a:hover, ul.navs li a:active{color:#FFFFFF; font-weight:700;}
ul.navs li.current a{}
.project{color:rgba(255,255,255,0.5) !important; text-transform:uppercase; font-weight:300;}
#navCon{font-size:13px; font-weight:300;}

#footer{font-size:12px; color:#FFFFFF; position:fixed; margin-bottom:30px; bottom:0px; right:0px; width:193px; text-align:center; z-index:3;}
.creditLine{font-weight:300; display:block; padding-top:7px;}
a.credit, a.credit:visited{color:#FFFFFF; font-weight:300;}
a.credit:hover, a.credit:active{color:#FFFFFF; font-weight:400;}

.homeSlider{position: fixed; width: 100%; height:100%; box-sizing: border-box; border-right: 193px solid #FFFFFF;}

#about{
	background:#ff6b00; 
	padding:71px 76px 0px 56px; 
	position:fixed; 
	right: -280px; 
	height: 100%; 
	width:474px; 
	z-index:1; 
	-webkit-transition: right 1s ease-in-out; /* Safari */
	transition: right 1s ease-in-out;
	 border-bottom:20px solid #FFFFFF;
}

#contact{
	background:#ff6b00; 
	padding:71px 76px 0px 56px; 
	position:fixed; 
	right: -280px; 
	height: 100%; 
	width:474px; 
	z-index:1; 
	-webkit-transition: right 1s ease-in-out; /* Safari */
	transition: right 1s ease-in-out;
	 border-bottom:20px solid #FFFFFF;
}

#about p, #contact p{line-height:1.4; font-weight:300;}

.sliderTitle{line-height:normal; font-size:15px; font-weight:300;}

a.closeButton, a.closeButton:visited{font-size:14px; color:#FFFFFF; font-weight:700;}
a.closeButton:hover, a.closeButton:active{color:#FFFFFF;}
.xButton{font-weight:700; color:#FFFFFF; font-size:14px;}

#menuswitch{display:none;}

@media (max-height:900px) {
	#header #logo{margin-top:0px;}
	#about, #contact{padding-top:27px;}
}

@media (max-height:800px) {
	#navCon{display:none;}
}

@media (max-height:750px) {
	#footer{display:none;}
}

@media (max-width:680px) {
	#about{width:60%;}
	#contact{width:60%;}
}

@media (max-width:500px), (max-height:700px) {
	body{background:#ff6b00; border-color:#ff6b00;}
	#header{position:relative; width:100%; padding-top:0px; text-align:left; border-bottom:none;}
	#header #logo{margin:0px; float:left; padding-right:30px;}
	#header #logo img{/*width:75px;*/ max-height:208px;}
	ul.navs{margin-top:10px; text-align:left;}
	ul.navs li{padding:5px 0px;}
	.aboutLink, .aboutImg, .hideMe{display:none !important;}
	.contactLink, .contactImg, .hideMe{display:none !important;}
	.homeSlider{display:none;}
	#content{clear: both; margin-top: 40px; margin-left:17px;}
	#about{position:relative; width:100%; right:0; padding:0px; -webkit-transition: none; /* Safari */
	transition: none; border-bottom:none;}
	#contact{position:relative; width:100%; right:0; padding:0px; -webkit-transition: none; /* Safari */
	transition: none; border-bottom:none;}
	#footer{position:relative; width:calc(100% - 17px); margin-left:17px; text-align:left; display:inherit;}
	#navCon{display:inherit;}
}