/* 
Theme Name: SGM Theme
Theme URI: https://www.savageglobalmarketing.com/
Description: SGM theme created by savage team to website the Savage Global Marketing
Author: Savage Team
Author URI: https://www.savageglobalmarketing.com/
Template: hello-elementor
Version: 1.5.3
Text Domain: sgm-theme
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url("fonts/montserrat-100.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/montserrat-400.woff2") format("woff2");
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/montserrat-700.woff2") format("woff2");
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
}

.dark-header {
  background-color: #000000 !important;
}

a.typeform-share-btn-primary,
a.typeform-share-btn-secondary,
a.typeform-share button {
  font-size: 22px;
  padding: 10px 18px;
  text-transform: none;
  font-family: Montserrat;
  font-weight: 600;
}
a.typeform-share-btn-primary {
  background: #44d62c;
  color: #000;
}

a.typeform-share-btn-primary:hover {
  background-color: #0a0000;
  color: #44d62c;
}

.btn-border:hover {
  border: 2px solid #44d62c;
}

a.typeform-share-btn-secondary {
  background: #000;
  color: #44d62c;
}

a.typeform-share-btn-secondary:hover {
  background-color: transparent;
  color: #0a0000;
  border: 2px solid #0a0000;
}

h2 a,
p a {
  color: #44d62c !important;
}

/* MENU HEADER */
.menuwhite svg.e-font-icon-svg {
  fill: #000;
}
.menucolor svg.e-font-icon-svg {
  fill: #fff !important;
}

.menucolor a.elementor-item {
  color: white !important;
}

/* SVG OUR PROCESS */
.our-process svg.e-font-icon-svg.e-fas-power-off,
.our-process svg.e-font-icon-svg.e-fas-brain,
svg.e-font-icon-svg.e-far-dot-circle {
  width: 30px !important;
}
.our-process svg.e-font-icon-svg.e-fab-mixcloud {
  width: 50px !important;
}

/* FORM MODAL EBOOK & SWIPES */
form#requestDownloadableForm button {
  padding: 10px;
  background: #44d62c;
  color: #fff;
  font-family: "Montserrat";
  font-weight: 600;
}

form#requestDownloadableForm button:hover {
  padding: 10px;
  color: #44d62c;
  background: #000;
}

/* CSS ADS - BLOG PAGES */
#ads-box iframe {
  overflow: hidden;
}

.desktop-ad {
  display: none;
}
.mobile-ad {
  display: block;
}

#ads-box .desktop-ad {
  width: 160px;
  max-height: 600px;
}

#ads-box .mobile-ad {
  width: 350px;
  min-height: 350px;
}

@media (min-width: 768px) {
  .desktop-ad {
    display: block;
  }
  .mobile-ad {
    display: none;
  }
}

#blog-post h2 {
  padding-top: 1em;
  padding-bottom: 1em;
  font-weight: 700;
}
#blog-post h3 {
  font-weight: 700;
}
#blog-post a:visited,
#blog-post a {
  color: #44d62c !important;
}
#blog-post a:hover {
  color: #b6efac !important;
}
#blog-container ul li,
#blog-container ol li {
  margin-left: 35px;
}
#blog-post p {
  line-height: 1.6em;
}

#blog-post p,
#blog-post h2 + p,
#blog-post p + p,
#blog-post p + ul,
#blog-post p + ol,
#blog-post img + p {
  padding-bottom: 1em;
}
/* RESPONSIVE */
@media (max-width: 1024px) {
  .menuwhite svg.e-font-icon-svg {
    fill: #fff;
  }
  .menu-item-10785,
  .menu-item-10786,
  .menu-item-10788,
  .menu-item-10789 {
    background: #1b1b1b !important;
  }
}

/* MAP PAGE ABOUT US */
#world svg,
#container-map svg,
.pins,
.pins-savage {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  -webkit-contain: strict;
  -moz-contain: strict;
  -ms-contain: strict;
  -o-contain: strict;
  contain: strict;
}
#world,
#container-map {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 0;
  margin: 0;
  padding-top: 49.82167946%; /* Aspect ratio */
}
#container-map {
  z-index: 1;
  padding-top: 51.56646615%; /* Aspect ratio */
}
.map {
  fill: #aceda1;
}
.arrow {
  width: 25%;
  height: 46%;
  opacity: 1;
}
.pulse,
#marker > svg {
  /*fill: #fff;*/
  fill: #ff5f5b;
}
#paradise,
.map,
.arrow,
.pulse,
svg {
  cursor: default;
  pointer-events: none;
}
#marker {
  -webkit-animation: fall 1000ms ease-in both !important;
  animation: fall 1000ms ease-in both !important;
}
#marker,
#marker > svg {
  transform: translateZ(0);
  transform-origin: 50% 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
#marker:hover > svg {
  -webkit-animation: wobble 1000ms both !important;
  animation: wobble 1000ms both !important;
}
.me {
  transform-origin: 50% 50%;
  -webkit-animation: pulse 3000ms ease-in infinite both !important;
  animation: pulse 3000ms ease-in infinite both !important;
}
.reveal #c {
  -webkit-animation: reveal 900ms ease-in both;
  animation: reveal 900ms ease-in both;
}
.hide #c {
  -webkit-animation: hide 900ms ease-out both;
  animation: hide 900ms ease-out both;
}
.reveal .map,
.reveal .arrow,
.hide .arrow,
.hide #closeBtn,
.reveal .pulse {
  -webkit-animation: fade-out 200ms ease-in both;
  animation: fade-out 200ms ease-in both;
  pointer-events: none;
  cursor: default;
}
.hide .map,
.hide .pulse {
  -webkit-animation: fade-in 300ms 600ms ease-out both;
  animation: fade-in 300ms 600ms ease-out both;
}
.reveal #marker,
.reveal #marker > svg,
.hide #marker,
.hide #marker > svg {
  -webkit-animation: none;
  animation: none;
}
#marker.fade {
  transition: opacity 200ms ease-in;
  opacity: 0.00001;
  pointer-events: none;
  cursor: default;
}
#marker.show {
  transition: opacity 300ms ease-out;
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
}
#closeBtn {
  z-index: 1;
  left: auto;
  right: 0;
  width: 50px;
  height: 50px;
}
#closeBtn.hide {
  transition: opacity 300ms;
  opacity: 0.00001;
  cursor: default;
  pointer-events: none;
}
#closeBtn.show {
  opacity: 0.4;
  cursor: pointer;
  pointer-events: auto;
}
#closeBtn.show:hover {
  opacity: 0.8;
}
.pins,
.pins-savage {
  background: none;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  box-shadow: none;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  -o-appearance: none;
  appearance: none;
}
.draw-arrow {
  -webkit-animation: draw 1200ms 1000ms ease-out 1 forwards;
  animation: draw 1200ms 1000ms ease-out 1 forwards;
}
.tail-1 {
  -webkit-animation-delay: 1400ms;
  animation-delay: 1400ms;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
.tail-2 {
  -webkit-animation-delay: 1800ms;
  animation-delay: 1800ms;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}

@-webkit-keyframes draw {
  0% {
    stroke-dashoffset: 400;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@keyframes draw {
  0% {
    stroke-dashoffset: 400;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@-webkit-keyframes fall {
  0% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    transform: translateY(-50vmax) scale(1, 1);
  }
  50% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    transform: translateY(0) scale(1, 1);
  }
  55% {
    transform: scale(1.3, 0.8);
  }
  60% {
    transform: translateY(-8%) scale(1, 1);
  }
  64% {
    transform: translateY(-14%) scale(0.85, 1.03);
  }
  70% {
    transform: translateY(0) scale(0.95, 1.05);
  }
  73%,
  100% {
    transform: scale(1, 1);
  }
}
@keyframes fall {
  0% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    transform: translateY(-50vmax) scale(1, 1);
  }
  50% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    transform: translateY(0) scale(1, 1);
  }
  55% {
    transform: scale(1.3, 0.8);
  }
  60% {
    transform: translateY(-8%) scale(1, 1);
  }
  64% {
    transform: translateY(-14%) scale(0.85, 1.03);
  }
  70% {
    transform: translateY(0) scale(0.95, 1.05);
  }
  73%,
  100% {
    transform: scale(1, 1);
  }
}
@-webkit-keyframes wobble {
  15% {
    transform: rotate(-5deg);
  }
  30% {
    transform: rotate(3deg);
  }
  45% {
    transform: rotate(-3deg);
  }
  60% {
    transform: rotate(2deg);
  }
  75% {
    transform: rotate(-1deg);
  }
}
@keyframes wobble {
  15% {
    transform: rotate(-5deg);
  }
  30% {
    transform: rotate(3deg);
  }
  45% {
    transform: rotate(-3deg);
  }
  60% {
    transform: rotate(2deg);
  }
  75% {
    transform: rotate(-1deg);
  }
}
@-webkit-keyframes pulse {
  0% {
    r: 0;
    opacity: 0.00001;
  }
  50%,
  70% {
    opacity: 0.4;
  }
  100% {
    r: 9;
    opacity: 0.00001;
  }
}
@keyframes pulse {
  0% {
    r: 0;
    opacity: 0.00001;
  }
  50%,
  70% {
    opacity: 0.4;
  }
  100% {
    r: 9;
    opacity: 0.00001;
  }
}
@-webkit-keyframes reveal {
  0% {
    r: 1.9;
  }
  100% {
    r: 845.2;
  }
}
@keyframes reveal {
  0% {
    r: 1.9;
  }
  100% {
    r: 845.2;
  }
}
@-webkit-keyframes hide {
  0% {
    r: 845.2;
  }
  100% {
    r: 1.9;
  }
}
@keyframes hide {
  0% {
    r: 845.2;
  }
  100% {
    r: 1.9;
  }
}
@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0.00001;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0.00001;
  }
}
@-webkit-keyframes fade-in {
  0% {
    opacity: 0.00001;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0.00001;
  }
  100% {
    opacity: 1;
  }
}
.marker-position {
  width: 50px;
  height: 50px;
  margin: -40px 0 0 -25px;
}

.pulse-position {
  margin: -10px 0 0 -10px;
}

.pins-savage > svg {
  width: 40px;
  height: 50px;
  /*fill: #44D62C !important;*/
}

.pins > svg {
  width: 20px;
  height: 30px;
}

.pin-one {
  top: 38%;
  left: 25.4%;
}

.pin-two {
  top: 39.5%;
  left: 26.2%;
}

.pin-three {
  top: 41%;
  left: 25.4%;
}

.pin-four {
  top: 45.7%;
  left: 23%;
}

.pin-five {
  top: 47.5%;
  left: 23.8%;
}

.pin-six {
  top: 68%;
  left: 37.5%;
}

.pin-seven {
  top: 75.6%;
  left: 35.9%;
}

.pin-eight {
  top: 56.98999767%;
  left: 68.2%;
}

.pins-savage {
  top: 48%;
  left: 25.4%;
}

@media (max-width: 768px) {
  .me {
    display: none;
  }

  .pins-savage > svg {
    width: 15px;
    height: 35px;
  }

  .pins > svg {
    width: 10px;
    height: 20px;
  }

  .pin-one {
    top: 38%;
    left: 25.4%;
  }

  .pin-two {
    top: 39.5%;
    left: 26.2%;
  }

  .pin-three {
    top: 41%;
    left: 25.4%;
  }

  .pin-four {
    top: 45.7%;
    left: 23%;
  }

  .pin-five {
    top: 47.5%;
    left: 23.8%;
  }

  .pin-six {
    top: 70%;
    left: 37.5%;
  }

  .pin-seven {
    top: 76%;
    left: 35.9%;
  }

  .pin-eight {
    top: 61%;
    left: 68.2%;
  }

  .pins-savage {
    top: 51%;
    left: 25.3%;
  }
}
/* careers */
h4.eael-accordion-tab-title {
  float: left;
  width: 95%;
}

.active svg.fa-toggle.e-font-icon-svg.e-fas-plus {
  fill: #fff;
  width: 25px;
  height: 20px;
  padding: 0;
}

@media (min-width: 1025px) {
  .menu-service {
    width: 134px;
  }

  .new-menu a.elementor-icon {
    color: #44d62c !important;
  }
}
/* CSS PAGE CASE STUDIES */
.parent {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(11, 280px);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  max-width: 1140px;
}

.div1 {
  grid-area: 1 / 1 / 2 / 2;
}

.div2 {
  grid-area: 2 / 1 / 3 / 2;
}

.div3 {
  grid-area: 3 / 1 / 4 / 2;
}

.div4 {
  grid-area: 4 / 1 / 5 / 2;
}

.div5 {
  grid-area: 5 / 1 / 6 / 2;
}

.div6 {
  grid-area: 6 / 1 / 7 / 2;
}

.div7 {
  grid-area: 7 / 1 / 8 / 2;
}

.div8 {
  grid-area: 8 / 1 / 9 / 2;
}

.div9 {
  grid-area: 9 / 1 / 10 / 2;
}

.div10 {
  grid-area: 10 / 1 / 11 / 2;
}

.div11 {
  grid-area: 11 / 1 / 12 / 2;
}

.div1,
.div2,
.div3,
.div4,
.div5,
.div6,
.div7,
.div8,
.div9,
.div10,
.div11 {
  background-color: #fef9f3;
}

@media (min-width: 642px) and (max-width: 1024px) {
  .parent {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(12, 280px);
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .div1 {
    grid-area: 1 / 1 / 2 / 2;
  }

  .div2 {
    grid-area: 1 / 2 / 2 / 3;
  }

  .div3 {
    grid-area: 2 / 1 / 3 / 2;
  }

  .div4 {
    grid-area: 2 / 2 / 3 / 3;
  }

  .div5 {
    grid-area: 3 / 1 / 4 / 2;
  }

  .div6 {
    grid-area: 3 / 2 / 4 / 3;
  }

  .div7 {
    grid-area: 4 / 1 / 5 / 2;
  }

  .div8 {
    grid-area: 4 / 2 / 5 / 3;
  }

  .div9 {
    grid-area: 5 / 1 / 6 / 2;
  }

  .div10 {
    grid-area: 5 / 2 / 6 / 3;
  }

  .div11 {
    grid-area: 6 / 1 / 7 / 2;
  }

  .div12 {
    grid-area: 6 / 2 / 7 / 3;
  }

  .div13 {
    grid-area: 7 / 1 / 8 / 2;
  }

  .div14 {
    grid-area: 7 / 2 / 8 / 3;
  }

  .div15 {
    grid-area: 8 / 1 / 9 / 2;
  }

  .div16 {
    grid-area: 8 / 2 / 9 / 3;
  }

  .div17 {
    grid-area: 9 / 1 / 10 / 2;
  }

  .div18 {
    grid-area: 9 / 2 / 10 / 3;
  }

  .div19 {
    grid-area: 10 / 1 / 11 / 2;
  }

  .div20 {
    grid-area: 10 / 2 / 11 / 3;
  }

  .div21 {
    grid-area: 11 / 1 / 12 / 2;
  }

  .div22 {
    grid-area: 11 / 2 / 12 / 3;
  }

  .div23 {
    grid-area: 12 / 1 / 13 / 2;
  }

  .div24 {
    grid-area: 12 / 2 / 13 / 3;
  }
}

@media (min-width: 1025px) {
  .parent {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(11, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .div1 {
    grid-area: 1 / 1 / 2 / 3;
  }

  .div2 {
    grid-area: 1 / 3 / 2 / 4;
  }

  .div3 {
    grid-area: 2 / 1 / 3 / 2;
  }

  .div4 {
    grid-area: 2 / 2 / 3 / 3;
  }

  .div5 {
    grid-area: 2 / 3 / 3 / 4;
  }

  .div6 {
    grid-area: 3 / 1 / 4 / 4;
  }

  .div7 {
    grid-area: 4 / 1 / 5 / 2;
  }

  .div8 {
    grid-area: 4 / 2 / 5 / 3;
  }

  .div9 {
    grid-area: 4 / 3 / 5 / 4;
  }

  .div10 {
    grid-area: 5 / 1 / 6 / 3;
  }

  .div11 {
    grid-area: 5 / 3 / 6 / 4;
  }

  .div12 {
    grid-area: 6 / 1 / 7 / 2;
  }

  .div13 {
    grid-area: 6 / 2 / 7 / 3;
  }

  .div14 {
    grid-area: 6 / 3 / 7 / 4;
  }

  .div15 {
    grid-area: 7 / 1 / 8 / 4;
  }

  .div16 {
    grid-area: 8 / 1 / 9 / 2;
  }

  .div17 {
    grid-area: 8 / 2 / 9 / 3;
  }

  .div18 {
    grid-area: 8 / 3 / 9 / 4;
  }

  .div19 {
    grid-area: 9 / 1 / 10 / 4;
  }

  .div20 {
    grid-area: 10 / 1 / 11 / 3;
  }

  .div21 {
    grid-area: 10 / 3 / 11 / 4;
  }

  .div22 {
    grid-area: 11 / 1 / 12 / 2;
  }

  .div23 {
    grid-area: 11 / 2 / 12 / 3;
  }

  .div24 {
    grid-area: 11 / 3 / 12 / 4;
  }
}

.container {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  min-height: 100vh;
}

.box-cs {
  position: relative;
  width: 100%;
  height: 280px;
}

.box-cs video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-title {
  z-index: 10;
  position: absolute;
  color: #fff;
  bottom: 20px;
  left: 20px;
  font-family: "Montserrat", Sans-serif;
  font-weight: 600;
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  display: none;
}

.i-block {
  display: block;
}

video.clip {
  /*height: 280px;*/
  object-fit: cover;
}

.card-cs {
  position: relative;
  width: 100%;
  height: 280px;
  display: inline-block;
  background-size: cover;
  background-position: center center;
}

.card-cs .img-top {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
  object-fit: cover;
}

.card-cs:hover .img-top {
  display: inline;
}

.card-cs1 {
  background-image: url("/wp-content/uploads/2022/07/work3.png");
}

.card-cs1:hover {
  background: url("/wp-content/uploads/2022/07/image1b.jpeg");
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs2 {
  background-image: url("/wp-content/uploads/2022/07/header-roids.jpg");
  background-position: center right;
}

.card-cs2:hover {
  background: url("/wp-content/uploads/2022/07/footerWill.png");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs3 {
  background-image: url("/wp-content/uploads/2022/09/snaptoys.jpg");
}

.card-cs3:hover {
  background: url("/wp-content/uploads/2022/07/footerRoids.png");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs4 {
  background-image: url("/wp-content/uploads/2022/08/bg_belladahl.jpg");
  background-position: center right;
}

.card-cs4:hover {
  background: url("/wp-content/uploads/2022/08/footer_snaptoys.jpg");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs5 {
  background-image: url("/wp-content/uploads/2022/08/lincoln.png");
  background-position: center right;
}

.card-cs5:hover {
  background: url("/wp-content/uploads/2022/07/Screen-Shot-2022-07-29-at-9.38.49-AM.png");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs6 {
  background-image: url("/wp-content/uploads/2022/08/bgfooterAmericanPreSchool-scaled.jpg");
  background-position: center right;
}

.card-cs6:hover {
  background: url("/wp-content/uploads/2022/08/Group-01766.png");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs7 {
  background-image: url("/wp-content/uploads/2022/08/bgMontereyf.jpg");
  background-position: center right;
}

.card-cs7:hover {
  background: url("/wp-content/uploads/2022/08/catagory-slider-copy171.jpg");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs8 {
  background-image: url("/wp-content/uploads/2022/08/1637495304558.jpeg");
  background-position: center center;
}

.card-cs8:hover {
  background: url("/wp-content/uploads/2022/08/250922960_10159740480076276_5386818122553607200_n.jpeg");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs9 {
  background-image: url("/wp-content/uploads/2022/08/bgFord.jpg");
  background-position: center right;
}

.card-cs9:hover {
  background: url("/wp-content/uploads/2022/08/cq5dam.web_.1440.1440.webp");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs10 {
  background-image: url("/wp-content/uploads/2022/09/gridHomehub-cs.jpg");
  background-position: center right;
}

.card-cs10:hover {
  background: url("/wp-content/uploads/2022/08/bgHomehub.jpg");
  background-position: center bottom;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs11 {
  background-image: url("/wp-content/uploads/2022/08/IMG_0535-1.jpg");
  background-position: center right;
}

.card-cs11:hover {
  background: url("/wp-content/uploads/2022/08/bgEYS.jpg");
  background-position: center right;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs12 {
  background-image: url("/wp-content/uploads/2022/09/bg-eys.jpg");
  background-position: center right;
}

.card-cs12:hover {
  background: url("/wp-content/uploads/2022/08/bgHeaderSwarm.jpg");
  background-position: center right;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs13 {
  background-image: url("/wp-content/uploads/2022/09/bg-iord-scaled-e1663681302617.jpg");
  background-position: center center;
}

.card-cs13:hover {
  background: url("/wp-content/uploads/2023/03/ior_car.jpg");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs14 {
  background-image: url("/wp-content/uploads/2023/03/Bahamas-Deep-water-dockage.jpeg");
  background-position: center center;
}

.card-cs14:hover {
  background: url("/wp-content/uploads/2022/09/home-bradford-1-scaled.jpg");
  background-position: bottom center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs15 {
  background-image: url("/wp-content/uploads/2022/10/bg-bradford7.jpg");
  background-position: center center;
}

.card-cs15:hover {
  background: url("/wp-content/uploads/2022/10/bgClothesFinal.jpg");
  background-position: bottom center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs16 {
  background-image: url("/wp-content/uploads/2022/10/call-thesport-prophets.jpg");
  background-position: center center;
}

.card-cs16:hover {
  background: url("/wp-content/uploads/2022/10/bg-thesport-prophets.jpg");
  background-position: bottom right;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs17 {
  background-image: url("/wp-content/uploads/2022/11/cta-flight.jpg");
  background-position: center center;
}

.card-cs17:hover {
  background: url("/wp-content/uploads/2022/10/bg-flight.jpg");
  background-position: bottom right;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs18 {
  background-image: url("/wp-content/uploads/2022/10/call-Downs-Law-Group.jpg");
  background-position: center center;
}

.card-cs18:hover {
  background: url("/wp-content/uploads/2022/10/bg-DownsLawGroup.jpg");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}

.card-cs19 {
  background-image: url("/wp-content/uploads/2022/10/bgdowns.png");
  background-position: center center;
}

.card-cs19:hover {
  background: url("/wp-content/uploads/2022/10/headergowd.jpg");
  background-position: center center;
  background-size: cover;
  background-blend-mode: darken;
}
/* video box */
.grid-video h2 {
  font-weight: 700;
  font-family: "Montserrat", Sans-serif;
  font-size: 26px;
}
.clip {
  max-width: 100%;
  width: 100%;
  cursor: none;
}

.grid-video {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  padding: 24px;
  max-width: 1400px;
}

@media (min-width: 767px) {
  /* grid layout */
  .grid-video {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .grid-video-item1 {
    grid-area: 1 / 1 / 2 / 2;
  }

  .grid-video-item2 {
    grid-area: 1 / 2 / 2 / 3;
  }

  .grid-video-item3 {
    grid-area: 2 / 1 / 3 / 2;
  }

  .grid-video-item4 {
    grid-area: 2 / 2 / 3 / 3;
  }
} /* end */

video .clip {
  max-width: 100%;
  width: 100%;
  cursor: none;
}

.cursor {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  width: auto;
  height: auto;
  border-radius: 0%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  z-index: 1;
}

.cursor::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
}
.piu {
  display: block;
  font-size: 0.5rem;
  opacity: 0;
  font-family: "Montserrat", Sans-serif;
  padding: 6px 8px;
  background: #000;
  color: #fff;
  font-size: 8px;
}
.piu.active {
  display: block;
  margin-top: 31.3%;
}

div#wrapper a {
  cursor: none;
}

.grid-video {
  max-width: 1400px;
  overflow-x: hidden;
  overflow-y: hidden;
  overscroll-behavior-y: none;
  padding: 0;
  height: 100%;
}

#wrapper video.clip {
  max-height: 450px;
  height: 450px;
  object-fit: cover;
}

.parent .clip {
  cursor: pointer !important;
}

span.mobtext {
  display: none;
}

@media (max-width: 1024px) {
  .cursor {
    display: none;
  }
  span.mobtext {
    background: #000;
    padding: 8px;
    color: #fff;
    position: relative;
    z-index: 10;
    float: right;
    top: -42px;
    bottom: 0;
    display: block !important;
  }
}

@media (max-width: 414px) {
  #wrapper video.clip {
    max-height: 250px;
    height: 250px;
    object-fit: cover;
  }
} // end