html {
	overflow: -moz-scrollbars-vertical;
}

body{
	background-image: url( ../img/stripes.png ); 
	background-position: center; 
	background-repeat: repeat-y; 

	margin: 0px; 
	text-align: center;
	min-width: 790px; 
}

#footer{
	clear: right; 
	text-align: left;
	margin-left: 5px;
	font-size: 12px;
}

span.paging{
	font-size: 12px; 
}

#toptop{
  text-align: left;
  width: 790px;
  margin-left: auto;
  margin-right: auto;
}

#quickLinks a{
	color: black;  
	font-size: 12px; 
}

#quickLinks{
	margin-top: 8px; 
	text-align: right; 
}


/**
 * The headers for the boxes on the main page
 */
div.photoOfDayHeader{
	background-color: black; 
}

div.blogHeader{
	background-color: #00edff; 
}

div.featuresHeader{
	background-color: #00ff33; 
}

div.profilesHeader{
	background-color: #ff9933;
}

div.archiveHeader{
	background-color: #ff3333; 
}

div.commentsHeader{
	background-color: #00edff; 
}

div.contactHeader{
	background-color: #00edff; 
}

div.mailToFriendHeader{
	background-color: #00ff00; 
}

div.pageHeader{
	height: 24px; 
	padding: 3px; 
	text-align: right; 
	width: 784px; 
}

div.boxHeader{
	height: 22px; 
	padding: 4px 4px 4px 10px; 
}

#photoOfDayBox{
	float: left; 
	width: 304px; 
	background-color: #f0f0f0; 
	margin-bottom: 3px; 
}

#photoOfDayBox #photoOfDay{
	border: 4px solid black; 
	border-top: 0px solid white; 
}

#blogBox{
	background-color: white; 
}

#blogBox #blog{
	background-color: #e5f5ff;
	padding: 10px; 
	border: 4px solid #e5f5ff; 
	border-top: 0px solid white; 
}

#tocBox{
	border: 4px solid black;
	background-color: #555;
}

#tocBox td{
	font-size: 12px;
	color: white;
}

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

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


#tocBox a.active{
	background-color: #444;
}


#featuresBox{
	float: left; 
	width: 392px;
	background-color: #00ff33; 
	padding: 0px; 
	margin: 0px; 
}


#featuresBox table{
	margin: 0px 4px 4px 4px; 
	background-color: #ffff00; 
    height: 90px; 
}

#featuresBox .thumb{
	width: 170px; 
	height: 90px; 
}

#featuresBox .thumbBig{
	width: 170px; 
	height: 184px; 
}

#featuresBox .text{
	padding-top: 5px; 
	padding-bottom: 5px; 
	padding-left: 10px; 
	height: 80px; 
	overflow: hidden; 
	font-size: 12px;
	vertical-align: top; 
	width: 100%; 
}

#featuresBox a{
	color: #f84d2d; 
}

#profilesBox{
	float: left; 
	width: 393px; 
	margin-left: 5px; 
	background-color: #ff9933;
}

#profilesBox table{
	margin: 0px 4px 4px 4px; 
	background-color: #ffffff; 
    height: 43px; 
}

#profilesBox .thumb{
	width: 81px; 
	height: 43px; 
}

#profilesBox .thumbBig{
	width: 81px; 
	height: 90px; 
}

#profilesBox .text{
	padding-top: 5px; 
	padding-bottom: 5px; 
	padding-left: 10px; 
	width: 290px; 
	height: 30px; 
	font-size: 12px;
}

#profilesBox .text a{
	color: black; 
	font-weight: bold; 
	text-decoration: none; 
}

#profilesBox .text a:hover{
	text-decoration: underline; 
}

#profilesBox a{
	color: #f84d2d; 
}


#mailToFriendBox{
  float: right; 
  margin-top: 5px; 
  width: 385px; 
  border: 4px solid #00ff00; 
  background-color: #00ff00; 
  margin-bottom: 20px; 
}

#mailToFriendForm{
  background-color: #ffff00; 
  border-top: 4px solid #ffff00; 
  padding-bottom: 5px; 
}

#mailToFriendForm form{
  margin: 0px; 
}

#mailToFriendBox td{
  font-size: 12px; 
  font-weight: bold; 
}

#mailToFriendBox .inputField{
  border: 0px solid white; 
  width: 270px; 
}

#mailToFriendBox .textArea{
  border: 0px solid white; 
  width: 270px; 
  height: 120px; 
}

#mailToFriendForm2 .inputField{
  border: 1px solid black; 
  width: 370px; 
}

#mailToFriendForm2 .textArea{
  border: 1px solid black; 
  width: 370px; 
  height: 120px; 
}

#mailToFriendForm form{
  margin: 0px; 
}

#commentsBox{
  clear: both; 
  border: 4px solid #00edff;
  margin-top: 5px; 
  background-color: white; 
}

#commentsBox .comment{
  border-top: 4px solid #00edff; 
  padding: 5px; 
  padding-top: 15px; 
  background-color: white; 
}

#commentsBox .commentBy{
  margin-top: 5px; 
  font-size: 12px; 
  font-weight: bold; 
}

#commentsBox .commentDate{
  font-size: 12px;
  color: #555555; 
}

#commentsBox .commentMessage{
  clear: both; 
  padding-top: 3px; 
  font-size: 90%; 
}

#yourComment{
  padding-top: 15px; 
  border-top: 4px solid #00edff; 
  width: 100%; 
}

#yourComment td{
  font-size: 12px; 
  vertical-align: top; 
}

#yourComment .inputField{
  border: 1px solid black; 
  width: 270px; 
}

#yourComment .textArea{
  border: 1px solid black; 
  width: 270px; 
  height: 120px; 
}

/********************
The box that warns you if you're logged in and see the preview of some page
********************/
#previewWarning{
  background-color: white; 
  border: 2px solid red; 
  padding: 2px; 
  margin-bottom: 4px; 
}



/********************
Make the rss icon appear only when somebody hovers over the blog bar 
********************/

div.blogHeader img.rss{
	display: none; 
}

div.blogHeader:hover img.rss{
	display: inline; 
}


/*****************
The things floating around in the photo of the day header
*****************/
#photoTitle{
	float: right; 
	font-size: 12px; 
	padding-top: 4px; 
	color: white; 
	padding-right: 20px; 
}

#photoLinks{
	color: white; 
	float: right; 
	font-size: 12px; 
	padding-top: 4px; 
}


#photoLinks a.enabled{
	color: white; 
	text-decoration: underline; 
	cursor: pointer; 
}

#photoLinks a.disabled{
	color: #999999;
	cursor: default; 
	text-decoration: none;
}


a.email{
  padding-left: 20px; 
  background-image: url( ../img/email.png ); 
  background-repeat: no-repeat; 
}

a.comment{
  padding-left: 20px; 
  background-image: url( ../img/comment.png ); 
  background-repeat: no-repeat; 
}

a.toc{
  padding-left: 20px; 
  background-image: url( ../img/toc.png ); 
  background-repeat: no-repeat; 
}



/*******************
SEARCH STYLES 
*******************/
#search{
	margin-top: 5px;
}


#searchField{
	font-size: 12px;
	font-family: arial, helvetica;
	border: 2px solid #ccc;
	text-decoration:none;
	padding-left: 1px; 
}

#searchResults{
	display: none; 
	z-index: 1000;
	border: 2px solid black;
	color: black;
	width: 300px;
	max-height: 400px; 
	overflow: auto;
	margin-left: -1px;
	margin-top: 2px;
}

#searchResults .result{
}

#searchResults .result a{
	color: #555;
	display: block;
	text-decoration: none;
	padding-left: 10px;
	padding: 2px 2px 2px 15px;
	font-size: 13px;
	opacity: 1;
	border-bottom: 1px dotted #ccc;
}

#searchResults .result a:hover{
	background-color: red;
	border-color: red;
	color: white;
}

#searchResults .result_0{
	background-color: #f5f5f5;
}

#searchResults .result_1{
	background-color: #eee;
}