@media (min-width: 992px) {
            .auth-div {
                width: 100%;
                height: 100vh;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding-left: 20px;
                padding-right: 20px;
                z-index: 1000;
                position: relative;
            }
            .auth-div .form-box {
                width: 100%;
                height: 100%;
                background-color: white;
                box-shadow: rgba(0, 0, 0, 0.061) 0px 1px 20px;
                padding: 50px;
            }
            .auth-div .form-box h5 {
                font-family: "Yekan1" !important;
                font-size: 22px;
            }
            .auth-div .form-div {
                margin-top: 30px;
            }
            .auth-div .form-div input {
                width: 100%;
                background-color: #f7f7f7;
                color: #535353;
                border: 1px solid transparent;
                height: 50px;
                padding-right: 20px;
            }
            .auth-div .form-div input::placeholder {
                color: #535353;
            }
            .auth-div .form-div button {
                width: 100%;
                background: linear-gradient(45deg, #113fb4, #5278d8, #113fb4);
                color: #ffffff;
                border: none;
                height: 50px;
            }
            .auth-div .forgot {
                border-top: 1px solid rgb(214, 214, 214);
                width: 100%;
                margin-top: 30px;
                display: flex;
                justify-content: center;
                padding-top: 20px;
                align-items: center;
            }
            .auth-div .forgot a {
                text-decoration: none;
                margin-top: -10px;
                margin-right: 5px;
            }
            .wave {
                position: absolute;
                bottom: 0;
                left: 0;
                width: 1600px;
                height: 198px;
                animation: wave 7s linear infinite;
            }
            .wave:nth-child(2) {
                left: 1600px;
                /* دقیقا پشت موج اول شروع می‌شود */
                color: #57BBC1;
                color: #015871;
            }
            @keyframes wave {
                0% {
                    transform: translateX(0);
                }
                100% {
                    transform: translateX(-1600px);
                    /* طول یک موج کامل */
                }
            }
        }
        
        @media (max-width: 992px) {
            /* html,
            body {
                overflow: hidden;
                margin: 0;
                padding: 0;
                width: 100%;
                height: 100%;
            } */
            .auth-div {
                width: 100%;
                height: 100vh;
                display: flex;
                align-items: center;
                justify-content: space-between;
                /* padding-left: 20px;
        padding-right: 20px; */
                z-index: 1000;
                position: relative;
                overflow-x: hidden;
            }
            .auth-div .form-box {
                width: 100%;
                height: 100%;
                background-color: white;
                box-shadow: rgba(0, 0, 0, 0.089) 0px 1px 20px;
                padding: 30px;
            }
            .auth-div .form-box h5 {
                font-family: "Yekan1" !important;
                font-size: 20px;
            }
            .auth-div .form-div {
                margin-top: 30px;
            }
            .auth-div .form-div input {
                width: 100%;
                background-color: #f7f7f7;
                color: #535353;
                border: 1px solid transparent;
                height: 50px;
                padding-right: 20px;
            }
            .auth-div .form-div input::placeholder {
                color: #535353;
            }
            .auth-div .form-div button {
                width: 100%;
                background: linear-gradient(45deg, #113fb4, #5278d8, #113fb4);
                color: #ffffff;
                border: none;
                height: 50px;
            }
            .auth-div .forgot {
                border-top: 1px solid rgb(214, 214, 214);
                width: 100%;
                margin-top: 30px;
                display: flex;
                justify-content: center;
                padding-top: 20px;
                align-items: center;
            }
            .auth-div .forgot a {
                text-decoration: none;
                margin-top: -10px;
                margin-right: 5px;
            }
            .wave {
                position: absolute;
                bottom: 0;
                left: 0;
                width: 1600px;
                height: 198px;
                animation: wave 7s linear infinite;
            }
            .wave:nth-child(2) {
                left: 1600px;
                /* دقیقا پشت موج اول شروع می‌شود */
            }
            @keyframes wave {
                0% {
                    transform: translateX(0);
                }
                100% {
                    transform: translateX(-1600px);
                    /* طول یک موج کامل */
                }
            }
        }
        
        .invalid-feedback {
            display: block;
            font-size: 13px;
        }
        
        .invalid-feedback span strong {
            color: red;
            font-size: 13px;
        }
        
        .gmail-login img {
            width: 50px;
        }
        
        .gmail-login a {
            text-decoration: none;
            font-size: 16px;
            margin-right: 10px;
            color: rgb(172, 0, 0);
        }