@import url(https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600&display=swap);
.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.header-1-font{font-family:Barlow;font-weight:500;font-size:1.875rem;line-height:2.25rem;letter-spacing:.04rem;font-style:normal}.header-1-font.preserve-sizing{font-size:2.25rem;line-height:2.688rem}@media(min-width: 768px){.header-1-font{font-size:2.25rem;line-height:2.688rem}}.header-2-font{font-family:Barlow;font-weight:500;font-size:1.5rem;line-height:1.813rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.header-3-font{font-family:Barlow;font-weight:500;font-size:1rem;line-height:1.188rem;letter-spacing:.06rem;font-style:normal}.button-font{font-family:Barlow;font-weight:500;font-size:1rem;line-height:1.188rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.small-button-font{font-family:Barlow;font-weight:500;font-size:.75rem;line-height:.875rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.bold-font{font-family:Barlow;font-weight:600;font-size:1.125rem;line-height:1.375rem;letter-spacing:.04rem;font-style:normal}.body-font{font-family:Barlow;font-weight:400;font-size:1.125rem;line-height:1.375rem;letter-spacing:.04rem;font-style:normal}.caption{font-family:Barlow;font-weight:600;font-size:.625rem;line-height:.75rem;letter-spacing:.02em;text-transform:uppercase}.detail-font{font-family:Barlow;font-weight:300;font-size:1rem;line-height:1.188rem;letter-spacing:.04rem;font-style:normal}.dashboard-tabs-only-font{font-family:Barlow;font-weight:300;font-size:.625rem;line-height:.625rem;letter-spacing:.04rem;font-style:normal}.cookie-switch{display:inline-block}.cookie-switch span{position:relative;width:48px;height:24px;float:left}.cookie-switch span input{display:none}.cookie-switch span input:checked+.cookie-slider{background-color:#4699c7}.cookie-switch span input:checked+.cookie-slider:before{transform:translateX(24px);background-color:#000}.cookie-switch span input:focus+.cookie-slider{box-shadow:0 0 1px #4699c7}.cookie-switch label{line-height:34px;margin-left:12px;cursor:pointer}.cookie-slider{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;border:0;height:24px;outline:none;background-color:#8a9098;transition:.4s;border-radius:16px;cursor:pointer}.cookie-slider:before{position:absolute;content:"";height:22px;width:22px;left:1px;bottom:1px;background-color:#000;transition:.4s;border-radius:50%}
.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.header-1-font{font-family:Barlow;font-weight:500;font-size:1.875rem;line-height:2.25rem;letter-spacing:.04rem;font-style:normal}.header-1-font.preserve-sizing{font-size:2.25rem;line-height:2.688rem}@media(min-width: 768px){.header-1-font{font-size:2.25rem;line-height:2.688rem}}.header-2-font{font-family:Barlow;font-weight:500;font-size:1.5rem;line-height:1.813rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.header-3-font{font-family:Barlow;font-weight:500;font-size:1rem;line-height:1.188rem;letter-spacing:.06rem;font-style:normal}.button-font{font-family:Barlow;font-weight:500;font-size:1rem;line-height:1.188rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.small-button-font{font-family:Barlow;font-weight:500;font-size:.75rem;line-height:.875rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.bold-font{font-family:Barlow;font-weight:600;font-size:1.125rem;line-height:1.375rem;letter-spacing:.04rem;font-style:normal}.body-font{font-family:Barlow;font-weight:400;font-size:1.125rem;line-height:1.375rem;letter-spacing:.04rem;font-style:normal}.caption{font-family:Barlow;font-weight:600;font-size:.625rem;line-height:.75rem;letter-spacing:.02em;text-transform:uppercase}.detail-font{font-family:Barlow;font-weight:300;font-size:1rem;line-height:1.188rem;letter-spacing:.04rem;font-style:normal}.dashboard-tabs-only-font{font-family:Barlow;font-weight:300;font-size:.625rem;line-height:.625rem;letter-spacing:.04rem;font-style:normal}div.container{display:-webkit-flex;display:-webkit-box;display:-moz-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-shrink:0;flex-direction:row;justify-content:center;align-items:center;width:68px;height:100px;position:fixed;bottom:28px;z-index:999999}@media only screen and (max-width: 769px){div.container{bottom:90px}}div.open{right:16px}div.closed{right:-50px}div.tab{display:-webkit-flex;display:-webkit-box;display:-moz-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-shrink:0;flex-direction:column;justify-content:center;align-items:center;background-color:#eff2f5;width:13px;height:24px;border-radius:6px 0px 0px 6px;box-shadow:4px 12px 24px rgba(87,130,155,.3);padding-right:1px;cursor:pointer}img.arrow{width:9px}div.launcher{display:-webkit-flex;display:-webkit-box;display:-moz-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-shrink:0;flex-direction:column;justify-content:space-evenly;align-items:center;background-color:#eff2f5;width:55px;height:100px;border-radius:10px;box-shadow:4px 12px 24px rgba(87,130,155,.3)}img.launch-icon{width:35px;cursor:pointer}div.separator{width:30px;height:1px;background-color:#bcc1c8}div.hotjar{display:-webkit-flex;display:-webkit-box;display:-moz-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-shrink:0;flex-direction:column;position:fixed;right:16px;top:47%;-ms-transform:translateY(-50%);-webkit-transform:translate(0, -50%);transform:translate(0, -50%);z-index:999999;justify-content:space-evenly;align-items:flex-end;background-color:#1d272e;color:#eff2f5;border-radius:10px;padding:10px}div.hjOpen{box-shadow:4px 12px 24px rgba(87,130,155,.3)}div.hjClose{cursor:pointer;text-orientation:mixed;writing-mode:vertical-rl}div.hjClose:hover{box-shadow:4px 12px 24px rgba(87,130,155,.3)}div.pointer{cursor:pointer}
/*
 * This file overwrites the default style classes for React Responsive carousel.
 *
 * See npm docs here: https: //www.npmjs.com/package/react-responsive-carousel
 * Solution from github: https: //github.com/leandrowd/react-responsive-carousel/issues/150#issuecomment-381278057
 *
 */
.logo-showcase .carousel{
    max-width: 100% !important;
}

.logo-showcase .carousel .slide {
    padding: 0px !important;
    max-width: 100% !important;
}

.logo-showcase .carousel .slide img {
    cursor: pointer;
}

.logo-showcase .control-dots .dot.selected {
    background: linear-gradient(225deg, #4150AF 0%, #4699C7 50.39%, #4AE0DF 100%) !important;
}

.contact-supply-selector {
    font-size: 16px;
    font-family: 'barlow-regular';
    font-weight: 500;
    border: none;
    max-width: 20px;
    text-align: center;
}

.contact-supply-selector::-webkit-outer-spin-button,
.contact-supply-selector::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.contact-supply-selector[type=number] {
    -moz-appearance:textfield;
}
.carousel .thumbs {
  display: flex;
  justify-content: center;
  align-items: center;
}

.carousel .thumbs .thumb {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
}

.carousel .thumbs .thumb img {
  border-radius: 5px;
  width: 90%;
  height: auto;
  object-fit: contain;
}

.carousel.carousel-slider {
  overflow: visible;
}

.carousel .thumbs-wrapper {
  visibility: hidden;
}

.carousel .slide {
  display: flex;
  align-items: center;
  background: white;
  padding: 30px 0;
  max-height: 250px;
  min-height: 250px;
}

.carousel .slide img {
  max-width: 90% !important;
  max-height: 100%;
  object-fit: contain !important;
}

/* Control Dots */

.control-dots .dot {
  background: #BCC1C8 !important;
  border: none;
  box-shadow: none !important;
  width: 8px;
  height: 8px;
  opacity: 1 !important;
  border-radius: 4px !important;
  margin: 0 3px !important;
  bottom: -20px !important;
}

.control-dots .dot.selected {
  width: 24px !important;
}

/* arrows */
.carousel .control-next.control-arrow, .carousel .control-next.control-arrow:hover{
  background-color: transparent;
  right: 0px;
}

.carousel .control-prev.control-arrow, .carousel .control-prev.control-arrow:hover {
  background-color: transparent;
  left: 0px;
}

.carousel .control-arrow, .carousel.carousel-slider .control-arrow{
  opacity: 1;
}

.carousel .control-next.control-arrow:before {
  content: '';
  border: solid #8A9098;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 1.5vh;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.carousel .control-prev.control-arrow:before {
  content: '';
  border: solid #8A9098;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 1.5vh;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

/* @media (max-height: 768px) {
  .carousel .slide {
    padding-top: 0px;
    height: auto;
  }
  .carousel .slide img {
    width: 90%;
    height: auto;
  }
} */

@media (max-width: 768px) {
  .carousel .slide {
    padding-top: 0px;
    height: auto;
  }
  .carousel .slide img {
    width: 80%;
    height: auto;
  }
}

.carousel .control-dots {
  bottom: -40px;
}

/*
 * This file overwrites the default style classes for React Responsive carousel.
 *
 * See npm docs here: https: //www.npmjs.com/package/react-responsive-carousel
 * Solution from github: https: //github.com/leandrowd/react-responsive-carousel/issues/150#issuecomment-381278057
 *
 */

 .carousel .slider {
    align-items: center;
 }

.carousel .slide {
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    padding: 50px !important;
    height: 100% !important;
    max-height: 600px !important;
    width: 100% !important;
    max-width: 800px !important;
}

.carousel .slide img {
    border-radius: 10px;
}

@media only screen and (max-width: 768px) {
    .carousel .slide {
        padding: 25px !important;
        width: 250px !important;
        height: 250px !important;
    }
}

.commonImageStyle {
  position: absolute;
  max-height: 100%;
  max-width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.svg-style {
  max-width: 90% !important;
  width: 90%;
  height: 100%;
}
.frame-composite-container{position:relative;width:100%;height:150px;max-width:300px}.frame-composite-container img{width:100% !important;height:auto !important}.frame-composite-container svg{width:100% !important;height:auto !important;max-width:100% !important}
.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.display-none{display:none}@media(max-width: 768px){.desktop-only{display:none}}@media(min-width: 768px){.mobile-only{display:none}}@media(min-width: 1200px){.xl-none{display:none}}@media(min-width: 1200px){.xl-block{display:block}}.header-1-font{font-family:Barlow;font-weight:500;font-size:1.875rem;line-height:2.25rem;letter-spacing:.04rem;font-style:normal}.header-1-font.preserve-sizing{font-size:2.25rem;line-height:2.688rem}@media(min-width: 768px){.header-1-font{font-size:2.25rem;line-height:2.688rem}}.header-2-font{font-family:Barlow;font-weight:500;font-size:1.5rem;line-height:1.813rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.header-3-font{font-family:Barlow;font-weight:500;font-size:1rem;line-height:1.188rem;letter-spacing:.06rem;font-style:normal}.button-font{font-family:Barlow;font-weight:500;font-size:1rem;line-height:1.188rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.small-button-font{font-family:Barlow;font-weight:500;font-size:.75rem;line-height:.875rem;letter-spacing:.06rem;font-style:normal;text-transform:uppercase}.bold-font{font-family:Barlow;font-weight:600;font-size:1.125rem;line-height:1.375rem;letter-spacing:.04rem;font-style:normal}.body-font{font-family:Barlow;font-weight:400;font-size:1.125rem;line-height:1.375rem;letter-spacing:.04rem;font-style:normal}.caption{font-family:Barlow;font-weight:600;font-size:.625rem;line-height:.75rem;letter-spacing:.02em;text-transform:uppercase}.detail-font{font-family:Barlow;font-weight:300;font-size:1rem;line-height:1.188rem;letter-spacing:.04rem;font-style:normal}.dashboard-tabs-only-font{font-family:Barlow;font-weight:300;font-size:.625rem;line-height:.625rem;letter-spacing:.04rem;font-style:normal}div.auth-container{display:-webkit-flex;display:-webkit-box;display:-moz-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-shrink:0;flex-direction:row;min-width:calc(100% - 330px - 200px);max-width:calc(100% - 330px - 200px)}div.auth-media{min-height:100%;max-height:calc(100vh - 100px);width:100%;position:relative;overflow:hidden}div.auth-text{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:554px;max-width:85%;height:auto;z-index:11}div.auth-text>p{font-size:36px;line-height:43px;font-family:"barlow-regular";font-weight:600;color:#fff;margin-bottom:98px}div.auth-text>div{display:flex;align-items:center;justify-content:space-between;margin-bottom:38px}div.auth-text>div img{width:120px;height:80px;object-fit:contain}p.auth-text-header{font-size:16px;line-height:19px;font-family:"barlow-regular";font-weight:500;color:#fff;margin-bottom:12px;text-transform:uppercase}p.auth-text-description{font-size:18px;line-height:22px;font-family:"barlow-light";font-weight:400;color:#fff;margin-bottom:12px}div.auth-overlay{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background:linear-gradient(36.88deg, rgba(74, 224, 223, 0.5) 0%, rgba(65, 80, 175, 0.5) 100%),linear-gradient(37.11deg, rgba(4, 15, 23, 0.6) 0%, rgba(0, 0, 0, 0.25) 100.35%);z-index:10}div.swoosh{display:-webkit-flex;display:-webkit-box;display:-moz-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-shrink:0;flex-direction:row;z-index:11}div.swoosh-main{width:2rem;border-radius:0 0 2rem 0;background-color:#fff}div.swoosh-extension{width:2rem;height:2rem;background-image:radial-gradient(circle at 2rem 2rem, transparent 2rem, white 2rem)}img.auth-image{height:100%;width:100%;object-fit:cover;object-position:center;z-index:1}
.react-datepicker-wrapper {
    display: block;
}

/* 
    For applying styling to the google autocomplete api.
    Full list of classes can be found here:
    https://developers.google.com/maps/documentation/javascript/places-autocomplete#style_autocomplete
*/

html .pac-container {
  border-radius: 10px !important;
  padding: 10px;
  z-index: 1000001;
}
html .pac-item {
  font-family: barlow-medium;
}
html .pac-item:hover {
  background: #EFF2F5;
  border-radius: 10px;
}
html .pac-item-selected {
  background: linear-gradient(225deg, #4150AF 0%, #4AE0DF 100%);
  color: white;
  border-radius: 10px;
}
apple-pay-button {
  --apple-pay-button-width: 140px;
  --apple-pay-button-height: 30px;
  --apple-pay-button-border-radius: 5px;
  --apple-pay-button-padding: 5px 0px;
}

.StripeElement {
  height: 22px;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 5px;
  width: calc(100% - 30px);
  color: #1D272E;
  background-color: white;
  border: 2px solid #8A9098;
  border-radius: 25px;
}

.StripeElement--focus {
  border: 2px solid transparent;
  background-image: linear-gradient(white, white), linear-gradient(225deg, #4150AF 0%, #4150AF 0.01%, #4AE0DF 100%);
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.StripeElement--invalid {
  border-color: #FF6F61;
}