:root {
    --gap: clamp(.75rem, calc(0.45rem + 0.45vw), 1.5rem);

    --color-bluesky: #1185fe;
    --color-facebook: #0866ff;
    --color-youtube: #cd2900;
    --color-tiktok-cyan: #69c9d0;
    --color-tiktok: #1d1d1b;
    --gradient-instagram: linear-gradient(
        45deg,
        #f09433,
        #e6683c,
        #dc2743,
        #cc2366,
        #bc1888
    );
    --color-instagram: #e1306c;
    --white: #eae4da;
}

.floating-social-labels-wrapper > * {
    box-sizing: border-box;
}

.floating-social-labels-item {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: calc(var(--gap) * 0.25) calc(var(--gap) * 0.35);
}

.floating-social-labels-item svg {
    width: calc(var(--gap) * 2);
    height: calc(var(--gap) * 2);
}

.floating-social-labels-wrapper {
    display: flex;
    flex-flow: column;
    justify-content: flex-end;
    padding-bottom: var(--gap);
    z-index: 699 !important;
}

.floating-social-labels-item {
    box-shadow:
        rgba(0, 0, 0, 0.16) 0px 3px 6px,
        rgba(0, 0, 0, 0.23) 0px 3px 6px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.floating-social-labels-item svg {
    width: 75%;
    height: 75%;
    margin: auto;
}

.floating-social-labels-item {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    width: calc(var(--gap) * 2);
    height: calc(var(--gap) * 2);
    padding: 0;
    border-radius: var(--border-radius);
    rgb(14 30 37 / calc(0.12 * var(--header-shadow, 0))) 0px 2px 4px 0px,
    rgb(14 30 37 / calc(0.32 * var(--header-shadow, 0))) 0px 2px 16px 0px;
}

#floating-social-labels-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: var(--gap);
    width: calc(var(--gap) * 2);
    height: 100vh;
    position: fixed;
    top: 0;
}

@media (min-width: 576px) {
    #floating-social-labels-wrapper {
        top: 0;
    }
}

@media (min-width: 1440px) {
    #floating-social-labels-wrapper {
        width: calc(var(--gap) * 2);
        height: 100vh;
        position: fixed;
        top: 0;
    }
}

#instagram {
    margin-bottom: var(--gap);
    background-color: var(--color-instagram);
}

#tiktok {
    margin-bottom: var(--gap);
    background-color: var(--color-tiktok);
}

#youtube {
    margin-bottom: var(--gap);
    background-color: var(--color-youtube);
}

#facebook {
    margin-bottom: var(--gap);
    background-color: var(--color-facebook);
}

#bluesky {
    margin-bottom: var(--gap);
    background-color: var(--color-bluesky);
}