/************************************
* Insight Slider
************************************/
.ifs-insight-slider {
    --slider-gap:16px;
    --slider-w:29vw;
}

/* avoid cls slider */
.ifs-insight-slider__items {
    /* 25px is height of tags, margin bottom of tag is 12, 96px estimate for content. */
    min-height:calc(((var(--slider-w) - var(--slider-gap)) * (455 / 676)) + var(--ifs-spacing-24) + 25px + 12px + 96px);
}

/* slider */
.ifs-insight-item {
    width:calc(var(--slider-gap) + var(--slider-w));
    padding-left:var(--slider-gap);
}
.ifs-insight-slider:not(.slider-loop) .ifs-insight-item:first-child {
    width:calc(var(--slider-w) + var(--ifs-gap-side));
    padding-left:var(--ifs-gap-side);
}
.ifs-insight-slider:not(.slider-loop) .ifs-insight-item:last-child:not(:first-child) {
    width:calc(var(--slider-w) + var(--slider-gap) + var(--ifs-gap-side));
    padding-right:var(--ifs-gap-side);
}

/* slider has less items (<4) */
@media only screen and (min-width:921px) {
    .ifs-insight-slider.has-less-items {
        --slider-w:calc((var(--ifs-container) - 2 * var(--slider-gap)) / 3);
    }
}
@media only screen and (max-width:920px) and (min-width:769px) {
    /* has 1 item */
    .ifs-insight-slider.has-single-item {
        --slider-w:calc((var(--ifs-container) - var(--slider-gap)) / 1.5);
    }

    /* has 2 items */
    .ifs-insight-slider.has-2-items {
        --slider-w:calc((var(--ifs-container) - var(--slider-gap)) / 2);
    }
}
@media only screen and (min-width:769px) {
    .ifs-insight-slider.has-less-items.slider-loop .ifs-insight-item:first-child {
        width:calc(var(--slider-w) + var(--ifs-gap-side));
        padding-left:var(--ifs-gap-side);
    }
    .ifs-insight-slider.has-less-items.slider-loop.ifs-insight-item:last-child:not(:first-child) {
        width:calc(var(--slider-w) + var(--slider-gap) + var(--ifs-gap-side));
        padding-right:var(--ifs-gap-side);
    }
}
@media only screen and (max-width:480px) {
    .ifs-insight-slider.has-single-item {--slider-w:var(--ifs-container)}
}


/********************************************
* Insight Slider Responsive
********************************************/
@media only screen and (min-width:1560px) {
    .ifs-insight-slider {--slider-w:27.5vw;}
}
@media only screen and (max-width:920px) {
    .ifs-insight-slider {--slider-w:42.5vw;}
}
@media only screen and (max-width:768px) {
    .ifs-insight-slider {--slider-w:60vw;}
}
@media only screen and (max-width:480px) {
    .ifs-insight-slider {--slider-w:calc(var(--ifs-container) - var(--ifs-gap-container));}
}