/* CSS Document */

/*portion of eric myer resets
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}

div.clear-floats {
	clear: both;
}


body {
	margin:0 auto;
	text-align:center;
	width:800px;
	background-color:#DED5C3;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	padding-top: 40px;
	
}

div#wrapper {
	text-align:left;
	width:928px;
	background-image:url(../img/landscapestrip.jpg);
	background-repeat:repeat-y;
	background-position:right;
	z-index:+1;
}
/*<!--	This is the header-->*/
div#header {
	color:#999999;
	font-size: 14px;
	text-align: left;
	text-indent:-9999px;
	background-image:url(../img/diane-hoffman.png);
	height:50px;
	width: 200px;
	background-repeat:no-repeat;
	float:left;
	position:absolute;
	float:left;
	z-index:1;
	left:0;
	top:-4px;}
	
	
/*div#header{
width:300px;
height:40px;
background-image:url(../img/diane-hoffman.png);
background-repeat: no-repeat;
background-position: 25px top;
text-indent: -9999px;*/


/*--------------this nav bar____________*/

div#navbar { 
	width:180px;
	background-image:url(../img/bg-scumble.png);
	float:left;
	position:absolute;
	z-index:1;
	left:50px;
	top:40px;
	text-align: left;
	}

div#navbar ul {
	list-style-type:none;
	
	
}

div#navbar ul li{

	}
	
div#navbar ul li a:link, div#navbar ul li a:visited {

	color:#DE701E;
	display:block;
	height:10px;
	letter-spacing:2px;
	line-height:10px;
	padding:10px 10px 10px 20px;
	text-decoration:none;
}


div#navbar ul li a:hover, div#navbar ul li a:active {
	color:#DE701E;
	display:block;
	height:10px;
	letter-spacing:2px;
	line-height:10px;
	padding:10px 10px 10px 20px;
	background-color:#FFFFFF;
	background-repeat: repeat;
	text-decoration:none;

}
/*--------------this is for the footer block____________*/
div#footer ul {
	color: #DE701E;
	text-align:center;
	bottom:0;
	left:0;
	padding: 5px;
	/*position:fixed;(this is to put the footer on the lower edge of the window, doesnt work well with i phone*/
	width:100%;
	background-color:#F7F7EB;
	font-size:9px;
	letter-spacing:1px;

}

div#footer ul li a:link, div#footer ul li a:visited {
	color:#DE701E;
}

div#footer ul li a:hover, div#footer ul li a:active {
	color:#DE701E;
}

/*--------------this is for the content image and list and text block____________*/
div#content {
	left:308px;
	width:720px;
	top:40px;
	background-color:#E7E1D6;
	padding-top:10px;
	padding-left: 120px;
	padding-bottom:20px;
	z-index:-1
}


/*this is the content ul and li for resume*/
div#content ul {

	list-style-type:none;
	padding-bottom: 10px	
	}
	
div#content ul li{ 
	color:#666666;
	line-height:14px;
	padding-bottom: 10px;
	}
	
	
	
div#content ul li a:link, div#content ul li a:visited  {

	color: #DE701E;
	text-decoration:none;
}

div#content ul li a:hover, div#content ul li a:active {
	color:#DE701E;
	text-decoration:none;
	}
	
		
/*this is the content paragraph like artistatement */
div#content p{
	line-height: 20px;
	width:600px;
	color:#666666;
	}
	
div#content h2,div#content h3, div#content h5 {
	padding-bottom:10px;
	padding-top: 10px;
	color:#666666;
	}
	
	h2 {
	font-size:14px;
	font-family:tahoma;
	font-weight:lighter;
	}	
	h3 {
	font-size:11px;
	font-weight:bold;
	
	}
	
/*-----------------------------this is for the content area like portfolio---------------------------- */	
div#content img{
	height: 440px;}
	
div.artwork p {
	text-align:center;
	color:#999999;
	bottom: 0;
	width: 100%;
	padding-top: 3px;}
	
	/*-----------------------------this is for the content list of images like history---------------------------- */	
	
	div#content div.listwithpictures img{ 
	height:150px;
	display: block;
	padding-bottom:5px;}
	
	div.listwithpictures  ul li { 

	width: 20px;
	height:210px;
	background-color:#F7F7EB;
	/*font-weight: bold;*/
	width:150px;
	float:left;
	margin-right: 20px;
	margin-bottom: 20px;
	text-align:center;
	}

	
div#content div.listwithpictures ul li a:link, div#content div.listwithpictures ul li a:visited  {

	color: #DE701E;
	text-decoration:none;
	display:block;
}

div#content div.listwithpictures ul li a:hover, div#content div.listwithpictures ul li a:active {
	color:#DE701E;
	text-decoration:none;
	background-color:#FFFFFF;
	display:block;
	}
	
	/*this is the nav bars (forward and backward << >>)  bars in content portfolio pages pages*/
	
div#content p a:link, div#content p a:visited {
	color:#DE701E;
	font-size: 10px;
	display: inline;
	line-height:10px;
	width: 20px;
	background-color:#F7F7EB;
	font-weight: bold;
	text-decoration:none;
	margin: 4px;
	padding-left: 4px; 
	padding-right: 4px;
	}
	
	
	div#content p a:hover, div#content p a:active {
	color:#DE701E;
	font-size: 10px;
	display: inline;
	line-height:10px;
	width: 20px;
	background-color:#FFFFFF;
	font-weight: bold;
	text-decoration:none;
	margin: 4px;
	padding-left:4px;
	padding-right: 4px;
	
	} 
	
	/*this is a class with a smaller image and more type like the contact page*/
div#content div.artworkwithtextblock img{
	height:350px;
	
}

div#content div.artworkwithtextblock p {
	color:#666666;
	bottom: 0;
	width: 100%;
	padding-top: 3px;
}
div#content div.artworkwithtextblock h4 {
	color:#666666;
	bottom: 0;
	width: 100%;
	padding-top: 10px;
}



div#content div.picturelist img{
height:250px;
	display: block;
	padding-bottom:0px;
	}
	
div#content div.picturelist ul li { 
/*	width: 20px;
	height:210px;*/
	/*font-weight: bold;*/
	float:left;
	margin-right: 20px;
	margin-bottom: 20px;
	text-align:center;
	
	
}