/*** CSS RESET ***/

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, caption {  margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }

/*** The basics ***/
html, body { background-color:#2a2a2a; color:#fff; font-family: Verdana, Geneva, sans-serif; font-size:12px; width:100%; height:100%; }
h1, h4 { font-family: Georgia, serif; font-size:22px; letter-spacing:1px; font-weight:normal; margin-bottom:30px; }
h2 { font-family: Georgia, serif; font-size:17px; font-weight:normal; margin-bottom:10px; }
h4 { border-top:1px solid #FFFFFF; margin-bottom:15px; padding-top:10px; }

a { text-decoration:none; color:#fff; }
a:hover { color:#f6c70e; }
p { line-height:15px; margin-bottom:10px; }
ul { list-style-type:square; margin:15px 0 0 15px; }
li { margin-bottom:10px; line-height:15px; }

/*** Containers ***/
#container { width:1010px; margin:0 auto; }
#header { width:1010px; height:95px; }
#logo { width:460px; float:left; margin-top:25px; background: url(../images/logo-background.jpg) no-repeat top center; }
#nav { width:550px; float:left; font-family: Georgia, serif; font-size:18px; margin-top:30px; }
#portfolio { width:1010px; height:390px; background: url(../images/background2.png) no-repeat; padding-top:50px; }
#feature-left, #feature-right { width:280px; float:left; }
#musings { width:420px; float:left; }
#socialBottom { width:420px;padding-top:20px;margin:0 auto; }
#socialBottom a { float:left; width:130px; text-align:center; }
#socialBottom .padRight { margin-right:15px; }

/*** Logo ***/
#logo a { width:376px; height:28px; display:block; margin:0 auto; background: url(../images/logo-text.png) no-repeat; }
#logo a:hover { background: url(../images/logo-text-hover.png) no-repeat; }

/*** Navigation ***/
#nav a { width:125px; display:block; float:left; text-align:center; }

/*** Portfolio ***/
#portfolioContainer { width:930px; height:350px; margin:0 auto; position:relative; z-index:10; overflow:hidden; }
#portfolioPrev { position:absolute; left:0; bottom:25px; }
#portfolioNext { position:absolute; right:40px; bottom:25px; }
#portfolioContainer .portfolio { position:absolute; top:0; left:1010px; z-index:20; }
#portfolioContainer .left { width:300px; left:0; top:0; z-index:20; }
#portfolioContainer .middle { position:relative; width:416px; left:240px; top:45px; z-index:30; }
#portfolioContainer .right { width:300px; left:590px; top:0; z-index:20; }
#portfolioContainer .left, #portfolioContainer .middle, #portfolioContainer .right { display:block; position:absolute; background-color:#000; }
#portfolioContainer .left img, #portfolioContainer .right img { display:block; width:300px; height:202px; }
#portfolioContainer .middle img { display:block; width:416px; height:280px; }

/*** Portfolio Interior ***/
.portfolioItem { float:left; width:280px; margin:0 20px 30px 0; text-align:center; }
.portfolioItem a { font-size:17px; }
img.portfolioSmall { width:280px; height:202px; }
img.portfolioLarge { width:620px; float:right; margin-left:15px; }

/*** Musings ***/
#musings .readMore, #contentContainer .readMore { display:block; font-size:13px; text-transform:uppercase; }
#musings .readMore { text-align:center; }
#musings hr { margin:15px 0 2px; border-color:#fff; border-style:solid; border-width:1px 0 0 0; }
.musingItem { margin-bottom:30px; }
.musingDivider { margin-bottom:20px; width:460px; }

/*** Secondary page content blocks ***/
#contentContainer { width:900px; margin:0 auto; }
#contentContainer .readMore { font-weight:bolder; }
#contentContainer .rightImage, #contentContainer .rightText { width:300px; float:right; margin:0 0 15px 15px; }
#contentContainer .rightText { padding-top:15px; width:150px; position:relative; }
#contentContainer p a { font-weight:bolder; text-transform:uppercase; font-size:11px; }

/*** Forms ***/
.commentForm { margin-top:50px; }
.leftForm, .rightForm { float:left; }
.leftForm { width:200px; }
.leftForm p { font-size:16px; font-weight:bolder; line-height:16px; margin:5px 0 20px 0; }
.rightForm input, .rightForm textarea { font-size:16px; margin-bottom:10px; width:400px; }
.formSubmit { font-size:16px; margin:0 0 0 200px; font-weight:bolder; }

.clear { clear:both; }
