#oauth {
    margin: 10px 0 0 0;
    display: none;
}

#login_modal .fab,
#login_modal .fas {
    font-size: 18px;
}

#oauth .fab,
#oauth .fas {
    font-size: 18px;
}

#profile_oauth .fab,
#profile_oauth .fas {
    font-size: 24px;
}

.oauth__note {
    margin: 7px 12px 10px 0;
    color: #000;
    font-weight: bold;
}

.oauth__wrapper {
    transition: background-color .15s ease-in-out;
    padding: 7px 11px;
    border-radius: 4px;
    margin: 0 10px 0 0;
    cursor: pointer;
    position: relative;
}

#profile_oauth .oauth__wrapper {
    float: left;
}

.oauth__wrapper.active,
.oauth__wrapper.removable {
    cursor: default;
}

.oauth__wrapper.inactive:not(:hover) {
    background: rgba(100, 100, 100, .6);
}

.oauth__wrapper.removable {
    padding-right: 42px;
}

.oauth__wrapper .oauth__remove {
    background: #363839;
    border-bottom: none;
    border-top: none;
    border-right: none;
    border-left: solid 1px #2c2d2e;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    color: #ccc;
    display: none;
    font-size: 18px;
    height: 38px;
    padding: 0 1px 0 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 32px;
    transition: all .25s ease-in-out;
}

.oauth__wrapper .oauth__remove:hover {
    background: #4f5253;
    border-left: solid 1px #3c3e3f;
    color: #fff;
}

.oauth__wrapper.removable .oauth__remove {
    display: block;
}

.oauth__wrapper-ico {
    float: left;
    position: relative;
    width: 24px;
    height: 24px;
}

.oauth__wrapper-label {
    float: left;
}

#login_modal .oauth__wrapper-label {
    padding: 1px 0 0 6px;
}

#oauth .oauth__wrapper-label {
    padding: 1px 0 0 6px;
}

#profile_oauth .oauth__wrapper-label {
    padding: 1px 0 0 5px;
}

.apple__ico {
    background: #888;
    color: #fff;
}

.apple__ico .oauth__wrapper-ico .fab {
    font-size: 21px !important;
}

.apple__ico #appleid-signin {
    left: -1px;
    height: 34px;
    opacity: 0;
    position: absolute;
    top: 0px;
}

.google__ico {
    background: #4285f4;
    color: #fff;
}

#login_modal .google__ico .oauth__wrapper-ico .fab {
    margin-top: 3px;
}

.oauth__wrapper_ico, .oauth__wrapper_spinner {
    cursor: pointer;
    position: absolute;
    display: none;
    left: 0;
}

.oauth__wrapper .fa-spinner, #comment-spinner {
    display: inline-block;
    -webkit-animation: spin 1.5s linear infinite;
    -moz-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}

@media only screen and (max-width: 600px) {
    #oauth {
        margin-top: -6px;
    }
}