/*
Description: Red Handed Design website style sheet
Author: Michael Marcialis
*/

/* ============================================================================
UNIVERSAL RESET
=============================================================================== */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,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 {
list-style:none;
}

caption,th {
text-align:left;
}

h1,h2,h3,h4,h5,h6 {
font-size:100%;font-weight:normal;
}

q:before,q:after {
content:'';
}

abbr,acronym {
border:0;
}

a:active, a:focus {
outline: 0;
}

/* ============================================================================
LAYOUT STYLES
=============================================================================== */
body {
font:normal 12pt "Trebuchet MS", Helvetica, sans-serif;
color:#ffffff;
background-color:#3f3526;
}

#header,
#content,
#footer {
text-align:center;
min-width:900px;
}

#header {
background:#285b9e url(/images/mountain_background.jpg) repeat-x bottom left;
}

#content {
background:#554837 url(/images/underground.jpg) repeat-x top left;
}

#footer {
background:transparent url(/images/footer_grit.jpg) repeat-x top left;
}

#headerWrapper,
#contentWrapper,
#footerWrapper {
margin:0 auto;
width:900px;
text-align:left;
}

#headerWrapper {
padding-top:100px;
}

#contentWrapper {
background:transparent url(/images/crack.jpg) no-repeat top center;
overflow:hidden;
}

#footerWrapper {
padding:35px 0;
}

#logo,
#intro,
#buttons,
#print,
#online,
#about {
width:250px;
float:left;
margin-right:25px;
display:inline; /*Correct double margin bug*/
}

#print,
#online,
#about {
margin-top:150px;
margin-bottom:30px;
}

#logo,
#print {
margin-left:50px;
}

#about {
background:#746752 url(/images/about_bottom.jpg) no-repeat bottom center;
padding-bottom:10px;
}

.vcard {
position:absolute;
left:-9999px;
}

/* ============================================================================
HEADER STYLES
=============================================================================== */
h1 {
text-indent:-5000px;
width:250px;
height:188px;
background:transparent url(/images/logo.png) no-repeat top center;
}

#print h2,
#online h2 {
text-indent:-5000px;
width:250px;
height:19px;
}

#print h2 {
background:transparent url(/images/print_header.jpg) no-repeat top center;
}

#online h2 {
background:transparent url(/images/online_header.jpg) no-repeat top center;
}

#about h2 {
text-indent:-5000px;
width:250px;
height:151px;
background:transparent url(/images/about_header.jpg) no-repeat top center;
}

#about h3 {
margin-bottom:20px;
line-height:17px;
padding:0 10px;
font:1.2em Georgia, serif;
color:#ffffff;
background-color:#887c69;
}

/* ============================================================================
LIST STYLES
=============================================================================== */
#buttons ul li {
float:left;
}

#buttons ul a {
display:block;
height:67px;
line-height:67px;
text-indent:-5000px;
}

#buttons ul a:hover {
cursor:pointer;
}

#resume a:link,
#resume a:visited {
display:block;
height:67px;
width:250px;
background:transparent url(/images/resume_button.png) no-repeat top center;
margin-bottom:20px;
}

#portfolio a:link,
#portfolio a:visited {
display:block;
height:67px;
width:125px;
background:transparent url(/images/portfolio_button.png) no-repeat top center;
margin-right:25px;
}

#contact a:link,
#contact a:visited {
display:block;
height:67px;
width:100px;
background:transparent url(/images/contact_button.png) no-repeat top center;
}

#resume a:hover,
#portfolio a:hover,
#contact a:hover {
background-position:bottom center;
}

#content dt {
margin-top:20px;
font:1.2em Georgia, serif;
}

#content dd {
color:#7e725f;
line-height:18px;
margin:20px 0 30px 0;
}

/* ============================================================================
TYPOGRAPHY STYLES
=============================================================================== */
strong {
font-weight:bold;
}

#header p {
margin-bottom:20px;
line-height:19px;
}

#about p {
margin-bottom:20px;
line-height:17px;
padding:0 10px;
font-size:.9em;
}

#footer p {
line-height:17px;
text-align:right;
padding:0 50px;
font-size:.9em;
}

#flickr {
font-family:"Trebuchet MS", Helvetica, sans-serif;
color:#0063dc;
font-weight:bold;
}

#flickr em {
color:#ff0084;
font-weight:bold;
}

#lightbox-overlay-text-about {
display:none;
}

/* ============================================================================
IMAGE STYLES
=============================================================================== */
#content dl img {
background-color:#ffffff;
border:2px solid #746752;
padding:2px;
margin-bottom:8px;
}

#content dl a:hover img {
border-color:#ed9104;
}

#about img {
float:left;
margin:0 0 10px 10px;
background-color:#ffffff;
border:3px solid #6b5e4b;
padding:3px;
width:58px;
height:58px;
display:inline; /*Correct double margin bug*/
}

#about a:hover img {
border-color:#ed9104;
}

/* ============================================================================
LINK STYLES
=============================================================================== */
a:link,
a:visited {
color:#ffffff;
}

a:hover {
color:#ed9104;
text-decoration:none;
}

#content dt a:link,
#content dt a:visited {
color:#ed9104;
text-decoration:none;
}

#content dt a .url {
display:none;
}

#content dt a:hover {
color:#ffffff;
}

#content dt a:hover .url {
display:block;
float:left;
color:#7e725f;
font:.6em "Trebuchet MS", Helvetica, sans-serif;
}

#content dd a:link,
#content dd a:visited {
color:#7e725f;
}

#content dd a:hover {
color:#ffffff;
text-decoration:none;
}

/* ============================================================================
RULE STYLES
=============================================================================== */
hr {
display:none;
}

#headerRule {
width:900px;
height:147px;
background:transparent url(/images/road.png) no-repeat bottom center;
clear:both;
}

/* ============================================================================
FORM STYLES
=============================================================================== */

/* ============================================================================
FILTERED STYLES
=============================================================================== */
