body {
    background: #FAFAFA;
    color: rgba(0,0,0,0.87);
    font: 400 12px/1 Roboto, Helvetica, Arial, sans-serif;
}
#main {
    min-height: 100%;
    margin: 0 auto;
}

/* LISTS */
.list-unstyled {
    margin: 0;
    padding-left: 0;
    list-style: none;
}
.list-inline.list-unstyled {
    margin-left: -5px;
}
.list-inline>li {
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px;
}

/* LINKS */
.idp-link {
    color: #03A9F4;
    text-decoration: none;
}

/* INPUTS */
/* When the input is not focused */
md-input-container label {
    font-size: 16px;
    color: rgba(0,0,0,0.54);
}
md-input-container .md-input {
    border-color: rgba(0,0,0,0.54);
}
/* When the input is focused */
md-input-container:not(.md-input-invalid).md-input-focused .md-input {
    border-color: rgba(3,169,244,1);
}
md-input-container:not(.md-input-invalid).md-input-focused label {
    color: rgba(3,169,244,1);
}
/* HELPERS */
.container { max-width: 980px; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.muted-text { color: rgba(0,0,0,0.54); }

/* PAGE LOGIN */
.login-panel {
    background: #FFF;
    padding: 24px;
    width: 360px;
}
.invitation-panel {
    background: #FFF;
    padding: 24px;
    max-width: 800px;
    font-size: 14px;
}
.login-panel legend, .invitation-panel legend {
    font-size: 24px;
    font-weight: 400;
    text-align: center;
    font-family: 'Roboto Condensed', sans-serif;
}
#main .md-primary {
    background: rgba(3,169,244,1);
}
#main .md-primary:hover {
    background: rgba(3,155,299,1);
}
md-input-container.disabled {
    cursor: not-allowed;
}
md-input-container.disabled input {
    pointer-events: none;
    color: rgba(0,0,0,0.54);
    border-bottom: 1px dashed rgba(0,0,0,0.54);
    cursor: not-allowed;
}

#main .md-primary.google-button {
    background-image: url('./images/btn_google_dark_normal_ios.svg');
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 36px 36px;
}

.error-message {
    color: red;
    margin-top: 0;
}
.md-button.md-icon-button.hide-error-button {
    padding: 0;
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 0;
    max-width: 20px;
    max-height: 20px;
}

@media (max-width: 480px) {
    .login-panel {
        width: 320px;
    }
}