.tabs {
    height: 50px;
    width: 100%;
    display: flex;
    background: #f2f2f2;
    list-style: none;
    border-radius: 40px;
    position: relative;
    padding: 25px;
}

a.glider::before {
    content: "";
    height: 45px;
    width: 100%;
    background: #edd074;
    position: absolute;
    border-radius: 40px;
}

.tabs > a{
    height: 100%;
    width: 100%;
    text-align: center;
    display: flex;
    place-items: center;
    justify-content: center;
    font-size: 14px;
    position: relative;
    z-index: 1;
    cursor: pointer;
}
.tab {
    cursor: pointer;
    z-index: 1;
}

i.fa-facebook {
    box-shadow: 0px 2px 6px rgb(0 0 0 / 15%);
    background-color: #3A559F;
    color: white;
    font-size: 2rem;
    padding: 0.5em;
    text-align: center;
    width: 4rem;
    height: 4rem;
}
i.fa-google {
    box-shadow: 0px 2px 6px rgb(0 0 0 / 15%);
    background-color: #FFFFFF;
    font-size: 2rem;
    padding: 0.5em;
    text-align: center;
    width: 4rem;
    height: 4rem;
}
.fa-google:before {
    background: conic-gradient(from -45deg, #ea4335 110deg, #4285f4 90deg 180deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55%/150% 150% no-repeat;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}