body {
	padding: 10px;
	background-color: #ffffcc;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 14px;
	line-height: 150%;
}

p, h1, h2, h3 {clear: left;}
ul, ol {padding-left: 15px;}

a:visited {color: blue}
a.red {color: red}
h2.red {color: red}

#menu {position: fixed; top: 10px; right: 10px;}
#menu a {float: left; clear: both}

#msg, #warn {float: left;	clear: left; width: calc( 100% - 220px ); max-width: 800px; padding: 5px; margin-bottom: 5px;}
#warn {color: red; border: 1pt solid red; }
#msg  {color: green; border: 1pt solid green; }

#main {float: left; clear: left; width: calc( 100% - 220px ); max-width: 820px;}
#register {float: left;}

#user_status {float: left; width: 100%}

.low_profile {font-size: 10pt}
.low_profile h1, .low_profile h2 {color: blue}
.low_profile h1 {font-size: 12pt}
.low_profile h2 {font-size: 10pt; color: blue}
.low_profile p {margin-top: -5px;}
.low_profile p + ul, .low_profile p + ol {margin-top: -5px;}




img {
	float: left;
	max-height: 130px;
	max-width: 360px;
	margin-right: 20px;
	margin-bottom: 20px;
	background-color: #bbb /*;red; #94aab8*/
}

table {
	border-collapse: collapse;
}

td img {
	width: 150px;
	height: 15px;
	margin: 0px;
	background-color: #ffffcc;
}

td, th {
	padding-right: 5px;
	vertical-align: top;
	text-align: left;
	border-bottom: solid 1px;
}

td.center, th.center {
	text-align: center;
}

#probe_config {width: 820px}
#probe_config td:nth-child(1) {width: 120px}
#probe_config td:nth-child(2) {width: 120px}
#probe_config td:nth-child(3) {width: 580px}
.input_4 {width:100px;}
.input_8 {width:100px;}



#register table, td, th {border: none}
#register th {padding: 10px 20px 5px 0px}
#register button {margin: 10px 0px; text-align: left;}
#update_button, #add_ship_button, #add_fin_button  {float: left; clear: both}

#customer, #contact, #ship, #fin, #change_pw {float: left; padding: 10px; margin: 10px 20px 10px 0px; background: #ffff99}
#register, #contact{clear: left}
#return_to_shop_link, #logout_link {float: right; clear: both;}


.shop_item {float: left; width: 100%; margin-bottom: 10px;}
.item_desc {float: left; width: 40%}
.item_desc ul {margin-top: 0px;}
.item_pics {float: left; width: 20%; margin: 0px 20px;}
.item_pics img {float: left; width: 100%; margin: 5px 0px}
.item_sell {float: left; width: 5%}
.item_qtys {float: left; width: 20%}

.item_desc li {margin-top: -3px;}
.item_desc h3 {margin-top: 0px;}
.shop_item {border-top: 1px solid black}


.small {font-size: 6pt}

.float_left, #select_payment, #select_shipping {float: left; margin: 5px 10px}
#quote {clear: left}
.card, #notes {float:left; background: #ffff99; padding: 10px; margin: 5px}
.card_part {margin-bottom: 20px;}
#order_button {float: left; clear: both; margin: 5px 10px 50px 5px;}

#quote th:nth-child(3) {text-align: center;}
#quote td:nth-child(2), #quote td:nth-child(4) {text-align: center;}
#quote td:nth-child(3), #quote td:nth-child(5), #quote th:nth-child(5) {text-align: right;}

 #comment_box {background: #ccc; position: fixed; bottom:50px; left: 50px; width: calc( 100% - 100px);padding: 10px; margin: 0px}



.vfill {float: left; clear: both; width: 800px; height: 200px}

.red {
	color: red; font-weight: bold; font-size: 12pt;
}

.small {
	font-size: x-small;
}

.hover {
	color: blue;
	text-decoration: underline;
	position: relative;
	z-index: 1;
}

.tooltip {
	display :none;
	position: absolute;
	z-index: 2;
	background: #bbb;
	border: 1px solid #555;
	padding: 5px 10px;
	top : 20px;
	left: 0px;
	width: 360px; /* no more than body right margin, so always space available */
	color: black;
	overflow: hide;
}

.hover:hover .tooltip {
	display: block;
	z-index: 2;
}​