@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');
  /* .swiper-slide img{
    max-width: 350px;
    height: auto
  } */
.grad-button {
    background:
        linear-gradient(#000, #000) padding-box,
        linear-gradient(79deg, #16355e 10%, #a6458f 57%, #51b4b6 100%) border-box;
    color: #313149;
    padding: 14px 50px;
    border: 2px solid transparent;
    border-radius: 60px;
    display: inline-block;
}

@font-face {
    font-family: 'oswald';
    src: url('/fonts/Oswald-VariableFont_wght.ttf');
}

html, body, .v-application{
    font-family: 'Poppins', sans-serif !important;
}

section {
    background: #000000;
}

section.photo {
    background: #ffffff;
}

.video-sec {
    display: flex;
    justify-content: center;
}

.icon-section img {
    height: 85px;
    width: 85px;
}

.icon-section {
    color: white;
}

.logo-background {
    background-image: url('/images/pageLogo.svg');
    background-color: white;
    background-repeat: no-repeat;
}

.logo-background-text {
    color: #000;
}

.grid-images div img {
    width: 100%;
}

.horizontal-line {
    background-image: linear-gradient(270deg, #1d4469 0, #59aab2 52%, #806593), linear-gradient(270deg, #000, #000);
    height: 4px;
    border-radius: 20px;
    width: 26%;
    margin: 6px auto;
}

.font-oswald {
    font-family: oswald;
}

.largest-text {
    white-space: nowrap;
}

.swiper-container{
    padding: 4rem 1rem 6rem 1rem;
    position: relative;
    width: 100%;
    margin: 0 auto;
}
.swiper-container .swiper-button-prev{
    top: 90%;
    left: 40%;
}
.swiper-container .swiper-button-next{
    top: 90%;
    right: 40%;
}
/* .swiper-container .swiper-pagination{
    bottom: -30px!important;
} */

.text-slider{
    width: 100%;
    margin-bottom: 1.5rem;
}

.image-slider{
    width: 100%;
}

.image-slider img{
    width: 60%;
    margin: 0 auto;
    display: block;
    height: auto;
}

.slide-heading{
    font-size: 1.5rem;
}

.slide-subheading{
    font-size: 1.25rem;
}

.slide-para{
    font-size: .75rem;
}

.arrow-icon{
    width: 2.5rem;
    height: auto;
}

.swiper-container [class^="swiper-button-"]::after{
    content: "";
}


.swiper-container .swiper-button-prev{
    transform: rotate(180deg);
}

@media screen and (max-width: 575px) {
    video {
        height: 234px;
    }
    /* .custom-card-img img{
        width: 479px;
    } */
}

@media screen and (min-width: 576px) {
    .custom-card-img img{
        width: 576px;
    }
}

@media screen and (min-width: 576px) and (max-width: 767px) {
    video {
        height: 350px;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    video {
        height: 400px;
    }
}

@media screen and (min-width: 992px) {
    video {
        height: 450px;
    }
}

@media screen and (max-width: 575px) {
    .banner-heading {
        font-size: 30px
    }
}

@media screen and (min-width: 576px) and (max-width: 767px) {
    .banner-heading {
        font-size: 40px
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .banner-heading {
        font-size: 50px
    }
}

@media screen and (min-width: 992px) {
    .banner-heading {
        font-size: 60px
    }

    .swiper-container{
        max-width: 1280px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        min-height: 600px;
    }

    .image-slider{
        width: 60% !important;
    }

    .text-slider{
        width: 40% !important;
    }

    .slide-heading{
        font-size: 3.75rem;
    }
    
    .slide-subheading{
        font-size: 2.5rem;
        margin-bottom: 1.5rem;
    }
    
    .slide-para{
        font-size: .875rem;
        max-width: 40ch;
    }

    .swiper-container .swiper-button-prev{
        top: 80%;
        left: 1.5rem;
    }
    .swiper-container .swiper-button-next{
        top: 80%;
        left: 6rem;
    }

    .arrow-icon{
        width: 3.5rem;
    }
}

@media screen and (max-width: 767px) {
    .banner {
        padding: 5rem 1rem;
    }

    .icon-section {
        padding: 1rem;
    }

    .icon::after {
        position: absolute;
        right: 79%;
        bottom: -30%;
        width: 14%;
        height: 1px;
        content: " ";
        background-image: linear-gradient(90deg, #555 50%, hsla(0, 0%, 100%, 0) 0);
        background-size: 20px 2px;
        background-repeat: repeat-x;
        transform: rotate(90deg);
    }

    .logo-background {
        background-size: contain;
    }

    .largest-text {
        font-size: 60px;
    }
    .share-banner-text{
        padding: 2rem 1rem;
    }
    .share-banner-text h5{
        margin-bottom: 2rem;
    }
}

@media screen and (min-width: 768px) {
    .banner {
        padding: 8rem 4rem;
    }

    .icon-section {
        padding-left: 8rem;
        padding-right: 8rem;
        padding-bottom: 8rem;
    }

    .icon {
        position: relative;
    }

    .icon::after {
        position: absolute;
        right: -20%;
        top: 20%;
        width: 40%;
        height: 1px;
        content: " ";
        background-image: linear-gradient(90deg, #555 50%, hsla(0, 0%, 100%, 0) 0);
        background-size: 20px 2px;
        background-repeat: repeat-x;
    }

    .logo-background-text {
        padding: 6rem 4rem;
        width: 50%;
    }

    .grid-images {
        padding: 8rem;
    }

    .hover-parent:hover .hover-child {
        display: block;
    }

    .hover-child {
        display: none;
    }

    .largest-text {
        font-size: 164px;
        padding: 0 0 4rem 0;
    }
    .share-banner-text{
        padding: 6rem 4rem;
    }
    .share-banner-text h2{
        font-size: 44px;
    }
    .share-banner-text h5{
        margin-bottom: 4rem;
    }
}

.custom-card-text .quote{
    background-image: url(/images/quote-icon.svg);
    background-position: top 0.5rem left;
    background-size: 3.5rem 3.5rem;
    background-repeat: no-repeat;
    padding-top: 2rem;

}
.custom-card{
    background-color: white;
    color: black;
    border-radius: 36px;
}
.custom-card-img img{
    border-radius: 20px;
    max-width: 100%;
    aspect-ratio: 1/1;
}

.custom-card-text{
    padding: 0 2rem;
}
.custom-card-text {
    font-size: 30px;
    line-height:2.3rem;
}
.share-banner{
    background-image: url('/images/algoShareBanner.webp');
    background-repeat: no-repeat;
    background-size: cover;
}
.grad-button2{
    /* border-radius: 60px;
    width: -moz-max-content;
    width: max-content;
    border-style: solid;
    border-width: 2px;
    transform: rotate(1turn);
    border-image-source: linear-gradient(79deg,#16355e 10%,#51b4b6 57%,var(--ugly-purple) 100%);
    border-image-slice: 0;
    background-image: linear-gradient(to bottom,#000,#000),linear-gradient(79deg,#16355e 10%,#51b4b6 57%,var(--ugly-purple) 100%);
    background-origin: border-box;
    display: block;
    background-clip: padding-box,border-box; */
    background:
        linear-gradient(#000, #000) padding-box,
        linear-gradient(79deg, #16355e 10%, #a6458f 57%, #51b4b6 100%) border-box;
    color: #313149;
    padding: 9px 30px;
    border: 2px solid transparent;
    border-radius: 60px;
    font-weight: bold;
    color: white;
}
.grad-button2:hover{
    color: white;
    text-decoration: none;
}