[role="main"]:before,
[role="main"]:after {
	content: " ";
	position: absolute;
	z-index: -1;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.3);	
}

[role="main"]:after {
	left: 100%;
	background: rgba(0,0,0,.15);	
}

[role="navigation"],
[role="main"],
.site-container {
	-webkit-transition: .2s all ease;
	-moz-transition: .2s all ease;
	-o-transition: .2s all ease;		
	-ms-transition: .2s all ease;
	transition: .2s all ease;		
	display: block;	
	position: relative;
}

.js [role="navigation"] {	
	margin-left: -100%;
	float: left;
	padding-bottom: 25em;
	z-index: 2;	
}

.js [role="main"] {
	margin-left: 0;
	background: #eee;
	box-shadow: 0 0 25px rgba(0,0,0,.2);
	float: left;
	z-index: 1;
	position: relative;
}

.active-nav [role="navigation"] {	
	margin-left: 0;	
	width: 80%;
}

/*.active-nav [role="main"],*/
.active-nav .site-container {
	right: -200px;
	position: relative;
}

.active-sidebar [role="navigation"] {	
	margin-left: -200%;
}

.active-sidebar .site-container {
	margin-left: -90%;	
}

.active-nav .site-container {
	-webkit-transition: .1s all ease;
	-moz-transition: .1s all ease;
	-o-transition: .1s all ease;		
	-ms-transition: .1s all ease;
	transition: .1s all ease;	
}

.sign-in-mobile,
.sign-out-mobile
{
		display: none;
}

body.active-nav {
	/*background:url(../images/bg_rusty_black_large.jpg) repeat left top;*/
}

/* Off Canvas Navigation */
.off-canvas-navigation {
	width: 100%;
	overflow: hidden;
	display: block;
	color: #fff;
}

.off-canvas-navigation .menu-button {
	top: 64px;
	left: 0;
	padding: 2.4px 15px;
	padding: 2.4rem 1.5rem 0;
	font-weight: bold;
	font-size: 14px;
	font-size: 1.4rem;
}


.topmenu {
	position: absolute;
	left: -200px;
	top: 0;
	margin: 25px 0 0 20px;
}

.topmenu li {
	margin: 15px 0;
}

/* Site Menu */
.site-container > [role="navigation"] {
	display: none;
}


/*
Media Queries
---------------------------------------------------------------------------------------------------- */

@media screen and (-webkit-min-device-pixel-ratio: 2) {

	.header-image .site-header .wrap {
		background: url(images/logo@2x.png) no-repeat left;
		background-size: 360px 164px;
	}

}

/* Large screens */
@media (min-width: 1200px) {


}


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

	.nav-primary,
	.header-full-width .header-top > div,
	.header-full-width .site-title,
	.header-full-width .header-bottom,
	.site-inner,
	.site-footer {
		max-width: 970px;
		margin: 0 auto;
	}

	.menu-primary a,
	.btn-header-left,
	.btn-header-right {
		font-size: 13px;
		font-size: 1.3rem;
		padding: 15px;
		padding: 1.5rem;
	}

	.btn-header-left,
	.btn-header-right {
		padding: 2.4px 15px;
		padding: 2.4rem 1.5rem 0;
	}

	.btn-header-left {
		padding-left: 0;
	}

	.square-box h2 {
		font-size: 25px;
		font-size: 2.5rem;
	}

	.square-box.large {
		max-height: 390px;
		min-height: 390px;
	}

	.square-box.medium {
		max-height: 325px;
		min-height: 325px;
	}

	.square-box.medium h2 + div {
		height: 238px;
	}

	.square-box.large h2 + div {
		height: 308px;
	}

	.home h2 > [class^="icon-"], 
	.home h2 > [class*=" icon-"] {
		font-size: 38px;
	}

	.entry-title {
		font-size: 35px;
		font-size: 3.5rem;
	}

	.single .entry .entry-content, 
	.page.page-template-archive-brewery-php .entry .entry-content, 
	body.page.full-width-content .content-sidebar-wrap main.content {
		padding:20px 40px;
		padding: 2rem 4rem;
	}

	/* Keep beers grid to three columns */
	.page-template-archive-beers-php .one-fourth {
		width: 270px;
	}

	.content-sidebar-sidebar .content-sidebar-wrap,
	.sidebar-content-sidebar .content-sidebar-wrap,
	.sidebar-sidebar-content .content-sidebar-wrap {
		width: 740px;
	}

	.content,
	.site-header .widget-area {
		width: 630px;
	}

	.sidebar-content-sidebar .content,
	.sidebar-sidebar-content .content,
	.content-sidebar-sidebar .content {
		width: 410px;
	}

	.footer-widgets-1,
	.footer-widgets-2,
	.footer-widgets-3,
	.sidebar-primary,
	.title-area {
		width: 310px;
	}

}

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

	.content-sidebar-sidebar .content,
	.content-sidebar-sidebar .content-sidebar-wrap,
	.footer-widgets-1,
	.footer-widgets-2,
	.footer-widgets-3,
	.sidebar-content-sidebar .content,
	.sidebar-content-sidebar .content-sidebar-wrap,
	.sidebar-sidebar-content .content,
	.sidebar-sidebar-content .content-sidebar-wrap,
	.site-header .widget-area,
	.title-area,
	.wrap {
		width: 100%;
	}

	.content {
		width: 670px;
	}

	.sidebar-primary,
	.sidebar-secondary {
		width: 270px;
	}

	.header-full-width .site-title {
		width: 40%;
	}

	.entry {
		margin-bottom: 0;
	}

	.header-image .site-header .wrap {
		background-position: center top;
	}

	.header-image .site-header .widget-area {
		padding: 0;
	}

	.header-full-width .header-top
	{
		padding:12px 20px;
		padding:1.2rem 2rem;
	}

	.square-box.large h2 + div {
		height: 232px;
	}

	.home .home-top-right img {
		margin-left: -5px;
		margin-left: -0.5px;
		width: 22%;
	}

	.home .home-top-right ul {
		overflow-x: hidden;
	}

	#Grid {
		width: 580px;
		margin: 0 auto;
	}

	#Grid .mix {
		margin-bottom: 4%;
	}

	.entry-content .instagram-feed li img,
	.home-container img {
		height: auto;
		max-width: 140%;
		width: auto;
		margin-left: -40%;
	}

	.carousel-inner > .item > a > img {
		max-width: 100%;
		margin-left: 0;
	}

	.entry-content .instagram-feed, 
	.entry-content .instagram-feed li {
		height: auto;
		max-width: 140%;
		margin-left: -0%;
	}

	.square-box.large {
		min-height: 315px;
		max-height: 315px;
	}

	.archive-description,
	.author-box,
	.entry,
	.entry-comments,
	.entry-footer .entry-meta,
	.sidebar .widget,
	.site-header,
	#respond {
		padding: 0;
	}

	.site-inner {
		background: none;
	}

	.genesis-nav-menu li,
	.site-header ul.genesis-nav-menu,
	.site-header .search-form {
		float: none;
	}

	.genesis-nav-menu,
	.site-description,
	.site-header .title-area,
	.site-header .search-form,
	.site-title {
		text-align: center;
	}

	.genesis-nav-menu a,
	.genesis-nav-menu > .first > a,
	.genesis-nav-menu > .last > a {
		padding: 20px 16px;
		padding: 2rem 1.6rem;
	}

	.site-header .search-form {
		margin: 16px auto ;
		margin: 1.6rem auto;
	}

	.genesis-nav-menu li.right {
		display: none;
	}

	.entry-footer .entry-meta {
		margin: 0;
		padding-top: 12px;
		padding-top: 1.2rem;
	}

	.sidebar .widget.enews-widget {
		padding: 40px;
		padding: 4rem;
	}

	.site-footer {
		padding: 24px 0;
		padding: 2.4rem 0;
	}

	.footer-widgets {
		padding: 40px 5% 16px;
	}

	.footer-widgets-1 {
		margin: 0;
	}
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { 
	.content {
		width: 630px;
	}
}

@media only screen and (max-width: 799px) {
	
	.site-title a img {
		max-width: 317px;
	}

	.content,
	#Grid {
		width: 100%;
	}

	#Grid {
		text-align: center;
	}

	#Grid .mix {
		min-height: initial !important;
	}

	.beer-bottle-large {
		margin-right: 20px;
		margin-bottom: 20px;
		max-height: 50%;
		max-width: 50%;	
	}

	.beer-type-filters-container {
 		position: relative;
		left: 0;
		top: 0;
		text-align: center;
		margin-bottom: 15px;
		margin-bottom: 1.5rem;
	}

	.beer-type-filters-container div {
		font-size: 12px;
		font-size: 1.2rem;
		line-height: 14px;
		margin: 0;
		padding: 0 5px;
		padding: 0 0.5rem;
	}

	.site-inner {
		padding-top: 0;
	}
	
	.off-canvas-navigation .menu-button [class^="icon-"], [class*=" icon-"] {
		color: #f1e1c0;
		font-size: 20px;
		font-size: 2rem;
	}

	.icon-button
	{
		height: 60px;
		width: 45px;
		background: #841503;
		padding:20px 0 0;
		padding:2rem 0 0;
		font-size: 20px;
		font-size: 2rem;
		color: #ffffff;
		text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
		-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
		box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
	}

	.single .entry .entry-content, 
	.page.page-template-archive-brewery-php .entry .entry-content, 
	body.page.full-width-content .content-sidebar-wrap main.content {
		padding:10px 20px;
		padding: 1rem 2rem;
	}

	.entry-title {
		font-size:26px;
		font-size: 2.6rem;
		padding-left: 0;
		padding-right: 0;
		text-align: center;
	}

	.entry-content .entry-title {
		font-size: 20px;
		font-size: 2rem;
		margin:0 0 10px 0;
		margin:0 0 1rem 0;
		text-align: left;
	}

	.off-canvas-navigation .menu-button
	{
		top: 0;
		left: 0;
		padding: 20px 0 0;
		padding: 2rem 0 0;	
	}

	.off-canvas-navigation .menu-button span
	{
		display: none;
	}

	.header-full-width .header-bottom {
		position: inherit;
	}

	.active-nav .site-container {
		right: -160px;
	}

	.topmenu {
		left: -160px;	
		margin: 20px 0;
	}

	.topmenu li {
		margin: 10px 0 10px 10px;
	}

	.header-full-width .header-top {
		padding:10px 16px;
		padding:1rem 1.6rem;
	}

	.social-media,
	.newsletter-signup-container,
	.newsletter-signup-container h3
	{
		display: block;
		width: 100%;
		text-align: center;
		margin-left: 0;
	}

	.newsletter-signup-container h3 {
		margin: 14px 0 10px;		
	}

	.newsletter-signup-container input[type="email"] {
		width:180px;
	}

	.sign-in,
	.sign-out
	{
		display: none;
	}

	.sign-in-mobile,
	.sign-out-mobile
	{
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		text-align: center;
	}

	.sign-in-mobile:hover,
	.sign-out-mobile:hover
	{
		color:#fff;
	}

	.header-full-width .site-title {
		width: 100%;
	}

	.sidebar-primary
	{
		width: 100%;
		margin-top: 20px;
		margin-top: 2rem;
	}

	.square-box {
		width: 100%;
		margin-left: 0;
		padding: ;
		min-height: inherit !important;
		max-height: inherit !important;
		margin-bottom: 20px;
		margin-bottom: 2rem;
	}

	.square-box > div,
	.square-box.medium h2 + div {
		height: auto;
	}

	.home .home-top-right img {
		width:auto;
	}

	.entry-content .instagram-feed li img, 
	.home-container img {
		width: 100%;
		margin: 0;
		vertical-align: bottom;
	}

	.entry-content .instagram-feed {
		max-height: 360px;
	}

	.newsletter-signup-container {
		display: none;
	}

	.site-footer .newsletter-signup-container {
		display: block;
		margin-bottom: 15px;
		margin-bottom: 1.5rem;
	}

	.site-footer {
		text-align: center;
	}

	.site-footer .footer-links ul li:last-child {
		border:none;
	}

	.site-footer .footer-copyright-text {	
		padding: 0 50px;
	}

	#av-overlay-wrap {
		opacity: 1;
	}

	#av-overlay {
		width: 100%;
		margin: 0;
		background:url(../images/bg_rusty_black.jpg) no-repeat center center #000 !important;
		color:#fff;
	}

	#av-overlay h1, #av-overlay p {
		margin-top: 20px;
		margin-top: 2rem;
		font-size: 18px;
		font-size: 1.8rem;
		padding: 0;
		color: #fff;
	}

	#av-overlay p {
		font-family: 'Droid Serif', serif;
		font-size: 18px;
		font-size: 1.8rem;
	}

	#av-overlay label[for="av_verify_confirm"] {
		font-size: 18px;
		font-size: 1.8rem;
		margin:0 0 20px 0;
		margin:0 0 2rem 0;
		color:#fff;
	}


}


@media only screen and (max-width: 720px) {
	
	.site-inner {
		margin-top: 55px;
	}
	
	.btn-header-left {
		width: 100%;
		top:170px;
		text-align: center;
		background: url(../images/main_menu_bg.png) repeat left top #c7a983;
		height: 48px;
		padding: 10px 0 0;
		font-size: 18px;

		box-shadow: 0px 5px 2px rgba(56, 23, 18);
		-webkit-box-shadow: 0px 5px 2px rgba(56, 23, 18, 0.8);
		-moz-box-shadow: 0px 5px 2px rgba(56, 23, 18, 0.8);
		box-shadow: 0px 5px 2px rgba(56, 23, 18, 0.8);	
	}

}

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

	.title-area {
		margin-bottom: 22%;
	}

	.header-full-width .site-title {
		width:90%;
	}

	.entry-content .instagram-feed {
		max-height: 272px;
	}

	.site-footer {
		padding: 15px 0;
		padding: 1.5rem 0;
	}

	.site-title a img {
		max-width: 100%;
	}

	.site-inner {
		margin-top: 0;
	}

}


@media all and (min-width: 600px) {

	.js [role="navigation"] {
		width: 20%;	
		margin-left: 0;
	}

	.js [role="main"] {
		width: 60%;
		float: left;
	}

	.active-sidebar [role="navigation"] {	
		margin-left: -100%;
	}

	.active-sidebar [role="main"] {
		margin-left: 0;
		width: 60%;
	}


}


@media all and (min-width: 800px) {
	
	.site-container > [role="navigation"],
	.btn-header-left {
		display: block;
	}

	.off-canvas-navigation {
		display: none;
	}			
	
	.menu-button {
		display: none;
	}

	.js [role="navigation"] {
		width: 19%;	
		margin-left: 0;
		float: left;
		padding: 3%
	}

	.js [role="main"] {
		width: 44%;
		padding: 3%;	
	}

}


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

	.five-sixths,
	.four-sixths,
	.one-fourth,
	.one-half,
	.one-sixth,
	.one-third,
	.one-third-custom,
	.three-fourths,
	.three-sixths,
	.two-fourths,
	.two-sixths,
	.two-thirds,
	.two-thirds-custom {
		width: 100%;
	}

	.single.single-news,
	.single.single-news h1 {
		text-align: center;
	}

	.single.single-news .entry-content .entry-title {
		font-size: 24px;
		font-size: 2.4rem;
	}

	.news-page-date {
		height: 94px;
		margin-bottom: 15px;
		width: 90px !important;
		text-align: center;
		margin: 0 auto;
		float: none;
	}

}