@import url(reset.css);
@import url(lightbox.css);

body {background: #222; color: #eee; font-family: "Lucida Grande", verdana, sans-serif; font-size: 90%; text-align: center;}
a {color: #39c;}

/* ----- Header */
#header {color: #eee; margin: 20px auto; text-align: left; width: 900px;}
#header a {text-decoration: none;}
#header h1,
#header p.title {font-size: 1.2em; font-weight: bold; margin: 0; padding: 0;}
#header p {font-size: .9em;}

/* ----- Footer */
#footer {color: #eee; font-size: .9em; margin: 20px auto; text-align: left; width: 900px;}
#footer a {color: #f39; text-decoration: none;}

/* ----- Page */
#page {margin: 0 auto; overflow: hidden; padding: 0; text-align: center; width: 900px;} 

#page a {color: #069; text-decoration: underline;}
#page ul {list-style-type: none; margin: 10px 10px 10px 15px; overflow: hidden; padding: 0;}
#page ul li {background: #555; float: left; margin: 5px; padding: 10px; width: 200px;}
#page ul li a img {border: 1x solid #ccc;}
#page ul li.last {margin-right: 0;}

#page.wallpapers {background: none; margin: 0 auto; overflow: hidden; padding: 0; width: 850px;}
#page.wallpapers ul li {background: #fff; border: 1px solid #000; height: 225px; padding: 1px; width: 150px;}

/* ----- iPhone */
.iphone {text-align: left;}
.iphone p img {height: 240px; width: 160px;}

/* ----- Photo + caption */
div.photo-caption {color: #fff; float: left; font-size: 11px; height: auto; margin: 0 20px 20px 0; overflow: hidden; padding: 0; position: relative; width: auto;}
div.photo-caption img {border: 0; margin: 0; padding: 0;}
div.photo-caption a {text-decoration: none;}

/* positioning with bottom & left so the height of the image doesn't need to be fixed */
div.caption-contain {bottom: 20px; height: auto; right: 0px; margin: 0; padding: 0; position: absolute;}
div.full-width {width: 100%;}
div.caption {padding: 10px; position: relative; z-index: 3;} /* needed so the text doesn't inherit the transparency */
.caption-contain p.title {color: #fff; font-size: 22px; font-weight: bold; margin: 0 0 5px;}
.caption-contain p a,
.caption-contain p.title a {color: #fff; text-decoration: none;}
.caption-contain p {margin: 0 0 0 3px; padding: 0;}
.caption-contain p.created {float: none; margin: 0; padding: 0;}

div.transparency {background: #000; border: 0; filter:alpha(opacity=70); opacity: 0.7; -khtml-opacity: 0.7; -moz-opacity:0.7; height: 100%; right: 0px; position: absolute; min-width: 100%; z-index: 2;}

div.caption-left {bottom: 20px; height: auto; left: 0px; margin: 0; padding: 0; position: absolute; right: auto;}
div.text-right {text-align: right;}

/* modifications */
#page.gallery .caption {text-align: right;}
#page.gallery .photo-caption h1 {color: #fff; font-size: 22px; font-weight: bold; margin: 0;}
#page.gallery .lightbox-balance {visibility: hidden;}

/* Gallery styles
	inc. some overrides */
body#gallery {background: #111;}
#gallery #header,
#gallery #page {width: 980px;}
#gallery #header { margin: 10px auto 10px; }
#gallery #header p.title { color: #999; font-size: 1em; font-weight: normal; }
#gallery #header p.title span { color: #fff; }
#gallery #header p.title a { color: #666; }

#gallery div.photo-caption { margin: 0; }
#gallery div.caption-contain { bottom: auto; top: 20px; }

#gallery .caption-contain p {font-size: 14px; text-align: right;} 
#gallery .caption-contain h1 { font-size: 14px; font-weight: normal; margin: 0; padding: 0;}
#gallery #page .caption p a { font-size: 20px; line-height: .8; text-decoration: none; }

#gallery #footer { color: #999; margin: 5px auto 0; width: 980px; }

/* iPhone */
.iphone p {
	margin-bottom: 15px;
}