/**
 * Login
 */

.help-text.signup,
.help-text.login {
    display: block;
    margin-bottom: 5.4rem;
}

.checkbox-label {
    margin: 2.2rem 0;
}

.button.signin,
.button.create-account {
    display: block;
    margin: 0.8rem 0;
}

.existing-account .form {
    margin-top: 0;
}

.or.or-account {
    background-image: url('../img/or.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    color: #757575;
    display: block;
    font-weight: 300;
    height: 14.4rem;
    position: relative;
    text-align: center;
}

.other-account > p {
    margin: 0.8rem 0;
}

.learn-more {
    margin-top: 3.4rem;
}

.learn-more a {
    display: block;
    margin-bottom: 0.6rem;
}

.learn-more a.new-group {
    margin-top: 3rem;
}

.right-wrapper {
    margin-top: 5rem;
}

.right-wrapper p {
    margin-bottom: 14px;
}

@media only screen and (max-width: 719px) {
    #main .container {
        padding-bottom: 0;
    }

    .login-toggle {
        padding: 0 4rem;
        margin-top: 1.2rem;
    }

    .login-toggle .btn {
        background-color: #f6f6f6;
        border: 1px solid #d3d3d3;
        border-radius: 0.5rem;
        display: inline-block;
        font-size: 1.6rem;
        padding: 0.8rem 0;
        width: 50%;

        -webkit-box-shadow: 0 0 0 #000;
        box-shadow: 0 0 0 #000;

        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .login-toggle .active {
        background-color: #fff;
        color: #3f96d3;
    }

    .login-toggle .login {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .login-toggle .signup {
        border-left: 0;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        padding-left: 1.0rem;   /* 2.0rem; */
    }

    .login-toggle .or {
        background-color: #fff;
        border: 1px solid #d3d3d3;
        border-radius: 50%;
        color: #c3c3c3;
        font-size: 1.1rem;  /* 2.2rem; */
        font-style: italic;
        font-weight: 400;   /* 600; */
        height: 1.7rem;     /* 3.4rem; */
        left: 50%;
        line-height: 1.5rem; /* 3rem; */
        margin-left: -1rem; /* -1.6rem; */
        margin-top: -1rem;  /* -1.6rem; */
        position: absolute;
        text-align: center;
        top: 50%;
        width: 1.7rem;      /* 3.4rem; */
        z-index: 10;
    }

    .help-text {
        color: #696969;
        font-size: 1.5rem;  /* 3.2rem; */
        margin: 0.5rem 0;     /* 4rem 0; */
        text-align: center;
    }

    .help-text a {
        display: block;
    }

    .other-account {
        text-align: center;
    }

    .other-account > p {
        font-size: 1.5rem;  /* 3.2rem; */
        font-weight: 500;
        margin: 0 0 1.1rem; /* 0 0 2.2rem; */
    }

    .account-tile-list {
        text-align: center;
    }

    .account-tile {
        margin-left: 0.5rem;        /* 1.0rem; */
        margin-right: 0.5rem;       /* 1.0rem; */
    }

    .account-tile a {
        background-color: #bdbdbd;
        border-radius: 0.5rem;  /* 1rem; */
        font-size: 2.6rem;      /* 5.2rem; */
        height: 4.8rem;         /* 9.6rem; */
        line-height: 4.8rem;     /* 9.6rem; */
        text-align: center;
        width: 4.8rem;          /* 9.6rem; */
    }

    input[type=checkbox].checkbox-input + .checkbox-label {
        background-color: transparent;
        color: #918b86;
        cursor: pointer;
        display: block;
        font-size: 1.5rem;  /* 3.2rem; */
        font-weight: 300;   /* 400; */
        height: auto;
        line-height: normal;
        margin: 0;
        padding: 1rem 2rem; /* 2rem 4rem; */
        vertical-align: baseline;
    }

    input[type=checkbox].checkbox-input + .checkbox-label {
        background-image: none;
    }

    input[type=checkbox].checkbox-input + .checkbox-label:after {
        color: #e2e2e2;
        content: "\f103";
        font-family: 'icons';
        font-size: 2rem;    /* 4rem; */
        height: 100%;
        margin-top: -1rem;  /* -2rem; */
        position: absolute;
        right: 1.7rem;      /* 3.4rem; */
        top: 50%;

        -webkit-transition: all 0.15s ease-out;
        -moz-transition: all 0.15s ease-out;
        -o-transition: all 0.15s ease-out;
        transition: all 0.15s ease-out;
    }

    input[type=checkbox].checkbox-input:checked + .checkbox-label:after {
        color: #bbdd70;
    }
    
    #password-again.text-input {
        border-bottom: none;
    }
}