/*******Elements********/
body { background: #52A39B url(/images/header-background-trans.png) repeat-x; font: 75%/1.6666em 'MergeRegular', Arial, Verdana, sans-serif; color: #fff; }
h2 { margin: 25px 0 15px; font-size: 2.4em; color: #fff; }
	h2:first-of-type { margin-top: 0; }
a { color: #fff; text-decoration: none; transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; }
	a:hover { color: #ccc; }

/*******Layout********/
#container {  }
#content { margin-top: 32px; background: #856B4A url(/images/main-texture.png) 50% 0; }

header, #main { width: 960px; margin: 0 auto; }

/*******Header********/
	header h1 { float: right; width: 374px; height: 71px; margin: 15px 0 0; }
		header h1 a { display: block; width: 100%; height: 100%; background: url(/images/name-logo.png) no-repeat; text-indent: -9999px; }
	header nav ul { position: absolute; top: -2px; width: auto; }
	header nav ul li { float: left; width: 145px; padding: 65px 20px 70px; }
		.home header nav ul li.home, .services header nav ul li.services, .contact header nav ul li.contact { background: url(/images/bookmark.png) no-repeat; }
	header nav ul li a { display: block; margin: 0 auto; font-size: 2.3em; text-decoration: none; text-align: center; }
		.home header nav ul li.home a:hover, .services header nav ul li.services a:hover, .contact header nav ul li.contact a:hover { color: #fff; }

/*******Main********/
#main { padding: 75px 0 50px; overflow: auto; clear: both; }
	#main p { margin-bottom: 1.3em; font-size: 1.7em; line-height: 1.5em; color: #fff; }
	#main p img, #main a.map { border: 10px solid #fcfcfb; box-shadow: 5px 5px 15px rgba(0,0,0,0.5); -webkit-box-shadow: 5px 5px 15px rgba(0,0,0,0.5); -moz-box-shadow: 5px 5px 15px rgba(0,0,0,0.5); -o-box-shadow: 5px 5px 15px rgba(0,0,0,0.5); }
	#main p img { display: block; float: right; margin: 0 20px 20px; }
	#main img#monogram { display: block; float: left; width: 271px; margin: 0 170px 40px; }
	#main a.map { display: block; float: left; margin: 0 20px 20px 0; }
		#main a.map img { margin: 0; border: 0; box-shadow: 5px 5px 15px rgba(0,0,0,0); -webkit-box-shadow: none; -moz-box-shadow: 5px 5px 15px rgba(0,0,0,0); -o-box-shadow: 5px 5px 15px rgba(0,0,0,0);}

/*******Footer********/
footer { padding-top: 15px; background: url(/images/footer-background-trans.png) repeat-x; }
	footer p { width: 960px; margin: 0 auto; font-size: 1.2em; color: #333; text-align: right; }
		footer p#copyright { position: relative; top: -1.55em; z-index: -1; text-align: left; }
	footer p a { color: #333; text-decoration: none; }
		footer p a:hover { color: #111; }

/*******Media Queries********/
/*  iPad  */
@media all and (max-width: 64em) {
	body { color: #090; }
	header, #main { width: 96%; margin: 0; }
	header { width: 100%; }
	header h1 { margin-right: 10px; }
	#main { padding-left: 2%; padding-right: 2%; }
	#main p img, #main a.map { width: 35%; height: auto; }
	#main p img { margin-right: 0; }
	#main img#monogram { width: 25%; height: auto; margin: 0 17% 40px; }
	#main p a.map img { width: 100%; height: auto !important; }
	footer { min-height: 50px; }
		footer p { width: auto; margin-right: 15px; float: right; }
		footer p#copyright { position: static; top: auto; float: none; margin-left: 15px; margin-right: 0; }
}

@media all and (max-width: 60em) {
	#main { padding-top: 50px; }
	header nav ul { top: 4px; }
	header nav ul li { width: 120px; margin-right: -15px; padding: 48px 10px 70px; }
		.home header nav ul li.home, .services header nav ul li.services, .contact header nav ul li.contact { background-image: url(/images/bookmark-small.png); }
	header nav ul li a { font-size: 1.6em; }
}

@media all and (max-width: 48em) {
	header h1 { position: relative; top: 112px; float: none; margin: 32px auto 20px; }
	#main { padding-top: 120px; }
	#main img#monogram { display: none; }
	footer { padding-top: 20px; }
	footer p, footer p#copyright { margin: 0 0 5px 10px; float: none; text-align: left; }
}

/*  iPhone  */
@media all and (max-width: 36em) {
	#main { padding-top: 100px; }
	header h1 { float: none; top: 75px; width: 290px; height: 55px; margin: 15px auto 0; }
		header h1 a { background-image: url(/images/name-logo-small.png); }
	header nav ul { top: 10px; }
	header nav ul li { width: 90px; margin-right: -5px; padding: 34px 5px 40px; }
		.home header nav ul li.home, .services header nav ul li.services, .contact header nav ul li.contact { background-image: url(/images/bookmark-mini.png); }
	header nav ul li a { font-size: 1.3em; }
	#main p img, #main a.map { border-width: 5px; }
	#main p img { float: none; width: 75%; margin: 0 auto 20px; }
	#main a.map { width: 60%; }
}