/* CSS file for Woolf's Eye Digital Arts trial site */

body {
	width:97%;
	min-width:825px;
	margin-top:0;
	background-image:url(images/grass_bg_2.jpg);
/*	background-color:lightgreen;
	border:10px solid seagreen; */
	}

#wrapper {
	padding:0 10px 10px 10px;
/*	border:thin solid black;
	background-color:#eeeeee;*/
	}
	
#header {
	height:120px;
	margin:0 2%;
	text-align:center;
	font-style:italic;
	color:darkblue;
	background-image:url(images/header_bg.jpg);
/*	border:4px solid black; */
	}
	
/* Div IDs for the title text at the top of each topic page.

Wolf picture is always centered left.  Next to it, "Woolf's Eye Digital Arts" in medium-size text, fantasy font.  Lower, larger, and centered is the page title.
*/

#logo {
	font-size:150%;
	font-family:"Comic Sans MS", fantasy;
	font-weight:bold;
	text-align:center;
	color:blue;
	}
	
#pagetitle {
	font-size:250%;
	margin-top:0;
	font-weight:bold;
	font-family:"Comic Sans MS", fantasy;
	color:darkblue;
	text-align:center;
	}
	

#leftear {
	float:left;
	}	

#rightear {
	float:right;
	}


	
#navbar {
	float:left;
	width:120px;
	margin:0;
	padding:15px;
/*	background-color:silver;*/
	}
	
#navtop {
	margin:0;
	width:123px;
	background:url(images/navbox_top.png) no-repeat top left;
	}

#navbody {
	margin:0;
	width:120px;
	background-color:silver;
	border-left:1px solid black;
	border-right:2px solid black;
	}

#navbottom {
	width:123px;
	margin:0;
	margin-top:-0.9em;
	padding-top:1em;
	background:url(images/navbox_bottom.png) no-repeat bottom left;
	}
	
	
.navbtn {
	width:100%;
	display:block;
	margin:0;
	padding:0;
	text-align:center;
	}
	
.navbtn a {
	width:90px;
	margin: 0 5px 1em 5px;
	padding:5px 4px;
	display:block;
	font-size:0.8em;
	border:5px outset blue;
	background-color:lightgray;
	}

.navbtn a:hover {
	color:green;
	display:block;
	border:5px inset green;
	}
	
.currbtn {
	width:90px;
	margin: 0 5px 1em 5px;
	padding:5px 4px;
	display:block;
	font-size:0.8em;
	text-align:center;
	border:5px inset gray;
	color:darkgreen;
	background-color:lightgray;
	}

/* min-width of the page as a whole is set to 800px.  The menu is fixed at 120px, so the main content window has 680px to work with.  */  

#content {
	min-width:680px;
	margin:1em 25px 0 157px;
	clear:right;
	background-color:#eeeeee;
	padding:5px 15px;
	}

#content p {
	text-indent:30px;
	}
	
/* Classes and IDs for the home page */

#content h2 {
	margin-left:35%;
	font-family:"Arial", san-serif;
	}

#svcs {
/* Unordered list of services */
	margin-left:5px;
	list-style-type:circle;
	}

#svcs h1 {
	font-size:120%;
	font-family:"Times New Roman",serif;
	}
	
#photo {
/* Photography service blurb */
	margin-left:10px;
	width:500px;
	}
	
#web {
/* Web Design service blurb */
	margin-left:40px;
	width:500px;
	}

#webpopup {
/*Web Design popop window, appears at center screen */
	position:absolute;
	top:250px;
	left:400px;
	z-index:2;
	display:block;
	width:600px;
	height:250px;
	background-color:tan;
}

	
#write {
/* Writing service blurb */
	margin-left:70px;
	width:500px;
	}
	
#PC {
/* Tech Support service blurb */
	margin-left:100px;
	width:500px;
	}


/* Classes and IDs for sub-pages */


#upper {
	width:95%;
	margin:0;
	padding:0 0 0 15px;
	clear:right;
	}
	
#leftbox {
	float:left;
	width:41%;
	margin:0;
	padding:0 5px 0.5em 5px;
	}

.lbtext {
	border: thick solid blue;
	margin:30px 0 0 0;
	padding:15px 15px;
	text-align:center;
	color:darkblue;
	font-size:medium;
	font-family:"Comic Sans MS", fantasy;
	font-weight:normal;
	}

.lbtext h4 {
	}
	
#rightbox {
	width:53%;
	float:right;
	margin:0;
	padding:0.5em 10px 0 15px;
	clear:right;
	}	

#lower {
	clear:both;
	}	
	
#f-gutter {
	margin-left:25%;
	text-align:center;	
}


#footer {
	width:67%;
	text-align:left;
	font-size:75%;
	padding:5px 25px;
	color:darkblue;
	background-color:antiquewhite;
	}
	

	
/* styles for photo lists on sampler individual pages */

#thumblist {
	list-style-type:none;
	margin:5px;
	padding:1px;
	font-family:"Times New Roman",serif;
	font-size:small;
	}

.thumb {
	margin-bottom:10px;
	text-align:center;
	}

.thumb a {
	text-decoration:none;
}


#largelist {
	list-style-type:none;
	margin:5px;
	padding:1px;
	overflow:hidden;
	}
	
.largephoto {
	width:575px;
	height:460px;
	color:black;
	text-align:center;
	}	
	
.largephoto p {
	width:560px;
	text-align:left;
	font-size:0.9em;
	}

.tag {
	font-size:0.7em;
	font-style:italic;
	}
	
.wk_item {
	margin-top:1em;
	margin-right:25px;
	clear:right;
	}
	
	
.l_thumb {
	float:left;
	margin-right:15px;
	}

.r_thumb {
	float:right;
	margin-left:15px;
	}
	
/* The pagebtn style is used for internal navigational links on all pages: a 'button' look with silver background and silver-gray borders */

.pagebtn {
	}

.pagebtn a {
	text-align:center;
	text-decoration:underline; 
  	display:block; 
	width:90px;
	font-size:0.75em;
  	color:darkgreen; 
  	background-color:silver; 
  	border:3px solid;
  	border-color:#def #678 #345 #cde;
  	padding:5px;
	}

.pagebtn a:visited {
  color:darkgreen; 
  }

.pagebtn a:hover {
	display:block;
  color:#fff;
  border-color:#345 #cde #def #678; 
  }


#wrapper #content #lower #pricelist {
	list-style-type: circle;
}


#addr_block {
	margin:1em 25px 2em 25px;
	font-family: "Courier New",monospace;
	font-size:12px;
	}
	

#horses {
	padding-top:25px;
	}