/*
Theme Name: Reflection
Theme URI: http://xyloid.org/projects/reflection/
Description: AJAX and DHTML theme for YAPB-enabled photoblogs. 
Version: 1.0
Author: Dave Moxey
Author URI: http://xyloid.org/
*/

/*** Main page layout ***/

body {
margin:0;
padding:0;
background-color:black;
color: #d5dadb;
font-family: Helvetica, Verdana, Trebuchet, Arial, sans-serif;
font-size: 13px;
letter-spacing:1px;
}
.clearfix {
	display: block;
	height: 1px;
	clear: both;	
}
h1, h2, h3, h4 {
	font-family: Georgia, Times New Roman, serif;
	color: #d5dadb;	
	font-weight: normal;
}
h1 {
	font-size: 55px;
	margin:0;
}
a:link, a:visited {
	text-decoration: underline;
	color: #ffffff;	
}
a:hover {
	text-decoration: none;
	color: #d5dadb;	
}
#topcontainer {
margin:0;
padding:0;
color:white;
}

#header{
width:900px;
height:140px;
background:url(images/top-bg.gif) repeat-x;
margin:20px auto;
position:relative;
background-position: 0 41px;
}

#topcontent{
margin:0 auto;
padding:30px 0 0 0;
}

#pagecontent{
width:900px;
margin:0 auto;
padding:0;

}
#flowcontent{
width:100%;
margin:0 auto;
padding:0;
position: relative;

}
p.blurb, #flowcontent h1 {
	width: 900px;
	position: relative;
	left: 50%;
	margin-left: -450px;
	margin-bottom:15px;	
}
#pagecontent h3, #pagecontent h2{
color:#fff;
}

#footer{
text-align:center;
font-size: 10px;
margin-top: 20px;
padding-bottom: 15px;
}

#footer a{
color:#777;
text-decoration:none;
}

#footer a:hover{
color:#999;
}

/*** Navigation bar ***/

#navbar{
position:absolute;
bottom:25px;
right:0px;
}

#navbar li, #titlebits li{
display:inline;
list-style-type: none;
margin:0;
padding:0 0 0 20px;
}

#navbar ul, #titlebits ul{
padding:0;
margin:0;
}

#navbar a{
color:#ccc;
font:0.75em "Trebuchet MS";
font-weight: bold;
letter-spacing:2px;
text-transform:uppercase;
text-decoration: none;
border-bottom: 0px solid #363636;
padding:0;
margin:0;
}

#navbar a:hover{
border-bottom: 6px solid #666;
color: white;
}

/*** Image display ***/

#title{
margin:0 auto;
position:relative;
}

#texttitle{
letter-spacing:-1px;
font:bold 1.4em Arial;
margin:0;
padding:0;
}

#inlinedate{
padding-left:8px;
font-weight:normal;
color:#2e2e2e;
}

#texttitle a{
color:white;
text-decoration:none;
}

#texttitle a:hover{
color:#ddd;
}

#titlebits{
position:absolute;
right:0;
bottom:0.2em;
font:0.7em Verdana;
}

#titlebits a{
color: white;
text-decoration: none;
}

#titlebits a:hover{
color:#ccc;
}

#titlebits li{
padding-left:10px;
}

#imageholder{
border-top:2px solid #fff;
margin:0;
padding:0;
position:relative;
overflow:hidden;
top:0;
left:0;
}

#mainimage{
display:block;
}

.overlay{
visibility:hidden;
position:absolute;
z-index:3;
}

#panel_exif{
background-color:#aaa;
width:350px;
border:2px solid #fff;
border-top:none;
color:black;
font:0.8em Verdana;
}

#panel_exif ul{
margin:0;
padding:0;
}

#panel_exif li{
padding: 3px;
display:block;
padding-left: 120px;
clear:left;
}

#panel_exif li label{
margin-left: -130px;
width:120px;
float:left;
text-align:right;
padding-right:10px;
color:#666;
text-transform:lowercase;
}

#panel_info{
background:black;
border:2px solid #fff;
padding:5px;
font:0.8em Verdana;
}

#panel_info a{
color:#888;
text-decoration:none;
}

#panel_info a:hover{
text-decoration:underline;
}

#panel_overlay{
background:white url(images/loading.gif) no-repeat center center;
display:none;
}

#overlaynav{
position:absolute;
left:0;
top:0;
z-index:5;
width:100%;
height:100%;
background:transparent url(images/1px.gif);
}

#overNextLink,#overPrevLink{
position:absolute;
display:block;
width:50%;
height:100%;
outline:none;
top:0;
}

#overNextLink{right:0;}
#overPrevLink{left:0}

#overNextLink:hover{
background:transparent url(images/nextlabel.gif) no-repeat 100% 30%;
}

#overPrevLink:hover{
background:transparent url(images/prevlabel.gif) no-repeat 0% 30%;
}

/*** Comments on image display ***/

#comments,#content{
width:800px;
padding-top:10px;
margin:0 auto;
font-family:"Trebuchet MS";
}

#comments a,#pagecontent a,#content a{
color:#9AB19E;
}

#comments a,#pagecontent a:hover,#content a:hover{
text-decoration:none;
}

#comments a:hover{
color:#999;
}

#comments ol{
list-style:none;
padding-right:40px;
}

#comments li{
background:#191919;
border:1px solid #333;
display:block;
margin-bottom:10px;
padding: 10px;
}

#comments li.alt{
background:#111
}

#comments .commentcount{
font:4em Georgia;
float:right;
color:#222;
}

#comments .commenttext{
margin-right:50px;
text-align:justify;
color:#e0e0e0;
}

#comments cite{
font-size:120%;
}

#comments small.commentmetadata{
display:block;
text-align:right;
color:#777;
}

#comments input, #comments textarea{
background:#111;
border: 1px solid #444;
color:#ccc;
padding: 3px;
}

/*** Mosaic and browser pages ***/

.mosaic{
border:1px solid #777;
margin:2px;
padding:1px;
background:#bbb;
}

h2.mosaicheader{
clear:left;
font:1.4em Arial bold;
letter-spacing:-1px;
border-bottom:2px solid white;
padding-top:15px;
}

.tipz{
font-family:"Trebuchet MS";
background-color:#000;
color:white;
padding:5px;
font-size:0.9em;
}

.tipz .tip-title{
font-weight:bold;
}

.tipz .tip-text{
font-weight:normal;
color:#ccc;
font-size:0.9em;
}

#taxonomyTable {
width:100%
}

#taxonomyTable a{
color:#999;
text-decoration:none;
}

#taxonomyTable a.current{
color:white;
}

#taxonomyTable a:hover{
text-decoration:underline;
}

#taxonomyTable td{
border-bottom:2px solid white;
vertical-align:bottom;
}

#yearCloud{
width:50%;
font-size:1.2em;
}

#taxonomyTable th{
font-size:130%;
text-align:left;
color:white;
border-bottom: 2px solid white
}

.tagbox{
    display: block
}
.tagbox * {
    display:block;
    height:1px;
    overflow:hidden;
    font-size:.01em;
    background:#313131
}
.tagbox1 {
    margin: 0 3px 0 3px;
    padding: 0 1px 0 1px;
    border-left:1px solid #151515;
    border-right:1px solid #151515;
    background:#242424
}
.tagbox2 {
    margin: 0 1px 0 1px;
    padding: 0 1px 0 1px;
    border-left:1px solid #040404;
    border-right:1px solid #040404;
    background:#272727
}
.tagbox3 {
    margin: 0 1px 0 1px;
    border-left:1px solid #272727;
    border-right:1px solid #272727;
}
.tagbox4 {
    border-left:1px solid #151515;
    border-right:1px solid #151515
}
.tagbox5 {
    border-left:1px solid #242424;
    border-right:1px solid #242424
}

#tagContainer {
    padding: 5px 5px 5px 8px;   
}

#tagPics {
background:#313131;
position:relative;
line-height:0;
height:1%; /* Ugly hack for IE */
}

#tagProgress{
display:block;
position:absolute;
left:50%;
top:50%;
margin-left:-33px;
margin-top:-33px;
z-index:2;
visibility:hidden
}
#homecontain {
	width:1020px;
	margin:10px auto;	
	position: relative;
}
a.biglogo {
	text-decoration: none;
	display: block;

	width: 551px;
	height: 272px;
	background-image: url(/images/logo_lg.png);
	background-repeat: no-repeat;
}
a.logoburst {
	text-decoration: none;
	width: 553px;
	height: 213px;
	background-image: url(/images/logoburst.png);
	background-repeat: no-repeat;
	z-index: 100;
	display: block;
	position: absolute;
	top: -5px;
	left: 43px;
}
div#front-tiles {
	height: 509px;
	width: 1020px;
	margin-top: 20px;
}
div#front-tiles a{
	background-image: url(/images/sprite_front_tiles.jpg);
	background-repeat: no-repeat;
	height: 250px;
	display: block;
	float: left;
	text-decoration: none;
}
div#frontcopy {
	position: absolute;
	width: 400px;
	top:0;
	right: 0;
	text-align: justify;	
}
a.tile-lighting {
	background-position: 0 0;
	width: 375px;
	margin-bottom: 10px;
	margin-top: 20px;
}
a.tile-floral {
	background-position: -375px 0;
	width: 250px;
	margin:20px 10px 10px 10px;
}
a.tile-scenic {
	background-position: -625px 0;
	width: 375px;
	margin-bottom: 10px;
	margin-top: 20px;
}
a.tile-design {
	background-position: -1000px 0;
	width: 250px;
}
a.tile-av {
	background-position: -1250px 0;
	width: 583px;
	margin:0px 10px;
}
a.tile-last {
	background-position: -1833px 0;
	width: 167px;
	margin-top: 20px;
}
a.tile-lighting:hover {
	background-position: 0 -250px;
	width: 375px;
	margin-bottom: 10px;
	margin-top: 20px;
}
a.tile-floral:hover  {
	background-position: -375px -250px;
	width: 250px;
	margin:20px 10px 10px 10px;
}
a.tile-scenic:hover  {
	background-position: -625px -250px;
	width: 375px;
	margin-bottom: 10px;
	margin-top: 20px;
}
a.tile-design:hover  {
	background-position: -1000px -250px;
	width: 250px;
}
a.tile-av:hover  {
	background-position: -1250px -250px;
	width: 583px;
	margin:0px 10px;
}
a.tile-last:hover  {
	background-position: -1833px -250px;
	width: 167px;
	margin-top: 20px;
}

div.forminputs input, div.forminputs textarea {
	border: 1px solid #d5dadb;
	background: #000000;
	color: #d5dadb !important;
	font-size: 12px;
}
div.forminputs input:focus, div.forminputs textarea:focus {
	background: #222222;
}
div.forminputs input {
	width: 60%;
	padding:3px 5px;	
}
div.forminputs textarea {
	width: 100%;
	padding:3px 5px;
	height: 70px;	
}
div.forminputs input#captchaput {
	width: 50px!important;	
}
p.bottomline {
	font-size: 10px;	
}
