/*
Theme Name: Obscura Digital
Description: Custom child theme of Salient for Obscura Digital
Author: Michael Clement
Template: salient
Version: 3.0
*/

/* LIGHT THEME VARIATION */
body .col.light a {
  color: #AAA !important;
}
body .col.light a:hover {
  color: #fff !important;
}
.blog-grid .container-wrap {
  background-color: #e4e4e4;
}
body .container-wrap {
  background-color: #fff !important;
}


/* TYPOGRAPHY ************************************************************** */
html {
  font-size: 62.5%;
}
#page-header-bg .subheader {
    font-family: "Benton Sans Bk", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
    font-size: 3.4rem;
    /* letter-spacing: 2px; */
    line-height: 46px;
    margin-top: -8px;
    display: block;
}
body, .nectar-button {
  font-family: "Benton Sans", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
}
#page-header-bg h1, body h1, article .post-header h1, article.post.quote .post-content h1, article.link .post-content h1, article.format-status .post-content h1, #call-to-action span, .woocommerce .full-width-tabs #reviews h3, .row .col.section-title h1
{
  font-family: "Benton Sans Bk", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  font-size: 3.4rem;
}
#page-header-bg h2, body h2, article .post-header h2, article.quote .post-content h2, article.link .post-content h2, article.format-status .post-content h2, #call-to-action span, .woocommerce .full-width-tabs #reviews h3, .row .col.section-title h2
{
  font-family: "Benton Sans Med", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  font-size: 2.0rem;
  text-transform: uppercase;
}
#page-header-bg h3, body h3, article .post-header h3, article.quote .post-content h3, article.link .post-content h3, article.format-status .post-content h3, #call-to-action span, .woocommerce .full-width-tabs #reviews h3, .row .col.section-title h3
{
  font-family: "Benton Sans Bk", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  font-size: 20px;
  line-height: 30px;
  font-weight: normal !important;
}
#page-header-bg h4, body h4, article .post-header h4, article.quote .post-content h4, article.link .post-content h4, article.format-status .post-content h4, #call-to-action span, .woocommerce .full-width-tabs #reviews h3, .row .col.section-title h4
{
  font-family: "Benton Sans Bk", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  font-size: 18px !important;
  line-height: 28px !important;
  font-weight: normal !important;
}
#page-header-bg h5, body h5, article .post-header h5, article.quote .post-content h5, article.link .post-content h5, article.format-status .post-content h5, #call-to-action span, .woocommerce .full-width-tabs #reviews h3, .row .col.section-title h5
{
  font-family: "Benton Sans Bk", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  font-size: 1.6rem;
  letter-spacing: 0 !important;
}




/* SIDEBAR ************************************************************** */
#sidebar .widget_twitter ul li {
  margin-bottom: 1em !important;
}
#sidebar .widget_twitter ul li a {
  display: inline !important;
}
#sidebar .textwidget p {
  padding-bottom: 0.5em;
}
#sidebar > .widget {
  background-color: #eee;
  padding: 0 1em;
  margin-bottom: 2em;
}
#sidebar .widget_instagram_recent_media ul {
  text-align: center;
}

/* HEADERS ************************************************************** */
@media only screen and (max-width: 690px) {
  #page-header-bg .container h1,
  #page-header-bg .span_6 span.subheader {
    font-size: 18px !important;
    line-height: 28px !important;
    letter-spacing: 2px;
    margin-top: 0;
  }
}
@media only screen and (min-width: 691px) {
  #page-header-bg .container h1,
  #page-header-bg .span_6 span.subheader {
    font-size: 30px !important;
  }
}

/* WORK - PORTFOLIO ************************************************************** */
body.single-portfolio .container-wrap {
  background-color: #000 !important;
}

.single-portfolio .bottom_controls {
  background-color: #f6f6f6 !important;
}

#portfolio {
  background-color: #000000 !important;
}
#portfolio-extra .light a {
  color: #fff !important;
}
#portfolio-extra .light div[data-has-bg-color="false"] a {
  color: #000 !important;
}
#portfolio-extra .light div[data-has-bg-color="false"] a:hover {
  text-decoration: underline;
}

.width-constrain-12col,
body .container .portfolio-filters-inline.full-width-content .container {
  max-width: 1245px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.portfolio-items .col {
  background: transparent !important;
}

#portfolio-extra .light div[data-has-bg-color="false"] a:hover {
  text-decoration: none;
}

.single-portfolio #header-space {
  background-color: #f6f6f6;
}

@media only screen and (min-width: 990px) {
  #portfolio.portfolio-items[data-col-num="elastic"] .col .work-item {
    height: 28.12vw;
    overflow: hidden;
  }
  #portfolio.portfolio-items[data-col-num="elastic"] .col .work-item img {
    /* fix rounding error gap below images */
    width: 101% !important;
    max-width: 101% !important;
  }
  #portfolio.portfolio-items .col.elastic-portfolio-item.wide_tall,
  #portfolio.portfolio-items .col.elastic-portfolio-item.wide {
      width: 49.9% !important;
  }
  #portfolio.portfolio-items .elastic-portfolio-item {
    width: 49.9% !important;
  }
  body .portfolio-items .col[data-default-color="true"] .work-item:not(.style-3) .work-info-bg {
    background-color: rgba(0,0,0,0.6) !important;
  }
}


/* SERVICES ************************************************************** */
.nectar-fancy-ul ul li .icon-default-style[class^="icon-"] {
  padding-top: 4px;
}
.process-description {
  max-width: 200px;
  margin-left: auto;
  margin-right: auto;
}
#services-intro {

}
#services-intro > .col {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  /* width: 82%; */
}
#services-intro .column_container {
  /* width: auto; */
  margin-left: 0;
  margin-right: 5%;
}
#services-intro .services-intro-phase {
  display: inline-block;
  /* width: 160px; */
  width: 100%;
  /* height: 160px; */
  height: 0;
  background-color: #000;
  border-radius: 50%;
  padding: 10%;
  padding-top: 90%;

  font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
  color: #fff;
  text-align: center;
  top: 25%;
  transform: translate(0, 25%);

}
#services-intro .services-intro-phase > .wpb_wrapper {
  transform: translate(0, -133%);
}

#services-intro .services-intro-phase p:first-child {
  padding: 2px 0 4px;
  font-size: 50px;
  line-height: 50px;
  margin-top: -12px;
}
#services-intro .services-intro-phase.last p:first-child {
  padding: 7px 0 4px;
}
#services-intro .services-intro-phase p:last-child {
  padding-top: 4px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
#services-intro .services-intro-phase hr {
  color: #808080;
  background-color: #808080;
  border-color: #808080;
}
#services-intro .img-with-aniamtion-wrap {
  /*
  display: inline-block;
  vertical-align: top;
  padding: 80px 10px 0 10px;
  */
  display: block;
  transform: translate(66%, -1060%);
}
#services-intro .img-with-aniamtion-wrap img {
  display: block;
}
#services-intro .wpb_column.has-animation[data-animation="grow-in"] {
  opacity: 0; /* start at 0 */
  transition: opacity 400ms ease-in-out;
}

@media only screen and (min-width: 691px) {
  #services-intro .wpb_column.has-animation[data-animation="grow-in"] .wpb_content_element .wpb_wrapper {
    opacity: 0;
  }
  #services-intro div.has-animation:nth-of-type(1) .wpb_content_element .wpb_wrapper {
    animation-delay: 400ms;
    -webkit-animation-delay: 400ms;
  }
  #services-intro div.has-animation:nth-of-type(2) .wpb_content_element .wpb_wrapper {
    animation-delay: 800ms;
    -webkit-animation-delay: 800ms;
  }
  #services-intro div.has-animation:nth-of-type(3) .wpb_content_element .wpb_wrapper {
    animation-delay: 1200ms;
    -webkit-animation-delay: 1200ms;
  }
  #services-intro div.has-animation:nth-of-type(4) .wpb_content_element .wpb_wrapper {
    animation-delay: 1600ms;
    -webkit-animation-delay: 1600ms;
  }
  #services-intro div.has-animation:nth-of-type(5) .wpb_content_element .wpb_wrapper {
    animation-delay: 2000ms;
    -webkit-animation-delay: 2000ms;
  }
  #services-intro .wpb_column.has-animation.animated-in[data-animation="grow-in"] .wpb_content_element .wpb_wrapper {
    animation-name: fadein;
    -webkit-animation-name: fadein;
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
  }
}
@keyframes fadein {
  0%   {opacity: 0;}
  50%   {opacity: 0;}
  100%   {opacity: 1;}
}
@-webkit-keyframes fadein {
  0%   {opacity: 0;}
  50%   {opacity: 0;}
  100%   {opacity: 1;}
}



/* SERVICES PHASES **************************************************************  */
.services-phase {
  margin-bottom: 480px;
  z-index: auto;
}
.services-phase > .col {
  display: flex;
  justify-content: center;
  height: 480px;
}
.services-phase .services-phase-images {
  align-self: center;
  height: 480px;
  overflow: hidden;
  position: relative;
}
.services-phase .services-phase-images > .wpb_wrapper {
  position: absolute;
  top: 20%; /* animated by scrollmagic 0 -> -66% */
  left: 0;
  right: 0;
  width: 460px;
}
.services-phase .services-phase-images > .wpb_wrapper img {
  border-bottom: 1px solid #d6d6d6;
}


.services-phase .services-phase-number {
    align-self: center;
    padding: 0 2.5%;
}
.services-phase .services-phase-number .wpb_content_element {
  background: url(/wp-content/uploads/2016/06/services_big_bubble.png) 50% 50% no-repeat;
  color: #fff;
  text-align: center;
  background-size: contain;
  height: auto;
  padding-top: 100%;
  width: 100%;
  font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
  position: relative;
  transform: scale(0, 0); /* animated by scrollmagic 0 -> 100%  */
}
.services-phase .services-phase-number .wpb_content_element .wpb_wrapper {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  width: 100%;
  padding: 0 10%;
  opacity: 1; /* animated by scrollmagic   */
  transition: opacity 400ms ease-in-out;
}
.services-phase.active .services-phase-number .wpb_content_element .wpb_wrapper {
  opacity: 0; /* animated by scrollmagic  */
  transition: opacity 400ms ease-in-out;
}

.services-phase .services-phase-number .wpb_content_element .wpb_wrapper p:first-child {
  padding-top: 12px;
  padding-bottom: 12px;
  font-size: 86px;
  line-height: 86px;
}
.services-phase .services-phase-number .wpb_content_element .wpb_wrapper p:last-child {
  padding-top: 20px;
  padding-bottom: 66px;
  font-size: 26px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.services-phase .services-phase-number .wpb_content_element .wpb_wrapper hr {
  color: #fff;
  background-color: #fff;
  border-color: #fff;
}
.services-phase .services-phase-number > .wpb_wrapper {

}
.services-phase .services-phase-number > .wpb_wrapper .img-with-aniamtion-wrap {
  position: absolute;
  left: 50%;
  bottom: -45%;
}
.services-phase .services-phase-number > .wpb_wrapper .img-with-aniamtion-wrap img {
  transform: translate(0,-50%) scale(0.7, 0); /* animated by scrollmagic 100% -> 0% */
  top: 50%;
}

.services-phase .services-phase-description {
  align-self: center;
}
.services-phase .services-phase-description > .wpb_wrapper {
  padding-top: 100%; /* animated by scrollmagic 100% -> 0% */
}

/* SERVICES - MOBILE **************************************************************  */
@media only screen and (max-width: 1000px) {
  #services-intro {
    padding-top: 0;
  }
  #services-intro .services-intro-phase {
    margin-left: 25%;
    top: auto;
    transform: none;
    display: block;
  }
  #services-intro .services-intro-phase > .wpb_wrapper {
    transform: translate(0, -150%);
  }
  #services-intro .services-intro-phase p:first-child {
    margin-top: 0;
  }
  #services-intro .img-with-aniamtion-wrap {
    display: none;
  }
  .services-phase > .col {
    display: block;
    height: auto;
  }
  .services-phase .services-phase-number .wpb_content_element {
    transform: scale(1, 1); /* not animated by scrollmagic on mobile */
  }
  .services-phase .services-phase-description > .wpb_wrapper {
    padding-top: 15%; /* not animated by scrollmagic on mobile */
    margin-bottom: 5%; /* not animated by scrollmagic on mobile */
  }
 .services-phase .services-phase-number > .wpb_wrapper .img-with-aniamtion-wrap {
    display: none; /* not showm or animated by scrollmagic on mobile */
  }
  .services-phase .services-phase-number .wpb_content_element .wpb_wrapper {
    opacity: 1; /* not animated by scrollmagic on mobile */
  }


  #services-intro > .col {
    width: 100%;
  }
  #services-intro .column_container {
    width: 67%;
    margin-left: 0;
    margin-right: 0;
  }
  .services-phase .services-phase-images > .wpb_wrapper {
    width: auto;
  }
}
@media only screen and (min-width: 1001px) and (max-width: 1280px) {
  #services-intro .services-intro-phase > .wpb_wrapper{
    transform: translate(0,-100%) scale(0.7,0.7);
  }
  #services-intro .img-with-aniamtion-wrap {
    transform: translate(66%, -970%);
  }
}


/* JOBS ************************************************************** */
#job-listings .toggle .wpb_content_element p,
#job-listings .toggle .wpb_content_element ul,
#job-listings .toggle .wpb_content_element a {
  font-size: 16px !important;
  line-height: 1.2;
  margin-bottom: 1.2em;
  padding-bottom: 0;
}
#job-listings .toggle h3,
#job-listings .toggle h3 a,
#job-listings .toggle h3 a i {
  font-size: 26px !important;
  line-height: 1.4 !important;
}
#job-listings .toggle h3 a i {
  padding-top: 2px;
}
#job-listings .toggle > div {
  padding: 20px 28px;
}
#job-listings .toggle {
  margin-bottom: 30px !important;
}


/* TOP NAV ************************************************************** */
header#top nav > ul > li > a {
  font-family: "Benton Sans", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 2px;
}

header#top {
  transition: all 0.33s ease-in-out;
  padding: 25px 0;
}

.single-portfolio .shrunken header#top {
  padding: 4px 0 0 0;
}

header#top ul.sf-menu {
  padding-top: 2px;
}

/* SUBNAV */
.submenu-row {
  margin-left: -15%;
  margin-right: -15%;
  margin-bottom: 0 !important;
}
.submenu {
  height: 50px;
  overflow: hidden;
  z-index: 9998;
  width: 100%;
  background: #252525;
}
.submenu .inner {
  margin: 0 auto;
  text-align: center;
}
.submenu a {
  display: inline-block;
  width: 24.75%;
  text-align: center;
  text-decoration: none;
  font-size: 20px;
  text-transform: uppercase;
  padding: 14px 20px 15px 20px;
  border-left: 1px solid #333;
}
.submenu a:first-child {
  /* border-left: none; */
}
body .submenu a:hover,
body .submenu .current {
  color: #fff !important;
  background-color: #333;
}


/* WORK FILTERS ************************************************************** */
@media only screen and (min-width : 690px) {

    body .portfolio-filters-inline.full-width-content {
      padding: 0 !important;
      width: 100vw !important;
    }
    .portfolio-filters-inline #current-category {
      display: none !important;
    }
    body .container-wrap .container .portfolio-filters-inline.full-width-content .container {
      padding: 0 !important;
    }
    body .portfolio-filters-inline .container > ul,
    body .subnav-inline .container > ul {
      margin: 0 auto !important;
      float: none !important;
      max-width: 100% !important;
    }

    body .portfolio-filters-inline .container > ul li a {
      display: block;
      float: right;
      width: 33%;
      text-align: center;
      font-size: 22px;
      text-transform: uppercase;
      margin-top: 0 !important;
      margin-bottom: 0 !important;
      padding-top: 22px !important;
      padding-bottom: 22px !important;
      border-right: 1px solid #333;
      /*
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
      transition: all 0.3s ease;
      */
    }
    body .portfolio-filters-inline .container > ul > li:first-child a {
      border-right: 1px solid #333 !important;
    }
    body .portfolio-filters-inline .container > ul > li:last-child a {
      width: 34%;
      border-left: 1px solid #333 !important;
      border-right: 1px solid #333 !important;
    }
    body .portfolio-filters-inline .container > ul li a[data-filter="*"] {
      display: none;
    }
    body .portfolio-filters-inline .container > ul li a:hover,
    body .portfolio-filters-inline .container > ul li a.active {
      background-color: #333;
      margin-top: 0 !important;
      margin-bottom: 0 !important;
      /* font-size: 20px;
      padding-top: 14px !important; */
    }
    body .portfolio-filters-inline .container > ul li a span {
      display: block;
      font-weight: normal;
      font-size: 11px;
      padding-top: 6px;
      visibility: hidden;
      min-height: 16px;
      height: 16px;
      text-transform: none;
    }
    body .portfolio-filters-inline .container > ul li a span,
    body .portfolio-filters-inline .container > ul li a:hover span {
      visibility: hidden;
    }
    body .portfolio-filters-inline .container > ul li a.active span {
      visibility: visible;
    }
    body .portfolio-filters-inline .container > ul li a:hover span strong,
    body .portfolio-filters-inline .container > ul li a.active span strong {
      visibility: visible;
      font-weight: normal;
      font-size: 12px;
      display: block;
    }
    body .portfolio-filters-inline .container > ul li a:hover span,
    body .portfolio-filters-inline .container > ul li a.active span {
      visibility: hidden;
    }

    body .container .portfolio-filters-inline.nder-page-header.first-section {
      padding-top: 0 !important;
    }
}




/* FOOTER CUSTOMIZATION ************************************************************** */
#footer-outer {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}
#footer-widgets {
  display: none !important;
}
#footer-outer {
  background: url('/wp-content/uploads/2015/09/Obscura_Light_Footer_Small1.png') no-repeat center top;
  padding-top: 86px !important;
}
#footer-outer #copyright {
  font-size: 11px;
}
#footer-outer #copyright a {
  color: #777 !important;
}
#footer-outer #copyright a:hover,
#footer-outer #copyright .col li a i:hover {
  color: #AAA !important;
}
#footer-outer #social {
  padding-top: 10px;
}
#footer-outer #social i {
  font-size: 24px;
}
#footer-outer #social li {
  width: auto !important;
  margin-right: 16px;
}

/* NEWS CUSTOMIZATION ************************************************************** */
/*
article.news {
  padding-bottom: 20px;
  border-bottom: 1px solid #ccc;
}
article.news:hover {
    background-color: #eee;
}
article.news.sticky {
    background-color: #e0e0e0;
}
article.news.sticky::before {
    content: 'FEATURED';
    padding-top: 0.5em;
    text-align: center;
    display: block;
}
article.news .post-content {
  overflow: hidden;
  padding-left: 20px;
  padding-top: 20px;
}
article.news .post-content-detail {
  float: left;
  width: 95%;
}
article.news.has-post-thumbnail .post-content-detail {
  width: 75%;
}
article.news .source_logo {
  float: left;
}
article.news .source_logo img {
  width: 40px;
  height: 40px;
  margin-bottom: 0;
  margin-right: 1em;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.6;
}
article.news .source_publication {
  float: left;
}
article.news .source_publication span {
  padding: 0 0.5em 0 0;
  font-size: 20px;
  line-height: 40px;
  text-transform: uppercase;
}
article.news .date {
  padding: 0 0.5em 0 0;
  float: left;
  font-size: 16px;
  line-height: 40px;
}
article.news .post-header {
  float: left;
  clear: left;
  margin-bottom: 0;
  display: block;
}
article.news .title {
  text-transform: none !important;
  color: #222;
  float: left;
  font-size: 22px;
  line-height: 1.1;
}
article.news .post-thumbnail {
  float: right;
  width: 25%;
  overflow: hidden;
}
article.news .post-thumbnail img.wp-post-image {
  margin-bottom: 0;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
article.news .post-featured-img {
  padding: 20px 0 20px 20px;
}
article.news .article-content-wrap {
  clear: left;
  float: left;
}
article.news .excerpt {
  margin-bottom: 0.5em;
}
article.news .source-link {
  padding-left: 1.5em;
}
article.news.sticky {
  margin-bottom: 0;
}
.post-type-archive-news .section-title {
  display: none !important;
}

.meta-date {
  padding-left: 0 !important;
  border-left: 0 !important;
}
#post-area #pagination {
  padding-left: 0 !important;
  margin-top: 2em;
}
@media only screen and (max-width: 690px) {
  article.news .post-thumbnail { display: none; }
  article.news.has-post-thumbnail .post-content-detail { width: 100%; }
}
*/

.meta-author,
.meta-category,
.meta-comment-count
{
  display: none !important;
}

/* HOME PAGE ************************************************************** */
.swiper-slide .content h2 {
   font-size: 15px !important;
   margin-bottom: 5px !important;
}
.swiper-slide .content p {
   font-size: 48px !important;
   margin-left: -4px !important;
}
.swiper-slide .content p.transparent-bg span {
  left: 0 !important;
}
.swiper-slide .content .buttons {
   font-size: 15px !important;
}
.swiper-slide .button {
  padding-top: 15px !important;
}
.swiper-container .slider-prev > i,
.swiper-container .slider-next > i {
  font-size: 40px !important;
}
.swiper-container .slider-next > i {
  right: 33px !important;
}
body.home .nectar-slider-loading {
  background-repeat: no-repeat;
  background-image: url('/wp-content/uploads/2016/02/vatican_carousel_V4.jpg');
  background-size: cover;
}
.nectar-slider-loading.default-loader .loading-icon span {
  background-color: transparent !important;
}


/* ABOUT - PHOTOBOOTH ************************************************************** */
@media only screen and (min-width: 691px) {
  #about-copy > .col .vc_col-sm-6:last-child {
    width: 47%;
    margin-left: 5%;
  }
  #about-copy > .col .vc_col-sm-6:first-child {
    width: 47%;
  }
}

  #about-copy > .col .vc_col-sm-6 h3,
  #about-copy > .col .vc_col-sm-6 h4 {
    letter-spacing: 2px;
    font-size: 18px;
  }

  #photobooth-wrapper {
    margin-bottom: 0 !important;
  }
  #photobooth-row {
    /* border-bottom: 4em solid #000; */
    position: relative;
    z-index: 0;
  }
  .team-photobooth {
    width: 100vw;
    height: 246px;
    overflow: hidden;
    background-color: #000;
    margin-bottom: 0 !important;
    position: relative;
  }
  .team-photobooth .person {
    width: 200px;
    height: 246px;
    overflow: hidden;
    background-position: 0 0;
    background-repeat: no-repeat;
    float: left;
    background-color: #000;
  }
  .team-photobooth .person.active {
    /* -webkit-animation: photobooth 400ms linear infinite; */
    animation: photobooth 400ms linear infinite;
  }
  @keyframes photobooth {
      0%     { background-position: 0 0; }
      24.99% { background-position: 0 0; }
      25%    { background-position: 0 -246px; }
      49.99% { background-position: 0 -246px; }
      50%    { background-position: 0 -492px; }
      74.99% { background-position: 0 -492px; }
      75%    { background-position: 0 -738px; }
      99.99% { background-position: 0 -738px; }
  }


/* CONTACT ************************************************************** */
.contact-narrow-width {
  max-width: 1020px;
  margin-left: auto;
  margin-right: auto;
}
.contact-narrow-width .divider-small-border {
  margin-left: auto;
  margin-right: auto;
}
#contact-form-wrapper .onethird {
  width: 33%;
  display: inline-block;
  padding-right: 2.5%;
}
#contact-form-wrapper .onethird:last-child {
  padding-right: 0;
}
#contact-email-addresses > .col > .one-fourths:first-child {
  margin-left: -4% !important;
}
#contact-email-addresses > .col > .one-fourths {
  margin-left: 3%;
}
#contact-email-addresses > .col > .one-fourths:last-child {
  margin-left: 4.3% !important;
}
#contact-email-addresses h2 {
  white-space: nowrap;
  font-size: 13px;
}
.wpcf7-recaptcha {
  margin-top: 2em;
}
/* CONTACT - MOBILE */
@media only screen and (max-width: 690px) {
  #contact-form-wrapper .onethird {
    width: auto;
    padding-bottom: 2em;
  }
  .main-content #contact-email-addresses > .col > .one-fourths {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}




/*  PROGRESS MAP ************************************************************** */
.codespacing_progress_map_area {
  max-width: 1020px;
  margin: 0 auto;
}
.static-map-bg {
  min-height: 300px !important;
}
.static-map-bg .wpb_wrapper,
.static-map-bg .wpb_content_element {
  height: 100%;
}
.static-map-bg a {
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
#nprogress .spinner-icon {
  border-top-color: #7f7f7f !important;
  border-left-color: #7f7f7f !important;
}
#nprogress .bar {
  background: #7f7f7f !important;
}
.blue_cloud{
  box-shadow: 6px 0px 0px 0px rgba(127,127,127,1),
              12px 0px 0px 0px rgba(127,127,127,1),
              18px 0px 0px 0px rgba(127,127,127,1),
              24px 0px 0px 0px rgba(127,127,127,1),
              30px 0px 0px 0px rgba(127,127,127,1),
              36px 0px 0px 0px rgba(127,127,127,1) !important;
}
.blue_cloud:after{
  background-color: rgba(127,127,127,1) !important;
}
@keyframes cspm_blue_rain {
  0%{
   box-shadow: 6px 0px 0px 0px rgba(127,127,127,1),
              12px 0px 0px 0px rgba(127,127,127,0.9),
              18px 0px 0px 0px rgba(127,127,127,0.7),
              24px 0px 0px 0px rgba(127,127,127,0.6),
              30px 0px 0px 0px rgba(127,127,127,0.3),
              36px 0px 0px 0px rgba(127,127,127,0.2) !important;
  }
  100%{
  box-shadow: 6px 0px 0px 0px rgba(127,127,127,0.2),
              12px 0px 0px 0px rgba(127,127,127,0.3),
              18px 0px 0px 0px rgba(127,127,127,0.6),
              24px 0px 0px 0px rgba(127,127,127,0.7),
              30px 0px 0px 0px rgba(127,127,127,0.9),
              36px 0px 0px 0px rgba(127,127,127,1) !important;
      opacity: 1;
  }
}

/* BUTTONS ************************************************************** */
.obscura.buttons {
  font-size: 15px;
  position: relative;
  letter-spacing: 0.5px;
  -webkit-font-smoothing: antialiased;
}
  .obscura.buttons .button {
    padding: 15px 0 0 0 !important;
    display: inline-block;
    margin: 0;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    -webkit-border-radius: 2px;
  }
  .obscura.buttons .button a {
    padding: 10px 15px 8px 15px !important;
    box-shadow: none !important;
    background-color: transparent !important;
    border: 2px solid rgba(255,255,255,0.7);
    color: #AAA !important;
  }
  .obscura.buttons .button a:hover {
    color: #fff !important;
  }




/* BLOG CATEGORIES ******************************************************* */
.blog-category-nav {
  clear: both;
  overflow: hidden;
  background-color: #000;
  font-size: 16px;
}

.blog-category-nav ul {
  list-style-type: none;
  text-transform: uppercase;
  color: #ccc;
  overflow: hidden;
  float: left;
}
  .blog-category-nav ul li {
    float: left;
    display: block;
    padding: 12px 20px 10px 0;
  }
  .blog-category-nav ul li:first-child {
    border-right: 1px solid #ccc;
    font-weight: bold;
    margin-right: 20px;
  }
  .blog-category-nav ul li:first-child a,
  .blog-category-nav ul li:first-child a:hover {
    color: #fff !important;
  }
  .blog-category-nav a {
    color: #ccc;
  }
  .blog-category-nav .current-cat a {
    font-weight: bold;
    color: #fff;
  }

  .blog-category-nav .right-links {
    float: right;
    color: #ccc;
    text-transform: uppercase;
  }
  .blog-category-nav .right-links a {
    color: #ccc;
    padding: 12px 0 0 20px;
    display: inline-block;
  }
  .blog-category-nav #subscribe-button {
    vertical-align: 5px;
  }
  .blog-category-nav .hide {
    display: none;
  }


/* BLOG GRID ******************************************************* */
  .blog-grid .posts-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: stretch;
    margin-left: -15px;
  }

  .blog-grid article {
    width: 32%;
    margin-bottom: 15px !important;
    background-color: #eee;
    margin-left: 1.33%;
  }

  .blog-grid .posts-container article.sticky:first-child,
  .blog-grid .posts-container article.category-sticky:first-child {
    width: 100%;
    margin-right: 0;
    max-height: none;
    height: auto;
  }

  .blog-grid .posts-container article .inner-wrap {
    height: auto !important;
  }
  .blog-grid .post-content {
    padding-left: 0;
  }
  .blog-grid .post-content .post-meta {
    display: none !important;
  }
  .blog-grid .content-inner {
    box-shadow: none !important;
    background: #eee;
    color: #666;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }
  .sticky .content-inner {
    box-shadow: none !important;
  }

  /*
  .blog-grid article:not(.sticky):not(.category-sticky)  .content-inner {
    height: 288px;
    max-height: 288px;
    min-height: 288px;
  }
  */

  .blog-grid .content-inner .title {
    text-transform: none;
    letter-spacing: normal;
    font-size: 14px !important;
    line-height: 1.3;
    font-family: "Benton Sans Med", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  }
  .blog-grid .posts-container article.sticky:first-child .content-inner .title,
  .blog-grid .posts-container article.category-sticky:first-child .content-inner .title {
    font-size: 22px !important;
  }
  .blog-grid .content-inner a {
    color: #666;
  }

  .blog-grid .blog-index-image {
    position: relative;
  }

  .blog-grid .content-inner .blog-featured-img,
  .blog-grid .content-inner .blog-thumbnail-img {
    width: 100%;
    height: auto;
    /* height: 184px; */
    max-height: 184px;
    /* min-height: 184px; */
    overflow: hidden;
    display: block;
    line-height: 0;
  }
  .blog-grid .posts-container article:first-child .content-inner .blog-featured-img,
  .blog-grid .posts-container article:first-child .content-inner .blog-thumbnail-img {
    max-height: none ;
  }

  .blog-grid .content-inner .blog-index-image-wrap .blog-thumbnail-img img,
  .blog-grid .content-inner .blog-index-image-wrap .blog-featured-img img {
    width: 100%;
    height: auto;
    margin-bottom: 0 !important;
  }
  .blog-grid .content-inner .blog-index-image-wrap .blog-thumbnail-img .noimg {
    font-size: 100px;
    text-align: center;
    line-height: 230px;
    margin: 0 auto;
    display: block;
    color: #ccc;
  }

  .blog-grid .blog-index-image-wrap .meta-category {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(0,0,0,0.66);
    display: block !important;
    z-index: 11;
  }
  .blog-grid .blog-index-image-wrap .meta-category a {
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
    padding: 12px;
    cursor: pointer;
    font-family: "Benton Sans Med", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  }


  .blog-grid article .grow { transition: all 200ms ease-in-out; }
  .blog-grid article .grow:hover { transform: scale(1.07); }


  .blog-grid .content-inner .article-content-wrap {
    overflow: hidden;
    padding: 10px 15px 10px 25px !important;
    display: flex;
  }
  .blog-grid .content-inner .article-content-wrap .post-header {
    width: 75%;
    margin-bottom: 0 !important;
    align-self: center;
  }
  .blog-grid .content-inner .article-content-wrap .post-header .title {
    margin-bottom: 0 !important;
  }
  .blog-grid .content-inner .more-link {
    white-space: nowrap;
    text-align: right;
    margin-top: 0 !important;
    align-self: center;
    display: block;
    line-height: 1.25;
    width: 24%;
  }
  @media only screen and (max-width: 1024px) {
    .blog-grid .content-inner .more-link {
      white-space: normal;
      text-align: left;
    }
    .blog-grid .content-inner .more-link span {
      padding-left: 0;
      padding-right: 0;
    }
  }

  .blog-grid .content-inner .excerpt {
    display: none;
  }
  .blog-grid .content-inner .more-link .continue-reading {
    background: transparent;
    text-transform: lowercase;
  }
  .blog-grid .content-inner .more-link .continue-reading:hover {
    background: transparent !important;
    color: #000;
  }
  .blog-grid .content-inner .more-link .continue-reading:after {
    content: "❯";
    padding-left: 0.7em;
    padding-right: 0;
  }

  .blog-grid #post-area #pagination {
    clear: both;
    overflow: hidden;
    margin: 0 auto;
    padding: 30px 0;
    text-align: center;
  }

/* BLOG SEARCH ******************************************************* */

  #blog-search {
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    transition: width 0.3s;
    -webkit-backface-visibility: hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    overflow: hidden;
    text-align: right;
    vertical-align: top;
  }
  #blog-search-trigger {
    display: inline-block;
  }
  #blog-search form {
    box-sizing: border-box;
    display: inline-block;
  }
  #blog-search form input {
    box-sizing: border-box;
    width: 0;
    margin: 0;
    padding: 0 !important;
    display: inline-block;
    border-bottom: 0 !important;
    line-height: 16px !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
  }
  #blog-search.active form input {
    padding: 6px 60px 6px 10px !important;
    margin-left: 20px;
    width: 200px;
  }


  #subscribe-modal {
    width: 50vw;
    max-width: 640px;
  }
  form input[type="submit"],
  form button[type="submit"] {
    display: block;
    background-color: transparent !important;
    color: #444 !important;;
    font-size: 15px;
    border: 2px solid #444 !important;
    text-transform: uppercase;
    padding: 10px 16px !important;
    border-radius: 0 !important;
  }
  form input[type="submit"]:hover,
  form button[type="submit"]:hover {
    background-color: #444 !important;
    color: #fff !important;
    border-color: #000 !important;
  }
  button.btn-narrow {
    width: 150px !important;
  }

  /* use theme's prettyPhoto lightbox for subscribe modal */
  div.pp_pic_holder {
    top: 100px !important;
  }
  #pp_full_res .pp_inline form {
    margin-top: 2em !important;
  }
  #pp_full_res .pp_inline .epm-form-field {
    display: block !important;
    color: #444 !important;
  }
  .pp_left, .pp_middle, .pp_right, .pp_content {
    background: #fff !important;
    color: #333;
  }
  .pp_content {
    padding-top: 2em;
    padding-bottom: 2em;
    height: auto !important;
  }


  #obscura_blog_footer {
    margin-top: 30px;
  }

  #obscura_blog_footer a {
    color: #fff !important;
  }
  #obscura_blog_footer a:hover {
    color: #ddd !important;
  }
  #obscura_blog_footer h2 {
    background: #bbb;
    color: #fff !important;
    text-align: center;
    border-bottom: 2px solid #fff;
    line-height: 3;
    font-size: 18px !important;
    padding-top: 3px;
  }
  #obscura_blog_footer > div {
    background: #666;
    color: #ccc !important;
  }
  #obscura_blog_footer ul {
    list-style-type: none;
    overflow: hidden;
    padding: 30px 10px !important;
    margin: 0 !important;
  }
  #obscura_blog_footer ul li {
    width: 25%;
    padding: 0 10px;
    float: left;
    margin-bottom: 0;
  }
  #obscura_blog_footer ul li a {
    color: #ccc !important;
  }
  #obscura_blog_footer ul li .entry-meta {
    display: block;
    color: #999;
    margin-top: 1em;
  }
  #obscura_blog_footer ul li .entry-meta a {
    color: #999 !important;
  }
  #obscura_blog_footer .twitter-follow {
    background: #666;
    color: #fff !important;
    text-align: center;
  }
  #obscura_blog_footer .twitter-follow .btn {
    display: inline-block;
    margin: 0 auto;
    padding: 10px 15px;
    background-color: #333;
    color: #fff;
    width: auto;
  }
  #obscura_blog_footer .twitter-follow .btn i {
    padding-right: 4px;
  }

/* BLOG mobile  ******************************************************* */
@media only screen and (max-width: 690px) {
  div.pp_pic_holder {
    top: 20px !important;
  }

  .blog-grid article {
    width: 100%;
    float: none;
    margin: 15px 0;
    max-height: none;
    min-height: 0;
    height: auto;
  }

  .blog-grid .content-inner .article-content-wrap .post-header {
    width: 100%;
  }
  .blog-grid .content-inner .more-link {
    display: none;
  }
  .blog-grid article:not(.sticky):not(.category-sticky)  .content-inner {
    height: auto;
    max-height: none;
    min-height: 0;
  }

  .blog-grid .content-inner .title {
    font-size: 20px !important;
  }
  .blog-grid .content-inner .blog-index-image-wrap .blog-thumbnail-img {
    height: auto;
    max-height: none;
    min-height: 0;
  }
  .blog-grid .content-inner .blog-index-image-wrap .blog-thumbnail-img img {
    margin-bottom: 0 !important;
  }


  #obscura_blog_footer ul {
    padding: 10px !important;
  }
  #obscura_blog_footer ul li {
    float: none;
    width: 100%;
    margin-bottom: 1.5em;
  }
  #obscura_blog_footer ul li .entry-meta {
    margin-top: 0;
  }


  .blog-category-nav {
    font-size: 11px;
  }
  .blog-category-nav .container {
    margin-left: 20px;
    margin-right: 20px;
    max-width: 440px !important;
  }
  .blog-category-nav ul li {
    display: none;
  }
  .blog-category-nav ul li:first-child,
  .blog-category-nav ul li.current-cat {
    display: block;
  }
  .blog-category-nav  #blog-search {
    display: none;
  }
  .blog-grid .at-content .container-wrap {
    padding-top: 20px !important;
  }

  .single #post-area .meta-author {
    width: 33% !important;
  }
  .single .heading-title {
    padding-bottom: 0;
  }

  .single .blog-title #single-meta ul {
    width: 100%;
    float: none;
  }
  .single .blog-title #single-meta ul li.meta-share-count {
    float: left;
    clear: none;
  }
  .single #single-below-header .all-items {
    transform: translate(0, 60px);
    display: block !important;
  }

  .single .section-title #single-below-header .meta-date {
    display: inline-block !important;
    width: 33% !important;
  }

}


/* blog detail pages ******************************************************* */
.single .heading-title.row .col.section-title h1 {
  font-family: "Benton Sans Med", "Century Gothic", "CenturyGothic", "AppleGothic", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
  margin: 0 auto !important;
  text-align: center !important;
  text-transform: none;
  letter-spacing: normal;
  font-size: 30px !important;
  line-height: 1.3;
}
.single #single-below-header {
  margin: 15px auto !important;
  text-align: center !important;
}
.single #single-below-header .meta-author,
.single #single-below-header .meta-category {
  display: none;
}
.single #single-below-header .meta-date {
  border-top: 2px solid #eee;
  float: none !important;
  width: 10%;
  margin: 0 auto;
  white-space: nowrap;
  overflow: visible;
  padding: 10px 0 0 0 !important;
  display: inline !important;
  transform: translate(-18px, 0);
}
.single #single-below-header .all-items i {
  background: transparent !important;
  color: #ccc !important;
  font-size: 26px !important;
  cursor: pointer;
}
.single #single-below-header > span {
  border-left: none !important;
}
html .single-post #single-meta {
  margin-top: 1px;
}
.single .heading-title {
  border: 0 !important;
  margin-bottom: 0 !important;
}
.single #post-area .meta-author {
  display: none !important;
  /*
  margin: 0 auto;
  text-align: center;
  border-top: 2px solid #eee;
  padding-top: 10px;
  width: 10%;
  white-space: nowrap;
  overflow: visible;
  */
}
.single article {
  font-size: 16px;
}
.single article .source_publication {
  margin: 0 0 2em 0;
}
.single article .source_publication span {
  font-size: 12px;
  font-style: italic;
}
.single article .source_publication span.source_link {
  font-size: 10px;
  display: block;
}



/* About: The Execs ******************************************************** */
#the_execs.vc_row .wpb_column {
  /*  five execs: width: 18.32%; */
}
#the_execs.vc_row .wpb_column .team-member {
  padding-bottom: 150%;
  height: 0;
  width: 100%;
}
#the_execs .team-member .team-member-image {
  padding-bottom: 150%;
  height: auto;
  width: 100%;
}
#the_execs .team-member .team-meta {
  left: auto;
  bottom: 22px;
}
#the_execs .team-member .team-meta h3 {
  width: 92%;
  border-bottom: 1px solid #818181;
  font-family: Georgia, serif !important;
  font-size: 14px !important;
  line-height: 1.4;
  text-align: center;
  color: #fff !important;
  margin: 0 auto 5px auto;
  padding-bottom: 4px;
}
#the_execs .team-member .team-meta p {
  color: #ccc;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 10px;
  text-align: center;
}
#the_execs .team-member:hover:after {
  opacity: 0;
}
#the_execs .vc_col-sm-2 {
  margin-left: 1.3%;
}
/* EXECS - MOBILE */
@media only screen and (max-width: 690px) {
  #the_execs.vc_row .wpb_column {
    width: 100%;
  }
  .team-member[data-style="meta_overlaid_alt"] .team-meta {
    transform: translateY(0px);
    -webkit-transform: translateY(0px);
    opacity: 1;
}


/* MOBILE ************************************************************** */
@media only screen and (max-width: 690px) {

  body #page-header-bg .subheader {
    font-size: 12px !important;
  }

  body .container {
    max-width: 360px !important;
  }

  .submenu {
    display: none !important;
  }
  body .portfolio-filters-inline{
    display: none !important;
  }

  .portfolio-items .work-info {
    opacity: 1 !important;
  }
  .portfolio-items .work-info h3 {
    background-color: rgba(0,0,0,0.33);
    opacity: 1 !important;
  }
  .single-portfolio .project-title .section-title {
    padding: 0 !important;
  }
  body.single-portfolio .row .col.section-title h1,
  body.single-portfolio .row .col.section-title .subheader {
    width: 100% !important;
    line-height: 1.3 !important;
  }
  .single-portfolio .container.main-content {
    background-color: #000;
  }


  .nectar-slider-wrap,
  .nectar-slider-wrap .swiper-container,
  .nectar-slider-wrap .swiper-slide,
  .nectar-slider-wrap .swiper-slide .container {
    height: 360px !important;
  }

  body .nectar-slider-wrap[data-fullscreen="true"] .swiper-slide .container .content {
    text-align: center !important;
  }
  body .nectar-slider-wrap[data-fullscreen="true"] .swiper-slide .container .content h2 {
     font-size: 15px !important;
     line-height: 18px !important;
    text-align: center !important;
  }
  body .nectar-slider-wrap[data-fullscreen="true"] .swiper-slide .container .content p {
     font-size: 25px !important;
     line-height: 28px !important;
     text-align: center !important;
    background-color: rgba(0,0,0,0.25) !important;

  }
  body .nectar-slider-wrap[data-fullscreen="true"] .swiper-slide .container .content .buttons {
     font-size: 15px !important;
     line-height: 18px !important;
     text-align: center !important;
  }
  body .nectar-slider-wrap .content .buttons .button a {
    background-color: rgba(0,0,0,0.5) !important;
    color: #fff !important;
  }

  .codespacing_progress_map_area {
    display: none;
  }

  #page-header-bg .container h1 {
    font-size: 18px !important;
  }


  #footer-outer {
    padding-left: 16px;
    padding-right: 16px;
  }
  #footer-outer #social {
    width: 80%;
    margin: 0 auto;
    float: none !important;
    padding-left: 26px;
  }
  #footer-outer #copyright p {
    text-align: center;
  }
}