/* Mobile only (all pages using the shared footer): the original social bar slides in from a grey side tab.
   Desktop keeps the bar as it always was. */
.StickySocialTab {
    display: none;
}

@media (max-width: 767px) {
    .StickySocial.is-tab {
        -moz-transform: translate(-100%, -50%);
        -ms-transform: translate(-100%, -50%);
        transform: translate(-100%, -50%);
        transition: transform .2s ease;
    }

    .StickySocial.is-tab.is-open {
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    /* Keep hidden icons out of the tab order while the bar is closed. */
    .StickySocial.is-tab:not(.is-open) ul {
        visibility: hidden;
        transition: visibility 0s .2s;
    }

    /* 24px-wide touch area; the visible grey rectangle is the 12px ::after. */
    .StickySocial.is-tab .StickySocialTab {
        display: block;
        position: absolute;
        top: 50%;
        left: 100%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 24px;
        height: 56px;
        padding: 0;
        border: 0;
        background: transparent;
    }

    .StickySocial.is-tab .StickySocialTab::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 12px;
        height: 56px;
        background-color: #6b6b6b;
        border-radius: 0 6px 6px 0;
    }
}
