/* 
   befog.org stylesheet
   (cc) 99-07 zeke runyon
*/

/* ----------------------- */
/* universal layout & text */
/* ----------------------- */

html { background: #0a0c09; } /* this is for omniweb & safari's background sketchiness */

body {
	background: #0a0c09;/*#0f120d, #151a13*/
	text-align: center;
	font: 11px/14px "lucida grande", verdana, sans-serif;
}

#waterproof {
	width: 764px;
	margin: 0 auto;
	padding: 0;
}

h1 { display: none; height: 0; width: 0; }

#menu {
	height: 28px;
	background: url(/images/logo.gif) no-repeat top left;
	text-align: right;
}

#menu a.on {
	color: #ebe8d8;
	font-weight: bold;
	border: none;
}

#foot { 
	font-size: 9px;
	color: #31362e;
	border-top: 1px solid #161914;
	margin-top: 16px;
	padding-top: 4px;
}

#foot a, #foot a:hover { color: #31362e; border-color: #31362e;}

a img { border: 0; }

sup {
	color: inherit;
	font-size: 9px;
	line-height: 9px;
	font-weight: normal;
}

h1, h2, h3, h4, h5, h6 { font-weight: normal; }

h2 {
	color: #ded7b5;
	font-size: 14px;
}

h2 span { color: #7d744f; }

h4 { 
	color: #111;
	font-size: 11px;
	line-height: 11px;
	margin: 0;
	text-align: center;
	font-weight: bold;
}

label, .smallcaps, #photoInfo strong { 
	/*color: #111;*/
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 9px;
}

.clearing { clear: both;}

p {
	/*margin: 0 auto 10px auto;*/
	color: #7d744f;
	text-align: left;
}

p span { color: #534d34;}

.center { text-align: center; }

p a {
	color: #a7a287;
	text-decoration: none;
	border-bottom: 1px solid #494634;
}

p a:hover { border-bottom: 1px solid #69654e; }


/* -------------- */
/* author section */
/* -------------- */

fieldset {
	background: #dbd2a3;
	border: 1px dotted #838064;
	width: 500px;
	margin: 0 auto 10px auto;
	padding: 5px;
	text-align: left;
}

input[type="text"], input[type="password"] { background: #eaf6d1; }

fieldset.login { 
	margin-top: 250px;
	margin-bottom: 250px;
	width: 228px;
}

.buttons { text-align: right; }

img.singleThumbnail {
	float: left;
	width: 70px;
	height: 70px;
	padding: 5px;
	background-color: #fefefe;
	border: 1px solid #aaa;
	margin: 0 10px 10px 0;
}

table { 
	width: 100%;
	background: #dbd6bf;
}

tr, td { 
	margin: 0;
	background: transparent;
}

td { padding: 4px; }

/* ---------- */
/* index view */
/* ---------- */

.thumbnails img {
	border: 0;
	border-right: 1px solid #c9c3a2;
	border-bottom: 1px solid #c9c3a2;
	float: left;
	width: 70px;
	height: 70px;
	margin: 0;
	padding: 0;
}

.thumbnails img.top { border-top: 1px solid #c9c3a2; }
.thumbnails img.left { border-left: 1px solid #c9c3a2; }

.thumbnails {
	width: 711px;
	margin: 0 auto;
	padding: 0;
}

/* ------------ */
/* photo viewer */
/* ------------ */

sup { font-size: 9px; }

#photo {
	z-index: 1;
	padding: 6px;
	margin: 0 auto;
	border: 1px dotted #838064;
	background: #dbd2a3 url(/images/photoviewer-gradient.gif) repeat-x;
	background-position: bottom;
	text-align: left;
	position: relative;
	bottom: 22px; /* compensate for the arrow images */
}

#thePhoto img { 
	/*border: 1px solid #56543d;*/
	border: 0;
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity=0);
}

#thePhoto {
	background: #0a0c09 url(/images/loading.gif) no-repeat center center;
}

#photo p {
	color: #000;
	margin: 5px 0 0 0;
	padding: 0;
	/*line-height: 11px; this makes IE6 cut off the text*/
	float: left;
}

#photo p span { color: #444; }

#left, #right {
	opacity: 0.2;				/* decimal */
	-moz-opacity: 0.2;
	filter: alpha(opacity=20);  /* percentage */
	position: relative;
	width: 22px; height: 19px;
}

#toggleSwitch { 
	position: relative;
	top: 4px;
	display: inline;
	float: right;
	width: 17px;
	height: 17px;
}

a#toggleSwitch { background: #eae4c5; }/*eae4c5*/
a#toggleSwitch:hover { background: #f3f2ea; }

/* having two nested containers seems to improve reliability of the slide effect */
#photoInfoContainer {
	width: 320px;
	position: relative;
	top: -27px;
	z-index: 0;
	margin: 0 auto;
}

#photoInfo {
	background: #aca47c;
	border: 1px solid #c9c3a2;
	padding: 3px;
	text-align: left;
}

#photoInfo strong {
	font-weight: normal;
	color: #444;
}

ul { 
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid #c9c3a2;
	background: #dbd6bf;
}

li { 
	margin: 0;
	padding: 2px 4px;
	background: transparent;
}

li.odd, tr.odd td { background: #eae4c5; }

/* buttons code adapted from daringfireball stolen from waferbaby */
ul#buttons {
	list-style: none outside;
	padding: 0;
	display: inline;
	margin: 0 auto;
	border: none;
	/*height: 20px;  setting a height makes it act like a block*/
}

#buttons li {
	display: inline;
	padding: 0;
	margin: 0;
}

#buttons li a {
	text-decoration: none;
	text-align: center;
	/*float: left;
	display: block;*/
	min-width: 35px;
	padding: 1px 15px 2px 15px;
	margin: 0;
	margin-right: -5px;
	background: #dbd2a3;
	color: #444;
	border: 1px dotted #838064;
}

#buttons li a:hover {
	background-color: #eae4c5; /*#afad96;*/
}

#buttons li a.selected, #buttons li a.selected:hover {
	color: #000;
	font-weight: bold;
	background: #dbd6bf;
}


#photoInfo a, #photo p a,
td a {
	color: #444;
	text-decoration: none;
	border-bottom: 0;
}

#photoInfo a, #photo p a, td a { border-bottom: 1px solid #8a897b; }
#photoInfo a:hover, #photo p a:hover, td a:hover { border-bottom: 1px solid #61604f;}

/* ---- */
/* tags */
/* ---- */

.cloud {
	text-align: justify;
}

.cloud a {
	text-decoration: none;
	vertical-align: middle;
	line-height: 25px;
}

.t1 { color: #f8f6ee; font-size: 36px; }
.t2 { color: #ebe8d8; font-size: 28px; }
.t3 { color: #e2dec7; font-size: 22px; }
.t4 { color: #c4bd9b; font-size: 18px; }/*ded7b5*/
.t5 { color: #554e31; font-size: 10px; }/*7d744f*/

/* .t6 { color: #554e31; font-size: 10px; line-height: 15px; } */