
/*   L A Y O U T   */
html {background: url(../img/bg_grey.jpg); height:100%}
body {color:#FFFFFF; font-size:10px; font-family:verdana,ariel,times; height:100%; text-align:center;}
#wrapper {background-color:#353535; margin:0 auto; min-height:100%; position:relative; text-align:left; width:1000px;}
#header {border-bottom:1px solid #666666; margin:0px 20px; padding:20px 0pt 5px;}
#content {padding:20px; position: relative;}
#footer {border-top:1px solid #666666; bottom:0px; clear:both; color:#666666; height:50px; margin:0px 20px; padding:5px 0pt 20px;}
.clear {clear:both;}
.hr {border-bottom:1px solid #666666; height:10px; margin-bottom:20px;}
#leftCol {float:left;}

/*   T Y P E O G R A P H Y   */
h1 {font-size:300%; font-weight:normal; margin:0px;}
h1 span {color:#666666; font-size:70%; font-weight:normal;} /* 20px */
h2 {color:#FFFFFF; font-size:138.5%; margin-top:0;} /* 18px */
a {color:#FFFFFF; text-decoration:none;}
a:hover {text-decoration:underline;}
.highlight {color:#666666;}


/*   M E N U   */
ul#menu {float:right; height:25px; margin:-18px 0 0; padding:0;}
ul#menu li {border-right:1px solid #666666; color:#666666; display:block; float:left; list-style:none; padding:0 5px;}
ul#menu li.menuItemRight {border:0;}
ul#menu li a {color:#666666; display:block; font-size: 120%; text-decoration:none;}
ul#menu li a:hover, ul#menu li a.activeMenuItem  {color:#FFFFFF; text-decoration:none;}

/*   G A L L E R Y   L I S T   */
#galleryWrapper {margin-right:-20px;}
.galleryBox {background-color:#666666; float:left; height:114px; margin:0 20px 20px 0; width:306px;}
.galleryBox img {float:left; margin:7px;}
.galleryText {color:#353535; float:right; margin-right:3px; width:181px;}
.galleryText h2 {color:#FFFFFF; font-size:118%; margin:10px 0 0;}


/*   G A L L E R Y   */
#gallery {height:525px;}
#gallery .rightCol {float:right; width:240px;}
#gallery .leftCol {float:left; margin:0 20px 20px 0; text-align:center; width:700px;}
.galleryItem {height:525px; position:relative; width:960px}
.galleryInfo {font-weight:bold;}
.imageDescription, .galleryDescription {line-height:12px;}
.imageCount {position:absolute; right:0px; top:450px;}
#galleryControl {float:right; height:40px; margin-top:-90px; position:relative; width:240px; z-index:100;}
#galleryControl a {display:block; float:left; height:40px; margin-left:10px; width:40px;}
#galleryControl a span {display:none;}
a#play {background:url(../img/play.jpg) no-repeat;}
a:hover#play {background:url(../img/playOver.jpg) no-repeat;}
a#pause {background:url(../img/pause.jpg) no-repeat;}
a:hover#pause {background:url(../img/pauseOver.jpg) no-repeat;}
a#next {background:url(../img/next.jpg) no-repeat;}
a:hover#next {background:url(../img/nextOver.jpg) no-repeat;}
a#prev {background:url(../img/prev.jpg) no-repeat;}
a:hover#prev {background:url(../img/prevOver.jpg) no-repeat;}


/*   E T C   P A G E   */
#etcLeft {float:left; width:280px}
#etcLeft .imageFrame {margin-bottom:20px;}
#etcRight {float:left; margin-left:20px; width:660px}
#etcRight li {list-style:none; margin-top:10px;}
.etcText {padding:0 0 15px 20px;}

/*   H O M E   P A G E   */
#homeLeft { width: 220px; word-wrap: break-word; }
#homeLeft a { color: #888888; }
#homeLeft .recentWork {padding: 10px; background-color: #000000;}
#homeLeft .recentWork h2 { font-size: 100%; }
#homeLeft .quote {position: absolute; bottom: 20px; font-size: 11px; font-style: italic;}
#homeRight {float:right; margin-left:20px;}
#homeRight .imageFrame {}


/*   J O U R N A L   */
.journal #main {float:left; margin-right:20px; width:555px;}
.journal #sidebar {float:left; width:385px;}
.journal #sidebar ul {border-bottom:1px solid #666666; margin:0.5em 0 1.5em; padding-bottom:1.5em;}
.journal #sidebar li {list-style:none; padding:0 0 0.25em 0; margin-left:2em;}
.journal .post {border-bottom:1px solid #666666; margin:0.5em 0pt 1.5em; padding-bottom:1.5em;}


.imageFrame {background-color:#666666; padding:10px;}
.imageFrame p {color:#353535; font-size:90%; margin:10px 0 0 0;}
