* {
margin: 0;
padding: 0;
}
html {
height: 100%;
}
body {
font: 0.9em/1.1 Tahoma, sans-serif;
color: #fd7;
background: #000;
}
a {
text-decoration: none;
}
a:link, a:visited {
color: #fa0;
}
a:hover {
color: #f80;
}
a:active {
color: #fc0;
}
img {
border: none;
}
hr {
display: none;
}
/* ----------- Headings ----------- */
h1 {
display: none;
}
h2 {
display: block;
}
h3 {
display: block;
font: 1.3em/1.5 Tahoma, sans-serif;
font-weight: normal;
margin: 6px 21px;
letter-spacing: 1px;
color: #fc4;
background: url(img/h3_underline.gif) repeat-x bottom left;
}
h4 {
display: block;
font: 1.2em/1.4 Tahoma, sans-serif;
font-weight: normal;
margin: 22px auto 0 auto;
text-align: center;
letter-spacing: 1px;
color: #fc4;
}
h5 {
font: 1em/1.1 Tahoma, sans-serif;
font-weight: bold;
margin: 14px 0 0 20px;
color: #fc4;
}
/* ---------- Container ---------- */
#top_knot {
height: 30px;
/* height: 36px;
background: #905421 url(img/top_knot.gif) repeat-x center top; */
}
#container-wrapper {
width: 762px;
min-height: 526px;
margin: 0 auto;
}
/* ------------ Header ------------ */
div#header {
width: 300px;
height: 50px;
margin: 12px auto 0 auto;
padding: 75px 117px 7px 117px;
background: url(img/header_back.jpg) no-repeat;
}
a#home, div#title {
display: block;
width: 300px;
height: 50px;
margin: 0 auto;
background: url(img/title.jpg) no-repeat;
}
a#home span, div#title span {
display: none;
}
/* ------------ Content Structure ------------ */
#narrow-content {
width: 594px;
min-height: 486px;
margin: 0 auto;
background: url(img/narrow_content_back.jpg) no-repeat center top;
}
#narrow-cnt-bar {
width: 390px;
min-height: 326px;
margin: 0 auto;
padding: 20px 10px 140px 10px;
background: url(img/narrow_cntbar_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.hotdrink {
background: url(img/cntbar_hotdrink_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.softdrink {
background: url(img/cntbar_softdrink_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.beer {
background: url(img/cntbar_beer_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.snack {
background: url(img/cntbar_snack_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.wine {
background: url(img/cntbar_wine_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.liqueur {
background: url(img/cntbar_liqueur_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.spirit {
background: url(img/cntbar_spirit_btm.jpg) no-repeat center bottom;
}
div#narrow-cnt-bar.shots {
background: url(img/cntbar_shots_btm.jpg) no-repeat center bottom;
}
#wide-content {
width: 762px;
min-height: 482px;
margin: 10px auto 0 auto;
background: url(img/wide_content_back.gif) repeat-y;
}
#wide-cnt-bar {
width: 742px;
min-height: 462px;
margin: 0 auto;
padding: 10px 10px 0 10px;
background: url(img/wide_cnt_top.gif) no-repeat;
}
#wide-cnt-btm {
width: 762px;
height: 8px;
font: .1em/.1 Tahoma, sans-serif;
margin: 10px auto 0 auto;
background: url(img/wide_cnt_bottom.gif) no-repeat;
}
dl.articles {
display: block;
}
dl.articles dd {
display: block;
float: left;
width: 344px;
min-height: 122px;
margin: 13px;
}
ul.article-bar, ul.article-bar li {
display: block;
}
ul.article-bar li.artcl-top {
width: 344px;
height: 6px;
background: url(img/article_bar_top.gif) no-repeat;
}
ul.article-bar li.artcl-content {
width: 322px;
min-height: 98px;
padding: 6px 10px;
background: #522d14 url(img/article_bar_cnt.gif) repeat-x;
border-right: 1px solid #663718;
border-left: 1px solid #663718;
}
ul.article-bar li.artcl-content a span {
display: none;
}
ul.article-bar li.artcl-content p {
margin: 26px 12px 0 52px;
font-size: 11pt;
text-align: left;
}
span.price {
color: #fb0;
}
span.price em {
color: #fb0;
font-style: normal;
margin: 0 4px;
color: #e90;
}
ul.article-bar li.artcl-content img, ul.article-bar li.artcl-content a.artclicon {
float: left;
margin: -1px 62px 3px 0;
}
ul.article-bar li.artcl-btm {
width: 344px;
height: 6px;
background: url(img/article_bar_bottom.gif) no-repeat;
}
/* ------------ Nav Bar ------------ */
div#navbar {
width: 534px;
height: 34px;
margin: 0 auto;
background: url(img/navbar_back.jpg) no-repeat;
}
ul#nav {
display: block;
float: left;
width: 497px;
height: 34px;
margin-left: 37px;
list-style: none;
}
ul#nav li {
float: left;
text-align: center;
margin-top: 1px;
}
ul#nav li a, ul#nav li h2 {
display: block;
float: left;
font-size: 11pt;
font-weight: normal;
text-decoration: none;
border: none;
}
ul#nav li a:link, ul#nav li a:visited {
margin: 0 auto;
padding: 7px 16px 9px 16px;
color: #feb;
}
ul#nav li h2, ul#nav li a#current:link, ul#nav li a#current:visited {
margin: 0 auto;
padding: 7px 16px 9px 16px;
color: #fd7;
background: #a63 url(img/nav_pointer_active.gif) no-repeat center bottom;
}
ul#nav li a:hover, ul#nav li a#current:hover {
margin: 0 auto;
padding: 7px 16px 9px 16px;
color: #4f3028;
background: #ffc860 url(img/nav_pointer.gif) no-repeat center bottom;
}
/* ------------ Content Custom Styles ------------ */
p {
padding: 0;
margin: 10px 20px;
font: .9em/1.4 Tahoma, sans-serif;
text-align: justify;
}
p.larger {
padding: 0;
margin: 20px 20px;
text-align: justify;
}
p.first:first-letter {
font: 2em/1 Georgia, serif;
color: #ef8c2c;
margin: 0 2px 0 -2px;
}
div.hr {
height: 2px;
font: .1em/.1 Tahoma, sans-serif;
clear: both;
}
ul.linx {
margin: 10px 36px;
font: 1em/1.3 Tahoma, sans-serif;
}
.centred {
display: block;
margin: 0 auto;
}
img.location-map {
display: block;
margin: 0 auto;
padding: 1px;
border: 1px solid #af7c40;
}
ul.menu {
font: 1em/1.2 Tahoma, sans-serif;
margin: 6px 0 0 14px;
padding: 0;
list-style: none;
}
ul.menu li {
display: block;
clear: both;
padding-top: 4px;
}
ul.menu li span {
display: block;
float: left;
}
ul.menu li:hover span {
background: url(img/hilight_back.png);
cursor: default;
}
ul.menu li span.article {
width: 204px;
padding: 0 0 2px 6px;
font-weight: bold;
}
ul.menu li span.quantity {
width: 50px;
padding: 0 5px 2px 0;
text-align: right;
}
ul.menu li span.price {
width: 75px;
padding: 0 5px 2px 0;
text-align: right;
}
ul.menu li span.price em {
font: 1.2em/.9 Georgia, serif;
}
/* ------ Article Icons & Decoration ------ */
a.artclicon {
display: block;
width: 100px;
height: 100px;
background: #952;
}
a#hot-drinks:link, a#hot-drinks:visited {
background: url(img/artclicon_hot_drinks.jpg) no-repeat;
}
a#hot-drinks:hover, a#hot-drinks:active {
background: url(img/artclicon_hot_drinks.jpg) no-repeat right;
}
a#soft-drinks:link, a#soft-drinks:visited {
background: url(img/artclicon_soft_drinks.jpg) no-repeat;
}
a#soft-drinks:hover, a#soft-drinks:active {
background: url(img/artclicon_soft_drinks.jpg) no-repeat right;
}
a#beers:link, a#beers:visited {
background: url(img/artclicon_beers.jpg) no-repeat;
}
a#beers:hover, a#beers:active {
background: url(img/artclicon_beers.jpg) no-repeat right;
}
a#snacks:link, a#snacks:visited {
background: url(img/artclicon_snacks.jpg) no-repeat;
}
a#snacks:hover, a#snacks:active {
background: url(img/artclicon_snacks.jpg) no-repeat right;
}
a#wines:link, a#wines:visited {
background: url(img/artclicon_wines.jpg) no-repeat;
}
a#wines:hover, a#wines:active {
background: url(img/artclicon_wines.jpg) no-repeat right;
}
a#liqueurs:link, a#liqueurs:visited {
background: url(img/artclicon_liqueurs.jpg) no-repeat;
}
a#liqueurs:hover, a#liqueurs:active {
background: url(img/artclicon_liqueurs.jpg) no-repeat right;
}
a#spirits:link, a#spirits:visited {
background: url(img/artclicon_spirits.jpg) no-repeat;
}
a#spirits:hover, a#spirits:active {
background: url(img/artclicon_spirits.jpg) no-repeat right;
}
a#shots:link, a#shots:visited {
background: url(img/artclicon_shots.jpg) no-repeat;
}
a#shots:hover, a#shots:active {
background: url(img/artclicon_shots.jpg) no-repeat right;
}
div.angle-dcr {
position: absolute;
width: 234px;
height: 122px;
margin: 0 -20px -20px 113px;
background: url(img/angle_dcr.gif) no-repeat;
}
/* ------------ Footer ------------ */
div#footer {
display: block;
clear: both;
width: 762px;
height: 38px;
padding: 0;
margin: 16px auto 0 auto;
text-align: center;
color: #567;
font-size: .8em;
}
div#footer span {
display: none;
}
div#footer span#copyright {
display: inline;
font-size: 1.1em;
}
div#footer a, div#footer a:link {
color: #89a;
margin: 0 4px;
}
div#footer a:hover, div#footer a:active {
color: #abd;
}
div#footer img {
vertical-align: middle;
margin-bottom: 1px;
}