body {
	margin: 0;
	padding: 0;
	font-size: 62.5%;
	font-family: Arial, Geneva, sans-serif;
}

body.main, body.gallery, body.contact, body.form-error { background: transparent url(../images/bg.jpg) repeat left top; }

#outer { padding: 10px 0 0; overflow: auto; }

#login #outer { padding: 0; }

.gallery #outer, .contact #outer, .form-error #outer { width: 994px; margin: 0 auto; overflow: hidden; }


/* TEXT
---------------- */

h3.msg { text-align: center; }

p.error-login { color: #888; text-align: center; font-size: 1.1em; }

.panel label, .panel p, .panel ul, .panel ol, .panel a, .panel input, .panel textarea { font-size: 1.2em; }

.panel li p, .panel p a, .panel p input { font-size: 1em; }

.panel a#save-order { display: block; float: right; margin: 0 0 15px; }


/* MISC
---------------- */

a img { border: none; }

a { outline: none; }


/* NAV
---------------- */

.nav { margin: 0; padding: 0; list-style: none; overflow: auto; position: absolute; right: 40px; top: 2px; }

.nav li { float: left; margin: 0 15px 0 0; }

.nav a { 
	display: block; 
	font-size: 1.3em; 
	font-family: Georgia, "Times New Roman", serif; 
	color: #111; 
	text-decoration: none;
	padding: 1px 2px;
	text-indent: -9999px;
}

.nav #main { width: 30px; }
.nav #contact, .nav #gallery { width: 50px; }

.contact .nav { right: 20px; }
.contact .nav #main { width: 32px; }

body.main .nav { position: static; width: 150px; margin: 0 auto; }

body.main .nav #gallery { width: 58px; height: 18px; background: transparent url(../images/button-gallery.jpg) no-repeat left top; }
body.main .nav #contact { width: 53px; height: 14px; background: transparent url(../images/button-contact.jpg) no-repeat left top; }

body.gallery .nav #main { width: 30px; height: 14px; background: transparent url(../images/button-main.jpg) no-repeat left top; }
body.gallery .nav #contact { width: 53px; height: 14px; background: transparent url(../images/button-contact1.jpg) no-repeat left top; }

body.contact .nav #main { width: 30px; height: 14px; background: transparent url(../images/button-main.jpg) no-repeat left top;;}
body.contact .nav #gallery { width: 58px; height: 18px; background: transparent url(../images/button-gallery1.jpg) no-repeat left top; }


/* CONTENT 
---------------- */

#splash-link { display: block; width: 573px; margin: 0 auto; }

#header { display: block; margin: 0 auto; position: relative; }

#header-main { display: block; margin: 0 auto; position: relative; left: -80px; }

#collage { display: block; margin: 24px auto 0; }

img#maintext { display: block; margin: 20px auto; }

#harveystudio-link { display: block; height: 20px; width: 115px; margin: 0 auto; position: relative; left: 213px; top: -38px; text-indent: -9999px; }

#gallery-header { display: block; margin: 0 auto; }

#content {
	overflow: auto;
	padding: 20px 0 0;
}

#photos {
	width: 758px;
	min-height: 471px;
	float: left;
} 

#photos img { display: block; margin: auto; text-indent: -9999px; position: relative; }

#thumbs {
	width: 215px;
	float: right;
	height: 470px;
	overflow: auto;
	overflow-x: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}

#thumbs li {
	width: 195px;
	display: block;
	margin: 0 auto 15px;
}

#thumbs div.thumb-wrap { background: #222; margin: 0 auto; }

#thumbs li img { display: block; margin: 0 auto; opacity: .6; filter: alpha(opacity = 60); }

#thumbs li img:hover { opacity: 1.0; filter: alpha(opacity = 100); }

.diagram-link {
	display: block;
	text-indent: -9999px;
	width: 28px;
	height: 38px;
	background: transparent url(../images/hasselblad.png) no-repeat left top;
	position: absolute;
	bottom: 10px;
	right: 10px;
	z-index: 100;
	display: none;
}


/* CONTACT FORM
------------------ */

#contact-page #content { padding: 10px 20px 20px; overflow: visible; }

#contact-form { width: 510px; margin: 0 auto; padding: 0; border: 0; }

#contact-form div.left { width: 250px; float: left; }

#contact-form div.right { width: 250px; float: left; }

#contact-page #content p { font-family: verdana; font-size: 1.1em; margin: 0 auto 15px; font-style: italic; text-align: center; text-transform: uppercase; font-weight: normal; }

#contact-form fieldset { margin: 0; padding: 0; border: 0; }

#contact-form label { display: block; font-size: 1.1em; margin: 7px 0; text-transform: uppercase; color: #000; font-weight: bold; }

#contact-form label span { color: #999; }

#contact-form input { margin: 0; padding: .2em; font-size: 1em; margin: 0 0 10px; width: 232px; }

#contact-form textarea { width: 485px; height: 120px; font-size: 1.4em; margin: 0 0 10px; padding: .2em; }

#contact-form input.submit { display: block; font-size: 1em; width: 75px; }

#contact-form #message-label { clear: left; }

#contact-page #content #phone-number { position: relative; top: -30px; font-style: normal !important; text-transform: lowercase; width: 300px; }

#phone-number span { margin-left: 10px; }

.contact #phone-number { text-align: center; position: relative; top: -24px; left: 48px; }

#contact-form p.instructions { text-align: center; margin-top: 60px; }


/* ADMIN LOGIN
---------------- */

#login-form {
	margin: 0 auto;
	padding: 20px;
	width: 350px;
	background: #bbb;
	
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

#login-form input {
	background: #eee;
	font-size: 1.2em;
	border: none;
	padding: 4px 6px;
	margin: 5px 0;
	color: #999;
	
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

#login-form #submit { margin-left: 30px; color: #888; width: 70px; }

#login-form label { color: #fff; }


/* ADMIN PANEL
---------------- */

.panel #header { text-transform: uppercase; font-size: 2.2em; margin: 0 0 20px; border-bottom: 1px solid #000; background: #eee; padding: 2px; }

div.left { float: left; }

div.right { width: 690px; float: left; }

.panel #outer { width: 920px; margin: 0 auto;}

ul#gallery { width: 690px; margin: 0; padding: 0 0 20px; list-style: none; overflow: auto; clear: both; }

#gallery li { width: 200px; height: 170px; margin: 0 15px; padding: 15px 0; float: left; }

#gallery li p { margin: 5px 0 0; }

#gallery li img {
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	
	display: block;
	margin: auto;
}

#gallery li p { text-align: center; }

#gallery li:hover img {  }

#gallery li:hover a { display: inline; } 


/* QUICK PHOTO ADD
---------------- */

#add-form { 
	width: 180px;
	padding: 10px;
	
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

#add-form h2 { margin-top: 0; }

#add-form input, #add-form textarea, #add-form label { display: block; }

#add-form label { margin: 0 0 15px; }

#add-form input, #add-form textarea {
	border: none;
	background: #ddd;
	width: 160px;
	padding: 4px 6px;
	
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

#add-form #add-diagram { display: block; margin: 0 0 15px; }

#diagram-wrap { display: none; }

#add-form #submit { background: #aaa; width: 80px; color: #fff; }


/* EDIT PHOTO FORM
---------------- */

#edit-form { padding-bottom: 20px; }

#edit-form input, #edit-form textarea, #edit-form label { display: block; }

#edit-form .left, #edit-form .right { float: left; width: auto; }

#edit-form .right { margin: 0 0 0 30px; }

#edit-form #photo, #edit-form #thumbnail, #edit-form #diagram { margin: 15px 0 0; }

#edit-form #thumbnail { margin: 15px 0; }

#edit-form .photo, #edit-form .diagram { overflow: auto; }

#edit-form .photo { border-bottom: 1px solid #ccc; padding-bottom: 20px; margin-bottom: 20px; }

#edit-form div.diagram { display: none; }

#edit-form #edit-diagram { display: block; margin: 0 0 15px; }

#edit-form input, #edit-form textarea {
	border: none;
	background: #ddd;
	width: 160px;
	padding: 4px 6px;
	
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

#edit-form label { margin: 0 0 15px; }

#edit-form #submit { background: #aaa; width: 90px; color: #fff; display: inline; text-align: center; }

#edit-form p.submit { margin: 15px 0; }


/* DELETE PHOTO FORM
---------------- */

#delete-form #submit { 
	border: none;
	background: #aaa;
	width: 80px;
	padding: 4px 6px;
	color: #fff;
	
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

.right .submit1 { 
	border: none;
	background: #aaa;
	width: 130px;
	height: 20px;
	padding: 4px 6px;
	color: #fff;
	text-decoration:none;
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.left .submit1 { 
	border: none;
	background: #aaa;
	width: 130px;
	height: 20px;
	padding: 4px 6px;
	color: #fff;
	text-decoration:none;
	/* Do rounding (native in Safari, Firefox and Chrome) */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
