* {
    user-select: none;
}

:root {
    --Logo-color: #8187e3;
    --Cards-bgDiv-color: #DAD0FF;
}



/* nav Starts from here */
nav {
    background: #322C86;
    background: linear-gradient(90deg, rgba(50, 44, 134, 1) 0%, rgba(109, 20, 175, 1) 100%);
}

span {
    color: var(--Logo-color);
}

nav li a {
    position: relative;
}

nav li a::after {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 0px;
    width: 0%;
    height: 2px;
    border-radius: 99px;
    background-color: #fff;
    transition: width ease 0.4s;
}

nav li a:hover::after {
    width: 100%;
}

/* nav Ends here */





/* main Starts from here */

/* hero section Start from here */
.hero1 {
    padding-top: 8rem;
    background-image: linear-gradient(rgba(0, 0, 0, 0.7)), url(https://saadsalman708.github.io/1st-Hackerthon/assets/image%2020.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.hero1 h2 {
    font-size: 5rem;
}

.hero1 button {
    background-color: #503df6;
    border: 1px solid #503df6;
}

.hero1 button:hover {
    background-color: #392f83;
    border: 1px solid #ffffff;
}

.hero1 button:active {
    background-color: #fff;
}

/* hero section Ends here */





/* service section Starts from here */
.serviceCardDiv h2 {
    color: #483fbe;
}

.cardDivCards {
    border: none;
    margin-bottom: 1.5rem;
    width: 100%;
}

.serviceCardDiv i {
    color: #503df6;
}

/* service section Ends here */





/* client says section Starts from here */
.clientSayDiv {
    background-color: var(--Cards-bgDiv-color);
}

.clientSayDiv h2 {
    color: #483fbe;
}

.clientSayDivCards {
    width: 24rem;
    margin-bottom: 1.5rem;
    border: none;
}

/* client says section Ends here */





/* schedule Digital footprint section Starts from here */
.footprintDiv {
    padding: 8rem 0 4rem 0;
    background: #1E293B;
    background: linear-gradient(90deg, rgba(30, 41, 59, 1) 0%, rgba(48, 45, 127, 1) 100%);
}

.footprintDiv h2 {
    font-size: 4rem;
}

.footprintDiv button {
    color: #503df6;
    background-color: #fff;
    border: 2px solid #fff;
}

.footprintDiv button:hover {
    background-color: #8187e3;
    border: 2px solid #fff;
}

/* schedule Digital footprint section Ends here */

/* main Ends here */






/* footer Starts from here */
footer {
    width: 101%;
    background: #12192B;
    background: linear-gradient(90deg, rgba(18, 25, 43, 1) 0%, rgba(48, 43, 134, 1) 100%);
}

h4 {
    color: var(--Logo-color);
}

/* footer Ends here */










.swal-responsive-img {
    max-width: 90vw;
    max-height: 70vh !important;
    width: auto;
    height: auto;
}

.swal-responsive-img img {
    width: 100%;
}













@media (min-width: 720px) {

    .cardDivCards {
        width: 45% !important;
    }
}




@media (max-width: 750px) {


    /* hero section Start from here */
    .hero1 h2 {
        font-size: 3rem;
    }



    /* service section Starts from here */
    .cardDivCards {
        width: 100%;
    }



    /* client says section Starts from here */
    .clientSayDivCards {
        width: 90%;
    }



    /* schedule Digital footprint section Starts from here */
    .footprintDiv h2 {
        font-size: 2.5rem;
    }



    /* footer Starts from here */
    footer {
        width: 103%;
    }
}











@media (min-width: 980px) {

    .cardDivCards {
        width: 30% !important;
    }
}