html { height: 100%; margin-bottom: 1px; }
body { background-color: #c0c0c0; height: 100%; margin-bottom: 1px; }
* { border: 0; margin: 0; padding: 0; }
/* global */
body { font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif; }
h1, h2, h3, h3, h4, h5, h6 { font-weight: normal; line-height: normal; }
h1 { color: #263756; font-family: "Segoe UI Bold Italic", sans-serif; font-size: 36px; font-weight: bold; line-height: 36px; margin: 0 0 18px; }
h2 { color: #263756; font-family: "Segoe UI Bold Italic", sans-serif; font-size: 24px; font-weight: bold; line-height: 18px; margin: 0 0 18px; }
h3 { color: #51576c; font-size: 18px; line-height: 18px; margin: 0 0 18px; }
h4 { color: #51576c; font-size: 14px; font-weight: bold; line-height: 18px; margin: 0 0 12px; }
h5 { color: #51576c; font-size: 12px; font-weight: bold; line-height: 18px; margin: 0 0 12px; }
p { color: #605c54; font-size: 12px; line-height: 18px; margin: 0 0 18px; }
ul, ol { color: #605c54; font-size: 12px; line-height: 18px; list-style-position: inside; margin: 0 0 18px; }
li ul, li ol { margin: 0 0 0 18px; }
a { color: #51576c; outline: none; text-decoration: none; }
a:hover { text-decoration: underline; }
hr { background-color: #b4b4b4; border: 0px; color: #b4b4b4; display: block; height: 1px; margin: 0; !margin: -7px; /* IE */ margin-bottom: 18px; !margin-bottom: 11px; }
table { font-size: 12px; }
td { vertical-align: middle; }
label { display: block; font-size: 12px; }
input, textarea, select { border: 1px #ccc solid; color: #636363; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; padding: 2px; }
input, select { vertical-align: middle; }
@font-face { font-family: "Segoe UI Bold Italic"; src: url(/includes/fonts/segoeuiz.ttf); }
@font-face { font-family: "Segoe UI Bold"; src: url(/includes/fonts/segoeuib.ttf); }
/* layout divs */
#container { background-color: #fff; background-image: url(/template/container-bg.png); background-repeat: repeat-y; margin: 0 auto; overflow: hidden; width: 980px; }
#container.home { background-image: none; }
#header { clear: both; height: 273px; margin: 0 auto; overflow: auto; width: 980px; }
#banner { display: block; }
#sidebar { float: left; padding: 0 0 0 70px; width: 164px; }
#sidebar #sidenav { font-family: Arial, Helvetica, sans-serif; font-size: 15px; list-style: none outside; width: 135px; }
#sidebar #sidenav li { margin: 0 0 15px; }
#sidebar #sidenav a { color: #14223d; }
#sidebar #sidenav a.active { font-weight: bold; }
#container #sidebar-footer { float: left; margin: 0 0 0 50px; }
#container #sidebar-footer ul li { display: inline; margin: 0 0 0 10px; }
#container.home #sidebar { margin: 0 35px 0 0; padding-bottom: 0; padding-top: 0; width: 262px; }
#container.home #sidebar h2 { color: #263756; font-size: 18px; font-weight: bold; }
#container.home #sidebar-footer { float: none; margin: 0; padding: 0 0 20px 30px; position: static; }
#container.home
#sidebar-footer ul li.first { margin: 0; }
#container.home #sidebar
table.operation-hours { color: #605c54; font-size: 12px; margin: 0 0 20px; }
#container.home #sidebar
table.operation-hours td { width: 50%; }
#content { float: left; padding: 20px 0 10px 45px; width: 650px; min-height: 300px; height: auto !important; height: 300px; }
#container.home #content { padding: 20px 0 10px; width: 595px; }
#container.home #content p.address { color: #263756; clear: both; font-size: 14px; font-weight: bold; }
#footer { clear: both; margin: 0 auto; text-align: center; width: 890px; }
#footer ul { color: #898989; font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; list-style: none outside; }
#footer li { display: inline; }
#footer ul li:after { content: " |"; }
#footer li.last:after { content: ""; }
#footer a { color: #898989; }
#footer a:hover { color: #999; }
#home-sidenav-container { background-color: #b2b5c1; background-image: url(/template/home-sidebar-bcurve.png); background-position: bottom center; background-repeat: no-repeat; margin: 0 0 20px; padding: 15px 30px 10px; width: 202px; }
#home-sidenav { list-style: none outside; margin: 0; }
#home-sidenav li { background-repeat: no-repeat; height: 26px; margin: 0 0 10px; padding: 10px 0 0 55px; }
#home-sidenav #specials { background-image: url(/template/specials-icon.png); }
#home-sidenav #coupons { background-image: url(/template/coupons-icon.png); }
#home-sidenav #newsletter { background-image: url(/template/newsletters-icon.png); }
#home-sidenav #gallery { background-image: url(/template/gallery-icon.png); }
#home-sidenav #blog { background-image: url(/template/blog-icon.png); }
#home-sidenav #links { background-image: url(/template/links-icon.png); }
#home-sidenav a { color: #51576c; font-family: "Segoe UI Bold", sans-serif; font-size: 14px; font-weight: bold; text-transform: uppercase; }
#home-sidenav a:hover,
#home-sidenav a.active { color: #263756; }
#news { overflow: hidden; }
#news h2 { float: left; color: #263756; font-family: "Segoe UI Bold Italic", sans-serif; font-size: 36px; font-weight: bold; line-height: 36px; margin: 0; padding: 0 0 18px; }
#news h3 { color: #51576c; font-size: 20px; margin: 0 0 9px; }
#news h3 span.date { font-size: 12px; text-transform: uppercase; }
#news-heading { float: left; width: 590px; }
#news-heading img.view-articles { float: right; width: 168px; }
div.news-content { float: left; padding: 0 0 10px; width: 100%; }
div.news-content img { border: 1px solid #ccc; float: left; margin: 0 10px 0 0; position: relative; top: 5px; }
/* main navigation */
#nav-container { background-color: #4d4d4d; margin: 0 auto; padding: 0 0 0 20px; width: 960px; }
#nav { font-size: 18px; line-height: 60px; /* Navigation bar height */ }
#nav ul { line-height: 35px; }
#nav, #nav ul { list-style: none; margin: 0 auto; padding: 0; position: relative; }
#nav a { background-color: #4d4d4d; border-left: 1px #707070 solid; color: #fff; display: block; font-family: "Segoe UI Bold", sans-serif; font-weight: bold; padding: 0 30px; text-decoration: none; }
#nav a.last { border-right: 1px #707070 solid; }
#nav a:hover, #nav li:hover a,
#nav li a.active { background-image: url(/template/nav-active-bg.png); background-repeat: repeat-x; text-shadow: 1px 1px 2px #000; }
#nav li:hover ul li a { background-image: none; text-shadow: none; }
#nav li:hover ul li a.active { text-shadow: 1px 1px 2px #000; }
#nav li { float: left; height: 65px; margin: 5px 0 0; position: relative; }
#nav ul { display: none; font-size: 1em; position: absolute; top: 65px; /* Must equal #nav line-height */ width: 190px; }
#nav li ul li { border: 0; height: auto; margin: 0; background-color: #8c94a5; padding: 0 10px; }
#nav li ul li.first { background-image: url(/template/nav-drop-shadow.png); background-repeat: repeat-x; }
#nav li ul a { border: 0; background-color: #8c94a5; border-bottom: 1px #31415f solid; color: #14223d; float: left; font-family: Arial, Helvetica, sans-serif; font-size: 15px; font-weight: normal; height: auto; padding: 0 5px 0 20px; width: 190px; }
#nav li ul li.last a { border: 0; }
#nav li ul a:hover,
#nav li ul a.active { background-color: #8c94a5; background-image: none; color: #fff; }
#nav li ul li.first a { background-image: url(/template/nav-drop-shadow.png); background-repeat: repeat-x; padding-top: 7px; }
#nav ul ul { top: auto; }
#nav li ul ul { width: 190px; margin: 0 0 0 30px; /* Left-margin should be double the left and right paddings of #nav a */ }
#nav li:hover ul ul,
#nav li:hover ul ul ul,
#nav li:hover ul ul ul ul { display: none; }
#nav li:hover ul,
#nav li li:hover ul,
#nav li li li:hover ul,
#nav li li li li:hover ul { display: block; }
#nav #nav-home { height: 35px; padding: 25px 20px 0; width: 20px; }
/* products section */
#container.products #content { padding: 0 0 10px 20px; width: 700px; }
#container.products #content a { color: #b48800; }
#container h4.breadcrumb { font-size: 13px; font-weight: normal; text-transform: uppercase; margin-bottom: 18px; }
#products_search { border-bottom: 1px solid #e0dcb7; padding-bottom: 15px; width: 100%; margin-bottom: 15px; }
#products_search img { float: left; }
#products_search h2 { color: #6c5200; font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif; font-size: 18px; font-weight: normal; margin: 0 0 10px; }
#products_search td { padding: 0 5px 5px 0; }
#products_search select { width: 99%; }
#container .product_cat p { margin-bottom: 3px; line-height: 15px; text-align: left; }
#container .product_cat h4 { margin-bottom: 2px; text-transform: uppercase; color: #b38807; }
#container .product_cat .allcaps { font-size: 9px; color: #535353; }
#container .product_cat img { margin-bottom: 10px; }
#container .product_list h4 { margin-bottom: 2px; text-transform: uppercase; }
#container .product_list td { padding-bottom: 20px; vertical-align: top; }
#container .product_list td.addinfo { padding-top: 6px; padding-left: 20px; }
#container .product_list td.price { font-size: 9px; color: #746743; padding: 0px; padding-bottom: 0px; text-align: right; vertical-align: bottom; }
#container .product_list p { margin-bottom: 2px; }
#container .product_list .small { font-size: 9px; color: #535353; margin-bottom: 5px; line-height: normal; }
#container .product_list .flavour { }
#container .product_list em { color: #6b5106; }
/* article and catalogues */
#articles { float: left; margin: 0 40px 0 0; width: 400px; }
#articles-sidebar { float: left; width: 200px; }
#articles-sidebar .links { float: left; margin: 10px 0; }
#articles-sidebar .links p { margin: 0 0 9px; }
div .article-title { font-weight: bold; margin: 0 0 4px; }
div h4.article-title { font-size: 12px; }
div p.comment { font-size: 10px; margin: 0 0 18px; text-transform: uppercase; }
#container.home #articles { width: 350px; }
#blog-archive-list { clear: both; font-size: 12px; }
/* forms */
#searchform input { border: 0; }
#searchform select { border: 1px #ccc solid; }
#searchform table { font-size: 12px; }
#archive-form-container { background: #fff url(/template/search-bg.png) no-repeat bottom left; height: 39px; width: 148px; }
#container.home
#archive-form-container { margin-top: 54px; }
#archive-form { }
#archive-form label { color: #263756; text-transform: uppercase; }
#article-search { background: none; border: 0; float: right; margin: 2px 5px 0 0; width: 115px; }
#friend-referral-form { width: 400px; }
#friend-referral-form #sender-name,
#friend-referral-form #sender-email,
#friend-referral-form #friends-name,
#friend-referral-form #friends-email{ width: 160px; }
#friend-referral-form #comment { height: 100px; width: 335px; }
#comment-form { width: 350px; }
#comment-form #comment { height: 100px; width: 300px; }
#submit-key { float: left; }
#subscribe-form { overflow: hidden; width: 380px; }
#subscribe-form .form-row { display: block; }
#subscribe-form label { float: left; width: 100px; }
#subscribe-form label.error { display: block; margin-left: 100px; width: 200px; }
#subscribe-form .form-row.submit { margin-bottom: 5px; margin-left: 100px; }
#subscribe-form #subscribe-name,
#subscribe-form #subscribe-email { width: 200px; }
#contact-form { width: 380px; }
#contact-name, #contact-email { width: 135px; }
#contact-message { height: 100px; width: 295px; }
#contact-name { margin: 0 10px 0 0; }
div label.error { font-size: 10px; color: #ce665f; }
div input.error,
div textarea.error { border: 1px solid #f99; background-color: #fdd; }
div.form-row { float: left; margin-top: 10px; }
div.form-row div { display: inline; float: left; margin-right: 10px; }
div.form-row.first { margin: 0; }
div.form-row.last { margin-bottom: 15px; }
div.form-row.submit { clear: both; margin: 15px 0; }
input.submit { float: left; }
div.form-row #loader { float: left; margin: 2px 0 0 10px; visibility: hidden; }
/* library */
ul.inline-list li { display: inline; list-style: none outside; }
div .float-left { float: left; }
div .float-right { float: right; }
div.spacer { background: #fff; clear: both; height: 20px; margin: 0 auto; width: 980px; }
div .uppercase { text-transform: uppercase; }
.subtext { font-size: 10px; }
/* clear fix */
div.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
div.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
div.clearfix { display: block; }