/* global link hover */
.login-page a:hover {
    color: var(--primary) !important;
}
/* override btn-primary hover*/
.login-page .btn-primary:hover {
    background: var(--primary-900);
    border: solid 1px var(--primary-900);
}


/* back home */
.back-home {
    position: relative;
}

.back-home i {
    display: inline-block;
    background: url(/Images/icon/login/icon_home.svg) no-repeat center center;
    width: 24px;
    height: 12px;
    transform: scale(1.2);
}

.back-home a {
    display: flex;
    align-items: center;
    color: var(--primary);
    position: absolute;
    top: 5px;
    right: 6px;
    z-index: 111;
    font-size: 13px;
}

/* back home for 註冊 */
#register .back-home a {
    right: 93px;
}

/* google btn */
.login-btns #googleSignInBtn {
    color: #777;
    background: #fff;
    border: 1px solid #ccc;
}

/* fb btn */
/* bf! btn */
.login-btns .login.fb-login,
.login-btns .login.bf-login {
    color: #777;
    background: #fff;
    border: 1px solid #ccc;
    margin-top: 10px;
}

/* line between 或使用有閑帳號繼續 */
h2.line-between {
    display: flex;
    flex-direction: row;
}

h2.line-between:before,
h2.line-between:after {
    content: "";
    flex: 1 1;
    border-bottom: 1px solid;
    margin: auto;
}

h2.line-between:before {
    margin-right: 10px
}

h2.line-between:after {
    margin-left: 10px
}

/* 記住我 */
form .remember-me {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

/* 忘記密碼 */
form .btn-forgot {
    color: var(--primary);
}

/* 登入 */
form .login-btnb {
    box-shadow: none;
    color: #fff;
    width: 100%;
    font-size: 16px;
    background: var(--primary-800);
    border-radius: 20px;
    height: 40px;
}

form .login-btnb:hover {
    color: #fff;
    background: var(--primary-900);
}

/* 登入 override */
#login .btn-build {
    width: 100%;
}

/* 註冊/登入 */
form .btn-build {
    color: var(--primary);
    display: inline-block;
    text-align: center;
    margin-top: 10px;
}

/* 使用其它第三方快速繼續 */
.login-wrapb .btn-third-party {
    background: none;
    color: #e61414;
    width: 100%;
    height: 40px;
    border: 1px solid #e61414;
    border-radius: 6px;
}

.login-wrapb .btn-third-party:hover {
    color: var(--primary-900);
    border: 1px solid var(--primary-900);
}

/**
 *忘記密碼頁
*/
/* 寄送驗證信 btn */
#find-password .btn-primary {
    line-height: unset;
    box-shadow: none;
    width: 100%;
    height: 40px;
}

#find-password .btn-forgot {
    float: left;
    width: 100%;
    text-align: center;
    margin-top: 20px;
}

/**
 * 登入&註冊 with auto scrollbar
 */

#login .login-right,
#register .login-right { /* auto sscrollbar */
    overflow: hidden auto;
}

#login .login-right { /* 置中 on mobile */
    display: flex;
    justify-content: center;
}

#login .login-btnb+a.btn-build,
#register .btn-third-party { /* scrollbar bottom margin */
    margin-bottom: 20px;
}

#login .login-logob, /* max-height allowed without scroll */
#register .login-logob {
    top: 0;
    width: 320px;
    max-height: 472px;
}

#login .login-logob { /* 登入頁 override max-height */
    max-height: 514px;
}

@media (max-width: 767px) {
    /* back home for 註冊 */
    #register .back-home a {
        right: 6px;
    }

    /* reset sscrollbar */
    #register .login-right {
        overflow: unset;
    }

    /* third-party btns width */
    #register .login-logob {
        top: 0;
        width: auto;
        max-height: none;
    }

    /* 第三方註冊置中 */
    #register .register-with-third-party {
        transform: translateY(50%);
        height: auto;
    }

    #register .register-with-third-party .login-logob {
        margin: 0;
    }

    #register .register-with-third-party .btn-third-party {
        margin-bottom: 0;
    }

    /* footer */
    body#find-password,
    body#register {
        background: #fff;
    }

    .login-page .login-foot {
        position: relative;
        bottom: 0;
        width: 100%;
        background: #383637;
        height: 55px;
        padding: 10px 0;
        margin: 0;
    }

    /* 第三方註冊 fixed footer */
    #register .register-with-third-party.login-foot {
        transform: translateY(0px);
        height: 55px;
        position: fixed;
        bottom: 0;
    }

    /* 忘記密碼，reset */
    #find-password .login-wrapb {
        height: auto;
        overflow: unset;
    }

    /* 忘記密碼，頁面置中 */
    #find-password .login-right {
        transform: translateY(50%);
    }

    #find-password .login-logob,
    #find-password .login-logob h1 {
        margin: 0;
    }

    /* 忘記密碼 fixed footer */
    #find-password .login-foot {
        position: fixed;
    }
}