/*
Theme Name: lbc
Theme URI: http://localbrewing.co
Description: Local Brewing Co.
Version: 1.0
Author: Gamut
Author URI: http://gamutsf.com
*/

/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #ff4419;
    text-shadow: none;
}

::selection {
    background: #ff4419;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   YUI 3.5.0 reset.css (http://developer.yahoo.com/yui/3/cssreset/) - http://cssreset.com
   ========================================================================== */

html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

/* ==========================================================================
   Fonts
   ========================================================================== */

@font-face {
    font-family: 'Local Headline';
    src: url('fonts/localheadline-bold-webfont.eot');
    src: url('fonts/localheadline-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/localheadline-bold-webfont.woff2') format('woff2'),
         url('fonts/localheadline-bold-webfont.woff') format('woff'),
         url('fonts/localheadline-bold-webfont.ttf') format('truetype'),
         url('fonts/localheadline-bold-webfont.svg#local_headlinebold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Trade Gothic Roman';
    src: url('fonts/tradegothic-webfont.eot');
    src: url('fonts/tradegothic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/tradegothic-webfont.woff2') format('woff2'),
         url('fonts/tradegothic-webfont.woff') format('woff'),
         url('fonts/tradegothic-webfont.ttf') format('truetype'),
         url('fonts/tradegothic-webfont.svg#tradegothicroman') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Trade Gothic Bold';
    src: url('fonts/tradegothic-bold-webfont.eot');
    src: url('fonts/tradegothic-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/tradegothic-bold-webfont.woff2') format('woff2'),
         url('fonts/tradegothic-bold-webfont.woff') format('woff'),
         url('fonts/tradegothic-bold-webfont.ttf') format('truetype'),
         url('fonts/tradegothic-bold-webfont.svg#tradegothicbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TradeGothicLTStdBdCn20';
    src: url('fonts/tradegothicltstd-bdcn20-webfont.eot');
    src: url('fonts/tradegothicltstd-bdcn20-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/tradegothicltstd-bdcn20-webfont.woff') format('woff'),
         url('fonts/tradegothicltstd-bdcn20-webfont.ttf') format('truetype'),
         url('fonts/tradegothicltstd-bdcn20-webfont.svg#TradeGothicLTStdBdCnNo.20') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'TradeGothicLTStdCn18';
    src: url('fonts/tradegothicltstd-cn18-webfont.eot');
    src: url('fonts/tradegothicltstd-cn18-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/tradegothicltstd-cn18-webfont.woff') format('woff'),
         url('fonts/tradegothicltstd-cn18-webfont.ttf') format('truetype'),
         url('fonts/tradegothicltstd-cn18-webfont.svg#TradeGothicLTStdCnNo.18') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'fenwayparkjfregular';
    src: url('fonts/FenwayParkJF-webfont.eot');
    src: url('fonts/FenwayParkJF-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/FenwayParkJF-webfont.woff2') format('woff2'),
         url('fonts/FenwayParkJF-webfont.woff') format('woff'),
         url('fonts/FenwayParkJF-webfont.ttf') format('truetype'),
         url('fonts/FenwayParkJF-webfont.svg#fenwayparkjfregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'local-icon';
  src: url('fonts/local-icon.eot');
  src: url('fonts/local-icon.eot') format('embedded-opentype'),
       url('fonts/local-icon.woff') format('woff'),
       url('fonts/local-icon.ttf') format('truetype'),
       url('fonts/local-icon.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'modern_pictograms_proregular';
  src: url('fonts/modernpictogramspro_2-webfont.eot');
  src: url('fonts/modernpictogramspro_2-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/modernpictogramspro_2-webfont.woff') format('woff'),
       url('fonts/modernpictogramspro_2-webfont.ttf') format('truetype'),
       url('fonts/modernpictogramspro_2-webfont.svg#modern_pictograms_proregular') format('svg');
  font-weight: normal;
  font-style: normal;  
}

/* icons */

[class^="icon-"]:before, [class*=" icon-"]:before {
	font-family: 'local-icon';
}

.ding {
	font-family: 'modern_pictograms_proregular';
}

.icon-instagram:before { content: '\e800'; } /* '' */
.icon-sliders:before { content: '\e801'; } /* '' */
.icon-search:before { content: '\e802'; } /* '' */
.icon-target:before { content: '\e803'; } /* '' */
.icon-hoppy:before { content: '\e804'; } /* '' */
.icon-boozy:before { content: '\e805'; } /* '' */
.icon-complex:before { content: '\e806'; } /* '' */
.icon-export:before { content: '\e807'; } /* '' */
.icon-menu:before { content: '\e808'; } /* '' */
.icon-dot-3:before { content: '\e809'; } /* '' */
.icon-untappd:before { content: '\e80a'; } /* '' */

/* ==========================================================================
   Global
   ========================================================================== */

html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
	position: relative;
	background: black;
	font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif; 
	font-weight: 400;
}

body.stopScroll {
	overflow: hidden;
}

.content {
	max-width: 1000px;
	width: 100%;
}

h1 {}
h2 {
	font-size: 42px;
}
h3 {
	font-size: 16px;
}

a:focus {
	outline: 0;
	color: inherit;
	text-decoration: none;
}

img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

	#map img {
		max-width: none;
	}

.tooltip {
	padding: padding: 0 5px !important;
}

.tooltip .tooltip-inner {
	padding: 20px;
	font-size: 13px;
	font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif; 
	min-width: 250px;
}

.button,
button {
	border: 0;
	outline: 0;
	font-size: 22px;
	padding: 6px 32px;
	letter-spacing: 1px;
	text-align: center;
	display: inline-block;
  margin-bottom: 10px;
	
	/*
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	*/
}
  .button.small,
	button.small {
		padding: 6px 18px;
		font-size: 16px;
	}
	.button.large,
	button.large {
		padding: 8px 60px;
		font-size: 26px;
	}
	.button.launch,
	button.launch {
		background: #ee3423;
		font-family: 'Local Headline';
		text-transform: uppercase;
		color: white;
	}

	@media only screen and (max-width: 767px) and (orientation: portrait) {
		.button {
			width: 100%;
			display: block;
			margin: 0 auto;
			margin-bottom: 10px;
		}
	}

	.buttons {
		padding: 30px 0 0;
	}
	.buttons a {
		border: 0;
		outline: 0;
		font-size: 22px;
		padding: 6px 32px;
		letter-spacing: 1px;
		margin: 0px 5px;
		display: inline-block;
    margin-bottom: 10px;
		
		/*
		font-smoothing: antialiased;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		*/
	}
	.buttons a.large {
		padding: 8px 60px;
		font-size: 26px;
	}
	.buttons a.launch {
		background: #ee3423;
		font-family: 'Local Headline';
		text-transform: uppercase;
		color: white;
	}

	@media only screen and (max-width: 767px) and (orientation: portrait) {
		.buttons a {
			width: 100%;
			display: block;
			margin: 0 auto;
			margin-bottom: 10px;
		}
	}
	
.linebreak {
	margin: 20px auto 30px;
}

.embed-container { 
	position: relative; 
	padding-bottom: 56.25%; 
	height: 0; 
	overflow: hidden; 
	max-width: 100%; 
} 
	.embed-container iframe, 
	.embed-container object, 
	.embed-container embed { 
		position: absolute; 
		top: 0; 
		left: 0; 
		width: 100%; 
		height: 100%; 
	}
	
.visibility-web {
	display: block;
}

.visibility-tablet {
	display: none;
}

.visibility-mobile {
	display: none;
}

header {
	position: fixed;
	background: #ee3423;
	font-family: 'Local Headline';
	width: 100%;
	height: 60px;
	top: 0px;
	left: 0px;
	z-index: 11;
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
}
	header .title {
		display: none;
	}
	
	header nav {
		position: relative;
		color: white;
		/*max-width: 1000px;*/
		margin: 0 auto;
		line-height: 60px;
		padding: 0px 25px;
		padding-left: 10px;
		text-transform: uppercase;
		letter-spacing: 1px;
		z-index: 1;
	}
		header nav .nav-container {
			max-width: 1000px;
			margin: 0 auto;
		}
	header nav.sub {
		position: fixed;
		background: rgba(0,0,0,0.85);
		width: 100%;
		height: 50px;
		top: 60px;
		left: 0px;
		z-index: 1;
		max-width: 100%;
		line-height: 50px;
		padding-left: 25px;
		padding: 0;
	}
	header nav li.active nav.sub {
		z-index: 0;
	}
		header nav.sub ul {
			max-width: 1000px;
			max-width: 1035px;
			margin: 0 auto;
			padding-left: 130px;
			font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif;
			text-transform: initial;
			letter-spacing: 0px;
		  min-width: 1000px;
		}
		header.minimized nav.sub ul {
		  padding-left: 16px;
		}
			header nav.sub ul > li {}	
				header nav.sub ul > li:first-child {
					
				}
				header nav.sub ul > li,
				header nav.sub ul > li > a {
					
				}
				header nav.sub ul > li:hover,
				header nav.sub ul > li > a:hover,
				header nav.sub ul > li.active
				 {
					color: #ee3423;
					background: none;
				}
		header nav .icon-menu {
			position: fixed;
			font-size: 32px;
			display: none;
			cursor: pointer;
		}			
		header nav ul {
			list-style: none;
		  padding: 0;
		  margin: 0;
		}
			header nav ul > li  {
			  display: inline-block;
			  *display: inline;
			  zoom: 1;
			  float: left;
				display: block;
				cursor: pointer;
				font-size: 17px;
				transition: all 200ms ease-in-out;
			}
				header nav ul > li > a {
					padding: 0;
					float: none;
					color: inherit;
					padding: 0px 18px;
					padding: 15px 18px;
					transition: all 200ms ease-in-out;
				}
				header nav ul > li:hover {
					background: #2c2b2c;
					background: rgba(0,0,0,0.2);
				}
				header nav ul > li.active {
					background: #2c2b2c;
					background: rgba(0,0,0,0.85);
				}
					header nav ul > li:hover a {
						color: inherit;
						text-decoration: none;
					}
				header.minimized > nav > ul {
					margin-left: -30px;
				}
				header nav ul li.logo {
					position: relative;
					width: 134px;
					margin-top: -35px;
					padding-right: 4px;
					padding-left: 0px;
					margin-left: -14px;
					z-index: 2;
				}
					header nav ul li.logo svg {
						height: 130px;
					}
					header.minimized nav ul li.logo {
						height: 95px;
						overflow: hidden;
						z-index: -1;
						left: 14px;
					}
					header.minimized nav ul li.logo svg path,
					header.minimized nav ul li.logo svg polygon {
						fill: #bf3427;
					}
					header nav ul li.logo:hover {
						background: none;
						margin-top: -35px;
					}
					header nav ul li.logo a {
						padding: 0;
					}
				header nav ul li.home {
					display: none;
				}
					header.minimized nav ul li.home {
						display: block;
						margin-left: -78px;
					}
				header nav ul li.socials {
					text-transform: none;
					float: right;
				}
					header nav ul li.socials:hover {
						background: none;
					}
					header nav ul li.socials ul {}
						header nav ul li.socials ul li {
							color: #2c2b2c;
							padding: 0px 5px;
							font-size: 26px;
						}
						header nav ul li.socials ul li a {
							padding: 0px;
						}
							header nav ul li.socials ul li:first-child {
								padding-left: 18px;
							}
							header nav ul li.socials ul li:hover {
								background: none;
								color: white;
							}
							header nav ul li.socials ul li a.instagram {
								font-size: 19px;
								margin-top: 2px;
								display: block;
							}
							header nav ul li.socials ul li a.untappd {
								font-size: 21px;
							}
				header nav .account {
					float: right;
				}
					header nav .account:hover,
					header nav .account li:hover {
						background: none;
					}
					header nav .account li.login-btn:hover {
						background: #2c2b2c;
						background: rgba(0,0,0,0.2);
					}
					header nav .account .username {
						margin-right: 10px;
					}
						header nav .account .username:hover {
							background: none;
						}
					header nav .account .avatar {
						background: #2c2b2c;
						border-radius: 50%;
						width: 36px;
						height: 36px;
						padding: 0px;
						margin-top: 12px;
						position: relative;
						overflow: hidden;
					}
						header nav .account .avatar img {
							position: absolute;
							top: 0px;
							left: 0px;
						}
			
.intro {
	background:url(img/splash_bg.jpg) 50% 0 repeat; 
	position: fixed;
	z-index: 9999999999999999;
	width: 100%;
	height: 100%;
	overflow: hidden !important;
	background-size: cover;
}
.intro .main {width: 760px; position: relative; margin: 0 auto; margin-top: 0px; z-index:1;}
.intro .main .statement {margin-top: 150px; float: left; width: 360px;}
.intro .main .title {font-family: 'TradeGothicLTStdBdCn20'; color: #000; font-size: 50px; text-transform: uppercase; line-height: 1em;}
.intro .main .warning {font-family: 'TradeGothicLTStdBdCn20'; color: #ee3124; text-transform: uppercase; margin-top: 15px;}
.intro .agecheck {width: 151px; position: relative; float:left;}
.intro .logo {background:url(img/agecheck-logo.png) 0 0 no-repeat; width: 286px; height: 357px; position: relative; margin-top: 80px; float: left; margin-right: 60px; margin-left: 30px; }
.intro button {background:url(img/splash_button.png) 0 0 no-repeat; height: 51px; width: 151px; position: relative; margin: 0 auto; border: none; box-shadow: none; margin-top: 15px;}
.intro .top-right { position:absolute; top:0px; right:0px; background: url(img/agecheck-topright.png) 0 0 no-repeat; width:132px; height:198px; z-index:0; }
.intro .bottom-left { position:absolute; bottom:0px; left:0px; background: url(img/agecheck-bottomleft.png) 0 0 no-repeat; width:345px; height:447px; z-index:0; }


main {
	position: relative;
/* 	margin-top: 56px; */
	padding-top: 60px;
}
	main section {
		position: relative;
		width: 100%;
		min-height: 600px;
		background: black;
		color: white;
	}
		main section .content {
			margin: 0 auto;
			max-width: 1000px;
			padding: 80px 40px;
			display: table;
		}
			main section .content .left {
				width: 50%;
				float: left;
			}
			main section .content .right {
				width: 50%;
				float: right;
			}
			main section .content h1,
			main section .content h2 {
				font-family: 'Local Headline';
				line-height: 1em;
				letter-spacing: 1px;
			}
			
			main section .content h2 {
				font-size: 42px;
				text-transform: uppercase;
			}
			
		main section#masthead {
			height: 300px;
			min-height: 300px;
		}
			main section#masthead:before {
				content: '';
			  position: absolute;
			  bottom: 0px;
			  height: 20%;
			  background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
			  width: 100%;
			}
			main section#masthead .content h1 {
				position: absolute;
				top: 56%;
				transform: translateY(-50%);
				font-size: 60px;
				text-transform: uppercase;
			}
			
			
		/* HOME */
			
		.home main section#hero {
			font-smoothing: antialiased;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			min-height: 480px;
		}
			.home main section#hero .carousel-inner {

			}
			.home main section#hero .carousel-caption {
				position: relative;
				left: auto;
				right: auto;
				padding: 0;
				bottom: auto;
				width: 100%;
			}
			.home main section#hero .carousel-caption:before {
				content: '';
				background: rgba(0,0,0,0.25);
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				z-index: 0;
			}
			.home main section#hero .carousel-indicators li {
				background: white;
				border: 0;
				margin: 0 4px;
			}
				.home main section#hero .carousel-indicators li.active {
					background: #EE3423;
					position: relative;
					top: 1px;
				}
			.home main section#hero .item {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
			}
			.home main section#hero .content {
				position: relative;
				z-index: 1;
			}
				.home main section#hero .content h1 {
					font-size: 90px;
					text-transform: uppercase;
					line-height: 1.1em;
					width: 80%;
					margin: 0 auto;
					margin-bottom: 8px;
				}
				.home main section#hero .content h3 {
					width: 80%;
					font-size: 24px;
					margin: 0 auto;
					font-weight: 200;
				}
			.home main section#hero #pagination {
				position: absolute;
				z-index:3;
				bottom: 20px;
			}
				
		.home main section#finder {}
			.home main section#finder h2 {
				font-size: 42px;
				text-transform: uppercase;
				margin-bottom: 30px;
				margin-top: 90px;
				color: #ee3423;
				width: 90%;
			}
			.home main section#finder h3 {
				line-height: 1.6em;
				width: 90%;
			}
			.home main section#finder button {
				margin-top: 60px;
			}

		.home main section.cta-block {
			position: relative;
			overflow: hidden;
		}
			.home main section.cta-block.shaded:after{
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				background: rgba(0,0,0,0.5);
				width: 100%;
				height: 100%;
				z-index: 0;
			}
			.home main section.cta-block .content {
				position: relative;
				z-index: 1;
			}
			.home main section.cta-block h2 {
				font-size: 42px;
				text-transform: uppercase;
				margin-bottom: 30px;
				margin-top: 90px;
				color: #ee3423;
				width: 90%;
			}
			.home main section.cta-block h3 {
				line-height: 1.6em;
				width: 90%;
			}
			.home main section.cta-block .button,
			.home main section.cta-block button {
				margin-top: 60px;
			}
			.home main section.cta-block:nth-child(odd) .content .left {
				float: right;
			}

			@media only screen and (max-width: 767px) and (orientation: portrait) {
				.home main section.cta-block .content .left {
					float: none;
					width: 100%;
				}
			}
			
		.home main section#learn {
			background: url(img/bg-grunge.png) 50% 0 repeat-y;
			background-size: 100% auto;
			text-align: center;
			color: #2c2b2c;
		}
			.home main section#learn h2 {
				font-size: 42px;
				text-transform: uppercase;
				color: #ee3423;
				width: 90%;
				text-align: center;
				margin: 0 auto;
				margin-bottom: 20px;
				margin-top: 70px;
			}
			.home main section#learn .items {}
				.home main section#learn .items .item {
					width: 33.3333%;
					margin-bottom: 50px;
					float: left;
					display: block;
					color: inherit;
					text-decoration: none;
				}
					.home main section#learn .items .item .image {
						width: 180px;
						height: 180px;
						background: #2d2d2d;
						border-radius: 50%;
						overflow: hidden;
						margin: 0 auto;
						margin-bottom: 50px;
					}
					.home main section#learn .items .item .title {
						font-family: 'TradeGothicLTStdBdCn20';
						font-size: 32px;
						font-weight: 400;
						text-transform: uppercase;
						margin-bottom: 10px;
					}
						.home main section#learn .items .item:hover .title {
							color: #EE3421;
						}
					.home main section#learn .items .item .description {
						line-height: 1.6em;
						width: 90%;
						margin: 0 auto;
						font-size: 16px;
					}
			
		.home main section#story {
			background: black;
			min-height: 0;
		}
			.home main section#story .content {
				padding: 0px;
				max-width: 100%;
			}
		
		
		/* BEER */		
		
		.beer main section#masthead {}
		
		.beer main section#beerlist {
			background: url(img/bg-grunge.png) 50% 0 repeat-y;
			background-size: 100% auto;
			color: #2c2b2c;
			overflow: hidden;
			min-height: 650px;
		}
			.beer main section#beerlist h2 {
				margin-top: 30px;
			}
			.beer main section#beerlist .content {
				display: block;
			}
			.beer main section#beerlist .content .left {}
				.beer main section#beerlist .content .left h2 {
					float: left;
					display: block;
				}
				.beer main section#beerlist .content .left .selector {
					float: left;
					display: block;
					margin-top: 40px;
					font-size: 18px;
					margin-left: 30px;
				}
			.beer main section#beerlist .content .right {
				position: relative;
				margin-top: 40px;
				z-index: 1;
			}
				.beer main section#beerlist .content .right .filters {
					font-size: 18px;
					float: right;
				}
					.beer main section#beerlist .content .right .filters .filter {
						float: left;
						margin-left: 30px;
						cursor: pointer;
					}
						.beer main section#beerlist .content .right .filters .filter.active {
							color: #ee3423;
						}
					
			.beer main section#beerlist #list {
				position: relative;
				top: 0px;
				width: 100%;
				height: 100%;
				left: 0px;
				/*overflow-x: scroll;*/
			}
				.beer main section#beerlist #list .mCSB_scrollTools .mCSB_draggerContainer {
				  position: absolute;
				  top: auto;
				  bottom: 40px;
				  right: 0;
				  height: auto;
				  margin: 0 auto;
				  max-width: 1000px;
				  padding: 0px 40px;
				  left: 0;
				}
				.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
					background-color: #EE3423;
					margin: 0;
					height: 8px;
					border-radius: 0;
				}
				.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
					position: relative !important;
					top: 8px;
				}
				.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
				  height: 8px;
				  margin: 0;
				  border-radius: 0;
				  background-color: rgba(0, 0, 0, 0.1);
				}
				.mCSB_scrollTools.mCSB_scrollTools_horizontal {
					position: absolute;
					height: auto;
				}
				.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
				.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
					position: absolute;
					top: 0px;
					width: 60px;
					height: 100%;
					background:black;
				}
				.beer main section#beerlist #list .scroller {
					/*
					position: absolute;
					
					top: 130px;
					left: 50%;
					margin-left: -480px;
					*/
					
					width: 100%;
					margin-top: 120px;
					position: relative;
					display: table;
				}
					.beer main section#beerlist #list .scroller .item {
						float: left;
						display: block;
						margin-right: 0px;
						width: 25%;
						padding: 20px;
						cursor: pointer;
						position: relative;
						height: 460px;
					}
						.beer main section#beerlist #list .scroller .item:hover {
							background: rgba(0,0,0,0.1);
						}
						.beer main section#beerlist #list .beer-sum .image {
							width: 100%;
							height: 156px;
							/*
							border-radius: 50%;
							background: black;
							*/
						}
							.beer main section#beerlist #list .beer-sum .image img {
								max-width: 100%;
								/*max-width: 84px;*/
								max-height: 100%;
								margin: 0 auto;
								display: block;
								/* margin-left: 10px; */
								width: auto;
							}
						
						.beer main section#beerlist #list .beer-sum .name {
							font-family: 'Trade Gothic Bold';
							text-transform: uppercase;
							font-weight: 400;
							letter-spacing: -0.5px;
							-webkit-font-smoothing: antialiased;
							font-size: 24px;
							margin-bottom: 12px;
							text-align: center;
						}
							.beer main section#beerlist #list .beer-sum.ale .name { color: #333333; }
							.beer main section#beerlist #list .beer-sum.wheat .name { color: #d0a600; }
							.beer main section#beerlist #list .beer-sum.india-pale-ale .name,
							.beer main section#beerlist #list .beer-sum.ipa .name { color: #42c777; }
							.beer main section#beerlist #list .beer-sum.pale-ale .name { color: #199999; }
							.beer main section#beerlist #list .beer-sum.red-ale .name { color: #ee3423; }
							.beer main section#beerlist #list .beer-sum.stout .name { color: #482d19; } 
							.beer main section#beerlist #list .beer-sum.porter .name { color: #482d19; }
						
						.beer main section#beerlist #list .beer-sum .description {
							margin-bottom: 12px;
							font-size: 15px;
							text-align: center;
						}
						
						.beer main section#beerlist #list .beer-sum .stats {
							font-family: 'Trade Gothic Bold';
							text-transform: uppercase;
							margin-bottom: 12px;
							margin-top: 24px;
							font-size: 15px;
							text-align: center;
						} 
						
						.beer main section#beerlist #list .beer-sum .levels {
							margin: 0 auto;
							width: 92px;
							display: table;
						}
						.beer main section#beerlist #list .beer-sum .levels .level {
							width: 31px;
							height: 34px;
							line-height: 34px;
							font-size: 12px;
							text-align: center;
							border-radius: 100%;
							color: #fff;
							font-weight: normal;
							display: block;
							float: left;
							position: relative;
							z-index: 1;
						}
							
							.beer main section#beerlist #list .beer-sum .levels [class^="icon-"], 
							.beer main section#beerlist #list .beer-sum .levels [class*=" icon-"] {			
								width: 30px;
								float: left;
								text-align: center;
								position: relative;
							}
								.beer main section#beerlist #list .beer-sum .levels [class^="icon-"]:before, 
								.beer main section#beerlist #list .beer-sum .levels [class*=" icon-"]:before {
									position: absolute;
									left: 0px;
									width: 100%;
									font-size: 32px;
									top: 0px;
									line-height: 32px;
								}
							
								.beer main section#beerlist #list .beer-sum.ale .levels { color: #333333; }
								.beer main section#beerlist #list .beer-sum.wheat .levels { color: #d0a600; }
								.beer main section#beerlist #list .beer-sum.india-pale-ale .levels,
								.beer main section#beerlist #list .beer-sum.ipa .levels { color: #42c777; }
								.beer main section#beerlist #list .beer-sum.pale-ale .levels { color: #199999; }
								.beer main section#beerlist #list .beer-sum.red-ale .levels { color: #ee3423; }
								.beer main section#beerlist #list .beer-sum.stout .levels { color: #482d19; } 
								.beer main section#beerlist #list .beer-sum.porter .levels { color: #482d19; }
		
		.beer main section#curator {
			background: #2c2b2c;
			min-height: 300px;
		}
			.beer main section#curator .content {
				padding-right: 20px;
				position: relative;
			}
			.beer main section#curator .left {
				position: relative;
			  height: auto;
			  left: -26%;
			  max-width: 1000px;
			  margin-top: 84px;
			  margin-bottom: 20px;
			  width: 100%;
			}
				.beer main section#curator .left .poi {
					width: 40px;
					height: 40px;
					background: #EE3423;
					border-radius: 50%;
					color: #FFF;
					position: absolute;
					text-align: center;
					line-height: 40px;
				}
					.beer main section#curator .left .poi.terms {
						top: 40%;
						right: 22.5%;
					}
					.beer main section#curator .left .poi.graph {
						top: 25%;
						right: 72%;
					}
					.beer main section#curator .left .poi.sliders {
						top: 58%;
						right: 64%;
					}
			.beer main section#curator .right {
				width: 40%;
			  float: none;
			  position: absolute;
			  left: 60%;
			  padding-left: 70px;
			  padding-right: 20px;
			  top: 50%;
				transform: translateY(-50%);
			}
			.beer main section#curator .right.tooltip {
				padding: 0 5px;
			}
			.beer main section#curator h2 {
				font-size: 42px;
				text-transform: uppercase;
				margin-bottom: 30px;
				margin-top: 0px;
				width: 100%;
			}
			.beer main section#curator h3 {
				line-height: 1.6em;
				width: 100%;
			}
			.beer main section#curator button {
				margin-top: 30px;
			}
		
		.beer main section#find {}
			.beer main section#find .bar {
				position: absolute;
				width: 100%;
				background: #EE3423;
				z-index: 1;
			}
				.beer main section#find .bar .content {
					padding: 16px 40px;
					padding: 6px 40px;
					position: relative;
				}
				.beer main section#find .bar .content h2 {
					float: left;
					margin-right: 30px;
					margin-top: 2px;
				}
				.beer main section#find .bar .content .left {
					width: 100%;
				}
				.beer main section#find .bar .content form {
					float: left;
					position: relative;
				}
					.beer main section#find .bar .content form .icon-search {
						position: absolute;
						color: #000;
						top: 7px;
						margin-left: 10px;
						font-size: 21px;
					}
					.beer main section#find .bar .content form input {
						height: 38px;
						margin-top: 3px;
						border: 0;
						padding: 0px 10px;
						padding-left: 36px;
						width: 226px;
						outline: 0;
					}
					.beer main section#find .bar .content .reset {
						color: #000;
				    padding: 8px;
				    display: inline-block;
				    line-height: 28px;
				    margin-left: 5px;
				    cursor: pointer;
					}
					.beer main section#find .bar .content .right {
						position: absolute;
						right: 30px;
						width: auto;
					}
						.beer main section#find .bar .content .right .filters {
							font-size: 18px;
							line-height: 46px;
							float: right;
						}
							.beer main section#find .bar .content .right .filters .filter {
								float: left;
								margin-left: 30px;
								cursor: pointer;
							}
								.beer main section#find .bar .content .right .filters .filter.active {
									color: black;
								}
							
			.beer main section#find #results {
				position: absolute;
				left: 0px;
				top: 56px;
				height: 544px;
				background: rgba(0,0,0,0.85);
				width: 40%;
				z-index: 1;
			}
			.beer main section#find #map-canvas {
				position: absolute;
				top: 56px;
				left: 0px;
				width: 100%;
				height: 544px;
			}
				.beer main section#find #results .tap-list {
					height: 100%;
				}
				
		.beer main section.interstitial {
			height: 350px;
			min-height: 350px;
			background: url(img/beer-interstitial.png) 50% 0 no-repeat;
			background-size: cover;
		}
			.beer main section.interstitial .content {
				text-align: center;
			}
				.beer main section.interstitial .content h2 {
					font-size: 36px;
					top: 50%;
					position: absolute;
					width: 100%;
					transform: translateY(-50%);
					left: 0px;
				}
				
				
	/* LEARN */
	
	.learn main section#masthead {
		background: url(img/masthead-learn.png) 50% 0 no-repeat;
		background-size: cover;
	}
	.learn main section#live-local {
		background: url(img/bg-grunge.png) 50% 0 repeat-y;
		background-size: 100% auto;
		max-height: none;
		height: auto;
	}
		.learn main section#live-local .content {}
			.learn main section#live-local .content h2 {
				color: #ee3124;
				margin-top: 30px;
			}
			.learn main section#live-local .content .left {
				width: 50%; 
				float: left; 
				display: block;
				margin-bottom: 0px;
				padding-top: 20px;
				padding-right: 20px;
			}
				.learn main section#live-local .content .left .title {
					font-family: 'TradeGothicLTStdBdCn20';
					font-size: 32px; 
					line-height: 1.1em;
					color: #383738; 
					text-transform: uppercase; 
					margin-bottom: 10px;
				}
					.learn main section#live-local .content .left .title.red {
						color: #ee3124;
					}
				.learn main section#live-local .content .left .text {
					font-size: 18px; 
					color: #383738;
					position: relative; 
					line-height: 1.6em; 
					margin-bottom: 50px;
				}
			.learn main section#live-local .content .right {}
				.learn main section#live-local .content .right .pic {
					position: absolute;
				}
				.learn main section#live-local .content .right .pic_1 {
					top: 5%;
				}
				.learn main section#live-local .content .right .pic_2 {
					top: 20%;
				}
				.learn main section#live-local .content .right .pic_3 {
					top: 40%;
				}
				.learn main section#live-local .content .right .pic_4 {
					top: 70%;
				}
	.learn main section#team {
		background: url(img/bg-paper.png) 50% 0 repeat;
		position: relative;
	}
		.learn main section#team:before {
			content: '';
			position: absolute;
			left: 0px;
			top: -19px;
			width: 100%;
			height: 20px;
			background: url(img/paper-edge-top.png) 50% 0 repeat-x;
		}
		.learn main section#team .content {}
			.learn main section#team .content h2 {
				color: #2c2b2c;
				margin-top: 30px;
			}
				.learn main section#team .content .grid {}
					.learn main section#team .content .grid .item {
						width: 100%;
						text-align: center;
					}
						.learn main section#team .content .grid .item .linebreak {
							margin-top: 0px;
						}
						.learn main section#team .content .grid .item .image {
							width: 190px;
							margin: 0 auto;
							top: 1px;
							position: relative;
						}
						.learn main section#team .content .grid .item .name {
							font-family: 'TradeGothicLTStdBdCn20';
							font-size: 35px; 
							line-height: 1.1em;
							color: #383738; 
							text-transform: uppercase;
							margin-bottom: 4px;
						}
						.learn main section#team .content .grid .item .title {
							font-family: 'TradeGothicLTStdBdCn20';
							font-size: 18px; 
							line-height: 1.1em;
							color: #383738; 
							text-transform: uppercase;
						}
						.learn main section#team .content .grid .item .description {
							color: #383738; 
							margin: 0 auto;
							margin-top: 30px;
							font-size: 16px;
							line-height: 1.6em;
							width: 90%;
						}
					.learn main section#team .content .grid .col-1 {
						margin-bottom: 60px;
					}
						.learn main section#team .content .grid .col-1 .item {
							width: 100%;
						}
							.learn main section#team .content .grid .col-1 .item .name {
								color: #ee3124;
							}
							.learn main section#team .content .grid .col-1 .item .title span {
								font-family: 'fenwayparkjfregular';
								text-transform: capitalize;
							}
							.learn main section#team .content .grid .col-1 .item .image {
								width: 280px;
							}
					.learn main section#team .content .grid .col-3 {
						margin-bottom: 50px;
						display: table;
						width: 100%;
					}
						.learn main section#team .content .grid .col-3 .item {
							width: 33.3333%;
							float: left;
							display: block;
						}
							.learn main section#team .content .grid .col-3 .item .linebreak {
								margin-bottom: 20px;
							}
							.learn main section#team .content .grid .col-3 .item .name {
								font-size: 24px;
							}
							.learn main section#team .content .grid .col-3 .item .title {
								font-size: 16px;
							}
							.learn main section#team .content .grid .col-3 .item .description {
								/*display: none;*/
							}
	.learn main section#guest-brewers {
		background: #2c2b2c;
		min-height: 100px;
	}
		.learn main section#guest-brewers .content {}
			.learn main section#guest-brewers .content h2 {
				color: #ee3124;
				font-size: 24px;
				margin-bottom: 40px;
				margin-top: 10px;
			}
			.learn main section#guest-brewers .content .list {}
				.learn main section#guest-brewers .content .list .item {
					min-height: 200px;
					padding-bottom: 40px;
				}
			.learn main section#guest-brewers .content .left {
				width: 150px;
				position: absolute;
			}
				.learn main section#guest-brewers .content .left .image {
					width: 150px;
			    height: auto;
			    background: #a0a0a0;
			    max-height: 150px;
			    overflow: hidden;
				}
			.learn main section#guest-brewers .content .right {
				width: 100%;
				padding-left: 180px;
			}
				.learn main section#guest-brewers .content .right .linebreak {
					margin: 6px auto;
				}
				.learn main section#guest-brewers .content .right .name {
					font-family: 'TradeGothicLTStdBdCn20';
					font-size: 21px; 
					line-height: 1.1em;
					text-transform: uppercase;
				}
				.learn main section#guest-brewers .content .right .beer {}
					.learn main section#guest-brewers .content .right .beer .brewed {
						font-family: 'fenwayparkjfregular';
						font-size: 21px;
						line-height: 1em;
						font-weight: 400;
						-webkit-font-smoothing: antialiased;
					}
					.learn main section#guest-brewers .content .right .beer .date {
						font-family: 'TradeGothicLTStdBdCn20';
						font-size: 18px; 
						line-height: 1.1em;
						text-transform: uppercase;
						font-weight: 400;
					}
					.learn main section#guest-brewers .content .right .beer .name {
						font-family: 'Local Headline';
						font-size: 21px; 
						line-height: 1.1em;
						text-transform: uppercase;
						font-weight: 400;
						color: #ee3124;
					}
					.learn main section#guest-brewers .content .right .description {
						margin-top: 10px;
						font-size: 16px;
					}
	.learn main section#events {
		background: #ee3423;
		color: #2c2b2c;
		font-size: 16px;
		min-height: 100%;
		height: auto;
	}
		.learn main section#events .content {
			padding: 0px;
		}
		.learn main section#events .left {
			padding-right: 30px;
			padding-left: 30px;
			padding-bottom: 50px;
		}
			.learn main section#events .left h2 {
				font-family: 'fenwayparkjfregular';
				text-transform: capitalize;
				/*text-shadow: 2px 4px 0px #373737;*/
				color: white;
				margin-top: 60px;
				margin-bottom: 15px;
				font-size: 60px;
				transform: translateZ(0);
			}
			.learn main section#events .left p {
				font-size: 18px;
			}
		.learn main section#events .right {
			padding: 40px;
			padding-top: 30px;
			padding-right: 0px;
			min-height: 400px;
			overflow: hidden;
			padding: 0px;
			padding-left: 40px;
			position: relative;
		}
			.learn main section#events .right:after {
				content: '';
				position: absolute;
				top: 0px;
				left: 0px;
				width: 100%;
				background: rgba(255, 255, 255, 0.1);
				height: 100%;
				z-index: 0;
			}
			.learn main section#events .right .mCSB_scrollTools {
				z-index: 2;
			}
			.learn main section#events .right .mCSB_scrollTools .mCSB_draggerContainer {
			  position: absolute;
			  top: 0;
			  right: 0;
			  bottom: 0;
			  height: auto;
			  margin: 0 auto;
			  left: 0;
			  width: 0px;
			}
			.mCSB_scrollTools.mCSB_scrollTools_vertical .mCSB_dragger .mCSB_dragger_bar {
				background-color: #2C2B27;
				border-radius: 0;
				width: 8px;
			}
			.mCSB_scrollTools.mCSB_scrollTools_vertical .mCSB_dragger {
				width: 8px;
			}
			.mCSB_scrollTools.mCSB_scrollTools_vertical .mCSB_draggerRail {
			  border-radius: 0;
			  background-color: rgba(0, 0, 0, 0.2);
			  width: 8px;
			  margin: 0;
			}
			.learn main section#events .right h2 {
				color: white;
				font-size: 28px;
				margin-bottom: 28px;
				position: relative;
				z-index: 1;
				padding-top: 50px;
			}
			.learn main section#events .right .list {
				position: relative;
				z-index: 1;
				padding-right: 30px;
			}
				.learn main section#events .right .list .item {
					margin-bottom: 30px;
				}
					.learn main section#events .right .list .item .event {
						font-family: 'TradeGothicLTStdBdCn20';
						font-size: 21px; 
						line-height: 1.1em;
						text-transform: uppercase;
						font-weight: 400;
					}
					.learn main section#events .right .list .item .event a {
						color: white;
						font-family: 'Trade Gothic Roman';
						text-transform: capitalize;
						font-size: 14px;
						position: relative;
						top: -2px;
						margin-left: 6px;
					}
					.learn main section#events .right .list .item .description {
						margin-top: 10px;
						font-size: 16px;
					}

	.learn main section#live {
			background: black;
			min-height: 0;
		}
			.learn main section#live .content {
				padding: 0px;
				max-width: 100%;
			}
	
	
	/* CONTACT */
	
	.contact main section#masthead {
		background: url(img/masthead-contact.png) 50% 0 no-repeat fixed;
		background-size: cover;
		height: 920px;
		z-index: 0;
	}
		.contact main section#masthead:before {
			display: none;
		}
		.contact main section#masthead .address {
			margin: 0 auto;
			text-align: center;
			margin: 100px auto 180px;
			max-width: 540px;
		}
		.contact main section#masthead .hours {
			height: auto;
			box-sizing: border-box;
			font-family: 'Local Headline';
			color: #fff;
			z-index: 1;
		}
			.contact main section#masthead .hours:after {
				content: '';
				position: absolute;
				bottom: 0px;
				left: 0px;
				width: 100%;
				height: 550px;
				background: rgba(0, 0, 0, 0.6);
				z-index: -1;
			}
			.contact main section#masthead .hours ul.leaders {
		    max-width: 100%;
		    padding: 0;
		    overflow-x: hidden;
		    list-style: none;
		    max-width: 540px;
				margin: 0 auto;
			}
				.contact main section#masthead .hours ul.leaders li:before {
			    float: left;
			    width: 0;
			    white-space: nowrap;
			    content:
				  ". . . . . . . . . . . . . . . . . . . . "
				  ". . . . . . . . . . . . . . . . . . . . "
				  ". . . . . . . . . . . . . . . . . . . . "
				  ". . . . . . . . . . . . . . . . . . . . ";
			}
				.contact main section#masthead .hours ul.leaders span:first-child {
				    padding-right: 0.33em;
				    position: relative;
				    z-index: 0;
				}
					.contact main section#masthead .hours ul.leaders span:first-child:before {
						content: '';
						background: rgba(0,0,0,0.6);
				    position: absolute;
				    width: 100%;
				    height: 100%;
				    z-index: -1;
				    top: 0px;
				    left: 0px;
					}
					.contact main section#masthead .hours ul.leaders span:first-child:after {
						content: '';
						background: url(img/masthead-contact.png) 50% 0 no-repeat fixed;
				    background-size: cover;
				    position: absolute;
				    width: 100%;
				    height: 100%;
				    z-index: -2;
				    top: 0px;
				    left: 0px;
					}
				.contact main section#masthead .hours ul.leaders span + span {
				    float: right;
				    padding-left: 0.33em;
				    position: relative;
				    z-index: 0;
				}
					.contact main section#masthead .hours ul.leaders span + span:before {
						content: '';
						background: rgba(0,0,0,0.6);
				    position: absolute;
				    width: 100%;
				    height: 100%;
				    z-index: -1;
				    top: 0px;
				    left: 0px;
					}
					.contact main section#masthead .hours ul.leaders span + span:after {
						content: '';
						background: url(img/masthead-contact.png) 50% 0 no-repeat fixed;
				    background-size: cover;
				    position: absolute;
				    width: 100%;
				    height: 100%;
				    z-index: -2;
				    top: 0px;
				    left: 0px;
					}

			.contact main section#masthead .hours h5 {
				font-family: 'Trade Gothic Bold';
				font-size: 22px;
				letter-spacing: 1px;
				text-transform: uppercase;
				display: block;
				margin: 15px auto;
				color: white;
				text-align: center;
			}
				.contact main section#masthead .hours ul li {
					font-size: 32px;
					letter-spacing: 1px;
					margin-bottom: 4px;
					font-weight: 100;
					color: white;
					text-align: left;
					line-height: 1em;
				}
					.contact main section#masthead .hours ul li span {
						text-transform: uppercase;
					}
			.contact main section#masthead .phone {
				font-size: 50px;
				color: white;
				text-decoration: none;
				display: block;
				text-align: center;
				margin: 0 auto;
				margin-top: 15px;
			}
			.contact main section#masthead .bar-menu {
				font-size: 24px;
				color: #EE3423;
				text-decoration: none;
				display: block;
				text-align: center;
				margin: 0 auto;
				margin-top: 15px;
			}
		
		.contact main section#map {
			min-height: 300px;
		}
			.contact main section#map #map-canvas {
				width: 100%;
				height: 300px;
			}
			
		.contact main section#contact {
			background: #EE3423;
			min-height: 100px;
			padding-bottom: 50px;
		}
			.contact main section#contact h2 {
				margin-top: 30px;
			}
			.contact main section#contact .items {
				margin-top: 40px;
			}
				.contact main section#contact .items .item {
					width: 25%;
					float: left;
					display: block;
					margin-bottom: 20px;
					min-height: 72px;
				}
					.contact main section#contact .items .item .name {
						font-family: 'Local Headline';
						text-transform: uppercase;
						color: black;
						font-size: 21px;
					}
					.contact main section#contact .items .item .title {
						font-size: 16px;
					}
					.contact main section#contact .items .item .email a {
						color: inherit;
						text-decoration: none;
					}
						.contact main section#contact .items .item .email a:hover {
							text-decoration: underline;
						}
		
		.contact main section#coalition {
			background: url(img/bg-paper.png) 50% 0 repeat;
			position: relative;
			padding-bottom: 50px;
		}
			.contact main section#coalition:before {
				content: '';
				position: absolute;
				left: 0px;
				top: -19px;
				width: 100%;
				height: 20px;
				background: url(img/paper-edge-top.png) 50% 0 repeat-x;
			}
			
			.contact main section#coalition {position: relative; z-index:0;}
			.contact main section#coalition input[type="text"]{ position:relative; width: 270px; height: 33px; border-radius: 5px; padding: 7px; margin-bottom:10px; }
			.contact main section#coalition button { font-family: 'TradeGothicLTStdBdCn20'; font-size: 18px; padding-top: 5px; text-transform: uppercase; height: 45px; background-color: #ec3726; border-radius: 5px; border: none; letter-spacing:0.5px; }
			.contact main section#coalition .top {position: relative; width: 720px; margin: 0 auto; top: 50px;}
			.contact main section#coalition .top .title {
				position: relative;
			  width: 100%;
			  margin: 0 auto;
			  font-family: 'Local Headline';
			  text-transform: uppercase;
			  color: #EE3423;
			  font-size: 60px;
			  text-align: center;
			  line-height: 1em;
			}
			.contact main section#coalition .top .text {font-size: 19px; color: #383738; width: 100%; margin-top: 35px; z-index: 9; position: relative; }
			.contact main section#coalition .sig {background:url('img/sig.png') 0 0 no-repeat; position: absolute; right: 0px; width: 289px; height: 56px; margin: 4px -30px 0px 0px; z-index: 9;}
			.contact main section#coalition .dots {background:url('img/live_dots.png') 0 0 no-repeat; width: 788px; height: 2px; position: relative; margin: 0 auto; top: 90px;}
			.contact main section#coalition .emboss {background:url('img/emboss_logo.png') 0 0 no-repeat; position: absolute; right: 0px; width: 236px; height: 236px; margin: -180px -140px 0px 0px;}
			.contact main section#coalition .bottom {width:800px; position: relative; margin: 0 auto; margin-top: 120px; height: auto;}
			.contact main section#coalition .bottom .block { width: 400px; position: relative; height: auto; float: left; display: block; text-align: center; }
			.contact main section#coalition .bottom .title { position:relative; height:45px; width:100%; margin-bottom: 12px; line-height: 1em; }
			.contact main section#coalition .bottom .text {width: 100%; position: relative; margin-bottom: 20px;}
			.contact main section#coalition .bottom .investors { color: black; }
			.contact main section#coalition .bottom .investors .title {font-family: 'fenwayparkjfregular'; color:black; font-size: 56px; top:-4px; }
			.contact main section#coalition .bottom .investors #send { text-align: center; margin-right: 0px; }
			.contact main section#coalition .bottom .investors #send button {margin-right: 0px;}
			.contact main section#coalition .bottom .geeks { color: black; }
			.contact main section#coalition .bottom .geeks .title {font-family: 'fenwayparkjfregular'; color:black; font-size: 56px; }
			.contact main section#coalition .bottom .geeks #send { text-align: center; margin-right: 0px; }
			.contact main section#coalition .bottom .geeks #send button {margin-right: 0px;}
			
			.contact main section#coalition .content {
				display: block;
			}
			
			.contact main section#coalition .top {
				width: 100%;
			}
			
			.contact main section#coalition .dots {
				width: 100%;
			}
			
			.contact main section#coalition .bottom {
				width: 100%;
			}
			
			.contact main section#coalition .bottom .block {
				width: 50%;
				padding: 0px 20px;
			}
		

footer {
	position: relative;
	background: #2c2b2c;
	width: 100%;
	color: white;
	overflow: hidden;
	z-index: 0;
	padding-bottom: 40px;
}
	footer .content {
		margin: 0 auto;
		max-width: 1000px;
		padding: 40px;
		padding-top: 60px;
		z-index:2;
	}
		footer .left {
			position: relative;
			width: 60%;
			float: left;
			padding-right: 40px;
			/*min-width: 610px;*/
			font-family: 'Trade Gothic Bold';
			border-right: 1px solid #a6a6a6;
		}
			footer nav {
				position: relative;
				display: table;
				width: 100%;
			}
				footer nav.visibility-web {
					display: table;
				}
				footer nav ul {
					position: relative;
					display: table-cell;
					margin-right: 20px;
					width: 25%;
				}
					footer nav ul li {
						margin-bottom: 14px;
						font-size: 15px;
						text-transform: uppercase;
						color: #a6a6a6;
						line-height: 1.1em;
					}
						footer nav ul li.header {
							font-family: 'Local Headline';
							text-transform: uppercase;
							letter-spacing: 1px;
							font-size: 16px;
							color: white;
							line-height: 1em;
						}
						footer nav ul li a,
						footer nav ul li a:hover {
							color: inherit;
							text-decoration: none;
						}
						footer nav ul li a:hover {
							text-decoration: underline;
						}
					
			footer .socials {
				position: relative;
				height: 40px;
				margin-top: 30px;
			}
				footer .socials li {
					color: black;
					padding: 0px 5px;
					font-size: 26px;
					float: left;
					line-height: 40px;
					position: relative;
					background: #ee3423;
					border-radius: 50%;
					width: 40px;
					height: 40px;
					text-align: center;
					color: white;
					margin-right: 16px;
					cursor: pointer;
				}
					footer .socials li:hover {
						color: #2c2b2c;
					}
					footer .socials li a {
						color: inherit;
						text-decoration: none;
					}
					footer .socials li a.instagram {
						font-size: 21px;
					}
					footer .socials li a.untappd {
						font-size: 23px;
					  top: -1px;
					  position: relative;
					}
					
				footer .mailing {
					margin-top: 30px;
				}
					footer .mailing label {
						font-family: 'Local Headline';
						text-transform: uppercase;
						letter-spacing: 1px;
						display: block;
						font-size: 18px;
						margin-bottom: 10px;
					}
					footer .mailing input {
						border: 0;
						outline: 0;
						border-radius: 3px;
						width: 240px;
						height: 40px;
						padding-left: 10px;
					}
					footer .mailing button {
						background: #ee3423;
						border: 0;
						outline: 0;
						border-radius: 3px;
						width: 80px;
						height: 40px;
						color: #FFF;
						position: relative;
						top: 0px;
						display: inline-block;
						margin-left: 4px;
						font-family: 'Trade Gothic Bold';
						letter-spacing: 1px;
						font-weight: 400;
						font-size: 15px;
						padding: 0px;
					}
					
				footer .copyright {
					margin-top: 30px;
					font-size: 10px;
					font-weight: 400;
					color: #a6a6a6;
					font-family: 'Trade Gothic Roman';
				}
					
		footer .right {
			position: relative;
			width: 40%;
			float: right;
		  max-width: 370px;
		  padding-left: 40px;
		}
				
			footer .contact {
				font-family: 'Local Headline';
				color: #fff;
				text-align: center;
				max-width: 350px;
			}
				footer .contact .address {
					max-width: 270px;
					margin: auto;
					padding: 0px;
					text-transform: uppercase;
				}
					footer .contact .address a {
						color: inherit;
						text-decoration: none;
					}
					footer .contact .address span:nth-child(1) { 
						font-size: 74px; 
						font-family: 'Trade Gothic Bold';
						display: block;
						float: left;
						line-height: 1em;
					}
					footer .contact .address span:nth-child(2) { 
						font-size: 40px; 
						float: left;
						margin: 7px 0 0 10px;
						line-height: 1em;
					}
					footer .contact .address span:nth-child(3) { 
						color: #ee3423; 
						font-size: 20px;
						float: left;
						margin: 0 0 0 10px;
						line-height: 1em;
					}
				footer .contact .hours {
					height: auto;
					box-sizing: border-box;
				}
					footer .contact .hours ul.leaders {
				    max-width: 100%;
				    padding: 0;
				    overflow-x: hidden;
				    list-style: none
					}
						footer .contact .hours ul.leaders li:before {
					    float: left;
					    width: 0;
					    white-space: nowrap;
					    content:
						  ". . . . . . . . . . . . . . . . . . . . "
						  ". . . . . . . . . . . . . . . . . . . . "
						  ". . . . . . . . . . . . . . . . . . . . "
						  ". . . . . . . . . . . . . . . . . . . . ";
					}
						footer .contact .hours ul.leaders span:first-child {
						    padding-right: 0.33em;
						    background: #2c2b2c;
						    margin-left: 0px;
						}
						footer .contact .hours ul.leaders span + span {
						    float: right;
						    padding-left: 0.33em;
						    background: #2c2b2c
						}
    
					footer .contact .hours h5 {
						font-family: 'Trade Gothic Bold';
						font-size: 16px;
						letter-spacing: 1px;
						text-transform: uppercase;
						display: inline-block;
						margin: 15px auto;
						color: #a6a6a6;
					}
						footer .contact .hours ul li {
							font-size: 18px;
							letter-spacing: 1px;
							margin-bottom: 4px;
							font-weight: 100;
							color: #a6a6a6;
							text-align: left;
							line-height: 1em;
						}
							footer .contact .hours ul li span {
								text-transform: uppercase;
							}
				footer .contact .phone {
					font-size: 35px;
					margin-top: 15px;
					color: #a6a6a6;
					text-decoration: none;
					display: block;
				}
		
		footer .logo {
			position: absolute;
			width: 590px;
			height: auto;
			left: -70px;
			top: 10px;
			z-index: -1;
		}
			footer .logo svg {}
				footer .logo svg path,
				footer .logo svg polygon,
				footer .logo svg rect {
					fill: #363636;
				}


/*****************/
/* Modal
/*****************/


#modal { z-index:999999; }
.modal-backdrop.in { opacity: 0.7; }
.modal { border: none; }
.modal .modal-content { background: url(img/bg-paper.png) 50% 0 repeat; background-size: contain; }
.modal input {
	position: relative;
	width: 100%;
	margin: 0 auto;
	display: block;
	border: 0;
	padding: 0px 10px;
	height: 36px;
	font-size: 16px;
	font-weight: 400;
	border-radius: 3px;
}
.modal .modal-header {
	position: absolute;
  right: 0px;
  padding: 10px 12px;
  z-index: 9;
	min-height: 0px;
  border: 0;
}
.modal .form { width: 100%; position: relative; margin: 0 auto; padding-bottom: 15px; }
.modal .form h1 { margin: 0 auto; text-align: center; font-family: 'Local Headline'; font-size: 36px; font-weight: 400; color: black; margin-top: 8px; margin-bottom:10px; text-transform: uppercase; width: 80%; }
.modal .form .intro { font-size: 14px; color: #FFF; text-align: center; position: relative; margin-bottom: 10px; padding: 0px 20px 10px; }
.modal .form form { position: relative; margin: 0 auto; text-align: center; }
.modal .form form label { width: 70%; text-align: center; }
.modal .form form .block { margin-bottom: 10px; }
.modal .form form .block.submit { margin-bottom: 0px; display: block; width: 70%; margin: 0 auto; font-family: 'Trade Gothic Bold', Arial, Helvetica, sans-serif; font-weight: 300; }
.modal .error { position: relative; width: 100%; height: auto; padding: 10px 20px; background: #fb9f00; color:#926001; font-size:14px; border-top-left-radius: 4px; border-top-right-radius: 4px; }
.modal .error .ding { font-size:22px; line-height:14px; position:relative; top:2px; margin-right:4px; }
.modal input[type="submit"]{ width: 100%; height: 34px; margin-top: 10px; }
.modal .fbLoginButton { height: auto; }
.modal .subtext { text-align: center; color: #FFF; font-size: 12px; margin: 20px 0 10px; }
.modal .subtext a { color: #FFF; text-decoration: underline; }
.modal .linebreak {
	  margin: 10px auto;
}
.modal .login-form .description {
	font-size: 16px;
  text-align: center;
  width: 80%;
  margin: 0 auto;
  margin-bottom: 20px;
}
.modal .passforgot-form .block.submit .left,
.modal .passreset-form .block.submit .left { width: 100% !important; float: none !important; padding-right: 0px !important; }
.modal .passforgot-form .block.submit .left input[type="submit"],
.modal .passreset-form .block.submit .left input[type="submit"]{ width: 100% !important; }
.modal .passforgot a,
.modal .passreset a { text-decoration:none; }
.modal .passforgot a:hover,
.modal .passreset a:hover { text-decoration:underline; }

.modal-body { max-height:100% !important; overflow-y:hidden; overflow-x:hidden; }
.modal input[type="submit"] {
			height: auto;
			padding: 6px 12px;
		}
		
		.modal .wpfbac-button {
			width: 100%;
			background: #3B5998;
			border-color: #3B5998;
			color: #FFF;
			font-size: 26px;
			border: 0px;
		}
			.modal .wpfbac-button .ding {
				font-size: 38px;
				line-height: 16px;
				position: relative;
				top: 2px;
			}
.modal .loader {
	position: relative;
	top: 0px;
}


/* GENERIC PAGE */

#page {
	position: relative;
	width: 100%;
	margin-top: 0px;
	display: block;
	background: url(img/bg-grunge.png) 50% 0 repeat-y;
	background-size: 100% auto;
}

	.page main {
		background: url(img/bg-grunge.png) 50% 0 repeat-y;
		background-size: 100% auto;
	}

	#page p {
		color: #000;
		line-height: 1.6em;
		font-size: 16px;
	}
	
	#page h3 {
		margin: 20px 0px;
	}
	
	#page .content {
		position: relative;
	}
	
	/*
	.page main section#masthead {
		height: 250px;
		min-height: 250px;
	}
		.page main section#masthead .content h1 {
			top: 50%;
		}
	*/
	
	.page main .header {
		max-width: 1000px;
	  position: relative;
	  padding: 20px;
	  padding-top: 80px;
	  margin: 0 auto;
	}
		.page main .header h2 {
			position: relative;
			top: 0px;
			font-size: 50px;
			color: #000;
			font-weight: 400;
			width: 100%;
			height: 80px;
			display: block;
			line-height: 1.5em;
			font-family: 'Local Headline';
			letter-spacing: 1px;
			text-transform: uppercase;
		}
	#page .left-column {
		padding-top: 20px;
		width: 100%;
		padding-right: 300px;
	}
	.distributors #page .left-column,
	.jobs #page .left-column,
	.press #page .left-column {
		padding-right: 0px;
		padding-left: 250px;
	}
		#page .left-column h3 {
			margin-bottom: 20px;
			font-size: 24px;
			font-weight: 600;
			color: #000;
		}
			.distributors #page .left-column h3 {
				margin-top: 0px;
			}
		
		#page .left-column h4 {
			margin: 6px 0px;
			font-weight: 400;
			color: #000;
		}
		
		#page .left-column p a {
			color: #EE3423;
		}
		
		#page .left-column ul {}
			#page .left-column ul li {
				color: #808080;
				line-height: 1.6em;
				font-size: 16px;
				padding-left: 0px;
				margin-bottom: 20px;
			}
				#page .left-column ul li:first-child {
					padding-top: 0px;
				}
		#page .left-column ul.simple {
			margin-bottom: 20px;
		}
			#page .left-column ul.simple li {
				color: #808080;
				line-height: 1.6em;
				font-size: 16px;
				border: 0;
				padding: 0;
				margin-bottom: 0px;
			}
		
		#page .left-column .content-section {
			margin-top: 40px;
		}
			#page .left-column .content-section .item {
				position: relative;
				height: auto;
				background: #F6F6F6;
				padding: 20px;
				float: left;
				display: block;
				width: 33.333333%;
				margin-left: 25px;
				margin-bottom: 0px;
			}
				#page .left-column .content-section .item:nth-child(1n) {
					margin-left: 0px;
				}
				#page .left-column .content-section .item .image {
					background: white;
					position: relative;
					margin: 0 auto;
				}
					#page .left-column .content-section .item .image img {
						width: 100%;
						max-width: 200px;
						margin: 0 auto;
						display: block;
					}
				#page .left-column .content-section .item .title {
					position: relative;
					margin-top: 10px;
					font-weight: 600;
					font-size: 16px;
					color: #032B38;
				}
				#page .left-column .content-section .item .options {}
					#page .left-column .content-section .item .options li {
						float: left;
						display: block;
						width: auto;
						padding: 0;
						border-top: none;
						font-size: 14px;
						margin-left: 10px;
					}
						#page .left-column .content-section .item .options li:first-child {
							margin-left: 0px;
						}
						#page .left-column .content-section .item .options li a {
							color: #D95E1B;
						}
	
	#page aside {
		padding: 20px 30px;
		position: absolute;
	  z-index: 1;
	  right: 0px;
	  top: 0px;
	  width: 300px;
	  margin-top: 25px;
	}
	.distributors #page aside,
	.jobs #page aside,
	.press #page aside {
		right: auto;
		left: 0px;
		padding: 20px 20px;
	  position: absolute;
	  z-index: 1;
	  top: 0px;
	  width: 250px;
	  padding-left: 40px;
	}
		.distributors #page .button.launch, 
		.jobs #page .button.launch, 
		.press #page .button.launch {
			display: none;
		}
		#page aside h3 {
			font-size: 36px;
			color: #DE5D20;
			line-height: 30px;
			margin-top: 10px;
		}
		#page aside h4 {
			color: #0B85A4;
			text-shadow: none;
			font-size: 21px;
			font-weight: 600;
			margin: 18px 0px 10px;
		}
		#page aside p {
			font-size: 14px;
			color: #032B38;
			margin: 10px 0px;
		}
		#page aside .sections {}
			#page aside .sections li {
				font-size: 21px;
				margin-bottom: 8px;
			}
				#page aside .sections li .date {
					font-size: 12px;
				}
				#page aside .sections li a {
					color: black;
					text-decoration: none;
				}
					#page aside .sections li.active a {
						color: #EE3423;
						text-decoration: none;
					}
					#page aside .sections li.active a .date {
						color: black;
					}
		#page aside .block {
			display: table;
		}
			#page aside .block .image {
				display: table-cell;
			}
				#page aside .block .image img {
					min-width: 74px;
				}
			#page aside .block .details {
				display: table-cell;
				vertical-align: top;
				padding-left: 20px;
			}
				#page aside .block .details h4 {
					margin-top: 0px;
				}
				

/* Distributors */

.distributors .login-form {
	width: 400px;
	margin: 0 auto;
	padding: 40px 0px;
	padding: 120px 0px;
}
.distributors .login-form h2 {
	margin-bottom: 20px;
  color: #000;
  font-family: 'Local Headline';
  text-transform: uppercase;
  text-align: center;
}
.distributors label {
	display: block;
}
	.distributors .login-form .block {
		margin-bottom: 10px;
		position: relative;
		overflow: hidden;
	}	
		.distributors .login-form .block input {
			  width: 100%;
				padding: 14px 10px;
				background: white;
		}	
		.distributors .login-form .block input[type="submit"]{
			  background: #000;
			  border-radius: 4px;
			  color: #FFF;
			  padding: 8px 12px;
			  margin-left: 20px;
			  width: 100%;
			  margin: 0 auto;
			  display: block;
			  position: relative;
			  font-size: 21px;
		}
		
	.distributors #page .login-form p {
		font-size: 12px;
		text-align: center;
		margin-top: 20px;
	}
		.distributors #page .login-form p a {
			color: #EE3423;
		}
		
		
/* Jobs */

.jobs #page .left-column .content-section {
	margin-top: 0px;
}
	.jobs #page .left-column .content-section .text {
		color: #000;
	  font-size: 16px;
	  line-height: 1.6em;
	  padding-bottom: 50px;
	}
		.jobs #page .left-column .content-section .text h1 {
			font-size: 42px;
		  text-transform: uppercase;
		  margin-bottom: 20px;
		}
		.jobs #page .left-column .content-section .text h3 {
			margin-top: 50px;
		}
		
		
/* Press */

.press #page .left-column .content-section {
	margin-top: 0px;
}
	.press #page .left-column .content-section .text {
		color: #000;
	  font-size: 16px;
	  line-height: 1.6em;
	  padding-bottom: 50px;
	}
		.press #page .left-column .content-section .text h1 {
			font-size: 42px;
		  text-transform: uppercase;
		  margin-bottom: 20px;
		}
		.press #page .left-column .content-section .text h3 {
			margin-top: 50px;
		}
		

/* Custom Pages */

.custom-page h2 {
	position: relative;
	top: 0px;
	font-size: 50px;
	color: #000;
	font-weight: 400;
	width: 100%;
	display: block;
	line-height: 1.5em;
	font-family: 'Local Headline';
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.custom-page img {
	width: auto;
}

/* General */

.alignleft {
  float: left;
  margin: 30px;
  margin-top: 0px;
  margin-left: 0px;
  margin-bottom: 50px;
}

.aligncenter {
	display: block;
	margin: 0 auto;
	margin-bottom: 50px;
}

.alignright {
  float: right;
  margin: 30px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 50px;
}


/**************/
/* Responsive */

@media only screen and (max-width: 999px) {
	
		.home main section#hero .content h1 {
			  font-size: 82px;
				width: 85%;
		}
		
		.home main section#hero .content h3 {
			  font-size: 21px;
				width: 85%;
		}
		
		.home main section#learn .items .item .image {
			width: 160px;
			height: 160px;
			margin-bottom: 40px;
		}
		
		.beer main section#curator .right {
			padding-left: 60px;
		  padding-right: 30px;
		}
		
		.contact main section#contact .items .item {
			width: 33.33333%;
		}
    
    footer .content .left {
	    padding-right: 30px;
    }
    footer .content .right {
	    padding-left: 30px;
    }
    
}

@media only screen and (max-width: 849px) {

	header nav .account .username {
		display: none;
	}

}

@media only screen and (max-width: 767px) and (orientation: portrait) {
	
	.visibility-web {
		display: none;
	}
	
	.visibility-tablet {
		display: block;
	}
	
	html {
	  height: 100%;
	  background: url(img/bg-grunge.png) 50% 0 repeat-y;
	  background-size: 100% auto;
	}
	
		header {
			overflow: hidden;
			transition: all 200ms ease-in-out;
		}
			header.expanded {
			  height: 100%;
			}
			
		header .title {
			position: absolute;
		  width: 100%;
		  text-align: center;
		  left: 0px;
		  top: 0px;
		  font-size: 24px;
		  display: block;
		}
		
		header nav {
			padding: 0px 12px;
		}
	
		header nav .icon-menu {
			display: block;
			font-size: 26px;
			padding: 0px 40px;
			padding-left: 0px;
			z-index: 9;
		}
		
		header nav ul li.logo {
			z-index: -1;
			top: 0px;
			width: 134px;
			margin-top: -35px;
		}
			header nav ul li.logo:hover {
				background: none;
				margin-top: -35px;
			}
				header nav ul li.logo svg path,
				header nav ul li.logo svg polygon {
					fill: #bf3427;
				}
		
		header nav ul:not(.account) li:not(.logo) {
			display: none;
		}
		
		header nav ul:not(.account) li.socials,
		header nav ul:not(.account) li.socials li {
			display: block;
		}
	
		.home main section#hero .content h1 {
			  font-size: 72px;
				width: 90%;
		}
		
		.home main section#hero .content h3 {
				width: 90%;
		}
		
		.home main section#learn .items .item .image {
			width: 140px;
			height: 140px;
			margin-bottom: 40px;
		}
		
		.home main section#learn .items .item .title {
			font-size: 28px;
		}
		
		main section#masthead {
		  height: 180px;
		  min-height: 180px;
		}
		
		main section .content {
		  padding: 40px 25px;
		}
		
		#page aside {
			width: 200px !important;
		}
			#page aside .sections li {
			  font-size: 18px;
			}
			
		#page .left-column {
		  padding-left: 200px !important;
		}
		
		.beer main section#beerlist #list .scroller .item {
			width: 33.33333%;
		}
		
		.contact main section#masthead {
			height: 850px;
		}
			.contact main section#masthead .address {
			  margin: 100px auto 180px;
			}
			.contact main section#masthead .hours:after {
				height: 480px;
			}
		
		.contact main section#masthead .hours h5 {
			font-size: 21px;
			letter-spacing: 1px;
		}
			.contact main section#masthead .hours ul li {
				font-size: 28px;
			}
		.contact main section#masthead .phone {
			font-size: 42px;
		}
		
		footer {
			display: none;
		}
		
		.home footer {
			display: block;
		}
    
    footer {}
    	footer nav.visibility-web {
				display: none;
			}
    	footer .content {}
	    	footer .content .left {
		    	width: 100%;
					border-right: 0;
					padding-right: 0px;
	    	}
	    	footer .socials {
		    	display: flex;
					justify-content: space-around;
					height: auto;
	    	}
	    		footer .socials li {
					  font-size: 32px;
					  line-height: 50px;
					  width: 50px;
					  height: 50px;
					}
						footer .socials li.instagram {
							font-size: 24px;
						}
						footer .socials li.untappd {
						  font-size: 28px;
						}
						footer .socials li:last-child {
						  margin-right: 0px;
						}
	    	footer .mailing {
		    	text-align: center;
	    	}
	    		footer .mailing form {
		    		display: table;
		    		width: 100%;
		    		position: relative;
	    		}
	    	footer .copyright {
		    	text-align: center;
	    	}
	    	footer .content .right {
		    	display: none;
	    	}
	    	
	   footer .contact {
		   max-width: 100%;
		   margin-bottom: 20px;
	   }
	   
	   /* Beer List */
	   
	   .beer main section#beerlist {
		   min-height: 100px;
	   }
	   
	   .tap-list {
				position: relative;
				top: 0px;
				width: 100%;
				/* margin-bottom: 100px; */
			}
				.tap-list ul {
					height: 76px;
					width: 100%;
					/* border-bottom: 1px solid #d7d7d7; */
					display: -webkit-flex;
					align-items: center;
					justify-content: space-between;
				}
					.tap-list ul li {
						display: block;
						float: left;
						width: 33.3%;
						height: 100%;
						text-align: center;
						border-right: 1px solid darkgray;
						background: url(img/filter-bg.png) 0 0 repeat;
						text-transform: uppercase;
						position: relative;
						font-size: 14px;
						font-weight: 600;
						letter-spacing: -0.5px;
						font-family: 'Trade Gothic Bold';
					}
						.tap-list ul li .icon {
							/* margin-top: 8px; */
							width: 100%;
							height: 100%;
						}
						.tap-list ul li:last-child { border-right: none; }
						.tap-list ul li.active {
							background: url(img/filter-bg-active.png) 0 0 repeat;
							/* border-bottom: 1px solid #606060; */
							text-shadow: 0px -1px -1px rgba(5, 5, 5, 1);
						}
						
						.tap-list ul li [class^="icon-"]:before, 
						.tap-list ul li [class*=" icon-"]:before {
							position: absolute;
							left: 0px;
							width: 100%;
							font-size: 36px;
							/* text-shadow: 0px 1px 1px #FFF; */
							height: 100%;
							line-height: 56px;
						}
							.tap-list ul li.active [class^="icon-"]:before, 
							.tap-list ul li.active [class*=" icon-"]:before {
								/* -webkit-text-stroke: 0.1px #fff; */
								text-shadow: -1px -1px 0 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF;
								/* text-shadow: -1px -1px 0px rgba(5, 5, 5, 1); */
							}			
						
						.tap-list ul li .filter-value {
							line-height: 56px;
							z-index: 1;
							color: #FFF;
							position: relative;
							letter-spacing: -1px;
							font-size: 10px;
							height: 100%;
						}
						
						.tap-list ul li .filter-name { 
							position: absolute;
							width: 100%;
							text-align: center;
							bottom: 8px; 
							text-shadow: 0px 1px 1px rgba(255, 255, 255, 1);
						}
							.tap-list ul li.active .filter-name { 
								color: #fff; 
								text-shadow: 0px 1px 0px rgba(5, 5, 5, 1);
							}
				
				.tap-list .list {
					transform: translateZ(0);
				}
					.tap-list .list .beer-sum { 
						clear: left;
						border-bottom: 1px solid #d7d7d7;
						padding: 12px 15px;
						font-family: 'Trade Gothic Bold';
						text-transform: capitalize;
						font-weight: 400;
						letter-spacing: -0.5px;
						-webkit-font-smoothing: antialiased;
						box-sizing: border-box;
						/*
						display: -webkit-flex;
						align-items: center;
						justify-content: space-between;
						*/
						outline: 0;
						-webkit-tap-highlight-color: rgba(0,0,0,0);
					  position: relative;
					  cursor: pointer;
					  min-height: 65px;
					}
						.p-fullsize .tap-list .list .beer-sum:hover {
							background: rgba(0,0,0,0.1);
						}
						.tap-list .list .beer-sum:active {
							background: rgba(0,0,0,0.1);
						}
					.tap-list .list .beer-sum.noclick {
						pointer-events: none;
					}
						.tap-list .list .beer-sum .image {
							width: 20px;
							height: auto;
						  position: absolute;
						  overflow: hidden;
						}
						.tap-list .list .beer-sum .info { width: 68%; padding-left: 35px; }
						.tap-list .list .beer-sum h2 {
							font-family: inherit;
							font-weight: 400;
							margin-top: 0px !important;
							font-size: 24px;
						}
						.tap-list .list .beer-sum .description {
							font-family: 'Trade Gothic Roman';
							font-size: 13px;
							text-transform: none;
							letter-spacing: -0.25px;
						}
						.tap-list .list .beer-sum .levels {
							position: absolute;
						  right: 15px;
						  top: 50%;
						  transform: translateY(-50%);
						} 
							.tap-list .list .beer-sum .levels .level {
								width: 31px;
								height: 34px;
								line-height: 34px;
								font-size: 12px;
								text-align: center;
								border-radius: 100%;
								color: #fff;
								font-weight: normal;
								display: block;
								float: left;
								position: relative;
								z-index: 1;
							}
							
							.tap-list .list .beer-sum .levels [class^="icon-"], 
							.tap-list .list .beer-sum .levels [class*=" icon-"] {			
								width: 30px;
								float: left;
								text-align: center;
								position: relative;
							}
								.tap-list .list .beer-sum .levels [class^="icon-"]:before, 
								.tap-list .list .beer-sum .levels [class*=" icon-"]:before {
									position: absolute;
									left: 0px;
									width: 100%;
									font-size: 32px;
									top: 0px;
									line-height: 32px;
								}
							
								.tap-list .list .beer-sum.ale .levels { color: #333333; }
								.tap-list .list .beer-sum.wheat .levels { color: #d0a600; }
								.tap-list .list .beer-sum.india-pale-ale .levels,
								.tap-list .list .beer-sum.ipa .levels { color: #42c777; }
								.tap-list .list .beer-sum.pale-ale .levels { color: #199999; }
								.tap-list .list .beer-sum.red-ale .levels { color: #ee3423; }
								.tap-list .list .beer-sum.stout .levels { color: #482d19; } 
								.tap-list .list .beer-sum.porter .levels { color: #482d19; }  	
					
					.tap-list .shelf {
						background: #383838;
						width: 100%;
						height: auto;
						padding: 6px 0px;
						min-height: 34px;
						color: white;
						border-top: 1px solid #4c4c4c;
					}
						.tap-list .shelf .btn {
							width: 48%;
							width: -webkit-calc(50% - 10px);
							text-align: center;
							font-size: 14px;
							background: #000;
							height: 33px;
							float: left;
							box-sizing: border-box;
							color: whitesmoke;
							font-family: 'Trade Gothic Bold';
							text-transform: uppercase;
						  border-radius: 0;
						}
							.tap-list .shelf .btn.btn-left {
								margin-left: 2%;
								margin-left: 10px;
								/* border-right: 1px solid #383838; */
								border-bottom-left-radius: 4px;
								border-top-left-radius: 4px;
							}
							.tap-list .shelf .btn.btn-right {
								margin-right: 2%;
								margin-right: 10px;
								/* border-left: 1px solid #383838; */
								border-bottom-right-radius: 4px;
								border-top-right-radius: 4px;
							}
						.tap-list .shelf .btn.active {
							background: gray;	
						}
						
		section#find {
			background: none;
		}
			section#find #results .tap-list .list {
				color: black;
				width: 100%;
				top: 30px;
			}
			
			section#find #results .tap-list .map-result {
				padding: 12px 0px;
				font-size: 11px;
			}
			
		.contact main section#contact .items .item {
			width: 50%;
			text-align: center;
		}
		
		.learn main section#team .content .grid .col-3 .item {
			width: 50%;
			margin-bottom: 40px;
		}
    
}
   
@media only screen and (max-width: 500px) {
	
	.visibility-tablet {
		display: block;
	}
	
	main section {
	  min-height: 480px;
	}
		main section#masthead .content h1 {
			text-align: center;
			width: 100%;
			left: 0px;
		}
	
	.home main section#hero .carousel-inner {
	  min-height: 480px;
	}
	
	.home main section#hero .item {
	  min-height: 480px;
	}
	
	.home main section#hero .content h1 {
		font-size: 60px;
	}
	
	.home main section#hero .content h3 {
		font-size: 18px;
	}
	
	.home main section#finder .content .left {
	  width: 100%;
	}
	
	.home main section#finder h2 {
		width: 50%;
		margin-top: 40px;
	}
	
	.home main section#finder h3 {
		width: 60%;
	}
	
	.home main section#finder button {
		width: 100%;
	}
	
	.home main section#learn .content {
		padding-bottom: 0px;
	}
	
	.home main section#learn h2 {
		margin-top: 40px;
	}
	
	.home main section#learn .items .item {
		width: 100%;
		margin-bottom: 40px;
	}
	
		.home main section#learn .items .item .image {
		  width: 120px;
		  height: 120px;
		  margin-bottom: 20px;
		  float: left;
		}
		
	.home main section#learn .items .item .title {
	  padding-left: 140px;
	  text-align: left;
	}
	
	.home main section#learn .items .item .description {
	  width: 100%; 
	  padding-left: 140px;
	  text-align: left;
	}
	
	.beer main section#find #map-canvas {
		position: relative;
	}
	
	.beer main section#find #results {
		position: relative;
		width: 100%;
	}
	
	.learn main section#live-local .content h2 {
		text-align: center;
	}
	
	.learn main section#live-local .content .left {
		width: 100%;
		text-align: center;
		padding-top: 0px;
		padding-right: 0px;
	}
	
		.learn main section#live-local .content .left .text {
			font-size: 16px;
		}
		
		.learn main section#live-local .content .left .title {
			font-size: 24px;
		}
	
	.learn main section#live-local .content .right {
		display: none;
	}
	
	.learn main section#team .content h2 {
		text-align: center;
	}
	
	.learn main section#team .content .grid .col-1 .item .image {
		width: 180px;
	}
	
	.learn main section#team .content .grid .col-1 .item .name {
		font-size: 32px;
	}
	
	.learn main section#team .content {
		padding-bottom: 0px;
	}
	
	.learn main section#guest-brewers .content .left .image {
		width: 80px;
		height: 80px;
	}
	
	.learn main section#guest-brewers .content .right {
		padding-left: 100px;
	}
	
	.learn main section#events .left {
		text-align: center;
		width: 100%;
	}
		.learn main section#events .left h2 {
			font-size: 42px;
		}
		
	.learn main section#events .right {
		width: 100%;
		padding: 0px 40px;
		position: relative;
		padding-right: 0px;
		min-height: 0px;
	}
	
		.learn main section#events .right h2 {
			text-align: center;
			padding-right: 40px;
		}
		
	.learn main section#team .content .grid .col-3 .item {
		width: 100%;
		margin-bottom: 40px;
	}
	
	.contact main section#masthead {
		height: 600px;
	}
		.contact main section#masthead .address {
		  margin: 65px auto 110px;
		}
		.contact main section#masthead .hours:after {
			height: 360px;
		}
    
	.contact main section#masthead .hours h5 {
		font-size: 16px;
		letter-spacing: 1px;
	}
		.contact main section#masthead .hours ul li {
			font-size: 22px;
		}
	.contact main section#masthead .phone {
		font-size: 32px;
	}
	
	.contact main section#contact {
		min-height: 100px;
		padding-bottom: 0px;
	}
	
	.contact main section#contact h2 {
		text-align: center;
		margin-top: 10px;
	}
	
	.contact main section#contact .items {
		margin-top: 30px;
	}
	
	.contact main section#contact .items .item {
		width: 100%;
		text-align: center;
	}
		.contact main section#contact .items .item .title {
			font-size: 14px;
		}
	
	.contact main section#coalition {
	  padding-bottom: 0;
	}
	
	.contact main section#coalition .content {
		display: block;
	}
		.contact main section#coalition .top {
			width: 100%;
		}
			.contact main section#coalition .top .title {
				font-size: 42px;
				z-index: 10;
			}
			.contact main section#coalition .top .text {
				width: 100%;
			  font-size: 16px;
				line-height: 1.6em;
				text-align: center;
				margin-top: 25px;
				margin-bottom: 30px;
			}
			
	.contact main section#coalition .sig {
		background-position: 100% 0;
	  width: 289px;
	  height: 56px;
	  margin: 0;
	  margin-top: 8px;
	  background-size: 80% auto;
	}
	
	.contact main section#coalition .emboss {
		right: -140px;
	  width: 236px;
	  height: 236px;
	  margin: 0;
	  top: -40px;
	}
	
	.contact main section#coalition .bottom {
	  width: 100%;
	  margin-top: 140px;
	}
	
	.contact main section#coalition .bottom .block {
		width: 100%;
	  margin-bottom: 60px;
	}
	
	.contact main section#coalition .bottom .investors #send,
	.contact main section#coalition .bottom .geeks #send {
		width: 100%;
	}
	
	.contact main section#coalition input[type="text"] {
		width: 100%;
		height: auto;
		padding: 14px 10px;
	}
	
	.contact main section#coalition .bottom button {
		margin: 0 auto !important;
		text-align: center;
		display: block;
		width: 100%;
	}
	
	.distributors #page .left-column, 
	.jobs #page .left-column, 
	.press #page .left-column{
		display: none;
	}
	
	.distributors #page .expanded .left-column, 
	.jobs #page .expanded .left-column, 
	.press #page .expanded .left-column{
		display: block;
		padding-left: 0px !important;
	}
	
	.distributors #page aside, 
	.jobs #page aside, 
	.press #page aside {
		width: 100% !important;
		padding: 0;
		margin-top: 0px;
	}
		.distributors #page .expanded aside, 
		.jobs #page .expanded aside, 
		.press #page .expanded aside {
			display: none;
		}
		
		.distributors #page .expanded .button.launch, 
		.jobs #page .expanded .button.launch, 
		.press #page .expanded .button.launch {
			width: 100%;
			background: #ee3423;
			font-family: 'Local Headline';
			text-transform: uppercase;
			color: white;
			border: 0;
			outline: 0;
			font-size: 22px;
			padding: 6px 32px;
			letter-spacing: 1px;
			padding: 8px 60px;
			font-size: 26px;
			display: block;
			text-align: center;
			text-decoration: none;
		}
			.button.launch:hover {
				text-decoration: none;
			}
	
	#page aside .sections li {
		border-bottom: 1px solid #D7D7D7;
		margin-bottom: 0px;
	}
		#page aside .sections li.all{
			display: none;
		}
		#page aside .sections li:active {
			background: rgba(0, 0, 0, 0.1);
		}
		#page aside .sections li a {
			padding: 16px 20px;
			display: block;
		}
		
	#page aside .sections li .date {
	  float: right;
	  margin-top: 5px;
	}
	
	.distributors #page .left-column .content-section .item {
		margin-bottom: 20px;
		width: 100%;
	}
	
	footer nav {
		display: none;
	}
	
	footer nav ul {
	  position: relative;
	  display: block;
	  margin-right: 0px;
	  width: 50%;
	  float: left;
	  margin-bottom: 20px;
	}
	
	footer .mailing input {
		width: 100%;
		padding-right: 25%;
	}
	
	footer .mailing button {
		position: absolute;
	  top: 35px;
	  right: 0px;
	  border-bottom-left-radius: 0px;
	  border-top-left-radius: 0px;
	  width: 25%;
	}

}



/* ==========================================================================
   Helper classes
   ========================================================================== */
	
   
/* global */

::-webkit-input-placeholder {
   font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif; 
	 font-weight: 300;
}

:-moz-placeholder { /* Firefox 18- */
   font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif; 
	 font-weight: 300;  
}

::-moz-placeholder {  /* Firefox 19+ */
   font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif; 
	 font-weight: 300;  
}

:-ms-input-placeholder {  
   font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif; 
	 font-weight: 300;  
}

input {
	font-family: 'Trade Gothic Roman', Arial, Helvetica, sans-serif; 
	font-weight: 300;
}
	
	
/* Neutrino global stock animations and transitions */

/* global default transition in */
.nu-transition-visible
{
	animation-name: nu-fade-in;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-fade-in
{
	0%
	{
		opacity: 0;
	}
	
	100%
	{
		opacity: 1;
	}
}

/* global default transition out */
.nu-transition-invisible
{
	animation-name: nu-fade-out;
	animation-duration: 200ms;
	animation-timing-function: linear;
}

@keyframes nu-fade-out
{
	0%
	{
		opacity: 1;
	}
	
	100%
	{
		opacity: 0;
	}
}

.nu-slide-in
{
	animation-name: nu-slide-in;
	animation-duration: 200ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-in
{
	0%
	{
		transform: translate3d(-100vw, 0, 0);
	}
	
	100%
	{
		transform: translate3d(0, 0, 0);
	}
}

.nu-slide-out
{
	animation-name: nu-slide-out;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-out
{
	0%
	{
		transform: translate3d(0, 0, 0);
	}
	
	100%
	{
		transform: translate3d(-100vw, 0, 0);
	}
}

.nu-slide-out-to-left
{
	animation-name: nu-slide-out-to-left;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-out-to-left {
	0% {
		transform: translate3d(0, 0, 0);
	}
	
	100% {
		transform: translate3d(-100vw, 0, 0);
	}
}

.nu-slide-out-to-right
{
	animation-name: nu-slide-out-to-right;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-out-to-right {
	0% {
		transform: translate3d(0, 0, 0);
	}
	
	100% {
		transform: translate3d(100vw, 0, 0);
	}
}

.nu-slide-out-to-top
{
	animation-name: nu-slide-out-to-top;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-out-to-top {
	0% {
		transform: translate3d(0, 0, 0);
	}
	
	100% {
		transform: translate3d(0, -100vh, 0);
	}
}

.nu-slide-out-to-bottom
{
	animation-name: nu-slide-out-to-bottom;
	animation-duration: 200ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-out-to-bottom {
	0% {
		transform: translate3d(0, 0, 0);
	}
	
	100% {
		transform: translate3d(0, 100vh, 0);
	}
}

.nu-slide-in-from-bottom
{
	animation-name: nu-slide-in-from-bottom;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-in-from-bottom {
	0% {
		transform: translate3d(0, 100vh, 0);
	}
	
	100% {
		transform: translate3d(0, 0, 0);
	}
}

.nu-slide-in-from-top
{
	animation-name: nu-slide-in-from-top;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-in-from-top {
	0% {
		transform: translate3d(0px, -100vh, 0);
	}
	
	100% {
		transform: translate3d(0, 0, 0);
	}
}

.nu-slide-in-from-bottom
{
	animation-name: nu-slide-in-from-bottom;
	animation-duration: 200ms;
	animation-timing-function: linear;
}

.nu-slide-in-from-left
{
	animation-name: nu-slide-in-from-left;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-in-from-left {
	0% {
		transform: translate3d(-100vw, 0, 0);
	}
	
	100% {
		transform: translate3d(0, 0, 0);
	}
}

.nu-slide-in-from-right
{
	animation-name: nu-slide-in-from-right;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-slide-in-from-right {
	0% {
		transform: translate3d(100vw, 0, 0);
	}
	
	100% {
		transform: translate3d(0, 0, 0);
	}
}


.nu-fall-forward
{
	animation-name: nu-fall-forward;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-fall-forward {
	0% {
		transform-origin: left bottom;
		transform: rotateX(0);
	}
	
	100% {
		transform-origin: left bottom;
		transform: translate3d(0, 0, -40px) rotateX(-100deg);
	}
}

.nu-open-to-left
{
	animation-name: nu-open-to-left;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-open-to-left {
	0% {
		transform-origin: left center;
		transform: rotateY(0);
	}
	
	100% {
		transform-origin: left center;
		transform: rotateY(-100deg);
	}
}

.nu-open-to-right
{
	animation-name: nu-open-to-right;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-open-to-right {
	0% {
		transform-origin: right center;
		transform: rotateY(0);
	}
	
	100% {
		transform-origin: right center;
		transform: rotateY(100deg);
	}
}

.nu-close-to-left
{
	animation-name: nu-close-to-left;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-close-to-left {
	0% {
		transform-origin: right center;
		transform: rotateY(100deg);
	}
	
	100% {
		transform-origin: right center;
		transform: rotateY(0deg);
	}
}

.nu-close-to-right
{
	animation-name: nu-close-to-right;
	animation-duration: 400ms;
	animation-timing-function: linear;
}

@keyframes nu-close-to-right {
	0% {
		transform-origin: left center;
		transform: rotateY(-100deg);
	}
	
	100% {
		transform-origin: left center;
		transform: rotateY(0deg);
	}
}

.nu-fade-out
{
	animation-name: nu-fade-out;
	animation-duration: 200ms;
	animation-timing-function: linear;
}

.nu-transition-visible
{
	animation-name: nu-fade-in;
	animation-duration: 0.01ms;
	animation-timing-function: linear;
}

.nu-transition-invisible
{
	animation-name: nu-fade-out;
	animation-duration: 0.01ms;
	animation-timing-function: linear;
	visibility: hidden;
	display:block;
}

/****/

.nu-slide-out-to-left
{
	animation-name: nu-slide-out-to-left;
	animation-duration: 200ms;
	animation-timing-function: ease-out;
}

@keyframes nu-slide-out-to-left {
	0% {
		transform: translateX(0);
	}
	
	100% {
		transform: translateX(-100vw);
	}
}

.nu-slide-out-to-right
{
	animation-name: nu-slide-out-to-right;
	animation-duration: 200ms;
	animation-timing-function: ease-out;
}

@keyframes nu-slide-out-to-right {
	0% {
		transform: translateX(0);
	}
	
	100% {
		transform: translateX(100vw);
	}
}

.nu-slide-in-from-left
{
	animation-name: nu-slide-in-from-left;
	animation-duration: 200ms;
	animation-timing-function: ease-out;
}

@keyframes nu-slide-in-from-left {
	0% {
		transform: translateX(-100vw);
	}
	
	100% {
		transform: translateX(0);
	}
}

.nu-slide-in-from-right
{
	animation-name: nu-slide-in-from-right;
	animation-duration: 200ms;
	animation-timing-function: ease-out;
}

@keyframes nu-slide-in-from-right {
	0% {
		transform: translate3d(100vw, 0, 0);
	}
	
	100% {
		transform: translate3d(0, 0, 0);
	}
}
   

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
