.grid-to-slider {
    padding: 4vh 0;
    overflow-x: hidden;
    .tns-liveregion,
    .tns-nav { display: none; }
    .tns-outer {
        width: 100%;
        position: relative;
        .tns-ovh { overflow: hidden; }
    }

    .tns-controls {
        position: absolute;
        top: 50%;
        left: 50%;
        display: flex;
        @extend %flexCenterBetween;
        @include size(100vw,50px);
        pointer-events: none;
        transform: translate(-50vw,-50%);
        z-index: 10;
        button {
            display: block;
            position: relative;
            background: transparent;
            @include size(50px,50px);
            border: 0;
            pointer-events: all;
            text-indent: -9999em;
            margin: 0;
            @extend %arrowClose;
            &:before,
            &:after {
                @include size(25px,6px);
                background: $red;
                border-radius: 6px;
            }
            &[data-controls="prev"] {
                transform-origin: left center;
                &:before { transform: translate(-50%,-50%) rotate(-45deg); margin-top: -7px; }
                &:after { transform: translate(-50%,-50%) rotate(45deg); margin-top: 7px; }
            }
            &[data-controls="next"] {
                transform-origin: right center;
                &:before { transform: translate(-50%,-50%) rotate(-45deg); margin-top: 7px; }
                &:after { transform: translate(-50%,-50%) rotate(45deg); margin-top: -7px; }
            }
        }
    }

    .becomeslider {
        display: flex;
        flex-wrap: nowrap;
        width: 100%;
    }
    .gts {
        &__item {
            display: flex;
            flex-wrap: wrap;
            width: calc(100%/4);
            &-img,
            &-title,
            &-text {
                width: 100%;
            }
            &-title {
                font-size: 1.3em;
                min-height: 80px;
                margin-bottom: 20px;
            }
            &-img img { width: 100%; }
            @media (max-width: 1200px) {
                width: calc(100% / 3);
            }
            @media (max-width: 1023px) {
                width: calc(100% / 2);
            }
            @media (max-width: 767px) {
                width: 100%;
            }
        }
    }
}