/* reset everything */
img	{ display: block; border: 0; }
body, div, table, th, td { border: 0; padding: 0; margin: 0; }	
a, ul, ol, li, dl, dt, dd, input, textarea, label, select { padding: 0; margin: 0; }	
div.cb { height: 0; width: 0; clear: both; }

/* base aesthetic */
body { font-family: trebuchet ms, sans-serif; font-size: small; color: #333; }
a, p, dd, li, td { font-family: tahoma, trebuchet ms, sans-serif; }
label, input, textarea, select { font-family: tahoma, trebuchet ms, sans-serif; }
th, dt { font-weight: bold; }
td { vertical-align:top; }
li { list-style: none; }
form, input, textarea, label { display: block; }
h1, h2, h3, h4, h5, h6, p {	margin: 0; padding:0; }
h1, h2, h3, h4, h5, h6 { font-family: baskerville, georgia, serif; font-weight: normal; color: #7ea1a4; padding-bottom: .1em; }
h4 { color: #bbb; }
p { padding-bottom: .5em; line-height: 1.4em; }
a, a:visited { color: #99c; text-decoration: underline; }
a:hover { text-decoration: none; }
.error { color: #f00; font-weight: bold; }
.smallcopy { font: xx-small arial narrow, sans-serif; }
label { font-size: 11px; }
address { font-size: .9em; font-style: normal; color: #999; }
.req { color: #c33; font-size: .85em; font-weight: bold; }


/* structure */
div#wrap { width: 754px; padding: 0 2px; margin: 0 auto; position: relative; }
div#head { width: 754px; height: 90px; }

div#logo { position: absolute; top: 26px; left: 5px; }

div#walletstats { position: absolute; top: 8px; right: 0; font-size: 9pt; color: #999; padding: 5px 3px 5px 30px; background: #fff url('/assets/icon_wallet.gif') left no-repeat; }


#engraving_text { width: 400px; height: 60px; border: 1px solid #d7d7d7; padding: 3px; background-color: #ffe; font-size: .9em; font-style: normal; color: #666; }
#special_instructions { width: 600px; height: 50px; border: 1px solid #d7d7d7; padding: 3px; background-color: #ffe; font-size: .9em; font-style: normal; color: #666; }

#walletstats a { font: 10px trebuchet ms; color: #3c9ca4; text-decoration: none; padding: 3px; }
#walletstats a:hover { text-decoration: underline; }

#nav { position: absolute; top: 65px; right: 0; padding: 0; margin: 0; list-style: none; }
#nav ul { padding: 0; margin: 0; list-style: none; }
#nav a { display: block; font: 10px trebuchet ms; color: #3c9ca4; text-decoration: none; padding: 3px; }
#nav a span { font-size: 13px; }
#nav a:hover { text-decoration: underline; }
#nav li { float: left; margin-right: 10px; }
#nav li.last { margin-right: 0px; }
#nav li ul { position: absolute; left: -999em; background-color: #eee; border-left: 1px solid #fff; }
#nav li ul.on { left: auto; background-color: #f7f7f7; }
#nav li:hover ul { left: auto; }
#nav li.sfhover ul { left: auto; }

#content { width: 754px; border: 1px solid #eee; margin: 0; padding: 30px 0 30px 0 ; }  

div.wide { width: 700px; margin: 0 auto; }

#footer { width: 754px; margin: 0; padding: 0; }  

div#sitecredit { float: right; padding: 5px 2px 0 0; font-family: arial, sans-serif; font-size: 10px; color: #ccc; }
div#sitecredit a { color: #ccc; text-decoration: none; margin: 0; padding: 0; }
div#sitecredit a:hover { text-decoration: underline; }

div#copyright { float: left; padding: 5px 0 0 2px;  font-family: arial, sans-serif; font-size: 10px; color: #999; }
div#copyright a { color: #999; text-decoration: none; }
div#copyright a:hover { text-decoration: underline; }

table#walletdetail { width: 680px; border: 1px solid #eee; margin-top: 10px; border-collapse: collapse; }
table#walletdetail tr { }
table#walletdetail tr.total td { background-color: #ffd; padding: 8px 4px; }
table#walletdetail tr th { padding: 2px 4px; text-align: left; border-bottom: 1px solid #d7d7d7;  border-left: 1px solid #d7d7d7; background-color: #dfdfdf; }
table#walletdetail tr th.c { text-align: right; }
table#walletdetail tr th.n { text-align: right;}
table#walletdetail tr td { padding: 2px 4px; border-left: 1px solid #dfdfdf;  }
table#walletdetail tr td form { margin: 0; padding: 0; }
table#walletdetail tr td input.hidden { display: none; margin: 0; padding: 0; }
table#walletdetail tr td.c { text-align: right; }
table#walletdetail tr td.n { text-align: right;}

table.shiplist { clear: left; width: 603px; border: 1px solid #d7d7d7; margin-top: 2px; }
table.shiplist th { padding: 2px 4px; text-align: left; border-bottom: 1px solid #d7d7d7;  border-left: 1px solid #d7d7d7; background-color: #dfdfdf; font-size: 10px; }
table.shiplist td { padding: 2px 4px; border-left: 1px solid #ebe7de; font-size: 11px; vertical-align: middle; }
table.shiplist th.n { text-align: right; }
table.shiplist td.n { text-align: right; }
table.shiplist td.n input { float: right; border: 1px solid #fff; padding: 1px; text-align: right; color: #777; font-weight: normal; }
table.shiplist td.alert { background-color: #c44; color: #fff; }
table.shiplist td.attention { background-color: #ff9; color: #333; }
table.shiplist td a { color: #654; text-decoration: none; font-size: 14px; font-weight: bold;}

div.block { border: 1px solid #d7d7d7; margin-top: 10px; padding: 10px; }
div.block label { float: left; margin-right: 5px; margin-bottom: 5px; }
html>body div.block label { margin-right: 10px; }
div.block input.inputtext { border: 1px solid #d7d7d7; padding: 3px; background-color: #ffd; font-size: 12px; font-weight: normal; color: #666; }
div.block select { color: #666; }
div.block h4.error { color: #7ea1a4; font-weight: bold; font-size: 1.25em; }
div.block p.error { color: #c00; font-weight: normal; font-size: 1em; }
div.block select.ship_option { padding: 3px; background-color: #ffd; border: 1px solid #d7d7d7; font-weight: normal; }
div.block select.location { padding: 3px; background-color: #ffd; border: 1px solid #d7d7d7; margin-right: 15px; font-weight: normal; }


div.form { width: 448px; float: left; clear: both; margin: 10px 0; }
form dl { float: left; }
form dt { width: 200px; margin: 0 0 10px 0; float: left; clear: both; }
form dd { width: 240px; margin: 0 0 10px 0; float: left; }
input.px200 { width: 220px; }

#contactform { width: 300px; float: right; padding: 20px; background-color: #fbe7ff; }
#contactform label { font-weight: bold; color:#3c9ca4; }
#contactform input { font: small arial, sans-serif; color:#3c9ca4; width: 280px; margin-bottom: 10px; }
#contactform textarea { font: small arial, sans-serif; color:#3c9ca4; width: 280px; height: 100px; margin-bottom: 10px; }
#contactform .button { width: auto; margin-bottom: 10px; color:#333; }

div#penecom { width: 200px; height: 340px; padding-top: 5px; margin-top: 20px; }
div#penecom dl { margin-left: 70px; }
div#penecom dl dt { font-size: 12px; line-height: 24px; font-weight: normal; color: #877e61; }
div#penecom dl dd { font-size: 12px; line-height: 24px; font-weight: bold; font-style: italic; color: #877e61; }
div#penecom dl dd form#wallet { float: left; margin-top: 20px; padding: 8px 4px; width: 140px; background-color: #ffe; border: 1px solid #dfdfdf; }
div#penecom dl dd form#wallet input { font-size: 9pt; float: left; margin-right: 4px; font-style: normal; font-weight: bold; color: #777; border-right: 2px solid #ddd; border-bottom: 2px solid #ddd; border-top: 2px solid #999; border-left: 2px solid #999; }
div#penecom dl dd form#wallet input.hidden { display: none; }
div#penecom dl dd form#wallet input.button { font-size: 8pt;  border-top: 2px solid #ddd; border-left: 2px solid #ddd; border-right: 2px solid #999; border-bottom: 2px solid #999; }
div#penecom dl dd form#wallet input#total { width: 40px; text-align: right; }
div#penecom dl dd form#wallet select { font-size: 9pt; float: left; width: 45px; margin-right: 3px; font-style: normal; font-weight: bold; color: #777; }

/* the clearfix hack */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-table; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */