@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&family=Ubuntu:wght@400;500;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap);

.form-title,
.info-sub-title,
.info-title {
    letter-spacing: .5px
}

.form-fields .submit-button,
.social-icons1 li i {
    cursor: pointer;
    transition: .5s;
    background: #f44770
}

* {
    font-family: poppins
}


.logo1 img {
        width: 60%;
    height: 100%;
    object-fit: cover;
    margin-left: -27px
}

#terms {
    padding: 8rem 0
}

#terms h3 {
    font-size: 2rem;
    animation: 4s forwards animate;
    color:#EA2B2C;
}

#terms h5 {
    color: #555555;
    font-size: 1.5rem;
}

#terms h4 {
    font-size: 1rem
}

#privacy h4,
#terms p {
    color: #748494;
}

.aboutUs {
    display: flex;
    text-align: center;
    align-items: center;
    gap: 5rem;
    padding: 0 5rem;
    margin-top: -7rem
}

.aboutUsHeading {
    padding: 12rem 0;
    text-align: center
}

.aboutUsHeading h1 {
    font-size: 4rem;
    color: #EA2B2C;
    text-decoration: underline;
}

.aboutUsHeading h5 {
    font-size: 2rem;
    color: #555555;
}
.aboutText p{
    text-align:justify;
    color:#748494;
}
.aboutUsHeading h1.in-view {
    animation: 4s forwards slogan1
}

.aboutUsHeading h5.in-view {
    animation: 1s ease-in-out animate1
}

@keyframes slogan1 {
    from {
        transform: translateY(-100%)
    }

    to {
        transform: translateY(0)
    }
}

@keyframes animate1 {
    0% {
        transform: translateX(-50%);
        opacity: 0
    }

    50% {
        opacity: .2
    }

    70% {
        opacity: .5;
        opacity: 1;
        transform: translateX(0)
    }
}

.cards {
    display: flex;
    gap: 25px;
    z-index: 9;
    margin-top: 50px
}

.cards .card {
    height: 350px;
    width: 400px;
    padding: 23px 4% 0;
    background: #413e69;
    position: relative
}

.cards .card::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    border-radius: 10px;
    background: #fd562a;
    transform: rotate(0);
    z-index: -1
}

.cards .card:hover.card::before {
    transform: rotate(10deg)
}

.cards .card i {
    font-size: 2.5rem;
    color: orange
}

.cards .card h3 {
    font-size: 1.8rem;
    color: #fff;
    margin-bottom: 10px
}

.cards .card p {
    color: rgba(255, 255, 255, .5);
    font-size: 1.05rem;
    margin-bottom: 20px;
    font-weight: 500
}

.leftCard {
    margin-left: 266px
}

#section-wrapper {
    width: 100%;
    padding: 10px;
    margin-top: 7rem
}

.box-wrapper {
    position: relative;
    display: table;
    width: 1100px;
    margin: 35px auto auto;
    border-radius: 30px
}

.info-wrap {
    width: 35%;
    height: 730px;
    padding: 40px;
    float: left;
    display: block;
    border-radius: 30px 0 0 30px;
    background: linear-gradient(144deg, rgba(126, 39, 156, 1)0%, rgba(49, 39, 157, 1)100%);
    color: #fff
}

.info-title {
    text-align: left;
    font-size: 28px
}

.info-sub-title {
    font-size: 18px;
    font-weight: 300;
    margin-top: 17px;
    line-height: 26px
}

.info-details {
    list-style: none;
    margin: 62px 0
}

.info-details li {
    margin-top: 25px;
    font-size: 18px;
    color: #fff
}

.info-details li i {
    background: #f44770;
    padding: 12px;
    border-radius: 50%;
    margin-right: 5px
}

.info-details li a {
    color: #fff;
    text-decoration: none
}

.info-details li a:hover {
    color: #f44770
}

.social-icons1 {
    list-style: none;
    text-align: center;
    margin: 20px 0
}

.social-icons1 li {
    display: inline-block
}

.social-icons1 li i {
    color: #fff;
    padding: 15px;
    font-size: 18px;
    border-radius: 22%;
    margin: 0 5px
}

.social-icons1 li i:hover {
    background: #fff;
    color: #000
}

.form-wrap {
    width: 65%;
    float: right;
    padding: 0px 25px 0px;
    border-radius: 0 30px 30px 0;
    background: #ecf0f3;
        height: 730px;

}

.form-title {
    text-align: left;
    margin-left: 23px;
    font-size: 28px
}
select.columnSelect {
    border: none;
    outline: 0;
    background: 0 0;
    font-size: 18px;
    color: #555;
    padding: 20px 10px 20px 5px;
    width: 46%;
    height: 3.5rem;
}
select.columnSelect {
    /* float: left; */
    padding: 0 30px;
    margin: 14px 12px;
    border-radius: 25px;
    box-shadow: inset 8px 8px 8px #cbc3d1, inset -8px -8px 8px #fff
}
.form-fields {
    display: table;
    width: 100%;
    padding: 15px 5px 5px
}

.form-fields input,
.form-fields textarea {
    border: none;
    outline: 0;
    background: 0 0;
    font-size: 18px;
    color: #555;
    padding: 20px 10px 20px 5px;
    width: 100%
}

.form-group,
.form-group1 {
    /*float: left;*/
    padding: 0 30px;
    margin: 14px 12px;
    border-radius: 25px;
    box-shadow: inset 8px 8px 8px #cbc3d1, inset -8px -8px 8px #fff
}

.form-fields textarea {
    height: 150px;
    resize: none
}

.form-group {
    width: 46%
}

.form-group1 {
    width: 96%
}

.form-fields .submit-button {
     float: right;
    width: 47%;
    height: 60px;
    margin: 0 12px;
    border-radius: 30px;
    font-size: 20px;
    font-weight: 700;
    border: none;
    outline: 0;
    color: #fff;
    text-align: center;
    box-shadow: 3px 3px 8px #b1b1b1, -3px -3px -8px #fff;
     margin-top: -4rem;
     background-color: gray;
}

/*.form-fields .submit-button:hover {*/
/*    background: #31279d*/
/*}*/

section#privacy {
    padding: 9rem 0
}

#privacy h3 {
    font-size: 2rem;
    color:#EA2B2C;
}

#privacy h3.in-view {
    animation: 1s ease-in-out animate3
}

#privacy p,
#privacy ul li {
    color: #748494;
    font-weight: 500
}

@keyframes animate3 {
    0% {
        transform: translate(0);
        opacity: 0
    }

    70% {
        opacity: .4;
        opacity: 1;
        transform: translate(0)
    }
}

/* contact form asterisk section*/

.asterisk{
position: absolute; 
right: 36rem; 
top: 85px;
color: red;

}
.asterisk1{
    position: absolute; 
    right:500px; 
    top: 175px;
    color: red;
}
.asterisk2{
    position: absolute; 
    right:169px;
    top: 507px;
    color: red;
}