/*!
Theme Name: liquidify
Theme URI: http://underscores.me/
Author: Liquid Advertising
Author URI: http://liquidadvertising.com/
Description: Liquid Advertising Website
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: liquidify
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

liquidify is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
/* normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */


html.mobile body{
	height:100%;
	overflow:auto;
}

img{
	align-self:flex-start;
	width:auto;
}

.hide,
.disabled{
	display:none;
}

/* ==============================
ANIMATIONS
============================== */

@keyframes slide-in{
	0%{
		opacity:0;
		transform:perspective(400px) translateY(0%);
	}

	1%{
		opacity:0;
		transform:perspective(400px) translateY(40px);
	}


	100%{
		opacity:1 !important;
		transform:perspective(400px) translateY(0%);
		animation-timing-function: ease-out;
	}
}

/* ==============================
COLORS
============================== */
.gray{
	color:#5b5b5b;
}
.dark-gray{
	color:#6f6f6f;
}

.blue{
	color:#006df0;
}

.black{
	color:#000;
}

.white{
	color:#fff;
}

/* ==============================
BACKGROUNDS
============================== */
.bg-white{
	background:#fff !important;
}

.bg-gray{
	background:#f9f9f9 !important;
}

/* ==============================
FONTS
============================== */
div{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}

#case .link-font{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}
.hero-description-font{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}
.body-font{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}

.header-font{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	font-weight:800;
	letter-spacing:-0.01em;
}

.sans-font{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
}

.light{
	font-weight:100;
}

.semi-light{
	font-weight:400;
}

.bold{
	font-weight:600;
}

.boldExtra{
	font-weight:700;
}

/* ==============================
ALIGNMENT
============================== */
.center{
	text-align:center;
}

.left{
	text-align:left;
}

.right{
	text-align:right;
}

/* ==============================
LINE ROLL
============================== */

#case .line-roll small{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	font-size:1.1em;
	font-weight:700;
	letter-spacing:0em;
	vertical-align:middle;
}

#case .line-roll.right:before{
	content:none;
}

#case .line-roll.right:after{
	content:" ";
	display:inline-block;
	height:0;
	vertical-align:middle;
	width:20px;
}


#case .line-roll.bluegray small{
	color:#5b5b5b;
}

#case .line-roll.bluegray:before,
#case .line-roll.bluegray:after{
	border-top:1px solid #0066ff;
}


#case .line-roll.blueblack small{
	color:#000;
}

#case .line-roll.blueblack:before,
#case .line-roll.blueblack:after{
	border-top:1px solid #0066ff;
}


#case .line-roll.bluewhite small{
	color:#fff;
}

#case .line-roll.bluewhite:before,
#case .line-roll.bluewhite:after{
	border-top:1px solid #0066ff;
}


#case .line-roll.graywhite small{
	color:#5b5b5b;
}

#case .line-roll.graywhite:before,
#case .line-roll.graywhite:after{
	border-top:1px solid #fff;
}

#case .body-section .line-roll{
	font-weight:600;
}

#case .body-section .body-line-roll{
	margin-top:0.7em;
}

/* ============================== 
BUTTONLIST
============================== */

.buttonList{
	font-size:2em;
	text-align:left;
	width:75%;
}

.buttonList li{
	display:inline-block;
}

.buttonList a{
	position:relative;
	text-decoration:none;
}

.no-touchevents .buttonList a,
.no-touchevents .buttonList a:link,
.no-touchevents .buttonList a:visited,
.no-touchevents .buttonList a:focus{
	color:#9c9c9c;
}

.no-touchevents .buttonList a:hover,
.buttonList a.selected{
	color:#000 !important;
}

.no-touchevents .buttonList span:before{
	content:"";
	border-bottom:1px solid #000;
	bottom:0%;
	position:absolute;
	transform:scaleX(0);
	transform-origin:center left;
	transition:250ms transform;
	width:100%;
}

.no-touchevents .buttonList a:hover span:before,
.buttonList a.selected span:before{
	transform:scaleX(1);
}

/* ==============================
BODY
============================== */
html,body{
	margin:0;
	padding:0;
}

#case{
	background:#fff;
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	overflow:hidden;
}

ul{
	padding:0;
}

li{
	list-style:none;
	text-align:left;
}

h1{
	font-size:8em;
	font-weight:700;
	line-height:0.9em;
	text-align:left;
}

h2{
	font-size:1.3em;
	font-weight:600;
}

h3{
	font-size: 30px;
	font-weight:400;
}

h4{
	font-weight:300;
}

p{
	font-size:17px;
	margin-bottom:0;
}

.unbreakable{
	white-space:nowrap;
}

.row{
	margin:0;
}

#case .container-fluid.maxxed,
#case-next .container-fluid.maxxed,
#home .container-fluid.maxxed,
#work .container-fluid.maxxed,
#connect .container-fluid.maxxed,
#careers .container-fluid.maxxed{
	max-width:1440px;
	padding:0 15px;
	width:88vw;
}

.padding30{
	padding:0 30px;
}

/* ============================== 
PASSWORD PROTECTED
============================== */
.post-password-form{
	margin:10em auto;
	max-width:600px;
	width:calc(100% - 30px);
}

/* ==============================
PRELOADER
============================== */
.preloader{
	background:#fff;
	height:100vh;
	opacity:1;
	position:fixed;
	top:0;
	transform:translateY(0%);
	transition: 500ms transform;
	width:100vw;
	z-index:1000;
}

.preloader.preloader-out{
	transform:translateY(calc( -100% - 10vw) ) !important;
}

.preloader-wave{
	position:absolute;
	bottom:0;
	transform:translateY(calc( 100% - 1px) ) rotate(180deg);
	width:100%;
}

.preloader-wave path{
	fill:#fff;
}

/* ==============================
LOAD OUT
============================== */
.loadOut{
	background:#fff;
	height:100vh;
	position:fixed;
	top:0;
	transform:translateY(175%);
	transition: 200ms transform;
	width:100vw;
	z-index:1000;
}

.loadOut.leave{
	transform:translateY(0%);
}

.loadOut-wave{
	transform:translateY(-100%);
	width:100%;
}
/* ==============================
OVERRIDES
============================== */
.entry-header{
	display:none;
}

@media (min-width: 1200px){
	.col-xl-6 {
		width:49%;
	}
}


/* ==============================
SITE CONTENT
============================== */
body.active .site-content{
	opacity:1;
}

.site-content{
	opacity:0;
	overflow-x:hidden;
}

.site-content .arrow-right svg{
	display:block;
	transform:scale(0.75) translateY(2px);
	transform-origin:0% 100%;
	transition:250ms transform;
}

.site-content .arrow-right svg.light .ring{
	fill:#fff;
}

.site-content .arrow-right svg .ring{
	fill:#2C2F33;
	transform-origin:50% 50%;
	transition:500ms fill, 500ms transform;
}

.no-touchevents .site-content .arrow-right:hover svg .ring{
	fill:#757575;
	transform:scale(0);
}

.site-content .arrow-right svg .ring-fill{
	opacity:0.2;
	transform-origin:50% 50%;
	transform:translateY(0px) scale(1);
	transition:100ms fill, 100ms transform;
}

.no-touchevents .site-content .arrow-right:hover svg .ring-fill{
	transform:translateY(-0.5px) scale(0);
}

.site-content .arrow-right svg .arrow{
	transform-origin:50% 50%;
	transition:250ms fill, 250ms transform;
}

.no-touchevents .site-content .arrow-right:hover svg .arrow{
	fill:#989898;
	transform:scale(1.5);
}

.site-content .cta{
	display:inline-block;
	position: relative;
}

.site-content .cta p{
	display:inline;
}

.site-content .cta h3{
	display:inline;
}

.site-content .cta:link,
.site-content .cta:visited,
.site-content .cta:hover,
.site-content .cta:focus{
	text-decoration:none;
}


/* ==============================
HERO
============================== */
.site-content .hero{
	background:black;
	height:100vh;
	max-height:800px;
	overflow:hidden;
	position:relative;
	width:100%;
}

.site-content .svg.downer{
	bottom:8em;
	left:50%;
	position:absolute;
	transform:translateX(-50%) rotate(90deg);
}

.site-content .hero-block .mobile-background{
	display:none;
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
}

.mobile .site-content .hero-block .mobile-background.zoom,
.site-content .hero-block .background.zoom{
	transform:scale(1.1);
	transition:15000ms transform;
}

.site-content .hero-block video{
	left:50%;
	position:absolute;
	top:50%;
	transform:translateX(-50%) translateY(-50%);
}

.site-content .hero .hero-carousel{
	height:100%;
}

.site-content .hero .hero-carousel.single .slick-track{
	transform:none !important;
}

.site-content .hero .row{
	height:100%;
	width:100%;
}

.site-content .hero .hero-carousel .row .background{
	height:100%;
	left:0;
	overflow:hidden;
	position:absolute;
	top:0;
	width:100%;
	transition:2000ms transform;
}


.site-content .hero .darken{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.4+1,0+100 */
	background: -moz-linear-gradient(left,  rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.4) 1%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.4) 1%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.4) 1%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */

	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:50%;
}

.site-content .hero .hero-carousel .row .background.zoom{
	transform:scale(1.2);
	transition:10000ms transform;
}

.site-content .hero .hero-carousel .row .background video{
	position:absolute;
	left:50%;
	top:50%;
	transform:translateX(-50%) translateY(-50%) scale(1.01);
}

.site-content .hero .hero-carousel .cta{
	opacity:0;
	perspective:2000px;
	transform:rotateX(89deg);
	/*transition:500ms transform;*/
}

.site-content .hero .hero-carousel h1,
.site-content .hero.hero-block h1{
	opacity:0;
	perspective:5000px;
	transform:rotateX(45deg);
	transform-origin:50% 25%;
	transition:500ms transform, 500ms opacity;
}

.site-content.display .hero .hero-carousel h1,
.site-content.display .hero.hero-block h1{
	display:block;
}

.site-content.display .hero .hero-carousel .cta{
	display:inline-block;
}

.site-content.display.in .hero .hero-carousel h1,
.site-content.display.in .hero.hero-block h1{
	max-width:100%;
	opacity:1;
	transform:rotateX(0deg);
	width:500px;
}

.site-content .hero .hero-carousel .delayed .cta,
.site-content .hero .hero-carousel .delayed h1{
	/*transform:rotateX(90deg) !important;*/
}

.site-content .hero .hero-carousel .slick-current h1{
	/*transform:rotateX(0deg);
	transition:500ms transform 500ms;*/
}

.site-content.display .hero.hero-block h1.project{
	font-size:5em;
}

.site-content.display.in .hero .hero-carousel .slick-current .cta{
	max-width:100%;
	opacity:1;
	transform:rotateX(0deg);
	transition:500ms transform 500ms, 500ms opacity 500ms;
	width:430px;
}

.site-content .hero .row .container{
	display:flex;
	/*max-width:1920px;*/
	width:100%;
}


.site-content .hero .row .content{
	align-self:center;
	color:#fff;
	margin:0 auto;
	text-align:left;
	width:100%;
}

.site-content .hero .row .content.maxxed{
	max-width:1440px;
	padding:0 15px;
	width:88vw;
}

.site-content .hero .row .content h1{
	margin-bottom:0.25em;
	max-width: calc(100% - 134px);
}

.site-content .hero .row .content .cta{

	margin:0 auto 0;
}

.site-content .hero .row .content .cta:link,
.site-content .hero .row .content .cta:visited,
.site-content .hero .row .content .cta:focus{
	color:#fff;

}

.site-content .hero .headline-img{
	display:block;
	margin-bottom:24px;
    transform: scale(0.8);
    transform-origin: 0 0;
}

.site-content .wave-canvas{
	bottom:0;
	height:20%;
	position:absolute;
	width:100%;
}

/* ==============================
HERO CAROUSEL
============================== */
.hero-carousel .slide{
	height:100%;
	/*position:absolute;*/
	width:100%;
}

.hero-carousel .slick-list{
	height:100%;
	padding:0 !important;
	width:100%;
}

.hero-carousel .slick-track{
	height:100%;
}


/* ==============================
BODY SECTION
============================== */

.site-content .body-section{
	background:#ffffff;
	overflow:hidden;
	padding:5em 0 0;
}

.body-section.line-row.button-link {
	padding:0 0 2em 0;
}

section.body-section.text.fourofour  {
    padding-bottom: 0;
    padding-top: 4em;
	font-size: 163%;

}

section.body-section.text.fourofour h1 {
	font-size: 3em;
}

.site-content .body-section.last{
	padding-bottom:0;
}

.site-content .body-section.text.hero-block{
	background:black;
	display:flex;
	min-height:510px;
	height:50vh;
	overflow:hidden;
	padding-bottom:0;
	padding-top:0;
	position: relative;
	width:100%;
}

#case.site-content.media-case .body-section.hero-block .line-roll small{
	font-size:1.4em;
}

.site-content .body-section.text.hero-block .container-fluid{
	align-self:center;
	/*flex:0 0 100%;*/
}

.site-content .body-section .content{
	padding:0;
}

.site-content .body-section .content .col-sm-6,
.site-content .body-section .content .col-xl-6{
	display:inline-block;
	vertical-align:top;
}

.site-content .body-section h3{
	line-height: 1.5em;
	width:100%;
}

.site-content .body-section h4.heavy{
	font-weight:600;
}

.post-template-single-media .site-content .body-section p{
	margin-top:1.5em;
}

.site-content .body-section .client p.summary-text{
	padding-right:2.5em;
}

.site-content .body-section p.summary-text{
	margin-top:0.4em;
}

.site-content .body-section .task-body h3{
	margin-bottom: 0.7em;
}

.site-content .body-section .cta{
	display:inline-block;
	position:relative;
}

.site-content .body-section .content .cta:link,
.site-content .body-section .content .cta:visited,
.site-content .body-section .content .cta:focus{
	color:#000;
}

/* ==============================
BODY SECTION TEXT
============================== */
.site-content  .body-section.text{
	padding-bottom:0;
	padding-top:13em;
}

.site-content .body-section.text .cta:before{
	border-bottom:2px solid #006df0;
	opacity:1;
}

.no-touchevents .site-content .body-section.text .cta:hover:before{
	transform:scaleX(1);
}

.site-content .body-section.text h2{
	margin-top:2em;
}

/* ==============================
VIDEOPLAYER
============================== */
.site-content .body-section.videoplayer{
	margin-top:8em;
	padding:0;
	position:relative;
}

.site-content .body-section.videoplayer .container-fluid{
	position: relative
}

.site-content .body-section.videoplayer video{
	width:100%;
	height:auto;
}

.video-play-btn{
	cursor:pointer;
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
}

.video-play-btn img{
	left:50%;
	position:absolute;
	top:50%;
	transform:translateX(-50%) translateY(-50%);
	width:100px;
}

.no-touchevents .video-play-btn:hover img{
	opacity:0.5;
}


/* ==============================
GALLERY (GENERAL)
============================== */
.site-content .body-section.gallery{
	margin-bottom:2em;
}

.site-content .body-section.gallery .container-fluid{
	padding-left:34px;
	padding-right:34px;
}

.site-content .body-section.gallery .full-width{
	margin-top:34px;
}

.site-content .body-section.gallery .item{
	opacity:0;
	overflow:hidden;
	/*transform:translateY(0%);*/
	/*perspective:18000px;*/
}

.mobile .site-content .body-section.gallery .item{
	opacity:1;
}

.site-content .body-section.gallery .left .item{
	transform-origin:100% 0%;
}

.site-content .body-section.gallery .right .item{
	transform-origin:0% 0%;
}

.site-content .body-section.gallery .item.in{
	opacity:1;

	animation:slide-in 500ms;

	transform:perspective(400px) translateY(0%);
}

.site-content .body-section.gallery .item.inSafari{
	opacity:1;

	transform:perspective(400px) translateY(0%);
	animation:none;
}

.site-content .body-section.gallery .item:before{
	content:"";
	height:230px;
	left:0;
	position:absolute;
	top:0;
	width:100%;
	z-index:1;
	background: rgba(0, 0, 0, 0.5); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0, 0, 0, 0.5)', endColorstr='rgba(0, 0, 0, 0)',GradientType=0 ); /* IE6-9 */
}

.site-content .body-section.gallery .item .bg{
	left:0;
	height:100%;
	position:absolute;
	top:0;
	transform-origin:center;
	transition:500ms transform;
	width:100%;
}

.no-touchevents .site-content .body-section.gallery .item:hover .bg{
	transform:scale(1.02);
	transition:500ms transform;
}

.site-content .body-section.gallery .content-top{
	left:34px;
	position: absolute;
	text-align:left;
	top:34px;
	width:calc(100% - 68px);
	z-index:30;
}

.site-content .body-section.gallery .content-top.dark h2{
	color:#fff;
}

.site-content .body-section.gallery .content-top.dark h3{
	color:#fff;
}

.site-content .body-section.gallery .content-top h2{
	font-size:1.3em;
	font-weight:300;
	margin-bottom:0;
}

.site-content .body-section.gallery .content-top h3{
	font-size:2.5em;
	letter-spacing:-0.03em;
	line-height:1em;
	margin-top:-0.2em;
	width:100%;
	-webkit-font-smoothing:antialiased;
}

.site-content .body-section.gallery .content-bottom{
	bottom:35px;
	/*display:inline-block;*/
	display:none;
	position:absolute;
	right:55px;
}

.site-content .body-section.gallery .content-bottom .arrow-right{
	margin-top:0;
}

.site-content .body-section.gallery .content-bottom .arrow-right:before{
	border-bottom:1px solid #000;
}

.site-content .body-section.gallery .content-bottom.dark .arrow-right{
	color:#fff;
}

.site-content .body-section.gallery .content-bottom.dark .arrow-right:before{
	border-bottom:1px solid #fff;
}

.no-touchevents .body-section.gallery .item:hover .cta:before{
	opacity:1;
	transform:scaleX(1);
}

.site-content .body-section.gallery .content-bottom .arrow-right svg{
	transform: scale(0.75) translateX(7px) translateY(2px);
}

.no-touchevents .body-section.gallery .item:hover .content-bottom .arrow-right svg{
	transform: scale(0.75) translateX(17px) translateY(2px);
}

.site-content .body-section.gallery .content-bottom .arrow-right path,
.site-content .body-section.gallery .link.arrow-right path{
	fill:#006df0;
}


.site-content .body-section.gallery .link{
	color:#000;
	display:block;
	margin: 5em 34px 0;
}

.no-touchevents .body-section.gallery .link:before{
	border-bottom:1px solid #000;
}

.gallery .item{
	opacity:1;
	transition:500ms opacity;
}

.gallery .item.hide{
	opacity:0;
}

.gallery .item.off{
	display:none;
}


/* ==============================
GALLERY (CONSISTENT HEIGHTS)
============================== */
.site-content .gallery .item.col-6{
	overflow:hidden;
	padding-left:0;
	padding-right:0;
	max-width:calc(50% - 10px);
}

.site-content .gallery .item.show.even{
	margin-left:20px;
}

.site-content .body-section.gallery .half-height{
	cursor:pointer;
	height:0;
	margin-bottom:20px;
	padding-top:25%;
}

/* ==============================
GRID GALLERY (VARYING HEIGHTS)
============================== */

.site-content .body-section.gallery.grid .item .bg.toHeight{
	height:100%;
	width:auto;
}

.site-content .body-section.gallery.grid .half-height{
	cursor:pointer;
	height:auto;
	padding-top:50%;
}

.site-content .body-section.gallery.grid .full-height{
	cursor:pointer;
	padding-top:110%;
}

.site-content .body-section.gallery.grid .col-sm-6{
	flex: 0 0 calc(50% - 10px);
}

.site-content .body-section.gallery.grid .left{
	padding:0;
}

.site-content .body-section.gallery.grid .right{
	margin-left:20px;
	padding:0;
}

.site-content .body-section.gallery.grid .bottom{
	margin-top:20px;
}

.site-content .body-section.gallery.grid .top{
	margin-bottom:0;
}

/* ==============================
CAROUSEL
============================== */
.site-content .body-section.carousel-gallery .container-fluid{
	padding:0;
}



.site-content .body-section.carousel-gallery .carousel-container{
	min-height:500px;
	width:110%;

}

.site-content .body-section.carousel-gallery .carousel{
	width:100%;
}

.site-content .body-section.carousel-gallery .carousel .card{
	margin-left:30px;
	opacity:1 !important;
}

.site-content .body-section.carousel-gallery .carousel .card .photo{
	width:100%;
}

/* ==============================
BULLET
============================== */
.site-content .body-section.bullet{
	padding-top:2em;
}
.site-content .body-section.bullet .highlight{
	height:6em;
	margin-bottom:4em;
	position: relative;
}

.site-content .body-section.bullet .highlight:after{
	border-bottom:1px solid #ececec;
	bottom:-2em;
	content:"";
	left:0;
	position:absolute;
	width:100%;
}

.site-content .body-section.bullet .highlight img{
	display:block;
	height:100%;
}

.site-content .body-section.bullet .highlight h1{
	font-size:7em;
	left:0%;
	position:absolute;
	text-align:left;
	bottom:-3px;
}

.site-content .body-section.bullet .sans-font{
	font-size:13px;
	font-weight:700;
	letter-spacing: 0em;
	text-align:left;
}


/* ==============================
CLIENTS
============================== */
.site-content .body-section.block{
	background:#fff;
}

.site-content .body-section.block .row{
	margin-top:1em;
}

.site-content .body-section.block .client-item{
	margin-bottom:2em;
	opacity:0;
	overflow:hidden;
	padding:2px;
	position:relative;
}

.site-content .body-section.block .client-item.blank{
	display:inline-block;
}

.mobile .site-content .body-section.block .client-item{
	opacity:1;
}

.site-content .body-section.block .client-item.in{
	opacity:1;
	transition:500ms opacity;
}

.site-content .body-section.block .client-item .default{
	align-self:center;
	transform:scale(0.8);
	width:100%;
}

.site-content .body-section.block .client-item .hover{
	left:2px;
	opacity:0;
	position:absolute;
	top:2px;
	transition: 300ms opacity;
	width:calc( 100% - 4px);
}

.no-touchevents .site-content .body-section.block .client-item:hover .hover{
	/*opacity:1;*/
}

/* ==============================
ACCORDIAN
============================== */
.site-content .body-section.accordian-content .accordian{
	position:relative;
	width:100%;
}

.site-content .body-section.accordian-content li{
	width:50%;
}

.site-content .body-section.accordian-content .text-link{
	display:inline-block;
    cursor:pointer;
    margin-bottom:0;
    position:relative;
    transition:300ms color;
    width: auto;
}

.no-touchevents .site-content .body-section.accordian-content .text-link:hover,
.site-content .body-section.accordian-content .text-link.selected,
.touchevents .site-content .body-section.accordian-content .text-link{
	color: #3e3e3e;
}

.site-content .body-section.accordian-content .accordian-item{
	font-weight:300;
	line-height:1.9em;
	opacity:0;
	position:absolute;
	right:0;
	top:0;
	transition:500ms opacity;
	width:48%;
}

.site-content .body-section.accordian-content .active .accordian-item{
	opacity:1;
}

.site-content .body-section.accordian-content .arrow-right .link-arrow{
	opacity:0;
	transform:translateY(-5%) translateX(0);
	transition:300ms opacity, 300ms transform;
}


.no-touchevents .site-content .body-section.accordian-content .text-link:hover svg,
.touchevents .site-content .body-section.accordian-content .text-link svg,
.site-content .body-section.accordian-content .text-link.selected .link-arrow{
	opacity:1;
	transform:translateY(-5%) translateX(10px);
}

.site-content .body-section.accordian-content .arrow-right .link-arrow path{
	fill:#006df0;
}

/* ============================== 
HALF HALF
============================== */
.body-section.halfhalf .content-container{
	height:100%;
	position: relative;
	width:100%;
}

.body-section.halfhalf .content-container.flex{
	align-items:center;
	display:flex;
	justify-content:center;
}

.body-section.halfhalf .halves-container{
	display: flex;
	flex-direction:column-reverse;
	margin-top:2em;
}

.body-section.halfhalf .content-container img{
	align-self:unset;
	width:calc(100% - 140px);
}

.body-section.halfhalf.Right .content-container img{
	width:calc(100% - 30px);
}

.body-section.halfhalf.Right .content-container.flex{
	justify-content:flex-start;
}


.body-section.halfhalf .halves-container .text,
.body-section.halfhalf .halves-container .image{
	flex:none;
}

.body-section.halfhalf .halves-container .image{
	margin:0 auto auto;
}

/* ==============================
IMG ONLY SECTION
============================== */
.site-content .body-section.img-bg{
	min-height:37vw;
}

/* ==============================
CASE PREVIEWS
============================== */
#case-nextprev h3{
	font-size:4em;
}

/* ==============================
VIDEOPLAYER (VIMEO)
============================== */
.site-content .videoplayer .video-container{
	padding-top:53%;
	width:100%;
}

.site-content .videoplayer .video-container iframe{
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;

}


/* ==============================
CASE PREVIEWS
============================== */
#case-next{
	background:#f4f4f4;
	margin-top:5em;
	padding:5em 0;
}

#case-next small{
	font-size:1.1em;
	font-weight: 700;
	letter-spacing:0;
}

#case-next h3{
	font-size:3em;
}

#case #case-next p{
	display: inline-block;
	vertical-align:middle;
}

#case-next a{
	cursor:pointer;
}

#case-next a:link,
#case-next a:visited{
	color:#000;
	display:inline-block;
}

.no-touchevents #case-next a:hover{
	text-decoration: none;
}

#case-next a .svg{
	display:inline-block;
	transform-origin: 50% 50%;
	vertical-align:middle;
}




/* ============================== 
CAREERS PAGE
============================== */
#careers{
    background:#e8e8e8;
}

#careers h1{
	color:black;
}

#careers h2{
	font-size:5em;
	font-weight:800;
	white-space:nowrap;
}

#careers h3{
	display:block;
	margin:0;
	font-size:2em;
}

#careers p{
	display:block;
	margin:0;
}

#careers .hero-block{
	background:url(../../uploads/2018/10/careers-img-3.jpg)no-repeat center;
	background-size:cover;
}

#careers .hero-block h1{
	color:#fff;
}

#careers .buttonList a, 
#careers .buttonList a:link, 
#careers .buttonList a:visited, 
#careers .buttonList a:focus{
	color:#fff;
}

#careers .buttonList a:hover, 
#careers .buttonList a.selected{
	color:#fff !important;
}

.no-touchevents #careers .buttonList span:before{
	bottom:-4px;
	border-bottom:1px solid #fff;
}


#careers #listing .content{
	margin:0 auto;
	max-width:1440px;
	min-height:calc(100vh - 300px);
	padding:6em 0;
	width:88vw;
}

#careers #listing .content .location{
	margin-top:2em;
	padding:0 15px;
}

#careers #listing .content .location:nth-child(1){
	margin-top:0;
}

#careers #listing .content .positions{
	margin-top:2em;
	padding:0 15px;
}

#careers #listing .content .positions:nth-child(2){
	margin-top:0;
}

#careers #listing .content .location h2,
#careers #listing .content .location h3{
	display:block;
	position: relative;
}

#careers #listing .content .location h3{
	font-weight:600;
}

#careers #listing .content .location .line{
	background:#000;
	display:none;
	height:1px;
	margin-bottom:2em;
	margin-top:2em;
	width:100%;
}

#careers #listing .job-item{
	color:black;
	cursor:pointer;
	display:block;
	margin:0.65em auto 5em;
	text-decoration: none;
}

#careers #listing .role-title{
	font-weight:600;
	margin-bottom:1em;
}

#careers #listing .excerpt-container{
	color:#8b8a8a;
}

#careers #listing .vertical-gap{
	height:2em;
}

#careers #listing .nopositions .role-excerpt{
	margin-top:0;
}

#careers #listing .excerpt-container .link-container{
	margin-top:2em;
	position: relative;
}

#careers #listing .excerpt-container .link-container p{
	display:inline-block;
	line-height:0.85em;
	margin-left:0;
	position:relative;
	transition:500ms margin-left;
	vertical-align:middle;
}

#careers #listing .job-item .excerpt-container .link-container p:before{
	background:#2953da;
	bottom:0;
	content:'';
	display:inline-block;
	height:1px;
	left:0;
	max-width:0px;
	position: absolute;
	transform:translateY(2px);
	transition:250ms max-width;
	vertical-align:middle;
	width:100%;

	-webkit-transition: max-width 250ms cubic-bezier(0.015, 1, 0.930, 1); /* older webkit */
	-webkit-transition: max-width 250ms cubic-bezier(0.015, 1.155, 0.930, 1.005); 
	-moz-transition: max-width 250ms cubic-bezier(0.015, 1.155, 0.930, 1.005); 
	-o-transition: max-width 250ms cubic-bezier(0.015, 1.155, 0.930, 1.005); 
	transition: max-width 250ms cubic-bezier(0.015, 1.155, 0.930, 1.005); /* custom */

}

.no-touchevents #careers #listing .job-item:hover .excerpt-container .link-container p:before{
	max-width:100%;
}

#careers #listing .excerpt-container .link-container p small{
	color:#2953da;
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	font-weight:600;
	font-size:0.6em;
	letter-spacing:0.3em;
}

#careers #listing .excerpt-container .link-container p small span{
	opacity:0;
}

.no-touchevents #careers #listing .job-item:hover .excerpt-container .link-container p small span{
	opacity:1;
	transition:100ms opacity 250ms;
}



/* ==============================
404
============================== */

.site-content .no-page {
    background: black;
    height: 8vh;
    max-height: 800px;
    overflow: hidden;
    position: relative;
    width: 100%;
}/* ==============================
SPECIFIC PAGES
============================== */
#case #stat{
	display:table;
	height:55vw;
	overflow:visible;
	padding:0;
	width:100%;
}

#stat .stat-content{
	display: table-cell;
	vertical-align:middle;
}

#stat .stat-content .stat-item{
	margin-bottom:5em;
}

#stat .stat-content .stat-item:last-child{
	margin-bottom:0;
}

#case.witcher .body-section.img-bg.last-img{
	margin-bottom:30px;
}

#case .body-section.bullet{
	padding-top:5em;
}

#case.one .body-section.img-bg{
	min-height:54vw;
}

.iframe-container{
	height:0;
	margin-bottom:15px;
	padding-bottom:56%;
	position:relative;
	width:100%;
}

.iframe-container iframe{
	height:100%;
	position:absolute;
	width:100%;
}

#case.lordaeron .body-section.bullet.three .highlight img{
	transform:translateY(-1px);
}


#case.lordaeron .body-section.last{
	margin-top:5em;
}




/* ==============================
HOME
============================== */

#home .block{
	padding-top:9em;
}

#home .hero h3{
	line-height:1.25em;
}

#home .body-section.text .content h3{
	margin-bottom:1em;
}

#home .hero .slick-dots{
	bottom:auto;
	height:auto;
	right:34px;
	top:calc( 50% - 5vw);
	width:60px;
}

#home .hero .slick-dots li{
	display:block;
	height:auto;
	margin:0;
	position:relative;
	width:100%;
}

#home .hero .slick-dots li button{
	float:right;
	height:auto;
	padding:5px 0;
	position:relative;
	transition:300ms width;
	width:80%;
}

#home .hero .slick-dots li button:before{
	background:#fff;
	content:"";
	height:3px;
	transition:300ms opacity;
	width:100%;
}

#home .hero .slick-dots li.slick-active button,
.no-touchevents #home .hero .slick-dots li:hover button{
	width:100%;
}

.not-touchevents #home .hero .slick-dots li:hover button:before{
	opacity:1;
}

#home .gallery.grid{
	padding:0;
}

#featured {
	margin-bottom: 60px;
}

/* ==============================
ABOUT PAGE
============================== */

#about .body-section .content h3{
	width:75%;
}

#about #about-carousel{
	background:#fff;
	overflow:visible;
	padding-bottom:0;
	padding-top:0;
}

#about #about-acccordian{
	background:#fff;
	overflow:visible;
	padding-bottom:13em;
}

#about #about-acccordian .content h3{
	line-height:1.75em;
	width:100%;
}

#about.site-content .arrow-right svg{
	display:inline-block;
}

#about #about-quote{
	background:#000;
	color:#fff;
	padding:15em 0;
	text-align:left;
}

#about #about-quote .arrows-container{
	display:block;
	margin-bottom:2em;
	margin-top:-2em;
	position:relative;
}

#about #about-quote .arrows-container .carousel-arrow{
	display:inline-block;
	position:relative;
}

#about #about-quote .arrows-container .carousel-arrow path{
	fill:#006df0;;
	transition:300ms fill;
}

.no-touchevents #about #about-quote .arrows-container .carousel-arrow:hover path{
	fill:#fff;
}

#about #about-quote .arrows-container .carousel-arrow#next-arrow{
	margin-left:2em;
}

#about #about-quote .text{
	font-size:3.5em;
	font-weight:300;
	width:75%;
}

#about #about-quote span{
	color: #2371ff;
}


/* ==============================
CONNECT
============================== */
#connect.site-content .arrow-right svg{
	display:inline-block;
	margin-left:10px;
	transform:none;
	vertical-align:middle;
	width:36px;
}

#connect.site-content .directions{
	vertical-align:middle;
}

#connect h1{
	color:#fff;
}

#connect .new-business{
	color:#fff;
	max-width:500px;
	text-align:left;
}

#connect .new-business h2{
	font-size:2em;
	font-weight:800;
}

#connect .hero-block{
	background:url(/wp-content/uploads/2019/01/connect-header.jpg)no-repeat center;
	background-size:cover;
}

#connect #location{
	background:#fff;
	overflow:visible;
	padding:0;
}

#connect #location ul{
	width:100%;
}

#connect #location li{
	background:#f5f5f5;
	display:inline-block;
	margin-bottom:15px;
	margin-left:15px;
	padding:2em 3em;
	transform:translateY(-50px);
	width:calc(33% - 7.5px);
}

#connect #location li:nth-child(1){
	margin-left:0px;
}



#connect #location h3.header-font{
    /*font-family: "proxima-nova", sans-serif;*/
    font-family: "Gotham A", "Gotham B", Helvetica, Arial, sans-serif;
	font-weight:700;
}

#connect #location p{
	line-height:1.5em;
	margin-top:1.5em;
}

#connect #location .street-address{
	min-height:5em;
}

#connect #location p.phone{
	margin-top:1em;
}

#connect #location  .cta{
	display:table;
	margin-top:1em;
}

#connect #location  #first-link{
	margin-top:4em;
}

.no-touchevents #connect .cta.black:hover{
	color:#000;
}

#connect .img-block{
	height:960px;
}


/* ==============================
WORK
============================== */
#work .hero-block{
	background: #f4f4f4;
}

#work .gallery{
	min-height:800px;
	overflow:visible;
	padding-bottom:0;
	padding-top:0;
}




/* ==============================
CASE STUDY
============================== */
#case .background{
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
}

#case #stat{
	margin-top:4em;
	position:relative;
}

#case #stat .img-left{
	left:0;
	padding:0;
	position:absolute;
}

#case #stat .img-right{
	right:0;
	padding:0;
	position:absolute;
}

#case #stat .img-bottom{
	bottom:0;
	padding:0;
	position:absolute;
}

#case p{
	font-weight:400;
	line-height:1.8em;
}

#case .task-body p{
	line-height:1.6em;
}

#case .body-section.bullet.three p.sans-font{
	font-weight:700;
}

#case #case-carousel{
	margin-bottom:2em;
	overflow:auto;
	padding:0;
}

#case #case-carousel .row{
	transform:translateY(0) !important;
}

#case .container-fluid .col-sm-6.client{
	padding-right:80px;
}

#case .container-fluid .client h3{
	width:90%;
}

.post-template-single-media #case #case-carousel{
	margin-top:4em;
}


/* ==============================
BLOCK OF LOGO'S
============================== */
#case .body-section.block{
	margin-bottom:5em;
	padding-top:0;
}

#case .body-section.block a{
	display:block;
}

#case .body-section.block .client-item{
	opacity:1;
}

#case .body-section.block .client-item a img{
	transform:scale(0.7);
	transition:500ms transform;
}

.no-touchevents #case .body-section.block .client-item a:hover img{
	transform:scale(0.75);
}




/* ==============================
GENERAL
============================== */

.center-text p {
	margin-bottom: 1.1em;
}

section.videoplayer {
	margin-bottom: 40px;
}

.center-text br {
    line-height: 125%!important;
}

.point hr.divide {
	margin-top: 100px;
	margin-bottom: 30px;
}

/* ----------------------------- */
LINE ROW
/* ----------------------------- */
.body-section.line-row.left .text-container,
.body-section.line-row.right .text-container{
	text-align:left;
}







.body-section.img-bg {
	margin-bottom: 60px;
}


.spotify-container{
	display:flex;
	justify-content:center;
	margin-left:15px;
	margin-top:5em;
	width:calc(100% - 30px);
}

.spotify-container .spotify-embed{
	margin-left:10px;
}

.spotify-container .spotify-embed:nth-child(0){
	margin-left:0;
}





/* ==============================
RESPONSIVE STACK
============================== */

.site-content .responsive-stack{
	display:flex;
	justify-content: center;
	padding:4vw 0;
}

.site-content .responsive-stack.fullwidth{
	width: 100%;
}

.site-content .responsive-stack .responsive-container{
	display:flex;
	max-width:1440px;
	padding: 0px 15px;
}

.site-content .responsive-stack.fullwidth .responsive-container{
	width: 100%;
}

.site-content .responsive-stack .responsive-container .stack {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	width:100%;
}

.site-content .responsive-stack .responsive-container .stack .stack-item-container {
	width:50%;
}

.site-content .responsive-stack .responsive-container .stack .stack-item-container .stack-image {
	width: 100%;
}





@media (max-width:1920px){




	.site-content .hero .row .container{
		max-width:1920px;
	}


	/* ==============================
	CASE PREVIEWS
	============================== */
	#case-nextprev h3{
		font-size:3.5em;
	}

	/* ==============================
	ABOUT
	============================== */
	#about #about-quote .text{
		font-size:3em;
	}
}



@media (max-width:1800px){
	.container-fluid{
		max-width:100%;
		padding:0 34px;
	}

	/* ==============================
	HERO
	============================== */
	.site-content .hero .row .container{
		display:flex;
		max-width:100%;
		padding:0 34px;
		width:100%;
	}

	/* ==============================
	GALLERY
	============================== */
	.site-content .body-section.gallery.grid .left{
		padding:0;
	}

	.site-content .body-section.gallery.grid .right{
		padding:0;
	}



	/* ==============================
	HOME
	============================== */
	#home .hero .row .content.maxxed.padding30{
		padding:0;
	}
}

@media (max-width: 1500px){

	#case #stat{
		height:71vw;
		padding-top:8em;
	}

	#connect #location li{
		width:calc(50% - 7.5px);
	}

	#connect #location li:nth-child(1),
	#connect #location li:nth-child(odd){
		margin-left:0px;
	}

	#connect #location li:nth-child(even){
		margin-left:15px;
	}
}

@media (max-width: 1400px){
	.body-section.halfhalf .content-container img{
		width:100%;
	}
}

@media (max-width: 1200px){
	.container-fluid.maxxed{
		max-width:100%;
		width:100%;
	}

	.row{
		margin-left:0;
		margin-right:0;
	}

	/* ==============================
	BLOCK
	============================== */

	.site-content .body-section.block .row{
		margin-left:0;
		margin-right:0;
		padding-left:0px;
		padding-right:0px;
	}

	/* ==============================
	HERO
	============================== */
	.site-content .hero .row .content.maxxed{
		max-width:1920px;
		width:100%;
	}

	/* ==============================
	SPECIFIC CASES
	============================== */

	#case.witcher #stat .stat-content{
		max-width:50%;
	}

	/* ============================== 
	HALF HALF
	============================== */
	#case .halfhalf .container-fluid.maxxed{
		width:100%;
	}



	/* ==============================
	CASE STUDY INTERIOR
	============================== */
	#case #stat{
		height:71vw;
		padding-top:8em;
	}

	/* ============================== 
	CAREERS
	============================== */
	#careers .hero-block .container-fluid.maxxed{
		margin-left:15px;
		padding:0;
		width:calc(100% - 30px);
	}

	#careers #listing .content{
		margin-left:15px;
		width:calc(100% - 30px);
	}

	#careers #listing .content .location{
		padding:0;
	}

}

@media (max-width: 1104px){
	#case.lordaeron .body-section.bullet.three .highlight h1{
		font-size:6em;
	}


	#case.lordaeron .body-section.bullet.three .highlight img{
		transform:translateY(-5px);
	}

}

@media (max-width: 1080px){
	.site-content .body-section.bullet .highlight h1{
		font-size:4.5em;
	}
}

@media (max-width: 996px){
	#case.lordaeron .body-section.bullet.three .highlight h1{
		font-size:7vw;
	}


	#case.lordaeron .body-section.bullet.three .highlight img{
		transform:translateY(-5px);
	}
}

@media (max-width: 992px){
	header .container{
		width:100%;
	}

	header .container-fluid{
		padding-left:15px;
		padding-right:15px;
	}

	header .container-fullwidth,
	header .container-fullwidth.mid{
		padding:15px 0 10px;
	}

	header .container-fullwidth ul li:last-child{
		margin-right:0;
	}

	/* ==============================
	BODY SECTION
	============================== */
	.site-content .hero .row .container{
		padding: 0 15px;
	}

	.site-content .body-section .container-fluid{
		padding-left:15px;
		padding-right:15px;
	}

	.site-content .body-section .container-fluid .col-sm-9{
		padding-left:0;
		padding-right:0;
	}


	/* ==============================
	GALLERY
	============================== */
	.site-content .body-section.gallery .container-fluid{
		padding-left:15px;
		padding-right:15px;
	}

	.site-content .body-section.gallery .full-width{
		margin-top:15px;
	}

	.site-content .gallery .item.col-6{
		margin-bottom:15px;
		max-width:calc(50% - 7.5px);
	}

	.site-content .gallery .item.col-6:nth-child(even){
		margin-left:15px;
	}

	.site-content .body-section.gallery .half-height{
		margin-bottom:15px;
	}

	.site-content .body-section.gallery.grid .col-sm-6{
		flex: 0 0 calc(50% - 7.5px);
	}

	.site-content .body-section.gallery.grid .bottom{
		margin-top:15px;
	}

	.site-content .body-section.gallery.grid .right{
		margin-left:15px;
	}

	.site-content .body-section.gallery.grid .row{
		padding-left:0;
		padding-right:0;
	}

	.site-content .body-section.gallery .content-top{
		left:15px;
		top:15px;
		width:calc(100% - 30px);
	}

	.site-content .body-section.gallery .link{
		margin: 5em 15px 0;
	}

	/* ==============================
	CAROUSEL
	============================== */
	.site-content .body-section.carousel-gallery .carousel .card{
		margin-left:15px;
	}

	/* ==============================
	3-BULLET
	============================== */
	.site-content .body-section.bullet-3 .highlight h1{
		font-size:6em;
	}

	/* ==============================
	ABOUT PAGE
	============================== */
	#about #about-quote .text{
		width:75%;
	}

	/* ============================== 
	CAREER
	============================== */
	#careers #listing .role-title{
		width:100%;
	}

	#careers #listing .excerpt-container{
		width:100%;
	}

	#careers #listing .content .positions{
		margin-top:0;
		padding:0;
	}

	#careers #listing .content .location .line{
		display:block;
	}

	#careers #listing .content .location{
		margin-top:0;
	}


	/* ==============================
	FOOTER
	============================== */
	footer .container-fluid{
		padding:0 15px;
	}

}

@media (max-width: 830px){
	.site-content .body-section.bullet-3 .highlight h1{
		font-size:5em;
	}
}


@media (max-width: 780px){
	.spotify-container{
		align-items:center;
		display:flex;
		flex-direction:column;
	}

	.spotify-container .spotify-embed{
		margin-left:0;
		margin-top:10px;
	}

	.spotify-container .spotify-embed:nth-child(0){
		margin-left:0;
	}
}

@media (max-width: 768px){
	/* ============================== 
	HERO
	============================== */
	.site-content .hero-block .background{
		display:none;
	}
	
	.site-content .hero-block .mobile-background{
		display:block;
	}
	/* ==============================
	SPECIFIC CASES
	============================== */

	#case.witcher #stat{
		height:auto;
		min-height:41vw;
		padding:4em 0;
	}

	#case.witcher .stat-content.col-xs-6{
		width:50%;
	}

	/* ==============================
	HOME
	============================== */
	#home .hero .slick-dots{
		display:none !important;
	}
	/* ==============================
	ABOUT PAGE
	============================== */
	#about #about-quote .text{
		width:100%;
	}

	/* ==============================
	CONNECT
	============================== */
	#connect #location li,
	#connect #location li:nth-child(odd),
	#connect #location li:nth-child(even){
		display:inline-block;
		margin-left:0;
		width:100%;
	}

	#connect #location #first-link{
		margin-top:0;
	}

	/* ==============================
	WORK
	============================== */
	#work .buttonList{
		width:100%;
	}

	/* ==============================
	CASE STUDY
	============================== */

	#case #stat{
		min-height:194vw;
	}

	/* ==============================
	RESPONSIVE STACK
	============================== */
	
	.site-content .responsive-stack .responsive-container .stack .stack-item-container {
		width:100%;
	}
}

@media (max-width: 767px){
	/* ==============================
	OVERRIDES
	============================== */
	.site-content .body-section.carousel-gallery .carousel .card .photo{
		width:calc(100% - 15px);
	}

	.content{
		padding-left:0;
		padding-right:0;
	}

	/* ==============================
	HEADER
	============================== */
	header .container-fullwidth.mid{
		background:#fff;
	}

	/* ==============================
	HERO
	============================== */

	.site-content .svg.downer{
		display:none;
	}

	.site-content .hero .row .content h1{
		margin-bottom:17px;
		max-width:100%;
	}

	/* ==============================
	CLIENT BLOCK
	============================== */

	.site-content .body-section.block .client-item{
		margin-bottom:0;
	}

	.site-content .body-section.block .client-item.blank{
		display:none;
	}

	/* ==============================
	BODY SECTION TEXT
	============================== */
	.site-content .body-section.text h3{
		font-size:2em;
	}

	.site-content .body-section.text.hero-block{
		/*margin-top:64px;*/
	}

	/* ==============================
	GALLERY
	============================== */
	.site-content .body-section.gallery.grid .left,
	.site-content .body-section.gallery.grid .right{
		flex:0 0 50%;
		margin-left:0;
	}

	.site-content .body-section.gallery.grid .left{
		padding:0 7.5px 0 0;
	}

	.site-content .body-section.gallery.grid .right{
		padding:0 0 0 7.5px;
	}

	.site-content .body-section.gallery .content-top h3{
		font-size:2em;
	}

	/* ==============================
	BODY SECTION ACCORDIAN
	============================== */
	.site-content .body-section.accordian-content li{
		max-height:3.5em;
		overflow:hidden;
		transition:300ms;
		width:100%;
	}

	.site-content .body-section.accordian-content li.active{
		max-height:600px !important;
	}

	.site-content .body-section.accordian-content .accordian-item{
		position:relative;
		width:100%;
	}

	.site-content .body-section.accordian-content .active .accordian-item{
		display:block;
	}

	/* ============================== 
	HALF HALF
	============================== */

	.body-section.halfhalf .content-container{
		height:auto;
	}



	/* ==============================
	CASE PREVIEWS
	============================== */
	#case-nextprev h3{
		font-size:2em;
	}


}


@media (max-width: 710px){
	.site-content .body-section.bullet .highlight h1{
		font-size:4em;
	}
}

@media (max-width: 690px){
	.site-content .body-section.bullet-3 .highlight h1{
		font-size:4em;
	}
}


@media (max-width: 576px){
	
	html {
	overflow-y: scroll; /* has to be scroll, not auto */
	-webkit-overflow-scrolling: touch;
	}
	/* ==============================
	SPECIFIC CASES
	============================== */

	#case.witcher #stat{
		min-height:200vw;
		padding-top:5em;
	}

	#case.witcher #stat .stat-content{
		vertical-align:top;
		width:100%;
	}

	#case.witcher #stat .stat-content .stat-item{
		margin-bottom:2em;
	}

	/* ==============================
	HOME
	============================== */
	#home.site-content .body-section.block{
		padding: 2em 0 5em;
	}
	#home.site-content .body-section.block.last .container-fluid{
		transform:none !important;
	}

	#home.site-content .body-section.text{
		padding-top:8em;
	}

	#home .body-section.text .content{
		width:100%;
	}
	/* ==============================
	ABOUT PAGE
	============================== */
	#about .body-section.text.hero-block{
		height:auto;
		min-height:770px;
	}

	#about .body-section .content h3{
		width:100%;
	}

	#about #about-carousel{
		margin-top:-7em;
	}

	#about #about-acccordian{
		padding-bottom:5em;
	}

	#about #about-acccordian .content h3{
		font-size:2em;
	}

	#about #about-acccordian li.double-height h3,
	#about #about-acccordian li.triple-height h3{
		line-height:1.25em;
	}

	#about #about-quote{
		display:none;
		padding:6em 0;
	}

	#about #about-quote .text{
		font-size:2.25em;
	}

	#about #about-carousel .container-fluid,
	#about #about-carousel .container-fluid .row{
		transform:none !important;
	}

	/* ==============================
	CONNECT
	============================== */
	#connect #location{
		padding: 5em 0 5em;
	}

	#connect .img-block{
		height:100vh;
	}

	/* ==============================
	WORK
	============================== */
	#work .buttonList{
		font-size:1.5em;
	}

	/* ==============================
	CASE STUDY
	============================== */

	#case #stat{
		min-height:164vw;
	}


}


@media (max-width: 575px){
	h1{
		font-size:5.5em;
	}



	.linebreak{
		display:none;
	}
	
	#case .container-fluid.maxxed,
	#case-next .container-fluid.maxxed, 
	#home .container-fluid.maxxed, 
	#work .container-fluid.maxxed, 
	#connect .container-fluid.maxxed, 
	#careers .container-fluid.maxxed{
		padding:0;
		width:calc(100% - 30px);
	}
	

	/* ==============================
	HERO
	============================== */

	.site-content .hero .row .content{
		width:calc( 100vw - 30px);
	}

	.site-content .hero .row .content h1{
		margin-bottom:17px;
	}
	
	.site-content.display.in .hero .hero-carousel h1, .site-content.display.in .hero.hero-block h1{
		font-size:4em;
		max-width:calc(100% - 30px);
		width:100%;
	}


	/* ==============================
	BODY SECTION
	============================== */
	.site-content .body-section{
		padding:5em 0;
	}

	.site-content .body-section h3{
		width:100%;
	}

	.site-content .body-section.text.hero-block h3{
		font-size:1.8em;
	}

	.site-content .body-section.text{
		margin-top:-3em;
		padding-top:9em;
	}

	.site-content .body-section.text .cta{
		margin:1em auto 0;
	}

	/* ==============================
	BODY SECTION TEXT BLOCK
	============================== */
	.site-content .body-section.text.hero-block{
		height:auto;
		min-height:75vh;
	}

	/* ==============================
	GALLERY
	============================== */
	.site-content .body-section.gallery .item,
	.site-content .gallery .item.show.even{
		flex:0 0 100%;
		max-width:100%;
		padding-top:110%;
		margin-left:0;
	}

	.site-content .gallery .item.col-6:nth-child(even){
		margin-left:0;
	}

	.site-content .body-section.gallery.grid{
		padding-top:2em;
	}

	.site-content .body-section.gallery.grid .col-sm-6{
		flex: 0 0 100%;
	}


	.site-content .body-section.gallery .item .bg{
		height:100%;
		/*width:auto;*/
		width:100%;
	}

	.site-content .body-section.gallery.grid .item .bg.toHeight{
	}

	.site-content .body-section.gallery.grid .left,
	.site-content .body-section.gallery.grid .right{
		padding:0;
	}

	.site-content .body-section.gallery.grid .left{
		margin-top:16px;
	}


	.site-content .body-section.gallery.grid .right{
		margin-left:0;
		margin-top:16px;
	}

	.site-content .body-section.gallery.grid .half-height{
		padding-top:110%;
	}

	.site-content .body-section.gallery.grid .content-top{
		left:15px;
		top:15px;
	}

	.site-content .body-section.gallery.grid .content-top h3{
		font-size:2em;
	}

	.site-content .body-section.gallery.grid .bottom{
		margin-bottom:0;
	}

	/* ==============================
	GRID
	============================== */
	#home .body-section.gallery.grid{
		padding:5em 0 0;
	}

	/* ==============================
	BLOCK
	============================== */
	.site-content .body-section.block{
		padding: 2em 0 5em;
	}

	.site-content .body-section.block h2{
		margin-bottom:1em;
	}

	.site-content .body-section.block .client-item{
		align-items:center;
		display:flex;
		justify-content:center;
		max-width:50%;
	}

	/* ==============================
	BULLETS
	============================== */

	.site-content .body-section.bullet.three .point{
		margin-bottom:4em;
	}
	.site-content .body-section.bullet .highlight h1{
		font-size:6.5em;
	}



	/* ==============================
	BODY SECTION ACCORDIAN
	============================== */
	.site-content .body-section.accordian-content li{
		max-height:4em;
	}

	.site-content .body-section.accordian-content li.double-height{
		max-height:5.5em;
	}

	.site-content .body-section.accordian-content li.triple-height{
		max-height:9em;
	}

	.site-content .body-section.accordian-content .accordian-item{
		font-size:1em;
		margin-bottom:2em;
	}

	.site-content .body-section.accordian-content .arrow-right .link-arrow,
	.touchevents .site-content .body-section.accordian-content .arrow-right .link-arrow{
		/*transform: translateY(-5%) translateX(0) scale(0.5);*/
		display:none;
	}


	/* ==============================
	SPECIFIC SECTIONS
	============================== */
	#case.lordaeron .body-section.bullet.three .highlight h1{
		font-size:7em;
	}


	#case.lordaeron .body-section.bullet.three .highlight img{
		transform:translateY(-5px);
	}


}

@media (min-width:576px){
	

	.body-section.line-row {
		padding:2em 0 4em 0;
	}

	
	#case .body-section.line-row.right .row{
		justify-content:flex-end;
	}
	
	#case .body-section.line-row.right .text-container{
		align-items:flex-end;
		/*display:flex;*/
		display:block;
		flex:0 0 66.666667%;
		flex-direction:column;
		margin-left:8.333333%;
		max-width:66.666667%;
		text-align:left;
	}

	#case .body-section.line-row.left .text-container{
		align-items:flex-start;
		display:flex;
		flex:0 0 66.666667%;
		flex-direction:column;
		max-width:66.666667%;
	}

	#case .body-section.line-row.right .text-container h3{
		flex: 0 0 100%;
		max-width:100%;
	}

	#case .body-section.line-row.right .text-container p{
		flex: 0 0 100%;
		max-width:100%;
	}
}

@media (min-width: 992px){
	.site-content .body-section.halfhalf .halves-container{
		display:flex;
		flex-direction:row;
	}

	.site-content .body-section.halfhalf .halves-container .text p{
		width:calc(100% - 30px);
	}

	.site-content .body-section.halfhalf .halves-container .text p:first-child{
		margin-top:0;
	}

	.body-section.halfhalf .content-container img{
		width:100%;
	}
}

@media (min-width: 1200px){
	#case .body-section.line-row.right .row{
		align-items:center;
		flex-direction:column;
		justify-content:flex-start;
		
	}
	
	#case .body-section.line-row.left .text-container,
	#case .body-section.line-row.right .text-container{
		flex:0 0 66.666667%;
		margin-left:0;
		max-width:41.666667%;
	}
	
}




.background {
	height:400px;
}