* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        #login_main_div {
            display: flex;
        align-items: center;
        justify-content: center;
        background: #bbbbbb;
        box-shadow:  2px 2px 2px #c5c5c5,
                     -2px -2px 2px #fbfbfb;
        border-radius: 10px;

        
        }

        .login_items_div {
            width: 50%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 40px;
          
        }

        .login_inner_div {
            display: flex;
            flex-direction: column;
            width: 90%;
            align-items: center;
        }

        .input {
            display: flex;
            align-items: center;

            border: 1px solid rgb(255, 255, 255);
            width: 330px;
            border-radius: 5px;
            padding: 2px 5px;
        }

        input {
            width: 100%;
            border: none;
            background-color: transparent;
            outline: none;
        }

        #sign_in_btn {
            text-align: center;
            padding: 11px;
            width: 330px;
            background: #dddddd;
            box-shadow:  -2px -2px 2px #b1b0b0,
                         2px 2px 2px #ffffff;
            color: blue;
            border: none;
            font-weight: 600;
            border-radius: 5px;
            margin-top: 10px;
        }

        .forget_btn_div {
            margin-top: 10px;
            width: 330px;
            display: flex;
            justify-content: space-between;
        }

        #rember_Me {
            width: 16px;
            height: 16px;
            border: 1px solid rgb(255, 255, 255);
            margin-right: 10px;
        }

        .divider {
            margin-top: 10px;
            padding: 0px 10px;
            display: flex;
            align-items: center;
        }

        .divider::before,
        .divider::after {
            flex: 1;
            content: '';
            padding: 1px;
            background: #f3f3f3;
            box-shadow:  2px 2px 2px #c5c5c5,
                         -2px -2px 2px #fbfbfb;
            margin: 1px;
        }

        #sign_in_with_div {
            display: flex;
            justify-content: space-between;
            margin-top: 10px;
        }

        .sign_in_with_Inner_div {
            margin: 5px;
            display: flex;
            align-items: center;
            border: 1px solid rgb(255, 255, 255);
            padding: 2px 10px;
            border-radius: 3px;
            cursor: pointer;
        }

        .bar_div {
            width: 30px;
            background: #f3f3f3;
            box-shadow:  2px 2px 2px #c5c5c5,
                         -2px -2px 2px #fbfbfb;
            border-radius: 10px;
            padding: 2px;
            margin: 2px;
            cursor: pointer;
        }
 
        .bar_div:hover {
            background-color: rgb(255, 44, 160);
        }