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

Project: 	Personal Website
Author: 	Matthew Branthwaite (matthewbranthwaite.co.uk)
Created: 	2008-11-23

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

/* = RESET */

/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h5, h5, h6 { font-size:100% }
q:before, q:after { content:''}

/* The below restores some sensible defaults */
strong { font-weight: bold; }
em { font-style: italic; }
ol, ul, li { list-style: none; }
h1, h2, h3, h4, h5 { font-weight: bold; }
a { outline: none; } /* Gets rid of Firefox's dotted borders */
a img { border: none; } /* Gets rid of IE's blue borders */



/* Typography */
body { color: #080808; font-size: 11px; font-family: Arial, sans-serif; }
h1, h2, a#email-me, ul.links li a { font-family:"Century Gothic","Lucida Grande",Arial,sans-serif; text-transform: uppercase; }

a { text-decoration: none; color: #080808; padding: 1px 3px; }
a:hover { color: #fff; }


html, body { overflow: hidden; }
div.bg { position: absolute; top: 0; left: 0; width: 100%; overflow: hidden; text-align: center; z-index: 10; }
div.bg img { width: 100%; height: 100%; z-index: 10;  }
div.wrapper { position: absolute; top: 0; left: 0; width: 100%; z-index: 1000; overflow: auto; }
div#container { width: 960px; }

h1 { float: left; width: 226px; margin: 14px 0 0 0; }
h1 a { float: left; font-size: 16px; line-height: 16px; padding: 4px 14px; }
h1 a strong { display: block; font-size: 12px; line-height: 14px; font-weight: normal; color: #3d3d3d; }

ul.links { float: left; width: 680px; margin: 14px 0 7px 14px; }
ul.links li { float: left; }
ul.links li a { float: left; padding: 6px 0 6px 13px; border-left: 1px solid #111; width: 146px; line-height: 13px; text-transform: uppercase; }
ul.links li a em { display: block; font-style: normal; text-transform: none; color: #3d3d3d; }
h1 a:hover strong, ul.links li a:hover em { color: #999; }

div.caption { position: absolute; top: 130px; right: 100px; text-align: right; z-index: 10; }
div.caption h2 { font-size: 60px; line-height: 60px; font-weight: normal; }
div.caption p { line-height: 14px; font-size: 13px; padding-right: 3px; }

a#email-me { width: 52px; padding: 7px 14px; float: right; }
form.display-form { position: relative; clear: both; width: 880px;  z-index: 20; }
form.start { position: relative; margin-left: -800px; }
form.display-form fieldset,
div.msg-failure { padding-top: 11px; margin: 0 0 25px 240px; width: 560px; }
form.display-form legend { display: none; }
form.display-form table { width: 100%; }
form.display-form table th,
form.display-form table td { width: 52px; padding: 3px 14px; vertical-align: top; color: #eee; }
form.display-form table td { width: 452px; }
form.display-form input.textfield, form.display-form textarea { width: 444px; padding: 3px; font-size: 12px; border: 1px solid #111; background-color: #fff; filter:alpha(opacity=100); -moz-opacity: 1; opacity: 1;  }
form.display-form p.form-submit { margin: 0; padding: 14px 0 14px 94px; }

div.msg-failure { padding: 14px 0; margin-bottom: 0; }
div.msg-failure h2 { float: left; width: 66px; margin: 0 14px; }
div.msg-failure p { margin: 0 14px 0 0; }
div.msg-failure ul.errors { clear: both; margin: 0 0 0 94px; }

a:hover, form.display-form fieldset, a#email-me.selected { background-color: #000; filter:alpha(opacity=82); -moz-opacity: 0.82; opacity: 0.82; color: #eee; }
div.msg-failure { background-color: #c60000; filter:alpha(opacity=82); -moz-opacity: 0.82; opacity: 0.82; }