ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,table,div,blockquote,fieldset,input
{ margin:0; padding:0 }
html, body {height:100%;}
body {background:url("images/bg-tile.jpg") repeat-x #cccbcb; font-family:arial, sans-serif; behavior:url("csshover.htc");}

h1 {color:#8b9297; font-size:30px; font-weight:normal; padding-bottom:5px;}
h1 span {font-weight:bold;}
h2 {color:#8b9297;}
hr {height: 0; border: 0; border-top: 1px solid #8b9297; width:920px; margin:auto;} 

.imageR { float:right; margin:0px 0px 5px 10px; border:1px solid #63811f;}
.imageL { float:left; margin:0px 10px 5px 0px; border:1px solid #63811f;}
.imageC { display:block; margin:2px auto; text-align:center; border:1px solid #63811f;}
.clear {clear:both;}
.block {display:block;}
a img {border:none;}

#wrapper {width:942px; margin:auto;}

#header {height:154px;}
.logo {margin:30px 0 0 25px;}

#nav {position: relative; height: 19px; line-height:17px;   margin:0; padding-left:3px;  padding-top:5px; float:right;}
#nav ul {float:left;}
#nav ul li {float:left; list-style:none; padding:0 10px; padding-left:0px; line-height:26px; text-align:center;}
#nav ul li a {text-decoration:none; font-weight:bold; font-size:15px; color:#8b9297; text-transform:uppercase; display:block;  padding:0 3px 0 14px; line-height:26px;}
#nav ul li:hover a {color:#8fbe5d;}
#nav ul li.selected {background:url("images/navR.gif") no-repeat right top; }
#nav ul li.selected a {background:url("images/navL.gif") no-repeat left top; color:#fff;}


/*.lavaLamp {position: relative; height: 19px; line-height:17px;   margin:0; padding-left:3px;  padding-top:5px; float:right; } 
.lavaLamp ul {float:right;}
.lavaLamp li {float: left; list-style: none; }

.lavaLamp li.back {background: url("images/nav2.gif") no-repeat right -25px; width: 9px;  height: 24px; z-index: 8; position: absolute; top:9px;}
.lavaLamp li.back .left {background: url("images/nav2.gif") no-repeat top left; height: 24px; margin-right: 8px;}
.lavaLamp li a {position: relative; overflow: hidden; text-decoration: none; font-weight:bold; font-size:15px; outline: none; text-align: center; height: 24px; top: 6px; z-index: 10; float: left; display: block; margin: auto 13px; _display:inline;}
.lavaLamp li a:link, .lavaLamp li a:visited {color:#8b9297; text-transform:uppercase;}
.lavaLamp li:hover a, .lavaLamp li.selected a , .lavaLamp li a:hover{color:#8fbe5d;}
*/



#content {background:url("images/wrapper-tile.jpg") repeat-y; width:942px;}
#content p {font-size:19px; color:#636262; padding-bottom:10px;}
#content ul {font-size:19px; color:#636262; /*margin-left:25px;*/ padding:10px 0px;}
#content ul li {background:url("images/arrow.png") no-repeat 0 3px; padding:0 0 0px 20px; margin-bottom:10px; list-style:none;}
/*#content a {color:#85B84F; text-decoration:none;}
#content a:hover {color:#017393;}*/

#gutter {padding:20px 35px;}

#footer {clear:both; padding:20px 35px 5px 0;}
#footer p {font-size:11px; text-align:right; color:#8b9297;}
/***************Home Page**********************/
.photoLink {position:absolute; top:-25px; right:0; text-decoration:none; font-size:18px; color:#8b9297 !important; text-transform:uppercase; font-style:italic; font-weight:normal !important;}
.photoLink img {vertical-align:top; margin-top:1px;}

#banner {background:url("images/banner.jpg") no-repeat; width:942px; height:305px; position:relative;}
#slideshow {position:absolute; top:14px; left:17px; overflow:hidden; width:444px; height:276px;} 
#tagline {float:right; margin:30px 15px 0 0; width:455px; }
#tagline p {color:#fff; font-size:22px; padding:0px 5px 0 20px; }
.create {float:right; margin:0px 0px 15px 0;}
.portBtn {position:absolute; bottom:30px; right:28px;}

#who {width:406px; float:right;}
#whoMid {background:url("images/hpBoxMid.gif") repeat-y; width:376px; min-height:495px; _height:260px; padding:0 15px; position:relative;}
#who a {color:#017393; font-weight:normal; text-decoration:none;}
#who a:hover {color:#85B84F;}
#who h2 {font-size:20px;}
#who ul li {background-image:none; font-size:15px; font-style:oblique; margin-bottom:5px;}
.meDrawn { width:144px; height:236px; position:absolute; right:30px; bottom:-5px;}
#skills {margin-left:40px;}

/*************Portfolio**************/
#bar {width:940px; height:40px; background:url("images/bar.jpg") no-repeat; margin:2px auto 30px; position:relative;}
#bar #title { width:177px; position:relative; top:7px; left:19px;  height:25px; line-height:25px; }
#bar #title p {color:#232323;font-weight:bold; font-style:italic; font-size:17px;text-align:center; text-transform:uppercase;}
#bar ul {float:right; margin-right:10px; padding:0;}
#bar ul li {float:left; list-style:none; padding:0 10px; line-height:40px; background-image:none;}
#bar ul li a {text-decoration:none; font-size:22px; color:#c5c4c4; text-transform:uppercase;}
#bar ul li.active a {color:#fff;}

.project { margin:30px 0;}
.project img:hover {opacity:0.9;filter:alpha(opacity=90);}
.project .left {width:523px; float:left; margin:0 0 0 15px;}
.project .leftMid {background:url("images/pfMid.gif") repeat-y; padding:0 15px;}
.project .leftMid img {border: 1px solid #cccbcb;}
.project .leftMidL {float:left;}
.project .leftMidR {float:right; width:120px;}
.project .leftMidR .first {margin-bottom:13px;}

.project .right {width:370px; float:right; margin:0 15px 0 0; _display:inline;}
.project .right h1 {color:#148bb6; font-size:22px; padding-bottom:0px;}
.project .right p.duty {font-size:16px !important; padding-bottom:10px; font-style:italic;}
.project .right p {color:#8b9298; font-size:20px; }
.project .right .button {float:right; margin:20px 0 0 0;}

.smaller p, .smaller ul {font-size:18px !important; padding-bottom:0px !important;}
.smaller ul li {margin-bottom:5px !important;}

#photo, #contact, #web {padding:0px 0px; min-height:400px;}


/* FLICKR
Images are wrapped in divs classed "flickr_badge_image" with ids "flickr_badge_imageX" where "X" is an integer specifying ordinal position. Below are some styles to get you started!
*/
#flickr {margin:20px 0px 0px -15px; width:460px;}
#flickr h1 {margin:0 0 10px 5px; text-align:left;}
#flickr_badge_uber_wrapper {text-align:center; width:460px; background:url('images/flickrMid.gif') repeat-y; float:left;}
#flickr_badge_wrapper {padding:5px 5px 5px 11px; float:left;}
.flickr_badge_image {margin:0 5px 5px 5px; float:left;}
.flickr_badge_image img {border: 1px solid #cccbcb !important;}
#flickr_badge_source {text-align:left; margin:0 10px 0 10px;}
#flickr_badge_icon {float:left; margin-right:5px;}
#flickr_www { display:none;}
#flickr_badge_uber_wrapper a:hover,
#flickr_badge_uber_wrapper a:link,
#flickr_badge_uber_wrapper a:active,
#flickr_badge_uber_wrapper a:visited {text-decoration:none !important; background:inherit !important;color:#3993ff;}

#flickr_badge_source {padding:0 !important; font: 11px Arial, Helvetica, Sans serif !important; color:#666666 !important;}


a.btn {display:block; background:url(images/btnL.png) no-repeat left top;padding:0px 11px 0px;color:#FFF; text-decoration:none; line-height:30px; text-transform:uppercase; font-weight:bold; float:right; font-size:17px; height:32px; }
a.btn span {display:block; background:url(images/btnR.png) no-repeat right top; line-height:30px; height:32px;  padding:0 19px 0 10px;}

.field {padding:1px; width:200px; border:1px solid #ccc;}
#contact {width:700px; margin:auto;}
#contactL {float:left; width:190px;}
#contactForm{margin:0 0 0 220px; width:450px;}
#contact label {display:block; float:left; width:100px;}
#contact p { font-size:15px;}
#contact p.larger {font-size:17px; margin-top:20px;}
#contact .submit {float:right;}
#contact textarea {font-family:arial; font-size:15px; border:1px solid #ccc; width:250px; height:100px;}
#recaptcha_widget_div {margin:10px 0px 20px 150px;}


