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

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%;
vertical-align: baseline;
background: transparent;
}
ol, ul {
list-style: none;
margin-bottom: .6em;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
html {
font-size: 62.5%;
line-height: 62.5%;
}

body {
font: 1.3em/1.4em Tahoma, Arial, Helvetica, sans-serif;
text-align: center;
background-color: #000000;
background-image: url(images/body-bkg.jpg);
background-repeat: no-repeat;
background-position: center top;
color: #CCCCCC;
}

a {
color: #1680DD;
font-weight: bold;
text-decoration: none;
}

a:hover {
color: #7BB5F7;
text-decoration: underline;
}

a:active { color: #66CCFF; }

p { margin-bottom: 0.5em; }
#content_wrapper li {
list-style: none;
margin-left: 1.5em;
margin-bottom: 0.2em;
background-image: url(images/bullet.gif);
background-repeat: no-repeat;
background-position: left 57%;
padding-left: 10px;
}

h1, h2, h3, h4, h5, h6 {
color: #3892f4;
text-transform: uppercase;
letter-spacing: 0.5em;
font-weight: bold;
}

h1 {
font-size: 1.4em;
margin-bottom: .7em;
line-height: 1em;
}

h2 {
font-size: 1.2em;
margin-bottom: .7em;
line-height: 1.1em;
}

h3 {
font-size: 1.1em;
line-height: 1.1em;
margin-bottom: .5em;
}

h4 {
font-size: 1.1em;
line-height: 1.1em;
}

select, input, textarea { font: 99% arial, helvetica, clean, sans-serif; }

.bold { font-weight: bold; }

.italic { font-style: italic; }

blockquote {
padding-right: 1em;
padding-left: 1em;
border-left: 2px solid #DCDCDC;
}

.clearer {
font-size: 0px;
line-height: 0px;
clear: both;
height: 0px;
}

.smaller-text {
font-size: 90%;
line-height: 95%;
}

.top-spacing {
margin-top: 2em;
}

.align-right {
text-align: right;
}

#wrapper {
width: 845px;
margin-right: auto;
margin-left: auto;
margin-top: 20px;
}

#header {
background-image: url(images/header.jpg);
background-repeat: no-repeat;
height: 132px;
}

#header h2 {
text-indent: -9999px;
text-align: left;
}
#header h2 a {
background-image: url(images/header-logo.gif);
background-repeat: no-repeat;
height: 41px;
width: 170px;
display: block;
font-size: 0px;
line-height: 0px;
margin-bottom: 0px;
margin-left: 60px;
padding-top: 76px;
background-position: center bottom;
}

#nav_wrapper {
height: 23px;
background-image: url(images/navbar.gif);
background-repeat: no-repeat;
}

#nav {
margin: 0px;
}

#nav li {
float: left;
margin: 0px;
}

#nav li a {
display: block;
background-image: url(images/navbar.gif);
background-repeat: no-repeat;
height: 23px;
text-indent: -9999px;
}

#navHome a {
width: 89px;
background-position: -398px 0px;
margin-left: 398px;
}

#navHome a:hover {
background-position: -398px -23px;
}

#home #navHome a {
background-position: -398px -46px;
}

#navPortfolio a {
width: 117px;
background-position: -487px 0px;
}

#navPortfolio a:hover {
background-position: -487px -23px;
}

#portfolio #navPortfolio a {
background-position: -487px -46px;
}

#navAbout a {
width: 113px;
background-position: -604px 0px;
} 

#navAbout a:hover {
background-position: -604px -23px;
} 
#about #navAbout a {
background-position: -604px -46px;
} 

#navContact a {
width: 128px;
background-position: -717px 0px;
}
 
#navContact a:hover {
background-position: -717px -23px;
}
#contact #navContact a {
background-position: -717px -46px;
}

#content_wrapper {
clear: both;
padding: 30px 36px 22px;
text-align: left;
background-color: #000000;
background-image: url(images/content-bkg.jpg);
background-repeat: no-repeat;
}

#content_main {
float: right;
width: 514px;
}

#content_sidebar {
float: left;
width: 222px;
background-repeat: no-repeat;
height: 222px;
margin-top: 6px;
}

#portfolio #content_sidebar {
background-image: url(images/sidebar-portfolio.jpg);
}

#about #content_sidebar {
background-image: url(images/sidebar-400-E-Joppa.jpg);
background-position: -5px 0px;
}

#contact #content_sidebar {
background-image: url(images/sidebar-Virtual-Physical.jpg);
background-position: center 0px;
}

#footer ul {
background-color: #000000;
padding-bottom: 4px;
}

#footer li {
display: inline;
border-left: 1px solid #333333;
font-size: 90%;
}

#footer li#footer-home {
border-style: none;
}

#footer a {
padding-right: 0.7em;
padding-left: 1em;
color: #999999;
text-decoration: none;
font-weight: normal;
}

#footer a:hover {
color: #FFFFFF;
text-decoration: underline;
}

#footer p {
font-size: 82%;
line-height: 100%;
margin-top: 0.6em;
margin-bottom: 2em;
}

#formtable td {
padding-right: 5px;
padding-bottom: 8px;
vertical-align: top;
}

#formtable {
margin-top: 1em;
}
#player  {
margin-top: 1.2em;
}