section#join-facebook-groups-section-carousel-section > ul {
    list-style: none;

    width: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;

    gap: 2.8rem;
}

section#join-facebook-groups-section-carousel-section > ul li {
    background: #FFFFFF;

    min-width: 38rem;
    width: 38rem;
    height: 47rem;

    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;


    border-radius: 1.2rem;
    box-shadow: 0px 2px 6px -4px rgba(0, 11, 67, 0.10);
}

section#join-facebook-groups-section-carousel-section > ul li article {
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;

    padding: 1rem 1rem 4rem;
}

section#join-facebook-groups-section-carousel-section > ul li article figure {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
}

section#join-facebook-groups-section-carousel-section > ul li article figure figcaption {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: row;

    padding: 1.6rem 2.2rem;
}

section#join-facebook-groups-section-carousel-section > ul li article figure figcaption img.fb-logo {
    background: #1254FF;

    width: 4rem;
    height: 4rem;
    padding: 1rem;
    border-radius: 51%;

    display: flex;
    justify-content: center;
    align-items: center;
}

section#join-facebook-groups-section-carousel-section > ul li article figure figcaption > div {
    height: 100%;
    width: 100%;
    padding-left: 1.2rem;

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

section#join-facebook-groups-section-carousel-section > ul li article figure figcaption > div h3 {
    width: 100%;

    font-size: 1.6rem;
    font-style: normal;
    font-weight: 500;
    line-height: 2rem;
}

section#join-facebook-groups-section-carousel-section > ul li article figure figcaption > div p {
    width: 100%;

    font-size: 1.2rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.6rem;

    color: rgba(41, 51, 86, 0.8);
}

section#join-facebook-groups-section-carousel-section > ul li article > div {
    width: 100%;
    flex-grow: 1;

    padding: 1.6rem 2.2rem 0;


    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

section#join-facebook-groups-section-carousel-section > ul li article > div p {
    width: 100%;

    font-size: 1.9rem;
    font-style: normal;
    font-weight: 500;
    line-height: 2.4rem;
    letter-spacing: -.038rem;

    padding-bottom: 2.8rem;

    flex-grow: 1;
}

section#join-facebook-groups-section-carousel-section > ul li article > div a {
    width: 100%;

    display: flex;
    justify-content: center;
    align-items: center;
}

section#join-facebook-groups-section-carousel-section > ul li article > div a button {
    width: 100%;

    padding: 1.5rem 4rem;

    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;

    border-radius: .6rem;
    border: .1rem solid #FFF;
    background: #1254FF;
    box-shadow: 0 .4rem .8rem 0 rgba(0, 0, 0, 0.05);
}


button#join-facebook-groups-section-carousel-section-left-slider-btn.focused,
button#join-facebook-groups-section-carousel-section-right-slider-btn.focused,
section#join-facebook-groups-section-carousel-section > ul li article > div button.focused {
    animation: raise 0.2s ease forwards;
}

@keyframes raise {
    0% {
        transform: translate(0, 0);
        filter: brightness(1);
        box-shadow: 0 .4rem .6rem rgba(0, 0, 0, 0.1);
    }
    100% {
        transform: translateY(-.1rem);
        filter: brightness(1.40);
        box-shadow: 0 .4rem .6rem rgba(0, 0, 0, 0.25);
    }
}

button#join-facebook-groups-section-carousel-section-left-slider-btn.activated,
button#join-facebook-groups-section-carousel-section-right-slider-btn.activated,
section#join-facebook-groups-section-carousel-section > ul li article > div button.activated {
    animation: sink 0.05s ease forwards;
}

@keyframes sink {
    0% {
        transform: translateY(-.1rem);
        filter: brightness(1.40);
        box-shadow: 0 .4rem .6rem rgba(0, 0, 0, 0.25);
    }
    100% {
        transform: translateY(.2rem);
        filter: brightness(.8);
        box-shadow: 0 .4rem .6rem rgba(0, 0, 0, 0.0);
    }
}

section#join-facebook-groups-section-carousel-section > ul li article > div button span {
    text-align: center;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1.6rem;
    letter-spacing: -.015rem;
    color: #FFFFFF
}