/* 

Theme Name:   Child theme
Theme URI: 		http://www.elegantthemes.com/gallery/divi/
Description:  Child theme for Divi
Author:       Jeremy Kron
Author URI: 	https://jeremykron.dev
Template:     Divi
Version:      4.8.2

*/
/*  MAIN SASS FILE
=================================================================== /// */
/* 
:::::::::: VARIABLES :::::::::
*/
/* breakpoints */
/* 
:::::::::: COLORS :::::::::
*/
/* ___ theme ___ */
@import url("https://use.typekit.net/lki2rwi.css");
.black {
  color: #161819 !important; }

.white {
  color: #f1f4f6 !important; }

.dark-grey {
  color: #595d5e !important; }

.mid-grey {
  color: #adb2b5 !important; }

.light-grey {
  color: #d8dfe5 !important; }

.blue {
  color: #31aadf !important; }

.yellow {
  color: #e3b236 !important; }

.red {
  color: #9d2465 !important; }

.purple {
  color: #614485 !important; }

.green {
  color: #73bd4c !important; }

.beige {
  color: #afa886 !important; }

.text-A {
  color: #595d5e !important; }

.text-B {
  color: #f1f4f6 !important; }

.link-A {
  color: #176d93 !important; }

.link-B {
  color: #e3b236 !important; }

/* svg fills */
.fill-blue {
  fill: #31aadf; }

.fill-yellow {
  fill: #e3b236; }

.fill-red {
  fill: #9d2465; }

.fill-purple {
  fill: #614485; }

.fill-green {
  fill: #73bd4c; }

.fill-black {
  fill: #161819; }

.fill-white {
  fill: #f1f4f6; }

.fill-light-grey {
  fill: #d8dfe5; }

.fill-mid-grey {
  fill: #adb2b5; }

.fill-dark-grey {
  fill: #595d5e; }

.fill-beige {
  fill: #afa886; }

/* ___ backgrounds ___ */
.bg-black {
  background-color: #161819 !important;
  color: #f1f4f6; }

.bg-white {
  background-color: #f1f4f6 !important;
  color: #595d5e; }

.bg-light-grey {
  background-color: #d8dfe5 !important;
  color: #595d5e; }

.bg-lighter-grey {
  background-color: #e7ecef !important;
  color: #595d5e; }

.bg-mid-grey {
  background-color: #adb2b5 !important;
  color: #595d5e; }

.bg-dark-grey {
  background-color: #595d5e !important;
  color: #f1f4f6; }

.bg-darker-grey {
  background-color: #4d5051 !important;
  color: #f1f4f6; }

.bg-blue {
  background-color: #31aadf !important;
  color: #f1f4f6; }

.bg-yellow {
  background-color: #e3b236 !important;
  color: #f1f4f6; }

.bg-red {
  background-color: #9d2465 !important;
  color: #f1f4f6; }

.bg-purple {
  background-color: #614485 !important;
  color: #595d5e; }

.bg-green {
  background-color: #73bd4c !important;
  color: #f1f4f6; }

.bg-beige {
  background-color: #afa886 !important;
  color: #161819; }

/* ___ borders ___ */
.border-black-thin {
  border: #161819 1px solid; }

.border-top-black-thin {
  border-top: #161819 1px solid; }

.border-bottom-black-thin {
  border-bottom: #161819 1px solid; }

.border-white-thin {
  border: #f1f4f6 1px solid; }

.border-top-white-thin {
  border-top: #f1f4f6 1px solid; }

.border-bottom-white-thin {
  border-bottom: #f1f4f6 1px solid; }

.border-light-grey-thin {
  border: #d8dfe5 1px solid; }

.border-top-light-grey-thin {
  border-top: #d8dfe5 1px solid; }

.border-bottom-light-grey-thin {
  border-bottom: #d8dfe5 1px solid; }

.border-mid-grey-thin {
  border: #adb2b5 1px solid; }

.border-top-mid-grey-thin {
  border-top: #adb2b5 1px solid; }

.border-bottom-mid-grey-thin {
  border-bottom: #adb2b5 1px solid; }

.border-dark-grey-thin {
  border: #595d5e 1px solid; }

.border-top-dark-grey-thin {
  border-top: #595d5e 1px solid; }

.border-bottom-dark-grey-thin {
  border-bottom: #595d5e 1px solid; }

.border-blue-thin {
  border: #31aadf 1px solid; }

.border-top-blue-thin {
  border-top: #31aadf 1px solid; }

.border-bottom-blue-thin {
  border-bottom: #31aadf 1px solid; }

.border-yellow-thin {
  border: #e3b236 1px solid; }

.border-top-yellow-thin {
  border-top: #e3b236 1px solid; }

.border-bottom-yellow-thin {
  border-bottom: #e3b236 1px solid; }

.border-red-thin {
  border: #9d2465 1px solid; }

.border-top-red-thin {
  border-top: #9d2465 1px solid; }

.border-bottom-red-thin {
  border-bottom: #9d2465 1px solid; }

.border-purple-thin {
  border: #614485 1px solid; }

.border-top-purple-thin {
  border-top: #614485 1px solid; }

.border-bottom-purple-thin {
  border-bottom: #614485 1px solid; }

.border-green-thin {
  border: #73bd4c 1px solid; }

.border-top-green-thin {
  border-top: #73bd4c 1px solid; }

.border-bottom-green-thin {
  border-bottom: #73bd4c 1px solid; }

/* ___ system ___ */
/* families */
@font-face {
  font-family: "jeremy2";
  src: url("fonts/jeremy2.eot");
  src: url("fonts/jeremy2.eot") format("embedded-opentype"), url("fonts/jeremy2.woff") format("woff"), url("fonts/jeremy2.ttf") format("truetype"); }
@font-face {
  font-family: "jeremy2-bold";
  src: url("fonts/jeremy2-bold.eot");
  src: url("fonts/jeremy2-bold.eot") format("embedded-opentype"), url("fonts/jeremy2-bold.woff") format("woff"), url("fonts/jeremy2-bold.ttf") format("truetype"); }
/* Custom fonts */
/* Headlines */
/* Copy */
/* 
:::::::::: GRID LAYOUT :::::::::
Written by: Jeremy Kron
Date: September 16, 2015
Update: March 17, 2019

- Make sure headings and other elements that span the full width before or after a multi-column section are located OUTSIDE the "row" in your html. Otherwise padding corrections for alignment on first and last child columns will not work properly (also noted in _base).

::::::::: 
*/
* {
  box-sizing: border-box; }

.container {
  width: 100%;
  max-width: 1279px;
  margin: 0 auto;
  clear: both;
  overflow: hidden; }
  @media (max-width: 1279px) {
    .container {
      margin: 0 5%;
      width: auto; } }

.row {
  overflow: hidden; }

.row:before, .row:after {
  clear: both; }

[class*='col-'] {
  float: left;
  min-height: 1px;
  width: 100%; }

@media (min-width: 981px) {
  .col-1 {
    width: 8.3333333333333333%; }

  .col-2 {
    width: 16.66666666666666667%; } }
@media (min-width: 981px) {
  .col-3 {
    width: 25%; }

  .col-4 {
    width: 33.33333333333333333%; }

  .col-5 {
    width: 41.66666666666666667%; }

  .col-6 {
    width: 50%; }

  .col-7 {
    width: 58.33333333333333333%; }

  .col-8 {
    width: 66.66666666666666667%; }

  .col-9 {
    width: 75%; }

  .col-10 {
    width: 83.33333333333333333%; }

  .col-11 {
    width: 91.66666666666666667%; }

  .col-12 {
    width: 100%; }

  .col-8 + .col-4 {
    width: 33.33333333333333333%; }

  .col-9 {
    width: 75%; }

  .col-9 + .col-3 {
    width: 25%; } }
.flexbox {
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center; }
  @media (max-width: 980px) {
    .flexbox {
      display: block; } }

.flex-col {
  justify-content: center;
  text-align: center; }
  @media (max-width: 980px) {
    .flex-col {
      display: block; } }

html {
  scroll-behavior: smooth; }

body {
  margin: 0 0;
  font-family: "tenby-five", sans-serif; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Larabiefont", sans-serif;
  font-weight: 700; }

h1 {
  font-size: 50px;
  line-height: 60px;
  word-wrap: normal; }
  @media (max-width: 980px) {
    h1 {
      font-size: 32px;
      line-height: 38px; } }

h2 {
  font-weight: 600;
  font-size: 30px;
  line-height: 37px; }

h4 {
  text-transform: uppercase; }

p {
  font-family: "tenby-five", sans-serif;
  font-size: 18px;
  line-height: 24px; }

a {
  color: #73bd4c;
  font-weight: 600; }
  a:hover {
    color: #90cb71; }

img {
  display: block; }

button {
  border: none;
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 18px;
  line-height: 18px;
  text-transform: uppercase;
  letter-spacing: 1px;
  cursor: pointer; }
  button.btn-yellow {
    background: #e3b236;
    color: #31aadf;
    font-weight: 500; }
    button.btn-yellow:hover {
      background: #9d7716;
      color: #f1f4f6; }
      button.btn-yellow:hover i {
        color: #f1f4f6; }
    button.btn-yellow i {
      color: #31aadf;
      padding-left: 12px; }
  button.btn-blue {
    background: #31aadf;
    color: #f1f4f6;
    font-weight: 500; }
    button.btn-blue:hover {
      background: #176d93;
      color: #e3b236; }
      button.btn-blue:hover i {
        color: #f1f4f6; }
    button.btn-blue i {
      color: #e3b236;
      padding-left: 12px; }

figure.hero img {
  width: 100%;
  display: block;
  margin: 0 auto; }

@media (min-width: 1024px) {
  :hover {
    -webkit-transition: all .15s ease-in-out;
    -moz-transition: all .15s ease-in-out;
    -ms-transition: all .15s ease-in-out;
    -o-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out; } }

#logo {
  padding: 1rem 0; }

#top-menu li {
  font-family: "Larabiefont", sans-serif;
  font-size: 16px;
  line-height: 16px; }
  #top-menu li a {
    color: #31aadf; }
  #top-menu li.current-menu-ancestor a {
    color: #443309; }
  #top-menu li.nav-cta {
    display: inline-block;
    margin: 0 auto;
    background: rgba(49, 170, 223, 0.8);
    border: #e3b236 2px solid;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    color: #e3b236;
    font-family: "Larabiefont", sans-serif;
    font-weight: 600;
    letter-spacing: 2px;
    cursor: pointer; }
    #top-menu li.nav-cta:hover {
      background: rgba(33, 158, 213, 0.8); }
      #top-menu li.nav-cta:hover a {
        color: #e9c363 !important; }
    #top-menu li.nav-cta a {
      color: #e3b236;
      padding-bottom: 0 !important; }

.nav li ul {
  border-top: #443309 1px solid; }

footer {
  position: relative;
  background: #135d7d; }
  footer .flexbox {
    padding: 40px 24px; }
    footer .flexbox .flex-col:last-child {
      text-align: right; }
  footer p {
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 1px;
    color: #d8dfe5; }
    footer p.copyright {
      margin: 16px 0 0; }
    @media (max-width: 980px) {
      footer p {
        text-align: center; } }
  footer a {
    color: #31aadf; }
    footer a:hover {
      color: #219ed5; }
  footer button.btn-blue {
    background: #176d93;
    color: #f1f4f6;
    font-weight: 500; }
    footer button.btn-blue:hover {
      background: #1e8ebf;
      color: #f1f4f6; }
      footer button.btn-blue:hover i {
        color: #0f1a0a; }
    footer button.btn-blue i {
      display: inline;
      color: #73bd4c;
      padding: 0 12px 0 0; }
      @media (max-width: 980px) {
        footer button.btn-blue i {
          display: none; }
          footer button.btn-blue i.mobile {
            display: block;
            margin: 0 auto 8px;
            font-size: 60px;
            line-height: 60px; } }
  @media (max-width: 980px) {
    footer button {
      display: block;
      margin: 0 auto;
      font-size: 12px;
      letter-spacing: 2px; } }
  footer .ftr-logo {
    max-width: 220px; }
    @media (max-width: 980px) {
      footer .ftr-logo {
        max-width: 80px;
        margin: 0 auto 24px; } }
  footer .credit {
    background: #000; }
    footer .credit p {
      font-size: 12px;
      line-height: 15px;
      font-weight: 400;
      letter-spacing: 1px;
      color: #d8dfe5; }

/* 
:::::::::: BASE STYLES :::::::::
*/
.mobile {
  display: none !important; }
  @media (max-width: 980px) {
    .mobile {
      display: block !important; } }

@media (max-width: 980px) {
  .desktop {
    display: none !important; } }

.hide {
  display: none; }

.text-center {
  text-align: center !important; }

.text-right {
  text-align: right !important; }

.text-left {
  text-align: left !important; }

.bold {
  font-weight: bold; }

.italics {
  font-style: italic; }

.anchor {
  position: relative; }
  .anchor a {
    position: absolute;
    left: 0;
    top: -196px; }

.nobr {
  white-space: nowrap; }

.flip-x {
  transform: scaleX(-1); }

.flip-y {
  transform: scaleY(-1); }

.uppercase {
  text-transform: uppercase; }

.lowercase {
  text-transform: lowercase; }

.smalltext {
  font-size: 0.8rem;
  line-height: 0.9rem; }

.no-pad {
  padding: 0 !important; }

.pad {
  padding: 2rem; }

.pad-v {
  padding: 2rem 0; }

.pad-h {
  padding: 0 2rem; }

.pad-top {
  padding-top: 2rem; }

.pad-bottom {
  padding-bottom: 2rem; }

.pad-left {
  padding-left: 2rem; }

.pad-right {
  padding-right: 2rem; }

.no-margin {
  margin: 0 0 0 0 !important; }

.no-margin-v {
  margin: 0 auto !important; }

.no-margin-h {
  margin: inherit 0 !important; }

.no-margin-top {
  margin: 0 auto auto !important; }

.no-margin-bottom {
  margin: auto auto 0 !important; }

.hundredPct {
  width: 100%; }

.ninetyPct {
  width: 90%; }

.eightyPct {
  width: 80%; }

.seventyPct {
  width: 70%; }

.sixtyPct {
  width: 60%; }

.fiftyPct {
  width: 50%; }

.fortyPct {
  width: 40%; }

.thirtyPct {
  width: 30%; }

.twentyPct {
  width: 20%; }

.tenPct {
  width: 10%; }

.fivePct {
  width: 5%; }

.img-auto {
  width: auto;
  height: auto;
  max-width: 100%; }

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

.img-75 {
  width: 75%;
  height: auto; }

.img-50 {
  width: 50%;
  height: auto; }
  .img-50.m {
    width: 100%;
    height: auto; }
    @media (max-width: 980px) {
      .img-50.m {
        width: 50%;
        display: block;
        margin: 0 auto; } }

.main {
  min-height: 75vh; }

.container {
  max-width: 1280px; }
  .container .inner-container {
    max-width: 1024px;
    margin: auto; }

#splash {
  z-index: -1000;
  width: 100%;
  height: 100vh;
  background: #edf7fc url(/images/bgds/lines-and-waves-001-fade.png) center right repeat-y;
  background-attachment: fixed; }
  @media (max-width: 980px) {
    #splash {
      background-image: url("/images/bgds/lines-and-waves-001-fade-mobile.png"); } }
  #splash .container .inner-container img {
    margin: 15% auto 0; }
    @media (max-width: 980px) {
      #splash .container .inner-container img {
        margin: 20vh auto 0;
        padding: 0 24px; } }
  #splash .container .inner-container h2 {
    font-weight: 300;
    font-size: 48px;
    line-height: 60px;
    text-align: center;
    margin: 24px auto;
    color: #595d5e; }
    @media (max-width: 980px) {
      #splash .container .inner-container h2 {
        font-size: 32px;
        line-height: 40px; } }
    #splash .container .inner-container h2 span {
      opacity: 0; }

#nav {
  position: sticky;
  z-index: 1000;
  top: 0;
  background: rgba(215, 238, 249, 0.9);
  border-bottom: #31aadf 6px solid;
  padding: 18px 24px; }
  #nav .flexbox {
    align-items: flex-end; }
    #nav .flexbox #hdr-logo img {
      width: auto;
      height: auto;
      max-width: 160px; }
  #nav ul {
    margin: 0 0; }
    #nav ul.menu {
      list-style-type: none;
      text-align: right; }
      @media (max-width: 980px) {
        #nav ul.menu {
          text-align: left;
          padding: 6px 12px 12px; } }
      #nav ul.menu li {
        display: inline-block;
        text-transform: uppercase;
        font-size: 24px;
        line-height: 24px;
        letter-spacing: 2px;
        font-weight: 600;
        padding: 0 18px 6px;
        border-bottom: transparent 2px dotted; }
        @media (max-width: 980px) {
          #nav ul.menu li {
            display: block;
            padding: 6px 6px 6px 6px;
            margin: 12px auto 0;
            text-align: center; } }
        #nav ul.menu li:hover {
          border-bottom: #595d5e 2px dotted;
          color: #595d5e; }
          @media (max-width: 980px) {
            #nav ul.menu li:hover {
              background: #e3dbed;
              border-bottom: #e3dbed 2px solid; } }
        #nav ul.menu li a {
          text-decoration: none;
          font-weight: 600;
          color: #1a7ea9; }
          #nav ul.menu li a:hover {
            color: #595d5e; }
  #nav #menu-toggle {
    display: none;
    width: 30%;
    font-size: 36px;
    line-height: 36px;
    text-align: right;
    color: #595d5e; }
    @media (max-width: 980px) {
      #nav #menu-toggle {
        display: block; } }
  @media (max-width: 980px) {
    #nav #hdr-logo {
      display: flex;
      align-items: center; }
      #nav #hdr-logo i {
        margin-top: 12px; }
      #nav #hdr-logo a {
        width: 70%; }
      #nav #hdr-logo img {
        width: 100%;
        height: auto; } }
  @media (max-width: 767px) {
    #nav #hdr-logo i {
      margin-top: 8px; } }
  @media (max-width: 419px) {
    #nav #hdr-logo i {
      margin-top: 0px; } }
  @media (max-width: 980px) {
    #nav #nav-menu {
      display: none;
      opacity: 0;
      width: 100%;
      position: absolute;
      top: 102px;
      left: 0;
      background: #f1f4f6; } }
  @media (min-width: 981px) {
    #nav #nav-menu {
      display: block !important;
      opacity: 1 !important; } }

#data {
  position: relative;
  min-height: 100vh; }

.client {
  min-height: 100vh; }
  @media (max-width: 980px) {
    .client:first-child .slide {
      padding-top: 160px; } }
  .client .slide {
    width: 100%;
    min-height: 100vh;
    padding: 160px 0 0; }
    @media (max-width: 980px) {
      .client .slide {
        padding: 48px 24px; } }
    @media (max-width: 980px) {
      .client .slide .container {
        margin: 0 0; } }
    .client .slide .col-6:first-child {
      padding: 0; }
    .client .slide .col-6:last-child {
      padding: 0; }
    .client .slide .col-6 .row {
      margin: 0 0 16px; }
    .client .slide .col-6.projector {
      max-width: 100%;
      background-repeat: no-repeat;
      background-size: contain;
      padding: 0 0 0 48px; }
      @media (max-width: 980px) {
        .client .slide .col-6.projector {
          padding: 0; } }
    .client .slide img.client-logo {
      margin: 0 0 48px;
      width: auto;
      height: auto;
      max-width: 100%; }
      @media (max-width: 980px) {
        .client .slide img.client-logo {
          margin: 0 auto 48px; } }
    .client .slide h3 {
      text-align: right;
      margin: 9px 0 0; }
      @media (max-width: 980px) {
        .client .slide h3 {
          text-align: left; } }
    .client .slide ul {
      margin: 0;
      padding: 0;
      list-style-type: none;
      text-align: left; }
      .client .slide ul li {
        display: block;
        margin: 9px 18px 9px 36px;
        padding: 3px;
        font-size: 18px;
        line-height: 22px;
        letter-spacing: 2px;
        cursor: pointer; }
        @media (max-width: 980px) {
          .client .slide ul li {
            margin: 9px 0; } }
        .client .slide ul li.client-name {
          font-size: 22px;
          padding-bottom: 6px;
          border-bottom: 1px dotted; }
        .client .slide ul li.service.active, .client .slide ul li.service:hover, .client .slide ul li.project.active, .client .slide ul li.project:hover {
          background: rgba(22, 24, 25, 0.7); }
    .client .slide .testimonial {
      padding: 12px 36px; }
      @media (max-width: 980px) {
        .client .slide .testimonial {
          padding: 12px 0; } }
      .client .slide .testimonial p {
        font-family: "lato", sans-serif;
        font-size: 48px;
        line-height: 60px;
        font-style: oblique;
        font-weight: 400;
        letter-spacing: 2px;
        margin: 0;
        padding: 0; }
        @media (max-width: 980px) {
          .client .slide .testimonial p {
            font-size: 28px;
            line-height: 36px; } }
        .client .slide .testimonial p.statement {
          margin-top: -56px;
          text-shadow: #333333 0 6px 12px; }
        .client .slide .testimonial p.quotes {
          font-family: "jeremy2", arial, helvetica, sans-serif;
          font-size: 120px;
          line-height: 120px;
          font-weight: 900;
          text-align: center;
          margin: 24px auto 0; }
          @media (max-width: 980px) {
            .client .slide .testimonial p.quotes {
              margin: 0 auto;
              margin-left: -10%;
              line-height: 140px; } }
        .client .slide .testimonial p.byline {
          font-size: 24px;
          line-height: 24px;
          padding-bottom: 40px; }
          @media (max-width: 980px) {
            .client .slide .testimonial p.byline {
              font-size: 14px;
              line-height: 14px;
              padding-bottom: unset; } }
          .client .slide .testimonial p.byline::before {
            content: '- '; }
    .client .slide .modal {
      display: none;
      position: relative;
      background: rgba(22, 24, 25, 0.8);
      border-width: 2px;
      border-style: solid;
      border-radius: 12px;
      box-shadow: #f1f4f6 0 0 12px;
      margin: 12px auto;
      padding: 24px;
      width: 100%; }
      @media (max-width: 980px) {
        .client .slide .modal {
          position: fixed;
          background: #161819;
          z-index: 1999;
          border-radius: 0;
          border: none;
          top: -12px;
          left: 0;
          width: 100%;
          height: 100vh; } }
      .client .slide .modal .modal-close {
        cursor: pointer;
        position: absolute;
        right: 24px;
        top: 12px;
        color: #d8dfe5;
        font-size: 24px;
        line-height: 24px; }
      .client .slide .modal .modal-content {
        font-family: "lato", sans-serif;
        font-size: 18px;
        line-height: 24px;
        letter-spacing: 1px;
        padding-top: 24px; }
        .client .slide .modal .modal-content h4 {
          font-family: "lato", sans-serif;
          font-size: 28px;
          line-height: 36px;
          letter-spacing: 2px;
          margin: 0 0 16px; }
        .client .slide .modal .modal-content h5 {
          font-family: "lato", sans-serif;
          font-weight: 500;
          text-transform: none; }
        .client .slide .modal .modal-content p {
          font-family: "lato", sans-serif;
          font-weight: 300; }
        .client .slide .modal .modal-content img {
          width: auto;
          height: auto;
          max-width: 100%; }

#about {
  background: #f9eed3 url("/images/about/landscape.jpg") top center no-repeat;
  background-size: cover;
  min-height: 100vh;
  padding: 160px 0 0; }
  @media (max-width: 980px) {
    #about {
      padding: 160px 24px 48px; } }
  #about h3 {
    text-align: left;
    font-size: 36px;
    line-height: 42px;
    color: #9d2465;
    font-family: "lato", sans-serif;
    font-weight: 500; }
    @media (max-width: 980px) {
      #about h3 {
        text-align: center; } }
  #about .row .flex-col {
    padding: 0 24px; }
  #about .row .col-7 p {
    font-family: "lato", sans-serif;
    font-size: 22px;
    line-height: 30px;
    text-align: left; }

#animation .jumbotron {
  position: relative;
  min-height: 80vh;
  background: url("/images/animation/pyramids-2.gif") center center no-repeat;
  background-size: cover; }
#animation img {
  width: auto;
  height: auto;
  max-height: 300px;
  position: absolute;
  right: 0;
  bottom: 0;
  animation-name: walk;
  animation-duration: 10s;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

@keyframes walk {
  from {
    right: -10%; }
  to {
    right: 100%; } }
#video {
  background-color: #161819;
  padding: 6rem 4rem;
  display: flex;
  align-items: flex-start; }
  @media screen and (max-width: 860px) {
    #video {
      display: block;
      padding: 4rem 2rem; } }
  #video .jumbotron {
    width: 40%;
    padding: 1rem 4rem; }
    @media screen and (max-width: 860px) {
      #video .jumbotron {
        width: 100%;
        padding: 0; } }
  #video .jumbotron {
    width: 100%; }
    #video .jumbotron video,
    #video .jumbotron img {
      width: 100%;
      height: auto; }
    @media screen and (max-width: 860px) {
      #video .jumbotron {
        width: 100%;
        margin-top: 2rem; } }

#contact {
  background: #161819 url(/images/bgds/lines-and-waves-002.jpg) center center no-repeat;
  background-size: cover;
  min-height: 100vh;
  padding: 160px 0 60px; }
  #contact h3 {
    text-align: left;
    font-size: 36px;
    line-height: 42px;
    color: #d8dfe5;
    font-family: "lato", sans-serif;
    font-weight: 500; }
    @media (max-width: 980px) {
      #contact h3 {
        text-align: center; } }
  #contact input[type=text],
  #contact input[type=email],
  #contact textarea {
    width: 100%;
    border: #e3b236 3px solid;
    border-radius: 4px;
    padding: 12px;
    font-size: 16px;
    background: #fcf7e9; }
  #contact .ty-msg h3 {
    font-weight: 700;
    color: #73bd4c;
    text-align: right; }
    @media (max-width: 980px) {
      #contact .ty-msg h3 {
        text-align: center; } }
  #contact .ty-msg p {
    color: #d8dfe5;
    text-align: right;
    font-family: "lato", sans-serif;
    font-size: 24px;
    font-weight: 500; }
    @media (max-width: 980px) {
      #contact .ty-msg p {
        text-align: center; } }
  #contact #cf-1 .col-6:first-child {
    padding: 12px 12px 12px 0; }
    @media (max-width: 980px) {
      #contact #cf-1 .col-6:first-child {
        padding: 12px; } }
  #contact #cf-1 .col-6:last-child {
    padding: 12px 0 12px 12px; }
    @media (max-width: 980px) {
      #contact #cf-1 .col-6:last-child {
        padding: 12px; } }
  #contact #cf-1 .col-12 {
    padding: 12px 0; }
    @media (max-width: 980px) {
      #contact #cf-1 .col-12 {
        padding: 12px; } }
  #contact #cf-1 h3 {
    color: #d8dfe5; }
  #contact #cf-1 label {
    color: #d8dfe5;
    text-align: left;
    display: block;
    font-size: 12px;
    line-height: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding-top: 4px; }
  #contact #cf-1 textarea {
    height: 250px; }
  #contact #cf-1 button {
    background: #5c9c3a;
    color: #f1f4f6;
    padding-left: 24px;
    padding-right: 24px; }
    #contact #cf-1 button:hover {
      background: #518a33; }
  #contact #cf-1 .ty-msg p {
    color: #d8dfe5; }

#blog {
  background: #fcf7e9 url("/images/bgds/lines-and-waves-001-fade-mobile.png") center right repeat-y;
  min-height: 100vh; }
  @media (max-width: 980px) {
    #blog {
      padding: 0 24px; } }
  #blog h1, #blog h2, #blog h3, #blog h4, #blog p, #blog ul, #blog ol {
    font-family: "lato", sans-serif; }
  #blog h1 {
    text-align: left;
    font-size: 36px;
    line-height: 42px;
    color: #9d2465;
    font-weight: 500; }
    @media (max-width: 980px) {
      #blog h1 {
        font-size: 28px;
        line-height: 36px; } }
  #blog .row {
    padding: 40px 24px 60px; }
    #blog .row .col-12 p, #blog .row .col-12 ul, #blog .row .col-12 ol {
      color: #161819;
      font-family: "lato", sans-serif;
      font-size: 20px;
      line-height: 30px;
      text-align: left; }
      #blog .row .col-12 p.intro, #blog .row .col-12 ul.intro, #blog .row .col-12 ol.intro {
        color: #176d93;
        font-size: 24px;
        line-height: 36px;
        margin-bottom: 24px; }
      #blog .row .col-12 p.byline, #blog .row .col-12 ul.byline, #blog .row .col-12 ol.byline {
        color: #595d5e;
        font-size: 14px;
        line-height: 18px;
        margin: 0 0 36px; }
    #blog .row .col-12 img {
      display: block;
      margin: 40px auto; }
    #blog .row .col-12 button {
      background: #73bd4c;
      color: #f1f4f6;
      font-weight: 600;
      display: block;
      margin: 36px auto 0; }
  #blog.overview .row {
    border-bottom: #31aadf 2px dashed; }
    #blog.overview .row:last-child {
      border-bottom: none; }
  #blog table {
    width: 100%;
    font-family: "lato", sans-serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 28px;
    border: none;
    padding: 0; }
    @media (max-width: 980px) {
      #blog table {
        font-size: 16px;
        line-height: 20px; } }
    #blog table tr {
      background: #f1f4f6; }
      #blog table tr:nth-child(odd) {
        background: #FFF; }
      #blog table tr th, #blog table tr td {
        padding: 8px 12px; }
      #blog table tr th {
        color: #f1f4f6;
        font-weight: 700; }
      #blog table tr td {
        color: #161819;
        text-align: center; }
  #blog .indent {
    margin: 24px 48px; }
  #blog .pull-quote p {
    font-size: 30px !important;
    line-height: 40px !important;
    font-style: oblique;
    color: #1a7ea9 !important; }
    #blog .pull-quote p.byline {
      font-size: 16px !important;
      line-height: 20px !important;
      font-style: normal;
      color: #595d5e !important; }

#post-2025-09-30 h3 {
  font-size: 30px;
  line-height: 36px;
  margin: 40px 0 0; }
  @media (max-width: 980px) {
    #post-2025-09-30 h3 {
      font-size: 22px;
      line-height: 28px;
      text-align: center; } }
#post-2025-09-30 table tr:first-child {
  background: linear-gradient(90deg, #31aadf, #9d2465); }
#post-2025-09-30 .group {
  margin: 0 36px; }
  @media (max-width: 980px) {
    #post-2025-09-30 .group {
      margin: 0; } }

#shop {
  background: #fcf7e9 url("/images/bgds/lines-and-waves-001-fade-mobile.png") center right repeat-y;
  min-height: 100vh;
  padding-top: 40px; }
  #shop h1 {
    font-family: "lato", sans-serif;
    text-align: center;
    font-size: 36px;
    line-height: 42px;
    color: #9d2465;
    font-weight: 500; }
    @media (max-width: 980px) {
      #shop h1 {
        font-size: 28px;
        line-height: 36px; } }
  #shop p.intro {
    font-family: "lato", sans-serif;
    text-align: center;
    color: #176d93;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 24px; }
  #shop .gallery-item {
    margin: 40px auto;
    border-bottom: #d8dfe5 1px solid; }
    #shop .gallery-item:last-child {
      border-bottom: none; }
    #shop .gallery-item .display .feature .feature-item {
      background: #161819;
      padding: 24px; }
      #shop .gallery-item .display .feature .feature-item img {
        background: #f1f4f6;
        padding: 12px; }
    #shop .gallery-item .thumbs {
      margin-top: 16px; }
      #shop .gallery-item .thumbs .thumb img {
        cursor: pointer; }
  #shop .gallery-item-meta h2, #shop .gallery-item-meta h3, #shop .gallery-item-meta p, #shop .gallery-item-meta ul {
    font-family: "lato", sans-serif; }
  #shop .gallery-item-meta .price {
    color: #5c9c3a;
    font-weight: 700; }
  #shop .gallery-item-meta button {
    cursor: pointer;
    color: #f1f4f6;
    font-weight: 700;
    background: #31aadf; }
    #shop .gallery-item-meta button:hover {
      background: #1e8ebf; }

.stripe-button-el {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  float: left; }
  .stripe-button-el span {
    height: unset !important;
    border: none;
    text-shadow: none !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    font-size: 18px !important;
    line-height: 18px !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    float: left;
    cursor: pointer;
    color: #f1f4f6 !important;
    font-weight: 700 !important;
    background: #31aadf !important; }
    .stripe-button-el span:hover {
      background: #1e8ebf !important; }

#lb-overlay {
  display: none;
  position: absolute;
  top: 0;
  z-index: 1000;
  width: 100%;
  height: auto;
  min-height: 10000vh;
  background: rgba(22, 24, 25, 0.9); }

.lb-trigger {
  cursor: pointer; }

.lb-container {
  display: none;
  position: fixed;
  top: 5%;
  z-index: 1001;
  width: 80%;
  margin: 0 10%; }
  .lb-container #lb-close {
    width: 80%;
    font-size: 24px;
    font-weight: 300;
    text-align: right;
    color: #f1f4f6;
    padding: 12px 0;
    cursor: pointer; }
    .lb-container #lb-close:hover {
      color: #d8dfe5; }
  .lb-container #lb-display {
    margin: 0 auto;
    width: auto;
    max-width: 70%; }
    .lb-container #lb-display img {
      background: #f1f4f6;
      padding: 24px;
      border-radius: 12px;
      width: auto;
      height: auto;
      max-width: 100%;
      max-height: 80vh;
      margin: 0 auto; }