/************************************************

  >>    CSS Framework:   a2designer 
  >>       Created By:   Nathan Olmstead
  >>    Latest Update:   3/23/10
  >>          Website:   http://a2designer.com

*************************************************/

/*>>   Screen Styles   
*/

@media screen {

	/***  Universal Selectors */
	
	html, body { font: 14px/1.4 'ComfortaaThin', Trebuchet MS, verdana, geneva, lucidia, arial, sans-serif; margin: 0; padding: 0; }
	body { background: #000 url(images/bg.jpg) center; color: #fff; letter-spacing: 1.2px; font-weight: 100; }
	h1, h2, h3, h4, h5, ul, ol, li, form, table { margin: 0; padding: 0; }
	ul { list-style: none; }
	img { border: 0; }
	h1 { margin: 18px 0 5px 0; }
	h1 a { background: url(images/logo.gif) 0 -79px no-repeat; width: 140px; height: 79px; display: block; }
	h1,  h1 a:focus, h1 a:hover { float: left; width: 140px; height: 79px; background: url(images/logo.gif) 0 0 no-repeat; text-indent: -9999px; overflow: hidden; }
	
	/***  Structure  */
	
	#container { margin: 0 auto; width: 940px; }
	
	#header { background: #000 url(images/border.gif) bottom repeat-x; }
	#contact { float: right; width: 131px; height: 52px; margin: 40px 0 0 0; text-indent: -9999px; overflow: hidden; }
	#contact a { width: 131px; height: 52px; background: url(images/contact.gif) 0 -52px no-repeat; display: block; }
	#contact a:hover, #conatact a:focus { background: url(images/contact.gif) 0 0 no-repeat; }
	
	#main-content { width: 620px; margin: 0 20px 0 0; float: left; }
	.intro { font-size: 22px; margin: 0 0 40px 0; }
	.home { background: url(images/border.gif) bottom repeat-x; padding: 40px 0 50px 0; }
	.intro strong, .intro accronym { font-size: 24px; }
	
	#bio { width: 324px; float: left; margin: 0 76px 0 0; position: relative; }
	.about { width: 220px; margin: 5px 0 0 69px; padding: 0 0 0 10px; font-weight: 100; }
	.about a { display: block; font-size: 12px; padding: 15px 0 0 0; }	
	.brief { position: absolute; top: 0; left: 0; margin: 0; padding: 0; font-size: 30px; }
	.bio { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); position: absolute; top: 24px; left: -30px; font-size: 90px; margin: 0; padding: 0; }
	.bio { writing-mode: tb-rl; }
	
	#download { width: 220px; float: left; position: relative; }
	.vcf { background: url(images/vcard.jpg) no-repeat; width: 220px; height: 60px; text-align: center; padding: 8px 0 0 0; margin: 85px 0 0 0; }
	.vcf a { text-decoration: none; font-size: 30px; line-height: 1; width: 220px; height: 60px; display: block; }
	.vcf a:hover, .vcard a:focus { color: #5a0101; }
	.vcf a span { font-size: 14px; display: block; }
	.down { -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); position: absolute; top: 22px; left: -20px; font-size: 26px; margin: 0; padding: 0; }
	.down { writing-mode: tb-lr; }
	.load { position: absolute; top: 40px; left: 17px; font-size: 88px; margin: 0; padding: 0; line-height: 0; letter-spacing: 6px; }
	
	#latest-work { margin: 40px 0 60px 0; letter-spacing: -1px; }
	#latest-work h3 { font-weight: normal; font-size: 24px; margin: 0 0 10px 0; }
	
	/******* Sub Page Styling *********/
	.sub-heading { margin: 40px 0 0 0; letter-spacing: 5px; font-size: 24px; }
	.blog-heading { padding: 0 0 30px 0; float: left; width: 200px; }
	
	.work-info { margin: -6px 0 0 0; padding: 8px 10px; background: #1d1d1d; }
	.work-info span { float: right; }
	.keyword { float: right; margin: 0 0 30px 0; padding: 6px 10px; background: #1d1d1d; }
	#container .work-social { height: 1536px; }
	
	.about-page .vcard { margin: 0 0 30px 0; }
	.vheading { font-style: normal; letter-spacing: 10px; }
	.box { float: left; width: 310px; height: 228px; }
	.box p, .org { font-size: 16px; letter-spacing: 2px; font-weight: bold; margin: 0; display: block; }
	.hresume { background: url(images/microformat.gif) right 300px no-repeat; }
	#container .about-social, #container .about-page { height: 1575px; }
	
	/******* Social Column *******/
	#social-bar { width: 270px; padding: 0 10px 10px 10px; float: left; margin: 40px 0 0 0; background: #1d1d1d; font-size: 12px; position: relative; }
	#social-bar h2 { font-size: 20px; font-weight: normal; padding: 0 10px 0 0; width: 260px; letter-spacing: -1px; }
	#social-bar h2 span { font-weight: bold; }
	#social-bar li ul li { padding: 5px 0; }
	#social-bar p { margin: 0; padding: 10px 0 20px 0; }
	
	/***** Social Buttons *******/
	#twitters_div .profile-link a, #twitterstreamwidget-4 .profile-link a, #rss-feed a, #follow-buzz a
	{ width: 118px; height: 25px; display: block; padding: 8px 0 0 39px; text-decoration: none; }
	#twitter_div .profile-link a, #twitterstreamwidget-4 .profile-link a { background: url(images/twitter-button.gif) 0 -33px no-repeat; }
	#twitterstreamwidget-3 .profile-link a:hover, #twitterstreamwidget-4 .profile-link a:hover { background: url(images/twitter-button.gif) 0 0 no-repeat; }
	#rss-feed a { background: url(images/rss-button.gif) 0 -33px no-repeat; margin: 0; }
	#rss-feed a:hover { background: url(images/rss-button.gif) 0 0 no-repeat; }
	#follow-buzz a { background: url(images/buzz-button.gif) 0 -33px no-repeat; margin: 20px 0 0 0; }
	#follow-buzz a:hover { background: url(images/buzz-button.gif) 0 0 no-repeat; }
	
	#twitter_div { background: url(images/larget.gif) right no-repeat; height: 181px; }
	#twitter_div h2 { padding: 10px 10px 10px 0; }
	
	li#recent-posts-2 { background: url(images/largerss.gif) bottom right no-repeat; padding: 0 0 50px 0; height: 200px; }
	#recent-posts-2 h2, #categories-3 h2 { padding: 35px 10px 7px 0; background: url(images/border.gif) top repeat-x; }
	#categories-3 { margin: 0 0 20px 0; }
	
	#rss-feed { position: absolute; top: 371px; }
	#rss-blog { margin: 0; padding: 0; }
	#rss-blog a { position: absolute; top: 0; right: 0; width: 114px; height: 113px; margin: 40px 0 0 0;  background: url(images/rss-main.jpg) 0 0 no-repeat; text-indent: -9999px; overflow: hidden; }
	#main-content.blog { position: relative; }
	
	#buzz { background: url(images/largegoogle.gif) bottom right no-repeat; }
	#buzz h2 { padding: 35px 10px 7px 0; }
	
	p#linkedIn { line-height: 1; padding: 30px 10px; background: #1d1d1d; width: 270px; margin: 0 0 0 -10px; }
	#linkedIn strong { display: block; font-size: 30px; }
	#linkedIn a { background: url(images/linkedin.gif) 0 0 no-repeat; width: 275px; height: 54px; display: block; text-align: center; text-decoration: none; padding: 15px 0 0 10px; }
	#linkedIn a:hover, #linkedIn a:focus { background: url(images/linkedin.gif) 0 -70px no-repeat; }
	
	#footer { background: #1d1d1d url(images/a2-footer.gif) top left no-repeat; padding: 10px 0 60px 0; }
	#footer p { margin: 0 0 5px 0; padding: 0; font-size: 13px; }
	#footer ul { font-size: 11px; margin: 0; }
	#footer li { padding: 4px 0; }
	#footer div { width: 140px; float: left; }
	p#copyright { font-size: 9px; text-align: right; padding: 0 10px 0 0; }
	#copyright span {display: block; }
	
	#singlenav { margin: 10px 0 30px 0; }
	#singlenav div { border: 1px solid #333; padding: 5px; }
	.categories a { background: #3d3d3d; padding: 3px; text-decoration: none; }
	.categories a:hover { text-decoration: underline; }
	.post { margin: 10px 0 40px 0; }
	#respond { margin: 0 0 40px 0; }
	.postheading { margin: 20px 0 0 0; }
	#thetitle { width: 400px; font-size: 26px; }
	.date { width: 150px; }
	
	.ddsg-wrapper { padding: 0 0 65px 0; }
	.ddsg-wrapper li { margin: 5px 0; }
	.ddsg-wrapper h2 { margin: 20px 0 0 0; }
	.ddsg-wrapper ul ul { margin: 15px 0 0 0; }
	.ddsg-wrapper p { display: none; }
	.ddsg-wrapper strong { background: #3d3d3d; padding: 3px; }
	
	
	.spacad { margin: 0 0 30px 0; }
	
	/********  Blog Posts Styles ********/
	.blog strong { font-weight: bold; font-size: 18px; }
	
	
	/*** Navigation  */
	
	#main-navigation { float: left; width: 456px; text-align: center; font-size: 20px; margin: 45px 0 0 120px; }
	#main-navigation li { color: #fff; float: left; text-transform: uppercase; width: 108px; height: 30px; background: url(images/nav-border.gif) 0 0 no-repeat; }
	#main-navigation a { background: url(images/nav-border.gif) 0 -30px no-repeat; width: 108px; height: 30px; display: block; }
	#main-navigation a:focus, #main-navigation a:hover { color: #fff; background: url(images/nav-border.gif) 0 0 no-repeat; }
	
	#footer-navigation { margin: 0 20px 0 80px; }
	
	
	/**  Links  */
	
	a { color: #fff; }
	a:hover { text-decoration: none; }
	a:focus { text-decoration: none; }
	
	#main-navigation a { text-decoration: none; }
	#main-nav a:visited { color: #fff; }
	
	#footer-nav { color: #888; }
	#footer a { text-decoration: none; color: #fff; }
	#footer a:hover, #footer a:focus { text-decoration: underline; color: #fff; }	
	
	
	/**  Misc.  */
	
	.fr { float: right; }
	.fl { float: left; }
	
	.border-top { background: url(images/border.gif) top repeat-x; }
	
	.contrast { color: #5a0101; font-weight: bold; }
	
	.screen-only { display: none; }
	
	.clear { clear: both; }
	
	.clearfix:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}
	
	#skip-nav, #anchor-navigation { position: absolute; top: -9999px; }

} /* End Screen Style */


/*>>   Print Styles   
*/

@media print {

	html, body { font: 12pt/1.3 georgia, serif; margin: 0; padding: 0; }
	h1, h2 { margin: 0; padding: 0; font-weight: normal; }
	h1 { font-size: 16pt; }
	h2 { font-size: 14pt; }
	
	.hide-print { display: none; }


} /* End Screen Style */


/*>>   Handheld Styles   
*/

@media handheld {

	html, body { font: 100%/1.3 verdana, geneva, lucidia, arial, sans-serif; margin: 0; padding: 0; }
	h1, h2 { margin: 0; padding: 0; }
	h2 { font-weight: normal; }
	
	.hide-handheld { display: none; }

} /* End Handheld Style */
