.div_modal_login {
        display: none;
        position: fixed;
        z-index: 999;
        left: 0px;
        top: 0px;
        padding: 0;
        margin: 0;
        width: 100%;
        height: 100%;
        /* background-color: rgba(0, 0, 0, 0.7); */
    }

    /* Add Animation - Zoom in the Modal start */

    .div_modal_login {
        animation-name: zoom;
        animation-duration: 0.6s;
    }

    @keyframes zoom {
        from {
            transform: scale(0)
        }

        to {
            transform: scale(1)
        }
    }

    /* Add Animation - Zoom in the Modal end */

    #div_modal_login_sub {
        display: grid;
        width: 100%;
        height: 100%;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        align-items: center;
        justify-items: center;
    }

    /* LOGIN PAGES START */
    #div_modal_login_sub #div_modal_login_sub_wrap {
        position: relative;
        grid-row: 1;
        grid-column: 1;
        padding: 23px;
        border-radius: 23px;
        border: 1px solid #ddd;
        background-color: #ffffff;
        overflow: hidden;
        width: 50%;
        height: auto;

        -webkit-box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.75);
        -moz-box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.75);
        box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.75);
    }

    #div_modal_login_sub_wrap .my_close_modal_btn {
        -webkit-box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.75);
        -moz-box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.75);
        box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.75);
    }

    #div_modal_login_sub_wrap #div_message_box {
        font-size: 11px;
        font-style: italic;
        background-color: yellow;
        height: auto;
        word-wrap: break-word;
        margin: 0 0 0 10px;
    }

    #div_modal_login_sub_wrap #div_login_sub {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr;
    }

    #div_modal_login_sub_wrap #div_login_sub .div_login_left {
        grid-row: 1;
        grid-column: 1;
        height: 100%;
        background-image: url(../../css/images/pages/pg_login_left.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    #div_modal_login_sub_wrap #div_login_sub .div_login_right {
        grid-row: 1;
        grid-column: 2;
        height: 100%;
        padding: 7px;
        align-items: start;
    }

    #div_modal_login_sub_wrap table {
        text-align: center;
        width: 100%;
    }

    #div_modal_login_sub_wrap table th {
        background: transparent;
        border: 0px solid #ddd;
        text-align: center;
    }

    #div_modal_login_sub_wrap table td {
        border: 0px solid #ddd;
        text-align: center;
    }

    #div_modal_login_sub_wrap input[type=text],
    #div_modal_login_sub_wrap input[type=number],
    #div_modal_login_sub_wrap input[type=password] {
        width: 100%;
        background-color: #e8f0fe;
        padding: 12px 20px;
        margin: 1px 0 10px 0;
        display: inline-block;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
    }

    #div_modal_login_sub_wrap .div_login_labels {
        display: block;
        font-size: 12px;
        text-align: left;
    }

    #div_modal_login_sub_wrap .link_reset {
        display: block;
        font-size: 12px;
        text-align: left;
        text-decoration: none;
    }

    #div_modal_login_sub_wrap .link_reset:hover {
        text-decoration: underline;
    }

    #div_modal_login_sub_wrap .link_register {
        font-size: 12px;
        text-decoration: none;
        width: auto;
        cursor: pointer;
        color: black;
        background-color: #ffffff;
        border: 1px solid #ddd;
        border-radius: 21px;
        padding: 14px 20px;
        margin: 10px auto;
    }

    #div_modal_login_sub_wrap .link_register:hover {
        color: white;
        background-color: #ff3300;
    }

    #div_modal_login_sub_wrap .link_back_login {
        display: block;
        font-size: 12px;
        text-align: center;
        text-decoration: none;
    }

    #div_modal_login_sub_wrap .link_back_login:hover {
        text-decoration: underline;
    }

    #div_modal_login_sub_wrap img.captcha {
        width: auto;
        height: 47px;
        border-radius: 5px;
        border: 3px solid rgb(214, 245, 36);
    }

    #div_modal_login_sub_wrap .input_submit {
        width: 100%;
        color: white;
        background-color: #ffb200;
        padding: 14px 20px;
        margin: 1px 0;
        border: none;
        border-radius: 21px;
        cursor: pointer;
        width: 75%;
    }

    #div_modal_login_sub_wrap .input_submit:hover {
        background-color: #ff3300;
    }

    /* LOGIN PAGES END */
    @media (min-width: 0px) and (max-width: 479px) {
        #div_modal_login_sub #div_modal_login_sub_wrap {
            width: 85%;
            overflow-y: auto;
        }

        #div_modal_login_sub_wrap #div_login_sub {
            grid-template-columns: auto 1fr;
        }
    }

    @media (min-width: 0px) and (max-width: 767px) {
        #div_modal_login_sub #div_modal_login_sub_wrap {
            width: 72%;
        }
    }

    @media (max-height: 500px) {
        #div_modal_login_sub #div_modal_login_sub_wrap {
            height: 85%;
            width: auto;
            overflow-y: auto;
        }
    }