@charset "utf-8";
/* CSS Document */

body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: url(../images/catalog_bgshademain.jpg) repeat-x #c7c7c7;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #maincontainer selector */
	color: #000000;
	border:thick;
}

/* ↓↓↓↓↓↓↓↓ MAIN TEMPLATE ↓↓↓↓↓↓↓↓  */

.main #maincontainer { 
	position: relative;
	width: 750px;
	margin: 0px auto;
	text-align: left; /* this overrides the text-align: center on the body element. */
}

.main #mainlogo {
	position: relative;
	top: 0px;
	left: 0px;
	width: 750px;
	height: 60px;
	padding: 0px 0px 0px 0px;
	margin: 0px;
}

.main #mainmenu {
	position: relative;
	top: 0px;
	left: 0px;
	width: 750px;
	height: 30px;
	padding: 4px 0px 0px 20px;
	margin: 0px;
	color: #747474;
	background: url(../images/catalog_menubar.jpg);
	background-repeat: no-repeat;
}

.main #mainbody {
	position: relative;
	top: 10px;
	left: 0px;
	width: 750px;
	padding: 0px 0px 0px 0px;
	margin: 0px auto;
	background: url(../images/catalog_bgshadebody.jpg) repeat-x #e1e1e1;
}

.main #mainfooter {
	position: relative;
	top: 20px;
	width: 750px;
	padding: 0px;
	margin: 0px;
	text-align: center;
	font-size: 12px;
}

/* ↓↓↓ Main Menu ↓↓↓  */

.main #mainmenu a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #404040;
	font-size: 12px;
	text-decoration: none;
	letter-spacing: 0px;
}
.main #mainmenu a:hover {
	text-decoration: underline;
}

.mainmenunav{
padding: 0;
width: 100%;
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;

position:absolute;
top:65px;
left:10px;
}

.mainmenunav ul{
font: normal 12px Arial, Verdana, sans-serif;
margin:0;
padding:0;
list-style:none;
}

.mainmenunav li{
display:inline;
margin:0 2px 0 0;
padding:0;
}


.mainmenunav a{
float:left;
	font: normal 12px Arial, Verdana, sans-serif;
	color: #000000;
	text-decoration: none;
	letter-spacing: 0px;
}

.mainmenunav a span{
float:left;
display:block;
/*background: transparent url(media/color_tabs_right.gif) no-repeat right top;*/
padding: 4px 8px 2px 7px;
}

.mainmenunav a span{
float:none;
}

.mainmenunav a:hover{
/*background-color: #ffffff;*/
	text-decoration: underline;
}

.mainmenunav a:hover span{
/*background-color: #591f20;*/
}

.mainmenunav .selected a, #ddcolortabs .selected a span{ /*currently selected tab*/
/*background-color: #ffffff;*/
}

.mainmenunavtabsline{
clear: both;
padding: 0;
width: 100%;
height: 8px;
line-height: 4px;
border-top: 1px solid #ffffff; /*Remove this to remove border between bar and tabs*/
}

/* ######### Style for Drop Down Menu ######### */

.dropmenudiv_a{
position:absolute;
top: 0;
border: 0px solid #cccccc;; /*THEME CHANGE HERE*/
border-top-width: 4px; /*Top border width. Should match height of .ddcolortabsline above*/
border-bottom-width: 0;
font:normal 12px Arial;
line-height:18px;
z-index:100;
background-color: white;
/*width: 140px;*/
opacity: 0.85;
filter: alpha(opacity = 85);
visibility: hidden;
}


.dropmenudiv_a a{
width: auto;
display: block;
text-indent: 5px;
border-top: 0 solid #cccccc;
border-bottom: 1px solid #cccccc; /*THEME CHANGE HERE*/
padding: 2px 0;
text-decoration: none;
color: black;
}

* html .dropmenudiv_a a{ /*IE only hack*/
width: 100%;
}

.dropmenudiv_a a:hover{ /*THEME CHANGE HERE*/
background-color: #dddddd;
text-decoration: underline;
/*color: white;*/
}

/* ↑↑↑ Main Menu ↑↑↑ */

/* ↑↑↑↑↑↑↑↑ MAIN TEMPLATE ↑↑↑↑↑↑↑↑ */



/* ↓↓↓↓↓↓↓↓ LOGIN TEMPLATE ↓↓↓↓↓↓↓↓  */

.main #logincontainer { 
	position: relative;
	width: 400px;
	margin: 0px auto;
	text-align: left; /* this overrides the text-align: center on the body element. */
}
.main #loginbody {
	position: relative;
	width: 400px;
	height: 200px;
	padding: 40px 0px 0px 0px;
	margin: 0px auto;
	background: url(../images/login_bgshadebody.jpg) repeat-x #e1e1e1;
}
.main #loginfooter {
	position: relative;
	top: 20px;
	width: 400px;
	padding: 0px;
	margin: 0px;
	text-align: center;
	font-size: 12px;
}

.main #loginerrortxt {
	font-size: 14px;
	color: red;
	text-align: center;
}

/* ↑↑↑↑↑↑↑↑ LOGIN TEMPLATE ↑↑↑↑↑↑↑↑ */



/* ↓↓↓↓↓↓↓↓ ADMIN ↓↓↓↓↓↓↓↓ */

.main #adminBoxHeader {
	position: absolute;
	top: 0px;
	bottom: 0px;
	width: 750px;
	height: 75px;
	padding: 0px;
	margin: 0px;
}
.main #adminBoxHeader hr {
	margin-top: 75px;
}
.main #adminNext {
	position: absolute;
	top: 60px;
	right: 26px;
	width: 750px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #717171;
	margin: 0px;
	font-size: 12px;
	text-align: right;
	text-decoration: none;
}
.main #adminNext a {
	color: #717171;
	text-decoration: none;
}
.main #adminNext a:hover {
	text-decoration: underline;
}

.main #adminPgNum {
	position: absolute;
	top: 85px;
	right: 26px;
	width: 750px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #717171;
	margin: 0px;
	font-size: 10px;
	text-align: right;
	text-decoration: none;
}
.main #adminPgNum a {
	color: #717171;
	text-decoration: none;
}
.main #adminPgNum a:hover {
	text-decoration: underline;
}


.main #adminBody {
	position: relative;
	top: 100px;
	left: 0px;
	width: 750px;
	padding: 0px 0px 125px 0px;
	margin: 0px 0px 125px 0px auto;
}
.main #adminBody a {
	color: #000000;
}

.main #adminBody form { 
	margin: 25px; /* set top margin same as form input - textarea etc. elements */
}
.main #adminBody label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 200px; 
	padding: 0; 
	margin: 5px; /* set top margin same as form input - textarea etc. elements */
	text-align: right;
	font-size: 10px;
}

.main #adminBody fieldset {
	border: 1px solid;
	border-color: #999999; 
	padding: 5px;
	margin: 20px;
}

.main #adminBody legend {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 18px;
	padding: 5px;
	margin: 0px auto;
}

.main #corpAddy {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 10px;
	padding: 5px;
	margin: 0px auto;
	background-color:#CCCCCC;
}

.main #adminlistTR1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 10px;
	padding: 5px;
	margin: 0px auto;
	background-color: #ffffff;
	word-wrap: break-word;
}
.main #adminlistTR1 h1 {
	font-size: 14px;
	font-weight: bold;
	padding: 0px 0px 0px 25px;
}
.main #adminlistTR1 strong {
	font-size: 12px;
}
.main #adminlistTR1 p {
	padding: 0px 0px 30px 50px;
	margin: 0px auto;
}
.main #adminlistTR2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 10px;
	padding: 5px;
	margin: 0px auto;
	background-color: #F3F3F3;
	word-wrap: break-word;
}
.main #adminlistTR2 h1 {
	font-size: 14px;
	font-weight: bold;
	padding: 0px 0px 0px 25px;
}
.main #adminlistTR2 strong {
	font-size: 12px;
}
.main #adminlistTR2 p {
	padding: 0px 0px 30px 50px;
	margin: 0px auto;
}

.error1 {
	color: #FF0000;
	font-style: normal;
	font-weight: bold;
	font-size: 10px;
}

.red1 {
	color: #FF0000;
	font-style: normal;
	font-weight: bold;
	font-size: 10px;
}
.orange1 {
	color: #FF9900;
	font-style: normal;
	font-weight: bold;
	font-size: 10px;
}
.blue1 {
	color: #0033CC;
	font-style: normal;
	font-weight: bold;
	font-size: 10px;
}
.green1 {
	color: #009900;
	font-style: normal;
	font-weight: bold;
	font-size: 10px;
}

.tableItemList {
	border: none;
	font-size: 10px;
}
.tableItemList thead {
	color:#000000;
	font-size: 10px;
	font-weight: bold;
	background-color:#c8c8c8;
	text-align: center;
}
.tableItemList thead a {
	text-decoration: none;
}
.tableItemList thead a:hover {
	text-decoration: underline;
}

.main #adminItemsScroll {
	height: 300px;
	overflow:auto;
}

/* ↑↑↑↑↑↑↑↑ ADMIN ↑↑↑↑↑↑↑↑ */



/* ↓↓↓↓↓↓↓↓ LIST ITEMS ↓↓↓↓↓↓↓↓ */

.main #listItemBody {
	position: relative;
	top: 120px;
	left: 0px;
	width: 750px;
	padding: 0px 0px 125px 0px;
	margin: 0px auto;
}

.main #listItemTR {
	position: relative;
	top: 0px;
	left: 24px;
	width: 702px;
	height: 300px;
	padding: 0px;
	margin: 0px;
}
.main #listItemTD {
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	left: 0px;
	width: 234px;
	height: 300px;
	padding: 0px;
	margin: 0px;
}

.main #listItemTDbox {
	position: relative;
	top: 17px;
	left: 17px;
	width: 200px;
	height: 266px;
	padding: 0px;
	margin: 0px;
	background: url(../images/catalog_itembox_bg2.jpg) no-repeat #CCCCCC;
}
.main #listItemName {
	position: absolute;
	top: 0px;
	width: 192px;
	height: 40px;
	font-size:14px;
	padding: 4px;
	margin: 0px;
}
.main #listItemThumb {
	position: absolute;
	top: 46px;
	width: 200px;
	height: 200px;
	padding: 0px;
	margin: 0px;
	text-align: center;
}
.main #listItemNumber {
	position: absolute;
	font-weight: bold;
	top: 244px;
	width: 192px;
	height: 18px;
	font-size:12px;
	padding: 4px;
	margin: 0px;
}

/* ↑↑↑↑↑↑↑↑ LIST ITEM ↑↑↑↑↑↑↑↑ */



/* ↓↓↓↓↓↓↓↓ VIEW ITEM ↓↓↓↓↓↓↓↓ */

.main #itemBoxHeader {
	position: absolute;
	top: 0px;
	bottom: 0px;
	width: 750px;
	height: 100px;
	padding: 0px;
	margin: 0px;
}

.main #itemBoxHeader hr {
	margin-top: 100px;
}

.main #itemName {
	position: absolute;
	top: 36px;
	left: 26px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 22px;
	text-decoration: none;
}

.main #itemNumber {
	position: absolute;
	top: 70px;
	left: 26px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 14px;
	text-decoration: none;
}

.main #itemNext {
	position: absolute;
	top: 75px;
	right: 26px;
	width: 750px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #717171;
	margin: 0px;
	font-size: 14px;
	text-align: right;
	text-decoration: none;
}
.main #itemNext a {
	color: #717171;
	font-size: 16px;
	text-decoration: none;
}
.main #itemNext a:hover {
	text-decoration: underline;
}


.main #itemBoxInfo {
	position: relative;
	top: 0px;
	left: 375px;
	width: 300px;
	padding: 126px 26px 26px 26px;
	margin: 0px;
	font-size: 12px;
}

.main #itemBoxInfo2 {
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
}
.main #itemBoxInfo2 a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #404040;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}
.main #itemBoxInfo2 a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: underline;
}

.main #itemBoxInfo3 {
	position: relative;
	top: 0px;
	left: 0px;
	width: 150px;
	padding: 0px;
	margin: 0px;
}
.main #itemBoxInfo4 {
	position: absolute;
	top: 0px;
	left: 150px;
	width: 177px;
	padding: 0px;
	margin: 0px;
	height: 176px;
	word-wrap: break-word;
}

.main #itemBoxInfo h1 {
	font-size: 14px;
	margin-top: 40px;
}

.main #itemBoxInfo h2 {
	font-size: 12px;
	font-weight: bold;
}

.main #itemBoxInfo ul {
	padding: 0 0 0 14px;
	margin: 0px;
}

.main #itemBoxPic {
	position: absolute;
	top: 100px;
	left: 0px;
	bottom: 0px;
	width: 324px;
	padding: 26px;
	margin: 0px;
	font-size: 12px;
}

.main #itemBoxPic a {
	color: #333333;
	font-size: 10px;
	text-decoration: none;
}

.main #itemBoxPicFull {
	position: absolute;
	top: 50px;
	left: 25px;
	padding: 14px;
	margin: 0px;
	font-size: 12px;
	background-color: #666666;
	text-align:right;
	display: none;
}

.main #itemBoxPicFull a {
	color: #CCCCCC;
	font-size: 12px;
	text-decoration: none;
}

/* ↑↑↑↑↑↑↑↑ VIEW ITEM ↑↑↑↑↑↑↑↑ */

/* ↓↓↓ Order Form ↓↓↓  */
.main #forms h1 {
	font-size: 14px;
	margin: 0 0 20px 50px;
}

.main # itemBoxInfo2 form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  font:100% verdana,arial,sans-serif;
  margin: 0;
  padding: 0;
  min-width: 375px;
  max-width: 375px;
  width: 375px; 
}

.main form fieldset {
  /* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  border-color: #000;
  border-width: 1px;
  border-style: solid;
  padding: 10px;        /* padding in fieldset support spotty in IE */
  margin: 0;
}

.main form label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 100px; 
	padding: 0; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right; 
}

.main form fieldset label:first-letter {  /* use first-letter pseudo-class to underline accesskey, note that */
	text-decoration:underline;    /* Firefox 1.07 WIN and Explorer 5.2 Mac don't support first-letter */
                                    /* pseudo-class on legend elements, but do support it on label elements */
                                    /* you could instead underline first letter on each element and accesskey */
                                    /* each input but doing only legends lessens cognitive load */
						/* changed to label first letter, opera broke after first letter legend */
}

.main form input, form textarea, form select, form password {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
}

.main form input#reset {
	margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}

.main textarea { overflow: auto; }

.main form small {
	display: block;
	margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	font-size: 88%;
}

.main form .required{font-weight:bold;} /* uses class instead of div, more efficient */

.main form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}
/* ↑↑↑ Order Form ↑↑↑ */

/* ↑↑↑↑↑↑↑↑ VIEW ITEM ↑↑↑↑↑↑↑↑ */



/* ↓↓↓↓↓↓↓↓ SHOPPING CART ↓↓↓↓↓↓↓↓ */

.main #cartBoxHeader {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 750px;
	height: 50px;
	padding: 0px;
	margin: 0px;
}

.main #cartBody {
	position: relative;
	top: 75px;
	left: 0px;
	width: 750px;
	padding: 0px 0px 125px 0px;
	margin: 0px auto;
}

.main #cartChangeInfo {
	position: absolute;
	top: 55px;
	right: 22px;
	width: 476px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #717171;
	margin: 0px;
	font-size: 12px;
	text-decoration: none;
}

.tableCart {

}
.tableCart thead {
	color:#000000;
	font-size: 10px;
	font-weight: bold;
	background-color:#c8c8c8;
	text-align: center;	
}
.tableCart tfoot {
	color:#000000;
	font-size: 12px;
	background-color:#c8c8c8;
}
.tableCartTR1 {
	color:#000000;
	font-size: 10px;
	background-color:#f2f2f2;
}
.tableCartTR2 {
	color:#000000;
	font-size: 10px;
	background-color:#fbfbfb;
}

/* ↑↑↑↑↑↑↑↑ SHOPPING CART ↑↑↑↑↑↑↑↑ */
