﻿
body { background-color: #354550;  font-family: "Open Sans", sans-serif;font-size: 1em;padding: 0px;margin: 0; }
img { max-width: 100%;}
.container { max-width: 900px;padding: 0 0.5em;}
.globalcontainer { margin: 0 auto;max-width: 960px;}
h1,h2,h3,h4 { margin: 0.7em 0;}
input, textarea, select {font-family: 'Open Sans', sans-serif;font-size: 1em;}
.header {position: relative;margin-top: 0px;background-position: center top;background-repeat: no-repeat;/*background-image: url('../img/top1.jpg');*/background-color: #eee;z-index: 500;}
.headerbarlogo { width: 100%;max-width: 100%;}
.navholder { height: 50px;position: absolute;bottom: 0;background-color: #f4f2df;opacity: 0.6;-moz-opacity: 0.6;width: 100%;z-index: 1000;}
.headertext { padding: 0.4em;text-align: center;background-color: 
                  #273c4a;color: #9eb6c6;font-weight: 300;}
				  
				  .footerText {color:#7ea2bb !important;font-weight: 300;margin-top: 2em;}
				  .footerText a { color: #7ea2bb !important;text-decoration: underline;}
.footerText a:hover { color: #fff !important;}

.madeby { color: #7ea2bb !important;text-decoration: none;margin-top: 2em;font-weight: 300;font-size: 0.8em;}
.madeby b { text-decoration: underline;}
.madeby:hover { color: #fff !important;}

.paymentArea {background-color:#dae8f2;padding: 30px;}

b {font-weight: 600;}

.text-cent {text-align:center;}

.beerClub {float:right;max-width:40%;margin-left: 30px;}

.contentbar { background-color: #fff;}

.tbl {}

.tbl th, .tbl td {vertical-align:top;padding-bottom:15px;}
.tbl th {color:#355a73;font-size: 1.2em;font-weight:300;width:20%;}
.tbl input, .tbl textarea {padding:5px;font-family: 'Open Sans', sans-serif; border:1px solid #c8c8c6;}



.mainbody { }

    .mainbody a, .mainbody a:visited, .mainbody a:active { color: #354550; }

        .mainbody a:hover { color: #355a73; }

    .mainbody h1 { color: #354550 !important; font-size: 2em; font-weight: 300;text-decoration: none;}
    .mainbody h2 { color: #355a73 !important; font-size: 1.6em; font-weight: 300; text-decoration: none;}
    .mainbody h3 { color: #355a73 !important; font-size: 1.4em; font-weight: 300; text-decoration: none;}
    .mainbody h4 { color: #355a73 !important; font-size: 1.2em; font-weight: 300; text-decoration: none;}
    a , a h2, a h3, a h4, a h5 { text-decoration: none; }

    .mainbody ol, .mainbody ul  { margin: 1em 0 1em 2em;}
    .mainbody ol { list-style-type: decimal;}
    .mainbody ul { list-style: disc;}
    .mainbody p { margin-bottom: 1em;}
    .mainbody img[align=left] {margin:1em 1em 1em 0;}
    .mainbody img[align=right] {margin:1em 0 1em 1em;}

    .insaneheader { font-size: 3em !important;text-align: center;margin-bottom: 1em;}

#navmenu { height: 50px; position: absolute; bottom: 0; z-index: 2000;width: 100%; }
#navmenu nav {text-align: center;}

nav ul ul { display: none; }
nav a { text-decoration: none !important; }
nav ul li:hover > ul { display: block; }


nav ul {margin: 0; padding: 0 20px; list-style: none; position: relative; display: inline-table;display: inline-block; }
    nav ul:after { content: ""; clear: both; display: block; }

    nav ul li { float: left; }
        nav ul li:hover { background: #354550; }
            nav ul li:hover a { color: #fff; }

        nav ul li a { display: block; line-height: 50px; padding: 0px 20px; color: #393831;font-size: 1.2em; }


    nav ul ul { background: #354550; border-radius: 0px; padding: 0; position: absolute; top: 100%; }
        nav ul ul li { float: none; border-top: 1px solid #354550; border-bottom: 1px solid #354550; position: relative; }
            nav ul ul li a {padding: 5px 30px; line-height: 30px; color: #393831; }
                nav ul ul li a:hover { background: #466276; }

        nav ul ul ul { position: absolute; left: 100%; top: 0; }

        nav select { font-size: 1em;margin-left: 0.3em;background-color: #f4f2df;color: #393831;border: 0px solid transparent;opacity: 0.8;}

        /* styles for desktop */
.tinynav { display: none;height: 50px;}
.tastingnote {display: block;text-align: left;margin-top: 5px;color: #9c9c9c !important;}

.reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(0,0,0,.8); z-index: 100; display: none; top: 0; left: 0; }

.reveal-modal { visibility: hidden; top: 50px; left: 50%; width: 760px; margin-left: -380px; height: 500px; overflow: auto; background: #eee url(../img/modal-gloss.png) no-repeat -200px -80px; position: absolute; z-index: 101; padding: 30px 40px 34px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 0 10px rgba(0,0,0,.4); -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4); -box-shadow: 0 0 10px rgba(0,0,0,.4); color: #3d383a; }

    .reveal-modal.small { width: 200px; margin-left: -140px; }
    .reveal-modal.medium { width: 400px; margin-left: -240px; }
    .reveal-modal.large { width: 600px; margin-left: -340px; }
    .reveal-modal.xlarge { width: 800px; margin-left: -440px; }

    .reveal-modal .close-reveal-modal { font-size: 40px; line-height: .5; position: absolute; top: 8px; right: 11px; color: #333; text-shadow: 0 -1px 1px rbga(0,0,0,.6); font-weight: bold; cursor: pointer; } 


/* styles for mobile */
@media screen and (max-width: 760px) {
    .tinynav { display: block }
    #MainMenu ul { display: none }
    .reveal-modal { visibility: hidden; left: 0px;width: 90%; margin-left: 4%; height: 300px; }
    .tbl input, .tbl textarea {width:100%;}
}
		
.pt50 {padding-top:50px;}
.pd10 {padding:10px !important;}
blockquote { border: 0px;border-top: 1px solid #fff;border-bottom: 1px solid #fff;padding: 25px 0; width: 90%;margin: 15px auto; }
blockquote p {font-size: 1.2em;font-weight: 400 !important;text-align: center;color: #330000;}
    blockquote cite {  display: block; }

#basketcontainer { opacity: 0.5; position: absolute; top: 0px; right: 30px; width: 190px; height: 45px; text-align: right; padding-right: 40px; background-repeat: no-repeat; background-position: right top; color: #333; background-color: #220d09; -webkit-border-bottom-right-radius: 8px; -webkit-border-bottom-left-radius: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-bottomleft: 8px; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; z-index: 4000; }
    #basket {position:absolute;top: 0px;right:30px;width: 190px;height:45px;text-align:right;padding-right:40px;color:#fff;z-index: 5000;font-size: 0.9em;}
#basket a {color:#e5ded3;}
#CartAdded {display:none;}

.lblError {border:1px solid #a40400;padding:3px;color:#400807;background-color:#d1b0af;margin: 10px 0;text-align: center;display:block;max-width:150px;}
.rederror {border:1px solid #a40400;padding:10px;color:#400807;background-color:#d1b0af;margin: 20px 0;text-align: center;}
.hidden {display:none;}
.cartRow { width: 100%;border-bottom: 1px solid #fff;padding-bottom: 0.4em;margin-bottom: 0.4em;}

.cartrImage { width: 10%;float: left;margin-right:2%;}
.cartrImage img { width: 100%;max-width: 100%;}
.cartrDetails { width: 98%;}
.cartrDetails div { margin-right: 1%;float: left;line-height: 3em;} /* cart is 5 columns. */
.cartrName { width: 40%;font-size: 1.4em;color: #220d09;}

.cartfooter {margin: 3em 0 0 0;text-transform:uppercase;font-size: 1em;line-height:32px;color:#e1e1e1;}
.btnModal {
    background-color: #b00f09;
    color:#fff;
}
.btnCartGo {float:right;background-color:#b00f09;color:#fff;display:inline-block;padding:3px 10px;font-weight:400;cursor:pointer;}
.btnCartGo:hover {background-color:#400807;}
.btnCartGo a {color:#fff !important;}

.cartrQty { width: 10%;}
.cartrQty input { width: 1.4em;font-size: 1.3em;}
.cartrTotalCol, .cartrTotalLeftCol {line-height: 1.2em !important;}
.cartrTotal { width: 15%;text-align: right;}
.cartrTotalCol { width: 29%;}
.cartrTotalLeftCol { width: 50%;}
.cartGrandTotal { font-size: 1.3em;font-weight: 600;line-height: 3em !important;}
.cartrUpdateQty { width: 50%;float: left;text-align: center;}
.cartTermsAndConditionsRow { font-size: 1.1em;color: #4e4e4e;margin-bottom: 0.4em;text-align: center;}
.cartrButtonRow { margin: 0.6em;line-height: 1.6em;padding: 0.5em;}
.cartrNumberOfBottles { width: 49%;float: left;color: #4e4e4e;font-size: 1.2em;text-align: center;}
.button {cursor: pointer;padding: 6px; -webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;border: 0px;text-decoration: none;}

.cartUserInptHdr { font-size: 1.4em;font-weight: 300;}
.cartUserInpt input, .cartUserInpt textarea { background-color: #fff;font-size: 1em;width: 100%;border: 1px solid #c8c8c6;}
.buttonGrey { background-color: #c8c8c6;color: #767676;}
.buttonGrey:hover { background-color: #b2b2b2;}
.buttonCol { height: 2.6em;}
.buttonCartStep { background-color: #354550;font-size: 1.1em;color: #fff !important;text-align: center;}
.xsmall { color: #767676;font-size: 0.8em;}
.buttonCartStep:hover { background-color: #273c4a;}

.priceStrike {color:#45102c; text-decoration: line-through;}
.priceSpecialLblCont {margin:5px 0;text-align:center;line-height: 1em !important;}
.priceSpecialLbl {background-color:#b00f09;color:#fff;padding:3px;margin: 5px 0;text-transform:uppercase;font-size: 11px !important;margin:0 auto;line-height: 1em !important;}
.beer .priceSpecialLblCont {text-align:left !important;}
.discount {float: none; text-align: right;font-size: 1.0em;
font-weight: 400;width: 100%;text-decoration: none;}
.discount span {padding: 8px;background-color:#354550;color:#fff;display:block;text-align:center;margin: 1em 0;}

.alignLeft { text-align: left;}
.alignRight { text-align: right;}
.alignCent { text-align: center;}

.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
.cf { zoom: 1; }

.mtb30 {margin: 30px 0;}
.mt50 {margin: 50px 0;}
.mt10 {margin: 10px 0;}

.thelogo { text-align: center;}


.buyonlineblock {background-color:#d3dee5;padding: 5px;text-align:center;}
    .buyonlineblock h4 {
        text-align:center;
    }
.buyonlineblock h5 {font-size:1.3em;text-align:center !important; }
.buyonlineblock h5 div {text-align:center;}
.beerimg { text-align: center;}
.beerimg { max-width: 100%;}
.beerimg img {max-width:80%;max-height:420px;margin:0 auto;}
.beerimg  a {width:45%;}
.beerpane { padding: 1em;background-color: #f8f8f8;}
.beerleft { width: 69.9%;float: left;}
.beerright { width: 25%;float: left;}
.beerleft { margin-right: 5%;}
.beer { min-height:730px;float: left;margin: 0 2.4% 2em 2.4%;width: 44%;border-bottom: 1px solid #fff;padding-bottom: 0.4em;}
.beer a { text-decoration: none;}
.beertext h4 { font-size: 1.3em;text-align: center;}
.beertext p { height: 7em;}
.beeradd {display:inline-block;}
.beerBtnContainer { text-align: center;padding: 0.4em 0em}
.beerBtnContainer a, .beeradd {cursor:pointer; padding: 0.4em 0.8em;background-color: #e1e1e1;color: #333;margin: 0.5em 0;}
.beerBtnContainer a:hover,.beeradd { background-color: #354550;color: #fff;}
.beeradd:hover {background-color:#7ea2bb;}
.beerquickstat {font-weight: 300;font-size: 1.5em;font-style: italic;color: #757575;}
#ytplayer { margin: 1em 0 2em 0;}
.badgeDownload { margin-top: 1em;text-align: center;}
.badgeDownload small {text-align: center;color: #757575;margin-bottom: 1em;display: block;}
.beerpaneimg { text-align: center;}

.rightBtn {float:right;width:49%;text-align:right;}
.leftBtn {float:left;width:49%;}

.accoladeBadge {margin-left: 5px;
    font-size: 0.8em;float:right;}
.accoladeBadge  { color: #9c9c9c !important;}
.accoladeBadge img { max-width: 20px;width: 20px;}
.accolades h4 { font-size: 1em;margin-bottom: 1em;}

.block { float: left;margin: 0 2.4%;}
.block50 { width: 40%;border: 1px solid red;}
.block30 { width: 28%;}
.block20 { width: 20%;}
.blocktext h1, .blocktext h2, .blocktext h3, .blocktext p { text-align: center;}
.blockimg img { width: 100%;max-width: 100%;}

.beertitlebar { padding: 0.4em 0.8em;color: #fff;background-color:#354550;margin-top: 1.4em;}
.beertitlebar h1 { margin: 0;color: #fff !important;display: inline;font-weight: 300;}
.beertitlebartype { display: inline;margin-left: 1em;font-style: italic;}
.Stonecutter { background-color: #b00f09;}
.Elemental { background-color: #45102c;}
.Craftsman { background-color: #45220f;}
.Discovery { background-color: #dd9019;}
.Perfection {background-color:#535409}
.Paradox {background-color:#bba26a}
.MPA { background-color: #1e600d;}
.Voyager { background-color: #378a8a;}
.Tribute { background-color: #653616;}
.Abundance {background-color:#4F3035}
.Grandmaster {background-color:#C8BA00;}
.Odyssey {background-color:#BC5F36;}
.person { float: left;margin: 0 2.4%;width: 44%;border-bottom: 1px solid #fff;padding-bottom: 0.4em;margin-bottom: 0.4em;}
.persontext h2 { font-size: 1em;margin-top: 0.1em !important;}
.persontext h3 { font-size: 1.2em;margin-bottom: 0.1em !important;}
.persontext p { height: 16em;}
.personimg { width: 90%;margin: 0 auto;}
.personimg img { width: 100%;max-width: 100%;}

.what { float: left;margin: 0 2.4%;width: 40%;padding-bottom: 0.4em;margin-bottom: 0.4em;}
.whatdesc h3 { font-size: 1.1em;margin-bottom: 0.1em !important;color: #501b1b !important;}
.whatdesc p {}
.whatdesc { }
.whatimg { width: 40%;margin: 0 auto;}
.whatimg img { width: 100%;max-width: 100%;}
.text-right { text-align: right;}

.linkFooter { color: #330000;}
@media (max-width: 834px) {

    .beertext p { height: 9em;}
     nav ul li a   { font-size: 1em;}
             /*.header { height: 200px;background-position: center bottom;}*/
    .block { float: none;width: 100%;margin: 1em 0%;}
    .blockimg { float: left;width: 15%;margin-right: 5%;}
    .blocktext { float: left;width: 70%;}

        .mainbody img[align=left],.mainbody img[align=right]  { max-width: 30%;}

    .person { width: 45%;}
    .persontext p { height: 25em;}

}

@media (max-width: 675px) {
    .blocktext h1, .blocktext h2, .blocktext h3, .blocktext p { text-align: left;}
                .beer { width: 100%;float: none;margin: 1em 0%;}
        .beerimg { float: left;width: 24%;margin-right: 5%;}
        .beertext { float: left;width: 70%;}
        .beertext p { height: auto;}
        .beertext h4 { font-size: 1.3em;text-align: left;}
            .beerpane { padding: 1em;background-color: #f8f8f8;margin-top: 1.5em;}
.beerleft, .beerright { width: 100%;float: none;margin: 1em 0;}
    .beerBtnContainer { text-align: right;padding: 0.4em 0em}

        .person { width: 100%;float: none;margin: 1em 0%;}
        .personimg { float: left;width: 15%;margin-right: 5%;}
        .persontext { float: left;width: 74%;}
        .persontext p { height: auto;}
     
     .cartrName { font-size: 1em;}
     .cartrDetails div {line-height: 1em;}

.what { float: none;width: 100%;border-bottom: #c8c8c6;padding: 0.4em;margin-bottom: 0.4em;}
.whatdesc { float: left;width: 63%;}
.whatimg { width: 30%;float: left;margin: 0 1% 0 0;}



}

@media (max-width: 600px) {

        /*.header { height: 100px;background-position: center bottom;}*/
}




#gallery { margin: 20px 0; list-style: none; text-indent: 0; padding: 0; }
    #gallery li { width: 150px; height: 150px; float: left; margin: 10px; border: 1px solid #787878; text-indent: 0; padding: 0; -webkit-box-shadow: 1px 1px 5px rgba(99, 99, 99, 0.59); -moz-box-shadow: 1px 1px 5px rgba(99, 99, 99, 0.59); box-shadow: 1px 1px 5px rgba(99, 99, 99, 0.59); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; }
.galimg { }
    .galimg img { width: 100%; height: 100%; }



#jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; }
#jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; }
    #jquery-lightbox a img { border: none; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#lightbox-container-image { padding: 10px; }
#lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none; }
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; }
#lightbox-nav-btnPrev { left: 0; float: left; }
#lightbox-nav-btnNext { right: 0; float: right; }
#lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; }
#lightbox-container-image-data { padding: 0 10px; color: #666; }
    #lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; }
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; }
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; }



/* the norm */
#gritter-notice-wrapper {
	position:fixed;
	top:20px;
	right:20px;
	width:301px;
	z-index:9999;
}
#gritter-notice-wrapper.top-left {
    left: 20px;
    right: auto;
}
#gritter-notice-wrapper.bottom-right {
    top: auto;
    left: auto;
    bottom: 20px;
    right: 20px;
}
#gritter-notice-wrapper.bottom-left {
    top: auto;
    right: auto;
    bottom: 20px;
    left: 20px;
}
.gritter-item-wrapper {
	position:relative;
	margin:0 0 10px 0;
	background:url('../img/ie-spacer.gif'); /* ie7/8 fix */ 
}
.gritter-top {
	background:url(../img/gritter.png) no-repeat left -30px;
	height:10px;
}
.hover .gritter-top {
	background-position:right -30px;
}
.gritter-bottom {
	background:url(../img/gritter.png) no-repeat left bottom;
	height:8px;
	margin:0;
}
.hover .gritter-bottom {
	background-position: bottom right;
}
.gritter-item {
	display:block;
	background:url(../img/gritter.png) no-repeat left -40px;
	color:#eee;
	padding:2px 11px 8px 11px;
	font-size: 0.9em;
}
.hover .gritter-item {
	background-position:right -40px;
}
.gritter-item p {
	padding:0;
	margin:0;
	word-wrap:break-word;
}
.gritter-close {
	display:none;
	position:absolute;
	top:5px;
	left:3px;
	background:url(../img/gritter.png) no-repeat left top;
	cursor:pointer;
	width:30px;
	height:30px;
}
.gritter-title {
	font-size:1em;
	font-weight:bold;
	padding:0 0 7px 0;
	display:block;
	text-shadow:1px 1px 0 #000; /* Not supported by IE :( */
}
.gritter-image {
	width:48px;
	float:left;
}
.gritter-with-image,
.gritter-without-image {
	padding:0 0 5px 0;
}
.gritter-with-image {
	width:220px;
	float:right;
}
/* for the light (white) version of the gritter notice */
.gritter-light .gritter-item,
.gritter-light .gritter-bottom,
.gritter-light .gritter-top,
.gritter-light .gritter-close {
    background-image: url(../img/gritter-light.png);
    color: #222;
}
.gritter-light .gritter-title {
    text-shadow: none;
}

