html, body, #contents {
min-height: 100%;
width: 100%;
height: 100%;
}
html>body, html>body #contents {
height: auto;
}
body {
margin: 0;
background-image: url(/images/bg.gif);
background-color: #FFFFE2;
color: #000000;
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
}
#contents {
position: absolute;
top: 0;
left: 0;
/* Use the following to center this at 50% width, or this for 750px: width: 700px, margin-left: -350px: */
/*
left: 50%;
width: 50%;
margin-left: -25%;
*/
}
#footer {
position: absolute;
bottom: 0;
background-color: #ccffcc;
width: 70%; /* See note below */
text-align: center;
padding: 0 15%;
}
#footer {
\width: 100%;
w\idth: 70%;
}
#main {
margin-bottom: 5em;
height: auto;
padding: .5em;
}
div#fixedbox
{
overflow: auto;
width: 100%;
height: 20px;
position: absolute;
bottom: 0px;
left: 0px;
color: #000000;
text-align: center;
}
div#content
{
padding: 5px;
}
@media screen
{
body>div#fixedbox
{
position: fixed;
}
}
.small_text{color: #000000; font-family: Helvetica, Arial, sans-serif; font-size: 11px; }
a{ color:#8A5216; text-decoration:underline; font-family: Helvetica, Arial, sans-serif; }
a:hover{ color:#FF8400; text-decoration:none; font-family: Helvetica, Arial, sans-serif; }
a.beer_link{ color:#8A5216; text-decoration:underline; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; }
a.beer_link:hover{ color:#FF8400; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; }
.bottom_link_on{ color:#8A5216; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; }
a.bottom_link{ color:#593D20; text-decoration:underline; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; }
a.bottom_link:hover{ color:#FF8400; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; }
a.bottom_link2{ color:#A80000; text-decoration:underline; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; }
a.bottom_link2:hover{ color:#FF0000; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; }
.bottom_text{ color:#593D20; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 12px; }
.title{ color:#BB2A2A; font-family: Helvetica, Arial, sans-serif; font-size: 22px; font-weight: bold; }
.date{ color:#593D20; font-family: Helvetica, Arial, sans-serif; font-size: 24px; font-weight: bold; }
.info_left{ width: 70px; padding: 2px 5px; color:#593D20; vertical-align: middle; font-family: Helvetica, Arial, sans-serif; font-size: 12px; font-stretch: condensed; text-transform: uppercase; font-weight: bold;}
.info_right{ padding: 2px 5px; color:#000000; vertical-align: middle; font-family: Helvetica, Arial, sans-serif; font-size: 16px; }
.info_bottom{ padding: 2px 5px 2px 6px; color:#000000; vertical-align: top; font-family: Helvetica, Arial, sans-serif; font-size: 16px; }
.star{ width: 26px; height: 26px; vertical-align: middle }
a.star_link{ color:#8A5216; text-decoration:underline; font-family: Helvetica, Arial, sans-serif; font-size: 12px; font-weight: normal; }
a.star_link:hover{ color:#FF8400; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 12px; font-weight: normal; }
.star_text{ color:#8A5216; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 11px; font-weight: bold; }
.feedback_left{ width: 85px; padding: 2px 5px; color:#593D20; vertical-align: top; font-family: Helvetica, Arial, sans-serif; font-size: 12px; font-stretch: condensed; text-transform: uppercase; font-weight: bold;}
.input_text{ width: 220px; color:#593D20; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 12px; }
.input_textarea{ width: 320px; height: 200px; color:#593D20; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 12px; }
.input_button{ color:#000000; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size: 12px; }
/* Begin Lightbox Stylesheet */
#lightbox{
position: absolute;
top: 40px;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#lightbox a img{ border: none; }
#outerImageContainer{
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#imageContainer{
padding: 10px;
}
#loading{
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#hoverNav{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{
width: 49%;
height: 100%;
background: transparent url(/images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
display: block;
}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/images/lightbox/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
}
#imageData{
padding:0 10px;
}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; color: #000000; }
#imageData #numberDisplay{ display: block; color: #000000; clear: left; padding-bottom: 1.0em; }
#imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; }
#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
* html>body .clearfix {
display: inline-block;
width: 100%;
}
* html .clearfix {
/* Hides from IE-mac \*/
height: 1%;
/* End hide from IE-mac */
}
/* End Lightbox Stylesheet */