@charset "utf-8";

/* PERFECT FLEXBOX LAYOUT FIX FOR 20210906 - EXACT ORIGINAL PROPORTIONS */

.phone {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 10px auto !important;
    width: 500px !important;
    max-width: 100% !important;
}

.code .input {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 10px auto !important;
    width: 500px !important;
    max-width: 100% !important;
}

input#DAA009 {
    display: block !important;
    width: 328px !important;
    flex: 0 0 328px !important;
    height: 50px !important;
    font-size: 20px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    border: 0 !important; /* Flat white */
    box-shadow: none !important;
}

a#sendCodeBtn {
    display: block !important;
    width: 150px !important;
    flex: 0 0 150px !important;
    height: 50px !important;
    line-height: 46px !important;
    font-size: 18px !important;
    margin: 0 !important;
    margin-left: 22px !important; /* 500 - 328 - 150 = 22 */
    text-align: center !important;
    padding: 0 !important;
    box-shadow: none !important;
}

input#M5Code {
    display: block !important;
    width: 259px !important;
    flex: 0 0 259px !important;
    height: 50px !important;
    font-size: 20px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    border: 0 !important; /* Flat white */
    box-shadow: none !important;
}

input#submitBtn {
    display: block !important;
    width: 220px !important;
    flex: 0 0 220px !important;
    height: 50px !important;
    line-height: 46px !important;
    font-size: 18px !important;
    font-weight: bold !important;
    margin: 0 !important;
    margin-left: 21px !important; /* 500 - 259 - 220 = 21 */
    text-align: center !important;
    padding: 0 !important;
    box-shadow: none !important;
}

@media screen and (max-width: 640px) {
    .phone, .code .input {
        width: 100% !important;
        flex-direction: column !important;
    }
    input#DAA009, input#M5Code, a#sendCodeBtn, input#submitBtn {
        width: 100% !important;
        flex: auto !important;
        margin-left: 0 !important;
        margin-top: 10px !important;
    }
}