/* COPIED FROM MISSION WEBSITE 9/22/23 */

@charset "utf-8"; /* CSS Document */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{border:0;/*outline:0;*/font-size:100%;font:inherit;vertical-align:baseline;background:transparent;margin:0;padding:0} body{line-height:1} ol,ul{list-style:none} blockquote,q{quotes:none} blockquote:before,blockquote:after,q:before,q:after{content:none} ins{text-decoration:none} del{text-decoration:line-through} table{border-collapse:collapse;border-spacing:0} a{font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0} .group:after{content:"";display:table;clear:both;}

/* GLOBAL
---------------------------------------------- */
@font-face {
    font-family: 'Visby-Light';
    src: url("/fonts/VisbyCF-Light.eot");
    src: local("☺"), url("/fonts/VisbyCF-Light.eot?#iefix") format("embedded-opentype"), url("/fonts/VisbyCF-Light.woff2") format("woff2"), url("/fonts/VisbyCF-Light.woff") format("woff"), url("/fonts/VisbyCF-Light.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Visby-Regular';
    src: url("/fonts/VisbyCF-Regular.eot");
    src: local("☺"), url("/fonts/VisbyCF-Regular.eot?#iefix") format("embedded-opentype"), url("/fonts/VisbyCF-Regular.woff2") format("woff2"), url("/fonts/VisbyCF-Regular.woff") format("woff"), url("/fonts/VisbyCF-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Visby-Bold';
    src: url("/fonts/VisbyCF-Regular.eot");
    src: local("☺"), url("/fonts/VisbyCF-Bold.eot?#iefix") format("embedded-opentype"), url("/fonts/VisbyCF-Bold.woff2") format("woff2"), url("/fonts/VisbyCF-Bold.woff") format("woff"), url("/fonts/VisbyCF-Bold.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Visby-Italic';
    src: url("/fonts/VisbyCF-RegularOblique.eot");
    src: local("☺"), url("/fonts/VisbyCF-RegularOblique?#iefix") format("embedded-opentype"), url("/fonts/VisbyCF-RegularOblique.woff2") format("woff2"), url("/fonts/VisbyCF-RegularOblique.woff") format("woff"), url("/fonts/VisbyCF-RegularOblique.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
/* html{overflow-x: hidden;} */
html {
    scroll-behavior: smooth;
}
@media (prefers-reduced-motion) {
    html {
        scroll-behavior: unset;
    }
}
body{font-family: Visby-Regular;overflow-x:hidden;}
.overflow {overflow-x: hidden; width: 100%; height: 100%;}
.container{max-width: 1260px;width:100%;margin: 0 auto;padding: 3%;position: relative;}
p{font-size:15px;line-height:31px;letter-spacing: 0.25px;color:#5A5959;font-family: "adelle",serif;}
h1,
.h1-like{font-size:80px;line-height:84px;color:#fff;font-family: "adelle",serif;}
h2,
.h2-like{font-size:28px;line-height:40px;letter-spacing:1px;color:#5A5959;font-family: "adelle",serif;}
h3{font-size:22px;line-height:32px;color:#B9B8B8;font-family: "adelle",serif;}
h4,
.h4-like{font-size:16px;line-height:18px;letter-spacing:1.5px;color:#FE552F;text-transform: uppercase;font-family:Visby-Bold;}
h5,
.h5-like{font-size:15px;line-height:22px;color:#5A5959;font-family: Visby-Bold;}
b,strong {font-weight:600;}
p b{font-weight:600;}
em{ font-style: italic;}
a{transition: all .3s ease 0s;-webkit-transition: all .3s ease 0s; text-decoration-color: transparent; -webkit-text-decoration-color: transparent;color:#ff501c;}
a:hover,
a:focus{
    color:#5A5959;
}
a:hover{
    cursor:pointer;
}
a.disabled,
a.disabled:hover,
a.disabled:focus{
    color:inherit;
    cursor: default;
}
hr{background-color: white;width:24px;height:3px;border:none;}
button::-moz-focus-inner {border: 0;}
input{font-family:Visby-Bold;letter-spacing: 1px;}
textarea, input {/*outline: none;*/font-family: Visby-Bold;letter-spacing: 1px;}
ul{font-size:15px;line-height:31px;letter-spacing: 0.25px;color:#5A5959;font-family: "adelle",serif;}
.wysiwyg ul{margin:10px 0px;padding-bottom: 30px;}
.wysiwyg ul li{padding-left:40px;position:relative;}
.wysiwyg ul li:before{width: 20px;height: 2.5px;content: " ";background-color: #e2e2e2;position: absolute;left: 2px;top: 14px;}
blockquote{quotes: none;font-size: 22px;color: #C0CCD4;line-height: 40px;letter-spacing: 0.3px;padding: 30px 0px;position:relative;}
blockquote:before{content: " ";display: inline-block;background-color: #c0ccd4;width: 24px;height: 4px;left: 0px;border: none;position: absolute;top: 20px;}
.flex-centered {display: flex;display: -moz-flex;display: flex;box-orient: vertical;box-direction: normal;-moz-flex-direction: column;flex-direction: column;box-pack: center;-moz-justify-content: center;-ms-justify-content: center;-o-justify-content: center;justify-content: center;-ms-flex-pack: center;}
.clearfix{content:"";display:table!important;clear: both!important;}
.btn{background: #FEE12F;border: none;padding: 0px 60px;font-size: 20px;border-radius: 50px;color: #5A5959;transition: all .3s ease 0s;-webkit-transition: all .3s ease 0s;font-family: Visby-Bold;text-decoration-color: transparent; -webkit-text-decoration-color: transparent;margin: 0 auto;display: inline-block;height: 53px;line-height: 49px;position: relative;z-index: 1;-webkit-appearance: none;}
.btn:hover{cursor:pointer;background:#fff;}
.btn:active{background:#ffea68;}
.underscore:after{content: " ";display: inline-block;background-color: white;width: 24px;height: 4px;left: 2px;bottom: -4px;border: none;position: relative;}
.prescore:before{content: " ";display: inline-block;background-color: white;width: 69px;height: 10px;top: 28px;left: -91px;border: none;position: absolute;}
.overlay{position:absolute;top:0;left:0;height:100%;width:100%;background:#FE552F;opacity: 0.8;}
.grid, .plus { padding-left: 15px; margin-left: -15px; }
.grid:before{width:8px;height:8px;content: " ";background-image: url("../images/squares.png");position: absolute;left: 0;top: 3px;background-size: contain;background-repeat: no-repeat;transition: all .3s ease 0s;-webkit-transition: all .3s ease 0s;}
.grid:hover:before{background-image: url("../images/squares-color.png");}
.plus:before{width:8px;height:8px;content: " ";background-image: url("../images/plus.png");position: absolute;left: 0;top: 3px;background-size: contain;background-repeat: no-repeat;transition: all .3s ease 0s;-webkit-transition: all .3s ease 0s;}
.plus:hover:before{background-image: url("../images/plus-color.png");}
.right-arrow{position: relative;}
.right-arrow:before {width: 8px;height: 8px;content: " ";background-image: url("../images/yellow-arrow.png");position: absolute;right: -14px;top: 7px;background-size: contain;background-repeat: no-repeat;transition: all .3s ease 0s;-webkit-transition: all .3s ease 0s;transform: rotate(180deg);}
.no-scroll{overflow:hidden;}

/* ADA EDITS
---------------------------------------------- */

a:focus-visible, button:focus-visible {
    outline: white auto 1px;
}

input:focus-visible, textarea:focus-visible {
    outline: white auto 1px;
    background-color: rgba(0, 0, 0, .1)!important;
}

.btn.gtm-contact-submit {
    background:#FEE12F!important;
}

.invisible {
    visibility: hidden!important;
}

.screen-reader-text{
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
            clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.play-pause-button{
    display: flex;
    align-items: center;
    justify-content: center;
    width:44px;
    height:44px;
    border: 0;
    background: transparent;
    box-sizing: border-box;
    cursor: pointer;
}

.play-pause-button::before {
    display: block;
    content: '';
    box-sizing: inherit;
    width: 0;
    height: 24px;
    border-color: transparent transparent transparent #fff;
    transition: 100ms all ease;
    border-style: solid;
    border-width: 12px 0 12px 20px;
    opacity: 0.77;
}
.play-pause-button.playing::before {
    border-style: double;
    border-width: 0px 0 0px 20px;
}
.play-pause-button:hover::before,
.play-pause-button:focus::before{
    opacity:1;
}


/* NAV
---------------------------------------------- */
/* top */
.top{
    visibility: visible!important;
    position: fixed;
    width: 100%;
    padding: 40px;
    box-sizing: border-box;
    z-index: 999;
    pointer-events: none;
}
.top .hmg{
    position: absolute;
    right: 108px;
    top: 67px;
    transition: .3s ease all;
}
.top a{
    position: relative;
    display:block;
    pointer-events: all;
}
.top .hmg-icons{
    position: absolute;
    width: 70px;
    top: 64px;
    right: 100px;
    transition:0.3s ease all;
    opacity:0.5;
}
.top.shrink .hmg-icons{
    top: 48px;
}
.top .logo{
    background: url("https://missionagency.com/images/logo.png");
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    float: left;
    height:71px;
    width:247px;
    transition: .3s ease all;
}
.top .gif{
    background: url("https://missionagency.com/images/logo.gif");
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    float: left;
    height: 71px;
    width: 247px;
    position: absolute;
    left: 0px;
    opacity: 0;
    transition: .3s ease all;
}
.top .gif:hover{
    opacity: 1;
}
.top.shrink a .logo{
    height: 36px;
    width: 125px;
}
.top.shrink .nav{
    top:8px;
}
.top.shrink a .gif{
    height: 36px;
    width: 125px;
}
.top.shrink .hmg{
    top:49px;
}
.gradient{
    position: fixed;
    top: 0px;
    width: 92%;
    padding: 5% 4%;
    z-index: 998;
    background-image: url('https://missionagency.com/images/top-gradient.png');
    background-size: contain;
    background-repeat: repeat-x;
    overflow-x: hidden;
    pointer-events: none;
}
/* nav */
#nav:focus-visible {
    outline: white 2px solid;
}
.nav{
    padding: 2px;
    max-width: 27px;
    right: 13px;
    top: 23px;
    float: right;
    position: relative;
    pointer-events: all;
    transition: .3s ease all;
}
.nav .nav-container{
    position: relative;
}
.nav:hover{
    cursor: pointer;
}
.nav:hover .bar.one{
    top:3px;
}
.nav:hover .bar.three{
    top:15px;
}
.nav:hover .burger-top{
    opacity: 1;
    top: -14px;
}
.nav:hover .burger-bottom{
    opacity: 1;
    bottom: -9px;
}
.nav:active .burger-top{
    top: -10px;
}
.nav:active .burger-bottom{
    bottom: -5px;
}
.nav:active .bar.one{
    background:orange;
}
.nav:active .bar.two{
    background:green;
}
.nav:active .bar.three{
    background:brown;
}
.nav .bar{
    width: 26px;
    height: 4px;
    background: white;
    border-radius: 5px;
    position:absolute;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2);
}
.nav .bar.one{
    top:0px;
}
.nav .bar.two{
    top:9px;
}
.nav .bar.three{
    top:18px;
}
.burger-top{
    width: 43px;
    height: 14px;
    background: url("https://missionagency.com/images/hamburger-top.png");
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 5px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    opacity: 0;
    position: relative;
    top: -6px;
    left: -6px;
}
.burger-bottom{
    left: -5px;
    background: url("https://missionagency.com/images/hamburger-bottom.png");
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 5px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    opacity: 0;
    position: relative;
    bottom: 6px;
    width: 40px;
    height: 10px;
}
/*nav-opened*/
.nav-opened .burger-top{
    opacity: 0;
}
.nav-opened .burger-bottom{
    opacity: 0;
}
.nav-opened .bar.one{
    opacity: 0;
}
.nav-opened .bar.three{
    top:10px !important;
    transform: rotate(45deg);
}
.nav-opened .bar.two{
    top:10px;
    transform: rotate(-45deg);
}
.nav-opened:hover .burger-top{
    opacity: 0;
}
.nav-opened:hover .burger-bottom{
    opacity: 0;
}
.nav-opened:hover .bar.three{
    top:10px;
    background: #fe552f;
}
.nav-opened:hover .bar.two{
    background: #fe552f;
}

/* MENU
---------------------------------------------- */
.menu{
    visibility: hidden;
    background: url("https://missionagency.com/images/nav-bg2021.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #4b4b4b;
    background-position: center center;
    position:fixed;
    height:100%;
    width:100%;
    z-index:998;
    display:block;
    opacity: 0;
    pointer-events:none;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.menu.menu-opened{
    visibility: visible!important;
    opacity: 1;
    pointer-events:all;
}
.menu .left-col .divider {
    opacity: 0;
    position: relative;
    left: 0px;
    padding-bottom: 100px;
    line-height: 0;
    margin: 0;
    font-size: 0;
    left:-500px;
    transition: all 1.2s cubic-bezier(.34,1.42,.7,1.07);
    -webkit-transition: all 1.2s cubic-bezier(.34,1.42,.7,1.07);
}
.menu .left-col .divider span {
    display: inline-block;
    height: 4px;
    width: 24px;
    background: #fff;
    line-height: 0;
}
.menu .left-col h4 {
    font-size: 12px;
    font-family: Visby-Bold;
    margin-bottom: 36px;
}
.upper {
    display:block;
    opacity: 0;
    left:-500px;
    transition: all 1s cubic-bezier(.34,1.42,.7,1.07);
    -webkit-transition: all 1s cubic-bezier(.34,1.42,.7,1.07);
    padding-bottom: 40px;
}
.lower {
    display:block;
    opacity: 0;
    left:-500px;
    transition: all 1.4s cubic-bezier(.34,1.42,.7,1.07);
    -webkit-transition: all 1.4s cubic-bezier(.34,1.42,.7,1.07);
}
.made {
    display:block;
    opacity: 0;
    left:-500px;
    transition: all 1.8s cubic-bezier(.34,1.42,.7,1.07);
    -webkit-transition: all 1.8s cubic-bezier(.34,1.42,.7,1.07);
}
.show .divider {
    opacity: 1 !important;
    left:0px !important;
}
.show .upper {
    opacity: 1;
    position:relative;
    left:0px;
}
.show .lower {
    opacity: 1;
    position:relative;
    left:0px;
}
.show .made {
    opacity: 1;
    position:relative;
    left:0px;
}
.menu .left-col .upper p {
    color: #B9B8B8;
    letter-spacing: 1.4px;
    margin-bottom: 6px;
    font-family: 'Visby-Regular';
    line-height: 1.5;
}
.menu .left-col .lower {padding-bottom: 20px;}
.menu .left-col .lower h2 {
    color:white;
    font-size: 23px;
    line-height: 1.3;
}
.menu .left-col .lower p {
    color: #717171;
    letter-spacing: 1;
    line-height: 1.3;
    margin-bottom: 6px;
    font-size:13px;
    font-family: 'Visby-Bold';
}
.menu .left-col .lower .stat {padding-bottom: 20px;}
.menu .container{
    width: 50%;
    padding: 160px 0px 0px 32%;
    float: left;
}
.menu .icon {
    background-size: cover;
    background-repeat: no-repeat;
    display:inline-block;
    width:14px;
    height:14px;
    top: 2px;
    position: relative;
    margin: 0px .5px;
}
.menu .right-col {
    /*background: url("https://missionagency.com/images/gray-bg-light.png");
  background-size: cover;
  background-repeat: no-repeat;*/
    background-color: #5A5959;
    width: auto;
    float: right;
    right:-1000px;
    transition: all .8s ease 0s;
    -webkit-transition: all .8s ease 0s;
    position: relative;
}
.menu .right-col:before {
    content: '';
    position: absolute;
    background-color: #5A5959;
    bottom: 0;
    left: -6vh;
    transform-origin: bottom left;
    transform: skewX(-3deg);
    width: 20vh;
    height: 100%;
}
.menu .right-col.show {
    right:0px;
}
.menu .right-col:after {
    background-color: #5A5959;
    right:7.4%;
}
.menu .right-col ul {
    color: white;
    z-index: 2;
    position: relative;
    width: 300px;
    padding: 160px 56px 0px 0px;
    font-size: 40px;
    text-align: right;
}
.menu .right-col li {
    font-family: "adelle",serif;
    padding: 6px 0px;
    margin-bottom:14px;
}
.menu .right-col li a {
    color: #fff;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.menu .right-col li a:hover{
    cursor: pointer;
    color:#FE552F;
}
.menu .right-col ul .divider {
    padding: 14px 0;
    line-height: 0;
    margin: 0;
    font-size: 0;
}
.menu .right-col ul .divider span {
    display: inline-block;
    height: 4px;
    width: 24px;
    background: #fff;
    line-height: 0;
}
.menu .right-col .social-wrap {
    padding-right: 56px;
    padding-top: 45px;
    text-align: right;
    position: absolute;
    bottom: 30px;
    right: 0;
}
.menu .right-col .social {
    text-align: left;
    padding-bottom: 16px;
    font-size: 0;
    margin-left: 65px;
}
.menu .right-col .social a {
    display: inline-block;
    background: rgba(255,255,255,0.5);
    color: #5A5959;
    width: 26px;
    padding: 3px 0;
    text-align: center;
    font-size: 20px;
    line-height: 1;
    margin-right: 10px;
}
.menu .right-col .social a:hover {background: rgba(255,255,255,1);}
.menu .right-col .social a:last-child{
    margin-right: 0px;
}
/*
.menu .right-col .social > div {
  width: 26px;
  height: 26px;
}
.menu .right-col .social > div {
	background-size: 106px 52px;
	background-image: url("https://missionagency.com/images/social-sprite-light.png");
	background-position-y: -26px;
	float: none;
}
.menu .right-col .social .twitter {background-position-x: -40px;}
.menu .right-col .social .linkedin {background-position-x: -80px;}
.menu .right-col .social > div:hover {
	cursor: pointer;
	background-position-y: 0;
}
*/
.menu .right-col .social-wrap .copyright {
    color: rgba(255,255,255,0.25);
    font-size: 12px;
    letter-spacing: 1px;
}
.menu .made {
    text-transform: uppercase;
    color: #B9B8B8;
    font-size: 12px;
    position: absolute;
    bottom: 30px;
    left: 32%;
    line-height: 1.4;
    font-family: Visby-Regular;
}
.menu .made b {
    font-family: Visby-Bold;
}
.mobile-menu {
    display: none;
}
.mobile-menu ul {
    width: 100%;
    height: calc(100% - 80px);
    position: absolute;
    top: 80px;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: right;
}
.mobile-menu ul li {
    /* 	height: 16.666%; */
    height:14.3%;
    display: table;
    width: 100%;
}
.mobile-menu ul li:nth-child(1) {background-color: #484848;}
.mobile-menu ul li:nth-child(2) {background-color: #444444;}
.mobile-menu ul li:nth-child(3) {background-color: #414141;}
.mobile-menu ul li:nth-child(4) {background-color: #3C3C3C;}
.mobile-menu ul li:nth-child(5) {background-color: #373737;}
.mobile-menu ul li:nth-child(6) {background-color: #303030;}
.mobile-menu ul li:nth-child(7) {background-color: #272727;}
.mobile-menu ul li a {
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    -webkit-text-size-adjust: 100%;
    font-size: 30px;
    font-weight: 600;
    line-height: 1;
    box-sizing: border-box;
    padding: 0 4%;
}
.mobile-menu ul li a:hover {color: #fe552f;}
.mobile-menu ul li:nth-last-child(-n+2) a {font-weight: normal;}

/* FOOTER
---------------------------------------------- */
.footer{
    background:#D8D8D8;
    /*   overflow:hidden; */
}
/*
.footer-callout{
	overflow: hidden;
}
*/
.footer p{
    display: inline-block;
    color: #5A5959;
    font-size: 12px;
    padding: 0px 0px 0px 50px;
}
.footer a {
    color: #1E1E1E;
    text-decoration: underline;
    text-decoration-color: transparent;
    -webkit-text-decoration-color: transparent;
}
.footer a:hover {
    color: #5A5959;
}
.footer .logo{
    background: url("https://missionagency.com/images/mm_word_white.png");
    background-size: 123px 10px;
    background-repeat: no-repeat;
    background-position: center center;
    width: 123px;
    height: 10px;
    display: inline-block;
    float: right;
    padding-right: 100px;
    padding-top: 19px;
    font-size: 0;
    line-height: 0;
}

/* HOME FOOTER
---------------------------------------------- */
.footer-home {
    width:100%;
    background-color:#FE552F;
    padding:10px 0px;
    margin:0 auto;
    text-align: center;
    /* necessary for reveal and working links, JS sets negative z index breaking links */
    z-index: 1 !important;
}
.footer-home ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
.footer-home li {
    display: inline-block;
    font-size:15px;
    line-height:15px;
    color: white;
    font-family: "visby-bold",serif;
    padding: 14px 40px;
}
.footer-home li:first-of-type {
    opacity:.5;
}
.footer-home li a {
    display: block;
    color: white;
    text-align: center;
    text-transform:uppercase;
    /*text-decoration: none;*/
    text-decoration-color: transparent;
    -webkit-text-decoration-color: transparent;
}
.footer-home li a:hover{
    cursor: pointer;
    color: #FEE12F;
}

/* VIDEO EMBEDS
---------------------------------------------- */
.video {
    background-color: #000;
    position: relative;
    padding-top: 56.25%;
    overflow: hidden;
    cursor: pointer;
}
.video img {
    width: 100%;
    top: 0;
    left: 0;
    opacity: 1;
    transition: opacity .3s ease;
}
.video img,
.video .play-button {
    cursor: pointer;
}
.video img,
.video iframe,
.video video {
    position: absolute;
}
.video iframe,
.video video {
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}
#html5-next img,
#html5-prev img,
#html5-close img {
    width:50px;
}

/* CALLOUT
---------------------------------------------- */
.callout{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 90px 0px 60px;
    text-align: center;
    position: relative;
}
.callout h2{
    color:#fff;
    text-align: center;
    padding-bottom: 25px;
    position: relative;
    z-index: 1;
}

/* SPLASH
---------------------------------------------- */
.splash{
    z-index: 2;
    position: fixed;
    height: 100%;
    width: 100%;
    display:flex;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    box-shadow: inset 0px 0px 0px 31px #555454;
    transition: all .5s ease 0s;
    -webkit-transition: all .5s ease 0s;
    opacity: 1;
}
.splash h1{
    color:#555454;
    font-size:360px;
    line-height: 300px;
    text-transform: uppercase;
    font-family: "visby-bold",serif;
    top: 0px;
    right: 0px;
    position: absolute;
    width: 1100px;
}
.splash p{
    color: white;
    position: absolute;
    bottom: 17%;
    right: 5%;
    font-size: 20px;
    width: 340px;
    right: 0px;
    position: absolute;
    padding-right: 4%;
    padding-top: 40%;
}
.splash.hidden{
    opacity: 0;
    pointer-events: none;
}

/* PAGE HEADER
---------------------------------------------- */
.page-hdr {
    position: relative;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    /*background-color: #FE552F;*/
    background-color: #5A5959;
    height: 940px;
    display: table;
    width: 100%;
}
.page-hdr .int {
    display: table-cell;
    vertical-align: middle;
    padding: 0 4%;
}
.page-hdr .int img{
    position: absolute;
    bottom: -18px;
    z-index: 2;
}
.project-detail .page-hdr .int{
    z-index: 3;
    position: relative;
}
.project-detail .page-hdr .shade{
    background: black;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: absolute;
    z-index: 2;
    opacity: 0.4;
}
.page-hdr h1 {
    font-size: 80px;
    line-height: 84px;
    text-align: center;
    margin-bottom: 20px;
}
.page-hdr h1.project-title {
    font-size: 50px;
    line-height: 58px;
}
.page-hdr h4 {
    text-align: center;
    color: #fff;
    margin-bottom: 20px;
}
.page-hdr .arrow {
    bottom: 23%;
    z-index: 1;
}
.page-hdr:after {
    content: '';
    display: block;
    position: absolute;
    background: #fff;
    bottom: -20vw;
    left: 0;
    transform-origin: right top;
    transform: skewY(3deg);
    height: 20vw;
    width: 100%;
}
.project-detail .page-hdr:after{
    z-index: 2;
}
.hdr-wrap {overflow: hidden;}
.full-page-hdr {
    background-color: #202020;
    height: 115vh;
    background-attachment: fixed;
    position: absolute;
}
.full-page-hdr:after {display: none;}
.full-page-hdr .title {margin-bottom: 15vh;}
.full-page-hdr ul{
    display: block;
    margin: 0 auto;
    position: relative;
    text-align: center;
}
.full-page-hdr ul li{
    display: inline-block;
    color: white;
    text-align: center;
    font-family: 'Visby-Bold';
    font-size: 17px;
    line-height: 1;
    letter-spacing: 2px;
    text-transform: uppercase;
    /*   padding: 0px 12px; */
    /*   border-right: 2px solid white; */
}
.full-page-hdr ul li:last-of-type{border-right: none;}
.full-page-hdr a:hover {
    color: #ff501c;
    opacity: 0.75;
}
#scroll {
    top: -10vw;
    position: absolute;
}

.agency-reel{
    position: absolute;
    bottom: 200px;
    z-index: 2;
    width:424px;
}
.agency-reel .border{
    width: 424px;
    height: 239px;
    display: block;
    pointer-events: none;
    border: 1px solid white;
    position: absolute;
    left: 10px;
    top: 10px;
    opacity: 0.5;
}
.agency-reel .play-btn {
    margin: 0 auto;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border-width: 15px;
    border-color: rgba(248, 232, 28, 0.53);
    border-style: solid;
    text-align: center;
    position: absolute;
    margin-top: 79px;
    left: 170px;
    box-shadow: inset 125px 0px 0px #f8e81c;
    z-index: 100;
    transition:0.3s ease all;
}
.agency-reel .play-btn img{
    top: 30%;
    left: 25%;
    width: 30px;
    max-width: 56px;
}
.agency-reel .play-btn:hover{
    cursor: pointer;
    border-color:rgb(254, 85, 47, 0.57);
    box-shadow: inset 125px 0px 0px #fe552f;
}
.agency-reel p{
    position: absolute;
    right: -11px;
    text-align: right;
    font-size: 12px;
    font-style: italic;
    padding-top: 7px;
}

/* MAIN
---------------------------------------------- */
/* first */
/* arrow */
@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-20px);
    }
    60% {
        transform: translateY(-5px);
    }
}
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-20px);
    }
    60% {
        transform: translateY(-5px);
    }
}
.arrow {
    background: url("https://missionagency.com/images/scroll.png");
    background-size: contain;
    background-repeat: no-repeat;
    width:39px;
    height:42px;
    margin: 0 auto;
    position:absolute;
    left:10px;
    right:0;
    bottom:1.9%;
    -webkit-animation: bounce 1.8s infinite;
    animation: bounce 1.8s infinite;
}
.careers .arrow, .nat-foods .arrow {
    left:0px;
}
.nat-foods .cpg_header {
    font-size:85px;
    z-index: 20;
    color:white;
    font-family:Visby-Bold;
    font-weight: 1000;
    line-height:1.1;
    margin-left:10%;
    margin-bottom:50px;
}
.nat-foods .page-hdr.full-page-hdr.nat-hdr {
    align-items:flex-start;
    flex-direction: column;
}
.nat-foods .page-hdr.nat-hdr .flex_holder {
    max-width:550px;
    margin-left:10%;
    transform:none;
    justify-content:flex-start;
    position:static;
}
.nat-foods .flex_holder {
    display:flex;
    justify-content: flex-start;
}
.nat-foods .flex_holder div {
    margin-right:10%;
    margin-top:50px;
}
.nat-foods .page-hdr.nat-hdr .btn {
    text-transform:lowercase;
}
.nat-foods .width-50.friendship-div {
    width:80%;
    background-color:transparent;
}
.nat-foods #voice .gradient-section-header {
    text-align:center;
}
.nat-foods #voice .frendship-div-title {
    max-width:100%;
    font-size:45px;
}
.nat-foods #voice .frendship-div-title::after {
    left:50%;
    transform:translateX(-50%);
}
.nat-foods #voice p, .nat-foods .gray-p {
    font-size:23px;
    line-height:1.5;
}
.nat-foods .friendship-div .frendship-div-title, .nat-foods .friendship-div p {
    max-width: 100%;
}
.nat-foods .partner-div h4 {
    position:relative;
    z-index: 1;
}
.nat-foods .flex-container {
    display:flex;
    justify-content: space-between;
}
.nat-foods .flex-container .partner-div {
    width:40%;
}
.nat-foods .flex-container .partner-div h5 {
    font-size:20px;
    line-height:1.1;
    font-weight:500;
    margin-left:35px;
}
.nat-foods .flex-container .partner-div h5::before {
    height:3px;
    width:15px;
    left:-25px;
}
.nat-foods .expo-slider-nav .slick-dots {
    flex-wrap:wrap;
}
.nat-foods .expo-slider-nav .slick-dots li, .nat-foods .expo-slider-nav .slick-dots li:last-child {
    margin-top:5px;
}
.nat-foods .gradient-section h3 {
    font-family:Visby-Regular;
    font-weight: 100;
}
.nat-foods .expo-page-footer-title {
    width:100%;
    text-align:center;
}
.expo-slider-section:nth-child(even) .expo-slider-header {
    right:83px;
}
@media(max-width:750px) {
    .nat-foods .page-hdr.full-page-hdr.nat-hdr {
        justify-content: flex-start;
    }
    .nat-foods .cpg_header {
        font-size:60px;
        margin-top:10%;
    }
    .nat-foods .hide_br {
        display:none;
    }
    .nat-foods .page-hdr.nat-hdr .flex_holder {
        align-items:flex-start;
    }
    .nat-foods .frendship-div-title {
        font-size:30px;
        line-height:40px;
    }
    .nat-foods .nat-hdr .flex_holder {
        flex-direction:column;
    }
    .nat-foods #voice .gradient-section-header {
        text-align:left;
    }
    .nat-foods #voice .frendship-div-title {
        font-size:35px;
    }
    .nat-foods #voice .frendship-div-title::after {
        left:0px;
        transform:none;
    }
    .nat-foods .partner-div.mob_visible {
        display:block;
        margin-top:50px;
        margin-left:25px;
    }
    .nat-foods .gradient-section .flex-container {
        flex-wrap:wrap;
    }
    .nat-foods .flex-container .partner-div {
        width:100%;
    }
}
.arrow:hover{
    cursor: pointer;
}
.scroll-bars {
    background: url("https://missionagency.com/images/scroll-bar.png");
    background-size: contain;
    background-repeat: repeat-y;
    width: 25px;
    height: 14px;
    margin: 0 auto;
    position: absolute;
    left: 6px;
    right: 0;
    bottom: 1%;
}
body.home{
    background:#060606;
}
body.careers, body.careers-connor {
    background:#4b4b4b;
}
.home-slider {
    background-color: #302F2F;
}
.home-slider .play-pause-button{
    position:fixed;
    z-index:99999;
    bottom:18px;
    left:18px;
}
.home-slider .slick-track,
.home-slider .slick-list {
    width: 100%;
    height: 100%;
}
.home-slider div.slick-slide {
    width: 100%;
    height: 100%;
    float: left;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.home-slider div.slick-slide:after {
    content: " ";
    display: block;
    transform: rotate(-8deg);
    height: 100vh;
    width: 100%;
    position: relative;
    left: 58%;
    top: -10vw;
    z-index: 1;
    opacity: 0.8;
}
.home-slider .slide-1:after,
.home-slider .slide-1 .right-col:after {background: #EB6029;}
.home-slider .slide-2:after,
.home-slider .slide-2 .right-col:after {background: #302F2F;}
.home-slider .slide-3:after,
.home-slider .slide-3 .right-col:after {background: #FF0000;}
.home-slider .slide-4:after,
.home-slider .slide-4 .right-col:after {background: #FF8400;}
.home-slider .slide-5:after,
.home-slider .slide-5 .right-col:after {background: #1C709C;}
.home-slider .slide-1 .right-col .desc .options {
    margin-left:30%;
}
.home-slider .slider-nav {
    position: absolute;
    left: 63.5%;
    top: 90%;
    width: 100%;
}
.home-slider .slider-nav .slick-list {background: none;}
.home-slider .slider-nav .slick-track {
    width: 100% !important;
    transform: none !important;
    text-align: left;
    background: none;
}
.home-slider .slider-nav a {
    display: inline-block;
    float: none;
    vertical-align: bottom;
    font-weight: 800;
    color: #fff;
    font-family: 'Visby-Regular';
    font-size: 14px;
    letter-spacing: 1px;
    text-align: center;
    position: relative;
    transition: all .1s ease 0s;
    -webkit-transition: all .1s ease 0s;
    cursor: pointer;
}
.home-slider .slider-nav a span {
    padding: 0px 10px 40px 10px;
    display: inline-block;
    position: relative;
    opacity:.5;
}
.home-slider .slider-nav a:after {
    content:'.';
    opacity:.5;
}
.home-slider .slider-nav a:last-of-type:after {
    content:''!important;
    opacity:.5;
}
.home-slider .slider-nav a:hover span,
.home-slider .slider-nav a.slick-current span {
    opacity:1;}
.home-slider .dots {
    width: 45%;
    position: absolute;
    top: 0;
    right: 0;
}
.home-slider .slick-dots {
    position: absolute;
    width: auto;
    left: 24%;
    top: 14vh;
}
.home-slider .slick-dots li {
    border: none;
    background: none;
    margin: 0 4px;
}
.home-slider .slick-dots li button {
    font-family: "adelle",serif;
    font-size: 14px;
    height: auto;
    width: auto;
    display: inline-block;
    color: rgba(255,255,255,0.5);
    cursor: pointer;
    margin: 0;
    padding: 0;
    border: none;
    /*outline: none;*/
    background: none;
    transition: all .3s ease;
}
.home-slider .slick-dots li.slick-active button,
.home-slider .slick-dots li button:hover {
    background: none;
    color: rgba(255,255,255,1);
}
.home-slider .slick-dots li button:before {content: '0';}
.home-slider .slick-dots li button:after {
    content: '.';
    display: inline-block;
    margin-left: 8px;
    color: rgba(255,255,255,0.5) !important;
}
.home-slider .slick-dots li:last-child button:after {display: none;}

/* left column */
/*
.home-slider .left-col{
  -webkit-box-shadow: inset 60px 0px 49px -13px rgba(0,0,0,0.35);
  -moz-box-shadow: inset 60px 0px 49px -13px rgba(0,0,0,0.35);
  box-shadow: inset 60px 0px 49px -13px rgba(0,0,0,0.35);
}
.home-slider .left-col video,
.home-slider .left-col img {
	position: relative;
    display: block;
    height: 100%;
    position: absolute;
}
*/
.home-slider .left-col .content{
    top: 100vh;
    display: block;
    position: relative;
}
.home-slider .left-col video.bg {
    position: fixed;
    display: block;
    /*height: 100%;*/
}
.home-slider .left-col p{
    font-size:18px;
    line-height: 2;
    max-width:700px;
}
.home-slider .left-col img {
    display: block;
    position: relative;
}
.home-slider .left-col video {
    display: block;
    position: relative;
}
.home-slider .left-col .content video {
    opacity:0.222;
}
.left-col{
    background-size:cover;
    background-position:top center;
    background-repeat:no-repeat;
    width:55%;
    height:100%;
    display:inline-block;
    position:relative;
    float:left;
}
.hero-wrap{
    width:85%;
    xleft:15%;
    height:100%;
    position:absolute;
}
.hero-wrap img{
    position: absolute;
    height:100%;
}
.hero-wrap ul{
    margin:0px;
}

/* home slides */
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { transform:rotate(360deg); } }
.home-slider .slide-1 .hero-wrap .img1 {bottom:-1000px; transition: all .5s ease;}
.home-slider .slide-1 .hero-wrap.active .img1 {bottom:0px;}
.home-slider .slide-1 .hero-wrap .img2 {top:-540px; transform: rotate(40deg); transition: all .7s ease .7s;}
.home-slider .slide-1 .hero-wrap.active .img2 {top:0px; transform: rotate(0deg);}
.home-slider .slide-1 .hero-wrap .img3 {opacity: 0; transition: all 1.2s ease 1.2s;}
.home-slider .slide-1 .hero-wrap.active .img3 {opacity: 1;}
.home-slider .slide-1 .hero-wrap .burst {opacity: 0; transition: all 1.5s ease 1.5s; position: absolute; top: -40vw; left: -50vw; width: 150vw; height: auto; /*-webkit-animation:spin 10s linear infinite; -moz-animation:spin 10s linear infinite; animation:spin 10s linear infinite;*/}
.home-slider .slide-1 .hero-wrap.active .burst {opacity: 1;}

.home-slider .slide-2 .hero-wrap .img1 {left: -100%; transition: all .7s ease;}
.home-slider .slide-2 .hero-wrap.active .img1 {left:0px;}
.home-slider .slide-2 .hero-wrap .img2 {opacity: 0; transform: scale(.25); transition: all 1s ease 1s;}
.home-slider .slide-2 .hero-wrap.active .img2 {opacity: 1; transform: scale(1);}
.home-slider .slide-2 .hero-wrap .img3 {left: 100%; transition: all 1.2s ease 1.2s;}
.home-slider .slide-2 .hero-wrap.active .img3 {left:0px;}

.home-slider .slide-3 .hero-wrap .img1 {left: 100%; transition: all 1s ease 1.5s;}
.home-slider .slide-3 .hero-wrap.active .img1 {left:0px;}
.home-slider .slide-3 .hero-wrap .img2 {left:-1000px; transition: all 1s ease 1.2s;}
.home-slider .slide-3 .hero-wrap.active .img2 {left:0px;}
.home-slider .slide-3 .hero-wrap .img3 {bottom:-1000px; transition: all .5s ease;}
.home-slider .slide-3 .hero-wrap.active .img3 {bottom:0px;}
.home-slider .slide-3 .hero-wrap .img4 {bottom:-1000px; transition: all .7s ease .7s;}
.home-slider .slide-3 .hero-wrap.active .img4 {bottom:0px;}
.home-slider .slide-3 .hero-wrap .img5 {bottom:-1000px; transition: all 1s ease 1s;}
.home-slider .slide-3 .hero-wrap.active .img5 {bottom:0px;}

.home-slider .left-col .mission-mobile-bg {
    display:none;
}

/* right column */
.right-col{
    width:45%;
    height:100%;
    display:inline-block;
    position:fixed;
    float:right;
    background-repeat:no-repeat;
    background-size:cover;
}
.home-slider .right-col {
    background-image:url('https://missionagency.com/images/gray-bg.png');
    z-index: 3;
    right:-2px;
}
.home-slider .right-col .mobile-logo {
    display:none;
}
.top .mobile-logo {
    display:none;
}
.right-col .numbers{
    position: absolute;
    top: 23%;
    z-index: 2;
    margin: 0 auto;
    left: 0;
    right: 0;
    width: 60%;
}
.right-col .numbers ul {
    position: relative;
    left:7%;
    font-size:12px;
    font-family: "adelle",serif;
}
.right-col .numbers ul li {
    display:inline-block;
    float: left;
    color:#545150;
}
.right-col .numbers ul li:after {
    content:".";
    margin:0px 7px;
    display:inline-block;
}
.right-col .numbers ul li:last-of-type:after {
    content:"";
    margin:0px;
}
.right-col .desc {
    border: 1px solid rgba(255,255,255,0.25);
    margin: 0 auto;
    left: 0;
    right: 0;
    width: 64%;
    position: absolute;
    z-index: 2;
    bottom: 17%;
    min-height: 350px;
    min-width: 300px;
}
.home-slider .right-col .desc .watch-reel {
    position: absolute;
    z-index:3;
    right: 0;
    top: -40px;
}
.home-slider .right-col .desc .watch-reel a {
    font-family: Visby-Bold;
    text-transform: uppercase;
    color: #FEE12F;
    letter-spacing: 1px;
    /*padding-right:25px;
    background-image:url('../images/watch-reel-play.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position:bottom right;*/
}
.home-slider .right-col .desc .watch-reel a:hover {
    color: #FFFFFF;
}
.home-slider .right-col .desc .watch-reel img {
    width: 18px;
    position: relative;
    top: 2px;
    transition: all .3s ease 0s;
}
.home-slider .right-col .desc .watch-reel a:hover img {
    filter: brightness(0) invert(1);
}
.right-col .desc .copy{
    position: absolute;
    top: -34px;
    left: -8%;
    max-width:400px;
}
.slick-current .right-col .copy {
    -webkit-animation-name: home-copy; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 4.8s; /* Safari 4.0 - 8.0 */
    animation-name: home-copy;
    animation-duration: 4.8s;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes home-copy {
    0%   {left:-50%; top:-34px;}
    5%  {left:-12%; top:-34px;}
    8%  {left:-10%; top:-34px;}
    10%  {left:-8%; top:-34px;}
    100%  {left:-8%; top:-34px;}
}

/* Standard syntax */
@keyframes home-copy {
    0%   {left:-50%; top:-34px;}
    5%  {left:-12%; top:-34px;}
    8%  {left:-10%; top:-34px;}
    10%  {left:-8%; top:-34px;}
    100%  {left:-8%; top:-34px;}
}
.right-col .desc h4 {
    /*
	position: absolute;
    top: -34px;
    left: -9%;
*/
    color: #ffffff;
    font-size: 55px;
    line-height: 62px;
    width: 500px;
}
.right-col .desc h2 {
    font-size: 22px;
    line-height: 38px;
    color: white;
    margin-top: 30px;
}
.right-col .desc .btn{
    position: absolute;
    /*right: 16px;*/
    right:auto;
    left:0;
    margin-top: 50px;
    padding: 0px 37px;
    font-size: 16px;
    text-transform:uppercase;
    height:50px;
}
.right-col .desc .btn:hover{
    color:#5A5959;
}
.right-col .desc .options {
    margin-left: 41%;
    bottom: 8px;
    position: absolute;
    padding-left: 15px;
}
.right-col .desc .options a {
    color: #fff;
    opacity: 0.5;
    font-size: 13px;
    letter-spacing: 0.5px;
    line-height: 15px;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 2px solid;
    padding-bottom: 7px;
    position:relative;
}
.right-col .desc .options a:first-of-type{
    margin-right:30px;
}
.new-normal-slide .right-col .desc .options a:first-of-type{
    margin-right:15px;
}
.right-col .desc .options a:hover{
    opacity: 1;
    cursor: pointer;
}
.right-col .desc .options .grid,
.right-col .desc .options .plus {
    padding-left: 0;
    margin-left: 0;
}
.right-col .desc .options .grid:before,
.right-col .desc .options .plus:before {
    left: -15px;
}

/* second */
.second .inner {
    display: table;
    height: 100%;
    direction: rtl;
}
.second .left-col {
    display: table-cell;
    height: 100%;
    float: none;
    vertical-align: middle;
    direction: ltr;
    width:55%;
    background-color:#ff501c;
}
.second .right-col {
    display: table-cell;
    background-image: url('https://missionagency.com/images/about-bg.jpg');
    width: 45%;
    height: 100%;
    float: none;
}
.second .right-col:after{
    display:none;
}
.left-col .desc{
    border: 1px solid rgba(255,255,255,0.25);
    margin: 0 auto;
    width: 73%;
    position: relative;
    margin-top:26%;
}
.left-col .desc h4{
    position: absolute;
    top: -10px;
    left: 7%;
    color:#ff501c;
}
.left-col .desc h1{
    font-size: 40px;
    line-height: 59px;
    color: white;
    margin: 0px 7% 0px 7%;
    position: relative;
    top: -34px;
}
.left-col .content .copy{
    position: relative;
    z-index: 2;
    width: 80%;
    margin: 0 auto;
    padding:100px 0px 300px;
}
.left-col .content .copy span{
    font-size: 16px;
    color: white;
    line-height: 20px;
    font-family: Visby-Bold;
    text-transform: uppercase;
    margin-right:25px;
}
.left-col .content .copy span:last-of-type{
    margin-right:0px;
}
.left-col .content .copy h5{
    font-size: 30px;
    color: white;
    line-height: 40px;
    margin: 0 auto;
    font-family: Visby-regular;
    margin-top:10px;
    margin-bottom:20px;
}
.left-col .content .copy .btn{
    padding: 0px 37px;
    font-size: 16px;
    margin-top: 30px;
    margin-right:15px;
    text-transform:uppercase;
    height:50px;
}
.left-col .content .copy .contact-form .btn{
    margin-top: 10px;
    margin-bottom: 40px;
}
.left-col .content .video-wrap{
    position: relative;
    display: block;
    background-color:#212721;
}
.left-col .content .video-wrap .details{
    position: absolute;
    z-index: 2;
    height: auto;
    left: 0;
    right: 0;
    top:35%;
    margin: 0 auto;
    text-align: center;
}
.left-col .content .video-wrap .details h4{
    color: white;
}
.left-col .content .video-wrap .details .btn{
    text-transform:uppercase;
    padding-left:30px;
    padding-right:30px;
    font-size:16px;
    height:50px;
}
.left-col .content .video-wrap .video-underlay {
    position: absolute;
    top: 0;
    width: 200%;
    height: 100%;
    background-color: #212721;
}
.left-col .content .video-wrap img.logo{
    width: 70%;
    max-width: 400px;
    height: auto;
    left: 0;
    right: 0;
    margin: 20px auto;
}
.left-col .content .video-wrap img.zoo{
    max-width: 500px;
}
.left-col .content .video-wrap img.stx{
    max-width: 300px;
}
.left-col .copy .thumb{
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 25vw;
    border: 4px solid white;
    margin-bottom: 30px;
}
.left-col .copy p{
    color: white;
}
.left-col .copy h2{
    color: white;
    margin-bottom: 20px;
}
.left-col .copy a.inline{
    color: #fee12f;
    text-transform:uppercase;
    font-family: Visby-Bold;
    border-bottom: 1px #fee12f solid;
    padding-bottom: 5px;
}
.left-col .copy a.inline:hover{
    color: #ffffff;
    border-bottom:1px #ffffff solid;
}
.left-col .copy h4{
    color: white;
    margin-top:100px;
    margin-bottom:25px;
}

.left-col .scroll{
    position: fixed;
    left: -45%;
    right: 0;
    margin: 0 auto;
    text-align: center;
    z-index: 3;
    bottom: 0px;
    pointer-events: none;
}
.left-col .scroll h4{
    color: white;
    margin-bottom: 12px;
}
.left-col .scroll span{
    width: 2px;
    height: 40px;
    background: white;
    display: block;
    position: relative;
    text-align: center;
    margin: 0 auto;
}
.left-col .scroll img {
    display:none;
}
.left-col img.bottom-gradient{
    position: fixed;
    bottom: 0px;
    left: 0;
    /*height: auto !important;
    width: 55% !important;*/
    height:auto;
    width:100%;
    pointer-events: none;
    z-index: 2;
}
.left-col .desc .options{
    margin-left: 7%;
    bottom: 8px;
    position: absolute;
    padding-left: 15px;
}
.left-col .desc .options a{
    color: #fff;
    opacity: 0.5;
    font-size: 13px;
    letter-spacing: 0.5px;
    line-height: 15px;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 2px solid;
    padding-bottom: 7px;
    position:relative;
}
.left-col .desc .options a:first-of-type{
    margin-right:20px;
}
.left-col .desc .options a:hover{
    opacity: 1;
    cursor: pointer;
}
.left-col .desc .options .grid,
.left-col .desc .options .plus {
    padding-left: 0;
    margin-left: 0;
}
.left-col .desc .options .grid:before,
.left-col .desc .options .plus:before {left: -15px;}
.left-col .desc hr{
    display: inline-block;
    position: relative;
    margin-left: 7%;
}
.left-col .desc p{
    margin: 20px 7% 12%;
    color:#fff;
}
.mini-nav{
    width: 62%;
    margin: 0 auto;
    color: #FEE12F;
    text-transform: uppercase;
    font-size: 13px;
    margin-top: 10%;
}
.mini-nav li{
    display: inline-block;
    float: left;
    padding-right: 25px;
    font-family:Visby-Bold;
    letter-spacing: 1px;
}
/* third */
.form{
    margin: 0 auto;
    width: 73%;
    position: relative;
    margin-top:26%;
}
.form .btn{
    margin-top: 60px;
}
.form h2{
    font: 40px 'Visby-Regular';
    letter-spacing: 0.03em;
    color:#fff;
    margin-bottom: 60px;
}
input[type=text],
input[type=email]{
    width: 65%;
    display: block;
    margin: 10px 0px;
    background: transparent;
    border: 1px solid #B9B8B8;
    padding: 10px;
    color:#fff;
    font-size:14px;
}
.form input[type=text]:focus{
    border: 1px solid white;
    /*outline: none;*/
}
/*form label{
    display: block;
    margin-bottom: 10px;
    color: #B9B8B8;
    font-size:14px;
}
form input[type=file]{
    color: #B9B8B8;
    font-size:14px;
}*/

textarea {
    width: 65%;
    display: block;
    margin: 10px 0px;
    background: transparent;
    border: 1px solid #B9B8B8;
    padding: 10px;
    color:#fff;
    font-size:14px;
}
.form textarea:focus{
    border: 1px solid #fff;
    /*outline: none;*/
}
::-webkit-input-placeholder {
    color: #B9B8B8;
    font-size:14px;
}
:-moz-placeholder {
    color: #B9B8B8;
    font-size:14px;
}
::-moz-placeholder {
    color: #B9B8B8;
    font-size:14px;
}
:-ms-input-placeholder {
    color: #B9B8B8;
    font-size:14px;
}
input:-webkit-autofill {
    color:#5b5b5b;
    background-color: #fff;
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;
}

form .requirements.error h5,
.uploads .error p,
.uploads .error h5 {
    color: #ff0000 !important;
}
.third .right-col {background-image:url('https://missionagency.com/images/gray-bg-light.png');}
.news-detail{
    background:white;
}
.right-col .news{
    margin: 0 auto;
    left: 0;
    right: 0;
    width: 60%;
    margin-top: 26%;
    position: absolute;
    z-index: 2;
}
.right-col .head{
    position:relative;
    width:100%;
}
.right-col .head h4{
    display: inline-block;
    float: left;
    color:white;
    font-size:17px;
}
.right-col .head a{
    display: inline-block;
    text-transform: uppercase;
    font-family: Visby-Bold;
    color: white;
    font-size: 13px;
    position: relative;
    right: 0px;
    top: 6px;
    float: right;
    letter-spacing: 0.5px;
}
.right-col .featured-image .thumb{
    width: 100%;
    margin: 25px 0px;
    position:relative;
    background-size: cover;
    background-repeat: no-repeat;
}
.right-col .featured-image .thumb img {
    width: 100%;
    height: auto;
}
.right-col .featured-image .thumb .overlay{
    opacity: 0;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.right-col .featured-image .thumb:hover .overlay{
    cursor: pointer;
    opacity: 0.8
}
.right-col .featured-image h2{
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    color:white;
    font-size:32px;
}
.right-col .featured-image h2:hover{
    color:#FEE12F;
}
.right-col .featured-image hr{
    display: inline-block;
    margin:15px 0px 55px 0px;
}
.right-col .careers p{
    font-size: 17px;
    color: white;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-family: Visby-Bold;
}
.right-col .careers ul{
    font-family: Visby-Bold;
}
.right-col .careers li{
    font-size: 14px;
    padding: 5px 0px 5px 15px;
    background: url(https://missionagency.com/images/plus-white.png) no-repeat left center;
    background-size: 8px 8px;
}
.right-col .careers li a{
    color: white;
}
.right-col .careers li a:hover{
    color:#FEE12F;
}
.right-col .careers a.why {
    text-transform: uppercase;
    font-family: Visby-Bold;
    color: white;
    font-size: 13px;
    position:relative;
    margin: 40px 0px 0px 15px;
    letter-spacing: 0.5px;
    display: block;
    border-bottom: 2px solid;
    padding-bottom: 7px;
    width: 170px;
    padding-left: 0;
}
.right-col a.why:hover{
    color:#FEE12F;
}
.right-col a:hover{
    color:#FEE12F;
}
.right-col .careers .plus:before{
    background-image: url("https://missionagency.com/images/plus-color.png");
    left: -15px;
}

/* LISTING PAGE
---------------------------------------------- */
/* intro */
.intro {
    background-size: cover;
    background-attachment: fixed;
}
.intro .container {
    padding: 14% 50% 5% 6%;
    z-index: 1;
    position:relative;
}
.intro h4{
    color:#fff;
    margin-bottom: 20px;
}
.intro h1{
    font-size:50px;
    line-height: 55px;
    margin-bottom:20px;
}
.intro p{
    color:#fff;
}
/* case nav */
.case-nav{
    background-image: url('https://missionagency.com/images/case-nav-bg.png');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    width: 100%;
    height: 125px;
    z-index: 1;
    position: relative;
    overflow-x: hidden;
}
.select{
    position: relative;
    padding: 0px 1% 0px 6%;
    bottom: -80px;
    width: 14%;
}
.select p{
    font-family: Visby-Bold;
    letter-spacing: 0.9px;
    font-size:14px;
    width:222px;
    position:relative;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.select p:before{
    width: 8px;
    height: 8px;
    content: " ";
    background-image: url("https://missionagency.com/images/white-arrow.png");
    position: absolute;
    right: 0px;
    top: 14px;
    background-size: contain;
    background-repeat: no-repeat;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    transform: rotate(180deg);
}
.select p:hover{
    cursor: pointer;
    color:#5A5959;
}
.select p:hover:before{
    background-image: url("https://missionagency.com/images/gray-arrow.png");
}
.select p.show:before{ /* IE 9 */ /* Chrome, Safari, Opera */
    transform: rotate(360deg);
}
.select ul{
    background: white;
    position:absolute;
    padding:20px 20px 10px 20px;
    top:38px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    opacity: 0;
}
.select ul.show{
    opacity: 1;
}
.select li{
    color:#B9B8B8;
    font-family: Visby-Bold;
    letter-spacing: 0.9px;
    padding-bottom:10px;
    font-size:14px;
    position:relative;
    left:0px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.select li:hover{
    left:10px;
    color:#5A5959;
    cursor: pointer;
}
.filter{
    position: relative;
    padding: 0px 2% 0px 1%;
    bottom: -59px;
    width: 73%;
    display: inline-block;
    float: right;
}
.filter-wrap{
    display: block;
    position: relative;
    float: right;
    width: 900px;
}
.filter p{
    display: inline-block;
    float: left;
    position: relative;
    bottom: 9px;
    padding-right: 4%;
    font-family: Visby-bold;
}
.filter ul{
    bottom: 8px;
    position: relative;
}
.filter li{
    display: inline-block;
    float: left;
    font-weight: 800;
    color: #fff;
    box-shadow: inset 0px -15px 0px -12px rgba(255,255,255,1);
    padding: 0px 10px 15px 10px;
    margin: 0px 13px;
    font-size: 14px;
    letter-spacing: 1px;
    bottom: 1px;
    position: relative;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.filter li:hover{
    cursor: pointer;
    box-shadow: inset 0px -16px 0px -5px rgba(255,255,255,1);
}
.filter li.active{
    box-shadow: inset 0px -16px 0px -5px rgba(255,255,255,1);
}
/* case */
.case{
    width: 100%;
    background-size:cover;
    background-repeat:no-repeat;
    /*   background-attachment: fixed; */
    background-position: top center;
    background-color: #fff;
    position:relative;
    overflow-x: hidden;
    display: inline-block !important;
    float: left;
    width: 50%;
}
/* Unhide if there are even amount of case studies */
/*.case:last-of-type{
	width: 100%;
}*/
.case:focus{
    outline-offset: -3px;
}

.case:hover .view-case,
.case:focus .view-case{
    transform: translateX(-100%);
}
.case .desc{
    border: 2px solid rgba(255,255,255,0.4);
    width: 35%;
    position: relative;
    z-index: 3;
    margin: 10vh 5.5%;
    height: 30vh;
    min-height: 280px;
    min-width: 530px;
}
.case .desc .h4-like{
    color: #fff;
    position: relative;
    top: -12px;
    margin-left: 5%;
}
.case .desc .h2-like{
    color: #fff;
    bottom: 1%;
    padding:0px 5% 4%;
    position: absolute;
}
.listing .case:first-child .desc {
    margin: 150px 5.5% 10vh 5.5%;
    height: calc(40vh - 150px);
}
.listing .case:nth-child(2) .desc {
    margin: 150px 5.5% 10vh 5.5%;
    height: calc(40vh - 150px);
}
.case .desc .plus {
    color: #fff;
    opacity: 1;
    font-size: 13px;
    letter-spacing: 0.5px;
    line-height: 15px;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 2px solid;
    position: absolute;
    bottom: -2px;
    left: 5%;
    text-align: right;
    padding: 0 0 7px 0;
    margin: 0;
    font-family: 'adelle',serif;
    font-size: 13px;
    font-weight: 500;
    display: none;
    transition: all .3s ease 0s;
}
.case .desc .plus:before{
    top: 4px;
    left: -15px;
    background-image: url("https://missionagency.com/images/plus-color.png");
}
.case:hover .desc .plus {color: #FEE12F;}
.view-case {
    background: rgba(254,85,47,0.85);
    position: absolute;
    left: 100%;
    top: 0;
    bottom: 0;
    height: 100%;
    padding: 0 30px;
    transform: translateX(10px);
    transition: all .3s ease 0s;
}
.view-case::before{
    content:'';
    display: block;
    position:absolute;
    z-index: 2;
    right:100%;
    top:0;
    bottom:0;
    width:100vw;
    background:rgba(0,0,0,0.5);
}
.view-case .inner {
    display: table;
    height: 100%;
    width: 100%;
}
.view-case .inner .vert {
    display: table-cell;
    height: 100%;
    width: 100%;
    vertical-align: middle;
    text-align: center;
}
.view-case .icon {
    display: inline-block;
    width: 57px;
    height: 57px;
    background: url(https://missionagency.com/images/circle-arr.png) no-repeat center center;
    background-size: cover;
    margin-bottom: 10px;
}
.view-case .label {
    text-transform: uppercase;
    color: #fff;
    font-family: 'adelle',serif;
    font-size: 18px;
    line-height: normal;
    font-weight: 500;
}

/*
.case:hover .category{
  right:0px;
}
.category{
  background: rgba(254,85,47,0.85);
  position: absolute;
  right: -1000px;
  top: 0;
  bottom: 0;
  height: 100%;
	padding: 0 30px;
  transition: all .3s ease 0s;
  -webkit-transition: all .3s ease 0s;
}
.category ul{
  position:absolute;
  right:0px;
  top:15%;
}
.category li{
  position:relative;
  right:-1000px;
  opacity: 0;
  font-size:17px;
  color:#fff;
  text-transform: uppercase;
  font-weight:800;
  padding-bottom:26px;
  letter-spacing: 2px;
  font-family: Visby-Bold;
}
.case .category a{
  color: #fff;
  opacity: 1;
  font-size: 13px;
  letter-spacing: 0.5px;
  line-height: 15px;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 3px solid;
  padding-bottom: 7px;
  position: absolute;
  right: -1000px;
  top: 80%;
  margin-right: 75px;
  text-align: right;
}
.case .category a:before{
	top: 4px;
	background-image: url("https://missionagency.com/images/plus-color.png");
}
.case .category a:hover{
	cursor: pointer;
}
.category li:first-child{
  transition: all .3s ease .1s;
  -webkit-transition: all .3s ease .1s;
}
.category li:nth-child(2){
  transition: all .3s ease .3s;
  -webkit-transition: all .3s ease .3s;
}
.category li:nth-child(3){
  transition: all .3s ease .5s;
  -webkit-transition: all .3s ease .5s;
}
.category li:nth-child(4){
  transition: all .3s ease .7s;
  -webkit-transition: all .3s ease .7s;
}
.category li:nth-child(5){
  transition: all .3s ease 0.9s;
  -webkit-transition: all .3s ease 0.9s;
}
.category a{
  transition: all .3s ease 1.1s;
  -webkit-transition: all .3s ease 1.1s;
}
.case:hover .category li{
  right: 0px;
  opacity: 1;
  text-align: right;
  padding-right: 75px;
}
.case:hover .category a{
  right: 0px;
  opacity: 1;
  text-align: right;
}
.case .category li span{
  background: white;
  opacity: 0.25;
  width: 28px;
  height: 3px;
  display: block;
  position: absolute;
  right: 0px;
  bottom: 32px
}
*/

/* PROJECT DETAIL
---------------------------------------------- */
.header {
    background-size:cover;
    background-position: bottom center;
    position: relative;
}
.header h1{
    padding:300px 30px;
    text-align: center;
}
.project-detail {background: #fff;}
.project-detail .page-hdr {
    height: 680px;
}
.project-detail .page-hdr h1 {
    max-width: 900px;
    margin: 0 auto;
}
.project-detail .page-hdr h4 {
    padding-bottom:30px;
}
.project-detail .back {
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.project-detail .back:hover {
    color:#FEE12F;
}
.project-detail .wysiwyg {
    width:900px;
    margin: 0 auto;
    display:block;
    position:relative;
    z-index: 2;
    padding-bottom:60px;
}
.project-detail .triangle-overlay {
    position: absolute;
    bottom: -1px;
    width: 100%;
    font-size: 0;
    left: 0;
    z-index: 2;
}
.project-detail .triangle-overlay img {width: 105%;}
.project-detail .wysiwyg .img-top {
    width:100%;
    height:auto;
    padding-bottom: 50px;
    margin-top: -110px;
}
.project-detail .wysiwyg .img-top img {
    width:100%;
    height:auto;
}
.project-detail .wysiwyg .copy {
    padding:0px 8% 20px;
}
.project-detail .wysiwyg .img-body {
    text-align:center;
}
.project-detail .wysiwyg .img-body img {
    padding-bottom:30px;
    text-align:center;
}
.project-detail .wysiwyg .img-full img{
    padding-top:40px;
    /* 	padding-bottom:90px; */
}
.project-detail .wysiwyg .img-full img{
    width:100%;
    height:auto !important;
    max-width: 756px;
}
.project-detail .wysiwyg .caption {
    width: 80%;
    margin: 0 auto;
    padding-bottom:30px;
}
.wysiwyg h2 {padding-bottom: 30px;}
.wysiwyg h3 {padding-bottom: 30px;}
.wysiwyg h4 {padding-bottom: 30px;}
.wysiwyg h5 {padding-bottom: 20px;}
.wysiwyg p {padding-bottom: 30px;}
.wysiwyg .caption p {
    text-align:center;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: 0.25px;
    color: #B9B8B8;
    font-family: Visby-Regular,serif;
}
/* remove padding caused by img being wrapped in p */
.news-detail .wysiwyg p > img{
    padding-bottom: 0px;
}

/* NEWS LISTING
---------------------------------------------- */
.news .page-hdr {background-attachment: fixed;height: 700px;}
.news .page-hdr:after {background: #1e1e1e;}
.news .project-detail .page-hdr:after {background: white;}
.news-listing {background: #1e1e1e;}
.news-listing .group{
    width:1030px;
    margin:0 auto;
    position:relative;
    display:block;
    height:100%;
    padding-top: 70px;
}
.news-listing a{
    display:block;
    margin-bottom: 100px;
}
.news-wrap{
    opacity: 0;
    bottom:-30px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    position: relative;
    z-index: 3;
}
.news-wrap.load{
    opacity: 1;
    bottom:0px;
}
.news-item{
    width:100%;
    min-height:280px;
    height:auto;
    border: 1px solid rgba(255,255,255,0.25);
    background: #1e1e1e;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}
.news-wrap:hover .news-item,
.news-wrap:focus .news-item{
    background: #6B6B6B;
}
.news-item:hover{
    cursor: pointer;
}
.news-item p{
    color: #ffffff;
    padding: 50px 0px 20px 0px;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}
.news-item h2{
    color: white;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}
.news-item hr{
    background-color: #C0CCD4;
    float: left;
    margin-top: 30px;
    box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2);
}
.news-item h4,
.news-item time {
    position: absolute;
    top: -10px;
    right: 22px;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
    transition:transform 0.2s ease;
}
.news-wrap:hover .news-item h4,
.news-wrap:focus .news-item h4,
.news-wrap:hover .news-item time,
.news-wrap:focus .news-item time {
    transform:translateY(-15px);
}

.news-item .col{
    display:inline-block;
    float: left;
    position:relative;
}
.news-item .col:first-child{
    width:40%;
}
.news-item .col:last-child{
    width:60%;
    box-sizing: border-box;
    padding-right: 3%;
}
.news-item .thumb{
    height: 280px;
    width: 100%;
    background-size: cover;
    background-position: top center;
    box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2);
    position: relative;
    top: -50px;
    left: -50px;
}

/* NEWS DETAIL
---------------------------------------------- */
.news-detail .page-hdr {
    background-image:url('https://missionagency.com/images/guys.png');
    height: 500px;
}
.news-detail .page-hdr:after {background: #ffffff;}
.news-detail .page-hdr .group {
    width: 1200px;
    margin: 0 auto;
    padding-top: 100px;
    display: table;
}
.news-detail .page-hdr h1 {
    font-size: 35px !important;
    font-weight: 300;
    line-height: 1.2 !important;
    z-index: 1;
    position: relative;
    margin-bottom: 0;
    text-align: left;
}
.news-detail .page-hdr a {position: relative;}
.news-detail .back {
    color: #fff;
    margin-left: -20px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    display: inline;
}
.news-detail .page-hdr .cell-left {
    text-align: left;
    display: table-cell;
    vertical-align: bottom;
}
.news-detail .page-hdr .cell-right {
    text-align: right;
    display: table-cell;
    vertical-align: bottom;
}
.news-detail .page-hdr .cell-right h6 {
    color: #fff;
    text-transform: uppercase;
    font: 12px 'Visby-Bold';
    margin-bottom: 14px;
}
.news-detail .page-hdr .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    background: #ED522F;
    opacity: 0.8;
    width: 100%;
    height: 100%;
}
.news-detail .header{
    height: 600px;
}
.news-detail h1{
    font-size: 50px;
    z-index: 1;
    position: relative;
    padding: 40px 20px 60px 20px;
}
.news-detail .back{
    color: #fff;
    margin: 0px 20px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    display: inline;
}
.left-arrow{
    background-image: url("https://missionagency.com/images/left-arrow.png");
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    height: 12px;
    width: 12px;
    margin-right: 10px;
    display: inline-block;
}
.news-detail .back:hover{
    color:#FEE12F;
}
.news-detail .col-container{
    width: 1200px;
    margin: 0 auto;
    position: relative;
    display: block;
    height: 100%;
    top: -100px;
    z-index: 2;
}
.news-detail .col{
    display:inline-block;
    float: left;
    position:relative;
}
.news-detail .col:first-child{
    width: 70%;
    margin-right: 10%;
}
.news-detail .col:last-child{
    width:20%;
}
.news-detail .thumb img {
    width: 100%;
    height: auto;
}
.news-detail .social {font-size: 0;}
.news-detail .social a {
    display: inline-block;
    background: #FE552F;
    color: #fff;
    width: 21px;
    padding: 2.5px 0;
    text-align: center;
    font-size: 16px;
    line-height: 1;
    margin-right: 10px;
}
.news-detail .social a:hover {
    background: #ccc;
    color: #fff;
}
.news-detail .wysiwyg {
    margin: 0 auto;
    display: block;
    position: relative;
}
.news-detail .wysiwyg p {color: #5A5959;}
.news-detail .wysiwyg a {color: #FE552F;}
.news-detail .wysiwyg a:hover{
    color:#5A5959;
}
.wysiwyg a:focus{
    outline: auto;
    outline-color:#ff501c;
}
.news-detail .triangle-overlay{
    position: absolute;
    bottom: -1px;
    width: 100%;
    font-size: 0;
    left: 0;
    z-index: 2;
}
.news-detail .triangle-overlay img{
    width:105%;
}
.news-detail .wysiwyg img{
    max-width:100% !important;
    height:auto !important;
    padding-bottom: 50px;
}
.news-detail .wysiwyg h2{
    padding: 0px 0px 30px 0px;
}
.news-detail .wysiwyg h3{
    padding: 0px 0px 30px 0px;
}
.news-detail .wysiwyg h4{
    padding: 0px 0px 30px 0px;
}
.news-detail .wysiwyg h5{
    padding: 0px 0px 30px 0px;
}
.news-detail .wysiwyg p{
    padding: 0px 0px 30px 0px;
}
.left{
    display:inline-block;
    float: left;
    padding-top:50px;
    width:20%;
}
.left .social > div {
    background-size:86px 42px;
}
.left .social .twitter{
    background-position-x: -32px;
}
.left .social .linkedin{
    background-position-x: -65px;
}
.left .social > div:hover{
    cursor: pointer;
    background-position-y: -21px;
}
.right{
    display: inline-block;
    float: right;
    padding:50px 0 140px 0;
    width:75%;
}
.left p{
    font-size:13px;
    line-height: 20px;
}
.left p:last-of-type{
    color:#B9B8B8;
}
.share h4{
    color:#B9B8B8;
    font-size:12px;
    margin:30px 0px 10px 0px;
}
.author{
    background-size:cover;
    background-repeat:no-repeat;
    background-position: top center;
    height:151px;
    width:100%;
    max-width: 150px;
    margin-bottom: 15px;
    border:1px solid #B9B8B8;
}
.social > div{
    width: 21px;
    height: 21px;
    background-repeat: no-repeat;
    background-position: top center;
    display: inline-block;
    float: left;
    background-size: 124px 61px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.social .facebook{
    background-image: url("https://missionagency.com/images/social-sprite.png");
    background-position-x: 0px;
}
.social .twitter{
    background-image: url("https://missionagency.com/images/social-sprite.png");
    background-position-x: -46px;
    margin:0px 10px;
}
.social .linkedin{
    background-image: url("https://missionagency.com/images/social-sprite.png");
    background-position-x: -93px;
}
.social > div:hover{
    cursor: pointer;
    background-position-y: -30px;
}
.social .linkedin:hover{
    background-position-y: -31px;
}
.social > div:active{
    opacity: 0.5;
}
.social-light > div {
    width: 21px;
    height: 21px;
    background-repeat: no-repeat;
    background-position: top center;
    display: inline-block;
    background-size: 86px 42px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.social-light .facebook{
    background-position-x: 0;
    background-image: url("https://missionagency.com/images/social-sprite-light.png");
}
.social-light .twitter{
    background-position-x: -32px;
    background-image: url("https://missionagency.com/images/social-sprite-light.png");
    margin: 0 10px;
}
.social-light .linkedin{
    background-position-x: -65px;
    background-image: url("https://missionagency.com/images/social-sprite-light.png");
}
.social-light > div:hover{
    cursor: pointer;
    background-position-y: -21px;
}
.recent h4{
    color:#fff;
    margin-bottom: 35px;
}
.recent .thumb {
    margin: 20px 0px 5px 0px;
    position:relative;
}
.recent .thumb .overlay {
    opacity: 0;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.recent .thumb:hover .overlay {
    cursor: pointer;
    opacity: 0.8
}
.recent p {
    color:#FE552F;
    line-height: 24px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.recent p:hover{
    cursor: pointer;
    color:#5A5959
}
.right .share .social > div{
    width: 30px;
    height:30px;
}
.right .tags{
    display:block;
    width:100%;
    margin-bottom: 40px;
}
.right .tags a {display: block;}
.right .tags li {
    display: inline-block;
    margin: 10px 10px 0 0;
}
.right .tags h4{
    display: inline-block;
    font-size: 12px;
    color: #C0CCD4;
    border: 2px solid #C0CCD4;
    padding: 8px;
    opacity: 0.5;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.right .tags h4:hover{
    opacity: 1;
}
.right .tags h4:active{
    opacity: 1;
    color:white;
    background:#C0CCD4;
}
.post{
    width:100%;
    min-height:270px;
    height:auto;
    position:relative;
    border: 1px solid rgba(185, 184, 184, 0.25);
}
.post .title{
    font-size: 12px;
    color: #B9B8B8;
    position: absolute;
    top: -9px;
    left: 20px;
}
.post h2{
    font-size: 18px;
    color: #FE552F;
    line-height:1.3;
}
.post p{
    font-size: 13px;
}
.post p:first-of-type{
    color:#C0CCD4;
}
.post p:last-of-type{
    padding-top:8px;
}
.news-detail .post .col{
    display:inline-block;
    float: left;
    position:relative;
    margin-right:0px;
}
.post .col:first-child{
    width:40%;
}
.post .col.pic{
    width:30%;
    box-sizing: border-box;
    padding-left: 20px;
}
.post .col.text{
    width:60%;
    padding: 8% 5% 40px 5%;
}
.post .thumb{
    width: 100%;
    background-size: cover;
    background-position: top center;
    margin-top: 35px;
    position: relative;
}
.post a {
    color: #FE552F;
    font-size: 13px;
    letter-spacing: 0.5px;
    line-height: 15px;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 3px solid;
    padding-bottom: 7px;
    position: absolute;
    bottom: -2px;
    left: 36.6%;
    font-family: visby-bold;
}
.post a:before{
    background-image: url("https://missionagency.com/images/plus-orange.png");
}
.post a:hover{
    color:#5A5959;
}
.post a:hover:before{
    background-image: url("https://missionagency.com/images/plus-gray.png");
}

/* CASE-STUDY
---------------------------------------------- */
.case-study {position: relative; z-index: 1;/* overflow-x: hidden; */}
.case-study.dreamworks{overflow-x:hidden;}
.case-study .caption {
    font-size: 12px;
    line-height: 14px;
    color:#5A5959;
    font-family: 'adelle',serif;
    padding:6px 0px;
}
.case-study .caption .item:after{
    content: '/';
    padding-left:10px;
    padding-right:10px;
}
.case-study .about {
    position: relative;
    background: #202020;
    padding-bottom: 50px;
    margin-top: 115vh;
}
.case-study .top-slant {
    content: '';
    display: block;
    position: absolute;
    background: #202020;
    top: -15vh;
    transform-origin: right top;
    transform: skewY(3deg);
    height: 30vh;
    width: 100%;
    opacity: 0.8;
}
.case-study .btm-slant {
    content: '';
    display: block;
    position: absolute;
    background: #202020;
    top: 0;
    transform-origin: left top;
    transform: skewY(-3deg);
    height: 20vh;
    width: 100%;
}
/*.case-study .about:before {
	content: '';
	display: block;
	position: absolute;
  background: #202020;
  top: -15vh;
  transform-origin: right top;
  transform: skewY(3deg);
  height: 30vh;
  width: 100%;
  opacity: 0.8;
}
.case-study .about:after {
	content: '';
	display: block;
	position: absolute;
  background: #202020;
  top: 0;
  transform-origin: left top;
  transform: skewY(-3deg);
  height: 20vh;
  width: 100%;
}*/
.case-study .about .columns {
    max-width:1183px;
    width:92%;
    margin: 0 auto;
    position:relative;
    display:block;
    padding:0 0px 30px 0px;
    z-index: 1;
}
.case-study .about .col {
    margin-top: -6vw;
    position: relative;
}
.case-study .col:first-of-type{
    display:inline-block;
    float: left;
    width:60%;
    padding-right:10%;
}
.case-study .col:last-of-type{
    display: inline-block;
    float: left;
    width: 25%;
    border: 1px solid rgba(255, 255, 255, 0.25);
    text-align: right;
    padding: 5% 2% 2% 2%;
    position:relative;
    margin-left: -15px;
}
.case-study .about .btn-return {
    background-image: url(https://missionagency.com/images/grid-solid.png);
    width: 21px;
    height: 21px;
    top: -12px;
    right: 7%;
    display: block;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
}
.case-study .about h2{
    color:white;
    margin-bottom:20px;
}
.case-study .about p{
    color:white;
    margin-bottom: 20px;
}
.case-study .about a{
    color:white;
}
.case-study .about a:hover{
    color:#FEE12F;
}
.case-study .about .col h4{
    color: rgba(255, 255, 255, .55);
    font-size:12px;
}

.case-study .about .col:last-of-type p{
    color: white;
    font-size: 13px;
    line-height: 17px;
    margin: 5px 0px 30px 0px
}
.case-study .about .grid:before{
    background-image: url("https://missionagency.com/images/grid-solid.png");
    width: 21px;
    height: 21px;
    top: -12px;
    right: 7%;
    left:initial;
}
.about .social{
    float: right;
    margin-top: 10px;
    font-size: 0;
}
.about .social a {
    display: inline-block;
    background: #fff;
    color: #202020;
    width: 21px;
    padding: 2.5px 0;
    text-align: center;
    font-size: 16px;
    line-height: 1;
    margin-left: 10px;
}
.about .social a:hover {
    background: #ccc;
    color: #202020;
}
.case-content {
    position: relative;
    background: #fff;
    padding-top:50px;
}
.case-study .case-content .scroll-trig {
    position: relative;
    opacity: 0;
    top: 100px;
    transition: all .5s ease;
}
.case-study .case-content .scroll-trig.load {
    opacity: 1;
    top: 0;
}
.case-study .case-content .num {
    display:inline-block;
    font: 800 22px 'adelle',serif;
    letter-spacing: 1px;
    position:relative;
}
.case-study .case-content .content-block.new-chapter .num {
    top:-25px;
}
.case-study .case-content .num span {
    border: 4px solid;
    display: inline-block;
    width: 44px;
    height: 44px;
    line-height: 44px;
    border-radius: 50%;
    text-align:center;
}
.case-study .play-btn {
    margin: 0 auto;
    width: 125px;
    height: 125px;
    border-radius: 50%;
    border-width: 15px;
    border-color: rgba(255,255,255,.75);
    border-style: solid;
    text-align: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    z-index: 100;
}
.case-study .play-btn:hover {
    box-shadow: inset 125px 0px 0px #F8E71C;
}
/*.case-study .play-btn:hover {
	background-color:#F8E71C!important;
}*/
.case-study .play-btn img,
.capabilities .play-btn img{
    top: 30%;
    left: 24%;
    width:56px;
    max-width:56px;
}
.content-block {
    padding-bottom:50px;
}
.content-block.first-chapter {
    padding-top:20px;
}
.content-block.new-chapter {
    width:100%;
    margin-top:5vw;
    padding-top:0px;
    background: linear-gradient(#f2f2f2, #ffffff);
}
.content-block .wrap {
    width:100%;
    max-width:1220px;
    padding-bottom:2vw;
    margin:0 auto;
}
.content-block .content {
    display:inline-block;
    max-width:610px;
    margin-left:20px;
}
.content-block .info {
    margin-top: 1vw;
    margin-left: 25px;
    padding-left: 7%;
    padding-right: 20px;
    border-left: 2px #ececec solid;
}
.content-block .title {
    padding-top:20px;
    padding-bottom:0px;
}
.content-block .title-sub {
    padding-top:20px;
    padding-bottom:15px;
}
.content-block .paragraph {
    padding-top:15px;
    padding-bottom:20px;
}
.content-block .examples {
    padding-top:30px;
    padding-bottom:15px;
}
.content-block .underscore:after {
    content: " ";
    display: inline-block;
    background-color: #5a5859;
    width: 8px;
    height: 2px;
    margin-left: 8px;
    margin-right: 8px;
    bottom: -2px;
    border: none;
    position: relative;
}
.content-block .stat {
    float:right;
    display:inline-block;
    height:auto;
    text-align:right;
    border-right:2px #B9B8B8 solid;
    margin-top:100px;
    margin-right:30px;
    padding:0px 20px 20px;
}
.content-block .stat h4 {
    font-size:150px;
    line-height:100px;
    font-family: 'adelle',serif;
    letter-spacing:0px;
}
.content-block .stat h5 {
    font-size:16px;
    line-height:21px;
    font-weight:600;
    color:#B9B8B8;
    text-transform:uppercase;
    font-family: 'Visby-Regular',serif;
    letter-spacing:1.5px;
    padding-top:20px;
}
.content-block .stat span {
    font-size:100px;
    line-height:70px;
}
.content-block h1 {
    font-size: 40px;
    line-height: 40px;
    color: #5A5959;
    font-family: 'Visby-Regular',serif;
    font-weight: 600;
    padding-bottom:6px;
}
.content-block h2 {
    font-size: 19px;
    line-height: 23px;
    font-family: 'adelle',serif;
    font-weight: 700;
}
.content-block h3 {
    font-size: 16px;
    line-height: 24px;
    color:#5A5959;
    font-family: 'Visby-Bold',serif;
    font-weight: 600;
    display: inline-block;
}
.content-block h4 {
    font-size: 30px;
    line-height: 40px;
    color: #5A5959;
    font-family: 'Visby-Regular',serif;
    text-transform:none;
}
.content-block p {
    font-size: 16px;
    line-height: 31px;
    color:#5A5959;
    font-family: 'adelle',serif;
    font-weight: 500;
}
.stats-block {
    width:92%;
    max-width:1320px;
    margin:0px auto 50px;
    background-color: #212121;
}
.stats-block .wrap {
    width:100%;
    max-width:1200px;
    font-size:0;
    margin:0px auto;
}
.stats-block .four-col {
    width: 100%;
    vertical-align:bottom;
}
.stats-block .half-top {
    width:50%;
    display:inline-block;
}
.stats-block .half-btm {
    width:50%;
    display:inline-block;
}
.stats-block .column {
    width: 50%;
    padding-top:38px;
    display:inline-block;
    vertical-align:bottom;
    text-align:center;
}
.stats-block .divider {
    width: 2px;
    height:50px;
    background-color:#ffffff;
    margin:0px auto;
}
.stats-block h1 {
    font-weight: 600;
    letter-spacing: 1.5px;
    font-size: 60px;
    line-height: 72px;
    color: #ffffff;
    font-family: "Visby-Bold",serif;
    padding-top:20px;
}
.stats-block h2 {
    letter-spacing:1px;
    font-size: 16px;
    line-height: 20px;
    font-family: "adelle",serif;
    padding-bottom:20px;
}
.quote-block {
    width:100%;
    padding-top:30px;
    padding-bottom:50px;
}
.quote-block .box {
    width:92%;
    max-width:1070px;
    border:1px #E7E7E7 solid;
    margin:0 auto;
}
.quote-block .contain {
    padding:50px 60px 60px;
}
.quote-block .quotation-marks{
    position: absolute;
    top: 0px;
    font-size: 150px;
    font-family: 'adelle',serif;
}
.quote-block p {
    font-weight:300;
    font-size: 30px;
    line-height: 50px;
    color:#5A5959;
    font-family: "adelle",serif;
}
.quote-block h4 {
    font-size: 12px;
    line-height: 14px;
    font-family: "Visby-Bold",serif;
    padding-top:35px;
    text-transform:uppercase;
}
.quote-block .icon {
    position: absolute;
    top: 10px;
}
.slider-block {
    padding-bottom:50px;
}
.slider-block .slick-list {
    padding-top: 50px!important;
}
.slider-block .slick-slide {
    padding-left:30px;
    padding-right:30px;
    position:relative;
}
.slider-block .slick-dots {
    position:relative;
}
.slider-block .high-current {
    padding-top:50px;
}
.slider-block .low-current .slick-slide {
    top:-50px;
}
.slider-block .low-current .slick-slide.slick-current {
    top:0px;
}
.slider-block .high-current .slick-slide {
    top:0px;
}
.slider-block .high-current .slick-slide.slick-current {
    top:-50px;
}
.slider-block .slick-slide .caption {
    display:none;
}
.slider-block .slick-slide.slick-current .caption {
    display:block!important;
}
.slider-block .high-current .slick-dots {
    top:-25px;
}
.slider-block .video {
    padding-top:66.5%;
}
.slider-block img {
    width:100%;
}
.case-slider-wrap .video {
    padding-top:66.5%;
}
.case-slider-wrap .slick-dots {
    margin-top:0px;
}
.two-col {
    max-width:1260px;
    margin: 0 auto;
    padding:3% 4%;
    position:relative;
    z-index: 1;
}
.two-col img {
    display: inline-block;
    width:48%;
    float:right;
}
.two-col img:first-of-type {
    margin-right:3%;
    position:relative;
    bottom:100px;
    float:left;
}
.two-col.standard img:first-of-type {
    bottom:0px !important;
}
.two-col p {
    position: absolute;
    width: 40%;
    bottom: 15%;
    left: 6%;
    color: #B9B8B8;
    text-align: center;
    font-size:12px;
}
.full {
    width:92%;
    max-width: 1320px;
    margin: 0 auto;
    padding-bottom: 50px;
}
.full img {
    width:100%;
}
.full .video {
    width: 100%;
}
.full p {
    color: #B9B8B8;
    text-align: center;
    margin: 0 auto;
    padding: 15px 3% 50px 3%;
    text-align: center;
    font: 16px/1.8 'Visby-Regular';
    width: 50%;
}
.full.indented {
    padding-left:20%;
    box-sizing:border-box;
}
.content-block.indented {
    padding-left:28%;
    box-sizing:border-box;
}
.corner-cta:hover {
    background:#F1713E;
}
.corner-cta:hover img {
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.corner-cta {
    position:absolute;
    bottom:52px;
    right:0px;
    background:#F8E71C;
    width:60px;
    height:60px;
}
.corner-cta img {
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.split-quote {
    position: relative;
    width:92%;
    max-width: 1320px;
    margin: 0 auto;
    padding-bottom: 50px;
}
.split-quote .image {
    /*background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  height: 710px;*/
    width:100%;
    max-width: 1066px;
}
.dino-builder.split-quote .image, rx2-pros.split-quote .image {
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    height: 710px;
    width:100%;
    max-width: 1066px;
}
.split-quote .vid-quote-wrap {
    width: 100%;
    max-width: 1066px;
}
.split-quote .vid-quote-wrap .video {
    padding-top:66%;
}
.split-quote .quote-container {
    background-color: #212121;
    position: absolute;
    right: 0px;
    top: 80px;
    width: 340px;
    padding: 3%;
    text-align: left;
    box-sizing: border-box;
}
.split-quote-rev .quote-container {
    right: auto;
    left: 0;
}
.split-quote-rev .image, .split-quote-rev .vid-quote-wrap {float: right;}
.split-quote-rev .img-contain {
    float:right;
    width: 100%;
    max-width: 1066px;
}
.split-quote-rev .img-contain .image{float:none;}
.split-quote h2{
    color: #fff;
    font-size: 22px;
    line-height: 1.8;
    padding: 20px 0px;
    font-weight: 100;
}
.split-quote h4{
    color: #F8E71C;
    font-size: 19px;
    line-height: 22px;
}
.split-quote p{
    font-size: 12px;
    color: #fff;
}
.hurdle-solution {
    position: relative;
    width:92%;
    max-width: 1320px;
    margin: 0 auto 50px;
    /*padding-bottom: 50px;*/
}
.hurdle-solution .image {
    max-width:336px;
    position:absolute;
    top: 50%;
    transform: translateY(-50%);
}
.hurdle-solution.image-right .image {
    right:0px;
}
.hurdle-solution.image-left .image {
    left:0px;
}
.hurdle-solution .hurdle-solution-container {
    padding:73px;
    background-size:cover;
    background-position:center;
    background-color: #2E3192;
}
.hurdle-solution.image-right .hurdle-solution-container {
    margin-right:73px;
}
.hurdle-solution.image-left .hurdle-solution-container {
    margin-left:73px;
}
.hurdle-solution.image-right .hurdle-solution-container .col {
    padding-right:30px;
}
.hurdle-solution.image-right .hurdle-solution-container .col.empty {
    padding:0px;
}
.hurdle-solution.image-left .hurdle-solution-container .col {
    padding-left:30px;
}
.hurdle-solution.image-left .hurdle-solution-container .col.empty {
    padding-left:0px;
}
.hurdle-solution .hurdle-solution-inner-container {
    display:flex;
}
.hurdle-solution .hurdle-solution-container .col{
    float: none;
    text-align: left;
    border: none;
    margin: 0;
    display: block;
    width:39.4%;
    padding:0;
}
.hurdle-solution .hurdle-solution-container .col.empty{
    width:21.2%;
}
.hurdle-solution .hurdle-solution-container .col h4 {
    font-family: "adelle", serif;
    font-weight:500;
    color: #F8E71C;
    font-size: 30px;
    line-height: 30px;
    text-transform: none;
    margin-bottom:20px;
}
.hurdle-solution .hurdle-solution-container .col p {
    font-family: "adelle", serif;
    font-weight:400;
    color: #FFFFFF;
    font-size: 16px;
    line-height: 31px;
    text-transform: none;
}
.partial {
    width: 1320px;
    margin: 0 auto;
    padding: 0 3% 50px 3%;
}
.partial img {max-width: 1066px;}
.partial img,
.partial .video {
    float:right;
    width: 100%;
    height: auto;
}
.partial-rev img,
.partial-rev .video {float: left;}
.partial .video {
    width: 80%;
    padding-top: 53.5%;
}
.partial .video img {width: 100%;}
.partial .caption {
    float: right;
    max-width: 1065px;
    text-align: center;
    padding-top: 30px;
    width: 100%;
}
.partial .caption p {
    color: #B9B8B8;
    text-align: center;
    margin: 0 auto;
    padding: 0 3% 50px 3%;
    text-align: center;
    font: 16px/1.8 'Visby-Regular';
}
.quote{
    max-width: 1320px;
    padding: 6%;
    margin: 3% auto 6%;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    box-sizing: border-box;
    background-color: #212121;
}
.quote:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #000000;
    opacity: 0.4;
}
.quote > div {
    position: relative;
}
.quote h2{
    border: 1px solid rgba(255,255,255, 0.25);
    padding: 4%;
    color: #fff;
    line-height: 1.8;
    width: 78%;
    position: relative;
}
.quote .icon {
    position: absolute;
    top: -10px;
    left: 4%;
}
.quote .name {
    color: #fff;
    font-size: 12px;
    letter-spacing: 1px;
    font-family: 'adelle',serif;
    padding: 4% 4% 0 4%;
}
.quote .name h4 {
    color: #F8E81C;
    text-transform: uppercase;
    margin-bottom: 10px;
    font-size: 19px;
    line-height: 22px;
}
.three-col{
    width:1260px;
    margin: 0 auto;
    padding:3% 0 6% 0;
    position:relative;
}
.three-col img {
    display: inline-block;
    width:30%;
    float:left;
}
.three-col img:nth-child(2) {
    margin:0px 5%;
}
.three-col img:last-of-type {
    position:relative;
    top:-40px;
}
.case-controls {
    position:relative;
    width:100%;
}
.case-controls .tbl {
    display: table;
    width: 100%;
}
.case-controls .col {
    position:relative;
    width:50%;
    display: table-cell;
    float: none;
    padding: 0;
    height: 240px;
    vertical-align: middle;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    background-color: #5A5959;
}
.case-controls h2 {
    font-size:13px;
    line-height: 1.6;
    color:#fff;
    padding-bottom: 5px;
    border-bottom:3px solid #fff;
    text-transform: uppercase;
    display:inline;
    z-index: 1;
    position:relative;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.case-controls h2:hover {cursor: pointer;}
.case-controls .left h2:before {
    width:9px;
    height:9px;
    content: " ";
    background-image: url("https://missionagency.com/images/yellow-arrow.png");
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    left: -14px;
    top: 6px;
}
.case-controls .right h2:before {
    width:9px;
    height:9px;
    content: " ";
    background-image: url("https://missionagency.com/images/yellow-arrow.png");
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    right: -14px;
    top: 6px;
    transform: rotate(180deg);
}
.case-controls .left h2 {
    margin: 0 20% 0 10%;
    float:left;
}
.case-controls .right h2 {
    margin: 0 10% 0 20%;
    float:right;
    text-align: right;
}
.case-controls .col .overlay {
    background:#000;
    opacity: 0.5;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.case-controls .col:hover h2 {
    color:#FEE12F;
}
.case-controls .col:hover .overlay {
    cursor: pointer;
    opacity: 0.1;
}
.case-controls .col:active .overlay {
    cursor: pointer;
    opacity: 0.8;
}
.profile-controls {
    position:relative;
    width:100%;
}
.profile-controls .tbl {
    display: table;
    width: 100%;
}
.profile-controls .col {
    position:relative;
    width:50%;
    display: table-cell;
    float: none;
    padding: 0;
    height: 240px;
    vertical-align: middle;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.profile-controls h2 {
    font-size:13px;
    line-height: 1.6;
    color:#fff;
    padding-bottom: 5px;
    border-bottom:3px solid #fff;
    text-transform: uppercase;
    display:inline;
    z-index: 1;
    position:relative;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.profile-controls h2:hover {cursor: pointer;}
.profile-controls .left h2:before {
    width:9px;
    height:9px;
    content: " ";
    background-image: url("https://missionagency.com/images/yellow-arrow.png");
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    left: -14px;
    top: 6px;
}
.profile-controls .right h2:before {
    width:9px;
    height:9px;
    content: " ";
    background-image: url("https://missionagency.com/images/yellow-arrow.png");
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    right: -14px;
    top: 6px;
    transform: rotate(180deg);
}
.profile-controls .left h2 {
    margin: 0 20% 0 10%;
    float:left;
}
.profile-controls .right h2 {
    margin: 0 10% 0 20%;
    float:right;
    text-align: right;
}
.profile-controls .col .overlay {
    background:#000;
    opacity: 0.5;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.profile-controls .col:hover h2 {
    color:#FEE12F;
}
.profile-controls .col:hover .overlay {
    cursor: pointer;
    opacity: 0.1;
}
.profile-controls .col:active .overlay {
    cursor: pointer;
    opacity: 0.8;
}
.grid-icon {
    width:52px;
    height:52px;
    background-image: url("https://missionagency.com/images/circle-grid.png");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: 0px;
    right:0;
    margin:0 auto;
    z-index: 2;
    top:42%;
}
.case-study .case-slider-wrap {
    width: 100%;
    box-sizing: border-box;
    padding: 0 4%;
    margin-bottom: 40px;
    display: none;
}
.case-study .case-slider {overflow: hidden;}
.case-study .case-slider img {
    width: 100%;
}
.case-study .slider-caption {text-align: center;}
.case-study .slider-caption p {
    color: #B9B8B8;
    text-align: center;
    font: 15px/1.6 'Visby-Regular';
}
.case-study .pic {
    position:relative;
}
.case-img-two {
    display: table;
    width: 1320px;
    margin: 0 auto;
    padding-bottom: 50px;
    position: relative;
}
.case-img-two .pic {
    display: table-cell;
    width: 48%;
    vertical-align: bottom;
}
.case-img-two .pic:first-child {padding-bottom: 50px;}
.case-img-two .pic img {
    width: 100%;
    height: auto;
}
.case-img-two .divider {
    display: table-cell;
    width: 4%;
}
.case-img-two .pic.has-caption {padding-bottom: 0;}
.case-img-two .pic p {
    color: #B9B8B8;
    text-align: center;
    font: 14px/1.6 'Visby-Regular';
    padding-top: 20px;
}
.case-img-two .video {padding-top: 67%;}
.case-img-three {
    display: table;
    width: 1320px;
    margin: 0 auto;
    padding-bottom: 50px;
    position: relative;
}
.case-img-three .pic {
    display: table-cell;
    width: 30%;
    vertical-align: bottom;
}
.case-img-three .pic:first-child {padding-bottom: 50px;}
.case-img-three .pic img {
    width: 100%;
    height: auto;
}
.case-img-three .divider {
    display: table-cell;
    width: 5%;
}
.case-img-rev .pic:first-child {padding-bottom: 0;}
.case-img-two.case-img-rev .pic:last-child {padding-bottom: 50px;}
.case-img-three.case-img-rev .pic:last-child {padding-bottom: 50px;}
.case-img-three.case-img-dec {
    padding-top:40px;
}
.case-img-three.case-img-dec .pic {
    vertical-align:top;
}
.case-img-three.case-img-dec .pic {
    padding-top:40px;
}
.case-img-three.case-img-dec .pic:first-of-type {
    padding-top:0px;
}
.case-img-three.case-img-dec .pic:last-of-type {
    padding-top:80px;
}
.case-img-three.case-img-dec .pic .paragraph {
    padding:25px 0px 30px;
}
.case-img-three.case-img-dec .pic .paragraph p {
    color:#9B9B9B;
    font-size:18px;
    line-height:34px;
}
.case-img-three.case-img-dec .pic .base-border {
    height:1px;
    width:60px;
    background-color:#D6D6D6;
}
.case-slider .paragraph {
    padding-top:15px;
}
.case-slider .paragraph p {
    color:#9B9B9B;
}
.case-img-top {margin-top: -100px !important;}
.case-img-top .pic:first-child {padding-bottom: 100px;}
.case-split-pic {
    margin: 0 auto;
    padding-bottom: 40px;
    text-align: center;
}
.case-split-pic img {
    max-width: 100%;
    height: auto;
    display: inline-block;
}
.case-split-pic .group {
    max-width: 1440px;
    margin: 0 auto;
}
.case-split-pic .caption {
    float: right;
    max-width: 1065px;
    width: 65%;
    text-align: center;
    padding: 30px 6% 0 0;
}
.case-split-pic .caption p {
    color: #B9B8B8;
    text-align: center;
    margin: 0 auto;
    padding: 0 3% 50px 3%;
    text-align: center;
    font: 16px/1.8 'Visby-Regular';
}
.case-split-pic .caption-left {
    max-width: 1440px;
    margin: 0 auto;
}
.case-split-pic .caption-left p {
    color: #B9B8B8;
    text-align: center;
    margin: 0 auto;
    padding: 0 9% 50px 9%;
    text-align: center;
    font: 16px/1.8 'Visby-Regular';
    width: 60%;
    float: left;
    margin-top: -6%;
}
.case-study .ipad-slider-wrap {padding-bottom: 80px;}
.case-study .ipad-slider-wrap .int {position: relative;}
.case-study .ipad-slider-wrap .bg-img {
    padding: 0;
    width: 100%;
    height: auto;
}
.case-study .ipad-slider-wrap .slider-wrap {
    position: absolute;
    background: #fafafa;
    width: 63.25%;
    height: 70.5%;
    top: 12.5%;
    left: 18.75%;
    overflow: hidden;
}
.case-study .ipad-slider-wrap .caption p {
    color: #B9B8B8;
    text-align: center;
    margin: 0 auto;
    padding: 30px 3% 0 3%;
    text-align: center;
    font: 16px/1.8 'Visby-Regular';
    width: 50%;
}
.view-profile:hover:after {
    content: " ";
    background-image: url("https://missionagency.com/uploads/image/casestudies/icons/view-flag.png");
    background-size: contain;
    background-repeat: no-repeat;
    width:28px;
    height:40px;
    position: absolute;
    left:44px;
}
/* custom case study styles */
/* dreamworks */
.case-study.dreamworks .about,
.case-study.dreamworks .about:before,
.case-study.dreamworks .about:after,
.case-study.dreamworks .split-quote .quote-container {background: #6E1195;}
.case-study.dreamworks .about .social a {color: #6E1195;}
.case-study.dreamworks .hdr-wrap,
.case-study.dreamworks .about,
.case-study.dreamworks .about .columns {
    margin-bottom: 0;
    /* 	padding-bottom: 0; */
}
.case-study.dreamworks .case-content {padding-top: 0;}
.case-study.dreamworks .slider-wrap {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-image: url(https://missionagency.com/uploads/image/casestudies/dreamworks/ipad-slider-bg.png);
}
.case-study.dreamworks .slider-wrap .ipad-slider {
    margin-top: 16%;
    position: relative;
    height: 84%;
}
.case-study.dreamworks .ipad-slider .slick-track {height: 100%;}
.case-study.dreamworks .slick-arrow {
    position: absolute;
    font-size: 0;
    margin: 0;
    padding: 0;
    z-index: 10;
    border: none;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-color: transparent;
}
.case-study.dreamworks .troll-slider .slick-arrow {
    top: 43.5%;
    width: 6%;
    height: 13%;
}
.case-study.dreamworks .troll-slider .slick-prev {
    left: 0;
    background-image: url(https://missionagency.com/uploads/image/casestudies/dreamworks/troll-ipad-prev.png);
}
.case-study.dreamworks .troll-slider .slick-next {
    right: 0;
    background-image: url(https://missionagency.com/uploads/image/casestudies/dreamworks/troll-ipad-next.png);
}
.case-study.dreamworks .dragon-slider .slick-arrow {
    top: 26%;
    width: 9%;
    height: 48%;
}
.case-study.dreamworks .dragon-slider .slick-prev {
    left: 0;
    background-image: url(https://missionagency.com/uploads/image/casestudies/dreamworks/dragon-ipad-prev.png);
}
.case-study.dreamworks .dragon-slider .slick-next {
    right: 0;
    background-image: url(https://missionagency.com/uploads/image/casestudies/dreamworks/dragon-ipad-next.png);
}
.case-study.dreamworks .full {margin-bottom: 40px;}
.case-study.dreamworks .full-trolls {background: #6E1195;}
.case-study.dreamworks .full-trolls img {
    display: block;
    padding-bottom: 0;
    margin-bottom: 40px;
}
.case-study.dreamworks .split-quote {margin-bottom: 80px;}
.case-study.dreamworks .dino-builder .image {
    position: relative;
    height: auto;
    width: 100%;
    max-width: 1066px;
}
.case-study.dreamworks .dino-builder img {
    max-width: 100%;
    height: auto;
    position: absolute;
}
.case-study.dreamworks .dino-builder .bg {
    position: relative;
    z-index: 0;
    opacity: 1 !important;
}
.case-study.dreamworks .dino-builder .img-1 {
    z-index: 1;
    top: -100vw;
    left: -100vw;
}
.case-study.dreamworks .dino-builder .img-2 {
    z-index: 2;
    top: 50vw;
    left: 100vw;
}
.case-study.dreamworks .dino-builder .img-3 {
    z-index: 3;
    top: 0;
    left: 100vw;
}
.case-study.dreamworks .dino-builder .img-4 {
    z-index: 4;
    top: 50vw;
    left: -100vw;
}
.case-study.dreamworks .dino-builder .img-5 {
    z-index: 5;
    top: -50vw;
    left: 100vw;
}
.case-study.dreamworks .dino-builder img.load {
    top: 0;
    left: 0;
}
.case-study.dreamworks .split-elves .img-container {
    max-width: 1060px;
    position: relative;
}
.case-study.dreamworks .split-elves .img-container img {
    width: 100%;
    height: auto;
    display: block;
}
.case-study.dreamworks .split-elves .quote-container {top: 200px;}
.case-study.dreamworks .sprite {
    position: absolute;
    top: 0; right: 1.5%;
    width: 40%;
    margin: -2% auto 0 auto; /* positioning tweak */
}
.case-study.dreamworks .sprite:before {
    content: "";
    display: block;
    padding-top: 136.75%;
}
.case-study.dreamworks .elves {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background:  url(https://missionagency.com/uploads/image/casestudies/dreamworks/sprite.png) no-repeat 0 0%;
    background-size: 100%;
    -webkit-animation: sprite 1s .8s steps(10) infinite;
    animation: sprite 1s .8s steps(10) infinite;
}
@-webkit-keyframes sprite {
    from { background-position: 0 0%; }
    to { background-position: 0 111.1%; }
}
@keyframes sprite {
    from { background-position: 0 0%; }
    to { background-position: 0 111.1%; }
}
.case-study.dreamworks .partial {margin-bottom: 40px;}
.case-study.dreamworks .case-img-two,
.case-study.dreamworks .case-img-three {margin-bottom: 40px;}
.case-study.dreamworks .case-slider-wrap {margin-bottom: 40px;}

/* baltimores promise */
/*.case-study.baltimore .about,
.case-study.baltimore .about:before,
.case-study.baltimore .about:after,
.case-study.baltimore .split-quote .quote-container {background: #6FAB43;}
.case-study.baltimore .about .social a {color: #6FAB43;}*/

/* brewer's art */
.case-study.brewers-art .about,
.case-study.brewers-art .top-slant,
.case-study.brewers-art .btm-slant,
.case-study.brewers-art .split-quote .quote-container {
    background-color: #302F2F!important;
}
.case-study.brewers-art .case-content .quote:before {display:none;}

/* stx hockey */
.case-study.stx-hockey .case-content {padding-top: 0;}
.case-study.stx-hockey .about,
.case-study.stx-hockey .about:before,
.case-study.stx-hockey .about:after,
.case-study.stx-hockey .split-quote .quote-container {background: #00AADA;}
.case-study.stx-hockey .about .social a {color: #00AADA;}
.case-study.stx-hockey .rx2-hands {
    background: url(https://missionagency.com/uploads/image/casestudies/stx-hockey/rx2-hands-bg.png) no-repeat center center;
    background-size: cover;
    margin-bottom: 40px;
}
.case-study.stx-hockey .rx2-hands {text-align: center;}
.case-study.stx-hockey .rx2-hands .fade-slider .slick-prev {display: none !important;}
@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-20px);
    }
    60% {
        transform: translateY(-5px);
    }
}
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-20px);
    }
    60% {
        transform: translateY(-5px);
    }
}
.case-study.stx-hockey .rx2-hands .fade-slider .slick-next {
    width: 7vw;
    height: 4vw;
    max-width: 97px;
    display: block;
    font-size: 0;
    border: none;
    cursor: pointer;
    opacity: 1;
    transition: transform .4s ease-in-out;
    background: url(https://missionagency.com/uploads/image/casestudies/stx-hockey/btn-rotate.png) no-repeat center center;
    background-size: contain;
    -webkit-animation: bounce 1.8s infinite;
    animation: bounce 1.8s infinite;
    position: absolute;
    bottom: 2%;
    left: 50%;
    margin-left: -3.5vw;
}
.case-study.stx-hockey .rx2-booth-bg {
    position: relative;
    background: url(https://missionagency.com/uploads/image/casestudies/stx-hockey/rx2-booth-bg.png) no-repeat center center;
    width: 100%;
    height: 56.25vw;
    background-size: cover;
}
.case-study.stx-hockey .rx2-booth img {
    position: absolute;
    top: 0;
    right: -100%;
    height: 100%;
    width: auto;
    transition: right .8s ease .5s;
    padding-bottom: 0;
}
.case-study.stx-hockey .rx2-booth img.load {right: 0;}
.case-study.stx-hockey .rx2-booth .caption {margin-top: 40px;}
.case-study.stx-hockey .rx2-pros .image {
    width: calc(100% - 250px);
    height: auto;
    max-width: 1068px;
    max-height: 628px;
    position: relative;
    overflow: hidden;
}
.case-study.stx-hockey .rx2-pros .bg {
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1;
}
.case-study.stx-hockey .rx2-pros .names {
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
}
.case-study.stx-hockey .rx2-pros .player {
    width: auto;
    height: 100%;
    position: absolute;
    top: 0;
    left: -100%;
}
.case-study.stx-hockey .rx2-pros .player-1 {
    z-index: 4;
    transition: left .8s ease-in-out .5s;
}
.case-study.stx-hockey .rx2-pros .player-1.load {left: -4%;}
.case-study.stx-hockey .rx2-pros .player-2 {
    z-index: 3;
    transition: left .8s ease-in-out 1s;
}
.case-study.stx-hockey .rx2-pros .player-2.load {left: 20%;}
.case-study.stx-hockey .rx2-pros .player-3 {
    z-index: 2;
    transition: left .8s ease-in-out 1.5s;
}
.case-study.stx-hockey .rx2-pros .player-3.load {left: 34%;}
.case-study.stx-hockey .rx2-pros .quote-container {
    z-index: 10;
    top: 5vw;
}
.case-study.stx-hockey .sketch {
    width: 100%;
    height: 30vw;
    max-height: 420px;
    overflow: hidden;
}
.case-study.stx-hockey .sketch video {
    width: 100%;
    border: none;
    float: none;
    top: inherit;
    opacity: 1;
}

/* stx lacrosse */
.case-study.stx-lacrosse .about,
.case-study.stx-lacrosse .about:before,
.case-study.stx-lacrosse .about:after,
.case-study.stx-lacrosse .split-quote .quote-container {background: #FF0000;}
.case-study.stx-lacrosse .about .social a {color: #FF0000;}
.case-study.stx-lacrosse .hammer-quote {text-align: center;}
.case-study.stx-lacrosse .hammer-quote img {max-height: 100%; width: auto;}

/* neirmann weeks */
.case-study.niermann .about,
.case-study.niermann .about:before,
.case-study.niermann .about:after,
.case-study.niermann .split-quote .quote-container {background: #A9BE82;}
.case-study.niermann .about .social a {color: #A9BE82;}

/* casey cares */
.case-study.casey-cares .about,
.case-study.casey-cares .about:before,
.case-study.casey-cares .about:after,
.case-study.casey-cares .split-quote .quote-container {background: #EC6851;}
.case-study.casey-cares .about .social a {color: #EC6851;}

.case-study .full-top .video {
    padding-bottom: 0;
    display: block;
    top: -3vw;
    position: relative;
}

/* zoo */
/*.case-study.maryland-zoo .about,
.case-study.maryland-zoo .about:before,
.case-study.maryland-zoo .about:after,
.case-study.maryland-zoo .split-quote .quote-container {background: #FF8400;}
.case-study.maryland-zoo .about .social a {color: #FF8400;}
.case-study.maryland-zoo .vid-quote-wrap .video {padding-top: 66%;}
.case-study.maryland-zoo .split-vid {
	max-width: 1440px;
	width: 100%;
	box-sizing: border-box;
	margin: 0 auto;
	padding-bottom: 40px;
}
.case-study.maryland-zoo .split-vid .video-wrap {
	width: 74%;
	padding: 0 4%;
	float: left;
}
.case-study.maryland-zoo .split-vid .video {
	width: 100%;
	padding-top: 66.5%;
}
.case-study.maryland-zoo .split-vid .img-right {
	float: right;
	max-width: 18%;
	padding-top: 4%;
}
.case-study.maryland-zoo .split-vid .img-right img {
	width:100%;
}
.case-study.maryland-zoo .split-vid .img {
	max-width: 100%;
	height: auto;
}*/

/* nike */
.case-study.nike .about,
.case-study.nike .about:before,
.case-study.nike .about:after,
.case-study.nike .split-quote .quote-container {background: #D0AC49;}
.case-study.nike .about .social a {color: #D0AC49;}
.case-study.nike .case-content {padding-top: 0;}
.case-study.nike .full-top img {
    padding-bottom: 0;
    display: block;
    top: -3vw;
    position: relative;
}

/* marvel's avengers */
.case-study.marvels-avengers .about,
.case-study.marvels-avengers .about:before,
.case-study.marvels-avengers .about:after,
.case-study.marvels-avengers .split-quote .quote-container {background: #0272F0;}
.case-study.marvels-avengers .about .social a {color: #0272F0;}
.case-study.marvels-avengers .case-content {padding-top: 0;}

/* liberty */
.case-study.liberty .about,
.case-study.liberty .about:before,
.case-study.liberty .about:after,
.case-study.liberty .split-quote .quote-container {background: #253746;}
.case-study.liberty .about .social a {color: #253746;}
.case-study.liberty .case-content .quote:before {display:none;}

/* natty boh */
.case-study.national-bohemian .about .col h4,
.case-study.national-bohemian .split-quote h4 {
    color: #fff;
}

/* bsfa */
.case-study.baltimore-school-for-the-arts .case-content .quote:before {display:none;}

/* science center */
.case-study.maryland-science-center .stats-block h2 {
    font-size: 19px;
    line-height: 22px;
    font-weight: 700;
}

/* nasa */
.case-study.nasa .case-content {padding-top:0px;}
.case-study.nasa .case-content .scroll-trig {top:50px;}
.case-study.nasa .case-content .scroll-trig.load {top:-50px;}
.case-study.nasa .case-content .quote {margin-bottom:3%;}
.case-study.nasa .case-content .quote:before {display:none;}
.case-study.nasa .about {padding-bottom:100px;}
.case-study.nasa .about,
.case-study.nasa .about:before,
.case-study.nasa .about:after,
.case-study.nasa .split-quote .quote-container {background: #2E3192;}
.case-study.nasa .split-quote.polygon-build iframe {
    float: right;
    width: 100%;
    max-width: 1066px;
    height: 700px;
}
.case-study.nasa .about .social a {color: #2E3192;}
.case-study.nasa .content-block .stat {
    border: none;
    width: 312px;
    margin-top: 40px;
    text-align: left;
}
.case-study.nasa .content-block .stat h5 {
    margin-left: 30px;
    position: relative;
    top: 12px;
    font-family: 'Visby-Bold',sans-serif;
    font-size: 17px;
    line-height:24px;
    padding:0;
    text-transform:uppercase;
}
.case-study.nasa .content-block .stat .stat-box {
    font-size: 0;
    border: 1px #E7E7E7 solid;
    box-sizing:border-box;
    padding: 30px 30px 20px;
}
.case-study.nasa .content-block .stat .stat-box .col {
    float:none;
    text-align:left;
    margin-left:0;
    padding:0;
    vertical-align:top;
    border:none;
    box-sizing:border-box;
}
.case-study.nasa .content-block .stat .stat-box.one-column .col {width:100%;}
.case-study.nasa .content-block .stat .stat-box.two-column .col {width:50%;display:inline-block;}
.case-study.nasa .content-block .stat .stat-box.two-column .col:last-of-type {padding-left:20px;}
.case-study.nasa .content-block .stat .stat-box .underscore {display:inline-block;}
.case-study.nasa .content-block .stat .stat-box .underscore:after {
    content: " ";
    display: inline-block;
    background-color: #2E3192;
    width: 17px;
    height: 3px;
    margin-left: 0px;
    margin-right: 6px;
    bottom: -10px;
    border: none;
    position: relative;
}
.case-study.nasa .content-block .stat .stat-box h5 {
    display:inline-block;
    font-family: 'adelle',serif;
    font-weight:500;
    color:#2E3192;
    font-size:22px;
    line-height:30px;
    padding-top:0px;
    padding-bottom:20px;
    text-transform:none;
    top:0px;
    margin-left:0px;
    letter-spacing:0px;
}
.case-study.nasa .try-it {
    float:right;
    margin-top:20px;
}
.case-study.nasa .try-it .case-pointer {
    width:50px;
    display:block;
}
.case-study.nasa .try-it h3 {
    text-transform: uppercase;
    color: #F8E71C;
    font-family: "Visby-Bold",serif;
    font-size: 17px;
    line-height: 30px;
    letter-spacing: 1px;
    display: inline-block;
}
.case-study.nasa .try-it .case-arrow {
    width:10px;
    display:inline-block;
}
@media (max-width: 1060px) {
    .case-study.nasa .content-block .content {
        max-width:510px;
    }
}
@media (max-width: 960px) {
    .case-study.nasa .content-block .wrap {
        display:flex;
    }
    .case-study.nasa .content-block .stat {
        padding:20px 40px 0px;
    }
    .case-study.nasa .content-block .stat .stat-box .underscore {
        display:none;
    }
    .case-study.nasa .split-quote.polygon-build iframe {
        height:600px;
    }
    .case-study.nasa .split-quote.polygon-build .quote-container {
        top: auto;
        bottom:0;
        width: 100%;
        margin: 0;
        padding-right: 120px;
    }
    .case-study.nasa .split-quote.polygon-build .quote-container .try-it {
        position: absolute;
        right: 20px;
        bottom: 20px;
        float: none;
        margin: 0;
    }
    .careers .full-page-hdr, .nat-foods .full-page-hdr {
        height:85vh;
    }
    .careers .about {
        margin-top:85vh;
    }
}
@media (max-width: 760px) {
    .case-study.nasa .content-block .content {
        max-width:610px;
    }
    .case-study.nasa .content-block .wrap {
        display:block;
    }
    .case-study.nasa .content-block .stat {
        margin-top:0px;
    }
    .case-study.nasa .split-quote.polygon-build iframe {
        height:400px;
        float:none;
    }
    .case-study.nasa .split-quote.polygon-build .quote-container {
        padding: 5% 120px 5% 5%;
        top: -28px;
        margin-bottom: -28px;
        position: relative;
        box-sizing: border-box;
        width: 92%;
    }
    .case-study.nasa .split-quote.polygon-build .quote-container h2 {
        max-width:400px;
    }
}
@media (max-width: 600px) {
    .case-study.nasa .split-quote.polygon-build iframe {
        height:300px;
    }
}

/* never-normal */
.never-normal-headline {
    text-decoration: line-through;
}
/*.case-study.never-normal .hdr-wrap .col:last-of-type {display:none;}*/
.case-study.never-normal .col:last-of-type {text-align:left;}
.case-study.never-normal .about .col:last-of-type p {
    font-size: 20px;
    line-height: 30px;
    margin: 15px 0px 30px;
}
.case-study.never-normal .about .col:last-of-type .btn {
    color: #5A5959;
    margin-bottom: 10px;
}
.case-study.never-normal .about .col:last-of-type .btn:hover {
    background:#ffffff;
}
.case-study.never-normal .case-content {padding-top:0px;}
.case-study.never-normal .case-content .scroll-trig {top:50px;}
.case-study.never-normal .case-content .scroll-trig.load {top:-50px;}
.case-study.never-normal .case-content .quote {margin-bottom:3%;}
.case-study.never-normal .about {padding-bottom:100px;}
.case-study.never-normal .about,
.case-study.never-normal .about:before,
.case-study.never-normal .about:after,
.case-study.never-normal .split-quote .quote-container {background: #F1713E;}
.case-study.never-normal .about .social a {color: #F1713E;}
.case-study.never-normal .content-block .content {max-width:640px;}
.case-study.never-normal .content-block .title-sub {padding:0px;}
.case-study.never-normal .case-img-two .content-block {padding: 40px 0px 0px 70px;}
.case-study.never-normal .case-img-two .content-block .paragraph {padding:0px;}
.case-study.never-normal .btn {padding:0px 40px;}
.case-study.never-normal .content-block h1 {
    font-size: 19px;
    line-height: 24px;
    color: #F1713E;
    font-family: 'Visby-Regular',serif;
    font-weight: 700;
    padding-bottom: 0px;
    text-transform:uppercase;
    letter-spacing:2px;
}
.case-study.never-normal .quote-block h4 {
    color: #212121;
}
.case-study.never-normal .content-block h2 {
    font-size: 40px;
    line-height: 40px;
    color: #5A5959;
    font-family: 'Visby-Regular',serif;
    font-weight: 600;
    padding-bottom: 6px;
}
.case-study.never-normal .content-block p {
    line-height: 30px;
}
.case-study.never-normal .case-img-two .content-block p {
    font-size: 14px;
    line-height: 28px;
    color: #9B9B9B;
    font-family: 'adelle',serif;
    font-weight: 400;
    text-align:left;
}
.case-study.never-normal .content-block .examples {
    padding-top: 15px;
    padding-bottom: 40px;
}
.case-study.never-normal .btn:hover {
    background:#F1713E;
    color:#ffffff;
}
.case-study.never-normal .player {
    max-width:none!important;
    height:auto!important;
}
.case-study.never-normal .case-img-two iframe {
    height:25vw;
    max-height:354px;
}
.case-study.never-normal .case-img-two .pic {
    vertical-align:top;
}
.case-study.never-normal .case-img-two .pic:last-of-type {
    top:50px;
}
.case-study.never-normal .case-img-two .video {
    padding-top: 56.25%;
}
.case-study.never-normal .full .video {
    padding-top: 53%;
}
.case-study.never-normal .case-img-two .play-btn,
.case-study.never-normal .case-slider-wrap .play-btn,
.case-study.never-normal .full .play-btn {
    box-shadow: inset 96px 0px 0px #F8E71C;
    width: 96px;
    height: 96px;
    border-width: 14px;
    border-color: rgba(248, 231, 28, .75);
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.case-study.never-normal .video:hover .play-btn {
    box-shadow: inset 96px 0px 0px #F1713E;
    border-color: rgba(241, 113, 62, .75);
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.case-study.never-normal .video:hover .play-btn img {
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
/*.case-study.never-normal .full .play-btn {
    top:7vw;
}*/
.case-study.never-normal .case-img-two .play-btn img,
.case-study.never-normal .full .play-btn img {
    top: 28px;
    width: 46px;
}

/* SLIDER
---------------------------------------------- */
.slick-dots {
    text-align: center;
    width: 100%;
    z-index: 500;
    overflow: hidden;
    margin: 16px 0;
}
.slick-dots li {
    font-size: 0;
    display: inline-block;
    color: #ddd;
    cursor: pointer;
    border: 2px solid #ccc;
    background: #fff;
    border-radius: 50%;
    margin: 0 6px;
    line-height: 1;
}
.slick-dots li button {
    font-size: 0;
    width: 10px;
    height: 10px;
    display: inline-block;
    color: #ddd;
    cursor: pointer;
    margin: 2px;
    background: #fff;
    border-radius: 50%;
    padding: 0;
    border: none;
    /*outline: none;*/
}
.slick-dots li.slick-active button {background: #FF552F;}


/* AGENCY
---------------------------------------------- */
.agency {
    overflow-x:hidden;
}
.agency .page-hdr {
    background-image: url('https://missionagency.com/images/agency.png');
    height: 820px;
    background-attachment: fixed;
}
.agency .page-hdr:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: 0.25;
}
.agency .page-hdr:after {background: #1e1e1e !important;}
.agency .wrap {
    width: 1200px;
    margin: 0 auto;
}

.agency .page-hdr .watch-reel {
    position: absolute;
    z-index:3;
    right: 0;
    top: -40px;
}
.agency .page-hdr .watch-reel a {
    font-family: Visby-Bold;
    text-transform: uppercase;
    color: #FEE12F;
    letter-spacing: 1px;
    /*padding-right:25px;
    background-image:url('../images/watch-reel-play.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position:bottom right;*/
}
.agency .page-hdr .watch-reel a:hover {
    color: #FFFFFF;
}
.agency .page-hdr .watch-reel img {
    width: 18px;
    position: relative;
    top: 2px;
    transition: all .3s ease 0s;
}
.agency .page-hdr .watch-reel a:hover img {
    filter: brightness(0) invert(1);
}


.agency .page-hdr .content {
    display: table-cell;
    width: 700px;
}
.agency .page-hdr .graphic {
    display: table-cell;
    vertical-align: bottom;
    width: 400px;
}
.agency .page-hdr h1 {
    text-align: left;
    font-size: 35px;
    font-weight: 300;
    line-height: 1.4;
    padding: 14px 0 30px 0;
    margin-bottom: 0;
    max-width: 500px;
    width: 100%;
}
.agency .page-hdr h4 {text-align: left;}

.agency .page-hdr p {
    color: #fff;
    margin-bottom: 20px;
    max-width: 600px;
    width: 100%;
    line-height: 2;
    font-size: 18px;
}

#agency-tech p {
    zcolor: #fff;
    zmax-width: 600px;
    width: 92%;
    line-height: 2.0;
    font-size: 18px;
}



.agency-reel{
    position: absolute;
    bottom: 200px;
    z-index: 2;
    width:424px;
    margin-top: 40px;
}
.page-hdr .int .agency-reel-placeholder{
    width:100%;
    position: relative;
    bottom: 0;
    z-index: -1;
}
.agency-reel-lightbox-link{
    display: block;
    position: relative;
}
.agency-reel-lightbox-link::after{
    content:'';
    display: block;
    border: 1px solid rgba(255,255,255,0.5);
    position: absolute;
    left: 10px;
    top: 10px;
    right:-10px;
    bottom:-10px;
}
.agency-reel .play-btn {
    margin: 0 auto;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border-width: 15px;
    border-color: rgba(248, 232, 28, 0.53);
    border-style: solid;
    text-align: center;
    position: absolute;
    margin-top: 79px;
    left: 170px;
    box-shadow: inset 125px 0px 0px #f8e81c;
    z-index: 100;
    transition:0.3s ease all;
}
.agency-reel .play-btn img{
    top: 30%;
    left: 25%;
    width: 30px;
    max-width: 56px;
}
.agency-reel-lightbox-link:hover .play-btn,
.agency-reel-lightbox-link:focus .play-btn{
    cursor: pointer;
    border-color:rgb(254, 85, 47, 0.57);
    box-shadow: inset 125px 0px 0px #fe552f;
}
.agency .page-hdr .agency-reel p{
    position: absolute;
    text-align: right;
    font-size: 12px;
    font-style: italic;
    color: #fa502a;
    background: #1e1e1e;
    padding: 0.5em 0.75em;
    line-height: normal;
    width: auto;
    z-index: 9;
    margin: 0;
    top: auto;
    bottom: -20px;
    right: -20px;
    font-size: 12px;
}
.agency .we{
    position: relative;
    display: block;
    padding: 110px 0px 100px 0px;
    background: #1E1E1E;
}
.agency .we h4{
    text-align: center;
    margin-bottom: 80px;
}
.agency .we .columns {
    margin: 0 auto;
}
.agency .we .col{
    display: inline-block;
    float: left;
    width: 30%;
    padding: 0 1.667%;
    position: relative;
}
.agency .we .col h4{
    font-size: 35px;
    line-height: 40px;
    color: white;
    margin-bottom: 0px;
    text-transform: none;
    position: relative;
    z-index: 2;
}
.agency .we .col p{
    font-size: 18px;
    line-height: 25px;
    color: white;
    text-align: center;
    width: 233px;
    margin: 15px auto;
    position: relative;
    z-index: 2;
}
.agency .we .col img{
    position: absolute;
    top: -37px;
    z-index: 1;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.agency .main {
    position: relative;
    background: #1E1E1E;
}
.agency .main .wrap {
    padding: 200px 0 100px 0px;
    width: 1230px;
}
/*
.agency .capabilities .panel{
	background: url(https://missionagency.com/images/wood-background.jpg) no-repeat center center;
	background-size: cover;
}
*/
.agency .quote {
    border: none;
    padding: 40px;
    box-sizing: border-box;
    position: absolute;
    width: 700px;
    margin: 0;
    right: 100px;
    z-index: 2;
}
.agency .quote:before {
    content: '“';
    display: block;
    position: absolute;
    font-family: "adelle",serif;
    font-size: 420px;
    top: -110px;
    left: -40px;
    color: #272727;
    z-index: 10;
}
.agency .quote:after {
    content: '”';
    display: block;
    position: absolute;
    font-family: "adelle",serif;
    font-size: 420px;
    top: -90px;
    right: 0;
    color: #272727;
    z-index: 10;
}
.agency .quote .int {padding-right: 0px;}
.agency .quote p {
    font-size: 34px;
    font-family: 'Visby-Light';
    line-height: 1.5;
    color: #fff;
    padding-bottom: 0px;
}
.agency .quote .name {
    color: #C0CCD4;
    text-transform: uppercase;
    line-height: 1.5;
    font-family: 'Visby-Bold';
    padding-bottom: 40px;
    padding-left:0px;
}
.agency .quote img {
    position: absolute;
    bottom: 136%;
    xright: -32%;
    left: 75%;
    z-index: 1;
}
.agency .staff {
    background: #1E1E1E;
    display: block;
    position: relative;
}
.agency .staff .wrap {
    width: 1320px;
    margin: 0 auto;
}
.agency .staff-grid {
    display: -moz-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    flex-flow: row wrap;
    position: relative;
    z-index: 10;
    /* 	right:-900px; */
}
.agency .staff-grid .person {
    width: 21%;
    height: 390px;
    margin: 0 2% 60px 2%;
    position: relative;
    background: #2b2b2b;
    transition:0.3s ease all;
    pointer-events: all;
}
.agency .staff-grid .person.active{
    /* 	opacity: 0.8; */
}
.agency .staff-grid .row{
    display: -moz-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    flex-flow: row wrap;
    position: relative;
    z-index: 10;
    margin: 40px 0px;
    max-width: 1320px;
    width: 1320px;
    pointer-events: none;
}
.agency .staff-grid .row .person:nth-child(2){
    top:100px;
}
.agency .staff-grid .row .person:nth-child(3){
    top:200px;
}
.agency .staff-grid .row .person:nth-child(4){
    top:300px;
}
/*
.agency .staff-grid .row:nth-of-type(2){
	left:200px;
}
.agency .staff-grid .row:nth-of-type(3){
	left:400px;
}
.agency .staff-grid .row:nth-of-type(4){
	left:600px;
}
.agency .staff-grid .row:nth-of-type(5){
	left:800px;
}
.agency .staff-grid .row:nth-of-type(6){
	left:1000px;
}
.agency .staff-grid .row:nth-of-type(7){
	left:1200px;
}
.agency .staff-grid .row:nth-of-type(8){
	left:1400px;
}
.agency .staff-grid .row:nth-of-type(9){
	left:1600px;
}
*/
.agency .staff-grid .person .photo {
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    opacity: 0.6;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    transition: opacity .3s ease;
    /*-webkit-filter: grayscale(100%);*/ /* Safari 6.0 - 9.0 */
    /*filter: grayscale(100%);*/
}
/* .agency .staff-grid .person:hover .photo {opacity: 1;} */
.agency .staff-grid .person .photo.layer-two{
    transition: opacity 0s ease-out;
    transition-delay: 0.2s;
    opacity: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
    width: 84%;
    height: 90%;
    margin: 0 auto;
    top: 8%;
    z-index: 1;
    box-shadow:0px 9px 9px 4px rgba(0,0,0,0.3);
}
.agency .staff-grid .person.active .photo.layer-two{
    opacity: 1;
    height: 84%;
}
.agency .staff-grid .person .photo.layer-three{
    transition: opacity 0s ease-out;
    transition-delay: 0.4s;
    opacity: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
    width: 70%;
    height: 70%;
    margin: 0 auto;
    top: 15%;
    z-index: 2;
    box-shadow:0px 9px 9px 4px rgba(0,0,0,0.3);
}
.agency .staff-grid .person.active .photo.layer-three{
    opacity: 1;
    height: 70%;
}
/*
.agency .staff-grid .person.remove .photo.layer-two{
	display: opacity:0 !important;
	transition-delay: 0s !important;
}
.agency .staff-grid .person.remove .photo.layer-three{
	display: opacity:0 !important;
	transition-delay: 0s !important;
}
.agency .staff-grid .person.remove .fact{
	display: opacity:0 !important;
	transition-delay: 0s !important;
}
*/
.agency .staff-grid .person .fade {
    background: url(https://missionagency.com/images/staff-mask.png) no-repeat center bottom;
    background-size: cover;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
}
.agency .staff-grid .person .brief {
    position: relative;
    padding: 86px 22px 190px 30px;
    text-align: right;
    position: absolute;
    pointer-events:none;
}
.agency .staff-grid .person .btn-bio {
    position: absolute;
    top: -11px;
    /*right: 87px;*/
    right:11px;
    color: #fff;
    font: 11px 'Visby-Bold';
    letter-spacing: .5px;
    padding-bottom: 8px;
    text-transform: uppercase;
    cursor: pointer;
    pointer-events:auto;
    height: 15px;
    width: 19px;
    background: #F8E81C;
}
.agency .staff-grid .person .btn-bio:before {
    content: '+';
    display: block;
    font: 33px 'Visby-Regular';
    color: #5A5959;
    position: absolute;
    top: -12px;
    left: 3px;
    text-align: center;
}
.agency .staff-grid .person .btn-bio:hover,
.agency .staff-grid .person .btn-bio:focus{
    background:#5A5959;
    color: #F8E81C;
}
.agency .staff-grid .person .btn-bio:hover:before,
.agency .staff-grid .person .btn-bio:focus:before{
    color: #F8E81C;
}
.agency .staff-grid .person .name {
    text-transform: uppercase;
    font: 16px 'Visby-Bold';
    letter-spacing: 1.5px;
    color: #FF552F;
    margin-bottom: 10px;
    position: absolute;
    top: 400px;
    right: 112px;
}
.agency .staff-grid .person .title {
    color: #fff;
    font: 300 13px 'adelle',serif;
    margin-bottom: 20px;
    position: absolute;
    top: 422px;
    right:114px;
}
.agency .staff-grid .person .bar{
    position: absolute;
    right: 93px;
    background: white;
    border: none;
    width: 1px;
    height: 76px;
    top: 362px;
    z-index: 3;
}
.agency .staff-grid .person .fact {
    position: relative;
    text-align: left;
    left: 155px;
    z-index: 3;
    overflow: hidden;
    /*     border: 1px solid red; */
    width: 300px;
    pointer-events: none;
}
.agency .staff-grid .person .fact .h4-like{
    color: white;
    left: -300px;
    position: relative;
    transition: 0.5s ease all;
    transition-delay: 0.6s;
    font-size: 40px;
    line-height: 46px;
    text-transform: none;
}
.agency .staff-grid .row .person:nth-of-type(4) .fact {
    right: 218px;
    left: auto;
}
.agency .staff-grid .person:nth-of-type(4) .fact .h4-like{
    right:-315px;
}
.agency .staff-grid .person:nth-of-type(4).active .fact .h4-like{
    right: 0px;
    left: auto;
    text-align: right;
}
.agency .staff-grid .person.active .fact .h4-like {
    left:0px;
}
.agency .staff-grid .person .img {
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    width: calc(100% - 22px);
    height: 175px;
    position: absolute;
    bottom: -30px;
    left: 0;
}
.agency .staff-grid .person-next {
    background: #FF552F;
    display: block;
    /* 	top:300px; */
    /* 	top:200px; */
    /* 	top:150px; */
    /*	top: 100px;*/
}
.agency .staff-grid .person.person-next.active{
    background: #282828;
}
.agency .staff-grid .person.person-next .name{
    position: relative;
    top:auto;
    right:auto;
}
.agency .staff-grid .person.person-next .fact{
    text-align: right;
    left: auto;
    width: auto;
    line-height: 21px;
}
.agency .staff-grid .person-next .photo {
    background-image: url(https://missionagency.com/images/staff-mascot.png);
    opacity: 0.1;
}
.agency .staff-grid .person-next .fade {opacity: 0.6;}
.agency .staff-grid .person-next .name {
    color: #fff;
    margin-bottom: 20px;
    transition: all .3s ease;
}
.agency .staff-grid .person-next .fact {
    color: rgba(255,255,255,0.75);
    transition: all .3s ease;
}
.agency .staff-grid .person-next:hover .name,
.agency .staff-grid .person-next:focus .name {
    color: #F8E81C;
}
.agency .staff-grid .person-next:hover .fact,
.agency .staff-grid .person-next:focus .fact {
    color: rgba(248,232,28,0.75);
}
.agency .staff-media {
    width: 100%;
    position: relative;
}
.agency .staff-media:before {
    content: '';
    display: block;
    position: absolute;
    background: #2c2c2c !important;
    top: -10vw;
    left: 0;
    transform-origin: right top;
    transform: skewY(3deg);
    height: 20vw;
    width: 100%;
}
.agency .staff-media-bg {
    background: url(https://missionagency.com/images/socrates.png) no-repeat center top #2c2c2c;
    background-size: 100%;
    position: relative;
    width: 100%;
    padding-bottom: 30px;
}
.agency .staff-media .wrap {
    padding: 160px 0;
    width: 1230px;
}
.agency .statements {
    border: 1px solid rgba(255,255,255,0.25);
    padding: 40px;
    width: 50%;
    position: relative;
    margin-bottom: 140px;
}
.agency .statements h4 {
    position: absolute;
    top: -9px;
    left: 40px;
}
.agency .statements h4:after {
    content: '';
    display: block;
    position: absolute;
    right: -22px;
    bottom: 0;
    height: 4px;
    width: 20px;
    background: #ccc;
}
.agency .statements-slider {width: 130%;}
.agency .statements-slider h2 {
    color: #fff;
    font-size: 56px;
    line-height: 1.3;
    letter-spacing: 2px;
    margin-bottom: 10px;
}
.agency .statements-slider .slick-prev {display: none !important;}
.agency .statements-slider .controls {
    position: absolute;
    bottom: 0;
    left: 0;
}
.agency .statements-slider .slick-next {
    width: 26px;
    height: 26px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
    font-size: 0;
    border: none;
    cursor: pointer;
    opacity: 1;
    transition: transform .4s ease-in-out;
    background-image: url(https://missionagency.com/images/icon-refresh.svg);
    background-color: transparent;
    transform: none;
}
@-webkit-keyframes spin {
    0% {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);}
}
@keyframes spin {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
.agency .statements-slider .slick-next.spin {
    -webkit-animation: spin 0.3s linear;
    animation: spin 0.3s linear;
}
.agency .instagram {
    float: right;
    border: 1px solid rgba(255,255,255,0.25);
    box-sizing: border-box;
    width: 1172px;
    height: 370px;
    padding: 24px 0;
    position: relative;
}
.agency .instagram .link {
    position: absolute;
    z-index: 10;
    background: #FF552F;
    top: -24px;
    right: 24px;
    display: table;
}
.agency .instagram .link a {
    display: table-cell;
    width: 90px;
    height: 90px;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    font: 300 14px 'adelle',serif;
}
.agency .instagram .link .fa {
    font-size: 26px;
    margin-bottom: 6px;
}
.agency .instagram .link a:hover {background-color: #5A5959;}
.agency .instagram ul {
    width: 100%;
    position: absolute;
    left: -60px;
}
.agency .instagram ul li {
    float: left;
    width: 370px;
    height: 370px;
    margin-right: 30px;
    background: #303030;
}
.agency .instagram ul li:first-child {margin-top: -48px;}
.agency .instagram ul li:last-child {margin-right: 0;}
.agency .instagram ul li div {
    display: block;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    opacity: 1;
    transition:0.3s ease all;
}
.agency .instagram ul li div:hover{
    opacity: 0.5;
}
.agency .agency-slider {
    width: 100%;
    padding: 0 30px;
    box-sizing: border-box;
    position: relative;
}
.agency .agency-slider img {
    width: 100%;
    height: auto;
}
.agency .agency-slider .slick-prev {
    background-image: url(https://missionagency.com/images/arr-left.png);
    left: 0;
}
.agency .agency-slider .slick-next {
    background-image: url(https://missionagency.com/images/arr-right.png);
    right: 0;
}
.agency .agency-slider button {
    width: 60px;
    height: 60px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #FF552F;
    background-size: 26px 22px;
    z-index: 2;
    position: absolute;
    top: 50%;
    margin-top: -30px;
    box-shadow: -1px 1px 2px 0px rgba(0,0,0,0.3);
    cursor: pointer;
    /*outline: none;*/
    border: none;
    font-size: 0;
}
.agency .agency-slider button:hover {background-color: #5A5959;}
.agency .hmg-slider{
    background-color: #1E1E1E;
    background: url(https://missionagency.com/images/wood-background.jpg) no-repeat center center;
    background-size: cover;
    padding: 190px 0px 210px 0px;
    position: relative;
}
.agency .hmg-slider .brand-img{
    width: 100%;
    bottom: 0px;
    position: relative;
    display:none;
}
.agency .hmg-slider h4{
    text-align: right;
    margin-right: 19px;
    margin-bottom: 30px;
}
.agency .hmg-slider .slide .columns{
    display: block;
    position: relative;
}
.agency .hmg-slider .slide .columns .col img{
    position: absolute;
    z-index: 2;
    top: -269px;
    left: -100px;
}
.agency .hmg-slider .slide .columns .col.copy{
    max-width: 700px;
    border: 1px solid white;
    padding: 69px 0px 69px 80px;
    position: relative;
    margin-left: 397px;
}
.agency .hmg-slider .slide h5{
    color: white;
    font-size: 35px;
    margin-bottom: 20px;
    line-height: 40px;
}
.agency .hmg-slider .slide p{
    color: white;
    width: 80%;
}
.agency .hmg-slider .slick-list{
    overflow: visible;
}
.agency .hmg-slider .play-pause-button{
    position: absolute;
    z-index: 9;
    transform: scale(0.75);
    right: -52px;
    top: 79px;
}
.agency .hmg-slider .slick-dots{
    display: block;
    position: absolute;
    width: 22px;
    right: -42px;
    top: 94px;
    overflow: visible;
}
.agency .hmg-slider .slick-dots li {
    font-size: 0;
    display: block;
    color: white;
    cursor: pointer;
    border: 2px solid #D8D8D8;
    background: none;
    border-radius: 50%;
    margin: 0 6px;
    line-height: 1;
    width: 16px;
    margin: 17px 0px;
    transition:0.3s ease background-color;
}
.agency .hmg-slider .slick-dots li:focus-within{
    outline: solid white;
    outline-offset: 3px;
}
.agency .hmg-slider .slick-dots li button{
    background:none;
    margin: 3px;
    transition:0.3s ease all;
}
.agency .hmg-slider .slick-dots li.slick-active{
    background:#D8D8D8;
}
.agency .hmg-slider .slick-dots li.slick-active button{
    background:#D8D8D8;
}
*/
.agency .capabilities .brand{
    background-color: #1E1E1E;
    background: url(https://missionagency.com/images/wood-background.jpg) no-repeat center center;
    background-size: cover;
    background-attachment: fixed;
}
.agency .capabilities .brand .info{
    border: 2px #979797 solid;
    padding:10%;
    margin-left:0px;
}
.agency .capabilities .brand .content{
    margin-top:23%;
    margin-left:0;
    margin-right:13%;
    position: relative;
}
.agency .capabilities .brand h4{
    color: #FE552F;
}
.agency .capabilities .brand h1{
    color: white;
}
.agency .capabilities .brand p{
    color: white;
    margin-bottom:10px;
}
.agency .capabilities .brand img{
    position: absolute;
    top: -50px;
    right: 44%;
    z-index: 2;
}
.agency .capabilities .brand .right-column {
    width:60%;
}
.agency .capabilities .brand .left-column {
    width:40%;
}
.agency .capabilities .brand .right-column .title {
    text-align:right;
}
.agency .capabilities .brand .right-column .info {
    text-align:left;
}
.agency .dots{
    display: block;
    position: absolute;
    top: 46%;
    right: -38px;
}
.agency .dots span{
    width: 14px;
    height: 14px;
    border: 2px solid #979797;
    display: block;
    position: relative;
    border-radius: 100%;
    margin-bottom: 15px;
}
.agency .dots span.active{
    background:#979797;
}

/* CAPABILITIES
---------------------------------------------- */
.capabilities{
    overflow-x: hidden;
}
.capabilities .page-hdr {
    background-image: url('https://missionagency.com/images/karate.png');
    height: 820px;
    background-attachment: fixed;
}
.capabilities .page-hdr:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: 0.25;
}
.capabilities .wrap {
    width: 1200px;
    margin: 0 auto;
}
.capabilities .wrap ul.anchors.desktop{
    display: block;
    /* 	margin-bottom: 12px; */
}
.capabilities .wrap ul.anchors.mobile{
    display: none !important;
    margin-bottom: 30px;
    margin-top: 0px;
}
.capabilities .wrap ul.anchors li{
    display: block;
    float: none;
    padding-right: 10px;
    padding-left: 0px;
    margin: 0px 0px 0px 0px;
    /* border-right: 1px solid white; */
    margin-bottom: 24px;
}
.capabilities .wrap ul.anchors li:last-of-type{
    padding-right: 0px;
    border-right: none;
    margin-bottom: 0px;
}
.capabilities .wrap ul.anchors li:first-of-type{
    padding-left:0px;
}
.capabilities .wrap ul.anchors li a{
    /* 	color: #FEE12F; */
    text-decoration: underline;
}
.capabilities .wrap ul.anchors li a:hover{
    /* 	color: white; */
}
/*.capabilities .page-hdr:after {background: #1e1e1e !important;}*/
.capabilities .page-hdr .content {width: 850px;}
.capabilities .page-hdr h1 {
    text-align: left;
    font-size: 35px;
    font-weight: 300;
    line-height: 1.4;
    padding: 14px 0 30px 0;
    margin-bottom: 0;
}
.capabilities .page-hdr h4 {text-align: left;}
.capabilities .page-hdr ul.anchors h4{
    margin-bottom: 0px;
}
.capabilities .page-hdr p {
    color: #fff;
    margin-bottom: 20px;
    padding-right: 160px;
}
.capabilities .statement {
    background: #fff;
    padding: 60px 0 100px 0px;
    z-index: 3;
    position: relative;
}
.capabilities .statement .wrap {
    width: 930px;
    text-align: center;
}
.capabilities .statement h4 {margin-bottom: 10px;}
.capabilities .statement p {
    color: #B9B8B8;
    font: 21px 'Visby-Light';
    line-height: 1.5;
    max-width: 900px;
    margin: 0 auto;
    width: 93%;
}
.capabilities .brand {
    background-color:#fff;
    width: 100%;
    position: relative;
    /*     height: 697px; */
}
.capabilities .brand .desktop{
    display: block;
}
.capabilities .brand .mobile{
    display: none;
}
.capabilities .brand .mobile .wrap:first-of-type tag{
    margin-top: 8%;
}
.capabilities .brand .wrap {
    width: 1340px;
    margin: 0 auto;
    font-size:0;
}
.capabilities .brand .left-column {
    width:53%;
    display:inline-block;
    vertical-align:top;
}
.capabilities .brand .right-column {
    width:47%;
    display:inline-block;
    vertical-align:top;
    text-align:center;
    /*
    width: 100%;
    height:100%;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    background-repeat: no-repeat;
    position: relative;
    background-size: 1329px;
    background-position: 55%;
    background-attachment: fixed;
    position: absolute;
*/
}
.capabilities .brand .content {
    margin-top:16%;
    margin-left:13%;
}
.capabilities .brand .num {
    display:inline-block;
    color: #FE552F;
    font: 800 22px 'adelle',serif;
    letter-spacing: 1px;
}
.capabilities .brand .num span {
    border: 4px solid #FE552F;
    display: inline-block;
    width: 44px;
    height: 44px;
    line-height: 44px;
    border-radius: 50%;
    text-align:center;
}
.capabilities .brand .tag {
    display:inline-block;
    padding-left:5%;
}
.capabilities .brand .info {
    margin-top:24px;
    margin-left:25px;
    padding-left:9%;
    padding-right:30px;
    padding-top:10px;
    padding-bottom:15px;
    border-left:2px #ececec solid;
}
.capabilities .brand .underscore:after {
    content: " ";
    display: inline-block;
    background-color: #5a5859;
    width: 8px;
    height: 2px;
    margin-left: 8px;
    margin-right:8px;
    bottom: -2px;
    border: none;
    position: relative;
    position: absolute;
    left: 0px;
    margin-left: 0px;
    top: 11px;
}
.capabilities .brand img {
    position: relative;
    top: 0px;
    z-index: 3;
    height: 800px;
}
.capabilities .brand h1 {
    color:#1E1E1E;
    text-align: left;
    font-size: 35px;
    font-weight: 300;
    line-height: 1.4;
    padding: 0px 0 20px 0;
}
.capabilities .brand h1.center{
    text-align: center;
}
.capabilities .brand ul li {
    color:#1E1E1E;
    display:block;
    text-align: left;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    position: relative;
    padding-left: 14px;
}
.capabilities .brand ul li span {
    content: " ";
    display: inline-block;
    background-color: #5a5859;
    width: 8px;
    height: 2px;
    margin-left: 8px;
    margin-right: 8px;
    bottom: -2px;
    border: none;
    position: relative;
}
.capabilities .brand h4 {
    text-align: left;
    color:#5a5859;
}
.capabilities .brand p {
    color: #5a5859;
    font-size: 15px;
    line-height: 27px;
    margin-bottom: 20px;
    font-family: Visby-Regular;
}
.capabilities .process {
    background: url(https://missionagency.com/images/brand-bg.png) no-repeat top center;
    background-size: cover;
    width: 100%;
    position: relative;
    z-index: 1;
}
.capabilities .process .wrap2 {
    width:100%;
    max-width:1200px;
    font-size:0;
    margin:0px auto;
}
.capabilities .process .title {
    vertical-align:top;
    padding-top:150px;
    padding-left:20px;
    padding-right:20px;
    text-align: center;
}
.capabilities .columns4 {
    width: 100%;
    vertical-align:bottom;
}
.capabilities .process .column {
    width: 25%;
    padding-top: 60px;
    display: inline-block;
    vertical-align: bottom;
    text-align: center;
    opacity: 0;
    transition: 0.3s ease all;
    bottom: -20px;
    position: relative;
}
.capabilities .process .column.load{
    opacity: 1;
    bottom: 0px;
}
.capabilities .process .content1 .scroll-trig {
    position: relative;
    opacity: 0;
    top: 100px;
    transition: all .25s ease;
}
.capabilities .process .content2 .scroll-trig {
    position: relative;
    opacity: 0;
    top: 100px;
    transition: all .5s ease;
}
.capabilities .process .content3 .scroll-trig {
    position: relative;
    opacity: 0;
    top: 100px;
    transition: all .75s ease;
}
.capabilities .process .content4 .scroll-trig {
    position: relative;
    opacity: 0;
    top: 100px;
    transition: all 1s ease;
}
.capabilities .process .scroll-trig.load {
    opacity: 1;
    top: 0;
}
.capabilities .process .divider {
    width: 1px;
    height:73px;
    background-color:#979797;
    margin:0px auto;
}
.capabilities .process h1 {
    font-size: 30px;
    line-height: 38px;
    color: #fff;
    font-family: "adelle",serif;
}
.capabilities .process h4 {
    font-size: 14px;
    line-height:20px;
}
.capabilities .process h3 {
    font-weight: 600;
    letter-spacing: 1.5px;
    font-size: 26px;
    line-height: 34px;
    color: #ffffff;
    font-family: "Visby-Bold",serif;
    padding-bottom:70px;
}
.capabilities .process .wrap {
    width: 1320px;
    padding-top: 60px;
}
.capabilities .process .tbl {
    display: table;
    width: 100%;
    text-align: center;
    margin-top: 100px;
    padding-bottom: 80px;
}
.capabilities .process .tbl .cell {
    display: table-cell;
    width: 30.5%;
    box-sizing: border-box;
    border: 2px solid #3e3e3e;
    position: relative;
}
.capabilities .process .tbl .spacer {
    display: table-cell;
    width: 4.25%;
}
.capabilities .process .num {
    color: #FE552F;
    font: 700 16px 'adelle',serif;
    letter-spacing: 1px;
    margin-bottom: 50px;
    padding-bottom: 0;
    position: absolute;
    top: -95px;
    left: 50%;
    margin-left: -22px;
}
.capabilities .process .num span {
    border: 2px solid #FE552F;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
}
.capabilities .process .tbl h2 {
    color: #fff;
    font-size: 35px;
    margin-top: -24px;
    padding-bottom: 14px;
}
.capabilities .process .tbl p {
    font-size: 14px;
    color: #fff;
    line-height: 2;
    margin-bottom: 30px;
}
.capabilities .process .tbl .content {padding: 0 30px 40px 30px;}
.capabilities .process .item {
    display: block;
    background: rgba(255,255,255,0.25);
    font: 16px 'Visby-Bold';
    line-height: 1.1;
    text-transform: uppercase;
    color: #fff;
    padding: 16px 24px;
    margin-bottom: 6px;
    position: relative;
    text-align: center;
}
.capabilities .process .tbl-hdr {
    color: #FE552F;
    font: 700 16px 'adelle',serif;
    letter-spacing: 1px;
    margin-bottom: 50px;
    padding-bottom: 0;
}
.capabilities .process .tbl-hdr .cell {
    padding: 0;
    border: none;
}
.capabilities .process .tbl-hdr span {
    border: 2px solid #FE552F;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
}
.capabilities .brand .btn:hover{
    color:#ffffff;
    background-color:#FE552F;
}
.capabilities .brand .btn:active{
    background-color:#FE552F;
}
.capabilities .callout {
    width: 100%;
    padding: 90px 0 60px;
    text-align: center;
}
.capabilities .callout .wrap {padding-top: 0;}
.capabilities .callout h2 {
    color: #fff;
    margin-bottom: 30px;
    padding-bottom: 0;
}
.capabilities .process .callout {background: rgba(255,255,255,0.1);}
.capabilities .process .callout h2 {font-size: 35px;}
.capabilities .clients {
    background: #fff;
    padding: 80px 0;
    text-align: center;
    position: relative;
}
.capabilities .callout-2 {background-image: url(https://missionagency.com/images/dude.png);}
.capabilities .clients .desc {padding: 0 60px;}
.capabilities .clients .desc h4 {padding-bottom: 20px;}
.capabilities .clients .desc p {
    color: #5a5859;
    font: 25px 'Visby-Light';
    line-height: 1.6;
    padding: 5px 70px 60px;
    padding-bottom: 0px !important;
}
.capabilities .clients .desc p:last-of-type{
    padding-bottom: 40px !important;
}
.capabilities .clients .desc p .super{
    font-size: 17px;
    position: relative;
    top: -11px;
}
.capabilities .clients .grid {
    display: -moz-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    flex-flow: row wrap;
}
.capabilities .clients .cell {
    width: 20%;
    height: 230px;
    box-sizing: border-box;
    border-right: 1px solid #DEDEDE;
    border-bottom: 1px solid #DEDEDE;
}
.capabilities .clients .grid .cell:nth-child(5n) {border-right: none;}
.capabilities .clients .grid .cell:nth-last-child(-n+5) {border-bottom: none;}
.capabilities .clients .cell a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}
.capabilities .clients .cell a:focus {
    outline: auto;
    outline-color:#ff501c;
}
.capabilities .clients .cell a:before {
    display: block;
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    top: 16px;
    right: 16px;
    background: url(https://missionagency.com/images/icon-plus-orange.png) no-repeat right top;
    opacity: 1;
    transition: opacity .3s ease;
}
.capabilities .clients .cell a:hover:before {opacity: .5;}
.capabilities .clients .cell .int {
    display: table;
    width: 100%;
    height: 100%;
    text-align: left;
    opacity: 1;
    transition: opacity .3s ease;
}
.capabilities .clients .cell a:hover .int {opacity: .5;}
.capabilities .clients .cell .int .mid {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    width: 100%;
    height: 100%;
    padding: 0 10%;
}
.capabilities .clients .cell img {
    display: inline-block;
    max-width: 100%;
    height: auto;
}
.capabilities-detail .page-hdr {height: 760px;}
.capabilities-detail .page-hdr h1 {
    text-align: center;
    font-size: 80px;
    margin-bottom: 0;
}
.capabilities-detail .main {
    position: relative;
    background: #fff;
}
.capabilities-detail .main .wrap {
    width: 900px;
    margin: 0 auto;
    padding-bottom: 60px;
}
.capabilities-detail .main .int {padding: 0 40px;}
.capabilities-detail .main-pic {
    margin-top: -100px;
    width: 100%;
    height: auto;
    margin-bottom: 60px;
}
.capabilities-detail .main p {margin-bottom: 40px;}
.capabilities-detail .callout {background-image: url(https://missionagency.com/images/old-ladies.png);}
.capabilities-detail .btm-nav {
    background: url(https://missionagency.com/images/capabilities-nav-bg.png) no-repeat center center;
    background-size: cover;
}
.capabilities-detail .btm-nav .wrap {
    width: 1140px;
    margin: 0 auto;
    padding: 80px 0;
}
.capabilities-detail .btm-nav h4 {
    text-align: center;
    margin-bottom: -26px;
}
.capabilities-detail .btm-nav .links {
    display: table;
    width: 100%;
    border: 1px solid rgba(255,255,255,0.25);
}
.capabilities-detail .links > div {
    display: table-cell;
    width: 50%;
}
.capabilities-detail .links > div:last-child {
    border-left: 1px solid rgba(255,255,255,0.25);
    text-align: right;
}
.capabilities-detail .links a {
    display: block;
    width: 100%;
    padding: 60px 30px;
    box-sizing: border-box;
    color: #fff;
    font: 35px 'adelle',serif;
}
.capabilities-detail .links a:hover {color: #FE552F;}
.capabilities-detail .links a > div {position: relative;}
.capabilities-detail .link-prev > div {padding-left: 50px;}
.capabilities-detail .link-next > div {padding-right: 50px;}
.capabilities-detail .links a span:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -11px;
    width: 26px;
    height: 22px;
    background-size: cover;
}
.capabilities-detail .link-prev span:before {
    left: 0;
    background: url(https://missionagency.com/images/arr-yellow-left.png) no-repeat center center;
}
.capabilities-detail .link-next span:before {
    right: 0;
    background: url(https://missionagency.com/images/arr-yellow.png) no-repeat center center;
}
.capabilities .testimonial{
    padding-top: 60px;
}
.capabilities .testimonial h1 {
    color: #5a5859;
    text-align: center;
    font-size: 35px;
    font-weight: 300;
    line-height: 1.4;
    padding: 0px 0 20px 0;
}
.capabilities .play-btn {
    margin: 0 auto;
    width: 125px;
    height: 125px;
    border-radius: 50%;
    border-width: 15px;
    border-color: rgba(255,255,255,.75);
    border-style: solid;
    text-align: center;
    position: relative;
    margin-top: -35%;
    box-shadow: inset 125px 0px 0px #FE552F;
    z-index: 100;
}
.clients .client-listing{
    max-width: 967px;
    margin: 130px auto 0;
}
.clients .client-listing ul{
    text-align: left;
    width: 28%;
    padding: 0 2.5%;
    display: inline-block;
    float: left;
    margin-bottom: 75px;
}
.clients .client-listing ul li{
    color: #5a5859;
    font: 14px 'Visby-Light';
    line-height: 25px;
    letter-spacing: 1px;
    pointer-events: none;
}
.clients .client-listing ul li h4{
    margin-bottom: 23px;
    font-size: 14px;
}
.panel {
    width:100% !important;
    opacity:1;
    transition: opacity 0.3s;
}
.panel.one{
    opacity: 1;
}
/*
.panel.hide{
	opacity: 0 !important;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.panel.show{
	opacity: 1;
	-webkit-transition: all 0.3s ease 0.3s;
	-moz-transition: all 0.3s ease 0.3s;
	-o-transition: all 0.3s ease 0.3s;
	transition: all 0.3s ease 0.3s;
}
*/
.capabilities .case-controls{
    /* 	margin-top: 50px; */
}
.capabilities .page-hdr .wrap{
    position: relative;
}
.capabilities .sidebar{
    position: absolute;
    right: 0px;
    top: 69px;
    background: white;
    width: 250px;
    padding: 30px;
}
.capabilities .sidebar li{
    position: relative;
}
.capabilities .sidebar li:after {
    content: " ";
    display: inline-block;
    background-color: rgb(185 184 184 / 66%);
    width: 20px;
    height: 2px;
    margin-left: 8px;
    margin-right: 8px;
    bottom: 0px;
    border: none;
    position: relative;
    position: absolute;
    left: -30px;
    margin-left: 0px;
    top: 14px;
}
.capabilities .sidebar h4 {
    text-align: left;
    color: #5a5859;
}
.capabilities .sidebar li h4{
    font-family: "adelle",serif;
    line-height: 1.5;
    text-transform: unset;
    font-size: 20px;
}
.capabilities .page-hdr .content .anchors.desktop{
    display: none !important;
}

/* Connor's career updates
---------------------------------------------- */
.careers .page-hdr, .nat-foods .page-hdr {
    /*background-image:url('https://missionagency.com/images/career-bg-new.jpg');*/
    background: #4b4b4b;
}
.careers .page-hdr .int, .nat-foods .page-hdr .int {
    max-width:100%;
    overflow-x:hidden;
    position: unset;
}
.careers .videos.bg, .nat-foods .videos.bg {
    position: absolute;
    right:0px;
    min-height:100%;
    min-width:100%;
    z-index: 0;
    top:0px;
    opacity:0.33;
    transform: translateX(calc((100% - 100vw) / 2));
}
.careers .title, .nat-foods .title {
    position: relative;
    z-index: 1;
}
.careers .play-pause-button, .nat-foods .play-pause-button {
    position: absolute;
    right:40px;
    bottom:150px;
    z-index: 2;
}
.careers .benefits_link {
    color: #FEE12F;
    text-decoration: underline;
    text-transform: uppercase;
    position: relative;
    top:10px;
    font-size: 16px;
    font-family: Visby-Bold;
    transition: all 500ms ease;
}
.careers .benefits_link::before {
    content:" ";
    background: url(https://missionagency.com/images/arr-yellow.png);
    background-size:contain;
    background-repeat:no-repeat;
    width:15px;
    height:10px;
    position: absolute;
    right:0px;
    bottom:5px;
    transition: all 500ms ease;
    opacity:0;
}
.careers .benefits_link:hover::before {
    transform: translateX(20px);
    opacity: 1;
}
.careers .open-container p {
    max-width: 800px;
    text-align: center;
    margin:auto;
    color:white;
    font-size: 20px;
    line-height: 28px;
    margin-top:25px;
    font-style:italic;
}
.careers .openings_flex {
    display:flex !important;
    justify-content: space-around;
    flex-wrap: wrap;
}
.careers .openings_cat {
    border: 2px solid rgba(255,255,255,0.4);
    padding:24px 60px 24px 30px;
    width:30%;
    margin-bottom:50px;
}
.careers .openings_cat h3 {
    font-size:17px;
    line-height: 24px;
    margin-bottom:24px;
    font-family:Visby-Bold;
    text-transform: uppercase;
}
.careers .openings {
    margin-top:100px;
}
.careers .intro p {
    font-size: 20px;
    line-height: 36px;
    margin-bottom:25px;
}
.careers .office_video_container {
    display:flex;
    justify-content: center;
    background: #000;
}
.careers .slick-dots li {
    border:3px solid #fff;
    margin: 0 12px;
}
.careers .slick-dots li button {
    width:15px;
    height:15px;
    margin:4px;
}
/*.careers .office_video_container::before, .careers .office_video_container::after {
  content:"Office Tour";
  font-size:50px;
  line-height: 67px;
  font-family: adelle;
  color:#fff;
  display:inline-block;
  position: absolute;
}*/
.careers .office_video_container .vid_after, .careers .office_video_container .vid_before {
    font-size:50px;
    line-height: 60px;
    font-family: adelle;
    color:#fff;
    display:inline-block;
    position: absolute;
}
.careers .office_video_container .vid_before {
    top:25px;
    z-index: 2;
}
.careers .office_video_container .vid_before::before, .careers .office_video_container .vid_after::before {
    width:1px;
    height:55px;
    position: absolute;
    top:-100%;
    left: 50%;
    content: " ";
    background: white;
}
.careers .office_video_container .vid_after {
    transform: rotateX(180deg) rotateY(180deg);
    bottom:25px;
    z-index: 2;
}
.careers .offering .video {
    width:100%;
    display: flex;
    justify-content: center;
}
.careers .offering .video img:last-of-type {
    opacity: 63%;
}
.careers .offering .video .play-btn img {
    opacity: 100%;
}
.careers .offering .video .play-btn {
    z-index: 1;
    width: 125px;
    height:125px;
    position: absolute;
    top:50%;
    transform: translateY(-50%);
}
.careers #office_video {
    display:flex;
    justify-content: center;
    align-items: center;
}
.careers #office_video::before {
    content: " ";
    background-image:url('https://missionagency.com/images/playbtn.svg');
    position: absolute;
    width:124px;
    height:124px;
    transition: all 500ms ease;
    opacity: 1;
}
.careers #office_video.hidden::before {
    opacity:0;
}
.careers #office_video video {
    width:100%;
}
.careers .slick-dots li button, .careers .slick-dots li {
    background:transparent;
}
.careers .slick-dots li.slick-active button {
    background: #FF552F;
}
.careers .summary {
    margin-top:80px;
}
.careers .summary p {
    max-width: 700px;
    font-weight: 100;
    font-style:italic;
}
.careers .flex-holder {
    position: relative;
}
.careers .flex-holder::after {
    content: " ";
    position: absolute;
    width:20px;
    height:4px;
    background-color:#F8E71C;
    bottom:-25px;
    left:50%;
    transform: translateX(-50%);
}
/*.careers .youtube.video::before {
  content: "";
  width: 100%;
  height: 100%;
  background:rgba(0,0,0,0.37);
  position: absolute;
  left: 0;
  top:0;
  z-index: 1;
}*/
.careers {
    margin-bottom:30px;
}
.careers #offering .block-title {
    transition: all 500ms ease;
    cursor: pointer;
    position: relative;
    display: flex;
    justify-content: center;
}
.offering .col-third {
    cursor: pointer;
}
.careers #offering .block-title:hover span {
    opacity: 32%;
}
.careers .offer-hover-image {
    display:none;
    position: absolute;
    transform:translateX(-50%);
    bottom: 125%;
    max-height: 415px;
    width:0px;
    height:0px;
    max-width: 415px;
    margin:auto;
    transition:all 500ms ease;
}
.careers .col-third:nth-child(even) .offer-hover-image {
    -webkit-mask:url('https://missionagency.com/images/evenmask.svg');
            mask:url('https://missionagency.com/images/evenmask.svg');
    -webkit-mask-image:url('https://missionagency.com/images/evenmask.svg');
    mask-size:100%;
    -webkit-mask-size:100%;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position:center;
    -webkit-mask-position: center;
}
.careers .col-third:nth-child(odd) .offer-hover-image {
    -webkit-mask:url('https://missionagency.com/images/oddmask.svg');
            mask:url('https://missionagency.com/images/oddmask.svg');
    -webkit-mask-image:url('https://missionagency.com/images/oddmask.svg');
    mask-size:100%;
    -webkit-mask-size:100%;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position:center;
    -webkit-mask-position: center;
}
.careers .youtube.video:focus::before {
    content:unset;
}
.careers .slick-list {
    padding-left:10%;
}
.careers .slick-slide {
    margin-left:50px;
}
.careers .flex-links {
    display:flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom:80px;
}
.careers .flex-links a {
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding:100px;
    height:150px;
    width: 350px;
    max-width: 100%;
    position: relative;
    transition:all 500ms ease;
}
.careers .flex-links a::before {
    position: absolute;
    border: 1px solid #656565;
    bottom: 15px;
    right:15px;
    content: " ";
    width:100%;
    height: 100%;
    transition:all 500ms ease;
}
.careers .flex-links a:hover::before {
    transform:translateX(30px) translateY(30px);
}
.careers .flex-links a:first-of-type .fullbg {
    background-image:url('https://missionagency.com/images/work-portal.png');
    position: absolute;
    width: 100%;
    height:100%;
    z-index: -1;
    opacity: 48%;
}
.careers .flex-links a:last-of-type .fullbg {
    background-image:url('https://missionagency.com/images/team-portal.png');
    position: absolute;
    width: 100%;
    height:100%;
    z-index: -1;
    opacity: 48%;
}
.careers .flex-links a p {
    font-size: 20px;
    line-height: 44px;
    font-family: Visby-Bold;
    text-transform: uppercase;
    margin: auto;
}
.careers .flex-links a h3 {
    font-size: 40px;
    line-height: 53px;
    color:#fff;
    text-transform: lowercase;
}
.careers .about h2 {
    font-style:inherit;
    margin-bottom:20px;
}
.careers .slick-slide img {
    max-width: 92vw;
    max-height: 550px;
}
/*.careers .slider-block .low-current .slick-slide {
  width: fit-content !important;
}*/
/* CAREER
---------------------------------------------- */
.careers .page-hdr:before,
.case-study .page-hdr:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: 0.5;
}
.careers .page-hdr .int,
.case-study .page-hdr .int,
.capabilities .page-hdr .int,
.agency .page-hdr .int {
    position: relative;
}
.careers .about h2 {color: #fff;}
.careers .about .columns{
    max-width: 1183px;
    width: 90%;
    margin: 0 auto;
    position: relative;
    display: block;
    z-index: 1;
    top: -100px;
}
.careers .about {
    /*background-image: url("https://missionagency.com/images/marilyn.jpg");
  background-repeat: no-repeat;
  background-position: 1000px bottom;*/
    background-color: #302F2F;
    position: relative;
    z-index: 1;
    margin-top: 115vh;
}
.careers .about:before {
    content: '';
    display: block;
    position: absolute;
    background: #302F2F !important;
    top: -15vh;
    transform-origin: right top;
    transform: skewY(3deg);
    height: 30vh;
    width: 100%;
    opacity: 0.8;
}
.careers .about:after {
    content: '';
    display: block;
    position: absolute;
    background: #302F2F !important;
    top: 0;
    transform-origin: left top;
    transform: skewY(-3deg);
    height: 20vh;
    width: 100%;
}
.careers .about .intro {
    display: inline-block;
    float: left;
    width: calc(100% - 480px);
}
.careers .about .career-quote {
    display: inline-block;
    float: right;
    width: 320px;
    text-align: right;
    padding: 0 2%;
    position: relative;
    border: 2px solid rgba(255,255,255,0.15);
    margin: 20px 0;
    box-sizing: border-box;
}
.careers .about .career-quote .int {
    /*margin: -10px 0 -10px;*/
    text-align: left;
    padding-bottom:25px;
}
.careers .about .career-quote p {
    font-size: 22px;
    line-height: 40px;
    /*margin-bottom: 20px;*/
    color: #fff;
    font-weight: 100;
    transition:all 500ms ease;
}
.careers .about .career-quote p:hover {
    transform: translateX(15px);
    opacity:0.65;
}
.careers .about .career-quote h4 {
    color: #FE552F;
    font-size: 16px;
    /*margin-bottom: 20px;*/
    line-height: 19px;
    position: relative;
    top:-10px;
}
.careers .two-col {
    z-index: 2;
    position: relative;
}
.careers .two-col img:first-of-type {
    bottom: 0px;
}
.careers .two-col img:last-of-type {
    bottom: 100px;
    position: relative;
}
.rules-main{
    display: block;
    position: relative;
    max-width: 100%;
    margin: 0 auto;
    /*     background: url(https://missionagency.com/images/rule-bg-2.png) no-repeat center top; */
    background-size: cover;
    padding-bottom: 150px;
}
.rules-main .bg{
    display: block;
    position: absolute;
    max-width: 100%;
    margin: 0 auto;
    background: url(https://missionagency.com/images/rule-bg-2.png) no-repeat center top;
    top: 0;
    left: 0;
    background-size: cover;
    width: 100%;
    height: 100%;
    padding: 0px;
    opacity: 0.3;
}
.rules-contain{
    display: block;
    position: relative;
    max-width: 1048px;
    margin: 0 auto;
}
.rule-wrap {
    position: relative;
    z-index: 1;
    /*     border: 1px solid rgba(255,255,255,0.25); */
    margin: 0px auto 0px auto;
    width: 532px;
    margin-left: 535px;
    padding: 60px 0px;
    box-sizing: border-box;
    top:47px;
}
.rules-main img{
    position: absolute;
    top: -100px;
    left:-200px;
}
.rule-wrap .hdr-rule {
    position: relative;
    top: 0;
    left: 0;
    color: #fff;
    font-size: 27px;
    margin-bottom: 65px;
}
.rule-wrap .rules > div {
    display: inline-block;
    float:left;
    width:49%;
    text-align: left;
}
.rule-wrap .rules > div:last-of-type {
    border-right:none;
}
.rule-wrap .rules > div:first-of-type span {
    padding: 3px 11px;
}
.rule-wrap span {
    font-size:18px;
    color:#fff;
    border:2px solid #fff;
    border-radius: 100%;
    opacity: 0.35;
    padding: 3px 8px;
}
.rule-wrap h3 {
    /* 	font-style: italic; */
    font-size: 46px;
    color: #fff;
    margin: 11px 0px 35px 0px;
}
.rule-wrap h4 {
    font-size:20px;
    color:#F8E71C;
}
.rule-wrap hr{
    float: left;
    height: 5px;
    width: 114px;
    margin-bottom: 80px;
}
.rule-wrap .rules div:nth-child(2) hr{
    width: 217px;
}
.rule-wrap .rules div:nth-child(3) hr{
    width: 103px;
}
.rule-wrap .rules div:nth-child(4) hr{
    width: 179px;
}
.office {
    position:relative;
    z-index: 1;
    top:-80px;
}
.office .container{
    padding-top:0px;
}
.office .pushed {
    position: absolute;
    bottom: 28px;
    margin-left: 30px;
}
.office img {
    max-width: 100%;
    height: auto;
}
.offering {
    position:relative;
    display:block;
    padding: 100px 0;
}
.offering h2 {
    text-align: center;
    font-size: 50px;
    /*font-style: italic;*/
}
.offering .container {
    z-index: 1;
    padding: 0;
}
.offering .group {padding-top: 60px;}
.offering .group .col-third {
    float: left;
    width: 28%;
    text-align: center;
}
.offering .group .col-third:nth-child(3n+2) {margin: 0 8%;}
.offering .group .col-third:nth-child(3n+1) {clear: both;}
.offering .block {
    transition: all 0.3s ease;
    position: relative;
    overflow: visible;
    padding-top: 20px;
    z-index: 1;
    position: relative;
    margin-bottom: 40px;
}
.offering .block .block-title {padding: 0 10px;}
.offering .block-content {
    position: absolute;
    top: 0;
    left: 0;
    height: 0;
    overflow: hidden;
    width: 100%;
    padding: 0 12.5%;
    transition: all 0.3s ease;
    box-sizing: border-box;
}
.offering .block-content p {color: #fff;}
.offering h4,
.offering li {
    color: #fff;
    font-size: 20px;
    line-height: 1.4;
    position: relative;
    padding-bottom: 20px;
    text-transform: uppercase;
    font-family: Visby-Bold;
}
.offering h4:after,
.offering li .block-title:after {
    content: '';
    display: block;
    position: absolute;
    width: 20px;
    height: 4px;
    bottom: -20px;
    left: 50%;
    margin-left: -10px;
    background: #F8E71C;
}
.openings {
    width: 100%;
    /*
	background: url(https://missionagency.com/images/guys.png) no-repeat center top #FE552F;
	background-size: cover;
	*/
    position: relative;
}
.openings:before {
    /*
	content: '';
	display: block;
	position: absolute;
  background: #FE552F !important;
  top: -20vw;
  transform-origin: left top;
  transform: skewY(3deg);
  height: 20vw;
  width: 100%;
*/
}
.openings h2{
    text-align: center;
    font-size:50px;
    font-style: italic;
    color: #fff;
}
.careers .openings h2 {
    font-style: inherit;
}
.openings .container {
    z-index: 1;
    /* 	padding: 200px 0 20px 0; */
    padding-top:0px;
}
.openings .int {
    max-width: 1048px;
    margin: 0 auto;
    padding: 60px 0;
    width: 80%;
}
.openings .int .col h4{
    color: white;
    margin-bottom: 10px;
}
.openings .int .col{
    display: inline-block;
    float: left;
    width: 48%;
}
.openings .int .col:first-of-type{
    padding-right:1.5%;
}
.openings .int .col:last-of-type{
    padding-left:1.5%;
}
.openings .int a {
    display: block;
    /*border: 2px solid rgba(255,255,255,0.4);*/
    font: 25px "adelle",serif;
    line-height: 30px;
    color: #fff;
    /*padding: 24px 60px 24px 30px;*/
    margin-bottom: 24px;
    position: relative;
    font-weight: 100;
    transition:all 500ms ease;
}
.openings .int a:hover,
.openings .int a:focus {
    /*background: #5A5959;
	border: 2px solid #E6A10B;*/
    opacity: 0.65;
}
.openings .int a:after {
    content: '';
    display: block;
    position: absolute;
    width: 26px;
    height: 22px;
    background: url(https://missionagency.com/images/arr-yellow.png) no-repeat center center;
    background-size: cover;
    top: 50%;
    right: -30px;
    margin-top: -11px;
    transition:all 500ms ease;
}
.openings .int a:hover::after {
    transform:translateX(10px);
}
.openings .social-wrap {
    text-align: center;
    font-size: 0;
    margin: 26px auto 4px;
    float: none;
}
.openings .social {
    text-align: center;
    font-size: 0;
    margin: 26px auto 4px;
    display: block;
    float: none;
}
.openings .social a {
    display: inline-block;
    background: #fff;
    color: #FE552F;
    width: 24px;
    padding: 3px 0;
    text-align: center;
    font-size: 16px;
    line-height: 1;
    margin: 0 6px;
    border-radius: 4px;
}
.openings .social a:hover {background: #ccc;}
.openings .social p {
    font: 12px 'Visby-Regular';
    color: rgba(255,255,255,0.7);
    text-transform: uppercase;
    letter-spacing: 1px;
    display: inline-block;
    margin-right: 10px;
}
.reel{
    display: block;
    position: relative;
}
.reel video{
    display: block;
    width: 100%;
    position: relative;
}
.reel h2{
    position: absolute;
    top: 125px;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    font-size: 50px;
    z-index: 2;
}
.reel h2.flip{
    top: auto;
    bottom: 125px;
    transform: rotate(180deg);
}
.reel h2:before{
    content: " ";
    display: block;
    height: 53px;
    width: 1px;
    background: white;
    z-index: 2;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    top: -95px;
}
.summary h2{
    text-align: center;
    font-size: 50px;
    line-height:58px;
    font-style: italic;
    margin-bottom: 50px;
}
.summary p{
    text-align: center;
    color: white;
    max-width: 654px;
    margin: 0 auto 50px;
}
.summary .container{
    width:92%;
}
.summary .positions{
    max-width: 940px;
    margin: 0 auto;
    display: block;
    text-align: center;
}
.summary a h4{
    color: #FFFFFF;
    display: inline-block;
    margin: 20px 40px;
    text-align: center;
    transition:0.3s ease all;
    text-decoration: underline;
}
.summary a h4:hover{
    opacity: 0.75;
    color: white;
}

/* CAREER DETAIL
---------------------------------------------- */
.careers-detail{
    background:white;
}
.careers-detail .page-hdr {
    background-image:url('https://missionagency.com/images/guys.png');
    height: 500px;
}
.careers-detail .page-hdr .group {
    width: 1200px;
    margin: 0 auto;
    padding-top: 100px;
    display: table;
}
.careers-detail .page-hdr h1 {text-align: left;}
.careers-detail .page-hdr .cell-left {
    text-align: left;
    display: table-cell;
    vertical-align: bottom;
}
.careers-detail .page-hdr .cell-right {
    text-align: right;
    display: table-cell;
    vertical-align: bottom;
}
.careers-detail .page-hdr .cell-right h6 {
    color: #fff;
    text-transform: uppercase;
    font: 12px 'Visby-Bold';
    margin-bottom: 14px;
}
.careers-detail .page-hdr .social{font-size: 0;}
.careers-detail .page-hdr .social a {
    display: inline-block;
    background: #fff;
    color: #FE552F;
    width: 21px;
    padding: 2.5px 0;
    text-align: center;
    font-size: 16px;
    line-height: 1;
    margin-left: 10px;
}
.careers-detail .page-hdr  .social a:hover {background: #ccc;}
.careers-detail .helr {height: 500px;}
.careers-detail h1 {
    font-size: 35px !important;
    font-weight: 300;
    line-height: 1.2 !important;
    z-index: 1;
    position: relative;
    padding: 20px 0 0 0;
    margin-bottom: 0;
}
.careers-detail .back {
    color: #fff;
    margin-left: -20px;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
    display: inline;
}
.careers-detail .back:hover {
    color:#FEE12F;
}
.careers-detail .col-container {
    width: 1200px;
    margin: 0 auto;
    position: relative;
    display: block;
    padding: 30px 0 120px 0;
    height: 100%;
    z-index: 2;
}
.careers-detail .col{
    display:inline-block;
    float: left;
    position:relative;
}
.careers-detail .col:first-child{
    width: 55%;
    margin-right: 15%;
}
.careers-detail .col:last-child{
    width:30%;
}
.careers-detail .wysiwyg{
    margin: 0 auto;
    display: block;
    position: relative;
}
.careers-detail .triangle-overlay{
    position: absolute;
    bottom: -1px;
    width: 100%;
    font-size: 0;
    left: 0;
    z-index: 2;
}
.careers-detail .triangle-overlay img{
    width:105%;
}
.careers-detail .wysiwyg img{
    width:100%;
    height:auto;
    padding-bottom: 50px;
}
.careers-detail .wysiwyg h2 {padding: 0px 0px 20px 0px;}
.careers-detail .wysiwyg h3,
.careers-detail .wysiwyg h4,
.careers-detail .wysiwyg h5,
.careers-detail .wysiwyg p,
.careers-detail .wysiwyg ul {padding: 0px 0px 30px 0px;}
.careers-detail .wysiwyg h4 {
    font-size: 19px;
    line-height: 21px;
}
.apply{
    text-align: center;
    padding-top: 60px;
}
.apply h4{
    margin-bottom: 35px;
    text-align: left;
}
.apply input[type=text]{
    width:94%;
    margin:16px 0px;
    color:#5A5959;
}
.apply .btn:hover {background: #efefef;}
.careers-detail .share .social {
    text-align: center;
    font-size: 0;
    margin-bottom: 16px;
}
.careers-detail .share .social a {
    display: inline-block;
    background: #FE552F;
    color: #fff;
    width: 27px;
    padding: 3px 0;
    text-align: center;
    font-size: 20px;
    line-height: 1;
    margin-right: 10px;
}
.careers-detail .share .social a:hover {background: #ccc;}
.uploads {
    float: left;
    width: 100%;
    margin-bottom: 16px;
}
.uploads .resume {
    position: relative;
    float: left;
    width: 48%;
    margin-right: 4%;
    border: 1px solid #B9B8B8;
    box-sizing: border-box;
}
.uploads .cover-letter {
    position: relative;
    float: left;
    width: 48%;
    border: 1px solid #B9B8B8;
    box-sizing: border-box;
}
.uploads .upload-item {
    overflow: hidden;
}
.uploads .upload-item:hover {
    cursor: hand;
    cursor: pointer;
}
.uploads p {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-family: Visby-Bold;
    color: #5A5959;
    line-height: 27px;
    margin: 10px 0 0;
    padding: 0;
}
.uploads h5 {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-family: Visby-Regular;
    color: #5A5959;
    line-height: 27px;
    margin-bottom: 30px;
    padding: 0;
    font-style: italic;
}
.uploads span.icon {
    float: left;
    width: 100%;
    height: 36px;
    background: url('https://missionagency.com/images/icon-uploading.png') no-repeat;
    margin-top: 15px;
}
.uploads span.icon.upload {
    background-position: center 0;
}
.uploads span.icon.check {
    background-position: center -36px;
}
.uploads span.icon.clear,
.uploads span.icon.error {
    background-position: center -72px;
}
.uploads input.file-input.error ~ p,
.uploads input.file-input.error ~ h5 {color: #ff0000;}
.uploads input.file-input {
    position: absolute;
    left: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    z-index: 999;
    margin-bottom: 0;
    padding: 0;
}
.uploads input.file-input:hover {
    cursor: hand;
    cursor: pointer;
}
.requirements{
    width: 100%;
    background: #efefef;
    padding: 13px 0px;
    margin-bottom: 16px;
}
.requirements input[type=radio]{
    display: inline-block;
    margin-right:5px;
}
.requirements input[type=radio]:hover{
    cursor: pointer;
}
.requirements h5{
    display: inline-block;
    font-style: italic;
    margin-left:5px;
    position:relative;
    top:1px;
}

/* CONTACT
---------------------------------------------- */
.contact .page-hdr {
    /*
	background-color: #202020;
	height: 115vh;
	background-attachment: fixed;
	position: absolute;
*/
    background-attachment: fixed;
}
.contact .page-hdr:after {display: none;}
.contact .about {
    position: relative;
    background: #202020;
    padding-bottom: 50px;
    /* 	margin-top: 115vh; */
}
.contact .hdr-wrap{
    overflow: inherit;
}
.contact .about:before {
    content: '';
    display: block;
    position: absolute;
    background: #202020;
    top: -15vh;
    transform-origin: right top;
    transform: skewY(3deg);
    height: 30vh;
    width: 100%;
    opacity: 0.8;
}
.contact .about:after {
    content: '';
    display: block;
    position: absolute;
    background: #202020;
    top: 0;
    transform-origin: left top;
    transform: skewY(-3deg);
    height: 20vh;
    width: 100%;
}
.contact .about .columns {
    max-width:1183px;
    width:92%;
    margin: 0 auto;
    position:relative;
    display:block;
    padding:0 0px 200px 0px;
    z-index: 1;
}
.contact .about .col {margin-top: -5vw;}
.contact .col:first-of-type{
    display:inline-block;
    float: left;
    width:60%;
    padding-right:10%;
}
.contact .col:last-of-type{
    display: inline-block;
    float: left;
    width: 25%;
    text-align: right;
    padding: 0 2% 2% 2%;
    position:relative;
    color: white;
    font-size: 13px;
    line-height: 17px;
    margin-bottom: 30px;
    border: none;
}
.contact .about .col:last-of-type p {
    color: white;
    font-size: 13px;
    line-height: 17px;
    margin: 5px 0px 30px 0px;
}
.contact .about h2{
    color:white;
    margin-bottom:20px;
}
.contact .about .col h4 {
    color: rgba(255, 255, 255, .45);
    font-size: 12px;
}
.contact .about .col p, .home #contact-form h4 + p{
    font-size: 15px;
    line-height: 31px;
    letter-spacing: 0.25px;
    font-family: "adelle",serif;
    color: white;
    padding-bottom: 10px;
}

.home #contact-form h4 + p{
    margin-bottom: 30px;
}

.contact .about .col form{
    margin-top: 35px;
}
.contact .about .col a {color: #fff;}
.contact .about .col a:hover {color: #FEE12F;}
.contact .about .grid:before {background: none;}
.contact .about ul {
    padding-bottom:45px;
}
.contact .about ul li {
    padding-left:40px;
    position:relative;
    color:#fff;
}
.contact .about ul li:before {
    width: 20px;
    height: 2.5px;
    content: " ";
    background-color: #e2e2e2;
    position: absolute;
    left: 2px;
    top: 14px;
}
.contact .about .social {font-size: 0;}
.contact .about .social a {
    display: inline-block;
    background: #fff;
    color: #302F2F;
    width: 21px;
    padding: 2.5px 0;
    text-align: center;
    font-size: 16px;
    line-height: 1;
    margin-left: 10px;
}
.contact .about .social a:hover {
    background: #ccc;
    color: #302F2F;
}
.contact-form .form-field{
    position: relative;
    margin: 0px 3% 25px 0px;
    float: left;
}
.contact-form.form-jobs .form-field {
    width: 100%;
}
.contact-form .form-field--half{
    width: 42%;
}

.contact-form .form-field--full{
    width: 87%;
}

.contact-form .form-field.selected{
    background: rgba(0, 0, 0, 0.5);
}
.contact-form.form-jobs .form-field.selected{
    background: #fff;
}

.contact-form input[type=text],
.contact-form input[type=email],
.contact-form textarea{
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid #B9B8B8;
    color: #fff;
    font-size: 14px;
    padding: 14px;
    margin:0;
    width:100%;
    box-sizing: border-box;
}
.contact-form.form-jobs input[type=text],
.contact-form.form-jobs input[type=email],
.contact-form.form-jobs textarea{
    background: #ffffff;
    color: #5A5959;
}

.contact-form input[type=text]::-moz-placeholder, .contact-form input[type=email]::-moz-placeholder, .contact-form textarea::-moz-placeholder {
    color: #fff;
}

.contact-form input[type=text]:-ms-input-placeholder, .contact-form input[type=email]:-ms-input-placeholder, .contact-form textarea:-ms-input-placeholder {
    color: #fff;
}

.contact-form input[type=text]::placeholder,
.contact-form input[type=email]::placeholder,
.contact-form textarea::placeholder {
    color: #fff;
}
.contact-form.form-jobs input[type=text]::-moz-placeholder, .contact-form.form-jobs input[type=email]::-moz-placeholder, .contact-form.form-jobs textarea::-moz-placeholder {
    color: #5A5959;
}
.contact-form.form-jobs input[type=text]:-ms-input-placeholder, .contact-form.form-jobs input[type=email]:-ms-input-placeholder, .contact-form.form-jobs textarea:-ms-input-placeholder {
    color: #5A5959;
}
.contact-form.form-jobs input[type=text]::placeholder,
.contact-form.form-jobs input[type=email]::placeholder,
.contact-form.form-jobs textarea::placeholder {
    color: #5A5959;
}

.contact-form .btn{
    margin-top:30px;
}

.contact-form .form-field .floating-label{
    font-size: 14px;
    font-family: Visby-Bold;
    letter-spacing: 1px;
    color:#fff;
    position: absolute;
    left:15px;
    top:16px;
    transition: all 0.3s ease;
    text-transform: lowercase;
}
.contact-form.form-jobs .form-field .floating-label{
    color:#5A5959;
}

.contact-form .form-field .floating-label--sentence{
    text-transform:none;
}

.contact-form .form-field--required .floating-label::after{
    content:'*';
    color:#FEE12F;
}
.contact-form.form-jobs .form-field--required .floating-label::after{
    color:#B60100;
}

.contact-form .form-field:focus-within .floating-label,
.contact-form .form-field.selected .floating-label{
    transform: translate(-11px, -33px) scale(0.8);
}

.contact-form .form-field.error .floating-label{
    background-color:#B60100;
    padding:0.25em;
}
.contact-form.form-jobs .form-field.error .floating-label{
    color:#fff;
}
.contact-form.form-jobs .form-field.error .floating-label::after{
    color:#fff;
}

.contact-form .form-field.selected.error .floating-label{
    transform: translate(-11px, -28px) scale(0.8);
}

/* JMS
---------------------------------------------- */
.jms{
    background-color:#373737;
}
.jms .about{
    background-image: url('https://missionagency.com/images/jms-bg.jpg');
    background-color:#595959;
    background-size: cover;
    background-position: bottom center;
    position: relative;
}
.jms .about .columns {
    max-width: 1183px;
    width: 92%;
    margin: 0 auto;
    position: relative;
    display: block;
    padding: 100px 0px 60px 0;
    z-index: 1;
}
.jms .about h2 {
    color: white;
    margin-bottom: 20px;
}
.jms .about h3 {
    padding-left: 0;
}
.jms .about ul {
    padding-bottom: 30px;
    color: #fff;
}
.jms .about .col:first-of-type {
    display: inline-block;
    float: left;
    width: 60%;
    padding-right: 10%;
}
.jms .about .col:last-of-type {
    display: inline-block;
    float: left;
    width: 25%;
    text-align: right;
    padding: 0 2% 2% 2%;
    position: relative;
    color: white;
    font-size: 13px;
    line-height: 17px;
    margin-bottom: 30px;
    border: none;
}
.jms .wysiwyg p {
    padding-left:0px;
    color: #fff;
}
.wysiwyg h2 {
    padding-left:0px;
    margin-bottom:0px;
}
.jms .underscore{
    margin: 100px 0px 50px 0px;
    color: white;
}
.jms .jay {
    padding-top: 0px;
    top: -73px;
}
.jms .belief {
    font-size: 15px !important;
    line-height: 22px !important;
    margin: 5px 0px 30px 0px;
    color: #fff;
}
.jms .about .col a {color: #fff;}
.jms .about .col a:hover {color: #FEE12F;}
.jms .about .social {font-size: 0;}
.jms .about .social a {
    display: inline-block;
    background: #fff;
    color: #302F2F;
    width: 17px;
    padding: 1.5px 0;
    text-align: center;
    font-size: 14px;
    line-height: 1;
    margin-left: 10px;
}
.jms .about .social a:hover {
    background: #ccc;
    color: #302F2F;
}
.jms .jay hr {
    margin: 20px 0px 30px 0px;
    display: inline-block;
}
.jms .jay h4 {
    margin-bottom: 20px;
    color: rgba(255, 255, 255, .45);
    font-size: 12px;
}
.jms .jay h3 {
    color:#FE552F;
}
.jms .jay .tel {
    margin-bottom: 0px !important;
}
.jms .about .col:last-of-type p {
    color: white;
    font-size: 13px;
    line-height: 17px;
    margin: 5px 0px 30px 0px;
}
.jms .jay .social-wrap{
    display:block;
    float:right;
    margin-top:10px;
    text-align: right;
}
.jms .jay .social-wrap h4{
    display: inline-block;
    margin:11px 3px 0px 0px;
    color: rgba(255, 255, 255, .45);
    font-size: 12px;
}
.jms .jay .social-wrap .social {
    display: inline-block !important;
    margin-top: 10px;
}
.jms .signature{
    background: url('https://missionagency.com/images/signature.png') no-repeat;
    background-size:cover;
    background-position:center center;
    margin-top:30px;
    width:215px;
    height:36px;
}
.jms .form-container {
    max-width: 1183px;
    width: 92%;
    margin: 0 auto;
}
.jms .form-container .contact-form {padding-bottom: 60px;}
.jms .form-container .int {width: 60%;}
.jms .examples{
    position: relative;
    width: 100%;
    max-width: 1322px;
    margin: 0 auto;
    padding-bottom:40px;
}
.jms .examples .col{
    width:33%;
    display:inline-block;
    float: left;
    padding:0px !important;
}
.jms .examples .col .thumb{
    width: 100%;
    height: 200px;
    margin: 25px 0px;
    position:relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.jms .examples .col .thumb{
    width: 80%;
    height: 200px;
    margin: 0px 10% 10px;
}
.jms .examples .col .thumb-wrap {
    margin-bottom:30px;
}
.jms .examples .col .thumb-wrap h4{
    margin-left:10%;
    text-align: left;
    font-size:12px;
    color:#B9B8B8;
}
.jms .examples .col .thumb-wrap h3{
    margin-left:10%;
    text-align: left;
    color:white;
}
.jms .examples .col .thumb .overlay{
    opacity: 0;
    transition: all .3s ease 0s;
    -webkit-transition: all .3s ease 0s;
}
.jms .examples .col .thumb:hover .overlay{
    opacity: 0.8;
    cursor: pointer;
}
.jms .examples .col .title{
    color: #fff;
    margin-left: 10%;
    margin-bottom: 30px;
    text-align: left;
}
.landing-popup {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.92); z-index: 9999;}
.landing-popup-wrap {display: table; width: 40%; max-width: 480px; height: 100%; margin: 0 auto;}
.landing-popup-content {display: table-cell; vertical-align: middle; text-align: center; color: #fff;}
.landing-popup-content img {width: 100%; height: auto; margin-bottom: 18px;}
.landing-popup-content h1 {font: 400 32px/42px "adelle-sans","adelle",sans-serif; margin-bottom: 16px;}
.landing-popup-content h2 {font: 400 20px/32px "adelle-sans","adelle",sans-serif; margin-bottom: 16px; color: #fff;}
.landing-popup-content h3 {font: 400 14px/20px "adelle-sans","adelle",sans-serif; margin-bottom: 24px;}
.landing-popup-content p a {font: 400 20px/20px "adelle-sans","adelle",sans-serif; display: inline-block; color: #f6f6f6 !important; background: #FE552F; padding: 14px 24px;}
.landing-popup-content p a:hover {background: #545150;}

/* POPUP
---------------------------------------------- */
.popup-fade {
    position: fixed;
    z-index: 999999;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(48,48,48,0.9);
    display: none;
    visibility: hidden;
    opacity: 0;
    transition: all .3s ease;
}
.popup-fade.active {
    display: block;
    visibility: visible;
    opacity: 1;
    transition: all .3s ease;
}
.staff-popup .btn-close {
    display: block;
    width: 30px;
    height: 30px;
    background: url(https://missionagency.com/images/btn-close.png) no-repeat center center;
    background-size: cover;
    color: #fff;
    cursor: pointer;
    opacity: 1;
    position: absolute;
    top: -45px;
    right: -45px;
    border:0;
    -webkit-appearance: none;
}
.staff-popup .btn-close:focus{
    outline: 2px solid;
    outline-offset: 3px;
}

.staff-popup {
    width: 80%;
    max-width: 1260px;
    height: 640px;
    position: absolute;;
    z-index: 999999;
    left: 50%;
    margin-left: -630px;
    background: #363636;
    box-shadow: 0px 0px 8px 2px rgba(0,0,0,0.5);
    display: none;
    visibility: hidden;
    opacity: 0;
}
.staff-popup.active {
    display: block;
    visibility: visible;
    opacity: 1;
}
.staff-popup-int {
    padding: 15px;
    height: 100%;
    box-sizing: border-box;
}
.staff-popup-pic {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    width: 50%;
    height: 100%;
    float: left;
    position: relative;
}
.staff-popup-pic:before {
    content: '';
    display: block;
    position: absolute;
    background: #363636;
    top: 0;
    right: 0;
    transform-origin: left bottom;
    transform: skewX(-4deg);
    height: 100%;
    width: 50px;
}
.staff-popup-pic:after {
    content: '';
    display: block;
    position: absolute;
    background: #363636;
    top: 0;
    right: -40px;
    transform-origin: left bottom;
    transform: skewX(4deg);
    height: 100%;
    width: 50px;
    opacity: .7;
}
.staff-popup-pic-mobile {
    display: none;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    width: 100%;
    height: 320px;
    position: relative;
    overflow: hidden;
}
.staff-popup-pic-mobile:before {
    content: '';
    display: block;
    position: absolute;
    background: #363636;
    top: 0;
    right: -20px;
    transform-origin: left bottom;
    transform: skewX(-5deg);
    height: 100%;
    width: 50px;
}
.staff-popup-pic-mobile:after {
    content: '';
    display: block;
    position: absolute;
    background: #363636;
    top: 0;
    right: -45px;
    transform-origin: left bottom;
    transform: skewX(5deg);
    height: 100%;
    width: 50px;
    opacity: .7;
}
.staff-popup-content {
    float: left;
    width: 50%;
    height: 100%;
    box-sizing: border-box;
    padding: 60px 0 40px 0;
    position: relative;
}
.staff-popup-content-int {
    padding: 0 30px 0 20px;
    height: 100%;
    overflow-y: auto;
    position: relative;
    z-index: 10;
    margin-left: -30px;
}
.staff-popup-content-int h2 {
    color: #fff;
    font-size: 36px;
    margin-left: 25px;
}
.staff-popup-content-int h4 {
    font-size: 14px;
    margin-left: 25px;}
.staff-popup .bio-text {
    padding-top: 30px;
    background: #363636;
    margin-left: 25px;
}
.staff-popup .bio-text p {
    color: #fff;
    font-size: 13px;
    font-weight: 300;
    line-height: 1.8;
    margin-bottom: 20px;
}
.agency .hmg-slider h4.mobile-hmg{
    display: none;
}
.agency .we .col .houdini2{
    display: none;
}

.goals h5 {
    font-size: 22px;
    line-height: 27px;
    color: #5A5959;
    font-family: 'Visby-Regular',serif;
    margin: 15px 0;
    font-weight: 100;
}

.goals h5 b {
    font-family: 'Visby-Bold';
}

/* Natural Foods Expo Landing
---------------------------------------------- */
.natural-foods-expo .top .hmg-icons,
.natural-foods-expo .top .nav,
.cpg .top .hmg-icons,
.cpg .top .nav{
    display: none;
}

.expo-page-header{
    /*position: fixed;
	z-index: 998;
	width:100%;
	top:0;
	left:0;*/
    text-align: right;
}

.expo-page-header-content{
    text-align: right;
    padding:40px;
}

.expo-page-header .btn{
    display: inline-block;
    padding:0 40px;
    pointer-events: all;
    transition: transform 0.3s ease;
    transform-origin: right top;
}

.expo-page-header.shrink .btn{
    transform: scale(0.75);
}

.nat-foods{
    overflow: hidden;
}

.nat-foods .page-hdr.full-page-hdr {
    /*background-image:url('https://missionagency.com/images/agency.png');*/
    background-attachment:fixed;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width:auto;
    /*height: auto;*/
    min-height: 0;
    /*padding: 206px 3% 0;*/
}

.nat-foods .page-hdr.full-page-hdr::before{
    display: none;
}

.nat-foods .full-page-hdr .container{
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    padding:0;
}

.cover-image{
    position: relative;
    z-index: 5;
    background-position:center;
    background-repeat: no-repeat;
    background-size: cover;
}

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

.expo-reel-wrapper{
    position: relative;
    z-index: 1;
    margin-right: 27px;
}

.expo-reel-wrapper::after{
    display: block;
    content: '';
    position: absolute;
    z-index: 9;
    pointer-events: none;
    width:100%;
    height:100%;
    top:27px;
    left:27px;
    border:1px rgba(255,255,255,0.54) solid;
}

.expo-reel-placeholder{
    overflow: hidden;
}

.full-page-hdr .expo-reel-placeholder:hover,
.full-page-hdr .expo-reel-placeholder:focus{
    opacity:1;
}

.expo-reel-placeholder .cover-image{
    padding-top:56.12%;
}

.expo-reel-placeholder-inner{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 8;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color: rgba(30,30,30,0.65);
}

.expo-reel-placeholder-inner .play-btn{
    box-sizing: border-box;
}

.expo-reel-placeholder-inner .play-btn-text{
    display: block;
    margin-top: 0.125em;
    font-family:"adelle",serif;
    font-size:20px;
    font-weight: 500;
    font-style: italic;
    line-height: 1.3;
    color:#fff;
    letter-spacing: 0.0937em;
}

.expo-reel-placeholder-inner .play-btn-text::before{
    content:'[';
}

.expo-reel-placeholder-inner .play-btn-text::after{
    content:']';
}


.expo-intro-section::before {
    content: "";
    transform:skewY(3deg);
    background:#302F2F;
    width:150%;
    left:-10%;
    height:120px;
    top:-50px;
    display: block;
    position: absolute;
    opacity:0.8;
}
.expo-intro-section::after {
    content: "";
    background:#fff;
    width:150%;
    left:-10%;
    height:120px;
    top:0px;
    display: block;
    position: absolute;
}
.expo-intro-section {
    background: #fff;
    padding:0 3% 75px;
    position: relative;
    margin-top: -10px;
    z-index: 5;
}
.expo-intro-section .container {
    position: relative;
    padding:0px;
}
.nat-foods .expo-intro-section .container {
    top:-40px;
}
.friendship-div {
    position: relative;
    z-index: 1;
    background:#fff;
    padding-top:40px;
    padding-right:50px;
    margin-top: 100px;
}
.frendship-div-title{
    max-width: 540px;
    color:black;
    position: relative;
    margin-bottom:50px;
    font-size:35px;
    line-height: 45px;
}
.frendship-div-title::after{
    content:"";
    position: absolute;
    width:75px;
    height:2px;
    background-color:#aaa;
    left:0px;
    bottom:-25px;
}
.friendship-div p {
    font-size:17px;
    line-height: 31px;
    letter-spacing:0.016em;
    color:black;
    margin-bottom:25px;
    max-width:550px;
}
.partner-div {
    display:flex;
    justify-content: center;
    position: relative;
    align-items: center;
}
.partner-div h4 {
    font-family:Visby-Bold;
    font-size: 17px;
    line-height: 24px;
    letter-spacing: 0.117em;
    margin-bottom:35px;
    margin-left:-35px;
}
.partner-div h5 {
    font-family:"adelle",serif;
    font-size:36px;
    line-height: 31px;
    letter-spacing:0.028em;
    margin-bottom:15px;
    color:black;
    position: relative;
    font-weight: 600;
}
.partner-div h5::before {
    content:"";
    position: absolute;
    left:-35px;
    width:24px;
    height:4px;
    background:#FE552F;
    bottom:3px;
}
.nat-foods .flex-holder {
    display:flex;
}
.nat-foods .width-50 {
    width:50%;
}
.nat-foods .gradient-section {
    background:linear-gradient(180deg, #F2F2F2 0%, #fff 498px);
    box-sizing: border-box;
    padding:112px 14px 30px;
}

.nat-foods .gradient-section *{
    box-sizing: inherit;
}
.nat-foods .page-hdr .btn {
    background-color:#FE552F;
    color:white;
    margin:10px;
}
.nat-foods .page-hdr .flex_holder {
    display:flex;
    align-items: center;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    z-index: 5;
    top: 60%;
    width: 75%;
    display: flex;
    justify-content: space-evenly;
}
@media(max-width:650px) {
    .nat-foods .page-hdr .flex_holder {
        flex-direction: column;
    }
}
.gradient-section-header{
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 50px;
}

.gradient-section h3 {
    color:black;
    font-family:Visby-Bold;
    font-size: 40px;
    line-height: 40px;
    margin-bottom:15px;
}
.gradient-section p.orange-p {
    color:#FE552F;
    font-size: 28px;
    line-height: 40px;
    letter-spacing: 0.0125;
    max-width: 592px;
    margin-bottom:0;
}

.expo-video-placeholder{
    display: block;
    position: relative;
    z-index: 1;
}

.expo-video-placeholder .play-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border-width: 12px;
    border-color: rgba(248, 232, 28, 0.53);
    border-style: solid;
    text-align: center;
    box-shadow: inset 125px 0px 0px #f8e81c;
    z-index: 100;
    transition: 0.3s ease all;
}

.expo-video-placeholder .play-btn::before{
    display: block;
    content:'';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 17px 0 17px 26px;
    border-color: transparent transparent transparent #1E1E1E;
    margin-left: 10px;
    flex-shrink: 0;
}

.expo-video-placeholder:hover .play-btn,
.expo-video-placeholder:focus .play-btn{
    border-width: 0;
}

.expo-video-placeholder .cover-image,
.expo-video-placeholder .cover-image{
    transition:transform 0.4s ease;
}

.expo-video-placeholder:hover .cover-image,
.expo-video-placeholder:focus .cover-image{
    transform:scale(1.1);
}

.expo-slider-section{
    display: flex;
    align-items: center;
    max-width: 1321px;
    padding:0;
    margin-bottom: 50px;
}

.expo-slider-header{
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background:#1E1E1E;
    color:#fff;
    padding:70px 44px;
    margin-right:-83px;
    width:336px;
    min-height: 436px;
    flex-shrink: 0;
    box-shadow:0 15px 40px rgba(0, 0, 0, 0.5);
}



.expo-slider-section + .expo-slider-section .expo-slider-header{
    /*margin-right:0;*/
}

.expo-slider-section + .expo-slider-section:nth-child(even){
    flex-direction: row-reverse;
}

.expo-slider-title {
    position: relative;
    z-index: 1;
    font-family: Visby-Bold, sans-serif;
    font-size:17px;
    line-height: 1.41;
    letter-spacing: 0.11765em;
    text-transform: uppercase;
    color:inherit;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.expo-slider-title::after{
    display: block;
    content: '';
    position: absolute;
    z-index: 1;
    left:0;
    bottom:0;
    width:24px;
    height: 4px;
    background-color: #FE552F;
}

.expo-slider-description{
    color:inherit;
    font-size: 18px;
    line-height: 2;
    margin-bottom:1em;
}

.expo-slider-nav .slick-dots{
    text-align: left;
    margin:0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.expo-slider-nav .slick-dots li {
    font-size: inherit;
    display: inline-block;
    border: 0;
    background: transparent;
    border-radius: 0;
    margin: 0 15px 0 0;
    line-height: 1;
}

.expo-slider-nav .slick-dots li:last-child{
    margin: 0;
}

.expo-slider-nav .slick-dots li button {
    font-size: inherit;
    width: 15px;
    height: 15px;
    display: block;
    cursor: pointer;
    margin: 0;
    padding:0;
    background: transparent;
    border-radius: 50%;
    border:2px rgba(248,231,28,0.45) solid;
    padding: 0;
    transition:all 0.2s ease;
    overflow: hidden;
    text-indent: -9999em;
}

.expo-slider-nav .slick-dots li button:hover{
    background-color: rgba(248,231,28,0.45);
}

.expo-slider-nav .slick-dots li.slick-active button{
    background-color: #F8E71C;
    border-color: #F8E71C;
}


.expo-slider-wrapper{
    flex-grow: 1;
    min-width: 0;
}

.expo-slider{
    width:100%;
    position: relative;
    z-index: 1;
}

.expo-slider .cover-image{
    z-index: 5;
}

.expo-slider .slide-image{
    padding-top: 56.17%;
}

.expo-slider .expo-video-placeholder .play-btn{
    position: absolute;
    z-index: 8;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
}

.expo-page-footer{
    position: relative;
    z-index: 1;
    background:#1E1E1E url(../images/fire-alt-solid.png) no-repeat right 40px bottom -10px;
    background-size: 458px auto;
    color:#fff;
    text-align: center;
    padding:200px 3.5% 70px;
    margin-top: -80px;
    margin-bottom: 32px;
    overflow: hidden;
}

.expo-page-footer::before {
    content: "";
    transform:skewY(-3deg);
    background:#fff;
    width:150%;
    left:-10%;
    height:150px;
    top:-75px;
    display: block;
    position: absolute;
}

.expo-page-footer .container{
    padding:0;
    max-width: 900px;
}

.expo-page-footer-content{
    position:relative;
    z-index: 1;
    border:2px rgba(255,255,255,0.27) solid;
    padding:52px 106px 64px;
}

.expo-page-footer-title,
.expo-page-footer-subtitle,
.expo-page-footer a{
    color: inherit;
}

.expo-page-footer-title{
    position: absolute;
    top:-0.65em;
    left:0;
    max-width: 100%;
    font-family: Visby-Bold, sans-serif;
    font-size: 50px;
    line-height: 1;
    letter-spacing: 0.016em;
    margin:0;
    padding:0 0.5rem;
}

.expo-page-footer-subtitle{
    max-width: 575px;
    margin:0 auto 27px;
}

.expo-page-footer-subtitle a{
    text-decoration: underline;
}

.expo-page-footer-highlight{
    font-family: Visby-Bold, sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    font-style: italic;
    line-height: 1.55;
    padding-bottom:10px;
    color:#F8E71C;
    max-width: 184px;
    text-align: center;
    margin: 0 auto 12px;
    border-bottom: 1px #AFAFAF solid;
}

.expo-page-footer h4{
    color:inherit;
    text-align: center;
    font-size: 17px;
    letter-spacing: 0.076em;
    font-weight: 700;
    margin-bottom: 1em;
}


.contact-form--expo .form-field--half{
    width:48.5%;
}

.contact-form--expo .form-field--full{
    width:100%;
}

.contact-form--expo .form-field--nospace,
.contact-form--expo .form-field--full{
    margin-right: 0;
}

.contact-form--expo input[type=text],
.contact-form--expo input[type=email],
.contact-form--expo textarea,
.contact-form--expo .form-field.selected{
    background-color: transparent;
}

.contact-form--expo .btn.gtm-contact-submit:hover,
.contact-form--expo .btn.gtm-contact-submit:focus{
    background-color: #fff!important;
}



.expo-page-footer-social{
    display: flex;
    background:#1E1E1E;
    position: absolute;
    z-index: 5;
    bottom:0;
    left:50%;
    transform:translate(-50%,50%);
    padding:12px;
}

.expo-page-footer-social a{
    display: block;
    margin-right: 12px;
    flex-shrink: 0;
    text-decoration: none;
    color: #fff;
}

.expo-page-footer-social a:last-child{
    margin-right: 0;
}

.expo-page-footer-social svg{
    fill:currentColor;
    width:24px;
    height: 24px;
    transition: all 0.2s ease;
}

.expo-page-footer-social a:hover svg{
    fill:#FEE12F;
}


@media (max-width: 1024px) {

    .nat-foods .page-hdr.full-page-hdr{
        padding-top:131px;
    }

    .natural-foods-expo .top,
    .cpg .top{
        padding:0;
    }
    .expo-intro-section::before {
        background-color:white;
        opacity:1;
    }
    .natural-foods-expo .expo-page-header.top,
    .cpg .expo-page-header.top{
        background-color: #1E1E1E;
        padding:12px;
        z-index: 998;
    }

    .expo-page-header .btn,
    .expo-page-header.shrink .btn{
        transform: none;
        font-size: 15px;
        padding:0 28px;
        height: 41px;
        line-height: 38px;
    }

    .expo-intro-section{
        margin-top:0;
    }

    .nat-foods .width-50{
        width:auto;
    }

    .friendship-div{
        margin: auto;
    }

    .partner-div{
        display:none ;
    }




    .expo-slider-section,
    .expo-slider-section + .expo-slider-section{
        flex-direction: column-reverse;
        justify-content: center;
        align-items: stretch;
    }


    .expo-slider-section + .expo-slider-section:nth-child(even){
        flex-direction: column-reverse;
        justify-content: center;
        align-items: stretch;
    }


    .expo-slider-header,
    .expo-slider-section + .expo-slider-section .expo-slider-header{
        margin:-18px 14px 0;
        flex-direction: row;
        align-items: center;
        width: auto;
        min-height: 0;
        padding:35px 22px;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.35);
    }

    .expo-slider-title {
        padding:0;
        margin:0 1em 0 0;
    }

    .expo-slider-title::after,
    .expo-slider-description{
        display: none;
    }
    .expo-slider-wrapper{
        width:100%;
    }

    .expo-page-footer{
        background-image: none;
    }

    .expo-page-footer-content {
        padding: 84px 4% 64px;
    }

    .expo-page-footer-title{
        width:100%;
        font-size: 36px;
        max-width: 335px;
        left:50%;
        top:0;
        transform: translate(-50%,-50%);
    }

}

@media (max-width: 600px) {

    .expo-reel-wrapper{
        margin-right: 9px;
    }

    .expo-reel-wrapper::after{
        top:9px;
        left:9px;
    }

    .expo-intro-section{
        padding-bottom: 25px;
    }

    .friendship-div{
        padding:50px 3% 0;
    }

    .frendship-div-title{
        font-size: 30px;
        line-height: 1.5;
    }

    .frendship-div-title::after{
        width:184px;
        height:1px;
        opacity: 0.5;
    }

    .nat-foods .gradient-section{
        padding-top: 46px;
        padding-bottom: 3px;
    }

    .gradient-section h3{
        font-size: 32px;
        line-height: 1.25;
        margin: 0;
    }

    .gradient-section p.orange-p{
        font-size: 17px;
        letter-spacing: 0.0125em;
        line-height:1.64;
        margin-bottom: 40px;
    }

    .expo-slider-header,
    .expo-slider-section + .expo-slider-section .expo-slider-header{
        margin:-9px 7px 0;
        padding:14px 16px;
    }
    .expo-slider-title{
        font-size: 14px;
    }

    .expo-slider-nav .slick-dots li button{
        width:14px;
        height: 14px;
    }

    .expo-reel-placeholder-inner .play-btn-text{
        font-size: 12px;
    }

    .expo-video-placeholder .play-btn{
        width:61px;
        height: 61px;
        border-width: 6px;
    }

    .expo-video-placeholder .play-btn::before{
        border-width: 10.5px 0 10.5px 16px;
        margin-left: 5px;
    }

    .expo-page-footer{
        padding-bottom: 54px;
    }

    .expo-page-footer-subtitle{
        font-size: 18px;
    }

    .expo-page-footer h4{
        font-size: 14px;
        line-height: 1.71;
    }

}


/* MEDIA QUERIES
---------------------------------------------- */
/* custom home slider */
@media (min-width: 1360px) {
    .home-slider .new-normal-slide .left-col video {
        height: 70vw;
        width:auto;
    }
}
@media (min-width: 1360px) and (max-width: 1900px) and (min-height: 1080px) {
    .home-slider .left-col video,
    .home-slider .left-col img {
        height: 100%;
        width: auto;
    }
}
@media (min-width: 1024px) and (max-width: 1360px) and (min-height: 660px) {
    .home-slider .left-col video,
    .home-slider .left-col img {
        height: 100%;
        width: auto;
    }
}
@media (min-width: 1800px) {
    .home-slider .left-col video,
    .home-slider .left-col img {
        height: auto;
        width: 110%;
    }
    .home-slider .left-col .videos.bg {
        height: auto;
        width: 60%;
    }
}
@media (min-width: 1800px) and (max-width: 2100px) and (min-height: 1080px) {
    .home-slider .left-col video,
    .home-slider .left-col img {
        height: 100%;
        width: auto;
    }
    .home-slider .left-col{
        width: 50%;
    }
    .home-slider .right-col{
        width: 50%;
    }
    .home-slider .slider-nav {
        left:59.5%;
    }
    .home-slider div.slick-slide:after{
        left:53%;
    }

}
@media screen and (max-height: 600px) {
    .home-slider .right-col .desc{
        height: 160px;
    }
    .home-slider .right-col .desc h2{
        margin: 2% 5% 5% 5%;
    }
}
/* standard media queries */
@media (max-width: 1490px) {
    .staff-popup {
        left: 10%;
        margin-left: 0;
    }
}
@media (max-width: 1360px) {
    .home-slider .left-col{
        width: 45%;
    }
    .home-slider .right-col{
        width: 55%;
    }
    .home-slider .slider-nav {
        left:55%;
    }
    .home-slider div.slick-slide:after{
        left:49%;
    }
    .left-col .scroll{
        left: -55%;
    }
    .agency .staff-grid .person .brief{
        width: 108%;
    }
    .agency .staff-grid .person.person-next .brief{
        width:79%;
    }
    .reel .container{
        width: 92%;
    }
    .reel h2{
        top:14%;
    }
    .reel h2.flip{
        bottom: 14%;
    }
    .capabilities .process .wrap {
        width: 92%;
        margin: 0 auto;
    }
    .agency .staff .wrap {
        width: 92%;
        margin: 0 auto;
    }
    .case-img-two,
    .case-img-three {
        width: 92%;
        margin: 0 4%;
    }
    .partial {
        width: 100%;
        margin: 0;
        padding:3% 0;
    }
    .partial img,
    .partial .caption {width: 96%;}
    .partial .video {
        width: 96%;
        padding-top: 64%;
    }
    .partial .video img {
        width: 100%;
        max-width:1360px;}
    .case-study .quote {
        width: 92%;
        margin: 3% 4% 6% 4%;
    }
    .agency .quote img {width: 40vw;}
    .footer-home li:first-of-type {
        display:none;
    }
}
@media (max-width: 1290px) {
    .agency-reel{
        right:4%;
    }
    .hurdle-solution .image {
        width:26vw;
    }
    /*.agency .page-hdr .int img{
		display: none;
	}*/
    .agency .hmg-slider .slide .columns .col img{
        top:-240px;
    }
    .agency .hmg-slider{
        padding-top:250px;
    }
    .office .container {
        width: 100%;
        padding: 3% 0;
    }
    .office .pushed {
        bottom: 0;
        right: -20%;
        width: 50vw;
        height: auto;
    }
    .offering .container {width: 92%;}
    .three-col {
        width: 92%;
        margin: 0 4%;
    }
    .careers-detail .page-hdr .group {width: 100%;}
    .careers-detail .col-container {
        width: 92%;
        margin: 0 4%;
    }
    .careers-detail .col:first-child {
        width: 50%;
        margin-right: 10%;
    }
    .careers-detail .col:last-child {
        width: 40%;
    }
    .capabilities .wrap,
    .capabilities .statement .wrap {
        width: 92%;
        margin: 0 4%;
    }
    .capabilities .page-hdr .content {
        width: 100%;
    }
    .capabilities .brand .wrap {
        width: 100%;
        margin: 0 auto;
    }
    .capabilities-detail .links a {font-size: 26px;}
    .agency .page-hdr .wrap {
        width: 100%;
        margin: 0 auto;
    }
    .agency .wrap,
    .agency .main .wrap,
    .agency .staff-media .wrap {
        width: 92%;
        margin: 0 4%;
    }
    .agency .page-hdr .content,
    .agency .page-hdr .graphic {
        display: block;
        width: 100%;
    }
    .agency .quote {width: 100%;right:auto;position: relative;}
    .agency .main .wrap{
        padding: 150px 0px 0px 0px;
    }
    .agency .statements {width: 70%;}
    .agency .instagram {
        width: 94%;
        margin: 0 0 0 4%;
        height: 28vw;
    }
    .agency .instagram ul {left: -8%;}
    .agency .instagram ul li {
        width: 31%;
        height: 28vw;
        margin-right: 3.5%;
    }
    .agency .quote img {left: 72%;}
    .news-detail .col-container {
        width: 92%;
        margin: 0 4%;
    }
    .news-detail .page-hdr .group {width: 100%;}
    .author {height: 12vw;}
    .case-study.dreamworks .split-elves .quote-container {
        position: relative;
        width: 92%;
        /* margin-left: 8%; */
        top: 0px;
    }
    .case-study.dreamworks .split-elves .img-container {
        max-width: 1290px;
    }
    .case-study.dreamworks .split-quote {margin-bottom: 0px;}
    .agency .agency-reel .play-btn img{
        display: block;
    }

    .capabilities .sidebar{
        display: none;
    }
    .capabilities .page-hdr{
        height: auto;
        padding: 150px 0px 150px 0px;
    }
    .capabilities .page-hdr .content .anchors.desktop{
        display: table !important;
        margin-bottom: 30px;
    }
    .capabilities .wrap ul.anchors li a{
        color: #FEE12F;
    }
    .capabilities .wrap ul.anchors li a:hover{
        color: white;
    }


}

/*
@media (max-width: 1190px) {
	.agency .staff-grid .row{
		width: 100%;
    margin-bottom: 0;
    float: none;
	}
	.agency .staff-grid .person{
		width: 29.3%;
	}
}
*/
@media (max-width: 1240px) {
    .capabilities .brand .panel.two img{
        left: -50px;
    }
}
@media (max-width: 1180px) {
    .news-listing .group {width: 80%;}
    .rule-wrap {
        margin-left: 35%;
    }
    .rules-main img{
        left:-354px;
    }
    .rule-wrap hr{
        margin-bottom: 55px;
    }
    .rule-wrap hr{
        width: 61px;
    }
    .rule-wrap .rules div:nth-child(2) hr{
        width: 123px;
    }
    .rule-wrap .rules div:nth-child(3) hr{
        width: 56px;
    }
    .rule-wrap .rules div:nth-child(4) hr{
        width: 102px;
    }
    .rule-wrap h3 {font-size: 26px;margin-bottom: 14px;}
    .rule-wrap h4 {font-size: 16px;}
    .capabilities-detail .btm-nav .wrap {
        width: 92%;
        padding: 60px 0;
    }
    .agency .page-hdr p {padding-right: 0;}
    /* 	.agency .main {padding-top: 220px;} */
    .agency .quote {width: 100%;}
    .agency .quote .int {padding-right: 0;}
    .agency .quote::after {right: -40px;}
    .agency .quote img {
        position: absolute;
        bottom: 120%;
        left: 50%;
        margin-left: -285px;
        z-index: 1;
        width: auto;
    }
    .agency .hmg-slider .play-pause-button {
        right: -44px;
    }
    .agency .hmg-slider .slick-dots{
        right:-34px;
    }
    .agency .quote .name {padding-bottom: 10px;}
    .agency .hmg-slider .slide .columns .col img{
        top:-170px;
    }
    .agency .hmg-slider{
        padding-top:230px;
    }
    .case-study .vid-quote-wrap, .case-study .image {
        float: none;
    }
    .case-study .vid-quote {
        position: relative;
        top: -26px;
        box-sizing: border-box;
        width: 84%;
        text-align: left;
    }
    .case-study.dreamworks .dino-builder {margin-bottom: 10px !important;}
    .case-study.dreamworks .dino-builder .image {
        width: 96%;
        height: auto;
    }
    .case-study.dreamworks .dino-builder .quote-container {
        position: relative;
        margin: 0 auto;
        box-sizing: border-box;
        width: 92%;
        right: auto;
        bottom: auto;
        top: -5vw;
    }
    .case-study .content-block .stat h4 {
        font-size:100px;
        line-height:90px;
    }
    .content-block .stat span {
        font-size:65px;
        line-height:65px;
    }
    .case-study .content-block .stat h5 {
        font-size:12px;
        line-height:14px;
        padding-top:0px;
    }
}
@media (max-width: 1271px){
    .agency .staff-grid .person .name{
        font-size: 14px;
    }
    .agency .staff-grid .person .title{
        font-size: 11px;
    }
}
@media (max-width: 1260px) {
    .openings .container{
        width: 94% !important;
    }
    .openings .int{
        width: 100%;
    }
    .case .desc {
        min-width: 0;
        width: 89%;
    }
    .home-slider .new-normal-slide .right-col .desc .options {
        margin-left: 20%;
    }
    .left-col .content .copy{
        padding-bottom:25vw;
    }
}
@media (max-width: 1170px){
    .agency .staff-grid .person .btn-bio{
        /* 		top:-125px; */
    }
    .agency .staff-grid .person-next{
        top:100px;
    }
    /* Start agency people respond to 2 per row */
    .agency .staff-grid .person .brief{
        width: 103%;
        top:23%;
    }
    .agency .staff-grid .person.person-next .brief{
        width:89%;
    }
    .agency .staff-grid .person{
        margin-bottom: 100px;
        width: 46%;
        height: 500px;
    }
    .agency .staff-grid .row{margin: 0px;}
    .agency .staff-grid .row .person:nth-of-type(2) .fact,
    .agency .staff-grid .row .person:nth-of-type(4) .fact {
        left: 0px;
        text-align: left;
    }
    .agency .staff-grid .row .person:nth-of-type(2) .fact,
    .agency .staff-grid .row .person:nth-of-type(4) .fact {
        right: 218px;
        left: auto;
    }
    .agency .staff-grid .person:nth-of-type(2) .fact .h4-like,
    .agency .staff-grid .person:nth-of-type(4) .fact .h4-like{
        right:-315px;
    }
    .agency .staff-grid .person:nth-of-type(2).active .fact .h4-like,
    .agency .staff-grid .person:nth-of-type(4).active .fact .h4-like{
        right: 0px;
        left: auto;
        text-align: right;
    }
    .agency .staff-grid .row .person:nth-child(3){
        top:0px;
    }
    .agency .staff-grid .row .person:nth-child(4){
        top:100px;
    }
    /* End agency people respond to 2 per row */
}
@media (max-width: 1120px) {
    .capabilities .brand .panel.two img{
        left: -100px;
    }
}
@media (max-width: 1100px) {
    .agency .page-hdr {
        height: auto;
        padding: 150px 0;
    }
    .agency-reel {
        position: relative;
        bottom: auto;
        z-index: 2;
        right: auto;
    }
}
@media (max-width: 1080px) {
    .hurdle-solution.image-right .hurdle-solution-container {
        margin-right:53px;
    }
    .hurdle-solution.image-left .hurdle-solution-container {
        margin-left:53px;
    }
    .hurdle-solution .hurdle-solution-container {
        padding:53px;
    }
    .right-col .desc h4{
        font-size: 47px;
    }
    /*.right-col .desc h2{
		font-size: 31px;
		line-height: 41px;
		margin-top: 20px;
	}*/
    .right-col .desc .btn{
        right: 46px;
    }
    .case-study .play-btn,
    .capabilities .play-btn {
        width: 10vw;
        height: 10vw;
        border-width: 1.5vw;
    }
    .case-study .play-btn img,
    .capabilities .play-btn img{
        width:5vw;
    }
    .home-slider .new-normal-slide .right-col .desc .options {
        margin-left: 15%;
    }
}
@media (max-width: 1024px) {
    .capabilities .page-hdr{
        padding-top:100px;
    }
    .capabilities .statement{
        padding: 60px 0px 0px 0px;
    }
    .capabilities .page-hdr .content .anchors.desktop{
        display: none !important;
    }
    .capabilities .wrap ul.anchors.mobile{
        display: table !important;
    }
    .top {
        padding:0;
        background: rgb(0,0,0);
        background: linear-gradient(180deg, rgba(0,0,0,0.6) 0%, rgba(255,255,255,0) 100%);
    }

    .top .hmg-icons {
        display:none;
    }
    .nav {
        float: none;
        top: 0;
        right: 0;
        position: absolute;
        width: 50px;
        height: 44px;
        margin: 14px 12px;
    }
    .nav .nav-container {
        position: relative;
        top: 10px;
        /*left: 12px;*/
    }
    .nav:hover{
        cursor: pointer;
    }
    .nav:hover .bar.one{
        top:0px;
    }
    .nav:hover .bar.three{
        top:18px;
    }
    .nav:hover .burger-top{
        display:none;
    }
    .nav:hover .burger-bottom{
        display:none;
    }
    /*.nav-opened:hover .bar.two {
        background:#5A5959;
    }
    .nav-opened:hover .bar.three {
        background:#5A5959;
    }*/
    .top.shrink .nav {
        top:0;
    }
    .home-slider .left-col .mission-mobile-bg {
        display:block;
        position:absolute;
        top:0;
        width:100%;
        height:auto;
        /*background: url("../images/mission-mobile-bg-2.png");
        background-size:cover;*/
        z-index: 2;
    }
    /*.home-slider .mission-mobile-bg.stay-put {
        transform:unset!important;
        transition:unset!important;
    }*/
    .left-col .content .video-wrap .details{
        top:35%;
    }
    .left-col .copy .thumb{
        height: 50vw;
    }
    .home-slider .left-col video.bg {
        opacity:0.222!important;
        top:0;
        z-index:-1;
        left: 50%;
        right: 50%;
        transform: translate(-50%);
    }
    .home-slider .left-col {
        width:100%;
        overflow:hidden;
    }
    .home-slider .left-col img.bottom-gradient {
        display:none;
    }
    .home-slider .left-col .content .copy {
        text-align:center;
    }
    .home-slider .left-col .content .mission-blurb {
        background: url('../images/skull-bg.jpg');
        background-size: cover;
        padding: 100px 10%;
        width: 100%;
        box-sizing: border-box;
        z-index:unset;
    }
    .home-slider .left-col .content .mission-blurb .blurb-container{
        position:relative;
        z-index:2;
    }
    .home-slider .left-col .content .copy .featured-news{
        text-align:left;
    }
    .home-slider .left-col .copy .contact-form h4 {
        text-align:left;
    }
    .home-slider .left-col .scroll {
        opacity: 1!important;
        position: relative;
        top: 0;
        left: 0;
        z-index: unset;
        padding-top:50px;
        margin-top:550px;
        background-color:#212721;
    }
    .home-slider .left-col .scroll .scroll-container {
        position: relative;
        z-index: 2;
    }
    .home-slider .left-col .scroll img {
        display:block;
        width: 200px;
        padding:60px 0px;
        margin: 0 auto;
    }
    .home-slider .left-col .scroll .scroll-bg {
        background: url('../images/bobble-head-bg.jpg');
        background-size: cover;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        opacity:0.4;
    }
    .home-slider .right-col .desc .watch-reel {
        position: relative;
        top: 50px;
        text-align: center;
    }
    .case-study.never-normal .case-img-two .content-block,
    .case-study.never-normal .case-slider-wrap .content-block{
        padding: 20px 0px 0px;
    }
    .full.indented {
        padding-left:10%;
    }
    .content-block.indented {
        padding-left:10%;
    }
    .case-study.never-normal .content-block h2 {
        font-size:30px;
        line-height:34px;
    }
    .case-study.never-normal .case-img-two .play-btn,
    .case-study.never-normal .full .play-btn {
        width: 82px;
        height: 82px;
        border-width: 10px;
    }
    .case-study.never-normal .case-img-two .play-btn img,
    .case-study.never-normal .full .play-btn img {
        top: 24px;
        width: 40px;
    }
    .case-study.never-normal .case-img-two .pic:last-of-type {
        top:0px;
    }
    .quote-block h4 {
        line-height:18px;
    }
    .quote-block p {
        font-size:26px;
        line-height:44px;
    }
    .contact .page-hdr .int{
        display:block;
        padding:40% 4%;
    }
    .footer-home{
        display: none;
        height: 0px !important
    }
    .footer-home li{
        font-size: 11px;
        padding:14px 32px;
    }
    .home .nav:hover .bar.one, .home .nav:hover .bar.three, .home .nav.nav-opened .bar.one, .home .nav.nav-opened .bar.three {
        -webkit-animation:none;
                animation:none;
    }
    .home .nav .bar.one {
        -webkit-animation-name: nav-top; /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 6s; /* Safari 4.0 - 8.0 */
        -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
        animation-name: nav-top;
        animation-duration: 6s;
        animation-iteration-count: infinite;
    }
    .home-slider .slider-nav {
        left:0;
    }
    .home-slider .slider-nav .slick-track {
        padding:0 3%;
    }
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes nav-top {
        0%   {top:0px;}
        86%  {top:0px;}
        88%  {top:1px;}
        90%  {top:0px;}
        92%  {top:-5px;}
        94%  {top:-10px;}
        96%  {top:0px;}
        98%  {top:1px;}
        100% {top:0px;}
    }
    /* Standard syntax */
    @keyframes nav-top {
        0%   {top:0px;}
        86%  {top:0px;}
        88%  {top:1px;}
        90%  {top:0px;}
        92%  {top:-5px;}
        94%  {top:-10px;}
        96%  {top:0px;}
        98%  {top:1px;}
        100% {top:0px;}
    }
    .home .nav .bar.three {
        -webkit-animation-name: nav-btm; /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 6s; /* Safari 4.0 - 8.0 */
        -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
        animation-name: nav-btm;
        animation-duration: 6s;
        animation-iteration-count: infinite;
    }
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes nav-btm {
        0%   {top:18px;}
        86%  {top:18px;}
        88%  {top:17px;}
        90%  {top:18px;}
        92%  {top:23px;}
        94%  {top:28px;}
        96%  {top:18px;}
        98%  {top:17px;}
        100% {top:18px;}
    }
    /* Standard syntax */
    @keyframes nav-btm {
        0%   {top:18px;}
        86%  {top:18px;}
        88%  {top:17px;}
        90%  {top:18px;}
        92%  {top:23px;}
        94%  {top:28px;}
        96%  {top:18px;}
        98%  {top:17px;}
        100% {top:18px;}
    }
    .agency .page-hdr {
        padding: 120px 0;
    }
    .agency .hmg-slider .brand-img{
        display:block;
    }
    .agency .hmg-slider .play-pause-button {
        right: 0;
        left: -88px;
        margin: 0 auto;
        bottom: 10px;
        top: auto;
    }
    .agency .main .wrap {
        padding: 80px 0px;
    }
    .agency .hmg-slider .slick-dots{
        top: 63px;
        width: 94px;
        margin: 0 auto;
        left: 18px;
        right: 0;
        bottom: 0px;
        height: 52px;
        position: relative;
        top: auto;
        margin-top:12px;
    }
    .agency .hmg-slider .slick-dots li{
        display: inline-block;
        margin: 0 5px;
    }
    .agency .hmg-slider .slide .columns .col img{
        display: none;
    }
    .agency .hmg-slider .slide .columns .col.copy{
        max-width: 100%;
        border: 1px solid white;
        padding: 60px;
        position: relative;
        margin-left: 0;
    }
    .agency .hmg-slider .slide p{
        width: 90%;
    }
    .agency .hmg-slider h4{
        margin-right:-3px;
    }
    .agency .hmg-slider{
        padding:73px 0px 0px 0px;
    }
    .agency .quote{
        padding-bottom: 0px;
        width: 80%;
        margin-left:15%;
    }
    .agency .quote:before{
        font-size: 300px;
        top:-50px;
    }
    .agency .quote:after{
        font-size: 300px;
        top:-50px;
    }
    .agency .capabilities .brand .left-column {
        width: 100%;
    }
    .agency .capabilities .brand img {
        position: relative;
        top: 5px;
        width: 100%;
        margin-top: 5%;
        right:0;
    }
    .agency .capabilities .brand .content {
        margin: 7% 5% 0 5%;
    }
    .agency .capabilities .brand .tag{
        margin-left: 5%;
    }
    .agency .capabilities .brand .info{
        padding:5%;
    }
    .home-slider .left-col img {
        position: relative;
        display: block;
        height: auto;
        width: 100%;
    }
    .home-slider .left-col video {
        position: relative;
        display: block;
        height: auto;
        width: auto;
    }
    .home-slider .left-col .video-wrap video {
        height:100vw;
        opacity:0.222;
    }
    .home-slider .left-col .content {
        top:0;
    }
    .arrow {display: none;}
    .fullpage-wrapper{
        /* prevent footer from displaying on mobile */
        transform:translateY(0px) !important;
    }
    #fullpage .left-col,
    #fullpage .right-col {
        width: 100% !important;
        float: none;
        display: block;
    }
    #fullpage .left-col{
        height: 65vh;
    }
    #fullpage .right-col{
        height: 35vh;
    }
    .home-slider div.slick-slide:after {display: none;}
    .home-slider div.slick-slide .right-col:before {
        content: '';
        display: block;
        position: absolute;
        background: #302F2F;
        top: 0;
        left: 0;
        transform-origin: right top;
        transform: skewY(3deg);
        height: 30vh;
        width: 100%;
        z-index: 1;
    }
    .home-slider div.slick-slide .right-col:after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        transform-origin: left top;
        transform: skewY(-3deg);
        height: 10vh;
        width: 100%;
        opacity: 0.6;
    }
    /*.home-slider .left-col .content .copy .btn {
        display:none;
    }*/
    .left-col .content .copy .contact-form .btn {
        display:block;
        margin:10px auto 40px;
        position: relative;
        right: 2%;
    }
    .home-slider .right-col {
        width: 100%;
        height: auto;
        padding: 140px 5% 40px 5%;
        box-sizing: border-box;
        right: auto;
        position: absolute;
        left: 0;
        top:0;
        background: none;
    }
    .home-slider .right-col .desc .copy{
        position: relative;
        top:unset;
        left: 0;
        margin: 0 auto;
        text-align: center;
    }
    .slick-current .right-col .copy {
        -webkit-animation-name: blurb; /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 6s; /* Safari 4.0 - 8.0 */
        animation-name: blurb;
        animation-duration: 6s;
    }
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes blurb {
        0%   {left:-40%;}
        5%  {left:-4%;}
        8%  {left:-2%;}
        10%  {left:0;}
        100%  {left:0;}
    }

    /* Standard syntax */
    @keyframes blurb {
        0%   {left:-40%;}
        5%  {left:-4%;}
        8%  {left:-2%;}
        10%  {left:0;}
        100%  {left:0;}
    }
    .home-slider .right-col .desc {
        position: relative;
        margin: 0;
        min-height: auto;
        height: auto;
        width: 100%;
        min-width: 0;
        bottom: 7%;
        border: none;
    }
    .home-slider .right-col .desc h2 {
        font-size: 26px;
        line-height: 1.3;
        margin: 0px 20px 20px 20px;
    }
    .home-slider .right-col .desc h2 br{
        display: none;
    }
    .home-slider .right-col .desc .btn {
        position: relative;
        left: 0;
        right: 0;
        margin-top: 25px;
    }
    .right-col .desc .options{
        right:8%;
        margin-left: auto;
    }
    .home-slider .right-col .desc h4 {
        left: 5%;
        width: 100%;
        font-size: 40px;
        margin-left: 19px;
    }
    /*  .home-slider .right-col .desc .mobile-logo {
      display:block;
      width: 160px;
      margin: 0 auto 40px;
    }
*/
    .top .mobile-logo {
        display:block;
        width: 160px;
        margin: 12px;
    }
    .home-slider .right-col .desc .prescore {
        display:none;
    }
    .home-slider .dots {
        width: 100%;
        top: auto;
        bottom: 340px;
    }
    .home-slider .slick-dots {
        top: 0;
        left: 5%;
    }
    .home-slider .slider-nav {
        left:0;
    }
    .reel h2{
        top:17%;
        font-size: 30px;
    }
    .reel h2.flip{
        bottom: 17%;
    }
    .offering{
        padding-bottom: 30px;
    }
    .case{
        background-attachment: unset;
    }
    .news .page-hdr{
        background-attachment: unset;
    }
    .agency .capabilities .brand{
        background-attachment: unset;
    }
    .contact .page-hdr{
        background-attachment: unset;
    }
    .capabilities .page-hdr{
        background-attachment: unset;
    }
    .full-page-hdr {
        background-attachment: unset;
    }
    .capabilities .brand .wrap:first-of-type .left-column .content{
        margin-top: 0px;
    }
    .capabilities .brand .tag{
        margin: 16% 10% 0 10%;
        display: inline-block;
        padding: 0px;
    }
    .capabilities .brand img {
        position: relative;
        top: 3px;
        width: 100%;
        margin-top: 5%;
        height: auto;
    }
    .capabilities .brand .left-column{
        width: 100%;
    }
    .capabilities .brand .content{
        margin:16% 10% 0 10%;
    }
    .capabilities .brand .title{
        position: relative;
    }
    .capabilities .brand .title .num{
        position: absolute;
        background: white;
        top: -4px;
        padding: 10px 0px;
    }
    .capabilities .brand .desktop{
        display: none;
    }
    .capabilities .brand .mobile{
        display: block;
    }
    .clients .client-listing ul{
        width: 45%;
    }
    .careers-detail .col {
        float: none;
        width: 100% !important;
        margin-right: 0 !important;
    }
    .news-detail .col:first-child {
        width: 100%;
        margin-right: 0;
        float: none;
        padding-bottom: 30px;
    }
    .news-detail .col:last-child {
        padding: 20px 0;
        width: 100%;
        float: none;
    }
    .case-study.stx-hockey .rx2-pros .image {width: calc(100% - 180px);}
    .case-study.stx-hockey .rx2-pros .quote-container {width: 260px;}
    .case-study.stx-hockey .rx2-pros h2 {font-size: 16px;}
    .case-split-pic.case-img-top {
        margin-top: -7vh !important;
    }
    .case-split-pic .caption-left p {
        float: none;
        width: 92%;
        margin-top: 30px;
        padding: 0 4%;
    }
    .case-study .ipad-slider-wrap .caption p {
        width: 92%;
    }
    .agency .we .columns{
        width: 100%;
        display: block;
    }
    .agency .we .col{
        display: block;
        float: none;
        width: 100%;
        padding: 0px 0px 100px 0px;
        position: relative;
        margin: 0 auto;
    }
    .agency .hmg-slider h4.mobile-hmg{
        text-align: left;
        margin-bottom: 3px;
        font-size: 13px;
        display: block;
    }
    .agency .we .col p{
        width: 80%;
    }
    .agency .quote {
        margin: 0 auto;
        padding: 54px 0 0 0;
        width: 85%;
    }
    .agency .we .col .houdini1{
        display: none;
    }
    .agency .we .col .houdini2{
        display: block;
    }
    .agency .we .col img {
        top: -35px;
        height: 13%;
        opacity: .25;
        width: 42px;
        height: auto;
    }
}

@media (max-width: 960px) {
    .hurdle-solution .image {
        position: relative;
        transform: none;
        top: 0px;
        width: 100%;
        margin-bottom:30px;
    }
    .hurdle-solution.image-right .hurdle-solution-container .col {
        width:50%;
    }
    .hurdle-solution.image-left .hurdle-solution-container .col {
        width:50%;
    }
    .hurdle-solution .hurdle-solution-container .col.empty {
        display:none;
    }
    .hurdle-solution.image-left .hurdle-solution-container {
        margin:0 auto;
    }
    .hurdle-solution.image-right .hurdle-solution-container {
        margin:0 auto;
    }
    .hurdle-solution.image-left .hurdle-solution-container .col:nth-of-type(2) {
        padding-left:0px;
    }
    .hurdle-solution.image-right .hurdle-solution-container .col:nth-of-type(2) {
        padding-right:0px;
    }
    .staff-popup {
        width: 92%;
        left: 4%;
    }
    .staff-popup .btn-close {right: 0;}
    /*
	.agency .staff-grid .person:nth-of-type(4) .fact .h4-like{
		color: white;
	    left: -300px;
	    position: relative;
	    transition: 0.5s ease all;
	    transition-delay: 0.6s;
	    font-size: 40px;
	    line-height: 46px;
	    text-transform: none;
	}
	*/
    .menu {background-position: right 36% center;}
    .menu .container {padding-left: 50px;}
    .menu .container {width: 70%;}
    .menu .made {left: 50px;}
    .menu .right-col ul {
        font-size: 32px;
        width: 220px;
    }
    .project-detail .wysiwyg{width: 90%;}
    .project-detail .wysiwyg .img-body img {
        width:100%;
        height:auto;
    }
    .case-study .case-content .scroll-trig {
        opacity: 1;
        top: 0;
    }
    .quote h2 {font-size: 22px;}
    .careers .about .columns {top: -50px;}
    .careers .about .intro {
        display: block;
        float: none;
        width: 100%;
        padding-bottom: 50px;
    }
    .careers .about .career-quote {
        margin: 0 auto 10px auto;
        width: 90%;
        margin-top: 80px;
        float:none;
        margin-left:auto;
        margin-right:auto;
    }
    .careers .flex-links a {
        margin-bottom:50px;
        margin-left:auto;
        margin-right:auto;
    }
    .careers .about {
        margin-top:85vh;
    }
    .capabilities .process .tbl {
        margin-top: 80px;
        padding-bottom: 0;
    }
    .capabilities .process .tbl .cell {
        display: block;
        width: 100%;
        margin-bottom: 130px;
    }
    .capabilities .process .tbl .spacer {display: none;}
    .capabilities .clients .desc p {font-size: 30px;}
    .capabilities .clients .cell {width: 25%;}
    .capabilities .clients .grid .cell:nth-child(5n) {border-right: 1px solid #DEDEDE;}
    .capabilities .clients .grid .cell:nth-last-child(-n+5) {border-bottom: 1px solid #DEDEDE;}
    .capabilities .clients .grid .cell:nth-child(4n) {border-right: none;}
    .capabilities .clients .grid .cell:nth-last-child(-n+4) {border-bottom: none;}
    .capabilities-detail .page-hdr {height: 600px;}
    .capabilities-detail .page-hdr h1 {
        font-size: 60px;
        line-height: 1.1;
    }
    .capabilities-detail .main .wrap {
        width: 92%;
        margin: 0 4%;
    }
    .full p {width: 92%;}
    .case-study .content-block .stat {
        float:none;
        display:block;
        text-align:left;
        border:none;
        margin:0 auto;
        padding: 20px 90px 0px;
    }
    .openings .int .col{
        width: 100%;
        padding: 0px;
        display: block;
        padding:0px !important;
        margin-bottom: 30px;
    }
    .footer-home {
        z-index:-100!important;
    }
}

@media (max-width: 900px) {
    .capabilities .clients .desc{
        padding: 0px;
    }
    .capabilities .clients .desc p{
        padding: 25px 0px 50px;
    }
    .second .left-col {
        padding: 0 5%;
        box-sizing: border-box;
    }
    .second .left-col:before {
        content: '';
        display: block;
        position: absolute;
        background: #ff501c;
        top: 0;
        left: 0;
        transform-origin: right top;
        transform: skewY(3deg);
        height: 30vh;
        width: 100%;
    }
    .second .left-col .desc {
        margin: 0 auto;
        padding-top: 50px;
        border: none;
        width: 100%;
    }
    .second .left-col .desc h1 {
        top: 0;
        margin: 0 0 10px 0;
    }
    .second .left-col .desc hr {margin-left: 0;}
    .second .left-col .desc p {margin: 20px 0 30px 0;}
    .second .left-col .desc .options {
        position: static;
        margin-left: 0;
    }
    .second .mini-nav {
        width: 100%;
        padding-bottom: 50px;
        margin-top: 50px;
    }
    .second .right-col {
        height: 60vw;
        background: url(https://missionagency.com/images/homecard.png) no-repeat center center;
        background-size: cover;
    }
    .form {
        margin: 50px 0;
        width: 100%;
    }
    .third .right-col {
        background-image: none;
        background-color: #656565;
    }
    .third .right-col:before {
        content: '';
        display: block;
        position: absolute;
        background: #656565;
        top: 0;
        transform-origin: right top;
        transform: skewY(3deg);
        height: 30vh;
        width: 100%;
    }
    .third .form input[type="text"],
    .third .form textarea {
        width: 100%;
        box-sizing: border-box;
    }
    .third .form .btn {
        margin-top: 30px;
        margin-bottom: 50px;
    }
    .right-col .news {
        position: static;
        margin-top: 0;
        padding: 50px 0;
        width: 100%;
    }
    .right-col .news .head {
        width: 90%;
        margin: 0 auto;
    }
    .right-col .news .featured-image {
        padding: 0 5%;
        margin: 0 auto;
        border-bottom: 2px solid rgba(216,216,216,0.2);
    }
    .right-col .news .careers {
        padding: 40px 5%;
    }
    .case-study .stats-block .half-top {
        width:100%;
        max-width:400px;
        display:block;
        margin:0 auto;
    }
    .case-study .stats-block .half-btm {
        width:100%;
        max-width:400px;
        display:block;
        margin:0 auto;
    }
    .case-study .stats-block .half-top .divider{
        width:50px;
        height:2px;
        margin-top:10px;
    }
    .case-study .stats-block .half-btm .divider{
        height:0px;
        margin-top:20px;
    }
}

@media (max-width: 860px) {
    .capabilities .page-hdr ul.anchors h4 {
        margin-bottom: 10px !important;
        font-size: 14px;
        line-height: 1;
    }
    .capabilities .wrap ul.anchors.mobile{
        margin-bottom: 20px;
    }
    .offering h4 {font-size: 16px;}
    .agency .statements-slider h2 {
        font-size: 48px;
        line-height: 1.3;
        letter-spacing: 1.5px;
    }
    .agency .hmg-slider .slide p{
        width: 100%;
        font-size:13px;
    }
    .agency .hmg-slider .slide .columns .col.copy{
        padding: 30px;
    }
    .capabilities .wrap ul.anchors{
        margin-top: 30px;
        margin-bottom: 30px;
    }
    .capabilities .wrap ul.anchors li{
        margin: 0px;
        padding: 0px !important;
        border: none !important;
        display: block;
        float: none;
    }
}

@media (max-width: 810px) {
    .reel h2{
        top:20%;
    }
    .reel h2.flip{
        bottom: 20%;
    }
    .capabilities .brand .tag{
        margin-left: 5%;
    }
    .capabilities .brand {
        height:auto;
    }
    .capabilities .brand .content {
        margin-top: 10%;
        margin-left: 5%;
    }
    .capabilities .brand .left-column {
        width:100%;
        display:block;
    }
    .capabilities .brand .right-column {
        width:100%;
        display:block;
    }
    .capabilities .brand .right-column img {
        top: 0px;
        width:60%;
        padding-top: 30px;
    }
    .capabilities .process .column {
        width: 100%;
        display:block;
    }
    .capabilities .process .title {
        padding-top:100px;
    }
    .capabilities .process .divider {
        width: 73px;
        height:1px;
    }
    .capabilities .process h3 {
        padding-bottom:60px;
    }
    .rule-wrap{
        margin-left: 46%;
        width: 375px;
    }
    .capabilities .page-hdr{
        height:auto;
    }
    /*
	.capabilities .page-hdr .content {
	    padding-top: 100px;
	    padding-bottom: 50px;
	}
*/
}
@media (max-width: 768px) {
    .case-study .ipad-slider-wrap .caption p{
        padding-top: 15px;
    }
    .case-study.never-normal .case-img-two .play-btn,
    .case-study.never-normal .case-slider-wrap .play-btn,
    .case-study.never-normal .full .play-btn {
        width: 64px;
        height: 64px;
        border-width: 10px;
    }
    .case-study.never-normal .case-img-two .play-btn img,
    .case-study.never-normal .case-slider-wrap .play-btn img,
    .case-study.never-normal .full .play-btn img {
        top: 19px;
        width: 30px;
    }
    .case-study.never-normal .case-slider-wrap .video {
        padding-top:56.25%;
    }
    .full.indented {
        padding-left:0;
    }
    .content-block.indented {
        padding-left:0;
    }
    .partial .caption{
        padding-top: 15px;
    }
    .case-study.dreamworks .full{
        padding-bottom: 0px;
    }
    .full p{
        padding-bottom: 0px;
    }
    .case-study .about .btn-return{
        display:none;
    }
    .capabilities .brand h1{
        font-size:28px;
        padding-bottom: 10px;
    }
    .contact .about .social a:first-child{
        margin-left: 0px;
    }
    .news .page-hdr{
        height: 500px;
    }
    .clients .client-listing ul{
        width: 100%;
        text-align: center;
        padding:0;
    }
    .menu .left-col {width: 45%;}
    .page-hdr {height: 700px;}
    .page-hdr h1 {
        font-size: 60px;
        line-height: 1.1;
    }
    .rule-wrap .rules > div {
        width: 49%;
        margin-bottom: 60px;
    }
    .rule-wrap .rules > div:nth-child(2) {border-right: none;}
    .rule-wrap .rules > div:nth-child(3),
    .rule-wrap .rules > div:nth-child(4) {margin-bottom: 0;}
    .case-study .about,
    .careers .about {margin-top: 700px;}
    .case-study .about .columns,
    .contact .about .columns {padding: 0 0 100px 0;}
    .case-study .about .columns{
        padding-bottom: 30px;
    }
    .case-study .about .social a:first-child{
        margin-left: 0px;
    }
    .case-study .col:first-of-type,
    .case-study .col:last-of-type,
    .contact .col:first-of-type,
    .contact .col:last-of-type,
    .jms .about .col:first-of-type,
    .jms .about .col:last-of-type {
        display:block;
        float: none;
        width:100%;
        margin-left: 0;
        padding:0;
        border: none;
        text-align: left;
    }
    .case-study .col:first-of-type,
    .contact .col:first-of-type,
    .jms .about .col:first-of-type {padding-bottom: 60px;}
    .case-study.never-normal .col:first-of-type{padding-bottom:0px;}
    .case-study .about .grid::before {display: none;}
    .case-study .col:last-of-type,
    .contact .col:last-of-type,
    .jms .about .col:last-of-type {margin-top: 0px; top: 0;}
    .jms .jay .social-wrap {float: none; text-align: left;}
    .jms .form-container .int {width: 100%;}
    .contact-form input.full[type="text"] {
        width: 100%;
        margin-right: 0;
    }
    .contact-form input[type="text"],
    .contact-form input[type="email"],
    .contact-form textarea {
        width: 100%;
        margin: 0 4% 3% 0;
        box-sizing: border-box;
    }

    .contact-form input[type="text"].second,
    .contact-form textarea.second {margin-right: 0;}

    .contact-form .form-field--half,
    .contact-form .form-field--full,
    .left-col .content .copy .contact-form textarea {
        margin-right: 0;
        width: 100%;
    }
    .left-col .content .copy .contact-form .btn {
        /*margin-right: 0;*/
        right: auto;
    }
    .about .social {float: none;}
    /*.split-quote {margin-bottom: 140px !important;}*/
    .split-quote .image {
        width: 100%;
        /*height: 500px;*/
    }
    .dino-builder.split-quote .image, rx2-pros.split-quote .image {
        width: 100%;
        height: 500px;
    }
    .split-quote .quote-container {
        padding: 5%;
        top: -28px;
        /* top:0px; */
        margin-bottom:-28px;
        position: relative;
        box-sizing: border-box;
        width: 92%;
    }
    .split-quote-rev .img-contain {
        float:none;
    }
    .case-study.niermann .split-quote-rev .quote-container {bottom: -50px;}
    /*.case-study.dreamworks .split-elves {margin-bottom: 80px !important;}*/
    .case-study.stx-hockey .rx2-pros .image {
        width: 100%;
        margin: 0px;
        top:2px;
    }
    .case-study.stx-hockey .rx2-pros .quote-container {
        top: auto;
        width: 92%;
    }
    .case-study.stx-hockey .rx2-pros h2 {font-size: 16px;}
    /*
	.case-study .split-quote-rev {
    margin-bottom: 40px !important;
	}
*/
    .split-quote h2 {font-size: 16px;}
    .capabilities-detail .links > div {
        display: block;
        width: 100%;
        text-align: center !important;
    }
    .capabilities-detail .links > div:last-child {
        border-left: none;
        border-top: 1px solid rgba(255,255,255,0.25);
    }
    .capabilities-detail .links a > div {display: inline-block;}
    .agency .staff-grid .person {width: 46%;}
    .news-item .thumb {
        height: 180px;
        top: -30px;
        left: -30px;
    }
    .news-item h2 {
        font-size: 20px;
        line-height: 30px;
    }
    .news-item p {
        padding: 30px 0 10px 0;
        line-height: 1.5;
    }
    .news-item hr {margin-top: 20px;}
    .author {height: 16vw;}
    .recent h4 {color: #B9B8B8;}
    .recent .underscore:after {background-color: #B9B8B8;}
    /*
	.recent-listing {
		width: 47%;
		float: left;
	}
	.recent-listing:nth-child(odd){
		margin-right:3%;
	}
*/
    .recent-listing-wrap > div:last-child {margin-right: 0;}
    .view-case {display: none;}
    .case{
        width: 100%;
    }
    .listing .case:nth-child(2) .desc {
        margin: 10vh 5.5%;
        height: 30vh;
    }
    .case .desc {
        min-width: 0;
        width: 89%;
    }
    .case .desc .h2-like {
        bottom: auto;
        top: 40px;
    }
    .case .desc .plus {display: block;}
    .fullpage-wrapper {
        height: 100vh!important;
        background-color: #302F2F;
    }
    #fullpage .left-col{
        height: auto;
    }
    #fullpage .right-col{
        height: auto;
    }
    .home-slider .slider-nav {
        position:relative;
        top:0;
    }
    .capabilities .statement p{
        font-size: 16px;
    }
}
@media (max-width: 640px) {
    .page-hdr::before {
        content: "";
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: rgba(0,0,0,0.2);
        z-index: 1;
    }

    .page-hdr::after{
        z-index: 3;
    }
    .news-detail .page-hdr::after{
        z-index: 1;
    }

    .page-hdr .int{
        position:relative;
        z-index: 2;
    }

    .hurdle-solution .hurdle-solution-container {
        padding:33px;
    }
    .hurdle-solution .hurdle-solution-inner-container {
        display:block;
    }
    .hurdle-solution.image-left .hurdle-solution-container .col {
        width:100%;
    }
    .hurdle-solution.image-right .hurdle-solution-container .col {
        width:100%;
    }
    .hurdle-solution.image-left .hurdle-solution-container .col:last-of-type {
        padding-left:0px;
        padding-top:30px;
    }
    .hurdle-solution.image-right .hurdle-solution-container .col:first-of-type {
        padding-right:0px;
        padding-bottom:30px;
    }
    .never-normal-headline {
        padding-top:100px;
    }
    .corner-cta {
        bottom:2px;
    }
    .case-study.never-normal .content-block .content {
        width: 92%;
        margin: 0 4%;
    }
    .case-study.never-normal .case-content .full {
        padding-bottom:0px;
    }
    .case-study.never-normal .content-block .content .info {
        border: none;
        margin-top: 20px;
        margin-left: 0;
        padding-right: 0;
        padding-left: 0;
    }
    .case-study.never-normal .content-block .paragraph {
        padding-bottom:0px;
    }
    .case-study.never-normal .content-block .examples {
        padding-bottom: 20px;
    }
    .case-study.never-normal .case-img-two {
        display:block;
    }
    .case-study.never-normal .case-img-two .pic {
        display:block;
        width:100%;
    }
    .case-study.never-normal .case-img-two iframe {
        height:52vw;
        max-height:332px;
    }
    .case-study.never-normal .case-img-two .play-btn {
        top:7vw;
    }
    .case-study.never-normal .case-img-two .content-block p {
        padding-top:15px;
    }
    .capabilities .brand p{
        font-size:13px;
        line-height: 25px;
    }
    .capabilities .brand .underscore:after{
        /* 		display: none; */
    }
    .capabilities .brand h3{
        display: block;
    }
    .capabilities .brand .content{
        margin-right: 5%;
    }
    .case-split-pic .caption p{
        font:14px/1.6 'Visby-Regular';
    }
    .contact-form .btn{
        display: inherit;
    }
    .contact .col:last-of-type{
        text-align: center;
    }
    .contact .social{
        text-align: center;
        margin: 10px auto;
    }
    .capabilities .brand .info{
        padding-left: 13%;
        padding-right:0px;
    }
    .openings .int{
        padding-bottom: 0px;
    }
    .case-split-pic .caption{
        float: none;
        max-width: 1065px;
        width: 85%;
        text-align: center;
        padding: 30px 0px 0px 0px;
        margin: 0 auto;
    }
    .case-split-pic .caption p{
        padding-bottom: 20px;
    }
    .nav {
        margin: 27px 12px;
    }
    .top {
        padding: 14px 0px;
        width: 100%;
        box-sizing: border-box;
    }
    .top .hmg {
        right: 75px;
        top: 29px;
    }
    .top .logo,
    .top .gif {
        width: 180px;
        height: 52px;
    }
    /*.nav {top: 15px;}*/
    .menu {background-image: none;}
    .menu .left-col,
    .menu .right-col {display: none;}
    .mobile-menu {display: block;}
    .left-col .content .copy span {
        font-size:14px;
    }
    .left-col .content .copy h5 {
        font-size:16px;
        line-height:30px;
    }
    .home-slider .right-col .desc {min-height: 160px;}
    .home-slider .right-col .desc h2 {
        font-size: 22px;
        line-height: 36px;
    }
    .home-slider .dots {bottom: 285px;}
    .left-col .content .copy .contact-form textarea {
        width:100%;
    }
    /*.left-col .content .copy .contact-form .btn {
        margin-right:0;
    }*/
    .second .left-col .desc h1,
    .third .form h2 {
        font-size: 30px;
        line-height: 1.5;
    }
    .right-col .featured-image h2 {
        font-size: 24px;
        line-height: 1.3;
    }
    .page-hdr, .careers .full-page-hdr {height: 550px;}
    .page-hdr h1,
    .capabilities-detail .page-hdr h1 {font-size: 48px;}
    .case-study .about,
    .careers .about {margin-top: 550px;}
    .careers .about {
        z-index: 2;
    }
    .careers .about .columns {top: 0;}
    .careers .openings_cat {
        width:100%;
    }
    .careers .openings .int a {
        font-size: 24px;
    }
    .careers .container.office_video_container {
        padding-bottom:0px;
    }
    .two-col img:first-of-type {
        width: 58%;
        margin-right: -20%;
    }
    .careers .two-col img:last-of-type {
        bottom: 50px;
        width: 58%;
        margin-left: -20%;
    }
    .careers .offering{
        padding-top:30px;
    }
    .careers .container{
        padding-bottom:8%;
    }
    .careers .summary h2{
        margin-top: 50px;
        font-size:36px;
        line-height:40px;
    }
    .offering h2 {font-size: 36px;}
    .offering .group .col-third {width: 48%;}
    .offering .group .col-third:nth-child(3n+2) {margin: 0;}
    .offering .group .col-third:nth-child(3n+1) {clear: none;}
    .offering .group .col-third:nth-child(even) {float: right;}
    .offering .group .col-third:nth-child(odd) {clear: both;}
    .openings h2 {font-size: 36px;}
    .openings .container {padding: 100px 0 50px 0;}
    .openings a {font-size: 22px;}
    .openings .int a{font:18px "adelle",serif;}
    .careers-detail .page-hdr .cell-left,
    .careers-detail .page-hdr .cell-right {
        display: block;
        width: 100%;
        text-align: center;
    }
    .careers-detail .page-hdr h1 {
        text-align: center;
        margin-bottom: 30px;
    }
    .news-detail .page-hdr .cell-left,
    .news-detail .page-hdr .cell-right {
        display: block;
        width: 100%;
        text-align: center;
    }
    .news-detail .page-hdr h1 {
        text-align: center;
        margin-bottom: 30px;
    }
    .capabilities .clients {padding: 50px 0;}
    .capabilities .clients .desc p {
        font-size: 24px;
        padding-bottom: 50px;
    }
    .capabilities .clients .cell {
        width: 50%;
        height: 200px;
    }
    .capabilities .clients .grid .cell:nth-child(4n) {border-right: 1px solid #DEDEDE;}
    .capabilities .clients .grid .cell:nth-last-child(-n+4) {border-bottom: 1px solid #DEDEDE;}
    .capabilities .clients .grid .cell:nth-child(even) {border-right: none;}
    .capabilities .clients .grid .cell:nth-last-child(-n+2) {border-bottom: none;}
    .agency .page-hdr {height: auto;padding:0;}
    .agency .page-hdr .int {
        padding: 120px 4% 80px 4%;
    }
    .agency .page-hdr h1 {
        font-size: 28px;
        line-height: 1.3;
        padding-bottom: 20px;
    }

    .agency .page-hdr p{
        font-size: 15px;
    }
    .agency .statements {
        padding: 20px;
        margin-bottom: 100px;
    }
    .agency .statements-slider h2 {
        font-size: 36px;
        letter-spacing: 1px;
    }
    .agency .instagram .link {right: 0;}
    .agency .instagram .link a {
        width: 60px;
        height: 60px;
        vertical-align: middle;
        text-align: center;
        color: #fff;
        font: 300 11px 'adelle',serif;
    }
    .agency .instagram .link .fa {
        font-size: 20px;
        margin-bottom: 4px;
    }
    .agency .staff-media .wrap {padding: 100px 0;}
    .agency .staff-media-bg {padding-bottom: 100px;}
    .staff-popup {height: auto;}
    .staff-popup-pic {display: none;}
    .staff-popup-pic-mobile {display: block;}
    .staff-popup-content {
        float: none;
        width: 100%;
        height: auto;
        padding: 30px 0;
    }
    .staff-popup-content-int {
        margin-left: 0;
        padding: 0;
    }
    .staff-popup .bio-text {margin-left: 0;}
    .contact-form input[type="text"],
    .contact-form input[type="email"],
    .contact-form textarea {
        width: 100%;
        margin: 0 0 4vw 0;
        box-sizing: border-box;
    }
    .agency .agency-slider button {
        width: 40px;
        height: 40px;
        background-size: 16px 14px;
    }
    .jms .examples .col {
        width: 100%;
        float: none;
    }
    .jms .examples .col .title,
    .jms .examples .col .thumb-wrap h3,
    .jms .examples .col .thumb-wrap h4 {margin-left: 4%;}
    .jms .examples .col .thumb {
        width: 92%;
        height: 200px;
        margin: 0px 4% 10px;
    }
    .author {
        width: 150px;
        height: 150px;
    }
    .left {
        float: none;
        width: 100%;
    }
    .right {
        float: none;
        width: 100%;
        padding-top: 20px;
    }
    .share h4 {margin-top: 10px;}
    .project-detail .page-hdr {height: 550px;}
    .full p,
    .case-study .ipad-slider-wrap .caption p {
        font: 14px/1.6 'Visby-Regular';
        width: 92%;
    }
    .case-img-two,
    .case-img-three,
    .slider-block {display: none;}
    .case-study .case-slider-wrap {display: block;}
    .partial img {
        width: 100%;
        /*     padding-bottom: 30px; */
    }
    .quote h2 {
        font-size: 18px;
        line-height: 1.6;
        padding: 6%;
    }
    .quote .name {padding: 6% 6% 0 6%;}
    .quote .name h4 {font-size: 14px;}
    .quote .icon {left: 6%;}
    .case-study .content-block .stat {
        padding-left: 15%;
        padding-right: 15%;
    }
    .rules-main img{
        display: none;
    }
    .rules-main{
        padding-bottom: 30px;
    }
    .rule-wrap{
        top: auto;
        width: 92%;
        margin: 0 auto;
        display: block;
    }
    .rule-wrap .rules > div{
        margin-bottom: 0px;
    }
    .reel h2{
        top:24%;
    }
    .reel h2.flip{
        bottom: 24%;
    }
    .goals {
        width: 100% !important;
    }
    .page-hdr h1.project-title{
        font-size: 38px;
        line-height: 45px;
    }
}
@media (max-width: 580px) {
    .case-study.never-normal .case-img-two .play-btn {
        top:0px;
    }
    /*.case-study.never-normal .full .play-btn {
        top:5vw;
    }*/
    /*.liberty-mountain-resort .split-quote .image{
		height: 300px;
	}*/
    .news .page-hdr{
        height:400px;
    }
    .capabilities .page-hdr {
        height: auto;
    }
    /*
	.capabilities .page-hdr .content {
	    padding-top: 100px;
		padding-bottom: 50px;
	}
*/
    .capabilities .page-hdr .content h1 {
        font-size: 30px;
    }
    .capabilities .page-hdr .content p {
        padding:0px;
    }
    .capabilities .testimonial h1 {
        font-size: 25px;
    }

    /* Start agency people responding to 1 per row*/
    .agency .staff-grid .person {
        opacity: 1!important;
    }
    .agency .staff-grid .person.person-next .brief{
        text-align: left;
        width: 80%;
    }
    .agency .staff-grid .person.person-next .fact{
        text-align: left;
    }
    .agency .staff-grid .person .fact{
        /*
		left: -4vw!important;
		bottom: -42vw!important;
	*/
        text-align:left!important;
        left:0px !important;
    }
    .agency .staff-grid .person.active .fact .h4-like{
        text-align:left!important;
        left:0px!important;
    }
    .agency .staff-grid .person {
        width: 85%;
        margin: 0 auto 100px auto;
        top:0px !important;
    }
    /*.agency .staff-grid .row .person:nth-of-type(2) .fact,
	.agency .staff-grid .row .person:nth-of-type(4) .fact{
		right:24px;
	}*/
    .agency .staff-grid .person .fact .h4-like{
        font-size: 25px;
        line-height: 35px;
    }
    .careers .office_video_container .vid_before {
        top:-75px;
    }
    .careers .office_video_container .vid_before::before {
        content:"";
        background:transparent;
    }
    .careers .openings {
        margin-top:0px;
    }
    .careers .office_video_container .vid_after {
        display: none;
    }
    /* End agency people responding to 1 per row*/
}

@media (max-width: 480px) {
    .agency .quote{
        margin-left:7%;
    }
    .agency .we{
        padding-bottom: 0px;
    }
    .clients .client-listing{
        margin-top: 15%;
    }
    .clients .client-listing ul li h4 {
        margin-bottom: 15px;
        font-size: 11px;
    }
    .clients .client-listing ul li {
        color: #1c1c1c;
        font: 11px 'Visby-Light';
        line-height: 25px;
        letter-spacing: 1px;
    }
    .clients .client-listing ul{
        margin-bottom: 35px;
    }
    .home-slider .right-col .desc {min-height: 140px;}
    .home-slider .right-col .desc h4 {font-size: 14px;}
    .home-slider .right-col .desc h2 {font-size: 20px;}
    .home-slider .dots {bottom: 260px;}
    .home-slider .slide-1 .right-col .desc .options {
        margin-left:20%;
    }
    .second .left-col .desc h1,
    .third .form h2 {
        font-size: 26px;
        line-height: 1.4;
    }
    .page-hdr {height: 450px;}
    .page-hdr h1,
    .capabilities-detail .page-hdr h1 {font-size: 40px;}
    .capabilities-detail .page-hdr {height: 440px;}
    .capabilities .brand .right-column img {
        width:80%;
    }
    .capabilities .brand .btn {
        padding:0px 40px;
    }
    .case-study .about,
    .careers .about {margin-top: 450px;}
    .careers .about .career-quote {
        width: 100%;
        padding: 0 4%;
    }
    .careers .about .career-quote p {
        font-size: 25px;
        line-height: 1.4;
    }
    .careers .full-page-hdr {
        height: 450px;
    }
    .careers .office_video_container .vid_before {
        top:-65px;
    }
    .careers .office_video_container .vid_before::before {
        content:"";
        background: transparent;
    }
    .careers .slick-list {
        padding-left:4%;
    }
    .careers .slick-slide img {
        max-width: 92vw;
    }
    .careers .office_video_container .vid_after {
        display:none;
    }
    .careers .openings {
        margin-top:0px;
    }
    .careers .container.office_video_container {
        padding-bottom:0px;
    }
    .careers .offering .video .play-btn {
        width:75px;
        height:75px;
    }
    .careers .openings_cat {
        width:100%;
    }
    /*.careers .about .career-quote .int {margin: -24px 0 -10px;}*/
    .rule-wrap h3 {
        font-size: 20px;
        margin: 18px 0px 6px 0px;
    }
    .rule-wrap h4 {font-size: 14px;}
    .offering .group .col-third {
        /* 		display: none; */
        width: 100%;
    }
    .offering .group .col-third:nth-child(1),
    .offering .group .col-third:nth-child(4),
    .offering .group .col-third:nth-child(7),
    .offering .group .col-third:nth-child(10){
        display:block;
    }
    .offering .block {margin-bottom: 20px;}
    .openings a {font-size: 18px;}
    .openings .social p {
        display: block;
        margin-bottom: 12px;
        margin-right:0px;
    }
    .capabilities .clients .cell {height: 160px;}
    .capabilities .clients .cell .int .mid {padding: 0 20%;}
    .agency .quote p {
        font-size: 26px;
        line-height: 1.4;
    }
    .agency .statements-slider h2 {font-size: 28px;}
    .quote h2 {
        font-size: 18px;
        line-height: 1.8;
    }
    .news-item .thumb {
        height: 120px;
        top: -60px;
        left: -20px;
    }
    .news-item h2 {
        font-size: 20px;
        line-height: 30px;
    }
    .news-item p {padding-top: 80px;}
    .news-item hr {margin-top: 10px;}
    .news-item .col:first-child {
        position: absolute;
        left: 0;
        width: 50%;
    }
    .news-item .col:last-child {
        width: 100%;
        padding: 0 5% 10px 5%;
    }
    .split-quote h2 {font-size: 14px; line-height: 1.6;}
    .post .col.pic {
        width: 100%;
        padding: 0 20px;
        display: block;
        float: none;
    }
    .post .col.text {
        width: 100%;
        box-sizing: border-box;
        display: block;
        float: none;
        padding: 8% 20px 40px 20px;
    }
    .recent-listing {
        width: 100%;
        float: none;
        margin-right: 0;
    }
    .project-detail .page-hdr {height: 450px;}
    .quote h2 {font-size: 16px;}
    .footer {padding-bottom: 10px;}
    .footer p {
        display: block;
        padding: 0;
        text-align: center;
    }
    .footer .logo {
        padding: 0;
        float: none;
        display: block;
        margin: 0 auto;
    }
    .footer-callout {
        height: 323px;
        margin-bottom: 23px !important;
        overflow: hidden;
    }
    .case-study .stats-block .column {
        width:100%;
        display:block;
        margin:0 auto;
        padding-top:0px;
    }
    .case-study .stats-block .half-btm .column .divider {
        width:50px;
        height:2px;
        margin-top:10px;
    }
    .case-study .stats-block .half-btm .column.last .divider {
        opacity:0;
    }
    .case-study .stats-block .icon {
        display:none;
    }
    .case-study .quote-block .contain {
        padding:30px 40px 40px;
    }
    .case-study .quote-block p {
        font-size: 20px;
        line-height: 30px;
    }
    .reel h2:before{
        top:-63px;
    }
    .reel h2{
        top: 18%;
        font-size: 20px;
    }
    .reel h2.flip{
        bottom: 18%;
    }
    .agency .we .col h4{
        font-size: 29px;
    }
    .agency .hmg-slider .slide h5 {
        font-size: 30px;
        margin-bottom: 4px;
    }
    .agency .quote:after,
    .agency .quote:before {
        font-size: 200px;
    }
    .agency .quote{
        padding-top: 23px;
    }
    .page-hdr h1.project-title{
        font-size: 33px;
        line-height: 40px;
    }
}
@media (max-width: 500px) {
    .agency-reel{
        width: 400px;
    }
    .agency-reel video{
        width: 400px;
    }
    .agency-reel .border{
        width: 400px;
        height: 224px;
    }
    .agency-reel p{
        padding-top:9px;
    }
}
@media (max-width: 460px) {
    .agency-reel{
        width: 300px;
    }
    .agency-reel video{
        width: 300px;
    }
    .agency-reel .border{
        width: 300px;
        height: 168px;
    }
    .agency-reel p{
        padding-top:9px;
    }
    .agency-reel .play-btn{
        margin-top: 65px;
        left:121px;
        width:30px;
        height:30px;
    }
    .agency-reel .play-btn img{
        width: 15px;
    }
}
@media (max-width: 360px) {
    .home-slider .right-col .desc {min-height: 120px;}
    .home-slider .right-col .desc h4 {font-size: 14px;}
    .home-slider .right-col .desc h2 {font-size: 18px;}
    .home-slider .dots {bottom: 236px;}
}
@media (max-width: 340px) {
    .agency-reel{
        display: none;
    }
}
/* height-based media queries */
@media (max-height: 900px) {
    .menu .container,
    .menu .right-col ul {padding-top: 20vh;}
    .menu .left-col .divider {padding-bottom: 5vh;}
    .menu .left-col .lower,
    .menu .left-col .upper {padding-bottom: 2vh;}
    .menu .left-col h4 {margin-bottom: 2vh;}
    .menu .left-col .lower .stat {padding-bottom: 1vh;}
    .menu .left-col .upper p {font-size: 12px; line-height: 1.3;}
    .menu .left-col .lower h2 {font-size: 18px;}
}
@media (max-height: 640px) {
    .menu .right-col li {margin-bottom: 1vh; padding: 1vh 0;}
    .menu .right-col ul .divider {padding: 2vh 0;}
    .menu .right-col ul {font-size: 5vh;}
}
@media (max-height: 540px) {
    .top {
        padding: 14px 2%;
        width: 100%;
        box-sizing: border-box;
    }
    .top .logo,
    .top .gif {
        width: 180px;
        height: 52px;
    }
    /*.nav {top: 15px;}*/
    .menu {background-image: none;}
    .menu .left-col,
    .menu .right-col {display: none;}
    .mobile-menu {display: block;}
}
@media (max-height: 500px) {
    .mobile-menu ul li a {font-size: 24px;}
}
@media (max-height: 420px) {
    .mobile-menu ul li a {font-size: 18px;}
}