html,body{margin:0;padding:0}
body {margin: 0 auto; text-align:center;}
p{margin:0 0 10px 0}
a img{ border:none; }

div#container{text-align:left; width:950px;margin:0 auto; }

/* MASTERHEAD */

div#header{position:relative; margin-bottom: -40px; background-image:url(../images/bokomo/mast17.gif); repeat:no-repeat; height:140px;}
div#header a{position: relative; z-index: 500; }

ul#toplinks {margin:0px 20px 10px 0; padding:0; color:#000; float:right; list-style: none; display:inline; font-weight:bold;  }
ul#toplinks li { margin:0; padding:0 5px 0 5px; font:normal 10pt Arial, Helvetica, sans-serif; display:inline; }
ul#toplinks li a{ color:#000; text-decoration:none; font-weight:bold;  }
.searchBoxForm { float:right; margin:0 20px 0 0; }
form input.searchbox { border:1px solid #717171; width:130px; margin-right:5px; color:#ccc; }

/* LEFT COLUMN */

div#navigation{ width:145px; height:660px; float:left; }
div#left-spacer { float:left; width:24px; clear:both; color:#fff; }

/* these are the styles for the menu */

div#menu-btm { width:140px; height:66px; float:right; }
div#menu { background:#fff url(../images/bokomo/spline.png) repeat-y top left; width:193px; height:662px; float:right; text-align:center; }
div#menu_subpage { background:#ceab60 url(../images/bokomo/menu_03.jpg) no-repeat top left; width:195px; height:662px; float:left; text-align:center; }

/* nav1; text properties for states: normal, hover, click */
.TM0i0 {
	color:#000000; 
	font-weight:bold; 
	font-size: 11px; 
	font-family: Arial, Helvetica, sans-serif; margin:0;  
	width:133px;
	text-decoration: none;
	padding: 4px; padding-top:8px
}

/* nav1; box properties for states: normal */
.TM0o0 {
	background: transparent;
	border-bottom: 1px solid #887241;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
}

/* nav1; box properties for states: hover, click */
.TM0o1 {
	background: #C0C0C0;
	border-bottom: 1px solid #887241;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	background: url(../images/bokomo/splineRed.jpg)
}

/* nav2; box properties for states: normal */
.TM1o0 {
	background: #CC00CC;
	border-bottom: 1px solid #767676;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	background: url(../images/bokomo/splineLevel2.png)
}

/* nav2; box properties for states: hover, click */
.TM1o1 {
	background: #CC33FF;
	border-bottom: 1px solid #767676;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	background: url(../images/bokomo/splineRed.jpg)
}

/* nav3; box properties for states: normal */
.TM2o0 {
	background: #0000FF;
	border-bottom: 1px solid #767676;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	background: url(../images/bokomo/splineLevel3.png)
}

/* nav3; box properties for states: hover, click */
.TM2o1 {
	background: #FF0033;
	border-bottom: 1px solid #767676;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	background: url(../images/bokomo/splineRed.jpg)
}





ul#menu_main { margin:60px 0 0 0; padding:0; width:130px; text-align:center; border-bottom:1px solid #695831; }
ul#menu_main li { margin:0; padding:0; border-top:1px solid #695831; list-style-type:none; font: bold 9pt/11pt Arial, Helvetica, sans-serif; }
ul#menu_main li a { text-decoration:none; color:#000; display:block; padding:10px 0 10px 0; width:130px; }
ul#menu_main li a:hover { text-decoration:none; background:#bd3c38 url(../images/bokomo/hover_01.jpg) repeat-y top left !important; }
ul#menu_main li a.active { text-decoration:none; background:#bd3c38 url(../images/bokomo/hover_01.jpg) repeat-y top left !important; }

ul#mymenu1 { margin:0; padding:0; width:130px; }
ul#mymenu1 li { margin:0; padding:0; width:130px; }
ul#mymenu1 li a { margin:0; padding:10px 0 10px 0; background:#d7d7d7 url(../images/bokomo/spline_b_01.jpg) repeat-y top left; width:130px; display: block; }

ul#submenu2 { margin:0; padding:0; width:130px; }
ul#submenu2 li { margin:0; padding:0; width:130px; }
ul#submenu2 li a { margin:0; padding:10px 0 10px 0; background:#d7d7d7 url(../images/bokomo/spline_c_01.jpg) repeat-y top left; width:130px; color:#000; display: block; }
ul#submenu2 li a.activesub { color:#fff; }

.hide{ display: none; }
.show{ display: block; }

/* MAIN CONTENT */

div#wrapper{float:left; width:578px; }
div#content{margin: 0; }
div#content p{line-height:1.4; }
div#banner {background:#fff url(../images/bokomo/banner-bg.jpg) no-repeat top left; width:576px; height:461px; }

/* SUBPAGE MAIN AREA STYLES */ 

div#content_sub{ width:558px; height:459px; background:#fff url(../images/bokomo/spline_sub.jpg) repeat-y top left; }
div#content_sub p{line-height:1.4; font: normal 10pt/12pt Arial, Helvetica, sans-serif; }

div#sub_content { width:788px; height:380px; overflow:-moz-scrollbars-vertical; overflow-y:auto; color:#666; margin-left:10px; margin-top:5px;}

div.area_a { }
div.area_b { border-top:2px solid #8b8b8b;  border-right:2px solid #8b8b8b; float:left; width:265px; }
div.area_b p { padding-right:5px; padding-bottom:5px; }
div.area_c { border-top:2px solid #8b8b8b;  width:264px; float:left; }
div.area_c p { margin:0 0 5px 5px; padding:0; }
div.main-image { float:right; margin:30px; }

/* these are the promo box style for the main column */

div#promos { width:139px; margin:20px 0 0 8px; float:right; }
div.box { width:139px; float:left; margin:5px 0 0 0px;  }
div.boxTop { width:139px; float:left; margin:15px 0 0 0px;  }
div.rm { margin-right:0px; }
div.box-title { width:139px; height:18px; color:#fff; font: normal 10pt/12pt Arial, Helvetica, sans-serif; background: url(../images/bokomo/bg_header.gif) no-repeat top left; }
div.boxbg { width:139px; height:138px; background: url(../images/bokomo/bg_promo_01.gif) no-repeat top left; }
div.boxbg img { margin:7px 0 0 0px; }

/* RIGHT COLUMN */

div#right{ float:right; width:153px; text-align:center; }
div#quicklinks { width:570px; margin:5px auto; }
div.ql-top { margin:5px 0 5px 0; }
div.ql-mid { background:#fff url(../images/bokomo/spline_BrandSelector.jpg) repeat-x top left; height:112px;}
div.ql-mid img { margin:6px 0 6px 0; }
div.ql-btm { margin:5px 0 0 0; }

/* TITLE TEXT STYLES */

h2 { color:#95793c; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none }
h4 { color:#fff; font-size: 10px; font-family: Arial, Helvetica, sans-serif; margin:0 20 0 0px; padding:0; }
h4 a { color:#fff; text-decoration:none; }
h5 { color:#afafaf; font: normal 8pt/10pt Arial, Helvetica, sans-serif; margin:0; padding:0; }

.headerLink { color:#95793c; font-weight:bold; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }
.headerLink:hover { color:#8b8b8b; font-weight:bold; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none }
.headerLinkStatic { color:#95793c; font-weight:bold; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }

.categoryHeader { color:#95793c; font-weight:bold; font-size: 16px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }


.brandLink { color:#95793c; font-weight:bold; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }
.brandLink:hover { color:#8b8b8b; font-weight:bold; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none }

.brandProductLink { color:#95793c; font-weight:bold; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }
.brandProductLink:hover { color:#8b8b8b; font-weight:bold; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none }

.variantName{ color:#95793c; font-weight:bold; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }

.infoText{ font:italic 8pt/10pt Arial, Helvetica, sans-serif; font-weight:bold;}


.menu-btm { width:140px; height:66px; float:right; }
.menu { background:#fff url(../images/bokomo/spline.png) repeat-y top left; width:193px; height:662px; float:right; text-align:center; }
.menu_subpage { background:#ceab60 url(../images/bokomo/menu_03.jpg) no-repeat top left; width:195px; height:662px; float:left; text-align:center; }

.menu_main { margin:60px 0 0 0; padding:0; width:130px; text-align:center; border-bottom:1px solid #695831; margin:0; padding:0; border-top:1px solid #695831; list-style-type:none; font: bold 9pt/11pt Arial, Helvetica, sans-serif; }
.menu_main  a { text-decoration:none; color:#000; display:block; padding:10px 0 10px 0; width:130px; }
.menu_main  a:hover { text-decoration:none; background:#bd3c38 url(../images/bokomo/hover_01.jpg) repeat-y top left !important; }
.menu_main  a.active { text-decoration:none; background:#bd3c38 url(../images/bokomo/hover_01.jpg) repeat-y top left !important; }


.nav1 {color:#000000; font-weight:bold; font-size: 11px; font-family: Arial, Helvetica, sans-serif; margin:0;  width:130px; display: block; text-decoration:none;  padding:6px 0 6px 0;}
.nav1:hover{color:#000000; font-weight:bold; font-size: 11px; font-family: Arial, Helvetica, sans-serif; margin:0;  background: url(../images/bokomo/splineRed.jpg) repeat-y top left; width:130px; display: block; text-decoration:none; padding:6px 0 6px 0;}


.nav2 {color:#000000; font-weight:bold; font-size: 11px; font-family: Arial, Helvetica, sans-serif; margin:0;  width:130px; display: block; text-decoration:none;  padding:6px 0 6px 0;}
.nav2:hover{color:#000000; font-weight:bold; font-size: 11px; font-family: Arial, Helvetica, sans-serif; margin:0;  background: url(../images/bokomo/splineRed.jpg) repeat-y top left; width:130px; display: block; text-decoration:none; padding:6px 0 6px 0;}


.nav3 {color:#000000; font-weight:bold; font-size: 11px; font-family: Arial, Helvetica, sans-serif; margin:0;  width:130px; display: block; text-decoration:none;   padding:1px 0 1px 0;}
.nav3:hover{color:#000000; font-weight:bold; font-size: 11px; font-family: Arial, Helvetica, sans-serif; margin:0;  background: url(../images/bokomo/splineRed.jpg) repeat-y top left; width:130px; display: block; text-decoration:none;  padding:1px 0 1px 0;}


.submenu2  { margin:0; padding:0; width:130px; }
.submenu2  a { margin:0; padding:10px 0 10px 0; background:#d7d7d7 url(../images/bokomo/spline_c_01.jpg) repeat-y top left; width:130px; color:#000; display: block; }
.submenu2  a.activesub { color:#fff; }

.catImage{ filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;}

.categoryHeaderDark { color:#95793c; font-weight:bold; font-size: 16px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }

.brandLinkDark { color:#95793c; font-weight:bold; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }
.brandLinkDark:hover { color:#8b8b8b; font-weight:bold; font-size: 14px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none }

.brandProductLinkDark { font-style:italic; color:#a88a4a; font-weight:bold; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0;  }
.brandProductLinkDark:hover {font-style:italic; color:#8b8b8b; font-weight:bold; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0;  }

.recipeSelect{ color:#95793c; font-weight:bold; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none  }

.tester { color:#8b8b8b; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin:10px 0 10px 0; padding:0; text-decoration:none }