/* generic styles from template version 1.0 */
/* NOTE: any * > selector rules are for standards-compliant browsers. The rule before will have a style that works in IE6. */
/* Table of Contents 
	
	Reset Styles
	Layout
	Typography and Inline Elements
		Message Boxes
	Forms
	Tables
*/

/* Reset Styles */
/* From Eric Meyer http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/ */
/* *************************************************************************************** */
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; }
blockquote, q { quotes: none; }
/* remember to define focus styles! */
:focus { outline: 0; }
/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }
/* Layout */
/* *************************************************************************************** */
* { margin:0; padding:0; border:none } /* Reset all elements to zero margin and padding */
.clearfix:after, #content:after, .column:after, div.prices:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix, #content, .column, div.prices { display: inline-block; }
html .clearfix, html #content, html .column, html table.prices { display: block; }
body { color: #333333; font-family: Arial, Helvetica, sans-serif; font-size:100%; line-height:1.75em; }
.left { float:left; margin:0 1em 1em 0 }
.right { float:right; margin: 0 0 1em 1em }
/* Typography and Inline Elements */
/* *************************************************************************************** */
h1 { font: 1.55em "Times New Roman", Times, serif; text-align: center; border-top: 0.1em solid #9B9DB6; margin-bottom: 1.75em; letter-spacing: .125em; color: #9A9A9A; }
#content > h1 {border-bottom: 0.1em solid #9B9DB6; border-top:none}
h2 { font-family: "Times New Roman", Times, serif; font-size: 1.25em; font-weight: bold;}
h3 { font-size: 1em; font-weight: bold; font-family: "Times New Roman", Times, serif; }
h2 + h3, h2 + p { margin-top:1em; }
p { margin:0 0 1em } /* Default bottom padding for paragraphs that can't handle styles below (yes IE6)*/
h1 + p { margin-top:-1em }
ul, ol { margin-left:1.25em; margin-bottom:1em; }
ul + h2, ul + h3 { margin-top:1em; }
a { outline-style:none;} /* remove the dotted border around clicked links */
a.tooltip, a:link, a:visited { color:#25276F;}
a:hover, a:active { color:#9B9DB6 }
a.button:link, a.button:visited, #back_to_collection:link, #back_to_collection:visited { color:#fff }
a.button:focus, a.button:hover, a.button:active, #back_to_collection:focus, #back_to_collection:hover, #back_to_collection:active, #back_to_gallery:focus, #back_to_gallery:hover, #back_to_gallery:active { color:#fff; background-color:#96ABD9 }
img.right { }
img.left { }
code { font: 0.8em "Courier New", Courier, monospace; letter-spacing: -0.025em; white-space:nowrap; }
.note { font-size:.8em }
/* Message Boxes - from mattvarone.com */
.message-box, .buttons input { text-align: center; padding: 5px; color:#545454; width:auto; margin:5px auto; }
.clean { background-color: #efefef; border-top: 2px solid #dedede; border-bottom: 2px solid #dedede; }
.info { background-color: #f7fafd; border-top: 2px solid #b5d3ff; border-bottom: 2px solid #b5d3ff; }
.ok { background-color: #d7f7c4; border-top: 2px solid #82cb2f; border-bottom: 2px solid #82cb2f; }
.alert { background-color: #fef5be; border-top: 2px solid #fdd425; border-bottom: 2px solid #fdd425; }
.error { background-color: #ffcdd1; border-top: 2px solid #e10c0c; border-bottom: 2px solid #e10c0c; }
.buttons input { background-color: #d7f7c4; border: 2px solid #82cb2f; }
/* Forms */
/* some of these classes and styles are applied during validation. .validation_error gets 
	applied by the JavaScript validation or by the PHP validation.
	The .help functions that that make it visible or not visible don't work in IE6, so there is
	a JavaScript (in generic_ie6.js) to make that part work. It's is added with a conditional comment */
/* *************************************************************************************** */

form { width:auto; margin: 0 0 1em 0; }
form#login_form { width:50%; }
#content .form_row { margin:0 0 1.5em; padding:0 }
label { display:block; margin:0 15px 0 0; }
textarea, input { width:98% }
textarea, input, select { margin:0 .25em 0 0; border: 1px solid #CCC; padding:5px; font:inherit; }
select option { margin:0 5px 5px; }
form div.buttons input { cursor:pointer; text-transform:lowercase; }
.form_row .note { display:block; }
p.validation_error { text-align:left; color:#EE2E24; }
.form_row .validation_error { display:block; color:#EE2E24; font-size:.9em; padding:0 0 0 30px; background: url(../images/validationErrorArrow.png) no-repeat 0 center; }
.form_row label .note { display:inline; padding:0 }
a.tooltip { cursor:help;}
option[value="Select One"], option[value="Select Your Name"] { margin-bottom:1em; color:#CCC }

input[type="radio"] {float:left; width:30px}
input[type="radio"] + label {clear:right;}


/* Tables */
/* *************************************************************************************** */
table { margin-bottom:2.8em; line-height:1.2em }
tr { border-bottom: 1px solid #CCC; }
td, th { padding:.25em; border-right: 1px solid #F4F4F4; border-left: 1px solid #F4F4F4 }
td { text-align:center; }
th { font-weight: bold; background-color:#cdd7ed; text-align: center; vertical-align: bottom; }
tr:hover td { background-color:#F4F4F4 }
h2 + div.prices { margin-top:1em; }
table caption { text-align:center; font-weight:bold; padding:0.5em; background-color:#9b9db6; font-size:1.2em; }
td.frame-cost { text-align:center }
.prices table { width:80%; float:left; margin-left:5% }
div.prices { margin-left:-5%; clear:both; float:none }

div.prices > * {float:none; clear:both}