/* RESET  ============*/
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, 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-weight: inherit; font-style: inherit; font-family: inherit; vertical-align: baseline;}
html {font-size:100.01%;}
/* remember to define focus styles! */
:focus {outline: 0;}
body {line-height: 1em; color: black; background: black;}
ol, ul {list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
:link img {border: 0px none;}
img, a img {padding:0; margin:0; border:none; display:block;}
strong {font-weight:bold;}
em {font-style:italic;}

/* MAIN TYPOGRAPHY  ============*/

p, h1, h2, h3 {font-family:Arial, Helvetica, sans-serif;}

p {
	font-size:12px;
	line-height:1.4em;
	margin:0 0 1.2em 0;
}

p a, p a:visited {color:#361505;}

ul li, ul li a {
	font-size:12px;
	line-height:1.4em;
	margin:0;
}


h1 {
	font-size:1.5em;
	line-height:1.5em;
	font-weight:normal;
	margin-top:0;
}


h2 {
	color:#5d4832;
	font-size:1.2em;
	line-height:1.2em;
	font-weight:bold;
	margin:0.8em 0;
}

h3 {
	font-size:0.8em;
	line-height:1.4em;
	font-weight:normal;
	color:#8b5c29;
}

h4 {
	font-size:0.8em;
	line-height:1.4em;
	font-weight:bold;
	color:#8b5c29;
}


/*  MAIN LOGO IMAGE REPLACEMENT */

#logo { /* Main LDA logo */
	background: url(http://perspectivesvisionclinic.com/images/site/logo.png) top right no-repeat;
	position:absolute; left:-142px; top:-122px;
	width:520px; height:278px;
	text-indent:-9000px;
}
	#logo a {width:520px; height:278px; display:block;}
	

/* MAIN TAGS AND ID'S  ============*/

body {
	background:#361505 url(images/site/bodygrad.gif) left top repeat-x;
	font-family:Arial, Helvetica, sans-serif;
	margin:0;
	padding:60px 0;
	min-height:1200px;
	position:relative;
}



#page { /* this is main orange area that wraps the white content area */
	background:#ffa849 url(images/site/pagedropshadow.gif) top right repeat-y;
	width:790px; height:auto;
	margin:0px auto;
	position:relative;
	padding:20px 0 0 0;
}

#main { /* the white area that holds most of the content  */
	background:white;
	width:750px;
	margin:0 auto 0 auto;
	position:relative;
}

#header { /* the white area at the top that holds the logo with nav above */
	width:100%; height:100px;
	background:white;
	padding:0;
	margin:0 auto 0 auto;
	position:relative;
}

#splash { /* the brown area on the home page with the big image */
	width:100%; height:330px;
	background:#361505 url(http://img.perspectivesvisionclinic.com/images/site/splashgrad.gif) right bottom no-repeat;
	border-bottom:3px solid yellow;
	padding:0 0 0 0;
	margin:40px auto 0 0;	
	position:relative;
}
	#splash p.lead { /* the tab that sticks out of the splash "now open.." etc */
		background:#361505;
		position:absolute; top:-30px; right:100px;
		color:white;
		font-size: 14px;
		line-height:32px;
		padding:0 20px;
	}
	#splash img {position:absolute; top:25px; left:-38px;}


#content { /* wrapped div that actually holds the content */
	width:100%;
	margin:0 auto;
	position:relative;
	height:auto;
	padding:0;
	overflow:visible;
}
	#content.sub {border-top:1px transparent solid; padding:10px 0 60px 0;}
	#content.sub p, #content.sub h2 {padding:0 25px 0 350px;} /* so images will be able to be floated to the left */
	#content.sub h1 {/* big section headers */
		color:#9c0e01; font-size:20px; line-height:20px; margin:0; padding:0 25px 0 350px;
	}
	#content.home p, #content.home h2 {padding:0;} /* content is wrapped by rightcol and leftcol, so padding isn't needede */

	#rightcol {
		width:400px;
		padding:1px 20px 70px 20px;
		background:#ccc;
		color:black;
		margin:0 0 0 auto;
	}

	#content.sub img {float:left; border:5px solid #ccc; margin-left:20px;}
	#rightcol img {padding-bottom:12px;}
	
	#leftcol {width:250px; padding:1px 20px 20px 20px; float:left;}
		#leftcol ul { margin:-12px 0 8px 0;}
		#leftcol li {margin-left:20px;}
		#leftcol li, #leftcol li a { font-weight:bold; color:black; text-decoration:none; }
		#leftcol li a:hover {color:#9c0e01; text-decoration:underline;}
	
	#content h2 { /* Red subheaders */
		font-size:14px; line-height:18px; color:#9c0e01; margin:20px 0 4px 0; padding:0;
	}


/*  FOOTER elements  */

#footer {
	background:#ffa849 url(images/site/bottomdropshadow.gif) top right no-repeat;
	color:white;
	width:100%; height:40px;
}


/*    NAVIGATION     */

#topnav {/* HOME  SERVICES   STAFF   HOURS  GALLERY  */
	background-color:#ffa849;
	position:absolute; top:-38px; right:0px; height:38px;
	padding-right:0px;
	width:auto;
}

	#topnav ul li {
		background-color:#ffa849;
		float:left; 
		padding:0 12px; 
		color:#361505; 
		font-size:13px; 
		height:38px; font-weight:bold;
	}
	#topnav ul li.selected {background-color:white; background-image:none; color:#f53a00;}
	#topnav ul li.selected a {color:#361505;}
	#topnav ul li.homeselected {background-color:white; background-image:none; color:#361505;}
	#topnav ul li.homeselected a {color:#361505;}
	#topnav ul li a {height:38px; color:#361505; text-decoration:none; line-height:38px;}