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

/* - - - - - - - - - - - - - - - - - - - - -

Title : Russell Hampton's Design Portfolio
Author : Russell Hampton
URL : http://www.russellhampton.net
Created : 02/01/10

- - - - - - - - - - - - - - - - - - - - - */
/*HHHHHHHHHHHHHHHH[  NAVIGATION  ]HHHHHHHHHHHHHHHH*/
#nav ul {float: right;}
#nav li {display: inline;}
#nav li a {color: #000; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; float: left; text-align: center; font-size: 14px; padding: 40px 20px 0px 24px;}
#nav li a:hover {padding-top: 40px; color: #2262AE;}
#nav li a:hover.current {color: #2262AE; border: none; padding: 40px 20px 0px 24px; text-shadow: none;}
#logo {width: 100px; margin-top:25px;text-align: left;float:left;padding-bottom:10px;}
.header-bg {background-image:url(/images/header_repeat_1.jpg);background-repeat:repeat-x;background-position:top;color: #0D1823;}

/*HHHHHHHHHHHHHHHH[  COPY AND HEADER STYLES  ]HHHHHHHHHHHHHHHH*/
body {text-align: center; color:#333333; background-attachment: scroll; background-color: transparent; background-repeat: no-repeat; background-position: center 360px; font: 62.5%/1.5 Arial, Helvetica, sans-serif;}
.body-bg { background-image: url(/images/bg_shadows.jpg); height:685px; background-position:top;  }
p {font-size:1em; line-height: 1.5em; margin:0px;color:#000 } a { color: #666; text-decoration: none; }
h1 { font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 10px; margin-bottom:10px; margin-top:5px; color:#000 }
h1 a { color: #000000; text-decoration: none; }
h1 a hover { color: #990000; text-decoration: none; }
h1 a visited { color: #000000; text-decoration: none; }
h2 { font-family: Arial, Helvetica, sans-serif;  font-size: 12px; padding-left:43px; margin-top:5px; color:#000; }
h2 a { font-family: Arial, Helvetica, sans-serif;  font-size: 12px; margin-top:5px; }
h2 a:hover { color:#2262AE; }
h3 { font-family: Arial, Helvetica, sans-serif;  font-size: 16px; margin-top:0px; margin-bottom:10px; color:#000  }
h4 { font-family: Arial, Helvetica, sans-serif;  font-size: 16px; color:#009; margin-bottom:0px; color:#000 }
h5 { font-family: Arial, Helvetica, sans-serif; font-weight:400;  font-size: 12px;  margin-bottom:0px;color:#000  }
h6 { font-family: Arial, Helvetica, sans-serif; font-weight:1000;  font-size: 80px;  margin-bottom:0px; color:#000  }
h7 { font-family: Arial, Helvetica, sans-serif; font-weight: 600;  font-size: 20px; text-transform:uppercase; color:#FFF; letter-spacing: 1px; }
h8 { font-family: Arial, Helvetica, sans-serif; font-weight: 200;  font-size: 14px; color:#CCC; line-height: 1.5em;  }
h9 { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color:#000; line-height: 1.5em;  }
h11 { font-family: Arial, Helvetica, sans-serif; font-size: 10px; color:#000; line-height: 1.5em;  }
h12 { font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 700; color:#000; line-height: 1.5em;  }
h12 a { font-family: Arial, Helvetica, sans-serif;  font-size: 16px; font-weight: 700; margin-top:5px; }
h12 a:hover { color:#2262AE; }
h13 { font-family: Arial, Helvetica, sans-serif; font-size: 20px; color:#000; font-weight: 700; line-height: 1.5em; text-transform:uppercase;  }
h14 { font-family: Arial, Helvetica, sans-serif; font-size: 30px; color:#000; font-weight: 700; line-height: 1.5em; text-transform:uppercase;  }
h15 { font-family: Arial, Helvetica, sans-serif; font-size: 18px; color:#000;  line-height: 1.5em;  }
hr {margin-top:10px; margin-bottom:10px; width:100%;}
.blockquote { font-size:15px; margin:22px 30px; color:#575757; padding: 0 50px; background: transparent url("/images/blockquote.gif") no-repeat 0 0; font-family:"MS Serif", "New York", serif;}

/*HHHHHHHHHHHHHHHH[  PAGE LAYOUT STYLES  ]HHHHHHHHHHHHHHHH*/
#container {margin: 0 auto; text-align: left; width: 960px;}
#container_footer_highlight {margin: 0 auto; text-align: left; width: 960px; height:145px;clear:both; background-image:url(/images/footershadow.gif); background-repeat:no-repeat;}
#content {float: left; clear: both; width: 960px; margin-top:45px;}
#slides {position: relative; z-index: 3; left: 0px; top: 0px; overflow: hidden; background-color: #000; height: 408px;}

/*HHHHHHHHHHHHHHHH[  HEADERS  ]HHHHHHHHHHHHHHHH*/
.header_about {width:960px; float:left; margin-bottom:15px; background-image:url(/images/header_aboutme.png); background-repeat:no-repeat;}
.header_news {width:960px;float:left;margin-bottom:15px;background-image:url(/images/header_news.png);background-repeat:no-repeat;}
.header_portfolio {width:960px;height:110px;background-image:url(/images/header_portfolio.png);background-repeat:no-repeat;clear:both;}
.header_contact {width:960px; float:left; margin-bottom:15px; background-image:url(/images/header_contact.png); background-repeat:no-repeat;}
.header_personal {width:960px;height:110px;background-image:url(/images/header_personal.png);background-repeat:no-repeat;}	
.project_types {text-align:left;}
.project_types a:hover{ color:#2262AE;}

/*HHHHHHHHHHHHHHHH[ VIEW PROJECT LISTS ]HHHHHHHHHHHHHHHH*/
#view_project {clear:both; background:url(/images/divider_blue.png); background-repeat:repeat-x; width:270px; padding-top:10px; margin-top:15px;}
#view_project a{color: #fff; font-size:12px; }
#view_project h1 { font-size: 1em; color: #fff; color: padding-left: 4px; }
#view_project h1 a{ font-size: 1em; color: #fff;  padding-left: 4px; }
#view_project a:link { color: #fff; text-decoration: none; }
#view_project a:hover { text-decoration: underline; }

/*HHHHHHHHHHHHHHHH[  SIDEBAR  ]HHHHHHHHHHHHHHHH*/
#sidebar_image {text-align:left; width:300px; font-family: Arial, Helvetica, sans-serif; font-size: 10px; color: #000; border-left: 1px solid #e2e2e2; float:right; padding-left:20px;}
#sidebar_text { padding-top:10px; padding-left:20px; padding-right:25px; margin-top:5px;}
#sidebar_header {text-align:left; font-family: Arial, Helvetica, sans-serif;font-size: 16px;color: #000;}

/*HHHHHHHHHHHHHHHH[  NEWS SECTION  ]HHHHHHHHHHHHHHHH*/
a.news_link {color:#000;}
a.link_nodecoration {color:#000;}
#news_left_collum {width:600px;font-family: Arial, Helvetica, sans-serif;font-size: 10px;color: #000;float:left;margin-top:0px;padding-right:20px;}	
#news_text {color: #000000;float: right;width:450px;font-family: Arial, Helvetica, sans-serif;font-size: 12px;text-align: left;line-height: 1.5em;}
#news_image {float:left;}
#news_image a:hover { color: #2262AE;}

/*HHHHHHHHHHHHHHHH[  PROJECT HIGHLIGHT BACKGROUND  ]HHHHHHHHHHHHHHHH*/
#highlight_bg {background-image:url(/images/highlight_BG.png);background-repeat:no-repeat;width:960px;height:395px;float:right;}
#highlight_bg_video {background-image:url(/images/highlight_BG_video.png);background-repeat:no-repeat;width:960px;height:395px;float:right;}
#project_image {width:468px;height:298px;float:right;margin-right:99px;margin-top:31px;}
#project_image_video {width:468px;height:298px;float:right;margin-right:100px;margin-top:31px;padding-top:16px;}
#project_image_video_scantron {width:439px;height:250px;float:right;margin-right:113px;margin-top:58px;}

/*HHHHHHHHHHHHHHHH[  PROJECT HIGHLIGHT TEXT  ]HHHHHHHHHHHHHHHH*/
#highlight_text {width:270px;height:315px;margin-top:30px;margin-left:90px;float:left;color: #EDEDED;}

/*HHHHHHHHHHHHHHHH[  PORTFOLIO THUMBNAILS  ]HHHHHHHHHHHHHHHH*/
.item, .s-item {width: 310px;height:300px;float: left;border: 1px solid #FFFFFF;}

/*HHHHHHHHHHHHHHHH[  PROJECT THUMBNAIL BACKGROUND  ]HHHHHHHHHHHHHHHH*/
.item-details {background-image: url(/images/thumbnail.jpg);background-repeat: no-repeat;}
.item-details h5{text-transform:uppercase;font-size:18px;font-family: Arial, Helvetica, sans-serif;font-weight:700;padding-left:40px;padding-top:10px;padding-bottom:0px;}
.item-details h5 a{color:#000000; }	
.item-details h5 a:hover{color:#2262AE; }	

/*HHHHHHHHHHHHHHHH[   PROJECT THUMBNAIL BACKGROUND ROLLOVER  ]HHHHHHHHHHHHHHHH*/
.item-details-over {background-image: url(/images/thumbnail_rollover.jpg);background-repeat: no-repeat;width:310px;height:300px;}

/*HHHHHHHHHHHHHHHH[   PROJECT THUMBNAIL  ]HHHHHHHHHHHHHHHH*/
.item-details img {padding-top: 35px;margin-left:50px;}

/*HHHHHHHHHHHHHHHH[   PROJECT THUMBNAIL ROLLOVER STROKE  ]HHHHHHHHHHHHHHHH*/
.item-over {width: 310px;float: left;border: 1px solid #ccc;}

/*HHHHHHHHHHHHHHHH[   PROJECT TITLE TEXT  ]HHHHHHHHHHHHHHHH*/
.item h1 {padding-left:42px;padding-top:25px;margin-bottom:0px;text-transform: uppercase; background-color:#CCC; font-family: Arial, Helvetica, sans-serif;font-size: 20px;}
.item h10 {padding-left:42px;color: #666;font-family: Arial, Helvetica, sans-serif;font-size: 12px;margin: 0px;padding-bottom:30px;font-weight: 800;}

/*HHHHHHHHHHHHHHHH[   CONTACT FORM  ]HHHHHHHHHHHHHHHH*/
#contact_left_column { width:600px; float:left; padding:20px 0px 20px 20px; background-image:url(/images/contactform_bg.jpg);}
#contact_left_column h1 { font-family: Arial, Helvetica, sans-serif; font-size: 16px;  font-weight: 200; }
#contact_left_column a{ font-family: Arial, Helvetica, sans-serif; font-size: 12px;  font-weight: 200; }

/*HHHHHHHHHHHHHHHH[   CONTACT PAGE SIDEBAR  ]HHHHHHHHHHHHHHHH*/
#sidebar_text a {font-weight: bold;color: #2262AE;}
#sidebar_text a:hover {font-weight: bold;color: #2262AE;text-decoration:underline;}
#sidebar_text ul { list-style: none; margin: 0px 0px 0px 0px; padding-left:0px; font-family:Arial, Helvetica, sans-serif; font-size:11px; }
#sidebar_text  li { background: url(/images/bullet.gif) no-repeat 0px 5px; padding-left: 15px; }

/*HHHHHHHHHHHHHHHH[   FOOTER HOME PAGE  ]HHHHHHHHHHHHHHHH*/
#footer_highlight {background-color:#3F0;}
#footer_highlight h1 { text-transform: uppercase; font-size: 13px; margin: 0px; padding-bottom:5px; font-weight: 600;}
#footer_highlight p {font-family: Arial, Helvetica, sans-serif; font-size: 11px; padding-bottom:2px; line-height: 1.5em;}
#footer_highlight a:link { color: #000; text-decoration: underline; }
#footer_highlight a:hover { text-decoration: underline; color:#039;}
#footer_highlight ul { list-style: none; margin: 0px 0px 0px 0px; padding-left:0px; font-family:Arial, Helvetica, sans-serif; font-size:11px; }
#footer_highlight li { background: url(/images/bullet.gif) no-repeat 0px 5px; padding-left: 15px; }

/*HHHHHHHHHHHHHHHH[   FOOTER   ]HHHHHHHHHHHHHHHH*/
.footer{ clear: both; width: 960px; text-align: left; font-family:Arial, Helvetica, sans-serif; margin: 0 auto; padding-top:10px; color:#000;}
.footer a:link { color: #000;}
.footer a:hover { color:#039;}	
.footer ul li {display:inline;}
.copyright {text-align:right;padding-bottom:30px;}

/*HHHHHHHHHHHHHHHH[  ABOUT SECTION  ]HHHHHHHHHHHHHHHH*/
#about {float: left; width: 450px; margin-bottom:50px;}
#about p { font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-align: left; line-height: 1.75em; margin:0px; } 

/*HHHHHHHHHHHHHHHH[  RESUME SECTION  ]HHHHHHHHHHHHHHHH*/
#resume {float: right;width: 440px;margin-bottom:50px;}
#resume p { font-family: Arial, Helvetica, sans-serif; font-size: 12px; text-align: left; line-height: 1.75em; padding: 0 0 0 25px;}
#resume h1 { font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 700; color:#000; text-transform:uppercase; margin-bottom:0px;  } 
#resume h2 { background: url(/images/resume_h1_background.gif);text-transform:uppercase; font-size: 10pt; margin:40px 0px 0px 0px; padding:0px;}
#resume h3 {color: #2262AE; font-family:"MS Serif", "New York", serif; font-size: 17px; margin:5px 0px 0px 0px;}
#resume h3 a{color: #2262AE; font-family:"MS Serif", "New York", serif; font-size: 17px;}
#resume h3 a hover{color: #2262AE; font-family:"MS Serif", "New York", serif; font-size: 17px;}
.resume_title_divider {color: #a7a7a7; font-size: 18px; padding: 0 1px;}
.resume_title_detail { color: #000; font-weight:700; font-size: 12px; text-transform:lowercase; font-family: Arial, Helvetica, sans-serif;letter-spacing: -1px;}
.resume_date {color: #7e7e7e;font-family: Arial, Helvetica, sans-serif;	font-size: 11px; padding-left: 2px;}
#resume ul { list-style: none; margin: 0px 0px 0px 0px;  font-family:Arial, Helvetica, sans-serif; font-size:12px; }
#resume  li { background: url(/images/bullet.gif) no-repeat 0px 8px; padding-left: 10px; }
#resume  li a{color: #000;}
#resume  li {color: #666;}
.resume_awards {color: #2262AE; font-weight:700; font-size: 12px; font-family: Arial, Helvetica, sans-serif;}
.resume_awards_divider {color: #a7a7a7; font-size: 12px; padding: 0 5px;}
.resume_awards_detail {color: #666; font-weight:700; font-size: 11px; font-family: Arial, Helvetica, sans-serif;}

/*HHHHHHHHHHHHHHHH[ Back to Top  ]HHHHHHHHHHHHHHHH*/
p.back {clear: both; font-size: 12px; font-weight: bold; margin-bottom: 0; text-transform: uppercase;}
p.back a:link, p.back a:visited { color: #a1a1a1;}
p.back a:hover {color: #2262AE;}


