[class*="fontawesome-"]:before {
    font-family: 'FontAwesome', sans-serif;
}

form#ExternalLogin-form {
    background: #fff;
    width: 25em;
    margin: 2em auto;
    overflow: hidden;
    position: relative;
    -moz-border-radius: 0.3em;
    -webkit-border-radius: 0.3em;
    border-radius: 0.3em;
    -moz-box-shadow: 0 0 0.2em #000;
    -webkit-box-shadow: 0 0 0.2em #000;
    box-shadow: 0 0 0.2em #000;
}

    form#ExternalLogin-form ul.list {
        padding-left: 0;
        text-align: center;
        overflow-wrap: break-word;
    }

    form#ExternalLogin-form div.heading {
        background: #2084ba;
        color: #fff;
        text-align: center;
        text-transform: uppercase;
        font-weight: bold;
        padding: 1.5em;
    }

    form#ExternalLogin-form div.title {
        background: #2084ba;
        text-align: center;
        padding-top: 1em;
        padding-bottom: 1em;
    }

    form#ExternalLogin-form div.connect {
        color: gray;
        font-size: 1.1em;
        text-align: center;
        font-weight: bold;
    }

    form#ExternalLogin-form div.left {
        padding: 1.7em 1.5em 2.5em 1.5em;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

form#email-login-form {
    background: #fff;
    width: 45em;
    margin: 2em auto;
    overflow: hidden;
    position: relative;
    -moz-border-radius: 0.3em;
    -webkit-border-radius: 0.3em;
    border-radius: 0.3em;
    -moz-box-shadow: 0 0 0.2em #000;
    -webkit-box-shadow: 0 0 0.2em #000;
    box-shadow: 0 0 0.2em #000;
}

.list {
    list-style-type: none;
    overflow: auto;
}

form#email-login-form div.title {
    background: #2084ba;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
}

form#email-login-form div.connect {
    color: gray;
    font-size: 1.1em;
    text-align: center;
    font-weight: bold;
}

form#email-login-form .error-message {
    color: red;
}

form#email-login-form div.center {
    margin: 0 auto;
    width: 50%;
    padding: 1.7em 1.5em 2.5em 1.5em;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

div.left label, div.center label {
    display: inline-block;
    color: gray;
    font-size: 1.1em;
    margin-top: 0.6em;
}

div.left input[type="text"], div.left input[type="password"], div.center input[type="text"] {
    border: 0.1em solid #dfdfdf;
    padding: 0.5em;
    width: 95%;
    margin: 0.4em 0;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
    border-radius: 0.2em;
    -moz-box-shadow: 0 0 0.2em rgba(223, 223, 223, 0.2);
    -webkit-box-shadow: 0 0 0.2em rgba(223, 223, 223, 0.2);
    box-shadow: 0 0 0.2em rgba(223, 223, 223, 0.2);
    -moz-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}

    div.left input[type="text"]:focus, div.left input[type="password"]:focus, div.center input[type="text"]:focus {
        outline: none;
        border: 0.1em solid #bdbdbd;
    }

div.left input[type="submit"], div.center input[type="submit"] {
    background: #2084ba;
    color: #fff;
    font-size: 1.0em;
    outline: none;
    padding: 0.8em;
    overflow: hidden;
    border: none;
    letter-spacing: 0.1em;
    margin: 0.5em 0;
    -moz-border-radius: 0.4em;
    -webkit-border-radius: 0.4em;
    border-radius: 0.4em;
    -moz-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}

    div.left input[type="submit"]:hover, div.center input[type="submit"]:hover {
        background: rgba(58, 88, 154, 0.8);
    }

div.right div.connect {
    color: gray;
    font-size: 1.1em;
    text-align: center;
    font-weight: bold;
}

div.right a {
    display: inline-block;
    font-size: 1.0em;
    text-decoration: none;
    color: white;
    width: 15em;
    padding: 0.55em 0.3em;
    clear: both;
    text-align: center;
    margin: 0.5em 0.1em;
    -moz-border-radius: 0.3em;
    -webkit-border-radius: 0.3em;
    border-radius: 0.3em;
}

    div.right a.loginbutton {
        background: #2084ba;
        margin-top: 0.8em;
        -moz-transition: all 0.15s ease-in-out;
        -o-transition: all 0.15s ease-in-out;
        -webkit-transition: all 0.15s ease-in-out;
        transition: all 0.15s ease-in-out;
    }

        div.right a.loginbutton:hover {
            background: rgba(58, 88, 154, 0.8);
        }

div.left a {
    display: inline-block;
    font-size: 1.0em;
    text-decoration: none;
    color: white;
    width: 15em;
    padding: 0.55em 0.3em;
    clear: both;
    text-align: center;
    margin: 0.5em 0.1em;
    -moz-border-radius: 0.3em;
    -webkit-border-radius: 0.3em;
    border-radius: 0.3em;
}

    div.left a.loginbutton {
        background: #2084ba;
        margin-top: 0.8em;
        -moz-transition: all 0.15s ease-in-out;
        -o-transition: all 0.15s ease-in-out;
        -webkit-transition: all 0.15s ease-in-out;
        transition: all 0.15s ease-in-out;
    }

        div.left a.loginbutton:hover {
            background: rgba(58, 88, 154, 0.8);
        }