@charset "UTF-8";

/*
Project: Common Thread Collective Blog Styles
Description: global shopify website styles compiled from pre-2021 scss;
Author: Paul Capetola;
Version: 8.25.21;

 * This Cascading Style Sheet is based off Shopify Timber v2.1.0 | github.com/shopify/timber
   Copyright 2015 Shopify Inc.
 */

/* ================================================================================================== */


/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
#1.0 - Reset
#2.0 - Typography
  #2.1 - Font Files
  #2.2 - Typographic Styles
#3.0 - Global Layout
  #3.1 - Visibility
  #3.2 - Alignments & Clearings
#4.0 - Navgiation
  #4.1 - Basic Navigation Styles
  #4.2 - Mobile Navigation Styles
  #4.3 - Announcement Bar
#5.0 - Blog Layout
  #5.1 - Hero
  #5.2 - Image Styles
  #5.3 - Testimonial Section
  #5.4 - Code in Blogs
  #5.5 - Custom Tables
  $5.6 - Locksmith Content
#6.0 - Form Styles
  #6.1 Error / Success
  #6.2 Hubspot Forms
  #6.3 Hubspot Pop-Ups
#7.0 - Case Studies
  #7.1 - Breakout Row
  #7.2 - Multi-Image/Video Row
  #7.3 - Dark-Blue Overview
#8.0 - Custom Blog Code (Specific Use-Case)
  #8.1 - Ecommerce Accounting: Float Right Books
#9.0 - Footer
  #9.1 - Footer Form
#10.0 - Media Queries

--------------------------------------------------------------*/


/*--------------------------------------------------------------
#1.0 - Reset
--------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

html {
  font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
  font-size: 10px; /* Corrects text resizing oddly when browsers zoom text only */
  height: 100%;
  overflow-y: scroll; /* Keeps page centered in all browsers regardless of content height */
  -webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
  -ms-text-size-adjust:     100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
}

*,
*:before,
*:after { /* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
  -webkit-box-sizing: border-box; /* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
  -moz-box-sizing:    border-box; /* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
  box-sizing:         border-box;
}

body {
  position: relative;
  background: #fff; /* Fallback for when there is no custom background color defined. */
  min-height: 100%;
}

body::before, body::after { content: ''; display: table; }
body::after { clear: both; }

article, aside, details, figcaption, figure, 
footer, header, hgroup, main, nav,section, summary {
  display: block;
}
audio, canvas, progress, video {
  display: inline-block;
  vertical-align: baseline;
  width: 100%;
}

body {
  line-height: 1;
}

caption, th, td {
  font-weight: normal;
  text-align: left;
}
blockquote, q {
  quotes: "“" "”" "‘" "’";
}
table { 
  border-collapse: collapse;
  border-spacing: 0;
}

a:focus {
  outline: thin dotted;
}
a:hover, a:active {
  outline: none;
}
a img {
  border: none;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

html, body {
  background-color: white;
}
[tabindex='-1']:focus {
  outline: none;
}

.wrapper {
  max-width: 1050px;
  margin: 0 auto;
  padding: 0 15px;
}

hr {
  box-sizing: content-box;
  overflow: visible;
  clear: both;
  border-top: solid #1c1d1d;
  border-width: 1px 0 0;
  margin: 30px 0;
  height: 0;
}

pre, code, kbd, samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}

img {
  border-style: none;
}


/*--------------------------------------------------------------
#2.0 - Typography
--------------------------------------------------------------*/

/* #2.1 Font Files *********************************************
--------------------------------------------------------------*/
@font-face {
  font-family: Oswald-SemiBold;
  src: url("//cdn.shopify.com/s/files/1/1024/1659/t/57/assets/Oswald-SemiBold.ttf?v=11764230891422404431") format("truetype");
  font-display: swap; }

@font-face {
  font-family: Poppins-Bold;
  src: url("//cdn.shopify.com/s/files/1/1024/1659/t/57/assets/Poppins-Bold.ttf?v=5551369659426225047") format("truetype");
  font-display: swap; }

@font-face {
  font-family: Poppins-Regular;
  src: url("//cdn.shopify.com/s/files/1/1024/1659/t/57/assets/Poppins-Regular.ttf?v=4567717607137005820") format("truetype");
  font-display: swap; }

/* #2.2 Typographic Styles *************************************
--------------------------------------------------------------*/
body, input, textarea, button, select {
  font-size: 18px;
  line-height: 1.75em;
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif;;
  color: #222323;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  display: block;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;;
  font-weight: 400;
  line-height: 1.4;
  color:  #1c3041;
  text-rendering: optimizeLegibility;
}

h2 a, h3 a, h4 a, h5 a, h6 a, blockquote a, a {
  text-decoration: none;
  font-weight: inherit;
  font-style: inherit;
  color: inherit;
}

a { 
  box-shadow: inset 0px -6px 0px #D9FBFC; 
  cursor: pointer;
  transition: .25s ease-in-out;
}
a:hover, a:focus { box-shadow: inset 0px -6px 0px #7FF1F2; }

h1 { font-size: 56px; color: white; line-height: 1.25; margin-bottom: 64px; margin-top: 72px; }
h2 { font-size: 42px; }
h3 { font-size: 36px; }
h4 { font-size: 30px; }
h5 { font-size: 24px; color: #2B4162; text-transform: uppercase; letter-spacing: 1px; }
h6 { font-size: 20px; }

.blog-artical-bg h2, .blog-artical-bg h3, .blog-artical-bg h4, .blog-artical-bg h5 {
  margin-top: 1.5em;
  margin-bottom: 1em;
}
.blog-artical-bg h4 {margin-bottom:18px;}
.blog-artical-bg h5 {margin-bottom:12px;}

p {
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif;
  font-size:  18px;
  color: #000000;
  margin: 0 0 18px 0;
  text-rendering: optimizeLegibility;
}
p img {
  margin: 0; 
}

em {
  font-style: italic;
  font-family: inherit;
}
b, strong {
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;
  font-weight: bold;
  font-style:  inherit;
}
small {
  font-size: 0.9em;
}
sup, sub {
  position: relative;
  font-size: 70%;
  vertical-align: baseline;
}
sup { top: -0.5em; }
sub { bottom: -0.5em; }

blockquote {
  line-height: 1.45;
  margin: 0;
  margin-top: 32px;
  padding: 32px 0 24px;
  text-align: left;
  font-style: inherit;
  font-weight: bold;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif !important;
  font-size: 28px;
  color: #1C3041;
  position: relative;
}
blockquote p { 
  margin-bottom: 0; 
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}
blockquote:before {
  content: '';
  position: absolute;
  left: 0;
  height: 16px;
  width: 72px;
  background-color: #00E4E6;
  top: 0;
}

code, pre {
  background-color: #faf7f5;
  font-family: Consolas,monospace;
  font-size: 1em;
  border: 0 none;
  padding: 0 2px;
  color: #51ab62;
}
pre {
  overflow: auto;
  padding: 15px;
  margin: 0 0 30px;
}

figure {
  margin: 0;
  margin-bottom: 24px;
}
figcaption {
  font-size: 14px;
  text-align: center;
  line-height: 24px;
}


/*--------------------------------------------------------------
#3.0 - Global Layout
--------------------------------------------------------------*/
.main-content {
  display: block;
  padding-top: 30px;
}

@media screen and (min-width: 591px) {
  .wrapper {
    padding: 0 30px;
  }
  .main-content {
    padding-bottom: 40px;
  }
}
@media screen and (min-width: 769px) {
  .main-content {
    padding-top: 80px;
  }
}

.grid--full:after, .grid--rev:after,
.grid-uniform:after, .grid:after {
  content: "";
  display: table;
  clear: both;
}
.grid__item.clear {
  clear: both;
}
.grid, .grid--full,
.grid--rev, .grid-uniform {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-left: -15px;
}

@media screen and (min-width: 591px) {
  .grid, .grid--full,
  .grid--rev, .grid-uniform {
    margin-left: -30px;
  }
}

.grid__item {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  min-height: 1px;
  padding-left: 15px;
  vertical-align: top;
  width: 100%;
}

@media screen and (min-width: 591px) {
  .grid__item {
    padding-left: 30px;
  }
}

.grid--small {
  margin-left: -10px;
}
.grid--small .grid__item {
  padding-left: 10px;
}
.grid--rev {
  direction: rtl;
  text-align: left;
}
.grid--rev > .grid__item {
  direction: ltr;
  text-align: left;
  float: right;
}
.grid--full {
  margin-left: 0;
}
.lt-ie9 .grid--full {
  margin-left: 0;
}
.grid--full > .grid__item {
  padding-left: 0;
}
.one-whole { width: 100%; }
.one-half { width: 50%; }
.one-third { width: 33.333%; }
.two-thirds { width: 66.666%; }
.one-quarter { width: 25%; }
.two-quarters { width: 50%; }
.three-quarters { width: 75%; }
.one-fifth { width: 20%; }
.two-fifths { width: 40%; }
.three-fifths { width: 60%; }
.four-fifths { width: 80%; }
.one-sixth { width: 16.666%; }
.two-sixths { width: 33.333%; }
.three-sixths { width: 50%; }
.four-sixths { width: 66.666%; }
.five-sixths { width: 83.333%; }
.one-eighth { width: 12.5%; }
.two-eighths { width: 25%; }
.three-eighths { width: 37.5%; }
.four-eighths { width: 50%; }
.five-eighths { width: 62.5%; }
.six-eighths { width: 75%; }
.seven-eighths { width: 87.5%; }
.one-tenth { width: 10%; }
.two-tenths { width: 20%; }
.three-tenths { width: 30%; }
.four-tenths { width: 40%; }
.five-tenths { width: 50%; }
.six-tenths { width: 60%; }
.seven-tenths { width: 70%; }
.eight-tenths { width: 80%; }
.nine-tenths { width: 90%; }
.one-twelfth { width: 8.333%; }
.two-twelfths { width: 16.666%; }
.three-twelfths { width: 25%; }
.four-twelfths { width: 33.333%; }
.five-twelfths { width: 41.666%; }
.six-twelfths { width: 50%; }
.seven-twelfths { width: 58.333%; }
.eight-twelfths { width: 66.666%; }
.nine-twelfths { width: 75%; }
.ten-twelfths { width: 83.333%; }
.eleven-twelfths { width: 91.666%; }

@media only screen and (max-width: 590px) {
  .small--one-whole { width: 100%; }
  .small--one-half { width: 50%; }
  .small--one-third { width: 33.333%; }
  .small--two-thirds { width: 66.666%; }
  .small--one-quarter { width: 25%; }
  .small--two-quarters { width: 50%; }
  .small--three-quarters { width: 75%; }
  .small--one-fifth { width: 20%; }
  .small--two-fifths { width: 40%; }
  .small--three-fifths { width: 60%; }
  .small--four-fifths { width: 80%; }
  .small--one-sixth { width: 16.666%; }
  .small--two-sixths { width: 33.333%; }
  .small--three-sixths { width: 50%; }
  .small--four-sixths { width: 66.666%; }
  .small--five-sixths { width: 83.333%; }
  .small--one-eighth { width: 12.5%; }
  .small--two-eighths { width: 25%; }
  .small--three-eighths { width: 37.5%; }
  .small--four-eighths { width: 50%; }
  .small--five-eighths { width: 62.5%; }
  .small--six-eighths { width: 75%; }
  .small--seven-eighths { width: 87.5%; }
  .small--one-tenth { width: 10%; }
  .small--two-tenths { width: 20%; }
  .small--three-tenths { width: 30%; }
  .small--four-tenths { width: 40%; }
  .small--five-tenths { width: 50%; }
  .small--six-tenths { width: 60%; }
  .small--seven-tenths { width: 70%; }
  .small--eight-tenths { width: 80%; }
  .small--nine-tenths { width: 90%; }
  .small--one-twelfth { width: 8.333%; }
  .small--two-twelfths { width: 16.666%; }
  .small--three-twelfths { width: 25%; }
  .small--four-twelfths { width: 33.333%; }
  .small--five-twelfths { width: 41.666%; }
  .small--six-twelfths { width: 50%; }
  .small--seven-twelfths { width: 58.333%; }
  .small--eight-twelfths { width: 66.666%; }
  .small--nine-twelfths { width: 75%; }
  .small--ten-twelfths { width: 83.333%; }
  .small--eleven-twelfths { width: 91.666%; }

  .grid-uniform .small--five-tenths:nth-child(2n + 1),
  .grid-uniform .small--four-eighths:nth-child(2n + 1),
  .grid-uniform .small--four-twelfths:nth-child(3n + 1),
  .grid-uniform .small--one-fifth:nth-child(5n + 1),
  .grid-uniform .small--one-half:nth-child(2n + 1),
  .grid-uniform .small--one-quarter:nth-child(4n + 1),
  .grid-uniform .small--one-sixth:nth-child(6n + 1),
  .grid-uniform .small--one-third:nth-child(3n + 1),
  .grid-uniform .small--one-twelfth:nth-child(12n + 1),
  .grid-uniform .small--six-twelfths:nth-child(2n + 1),
  .grid-uniform .small--three-sixths:nth-child(2n + 1),
  .grid-uniform .small--three-twelfths:nth-child(4n + 1),
  .grid-uniform .small--two-eighths:nth-child(4n + 1),
  .grid-uniform .small--two-sixths:nth-child(3n + 1),
  .grid-uniform .small--two-twelfths:nth-child(6n + 1) {
    clear: both;
  }
}

@media only screen and (min-width: 591px) and (max-width: 768px) {
  .medium--one-whole { width: 100%; }
  .medium--one-half { width: 50%; }
  .medium--one-third { width: 33.333%; }
  .medium--two-thirds { width: 66.666%; }
  .medium--one-quarter { width: 25%; }
  .medium--two-quarters { width: 50%; }
  .medium--three-quarters { width: 75%; }
  .medium--one-fifth { width: 20%; }
  .medium--two-fifths { width: 40%; }
  .medium--three-fifths { width: 60%; }
  .medium--four-fifths { width: 80%; }
  .medium--one-sixth { width: 16.666%; }
  .medium--two-sixths { width: 33.333%; }
  .medium--three-sixths { width: 50%; }
  .medium--four-sixths { width: 66.666%; }
  .medium--five-sixths { width: 83.333%; }
  .medium--one-eighth { width: 12.5%; }
  .medium--two-eighths { width: 25%; }
  .medium--three-eighths { width: 37.5%; }
  .medium--four-eighths { width: 50%; }
  .medium--five-eighths { width: 62.5%; }
  .medium--six-eighths { width: 75%; }
  .medium--seven-eighths { width: 87.5%; }
  .medium--one-tenth { width: 10%; }
  .medium--two-tenths { width: 20%; }
  .medium--three-tenths { width: 30%; }
  .medium--four-tenths { width: 40%; }
  .medium--five-tenths { width: 50%; }
  .medium--six-tenths { width: 60%; }
  .medium--seven-tenths { width: 70%; }
  .medium--eight-tenths { width: 80%; }
  .medium--nine-tenths { width: 90%; }
  .medium--one-twelfth { width: 8.333%; }
  .medium--two-twelfths { width: 16.666%; }
  .medium--three-twelfths { width: 25%; }
  .medium--four-twelfths { width: 33.333%; }
  .medium--five-twelfths { width: 41.666%; }
  .medium--six-twelfths { width: 50%; }
  .medium--seven-twelfths { width: 58.333%; }
  .medium--eight-twelfths { width: 66.666%; }
  .medium--nine-twelfths { width: 75%; }
  .medium--ten-twelfths { width: 83.333%; }
  .medium--eleven-twelfths { width: 91.666%; }

  .grid-uniform .medium--five-tenths:nth-child(2n + 1),
  .grid-uniform .medium--four-eighths:nth-child(2n + 1),
  .grid-uniform .medium--four-twelfths:nth-child(3n + 1),
  .grid-uniform .medium--one-fifth:nth-child(5n + 1),
  .grid-uniform .medium--one-half:nth-child(2n + 1),
  .grid-uniform .medium--one-quarter:nth-child(4n + 1),
  .grid-uniform .medium--one-sixth:nth-child(6n + 1),
  .grid-uniform .medium--one-third:nth-child(3n + 1),
  .grid-uniform .medium--one-twelfth:nth-child(12n + 1),
  .grid-uniform .medium--six-twelfths:nth-child(2n + 1),
  .grid-uniform .medium--three-sixths:nth-child(2n + 1),
  .grid-uniform .medium--three-twelfths:nth-child(4n + 1),
  .grid-uniform .medium--two-eighths:nth-child(4n + 1),
  .grid-uniform .medium--two-sixths:nth-child(3n + 1),
  .grid-uniform .medium--two-twelfths:nth-child(6n + 1) {
    clear: both;
  }
}
@media only screen and (max-width: 768px) {
  .medium-down--one-whole { width: 100%; }
  .medium-down--one-half { width: 50%; }
  .medium-down--one-third { width: 33.333%; }
  .medium-down--two-thirds { width: 66.666%; }
  .medium-down--one-quarter { width: 25%; }
  .medium-down--two-quarters { width: 50%; }
  .medium-down--three-quarters { width: 75%; }
  .medium-down--one-fifth { width: 20%; }
  .medium-down--two-fifths { width: 40%; }
  .medium-down--three-fifths { width: 60%; }
  .medium-down--four-fifths { width: 80%; }
  .medium-down--one-sixth { width: 16.666%; }
  .medium-down--two-sixths { width: 33.333%; }
  .medium-down--three-sixths { width: 50%; }
  .medium-down--four-sixths { width: 66.666%; }
  .medium-down--five-sixths { width: 83.333%; }
  .medium-down--one-eighth { width: 12.5%; }
  .medium-down--two-eighths { width: 25%; }
  .medium-down--three-eighths { width: 37.5%; }
  .medium-down--four-eighths { width: 50%; }
  .medium-down--five-eighths { width: 62.5%; }
  .medium-down--six-eighths { width: 75%; }
  .medium-down--seven-eighths { width: 87.5%; }
  .medium-down--one-tenth { width: 10%; }
  .medium-down--two-tenths { width: 20%; }
  .medium-down--three-tenths { width: 30%; }
  .medium-down--four-tenths { width: 40%; }
  .medium-down--five-tenths { width: 50%; }
  .medium-down--six-tenths { width: 60%; }
  .medium-down--seven-tenths { width: 70%; }
  .medium-down--eight-tenths { width: 80%; }
  .medium-down--nine-tenths { width: 90%; }
  .medium-down--one-twelfth { width: 8.333%; }
  .medium-down--two-twelfths { width: 16.666%; }
  .medium-down--three-twelfths { width: 25%; }
  .medium-down--four-twelfths { width: 33.333%; }
  .medium-down--five-twelfths { width: 41.666%; }
  .medium-down--six-twelfths { width: 50%; }
  .medium-down--seven-twelfths { width: 58.333%; }
  .medium-down--eight-twelfths { width: 66.666%; }
  .medium-down--nine-twelfths { width: 75%; }
  .medium-down--ten-twelfths { width: 83.333%; }
  .medium-down--eleven-twelfths { width: 91.666%; }

  .grid-uniform .medium-down--five-tenths:nth-child(2n + 1),
  .grid-uniform .medium-down--four-eighths:nth-child(2n + 1),
  .grid-uniform .medium-down--four-twelfths:nth-child(3n + 1),
  .grid-uniform .medium-down--one-fifth:nth-child(5n + 1),
  .grid-uniform .medium-down--one-half:nth-child(2n + 1),
  .grid-uniform .medium-down--one-quarter:nth-child(4n + 1),
  .grid-uniform .medium-down--one-sixth:nth-child(6n + 1),
  .grid-uniform .medium-down--one-third:nth-child(3n + 1),
  .grid-uniform .medium-down--one-twelfth:nth-child(12n + 1),
  .grid-uniform .medium-down--six-twelfths:nth-child(2n + 1),
  .grid-uniform .medium-down--three-sixths:nth-child(2n + 1),
  .grid-uniform .medium-down--three-twelfths:nth-child(4n + 1),
  .grid-uniform .medium-down--two-eighths:nth-child(4n + 1),
  .grid-uniform .medium-down--two-sixths:nth-child(3n + 1),
  .grid-uniform .medium-down--two-twelfths:nth-child(6n + 1) {
    clear: both;
  }
}
@media only screen and (min-width: 769px) {
  .large--one-whole { width: 100%; }
  .large--one-half { width: 50%; }
  .large--one-third { width: 33.333%; }
  .large--two-thirds { width: 66.666%; }
  .large--one-quarter { width: 25%; }
  .large--two-quarters { width: 50%; }
  .large--three-quarters { width: 75%; }
  .large--one-fifth { width: 20%; }
  .large--two-fifths { width: 40%; }
  .large--three-fifths { width: 60%; }
  .large--four-fifths { width: 80%; }
  .large--one-sixth { width: 16.666%; }
  .large--two-sixths { width: 33.333%; }
  .large--three-sixths { width: 50%; }
  .large--four-sixths { width: 66.666%; }
  .large--five-sixths { width: 83.333%; }
  .large--one-eighth { width: 12.5%; }
  .large--two-eighths { width: 25%; }
  .large--three-eighths { width: 37.5%; }
  .large--four-eighths { width: 50%; }
  .large--five-eighths { width: 62.5%; }
  .large--six-eighths { width: 75%; }
  .large--seven-eighths { width: 87.5%; }
  .large--one-tenth { width: 10%; }
  .large--two-tenths { width: 20%; }
  .large--three-tenths { width: 30%; }
  .large--four-tenths { width: 40%; }
  .large--five-tenths { width: 50%; }
  .large--six-tenths { width: 60%; }
  .large--seven-tenths { width: 70%; }
  .large--eight-tenths { width: 80%; }
  .large--nine-tenths { width: 90%; }
  .large--one-twelfth { width: 8.333%; }
  .large--two-twelfths { width: 16.666%; }
  .large--three-twelfths { width: 25%; }
  .large--four-twelfths { width: 33.333%; }
  .large--five-twelfths { width: 41.666%; }
  .large--six-twelfths { width: 50%; }
  .large--seven-twelfths { width: 58.333%; }
  .large--eight-twelfths { width: 66.666%; }
  .large--nine-twelfths { width: 75%; }
  .large--ten-twelfths { width: 83.333%; }
  .large--eleven-twelfths { width: 91.666%; }

  .grid-uniform .large--five-tenths:nth-child(2n + 1),
  .grid-uniform .large--four-eighths:nth-child(2n + 1),
  .grid-uniform .large--four-twelfths:nth-child(3n + 1),
  .grid-uniform .large--one-fifth:nth-child(5n + 1),
  .grid-uniform .large--one-half:nth-child(2n + 1),
  .grid-uniform .large--one-quarter:nth-child(4n + 1),
  .grid-uniform .large--one-sixth:nth-child(6n + 1),
  .grid-uniform .large--one-third:nth-child(3n + 1),
  .grid-uniform .large--one-twelfth:nth-child(12n + 1),
  .grid-uniform .large--six-twelfths:nth-child(2n + 1),
  .grid-uniform .large--three-sixths:nth-child(2n + 1),
  .grid-uniform .large--three-twelfths:nth-child(4n + 1),
  .grid-uniform .large--two-eighths:nth-child(4n + 1),
  .grid-uniform .large--two-sixths:nth-child(3n + 1),
  .grid-uniform .large--two-twelfths:nth-child(6n + 1) {
    clear: both;
  }
}

[class*="push--"] { position: relative; }
.push--one-whole { left: 100%; }
.push--one-half { left: 50%; }
.push--one-third { left: 33.333%; }
.push--two-thirds { left: 66.666%; }
.push--one-quarter { left: 25%; }
.push--two-quarters { left: 50%; }
.push--three-quarters { left: 75%; }
.push--one-fifth { left: 20%; }
.push--two-fifths { left: 40%; }
.push--three-fifths { left: 60%; }
.push--four-fifths { left: 80%; }
.push--one-sixth { left: 16.666%; }
.push--two-sixths { left: 33.333%; }
.push--three-sixths { left: 50%; }
.push--four-sixths { left: 66.666%; }
.push--five-sixths { left: 83.333%; }
.push--one-eighth { left: 12.5%; }
.push--two-eighths { left: 25%; }
.push--three-eighths { left: 37.5%; }
.push--four-eighths { left: 50%; }
.push--five-eighths { left: 62.5%; }
.push--six-eighths { left: 75%; }
.push--seven-eighths { left: 87.5%; }
.push--one-tenth { left: 10%; }
.push--two-tenths { left: 20%; }
.push--three-tenths { left: 30%; }
.push--four-tenths { left: 40%; }
.push--five-tenths { left: 50%; }
.push--six-tenths { left: 60%; }
.push--seven-tenths { left: 70%; }
.push--eight-tenths { left: 80%; }
.push--nine-tenths { left: 90%; }
.push--one-twelfth { left: 8.333%; }
.push--two-twelfths { left: 16.666%; }
.push--three-twelfths { left: 25%; }
.push--four-twelfths { left: 33.333%; }
.push--five-twelfths { left: 41.666%; }
.push--six-twelfths { left: 50%; }
.push--seven-twelfths { left: 58.333%; }
.push--eight-twelfths { left: 66.666%; }
.push--nine-twelfths { left: 75%; }
.push--ten-twelfths { left: 83.333%; }
.push--eleven-twelfths { left: 91.666%; }

@media only screen and (min-width: 591px) and (max-width: 768px) {
  .push--medium--one-whole { left: 100%; }
  .push--medium--one-half { left: 50%; }
  .push--medium--one-third { left: 33.333%; }
  .push--medium--two-thirds { left: 66.666%; }
  .push--medium--one-quarter { left: 25%; }
  .push--medium--two-quarters { left: 50%; }
  .push--medium--three-quarters { left: 75%; }
  .push--medium--one-fifth { left: 20%; }
  .push--medium--two-fifths { left: 40%; }
  .push--medium--three-fifths { left: 60%; }
  .push--medium--four-fifths { left: 80%; }
  .push--medium--one-sixth { left: 16.666%; }
  .push--medium--two-sixths { left: 33.333%; }
  .push--medium--three-sixths { left: 50%; }
  .push--medium--four-sixths { left: 66.666%; }
  .push--medium--five-sixths { left: 83.333%; }
  .push--medium--one-eighth { left: 12.5%; }
  .push--medium--two-eighths { left: 25%; }
  .push--medium--three-eighths { left: 37.5%; }
  .push--medium--four-eighths { left: 50%; }
  .push--medium--five-eighths { left: 62.5%; }
  .push--medium--six-eighths { left: 75%; }
  .push--medium--seven-eighths { left: 87.5%; }
  .push--medium--one-tenth { left: 10%; }
  .push--medium--two-tenths { left: 20%; }
  .push--medium--three-tenths { left: 30%; }
  .push--medium--four-tenths { left: 40%; }
  .push--medium--five-tenths { left: 50%; }
  .push--medium--six-tenths { left: 60%; }
  .push--medium--seven-tenths { left: 70%; }
  .push--medium--eight-tenths { left: 80%; }
  .push--medium--nine-tenths { left: 90%; }
  .push--medium--one-twelfth { left: 8.333%; }
  .push--medium--two-twelfths { left: 16.666%; }
  .push--medium--three-twelfths { left: 25%; }
  .push--medium--four-twelfths { left: 33.333%; }
  .push--medium--five-twelfths { left: 41.666%; }
  .push--medium--six-twelfths { left: 50%; }
  .push--medium--seven-twelfths { left: 58.333%; }
  .push--medium--eight-twelfths { left: 66.666%; }
  .push--medium--nine-twelfths { left: 75%; }
  .push--medium--ten-twelfths { left: 83.333%; }
  .push--medium--eleven-twelfths { left: 91.666%; }
}
@media only screen and (max-width: 768px) {
  .push--medium-down--one-whole { left: 100%; }
  .push--medium-down--one-half { left: 50%; }
  .push--medium-down--one-third { left: 33.333%; }
  .push--medium-down--two-thirds { left: 66.666%; }
  .push--medium-down--one-quarter { left: 25%; }
  .push--medium-down--two-quarters { left: 50%; }
  .push--medium-down--three-quarters { left: 75%; }
  .push--medium-down--one-fifth { left: 20%; }
  .push--medium-down--two-fifths { left: 40%; }
  .push--medium-down--three-fifths { left: 60%; }
  .push--medium-down--four-fifths { left: 80%; }
  .push--medium-down--one-sixth { left: 16.666%; }
  .push--medium-down--two-sixths { left: 33.333%; }
  .push--medium-down--three-sixths { left: 50%; }
  .push--medium-down--four-sixths { left: 66.666%; }
  .push--medium-down--five-sixths { left: 83.333%; }
  .push--medium-down--one-eighth { left: 12.5%; }
  .push--medium-down--two-eighths { left: 25%; }
  .push--medium-down--three-eighths { left: 37.5%; }
  .push--medium-down--four-eighths { left: 50%; }
  .push--medium-down--five-eighths { left: 62.5%; }
  .push--medium-down--six-eighths { left: 75%; }
  .push--medium-down--seven-eighths { left: 87.5%; }
  .push--medium-down--one-tenth { left: 10%; }
  .push--medium-down--two-tenths { left: 20%; }
  .push--medium-down--three-tenths { left: 30%; }
  .push--medium-down--four-tenths { left: 40%; }
  .push--medium-down--five-tenths { left: 50%; }
  .push--medium-down--six-tenths { left: 60%; }
  .push--medium-down--seven-tenths { left: 70%; }
  .push--medium-down--eight-tenths { left: 80%; }
  .push--medium-down--nine-tenths { left: 90%; }
  .push--medium-down--one-twelfth { left: 8.333%; }
  .push--medium-down--two-twelfths { left: 16.666%; }
  .push--medium-down--three-twelfths { left: 25%; }
  .push--medium-down--four-twelfths { left: 33.333%; }
  .push--medium-down--five-twelfths { left: 41.666%; }
  .push--medium-down--six-twelfths { left: 50%; }
  .push--medium-down--seven-twelfths { left: 58.333%; }
  .push--medium-down--eight-twelfths { left: 66.666%; }
  .push--medium-down--nine-twelfths { left: 75%; }
  .push--medium-down--ten-twelfths { left: 83.333%; }
  .push--medium-down--eleven-twelfths { left: 91.666%; }
}
@media only screen and (min-width: 769px) {
  .push--large--one-whole { left: 100%; }
  .push--large--one-half { left: 50%; }
  .push--large--one-third { left: 33.333%; }
  .push--large--two-thirds { left: 66.666%; }
  .push--large--one-quarter { left: 25%; }
  .push--large--two-quarters { left: 50%; }
  .push--large--three-quarters { left: 75%; }
  .push--large--one-fifth { left: 20%; }
  .push--large--two-fifths { left: 40%; }
  .push--large--three-fifths { left: 60%; }
  .push--large--four-fifths { left: 80%; }
  .push--large--one-sixth { left: 16.666%; }
  .push--large--two-sixths { left: 33.333%; }
  .push--large--three-sixths { left: 50%; }
  .push--large--four-sixths { left: 66.666%; }
  .push--large--five-sixths { left: 83.333%; }
  .push--large--one-eighth { left: 12.5%; }
  .push--large--two-eighths { left: 25%; }
  .push--large--three-eighths { left: 37.5%; }
  .push--large--four-eighths { left: 50%; }
  .push--large--five-eighths { left: 62.5%; }
  .push--large--six-eighths { left: 75%; }
  .push--large--seven-eighths { left: 87.5%; }
  .push--large--one-tenth { left: 10%; }
  .push--large--two-tenths { left: 20%; }
  .push--large--three-tenths { left: 30%; }
  .push--large--four-tenths { left: 40%; }
  .push--large--five-tenths { left: 50%; }
  .push--large--six-tenths { left: 60%; }
  .push--large--seven-tenths { left: 70%; }
  .push--large--eight-tenths { left: 80%; }
  .push--large--nine-tenths { left: 90%; }
  .push--large--one-twelfth { left: 8.333%; }
  .push--large--two-twelfths { left: 16.666%; }
  .push--large--three-twelfths { left: 25%; }
  .push--large--four-twelfths { left: 33.333%; }
  .push--large--five-twelfths { left: 41.666%; }
  .push--large--six-twelfths { left: 50%; }
  .push--large--seven-twelfths { left: 58.333%; }
  .push--large--eight-twelfths { left: 66.666%; }
  .push--large--nine-twelfths { left: 75%; }
  .push--large--ten-twelfths { left: 83.333%; }
  .push--large--eleven-twelfths { left: 91.666%; }
}

.flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

/* #3.1 Visibility *********************************************
--------------------------------------------------------------*/
.show { display: block !important; }
.hide { display: none !important; }

.mob-only {
  display: none;
}
.desk-only {
  display: block;
}

@media only screen and (max-width: 590px) {
  .small--show { display: block !important; }
  .small--hide { display: none !important; }
}

@media only screen and (min-width: 591px) and (max-width: 768px) {
  .medium--show { display: block !important; }
  .medium--hide { display: none !important; }
}

@media only screen and (max-width: 768px) {
  .medium-down--show { display: block !important; }
  .medium-down--hide { display: none !important; }
}

@media only screen and (min-width: 769px) {
  .large--show { display: block !important; }
  .large--hide { display: none !important; }
}

.visually-hidden {
  clip: rect(0 0 0 0);
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}

/* #3.2 Alignments & Clearings *********************************
--------------------------------------------------------------*/
.clearfix:after {
  content: '';
  display: table;
  clear: both;
}

.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.text-center, .ctn { text-align: center !important; }
.left { float: left !important; }
.right { float: right !important; }

@media only screen and (max-width: 590px) {
  .small--text-left { text-align: left !important; }
  .small--text-right { text-align: right !important; }
  .small--text-center { text-align: center !important; }
  .small--left { float: left !important; }
  .small--right { float: right !important; }
}

@media only screen and (min-width: 591px) and (max-width: 768px) {
  .medium--text-left { text-align: left !important; }
  .medium--text-right { text-align: right !important; }
  .medium--text-center { text-align: center !important; }
  .medium--left { float: left !important; }
  .medium--right { float: right !important; }
}

@media only screen and (max-width: 768px) {
  .medium-down--text-left { text-align: left !important; }
  .medium-down--text-right { text-align: right !important; }
  .medium-down--text-center { text-align: center !important; }
  .medium-down--left { float: left !important; }
  .medium-down--right { float: right !important; }
}

@media only screen and (min-width: 769px) {
  .large--text-left { text-align: left !important; }
  .large--text-right { text-align: right !important; }
  .large--text-center { text-align: center !important; }
  .large--left { float: left !important; }
  .large--right { float: right !important; }
}


/*--------------------------------------------------------------
#4.0 - Navigation
--------------------------------------------------------------*/
div[data-section-id="header"] {
  position: absolute;
  z-index: 3;
  width:  100%;
}
.site-header { padding: 15px 0 0; }
.site-header a { box-shadow: none; }
.site-header a:hover, .site-header a:focus { color: #cbff00; }
.site-header a:focus { outline: #cbff00 dotted thin; }

.site-header .grid--table {
  display: table;
  table-layout: fixed;
  width: 100%;
}
.site-header .grid--table > .grid__item {
  float: none;
  display: table-cell;
  vertical-align: middle;
}
.site-header__logo {
  text-align: center;
  margin: 0 auto;
}
.site-header__logo a,
.site-header__logo a:hover {
  text-decoration: none;
  color: #222323;
}
.site-header__logo a.site-header__logo-link {
  margin: 0 auto;
}
.site-header__logo a,
.site-header__logo img {
  display: block;
}
.site-header__logo img {
  margin: 0 auto;
}
.site-nav,
.site-nav--mobile {
  cursor: default;
  margin: 0;
  margin-left: -15px;
}
.site-nav__item {
  position: relative;
  display: inline-block;
  margin: 0;
}
.site-nav__item li {
  display: block;
}
.site-nav--mobile {
  margin-left: -10px;
}
.site-nav--mobile.text-right {
  margin: 0 -10px 0 0;
}
.site-nav__link {
  display: inline-block;
  text-decoration: none;
  padding: 15px;
  white-space: nowrap;
  color: #222323;
  font-size: 0.875em;
}
.site-nav__link .icon-arrow-down {
  position: relative;
  top: -2px;
  padding-left: 7.5px;
  font-size: 10px;
}
.site-nav__dropdown-link .icon-arrow-down {
  position: absolute;
  top: 50%;
  right: 15px;
  font-size: 10px;
  -webkit-transform: translateY(-50%) rotate(-90deg);
  -moz-transform: translateY(-50%) rotate(-90deg);
  -ms-transform: translateY(-50%) rotate(-90deg);
  -o-transform: translateY(-50%) rotate(-90deg);
  transform: translateY(-50%) rotate(-90deg);
}
.site-nav__dropdown-grandchild .site-nav__dropdown-link {
  white-space: normal;
}
.site-nav__link--icon {
  padding-left: 7.5px;
  padding-right: 7.5px;
}
.site-nav--mobile .site-nav__link {
  display: inline-block;
}
.site-nav--mobile .icon {
  font-size: 1.875em;
}
.site-nav__dropdown {
  opacity: 0;
  display: block;
  position: absolute;
  left: 0;
  margin: 0;
  z-index: 5;
  pointer-events: none;
}
.site-nav__dropdown a {
  background-color: #fff;
  text-align: left;
}
.site-nav__dropdown a:active,
.site-nav__dropdown a:hover {
  background-color: #e6e6e6;
}
.site-nav__dropdown.nav-outside {
  left: auto;
  right: 0;
}
.site-nav__dropdown-grandchild {
  position: absolute;
  top: -10px;
  left: 100%;
  width: 100%;
  margin: 0;
  z-index: 5;
  opacity: 0;
  pointer-events: none;
}
.site-nav__dropdown-grandchild a {
  background-color: #fff;
}
.site-nav__dropdown-grandchild a:active,
.site-nav__dropdown-grandchild a:hover {
  background-color: #e6e6e6;
}
.site-nav__dropdown-grandchild ul {
  background-color: #fff;
  padding: 10px 0;
  margin: 0 0 0 2px;
}
.site-nav__dropdown-grandchild.nav-outside {
  left: -100%;
}
.mobile-nav {
  margin: -15px -15px 0 -15px;
}
.mobile-nav li {
  margin-bottom: 0;
  list-style: none;
}
.mobile-nav__search {
  padding: 15px;
}
.mobile-nav__item {
  position: relative;
  display: block;
}
.mobile-nav > .mobile-nav__item {
  background-color: #1c1d1d;
}
.mobile-nav__item:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 15px;
  right: 15px;
  border-bottom: 1px solid #fff;
}
.mobile-nav > .mobile-nav__item:last-child:after {
  display: none;
}
.mobile-nav__item a {
  display: block;
  font-size: 22px;
}
.mobile-nav__subsublist .mobile-nav__item a {
  padding-left: 45px;
  font-size: 16px;
}
.mobile-nav__item a,
.mobile-nav__toggle button {
  color: #fff;
  padding: 15px;
  text-decoration: none;
}
.mobile-nav__item a:active,
.mobile-nav__item a:focus,
.mobile-nav__toggle button:active,
.mobile-nav__toggle button:focus {
  color: #d9d9d9;
  background-color: #0f1010;
}
.mobile-nav__item--secondary a {
  font-size: 16px;
  color: #bfbfbf;
  line-height: 1.2;
  padding-top: 10px;
  padding-bottom: 10px;
}
.mobile-nav__item--secondary:after {
  display: none;
}
.mobile-nav__spacer {
  height: 0;
  padding: 5px;
}
.mobile-nav__has-sublist {
  display: table;
  width: 100%;
}
.mobile-nav__has-sublist .mobile-nav__link {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
}
.mobile-nav__toggle {
  display: table-cell;
  vertical-align: middle;
  width: 1%;
}
.mobile-nav__toggle-open {
  display: block;
}
.mobile-nav--expanded .mobile-nav__toggle-open {
  display: none;
}
.mobile-nav__toggle-close {
  display: none;
}
.mobile-nav--expanded .mobile-nav__toggle-close {
  display: block;
}
.mobile-nav__sublist {
  margin: 0;
  display: none;
}
.mobile-nav__sublist .mobile-nav__item:after {
  top: 0;
  bottom: auto;
}
.mobile-nav__sublist .mobile-nav__link {
  padding-left: 30px;
  font-weight: 400;
}
@media screen and (min-width: 769px) {
  .site-nav__link--icon .icon {
    font-size: 1.375em;
  }
}

/* Module | Theme Header and Navigation Overrides */
@media screen and (max-width: 768px) {
  .site-header {
    padding: 0;
  }
  .site-header .grid--table {
    height: 80px;
  }
}

.site-nav--active .site-nav__link:hover, .site-nav--active .site-nav__link:focus,
.site-nav-child--active .site-nav__link:hover, .site-nav-child--active .site-nav__link:focus,
.site-nav__dropdown .site-nav--active a:hover, .site-nav__dropdown .site-nav--active a:focus,
.site-nav__grandchild-dropdown .site-nav--active a:hover, .site-nav__grandchild-dropdown .site-nav--active a:focus,
.mobile-nav .site-nav--active:hover, .mobile-nav .site-nav--active:focus,
.mobile-nav .site-nav-child--active > div > .mobile-nav__link:hover, .mobile-nav .site-nav-child--active > div > .mobile-nav__link:focus {
  color: #fff;
}
.site-nav--active .site-nav__link span, .site-nav-child--active .site-nav__link span,
.site-nav__dropdown .site-nav--active a span, .site-nav__grandchild-dropdown .site-nav--active a span,
.mobile-nav .site-nav--active span, .mobile-nav .site-nav-child--active > div > .mobile-nav__link span {
  position: relative;
}
.site-nav--active .site-nav__link span::before, .site-nav-child--active .site-nav__link span::before,
.site-nav__dropdown .site-nav--active a span::before, .site-nav__grandchild-dropdown .site-nav--active a span::before,
.mobile-nav .site-nav--active span::before, .mobile-nav .site-nav-child--active > div > .mobile-nav__link span::before {
  content: "";
  background-color: #fff;
  display: inline-block;
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: -8px;
  left: 0;
}
.site-nav__dropdown .site-nav--active a span::before, .site-nav__grandchild-dropdown .site-nav--active a span::before {
  height: 1px;
  bottom: -6px;
}

/* Text Shop Name */
.site-header__logo {
  font-size: 1.25em;
}
@media screen and (min-width: 769px) {
  .site-header__logo {
    text-align: left;
    font-size: 1.5625em;
  }
}
@media screen and (max-width: 768px) {
  .site-header__logo img {
    max-height: 65px;
    margin-top: 10px;
    margin-bottom: 10px;
  }
}

.site-header__logo a, .header-logo a {
  transition: color 0.2s;
  font-family: "Montserrat", "HelveticaNeue", "Helvetica Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.site-header__logo img {
  max-width: 500px;
  width: 150px;
}

/* #4.1 Basic Navigation Styles ********************************
--------------------------------------------------------------*/
.site-nav, .site-nav--open {
  white-space: nowrap;
}
.no-js .site-nav, .site-nav.site-nav--init, .no-js .site-nav--open, .site-nav--open.site-nav--init {
  opacity: 1;
  transition: color 0.2s, opacity 0.1s;
}

.site-nav__item {
  white-space: normal;
  padding: 0;
}
.site-nav__link {
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif;
  transition: color 0.2s;
  font-size: 0.875em;
}
.site-nav--has-dropdown > a {
  position: relative;
  z-index: 6;
}
.site-nav--has-dropdown:hover > a,
.site-nav--has-dropdown > a.nav-focus, .site-nav--has-dropdown.nav-hover > a {
  color: #fff;
  background-color: transparent;
  opacity: 1;
  transition: none;
}
.site-nav--has-dropdown:hover > a:before,
.site-nav--has-dropdown > a.nav-focus:before, .site-nav--has-dropdown.nav-hover > a:before {
  content: '';
  position: absolute;
  left: 15px;
  right: 30px;
  bottom: 0;
  display: block;
  background-color: #222323;
  height: 0;
  z-index: 6;
}
.site-nav--has-dropdown.site-nav--has-dropdown-grandchild a:before {
  display: none;
}

/* Dropdown Animation */
.site-nav__dropdown {
  background-color: white;
  min-width: 100%;
  padding: 10px 0;
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.09);
  -webkit-transform: translate3d(0px, -12px, 0px);
  -moz-transform: translate3d(0px, -12px, 0px);
  -ms-transform: translate3d(0px, -12px, 0px);
  -o-transform: translate3d(0px, -12px, 0px);
  transform: translate3d(0px, -12px, 0px);
}
.supports-no-touch .site-nav--has-dropdown:hover .site-nav__dropdown, .site-nav--has-dropdown.nav-hover .site-nav__dropdown, .nav-focus + .site-nav__dropdown {
  opacity: 1;
  pointer-events: initial;
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}
.supports-no-touch .site-nav--has-dropdown:hover .site-nav__dropdown, .site-nav--has-dropdown.nav-hover .site-nav__dropdown {
  transition: transform 300ms cubic-bezier(0.2, .06, .05, .95);
}
.site-nav__dropdown-grandchild {
  min-width: 100%;
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.09);
  -webkit-transform: translate3d(-12px, 0px, 0px);
  -moz-transform: translate3d(-12px, 0px, 0px);
  -ms-transform: translate3d(-12px, 0px, 0px);
  -o-transform: translate3d(-12px, 0px, 0px);
  transform: translate3d(-12px, 0px, 0px);
}
.nav-outside + .site-nav__dropdown-grandchild {
  -webkit-transform: translate3d(12px, 0px, 0px);
  -moz-transform: translate3d(12px, 0px, 0px);
  -ms-transform: translate3d(12px, 0px, 0px);
  -o-transform: translate3d(12px, 0px, 0px);
  transform: translate3d(12px, 0px, 0px);
}
.supports-no-touch .site-nav--has-dropdown-grandchild:hover .site-nav__dropdown-grandchild, .site-nav--has-dropdown-grandchild.nav-hover .site-nav__dropdown-grandchild, .nav-focus + .site-nav__dropdown-grandchild {
  opacity: 1;
  pointer-events: initial;
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}
.supports-no-touch .site-nav--has-dropdown-grandchild:hover .site-nav__dropdown-grandchild, .site-nav--has-dropdown-grandchild.nav-hover .site-nav__dropdown-grandchild {
  transition: transform 300ms cubic-bezier(0.2, .06, .05, .95);
}

/* Submenu items */
.site-nav__dropdown a, .site-nav__grandchild-dropdown a {
  background-color: transparent;
  color: #222323;
}
.site-nav__dropdown a:hover, .site-nav__dropdown a:active, .site-nav__dropdown a:focus,
.site-nav__grandchild-dropdown a:hover,
.site-nav__grandchild-dropdown a:active,
.site-nav__grandchild-dropdown a:focus {
  background-color: transparent;
  color: #a26b25;
}
.site-nav__dropdown-link {
  font-style: italic;
  display: block;
  white-space: nowrap;
  padding: 5px 15px;
  font-size: 1em;
}
.site-nav--has-grandchildren .site-nav__dropdown-link {
  padding-right: 45px;
}

/* Compressed nav if too many links */
.site-nav--compress .site-nav__item:not(.site-nav__item--compressed) {
  display: none;
}
@media screen and (min-width: 769px) {
  .site-nav--open {
    display: none;
  }
}
.site-nav--open.site-nav--open__display {
  display: inline-block;
}

/* Search bar */
.site-nav--search__bar {
  vertical-align: middle;
  padding: 0 10px 7px 0;
}
.site-nav--search__bar input {
  background-color: #f6f6f6;
}

a.hire-button.button.site-nav__link {
  display: inline-block;
  vertical-align: middle;
  padding: 10px 30px;
  margin-left: 10px;
  background: linear-gradient(75deg, #1c3041 0% 50%, #d8ff32 50% 100%) 100% 50%/220% 110% no-repeat #d8ff32;
  transition: all .3s ease-in-out;
}
a.hire-button.button.site-nav__link:hover, a.hire-button.button.site-nav__link:focus {
  background-position: 1% 50%;
  color: white;
}

.site-nav--has-dropdown:hover > a, .site-nav--has-dropdown > a.nav-focus, .site-nav--has-dropdown.nav-hover > a {
  color: #cbff00;
  background-color: #173749;
}
.site-nav--has-dropdown:hover > a:before, .site-nav--has-dropdown > a.nav-focus:before, .site-nav--has-dropdown.nav-hover > a:before {
  height: 0;
}
.site-nav__link, .site-nav__dropdown a, .site-nav__grandchild-dropdown a {
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;
  font-size: 12px;
  padding: 3px 16px;
  color: white;
  font-style: normal;
  text-transform: uppercase;
  margin-top: -3px;
  margin-bottom: -3px;
}
.site-nav__item .button {
  font-size: 12px;
}
.site-nav__dropdown {
  background-color: #173749;
  box-shadow: none;
}
.site-nav__dropdown li {
  margin: -3px 0 calc(.25em - 3px);
  padding: 0;
}
.site-nav__dropdown li a {
  margin: 0;
}

li.site-nav__item.site-nav--has-dropdown.nav-hover {
  background: #09374b;
}

.site-nav__dropdown a:hover, .site-nav__dropdown a:active, .site-nav__dropdown a:focus, .site-nav__grandchild-dropdown a:hover, .site-nav__grandchild-dropdown a:active, .site-nav__grandchild-dropdown a:focus {
  background-color: transparent;
  color: #cbff00;
}

i.fas.fa-plus, i.fas.fa-minus {
  color: #d7ff31;
}
.icon-plus:before, .icon-minus:before {
  color: #d7ff31;
}
.mobile-nav__item:after {
  border-bottom: 0;
}
.hire-btn-cont-mob {
  text-align: right;
}

.button.hire-button {
  color: black;
}
.button.hire-button-mob {
  font-size: 8px;
  text-align: right;
  vertical-align: middle;
  padding: 5px 9px;
  color: black;
}
.button.hire-button-mob:after {
  height: 22px;
}
.button.hire-button-mob:hover:after {
  height: 100%;
}
.zoom {
  transition: transform .2s;
}
.zoom:hover { /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  transform: scale(1.5);
}

/* #4.2 Mobile Navigation Styles *******************************
--------------------------------------------------------------*/
.burger-icon {
  display: block;
  height: 2px;
  width: 23px;
  left: 25px;
  margin-left: -9px;
  position: absolute;
  transition: all 0.25s ease-out;
  background: white;
}

.js-drawer-open {
  overflow: hidden;
}
.drawer {
  display: none;
  position: fixed;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  top: 0;
  bottom: 0;
  padding: 0 15px 15px;
  max-width: 95%;
  z-index: 10;
  color: #fff;
  background-color: #1c1d1d;
  transition: all 0.35s cubic-bezier(0.46, 0.01, 0.32, 1);
}
@media screen and (min-width: 769px) {
  .drawer {
    padding: 0 30px 30px;
  }
}
.drawer a {
  color: #fff;
}
.drawer a:hover {
  color: #fff;
}
.drawer input[type="email"],
.drawer input[type="number"],
.drawer input[type="text"],
.drawer textarea {
  border-color: #fff;
}
.drawer .btn--secondary {
  background-color: #d7ff31;
  color: #000;
}
.drawer--left {
  width: 300px;
  left: -300px;
}
.js-drawer-open-left .drawer--left {
  display: block;
  -webkit-transform: translateX(300px);
  -moz-transform: translateX(300px);
  -ms-transform: translateX(300px);
  -o-transform: translateX(300px);
  transform: translateX(300px);
}
.lt-ie9 .js-drawer-open-left .drawer--left {
  left: 0;
}
.drawer--right {
  width: 300px;
  right: -300px;
}
@media screen and (min-width: 591px) {
  .drawer--right {
    width: 400px;
    right: -400px;
  }
}
.js-drawer-open-right .drawer--right {
  display: block;
  -webkit-transform: translateX(-300px);
  -moz-transform: translateX(-300px);
  -ms-transform: translateX(-300px);
  -o-transform: translateX(-300px);
  transform: translateX(-300px);
}
@media screen and (min-width: 591px) {
  .js-drawer-open-right .drawer--right {
    -webkit-transform: translateX(-400px);
    -moz-transform: translateX(-400px);
    -ms-transform: translateX(-400px);
    -o-transform: translateX(-400px);
    transform: translateX(-400px);
  }
}
.lt-ie9 .js-drawer-open-right .drawer--right {
  right: 0;
}

.page-container {
  overflow: hidden;
  transition: all 0.35s cubic-bezier(0.46, 0.01, 0.32, 1);
}
.js-drawer-open-left .page-container {
  -webkit-transform: translateX(300px);
  -moz-transform: translateX(300px);
  -ms-transform: translateX(300px);
  -o-transform: translateX(300px);
  transform: translateX(300px);
}
.js-drawer-open-right .page-container {
  -webkit-transform: translateX(-300px);
  -moz-transform: translateX(-300px);
  -ms-transform: translateX(-300px);
  -o-transform: translateX(-300px);
  transform: translateX(-300px);
}
@media screen and (min-width: 591px) {
  .js-drawer-open-right .page-container {
    -webkit-transform: translateX(-400px);
    -moz-transform: translateX(-400px);
    -ms-transform: translateX(-400px);
    -o-transform: translateX(-400px);
    transform: translateX(-400px);
  }
}
.js-drawer-open .page-container:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 20;
}
.drawer__header {
  display: table;
  height: 80px;
  width: 100%;
  margin-bottom: 15px;
  border-bottom: 1px solid #fff;
}
.drawer__close,
.drawer__title {
  display: table-cell;
  vertical-align: middle;
}
.drawer__title {
  width: 100%;
}
.drawer__close {
  width: 1%;
  text-align: center;
}
.drawer__close-button {
  position: relative;
  right: -20px;
  height: 100%;
  padding: 0 20px;
  color: inherit;
}
.drawer__close-button:active {
  background-color: #0f1010;
}
.drawer__close--left {
  text-align: left;
}
.drawer__close--left .drawer__close-button {
  right: auto;
  left: -20px;
}
.supports-csstransforms .drawer--is-loading .drawer__cart {
  min-height: 100px;
}
.supports-csstransforms .drawer--is-loading .drawer__cart:after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  position: absolute;
  left: 50%;
  top: 60px;
  margin-left: -12px;
  border-radius: 50%;
  border: 3px solid #fff;
  border-top-color: transparent;
  -webkit-animation: spin 1s infinite linear;
  -moz-animation: spin 1s infinite linear;
  -o-animation: spin 1s infinite linear;
  animation: spin 1s infinite linear;
}

.js-drawer-open-left .burger-icon {
  width: 24px;
  top: calc(50% - 1px);
  left: calc(50% - 4px);
}

.mobile-nav__item a, .mobile-nav__toggle button {
  color: #fff;
  padding: 15px;
  text-decoration: none;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;
  text-transform: uppercase;
  font-size: 18px;
}

.drawer, .mobile-nav > .mobile-nav__item {
  background-color: #243746;
}
.mobile-nav__sublist a.mobile-nav__link:before {
  content: '';
  width: 20px;
  height: 2px;
  background: #00d7e1;
  position: relative;
  display: inline-block;
  top: -5px;
}


@media screen and (min-width: 769px) {
  .burger-icon {
    width: 20px;
    left: 27px;
    margin-left: -12px;
  }
  .js-drawer-open-left .burger-icon {
    width: 25px;
    top: calc(50% - 1px);
    left: calc(50% - 2px);
  }
}

.burger-icon--top {
  top: 17px;
}
.js-drawer-open-left .burger-icon--top {
  top: 25px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.burger-icon--mid {
  top: 24px;
}
.js-drawer-open-left .burger-icon--mid {
  opacity: 0;
}
.burger-icon--bottom {
  top: 31px;
}
.js-drawer-open-left .burger-icon--bottom {
  top: 25px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.site-nav__link--burger {
  width: 50px;
  height: 50px;
  padding: 0;
  text-align: center;
  line-height: 50px;
  background-color: transparent;
  border: 0;
  position: relative;
  top: 4px;
  transition: transform 0.15s ease-out;
}
.site-nav__link--burger svg {
  width: 20px;
  height: 30px;
}
.site-nav__link--burger::after {
  border-color: #000;
}
.burger-icon {
  width: 23px;
  background: white;
}

.drawer-left__inner {
  top: 0;
  padding-top: 26px;
}
.mobile-nav__item {
  margin: 0;
  padding: 0;
}
.mobile-nav__item a {
  box-shadow: none;
}
.mobile-nav__item a, .mobile-nav__toggle button {
  background: none;
  box-shadow: none;
  border: none;
}
.mobile-nav__toggle .icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  position: relative;
  text-align: center;
}
.mobile-nav__toggle .icon:before, .mobile-nav__toggle .icon:after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 2px;;
  position: absolute;
  top: 10px;
  left: 0;
  background-color: #d7ff31;
  transition: .2s ease-in-out;
}

.mobile-nav__toggle-close .icon:after { opacity: 0; }
.mobile-nav__toggle .icon:after { transform: rotate(90deg); }
.mobile-nav__item a:focus { outline: none; }

.button.hire-button-mob {
  position: relative;
  padding: 4px 14px;
  z-index: 3;
  font-size: 12px;
  display: inline-block;
}

/* #4.3 Announcement Bar ***************************************
--------------------------------------------------------------*/
.announcement-bar {
  display: block;
  text-align: center;
  position: relative;
  text-decoration: none;
}
.announcement-bar__message {
  display: block;
  font-weight: 400;
  padding: 10px 30px;
  margin: 0;
}

#myHeader .announcement-bar {
  background: #111820;
  color: #fff;
  font-family: Poppins-Regular, Helvetica,Arial,Verdana,sans-serif;
  font-size: 14px;
  letter-spacing: 1px;
  margin-top: -15px;
  text-transform: uppercase;
  text-align: center;
}
#myHeader .announcement-bar .offer {
  display: block;
  font: inherit;
  color: inherit;
}
#myHeader .announcement-bar .offer .link {
  display: inline-block;
  font-family: Poppins-Bold, Helvetica,Arial,Verdana,sans-serif;
  position: relative;
}
#myHeader .announcement-bar .offer .link:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #fff;
  bottom: 6px;
}
#myHeader .announcement-bar .offer .move {
  display: inline-block;
  position: relative;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  -transform: translateX(0);
  transition: transform .2s ease-in-out;
}
#myHeader .announcement-bar .offer:hover, #myHeader .announcement-bar .offer:focus {
  background: #d8ff32;
  color: #000;
}
#myHeader .announcement-bar .offer:hover .link:after, #myHeader .announcement-bar .offer:focus .link:after {
  background-color: #000;
}
#myHeader .announcement-bar .offer:hover .move, #myHeader .announcement-bar .offer:focus .move {
  -webkit-transform: translateX(3px);
      -ms-transform: translateX(3px);
         -transform: translateX(3px);
}
#myHeader .announcement-bar + .wrapper {
  padding-top: 15px;
}

@media screen and (max-width: 768px) {
  #myHeader .announcement-bar {
    margin-top: 0;
  }
  #myHeader .announcement-bar + .wrapper {
    padding-top: 0;
  }
}
@media screen and (max-width: 599px) {
  #myHeader .announcement-bar .offer .extra {
    display: none;
    opacity: 0;
    position: absolute;
    visibility: hidden;
  }
}
@media screen and (max-width: 349px) {
  #myHeader .announcement-bar {
    letter-spacing: 0;
  }
}


/*--------------------------------------------------------------
#5.0 - Blog Layout
--------------------------------------------------------------*/
.blog-artical-bg { padding: 0; display: block; }
.blog-artical-bg  .bc-content{ padding: 60px 0; }

.blog-artical-bg  .bc-content .bc-content-dec{
  width:680px;
  max-width: 100%;
  margin:0 auto;
  position: relative;
}

button, a.btn, a.button {
  background: #D8FF32;
  border-radius: 4px;
  box-shadow: none;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;
  font-size: 18px;
  color: #000000;
  letter-spacing: 1.25px;
  text-transform: uppercase;
  text-align: center;
  display:block;
}
button:hover, button:focus, a.btn:hover, a.btn:focus, a.button:hover, a.button:focus {
  box-shadow: none;
  color: white;
}

ul, ol {
  margin: 0 0 1em 0.5em;
  padding: 0;
}
li {
  padding-left: 0.25em;
  margin-left: 1em;
}

.longquote {
  background-color: #F4F0F6;
  width: 112%;
  margin: 2em 0 2em -6%;
  padding: 36px 54px;
}
.longquote.dark {
  background-color: #1c3041;
}
.longquote.dark.has-background {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.longquote.dark h2, .longquote.dark h3, .longquote.dark h4, .longquote.dark h5, .longquote.dark h6, 
.longquote.dark p, .longquote.dark p *, .longquote.dark blockquote, .longquote.dark figcaption, .longquote.dark a,
.longquote.dark strong, .longquote.dark em, .longquote.dark ul, .longquote.dark ol, .longquote.dark li, .longquote.dark s, 
.overview h2, .overview h3, .overview h4, .overview h5, .overview h6, 
.overview p, .overview p *, .overview blockquote, .overview figcaption, .overview a,
.overview strong, .overview em, .overview ul, .overview ol, .overview li, .overview s {
  color: white;
}

.longquote.dark.small h5 {font-size: 48px;}
.longquote.dark h2, .longquote.dark h5 { margin-top: 0; }

.longquote.subhead {
  background: rgba(0,228,230,0.125);
  border-left: 3px solid #355f72;
  width: 102%;
  max-width: 102%;
  margin-left: -1%;
  margin-right: -1%;
  padding: 24px;
}
.longquote.subhead h2, .longquote.subhead h3, 
.longquote.subhead h4, .longquote.subhead h5 {
  font-size: 24px;
  text-transform: uppercase;
  margin: 0;
}

.overview a, .longquote.dark a { box-shadow: inset 0px -6px 0px #355F72; }
.overview a:hover, .overview a:focus, .longquote.dark a:hover, .longquote.dark a:focus { box-shadow: inset 0px -6px 0px #00E4E6; }

/*  LONGQUOTE / DARK / VIDEO BACKGROUND  */
.longquote.dark.video {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  overflow: hidden;
}
.longquote.dark.video video {
  position: absolute;
  top: 0;
  left:0;
  z-index: 0;
  width: 100%;
  height: auto;
}
.longquote.dark.video h2 {
  color: #fff;
  text-shadow: rgba(0,0,0,.25) 0 9px 32px, rgba(0,0,0,.15) 0 0 12px;
  position: relative;
  z-index: 2;
}
.longquote.dark.video h2::before {
  content:"";
  display: block;
  width: 120vw;
  height: 900px;
  background-image: linear-gradient(rgba(53,95,114,0.45) 0%, rgba(43,65,98,0.45) 100%);
  position: absolute;
  top: -60px;
  left: -54px;
  z-index: -1;
}

.sourced-quote {
  border-left: 3px solid #2B4162;
  padding: 18px 0;
  padding-left: 36px;
  margin-top: 24px;
  margin-bottom: 36px;
}
.sourced-quote p:last-child {
  margin-bottom: 0;
}

.subsection { margin-bottom: 48px; }
.subsection .body { padding: 0 18px 0 6px; }
.subsection .title {
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;
  font-size: 21px;
  padding-bottom: 14px;
  border-bottom: 6px solid #00e4e6;
  margin-bottom: 20px;
}

.wide-video {
  max-width: 112%;
  width: 112%;
  height: auto;
  margin-left: -6%;
  margin-top: 18px;
}

hr{
  margin: 48px 20% 40px;
  border-top: 4px solid #385F71 !important;
  width: 60%;
}

.on-page-link {
  display: inline-block;
  width: 100%;
  height: 0;
  padding-top: 60px;
  margin-top: -60px;
  box-shadow: none !important;
}

/* #5.1 - Hero *************************************************
--------------------------------------------------------------*/
.blog-artical-bg .ba-banner{
  background-color: #7c97a3;
  background-image: linear-gradient(-45deg, rgba(53,95,114,0.65) 0%, rgba(43,65,98,0.65) 100%), url({{ article | img_url: '1200x' }});
  background-size: cover;
  background-position: center;
  color :#fff;    
  background-repeat: no-repeat; 
  position: relative;
}
.blog-artical-bg .ba-banner-desc{
  padding: 112px 0 48px;
  position: relative;
  z-index: 1;
  color: #fff;
  min-height:446px;
  text-align:center;
}

.blog-artical-bg .ba-banner-desc .author-bx {
  width: 30%;
  margin: 0 auto;
  display: -webkit-box; 
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex; 
  display: flex;

  -webkit-box-lines: multiple; 
     -moz-box-lines: multiple; 
      -ms-flex-wrap: wrap; 
  -webkit-flex-wrap: wrap; 
          flex-wrap: wrap; 

         -webkit-box-pack: center; 
            -moz-box-pack: center; 
            -ms-flex-pack: center; 
  -webkit-justify-content: center; 
          justify-content: center; 
}
.blog-artical-bg .ba-banner-desc .author-bx .img {
  width: 64px;
  height: 64px;
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 50%;
  box-shadow: 0 0px 1px 3px rgba(0, 0, 0, 0.06);
}
.blog-artical-bg .ba-banner-desc .author-bx .img img {
  width: 100%;
  height: 100%;
  display: block;
}
.blog-artical-bg .ba-banner-desc .author-bx .ab-desc {
  width: calc(100% - 70px);
  display: block;
  padding-left: 15px;
  margin: auto 0;
  text-align: left;
}

.testimonial-user img{margin:0 0 16px;}
.blog-artical-bg .ba-banner-desc .author-bx .ab-desc p {
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif !important;
  font-size: 16px;
  color: #F4F0F6 ;
  letter-spacing: 0px;
  margin: 0 0;
}
.blog-artical-bg .ba-banner-desc .author-bx .ab-desc p span {
  text-transform: capitalize;
  color: #F4F0F6 ;
}
.blog-artical-bg .ba-banner-desc .author-bx .ab-desc p {
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif;
  font-size: 16px;
  color: #F4F0F6;
  margin: 0 0;
  letter-spacing: 0px;
}
.template-article .header-container, .featured-article .header-container{
  margin-bottom:0;
}

.blog-artical-bg .bc-content .bc-content-dec .plus-header {
  width: 100vw;
  display: block;
  color: #fff;
  position: absolute;
  background: #1c3041;
  margin-left: calc(50% - 50vw);
  top: -132px;
  padding: 24px 0 24px;
}
.blog-artical-bg .bc-content .bc-content-dec .plus-header p, .blog-artical-bg .bc-content .bc-content-dec .plus-header a, .blog-artical-bg .bc-content .bc-content-dec .plus-header strong {
  color: #fff;
}
.blog-artical-bg .bc-content .bc-content-dec .plus-header a {
  box-shadow: inset 0px -6px 0px #355f72;
}
.blog-artical-bg .bc-content .bc-content-dec .plus-header a:hover, 
.blog-artical-bg .bc-content .bc-content-dec .plus-header a:focus {
  box-shadow: inset 0px -6px 0px #00e4e6
}

/* #5.2 Image Styles *******************************************
--------------------------------------------------------------*/
iframe, img {
  max-width:  100%;
}

.video-wrapper {
  position: relative;
  overflow: hidden;
  max-width: 100%;
  padding-bottom: 56.25%;
  height: auto;
}

.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

p img:not([style]), 
figure img:not([style]) {
  max-width: 112%;
  width: 112%;
  height: auto;
  margin-left: -6%;
  margin-top: 18px;
}
img.sm-img:not([style]) {
  max-width: 106%;
  width: 106%;
  margin-left: -3%;
}
img.xs-img:not([style]) {
  max-width: 100%;
  width: 100%;
  margin-left: 0;
}
.box-shadow { box-shadow: 0 16px 32px rgba(0,0,0,0.15); }

/* #5.3 Testimonial Section ************************************
--------------------------------------------------------------*/
.testimonial-section {
  display: -webkit-box; 
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex; 
  display: flex;
}
.testimonial-user{
  max-width:120px;
  margin:auto; 
}
.testimonial-user img {
  border-radius: 50%;
  height:120px;
  width:120px;
  max-width:inherit;
}
.testimonial-content {
  width: calc(100% - 120px);
  margin-left: 25px;
}

.quote-img q {
  display: block;
  margin-bottom: 18px;
  margin-left: 32px;
}
.quote-img q::before, 
.quote-img q::after {
  display: none;
}
.quote-img img {
  float: right;
  margin-top: 6px;
  margin-left: 24px;
  margin-bottom: 24px;
}

/* #5.4 Code in Blogs ******************************************
--------------------------------------------------------------*/
.resize-wrapper {
  display: block;
  resize: both;
  overflow: hidden;
  position: relative;
  border-radius: 8px;
}

.resize-wrapper::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;

  background: repeating-linear-gradient(135deg,hsla(0,0%,100%,.5),hsla(0,0%,100%,.5) 2px,#000 0,#000 4px);
  clip-path: polygon(100% 0,100% 100%,0 100%);

  position: absolute;
  bottom: 0;
  right: 0;
}

code {
  background-color: #001628;
  border-radius: 8px;
  color: #778899;
  display: block;

  font-family: Operator Mono A,Operator Mono B,Source Code Pro,Menlo,Consolas,Monaco,monospace;
  font-size: 16px;

  overflow: scroll;
  padding: 16px 24px;
  width: 100%;
  height: 100%;
}
code::-moz-selection {
  background: #355F72;
  color: white;
}
code::selection {
  background: #355F72;
  color: white;
}

/* #5.5 Custom Tables ******************************************
--------------------------------------------------------------*/
.ADmission-table { 
  background-color: #F4F0F6; 
  width: 112%; 
  margin: 2em 0 2em -6%;
}
.ADmission-table td::after { display: none !important; }
.ADmission-table td { padding-bottom: 18px; }
.ADmission-table tr:first-child td { padding-top: 24px;}
.ADmission-table tr:last-child td { padding-bottom: 6px;}
.ADmission-table tr > td:first-child {padding-left: 36px;}
.ADmission-table tr > td:first-child p {
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif !important;
}
.ADmission-table tr > td:last-child {padding-right: 36px; padding-left: 48px; width: 25%; min-width: 180px;}
.ADmission-table tr > td:last-child p {
  font-size: 16px !important;
  line-height: 1.5;
  text-align: center;
}
.ADmission-table tr:nth-child(n+2)::after {
  content: "";
  display: inline-block;
  width: 90%;
  height: 2px;
  background-color: #355F72;
  margin-top: -12px;
  left: 5%;
  position: absolute;
  opacity: .3;
}

/* #5.6 Locksmith Content **************************************
--------------------------------------------------------------*/
.template-article #locksmith-content {
  padding: 100px 0 50px;
  background: #f4f0f6;
}
.template-article #locksmith-content input.field {border-radius:4px;}


/*--------------------------------------------------------------
#6.0 - Form Styles
--------------------------------------------------------------*/
form {
  margin: 0;
}
.form-vertical {
  margin-bottom: 15px;
}
@media screen and (max-width: 768px) {
  input, textarea {
    font-size: 16px;
  }
}
button, input, textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
}
button {
  background: 0 0;
  border: none;
  display: inline-block;
  cursor: pointer;
}
fieldset {
  border: 1px solid #1c1d1d;
  padding: 15px;
}
legend {
  border: 0;
  padding: 0;
}
button, input[type="submit"] {
  cursor: pointer;
}
input, select, textarea {
  border: 1px solid #1c1d1d;
  max-width: 100%;
  padding: 8px 10px;
  border-radius: 0;
}
input.disabled,
input[disabled],
select.disabled,
select[disabled],
textarea.disabled,
textarea[disabled] {
  cursor: default;
  background-color: #f6f6f6;
  border-color: #b6b6b6;
}
input.input-full,
select.input-full,
textarea.input-full {
  width: 100%;
}
textarea {
  min-height: 100px;
}
input[type="checkbox"],
input[type="radio"] {
  margin: 0 10px 0 0;
  padding: 0;
  width: auto;
}
input[type="checkbox"] {
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
}
input[type="radio"] {
  -webkit-appearance: radio;
  -moz-appearance: radio;
}
input[type="image"] {
  padding-left: 0;
  padding-right: 0;
}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-position: right center;
  background-image: url("//cdn.shopify.com/s/files/1/1024/1659/t/57/assets/ico-select.svg?v=17641814068237347588");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-color: transparent;
  padding-right: 28px;
  text-indent: 0.01px;
  text-overflow: "";
  cursor: pointer;
}
.ie9 select, .lt-ie9 select {
  padding-right: 10px;
  background-image: none;
}
optgroup {
  font-weight: 700;
}
option {
  color: #000;
  background-color: #fff;
}
select::-ms-expand {
  display: none;
}
.hidden-label {
  clip: rect(0 0 0 0);
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}
.ie9 .hidden-label,
.lt-ie9 .hidden-label {
  position: static;
  height: auto;
  width: auto;
  margin-bottom: 2px;
  overflow: visible;
  clip: initial;
}
label[for] {
  cursor: pointer;
}
.form-vertical input, .form-vertical select, .form-vertical textarea {
  display: block;
  margin-bottom: 10px;
}
.form-vertical .btn,
.form-vertical .shopify-payment-button .shopify-payment-button__button--unbranded,
.form-vertical input[type="checkbox"],
.form-vertical input[type="radio"],
.shopify-payment-button .form-vertical .shopify-payment-button__button--unbranded {
  display: inline-block;
}
.form-vertical .btn,
.form-vertical .shopify-payment-button .shopify-payment-button__button--unbranded,
.shopify-payment-button .form-vertical .shopify-payment-button__button--unbranded {
  display: inline-block;
}
input.error, textarea.error {
  border-color: #d02e2e;
  background-color: #fff6f6;
  color: #d02e2e;
}
label.error {
  color: #d02e2e;
}
.input-group {
  position: relative;
  display: table;
  border-collapse: separate;
}
.input-group .input-group-btn:first-child,
.input-group .input-group-btn:first-child > .btn,
.input-group .input-group-field:first-child,
.input-group .shopify-payment-button .input-group-btn:first-child > .shopify-payment-button__button--unbranded,
.input-group .shopify-payment-button input[type="hidden"]:first-child + .input-group-btn > .shopify-payment-button__button--unbranded,
.input-group input[type="hidden"]:first-child + .input-group-btn > .btn,
.input-group input[type="hidden"]:first-child + .input-group-field,
.shopify-payment-button .input-group .input-group-btn:first-child > .shopify-payment-button__button--unbranded,
.shopify-payment-button .input-group input[type="hidden"]:first-child + .input-group-btn > .shopify-payment-button__button--unbranded {
  border-radius: 0 0 0 0;
}
.input-group .input-group-btn:last-child > .btn,
.input-group .input-group-field:last-child,
.input-group .shopify-payment-button .input-group-btn:last-child > .shopify-payment-button__button--unbranded,
.shopify-payment-button .input-group .input-group-btn:last-child > .shopify-payment-button__button--unbranded {
  border-radius: 0 0 0 0;
}
.input-group input::-moz-focus-inner {
  border: 0;
  padding: 0;
  margin-top: -1px;
  margin-bottom: -1px;
}
.input-group-btn, .input-group-field {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
}
.input-group .btn, .input-group .input-group-field,
.input-group .shopify-payment-button .shopify-payment-button__button--unbranded,
.shopify-payment-button .input-group .shopify-payment-button__button--unbranded {
  height: 37px;
}
.input-group .input-group-field {
  width: 100%;
}
.input-group-btn {
  position: relative;
  white-space: nowrap;
  width: 1%;
  padding: 0;
}
.selector-wrapper label {
  margin-right: 10px;
}
.selector-wrapper + .selector-wrapper {
  margin-top: 15px;
}

select:hover {
  outline: 1px solid #dddddd;
}

input[type="number"] {
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif;
  font-size: 1em;
}

input[type="image"] {
  background-color: transparent;
}

.single-option-radio {
  border: 0;
  padding-top: 0;
  position: relative;
  background-color: white;
}
.single-option-radio input {
  clip: rect(0 0 0 0);
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}
.lt-ie9 .single-option-radio input {
  position: relative;
  height: auto;
  width: auto;
  clip: initial;
}
.single-option-radio label {
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif;
  position: relative;
  display: inline-block;
  line-height: 1;
  padding: 9px 11px;
  margin: 3px 4px 7px 3px;
  font-size: 0.8125em;
  font-style: normal;
  background-color: white;
  border: 1px solid white;
  color: #222323;
}
.single-option-radio label.disabled:before {
  position: absolute;
  content: "";
  left: 50%;
  top: 0;
  bottom: 0;
  border-left: 1px solid;
  border-color: #222323;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.lt-ie9 .single-option-radio label.disabled:before {
  display: none;
}
.single-option-radio label:active, .single-option-radio label:focus {
  background-color: #f2f2f2;
  border-color: #f2f2f2;
}
.single-option-radio input[type='radio']:checked + label {
  border-color: #222323;
}
.single-option-radio input[type='radio']:focus + label {
  background-color: #f2f2f2;
}
.radio-wrapper .single-option-radio__label {
  display: block;
  margin-bottom: 10px;
  cursor: default;
  font-style: normal;
}
.product-form__item {
  margin-bottom: 13px;
}

.button, #mc_embed_signup_scroll input[type="submit"].button, #contact input[type="submit"].button, .template-article .bc-content-dec a.btn {
  color: #000000;
  text-transform: uppercase;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;
  font-size: 18px;
  letter-spacing: 1.25px;
  padding: 10px 35px;
  background: #D8FF32;
  border-radius: 4px;
  display: inline-block;
  flex: 1 1 auto;
  text-align: center;
  text-transform: uppercase;
  position: relative;
  overflow: hidden;
  transition: .3s;
  z-index: 1;
}
.button:after, #mc_embed_signup_scroll input[type="submit"].button:after, #contact input[type="submit"].button:after, .template-article .bc-content-dec a.btn:after {
  position: absolute;
  transition: .3s;
  content: '';
  width: 0;
  left: 50%;
  bottom: 0;
  height: 3px;
  background: #1C3041;
  height: 119%;
  left: -10%;
  transform: skewX(15deg);
  z-index: -1;
}
.button:hover, .button:focus, #mc_embed_signup_scroll input[type="submit"].button:hover, #contact input[type="submit"].button:hover, .template-article .bc-content-dec a.btn:hover {
  cursor: pointer;
  color: white;
}
.button:hover:after, .button:focus:after, #mc_embed_signup_scroll input[type="submit"].button:hover:after, #contact input[type="submit"].button:hover:after, .template-article .bc-content-dec a.btn:hover:after {
  width: 100%;
  left: 0;
  left: -10%;
  width: 120%;
}
@media (max-width: 767px) {
  .button, #mc_embed_signup_scroll input[type="submit"].button, #contact input[type="submit"].button, .template-article .bc-content-dec a.btn {
    font-size: 16px;
  }
}

/* #6.1 Error / Success ****************************************
--------------------------------------------------------------*/
.errors, .note {
  border-radius: 0;
  padding: 6px 12px;
  margin-bottom: 15px;
  border: 1px solid transparent;
  font-size: 0.9em;
  text-align: left;
}
.errors ol, .errors ul, .note ol, .note ul {
  margin-top: 0;
  margin-bottom: 0;
}
.errors li:last-child, .note li:last-child {
  margin-bottom: 0;
}
.errors p, .note p {
  margin-bottom: 0;
}
.note {
  border-color: #1c1d1d;
}
.errors ul {
  list-style: disc outside;
  margin-left: 20px;
}
.form-success {
  color: #56ad6a;
  background-color: #ecfef0;
  border-color: #56ad6a;
}
.form-success a {
  color: #56ad6a;
  text-decoration: underline;
}
.form-success a:hover {
  text-decoration: none;
}
.errors, .form-error {
  color: #d02e2e;
  background-color: #fff6f6;
  border-color: #d02e2e;
}
.errors a, .form-error a {
  color: #d02e2e;
  text-decoration: underline;
}
.errors a:hover, .form-error a:hover {
  text-decoration: none;
}

.hs-form .hs-form-field .no-list.hs-error-msgs {
  height: auto;
  width: auto;
}
.hs-form .hs-form-field .no-list.hs-error-msgs label {
  position: initial;
  opacity: 1;
  display: inline-block;
  position: relative;
  padding: 6px;
  padding-bottom: 0;
  top: 6px;
  font-size: 14px;
  line-height: 1.3;
}

.hs-form .hs-form-field .no-list.hs-error-msgs label::before {
  content: "⚠️";
  display: inline-block;
  margin-right: .75em;
  font-size: .95em;
}

.hs-form .hs-form-field .no-list.hs-error-msgs label a {
  color: #ffff;
  background: linear-gradient(to bottom, #b4ffff 50%, #b4ffff 50%) 0 1.3em / 5px 1px repeat-x;
}
.hs-form .hs-form-field .no-list.hs-error-msgs label a:hover, 
.hs-form .hs-form-field .no-list.hs-error-msgs label a:focus {
  background: linear-gradient(to bottom, #fff 50%, #fff 50%) 0 1.3em / 5px 2px repeat-x;
}

/* #6.2 Hubspot Forms ******************************************
--------------------------------------------------------------*/
.hbspt-form .hs-form-field {
  position: relative;
  margin-bottom: 18px; 
}
.hbspt-form .hs-form-field label {
  color: #fff;
  font-size: 12px;
  line-height: 1;
  position: absolute;
  top: -16px;
  left: 0;
  opacity: 0; 
}
.hbspt-form .hs-form-field label .hs-form-required {
  display: none; 
}
.hbspt-form .hs-form-field label.hs-error-msg {
  color: #fb3333;
  top: auto;
  bottom: -4px;
  left: auto;
  right: 0;
  opacity: 1; 
}
.hbspt-form .hs-form-field.hs-fieldtype-checkbox label:not(.hs-error-msg) {
  position: initial;
  opacity: 1;
  font-size: 14px; 
}
.hbspt-form .hs-form-field.hs-fieldtype-checkbox .inputs-list {
  list-style: none;
  margin-left: 0 !important; 
}
.hbspt-form .hs-form-field.hs-fieldtype-checkbox .inputs-list .hs-form-checkbox {
  margin-left: 0; 
}
.hbspt-form .hs-form-field.hs-fieldtype-checkbox .inputs-list .hs-form-checkbox input {
  border-color: #fff;
  width: 18px;
  height: 18px;
  position: relative;
  top: 3px; 
}
.hbspt-form .hs-form-field .hs-input {
  font-size: 12px; 
}
.hbspt-form .hs-form-field .hs-input:not([type="checkbox"]) {
  background-color: #fff;
  border: none;
  border-radius: 4px;
  width: 100%; 
}
.hbspt-form .hs-form-field .hs-input:not([type="checkbox"]):focus {
  border-color: #00E4E6;
  box-shadow: 0 0 0 1px #00E4E6;
  outline: none; 
}
.hbspt-form .hs-form-field .hs-input.invalid, .hbspt-form .hs-form-field .hs-input.error {
  background-color: #fff;
  border-color: #fb3333;
  box-shadow: 0 0 0 1px #fb3333; 
}
.hbspt-form .hs-form-field.hs_monthly_advertising_budget .input {
  position: relative; 
}
.hbspt-form .hs-form-field.hs_monthly_advertising_budget .input::before {
  content: '';
  position: absolute;
  top: calc(50% - 2.5px);
  right: 10px;
  border-color: #4f4f4f transparent transparent transparent;
  border-style: solid;
  border-width: 6px 6px 0 6px;
  height: 0;
  width: 0; 
}
.hbspt-form .hs-form-field select.hs-submit input {
  padding-right: 25px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; 
}
.hbspt-form .hs-form-field select.hs-submit input:hover, .hbspt-form .hs-form-field select.hs-submit input:focus {
  border-color: #00E4E6;
  box-shadow: 0 0 0 1px #00E4E6;
  outline: none; 
}
.hbspt-form .no-list.hs-error-msgs {
  list-style: none;
  display: block;
  height: 10px;
  margin: 0 !important; 
}
.hbspt-form .hs-submit div input {
  text-align: center; 
}
.hbspt-form .hs-submit div input input {
  background: linear-gradient(#355f72, #355f72) -10% center/0 110% no-repeat #d8ff32;
  border: none;
  border-radius: 4px;
  color: #000;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif !important;
  font-size: 18px;
  letter-spacing: 1.25px;
  text-transform: uppercase;
  padding: 12px 48px;
  transition: all .3s ease-in-out;
  outline: none; 
}
.hbspt-form .hs-submit div input input:hover, .hbspt-form .hs-submit div input input:focus {
  color: #fff;
  background-size: 100% 110%; 
}
.hbspt-form .hs-submit div input .hs-submit div input:hover {
  background: #355F72 !important; 
}

.hbspt-form form {
  max-width: 90%;
  margin-left: auto;
  margin-right: auto; 
}

.hbspt-form form fieldset {
  max-width: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; 
}

.hbspt-form form fieldset .hs-form-field {
  width: 48%;
  float: none; 
}

.hbspt-form form fieldset.form-columns-1 .hs-form-field,
.hbspt-form form fieldset.form-columns-2 .hs-form-field {
  width: 49%;
  float: none; 
}
.hbspt-form form select:hover {
  outline: none; 
}

.hbspt-form form .hs-submit {
  text-align: center;
  margin-top: 20px; 
}

.hbspt-form form .hs-button {
  cursor: pointer;
  font-weight: 700;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif !important;
  font-size: 18px;
  line-height: 20px;
  color: #09091a;
  letter-spacing: 1.25px;
  text-transform: uppercase;
  border-radius: 4px;
  border: none;
  padding: 12px 50px;
  background: linear-gradient(75deg, #1c3041 0% 50%, #d8ff32 50% 100%) 100% 50%/220% 110% no-repeat #d8ff32;
  transition: all .3s ease-in-out; 
}

.hbspt-form form .hs-button:hover,
.hbspt-form form .hs-button:focus {
  background-position: 1% 50%;
  color: #fff; 
}

div:not(.hs-form2) > .hbspt-form form fieldset.form-columns-3 .hs_phone, 
div:not(.hs-form2) > .hbspt-form form fieldset.form-columns-3 .hs_monthly_advertising_budget {
  width: 49%;
}
.hbspt-form form fieldset.form-columns-3 .hs_sms_opt_in_check_box.hs-sms_opt_in_check_box {
  width: 100%;
}

.hero .form-top .hbspt-form form fieldset.form-columns-3 .hs_sms_opt_in_check_box {
  -webkit-box-ordinal-group: 0;
  -moz-box-ordinal-group: 0;
  -ms-flex-order: 0;
  -webkit-order: 0;
  order: 0;
}

@media screen and (min-width: 769px) {
  div:not(.hs-form2) > .hbspt-form form fieldset.form-columns-3 .hs_sms_opt_in_check_box {
    -webkit-box-ordinal-group: 3;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 3;
    -webkit-order: 3;
    order: 3;
  }
}

@media (max-width: 768px) {
  .hbspt-form form {
    max-width: 100%; 
  }
  .hbspt-form form fieldset.form-columns-1 .hs-form-field,
  .hbspt-form form fieldset.form-columns-2 .hs-form-field, 
  .hbspt-form form fieldset.form-columns-3 .hs-form-field.hs_phone.hs-phone, 
  .hbspt-form form fieldset.form-columns-3 .hs-form-field.hs_monthly_advertising_budget.hs-monthly_advertising_budget, 
  .hbspt-form form fieldset.form-columns-3 .hs-form-field.hs_sms_opt_in_check_box {
    width: 100%; 
  }
  .hbspt-form .hs-form-field .hs-input {
    width: 100% !important; 
  }
  .hbspt-form form fieldset.form-columns-1 .hs-form-field .input,
  .hbspt-form form fieldset.form-columns-2 .hs-form-field .input,
  .hbspt-form form fieldset.form-columns-3 .hs-form-field .input, 
  .hbspt-form .hs-form-field .hs-input .input {
    margin-right: 0; 
  }
  .hbspt-form .hs-form-field.hs-fieldtype-checkbox .inputs-list .hs-form-checkbox input {
    width: auto !important; 
  }
}

::-webkit-input-placeholder { color: #4f4f4f; }
::-moz-placeholder { color: #4f4f4f; }
:-ms-input-placeholder { color: #4f4f4f; }
:-moz-placeholder { color: #4f4f4f; }

/* OPT-IN CHECKBOX STYLES */
.hbspt-form .hs_sms_opt_in_check_box {
  position: relative;
  bottom: 10px;
  margin-bottom: 0;
  line-height: 0;
}
.hbspt-form .hs_sms_opt_in_check_box ul {
  list-style: none;
  margin: 0;
  text-align: left;
}
.hbspt-form li {
  margin-left: 0;
  padding-left: 0;
}
.hbspt-form .hs_sms_opt_in_check_box label {
  opacity: 1;
  font-size: 14px;
  position: initial;
  line-height: 1.45;
  display: -webkit-box; 
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex; 
  display: flex; 

         -webkit-box-pack: start; 
            -moz-box-pack: start; 
            -ms-flex-pack: start; 
  -webkit-justify-content: flex-start; 
          justify-content: flex-start;
}
.hbspt-form .hs_sms_opt_in_check_box label span {
  display: inline-block;
  margin-top: 2px;
}
.hbspt-form .hs_sms_opt_in_check_box input {
  border-color: #fff;
  cursor: pointer !important;
  width: 18px;
  height: 18px;
  position: relative;
  top: 3px;
}
.hbspt-form .hs_sms_opt_in_check_box legend {
  background: #000;
  border-radius: 4px;
  padding: 4px;
  color: #fff;
  font-size: 12px;
  line-height: 1.45;
  width: 240px;
  max-width: 100%;
  position: absolute;
  z-index: 10;
  bottom: -25px;
  left: -8px;
  opacity: 0;
  transition: opacity .3s ease-in-out;
}
.hbspt-form .hs_sms_opt_in_check_box legend:after {
  content:"";
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 6px solid #000;
  position: absolute;
  left: 10px;
  top: -6px;
}

.hbspt-form .hs_sms_opt_in_check_box:hover legend, .hbspt-form .hs_sms_opt_in_check_box:focus legend {
  opacity: 1;
}

.form-top .hero .form-top .hbspt-form .hs_sms_opt_in_check_box {
  margin-top: 3px;
  margin-bottom: 0 !important;
}

@media screen and (min-width: 769px) {
  .hbspt-form .hs_sms_opt_in_check_box { width: 100%; }
}
@media screen and (max-width: 768px) {
  .hbspt-form .hs_sms_opt_in_check_box.hs-form-field .input input { width: auto !important; }
}

/* #6.3 Hubspot Pop-Ups ****************************************
--------------------------------------------------------------*/
.blog-artical-bg .bc-content .popup {
  display: none;
  background: rgba(0,0,0,0.8);
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 5;
  transition: all 0.2s ease-in-out;
  overflow-y: scroll;
}
.blog-artical-bg .bc-content .popup-content {
  background-color: #243746;
  padding: 2%;
  width: 620px;
  position: fixed;
  top: 6%;
  left: 50%;
  transform: translate(-50%, 0);
  text-align: center;
}
.blog-artical-bg .bc-content .popup-content h3 {
  font-size: 32px;
}
.blog-artical-bg .bc-content .bc-content-dec .popup-content a {
  box-shadow: inset 0px -6px 0px #355f72;
  color: #fff;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif !important;
}
.blog-artical-bg .bc-content .bc-content-dec .popup-content a:hover, 
.blog-artical-bg .bc-content .bc-content-dec .popup-content a:focus { 
  box-shadow: inset 0px -6px 0px #00e4e6;
  color: #fff;
}
.blog-artical-bg .bc-content .popup-content .hs-recaptcha {
  display: none;
  opacity: 0;
  visibility: hidden
}
.blog-artical-bg .bc-content .hs-form-button-close{
  position: absolute;
  color: #000;
  top: 0px;
  right: -55px;
  background: #fff;
  height: 50px;
  width: 50px;
  box-shadow: 6px 6px 30px -4px rgb(0 0 0 / 75%);
  cursor: pointer;
  border-radius: 4px;
  background-color: #d8ff32;
}
.blog-artical-bg .bc-content .hbspt-form .hs-form-field .hs-input{
  line-height: 16px;
  background-color: #505F6B !important;
  color: #c0c0c8;
  border-color: #e3e3e3 !important;
  font-weight: 400;
}
.blog-artical-bg .bc-content .hbspt-form .hs-form-field input::placeholder {
  color: #c0c0c8;;
  opacity: 1; /* Firefox */
}
.blog-artical-bg .bc-content .hbspt-form .hs-form-field input:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #c0c0c8;;
}
.blog-artical-bg .bc-content .hbspt-form .hs-form-field input::-ms-input-placeholder { /* Microsoft Edge */
  color: #c0c0c8;;
}
.blog-artical-bg .bc-content .hbspt-form .hs-submit input{
  width: 100%; 
}
.hbspt-form .submitted-message p{
  color: #fff !important;
}
@media only screen and (max-width: 768px) {
  .blog-artical-bg .bc-content .popup-content {
    width: 80%;
    background-color: #243746;
    padding: 20px;
    border-radius: 5px;
    position: absolute;
    color: #FFF;
    margin-top:21px;
  }
}
@media screen and (max-width:599px) {
  .blog-artical-bg .bc-content .popup-content h3 {
    font-size: 27px;
  } 
  .blog-artical-bg .bc-content .popup-content .hbspt-form + p {
    font-size: 12px;
  }
}
@media(max-width:425px){
  .blog-artical-bg .bc-content .popup-content {
    width: 90%;
  }
  .blog-artical-bg .bc-content .popup-content h3 {
    font-size: 24px;
  }
  .blog-artical-bg .bc-content .popup-content p {
    font-size: 16px;
    line-height: 1.35;
  }
  .blog-artical-bg .bc-content .hs-form-button-close{
    top: -20px;
    right: -15px;
  }
}


/*--------------------------------------------------------------
#7.0 - Case Studies
--------------------------------------------------------------*/

/* #7.1 Breakout Row *******************************************
--------------------------------------------------------------*/
ul.breakout {
  list-style: none;
  width: 112%;
  max-width: 112%;
  margin-left: -6% !important;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
ul.breakout.justify-center {
         -webkit-box-pack: center; 
            -moz-box-pack: center; 
            -ms-flex-pack: center; 
  -webkit-justify-content: center; 
          justify-content: center;
}
ul.breakout.justify-between {
         -webkit-box-pack: justify; 
            -moz-box-pack: justify; 
            -ms-flex-pack: justify; 
  -webkit-justify-content: space-between; 
          justify-content: space-between;
}
ul.breakout.align-center {
    -webkit-box-align: center; 
       -moz-box-align: center; 
       -ms-flex-align: center; 
  -webkit-align-items: center; 
          align-items: center; 
}

ol.col-2 {
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;

  -webkit-column-gap: 24px;
     -moz-column-gap: 24px;
          column-gap: 24px;
}

.breakout .video.source .h3-size.vid-caption {
  font-size: 30px;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif !important;
  margin-top: 12px;
  text-align: left;
}
.longquote ul.breakout {
  width: 100%;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* #7.2 Multi-Image/Video Row **********************************
--------------------------------------------------------------*/
ul.source-list {
  list-style: none;
  margin: 18px -5%;
  width: 110%;
  max-width: 110%;
  display: flex;
}
ul.source-list li {
  padding: 0;
  margin-left: 8px;
  margin-right: 8px;
}
ul.source-list li:first-child {
  margin-left: 0;
  margin-right: 16px;
}
ul.source-list li:last-child {
  margin-left: 16px;
  margin-right: 0;
}

ul.source-list.col-3 li { width: 33%; }

/* #7.3 Dark-Blue Overview *************************************
--------------------------------------------------------------*/
.overview ~ .wrapper {
  margin-top: 64px;
  margin-bottom: 64px;
}

.overview {
  background-color: #1C3041;
  display: block;
  width: 100%;
  max-width: 1050px;
  padding: 48px 0;
  margin: 48px 0;
  position: relative;
  z-index: 1;
}

.overview div[class^="col-"] {
  width: 32%;
  padding: 0 12px;
  float: left;
}
.overview::before, 
.overview::after, 
.overview div[class^="col-"]::before, 
.overview div[class^="col-"]::after {
  content: "";
  display: table;
  clear: both;
}

.overview::before {
  display: block;
  width: 100vw;
  position: absolute;
  height: 100%;
  background: #1C3041;
  top: 0;
  margin-left: calc(50% - 50vw);
  z-index: -1;
}

.overview h6 {
  font-size: 24px; 
  margin-bottom: 32px;
}
.overview h2, 
.longquote.dark h2, 
.overview h5, 
.longquote.dark h5 {
  font-family: Oswald-SemiBold, Impact, Arial Narrow, Arial, sans-serif !important;
  color: #D8FF32;
  font-size: 54px;
  line-height: 1.1;
  letter-spacing: -.01em;
  margin-bottom: 32px;
  text-transform:uppercase;
}


/*--------------------------------------------------------------
#8.0 - Custom Blog Code (Specific Use-Case)
--------------------------------------------------------------*/

/* #8.1 Ecommerce Accounting: Float Right Books ****************
--------------------------------------------------------------*/
p img.float-right-book {
  width: 200px;
  float: right;
  margin-top: 0;
  margin-left: 18px;
}
p img.float-right-book::after {
  content:"";
  display: table;
  clear: both;
}
h4 a {
  font-family: inherit !important;
  box-shadow: inset 0px -18px 0px #d9fbfc
}
h4 a:hover, h4 a:focus {
  box-shadow: inset 0px -18px 0px #7ff1f2
}

@media screen and (max-width:599px) {
  p img.float-right-book {
    width:100px;
    float: left;
    margin-left:0;
    margin-right:16px;
  }
}


/*--------------------------------------------------------------
#9.0 - Footer
--------------------------------------------------------------*/
.site-footer {
  padding-bottom: 30px;
}
.site-footer a {
  color: #222323;
}
.site-footer a:active {
  color: #000;
}
@media screen and (min-width: 591px) {
  .site-footer__linklist {
    margin-bottom: 15px;
  }
}

.line-brk {
  width: 30px;
  background: yellow;
  height: 1px;
  margin: 20px 0;
}

.footer-top {
  text-align: center;
  padding: 32px 0 1px;
  color: white;
  background-image: linear-gradient(-90deg, #00e9ec 0%, #355f72 100%);
  font-weight: bold;
  font-size: 18px;
}

.footer-top h4, .footer-top .h4, .footer-top h4 > span, .footer-top .h4 > span {
  font-family: Oswald-SemiBold, Impact, Arial Narrow, Arial, sans-serif;
  text-transform: uppercase;
  font-size: 48px;
  color: white;
}

.footer-top h4 > span, .footer-top .h4 > span {
  color: #d7ff31;
}

.footer-top p {
  font-family: Poppins-Regular, Helvetica, Arial, Verdana, sans-serif;
  font-size: 18px;
  color: white;
}
footer .grid { margin: 0; }
footer .grid__item { padding: 0; }
footer a { color: white; }
footer p { color: white; }
footer {
  padding: 50px 0;
  color: white;
  background: #111820;
  font-size: 12px; 
}

.logo-cont { padding: 10px 5% 0; }
.logo-cont > svg {
  max-width: 140px;
  width: 100%;
}

footer ul {
  list-style: none;
  margin: 0;
}
.social-icons { margin: 0; }
.social-icons li { display: inline-block; }
.facebook-mp {
  max-width: 140px;
  margin-top: 20px;
}
.social-icons svg {
  width: 18px;
  margin-right: 16px;
}
.footer-title {
  color: #d7ff31;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif;
  text-transform: uppercase;
  letter-spacing: initial;
  font-size: 18px;
  margin-bottom: 10px;
}
.address-title {
  margin-bottom: 10px;
  text-transform: uppercase;
  font-weight: bold;
}
.bottom-bar {
  background: #0c1016;
  margin-top: 20px;
  padding: 10px 0;
}
.bottom-bar p, .bottom-bar li {
  display: inline-block; 
}
.left-side, .right-side {
  display: inline-block;
}
.right-side li {
  margin-left: 10px;
}
footer ul:not(.social-icons) li a {
  display: inline-block;
  padding: 3px;
  margin: -3px;
  min-width: 120px;
}
.footer-top .footer_inner {
  max-width: 600px;
  margin: auto;
  text-align: center;
}

footer a { box-shadow: none; }
footer a:hover, footer a:focus { box-shadow: none; color: #cbff00;}
footer li { margin-left: 0; padding-left: 0;}
footer p { font-size: 12px; }

@media screen and (max-width: 768px) {
  footer { text-align: center;}
  footer .line-brk { margin-left:auto; margin-right:auto; }
}

@media screen and (max-width: 590px) {
  .site-footer .grid__item {
    padding-bottom: 5px;
  }
  .footer-top h4 {
    font-size: 36px;
  }
}

/* #9.1 Footer Form *******************************************
--------------------------------------------------------------*/
.footer_form, .case-study-form {
  background-image: linear-gradient(-90deg, #00e9ec 0%, #355f72 100%);
  padding-bottom: 30px; 
}
.case-study-form {
  background: rgba(0,0,0,0);
  background: none;
  padding-top: 36px;
  padding-bottom: 12px;
}
.footer_form .wrapper, .case-study-form .wrapper {
  position: relative;
  top: -10px; 
}
@media (max-width: 768px) {
  .footer_form .wrapper, .case-study-form .wrapper {
    top: initial;
    padding-top: 30px; 
  } 
}
.footer_form .formkit-form[data-uid="74767ca8ea"], .footer_form .formkit-form[data-uid="5621816a09"], .case-study-form .formkit-form[data-uid="74767ca8ea"], .case-study-form .formkit-form[data-uid="5621816a09"] {
  max-width: 50%;
  padding: 20px 2% 0; 
}
@media (max-width: 768px) {
  .footer_form .formkit-form[data-uid="74767ca8ea"], .footer_form .formkit-form[data-uid="5621816a09"], .case-study-form .formkit-form[data-uid="74767ca8ea"], .case-study-form .formkit-form[data-uid="5621816a09"] {
    max-width: initial;
    padding: initial;
    background-image: initial; 
  } 
}
.footer_form .formkit-field:nth-child(8), .case-study-form .formkit-field:nth-child(8) {
  position: absolute;
  margin-left: 45.3% !important;
  padding: 25px;
  top: 10%; 
}
@media (max-width: 895px) {
  .footer_form .formkit-field:nth-child(8), .case-study-form .formkit-field:nth-child(8) {
    margin-left: 44.5% !important; 
  } 
}
@media (max-width: 768px) {
  .footer_form .formkit-field:nth-child(8), .case-study-form .formkit-field:nth-child(8) {
    position: initial;
    margin-left: initial !important;
    background-image: initial;
    padding: initial;
    top: initial; 
  } 
}
.footer_form .formkit-submit.formkit-submit, .case-study-form .formkit-submit.formkit-submit {
  width: 200px !important; 
}
.footer_form .formkit-form[data-uid="74767ca8ea"] .formkit-input, .footer_form .formkit-form[data-uid="5621816a09"] .formkit-input, .footer_form .formkit-select, .case-study-form .formkit-form[data-uid="74767ca8ea"] .formkit-input, .case-study-form .formkit-form[data-uid="5621816a09"] .formkit-input, .case-study-form .formkit-select {
  background: #fff !important;
  border-color: #fff !important; 
}
.footer_form fieldset legend, .case-study-form fieldset legend {
  color: #fff !important; 
}
.footer_form .formkit-powered-by, .case-study-form .formkit-powered-by {
  display: none !important; 
}
.footer_form .formkit-submit, .case-study-form .formkit-submit {
  position: absolute !important;
  bottom: 30px;
  right: 0;
  left: 52%; 
}
@media (max-width: 768px) {
  .footer_form .formkit-submit, .case-study-form .formkit-submit {
    left: 0;
    margin: auto !important;
    bottom: 20px; 
  } 
}
.footer_form .formkit-submit span, .case-study-form .formkit-submit span {
  color: #000000 !important;
  font-family: Poppins-Bold, Helvetica, Arial, Verdana, sans-serif !important;
  font-size: 18px !important;
  letter-spacing: 1.25px !important;
  transition: .3s !important;
  z-index: 1 !important;
  background-color: #d8ff32;
  border-radius: 4px;
  position: relative; 
}
.footer_form .formkit-submit span:after, .case-study-form .formkit-submit span:after {
  position: absolute;
  transition: .3s;
  content: '';
  width: 0;
  left: 50%;
  bottom: 0;
  height: 3px;
  background: #1C3041;
  height: 120%;
  left: -10%;
  transform: skewX(15deg);
  z-index: -1; 
}
.footer_form .formkit-submit span:hover:after, .case-study-form .formkit-submit span:hover:after {
  width: 100%;
  left: 0;
  left: -10%;
  width: 120%;
  border-radius: 4px; 
}


/*--------------------------------------------------------------
#10.0 - Media Queries
--------------------------------------------------------------*/
.mobile-only {
  display: none;
  opacity: 0;
  visibility: hidden;
}

@media (max-width: 991px) {
  .blog-artical-bg .ba-banner-desc .author-bx {
    width: 40%;
  }
}

@media screen and (max-width: 967px) and (min-width: 769px) {
  .grid__item.large--hide.large--one-sixth.one-quarter.hire-btn-cont-mob {
    width: 33.3%;
    display: table-cell !important;
  }
  nav[role="navigation"] {
    width: 0;
  }
}
@media screen and (min-width: 769px) {
  video.video-xl {
    width: 112%;
    max-width: 112%;
    margin-left: -6%;
  }
  video.video-lg {
    width: 106%;
    max-width: 106%;
    margin-left: -3%;
  }
}

@media screen and (max-width: 767px) {
  ul.breakout {
    width: 100%;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .breakout .video.source .h3-size.vid-caption {
    font-size: 20px;
    margin: 6px 0;
  }
  .blog-artical-bg .bc-content .bc-content-dec img, 
  .blog-artical-bg .bc-content .bc-content-dec video {
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .blog-artical-bg .bc-content ul.source-list {
    width: 100%;
    max-width: 100%;
    margin: 18px 0;
  }
  .blog-artical-bg .bc-content .mobile-only {
    display: initial;
    opacity: 1;
    visibility: visible;
  }
  .blog-artical-bg .bc-content .desktop-only {
    display: none;
    opacity: 0;
    visibility: hidden;
  }
}

@media (max-width: 575px) {
  h1 {
    font-size: 30px;
    margin-bottom: 24px;
    margin-top: 56px;
  }
  .testimonial-section {
    display: block !important;
  }
  .testimonial-content {
    margin:0px auto !imporant;  
    margin-left:0px !important;
    width: 100% !important;
  }
  .blog-artical-bg .ba-banner-desc .author-bx .img {
    display: none;
  }
  .blog-artical-bg .ba-banner-desc .author-bx .ab-desc{
    padding-left:0px !important;
    width:100% !important;
    text-align: center !important;
  }
}

@media screen and (max-width:449px) {
  .sourced-quote-img {text-align: center; margin-bottom:0;}
  .sourced-quote-img img {
    float: none !important;
    margin-bottom: -24px !important;
  }
  .longquote {
    padding: 2em 25px 1.5em;
    width: calc(100% + 30px);
    margin-left: -15px;
  }
  .blog-artical-bg .bc-content .bc-content-dec .longquote.dark.video video {
    width: auto !important;
    height: 100% !important;
  }
}

 @media screen and (max-width: 399px) {
  .medium-down--one-half.logo-top-cont { width: 45%; }
  .medium-down--one-half.logo-top-cont img { max-width: 80%; margin: 0 5% 0 15%; }
  .hire-btn-cont-mob { width: 30%; }
  .longquote.dark h2, 
  .longquote.dark h5 { font-size: 44px;}
  .longquote.dark.small h5 {font-size: 36px;}
}