@import url( http://fonts.googleapis.com/css?family=Roboto+Condensed:300,700|Roboto:400,300&subset=latin,cyrillic );
h1 {
	margin: 10px 0px 15px !important; text-align: center; color: rgb(0, 0, 0); font-family: "Roboto Condensed", arial, serif; font-size: 50px;
}
h2 {
	margin: 0px;
}
h3 {
	margin: 0px;
}
body {
	background: rgb(255, 255, 255); margin: 0px; font-family: Calibri; _text-align: center;
}
iframe {
	vertical-align: middle !important;
}
.fb_ltr {
	margin-top: 5px;
}
.infoPanel {
	width: 511px; color: rgb(0, 0, 0); margin-top: 30px; margin-left: 342px; display: none; position: absolute;
}
.infoPanel a {
	color: rgb(255, 204, 51);
}
.infoPanel a:hover {
	color: orange;
}
.infoPanel #infoName {
	font-weight: bold;
}
.infoPanel #infoText {
	
}
.infoPanel #infoExample {
	font-style: italic;
}
.container {
	_text-align: left;
}
.title {
	margin: 5px 0px;
}
.moving {
	position: absolute !important; z-index: 30 !important;
}
.type-title {
	height: 30px; text-align: center; color: white; font-family: Roboto; font-size: 10px; font-weight: bold;
}
.group-title {
	border-width: 2px 0px 0px; border-style: solid; border-color: white; margin: 8px 0px; padding: 5px 0px 0px; text-align: center; color: white; font-family: arial; font-size: 10px; font-weight: bold;
}
.ale.group-title {
	border-color: red; color: red; font-family: Roboto;
}
.lager.group-title {
	border-color: orange; color: orange; font-family: Roboto;
}
.element .content {
	margin-top: 2px;
}
.element .mask {
	margin-top: 2px;
}
.element .blank {
	margin-top: 2px;
}
.mask {
	background: url("images/fakesquare.png"); width: 55px; line-height: 55px; position: relative; z-index: 100;
}
.content {
	background: green; border: 2px solid blue; border-image: none; width: 51px; height: 51px; font-size: 50px; margin-top: -55px !important; position: relative; z-index: 1;
}
.content .top {
	margin: 2px 2px 0px; height: 26%; font-size: 11%;
}
.content .top .left {
	background: black; width: 13px; height: 13px; text-align: center; color: white; padding-top: 2px; font-size: 6pt !important; font-weight: bold; margin-top: -2px; margin-left: -2px; float: left;
}
.content .top .right {
	text-align: right;
}
.content .middle {
	margin: 0px 2px; height: 48%; text-align: center; font-size: 18%; font-weight: bold;
}
.content .bottom {
	margin: 0px 2px 2px; height: 26%; font-size: 10%;
}
.content .bottom .left {
	float: left;
}
.content .bottom .right {
	text-align: right;
}
.element .blank {
	background: none; width: 55px; line-height: 55px;
}
.column-1 .element .content {
	border-color: rgb(245, 204, 97); background-color: rgb(248, 232, 160);
}
.column-1 .type-title {
	color: rgb(245, 204, 97);
}
.column-2 .element .content {
	border-color: rgb(100, 144, 37); background-color: rgb(198, 214, 113);
}
.column-2 .type-title {
	color: rgb(100, 144, 37);
}
.column-3 .element .content {
	border-color: rgb(154, 154, 154); background-color: rgb(212, 212, 212);
}
.column-3 .type-title {
	color: rgb(154, 154, 154);
}
.column-4 .element .content {
	border-color: rgb(213, 100, 24); background-color: rgb(253, 159, 87);
}
.column-4 .type-title {
	color: rgb(213, 100, 24);
}
.column-5 .element .content {
	border-color: rgb(133, 38, 142); background-color: rgb(224, 173, 207);
}
.column-5 .type-title {
	color: rgb(133, 38, 142);
}
.column-6 .element .content {
	border-color: rgb(242, 97, 178); background-color: rgb(247, 188, 216);
}
.column-6 .type-title {
	color: rgb(242, 97, 178);
}
.column-7 .element .content {
	border-color: rgb(186, 131, 10); background-color: rgb(222, 195, 139);
}
.column-7 .type-title {
	color: rgb(186, 131, 10);
}
.column-8 .element .content {
	border-color: rgb(82, 59, 13); background-color: rgb(164, 138, 94);
}
.column-8 .type-title {
	color: rgb(82, 59, 13);
}
.column-9 .element .content {
	border-color: rgb(65, 65, 65); background-color: rgb(138, 138, 138);
}
.column-9 .type-title {
	color: rgb(65, 65, 65);
}
.column-10 .element .content {
	border-color: rgb(70, 70, 70); background-color: rgb(112, 112, 112);
}
.column-10 .type-title {
	color: rgb(70, 70, 70);
}
.column-11 .element .content {
	border-color: rgb(126, 126, 84); background-color: rgb(238, 243, 218);
}
.column-11 .type-title {
	color: rgb(126, 126, 84);
}
.column-12 .element .content {
	border-color: rgb(83, 121, 134); background-color: rgb(130, 188, 199);
}
.column-12 .type-title {
	color: rgb(83, 121, 134);
}
.column-13 .element .content {
	border-color: rgb(202, 166, 178); background-color: rgb(232, 219, 224);
}
.column-13 .type-title {
	color: rgb(202, 166, 178);
}
.column-14 .element .content {
	border-color: rgb(95, 77, 72); background-color: rgb(186, 167, 153);
}
.column-14 .type-title {
	color: rgb(95, 77, 72);
}
.left {
	float: left;
}
.srm-title {
	color: rgb(0, 0, 0); font-family: Roboto; font-size: 12px; font-weight: bold;
}
.srm-tile {
	margin: 5px 1px; width: 20px; height: 20px;
}
.srm-value {
	text-align: center; color: rgb(0, 0, 0); font-family: arial; font-size: 10px; font-weight: bold;
}
.beerInfo {
	display: none;
}
.beerExample {
	display: none;
}
.leftAdPanel {
	left: 90px;
}
.rightAdPanel {
	left: -360px;
}
.leftAdPanel {
	padding: 10px; border: 10px solid rgb(26, 26, 26); border-image: none; top: 120px; width: 320px; position: absolute; z-index: 40; opacity: 0.95; background-color: rgb(20, 20, 20);
}
.rightAdPanel {
	padding: 10px; border: 10px solid rgb(26, 26, 26); border-image: none; top: 120px; width: 320px; position: absolute; z-index: 40; opacity: 0.95; background-color: rgb(20, 20, 20);
}
.adTitle {
	color: rgb(255, 255, 255); font-size: 20px;
}
.adDesc {
	color: rgb(153, 153, 153); font-size: 14px;
}
.adSite a {
	color: rgb(186, 131, 10); font-size: 12px; text-decoration: none;
}
.adAddress {
	color: rgb(83, 121, 134); font-size: 12px;
}
.adMapLink {
	border: 0px currentColor; border-image: none; float: right;
}
.ad {
	cursor: pointer;
}
.leftAds {
	top: 80px; width: 90px; position: absolute;
}
.rightAds {
	top: 80px; width: 90px; position: absolute;
}
.leftAds div {
	padding: 3px 3px 30px; border: 1px dashed rgb(0, 0, 0); border-image: none;
}
.rightAds div {
	padding: 3px 3px 30px; border: 1px dashed rgb(0, 0, 0); border-image: none;
}
.leftAds div:hover {
	border: 1px dashed rgb(58, 58, 58); border-image: none; background-color: rgb(20, 20, 20);
}
.rightAds div:hover {
	border: 1px dashed rgb(58, 58, 58); border-image: none; background-color: rgb(20, 20, 20);
}
.leftAds h3 {
	color: rgb(255, 255, 255); font-size: 12px;
}
.rightAds h3 {
	color: rgb(255, 255, 255); font-size: 12px;
}
.leftAds p {
	color: rgb(153, 153, 153); font-size: 9px;
}
.rightAds p {
	color: rgb(153, 153, 153); font-size: 9px;
}
.ad .adSite {
	display: none;
}
.ad .adAddress {
	display: none;
}
.footer {
	margin-top: 10px; border-top-color: rgb(42, 42, 42); border-top-width: 1px; border-top-style: solid; background-color: rgb(26, 26, 26);
}
.footer a {
	color: rgb(255, 255, 255); text-decoration: none;
}
.footer a:hover {
	color: rgb(186, 131, 10);
}
.adsWrapper {
	width: 90px; margin-top: 70px; position: absolute;
}
.selected {
	border-color: rgb(255, 204, 51) !important; background-color: rgb(255, 255, 41) !important;
}