@charset "utf-8";
/* CSS Document */

/*~~~~~~~~~~~~~~~~~~ layout related ~~~~~~~~~~~~~~~*/
#header_container {
	width:1024px;
	margin:0 auto;
}
#logo {
	float:left;
	margin-left:30px;
}
#ftr_container {
	max-width:1024px;
	margin:0 auto;
}
#ftr_logo {
	float:right;
	margin-right:20px;
}
.label {
	font-weight:bold;
	font-size:11px;
	text-transform:uppercase;
	width:150px;
	display:inline-block;
	*display:inline;
	margin:5px 0 0;
}
.data {
	display:inline-block;
	*display:inline;
	width:150px;
	margin-left:15px;
	font-size:12px;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~ header navigation styles ~~~~~~~~~~~~~~~~~~~~~~~~*/
#hdr_nav {
	float:right;
	width:628px;
/*	position: absolute;
    right: 285px;
    top: 0;*/
}
/*Safari
@media screen and (-webkit-min-device-pixel-ratio:0){
#hdr_nav {margin-top:-111px;}
}*/
#top_icons {
	float:right;
	list-style:none;
	margin-right:20px;
	margin-top:10px;
}
#top_icons li {
	display:inline-block;
	padding:0 3px 0 0;
}

#home {
	background-position:0 -83px;
	background-repeat:no-repeat;
	height:22px;
	width:22px;
}
#home:hover {
	background-position:0 -108px;
}
#blog {
	background-position: 0 -132px;
	background-repeat:no-repeat;
	height:22px;
	width:31px;
}
#blog:hover {
	background-position:0 -159px;
}
#primary_nav {
	list-style: url(../images/top_nav_dot.png) outside;
	font-family:LithosProRegular;
	font-size:12px;
	text-transform:uppercase;
	color:#fff;
	margin-right:16px;
	margin-top:10px;
	font-weight:normal;
	text-align: right;
}
#primary_nav li {
	background:url(../images/top_nav_dot.png) center left no-repeat transparent;
	display:inline-block;
	margin:0 8px 0 0;
	padding: 0 0 0 16px;
	position:relative;
}
#primary_nav li:first-child {
	background:none;
	padding:0;
}
#primary_nav li a {
	color:#fff;
	text-decoration:none;
}
#primary_nav li a:hover {
	text-decoration:none;
}
#primary_nav li div.on_ind {
	color:046ff7;
	background:url(../images/secondary_pg_ind_small.png) 0 0 no-repeat transparent;
	visibility:visible !important;
}
#primary_nav li div {	
	position: absolute;
	visibility: hidden;
	background:url(../images/page_ind_small.png) 0 0 no-repeat transparent;
	padding: 5px;
	height:22px;
	width:16px;
	z-index:99;
	top: 18px;
	}

@-moz-document url-prefix() {#primary_nav li div {	top: 17px; } }
#menu_ind0 {margin-left:70px;}
#menu_ind1 {margin-left:65px;}
#menu_ind2 {margin-left:25px;}
#menu_ind3 {margin-left:15px;}
#menu_ind4 {margin-left:25px;}
#tagline {
	font-family:LithosProRegular;
	font-size:22px;
	color:#a4a4a5;
	text-transform:uppercase;
	margin-top:20px;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ footer navigation styles ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
#ftr_nav {
	float:left;
}
#internal_nav {
	display:inline-block;
	color:#fff;
	font-size:10px;
	font-weight:600;
	margin-top:0px;
	margin-left:15px;
	float:left;
	line-height:12px;
	letter-spacing: 0.15em;
}
#internal_nav li {
	background:url(../images/top_nav_dot.png) center left no-repeat transparent;
	color:#fff;
	display:inline-block;
	margin:40px 5px 0 0;
	padding:0 0 0 13px;
}
#internal_nav li:first-child {
	background:none;
	padding:0;
}
#internal_nav li a {
	color:#fff;
	text-decoration:none;
}
#internal_nav a:hover {
	text-decoration:underline;
}
#social_media {
	display:inline-block;
	margin:40px 5px 0 25px;
	float:right;
}
#social_media li {
	list-style:none;
	display:inline-block;
	margin:0 5px 0 5px;
}
#facebook {
	background-position:0 0;
	background-repeat:no-repeat;
	height:26px;
	width:26px;

}
#facebook:hover {
	background-position:-27px 0;
}
#twitter {
	background-position:0 -53px;
	background-repeat:no-repeat;
	height:26px;
	width:26px;

}
#twitter:hover {
	background-position:-27px -53px;
}
#google {
	background-position:0 -26px;
	background-repeat:no-repeat;
	height:26px;
	width:26px;	

}
#google:hover {
	background-position:-27px -26px;
}
#copyright {
	color:#fff;
	font-weight: 600;
    margin-top: -10px;
	font-size:9px;
	float:left;
	margin-left:15px;
	line-height:11px;
	letter-spacing: 0.15em;
}
#bio {
	background-position:0 -194px;
	width:34px;
	height:42px;
	display:inline-block;
	*display:inline;
	margin-right:5px;
	margin-top:8px;
}
#resume {
	background-position:0 -248px;
	width:32px;
	height:42px;
	margin-right:5px;
	display:inline-block;
	*display:inline;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ banner styling ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~`*/
#banner1 {left:15px !important; text-align:left; color:#33383e; width:900px; top: 162px !important;}
#banner1 div.royalCaptionItem {width: 100%;text-align:left;color:#fff;text-shadow:0px 0px 8px #046ff7;}
#banner1 div.sgMidText {margin-top:23px !important; width: 100%;color:#fff;text-transform:lowercase;text-shadow:1px 1px 3px #000;font-weight:normal;}
#banner1 div.sgSmallText {top:15px !important; left: 800px !important;}

#banner2 {top:155px !important; color:#0571fa;width:883px;}
#banner2 div.royalCaptionItem {width: 100%;text-shadow:0px 1px 10px #000;text-align:right;}
#banner2 div.sgMidText {top:30px !important; width:100%;text-transform:lowercase;font-weight:normal;text-shadow:0px 1px 10px #000;text-align:right;}
#banner2 div.sgSmallText {top:25px !important; left: -795px !important;}

#banner3 {left:15px !important; top:155px !important; width:800px; color: #fff;}
#banner3 div.royalCaptionItem {text-shadow:0px 1px 10px #000;}
#banner3 div.sgMidText {top: 28px !important;text-transform:lowercase;font-weight:normal;text-shadow:0px 1px 10px #000;}
#banner3 div.sgSmallText {top:25px !important; left:700px !important;}

#banner4 {left:-10px !important; text-align:left; color:#33383e; width:900px; top: 137px !important;}
#banner4 div.royalCaptionItem {width: 100%;text-align:center;color:#0571fa;text-shadow:0px 1px 5px #000;}
#banner4 div.sgMidText {top:23px !important; width: 100%;color:#0571fa;text-transform:lowercase;text-shadow:0px 1px 2px #000;font-weight:normal;text-align:center;}
#banner4 div.sgSmallText {top:45px !important; left: 407px !important;}

#banner5 {left:10% !important; top:155px !important; width:800px; color: #fff; text-align:center;}
#banner5 div.royalCaptionItem {left: 0px !important; width: 100%;text-align:right;}
#banner5 div.sgMidText {left:0px !important; top: 20px !important; width: 100%;font-weight:normal;text-transform:lowercase;text-align:right;}
#banner5 div.sgSmallText {top:25px !important; left: -600px !important;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ home page styling ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#self_portrait {
	float:right;
    margin-bottom: 10px;
    margin-right: -5px;
    margin-top: 10px;
	
}
#self_portrait img {
	border:1px solid #8a8b8b;
	border-radius:5px;
}
#article_content {
	margin-left:2px;
	float:left;
	width:60%;
}
#skills {
	padding:0 0 0 10px;
}
#web_dev {
	width:35%;
	float:right;
}
#fine_art {
	width:60%;
	float:left;
}
#contact_info {
	width:35%;float:right;
}
#web_design {
	width:60%;float:left;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ resume styling ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
#left_rail {
	float:left;
	margin-right:10px;
	width:57%;
}
#left_rail li {
	margin-left:1em;
}
#right_rail {
	float:right;
	width:40%;
}
#right_rail li {
	margin-left:1em;
}
.titles {
	text-transform:uppercase;
	font-weight:bold;
	font-size:1.4em;
}
.additional_info {
	display:none;
}
.additional_info li {
	margin-left:1em;
}
.closed div {
	background:url(../images/closed_icon.png) 0 0 no-repeat transparent;
	width:15px;
	height:16px;
	margin-right:5px;
	display:inline-block;
	*display:inline;
}
.open div {
	background:url(../images/open_icon.png) 0 0 no-repeat transparent;
}
.experience p span.titles {
	font-size:1.1em;
	font-weight:bold;
	text-transform:uppercase;
}
.experience .expand {
	font-size:1.2em;
	font-weight:bold;
	display:inline-block;
	*display:inline;
}
.institution {
	font-size:1.1em;
	font-weight:bold;
	text-transform:uppercase;
}
.min_resume {
	background:url(../images/min_resume_icon.png) 0 0 no-repeat transparent;
	width:34px;
	height:43px;
	display:inline-block;
	*display:inline;
	margin-right:5px;
	float:left;
}
.color_code {
	background-image:url(../images/color_guide.png);
}
.code {
	background-position:0 -106px;
	background-repeat:no-repeat;
	width:49px;
	height:37px;
	margin-right:7px;
	display:inline-block;
	*display:inline;
}
.fine_art {
	background-position:0 -53px;
	background-repeat:no-repeat;
	width:49px;
	height:37px;
	margin-right:7px;
	display:inline-block;
	*display:inline;
}
.interactive-media {
	background-position:0 0;
	background-repeat:no-repeat;
	width:49px;
	height:37px;
	margin-right:7px;
	display:inline-block;
	*display:inline;
}
.design {
	background-position:0 -159px;
	background-repeat:no-repeat;
	width:49px;
	height:37px;
	margin-right:7px;
	float:left;
}
.graph_key {
	list-style:none;
	margin:3px 0;
	display:block;
	text-transform:uppercase;
	vertical-align:middle;
	font-size:1.4em;
}
.middle_align {
	margin-top:15px;
	float:right;
}
.dotted_border {
	clear:both;
	height:5px;
	border-bottom:1px dotted #666;
	margin-bottom:5px;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ category styling ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.cat_img {width:376px;margin:15px 10px 15px 0;border:1px solid #8A8B8B;border-radius:8px;}
.cat_content {width:500px;}
.gallery_link {float:right;margin-right:5px;margin-bottom:10px;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ multimedia styling ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
video, embed {border:1px solid #000;box-shadow:0px 1px 5px rgba(0,0,0,0.5);}
#video_container {margin:15px auto;text-align:center;}
#format_options {
	margin:5px auto;
}
#format_options li {
	list-style:none;
	display:inline-block;
	*display:inline;
	padding:0 5px;
}
#chrome {
	background:url(../images/chrome_logo.png) 0 0 no-repeat transparent;
	height:25px;
	width:25px;
	display:inline-block;
	*display:inline;
	margin-right:5px;
}
#quicktime {
	background:url(../images/quicktime_logo.png) 0 0 no-repeat transparent;
	height:25px;
	width:25px;
	display:inline-block;
	*display:inline;
	margin-right:5px;
}
#download {
	background:url(../images/download_logo.png) 0 0 no-repeat transparent;
	height:25px;
	width:25px;
	display:inline-block;
	*display:block;
	margin-right:5px;
}
#format_options li a {
	display:inline-block;
	*display:inline;
	padding:5px;
	vertical-align: middle;
	margin-top: -20px;
	text-decoration:none;
	border-radius:7px;
	border:1px solid #fff;
	color:#046ff7;
	text-transform:uppercase;
	letter-spacing:0.2em;
}
#format_options li a:hover {
	background:#999;
	border:1px solid #666;
	box-shadow:inset 1px 1px 3px rgba(0,0,0,0.3);
	color:#fff;
}