/*
TABLE OF CONTENTS:
-----------------

	RESETS
	CLEARFIX
	SELECT COLOR
	TYPOGRAPHY
	BUTTONS/LINKS
	IMAGES
	
	HEADER
		NAV
		WELCOME
	
	CONTENT
		SIDEBAR
		LISTS
	
	FOOTER
		ABOVE FOOTER
		FOOTER

*/



/* ----- RESETS ----- */
	html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
	p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
	img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
	dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, figure, figcaption, hgroup, 
	menu, footer, header, nav, section, summary, time, mark, audio, video {
		margin:  0;
		padding: 0;
		border:  0;
	}
	
	article, aside, canvas, figure, figure img, figcaption, hgroup,
	footer, header, nav, section, audio, video {
		display: block;
	}
	
	a img {border: 0;}



/* ----- CLEARFIX ----- */
	/* For modern browsers */
	.clearfix:before,
	.clearfix:after {
		content:"";
		display:table;
	}
	
	.clearfix:after {
		clear:both;
	}
	
	/* For IE 6/7 (trigger hasLayout) */
	.clearfix {
		zoom:1;
	}
	
	
	
/* ----- SELECT COLOR ----- */
	::selection      { background:#300; color:#fff; /* Safari and Opera */ }
	::-moz-selection { background:#300; color:#fff; /* Firefox */ }	
	


/* ----- TYPOGRAPHY ----- */
	body {
		background: #f3f3f3;
		color: #300;
		font: 13px/140% "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
	}
	
	header { color: #f3f3f3; }
		
	h1,h2,h3,h4,h5,h6 {
		font-weight: bold;
		text-transform: uppercase;
	}
	
	h1 {
		font-size: 24px;
		line-height: 48px;
	}
	
	.content h1, h2, aside h2, h3 {
		background: #eee;
		border-bottom: 1px solid #977;
		margin: 10px 0;
	}
		h2, aside h2 {
			font-size: 18px;
			line-height: 36px;
		}
		aside h2 {
			margin: 10px 0 10px -23px;
			padding-left: 23px;
		}
		h3 {
			font-size: 16px;
			line-height: 32px;
		}
		aside h4 {
			font-size: 15px;
			line-height: 45px;
		}
	
	p { padding: 5px 0 10px; }
	
	.important {
		color: #cc9;
		font-style: normal;
		font-weight: bold;
		text-transform: uppercase;
	}
	
	
	
/* ----- BUTTONS / LINKS ----- */
	a 		{ color: #900; text-decoration: none; }
	a:hover { text-decoration: underline; }
	
	
	.btn-large {
		background: #300 url(images/btn-large.png) repeat-x;
		border: 1px solid #6a0000;
		display: inline-block;
		margin: 10px 0 0;
		padding: 10px;
	}
		a.btn-large {
			color: #cc9;
			text-decoration: none;
			text-transform: uppercase;
		}
		.btn-large:hover {
			background: #600 url(images/btn-large_hover.png) repeat-x;
		}
	
	.btn-content {
		background: #300 url(images/btn-content.png) repeat-x;
		border: 1px solid #6a0000;
		display: inline-block;
		margin: 10px 0;
		padding: 5px 10px;
	}
		a.btn-content {
			color: #cc9;
			text-decoration: none;
			text-transform: uppercase;
		}
		.btn-content:hover {
			background: #600 url(images/btn-content_hover.png) repeat-x;
		}



/* ----- IMAGES ----- */
	.img-home, .img-content {
		background: url(images/img-shadow.png) no-repeat;
		padding: 6px 35px 6px 6px;
		float: left;
	}
	
	.img-headshot {
		background: url(images/headshot-shadow.png) no-repeat;
		padding: 6px 35px 16px 6px;
		float: left;
	}
	
	.img-sidebar {
		border: 3px solid #300;
	}
		


/* ----- HEADER ----- */
	/* --- NAV --- */
		header {
			background: #600 url(images/bg.png);
			border-top: 10px solid #160000;
			width: 100%;
		}
		
		.inner-header {
			margin: 0 auto;
			width: 940px;
		}
		
		.logo {
			float: left;
			margin: 34px 0 50px;
		}
	
		ul { list-style: none; }
		
		.nav { float: right; }
		
		.nav li {
			display: block;
			float: left;
			margin: 70px 0 50px 30px;
		}
		
			.nav li a {
				color: #f3f3f3;
				display: block;
				height: 55px;
				text-decoration: none;
				text-transform: uppercase;
			}
			.nav li a:hover, 
			#home .home, 
			#about .about, 
			#services .services, 
			#contact .contact, 
			#order .order {
				background: url(images/nav-bg.png) center 20px no-repeat;
			}
			
				#home .home, 
				#about .about, 
				#services .services, 
				#contact .contact, 
				#order .order {
					background: url(images/nav-bg.png) center 20px no-repeat;
					display: block;
				}
		
		.nav li.order {
			background: none;
			margin-right: 0;
		}
			.nav li.order a { color: #cc9; }
		
		/* NAV DROP DOWN */
		.nav li ul {
			background: #300;
			display: none;
			width: auto;
		}
			.nav li:hover ul {
				display: block;
				margin: 0;
				padding: 0;
				top: 100px;
				position: absolute;
			}
			.nav li:hover li {
			float: none;
			margin: 0;
			padding: 0;
			}
			.nav li:hover li a {
				background: #400;
				border-bottom: 1px solid #6a0000;
				border-left: 3px solid #300;
				height: auto;
				padding: 5px 10px;
				text-transform: none;
			}
			.nav li li a:hover { background: #300; }
	
	/* --- WELCOME --- */
		.intro {
			margin: 0 auto;
			width: 940px;
		}
	
	
		
/* ----- CONTENT ----- */
	.content {
		margin: 50px auto;
		width: 940px;
	}
	
	.articles {
		float: left;
		width: 680px;
	}
	
	.entry { padding-bottom: 50px; }
	
	
	/* --- SIDEBAR --- */
		aside {
			background: url(images/divider-v.png) repeat-y;
			float: right;
			padding-left: 25px;
			width: 200px;
		}
		
		aside li {
			border-bottom: 1px dashed #ccc;
			margin-left: -5px;
			padding: 5px;
		}
		
		aside li:nth-child(odd) { background: #eee; }
		
		#services .services, 
		#contact-lenses .contact-lenses, 
		#eye-health .eye-health, 
		#laser .laser, 
		#eyecare .eyecare, 
		#optical .optical, 
		#laser-faq .laser-faq, 
		
		#mission .mission, 
		#doctors .doctors, 
		#milestones .milestones
		{ color: #300; }
		
		ul li ul li { border-bottom: none; padding: 10px 0 5px 12px; }
	
	
	/* --- LISTS --- */
		.checklist {
			background: #eee;
			border: 1px solid #ddd;
			margin-bottom: 10px;
			padding: 10px;
		}
		
		.checklist li {
			background: url(images/check.png) 0 3px no-repeat;
			padding-left: 20px;
		}
		
		.img-fade {
			display: block; 
			float: left;
		}
			.img-bg { background: url(images/img-bg.png) no-repeat; }
		
		#fade {
			background: #400;
			border-bottom: 3px solid #600;
			list-style-type: none;
			margin: 20px 0;
			padding: 15px;
		}
			#fade li {
				background: url(images/arrow.png) 0 2px no-repeat;
				font-style: italic;
				padding-left: 20px;
			}
		
		
		
/* ----- FOOTER ----- */
	.footer-top, .footer-bottom {
		color: #f3f3f3;
		margin: 0 auto;
		padding: 20px 0;
		width: 940px;
	}
	
	
	/* --- ABOVE FOOTER --- */
	.above-footer {
		background: #6a0000 url(images/bg.png);
		height: 100px;
		margin-top: 30px;
		width: 100%;
	}
	
	.associates {
		float: left;
		width: 500px;
	}
	
	.japanese {
		float: right;
		text-align: right;
		width: 320px;
	}
		
	.above-footer a {
		color: #cc9;
		text-decoration: none;
	}
		.above-footer a:hover { text-decoration: underline; }
	
	
	/* --- FOOTER --- */
	footer {
		background: #160000;
		height: 60px;
		width: 100%;
	}
	
	.copyright {
		float: left;
		width: 620px;
	}
	
	.sitemap {
		float: right;
		text-align: right;
		width: 200px;
	}
		.sitemap a {
			color: #cc9;
			text-decoration: none;
		}
			.sitemap a:hover { text-decoration: underline; }