Avada Columns

stupidity.css

/* Responsive grid for portfolio layout */
.fusion-portfolio-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 columns on large screens */
    gap: 20px;
    justify-content: center;
    align-items: start;
}

/* Responsive adjustments for tablets (768px and up) */
@media (max-width: 1024px) {
    .fusion-portfolio-wrapper {
        grid-template-columns: repeat(2, 1fr); /* 2 columns on tablets */
    }
}

/* Responsive adjustments for mobile (below 768px) */
@media (max-width: 767px) {
    .fusion-portfolio-wrapper {
        grid-template-columns: 1fr; /* 1 column on phones */
    }
}

/* Ensure each portfolio post takes full column width */
.fusion-portfolio-post {
    width: 100% !important;
    position: static !important; /* Reset Avada's absolute positioning */
    height: auto !important; /* Allow posts to resize dynamically */
}

/* Ensure video wrapper maintains a 16:9 aspect ratio */
.fusion-image-wrapper.fusion-video {
    width: 100%;
    position: relative;
}

.fluid-width-video-wrapper {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 aspect ratio */
}

.fluid-width-video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Ensure content wrapper fills available space */
.fusion-portfolio-content-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

/* Adjust title and content alignment */
.fusion-portfolio-content {
    text-align: left;
}