/*
 *
 * PEL 
 * https://www.pelstudio.com 
 *
 */

/********** SO FRESH AND SO CLEAN **********/

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, dsiv, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:after, blockquote:before, q:after, q:before {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
input, select, textarea {
    margin: 0;
    padding: 0;
}
.clearfix:after, .clearfix:before {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    zoom: 1;
}

/********** THE HIPSTER MOVEMENT DID NOT YIELD A GREAT LITERATURE, BUT IT MAKE GOOD USE OF FONTS **********/

/*
Font Weights:

300 - Light
400 - Regular
600 - Semi-bold
700 - Bold
*/

/********** GLOBALS **********/

body
{
   font-family: 'Khula', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 10px;
   font-weight: 400;
}

body, a
{
   text-decoration: none;
   color: #fff;
   outline: none;
}

p
{
   font-size: 2.1em;
   line-height: 1.3;
   margin: 1.25em 0;
}

strong
{
   font-weight: 700;
}

em
{
   font-style: italic;
}

header, .content, .contained
{
   box-sizing: border-box;
   max-width: 875px;
   margin: 0 auto;
   width: 100%;
   padding: 0 20px;
}

header, .content
{
   padding: 2em;
}

/********** NAVIGATION **********/

/*
.header_wrapper
{
   position: fixed;
   width: 100%;
   z-index: 100;
   background-color: #2dccae;
}
*/

nav.nav_primary
{
   font-size: 2em;
   /*background: url(images/logo-white_text.svg) center center no-repeat;*/
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
}

.nav_contact_trigger,
nav.nav_primary a
{
   display: inline-block;
   padding-bottom: 2px;
   font-weight: 600;
   cursor: pointer;;
   border-bottom: 1px solid transparent;
}

header .nav_contact_trigger:hover,
nav.nav_primary a:hover,
nav.nav_primary a.menu_current
{
   border-bottom: 1px solid #fff;
}

nav.nav_primary div:nth-of-type(3)
{
   width: 10%;
   height: 10%;
   line-height: 0;
}

nav.nav_primary div:nth-of-type(3) a,
nav.nav_primary div:nth-of-type(3) a:hover
{
   border: none !important;
   padding: 3% 0 0 0;
   /*pointer-events: none;*/
}

nav.nav_primary div
{
   width: auto;
}

/********** INSTAGRAM BLOCK **********/

.block_insta
{
   width: 100%;
}

.block_insta_header
{
   font-size: 1.8em;
   font-weight: 600;
   width: 100%;
   background-color: rgba(255,255,255,0.14);
   text-align: center;
   padding: 0.95em 0 .85em 0;
}

.block_insta_photos,
.block_insta_photos a
{
   line-height: 0;
}

.block_insta_photo
{
   line-height: 0;
   position: relative;
   float: left;
   width: 25%;
   height: 0;
   padding-bottom: 25%;
}

.block_insta_photo img
{
   width: 100%;
   height: 100%;
   line-height: 0;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
}


/********** CONTACT BLOCK **********/

.block_contact
{
   background-color: #FAA61A;
}

.block_contact h1
{
   margin-top: 1.590909em;
   font-size: 4.4em;
   text-align: center;
   font-weight: 600;
}

.block_contact h2
{
   line-height: 2;
   font-size: 1.5em;
   text-align: center;
   margin-bottom: 4.33333em;
}

.block_contact_email, .block_contact_phone
{
   width: 50%;
   float: left;
   text-align: center;
   font-size: 2.4em;
   font-weight: 600;
   margin-bottom: 2.916666em;
}


/********** FOOTER **********/

footer
{
   overflow: hidden;
   position: relative;
   background-image: linear-gradient(#e65d00, #f8d222);
}

footer:before
{
   box-sizing: border-box;
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   border-style: solid;
   border-width: 0 0 60px 100vw;
   border-color: transparent transparent transparent #FAA61A;
   overflow: hidden;
}

.footer_social_links
{
   display: flex;
   justify-content: space-between;
   margin: 1em 0 5em 0;
   padding-top: 11em;
}

.footer_social_link
{
   width: 2.4em;
   height: 2.4em;
   margin-bottom: 0.5em;
}

.footer_social_link_dn { background: url(images/heart.svg) center center no-repeat; }
.footer_social_link_in { background: url(images/logo_instagram.svg) center center no-repeat; }
.footer_social_link_fb { background: url(images/logo_facebook.svg) center center no-repeat; }
.footer_social_link_tw { background: url(images/logo_twitter.svg) center center no-repeat; }

.footer_navs
{
   width: 50%;
   display: flex;
   justify-content: space-between;
   margin: 2em auto;
}

.footer_nav_primary
{
   /*text-transform: uppercase;*/
   font-size: 1.65em;
   font-size: 1.8em;
   font-size: 1.9em;
}

.footer_nav_primary, footer .nav_contact_trigger
{
   font-weight: 600;
}


.footer_nav_secondary
{
   font-size: 1.8em;
}

.footer_nav div
{
   line-height: 48px;
}

.footer_newsletter
{
   font-size: 1.85em;
   font-weight: 600;
   text-align: center;
   margin-top: 3em;
}

.footer_copyright
{
   width: 100%;
   text-align: center;
   font-size: 1.5em;
   margin: 4em 0 3em 0;
}

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

.clients
{
   margin: 2.5em auto 7em auto;
   display: flex;
   justify-content: space-around;
}

.client
{
   width: 20%;
   opacity: 0.7;
   padding: 3.75%;
   vertical-align: middle;
}

.clients div:last-of-type
{
   display: none;
}

.client img
{
   width: 100%;
   height: auto;
}

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

body.page-about,
body.page-404,
body.page-privacy,
body.page-policies
{
   background: #E65025;
}

.page-about .region_top,
.page-policies .region_top
{
   background: url(images/tessnew-15.png);
   background-size: cover;
}

.page-policies h2
{
   font-size: 2.1em;
   font-weight: 700;
   margin-top: 2.75em;
}

.page-policies h2:first-of-type
{
   margin-top: 0;
}

.page-privacy .content
{
   padding: 6em 2em;
   font-size: 0.9em;
}

.page-privacy .content h1
{
   font-size: 3em;
   font-weight: 700;
}

.page-privacy .content h2
{
   font-size: 3em;
   font-weight: 600;
   margin-top: 1.75em;
}

.page-privacy .content h3
{
   font-size: 2.35em;
   font-weight: 600;
   margin-top: 1em;
}

.page-privacy .content h4
{
   font-size: 2.1em;
   font-weight: 700;
   margin-top: 1.5em;
}

.page-privacy .content p
{
   margin-top: 1em;
}

.page-privacy .content ul
{
   font-size: 2.1em;
   margin-left: 1em;
}

.page-privacy .content li
{
   list-style: disc;
   margin-bottom: 0.5em;
   line-height: 1.2;
}

.footer_copyright a
{
   position: relative;
}

.footer_copyright a:after
{
   content: '';
   width: 100%;
   position: absolute;
   left: 0;
   bottom: 4px;
   border-width: 0 0 1px;
   border-style: dotted;
}

.footer_copyright a:hover:after
{
   border-color: transparent;
}

/********** WORK PAGE **********/

body.page-work
{
   background: #D6EDE7;
   background: #EAFFFA;
   background: #2dccae;
   
   background-image: url(images/work/work-bg3.png);
   
}

body.page-work .content h1
{
   font-size: 4.15em;
   margin: 0.75em 0 1em 0;
   text-align: center;
   color: #383C3D;
   color: white;
   font-weight: 600;
}

.work_thumb
{
   position: relative;
   float: left;
   width: 48%;
   width: 47.904192%;
   height: 0;
   padding-bottom: 27%;
   padding-bottom: 26.946108%;
   line-height: 0;
   margin-bottom: 4%;
   
   width: 400px;
   height: 225px;
   margin-bottom: 35px;
   padding-bottom: 0;
}

.work_thumb.work_thumb_right
{
   float: right;
}

.work_thumb.work_thumb_double
{
   padding-bottom: 57.892216%;

   padding-bottom: 0;
   height: 485px;
}

.work_thumb img
{
   width: 100%;
   height: 100%;
}

.work_thumb:before
{
   position: absolute;
   left: 0;
   top: 0;   
   content: '';
   background: rgba(0,0,0,0.05);
   width: 100%;
   height: 100%;
}

.work_thumb:hover:before
{
   background: rgba(0,0,0,0);
}

.work_thumb_hover
{
   display: none;
   box-sizing: border-box;
   position: absolute;
   left: 0;
   top: 0;
   margin: 20px;
   width: 360px;
   height: 185px;
   background: rgba(45,204,174,0.8);
   background: rgba(230,80,37,0.8);
}

.work_thumb.work_thumb_double .work_thumb_hover
{
   height: 445px;
}

.work_thumb_hover h2
{
   display: block;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%,-50%);
   font-size: 4em;
   font-weight: 600;
   line-height: 1;
   text-align: center;
}

/********** TEAM PAGE **********/

body.page-team
{
   background: url(images/bg-team3.png);
   background-color: #042F5F;
   background-color: #004FA8;
   background-color: #004CBF;
   background-color: #0043AA;
   background-color: #1453B3;
   background-color: #0058BA;
   background-color: #1760D1;
   background-color: #0067CC;
   background-color: #0067DD;
   background-color: #005AE0;
   background-size: contain;
}

.team
{
   position: relative;
}

.team_member
{
   margin: 5em 0;
}

.team_photo
{
   width: 25%;
   float: left;
}

.team_photo img
{
   width: 100%;
   height: auto;
}

.team_details
{
   width: 70%;
   float: right;
}

.team_name
{
   font-size: 3.5em;
   font-weight: 600;
   color: #D6EDE7;
}

.team_title
{
   font-size: 2em;
   font-weight: 600;
   line-height: 1.5;
}

.team_bio p
{
   font-size: 1.9em;
}

.shape
{
   display: none;
}

.shape_squiggle_yellow
{
   position: absolute;
   width: 7%;
   height: 11%;
   background: url(images/shape_squiggle_yellow.svg) center center no-repeat;
   top: 14%;
   left: 63%;
}

.block_rotation 
{
   margin: 25px 0 55px 0;
   margin: 2.5em 0 5.5em 0;
}

.block_rotation h1
{
   font-size: 3.5em;
   font-weight: 700;
   text-align: center;
   margin-bottom: 1em;
   color: #FAA61A
}

.block_rotation_image
{
   width: 75%;
   margin: 0 auto;
   padding: 1em;  
}

.block_rotation_image img
{
   width: 100%;
   height: auto;
}

.block_rotation h2, 
.block_rotation h3
{
   text-align: center;
   font-size: 2.2em;
   line-height: 1.5;
}

.block_rotation h3
{
   line-height: 1.3;
   margin-bottom: 0.5em;
}

.block_rotation h2
{
   margin-top: 0.5em;
   font-weight: 700;
   line-height: 1.25;
}

.block_rotation h4
{
   font-size: 1.8em;
   text-align: center;
   line-height: 1.5;
}

/********** CONTACT PAGE **********/

body.page-contact
{
   background: radial-gradient(circle at center, #19f4c5 25%, #fc03df);
   background: radial-gradient(#19f4c5, #fc03df);
}

.contact
{
   background: none;
}

.contact_content
{
   box-sizing: border-box;
   border: 15px solid #1bf3c7;
   background: #2099D4;
   width: 75%;
   position: relative;

   padding: 5%;
   max-width: 800px;
   color: #1bf3c7;
   
   margin: 6em auto 10em auto;
}

.contact h1
{
   font-size: 5em;
   font-weight:bold;
   color: white;
}

.contact h2
{
   padding-top: 1em;
   font-size: 3.25em;
   margin-bottom: 1.75em;
   color: white;
}

.contact h3
{
   font-size: 3em;
   line-height: 1.2;
}

.contact .contact_group
{
   padding: 0 0 4em 0;
}

.contact_content > div:last-of-type
{
   padding-bottom: 0 !important;
}

#contact_questions
{
   position: relative;
}

#contact_questions h1
{
   position: absolute;
   top: 0;
   left: 0;
   visibility: hidden;
}

#contact_newsletter_link
{
   cursor: pointer;
   color: white;
}

@media all and (max-width: 440px)
{
   .contact_content
   {
      font-size: 0.9em;
   }
}

@media all and (max-width: 390px)
{
   .contact_content
   {
      font-size: 0.8em;
   }
}

@media all and (max-width: 350px)
{
   .contact_content
   {
      font-size: 0.7em;
   }
}

/********** CLIENT PAGES **********/


body.page-work-client
{
   background: #2dccae;
}

body.page-work-client .content
{
   padding-left: 70px;
   padding-right: 70px;
   max-width: 975px;
}

body.page-work-client .contained
{
   padding: 0 70px;
   max-width: 975px;
}

body.page-work-client img
{
   width: 100%;
   height: auto;
}

body.page-work-client .content h1
{
   font-size: 4.5em;
   margin: 0.75em 0 1em 0;
   text-align: center;
   color: #383b3d;
   font-weight: 600;
   font-weight: 500;
   color: white;   
}

.work_browser_header, .work_browser_header_desktop_only
{
   display: block;
   content: '';
   width: 100%;
   height: 23px;
   background: url(images/work/browser-top.png) 0 0 no-repeat;
   background-size: cover;
   background-position: center;
   
   height: 0 !important;
   padding-bottom: 3.285714% !important;
}

.work_hero_wrapper.work_hero_wrapper_mobile_only
{
   height: 810px;
   height: auto !important;
   padding-bottom: 71px;
   padding-bottom: 0 !important;
}

.work_browser_header_mobile_only
{
   background: url(images/work/mobile-top-pel2.png) 0 0 no-repeat;
   background-size: cover;
   background-position: center;
   padding-bottom: 7.2% !important;
}

.work_hero_wrapper.work_hero_wrapper_mobile_only:after
{
   display: block;
   content: '';
   width: 100%;
   background: url(images/work/mobile-bottom-pel3.png) 0 0 no-repeat;
   background-size: cover;
   background-position: center;
   height: 0 !important;
   padding-bottom: 10.7% !important;
}
   
#work_hero_image
{
   width: 47%;
   margin: 0 auto;
}

.work_hero_wrapper
{
   position: relative;
   height: 550px;
   overflow: hidden;
   margin: 0 auto;
   padding-bottom: 23px;
}

.work_hero
{
   height: 100%;
   margin: 0 auto;
   overflow-y: scroll;
   overflow-x: hidden;
   line-height: 0;
}

.work_hero img
{
   height: auto;
   line-height: 0;
}

.work_hero_wrapper, .work_hero, #work_hero img
{
   width: 700px;
}

.work_hero_wrapper.work_hero_wrapper_mobile_only,
.work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero,
.work_hero_wrapper.work_hero_wrapper_mobile_only #work_hero img
{
   width: 450px;
}

.work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero
{
   overflow: auto;
   overflow: hidden;
   height: auto;
}

.work_scrolltip
{
   display: none;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(255,254,191,0.4);
   background: rgba(255,255,255,0.45);
}

.work_scrolltip p, .work_scrolltip:after
{
   color: rgba(100,100,100,0.6);   
}

.work_scrolltip p
{
   display: block;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   font-size: 6.5em;
   font-weight: 700;
   text-transform: uppercase;
   padding: 0;
   margin: 0;
   text-align: center;
   line-height: 1;
}

.work_scrolltip:after
{
   content: '';
   position: absolute;
   bottom: 0.3em;
   font-size: 4em;
   left: 50%;
   transform: translateX(-50%);
   background: url(images/work/scrollme-down.svg) center center no-repeat;
   background-size: contain;
   width: 11%;
   height: 0;
   padding-bottom: 8%;
   opacity: 0.6;
}

ul.work_tasks
{
   width: 700px;
   display:block;
   padding: 0;
   margin: 6em auto 0.5em auto;
   color: #e65025;
   color: #f8d122;
   color: #fffebf;
   text-align: center;
   width: 83.832335%;
}

ul.work_tasks li
{
   display: inline;
   font-size: 2.8em;
   font-weight: 700;
   font-weight: 600;
   line-height: 1.35;
   /*white-space: nowrap;*/
}


ul.work_tasks li:after 
{ 
   content: " "; 
   letter-spacing: 1em;  
   background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwAAADsABataJCQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xMkMEa+wAAAAnSURBVBhXY/Dz89MA4sNA/B9Ka4AEYQIwfBgkiCwAxjhVopnppwEApxQqhnyQ+VkAAAAASUVORK5CYII=) center center no-repeat; 
}

ul.work_tasks li:last-of-type:after
{
   display: none;
}

.work_description_wrapper
{
   position: relative;
   margin: 2em 0 0 0;
   background: #14b193;
   padding: 7em 0;
   overflow: hidden;
}

.work_description_wrapper:before
{
   box-sizing: border-box;
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   border-style: solid;
   border-width: 0 0 60px 100vw;
   border-color: transparent transparent transparent #2dccae;
   overflow: hidden;
}

.work_description_wrapper:after
{
   box-sizing: border-box;
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;
   border-style: solid;
   border-width: 0 0 60px 100vw;
   border-color: transparent transparent #2dccae #14b193;
   overflow: hidden;   
}

.work_thumb_hover.work_thumb_hover_un        {   background-color: rgba(240, 76, 64, 0.8);   }
.work_thumb_hover.work_thumb_hover_winrock   {   background-color: rgba(0, 173, 239, 0.8);   }
.work_thumb_hover.work_thumb_hover_ff        {   background-color: rgba(91, 81, 178, 0.8);   }
.work_thumb_hover.work_thumb_hover_garfield  {   background-color: rgba(56, 174, 134, 0.8);   }
.work_thumb_hover.work_thumb_hover_gg        {   background-color: rgba(239, 84, 85, 0.8);   }
.work_thumb_hover.work_thumb_hover_ds        {   background-color: rgba(50, 201,207,0.8);   }
.work_thumb_hover.work_thumb_hover_359       {   background-color: rgba(199, 51, 61, 0.8);   }
.work_thumb_hover.work_thumb_hover_abla      {   background-color: rgba(240, 126, 55, 0.8);   }
.work_thumb_hover.work_thumb_hover_gf        {   background-color: rgba(230, 176, 59, 0.8);   }
.work_thumb_hover.work_thumb_hover_ys        {   background-color: rgba(20, 74, 162, 0.8);   }
.work_thumb_hover.work_thumb_hover_cml       {   background-color: rgba(1, 166, 222, 0.8);   }
.work_thumb_hover.work_thumb_hover_dc        {   background-color: rgba(81, 177, 94, 0.8);   }
.work_thumb_hover.work_thumb_hover_okeanos   {   background-color: rgba(1, 80, 135, 0.8);   }
.work_thumb_hover.work_thumb_hover_rc        {   background-color: rgba(184, 58, 81, 0.8);   }
.work_thumb_hover.work_thumb_hover_l2        {   background-color: rgba(83, 177, 97, 0.8);   }


.work_description a
{
   display: inline-block;
   border-bottom: 1px dotted white;
   height: 1.1em;
}

.work_description a:hover
{
   border: none;
   height: auto;
}

.work_features
{
   margin: 5em auto;
   margin-bottom: -2em;
}

.work_feature_row
{
   width: 700px;
   margin: 3em auto 5em auto;
   
   width: 100%;
   max-width: 700px;
}

.work_feature
{
   width: 325px;
}

.work_feature h2
{
   font-size: 2.5em;
   font-weight: 700;   
}

.work_feature p
{
   font-size: 1.75em;
   font-weight: 500;
   margin-top: 1em;
}

.work_feature a
{
   font-weight: 700;
}

.work_feature1
{
   float: left
}

.work_feature2
{

   float: right;
}

.work_sitelink
{
   text-align: center;
   font-size: 3.5em;
   margin-top: -0.5em;
   margin-bottom: 2.5em;
   
   margin-top: 1.75em;
}

.work_sitelink a
{
   display: inline-block;
   border-bottom: 3px solid white;
   line-height: 1.3;
}

.work_sitelink a:hover
{
   border-bottom: 3px solid transparent;
}

.work_arrow
{
   position: fixed;
   color: rgba(255,255,255,0.4);
   font-size: 4em;
   top: 50%;
   transform: translateY(-50%);
   z-index: 50;
   background: url(images/work/myarrow.svg) center center no-repeat;
   background-size: contain;
   width: 2%;
   padding: 0 0.35em 7% 0.35em;
   height: 0;
   opacity: 0.5;
   padding-bottom: 85px;
}

.work_arrow:hover
{
   opacity: 1;
}

.work_prev
{
   left: 0;
   transform: translateY(-50%) rotate(180deg);
}

.work_next
{
   right: 0;
}

.work_hero_image_mobile
{
   display: none;  
}

@media all and (max-width: 850px) 
{
   .work_hero_wrapper, .work_hero, #work_hero img
   {
      width: 500px;
   }
   
   .work_hero_wrapper
   {
      height: 392px;
      padding-bottom: 16px;
   }

   .work_browser_header, .work_browser_header_desktop_only
   {
      height: 17px;
   }
   
   .work_scrolltip p
   {
      font-size: 5.5em;
   }

   .work_scrolltip:after
   {
      width: 12%;
      padding-bottom: 10%;
   }

   .work_feature
   {
      width: 250px;
      width: 46.5%;
   }
}

@media all and (min-width: 750px) 
{
   .work_thumb .work_thumb_hover
   {
      display: none;
   }
   .work_thumb:hover .work_thumb_hover
   {
      display: block;
   }
}

@media all and (max-width: 649px) 
{
   .work_hero_wrapper, .work_hero, #work_hero img
   {
      width: 350px;
   }

   .work_hero_wrapper
   {
      height: 275px;
      padding-bottom: 11px;
   }
   
   .work_browser_header, .work_browser_header_desktop_only
   {
      height: 10px;
   }
   
   .work_scrolltip p
   {
      font-size: 5em;
   }

   .work_scrolltip:after
   {
      width: 12%;
      padding-bottom: 10%;
   }
   
   ul.work_tasks li
   {
      display: block;
      line-height: 1.65;
   }
   
   ul.work_tasks li::after 
   {
      display: none;
   }
   
   body.page-work-client .content
   {
      padding-left: 40px;
      padding-right: 40px;
   }
   
   body.page-work-client .contained
   {
      padding: 0 40px;
   }
   
   body.page-work-client .work_description.contained,
   body.page-work-client .work_features.contained
   {
      padding-left: 70px;
      padding-right: 70px;
   }
}

@media all and (max-width: 574px) 
{
   .work_hero_wrapper.work_hero_wrapper_mobile_only,
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero,
   .work_hero_wrapper.work_hero_wrapper_mobile_only #work_hero img
   {
      width: 325px;
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only
   {
      /*
      height: 565px;
      height: auto;
      padding-bottom: 71px;
      */
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero
   {
      overflow: visible;
      height: auto;
   }
}

@media all and (max-width: 499px) 
{
   .work_hero_wrapper:not(.work_hero_wrapper_desktop_only)
   {
      padding-bottom: 63px;
      height: 500px;
   }
   
   .work_hero_wrapper:not(.work_hero_wrapper_desktop_only):after
   {
      display: block;
      content: '';
      width: 100%;
      background: url(images/work/mobile-bottom-pel3.png) 0 0 no-repeat;
      background-size: cover;
      background-position: center;
      height: 0 !important;
      padding-bottom: 10.7% !important;
   }
   
   .work_hero_wrapper:not(.work_hero_wrapper_desktop_only) .work_scrolltip
   {
      border: 1px solid transparent;
      border-radius: 25px;
   }
   
   .work_scrolltip p
   {
      font-size: 6.5em;
      line-height: 1;
   }
   
   .work_hero_wrapper:not(.work_hero_wrapper_desktop_only) .work_scrolltip::after 
   {
      width: 18%;
      padding-bottom: 35%;
   }
   
   ul.work_tasks
   {
      margin-top: 4em;
   }
    
   .work_browser_header
   {
      background-image: url(images/work/mobile-top-pel.png);
      padding-bottom: 7.2% !important;
   }
      
   .work_hero_image_mobile
   {
      display: block;
   }
   
   .work_hero_image_desktop
   {
      display: none;
   }
   
   .work_feature1, .work_feature2
   {
      clear: both;
      float: none;
   }
   
   .work_feature
   {
      width: 100%;
      max-width: 300px;
      margin: 0 auto;
   }
   
   .work_feature h2
   {
      margin-top: 0.75em;
   }
   
   .work_feature_row
   {
      margin-top: 0;
      margin-bottom: 3em;
   }
   
   ul.work_tasks li
   {
      font-size: 2.45em;
      line-height: 1.8;
   }
   
   .work_feature p
   {
      margin-top: 0.75em;
   }
   
   .work_description
   {
      margin: 5em 0;
   }
   
   .work_arrow
   {
      padding-bottom: 60px;
   }
   
   body.page-work-client .work_description.contained,
   body.page-work-client .work_features.contained
   {
      padding-left: 50px !important;
      padding-right: 50px !important;
   }
   
   header, .content
   {
      padding: 2em 3em;
   }
   
   nav.nav_primary
   {
      font-size: 1.95em;
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only,
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero,
   .work_hero_wrapper.work_hero_wrapper_mobile_only #work_hero img
   {
      width: 295px;
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only
   {
      /*
      height: 506px;
      height: auto;
      padding-bottom: 71px;
      */
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero
   {
      overflow: visible;
      height: auto;
   }
   
}

@media all and (max-width: 424px) 
{
   .work_hero_wrapper:not(.work_hero_wrapper_desktop_only)
   {
      height: 357px;
      padding-bottom: 45px;
   }
   
   .work_hero_wrapper.work_hero_wrapper_desktop_only
   {
      padding-bottom: 8px;
   }
   
   .work_hero_wrapper:not(.work_hero_wrapper_desktop_only) .work_scrolltip
   {
      border: 1px solid transparent;
      border-radius: 20px;
   }
   
   .work_hero_wrapper, .work_hero, #work_hero img
   {
      width: 250px;
   }

   .work_browser_header, .work_browser_header_desktop_only
   {
      height: 9px;
   }
   
   .work_sitelink a:hover,
   .work_sitelink a
   {
      width: 80%;
      border-bottom: none;
      border: 2px solid white;
      padding: 0.4em 0 0.2em 0;
      line-height: 1.1;
   }
   
   .work_scrolltip p
   {
      font-size: 5.5em;
   }
   
   .work_hero_wrapper.work_hero_wrapper_desktop_only .work_scrolltip::after 
   {
      width: 18%;
      padding-bottom: 13%;
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only,
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero,
   .work_hero_wrapper.work_hero_wrapper_mobile_only #work_hero img
   {
      width: 295px;
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only
   {
      /*
      height: 506px;
      height: auto;
      padding-bottom: 71px;
      */
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero
   {
      overflow: auto;
      height: auto;
   }
   
}

@media all and (max-width: 379px) 
{
   body.page-work-client .content
   {
      padding-left: 25px;
      padding-right: 25px;
   }
   
   body.page-work-client .contained
   {
      padding: 0 25px;
   }

   .work_hero_wrapper.work_hero_wrapper_mobile_only,
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero,
   .work_hero_wrapper.work_hero_wrapper_mobile_only #work_hero img
   {
      width: 255px;
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only
   {
      /*
      height: 428px;
      height: auto;
      padding-bottom: 71px;
      */
   }
   
   .work_hero_wrapper.work_hero_wrapper_mobile_only .work_hero
   {
      overflow: visible;
      height: auto;
   }
}   

/********** FIND US PAGE **********/

body.page-find-us
{
   background: #7a8486;
   background: #e65025;
   background: #f22f4a;
}

body.page-find-us .content h1
{
   font-size: 4.15em;
   margin: 0.75em 0 1em 0;
   text-align: center;
   color: #383C3D;
   color: white;
   font-weight: 600;
}

ul.find-us-logos
{
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
   align-items: center;
   margin-bottom: 6em;
}

.find-us-logos li
{
   width: 90px;
   margin: 1.9em;
   padding: 4em;
   border-radius: 4em;
   background-color: rgba(255,255,255,0.15);
   line-height: 0;
}

.find-us-logos li:hover
{
   background-color: rgba(255,255,255,0.25);
   transition: all .4s ease;

}

.find-us-logos li img
{
   width: 100%;
   line-height: 0;
}

/********** MOBILE IS EVERYTHING, RIGHT? **********/

@media all and (max-width: 599px) 
{
   body
   {
      font-size: 8px;
   }

   header, .content
   {
      /*padding: 3em;*/
   }
   
   nav.nav_primary
   {
      font-size: 1.9em;
   }
   
   nav.nav_primary div:nth-of-type(3)
   {
      width: 13%;
      height: auto;;
   }
   
   .content
   {
      padding: 0 3em;
   }   
   
   .clients
   {
      display: block;
      margin-top: 0;
      margin-bottom: 2em;
   }
   
   .clients:after, .clients:before
   {
      content: '';
      display: table;
      clear: both;
   }
   
   .client
   {
      box-sizing: border-box;
      float: left;
      width: 50%;
      padding: 7.75%;
   }
   
   .clients div:last-of-type
   {
      display: block;
   }

   
   .block_insta
   {
      clear: both;
   }

   .block_insta_header
   {
      box-sizing: border-box;
      font-size: 2.25em;
      padding: 1em;
      line-height: 1.25;
   }
   
   .block_insta_photo
   {
      position: relative;
      float: left;
      width: 50%;
      height: 0;
      padding-bottom: 50%;
   }
   
   footer:before
   {
      border-width: 0 0 40px 100vw;
   }
   
   .footer_navs
   {
      width: 75%;
   }
   
   .footer_nav_primary
   {
      font-size: 2em;
   }
   
   .footer_nav_secondary
   {
      font-size: 2.1em;
   }
   
   .team_photo
   {
      width: 55%;
      float: none;
   }
   
   .team_member
   {
      margin-top: 2.5em;
      margin-bottom: 0;
   }
   
   .team_details
   {
      margin-top: 2em;
      float: none;
      width: 100%;
   }
   
   .block_rotation
   {
      margin-top: 5em;
   }
   
   .block_contact_email, .block_contact_phone
   {
      width: 100%;
      float: none;
      margin-bottom: 1.5em;
   }
   
   .block_contact_phone
   {
      margin-bottom: 2.91666em;
   }
   
   .nav_contact_trigger, nav.nav_primary a
   {
      padding-bottom: 1px;
   }
}

@media all and (max-width: 875px) 
{
   .work_thumb, .work_thumb_double, .work_thumb.work_thumb_right
   {
      float: none;
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 35px;
   }
   
   .work_thumb.work_thumb_double
   {
      height: 485px;
   }
}

@media all and (max-width: 749px) 
{
   .work_thumb_hover
   {
      display: block !important;
      margin: 0;
      height: auto;
      width: 100%;
      transform: none;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
   }
   
   .work_thumb.work_thumb_double .work_thumb_hover
   {
      height: auto;
   }
   
   .work_thumb_hover h2
   {
      background: none;
      padding: 0.75em;
      font-size: 3em;
      width: 80%;
   }

   .work_thumb, 
   .work_thumb.work_thumb_double
   {
      height: auto;
      padding: 0;
      margin-left: auto;
      margin-right: auto;
      width: 90%;
      max-width: 400px;
   }
   
   .work_thumb.work_thumb_double:before,
   .work_thumb::before
   {
      width: 90%;
      left: 5%;
      height: auto;
   }
}

@media (hover: none) 
{
   .work_thumb_hover
   {
      display: block !important;
      margin: 0;
      height: auto;
      width: 100%;
      transform: none;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
   }
   
   .work_thumb.work_thumb_double .work_thumb_hover
   {
      height: auto;
   }
   
   .work_thumb_hover h2
   {
      background: none;
      padding: 0.75em;
      font-size: 3em;
      width: 80%;
   }

   .work_thumb, 
   .work_thumb.work_thumb_double
   {
      height: auto;
      padding: 0;
      margin-left: auto;
      margin-right: auto;
      width: 90%;
      max-width: 400px;
   }
   
   .work_thumb.work_thumb_double:before,
   .work_thumb::before
   {
      width: 90%;
      left: 5%;
      height: auto;
   }
}

@media all and (max-width: 499px) 
{
   .work_thumb, 
   .work_thumb.work_thumb_double
   {
      margin-left: 5%;
      margin-right: 5%;
   }
   
   .work_thumb img
   {
      height: auto;
   }
}

/* 404 */

body.page-404 iframe
{
   box-sizing: border-box;
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   margin: 0 auto;
   padding: 6px;
}

body.page-404 a
{
   font-weight: 600;
}

.video_wrapper
{
   width: 100%;
   max-width: 700px;
   margin: 4em auto;
}

.video_container
{
   position: relative;
   padding-bottom: 56.25%;
   overflow: hidden;
   height: auto;
   background: #f7cbbe;
}   
   
/********** UGH! **********/

#mc_embed_signup form
{
   padding: 0;
   width: 100%;
   clear: none;
   padding: 0;
   min-height: 0;
   width: 100%;
   margin: 0.5em auto;
}

#mce-responses
{
   margin-top: 1em;
   font-size: 0.75em;
   font-weight: 600;
}

.footer_newsletter label
{
   width: 100%;
   text-align: center;
   display: block;
   line-height: 1.3;
   margin-bottom: 0.4em;
}

.footer_newsletter .email_input_wrapper
{
   position: relative;
   display: inline-block;
   margin-top: 0.6rem;
   width: 14em;
   height: 28px;
}

.footer_newsletter .email_input_wrapper_skewedbg
{
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(255,255,255,0.07); 
   transform: skew(-20deg);
}


.footer_newsletter #mc_embed_signup input
{
   box-sizing: border-box;
   border: none;
   border-radius: 0;
   padding: 0;
   color: #fff;
   font-size: 1em;
   margin: 0 auto;
   width: 13em;
   font-size: 0.8em;
   line-height: 1.7;
   text-align: center;
   outline: none;
   height: 28px;
   width: 15em;
   background: none;
   
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   z-index: 100;
}

::placeholder
{
   color: white;
   opacity: 0.65;
   text-decoration: none;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: white;
  opacity: 0.65;
  text-decoration: none;
}

::-moz-placeholder { /* Firefox 19+ */
  color: white;
  opacity: 0.65;
  text-decoration: none;
}

:-ms-input-placeholder { /* IE 10+ */
  color: white;
  opacity: 0.65;
  text-decoration: none;
}

:-moz-placeholder { /* Firefox 18- */
  color: white;
  opacity: 0.65;
  text-decoration: none;
}

nav.nav_primary div
{
   /*
   align-items: center;
   display: flex;
   justify-content: center;
   */
   
   /*font-size: 0.9em;*/
   width: 3.5em;
}

nav.nav_primary div img
{
   width: 100%;
   height: auto;
}

/*
nav.nav_primary div:first-child > a { margin-right: auto; }

nav.nav_primary div:last-child  > a { margin-left: auto;  }
*/

nav.nav_primary div:nth-of-type(3)
{
   /*
   align-self: center;
   justify-self: center;
   */
}

nav.nav_primary div:nth-of-type(1)
{
   text-align: left;
}

nav.nav_primary div:nth-of-type(2)
{
   text-align: center;
}

nav.nav_primary div:nth-of-type(3)
{
   padding: 0 0.3em;
}

nav.nav_primary div:nth-of-type(3) a
{
   display: block;
}

nav.nav_primary div:nth-of-type(4)
{
   text-align: center;
}

nav.nav_primary div:nth-of-type(5)
{
   text-align: right;
}


