html {
	height: 100%; margin:0; padding: 0;  font-family: verdana;
}
body {
    font: 16px/26px 'Open Sans', Helvetica, Helvetica Neue, Arial; height:100%; margin:0; padding: 0;
}

strong, h2, h3, h4 { font-size: 1.2em;  font-family: 'Patrick Hand SC', verdana;  }
h2 { font-size: 3em; }
h3 { font-size: 2em; }
::selection 					{ background: #505d2f; color: white; /* Safari */ }
::-moz-selection  				{ background: #505d2f; color: white; /* Firefox */ }

a:link, a:visited, a:active 	{ color: #dd8c37; text-decoration:none; }
a:hover 						{ color: #505d2f; text-decoration:none; }
a.external-link 				{ background: url("/img/external-link.gif") no-repeat scroll right center transparent;	
    							  padding-right: 12px;  }

.wrapper {
    width: 90%;
    margin: 0 5%;
}

#page { height: 100%; }

#bg { width: 100%; height: 100%; overflow: hidden; }
#bg { position: fixed; }
.bg { width: 100%; margin: -5.5% 0 0 0; }
#bg > div { z-index: 1; position: absolute; left: 10%; top: 0; color: #eee; font-family: 'Indie Flower', verdana; width: 80%; }
#bg h1 { font-size: 2.5em; margin: 1.5em; float: left; }
#bg .connect { float: right; text-align: right; margin: 1em; }
#bg .connect .title { text-align: left; }
#bg .connect a { display: inline-block; width: 48px; height: 48px; margin-left: 5px; text-decoration: none;}
#bg .connect .facebook { background: url(/img/social/social-fb.png) 0 0 no-repeat; }
#bg .connect .gplus { background: url(/img/social/social-googleplus.png) 0 0 no-repeat; }
#bg .connect .twitter { background: url(/img/social/social-tw.png) 0 0 no-repeat; }
#bg .connect .linkedin { background: url(/img/social/social-linkedin.png) 0 0 no-repeat; }

#head { 
	height: 2em; width: 80%; top: 70%; left: 10%; 
	position: absolute; margin: 0 auto; z-index: 2;
	background-color: black; color: #ddd; 
	font-family: 'Indie Flower', verdana; font-size:1.5em;
}
#head .title { margin-top:.6em; margin-left: 2em; display: inline-block; cursor: default; }
#head .menu { float: right; margin-top:.6em; }
#head .menu ul { margin: 0; cursor: default;  }
#head .menu li { display:inline-block; margin-left: 1em; cursor: default; }
#head .menu li:last-child { margin-right: 3em; }

#logo { overflow: hidden; height: 60%; }

#body { 
	background-color: white; position: absolute; 
	top: calc(70% + 3em); left: 10%; margin: 0 auto; width: 80%; min-height: 22.5%;
	padding: 1em 3em; box-sizing: border-box; 
}
#body .skills { font-family: 'Patrick Hand SC', 'Open Sans', verdana;  }
#body .skills span { padding: 1em; font-family: 'Patrick Hand SC', 'Open Sans', verdana; }
#body .skills span:not([data-type=language]) { display: none;  }
#body .skills .stars3 { font-size: 1.1em;}
#body .skills .stars4 { font-size: 1.2em;}
#body .skills .stars5 { font-size: 1.3em; }

#body .content { width: 60%; display: inline-block; }

#twitter { float: right; display: inline-block;}
#twitter #twitter_update_list {
	background: url(/img/social/bk_twitter_box_top.png) 0 0 no-repeat;
	padding: 3px 15px 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	font-style: italic;
	line-height: 125%;
	color: #666;
	padding-top: 1.2em;
}

#twitter #bottom {
	height: 36px;
	background: url(/img/social/bk_twitter_box_bottom.png) 0 0 no-repeat;
	padding-left: 63px;
	padding-top: 45px;
	font-weight: bold;
}

#twitter iframe {
	width: 244px;
}