/*

theme modified from: Theme URI: http://www.sudeepmandal.com/projects/reflection-mod-photoblog-theme-wordpress/

Description: AJAX and DHTML theme for YAPB-enabled photoblogs with support for Categories and Tags. Based on David Moxey's excellent Reflection Theme (http://xyloid.org/projects/reflection/)

Version: 1.0.4

*/

html {
overflow-y:scroll;
}

body {
margin: 0;
padding: 0;
background-color: #f5f5f5;
font-family: "Helvetica Neue", sans-serif;
text-transform: uppercase;
color: #999999;
}

#topcontainer {
margin: 0;
padding: 0;
color: white;
}

#header {
width: 600px;
height: 65px;
text-align: center;
background-repeat: no-repeat;
margin: 0 auto;
position: relative;
}

#navbar {
position: relative;
text-align: center;
bottom: 10px;
}

#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: 9px "Helvetica Neue", Arial, sans-serif;
font-weight: normal;
letter-spacing: 2px;
text-transform: uppercase;
text-decoration: none;
border-bottom: 0px solid #363636;
padding: 0;
margin: 0;
}

#navbar a:hover, #titlebits a:hover {
border-bottom: 5px solid #666;
color: #aaa;
}

#navbar_on a {
border-bottom: 5px solid #666;
color: #aaa;
}

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

#pagecontent {
width: 800px;
margin: 0 auto;
padding: 0;
color: #bbb;
line-height: 1.6em;
}

#pagecontent h3, #pagecontent h2 {
color: #fff;
}

#pagecontent a:hover {
border-bottom: 2px solid #bb6633;
color: #bb6633;
}

#footer {
width: 800px;
margin: 0 auto;
text-align: center;
font: 0.7em "Helvetica Neue", Arial, sans-serif;
text-transform: uppercase;
padding: 30px 0 10px 0;
color: #555;
clear: left;
}

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

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

#title {
margin: 0 auto;
position: relative;
padding: 0 0 5px 0;
}

#texttitle {
letter-spacing: 0.5px;
font: 17px "Helvetica Neue";
font-weight: normal;
text-transform: uppercase;
color: #999999;
line-height: 16px;
margin: 0;
padding: 0;
}

#inlinedate {
display: inline;
font-size: 10px;
font-variant: normal;
text-transform: uppercase;
vertical-align: 10%;
padding-left: 8px;
font-weight: normal;
color: #A8A8A8;
}

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

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

#titlebits {
position: absolute;
right: 0;
top: 0.5em;
color: #ccc;
font: 9px "Helvetica Neue", Arial, sans-serif;
font-weight: normal;
letter-spacing: 2px;
text-transform: uppercase;
text-decoration: none;
}

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

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

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

#imageholder {
border-top: 1px solid #999999;
margin: 0;
padding: 0;
position: relative;
top: 0;
left: 0;
}

#mainimage {
display: block;
}

#exif_panel {
background-color: #f5f5f5;
width: 350px;
border: 1px solid #999999;
border-top: none;
color: black;
font: 0.8em "Helvetica Neue", Helvetica, sans-serif;
}

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

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

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

#comment_panel {
background-color: #f5f5f5;
border: 1px solid #999999;
border-top: none;
color: black;
}

#info_panel {
background: #f5f5f5;
border: 2px solid #999999;
padding: 5px;
font: 0.8em 'Helvetica Neue', Helvetica, sans-serif;
}

#info_panel a {
color: #888;
border-bottom:2px solid #999;
}

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

.overlay {
display: none;
position: absolute;
z-index: 3;
}

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

#overlaynav {
position: absolute;
left: 0;
top: 0;
z-index: 101;
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%;
}

.mosaic {
border: 1px solid #545454;
padding: 1px;
background: #f5f5f5;
display: block;
float: left;
margin: 2px;
}

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

#comments,#coms,#content {
width: 100%;
padding-top: 10px;
padding-bottom: 10px;
margin: 0 auto;
}

#comments a,#coms a,#pagecontent a,#content a {
color: #aaa;
}

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

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

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

#comments li,#coms li {
background: #f5f5f5;
border: 1px solid #545454;
display: block;
margin-bottom: 10px;
padding: 10px;
}

#comments li.alt, #coms li.alt {
background: #f5f5f5
}

.commentcount {
font: 3em Georgia, Arial;
float: right;
color: #222;
}

.commenttext {
padding: 0 25px 0 0;
text-align: justify;
color: #e0e0e0;
font-size: 0.9em;
}

#comments cite, #coms cite {
font-size: 100%;
}

#comments small.commentmetadata, #coms small.commentmetadata {
display: block;
text-align: right;
color: #777;
font-size: 0.7em;
}

#comments input, #coms input, #comments textarea, #coms textarea {
background: #f5f5f5;
border: 1px solid #545454;
color: #ccc;
padding: 3px;
}

#comments textarea, #coms textarea {
width: 95%;
}

#pagecontent li {
font: 0.9em;
margin: 0;
padding: 0 0 0 5px;
color: #fff;
}

#pagecontent a {
color: #aaaaaa;
font: 0.9em;
font-weight: bold;
letter-spacing: 1px;
text-decoration: none;
border-bottom: 0px solid #363636;
padding: 0;
margin: 0;
}

/* testing is the id for all info displayed dynamically below the image (ie post content & categories) */

#tp {
width: 100%;
margin: 0 auto;
padding: 0;
color: #888888;
line-height: 1.6em;
}

#tp a {
color: #883311;
line-height: 1.4em;
text-decoration: none;
}

#tp a:hover {
color: #ee5500;
line-height: 1.4em;
}

#tp h3 {
width: 800px;
margin: 0 auto;
padding: 0;
color: white;
line-height: 2em;
}

#cats li {
font: 0.85em;
margin: 0;
padding: 0 0 0 5px;
color: #444;
padding-left: 10px;
}

#card a, #cats a, #tags a {
color: #444;
line-height:1.2em;
font-weight: bold;
letter-spacing: 1px;
text-decoration: none;
padding: 0;
}

#card a:hover, #cats a:hover, #tags a:hover {
color: #C0C0C0;
}

#card {
color: #444;
font: 0.8em "Helvetica Neue", Arial, sans-serif;
text-transform: none;
margin: 5px auto;
background: #f5f5f5;
border: 1px solid #999999;
visibility: hidden;
}

#cats, #tags {
color: #444;
line-height: 0.9em;
margin: 5px auto;
padding: 0px;
background: #f5f5f5;
border: 1px solid #999999;
visibility: hidden;
}

.randthumbs {
height: 150px;
width: 770px;
margin: 0 auto;
padding: 10px 0 0 0;
}

#tp,#coms_holder,#v-menu {
visibility: hidden;
}

a {
outline: none;
}

#recentcomments a {
color: #646464;
}

#sidebar, #sidebar a {
list-style-type: none;
font: 0.8em Verdana;
text-decoration: none;
padding: 5;
color: #999999;
}

#sidebar h2 {
color: #883311;
font-size: 1em;
}

#sidebar ul li {
list-style-type: none;
list-style-image: none;
margin-left: -35px;
margin-bottom: 0px;
padding-bottom: 5px;
}

#entrynavigation {
font: 0.8em "Helvetica Neue", Arial, sans-serif;
font-weight: normal;
letter-spacing: 2px;
text-align: center;
padding: 20px 0 10px 0;
clear: left;
}

#entrynavigation a, #entrynavigation a:hover {
text-decoration: none;
border-bottom: 0px;
text-transform: uppercase;
}