@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

@font-face {
    font-family: Gilroy;
    font-weight: 900;
    src: url('/assets/fonts/Gilroy/Gilroy-Black.ttf');
}

@font-face {
    font-family: Gilroy;
    font-weight: 900;
    font-style: italic;
    src: url('/assets/fonts/Gilroy/Gilroy-BlackItalic.ttf');
}

@media (min-width: 1200px) {
    .container {
        max-width: 1309px;
    }
}

.loaded .from-left {
    opacity: 0; }

.loaded .move-in-left {
    opacity: 1;
    animation: moveInLeft 1.5s cubic-bezier(0.36, 0.07, 0.19, 0.97);
    animation-fill-mode: backwards;
    backface-visibility: hidden;
    animation-iteration-count: 1; }

.loaded .from-right {
    opacity: 0; }

.loaded .move-in-right {
    opacity: 1;
    animation: moveInRight 1.5s cubic-bezier(0.36, 0.07, 0.19, 0.97);
    animation-fill-mode: backwards;
    backface-visibility: hidden;
    animation-iteration-count: 1; }

.loaded .move-left-right {
    animation: moveLeftRight 1.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    backface-visibility: hidden;
    animation-iteration-count: infinite; }

.loaded .move-up-down {
    animation: moveUpDown 1.25s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    backface-visibility: hidden;
    animation-iteration-count: infinite; }

.loaded .shake {
    position: relative;
    display: inline-block;
    animation: shake 1.25s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    transform: rotate(0deg) scale(1);
    backface-visibility: hidden;
    animation-iteration-count: 1; }

.loaded .zoom-in {
    animation: zoomIn 0.2s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    transform: scale(1);
    backface-visibility: hidden;
    animation-iteration-count: 1; }

.loaded .jump {
    animation: jump .3s;
    transform: scale(1);
    backface-visibility: hidden;
    animation-iteration-count: 1; }

@keyframes waves {
    0% {
        transform: scale(1);
        opacity: 1; }
    50% {
        opacity: 1; }
    100% {
        transform: scale(1.3);
        opacity: 0; } }

@keyframes moveInLeft {
    0% {
        opacity: 0;
        transform: translateX(-10rem); }
    80% {
        transform: translateX(1rem); }
    100% {
        opacity: 1;
        transform: translate(0); } }

@keyframes moveInRight {
    0% {
        opacity: 0;
        transform: translateX(10rem); }
    80% {
        transform: translateX(-1rem); }
    100% {
        opacity: 1;
        transform: translate(0); } }

@keyframes moveInBottom {
    0% {
        opacity: 0;
        transform: translateY(3rem) translateX(-100%); }
    100% {
        opacity: 1;
        transform: translateY(0) translateX(-100%); } }

@keyframes moveInTop {
    0% {
        opacity: 0;
        transform: translateY(-3rem); }
    100% {
        opacity: 1;
        transform: translate(0); } }

@keyframes moveLeftRight {
    0% {
        transform: translateX(0px); }
    50% {
        transform: translateX(-7px); }
    100% {
        transform: translateX(0px); } }

@keyframes moveUpDown {
    0% {
        transform: translateY(5px); }
    50% {
        transform: translateY(-5px); }
    100% {
        transform: translateY(5px); } }

@keyframes shake {
    10%, 90% {
        transform: rotate(-1deg); }
    20%, 80% {
        transform: rotate(0deg); }
    30%, 50%, 70% {
        transform: rotate(-5deg) scale(1.2); }
    40%, 60% {
        transform: rotate(5deg) scale(1.2); } }

@keyframes zoomIn {
    0% {
        transform: scale(0.75); }
    100% {
        transform: scale(1); } }

@keyframes jump {
    0% {
        transform: translateY(0px); }
    25% {
        transform: translateY(-10px); }
    50% {
        transform: translateY(-5px); }
    75% {
        transform: translateY(5px); }
    100% {
        transform: translateY(0px); } }

:root {
    --color-primary: #182430;
    --color-secondary: #00C4E3;
    --color-secondary-light: rgba(0, 196, 227, .1);
    --color-black: #000;
    --color-white: #fff;
    --color-dark: #4d4d4d;
    --color-light: #F9F9F9;
    --color-grey: #C4C4C4;
    --color-grey-dark: #959595;
    --color-pink: #D93E90;
    --default-shadow: 0px 0px 28px rgba(0, 0, 0, 0.1); }

body {
    font-family: 'Lato', sans-serif;
    box-sizing: border-box;
    overflow-x: hidden;
    background: var(--color-white); }

.main section {
    margin-top: 180px;
}

.main section.hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 80px;
    margin-top: 0;
    color: #fff;
    background: url("/assets/img/bg-hero.jpg");
    background-size: cover;
}

.main section.hero > * {
    position: relative;
}

.main section.hero::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgba(0, 7, 43, 0.9);
    mix-blend-mode: hard-light;
}

.app-links {
    display: flex;
    justify-content: center;
    align-items: center; }

a {
    text-decoration: none !important; }

.title-sm {
    position: relative;
    font-family: 'Poppins', sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px; }

.title-md {
    position: relative;
    font-family: 'Poppins', sans-serif;
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 0; }
.title-md.lined {
    text-align: center; }
.title-md.lined::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    height: 8px;
    width: 250px;
    background-color: var(--color-secondary);
    transform: translateY(150%); }
@media (max-width: 720px) {
    .title-md.lined::after {
        width: 125px;
        height: 5px; } }
.title-md.lined.left::after {
    left: unset;
    right: 50%; }

.title-lg {
    font-family: 'Lato', sans-serif;
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 15px; }

.text {
    font-family: 'Quicksand', sans-serif;
    font-size: 18px;
    font-weight: 300; }
.text.justify {
    text-align: justify; }

.text-italic-bold {
    font-weight: 700;
    font-family: 'Lato', sans-serif;
    font-style: italic;
}

.text-bold {
    font-weight: 700;
    font-family: 'Lato', sans-serif;
}

.dark {
    color: var(--color-black); }

.white {
    color: var(--color-white); }

.primary {
    color: var(--color-primary); }

.secondary {
    color: var(--color-secondary); }

@media (max-width: 720px) {
    .title-lg {
        font-size: 36px; }
    .title-md {
        font-size: 28px; }
    .title-sm {
        font-size: 24px; }
    .text {
        font-size: 18px; } }

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999999;
    transition: all .3s ease;
    padding: 0 10px;
}
.header.header-bg {
    background: rgba(24, 36, 48, 0.3);
    backdrop-filter: blur(22px);
}
.header .text-button {
    margin: initial;
    padding: 15px 25px !important;
    border-radius: 12px;
}
.header .header-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 25px 0;
    min-height: 80px; }
.header .header-logo img {
    height: 70px;
    transition: all .3s ease;
}
body:has(section.hero) .header:not(.header-bg) .header-logo img {
    opacity: 0;
}
.header .social-icons-wrapper {
    display: flex;
    align-items: center;
    gap: 32px;
}
.header .social-icons {
    display: flex;
    justify-content: center;
    align-items: center; }
.header .social-icons .social-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--color-primary);
    background-color: #fff;
    font-size: 20px;
    transition: all .2s ease; }
.header .social-icons .social-icon:not(:last-child) {
    margin-right: 15px; }
.header .social-icons .social-icon:hover {
    color: #fff;
    background-color: var(--color-secondary); }

/* NAVIGATION */
.navigation {
    display: flex;
    align-items: center;
    transition: all .4s ease; }
.navigation .navigation-holder {
    display: flex;
    align-items: center;
    justify-content: center; }
.navigation .navigation-link {
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 300;
    color: #fff;
    text-decoration: none;
    transition: all .1s ease-in-out; }
.navigation .navigation-link:not(:last-child) {
    margin-right: 30px; }
/*.navigation .navigation-link::before {*/
/*    content: url("../../public/assets/img/nav-ball-icon.svg");*/
/*    position: relative;*/
/*    left: -5px;*/
/*    top: -10px;*/
/*    opacity: 0;*/
/*    visibility: hidden;*/
/*    transition: all .3s ease-in-out; }*/
.navigation .navigation-link.active {
    border-bottom: 2px solid var(--color-secondary);
}
.navigation .navigation-link:hover, .navigation .navigation-link.active {
    color: var(--color-secondary); }
/*.navigation .navigation-link:hover::before, .navigation .navigation-link.active::before {*/
/*    content: url("../../public/assets/img/nav-ball-icon.svg");*/
/*    position: relative;*/
/*    left: -5px;*/
/*    top: 0px;*/
/*    opacity: 1;*/
/*    visibility: visible;*/
/*    transition: all .1s ease-in-out; }*/
.navigation.expanded {
    height: 50vh;
    opacity: 1;
    visibility: visible; }
.navigation-toggler {
    position: absolute;
    right: 0;
    top: 50%;
    font-size: 30px;
    color: #fff;
    background: none;
    outline: none !important;
    border: none;
    display: none;
    transform: translateY(-50%); }
.navigation-apps {
    display: none; }



@media (max-width: 992px) {
    .header .social-icons {
        display: none;
    }
    .subscribe .subscribe-grid {
        flex-direction: column;
        gap: 12px;
    }
}

@media (max-width: 767px) {
    .header .social-icons {
        display: none; }
    .header .header-logo img {
        height: 45px;
    }
    .header .text-button {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
    .navigation {
        position: absolute;
        top: 90px;
        left: 0;
        background-color: var(--color-primary);
        flex-direction: column;
        justify-content: flex-end;
        align-items: center;
        padding-bottom: 30px;
        width: 100%;
        height: 0px;
        box-shadow: 0px 0px 15px -6px;
        visibility: hidden;
        opacity: 0;
        overflow: hidden; }
    .navigation .navigation-holder {
        flex-direction: column;
        align-items: flex-start; }
    .navigation .navigation-link {
        font-size: 20px; }
    .navigation .navigation-apps {
        display: block;
        width: 100%;
        padding: 5px;
        text-align: center; }
    .navigation .navigation-apps-link:not(:last-child) {
        margin-right: 15px; }
    .navigation .navigation-apps-link img {
        width: 150px; }
    .navigation-toggler {
        display: inline-block; } }

.footer {
    background-color: var(--color-secondary);
    padding: 50px 0 30px 0;
    margin-top: 83px; }
.footer-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
.footer-col {
    margin-bottom: 30px; }
.footer-col:not(:last-child) {
    min-width: 200px; }
.footer-link {
    font-size: 16px;
    font-weight: 300;
    display: block;
    color: var(--color-light); }
.footer-link:hover {
    color: var(--color-white); }
.footer-apps-link {
    display: block;
    margin-bottom: 15px; }
.footer-copy {
    display: flex;
    justify-content: space-between; }
.footer-copy-text {
    color: var(--color-white) !important;
    font-size: 12px; }

.form .button {
    font-size: 18px; }

.form-input {
    position: relative;
    font-size: 18px;
    color: var(--color-white);
    background: none;
    height: 50px;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 50px;
    outline: none;
    padding: 10px 25px; }
.form-input::after {
    content: url(../../public/assets/img/right-arrow.svg); }
.form-input.primary {
    color: var(--color-dark);
    border-color: var(--color-primary); }
.form-input.primary::placeholder {
    color: var(--color-grey-dark); }

.label {
    color: var(--color-grey-dark); }

.form-input::placeholder {
    color: var(--color-light); }

.input-group.iconic {
    position: relative; }
.input-group.iconic .form-input {
    padding-left: 50px; }

.input-group.stack {
    position: relative; }
.input-group.stack .stack-button {
    position: absolute;
    right: 0;
    top: 0;
    background: none;
    border: none;
    outline: none;
    padding: 0;
    cursor: pointer; }

.input-group:not(:last-child) {
    margin-bottom: 15px; }

span.error-message {
    display: none; }

.input-icon {
    position: absolute;
    color: var(--color-primary);
    top: 18px;
    left: 25px; }

textarea.form-input.primary {
    border-radius: 10px !important;
    min-height: 100px; }

.input-radio-group {
    width: 49%;
    display: inline-block; }

.input-radio-input {
    display: none; }

.input-radio-label {
    cursor: pointer;
    position: relative;
    padding-left: 25px;
    margin-bottom: 0; }

.input-radio-button {
    height: 20px;
    width: 20px;
    border: 1px solid var(--color-primary);
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    left: 0;
    top: 2px; }
.input-radio-button::after {
    content: "";
    display: block;
    height: 10px;
    width: 10px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--color-primary);
    opacity: 0;
    transition: opacity .2s; }

.input-radio-input:checked ~ .input-radio-label .input-radio-button::after {
    opacity: 1; }

.input-select {
    border-radius: 10px;
    min-width: 125px;
    height: 30px; }

.themed-content {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    padding-bottom: 125px; }
.themed-content-header {
    grid-column: 1 / 4;
    grid-row: 1;
    background-color: var(--color-secondary);
    align-self: flex-start;
    border-radius: 0 12px 12px 0;
    padding: 50px 25px 50px 150px; }
.themed-content-body {
    grid-column: 3 / -1;
    grid-row: 1;
    position: relative;
    bottom: -25%;
    background-color: var(--color-white);
    align-self: flex-end;
    box-shadow: 0px 0px 28px rgba(0, 0, 0, 0.1);
    border-radius: 12px 0 0 12px;
    padding: 25px 50px;
    z-index: 1; }

@media (max-width: 940px) {
    .themed-content {
        display: block; }
    .themed-content-header, .themed-content-body {
        border-radius: 0; } }

.button {
    font-size: 25px;
    font-weight: 400;
    padding: 10px 50px;
    border: none;
    outline: none;
    border-radius: 10px; }
.button.primary {
    color: var(--color-white);
    background-color: var(--color-primary); }
.button.secondary {
    color: var(--color-white);
    background-color: var(--color-secondary); }
.button.block {
    width: 100%; }
.button-holder {
    width: 100%; }
.button-holder.center {
    display: flex;
    align-items: center;
    justify-content: center; }

.text-button {
    display: inline-block;
    background: var(--color-secondary);
    box-shadow: none;
    outline: none !important;
    border: none;
    border-radius: 50px;
    padding: 5px 25px !important;
    color: var(--color-white);
    margin-left: auto;
    margin-right: 15px; }

.owl-dots {
    text-align: center; }
.owl-dots .owl-dot {
    outline: none; }
.owl-dots .owl-dot:not(:last-child) {
    margin-right: 5px; }
.owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    background-color: var(--color-primary);
    border-radius: 50%;
    display: inline-block; }
.owl-dots .owl-dot.active span {
    background-color: var(--color-secondary) !important; }

.owl-nav {
    position: absolute;
    left: 0;
    bottom: 0; }

.sn-group {
    display: flex;
    align-items: center; }
.sn-group .sn-button {
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color-white);
    width: 40px;
    height: 40px;
    background-color: var(--color-primary);
    border: none;
    outline: none;
    border-radius: 50%;
    box-shadow: 0px 0px 10px -2px rgba(0, 0, 0, 0.3);
    cursor: pointer; }
.sn-group .sn-button:not(:last-child) {
    margin-right: 15px; }

.lds-ring {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999999;
    display: flex;
    justify-content: center;
    align-items: center;
    background: white;
    display: none !important; }

.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid var(--color-primary);
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: var(--color-primary) transparent transparent transparent; }

.lds-ring div:nth-child(1) {
    animation-delay: -0.45s; }

.lds-ring div:nth-child(2) {
    animation-delay: -0.3s; }

.lds-ring div:nth-child(3) {
    animation-delay: -0.15s; }

@keyframes lds-ring {
    0% {
        transform: rotate(0deg); }
    100% {
        transform: rotate(360deg); } }

.lds-hide {
    display: none !important; }

.request-modal {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.95);
    z-index: 99999999;
    pointer-events: none;
    opacity: 0;
    transform: scale(0);
    transition: all .3s ease; }
.request-modal.opened {
    opacity: 1;
    pointer-events: all;
    transform: scale(1); }
@media (max-width: 720px) {
    .request-modal.opened {
        padding: 0 15px; } }
.request-modal .request-modal-close-button {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 28px;
    z-index: 99; }
.request-modal .button-holder {
    margin-top: 15px; }
.request-modal .form {
    max-width: 300px; }
.request-modal .form label.error {
    color: var(--color-primary);
    font-size: 14px;
    margin-left: 25px;
    margin-bottom: 0; }

@media (max-width: 940px) {
    #modal-button-nav {
        margin-right: 0px !important; } }

@media (max-width: 767px) {
    #modal-button-nav {
        margin-right: 80px !important; } }

/* E: NAVIGATION */
/* HERO */
.hero .hero-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 24px;
}

.hero .hero-item {
    height: fit-content;
    font-family: 'Poppins', sans-serif;}
.hero .hero-item img {
    width: 100%; }

.hero .hero-item .text-pink {
    color: var(--color-pink);
}

.hero .hero-logo {
    width: 134px !important;
}

.hero .hero-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 85px;
    font-weight: 900;
    margin: 60px 0 50px; }

.hero .hero-text {
    font-size: 25px;
}

.hero .app-links {
    justify-content: flex-start;
}

.hero .app-links a {
    text-decoration: none; }
.hero .app-links a:first-child {
    margin-right: 10px; }

.hero .app-links img {
    height: 60px;
}

.hero .hero-item.hero-image-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url("/assets/img/hero-image-bg-shape.png") center no-repeat;
    background-size: contain;
    height: 70vh;
}

.hero .hero-item.hero-image-wrapper img {
    width: initial;
    height: 100%;
}

.hero .hero-item.hero-image-wrapper video {
    margin: 0 auto;
    left: 0;
    right: 0;
    border-radius: 13%;
    position: absolute;
    top: 0;
    bottom: 0;
    height: 85%;
}

@media (max-width: 1400px) {
    .hero .hero-wrapper {
        align-items: center;
    }
}

@media (max-width: 767px) {
    section.hero {
        padding-top: 140px !important;
    }
    .hero .hero-title {
        font-size: 38px; }
    .hero .hero-subtitle {
        font-size: 32px; }
    .hero .hero-text {
        font-size: 18px; }
    .hero .hero-wrapper {
        gap: 60px;
        flex-direction: column; }
    .hero .hero-wrapper {
        gap: 60px;
        flex-direction: column; }
    .hero .hero-wrapper .hero-image-wrapper {
        max-width: 400px;
    }}

/* E:HERO */
/* VIDEO BOX */
.video-box .video {
    width: 100%;
    height: 565px;
    border-radius: 60px; }

@media (max-width: 720px) {
    .video-box .video {
        height: 200px;
        border-radius: 15px; } }

@media (max-width: 1200px) {
    .traction .traction-item {
        flex: 1 0 50%;
        margin-bottom: 50px; }
}

/* E:VIDEO BOX */
/* TRACTION */
.traction {
    margin-top: 83px; }
.traction .traction-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    row-gap: 90px;
    column-gap: 20px;
    justify-content: space-between;
    align-items: center;
    margin-top: 50px; }

.traction .traction-item {
    font-family: 'Poppins', sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    min-width: 250px; }
.traction .traction-icon {
    margin-bottom: 40px; }
.traction img.traction-icon {
    height: 86px;
}
.traction .traction-result {
    display: flex;
    gap: 12px;
}
.traction .traction-count {
    font-size: 48px;
    font-weight: 100;
    margin-bottom: 32px;
    opacity: 0; }
.traction .traction-count.counted {
    opacity: 1; }
.traction .traction-result .traction-suffix {
    font-size: 48px;
    font-weight: 100;
}
.traction .traction-text {
    font-size: 24px;
    text-align: center;
    font-weight: 700; }
.traction .traction-apps {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 83px; }
.traction .traction-apps .app-links a:first-child {
    margin-right: 30px; }

@media (max-width: 992px) {
    .traction .traction-grid {
        grid-template-columns: 1fr 1fr }
    .traction .traction-icon {
        margin-bottom: 5px; }
    .traction .traction-count {
        margin-bottom: 0px; } }

@media (max-width: 767px) {
    .traction .traction-grid {
        grid-template-columns: 1fr; }
    .traction .traction-item {
        margin-bottom: 50px; }
    .traction .traction-icon {
        margin-bottom: 5px; }
    .traction .traction-count {
        margin-bottom: 0px; }
    .traction .traction-apps .app-links {
        flex-direction: column; }
    .traction .traction-apps .app-links a:first-child {
        margin-right: 0;
        margin-bottom: 15px; } }

/* E: TRACTION */
/* TEAM */
.team {
    padding: 40px 0;
    background-color: var(--color-primary);
    margin-top: 83px; }
.team .team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, 250px);
    gap: 15px;
    row-gap: 35px;
    justify-content: space-between; }
.team .team-item {
    position: relative;
    color: #fff; }
.team .team-image {
    position: relative;
    z-index: 1; }
.team .team-image-cover {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 240px;
    height: 240px;
    transition: all .2s ease; }
.team .team-image-cover:hover {
    color: var(--color-secondary); }
.team .team-image-mask {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    pointer-events: none; }
.team .team-body {
    text-align: center; }
.team .team-body .text {
    font-size: 16px;
    font-weight: 100; }
.team .team-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 0; }
.team .team-link {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    margin: auto;
    border-radius: 50%;
    color: var(--color-primary);
    background-color: #fff;
    font-size: 20px;
    transition: all .2s ease; }
.team .team-link:hover {
    color: #fff;
    background-color: var(--color-secondary); }

@media (max-width: 720px) {
    .team .team-grid {
        justify-content: center; } }

/* E: TEAM */
/* SERVICES */
.services {
    padding-top: 90px;
    margin-top: 0px !important; }
.services .service {
    margin-top: 50px; }
.services .service-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 80px; }
.services .service-content {
    flex: 1 0 50%; }
.services .service-content .text {
    text-align: justify; }
.services .service-content img {
    width: 100%; }

@media (max-width: 720px) {
    .services .service {
        margin-top: 30px; }
    .services .service-wrapper {
        flex-direction: column;
        margin-top: 25px; }
    .services .service-content.image {
        order: -1; } }

/* E: SERVICES */
/* REVIEWS*/
.review {
    position: relative;
    padding: 50px 30px 0 50px;
    margin: 50px 0; }
.review .review-image {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100px;
    height: 100px;
    border: 1px solid var(--color-primary);
    border-radius: 50%;
    overflow: hidden;
    transform: translate(-50%, -50%); }
.review .review-image img {
    width: 100%;
    object-fit: cover;
    object-position: center; }
.review .review-text {
    font-size: 16px;
    font-weight: 300;
    text-align: center;
    padding: 25px 15px; }
.review .review-text::before {
    content: url("../../public/assets/img/quote-mark-left.svg");
    position: relative;
    left: -10px;
    top: -10px; }
.review .review-text::after {
    content: url("../../public/assets/img/quote-mark-right.svg");
    position: relative;
    right: -10px;
    bottom: -10px; }
.review .review-customer {
    text-align: right; }

#reviews .sn-group {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-200%, 50%); }

@media (max-width: 720px) {
    #reviews .sn-group {
        display: none; }
    .reviews {
        width: 100%; }
    .review {
        padding: 50px 20px 0 20px; }
    .review-text {
        padding: 0; } }

/* E: REVIEWS */
/* SUBSCRIBE */
.subscribe {
    background-color: var(--color-primary);
    padding: 50px 100px;
    border-radius: 8px; }
.subscribe .subscribe-grid {
    display: flex;
    justify-content: space-between;
    align-items: center; }
.subscribe .subscribe-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 0 auto; }

@media (max-width: 720px) {
    .subscribe {
        padding: 50px 15px; }
    .subscribe .subscribe-grid {
        flex-direction: column; }
    .subscribe .subscribe-item {
        width: 100%; }
    .subscribe .subscribe-item:first-child {
        margin-bottom: 20px; } }

/* E: SUBSCRIBE */
/* NEWS */
.news-card {
    position: relative; }
.news-card-img {
    width: 100%; }
.news-card-date {
    display: block;
    font-weight: 300;
    color: var(--color-grey);
    margin-top: 10px; }
.news-card-link {
    font-family: 'Lato', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--color-black) !important;
    text-decoration: none !important; }
.news-card-link::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

#news .container {
    position: relative; }

#news .sn-group {
    position: absolute;
    top: 0px;
    right: 15px; }

.award {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 25px 15px;
    min-width: 150px;
    max-width: 250px;
    text-align: center; }
.award-list {
    display: flex;
    flex-wrap: wrap; }
.award-img {
    flex: 1 0 auto;
    display: flex;
    align-items: center;
    margin-bottom: 15px; }

@media (max-width: 540px) {
    .award {
        width: 100%;
        flex: 1 0 100%; }
    .award-list {
        flex-direction: column;
        justify-content: center;
        align-items: center; } }

@media (max-width: 720px) {
    .award {
        width: 50%;
        flex: 1 0 50%; } }

.snaps-title {
    font-weight: 300; }
.snaps-title > span {
    font-weight: 700;
    display: block; }

.snaps-filter {
    display: flex;
    align-items: center;
    margin-top: 40px; }
.snaps-filter .filter-group {
    display: flex;
    align-items: center; }
.snaps-filter .filter-group .input-radio-group {
    margin-right: 30px; }
.snaps-filter .input-select {
    outline: none !important;
    height: 40px;
    padding-left: 10px; }
.snaps-filter .dropdown-toggle {
    outline: none !important;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 15px;
    border: 1px solid var(--color-grey); }
.snaps-filter .team-filter {
    white-space: nowrap;
    display: flex; }
.snaps-filter .team-filter img {
    margin: 0px 10px; }

.snap-list {
    margin-top: 30px; }
.snap-list::after {
    content: '';
    display: block;
    clear: both; }

.snap,
.snap-sizer {
    width: 20%; }

.snap-inner {
    position: relative;
    float: left;
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0);
    padding: 5px;
    width: 100%;
    transition: all .2s ease; }
.snap-inner:hover {
    background-color: var(--color-primary); }

.snap-image {
    display: block;
    width: 100%;
    max-width: 100%;
    border-radius: 20px; }

.snap-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 5px; }

.snap-type-icon {
    position: absolute;
    top: 15px;
    left: 15px;
    font-size: 20px;
    color: #fff;
    z-index: 11; }

.snap-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 15px; }
.snap-footer .snap-user {
    width: 36px;
    height: 36px;
    border: 2px solid var(--color-white);
    border-radius: 50%;
    overflow: hidden; }
.snap-footer .snap-user-image {
    width: 100%;
    height: 100%; }
.snap-footer .snap-likes {
    font-size: 16px;
    color: var(--color-white); }

.snap-load-more {
    position: relative;
    height: 250px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.8);
    margin-top: -160px;
    z-index: 99;
    text-align: center;
}

#load-more {
    font-size: 22px;
    font-weight: 100;
    outline: none !important;
    padding: 8px 70px; }

@media (max-width: 720px) {
    .snap,
    .snap-sizer {
        border-radius: 5px;
        width: 50%; }
    .snap-image,
    .snap-sizer-image {
        border-radius: 5px; }
    .snap-load-more {
        height: 200px;
        margin-top: -170px; } }

.sd-grid {
    display: grid;
    grid-template-columns: 1fr minmax(340px, max-content);
    gap: 30px;
    max-width: 1440px;
    margin-right: auto;
    margin-left: auto; }
.sd-grid-item {
    width: 100%;
    padding: 30px 15px; }

.sd-user {
    display: flex;
    align-items: center;
    margin-bottom: 25px; }
.sd-user-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center; }
.sd-user-image-holder {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    overflow: hidden; }
.sd-user-name {
    font-weight: 200;
    font-size: 24px; }

.sd-summary > div {
    display: flex;
    align-items: center;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 25px; }

.sd-summary-icon {
    font-size: 28px;
    margin-right: 15px; }

.sd-share {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 50px; }
.sd-share > .text {
    font-size: 24px;
    color: var(--color-grey);
    margin: 0; }
.sd-share-group {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 10px;
    border-radius: 24px;
    background-color: #e1faff; }
.sd-share-group .twitter {
    background-color: #55ACE3; }
.sd-share-group .facebook {
    background-color: #4E6297; }
.sd-share-group .instagram {
    background: linear-gradient(43.94deg, #EEA054 16.16%, #D64763 50.11%, #B62A99 83.68%); }
.sd-share-group .whatsapp {
    background-color: #48C95F; }
.sd-share-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    font-size: 24px;
    color: #fff !important; }
.sd-share-link:not(:last-child) {
    margin-right: 10px; }

.sd-comment {
    display: grid;
    grid-template-columns: min-content 1fr max-content;
    align-items: center;
    font-size: 16px; }
.sd-comment-list {
    max-height: 400px;
    overflow: auto; }
.sd-comment-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center; }
.sd-comment-image-holder {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden; }
.sd-comment-user {
    font-weight: 500; }
.sd-comment-text {
    font-weight: 100; }
.sd-comment-date {
    font-size: 12px;
    font-weight: 100;
    color: var(--color-grey); }

.sd-next-snap, .sd-prev-snap {
    position: absolute;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff !important;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: var(--color-primary); }

.sd-next-snap {
    right: 0;
    transform: translate(50%, -50%); }

.sd-prev-snap {
    left: 0;
    transform: translate(-50%, -50%); }

.snap-detail {
    position: relative; }
.snap-detail-holder {
    position: relative;
    display: flex;
    justify-content: center; }
.snap-detail-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center center;
    filter: blur(15px);
    opacity: .40;
    width: 100%;
    height: 100%;
    transform: scale(1.15, 1.1); }
.snap-detail .video-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 75px;
    padding: 30px; }
.snap-detail-image {
    position: relative;
    width: 100%;
    height: 100%;
    outline: none;
    z-index: 99; }

@media (max-width: 992px) {
    .award-list {
        justify-content: space-between; }
    .sd-grid {
        grid-template-columns: 1fr; }
    .sd-summary {
        display: flex;
        align-items: center; }
    .sd-summary > div {
        margin-right: 30px;
        font-size: 14px; }
    .sd-summary-icon {
        font-size: 20px;
        margin-right: 5px; }
    .sd-share > .text {
        font-size: 16px; }
    .sd-share-link {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 35px;
        height: 35px;
        border-radius: 50%;
        font-size: 18px;
        color: #fff !important; }
    .sd-share-link:not(:last-child) {
        margin-right: 10px; }
    .sd-next-snap, .sd-prev-snap {
        font-size: 20px;
        width: 40px;
        height: 40px; }
    .snap-detail .video-wrapper {
        margin: 0; }
    .hero .hero-item.hero-image-wrapper {
        height: 55vh;
    }}

@media (min-width: 1200px) {
    .hero .hero-item.hero-image-wrapper {
        max-width: 40%;
    }
}

section#mission-partners .section-title {
    text-align: center;
    display: flex;
    justify-content: center;
}

section#mission-partners .section-desc {
    text-align: center;
    font-size: 24px;
    font-weight: 400;
}

section#mission-partners .mission-partner-items {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    margin-top: 48px;
}

section#mission-partners .mission-partner-items .mission-partner-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 327px;
}

section#mission-partners .mission-partner-items .mission-partner-item .mission-partner-title {
    font-size: 32px;
    font-weight: 500;
    text-align: center;
    background: #e9e9e9;
    padding: 30px;
    border-radius: 80px 80px 0px 0px;
    width: 100%;
}

section#mission-partners .mission-partner-items .mission-partner-item .mission-partner-title.blue {
    color: var(--color-secondary);
}

section#mission-partners .mission-partner-items .mission-partner-item .mission-partner-title.pink {
    color: var(--color-pink);
}

section#mission-partners .mission-partner-items .mission-partner-item .mission-partner-content {
    background: rgba(0, 0, 0, 0.05);
    border-radius: 0 0 80px 80px;
    width: 100%;
    row-gap: 28px;
    padding: 48px 16px;
}

section#mission-partners .mission-partner-items .mission-partner-item .mission-partner-content img {
    width: 100%;
    object-fit: cover;
}


@media (max-width: 1200px) {
    .hero .hero-title {
        font-size: 50px;
        margin: 30px 0 40px;
    }

    .hero .hero-logo {
        width: 85px;
    }

    section#mission-partners .mission-partner-items {
        flex-wrap: wrap;
        justify-content: initial;
    }
    section#mission-partners .mission-partner-items .mission-partner-item {
        width: 31%;
    }
}

@media (max-width: 992px) {
    section#mission-partners .mission-partner-items .mission-partner-item {
        width: 48%;
    }
}

@media (max-width: 767px) {
    section#mission-partners .mission-partner-items .mission-partner-item {
        width: 80%;
        margin: 0 auto;
    }
}
