/* CSS for desktop (screens wider than 768px) */
.item-container[data-mobile-hide="true"] {
  display: block; /* Display elements with data-mobile-hide="true" on desktop */
}


/* CSS for mobile (screens 768px or narrower) */
@media (max-width: 768px) {
  .item-container[data-mobile-hide="true"] {
    display: none; /* Hide elements with data-mobile-hide="true" on mobile */
  }
}

.print img {
    max-width: 80%; /* Set the maximum width you desire */
    max-height: auto; /* Set the maximum height you desire */
}
.depoimentos {
    display: flex;
    justify-content: space-between;
}

.testimonial-item {
    flex: 1;
    text-align: center;
    
    border-radius: 10px; /* Add rounded corners for a modern look */
    margin: 5px;
    padding: 10px; /* Add padding to create space inside the container */
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2); /* Add a shadow effect */
}

.testimonial-item img {
    max-width: 90%; /* Ensure the image doesn't exceed its container's width */
    border-radius: 10px; /* Add rounded corners to the image */
}


@media (max-width: 768px) {
    .depoimentos {
        flex-direction: column; /* Stack items on top of each other on mobile */
    }
}
.custom-video-container {
    position: relative;
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
}

.overlay-content {
    text-align: center;
    color: white;
}

.speaker-icon {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.speaker-icon img {
    width: 100px;
    height: 100px;
}

.video-overlay p {
    font-size: 18px;
}

.video-overlay p, .speaker-icon {
    margin: 0;
}


video {
    width: 480px;
    height: auto;
    display: block;
    box-shadow:
    0px 4px 6px rgba(255, 255, 255, 1), /* Top shadow */
    0px -4px 6px rgba(255, 255, 255, 0.5), /* Bottom shadow */
    -4px 0px 6px rgba(255, 255, 255, 0.5), /* Left shadow */
    4px 0px 6px rgba(255, 255, 255, 1); /* Right shadow */
}
/* Media query for mobile devices */
@media (max-width: 768px) {
    video {
        width: 95%;
        height: auto;
        max-height: 100%;
        margin: 0 auto;
        display: block;
    }
}
