/* SLIDER 1 */
.container-slider-1{
    position: relative;
    overflow: hidden;
    width: 100%;
}

.slider-1{
    display: flex;
    width: 300%;
    margin-left: -100%;
}

.slider-section-1{
    width: 100%;
}

.slider-img-1{
    display: block;
    width: 100%;
    object-fit: cover;
}

.slider-btn-1{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}

.slider-btn-left-1{
    left: 10px;
}

.slider-btn-right-1{
    right: 10px;
}

/* END SLIDER 1 */

/* SLIDER 2 */
.container-slider-2{
    position: relative;
    overflow: hidden;
    width: 100%;
}

.slider-2{
    display: flex;
    width: 300%;
    margin-left: -100%;
}

.slider-section-2{
    width: 100%;
}

.slider-img-2{
    display: block;
    width: 100%;
    object-fit: cover;
}

.slider-btn-2{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}

.slider-btn-left-2{
    left: 10px;
}

.slider-btn-right-2{
    right: 10px;
}

/* END SLIDER 2 */

/* SLIDER 3 */
.container-slider-3{
    position: relative;
    /* overflow: hidden; */
    width: 100%;
}

.slider-3{
    display: flex;
    width: 300%;
    margin-left: -100%;
}

.slider-section-3{
    width: 100%;
}

.slider-img-3{
    display: block;
    width: 100%;
    object-fit: cover;
}

.slider-btn-3{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}

.slider-btn-left-3{
    left: 10px;
}

.slider-btn-right-3{
    right: 10px;
}

/* END SLIDER 3 */

/* SLIDER 4 */
.container-slider-4{
    position: relative;
    /* overflow: hidden; */
    width: 100%;
}

.slider-4{
    display: flex;
    width: 300%;
    margin-left: -100%;
}

.slider-section-4{
    width: 100%;
}

.slider-img-4{
    display: block;
    width: 100%;
    object-fit: cover;
}

.slider-btn-4{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}

.slider-btn-left-4{
    left: 10px;
}

.slider-btn-right-4{
    right: 10px;
}

/* END SLIDER 4 */

/* RESPONSIVE PODCAST */

.window-podcast{
    max-width: 100%;
}

@media (min-width: 1024px) {
    .window-podcast {
        max-width: 70%;
    }
}

.podcast{
    width: 17rem;
}

@media (min-width: 640px) {
    .podcast{
        width: 20rem;
    }
}

@media (min-width: 1024px) {
    .podcast {
        width: 28%;
    }
}

/* END RESPONSIVE PODCAST */

/* RESPONSIVE SELF ESTEEM */

.window-self-esteem{
    max-width: 100%;
}

@media (min-width: 1024px) {
    .window-self-esteem {
        max-width: 70%;
    }
}

.self-esteem{
    width: 17rem;
}

@media (min-width: 640px) {
    .self-esteem{
        width: 20rem;
    }
}

@media (min-width: 1024px) {
    .self-esteem {
        width: 28%;
    }
}

/* END RESPONSIVE SELF ESTEEM */

/* RESPONSIVE GYM */

.window-gym{
    max-width: 100%;
}

@media (min-width: 1024px) {
    .window-gym{
        max-width: 70%;
    }
}

.gym{
    width: 17rem;
}

@media (min-width: 640px) {
    .gym{
        width: 20rem;
    }
}

@media (min-width: 1024px) {
    .gym{
        width: 28%;
    }
}

/* END RESPONSIVE GYM */

/* RESPONSIVE RECIPES */

.window-recipe{
    max-width: 100%;
}

@media (min-width: 1024px) {
    .window-recipe{
        max-width: 70%;
    }
}

.recipes{
    width: 17rem;
}

@media (min-width: 640px) {
    .recipes{
        width: 20rem;
    }
}

@media (min-width: 1024px) {
    .recipes{
        width: 28%;
    }
}

/* END RESPONSIVE RECIPES */

.text-rosa-600 {
    --tw-text-opacity: 1;
    color: rgba(249, 163, 146, var(--tw-text-opacity));
}

.bg-rosa-600 {
    --tw-bg-opacity: 1;
    background-color: rgba(249, 163, 146, var(--tw-bg-opacity));
}

.border-rosa-600 {
    --tw-border-opacity: 1;
    border-color: rgba(249, 163, 146, var(--tw-border-opacity));
}

.focus\:border-rosa-600:focus {
    --tw-border-opacity: 1;
    border-color: rgba(249, 163, 146, var(--tw-border-opacity));
}

/* Works on Firefox */
.scroll-rosa {
    scrollbar-width: thin;
    scrollbar-color: rgba(249, 163, 146, 1);
  }


/* Works on Chrome, Edge, and Safari */
.scroll-rosa::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

.scroll-rosa::-webkit-scrollbar-thumb {
    background-color: rgba(249, 163, 146, 1);
    border-radius: 20px;
}