/* @override http://localhost:8888/css/styles.css */

/*******************************************************************/
/* css by justintalbott.com ****************************************/
/*******************************************************************/

/* reset & restore ****************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, 
tbody, tfoot, thead, tr, th, td 
{ margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
img { -ms-interpolation-mode:bicubic; }
a { cursor: pointer; text-decoration: none; }
em { font-style: italic; }
strong { font-weight: bold; }

/* general classes & element restore ****************************************/
.wrap { width: 918px; margin:0 auto; position:relative; min-height: 100%; }
.clear { clear: both; }
.hide { display: none; }
.textbox { padding: .3em; }
.rounded { -moz-border-radius: 5px; -webkit-border-radius: 5px; }

/* image layout ****************************************/
.one { width: 100px; }
.two { width: 210px; }
.three { width: 320px; }
.four { width: 430px; }
.five { width: 540px; }
.six { width: 650px; }
.seven { width: 760px; }
.left { float: left; margin-right: 20px; display: inline; }
.right {float: right; margin-left: 20px; display: inline; }
.right.inset { margin: 0 120px 0 20px; }
.left.inset { margin-left: 230px; }

/* font family ****************************************/
p, li, h2, dt, dd { font-family: Helvetica, Arial, sans-serif; }
h1, #contact-card p, h2, #video-menu li a, .resume { font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; }
h2 { margin-top: 25px; padding: 0; font-weight: normal;font-size: 1.2em; font-style: italic; }
code { font-family: Monaco, "Andale Mono", "Courier New", monospace; }

/* colors ****************************************/
p, li { color: #333; }
a { color: #00f; border-bottom: 1px solid #000; } a img { border: 0; }
a:hover { color: #44883f; border-color: #44883f; }
input:focus, textarea:focus, select:focus { background: #f1f1f1; }

/* font styles ****************************************/
p, li { padding: .438em 0; /* 7px */ font-size: .875em; /* 14px */ line-height: 1.313em; /* 21px */ }
h1 { font-size: 2.2em; } 
.smaller { font-size: 0.5em; }
.larger { font-size: 1.25em; }

/* here we go ****************************************/
body { margin: 40px 0 80px 0; background: url(/imgs/bg.png) #ddd repeat 0 0; background-attachment: fixed; }

#fixed { position: absolute; top: 0; left: 0; width: 321px; float: left; }
#contact-card { padding: 68px 40px 30px 40px; width: 241px; height: 85px; text-align: center; position: relative; }
html>body #contact-card { background: url(/imgs/gina-fitch.png) no-repeat;  }
* html #contact-card { background-color: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/imgs/gina-fitch.png", sizingMethod="crop"); }
#contact-card h1 { display: none; }
#contact-card p  { margin-top: 75px; padding: 2px 0; font-style: italic; }
#contact-card a#email { display: block; position: absolute; top: 125px; left: 0; width: 100%; height: 20px; border: 0; }
#contact-card p#title { font-size: 1.1em; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; margin: 4px 0; color: #557; background:#fff; }

#video-menu {  width: auto; margin: 0 5px; border-top: 1px dotted #44883f; margin-top: 30px; float: left; }
* html #video-menu { margin-top: -30px; }
#video-menu li { width: 100%; list-style: circle; border-bottom: 1px dotted #44883f; color: #333; float: left; }
#video-menu a { border: 0; display: block; color: #333; padding: 3px 7px; font-size: 1.1em; background: #fff; opacity: .6; filter:alpha(opacity=60); -moz-opacity: 0.6; border: 5px solid #eee; }
#video-menu li.current a, #video-menu a:hover { opacity: 1; filter:alpha(opacity=100); -moz-opacity: 1; }
#video-menu li.current a { color: #44883f; }
#video-menu li span { color: #000; }

#content { float: right; width: 565px; }
#about, #video-loader {  }
#video-loader { margin-bottom: 30px; border: 5px solid #fff; background: #fff; position: relative; }
#video-loader .caption { padding: 8px 10px 4px; text-align: right; }
#video-loader .shadow { display: block; height: 26px; width: 100%; position: absolute; bottom: -30px; }
html>body #video-loader .shadow { background: url(/imgs/shadow.png) no-repeat top center; }
* html #video-loader .shadow { display: none; }

#video-loader dl { position: relative; padding: 3px 0 6px 0; font-size: .9em; line-height: 1.5em; }
#video-loader dt { position: absolute; top: 0; left: 0; background: #eee; width: 150px; padding: 3px 10px; text-align: right; }
#video-loader dd { margin-left: 180px; }

#about p { line-height: 1.5em; clear: left; }
#about li { float: left; width: 183px; list-style: circle; color: #fff; border-bottom: 1px dotted #fff; }
#about li span { color: #333; display: block; padding-left: 7px; margin-right; }
#about ul { text-align: left; padding-left: 16px; display: block; }



.resume { position: relative; display: block; text-decoration: none; background: url(/imgs/link-bg.png) #fff no-repeat top left; padding:2px 7px; border: 0; margin: 20px; border: 5px solid #eee; font-style: italic; }
.resume:hover { border-color: #fff; }
.pdf { display: block; float: left; position: absolute; left: -33px; top: 0; height: 24px; width: 24px; background: url(/imgs/pdf.png) no-repeat; margin-right: 5px; }

#twitter { padding: 10px 16px; border: 5px solid #eee; background: url(/imgs/twitter.png) #fff top right no-repeat; position: relative; }
#about #twitter li { float: none; color: #333; background: #f8f8f8; display: block; width: auto; padding: 7px 10px; }
#about #twitter li.even { background: #f2f2f2; }
#about #twitter ul { padding: 0; margin: 5px 0; }
#about #twitter li a { color: #666; border: 0; }
#about #twitter li a:hover { color: #00f; }
#about #twitter li img { float: left; margin-right: 10px; }
#about #twitter p a { border-color: #fff; }
#about #twitter abbr { display: block; font-size: .7em; font-style: italic; color: #999; }