/* Extracted from new_home_styles.php, which was inlined into every page's head.
   As a file it is cached once instead of re-sent with every HTML response.
   Edit this file and re-upload to change these styles. */

    html, body{
        overflow-x: hidden;
    }
    .home-cont, .footer-cont {
        overflow: hidden;
    }

    .header-section .container-fluid a.cart.icon {
      position: relative;
      font-size: 30px;
      color: #000;
      padding: 16px;
      line-height: 30px;
    }

    .js-fix-header .header-section .container-fluid a.cart.icon,
     .index-page .header-section .container-fluid a.cart.icon {
    	color:#fff;
    }

    .header-section .container-fluid a.cart.icon svg {
    	vertical-align: middle;
    }

    .header-section .container-fluid a.cart.icon span.item-count {
		  position: absolute;
		  bottom: calc(50% - 18px);
		  font-size: 12px;
		  background-color: #60FA67;
		  border-radius: 50%;
		  text-align: center;
		  padding: 4px 6px 3px 6px;
		  line-height: 1em;
		  font-weight: bold;
		  right: calc(50% - 25px);
		color:#000;
    }

    .flex {
        display: flex;
    }

    .flex-wrap {
        flex-wrap: wrap;
    }

    .content-block {
        width: 40%;
    }

    .content-block.larger {
        width: 65%;
    }

    .home .hero .content-block {
        padding-bottom: 150px;
    }

    .home .hero .content-block p {
        color: #fff !important;
    }

    .media-block {
        width: calc(60% - 100px);
        position: relative;
    }

    .media-block img {
        max-height: 80vh;
        min-height: 600px;
    }

    .media-block video {
        width: 100%;
        height: 100%;
        border-radius: 5px;
        max-height: 80vh;
        min-height: 600px;
    }

    .large-vid video {
        object-fit: cover;
        object-position: right;
        max-height: none;
        min-height: auto;
    }

    .mobile-vid video {
        object-fit: contain;
        object-position: center;
    }

    .shadow {
        box-shadow: 0px 28px 56px 0px rgba(0, 0, 0, 0.16);
    }

    .media-block.right {
        margin-left: 70px;
    }

    .media-block.left {
        margin-right: 70px;
    }

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

    .h-full {
        height: 100%;
    }
    .h-80{
        height: 80px;
    }

    .content-block h1 {
        font-size: 50px;
        font-style: normal;
        font-weight: 700;
        line-height: 58px; /* 116% */
        letter-spacing: 1px;
        color: #fff;
    }


    .home p {
        font-size: 18px;
        font-style: normal;
        font-weight: 475;
        line-height: 24px; /* 133.333% */
        color: #fff;
    }
    
    .shop-block p {
    	color:#000;
    }

    .content-block p {
        margin-top: 16px;
        color: #2A2F39
    }

    .content-block h2 {
        color: #2A2F39;
        font-size: 40px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        letter-spacing: 0.8px;
        margin-bottom: 10px;
    }

    .features-section h2{
        margin-bottom: 16px;
    }

    .darker-part .content-block h2 {
        color: #fff;
        margin-bottom: 8px;
    }

    .darker-part .content-block p {
        color: #fff;
    }

    .content-block h4 {
        color: #2A2F39;
        font-size: 24px;
        font-style: normal;
        font-weight: 625;
        line-height: normal;
    }

    .save h2 {
        margin-bottom: 12px;
    }

    .industries h2 {
        max-width: 582px;
        margin: 0 auto;
    }

    .industries p {
        margin: 0 auto;
        margin-top: 24px;
        text-align: center;
        max-width: 582px;
    }

    .text-green {
        color: #60FA67 !important;
    }

    .map-bg {
        overflow: hidden;
        aspect-ratio: 19/10;
        /* mapbg.png is 2.9 MB; the webp is 64 KB. The plain url() stays first as
           the fallback for browsers without image-set support.

           These paths are absolute from the site root on purpose. Hummingbird
           moves this stylesheet to /wp-content/uploads/hummingbird-assets/, and a
           relative ../img/ path would then resolve against that folder and 404 —
           the hero would lose its map background. Do not make them relative. */
        background: url('/wp-content/themes/gsm/gulp/build/assets/img/index/mapbg.png') no-repeat;
        background-image: -webkit-image-set(url('/wp-content/themes/gsm/gulp/build/assets/img/index/mapbg.webp') type('image/webp'), url('/wp-content/themes/gsm/gulp/build/assets/img/index/mapbg.png') type('image/png'));
        background-image: image-set(url('/wp-content/themes/gsm/gulp/build/assets/img/index/mapbg.webp') type('image/webp'), url('/wp-content/themes/gsm/gulp/build/assets/img/index/mapbg.png') type('image/png'));
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    .green-btn {
        border-radius: 3px;
        background: #60FA67;
        color: #3C4352;
        text-align: center;
        font-size: 20px;
        font-style: normal;
        font-weight: 625;
        padding: 17px 66px;
        margin-top: 40px;
        line-height: 24px; /* 120% */
    }

    .relative {
        position: relative;
    }

    .absolute {
        position: absolute;
    }

    .right-tab {
        right: 10%;
    }

    .top-0 {
        top: 0;
    }

    .left-0 {
        left: 0;
    }

    .right-0 {
        right: 0;
    }

    .bottom-0 {
        bottom: 0;
    }

    .left-1\/2 {
        left: 50%;
    }

    .w-full{
        width: 100%;
    }

    .hand-img {
        position: absolute;
        right: -17%;
        bottom: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        pointer-events: none;
        max-width:1000px;
    }

    .cart-img {
        width: 31%;
        left: 49%;
        transform: translateX(-50%);
        margin-bottom: 20px;
        pointer-events: none;
        max-width:500px;
        z-index: 10;
    }

    .certs-img {
        width: 100%;
        height: 94px;
        object-fit: contain;
        object-position: 0 50%;
        margin-bottom: 20px;
    }

    .transform-center{
        left: 50%;
        transform: translateX(-50%);
    }

    .py-80 {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .pb-80 {
        padding-bottom: 80px;
    }

    .pt-80 {
        padding-top: 80px;
    }

    .py-120 {
        padding-top: 120px;
        padding-bottom: 120px;
    }

    .py-200 {
        padding-top: 200px;
        padding-bottom: 200px;
    }

    .bg-light {
        background: #F8F8F8;
    }

    .bg-lighter-gray {
        background: #3C4352;
    }

    .bg-lightest-gray {
        background: #ECECEC;
    }

    .text-white, .text-white > * {
        color: #fff;
    }

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

    .home h2 {
        font-size: 40px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        letter-spacing: 0.8px;
    }

    .w-arrow {
        width: 40px;
        height: 40px;
    }

    .progress {
        flex-grow: 1;
        width: auto;
        margin: 0 65px;
    }

    .progress .swiper-pagination {
        margin-top: 19px;
    }

    .swiper-button-next, .swiper-button-prev {
        width: 40px;
        height: 40px;
        background: #fff;
        border-radius: 16px;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0;
        padding: 0;
    }

    .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
        font-weight: bolder;
    }

    .pagination-container {
        margin-top: 16px;
    }

    .swiper-slide .text {
        text-align: center;
        font-size: 18px;
        font-style: normal;
        font-weight: 625;
        line-height: normal;
        color: #fff;
        margin-top: 16px;
    }

    .industries .swiper {
        margin-top: 40px;
    }

    .w-auto {
        width: auto;

    }

    .overflow-hidden {
        overflow: hidden;
    }

    .subheading {
        color: #949494;
        font-size: 12px;
        font-style: normal;
        font-weight: 625;
        line-height: 16px; /* 133.333% */
        letter-spacing: 2px;
        text-transform: uppercase;
        margin-bottom: 16px;
    }

    .darker-part .subheading {
        color: #60FA67;
    }

    .pr-80 {
        padding-right: 80px;
    }

    .features {
        margin-top: 40px;
        width: 100%;
    }

    .features li {
        display: list-item;
        color: #2A2F39;
        padding-left: 10px;
        margin-left: 18px;
        font-size: 18px;
        font-style: normal;
        font-weight: 625;
        line-height: normal;
        margin-bottom: 20px;
    }

    .features ul li::marker {
        width: 16px;
        height: 16px;
        content: url("data:image/svg+xml,%0A%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='15' height='15' rx='7.5' fill='%232A2F39' stroke='%232A2F39'/%3E%3Cpath d='M6.66662 10.1148L12.7946 3.98608L13.738 4.92875L6.66662 12.0001L2.42395 7.75742L3.36662 6.81475L6.66662 10.1148Z' fill='%2360FA67'/%3E%3C/svg%3E%0A");
    }

    .cols-3 {
        column-count: 3;
    }

    .-mt-80 {
        margin-top: -80px;
    }

    .-mb-80 {
        margin-bottom: -80px;
    }

    .line {
        width: 16px;
        margin: 0;
    }

    .line.green {
        border-color: #60FA67;
    }

    .app {
        margin-top: 84px;
    }

    .app h4 {
        margin-bottom: 24px;
    }

    .app-button svg {
        display: inline-block;
        width: 24px;
        height: 24px;
        vertical-align: text-bottom;
        margin-right: 8px;
    }

    .app-button span {
        vertical-align: middle;
    }

    .app-button {
        border-radius: 3px;
        padding: 11px 32px;
        color: #2A2F39;
        text-align: center;
        font-size: 16px;
        font-style: normal;
        font-weight: 625;
        line-height: 24px;
        border: 2px solid #60FA67;
    }

    .apple {
        background: #60FA67;
        margin-right: 24px;
    }

    .android {
        border: 2px solid #60FA67;
    }

    .darker-part .button {
        margin-top: 40px;
    }

    .button {
        display: inline-block;
        padding: 12px 77px;
        background: #60FA67;
        color: #3C4352;
        text-align: center;
        font-size: 16px;
        font-style: normal;
        font-weight: 625;
        line-height: 24px;
        border-radius: 3px;
    }

    .dark-bar {
        background: #3C4352;
        position: relative;
        text-align: right;
    }

    .dark-bar img{
        display: inline-block;
        max-width: 1000px;
        margin-top: -10vw;
        width: 100%;
        vertical-align: bottom;
    }

    .bg-white {
        background: #ffffff;
    }

    .bottom-bar {
        z-index: 10;
        position: relative;
    }

    .laptops {
        bottom: 0;
    }

    .bar-slant {
        left: -230px;
    }

    .title-cont {
        width: 75%;
    }

    .but-cont {
        width: 25%;
        text-align: right;
    }

    .but-mobile-cont {
        display: none;
        margin-top: 32px;
    }

    .items-end {
        align-items: end;
    }

    .mt-20 {
        margin-top: 20px;
    }
    
    .mb-20 {
        margin-bottom: 20px;
    }

    .mb-10 {
        margin-bottom: 10px;
    }

	.mb-60 {
        margin-bottom: 60px;
    }

    .one-study {
        width: calc(25% - 40px);
        margin: 0 20px;
        color: #000;
    }

    .case-img {
        aspect-ratio: 1/1;
        object-fit: cover;
        object-position: center;
        display: block;
    }

    .case-img-cont {
        position: relative;
    }

    .case-img-cont .tag {
        color: #3C4352;
        font-size: 12px;
        font-style: normal;
        font-weight: 550;
        line-height: 24px; /* 200% */
        letter-spacing: 2px;
        text-transform: uppercase;
        background: #60FA67;
        padding: 3px 11px 0px 11px;
        position: absolute;
        left: 18px;
        top: 18px;
        z-index: 10;
        display: block;
    }

    .case-studies {
        margin: 20px -20px 0px -20px;
        width: calc(100% + 40px);
    }

    .z-10{
        z-index: 10;
    }

    .one-study .title {
        font-size: 18px;
        font-style: normal;
        font-weight: 625;
        line-height: normal;
        margin-top: 24px;
    }

    .api-block {
        aspect-ratio: 1/1;
        background: #EFF1F7;
        padding: 25px;
    }

    .swiper-api .api-block{
        max-height: 200px;
    }

    .swiper-api .swiper-slide{
        max-width: 200px;
    }

    .api-block img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
    }
    .slant-padding-top{
        padding-top: 40px;
    }

    .slant{
        display: block;
    }

    .buttons {
        margin-top: 40px;
    }

    .bg-darker {
        background: #252A33;
    }

    .footer-section {
        background: #252A33;
    }

    .footer__list-point .footer__point-link {
        color: #fff
    }

    .footer__list {
        width: calc(66.66% - 295px);
    }

    .footer .logo {
        width: 180px;
    }

    .foot-certs {
        width: 370px;
    }

    .footer-sm-title {
        sans-serif;
        font-weight: 600;
        font-size: 18px;
        line-height: 21px;
        color: #fff;
        margin-top: 0px;
        margin-bottom: 24px;
    }

    .footer .social-links {
        margin-left: auto;
    }

    .footer .social-links svg {
        width: auto;
        margin-right: 16px;
        vertical-align: middle;
    }

    .footer .social-links a {
        color: #fff;
        margin-left: 24px;
    }

    .inline-block {
        display: inline-block;
    }

    .index-page.js-fix-header .header-section {
        background: #2A2F39 !important;
        z-index: 200;
    }

    .footer .certs {
        width: 370px;
    }

    .api-mob-cont{
        display: none;
    }

    .app-links{
        white-space: nowrap;
    }

    .slant-bot-bar, .extra-slant{
        left: 0%;
    }

    .footer-slant img{
        margin-top: clamp(-300px, -20vw, -100px);
    }


    @media (max-width: 1355px) {
        .home .hero .content-block {
            padding-bottom: 200px;
        }
        .map-bg {
            aspect-ratio: 19/12;
        }

        .slant-bot-bar .extra-slant{
            left: 0%;
        }

    }

    @media (max-width: 1040px) {
        .app-links{
            white-space: normal;
        }
        .footer__list {
            width: calc(100% - 220px);
        }

        .footer .logo {
            margin-right: calc(100% - 180px);
        }

        .footer .certs {
            width: 200px;
        }

        .footer__footer {
            flex-wrap: wrap;
        }

        .footer .social-links {
            width: 60%;
            font-size: 14px;
        }

        .footer__copyright, .footer__cookie {
            width: 40%;
        }

        .footer__cookie {
            order: 3;
            margin-left: 0;
        }

        .content-block, .content-block.larger {
            width: 100%;
        }

        .hand-img {
            position: relative;
            right: -20%;
            bottom: -10px;
        }

        .home .hero .content-block {
            padding-bottom: 110px;
        }

        .content-block h1 {
            font-size: 44px;
            font-style: normal;
            font-weight: 700;
            line-height: 56px; /* 127.273% */
            letter-spacing: 0.88px;
        }

        .map-bg {
            aspect-ratio: auto;
        }

        .cart-img {
            width: 31%;
            left: 25%;
            transform: translateX(-50%);
            margin-bottom: 95px;
        }

        .certs-img {
            margin-bottom: 0px;
        }

        .home .hero .right-tab {
            right: 30%;
            width: auto;
        }

        .py-120 {
            padding-top: 80px;
            padding-bottom: 80px;
        }

        .media-block {
            width: 100%;
            margin-left: 0 !important;
            margin-right: 0 !important;
            margin-top: 56px;
            order: 2;
        }


        .cols-3 {
            column-count: 2;
        }

        .case-studies {
            margin-top: -32px;
        }

        .one-study {
            width: calc(50% - 40px);
            margin-top: 32px;
        }

        .app {
            margin-top: 40px;
        }

        .title-cont {
            width: 100%;
        }

        .but-cont {
            display: none;
        }

        .but-mobile-cont {
            display: block;
        }

        .but-mobile-cont a {
            display: block;
        }

        .dark-bar img{
            margin-top: 0%;
        }

        .slant-bot-bar, .extra-slant{
            left: -30%;
        }

    }

    @media (max-width: 760px) {

        .home h2 {
            font-size: 32px;
            line-height: 44px;
        }
        .footer-sm-title, .footer__list-point > ul > li:first-child {
            font-size: 16px;
        }

        .footer__list-point:nth-child(n+3) {
            margin-top: 0;
        }
        .slant-right {
            right: -50%
        }

        .slant-left {
            left: -70%;
        }

        .media-block video, .media-block img {
            min-height: auto;
        }
    }

    @media (max-width: 570px) {

        .certs-img {
            object-position: center;
        }
        .cols-3 {
            column-count: 1;
        }

        .slant-right {
            right: -50%
        }

        .slant-left {
            left: -70%;
        }

        .hero .slant {
            display: none;
        }

        .cart-img {
            width: 41%;
            margin-bottom: 110px;
        }

        .hand-img {
            right: -5%;
            bottom: 110px;
        }

        .certs-hero-cont img {
            position: relative;
        }

        .certs-hero-cont {
            background: #3C4352;
            padding-top: 40px;
        }

        .py-80, .py-120 {
            padding-top: 40px;
            padding-bottom: 40px;
        }

        .industries .py-120 {
            padding-bottom: 80px;
        }

        .py-200 {
            padding-top: 120px;
            padding-bottom: 120px;
        }

        .one-study {
            width: calc(100% - 40px);
            margin-top: 24px;
        }

        .footer .certs {
            width: 100%;
        }

        .footer__list {
            flex-wrap: wrap;
        }

        .footer__list-point {
            max-width: 100%;
            margin-bottom: 40px;
        }

        .footer__copyright {
            width: 100%;
            order: 1;
        }

        .footer__cookie {
            width: 100%;
            order: 2;
        }

        .footer .social-links {
            width: 100%;
            order: 3;
            margin-top: 20px;
        }

        .footer .social-links a:first-child {
            margin-left: 0;
        }

        .buttons.api-buttons {
            margin-left: 20px;
            margin-right: 20px;
            margin-top: 32px;
        }

        .buttons.api-buttons a {
            display: block;
            margin: 8px 0;
        }

        .swiper-api {
            display: none;
        }

        .api-block {
            height: 100px;
            margin: 8px 0px;
            aspect-ratio: auto;
        }
        .api-mob-cont{
            margin: 0px 20px;
            display: block;
        }

        .app-links a{
            margin-left: 0;
            margin-right: 0;
            display: block;
            margin-bottom: 16px;
        }
        .media-block{
            margin-top: 32px;
        }
        .slant-bot-bar, .extra-slant{
            left: -85%;
        }
        .footer .social-links a {
            width: 100%;
            margin-left: 0px;
        }
    }
    @media(max-width: 495px){
        .slant-right {
            right: -100%
        }

        .slant-left {
            left: -100%;
        }

        .api-white{
            padding-top: 80px;
        }

        .dark-bar img{
            max-width: 130%;
        }

        .slant-bot-bar,  .extra-slant{
            left: -115%;
        }
    }

/* ---------------------------------------------------------------------------
   Was add_compact_menu_styles() in functions.php, printed as an inline <style>
   on wp_head for every request. Menu spacing / right alignment.
   --------------------------------------------------------------------------- */

/* Remove left margin and align menu to the right */
.navigator .menu {
    margin-left: auto !important;
    margin-right: 0 !important;
    justify-content: flex-end !important;
}

/* Reduce gaps between menu items */
.navigator .menu li {
    margin-right: clamp(8px, 2.5vw, 25px) !important;
}

.navigator .menu li:last-child {
    margin-right: 0 !important;
}

/* Make Navirec menu item more compact */
.menu-item-navirec a {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.menu-item-navirec img {
    width: 20px !important;
    height: 20px !important;
    margin-right: 0 !important;
}

.index-page .logInLink {
    margin-left: 20px !important;
}

/* Responsive adjustments */
@media screen and (max-width: 1300px) {
    .navigator .menu li {
        margin-right: 12px !important;
    }
    .index-page .logInLink {
        margin-left: auto !important;
    }
}

@media screen and (max-width: 1200px) {
    .navigator .menu li {
        margin-right: 10px !important;
    }
}

@media screen and (max-width: 768px) {
    .navigator .menu li {
        margin-right: 8px !important;
    }
}
