/*=== Reset and Multi-Browser Consistency ===*/
html, body, section, footer, figure, span, h1, h2, p, a {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	vertical-align:baseline;
	background:transparent;
}
section, footer, figure {display:block;}
a {text-decoration:none;}
img {border:none !important;}
/*=== General Styles ===*/
* {
	font-family:'Open Sans', sans-serif;
}
html {
	height:100%;
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust:100%;
    font-size:14px;
	-o-transition:all .33s;
	-moz-transition:all .33s;
	-webkit-transition:all .33s;
	transition:all .33s;
}
@media screen and (min-width: 200px){html {font-size:11px;}}
@media screen and (min-width: 460px){html {font-size:12px;}}
@media screen and (min-width: 500px){html {font-size:12px;}}
@media screen and (min-width: 570px){html {font-size:13px;}}
@media screen and (min-width: 620px){html {font-size:13px;}}
@media screen and (min-width: 680px){html {font-size:13px;}}
@media screen and (min-width: 720px){html {font-size:14px;}}
@media screen and (min-width: 800px){html {font-size:14px;}}
@media screen and (min-width: 860px){html {font-size:14px;}}
@media screen and (min-width: 920px){html {font-size:14px;}}
@media screen and (min-width: 1000px){html {font-size:14px;}}
@media screen and (min-width: 1100px){html {font-size:14px;}}
@media screen and (min-width: 1200px){html {font-size:14px;}}
@media screen and (min-width: 1300px){html {font-size:14px;}}




body {
	min-height:100%;
	font-size:1rem;
	line-height:1rem;
	margin:0 auto;
	background:#FFF
}
.unseen {display:none;}
h1 {
	position:fixed;
	top:0;
	left:0;
	width:50%;
	height:100%;
	margin:0;
	text-align:center;
	font-size:4rem;
	line-height:4.25rem;
	color:#FFF;
	text-indent:-1000rem;
	background:#f6f6f6 url('../img/homeofdesign_logo.jpg') no-repeat center center / 80%;
}
h1 small {
	display:block;
	font-size:1.5rem;
	line-height:1.625rem;
	margin-bottom:1.5rem;
	color:rgba(255,255,255,.66)
}
section {
	position:fixed;
	top:0;
	left:50%;
	width:35%;
	height:75%/*70% 66.664%*/;
	padding:/*11.668% 15%*/12.5% 10% /*21.668% 15%*/12.5% 5%;
	background:#121212
}
section h2 {
	font-size:4rem;
	line-height:3.875rem;
	color:#FFFFFF;
	font-weight:900;
	text-transform:uppercase
}
section h3 {
	font-size:1.429rem;
	line-height:1.5rem;
	margin-bottom:2.286rem;
	letter-spacing:.214rem;
	color:#FFFFFF;
	font-weight:600;
	text-transform:uppercase
}
section p {
	font-size:1rem;
	line-height:1.5rem;
	margin-bottom:2.714rem;
	color:#FFFFFF;
	font-weight:400
}
section p span {
	display:block;
	margin-bottom:1.75rem
}
section p span:nth-of-type(3) {margin-bottom:.75rem !important}
section a {
	display:inline-block;
	font-size:1.15rem;
}
section a:link, section a:visited {
	color:#ffffff;
	opacity:.66;
	-o-transition:opacity .33s linear;
	-webkit-transition:opacity .33s linear;
	-moz-transition:opacity .33s linear;
	transition:opacity .33s linear;
}
section a:hover {
	opacity:1;
}
section a.social {
	font-size:2rem;
	width:2rem;
	height:2rem;
	padding:1rem;
	margin-right:.5rem;
	border-radius:100%;	
	opacity:1;
	border:5px solid #121212;
	-o-transition:border .33s linear;
	-webkit-transition:border .33s linear;
	-moz-transition:border .33s linear;
	transition:border .33s linear;

}
section a.social:hover {
	border:5px solid #ffffff;
}

section a.social i {
	color:#ffffff;
	margin-left:.15rem;
}
section a.social:nth-of-type(1) i {margin-left:.525rem;}
footer {
	position:fixed;
	bottom:0;
	left:0;
	width:98%;
	height:auto;
	padding:1%;
	font-size:12px;
	line-height:14px;
	font-weight:100;
	text-align:right;
	color:rgba(255,255,255,.66);
}
footer a:link, footer a:visited {
	color:#FFF;
	text-shadow:none;
	-o-transition:color .33s;
	-moz-transition:color .33s;
	-webkit-transition:color .33s;
	transition:color .33s;
}
footer a:hover {
	color:#00adef;
	text-shadow:3px 6px 3px rgb(255, 255, 255, .5);
}

@media screen and (max-width: 1366px) {
	section {
		height:87%;
		padding:6.5% 10% 5% 6.5%;
		background:#121212
	}
	section h2 {
		font-size:3rem;
		line-height:2.875rem;
	}
	section h3 {
		font-size:1.175rem;
		line-height:1.8rem;
		margin-bottom:1.875rem;
	}
	section p {
		font-size:.925rem;
		line-height:1.325rem;
		margin-bottom:2.125rem;
	}
}
@media screen and (max-width: 1023px) {
	h1 {
		position:relative;
		width:100%;
		height:24rem;
		height:50vh;
		background:#f6f6f6 url('../img/homeofdesign_logo.jpg') no-repeat center center / 80%;
	}
	section {
		position:relative;
		width:80%;
		left:0;
		height:auto;
		padding:16.6665% 10%;
	}
	footer {position:relative;background-color:#ffffff;text-align:center;}
	footer, footer a:link, footer a:visited {color:#000;}
	footer a:hover {
		color:#00adef;
		text-shadow:3px 6px 3px rgb(255, 255, 255, .5);
	}
}