/*------------------------------------*\



    CONTENTS



\*------------------------------------*/


/*

1. BASE.........Reset and default styles

2. LAYOUT.......Main and unique elements

3. MODULE............Reusable components

4. STATE..................Current states

5. THEME............Branding and colours

*/


/*------------------------------------*\



    1. $BASE



\*------------------------------------*/


@font-face {
	font-family: 'Avenir LT Std 45 Book';
	font-style: normal;
	font-weight: normal;
	src: local('Avenir LT Std 45 Book'), url('/wp-content/themes/standard-responsive/fonts/AvenirLTStd-Book.woff') format('woff');
}
@font-face {
	font-family: 'Avenir LT Std 85 Heavy';
	font-style: normal;
	font-weight: normal;
	src: local('Avenir LT Std 85 Heavy'), url('/wp-content/themes/standard-responsive/fonts/AvenirLTStd-Heavy.woff') format('woff');
	}

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, capt, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

* {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;	
}

ul, ol { margin-left: 1em; }

body {
	color: #000000!important;
	font-family: 'Avenir LT Std 45 Book', sans-serif!important;
	font-style: normal;
}
section { overflow-y: hidden;}

strong {
	font-family: 'Avenir LT Std 85 Heavy', sans-serif!important;
	font-weight: 700!important;
	font-style: normal;
}

h1 {
	font-size: 4.5em;
	font-family: 'Avenir LT Std 85 Heavy', sans-serif!important;
	font-weight: 800;
	font-style: normal;
	margin-bottom: 1em!important;
}

h2, h3, h4 {
	font-family: 'Avenir LT Std 85 Heavy', sans-serif!important;
	margin-bottom: 1em!important;
}

p {
	margin-bottom: 1em!important;
	line-height: 1.75em!important;
	font-size: 1.125em;
}
header {

}

.overlayblock {
	position: absolute;
	width: 100%;
	height: 100vh;
	background-color: #333333;
	animation-delay: 0ms;
	transition-timing-function: ease-out;
	transform: skew(15deg, 15deg);
}
.overlayblock2 {
	position: absolute;
	width: 100%;
	height: 100vh;
	background-color: #FFFFFF;
	animation-delay: 500ms;
	transition-timing-function: ease-out;
	transform: skew(30deg, 30deg);
}
.overlayblock3 {
	position: absolute;
	width: 100%;
	height: 100vh;
	background-color: #000000;
	animation-delay: 750ms;
	transition-timing-function: ease-out;
	transform: skew(30deg, 30deg);
}

.header h1 {
	font-size: 4.25em!important;
}
.header h2 {
	font-size: 1.5em!important;
}

/* Give elements the same bottom margin to create consistent vertical rhythm */


.clr { clear:both;}


.header-block { 
	position: fixed;
    z-index: 9999;
	width: 100%; 
}

.content a { 
	color:#444444!important;
	font-weight: normal!important;
	border-bottom: 2px solid #444444;
 }

 .content a:hover { 
	color:#999999!important;
	border-color: #999999!important;
 }

/*------------------------------------*\



    $TYPOGRAPHY



\*------------------------------------*/


.blog-content .page-title { font-size: 4em; }

.blog-title { font-family: 'Avenir LT Std 85 Heavy'; margin-top: 10px; font-size: 1.6em!important; line-height: 1.35em!important; }
.blog-title a:hover { text-decoration: none!important; }

.article-head { font-size: 15em; text-align: center; color: #dcdcdc; }


.blog .blog-content { padding-top: 12em; }

.search .blog-content { padding-top: 12em; }

.single .blog-content { padding-top: 0em; }

.blog-content .hentry {
	width: 100%;
	text-align: center;
	border: 1px solid #000000;
  /*  height: 14vw; */
	margin: 0px 20px;
	height: calc(var(--vh, 1vw) * 33);
}

.blog-content .hentry img { 
	position: absolute;
    z-index: 1;
    top: 0px;
	left: 0px;
 }

.blog-title { 
    position: relative;
}
.post-meta { 
	z-index: 2;
    position: relative;
}
.post-meta a {
	border-bottom: 0px;
}
.text-center {
	z-index: 2;
    position: relative;
}

.blog-content h3 {
	text-transform: inherit!important;
}
.blog-content h4 {
	text-transform: inherit!important;
}
a.post-link { 
	text-align: center;
	display: block;
	height: 100%;
	position: relative;
	overflow: hidden;
}
a.post-link p {
	text-decoration: none;
	font-weight: normal;
	color: #000;
}
a.post-link:hover {
	text-decoration: none;
	color: #FFFFFF;
}


a.post-link img {
	
	opacity: 1;
	transform: scale(1);
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	 -ms-transition: all .25s ease-out;
	  -o-transition: all .25s ease-out;
		 transition: all .25s ease-out;

}
a.post-link:hover > img {
	opacity: 0;
	transform: scale(1.35);
	-webkit-transition: all .35s ease-in-out;
	-moz-transition: all .35s ease-in-out;
	 -ms-transition: all .35s ease-in-out;
	  -o-transition: all .35s ease-in-out;
		 transition: all .35s ease-in-out;
}

a.post-link:hover > .post-box .post-date {
	opacity: 0;
}

.post-box { 
/*	height:14vw; */
	margin: 0em 0em 2em 0em;
}
.post-box:nth-child(1n) {
	-webkit-animation-delay: 1s;
    animation-delay: 1s;
}
.post-box:nth-child(2n) {
	-webkit-animation-delay: 1.25s;
    animation-delay: 1.25s;
}
.post-box:nth-child(3n) {
	-webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
}


.post-date {
	position: absolute;
    top: -14px;
    width: calc(100% - 15px);
    text-align: center;
}

.post-date span {
	display: inline-block;
    background-color: #FFFFFF;
    padding: 0px 15px;
}

.category .content {
	padding-top: 150px;
}

.superquote { text-align: center; font-size: 8em!important; margin-top: 50px;}

@media only screen and (max-width: 1024px) {
	/*.blog-content .hentry { height: auto; } */
	.post-desc {display: none;}
}

@media only screen and (max-width: 1023px) {
	.post-box { height: 33vw; }
	.blog-content .page-title { font-size: 3em; }
	.blog .blog-content { padding-bottom:3em; }
	.blog-content .hentry { height: calc(var(--vh, 1vw) * 20); }
}

@media only screen and (max-width: 767px) {
	p {
		margin-bottom: 1em!important;
		line-height: 1.5em!important;
		font-size: 1em;
	}
	.post-box { height: auto; margin: 0em; }
	.blog-content .page-title { font-size: 2.5em; }
	.category .content { padding-top: 100px; }
	.header-block { height: 90px!important; }
	.single .blog-content { padding-top: 8em; }
	
	.blog-content .hentry { height: calc(var(--vh, 1vw) * 45); }
}
/*------------------------------------*\



    $LINKS



\*------------------------------------*/


a:link, a:visited {
    text-decoration: none;
    color: #555;
    font-weight: bold;
	-webkit-transition: all .25s ease-in-out;
       -moz-transition: all .25s ease-in-out;
        -ms-transition: all .25s ease-in-out;
         -o-transition: all .25s ease-in-out;
			transition: all .25s ease-in-out;
}

a:hover {
    color: #1694d6;
    text-decoration: none!important;
    outline: none;
}

a:focus, a:active { outline: none }

/*------------------------------------*\



    $BUTTONS



\*------------------------------------*/



a.button {
	font-size: 1.375em;
	padding: 7px 10px;
	font-weight: bold;
	text-decoration:none!important;
	color: #000000;
	background-color: #FFFFFF;
	border: 2px solid #000000;
}


.post-box a.button {
	position: relative;
	bottom: 30px;
	z-index: 998;
}


button, input[type="submit"] {
	font-size: 1em;
    padding: 8px 20px;
	font-weight: bold;
	text-decoration:none!important;
	color: #FFFFFF;
	text-shadow: 2px 2px #312c2b;
	text-transform: uppercase;
	background-color: #666666;
}


a.button {
    display: inline-block;
    zoom: 1;
    *display: inline;    
}


a.button:hover, button:hover {
    text-decoration: none;
    color: #fff;
	background-color: #000000;
}

input[type="submit"]:hover {
    text-decoration: none;
    color: #fff;
	background-color: #8b230b;
	text-shadow: 2px 2px #501406;
}

a.button-alt { 
	font-size: 1.375em;
    padding: 7px 10px;
	font-weight: bold!important;
	text-decoration: none!important;
	color: #FFFFFF!important;
	background-color: #000000;
	border: 2px solid #000000!important;
}
a.button-alt:hover {
	color: #000000!important;
    background-color: #FFFFFF!important;
	border: 2px solid #000000!important;
}



a.button-full {
	width: 100%;
	display: block;
	text-align: center;
	padding-left: 0;
	padding-right: 0;
}

a.button-cta {
	font-size: 2em;
	font-weight: bold;
	margin-bottom: 0.469em;
}

.button + .button { margin-left: 0.75em; }

.btn-primary {
	color: #FFF!important;
}

.is-checked {
	color: #fff;
    background-color: #202020;
    text-shadow: 2px 2px #000000;
}
button:focus { outline: none!important; }
/*------------------------------------*\



    $FORMS



\*------------------------------------*/

input, select, textarea, button {

    font-family: inherit;
	font-size: inherit; 
    line-height: 1em;
    border: 1px solid #ddd;
	padding: 0.188em 0.313em; /* 3px 5px */
	font-family: 'Avenir LT Std 85 Heavy', sans-serif!important;
}


input[type="submit"], button {

	-webkit-appearance: none; /* Remove iOS default styles */
    cursor: pointer;
    border: none;
    -webkit-transition: all .1s linear;
       -moz-transition: all .1s linear;
        -ms-transition: all .1s linear;
         -o-transition: all .1s linear;
            transition: all .1s linear;

}


.nf-field-element input {
	background-color: #000;
    border: solid #FFF;
	border-width: 0px 0px 2px 0px;
	padding: 3px 0px;
	color: #FFFFFF;
	font-size: 2em;
}

.nf-field-element textarea {
	background-color: #000;
    border: solid #FFF;
	border-width: 0px 0px 2px 0px;
	padding: 3px 0px;
	color: #FFFFFF;
	font-size: 2em;
	height: 120px!important;
}

.nf-form-fields-required {
	font-size: 0.75em;
    margin: 0em 0 2em 0;
    color: #666;
}

.nf-form-content  input[type=button] {
	font-size: 1em;
    padding: 8px 20px;
    font-weight: bold;
    text-decoration: none!important;
    color: #FFFFFF;
    background-color: #000000;
	text-transform: uppercase;
	border-width: 2px 2px 2px 2px;
}

textarea:focus, input:focus {
	outline: none;
}
/*------------------------------------*\



    $OTHER ELEMENTS



\*------------------------------------*/



hr {

	border: solid #bbbbbb!important;
	border-width: 1px 0 0 0!important;
    clear: both;
	width: 33%;
	margin: 3.5em auto!important;

}

img, iframe { 

	vertical-align: top; 
	max-width: 100%;
	height: auto;

}

/*------------------------------------*\



    2. $LAYOUT



\*------------------------------------*/



.logo { 
	width: auto;
	float: left;
	margin-right: 30px;
}

.logo svg {
	width: 200px;
    height: auto;
    margin: 30px 0px 0px 20px;
}

.logolink {
	display: inline-block;
    background-color: #2a2a2c;
    float: right;
    margin-right: -16px;
}

.menu-logo {display: none; height: 50px; margin-top: 30px; position: absolute; }

header { overflow: hidden; }

.logo-home { width: 60%;
    top: 50%;
    transform: perspective(1px) translateY(-50%);
	position: relative; 
	z-index: 5;
}

header video {
	position: absolute;
	top: 50%;
	left: 50%;
	/*top: 0;
	left: 0;*/
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: 0;
	-ms-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

header .container {
	position: relative;
	z-index: 2;
}
  
header .overlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: black;
	opacity: 0.5;
	z-index: 1;
}
	
.glowfilter {
	filter: drop-shadow( 0 0px 7px #FFFFFF );
}


.midnightHeader.default path, .midnightHeader.default rect { fill: #FFFFFF!important; }
.midnightHeader.white path, .midnightHeader.white rect { fill: #000000!important; }
.midnightHeader.alternate path, .midnightHeader.alternate rect { fill: #000000!important; }
.midnightHeader.transparent path, .midnightHeader.transparent rect { fill: #ffffff00!important; }

.midnightHeader.default span, .midnightHeader.default .bun, .midnightHeader.default .pattie { background-color: #FFFFFF; }
.midnightHeader.white span, .midnightHeader.white .bun, .midnightHeader.white .pattie { background-color: #000000; }
.midnightHeader.alternate span { background-color: #FFFFFF; }
.midnightHeader.transparent span { background-color: #FFFFFF; }
  
.midnightInner {overflow: hidden!important;}

.blog .logo path, .blog .logo rect, .single-post path, .single-post rect { fill: #000000!important; }

.blog .bun, .blog .pattie, .single-post .bun, .single-post .pattie { background-color: #000000!important; }

.logo.toggled path, .logo.toggled rect {
	fill: #FFFFFF!important;
}


.st0 {
	stroke:#FFFFFF!important;
}
.st1 {
	fill:#FFFFFF!important;
}

.home .st0 {
	stroke:#2a2a2c!important;
}
.home .st1 {
	fill:#2a2a2c!important;
}


.toggled .st0 {
	stroke:#FFFFFF!important;
	-webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.toggled .st1 {
	fill:#FFFFFF!important;
	-webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

@media only screen and (max-width: 1450px) {
.logo svg { width: 150px; height: auto; }
}

@media only screen and (max-width: 768px) {
	.logo svg {
		width: auto; 
		height: 40px;
		margin: 35px 0px 0px 30px;
	}
}

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

	.logo-home {
		width: 90%;
	}
	.logo svg {
		width: auto; 
		height: 55px;
		margin: 20px 0px 0px 20px;
	}
	.menu-logo { 
		display: block;
		opacity: 0;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}
	.toggled .menu-logo {
		opacity: 1;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

}

.featured-event { margin-top: 40px; }
.home-map { height: 700px; margin-top: 100px; margin-bottom: 100px;}
#map { height: 60vh; }
.place-card { display: none; }

nav.navigation { z-index: 999!important; margin-top: 40px; margin-bottom: 50px; border-top: 2px solid #bf4b30; border-bottom: 2px solid #bf4b30; height: 49px; }

nav ul { list-style-type: none; }

.navigation-touch { margin-top: 0px!important; }

.navcont { float: right; }


nav span {
	position: relative;
	cursor: pointer;
  }
  
nav span:before, span:after {
	content: '';
	position: absolute;
	width: 0%;
	height: 5px;
	top: 100%;
	margin-top: -0.5px;
	background: #fff;
  }
  
nav span:before {
	left: -2.5px;
  }
nav span:after {
	right: 2.5px;
	background: #fff;
	transition: width 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
  }
  
nav span:hover:before {
	background: #fff;
	width: 100%;
	transition: width 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
  }
  
nav span:hover:after {
	background: transparent;
	width: 100%;
	transition: 0s;
  }

.target-burger { position: fixed; z-index: 9999; right: 50px; top: 80px; }
.target-burger ul { 
	width: 1.625em;
    height: 1.625em;
    list-style: none;
    margin: -0.8125em 0 0 -0.8125em;
    padding: 0;
    position: absolute;
    top: 50%;
    left: 50%;
 }
.burger  { margin: 60px 50px 0px 0px; }
.bun {
    width: 100%;
    height: 2px;
    background-color: #FFF;
    position: absolute;
    top: 50%;
    margin-top: -0.75px;
    -webkit-transform: translateY(-7.5px) translateZ(0);
    transform: translateY(-7.5px) translateZ(0);
    -webkit-transition: -webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1), background-color 1s cubic-bezier(0.23, 1, 0.32, 1);
    transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), background-color 1s cubic-bezier(0.23, 1, 0.32, 1);
}
.pattie {
    width: 100%;
    height: 2px;
    background-color: #FFF;
    position: absolute;
    top: 50%;
    margin-top: -0.75px;
    -webkit-transform: translateY(0px) translateZ(0);
    transform: translateY(0px) translateZ(0);
    -webkit-transition: -webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1), background-color 1s cubic-bezier(0.23, 1, 0.32, 1);
    transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), background-color 1s cubic-bezier(0.23, 1, 0.32, 1);
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

li.bun:last-child {
    -webkit-transform: translateY(7.5px) translateZ(0);
    transform: translateY(7.5px) translateZ(0);
}

.toggled li.bun {
    -webkit-transform: rotate(45deg) translateZ(0);
    transform: rotate(45deg) translateZ(0);
}

.toggled li.pattie {
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
}

.toggled li.bun:last-child {
    -webkit-transform: rotate(-45deg) translateZ(0);
    transform: rotate(-45deg) translateZ(0);
}

.header { 
    z-index: 9999;
 }

.feature-beer-content {
	text-align: center;
	text-transform: uppercase;
}

a .feature-beer-content {
	color: #FFFFFF;
	text-decoration: none;
}

.feature-beer-content h2, a .feature-beer-content h2 { font-weight: bold; font-size: 4.375em; color: #FFFFFF; text-decoration: none; }

.feature-beer-content p, a .feature-beer-content p { font-size: 1.750em; color: #FFFFFF; font-weight: normal; text-decoration: none; }


a.beer-link:hover > div .feature-beer-content h2, a.beer-link:hover > div .feature-beer-content p { text-decoration: none!important; }

.beer-link img {
	position: absolute;
	height: 360px;
	left: 10%;
    top: 20px;
}


.banner-content-beer img {
	position: absolute;
	height: 360px;
	left: 10%;
    top: 20px;
}

.banner-content-growler img {
	position: absolute;
	height: 360px;
	left: 10px;
    top: 20px;
}

.header, .navigation, .main, .footer { width: 100%; }


.testing { color:#FFFFFF;  transition-delay: 0.75s!important;     -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;}
.added-class2 { color:#7d0000!important; transition-delay: 0.75s!important;     -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;}



	.shape2 {
		stroke-dasharray: 0 3600;
		stroke-dashoffset: 0;
		stroke-width: 16px;
		fill: transparent;
		stroke: #FFFFFF;
		transition-delay: 0.5s;
		-moz-transition-delay: 0.5s;
		-o-transition-delay: 0.5s;
		transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
		-o-transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
		-moz-transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
		-webkit-transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
		transition-timing-function: ease;

	  }
		  
	  .shape2.added-class {
		stroke-width: 16px;
		stroke-dashoffset: 0;
		stroke-dasharray: 3600;
	  }

/*-- Parallax --*/

.MainContainer {
	perspective: 1px;
	transform-style: preserve-3d;
	height: 100vh;
	overflow-x: hidden;
	overflow-y: scroll;
  }
  
.ParallaxContainer {
	display: flex;
	flex: 1 0 auto;
	position: relative;
	height: 100vh;
	transform: translateZ(-2px) scale(2);
	z-index: -1;
	background: url();
	background-color: rgb(250,228, 216);
  }
  
.ContentContainer {
	display: block;
	position: relative;
	background-color: white;
	z-index: 1;
  }




  .parallax {
    padding: 0em 0em;
    overflow-x: hidden;
    overflow-y: hidden; 
	position: relative;
	
  }


.home-logo {
	width: 60%;
    top: 50%;
    transform: perspective(1px) translateY(-50%) scale(1);
	position: relative;
	overflow: visible!important;
}  


#p-layer-01 {
    position: absolute;
    top: 0;
    width: 100vw; 
/*    height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
	overflow: visible;
}



#p-layer-01 img {
	
}

.psup-home-01 {
	display: block;
	border: 8px solid #ffffff;
	margin: 1em 0px 0px 1em;
	box-shadow: 0 0 20px 0px #ffffff61, inset 0 0 20px 0px #ffffff61;
}

.psup-home-02 {
	display: block;
	width: 130px;
	height:250px;
	border-right: 8px solid #dedede;
	margin: 1em 0px 0px 1em;
}

.psup-home-03 {
	display: block;
	width: 52vw;
	height:50vh;
	background-color: #dedede;
	margin: 1em 0px 0px 1em;
	position: absolute;
	top: 0vh;
	right: 15vw;
}

.psup-home-04 {
	display: block;
    width: 450px;
    height: 330px;
	border: 8px solid #ffffff;
	border-left: 0px solid #999999;
    margin: 1em 0px 0px 1em;
}





.psup-home-05 {
	display: block;
	width: 33.3%;
	height:250px;
	border-right: 8px solid #202020;
	margin: 0;
	position: relative;
	padding: 0;
}

.psup-home-06 {
	display: block;
	width: 33.3%;
	height: 250px;
	border-left: 8px solid #202020;
	margin: 0;
	float: right;
}

.psup-home-07 {
	display: block;
	width: 387px;
    height: 702px;
	border: 8px solid #999999;
	margin: 1em 0px 0px 1em;
	position: absolute;
	top: 0vh;
	left: 2vw;
}

.psup-home-08 {
	display: block;
    width: 450px;
    height: 330px;
	border: 8px solid #ffffff;
	border-left: 0px solid #999999;
    margin: 1em 0px 0px 1em;
}


#p-layer-02 {
    position: absolute;
 /*   width: 100vw;  */
/*	height: 100%;*/
    z-index: 1;
    opacity: 1;
    left: 0px;
	top: 0vh;
	overflow: visible;
}
#p-layer-03 {
    position: absolute;
    width: 100vw; 
/*	height: 95%; */
    z-index: -1;
    opacity: 1;
    right: 0px;
	top: -40vh;
	overflow: visible;
}

.page-template-page-home #p-layer-03 {
    position: absolute;
    width: 90vw; 
/*	height: 95%; */
    z-index: -1;
    opacity: 1;
    right: 0px;
	top: -40vh;
	overflow: visible;
}

#overallBg {
       position: absolute;
       top: 10%;
       width: 100%;
       z-index: 0;
	   opacity: 1;
	   text-align: right;
	   color: #111111;
}

#overallBg h1 {
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 16em;
}


#p-layer-04 {
    position: absolute;
	top: -65vh;
    width: 100vw; 
/*    height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
	overflow: visible;
}

#p-layer-05 {
	position: absolute;
	bottom: 30%;
	width: 100%;
	z-index: 1;
	opacity: 1;
	text-align: right;
	color: #dedede;
}
#p-layer-05 h1 {
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 16em;
	margin-bottom: 0em!important;
}
#p-layer-06 {
    position: absolute;
    top: 0;
    width: 100vw; 
/*    height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
	overflow: visible;
}

#p-layer-07 {
    position: absolute;
    width: 100vw;  
/*	height: 100%;*/
    z-index: 1;
    opacity: 1;
    right: 0px;
	top: 0vh;
	overflow: visible;
}
#p-layer-08 {
	position: absolute;
	top: 0%;
	width: 100%;
	z-index: 0;
	opacity: 1;
	text-align: right;
	color: #111111;
}


#p-layer-08 h1 {
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 16em;
}

#p-layer-09 {
    position: absolute;
	top: 12%;
    width: 100%; 
/*    height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
	overflow: visible;
}
#p-layer-10 {
    position: absolute;
    top: 12%;
    width: 100%; 
/*    height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
	overflow: visible;
}
#p-layer-11 {
	position: absolute;
	bottom: 10%;
	width: 100%;
	z-index: 1;
	opacity: 1;
	text-align: right;
	color: #dedede;
}
#p-layer-11 h1 {
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 16em;
}





#p-layer-12 {
    position: absolute;
    width: 100vw;  
/*	height: 100%;*/
    z-index: 2;
    opacity: 1;
    right: 0px;
	top: -20vh;
	overflow: visible;
}
#p-layer-13 {
	position: absolute;
	top: -20vh;
	width: 100%;
	z-index: 1;
	opacity: 1;
	text-align: left;
	
}


#p-layer-14 h1 {
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 16em;
	color: #111111;
}

#p-layer-14 {
    position: absolute;
    bottom: 48vh;
    width: 100vw; 
/*    height: 100vw; */
    z-index: 0;
    opacity: 1;
    right: 0px;
	overflow: visible;
	text-align: right;
}

.home-section-4 .col-lg-4 { margin-top: 10px; margin-bottom: 10px; }

.home-6b div:nth-of-type(1) { animation-delay: 0s; }
.home-6b div:nth-of-type(2) { animation-delay: 0.5s; }
.home-6b div:nth-of-type(3) { animation-delay: 1.0s; }
.home-6b div:nth-of-type(4) { animation-delay: 1.5s; }
.home-6b div:nth-of-type(5) { animation-delay: 2.0s; }
.home-6b div:nth-of-type(6) { animation-delay: 2.5s; }

.home-6b p { margin-bottom: 0px!important; }
.home-6b h4 { margin-bottom: 0.5em!important; }

.hb6 {
	background-color: #202020;
	color: #FFFFFF;
    height: 100%;
	padding: 25px;
	opacity: 1!important;
}



.services-list #p-layer-04 {
    position: absolute;
    top: 0;
    width: 100vw; 
/*    height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
	overflow: visible;
}

.services-list #p-layer-05 {
    position: absolute;
	top: -25vh;
    width: 100%; 
/*    height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
	overflow: visible;
}

.services-list #p-layer-06 {
    position: absolute;
    top: -85vh;
    width: 100vw;
    /* height: 100vw; */
    z-index: 2;
    opacity: 1;
    right: 0px;
    overflow: visible;
}

.service-links a { color: #FFFFFF; padding-left: 0px; display: block;
    margin-top: 10px;
    border: 3px solid #FFF;
    padding: 10px;
	background-color: #000;
	text-align: center;
 }

.service-links a:hover { color: #999999; }

.service-links span {
	position: relative;
    cursor: pointer;
}

.service-links span:before, .service-links span:after {
    content: '';
    position: absolute;
    width: 0%;
    height: 2px;
    top: 100%;
    margin-top: -0.5px;
    background: #fff;
}

.service-links span:after {
    right: 2.5px;
    background: #fff;
    transition: width 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.service-links span:hover:before {
    background: #fff;
    width: 100%;
    transition: width 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.service-links span:hover:after {
    background: transparent;
    width: 100%;
    transition: 0s;
}


a.links { color: #FFFFFF; padding-left: 0px; display: block;
    margin-top: 10px;
    border-bottom:none!important;
    padding: 0px;
	background-color: transparent;
	text-align: left;
	display: initial;
 }

a.links:hover { color: #999999; border: none; }

.links span {
	position: relative;
    cursor: pointer;
}

.links span:before, .links span:after {
    content: '';
    position: absolute;
    width: 0%;
    height: 2px;
    top: 100%;
    margin-top: -0.5px;
    background: #fff;
}

.links span:after {
    right: 2.5px;
    background: #fff;
    transition: width 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.links span:hover:before {
    background: #fff;
    width: 100%;
    transition: width 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.links span:hover:after {
    background: transparent;
    width: 100%;
    transition: 0s;
}


.services-list a { 
	color: #FFFFFF;
	text-decoration: none;
	border-bottom: 2px solid #FFFFFF;
	font-weight: normal;
}
.services-list a:hover {
	color: #999999;
	border-bottom: 2px solid #999999;
}

.services-list a.no-smoothState {
	font-size: 1.25em;
	display: block;
    border-bottom: 0px;
	border-top: 1px solid #313131; 
	padding-top: 10px;
}
/*-- Parallex End --*/


.reveal-holder {
    position: relative;
    display: inline-block;
	overflow: hidden;
	height: 100%;
  }

  .reveal-holder img {
	opacity: 0;
  }
  
  .reveal-block {
    position: absolute;
    top: 0;
    width: 100%;
    height: 101%;
    background: white;
  }
  .reveal-block::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  /*  background: lightgray; */
    transition-property: transform;
    transition-duration: 0.5s;
  }

  .reveal-block-bl {
    position: absolute;
    top: 0;
    width: 100%;
    height: 101%;
    background: #000000;
  }
  .reveal-block-bl::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  /*  background: lightgray; */
    transition-property: transform;
    transition-duration: 0.5s;
  }




  [data-aos="reveal-up"] {
    transform: translateY(50px);
    transform-origin: 100% 0%;
    max-height: 0px;
    transition: all 0.65s ease-in-out!important;
    transition-property: transform;
    transition-delay: 0.25s!important;
  }
  
  [data-aos="reveal-up"].aos-animate {
    transform: translateY(0px); 
   max-height: 100%;
   transition: all 0.65s ease-in-out!important;
   transition-delay: 0.75s!important;
  }


  [data-aos="reveal-up-l"] {
    transform: translateY(0px);
    transform-origin: 100% 0%;
    max-height: 0px;
	transition-duration:0.65s;
	transition-property: all;
	transition-timing-function:ease-in-out;
 /*   transition-delay: 0.25s!important;*/
  }
  
  [data-aos="reveal-up-l"].aos-animate {
    transform: translateY(0px); 
   max-height: 100%;
   transition-duration:0.65s;
   transition-property: all;
   transition-timing-function:ease-in-out;
 /*  transition-delay: 0.75s!important; */
  }


[data-aos="reveal-right"] {
    transform: scaleX(1);
    transform-origin: 100% 0%;
    transition-property: transform;
    transition-delay: 0.5s;
  }
  
  [data-aos="reveal-right"].aos-animate {
    transform: scaleX(0);
  }


  [data-aos="reveal-down"] {
    transform: translateY(-100px);
    transform-origin: 100% 0%;
    max-height: 0px;
    transition: all 0.65s ease-in-out!important;
    transition-property: transform;
    transition-delay: 0.25s!important;
  }
  
  [data-aos="reveal-down"].aos-animate {
    transform: translateY(0px); 
   max-height: 100%;
   transition: all 0.65s ease-out!important;
   transition-delay: 0.75s!important;
  }
  


  [data-aos="reveal-left"] {
    transform: translateY(0px);
    transform-origin: 100% 0%;
    max-width: 0px;
    transition: all 0.45s ease-out!important;
    transition-property: transform;
    transition-delay: 0.65s!important;
  }
  
  [data-aos="reveal-left"].aos-animate {
    transform: translateY(0px); 
   max-width: 100%;
   transition: all 0.45s ease-out!important;
   transition-delay: .65s!important;
  }


  [data-aos="fade"] {
    transform: translateY(0px);
    transform-origin: 100% 0%;
	transition-duration:0.65s;
	transition-property: all;
	transition-timing-function:ease-in-out;
  }
  
  [data-aos="fade"].aos-animate {
	transform: translateY(0px); 
	transition-duration:0.65s;
	transition-property: all;
	transition-timing-function:ease-in-out;
  }


  [data-aos="stroke"] > svg > rect {
	stroke-dasharray: 0 3600;
	stroke-dashoffset: 0;
	stroke-width: 16px;
	fill: transparent;
	stroke: #FFFFFF;
	transition-delay: 0.7s;
	-moz-transition-delay: 0.7s;
	-o-transition-delay: 0.7s;
	transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
	-o-transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
	-moz-transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
	-webkit-transition: stroke-width 3s, stroke-dashoffset 3s, stroke-dasharray 3s;
	transition-timing-function: ease;
  }

  [data-aos="stroke"].aos-animate > svg > rect {
	stroke-width: 16px;
    stroke-dashoffset: 0;
	stroke-dasharray: 3600;
	transition-delay: 1.2s;
	-moz-transition-delay: 1.2s;
	-o-transition-delay: 1.2s;
  }


.page-template-page-growlers footer { margin-top:600px;  }

.footer .social { text-align:center; height:50px; margin-top:40px; margin-bottom:40px;}
.footer .social a { border-radius: 50%; background-color: #FFF; color: #96A1AA; font-size: 2em; margin: 10px 10px; height: 50px; width: 50px; display: inline-block; line-height: 35px;}
.footer .social a:hover { color:#FFF; background-color: #566C7C; }


.social-light { text-align:center; height:20px; margin-top:0px; margin-bottom:0px; position: absolute; right: 35px; top: 16px;}
.social-light img { height: 16px; width: auto; }


@media all and (max-width: 1450px) { 
	.hb6 { padding: 15px; }
}

@media all and (max-width: 1080px) { 
	.header .social { text-align:center; height:50px; margin-top:20px; margin-bottom:0px; margin-right: 70px;}
	.header  .social img { margin-bottom: 10px; }
	.hb6 { padding: 0px 25px 25px 25px; }
	.hb6 h4 { margin-bottom: 5px!important; }
	.home-6b div:nth-of-type(1) {
		padding-top:1em;
	}
	.home-section-4 .col-lg-4 {  margin:0px; }
}

@media all and (max-width: 768px) { 
	.hb6 { padding: 0px 25px; }
	.hb6.last { padding-bottom: 25px; }
}

@media all and (max-width: 767px) { 
	.header { display: none; }
	.page-template-page-home #overallBg h1 { font-size: 4em!important; word-break: break-all; }
	.page-template-page-home #p-layer-08 h1 { font-size: 4em!important; }
	.page-template-page-home #p-layer-14 { bottom: 5em; height: 100vh; }
	.page-template-page-home #p-layer-14 h1 { font-size: 4em!important; }
	.page-template-page-home #p-layer-03 { width: 100vw; right: 5px;}
	.page-template-page-home .psup-home-02 { width: 0px; }
	.page-template-page-home #p-layer-04 { top: -95vh; width: 100vw;}
	.page-template-page-home .psup-home-03 {right: -1vw; width: 92vw; height: 60vh;}
}





/*------------------------------------*\



    $HEADER



\*------------------------------------*/

.top { padding: 0; }

.top-bar { background-color: #f9b418; text-align: center; padding: 12px 0px; color: #FFFFFF; font-size: 1.35em; margin-bottom: 4em; text-transform: uppercase; }
.top-bar .fas, .top-bar .fab { margin-right:10px; }
.top-bar .social a { color: #FFFFFF; font-weight: normal!important;}
.top-bar .social a:hover { color: #bf4b30; }

/*------------------------------------*\


	$TOUCH NAV
	Only displayed on touch devices


\*------------------------------------*/


#menu-menu-col-1, #menu-menu-col-2, #menu-menu-col-3 {
	margin-bottom: 0px;
}


.nav>li>a {
	padding: 0px 0px!important;
	margin: 0px 0px 0px 30px;
	line-height: 45px;
}

a.target-burger {
	position: absolute;
    right: 20px;
    top: 40px;
    overflow: hidden;
    width: 120px;
    color: #FFFFFF;
	text-indent: -60px;
	z-index: 9999;
	height: 40px;
}

a.target-burger:hover {
	color: #374454!important;
	text-decoration: none;
}

a.target-burger.toggled {
    width: 120px;
    text-indent: 0px;
}
a.target-burger.toggled .bun, a.target-burger.toggled .pattie {
	background-color: #FFFFFF!important;
}

.home a.target-burger {
	color:#2a2a2c!important;
}


.main-nav {
    width: 100%;
    position: fixed;
    height: 0%;
	z-index: -1;
	background-color: #000000;
/*    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);*/
    -webkit-transition: all 0.5s ease 0.5s;
    -moz-transition: all 0.5s ease 0.5s;
    -o-transition: all 0.5s ease 0.5s;
    transition: all 0.5s ease 0.5s;
}

.main-nav.toggled {
	height: 100%;
    display: block;
    background-color: #000000;
    z-index: 999;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
/*    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);*/
    position: fixed;
}


.main-nav a {
	font-size: 4em;
	color: #FFFFFF;
	
}
.main-nav a:hover {
	color: #999999;
	text-decoration: none;
	padding-left: 5px;
}

.sub-menu a {
	font-size: 1em;
}

.sub-menu .sub-menu {
	margin-left: 20px;
}
.nav-contents {
	margin-top: -50px;
	opacity: 0;
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;

}
.toggled .nav-contents {
	margin-top: 0px;
	opacity: 1;
	-webkit-transition: all 0.5s ease 0.5s;
    -moz-transition: all 0.5s ease 0.5s;
    -o-transition: all 0.5s ease 0.5s;
    transition: all 0.5s ease 0.5s;

}


.nav-touch-top {
	padding: 1em 1.25em; 
	position: relative;
}

.nav-touch-search { width: 75%; }

.nav-touch-close { 
	position: absolute;
	top: 50%;
	right: 5px;
	width: 24px;
	height: 24px;
	margin-top: -12px;
}

.nav-touch {
	width: 100%;
	display: block;
	font-size: 0.938em;
}

.nav-touch a {
	display: block;
	width: 100%;
	background-color: #fff;
	color: #808080;
	border-top: 1px solid #eee;
	font-weight: normal;
	text-transform: none;
	padding: 0.625em 1em;
}

.nav-touch ul { display: none; }

.nav-touch a:hover ul { display: block; }

.nav-touch ul a { padding: 0.625em 2em; }

.nav-touch ul ul a { padding: 0.625em 3em; }

.nav-touch a:hover { text-decoration: none; }

.nav-touch .current-menu-item > a {
	text-decoration: none;
	color: #fff;
	background-color: #bcd24c;
}

.contact h2 {
	margin-top: 10px;
}

@media all and (max-width: 1450px) {
	.main-nav a { font-size: 3em; }
	#map { height: 90vh; }
}

@media only screen and (max-width: 767px) {
	.logo {
		height: 55px;
	}

	a.target-burger {
		right: 10px;
		width: 60px;
		font-size: 0.9em;
		text-indent: -50px;
		top: 35px;
	}
	a.target-burger.toggled {
		right: 10px;
		width: 60px;
	}

	.main-nav {
		padding: 0px 20px;
	}

	.main-nav a {
		font-size: 2em;
	}

	.sub-menu a {
		font-size: 0.75em;
	}
	.sub-menu .sub-menu {
	/*	height: 0px;
		overflow: hidden; */
	}
	button.acc-btn {
		position: relative;
		right: 20px;
	}

	
}
/*------------------------------------*\



    $FULL SIZE NAV



\*------------------------------------*/



/*------------------------------------*\



    $BANNER



\*------------------------------------*/

.carousel-control {  position: absolute; top: 49%; padding: 10px; background-color: #FFFFFF; }

.carousel-control i { font-size: 24px; line-height: 32px; }

a.carousel-control {  }

a.carousel-control :hover { color: #bcd24c; }

.carousel-item img { width: 100%; height: auto;}
.carousel-indicators { margin-left: 15%!important; }

.carousel .left { left:0px; }
.carousel .right { right:0px; }

.carousel-indicators li { height: 5px!important; }

.carousel-caption { bottom: 38%!important; left: 10%!important; right: 10%!important;}

.carousel-caption h1 { font-size: 3em; }
.carousel-caption p { font-size: 1.25em; }

.carousel-item .left-text { background-color: #000000c2; display: inline-table; padding: 40px; text-align: left; }
.carousel-item .right-text { background-color: #000000c2; display: inline-table; padding: 40px; text-align: left; left: auto; }

.feature-banner {
	width: 100%;
	position: relative;
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	margin-bottom:50px;
}

.banner {
    width: 100%;
	position: relative;
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	margin-bottom:0px;
}
.banner img {
	width: 100%;
/*	box-shadow: inset 40px 40px 80px #000000;*/
}



.banner-content-beer .row, .banner-content-growler .row {
	height: 400px;
}

.breadcrumb-bar {
	background-color:#0b1423;
}
.banner-content {
	top: 50%;
    transform: perspective(1px) translateY(-50%);
	position: absolute;
	width: 100%;
	color: #FFFFFF;
	text-shadow: 1px 1px 1px #000000;
}

.banner .left { text-align: left; }
.banner .center { text-align: center; }
.banner .right { text-align: right; }


.banner-text hr { 
	margin: 1.5em auto!important; 
	border: solid #FFFFFF!important;
	border-width: 1px 0 0 0!important;
}

.home .breadcrumb-bar {
	display:none;
}


.owl-carousel .owl-item img {
	padding: 0px 5px!important;
}

.button-group {
	margin-top: 2em;
}

@media all and (min-width: 62em) { /* 980px */

	.banner { background-size: cover; }
	.banner-content { position: absolute; }	

}

@media all and (max-width: 62em) { /* 980px */
	.nav>li>a {
		padding: 10px 15px!important;	
	}
}

@media all and (max-width: 767px) {
	.carousel-indicators { display: none!important;}
	.carousel-control { background: transparent; top: 37%; }
	.banner-text { margin-top: 5em; }
}



/*------------------------------------*\



	$CONTENT BLOCKS



\*------------------------------------*/


.block-01 {
	color: #FFFFFF;
	background-color: #202020;
}



/*------------------------------------*\



    $CONTENT TABLES



\*------------------------------------*/


.content table { border-collapse: collapse; }

.content table th, .content table td {
	padding: 0.625em;
	border-bottom: 1px solid #ddd;
}

td, th {
	padding: 10px!important;
    border: 1px solid #dcdcdc!important;
}

/*------------------------------------*\



    $CONTENT LISTS



\*------------------------------------*/

.content ul, .content ol { margin-left: 1em; }
.content ul { list-style: disc; }
.content ol { list-style: decimal; }
.content li { margin-bottom: 0.05em; }
.content li > ul, .content li > ol { 
    margin-top: 0.625em; 
    margin-bottom: 0;
}

@media all and (min-width: 48em) { /* 700px */
	.content ul, .content ol { margin-left: 1.25em; } /* 42px */
}

/*------------------------------------*\



    $BLOCKQUOTE



\*------------------------------------*/

blockquote {
	position: relative;
	font-size: 1.125em;
	line-height: 1.618em;
	text-align: center;
	margin: 50px 0px!important;
	border: solid #bf4b30;
	border-width: 2px 0;
}

blockquote h3 {
	text-transform: uppercase;
	color: #bf4b30;
	font-weight: bold;
}

blockquote p:last-child { margin: 0 }

@media all and (min-width: 62em) { /* 980px */
	blockquote { padding: 1.5em 2em; }
}
@media all and (max-width: 768px) {
	blockquote h2 { font-size: 1.5em!important; }
}

/*------------------------------------*\



    $BLOG



\*------------------------------------*/



.post-divider {
    display: block;
    height: 1px;
    background: #a9a9a9;
    width: 50%; 
	margin: 3em auto;
}

.post-meta p {
	font-size: 0.875em;
	line-height: 1.4em;
}

.single-post .content {
	padding-top: 12em;
	padding-bottom: 3em;
}

.blog .content {
	padding-bottom: 3em;
}

.post-navigation {
	border-top: 2px solid #2e2e2f;
    padding: 20px 0px;
}
.post-navigation a {
	border-bottom: 0px;
}

.more-link {
	display: none;
}

.search .content {
	padding-top: 12em;
}

@media all and (max-width: 767px) { 
	.single-post .content { padding-top: 0em; }
	.post-navigation { font-size: 0.75em; }
}

/*------------------------------------*\



    $CONTENT IMAGES



\*------------------------------------*/


@media all and (max-width: 25.000em) { /* 400px */
	img.alignleft, img.alignright { 
		max-width: 50%;
		height: auto; 
	}
}

.alignright, a.alignright {
    float: right;
    margin: 0 0 1.618em 1.618em; /* 0 0 26px 26px */
}

.alignleft, a.alignleft {
    float: left;
    margin: 0 1.618em 1.618em 0; /* 0 26px 26px 0 */
}

.aligncenter, a .aligncenter {
    display: block;
    margin: 0 auto 1.618em auto; /* 0 auto 26px auto */
}

.alignnone, a .alignnone {
    display: block;
    margin-bottom: 1.618em; /* 26px */
}


/*------------------------------------*\



    $SIDEBAR



\*------------------------------------*/
.sidebar {

}
.contact-item {	
	background-color: #bf4b30;
	padding: 30px!important;
	font-size: 1.5em;
}

.sidebar h3 { color: #FFFFFF; border-top: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF; padding: 10px 0px; margin-top: 40px; margin-bottom: 20px; font-size: 0.958em;}
.sidebar h3:nth-child(1) { margin-top: 0; }
.sidebar p { color: #FFFFFF; font-size: 0.667em; }
.sidebar p:nth-last-child(1) { margin-bottom: 0;}

.sidebar-heading { 
	font-size: 1.25em;
	line-height: 1.3em;
	margin-bottom: 0.5em;
}

.sidebar .ui-list {
	margin-left: 0px!important;
	list-style: none!important;
}

@media all and (max-width: 768px) {

	.sidebar {
		margin-top:2em;
	}	

}

/*------------------------------------*\



    $UI LIST



\*------------------------------------*/

.ui-list {
    list-style: none;
    border-top: 1px solid #ddd;
	margin: 0;
}

.ui-list li { border-bottom: 1px solid #ddd; }

.ui-list a {
    display: block;
    padding: 0.625em 0.313em;
	line-height: 1.4em;
	font-weight: normal;
}
.ui-list a:hover, .ui-list .current_page_item a { text-decoration: none; }

/*------------------------------------*\



    $SEARCH



\*------------------------------------*/

.contact-forms_wrapper { display:block!important;}

.form-search { position: relative; } 

.form-search input.search-input { 
	width: 100%;
	margin: 0;
	padding: 0.15em;
	color: #666;
	border: none;
	background-color: #DCDCDC;
}

.form-search .search-submit {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 35px;
	border: none;
	margin: 0;
	background-color: #464646;
}

@media all and (min-width: 62em) { /* 980px */
	.sidebar .form-search .search-input, .content .form-search .search-input {
		border: solid #eee;
		border-width: 1px 0 1px 1px;
	}
}

/*------------------------------------*\



    $SIDEBAR - LEFT



\*------------------------------------*/

.sidebar-left { 
	padding: 0 1em; 
	margin-bottom: 1em;
	margin-top: 40px;
}

.sidebar-left .contact-detail {
    padding: 1em 0;
    border-bottom: 1px solid #ddd;
}

.sidebar-left h4 {
    font-size: 1em;
    line-height: 1em;
    font-weight: bold;
    text-transform: uppercase;
  	margin-bottom: 0.313em;
}

.sidebar-left .icon { vertical-align: top; }

.sidebar-left p, .sidebar-left table {
    font-size: 1em;
    line-height: 1.4em;
    margin: 0;
}

.sidebar-left p + p { margin: 10px 0 0 0 }

.sidebar-left .is-day, .sidebar-left .is-time { width: 50%; }

@media all and (min-width: 48em) and (max-width: 61.188em) { /* 700px - 979px */
	.sidebar-left table { width: 50%; }
}

@media all and (min-width: 62em) { /* 980px */

	.sidebar-left {
		float: left;
		width: 18.750em; /* 300px */
		padding: 0;
		margin-bottom: 1em;
	}

	.sidebar-left h4 { margin-bottom: 0.875em; }
}

/*------------------------------------*\



    $CONTACT PAGE



\*------------------------------------*/

@media all and (min-width: 48em) and (max-width: 61.188em) { /* 700px - 979px */

	.page-template-page-contact-php .main { padding: 1.5em 1.875em 2.5em 1.875em; }	


}


/*------------------------------------*\



    $FOOTER



\*------------------------------------*/
footer {
	background-color: #000000; 
	text-align: center;
	padding: 12px 0px;
    color: #FFFFFF;
	margin-top: 0px;
	font-size: 1.125em;
}

.footer {
	text-align: center;
	padding:5em 0em;
	margin:0em;
}

.footer-body {
	font-size: 0.813em;
	line-height: 1.4em;
	padding: 30px 0px;
}

.footer-body h1 {
	color: #FFFFFF;
}

.footer-body h2 {
	margin-top: 20px;
	color: #FFFFFF;
	font-size: 1.5em;
}

.footer-body hr {
	margin: 0.5em auto!important;
	width: 13%;
}

.footer p, .footer a { color: #FFF; padding: 8px 0px; }
.footer a { font-weight: normal; }
.footer a:hover { color: #E2DFDA;  }


ul.footer-nav { border-top: 1px solid #353535; }
.footer-nav li { text-align: left; border-bottom: 1px solid #353535;}

.footer-nav a {line-height: 24px;}

.footer-body .social { margin: 3em 0em; padding-top:0px; padding-bottom: 0px; height: auto;}
.social P { margin-bottom: 0px;}
.social img { height: 35px; width: auto; padding: 0px 2px; }
.social img:hover { opacity: 0.7; }

.footer .email { font-size: 1em; border: 0px; padding: 8px 8px 8px 8px; float: left; width: -webkit-calc(100% - 180px); width: -moz-calc(100% - 180px); width: calc(100% - 180px); }
.footer .button { float: left; }

.footer-map { /*height: 60vh;*/ overflow: hidden; background-color: #202020; color: #FFFFFF; position: relative; }
.footer-map iframe { height: 60vh; }

.footer-line { height: 8px; top: -60px; }

@media all and (max-width: 1450px) {
	.footer-line { height: 8px; top: -20px; }
	.article-head { font-size: 9em;  }
}

@media all and (max-width: 1024px) {
	.article-head { font-size: 6em; margin-top: 80px; }
}

@media all and (max-width: 767px) {
	footer p { font-size: 0.7em; }
	.article-head { margin-top:2em; }
}
/*------------------------------------*\



    3. $MODULE



\*------------------------------------*/ 

.pagination {
	position:fixed;
	right:20px;
	top: 50%;
  transform: translateY(-50%);

	font-size:1.4em;
	z-index: 10;
}
.pagination a {
	display:block;
	height:20px;
	margin-bottom:5px;
	color:white;
	position:relative;
	padding:4px;
}
.pagination a.active:after {
	box-shadow:inset 0 0 0 5px;
}
.pagination a .hover-text {
	position:absolute;
	right:15px;
	top:7px;
	opacity:0;
	-webkit-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
	padding-right: 15px;
}
.pagination a:hover .hover-text {
	opacity: 1;
}
.pagination a:after {
	-webkit-transition:box-shadow 0.5s ease;
	transition:box-shadow 0.5s ease;
	width:10px;
	height:10px;
	display: block;
	border:1px solid;
	border-radius:50%;
	content:'';
	position: absolute;
	margin:auto;
	top:0;
	right:4px;
	bottom:0;
}



/*------------------------------------*\



    $NAV



\*------------------------------------*/ 

.nav {
	display: inline-block!important;
}

ul.nav, .nav ul { 
    margin: 0;
	padding: 0;
/*	float: right; */
}

.nav a { display: block; font-weight: normal!important;  text-transform: uppercase;}

ul.nav-stacked li { float: none; }

@media only screen and (max-width: 1199px) {
	ul.nav-stacked li { display: block; width: 100%; }
	.nav>li>a { margin: 0px 0px 0px 0px; padding: 10px 15px!important; text-shadow:none; }
}

/*------------------------------------*\



    $HELPER



\*------------------------------------*/


.cf:before, .cf:after, .main:before, .main:after, .content:before, .content:after, .nav-primary:before, .nav-primary:after, .container:before, .container:after, .top:before, .top:after, .navigation:before, .navigation:after {
    content: '';
    display: table;
}

.cf:after, .main:after, .content:after, .nav-primary:after, .container:after, .top:after, .navigation:after { clear: both; }
.cf, .main, .content, .nav-primary, .container, .top, .navigation { *zoom: 1; }

/*------------------------------------*\



    $ICONS



\*------------------------------------*/

.icon {
    display: inline-block;
    zoom: 1;
    *display: inline;
    vertical-align: middle;
    width: 16px;
    height: 16px;
    background: url(images/sprite.png) 0 0 no-repeat;   
}

.icon-m {
	width: 24px;
	height: 24px;
}

.icon-l {
	width: 32px;
	height: 32px;
}

.icon-xl {
	width: 64px;
	height: 64px;
}

/*------------------------------------*\



    $ROW 1



\*------------------------------------*/

.icon-phone { background-position: 0 0; }
.icon-fax { background-position: -100px 0; }
.icon-email { background-position: -200px 0; }
.icon-address { background-position: -300px 0; }
.icon-hours { background-position: -400px 0; }
.icon-payment { background-position: -500px 0; }

/*------------------------------------*\



    $ROW 2



\*------------------------------------*/

.icon-info { background-position: 0 -100px; }
.icon-file { background-position: -100px -100px; }
.icon-search { background-position: -200px -100px; }
.icon-cross { background-position: -300px -100px; background-size: 600px 800px!important;}
.icon-tick { background-position: -400px -100px; }
.icon-user { background-position: -500px -100px; }

/*------------------------------------*\



    $ROW 3



\*------------------------------------*/

.icon-arrow-left { background-position: 0 -200px; }
.icon-arrow-right { background-position: -100px -200px; }
.icon-arrow-down { background-position: -200px -200px; }
.icon-arrow-up { background-position: -300px -200px; }

/*------------------------------------*\



    $RETINA ICONS



\*------------------------------------*/

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
	.icon, .nav-touch-toggle, .flex-direction-nav a, ul.list-ticked li:before, ul.child-pages a:before, ul.list-pages a:before,.form-search .search-submit:before, .list-accordion-title a:before  {
		background-image: url(images/sprite@2x.png);			
		background-size: 1200px 1600px;
	}
}

/*------------------------------------*\



    $ICON LIST



\*------------------------------------*/

.list-icon { font-size: 0; }
.list-icon li { margin-left: 10px; }
.list-icon li:first-child { margin-left: 0; }

/*------------------------------------*\



    $CALL NOW



\*------------------------------------*/


.call-now {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 999;
}
.call-now a { 
	display: block;
	text-align: center;
	margin-bottom: 0;
	font-size: 1.125em;
}

/*------------------------------------*\

    $SIDR
	Slide out sidebar for touch devices

\*------------------------------------*/


.sidr {
    display: none;
    position: absolute;
    position: fixed;
    top: 0;
    height: 100%;
    z-index: 999999;
    width: 280px;
    overflow-x: hidden;
    overflow-y: auto;
	background-color: #FFFFFF;
	padding-bottom: 2em;
}
.sidr.right {
    left: auto;
    right: -280px;
}


/*------------------------------------*\



    $NEWSLETTER SUBSCRIPTION



\*------------------------------------*/

.form-subscribe input { 
	margin-bottom: 0.313em; /* 5px */
	width: 100%;
	font-size: 1em;
	line-height: 1em;
}
.form-subscribe input[type="text"] { padding: 0.5em; }
.form-subscribe input[type="submit"] { padding: 0.75em; }


/*------------------------------------*\



    $BREADCRUMBS



\*------------------------------------*/

.nav-breadcrumb {
	font-size: 0.875em;
	line-height: 1em;
	margin: 0.6em 0em;	
	color:#FFF;
	text-transform:uppercase;
}

.nav-breadcrumb a {
	color:#FFFFFF;
}

/*------------------------------------*\



    4. $STATE



\*------------------------------------*/


.is-invisible {
       -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
           filter: alpha(opacity=0);
     -moz-opacity: 0;
   -khtml-opacity: 0;
          opacity: 0;
}

.no-transition {
	-webkit-transition: none;
       -moz-transition: none;
        -ms-transition: none;
         -o-transition: none;
            transition: none;
}

.spinner {
	height: 60px;
	width: 60px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -30px;
	margin-left: -30px;
	-webkit-animation: rotation 1s infinite linear;
	   -moz-animation: rotation 1s infinite linear;
	     -o-animation: rotation 1s infinite linear;
	        animation: rotation 1s infinite linear;
	border-left: 6px solid rgba(0,0,0,.15);
	border-right: 6px solid rgba(0,0,0,.15);
	border-bottom: 6px solid rgba(0,0,0,.15);
	border-top: 6px solid rgba(0,0,0,.8);
	border-radius: 100%;
}


@-webkit-keyframes rotation {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(359deg); }
}


@-moz-keyframes rotation {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(359deg); }
}

@-o-keyframes rotation {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(359deg); }
}

@keyframes rotation {
	from { transform: rotate(0deg); }
	to { transform: rotate(359deg); }
}

#gl {
	width: 100vw;
	height: 100vh;
	left: 0;
	top: 0;
	position: absolute;
}

.frame {
	padding: 3rem 5vw;
	text-align: center;
	position: relative;
	z-index: 1000;
	height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.frame > * {
	position: relative;
}

/*------------------------------------*\



    $COLOURS



\*------------------------------------*/

::selection {
    background: #001c3d;
    color: #fff;
    text-shadow: none;
}

/*------------------------------------*\



    $BACKGROUNDS



\*------------------------------------*/



/* Brand primary and secondary background colours */

.content-heading {  }

.content { overflow: hidden;  }

.page-template-default .content { }

.home-feature { background-color: #E2DFDA; text-align: center; }
.home-feature h1 { font-size: 1.75rem; }

.about-content { overflow: hidden; background-color: #000000; color: #FFFFFF; }
.about-content h2, .about-content p { color: #FFFFFF; }
.about-image { height: 420px; }

.about-content #p-layer-01 { text-align: right; top: 8em; }
.about-content #p-layer-02 { width: 100%; top: 0vh; }
.about-content .svg-shape-01, .about-content .svg-shape-01 .shape2 { top: 14em;  left: unset; right: -20px; width: 460px; height: 370px; }

.about-content #overallBg {top: unset; bottom: -5em; text-align: left; }

.services-content { overflow: hidden; background-color: #000000; color: #FFFFFF; position: relative; z-index: 9999; }
.services-image { height: 390px; }

.services-content #p-layer-01 { top: 12em; right: 2em; }
.services-content #p-layer-02 { width: 100%; top: 0vh; }
.services-content .svg-shape-01, .services-content .svg-shape-01 .shape2 { top: 14em; width: 490px; height: 390px; }
.services-content #overallBg {top: unset; bottom: -5em; text-align: right; }

.team-content, .contact-content { padding-top: 8em; overflow: hidden; background-color: #000000; color: #FFFFFF; }
.single-team-content { padding-top: 8em; overflow: hidden; background-color: #202020; color: #FFFFFF; }

.services-list { background-color: #202020; color: #ffffff; padding: 0 0; overflow: visible; min-height: 100vh;}

.services-list .container { position: relative; z-index: 5;}
.services-list .parallax { overflow-x: visible; overflow-y: visible; }
.service-h-100 { display: flex; height: 100vh; }
.services-padding { padding: 7em 0em 0em 0em; }
/* .services-list .row { position: relative; top: 50%; transform: translateY(-50%); } */

.to-top-ar { position:fixed; font-size: 2em; bottom:1em; right:20px; z-index:9; width: 120px; text-align: center; }
.to-top-ar a { color: #FFFFFF; background-color:transparent; border: 0px; padding:0px; }
.to-top-ar a:hover { color: #555555; }


.subheading { transform: rotate(270deg); white-space: nowrap; transform-origin: right top; position: absolute; right: 70%; text-transform: uppercase; }
.heading-right .subheading { transform: rotate(90deg); white-space: nowrap; transform-origin: left top; position: absolute; left: 70%; text-transform: uppercase; }


.team-outer { border: 8px solid #ffffff00; display: block; position: relative; padding: 0em 2em; -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out; }
.team-outer.stroke-effect { border: 8px solid #ffffff; -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out; }
.team-outer.team-sl { padding: 0em 1.5em; }
.team-outer.team-sl .reveal-holder { top: 2em; }
.team-outer .reveal-holder { height: 100%; top: 2em;  -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out; }
.team-outer .reveal-block { background-size: cover; }
.team-outer .reveal-holder:hover { border-radius: 50%;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out; }

.team-outer img { position: relative; bottom: -2em; z-index: -999; }
.team-member-content { overflow-x: hidden; color: #FFFFFF; margin-top: 3em; }
.team-social { display: block; z-index: 99; width: 100%; height: 0px; position: relative; text-align:center; }
.team-social a { color: #000000; }
.team-social a:hover { color: #999999!important; }
.team-social span { background-color: #FFF; padding: 10px; color: #000000; }
.team-social i { padding: 0px 5px; }
.team-name { color: #FFFFFF; margin-top: 1.250em; margin-bottom: 0px!important; }
.team-title { color: #FFFFFF; margin-bottom: 2em!important; }

.blog #p-layer-01 { z-index: -1; }

.fa-times {
	color: #FFF;
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 2em;
    cursor: pointer;
}

.partner-content { background-color: #202020; padding-top: 4em; padding-bottom: 4em; overflow: hidden; }

.team-desc { background-color: #FFFFFF; color: #000000; padding-top: 1em; margin-top: -1em; }

.team-desc a:hover { color: #a6a7a9; }

.team-link img { 	
	-webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out; }

.team-link:hover img { border-radius: 50%; 	
	-webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out; }

.content-image {height: 100vh;}

.flex-content { overflow: hidden; }

.primary {background-color: #FFF; padding:5em 0em; color: #303030;}

.secondary {background-color: #374454; padding:5em 0em; color: #FFFFFF;}

.tertiary {background-color: #96A1AA; padding:5em 0em;  color: #303030;}

.quaternary { background-color: #e0dfda; padding:5em 0em; color: #303030; }

.quinary { background-color: #566C7C; padding:5em 0em; color: #FFFFFF; }

.tertiary p, .tertiary ul, .tertiary h1, .tertiary h2, .tertiary h3, .tertiary h4 { color: #FFFFFF; }

.feature-block img { -webkit-border-radius: 50%; border-radius: 50%; }

.offset-columns .col-sm-4 { text-align: center; }

.contentbreak { height: 70vh; background-repeat: no-repeat; background-size: cover;  width:100%; background-position: center; /* box-shadow: inset 0px 0px 70px #000000; -webkit-box-shadow: inset 0px 0px 70px #000000; -moz-box-shadow: inset 0px 0px 70px #000000;*/}

.contentbreakhalf { height: 50vh; background-repeat: no-repeat; background-size: cover;  width:100%; background-position: center; /* box-shadow: inset 0px 0px 70px #000000; -webkit-box-shadow: inset 0px 0px 70px #000000; -moz-box-shadow: inset 0px 0px 70px #000000; */}

.contentbreakhalf .block { height: 50vh; }

/* #paraimage { display: none; } */

.contentquote {background-repeat: no-repeat; background-size: cover;  width: 100%; background-attachment: fixed; background-position: center; padding:0px; text-align: center; color: #FFFFFF; }

.contentquote span { color: #fbb017; }

.contentquote .button { margin-top: 1.5em; }

.overlay { padding: 200px 0px; background-color: rgba(0, 0, 0, 0.75); color: #FFF; text-align: center; }

.contentquote2 {background-repeat: no-repeat; background-size: cover;  width: 100%; background-attachment: fixed; background-position: center; padding:0px; text-align: center; color: #FFFFFF; }

.contentquote2 span { color: #fbb017; }

.contentquote2 .contentbox { background-color: #fffffff0; padding: 30px; color: #000000; }

.contentquote2 .contentbox hr { border: solid #fbb017!important; margin: 1.5em auto!important; border-width: 2px 0 0 0!important; }

.contentquote2 .overlay { padding: 80px 0px; background: none;}

.contentquote2 h3 { font-size: 2em; font-family: mrs-eaves-roman-lining,sans-serif!important; font-weight: 400!important; }

.fws-bg { height: 50vh; background-size: cover; background-position: center; }

.fws-bgfh { height: 100vh; background-size: cover; background-position: center; }

.full-width-split { padding: 0px!important; margin: 0px 0px; text-align: center;}

.bg-dark {
	background-image: url('/standard-responsive/images/textured-bg.jpg');
	background-size: cover;
	background-position: top;
}

.full-height {
	height: 100vh; 
	height: calc(var(--vh, 1vh) * 100);
	z-index: 5; position: relative;
}

.full-min-height {
	min-height: 100vh; 
	min-height: calc(var(--vh, 1vh) * 100);
	z-index: 5; position: relative;
}
.half-height { height: 50vh; }

.flex-3-column {  }

.flex-3-column .col-sm-4 { min-height: 380px; background-size: cover; }
.flex-3-column .f3c-content { text-align: center;  top: 50%; transform: perspective(1px) translateY(-50%); position: relative; padding: 2em 2em 1em 2em;}
.flex-3-column .f3c-content a { border-bottom: 2px solid #FFF; text-decoration: none;}
.flex-3-column .f3c-content a:hover {  border-bottom: 2px solid #FFFFFF; text-decoration: none; opacity: 0.5;}

.primary .f3c-content a { color: #303030; border-bottom: 2px solid #303030; text-decoration: none;}
.primary .f3c-content a:hover { color: #303030; border-bottom: 2px solid #303030; text-decoration: none; opacity: 0.5;}

.secondary .f3c-content a { color: #FFF; border-bottom: 2px solid #FFF; text-decoration: none;}
.secondary .f3c-content a:hover { color: #FFF; border-bottom: 2px solid #FFF; text-decoration: none; opacity: 0.5;}

.tertiary .f3c-content a { color: #FFF; border-bottom: 2px solid #FFF; text-decoration: none;}
.tertiary .f3c-content a:hover { color: #FFF; border-bottom: 2px solid #FFF; text-decoration: none; opacity: 0.5;}

.quaternary .f3c-content a { color: #303030; border-bottom: 2px solid #303030; text-decoration: none;}
.quaternary .f3c-content a:hover { color: #303030; border-bottom: 2px solid #303030; text-decoration: none; opacity: 0.5;}


.primary a { color: #303030;  }
.primary a:hover { color: #777777; }

.secondary a { color: #FFFFFF; font-weight: bold; text-decoration: underline; }
.secondary a:hover { color: #777777;}

.tertiary a { color: #FFFFFF; font-weight: bold; text-decoration: underline; }
.tertiary a:hover { color: #999999; }

.quaternary a { color: #FFFFFF; font-weight: bold; text-decoration: underline; }
.quaternary a:hover { color: #999999; }

.quinary a { color: #FFFFFF; font-weight: bold; text-decoration: underline; }
.quinary a:hover { color: #000000;}



.primary a.button { color: #FFFFFF; background-color: #fbb017; text-shadow: 2px 2px #df9705; text-transform: uppercase; line-height: 2em;}
.primary a.button:hover { color: #FFFFFF; background-color: #fbcc6c; }

.secondary a.button { color: #FFFFFF; background-color: #fbb017; text-shadow: 2px 2px #df9705; text-transform: uppercase; line-height: 2em;}
.secondary a.button:hover { color: #FFFFFF; background-color: #fbcc6c; }

.tertiary a.button { color: #a92631; background-color: #ffffff; text-transform: uppercase; line-height: 2em;}
.tertiary a.button:hover { color: #a92631; background-color: #ffcacf; }

.quaternary a.button { color: #e8ac39; background-color: #ffffff; text-transform: uppercase; line-height: 2em;}
.quaternary a.button:hover { color: #e8ac39; background-color: #ffe6b6; }

.quinary a.button { color: #000000; background-color: #ffffff; text-transform: uppercase; line-height: 2em;}
.quinary a.button:hover { color: #000000; background-color: #d2d2d2; }


.contentquote a.button { color: #FFFFFF; background-color: #fbb017; text-shadow: 2px 2px #df9705; }
.contentquote a.button:hover { color: #FFFFFF; background-color: #fbc048; }

.feature-boxes { background-color: #000000; position: relative; overflow: hidden; height: 230px; margin: 30px 0px; padding: 0px 5%; text-align: center; }
.feature-boxes h2 { color: #FFF; line-height: 1.1em; top: 50%; transform: perspective(1px) translateY(-50%); position: relative; z-index: 9999; text-shadow: 1px 2px 1px #000000;}
.fboxes a { text-decoration: none;}
.fboxes a:hover { text-decoration: none;}

.grid { width:100%; }
.grid-item { width: 31%; display: block; margin: 30px 10px; }



.p-container { color: #000000; text-align: center; background-size: 120%;  background-position: center; background-image: url('/wp-content/themes/standard-responsive/images/beer-bg.jpg'); }
.p-container .p-overlay { background-color: #00000000; display: block; width: 100%; height: 100%; position: absolute; }

.p-container h2 { font-size: 1em; width: 100%; position: absolute; text-align: center; }
.p-container h3 { position: absolute; bottom: 10px; right: -3px; background-color: #7d0000; color: #FFFFFF; font-size: 1em; padding: 5px; }
.p-container img { position: relative; padding: 30px; }

.grid a > .grid-item > .p-container > .p-overlay, .grid a > .grid-item > .p-container, .grid a > .grid-item > .p-container h2, .grid a > .grid-item > .p-container img {
	-webkit-transition: all .75s ease-out;
    -moz-transition: all .75s ease-out;
    -ms-transition: all .75s ease-out;
    -o-transition: all .75s ease-out;
    transition: all .75s ease-out;
}

.grid a:hover > .grid-item > .p-container > .p-overlay, .grid a:hover > .grid-item > .p-container, .grid a:hover > .grid-item > .p-container h2, .grid a:hover > .grid-item > .p-container img {
	-webkit-transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -ms-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
    transition: all .5s ease-out;
}

.grid a:hover > .grid-item > .p-container > .p-overlay {
	background-color:#000000c4;
}

.grid a:hover > .grid-item > .p-container {
	background-size: 130%;
}

.grid a:hover > .grid-item > .p-container img {
	padding: 5px;
}


.btn-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: .25s ease;
    white-space: nowrap;
    opacity: 1;
    zoom: 0.75;
}
.feature-boxes:hover .btn-overlay {
    width: 100%;
    opacity: 1;
    overflow: hidden;
    transform: scale(1.25);
    -moz-transform: scale(1.25);
    -webkit-transform: scale(1.25);
    -o-transform: scale(1.25);
    -ms-transform: scale(1.25); /* IE 9 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
 filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand'); /* IE6 and 7 */
}

.block {
	width: 100%;
	height: 70vh;
	position: relative;
	overflow: hidden;
	font-size: 16px;
  }
  .block h2 {
	position: relative;
	display: block;
	text-align: center;
	margin: 0;
	top: 50%;
	transform: translateY(-50%);
	font-size: 7vw;
	color: white;
	font-weight: 400;
	text-shadow: 1px 1px 7px #000000;
  }
  .img-parallax {
	width: 100vmax;
	z-index: -1;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%,0);
	pointer-events: none
  }

.left { float: left }
.right { float: right }
.text-center { text-align: center; }
.text-right { text-align: right; }
.no-mt { margin-top: 0px!important; }
.no-mb { margin-bottom: 0px!important; }
.no-margin { margin: 0px!important; }
.no-pt { padding-top: 0px!important; }
.no-pb { padding-bottom: 0px!important; }
.no-padding { padding: 0px!important; }
.pb { padding: 100px 0px; }
.mb { margin: 100px 0px; }
.bordered { border-top:1px solid #e8e8e8; border-bottom:1px solid #e8e8e8; }
.border-top { border-top:1px solid #e8e8e8; }
.border-bottom { border-bottom:1px solid #e8e8e8; }
.bg-white { background-color: #FFFFFF; }

.svg-shape-01, .svg-shape-01 .shape2 { width: 480px; height: 340px; position: absolute; left: -20px; }
.svg-shape-02, .svg-shape-02 .shape2 { width: 480px; height: 360px; }
.svg-shape-03, .svg-shape-03 .shape2 { width: 400px; height: 580px; }

.tilted { height:300px; top: 0px; left: 90px; bottom:calc(100% - 150px); width: 8px;}
.tilted-r { height:300px; top: 0px; left: 60px; bottom:calc(100% - 150px); width: 8px;}

.subtle-fade { opacity: 0;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	 -ms-transition: all .25s ease-out;
	  -o-transition: all .25s ease-out;
		 transition: all .25s ease-out; }
.subtle-fade.sb-effect { opacity: 1;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	 -ms-transition: all .25s ease-out;
	  -o-transition: all .25s ease-out;
		 transition: all .25s ease-out; }

.home-image { width: 450px; }		 

@media only screen and (max-width: 1480px) {
	.fws-bg { height: 65vh; }
	.home-image { width: 300px; }
	.svg-shape-01, .svg-shape-01 .shape2 { width: 340px; height: 220px; }
	.svg-shape-02, .svg-shape-02 .shape2 { width: 340px; height: 245px; }
	.svg-shape-03, .svg-shape-03 .shape2 { width: 340px; height: 440px; }

	.psup-home-05 { width: 33.3%; }
	.psup-home-06 { width: 33.3%; }
	#p-layer-13 { top: -25vh; }

	.subheading { font-size: 1.5em; }

	.about-image { height: 350px; }
	.about-content .svg-shape-01, .about-content .svg-shape-01 .shape2 { width: 390px; height: 340px; }

	.services-image { height: 310px; }
	.services-content .svg-shape-01, .services-content .svg-shape-01 .shape2 { width: 390px; height: 320px; }

	.tilted { left: 130px; }
	.tilted-r {  }
	.subheading { right: 44%; }
}

@media only screen and (max-width: 1024px) {
	.home-image { width: 230px; }
	.svg-shape-01, .svg-shape-01 .shape2 { width: 260px; height: 180px; }
	.svg-shape-02, .svg-shape-02 .shape2 { width: 260px; height: 195px; }
	.svg-shape-03, .svg-shape-03 .shape2 { width: 260px; height: 300px; }
	#p-layer-01 { top: 40px; right: 10px;}
	#p-layer-07 { right: 10px; }
	.tilted-r { left: 30px; }
	.services-padding { padding: 7em 0em; }
}


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

	.contentbreak { height: 25vh; }
	.contentbreak .block { height: 25vh; }

	.contentbreakhalf { height: 20vh; }
	.contentbreakhalf .block { height: 20vh; }

	.pb { padding: 70px 0px; }
	.mb { margin: 70px 0px; }

	.grid-item { margin: 30px 5px; }

	.feature-boxes h2 { font-size: 1.5em; }

	blockquote h3 { font-size: 1.2em; line-height: 1.5em; margin-top: 0.5em; }

	.fws-bg { height: 60vh; }

	.tilted { left: 80px; }
	.tilted-r { left:20px; }
	
	.about-image { height: 310px; }
	.about-content .svg-shape-01, .about-content .svg-shape-01 .shape2 { width: 340px; height: 300px; }
	.about-content #p-layer-01 { top: 26vh; }

	.services-image { height: 300px; }

	.services-content .svg-shape-01, .services-content .svg-shape-01 .shape2 { width: 380px; height: 300px; }

}

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

	h1 { font-size: 2.15rem!important; }
	h2 { font-size: 1.5rem!important; }
	h3 { font-size: 1.25rem!important; }

	.primary {padding:25px 0px;}
	.secondary {padding:25px 0px;}
	.tertiary {padding:25px 0px;}
	.quaternary {padding:25px 0px;}

	.full-width-split .fws-bg { order: 1; }
	.full-width-split .fws-con { order: 2; padding: 40px;}

	.primary a.button { margin-bottom: 2em; }
	.secondary a.button { margin-bottom: 2em; }
	.tertiary a.button { margin-bottom: 2em; }
	.quaternary a.button { margin-bottom: 2em; }

	.pb { padding: 50px 0px; }
	.mb { margin: 50px 0px; }

	.offset-columns .col-sm-4 { order: 1; padding-bottom: 20px; }
	.offset-columns .col-sm-8 { order: 2; }

	.team-content, .contact-content, .single-team-content {
		padding-top: 6em;
	}

	.instafeed-section h2 { font-size: 18px; }

	.carousel .container { padding-left: 0px!important; padding-right: 0px!important; }
	.carousel-caption { bottom: 10px!important; position: inherit!important; width: 100%; display: block;}
	.carousel-item { background-color: #2a2a2c; }

	.fws-bgfh { height: 50vh; }
	.feature-banner { height: 50vh; }
	.services-list .container { height: unset; }
	
	.services-list .row { top: unset; transform: none; }
	.service-h-100 { height: unset; }
	.services-padding { padding: 0em; }
	.services-list { min-height: unset; padding: 3em 0em; }

	.grid-item { width: 100%; }
	.filters-button-group button { margin-bottom: 5px; }

	.full-height { height: unset; }

	.page-template-page-home .full-height { height: auto; padding: 30px; min-height: 100vh; min-height: calc(var(--vh, 1vh) * 100);}
	.page-template-page-about-php .full-height { height: auto; padding: 30px; min-height: 100vh; min-height: calc(var(--vh, 1vh) * 100);}
	.page-template-page-services .full-height { height: auto; padding: 30px; min-height: 100vh; min-height: calc(var(--vh, 1vh) * 100); }

	
	.page-template-page-home #p-layer-01 { display: none; }
	.page-template-page-home #p-layer-02 { display: none; }
	.page-template-page-home #p-layer-06 { display: none; }
	.page-template-page-home #p-layer-07 { display: none; }
	.page-template-page-home #p-layer-12 { display: none; }
	.page-template-page-home #p-layer-13 { display: none; }

	.page-template-page-about-php #p-layer-01 { display: none; }
	.page-template-page-about-php #p-layer-02 { display: none; }

	.page-template-page-services #p-layer-01 { display: none; }
	.page-template-page-services #p-layer-02 { display: none; }

	.page-template-page-home .full-height-xs { 
		height: 100vh; height: calc(var(--vh, 1vh) * 100);
	}

	.to-top-ar { width: 60px; }

	.top-title { margin-top: 1.5em; }
	.title-desc { margin-bottom: 2em!important; }

	.subheading { transform: rotate(0deg); white-space: normal; transform-origin: right top; position: relative; right: 0; text-transform: uppercase; }
	.heading-right .subheading { transform: rotate(0deg); white-space: normal; transform-origin: right top; position: relative; left: 0; text-transform: uppercase; }

	.heading-right .col-md-2 { order: 1; }
	.heading-right .col-md-10 { order: 2; }

	.page-template-page-contact .content { padding: 30px; }

}


main#box {
	position: relative;
    overflow: hidden;
    z-index: 0;
    width: 100%;
    height: 100vh;
    background-color: #000000;
}
.layer {
    position: absolute;
    display: block;
    width: 100%;
    height: 100vh;
}
.title-01 {
    background-image: url(images/title-bg.jpg);
    width: 120%;
    height: 110vh;
    background-repeat: no-repeat;
    margin-left: -10%;
    margin-top: -5%;
    background-size: cover;
}
.title-02 {
    background-image: url(images/aj-img-2.png);
    width: 120%;
    height: 115vh;
    background-repeat: no-repeat;
    margin-left: -5%;
    margin-top: -5%;
    background-size: contain;
}
.title-02a {
    background-image: url(images/aj-img.png);
    width: 120%;
    height: 115vh;
    background-repeat: no-repeat;
    margin-left: -5%;
    margin-top: -5%;
    background-size: contain;
}
.title-03 svg {
	width: 35%;
    height: auto;
    top: 45vh;
    right: 10%;
    position: absolute;
    z-index: 999;
    transition: 700ms all;
}

.title-03 svg:hover {transform: scale(1.15);}

.loading-overlay { z-index: 9999; background-color: #1694d6; }

.f-op {
	fill-opacity:0;
	-moz-animation:FillOp 3s ease-in-out 1s forwards;
	-webkit-animation:FillOp 3s ease-in-out 1s forwards;
	animation:FillOp 3s ease-in-out 1s forwards;
}

 .m-scene .scene_element {
	animation-duration: 0.75s;
	transition-timing-function: ease-in;
	animation-fill-mode: both;
}
  
  .m-scene .scene_element--fadein {
	animation-name: fadeIn;
}
  
  .m-scene.is-exiting .scene_element {
	animation-direction: alternate-reverse;
}
  
  .slide-in-blurred-bottom {
	-webkit-animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}

  /*
   * Keyframes
   */
  @keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
  }

  @keyframes scale {
	from {transform: scale(30);}
	to {transform: scale(1);}
  }

  @keyframes height100 {
	from {height: 0vh;}
	to {height: 100vh;}
  }


@-webkit-keyframes slide-in-blurred-bottom {
	0% {
	  -webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
			  transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
	  -webkit-transform-origin: 50% 100%;
			  transform-origin: 50% 100%;
	  -webkit-filter: blur(40px);
			  filter: blur(40px);
	  opacity: 0;
	}
	100% {
	  -webkit-transform: translateY(0) scaleY(1) scaleX(1);
			  transform: translateY(0) scaleY(1) scaleX(1);
	  -webkit-transform-origin: 50% 50%;
			  transform-origin: 50% 50%;
	  -webkit-filter: blur(0);
			  filter: blur(0);
	  opacity: 1;
	}
  }
  @keyframes slide-in-blurred-bottom {
	0% {
	  -webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
			  transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
	  -webkit-transform-origin: 50% 100%;
			  transform-origin: 50% 100%;
	  -webkit-filter: blur(40px);
			  filter: blur(40px);
	  opacity: 0;
	}
	100% {
	  -webkit-transform: translateY(0) scaleY(1) scaleX(1);
			  transform: translateY(0) scaleY(1) scaleX(1);
	  -webkit-transform-origin: 50% 50%;
			  transform-origin: 50% 50%;
	  -webkit-filter: blur(0);
			  filter: blur(0);
	  opacity: 1;
	}
  }
  

@-webkit-keyframes FillOp {

	0% {fill-opacity:0;}
	100% {fill-opacity:1;}
}
@-moz-keyframes FillOp {
	   0% {fill-opacity:0;}
		100%{fill-opacity:1;}
}




.letter-svg {
	margin: 0 auto;
	position: relative;
	display: block;
}

.letter-svg-3 path{
	stroke:#000000;
	fill:#FFFFFF;
	fill-opacity:0;
	stroke-width:1;
/*	stroke-dasharray: 2400;
	stroke-dashoffset:2400;
	-moz-animation:DASH3 3s ease-in-out 1s forwards;
	-webkit-animation:DASH3 3s ease-in-out 1s forwards;
	animation:DASH3 3s ease-in-out 1s forwards;*/
}

.contact-content .letter-svg-3 path {
	stroke:#FFFFFF;
	fill:#000000;
	fill-opacity:0;
	stroke-width:.2;

}


.letter-svg-3 .jlclzGXf_9 {
	stroke-dasharray:2559;stroke-dashoffset:3440; animation:DASH3 3000ms linear 2500ms forwards;
}
.letter-svg-3 .jlclzGXf_0 {
	stroke-dasharray:425 427;stroke-dashoffset:426; animation:DASH3 3000ms linear 2666ms forwards;
}
.letter-svg-3 .jlclzGXf_1 {
	stroke-dasharray:934 936;stroke-dashoffset:935; animation:DASH3 3000ms linear 2533ms forwards;
}
.letter-svg-3 .jlclzGXf_2 {
	stroke-dasharray:1114 1116;stroke-dashoffset:1115; animation:DASH3 3000ms linear 2399ms forwards;
}
.letter-svg-3 .jlclzGXf_3 {
	stroke-dasharray:2439 2441;stroke-dashoffset:2440; animation:DASH3 3000ms linear 2266ms forwards;
}
.letter-svg-3 .jlclzGXf_4 {
	stroke-dasharray:780 782;stroke-dashoffset:781; animation:DASH3 3000ms linear 2133ms forwards;
}
.letter-svg-3 .jlclzGXf_5 {
	stroke-dasharray:1067 1069;stroke-dashoffset:1068; animation:DASH3 3000ms linear 2000ms forwards;
}

@-webkit-keyframes DASH3{
	0%  {}
	   80%  {stroke-dashoffset:0;fill-opacity:0;}
	100%{stroke-dashoffset:0;fill-opacity:1;}
}
@-moz-keyframes DASH3{
	0%  {}
	   80%  {stroke-dashoffset:0;fill-opacity:0;}
	100%{stroke-dashoffset:0;fill-opacity:1;}
}


.glowfilter-anim {
	filter: drop-shadow( 0 0px 0px #FFFFFF );
	animation:GLOW3 1000ms linear 5000ms forwards;
	animation-delay: 5000ms;
}

@-webkit-keyframes GLOW3{
	0%  {}
	50%  {filter: drop-shadow( 0 0px 10px #FFFFFF );}
	100%{filter: drop-shadow( 0 0px 0px #FFFFFF );}
}
@-moz-keyframes GLOW3{
	0%  {}
	50%  {filter: drop-shadow( 0 0px 10px #FFFFFF );}
	100%{filter: drop-shadow( 0 0px 0px #FFFFFF );}
}

.reveal-opacity {
	/*transform: scale(1.2);*/
	opacity: 0;
	animation:REVEALOP 750ms ease-out 5500ms forwards;
	animation-delay: 5500ms;
}

@-webkit-keyframes REVEALOP{
	0%  { opacity: 0; /* transform: scale(1.2); */ }
	100%{ opacity: 1; /* transform: scale(1); */ }
}
@-moz-keyframes REVEALOP{
	0%  { opacity: 0; /*transform: scale(1.2); */ }
	100%{ opacity: 1; /*transform: scale(1); */ }
}