﻿/*@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;600&display=swap');*/
/* font-family: 'Inter', sans-serif; */

/** {
    margin: 0;
    padding: 0;
    font-family: 'Inter', sans-serif;
}



.container-fluid {
    background-image: url('../images/bg-before.jpg');
    height: 100vh;*/
   /* background-color: #dfe3e745;*/
/*}
    .container-fluid .bg-card {
        width: 82vw;
        height: 82vh;
    }

        .container-fluid .bg-card .bg-img img {*/
            /* position: relative;
    top: 3px; */
            /*width: 50vw;
            height: auto;
        }

        .container-fluid .bg-card .signup-card {
            position: absolute;
            width: 23rem;
            border-radius: 20px 20px 30px 30px;*/
            /* border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px; */
            /* bottom: 25px; */
            /* border: none; */
            /* height: 25rem;
    
    border-radius: 10px 10px 30px 30px; */
        /*}

            .container-fluid .bg-card .signup-card .card-header img {
                width: 17rem;
            }

            .container-fluid .bg-card .signup-card .card-body h3 {
                font-size: 1.5rem;
                font-weight: 800;
            }

          

                .container-fluid .bg-card .signup-card .card-body h3 span {
                    color: #2A3384;
                }

    .container-fluid form .signin-btn button {
        width: 100%;
        background-color: #2A3384;
        border: #2A3384;
    }

        .container-fluid form .signin-btn button:hover {
            background-color: #2A3384;
        }

    .container-fluid form label {
        color: #9da1a5;
        margin-bottom: 0px;
    }

    .container-fluid form a {
        text-decoration: none;
    }


form .women {
    height: auto;
    position: absolute;
    width: 79%;
    top: 5.5rem;
    left: -15.7rem;
    z-index: 2;
}

form .men {
    height: auto;
    position: absolute;
    width: 65%;
    left: 24.5rem;
    bottom: 0rem;
    z-index: 2;
}
.signup-card {
    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
}
.bg-card {
    
}

@media (max-width: 700px) {
    form .women {
        display: none;
    }

    form .men {
        display: none;
    }
}*/

/*new login fncci*/

.backImageCard {
    background-image: url(/images/Ellipse22.png);
    background-repeat: no-repeat;
    display: flex;
    overflow-x: hidden;
    background-position: center bottom;
    background-size: 100%;
    height: 100vh;
}

.card {
    width: 80.5%;
    max-width: 1300px;
    margin: 70px auto;
    height: 500px;
    background-color: white;
    border-radius: 30px;
    border: 9px solid #ffffff;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
}

.backimage {
    background-image: url(/images/Rectangle286.png);
    background-repeat: no-repeat;
    background-size: 593px;
    height: 475px;
    border: 20px;
    border-radius: 20px !important;
    bottom: 7.7px;
    right: 14.7px;
}

.col-sm-5 > h1,
.col-sm-5 > p {
    color: white;
}


.container,
.login-container {
    width: 82%;
    max-width: 600px;
    height: auto;
    background-color: #F9F9FD;
    border-radius: 30px;
    margin-left: 75px;
    margin-top: 30px;
}

.input-group-text {
    background-color: #fff;
    border-right: 1;
    box-shadow: none;
}

.custom-container {
    max-width: 300px;
    margin: auto;
}

.password-icon {
    cursor: pointer;
}

#inputEmail,
#password-input {
    border-color: lightgray;
    box-shadow: none;
}

.member {
    background-color: #0b1b43;
    border-color: #0b1b43;
    margin-left: 19%;
    margin-top: 2%;
}

.btn-become-member {
    margin-top: 2%;
}

.page {
    color: white;
    margin-top: 35%;
}

@media (max-width: 767px) {
    .card {
        width: 100%;
        max-width: none;
        margin: 20px auto;
    }

    .container,
    .login-container {
        width: 100%;
        height: 79%;
        max-width: none;
        margin: 10px auto;
    }

    .member,
    .btn-become-member {
        margin-left: 20px;
    }

    .col-sm-5 {
        margin-top: 50px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .card,
    .container,
    .login-container {
        width: 100%;
        max-width: none;
        margin: 10px auto;
    }

    .TopMemberLoginButton {
        display: block !important;
    }

    .TopName {
        font-size: 11px !important;
    }

    h1 {
        font-size: 26px;
    }

    .page {
        margin-top: 10rem !important;
    }

    .btn-become-member {
        margin-left: 30px;
    }
}

@media screen and (max-width: 480px) {
    .backimage {
        padding: 10px !important;
    }

    .logo {
        width: 70px !important;
        height: 70px !important;
    }

    .ImageWithText {
        display: block !important;
    }

    .TopName {
        font-size: 15px !important;
    }

    .page {
        margin-top: 10rem !important;
    }

    h1 {
        font-size: 26px;
    }

    .TopMemberLoginButton {
        display: block !important;
        padding-top: 13px !important;
    }

    .login-container {
        width: 277px !important;
        margin-left: -2rem !important;
    }

    .member {
        font-size: 10px;
    }

    .btn-become-member {
        font-size: 10px;
    }
}
