.login-section {
    background: url(/images/background.34007d18e7a175f00684.png)
}

    .login-section .right-form-section {
        align-items: flex-end;
        display: flex;
        height: calc(100vh - 100px);
        padding-bottom: 50px;
        padding-right: 80px;
        width: 100%
    }

        .login-section .right-form-section .login-form-section {
            width: 100%
        }

            .login-section .right-form-section .login-form-section .checkbox-label-part, .login-section .right-form-section .login-form-section .input-label-part {
                color: var(--whiteColor);
                display: flex
            }

                .login-section .right-form-section .login-form-section .checkbox-label-part .input-label, .login-section .right-form-section .login-form-section .input-label-part .input-label {
                    color: var(--whiteColor);
                    text-align: right
                }

            .login-section .right-form-section .login-form-section .button-part, .login-section .right-form-section .login-form-section .checkbox-label-part {
                margin-left: 135px
            }

            .login-section .right-form-section .login-form-section .forgot-pass-sec {
                margin-left: 135px;
                margin-top: 12px
            }

                .login-section .right-form-section .login-form-section .forgot-pass-sec a {
                    color: var(--whiteColor);
                    font-size: 115%
                }

.Login-main-section {
    align-items: center;
    background: #f9faff;
    display: flex;
    height: 100vh;
    justify-content: center;
    position: relative;
    width: 100%
}

    .Login-main-section:before {
        bottom: 20px;
        height: 100%;
        left: 0;
        width: 130px
    }

    .Login-main-section:after, .Login-main-section:before {
        background: url(/images/login-shap.3fe8ac30fb8d04f02858.png);
        background-repeat: no-repeat;
        background-size: contain;
        content: "";
        position: absolute;
        z-index: 0
    }

    .Login-main-section:after {
        bottom: -190px;
        height: 500px;
        right: -20px;
        transform: rotate(210deg);
        width: 250px
    }

    .Login-main-section .login-box-part {
        align-items: center;
        background: var(--whiteColor);
        border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -ms-border-radius: 10px;
        -o-border-radius: 10px;
        box-shadow: inset 0 0 15px hsla(0,0%,100%,.451),inset 0 0 15px rgba(79,144,255,.169),0 0 30px -10px rgba(128,160,215,.431);
        display: flex;
        height: 80%;
        justify-content: space-between;
        overflow: hidden;
        width: 80%;
        z-index: 1
    }

        .Login-main-section .login-box-part .left-sec {
            align-items: center;
            background: url(/images/background.34007d18e7a175f00684.png);
            background-position: 50%;
            background-repeat: no-repeat;
            background-size: cover;
            display: flex;
            height: 100%;
            justify-content: center;
            padding: 50px 50px 50px 0;
            width: 80%
        }

        .Login-main-section .login-box-part .right-sec {
            padding: 50px;
            position: relative;
            width: 20%
        }

            .Login-main-section .login-box-part .right-sec .inner-box {
                background: var(--whiteColor);
                border-radius: 10px;
                -webkit-border-radius: 10px;
                -moz-border-radius: 10px;
                -ms-border-radius: 10px;
                -o-border-radius: 10px;
                box-shadow: inset 0 0 15px hsla(0,0%,100%,.451),inset 0 0 15px rgba(79,144,255,.169),0 0 30px -10px rgba(128,160,215,.431);
                height: 100%;
                padding: 50px 30px;
                position: relative;
                right: 270px;
                top: 50%;
                width: 450px
            }

                .Login-main-section .login-box-part .right-sec .inner-box .login-form-section .input-label-part {
                    align-items: flex-start;
                    flex-direction: column
                }

                .Login-main-section .login-box-part .right-sec .inner-box .login-form-section .button-part {
                    width: 100%
                }

                    .Login-main-section .login-box-part .right-sec .inner-box .login-form-section .button-part button {
                        margin: 0 auto;
                        width: 50%
                    }

                .Login-main-section .login-box-part .right-sec .inner-box .login-form-section .forgot-pass-sec {
                    color: var(--themeColor);
                    margin-bottom: 20px;
                    margin-top: -20px;
                    text-align: right
                }

@media only screen and (max-width:1560px) {
    .Login-main-section .login-box-part .left-sec {
        padding: 50px 150px 50px 0;
        width: 70%
    }

    .Login-main-section .login-box-part .right-sec {
        width: 25%
    }
}

@media only screen and (max-width:1200px) {
    .Login-main-section .login-box-part .left-sec {
        padding: 50px 150px 50px 0;
        width: 70%
    }

        .Login-main-section .login-box-part .left-sec img {
            width: 65%
        }

    .Login-main-section .login-box-part .right-sec {
        width: 25%
    }

        .Login-main-section .login-box-part .right-sec .inner-box {
            width: 400px
        }

            .Login-main-section .login-box-part .right-sec .inner-box .login-form-section .button-part button {
                width: 40%
            }
}

.login-validation-message .invalid-cred-message {
    color: #e30000;
    font-size: 12px;
    font-weight: 500
}

.btn {
    align-items: center;
    background-size: 180% 100%;
    border: none;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    cursor: pointer;
    display: flex;
    font-size: 100%;
    font-weight: 500;
    height: 35px;
    justify-content: center;
    min-width: 80px;
    padding: 5px;
    text-align: center;
    transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    width: -webkit-max-content;
    width: max-content
}

    .btn, .btn:hover {
        color: var(--whiteColor)
    }

        .btn:hover {
            moz-transition: all .4s ease-in-out;
            background-position: 100% 0;
            transition: all .4s ease-in-out;
            -moz-transition: all .4s ease-in-out;
            -ms-transition: all .4s ease-in-out
        }

        .btn img {
            filter: brightness(0) invert(1);
            -webkit-filter: brightness(0) invert(1);
            margin-right: 8px;
            width: 14px
        }

        .btn.theme-button {
            background: #1b54c2
        }

            .btn.theme-button:hover {
                background: var(--primaryColor)
            }

        .btn.dark-btn {
            background: rgba(45,54,65,.749)
        }

            .btn.dark-btn:hover {
                background: rgba(63,74,88,.749)
            }

        .btn.secondary-btn {
            background: var(--grayColor);
            min-width: 80px
        }

            .btn.secondary-btn:hover {
                background: #a1a1a1
            }

        .btn.orange-yellow-btn {
            background-image: var(--orange-yellow-bg-g);
            box-shadow: 0 4px 15px 0 #e5420abf
        }

        .btn.light-red-btn {
            background-image: var(--light-red-bg-g);
            box-shadow: 0 4px 15px 0 #ec7495bf
        }

        .btn.danger-btn {
            background-image: var(--danger-bg-g);
            box-shadow: 0 5px 15px #f2616766
        }

        .btn.warning-btn {
            background-image: var(--warning-bg-g);
            box-shadow: 0 4px 15px 0 #4184eabf
        }

        .btn.info-btn {
            background-image: var(--info-bg-g);
            box-shadow: 0 4px 15px 0 #744fa8bf
        }

        .btn.blue-btn {
            background: #1b54c2;
            min-width: 80px
        }

            .btn.blue-btn:hover {
                background: var(--primaryColor)
            }

        .btn.disable-btn {
            color: #fff;
            cursor: not-allowed !important;
            min-width: 80px;
            pointer-events: inherit
        }

.button-loading-part {
    animation: button-loading-spinner 1s ease infinite;
    border: 4px solid #0000;
    border-radius: 50%;
    border-top-color: #fff;
    content: "";
    height: 16px;
    margin: auto;
    width: 16px
}

@keyframes button-loading-spinner {
    0% {
        transform: rotate(0turn)
    }

    to {
        transform: rotate(1turn)
    }
}
/*# sourceMappingURL=7324.c4ebe840.chunk.css.map*/