/*

Theme Name: Powerhouse
Theme URI: http://frayd.us/
Author: Kevin Freitas, Frayd Media
Author URI: http://frayd.us/;
Description: HTML5 theme for Powerhouse Restaurant & Brewery.

*/


/******************
	STYLE RESET
*******************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, textarea { /* http://meyerweb.com/eric/tools/css/reset/    v2.0 | 20110126   License: none (public domain)*/
	border: 0;
	margin: 0;
	padding: 0;

	font-size: 100%;
	vertical-align: baseline;

	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

/* HTML5 display-role reset for older browsers */
article,  aside,  details,  figcaption,  figure,  footer,  header,  hgroup,  menu,  nav,  section { display: block; }

.screen-reader-text { display: none; }

body {
	line-height: 1;
}

::selection { background: #7b2e00; color: #f6f5e8; text-shadow: 0 -1px 0 rgba(0, 0, 0, .35); }
::-moz-selection { background: #7b2e00; color: #f6f5e8; text-shadow: 0 -1px 0 rgba(0, 0, 0, .35); }

blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table  { border-collapse: collapse; border-spacing: 0; }
td, td img { vertical-align: top; }

input[type=text], input[type=submit] {
	appearance: none;
	-webkit-appearance: none;
	border-radius: 0;
}


/******************
	BASE STYLES
*******************/
* { outline: 0 none; }
html, body, form, img { border: 0; margin: 0; padding: 0; }
html { font-size: 100% }

body {
	background: #282828;
	color: #363636;
	font: 1em/1.25 'Roboto', sans-serif;
}

.contain {
	clear: both;
	margin: 0 auto;
	max-width: 1500px;
	position: relative;

	box-shadow: 0 0 10px rgba(0, 0, 0, .35);
}

select, input, textarea, button { font: 99% 'Roboto', sans-serif; }

pre, code, kbd, samp { font-family: monospace, 'Roboto', sans-serif; }

img { margin: 0; }
a {
	border: none;
	text-decoration: none;
}
a:hover, a:active { outline: none; }
a:hover { text-decoration: underline; }
ol { list-style-type: decimal; }
small { font-size: 85%; }
strong, th { font-weight: bold; }


/******************
	HEADER
*******************/
#header {
	height: 167px;
	margin: 0 auto;
	position: relative;
	z-index: 100;

	background: #282828 url('images/bg-tile.jpg') 0 0 repeat;
}


/* Logo */
#logo {
	height: 143px;
	/*left: 100px;*/
	left: 7.5%;
	max-width: 377px;
	position: absolute;
	top: 16px;
	width: 28.5%;

	background: transparent url('images/powerhouse-logo.png') 0 0 no-repeat;
	background-size: 100% auto;
}
#logo a {
	display: block;
	height: 100%;
	width: 100%;
}
#logo a img { display: none; }


/* Primary Nav Menu */
#nav {
	bottom: 22px;
	position: absolute;
	right: 100px;
	width: auto;

	font-size: 0;
}
#nav ul {
	height: 30px;
	position: relative;
}
#nav ul li {
	display: inline-block;
	height: 100%;
	margin: 0 0 0 66px;
	position: relative;
	vertical-align: top;
}
#nav ul li:first-child {
	margin: 0;
}
#nav ul li.menu-item-contact { display: none; }
#nav ul li a {
	display: block;
	height: 100%;
	padding: 0 2px;
	position: relative;

	color: #f6f5e8;
	font: 22px/1 'Roboto Condensed', sans-serif;
	letter-spacing: -1px;
	text-decoration: none;
	text-shadow: 2px 2px 0 rgba(0, 0, 0, 1);
	text-transform: uppercase;

	transition: color .25s ease-out;
	-moz-transition: color .25s ease-out;
	-ms-transition: color .25s ease-out;
	-webkit-transition: color .25s ease-out;
}
#nav ul li a:after {
	bottom: 0;
	display: block;
	height: 4px;
	left: 0;
	position: absolute;
	width: 0;

	background-color: #7b2e00;
	content: "";

	transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	transition: width .5s ease-out;
	-moz-transition: width .5s ease-out;
	-ms-transition: width .5s ease-out;
	-webkit-transition: width .5s ease-out;
}
#nav ul li:hover a,
#nav ul li.current-menu-item a,
#nav ul li.current-menu-ancestor a,
#nav ul li.current_page_parent a {
	color: #fff;
}
#nav ul li:hover a:after,
#nav ul li.current-menu-item a:after,
#nav ul li.current-menu-ancestor a:after,
#nav ul li.current_page_parent a:after {
	width: 100%;
}

/* 2nd level nav */
#nav ul li ul.sub-menu { display: none; }

#menu_btn { display: none; } /* used to hide/show smartphone nav menu */


/* Hero Slideshow */
#hero .ill_hero_slider {
	height: 706px;
	overflow: hidden;
	padding: 0;

	transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-webkit-transform: translateZ(0);
}
#hero .ill_hero_slider:before,
#banner:before {
	display: block;
	height: 4px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 40;

	background-color: #7b2e00;
	content: '';
	opacity: .65;
}
#hero .ill_hero_slider:after,
#banner:after {
	border-bottom: 119px solid #f6f5e8;
	bottom: -66px;
	display: block;
	height: 27px;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: 40;

	background-color: rgba(123, 46, 0, .65);
	content: '';

	-webkit-transform: skewY(-4deg);
}
#hero .ill_hero_slider .stage {
	height: 100%;
	padding: 0;
}
#hero .ill_hero_slider .stage .slide .info {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;

	text-align: center;
}
#hero .ill_hero_slider .stage .slide .title,
#banner h1 {
	left: auto;
	padding: 187px 25% 0 25%;
	position: relative;
	top: auto;

	background: transparent;
	color: #fff;
	font: 700 80px/1 'Roboto Condensed', sans-serif;
	letter-spacing: -1px;
	text-shadow: 3px 3px 0 #7b2e00;
	text-transform: uppercase;
}
#hero .ill_hero_slider .stage .slide .button {
	border: 3px solid #f6f5e8;
	display: inline-block;
	margin: 51px 0 0 0;
	padding: 1.2em 4em 1em 4em;

	background-color: rgba(0, 0, 0, .6);
	color: #f6f5e8;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -1;
	text-transform: uppercase;

	transition: background .25s ease-out;
	-moz-transition: background .25s ease-out;
	-ms-transition: background .25s ease-out;
	-webkit-transition: background .25s ease-out;
}
#hero .ill_hero_slider .stage .slide .button:after {
	display: inline-block;
	height: 14px;
	margin: -3px 0 0 16px;
	vertical-align: middle;
	width: 8px;

	background: transparent url(images/btn-arrow.png) 0 0 no-repeat;
	background-size: contain;
	content: '';
}
#hero .ill_hero_slider .stage .slide a:hover + .info .button {
	background-color: #7b2e00;
}
#hero .ill_hero_slider .controls { display: none; }
#hero .ill_hero_slider .prev,
#hero .ill_hero_slider .next {
	margin: 0;
	top: 200px;

	transition: all .35s ease-out;
	-moz-transition: all .35s ease-out;
	-ms-transition: all .35s ease-out;
	-webkit-transition: all .35s ease-out;
}
#hero .ill_hero_slider .prev:after,
#hero .ill_hero_slider .next:after {
	display: block;
	height: 28px;
	margin: -14px 0 0 0;
	position: absolute;
	top: 50%;
	width: 16px;

	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: cover;
	content: '';
}
#hero .ill_hero_slider .prev {
	border-top: 70px solid transparent;
	border-right: 0 none;
	border-bottom: 70px solid transparent;
	border-left: 70px solid #fff;
	left: -70px;
}
#hero .ill_hero_slider .prev:after { left: -54px; background-image: url(images/hero-arrow-left.png); }
#hero .ill_hero_slider:hover .prev { left: 0; }
#hero .ill_hero_slider .next {
	border-top: 70px solid transparent;
	border-right: 70px solid #fff;
	border-bottom: 70px solid transparent;
	border-left: 0 none;
	right: -70px;
}
#hero .ill_hero_slider .next:after { right: -54px; background-image: url(images/hero-arrow-right.png); }
#hero .ill_hero_slider:hover .next { right: 0; }


#banner {
	height: 516px;
	position: relative;

	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	text-align: center;
}
#banner:after {
	bottom: -52px;
}
.blog #banner:after,
.single #banner:after,
#banner.no_overview:after {
	border-bottom: 119px solid #fff;
}

/******************
	CONTENT AREA
*******************/
#content {
	position: relative;
	z-index: 50;

	background: #fff;
}
.home #content {}

#content p {
	padding: 0 0 1em 0;
}
#content ul {
	margin-left: 1em;
	padding: 0 0 1em 1.5em;

	list-style-type: disc;
}
#content ol {
	margin-left: 1em;
	padding: 0 0 1em 1.5em;
}
#content li {
	padding: 4px 0;
}

#content a { text-decoration: underline; }


/* Main Content Column */
#content #main {}


/* Page Overview */
#content #main .overview {
	padding: 42px 100px 60px 100px;
	position: relative;
	z-index: 20;

	background-color: #f6f5e8;
	font: 300 38px/1.25 'Roboto', sans-serif;
	text-align: center;
}
.home #content #main .overview {
	padding: 82px 100px 40px 100px;
}

#content #main .overview:after {
	bottom: -57px;
	display: block;
	height: 125px;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: -1;

	background-color: #f6f5e8;
	content: '';

	-webkit-transform: skewY(4deg);
}
#content #main .overview h1 {
	margin: 0 0 25px 0;

	font: 900 48px/1 'Roboto', sans-serif;
	letter-spacing: -1px;
}

#content #main .post {
	margin: 0 auto;
	padding: 170px 0 100px 0;
	width: 800px;

	/*font-size: .92em;*/
	line-height: 1.5;
}
#content #main.full_width .post {
	width: auto;
	padding-right: 100px;
	padding-left: 100px;
}
#content #main .post h3 {
	clear: both;
	padding: 0 0 50px 0;

	color: #363636;
	font: 700 56px/1 'Roboto Condensed', sans-serif;
	text-shadow: 3px 3px 0 #e1d3c1;
	text-transform: uppercase;
}
#content #main .post h4 + h3 { padding-top: 50px; }
#content #main.full_width h3 { text-align: center; }
#content.blog #main .post h3 { padding: 0 0 8px 0; }
#content #main .post h3 a {
	color: #363636;
	text-decoration: none;
}
#content #main .post h4 {
	clear: both;
	padding: 0 0 25px 0;

	color: #7b2e00;
	font: 700 29px/1 'Roboto Condensed', sans-serif;
}
#content #main .post p + h4 { padding: 25px 0; }
#content #main .post h5 {
	float: right;
	padding: 4px 0 0 1em;

	font: 300 18px/1 'Roboto Condensed', sans-serif;
}
#content #main .post h5 i {
	display: block;
	padding: .25em 0 0 0;

	font-size: .85em;
	font-style: normal;
	opacity: .5;
}
#content #main .post h5 + h4 {
	clear: none;
	padding: 0 0 5px 0;
}
#content #main .post h4 + h5 {
	padding-top: 24px;
}
#content #main .post h4 + h5 + h4 {
	padding-top: 20px;
}
#content #main .post h5 + h4 + p { padding: 0 0 2em 0; }
#content #main .post img {
	height: auto;
	max-width: 100%;

	box-shadow: 7px 7px 0 #e1d3c1;
}
#content #main .post img.size-full,
#content #main .post img.size-large,
#content #main .post img.attachment-large {
	display: block;
	margin: 0 0 20px 0;
}
#content #main .post img.attachment-large { margin: 0 0 40px 0; }
#content #main .post img.size-medium.alignleft,
#content #main .post img.size-full.alignleft { margin: 0 50px 60px 0; }
#content #main .post img.size-medium.alignright,
#content #main .post img.size-full.alignright { margin: 0 0 60px 50px; }

#content #main .post img.size-thumbnail.alignleft { margin: 0 30px 20px 0; }
#content #main .post img.size-thumbnail.alignright { margin: 0 0 20px 30px; }


/* Event Highlights */
#content #side .home-events {
	padding: 150px 0 0 0;

	background: url(images/powerhouse-bolt-bg.png) center center fixed no-repeat, url(images/bg-tile.jpg) 0 0 repeat;
}
#content #side .widget h1 {
	color: #f6f5e8;
	font: 700 56px/1 'Roboto Condensed', sans-serif;
	text-align: center;
	text-shadow: 3px 3px 0 #000;
	text-transform: uppercase;
}
#content #side .ill_calendar {
	padding: 65px 100px 142px 100px;

	text-align: center;
}
#content #side .ill_calendar .ill_calendar_events {
	padding: 0 0 60px 0;
}
#content .ill_calendar .ill_calendar_event {
	display: inline-block;
	height: 354px;
	margin: 0 0 2% 2%;
	position: relative;
	vertical-align: top;
	width: 49%;

	background-color: #f6f5e8;
	color: #363636;
	font-size: 0;
	text-decoration: none;

	transition: background .25s ease-out;
	-moz-transition: background .25s ease-out;
	-ms-transition: background .25s ease-out;
	-webkit-transition: background .25s ease-out;
}
#content .ill_calendar .ill_calendar_event:hover {
	background-color: #deddcd;
}
#content .ill_calendar .ill_calendar_event:nth-child(odd) { margin: 0 0 2% 0; }
#content .ill_calendar .ill_calendar_event .ill_calendar_date_box {
	height: 137px;
	left: 0;
	overflow: hidden;
	padding: 14px 65px 0 16px;
	position: absolute;
	top: 0;
	width: 123px;
	z-index: 40;

	color: #f6f5e8;
	font: 700 23px/.88 'Roboto Condensed', sans-serif;
	text-align: center;
	text-transform: uppercase;
}
#content .ill_calendar .ill_calendar_event .ill_calendar_date_box:before {
	display: block;
	height: 100%;
	left: -50%;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;

	background-color: #7b2e00;
	content: '';

	-webkit-transform: skewX(-42deg);
}
#content .ill_calendar .ill_calendar_event .ill_calendar_date_box .ill_calendar_month {
	border: 0 none;

	background: transparent;
}
#content .ill_calendar .ill_calendar_event .ill_calendar_date_box .ill_calendar_day {
	border: 0 none;

	background: transparent;
	font-size: 37px;

	box-shadow: none;
	-moz-box-shadow: none;
	-ms-box-shadow: none;
	-webkit-box-shadow: none;
}
#content .ill_calendar .ill_calendar_event .ill_calendar_date_box .ill_calendar_year { display: none; }
#content .ill_calendar .ill_calendar_event .ill_calendar_pic {
	display: inline-block;
	height: 100%;
	position: relative;
	vertical-align: top;
	width: 53%;

	background-position: center;
	background-repeat: no-repeat;
	background-size: auto 100%;

	transition: background .25s ease-out;
	-moz-transition: background .25s ease-out;
	-ms-transition: background .25s ease-out;
	-webkit-transition: background .25s ease-out;
}
#content .ill_calendar .ill_calendar_event:hover .ill_calendar_pic { background-size: auto 105%; }
#content .ill_calendar .ill_calendar_event .ill_calendar_pic:after {
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;

	background-color: #000;
	content: '';
	opacity: 0;

	transition: opacity .25s ease-out;
	-moz-transition: opacity .25s ease-out;
	-ms-transition: opacity .25s ease-out;
	-webkit-transition: opacity .25s ease-out;
}
#content .ill_calendar .ill_calendar_event:hover .ill_calendar_pic:after { opacity: .4; }
#content .ill_calendar .ill_calendar_event .ill_calendar_event_info {
	border: 0 none;
	border-radius: 0;
	display: inline-block;
	height: 100%;
	padding: 26px 30px 0 30px;
	vertical-align: top;
	width: 47%;

	background-color: transparent;
	text-align: left;

	box-shadow: none;
	-moz-box-shadow: none;
	-ms-box-shadow: none;
	-webkit-box-shadow: none;
}
#content .ill_calendar .ill_calendar_event .ill_calendar_event_info h2 {
	padding: 0 0 16px 0;

	font: 700 29px/1 'Roboto Condensed', sans-serif;
}
#content .ill_calendar .ill_calendar_event .ill_calendar_event_info .ill_calendar_excerpt {
	font-size: 15px;
	line-height: 1.5;
}
#content .ill_calendar .ill_calendar_event .ill_calendar_event_info .ill_calendar_excerpt .read_more {
	margin: 26px 0 0 0;

	color: #7b2e00;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
}
#content .ill_calendar .ill_calendar_event .ill_calendar_event_info .ill_calendar_excerpt .read_more:after {
	display: inline-block;
	height: 14px;
	margin: -4px 0 0 14px;
	vertical-align: middle;
	width: 8px;

	background: transparent url(images/read-more-arrow.png) 0 0 no-repeat;
	background-size: cover;
	content: '';
}

#content #side .home-posts {
	padding: 20px 100px 70px 100px;
	position: relative;
	z-index: 40;

	background-color: #f6f5e8;
}
#content #side .home-posts:after {
  top: -53px;
  display: block;
  height: 125px;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: -1;

  background-color: #f6f5e8;
  content: '';

  -webkit-transform: skewY(4deg);
}
#content #side .home-posts h1 {
	padding: 0 0 70px 0;

	color: #363636;
	text-shadow: 3px 3px 0 #e1d3c1;
}
#content #side .home-posts .post-items {
	padding: 0 0 60px 0;
}
#content #side .home-posts .post-item {
	display: inline-block;
	margin: 0 0 0 4%;
	position: relative;
	vertical-align: top;
	width: 48%;

	font-size: 0;
}
#content #side .home-posts .post-item:first-child { margin: 0; }
#content #side .home-posts .post-item .thmb {
	float: left;
	padding: 35% 0 0 0;
	position: relative;
	vertical-align: top;
	width: 47.5%;

	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;

	box-shadow: 7px 7px 0 #e1d3c1;
}
#content #side .home-posts .post-item .thmb a {
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
#content #side .home-posts .post-item .post-info {
	float: right;
	width: 47.5%;
}
#content #side .home-posts .post-item .post-info h2 {
	padding: 0 0 16px 0;

	font: 700 29px/1 'Roboto Condensed', sans-serif;
}
#content #side .home-posts .post-item .post-info h2 a {
	color: #7b2e00;
	text-decoration: none;
}
#content #side .home-posts .post-item .post-info .excerpt {
	font-size: 15px;
	line-height: 1.5;
}
#content #side .home-posts .post-item .post-info .read_more {
	display: block;
	margin: 26px 0 0 0;

	color: #7b2e00;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;
}
#content #side .home-posts .post-item .post-info .read_more:after {
	display: inline-block;
	height: 14px;
	margin: -4px 0 0 14px;
	vertical-align: middle;
	width: 8px;

	background: transparent url(images/read-more-arrow.png) 0 0 no-repeat;
	background-size: cover;
	content: '';
}

#content .more_btn,
#breadcrumb .alignright a,
#breadcrumb .alignleft a {
	display: inline-block;
	padding: 1.35em 4em;

	background-color: #7b2e00;
	color: #f6f5e8;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;

	transition: background .25s ease-out;
	-moz-transition: background .25s ease-out;
	-ms-transition: background .25s ease-out;
	-webkit-transition: background .25s ease-out;
}
.blog #content .more_btn,
.blog #breadcrumb .alignright a,
.blog #breadcrumb .alignleft a {
	margin: 22px 0 0 0;
}
#content .more_btn:after,
.blog #breadcrumb .alignright a:after {
	display: inline-block;
	height: 14px;
	margin: -3px 0 0 14px;
	vertical-align: middle;
	width: 8px;

	background: transparent url(images/btn-arrow.png) 0 0 no-repeat;
	background-size: cover;
	content: '';
}
.blog #breadcrumb .alignleft a:before {
	display: inline-block;
	height: 14px;
	margin: -3px 14px 0 0;
	vertical-align: middle;
	width: 8px;

	background: transparent url(images/btn-arrow-left.png) 0 0 no-repeat;
	background-size: cover;
	content: '';
}
#content .more_btn:hover,
.blog #breadcrumb .alignright a:hover,
.blog #breadcrumb .alignleft a:hover {
	background-color: #622602;
}


/* Blog */
#content.blog #main h2 { margin: 0; padding: 5px 0; }
#content.blog #main .post {
	clear: both;
	padding: 50px 0 25px 0;
}
#content.blog #main .post:last-child { padding-bottom: 100px; }

/* Footer */
#footer {
	clear: both;
	height: 532px;
	padding: 0;
	position: relative;

	background: url(images/bg-tile.jpg) 0 0 repeat;
	color: #f6f5e8;
	font-size: 0;
}
#footer a {
	color: #f6f5e8;
	text-decoration: none;
}
#footer a[href]:hover {
	color: #fff;
	text-decoration: underline;
}
#footer h1 {
	padding: 0 0 35px 0;

	color: #f6f5e8;
	font: 700 50px/1 'Roboto Condensed', sans-serif;
	text-align: center;
	text-shadow: 3px 3px 0 #000;
	text-transform: uppercase;
}
#footer .left {
	display: inline-block;
	height: 100%;
	padding: 70px 0 0 0;
	vertical-align: top;
	width: 50%;

	background: url(images/powerhouse-bolt-bg.png) center center no-repeat;
	background-size: auto 450px;
	font-size: 13px;
	text-align: center;
}
#footer .contact {
	padding: 0 0 50px 0;
}
#footer .contact h2 {
	font: 700 29px/1 'Roboto Condensed', sans-serif;
}
#footer .contact a {
	display: block;
	margin: 18px auto 0 auto;
	max-width: 400px;
	padding: 0 0 0 30px;

	background-position: left center;
	background-repeat: no-repeat;
	background-size: auto 100%;
	font-size: 17px;
	text-align: left;
}
#footer .contact a.address { background-image: url(images/icon-address.png); }
#footer .contact a.phone { background-image: url(images/icon-phone.png); background-size: 19px auto; }
#footer .contact a.email { background-image: url(images/icon-email.png); background-size: 17px auto; }
#footer .contact a.hours { background-image: url(images/icon-hours.png); background-size: 18px auto; }

#footer .right {
	display: inline-block;
	height: 100%;
	vertical-align: top;
	width: 50%;

	background-color: #472b1a;
}
#footer .right a.map {
	display: block;
	height: 100%;
	width: 100%;

	background: url(images/footer-map.png) center center no-repeat;
	background-size: cover;
}


/******************
	WIDGETS
*******************/

/* social icons */
.social {
	font-size: 0;
}
#header .social {
	position: absolute;
	right: 100px;
	top: 22px;
}
#footer .social { padding: 0 0 24px 0; }
.social a {
	border-radius: 50%;
	display: inline-block;
	height: 34px;
	margin: 0 0 0 10px;
	overflow: hidden;
	vertical-align: top;
	width: 34px;

	background-color: #7b2e00;
	background-position: 0 0;
	background-repeat: repeat;
	background-size: 34px 34px;

	transition: background .35s ease-out;
	-moz-transition: background .35s ease-out;
	-ms-transition: background .35s ease-out;
	-webkit-transition: background .35s ease-out;
}
.social a:first-child { margin: 0; }
.social a:hover {
	background-color: #622602;
	background-position: 0 -34px;
}
.social a:before {}
.social a.facebook { background-image: url(images/social-facebook.png); }
.social a.twitter { background-image: url(images/social-twitter.png); }
.social a.instagram { background-image: url(images/social-instagram.png); }
.social a.googleplus { background-image: url(images/social-googleplus.png); }

/* calendar */
#banner.no_overview + #content #main .post {
	padding-top: 50px;
}
.page #content #main .ill_calendar .more_btn { display: none; }
#content #main .ill_calendar_single {
	margin: 0 auto;
	width: 800px;
}
#content #main .ill_calendar_single h3 {
	padding: 0 0 8px 0;

	text-align: left;
}


/******************
	SPECIAL EFFECTS
*******************/

#nav ul li a {
	transition: background .25s ease-out, color .25s ease-out;
	-moz-transition: background .25s ease-out, color .25s ease-out;
	-ms-transition: background .25s ease-out, color .25s ease-out;
	-webkit-transition: background .25s ease-out, color .25s ease-out;
}


/******************
	UTILITY STYLES
*******************/

/* Alignment */
.alignleft { display: inline; float: left; margin-right: 15px; }
.alignright { display: inline; float: right; margin-left: 15px; }
.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; }
.alignleft-nomargin { display: inline; float: left; }
.alignright-nomargin { display: inline; float: right; }

.center_it { text-align: center; }

.hidden { display: none; visibility: hidden; }
.invisible { visibility: hidden; } /* Hide visually and from screenreaders, but maintain layout */

.full-width-item { width: 100%; } /* for use with outer wrappers */

/* Clearfix */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; visibility: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

#menu_btn { display: none; }


/******************
	TABLET
*******************/
@media only screen and (max-width: 768px) {
	.contain, .inner,
	#content #main, #content #side,
	#content #main .ill_calendar_single,
	#content #main .post {
		border: 0 none;
		bottom: auto;
		float: none;
		height: auto;
		left: auto;
		margin: 0;
		min-height: 0;
		min-width: 0;
		position: static;
		right: auto;
		top: auto;
		width: auto;
	}

	html { overflow: auto; }

	body {
		padding: 180px 0 0 0;
		position: relative;

		background: #fff;
	}

	/*body:before{display: block;height: 100%;left: 767px;outline: 2px dashed #f80;position: fixed;top: 0;width: 0;z-index: 9999;content: '';zoom: 1;}*/

	#header {
		height: 180px;
		left: 0;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 100;
	}
	#header:after {
		display: block;
		height: 4px;
		left: 0;
		position: absolute;
		top: 100%;
		width: 100%;
		z-index: 20;

		background-color: #7b2e00;
		content: '';
		opacity: .65;
  	}
	#header .bar {
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
		z-index: 20;

		background: #282828 url('images/bg-tile.jpg') 0 0 repeat;
	}

	#logo {
		left: 20px;
		position: relative;
		top: 20px;
		width: 377px;

		background-size: contain;
	}

	#header .social {
		right: 20px;
		top: 20px;
	}

	#menu_btn {
		display: block;
		position: absolute;
		right: 20px;
		top: 120px;

		color: #f6f5e8;
		cursor: pointer;
		font: 21px/1 'Roboto Condensed', sans-serif;
		text-shadow: 2px 2px 0 #000;
		text-transform: uppercase;
	}
	#menu_btn:after {
		display: inline-block;
		margin: -3px 0 0 8px;
		vertical-align: middle;

		content: "\f333";
		font: 44px/1 'dashicons';
	}
	#nav {
		bottom: auto;
		height: 100%;
		left: 0;
		margin: 0;
		padding: 0;
		position: fixed;
		right: auto;
		top: 0;
		width: 100%;
		z-index: 30;

		background: #282828 url('images/bg-tile.jpg') 0 0 repeat;
		font-size: 0;
		text-align: left;

		transform: translate3d(-100%, 0, 0);
		-webkit-transform: translate3d(-100%, 0, 0);
		transition: transform .35s ease;
		-webkit-transition: -webkit-transform .35s ease;
	}
	#nav * { -webkit-tap-highlight-color: rgba(0,0,0,0); }
	#nav.slid {
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}
	#nav #menu_btn_close {
		position: absolute;
		right: 20px;
		top: 60px;
		z-index: 40;

		cursor: pointer;
	}
	#nav #menu_btn_close:after {
		display: block;
		height: 35px;
		width: 35px;

		background: transparent url(images/menu-close.png) center center no-repeat;
		background-size: contain;
		content: '';
	}
	#nav .menu-primary-container {
		display: table;
		height: 100%;
		width: 100%;

		background: url(images/powerhouse-bolt-bg.png) center center no-repeat;
		background-size: 385px auto;
	}
	#nav ul.menu {
		border: 0 none;
		display: table-cell;
		height: 100%;
		vertical-align: middle;
	}
	#nav ul.menu li {
		display: block;
		float: none;
		height: auto;
		margin: 0 0 0 auto;
		position: static;
		width: auto;

		text-align: center;
	}
	#nav ul li.menu-item-contact { display: block; }
	#nav ul.menu li:first-child { border-width: 0; }
	#nav ul.menu li a {
		padding: 15px 20px;
		position: relative;
		top: auto;
		background: transparent;

		color: #fff;
		font: 700 70px/1 'Roboto Condensed', sans-serif;
		letter-spacing: -1px;
		text-transform: uppercase;
  	}
  	#nav ul li a:after { display: none; }
	#nav ul.menu li:hover a,
	#nav ul.menu li.active a,
	#nav ul.menu li.over a {}


	#hero .ill_hero_slider:before,
	#banner:before {
		display: none;
	}

	#hero .ill_hero_slider .stage .slide .title, #banner h1,
	.home #content #main .overview {
		padding-right: 40px;
		padding-left: 40px;
	}

	.home #content #main .overview {
		padding-top: 60px;
		padding-bottom: 30px;
	}

	#content #main .post img.size-medium.alignleft,
	#content #main .post img.size-full.alignleft,
	#content #main .post img.size-medium.alignright,
	#content #main .post img.size-full.alignright {
		display: block;
		float: none;
		margin: 0 auto 40px auto;
	}

	#content #side .ill_calendar,
	#content .ill_calendar,
	#content #main .overview,
	#content #main.full_width .post,
	#content #main .post {
		padding-right: 20px;
		padding-left: 20px;
	}
	#content .post .ill_calendar {
		padding-right: 0;
		padding-left: 0;
	}
	#content .ill_calendar .ill_calendar_event,
	#content .ill_calendar .ill_calendar_event:nth-child(odd) {
		display: block;
		margin: 0 0 4% 0;
		width: auto;
	}
	#content .ill_calendar .ill_calendar_event .ill_calendar_pic {
		width: 47.5%;

		background-size: cover;
	}
	#content .ill_calendar .ill_calendar_event .ill_calendar_event_info {
		width: 52.5%;
	}

	#content.blog #main .post {
		padding: 50px 20px 25px 20px;
	}

	#content #side .home-posts {
		padding: 20px 20px 40px 20px;
	}
	#content #side .home-posts .post-items { padding: 0; }
	#content #side .home-posts .post-item,
	#content #side .home-posts .post-item:first-child {
		display: block;
		margin: 0 0 8% 0;
		width: auto;
	}
	#content #side .home-posts .post-item .thmb {
		padding: 32.5% 0 0 0;
		width: 42%;
	}
	#content #side .home-posts .post-item .post-info { width: 54% }

	#footer {
		height: auto;
	}
	#footer .left {
		display: block;
		width: auto;
	}
	#footer .right { display: none; }
}

/******************
	SMARTPHONE
*******************/
@media only screen and (max-width: 600px) {
	#header .social { display: none; }

	body {
		padding: 88px 0 0 0;
	}

	/*body:before{display: block;height: 100%;left: 320px;outline: 3px dashed #f80;position: fixed;top: 0;width: 0;z-index: 9999;content: '';zoom: 1;}
	body:after{display: block;height: 0;left: 0;outline: 3px dashed #f80;position: fixed;top: 436px;width: 100%;z-index: 9999;content: '';zoom: 1;}*/

	#header {
		height: 88px;
	}

	#logo {
		height: 60px;
		left: 15px;
		width: 164px;
		top: 15px;
	}

	#menu_btn {
		right: 10px;
		top: 20px;

		font-size: 0;
	}
	#nav #menu_btn_close {
		right: 15px;
		top: 20px;
	}
	#nav .menu-primary-container {
		background-size: 85% auto;
	}
	#nav ul.menu li a {
		font-size: 40px;
	}

	#hero .ill_hero_slider {
		height: 436px;
	}
	#hero .ill_hero_slider:after, #banner:after {
		border-bottom: 79px solid #f6f5e8;
	}
	#hero .ill_hero_slider .stage .slide .title,
	#banner h1,
	.home #content #main .overview {
		padding: 80px 20px 0 20px;

		font-size: 49px;
	}
	#hero .ill_hero_slider .stage .slide .title {
		text-shadow: 2px 2px 0 #7b2e00;
	}
	#hero .ill_hero_slider .stage .slide .button {
		margin-top: 40px;
	}
	#hero .ill_hero_slider .prev,
	#hero .ill_hero_slider .next {
		top: 185px;
	}
	#hero .ill_hero_slider .prev {
		border-top: 35px solid transparent;
		border-right: 0 none;
		border-bottom: 35px solid transparent;
		border-left: 35px solid #fff;
		left: 0;
	}
	#hero .ill_hero_slider .prev:after,
	#hero .ill_hero_slider .next:after {
		height: 14px;
		margin: -7px 0 0 0;
		width: 8px;
	}
	#hero .ill_hero_slider .prev:after {
		left: -27px;
	}
	#hero .ill_hero_slider .next {
		border-top: 35px solid transparent;
		border-right: 35px solid #fff;
		border-bottom: 35px solid transparent;
		border-left: 0 none;
		right: 0;
	}
	#hero .ill_hero_slider .next:after {
		right: -27px;
	}

	#banner {
		height: 275px;
	}
	.blog #banner:after,
	.single #banner:after,
	#banner.no_overview:after {
		border-bottom: 64px solid #fff;
	}

	#content #main {}
	.home #content #main .overview,
	#content #main .overview {
		padding: 35px 15px 0 15px;

		font-size: 24px;
	}
	#content #main .overview h1 {
		font-size: 36px;
	}

	#content #main .post h5 {
		max-width: 25%;

		font-size: .85em;
	}
	#content #main .post h5 + h4 { max-width: 73%; }

	#content #main .post {
		padding-top: 115px;
		padding-bottom: 50px;
	}
	#content #main .post h3 {
		font-size: 43px;
	}
	#content #main .post h4 {
		padding-bottom: 15px;

		font-size: 24px;
	}
	#content #main .post img.size-thumbnail.alignright {
		margin-left: 0;
	}

	#content.blog #main .post {
		padding: 50px 15px 25px 15px;
	}

	#content #side {}
	#content #side .widget h1 {
		padding: 0 15px;

		font-size: 46px;
	}

	#content #side .home-events {
		padding-top: 120px;
	}
	#content #side .ill_calendar,
	#content .ill_calendar,
	#content #main .overview,
	#content #main.full_width .post,
	#content #main .post {
		padding-right: 10px;
		padding-left: 10px;
	}
	#content #side .ill_calendar {
		padding-top: 30px;
		padding-bottom: 100px;
	}
	#content .ill_calendar .ill_calendar_event {
		height: auto;
	}
	#content .ill_calendar .ill_calendar_event .ill_calendar_pic {
		display: block;
		padding: 80% 0 0 0;

		width: auto;
	}
	#content .ill_calendar .ill_calendar_event .ill_calendar_event_info {
		display: block;
		padding: 16px 20px;
		width: auto;
	}
	#content .ill_calendar .ill_calendar_event,
	#content .ill_calendar .ill_calendar_event:nth-child(odd) {
		margin-bottom: 6%;
	}

	#content #side .home-posts {
		padding-right: 10px;
		padding-left: 10px;
	}
	#content #side .home-posts:after {
		height: 65px;
	}
	#content #side .home-posts h1 {
		padding-bottom: 15px;
	}
	#content #side .home-posts .post-item {
		padding-top: 20px;
	}
	#content #side .home-posts .post-item .thmb {
		display: block;
		margin: 0 0 34px 0;
		padding-top: 75%;
		width: 98%;
	}
	#content #side .home-posts .post-item .post-info {
		display: block;
		width: auto;		
	}

	#content .more_btn,
	#breadcrumb .alignright a,
	#breadcrumb .alignleft a {
		display: block;
	}

	#footer h1 {
		font-size: 43px;
	}
	#footer .left {
		padding: 35px 15px;

		font-size: 10px;
	}
	#footer .contact a {
		font-size: 16px;
	}

	.alignleft, .alignright {
		display: block;
		float: none;
		height: auto;
		margin: 0 0 1em 0;
		max-width: 90%;
	}
}
.only_mobile { display: none; }


/******************
	PRINT
*******************/
@media only print {
	#utility_nav, #search, #nav,
	#hero,
	#social { display: none; }

	#header,
	.contain, .inner,
	#content #main, #content #side {
		clear: both;
		float: none;
		height: auto;
		min-height: 0;
		width: auto;

		background: transparent;
	}

	body { background: transparent; }

	#logo {
		left: auto;
		margin: 0 auto .5in auto;
		position: relative;
		top: auto;

		background: transparent;
		zoom: .5;
	}
	#logo a img { display: block; }

	#footer, #footer a { color: #888; }
}