/*
 * core.css - all custom CSS code belongs in this file; including Bootstrap
 * Framework overrides.
 *
 */

/* =============================================================================
 CUSTOM CSS
 ========================================================================== */
/*
 BOOTSTRAP OVERRIDES
 ----------------------------------------------------------------------------*/
/* Sets Box model */
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: middle;
}

html, body {
  background-color: #fff;
  font-family:'Helvetica Neue LT W05_75 Bold';
  color: #68515d;
  line-height: 1;
  font-family: sans-serif;
  font-smooth: antialiased;
  -webkit-font-smoothing: antialiased;
  min-width: 320px;
  overflow-x: hidden;
}

html {
  font-size: 16px;
}
@media screen and (min-width: 767px) {
  html {
    font-size: 18px;
  }
}
@media screen and (min-width: 1024px) {
  html {
    font-size: 20px;
  }
}
@media screen and (min-width: 1800px) {
  html {
    font-size: 20px;
  }
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1;
  margin: 1em 0 .5em;
  text-align: left;
  font-family:'Helvetica Neue LT W05_75 Bold';
  color:#f04923;
  text-transform: lowercase;
}

h1 {
  font-size: 2.875em;
  margin: 1.3125em auto .5em;
}
.contact h1 {
  margin-top: 2em;
}
h2 { font-size: 2.25em;
  margin: 1.75em auto 1em;  }
h3 { font-size: 1.625em; color:#68515d;
  margin: 1.5em auto 0; }
h4 { font-size: 130%; }
h5 { font-size: 100%; }
h6 { font-size: 80%; }

main p, main li {
  font-size: 1.25em;
  text-align: left;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: normal;
  font-family:'Helvetica Neue LT W05_55 Roman';
}

main p, main ul {
  margin: 1.625em auto;
  text-align: left;
}
.flex > p,
.flex > ul {
  margin: 0;
}

img { outline: none; border: 0; }

.img-responsive { display: inline; }

.nowrap { white-space: nowrap; }

em, i { font-family:'Helvetica Neue LT W05_56 Italic'; font-synthesis: none; }

strong, b { font-family:'Helvetica Neue LT W05_75 Bold'; font-synthesis: none; }

a, .orange { color: #f04923; text-decoration: none; }
a:hover { color: #68515d; text-decoration: none; }

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.ib {
  display: inline-block;
}

/*
 UTILITY CLASSES SECTION
 ----------------------------------------------------------------------------*/
iframe#mediaplxpxl {
  opacity: 0;
}

.w100 {
  width: 100%;
  height: auto;
}

.col-sm-offset-2 {
  margin-left: 16.66666667%;
}

@media (max-width:767px) {
  .col-sm-offset-2 {
    margin-left:0;
  }
}

.box {
  font-size: .875em;
  background-color: #efefef;
  padding: 2em 2.5em 1.5em;
  margin: 5em auto 0;
}
.box h2 {
  font-size: 2em;
  margin: .5em auto;
}
.icofont-arrow-up {
  margin: 0;
}
.icofont-long-arrow-left {
  margin-left: -1.125em;
}
.icofont-long-arrow-right {
  margin-right: -1em;
}

/*
 GLOBAL SECTION
 ----------------------------------------------------------------------------*/
#outerwrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  min-height: 100vh;
}

#content {
  width: 100%;
  padding: 5.25em 0 4em;
  margin: 0 auto;
  opacity: 0;
  transition: opacity .5s;
}
.page-loaded #content {
  opacity: 1;
}

#cs img,
#cs #vid-block,
#cs .solution-gallery {
  filter: drop-shadow(.25em .25em .5em #0002);
}

section {
  position: relative;
  z-index: 2;
  padding: 2em 0;
}
section + section {
  padding-top: 0;
}

section#locations {
  width: 100%;
  max-width: none;
}


/*
  HEADER
----------------------------------------------------------------------------*/
#header {
  position: fixed;
  text-align: center;
  z-index: 9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  left: 50%;
  transform: translateX(-50%);
  height: 5.25em;
  padding: .625em 1.25em;
  background-color: #fff;
  transition: height .3s ease-out;
}
@media (max-width:1023px) {
  #header {
    pointer-events: none;
  }
  #header * {
    pointer-events: all;
  }
}

#header.scrolled {
  height: 4.25em;
}
#header.scrolled #nav-logo {
  width: 3.25em;
  height: auto;
}

#nav-logo {
  width: 4.25em;
  height: 4.25em;
  transition: filter .3s ease-out, width .3s ease-out;
  display: inline-block;
}
.home #nav-logo {
  pointer-events: none;
}
.menu-open #nav-logo {
  opacity: 0;
  pointer-events: none;
}

header button#nav-open {
  display: none;
}
#nav {
  flex: 0 0 calc(100% - 4em);
  letter-spacing: .02em;
  text-transform: uppercase;
  background-color: #fff;
}
#nav ul {
  text-align: right;
}
#nav li {
  display: inline-block;
}
#nav a { 
  font-family: alternate-gothic-no-2-d, sans-serif;
  color: #f04923;
  border: 0;
  background: transparent;
  transition: color .4375s ease-out, background-color .4375s ease-out;
  display: block;
  margin: .4375em;
  padding: .3125em .375em .125em;
  border-radius: .125em;
  font-size: 1.25em;
  line-height: .8;
  text-align: left;
}
#nav a:hover { background-color: #fff41c;
  transition: color .25s ease-out, background-color .25s ease-out; }
#nav a.active,
#nav a:active { color: #68515d; }
#nav a.active { pointer-events: none; }

/* menu button */
#nav-open,
#nav-close {position: absolute;
  top: 50%;
  right: 1.25em;
  transform: translateY(-50%);
  display: inline-block;
  vertical-align: middle;
  height: 2.75em;
  width: 3.5em;
  cursor: pointer;
  z-index: 20;
  background: transparent;
  opacity: 1;
  transition: all .3s ease-in-out;
  border: none;
  z-index: 11;
  margin: 0;
}

#nav-open *,
#nav-close * {
  pointer-events: none;
}

.hamburger {
  position: absolute;
  transform: scale(.875);
  height: 100%;
  width: 100%;
  top: 0; left: 0;
}
.bun:before,
.bun:after,
.patty {
  content: '';
  width: 42px;
  height: 6px;
  transform: translate(-50%,-50%);
  position: absolute;
  left: 50%;
  background-color: #f04923;
  transition: all .3s ease-out;
  pointer-events: none;
}
#nav-close .bun:before,
#nav-close .bun:after,
#nav-close .patty {
  background-color: #f04923;
}
.bun:before {
  top: calc(50% - 15px);
}
.bun:after {
  top: calc(50% + 15px);
}
.patty {
  top: 50%;
}
#nav-open:hover .bun:before,
#nav-open:hover .bun:after,
#nav-open:hover .patty,
#nav-close:hover .bun:before,
#nav-close:hover .bun:after,
#nav-close:hover .patty {
  background-color: #68515d;
}

#nav-close .hamburger .patty {
  opacity: 0;
}
#nav-close .hamburger .bun:before,
#nav-close .hamburger .bun:after {
  transform: translate(-50%,-50%) rotate(45deg);
  transform-origin: center;
  top: 50%; left: 50%;
}
#nav-close .hamburger .bun:after {
  transform: translate(-50%,-50%) rotate(-45deg);
}

/*
 SOCIAL ICONS
----------------------- */
.social {
  font-size: .875em;
  position: relative;
  left: -.3125em;
}

.social div {
  display: inline-block;
}

.social div a {
  display: inline-block;
  padding: 0;
  height: 2em;
}

.social a svg {
  display: block;
  width: auto;
  height: 100%;
}

.social a svg path {
  fill: #fff;
  transition: fill .2s;
}

.social a:hover svg path {
  fill: #fff;
}

/*
 FOOTER SECTION
 ----------------------------------------------------------------------------*/
#footer {
  font-family: alternate-gothic-no-2-d, sans-serif;
  background-color: #efefef;
  margin: 0 auto;
  padding: 2.25em 1.5em;
  line-height: 1.2;
  text-align: center;
  color:#f04923;
  position:relative;
  overflow:hidden;
  transition: background-color 1s ease-out .2s, color .3s ease-out;
  font-size: 1.125em;
}
#footer:hover {
  background-color: #f04923;
  color: #fff;
}
#footer svg path {
  fill: #f04923;
  transition: fill .3s ease-out;
}
#footer:hover svg path {
  fill: #fff;
}
#footer:hover .social a:hover svg path {
  fill: #fff41c;
  transition: color .3s ease-out;
}
#footer p {
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-align: center;
  padding: 0;
  margin: .25em auto;
  text-transform: uppercase;
  line-height: 1.2;
  color: #f04923;
  transition: color .3s ease-out;
}

#footer:hover p {
  color: #fff;
}
#footer a {
  font-family: alternate-gothic-no-2-d, sans-serif;
  color: #f04923;
  transition: color .3s ease-out;
}
#footer a:hover {
  color: #fff;
}
#footer:hover a {
  color: #fff;
}
#footer .dewynters a {
  color: #000!important;
}
#footer:hover .dewynters a:hover {
  color: #fff41c!important;
}
#footer:hover a:hover {
  color: #fff41c;
  transition: color .3s ease-out;
}
@media (max-width: 767px) {
  #footer {
    background-color: #f04923;
    color: #fff;
  }
  #footer p {
    color: #fff;
  }
  #footer a {
    color: #fff;
  }
  #footer svg path {
    fill: #fff;
  }
  #footer .social a:hover svg path {
    fill: #fff41c;
    transition: color .3s ease-out;
  }
  #footer .dewynters a:hover {
    color: #fff41c!important;
  }
  #footer a:hover {
    color: #fff41c;
    transition: color .3s ease-out;
  }
}

.foot-logo {
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-align: center;
  font-size: 3.25em;
  letter-spacing: .05em;
  margin: 0 auto -.0625em;
}

#footer-email a {
  text-transform: lowercase;
  font-size:14px;
}

#footer-address {
  clear:both;
  margin:0 auto 1.875em;
  max-width:1200px;
}

.dewynters, .spot, .r4e {
  text-align:center;
  width: 24em;
  margin: 2em auto 0;
}

.dewynters, .r4e, .dewynters a {
  color:#000;
}

.dewynters a:hover {
 color: #fff;
}

.office-type {
  font-size: .875em;
  text-transform:lowercase;
  display:block;
  font-family:'Helvetica Neue LT W05_75 Bold';
}

.office-name {
  font-size:1.5em;
  font-family: alternate-gothic-no-2-d, sans-serif;
  letter-spacing:.05em;
  display:block;
  margin-top:.25em;
}

p.address {
}
#footer p.address {
  font-size: .9375em;
}

#footer-social a {
  color: #fff;
  padding: 0 .25em;
}

#footer-social .facebook a,
#footer-social .twitter a {
  margin: 0;
  padding: 0;
}

.mark-left, .mark-right {
  width:30%;
  height: 100%;
  position:absolute;
  top:2%;
  margin-left:auto;
  margin-right:auto;
  transition:all 1s ease-in-out;
  opacity:1;
}

.mark-left img, .mark-right img {
  position:absolute;
  top:0; left: 0;
  height: 100%; width: auto;
  transition:all 1s ease-in-out;
  opacity:1;
  transform: translateX(-50%);
}

.mark-left {
  left: 0;
  z-index: 2;
  filter: saturate(1);
}

.mark-right {
  left: 100%;
  z-index: 1;
  filter: saturate(1);
}

.footer-content {
  position: relative;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

#footer:hover .mark-left {
  left:35%;
  opacity:0;

}

#footer:hover .mark-right {
  left:65%;
  opacity:0;
}

@media (min-width:1200px) {
  .mark-left, .mark-right {
    top:0;
  }
}



@media (max-width:767px) {

  .dewynters, .spot, .r4e {
    width:100%;
    float:none;
    margin:1.5em 0;
  }

  .mark-left, .mark-right {
    display:none;
  }

  #footer-email {
    margin-bottom:5px;
  }
}

/*
  SERVICES SECTION
  ----------------------------------------------------------------------------*/

#service-list-contain {
  margin: 0 auto;
  position: relative;
  border: 3px solid #e3e3e3;
  background-color: #fff;
}
#slider-dots {
  font-size: 1.25em;
  padding: 1em 0 1.125em;
}
@media (max-width: 1023px) {
  #slider-dots {
    font-size: 1.25em;
    width: 24em;
    max-width: 100%;
    margin: 0 auto;
  }
}
@media (max-width: 532px) {
  #slider-dots {
    width: 18em;
    margin: 0 auto;
    font-size: 1.125em;
  }
}
#service-list {
  background-color: #fff;
  position:relative;
  z-index:2;
}
.services .vid-back-top, .services .vid-back-btm {
  z-index:1!important;
}
.service-slider { display: none; position:relative;  }
.service-slider.slick-initialized { display: block; }
ul.slick-dots {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375em .625em;
  justify-content: center;
}
#slider-dots a {
  font-family: alternate-gothic-no-2-d, sans-serif;
  font-size: 1em;
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  color:#f04923;
  padding: 4px 4px 1px;
  transition:background-color .25s ease-in-out, color .25s ease-in-out;
  background-color: #fff;
}
@media (max-width:767px) {
  #slider-dots a {
    font-size: 1.125em;
  }
}
#slider-dots a:hover, #slider-dots .slick-active a {
  background-color: #f04923;
  color:#fff;
}
#slider-dots ul {
  text-align: center;
  padding: 0;
  font-size: 1rem;
}
#slider-dots li {
  display:inline-block;
  margin: 0 .25em;
}
#slider-dots li:hover {
  cursor:pointer;
}
.service-slider .slick-prev, .service-slider .slick-next {
  height:100%;
  width:20%;
  position:absolute;
  opacity:0;
  z-index:7;
}
.service-slider .slick-prev {
  top:0;
  left:0;
}
.service-slider .slick-next {
  top:0;
  right:0;
}
.service-slider .slick-next:hover, .service-slider .slick-prev:hover {
  cursor:pointer;
}
.slick-slide {
  opacity:.7;
  outline:none;
}
.slick-center, .slick-current {
  opacity:1;
}
#services p {
  font-size:130%;
  margin-top:10px;
  color:#68515d;
}
#case-studies h1 {
  margin-bottom:30px;
}
.service-item {
  padding: 1.625em;
}
.service-item h3 {
  margin:0 0 5px;
  padding:0;
}
.case-study-grid a {
  width:33%;
  float:left;
  display:block;
  position:relative;
}
.case-study-grid a span {
  font-family: alternate-gothic-no-2-d, sans-serif;
  color:#fff;
  position:absolute;
  display:block;
  text-align:center;
  top: 50%;
  left:50%;
  transform: translate(-50%, -50%);
  font-size:300%;
  transition: all 0.2s ease-in-out;
  line-height:.8;
  text-shadow: 0 0 15px #000;
}
.case-study-grid a span:before, .case-study-grid a span:after {
  content: "";
  position: absolute;
  bottom: -2px;
  width: 0px;
  height: 5px;
  margin: 5px 0 0;
  transition: all 0.2s ease-in-out;
  transition-duration: 0.75s;
  opacity: 0;
  background-color: #fff41c;
}
.case-study-grid a span:before, .case-study-grid a span:after {
  left: 0;
}
.case-study-grid a:hover span:before, .case-study-grid a:hover span:after {
  width: 100%;
  opacity: 1;
}
.service-slider .prev, .service-slider .next {
  position:absolute;
  top:35%;
  z-index:7;
  font-size:22px;
  color:#ee4799;
  display:none;
}
.service-slider  .prev.slick-arrow, .service-slider  .next.slick-arrow {
  display:block;
}
.service-slider  .prev {
  left:-3%;
}
.service-slider  .next {
  right:-3%;
}
.service-slider .prev:hover, .service-slider  .next:hover {
  cursor:pointer;
}

@media (min-width:1200px) {
  h1 {
    font-size:44px;
  }
  #services p {
    font-size:24px;
  }
}

@media (min-width:768px) {
  #service-list {
    margin-top:-1em;
  }
  #service-list {
    margin:0 auto;
  }
  .cs-link {
    font-size:40%;
    display:inline-block!important;
    color:#000;
  }
  .cs-link i {
    font-size:75%;
  }
  .service-item p {
    font-size:21px;
    margin-bottom:0;
  }
  .service-item h3 {
  }
  .case-study-grid a img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    transition:.5s;
  }
  .case-study-grid a:hover img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
  }
}


@media (max-width:767px) {
  .prev {
    left:-7%;
  }

  .next {
    right:-7%;
  }

  .prev, .next {
    top:30%;
  }

  .service-item {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
    scroll-snap-align: center;
  }
  .empty-item {
    height:25px;
  }
  .case-study-grid a {
    width:100%;
    float:none;
    display:block;
    position:relative;
  }
  .case-study-grid a span {
    left:55%;
    top:54%;
    text-align:left;
    width:100%;
    font-size:25px;
    text-shadow:0 0 0 #000;
  }
  .case-study-grid a span:before, .case-study-grid a span:after {
    content: "";
    position: absolute;
    bottom: -2px;
    width: 0px;
    height: 5px;
    margin: 5px 0 0;
    transition: all 0.2s ease-in-out;
    transition-duration: 0.75s;
    opacity: 0;
    background-color: transparent;
  }
}

/*
 CASE STUDIES PAGES
 ----------------------------------------------------------------------------*/
.back-top {
  display:none;
  width:50px;
  height:50px;
  position:fixed;
  bottom:20px;
  right:20px;
  background-color: #efefef;
  color: #f04923;
  text-align:center;
  font-size:40px;
  padding-top:2px;
  animation:arrow-bounce 4s ease 0s infinite;
  z-index: 9;
}

.back-top:hover {
  background-color: #fff41c;
  color: #f04923;
}

@keyframes arrow-bounce {
  0% {
    bottom:20px;
  }

  25% {
    bottom:30px;
  }

  50% {
    bottom:20px;
  }

  75% {
    bottom:30px;
  }

  100% {
    bottom:20px;
  }
}

section.part2 {
  margin-top:0;
  padding-top:0;
}

#cs h1 {
  margin-bottom: 0;
}

#cs h2 {
  font-size: 1.5em;
  font-family:'Helvetica Neue LT W05_55 Roman';
  margin: 0 auto .875em;
}

.cs-hero {
  margin: 0 0 3.25em;
}

#cs h3 {
  text-transform: lowercase;
  margin:0;
  padding:0;
}

#cs p {
  margin: 0 auto 1.875em;
}

#cs p a {
  color:#f04923;
  text-decoration:underline;
}

#cs p a:hover {
  text-decoration: none;
}

#result > a {
  margin: 1.5em auto;
}

.btn,
.work-with-us form button,
.back-btn,
.left-cs-nav,
.right-cs-nav {
  display:block;
  position: relative;
  width: 11em;
  padding: .375em 0 .275em;
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-transform: uppercase;
  font-size: 1.1875em;
  text-align: center;
  color:#f04923;
  background-color: #efefef;
  transition: color .125s ease-out, background-color .125s ease-out, border-color .125s ease-out;
  border: 1px solid #efefef;
}

.btn:hover,
.work-with-us form button:hover,
.back-btn:hover,
.left-cs-nav:hover,
.right-cs-nav:hover {
  color:#f04923;
  background-color: #fff41c;
  border-color: #fff41c;
}

.work-with-us form button {
  font-size: 1.875em;
  padding: .1875em 0 .0625em;
}

#cs-nav a.left-cs-nav,
#cs-nav a.right-cs-nav {
  align-items: flex-start;
  padding: .375em .375em .1875em;
}

.back-btn i,
.left-cs-nav i,
.right-cs-nav i {
  font-size: 1.2em;
  line-height: 0;
  vertical-align: baseline;
}

.back-btn .btn-text,
.left-cs-nav .btn-text,
.right-cs-nav .btn-text {
  margin-right: 0;
}

.back-btn .btn-text,
.left-cs-nav .btn-text {
}

#cs-nav {
  margin: 3em auto;
  display: flex;
  flex-direction: row;
  gap: 1em;
  justify-content: space-between;
  align-items: stretch;
}
#cs-nav a {
  margin: 0;
  flex: 1 0 11em;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: calc(33.33333% - .6667em);
}

.two-img, .three-img, .four-img {
  margin: 3em 0;
}

#vid-block {
  width: 96%;
  margin: 3em auto;
  position:relative;
}

#vid-block.ht-social, #vid-block.bj-social, #vid-block.lct3-vid, #vid-block.audible-vid {
  width:100%;
}

#vid-block.ht-social #video {
  background-color: #f3e0ab;
  padding-bottom: 66.25%;
}

#vid-img {
  display:flex;
  gap: 1em;
}

#vid-img #vid-block {
  margin-bottom: 0;
}
#vid-img > #vid-block,
#vid-img > a {
  flex: 0 0 calc(50% - .5em);
  margin: 0;
}

.vid-back-btm {
  height: 40%;
  width: 40%;
  background-color: #fff41c;
  position: absolute;
  left: -1%;
  bottom: -1.75%;
  z-index: 0;
}

.vid-back-top {
  height: 40%;
  width: 40%;
  background-color: #fff41c;
  position: absolute;
  right: -1%;
  top: -1.75%;
  z-index: 0;
}

.two-vids .vid-back-top {
  top:-.75%;
}

.two-vids .vid-back-btm {
  bottom:-.75%;
}

#vid-img .vid-back-top {
  right:-2%;
}

#vid-img .vid-back-btm {
  left:-1.75%;
}


#video {
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: 0;
  padding-bottom: 56.25%;
  height: 0;
  z-index:2;
 }

 #video-half {
   display: block;
   position: relative;
   overflow: hidden;
   width: 48%;
   margin: 0;
   padding-bottom: 38.25%;
   height: 0;
   float:left;
   z-index:2;
 }

 .rbt #video-half {
   padding-bottom:27.25%;
 }
 .gtb #video-half {
  padding-bottom:20.25%;
}

 .bj-social #video-half {
   padding-bottom:36.25%;
 }
 .bj-social #video-half {
   padding-bottom:36.25%;
 }

 .audible-vid #video-half {
   padding-bottom:28.25%;
 }

 .audible-vid #video-half {
   background-color: #36577a;
 }

 #vid-block.rbt {
   width:100%;
 }

 #video-third {
   display: block;
   position: relative;
   overflow: hidden;
   width: 32%;
   margin: 0;
   padding-bottom: 32%;
   padding-top: 0%;
   height: 0;
   float: left;
   margin-right: 2%;
   z-index: 2;
 }

 #video-third.kb-vid {
   background-color: #c21b26;
 }

 #video-third:nth-of-type(3) {
   margin-right:0%;
 }

 #video-third iframe {
   width:100%;
 }

#video-third iframe > .vp-center {
   display:block!important;
 }

 .lct3-vid #video-third {
   padding-bottom:18%;
 }

 .marg-none {
   margin-right:0!important;
 }

 #vid-img #video {
   padding-bottom:100.25%;
 }

#video-half.wide {
  padding-bottom:29.25%;
}

 #video-half.vid-left {
   margin-right:2%;
 }

#video iframe, #video-half iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
 }

 .cs-slider, .cs-slider-more {
    margin: 0 auto;
 }

 .solution-gallery {
    position:relative;
    margin-bottom: 3em;
 }

 .solution-gallery .prev, .solution-gallery .next {
   position:absolute;
   z-index:7;
   color:#ee4799;
   font-weight:bold;
   font-size: 1.875em;
   top:43%;
 }

 .solution-gallery .prev {
   left:-4%;
 }

 .solution-gallery .next {
   right:-4%;
 }

 .solution-gallery .next:hover, .solution-gallery .slick:hover {
   cursor:pointer;
 }

 .slick-slide, .slick-slide a {
    outline: none
}

.fancybox-toolbar {
  display:none!important;
}

.radio-spot-btn {
  text-align:center;
  width:100%;
  display:block;
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-transform: uppercase;
  background-color: #f3e0ab;
  padding:.5em 0 .3em;
  margin:2.75% 0 2%;
  font-size:200%;
  color:#c50000;
}

.radio-spot-btn i {
  display:inline-block;
  font-size:80%;
  margin-left:5px;
  vertical-align: top;
}

.radio-spot-btn:hover, .radio-spot-btn.active {
  background-color: #c50000;
  color:#f3e0ab;
}

.audio-bars {
  width: 40px;
  display: inline-block;
  vertical-align: top;
}

.two-img a, .two-img > img, .two-img > div {
  width:49%;
  height:auto;
  float:left;
  display:block;
}

.two-img a:first-of-type, .two-img > img:first-of-type {
  margin-right:2%;
}

.three-img a, .three-img > img {
  width:32%;
  height:auto;
  float:left;
  display:block!important;
}

.three-img a:first-of-type, .three-img > img:first-of-type, .three-img a:nth-of-type(2), .three-img > img:nth-of-type(2) {
  margin-right:2%;
}

.three-img.marg-adjust a:first-of-type, .three-img.marg-adjust > img:first-of-type, .three-img.marg-adjust a:nth-of-type(2), .three-img.marg-adjust > img:nth-of-type(2) {
  margin-right:2%;
}

.pad-left {
  margin-left:0%;
}

.four-img a, .four-img > img {
  width:23.5%;
  height:auto;
  float:left;
  display:block!important;
}

.four-img a:first-of-type, .four-img > img:first-of-type, .four-img a:nth-of-type(2), .four-img > img:nth-of-type(2), .four-img a:nth-of-type(3), .four-img > img:nth-of-type(3) {
  margin-right:2%;
}

@media (min-width:768px) {
  .back-btn {
    margin: 0 auto 2.5em 0;
  }
  .yel-box {
    background-color: #fff41c;
    height:100%;
    width:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:-1;
  }
  .back-btn span.btn-text,
  .left-cs-nav span.btn-text,
  .right-cs-nav span.btn-text {
    display:block;
    z-index:2;
    margin-left: -.125em;
    display: inline-block;
    width: 100%;
  }

  .pad-top, .solution-gallery.pad-top {
    margin-top: 1.875em;
    display:block;
  }

  .solution-gallery.at-btm {
    width:100%;
  }

  .at-btm .cs-slider, .at-btm .cs-slider-more {
    margin-bottom:-5px;
  }
}

@media (max-width:767px) {
  .back-btn {
    position:absolute;
    top:36px;
    left:5%;
    z-index:11;
    width:110px;
    font-size:16px;
    top: -7em;
  }

  #vid-block {
    width:100%;
    margin:2% auto;
  }

  #vid-block.wide {
    margin-bottom:6%;
  }

  .pad-top {
    margin-top: 2em;
    display:block;
  }

  .solution-gallery .prev, .solution-gallery .next {
    display:none;
  }

  .cs-slider-more, .cs-slider {
    margin-bottom:2%;
  }

  .cs-slider + .next + .caption {
    margin-top: -2%;
  }

  .cs-slider {
    margin-top:2%;
  }

  .vid-back-btm {
    height: 50%;
    width: 50%;
    left: -2%;
    bottom: -3.5%;
    display:none;
  }

  .vid-back-top {
    height: 50%;
    width: 50%;
    right: -2%;
    top: -3.5%;
    z-index: -1;
    display:none;
  }

  .four-img a, .four-img > img {
    width: 49%;
    height: auto;
    float: left;
    display: block!important;
    margin-bottom:2%;
  }

  .four-img a:nth-of-type(2), .four-img > img:nth-of-type(2) {
    margin-right:0;
  }

  .lct3-vid #video-third {
    width:100%;
    float:none;
    padding-bottom:56%;
    margin-bottom:2%;
  }

  .lct3-vid #video-third:nth-of-type(3) {
    margin-bottom:0;
  }
}

@media (max-width:767px) {
  .back-top {
    bottom:70px;
    animation:arrow-bounce-sm 4s ease 0s infinite;
  }
  @keyframes arrow-bounce-sm {
    0% {
      bottom:70px;
    }
    25% {
      bottom:80px;
    }
    50% {
      bottom:70px;
    }
    75% {
      bottom:80px;
    }
    100% {
      bottom:7ß0px;
    }
  }
}

/*
CAREERS PAGE
 ----------------------------------------------------------------------------*/
#careers h3 {
  text-transform: capitalize;
}
#careers h4 {
  text-transform: uppercase;
}
#careers p {
  font-size: 1.25em;
  margin-top: 1.5em;
  color:#68515d;
}
#careers p a {
  color:#f04923;
}
#careers p a:hover {
  text-decoration: underline;
}
#listings h3 {
  font-family: 'Helvetica Neue LT W05_75 Bold';
  color: #f04923;
  border: 0;
  border-top: .1875em solid #e3e3e3;
  background: transparent;
  font-size: 1.375em;
}
#listings h4 {
  color:#68515d;
  font-size: 1.3rem;
  margin: 1.625em 0 0.625em;
}
#listings h5 {
  font-size:115%;
  color:#68515d;
  padding:20px 0 0;
}
#listings p {
  font-size:110%;
}
#listings ul {
  list-style-type: disc;
  color:#68515d;
  list-style-position: outside;
  margin-left: 2em;
  line-height: 1.5;
}
#listings ul li {
  margin-left:5px;
  margin:0;
  padding:0;
  font-size:110%;
}
#listings ul li ul {
    margin-left:40px;
}
#listings ul li ul li {
  font-size:100%;
}
#listings h3:first-of-type {
  border-top:0;
}
.ui-widget-content {
  border:0px;
  background:transparent;
}
#careers .ui-accordion h3.ui-accordion-header {
  padding: .875em .5em .5625em 2em;
  margin: 0;
  transition: background-color .4375s ease-out;
  background-color: #fff;
}
#careers .ui-accordion h3.ui-accordion-header.ui-state-hover {
  background-color: #fff41c;
  transition: background-color .25s ease-in;
}
.ui-accordion .ui-accordion-content {
  padding: 0 2.2em 25px;
}
.ui-icon {
  position: absolute; left: 1em;
  transform: translate(-50%);
  background-size: 25px;
  width: 17px;
  height: 25px;
  background-repeat: no-repeat;
  margin-top: -5px;
}
.ui-icon.icon-open {
  background-image: url(../_img/minus4.png);
}
.ui-icon.icon-closed {
  background-image: url(../_img/plus.png);
  background-position: -5px;
}

/*
TEAM PAGE
 ----------------------------------------------------------------------------*/
#team p {
  font-size: 1.25em;
  margin-top: 1.5em;
  color:#68515d;
}
.leader {
  width:49%;
  float:left;
  margin-bottom: 3%;
}
.leader:nth-of-type(1), .leader:nth-of-type(3) {
  margin-right:2%;
}
.leader-photo, .leader-bio {
  width:49%;
  float:left;
}
.leader-photo {
  margin-right:2%;
}
.leader-name {
  background-color: #f04923;
  color:#fff;
  padding:10px;
  font-family: alternate-gothic-no-2-d, sans-serif;
  font-size:150%;
  line-height:1;
}
.leader-name span {
  font-family: 'Helvetica Neue LT W05_75 Bold';
  font-size:55%;
  display:block;
}
.leader-blurb p {
  color:#696a6d;
  font-size:85%!important;
  margin-bottom:0;
}
.leader-bio {
  width:100%;
  float:none;
}
.leader-bio img {
  float:left;
  width:48%;
  margin-right:2%;
}
.leader-name {
  margin-left:0%;
  width:48%;
  float:left;
  margin-bottom:2%;
}
#leadership h2, #spotees h2 {
  font-size:170%;
  margin:0;
  padding:0;
}
#spotees {
  padding:2em 0 4em;
}
@media (min-width:1200px) {
  #team p {
    font-size:24px;
  }
  .leader-blurb p {
    font-size:16px!important;
  }
  .leader-name {
    font-size:30px;
  }
  .leader-name span {
    font-size:16px;
  }
}
@media (max-width:850px) {
  .leader {
    width:100%;
    float:none;
    margin-bottom:6%;
  }
  .leader-blurb p {
    font-size:16px!important;
  }
  .leader-name {
    font-size:32px;
    line-height:.9;
    float:none;
    width:100%;
  }
  .leader-name span {
    font-size:16px;
    line-height:1.1;
  }
  .leader .visible-xs {
    display:block!important;
  }
  .leader .hidden-xs {
    display:none!important;
  }
}

/*
ABOUT PAGE
 ----------------------------------------------------------------------------*/
.clients .container,
.past-clients .container {
  padding: 0;
}
#about p {
  font-size: 1.25em;
  margin: 0 auto 1em;
}
#work-grid {
  margin-bottom:3em;
}
#work-grid .row {
  overflow: hidden;
}
.left-sm, .right-sm {
  float:left;
  width:33%;
}
.right-big, .left-big {
  float:left;
  width:66%;
}
.tri {
  float:left;
  width:33%;
}
#home-read-more,
#home-more {
  transition: opacity .5s ease-in-out;
}
#home-read-more.hidden {
  opacity: 0;
  pointer-events: none;
  display: none;
}
#home-more {
  position: absolute;
  height: 0;
  overflow:hidden;
  opacity: 0;
  pointer-events: none;
}
#home-more.visible {
  position: relative;
  height: 100%;
  opacity: 1;
  pointer-events: all;
}
.more-btn {
  display:block;
  background-color: #efefef;
  color:#f04923;
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-transform: uppercase;
  padding: .375em 0 .275em;
  width: 9em;
  font-size: 1.125em;
  text-align:center;
  position:relative;
  margin: 0 0 0 auto;
  margin-top: .4375em;
  transition: color .4375s ease-out, background-color .4375s ease-out;
  cursor: pointer;
}
.more-btn:hover{
  color: #f04923;
  background-color: #fff41c;
  transition: color .25s ease-out, background-color .25s ease-out;
}
.arrow-right {
  width: 0; 
  height: 0; 
  border-top: .4375em solid transparent;
  border-bottom: .4375em solid transparent;
  border-left: .4375em solid #f04923;
  display: inline-block;
  vertical-align: text-top;
  vertical-align: middle;
  position: relative;
  top: -.077em;
  right: -.2em;
}
#institutions {
  margin-bottom:4em;
}
.hover-item {
	position: relative;
	display: inline-block;
	overflow: hidden;
	max-width: 100%;
	height: auto;
  margin-bottom:-4px;
}
.hover-item img {
	max-width: 100%;
}
.hover-item .text-layer {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: rgba(239, 73, 35, .95);
	color: #fff;
	padding: 15px;
	-moz-transition: all 0.2s ease-in-out 0s;
	-webkit-transition: all 0.2s ease-in-out 0s;
	-ms-transition: all 0.2s ease-in-out 0s;
	transition: all 0.2s ease-in-out 0s;
}
.hover-item:hover {
  cursor:pointer;
}
.hover-item:hover .text-layer,
.hover-item.active .text-layer {
	opacity: 1;
}
.hover-item .hover-text {
	text-align: center;
	font-weight:normal;
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
  opacity:1;
  -moz-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
  -moz-transition: all 0.5s ease-in-out 0s;
  -webkit-transition: all 0.5s ease-in-out 0s;
  -ms-transition: all 0.5s ease-in-out 0s;
  transition: all 0.5s ease-in-out 0s;
}
.hover-item:hover .hover-text h3 {
  opacity:1;
  -webkit-animation: rubberBand 1s ease-in-out .1s;
  animation: rubberBand 1s ease-in-out .1s;
}
#about .hover-text h3 {
  font-size:250%;
  font-family: alternate-gothic-no-2-d, sans-serif;
}
#about .hover-text p {
  font-size:100%;
}
.micetype {
  font-size:12px;
  color:#68515d;
  text-align:center;
  margin:0 0 5px;
  line-height:1.1;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}
@media (min-width:768px) {
  .bw-inst {
    width:33%;
    float:left;
    display:block;
  }
}

@media (max-width:767px) {
  .bw-inst {
    width:50%;
    float:left;
    display:block;
  }
  #work-grid .row {
    overflow: visible;
  }
  #work-grid img {
    width:100%;
    float:left;
  }
  .left-sm, .left-big, .right-sm, .right-big, .tri {
    width:50%;
    float:left;
  }
  .hover-item {
    max-width:100%;
    float:none;
  }
}
@media (min-width:1200px) {
  #about .hover-text h3 {
    font-size:56px;
  }
}
.flex-book{
  padding: 0;
  align-items: flex-start;
}

/*
 ALL WORK PAGE
 ----------------------------------------------------------------------------*/

section#all-work {
  width:100%;
  max-width:none;
}
#all-work .container {
  max-width: 100em;
}
#all-work p {
  text-align:center;
  font-size: 1.5em;
  line-height:1.2;
  font-family:'Helvetica Neue LT W05_75 Bold';
  padding-bottom:.5em;
}
@media (min-width: 533px) {
  #all-work p {
    font-size: 1.75em;
  }
}
.work-tile {
  flex: 0 1 33.333%;
  background-color: #111;
  opacity: 0;
  transition: opacity .5s ease-out;
}
@media (min-width: 1140px) {
  .work-tile {
    flex: 0 1 25%;
  }
}
@media (min-width: 1600px) {
  .work-tile {
    flex: 0 1 20%;
  }
}/*
@media (min-width: 2100px) {
  .work-tile {
    flex: 0 1 16.666%;
  }
}*/
@media (max-width: 659px) {
  .work-tile {
    flex: 0 1 50%;
  }
}
@media (max-width: 390px) {
  .work-tile {
    flex: 0 1 100%;
  }
}
.work-tile.show {
  opacity: 1;
}
.work-grid {
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-content: center;
  justify-content: center;
  position: relative;
  max-width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  gap: 0;
  filter: saturate(0.875) brightness(0.9375) contrast(1.1);
  background-color: #efefef;
} @media (max-width:532px) {
  .work-grid {
    max-width: 100%;
  }
}
#content.space-fix {
  padding:0;
}
#more-clients {
  display:none;
}
#more-clients.active {
  display:block;
}

.more-btn {
  margin: 0 auto;
  width: 9em;
  font-size: 1.5em;
}
body.clients .more-btn:first-of-type,
body.past-clients .more-btn:first-of-type,
body.services .more-btn:first-of-type,
body.about .more-btn:first-of-type {
  margin: 3em auto .875em;
}

/*
 HOMEPAGE
 ----------------------------------------------------------------------------*/
.counter {
  position:relative;
}

.count-number {
  color: #ee4799;
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-align:center;
  font-size:500%;
  margin:0 0 -10px 0;
  padding:0;
  /*text-shadow:4px 4px 0 #fff41c;*/
  mix-blend-mode: multiply;
  position:relative;
  z-index:2;
}

.count-number-shadow {
  position:absolute;
  color: #fff41c;
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-align:center;
  font-size:500%;
  margin:0 auto -10px auto;
  padding:0 0 0 8px;
  top:5px;
  left:0;
  right:0;
  z-index:1;
}

.brands .count-number-shadow {
  padding:0 0 0 4px;
}

#plus {
  display: inline-block;
  position: relative;
}

.plus {
  color: #ee4799;
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-align:center;
  font-size:340%;
  margin:0 0 -10px 0;
  padding:0;
  display:inline-block;
  vertical-align:super;
  z-index:2;
  position:relative;
  mix-blend-mode: multiply;
}

.plus-shadow {
  color: #fff41c;
  font-family: alternate-gothic-no-2-d, sans-serif;
  text-align:center;
  font-size:340%;
  margin:0 0 -10px 0;
  padding:0;
  display:inline-block;
  vertical-align:super;
  position:absolute;
  top:5px;
  left:5px;
  z-index:1;
}

.comma {
  font-size:50%;
}

.wrap-count {
  text-align:center;
  display: inline-block;
  position: relative;
}

.wrap-count .count-number {
  display:inline-block;
}

p.count-text {
  font-family: alternate-gothic-no-2-d, sans-serif;
  font-size:90%;
  text-align:center;
  letter-spacing:.05em;
  line-height:1;
  color:#68515d;
  margin: 0;
}

.count-text sup {
  font-size:50%;
  vertical-align: super;
}

.home #case-studies {
  margin-top:4em;
}

.home #content {
  padding-top: 5.25em;
}

.home .hero {
  padding-top:4.5em;
}

.home .case-study-grid {
  margin-bottom:1em;
}

#blurb p {
  font-size: 1.25em;
  margin-top: 1.5em;
}

.home #clients .more-btn {
  margin-right: 0;
  margin-top: 1em;
}

#clients .row {
  padding:0em 0 .5em;
}

.clients-slides .slick-slide {
  opacity: 1;
}

section#counters {
  padding: 0;
  margin: 2em auto;
}

@media (max-width:767px) {

  .count-number, .count-number-shadow {
    font-size:600%;
  }

  .count-number-shadow {
    top:17px;
  }

  .plus, .plus-shadow {
    font-size:400%;
  }

  .count-text {
    font-size:16px;
    margin-top:5px;
    padding:0;
  }

  .counter {
    padding:1em 0;
  }

  .home #case-studies {
    margin-top:2em;
  }

  .home .hero {
    padding-top:7em;
  }

  #clients .col-sm-3 {
    width:50%!important;
    float:left;
    padding:0 0 1em;
  }

  #clients .row {
    padding:0em;
  }

  #clients h1, #case-studies h1 {
    font-size:250%;
  }
}

/*
 UPGRADE PAGE
 ----------------------------------------------------------------------------*/
#upgd_content {
}

#upgd_content .msgbox {
  width: 940px;
  margin: 20px auto;
  padding: 10px;
}

/* =============================================================================
 MEDIA QUERIES
 ========================================================================== */
/* Extra Small Devices */
@media (max-width: 767px) {
  #opt-in-form input {
    display: block;
    margin: 0 auto;
    margin-bottom: 5px;
  }
}

/* Small Devices */
@media (min-width: 768px) and (max-width: 991px) {
}

/* Medium Screens/Desktops */
@media (min-width: 992px) and (max-width: 1199px) {
}

/* Large Screens/Desktops */
@media (min-width: 1200px) {
}