﻿.media-block-slider-full-width {
    position: relative;
}

    .media-block-slider-full-width .slider-controls > div[aria-disabled=true] {
        opacity: 0.25;
    }

.theme--2 .media-block-slider-full-width .slider-controls > div {
    background: var(--colour-neutral);
    color: var(--colour-one);
}

.media-block-slider-full-width .text-content {
    padding-bottom: var(--section-spacing);
}

.media-block-slider-full-width__nav {
    display: -webkit-flex;
    display: flex;
    gap: 20px;
    margin-top: -5px;
    position: relative;
    z-index: 5;
}

.media-block-slider-full-width__nav__item {
    width: 50px;
    height: 5px;
    opacity: 0.5;
    cursor: pointer;
    background: var(--colour-one);
}

.theme--2 .media-block-slider-full-width__nav__item, .theme--4 .media-block-slider-full-width__nav__item, .theme--5 .media-block-slider-full-width__nav__item {
    background: var(--colour-neutral);
}

.media-block-slider-full-width__nav__item.tns-nav-active {
    opacity: 1;
}

.media-block-slider-full-width__nav__item:hover, .media-block-slider-full-width__nav__item:focus {
    opacity: 1;
}

.media-block-slider-full-width .blurb-media__inner__image picture img {
    -o-object-fit: fill;
    object-fit: fill;
}

@media (max-width: 767px) {
    .media-block-slider-full-width .text-content {
        padding-bottom: calc(var(--section-spacing) * 2);
    }

    .media-block-slider-full-width .slider-controls {
        position: absolute;
        right: 20px;
        bottom: var(--section-spacing);
        display: -webkit-flex;
        display: flex;
        gap: 10px;
        z-index: 5;
    }

    .media-block-slider-full-width__nav {
        bottom: var(--section-spacing);
        left: 20px;
    }

    .media-block-slider-full-width .blurb-media__inner__content {
        padding-left: 30px;
        padding-right: 30px;
    }
}

@media (min-width: 768px) {
    .media-block-slider-full-width {
        --button-offset: 15px;
        --slider-control-button-width: 45px;
    }

    .media-block-slider-full-width__inner {
        position: relative;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    .media-block-slider-full-width .tns-slider {
        display: -webkit-flex;
        display: flex;
    }

        .media-block-slider-full-width .tns-slider .blurb-media {
            display: -webkit-flex;
            display: flex;
        }

        .media-block-slider-full-width .tns-slider .blurb-media__inner {
            -webkit-flex: 1;
            flex: 1;
        }

    .media-block-slider-full-width .blurb-media__inner__image {
        padding-right: 0;
    }

    .media-block-slider-full-width .blurb-media__inner__content {
        padding-left: 30px;
    }

    .media-block-slider-full-width .text-content {
        padding-right: calc(var(--slider-control-button-width) + var(--button-offset) + var(--spacing));
        padding-top: var(--section-spacing);
        padding-bottom: calc(var(--section-spacing) * 2);
    }

    .media-block-slider-full-width .slider-controls > div {
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        z-index: 5;
    }

        .media-block-slider-full-width .slider-controls > div:first-child {
            left: var(--button-offset);
        }

        .media-block-slider-full-width .slider-controls > div:last-child {
            right: var(--button-offset);
        }

    .media-block-slider-full-width__nav {
        padding-right: calc(var(--slider-control-button-width) + var(--spacing) + var(--button-offset));
        padding-left: calc(50% + 30px);
        top: calc(var(--section-spacing) * -1);
    }

    .media-block-slider-full-width--image-right .media-block-slider-full-width__nav {
        padding-right: calc(50% + 30px);
        padding-left: calc(var(--slider-control-button-width) + var(--spacing) + var(--button-offset));
    }

    .media-block-slider-full-width--image-right .text-content {
        padding-right: 0;
        padding-left: calc(var(--slider-control-button-width) + var(--button-offset) + var(--spacing));
    }

    .media-block-slider-full-width--image-right .blurb-media__inner__image {
        padding-right: 15px;
        padding-left: 0;
    }

    .media-block-slider-full-width--image-right .blurb-media__inner__content {
        padding-left: 15px;
        padding-right: 30px;
    }
}

@media (min-width: 1200px) {
    .media-block-slider-full-width {
        --button-offset: 32.5px;
        --slider-control-button-width: 65px;
    }

    .media-block-slider-full-width__nav {
        padding-left: calc(50% + (var(--gutter-width) * 2));
    }

    .media-block-slider-full-width .blurb-media__inner__image {
        padding-right: 0px !important;
    }

    .media-block-slider-full-width--image-right .media-block-slider-full-width__nav {
        padding-right: calc(50% + (var(--gutter-width) * 2));
        padding-left: calc(var(--slider-control-button-width) + var(--spacing) + var(--button-offset));
    }

    .media-block-slider-full-width--image-right .blurb-media__inner__image {
        padding-right: 15px !important;
        padding-left: 0 !important;
    }
}

@media (min-width: 1500px) {
    .media-block-slider-full-width .slider-controls {
        position: absolute;
        width: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: var(--slider-control-button-width);
        margin: auto;
        padding-left: 15px;
        padding-right: 15px;
    }

        .media-block-slider-full-width .slider-controls > div:first-child {
            left: 15px;
        }

        .media-block-slider-full-width .slider-controls > div:last-child {
            right: 15px;
        }

    .media-block-slider-full-width .text-content {
        padding-right: calc(var(--slider-control-button-width) + var(--spacing));
    }

    .media-block-slider-full-width .blurb-media__inner__content {
        max-width: calc(var(--container-width) / 2);
    }

    .media-block-slider-full-width__nav {
        width: var(--container-width);
        margin-left: auto;
        margin-right: auto;
        padding-right: calc(15px + var(--slider-control-button-width) + var(--spacing));
        padding-left: calc((var(--container-width) / 2) + (var(--gutter-width) * 2));
    }

    .media-block-slider-full-width--image-right .text-content {
        padding-right: 0;
        padding-left: calc(var(--slider-control-button-width) + var(--spacing));
    }

    .media-block-slider-full-width--image-right .media-block-slider-full-width__nav {
        width: var(--container-width);
        margin-left: auto;
        margin-right: auto;
        padding-right: calc((var(--container-width) / 2) + (var(--gutter-width) * 2));
        padding-left: calc(15px + var(--slider-control-button-width) + var(--spacing));
    }
}
