@media only screen and (min-width: 320px) {
    /*Post scroller*/
    .post-scroller{
        display:flex;
        flex-direction: column;
        gap:20px;
        align-items: center;
        justify-content: center;
    }
    .post-scroller .swiper-pagination{
        width:100%;
        text-align:center;
        margin-top:0px;
        position:relative;
        bottom:auto;
        left:auto;
        top:auto;
        margin:0px;
    }
    .post-scroller .gb-grid-wrapper{
        flex-wrap: nowrap;
        margin:0px;
    }
    .post-scroller .swiper-wrapper > .gb-grid-column{
        padding:0;
        flex-shrink: 0;
        width: 100%;
        height: 100%;
        position: relative;
        transition-property: transform;
        display: block;
    }
    
    /* Post Scroller Hint */
    .post-scroller-hint {
        z-index:10;
        position: absolute;
        padding-top:4px;
        width:100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        opacity: 0;
        transform: translateY(10px);
        transition: opacity 0.4s ease, transform 0.4s ease;
        pointer-events: none;
        color:#000000;
    }
    .scroller-with-images .post-scroller-hint{
        background:white;
        padding:10px;
        max-width:100px;
        margin:0 auto;
    }
    /* Swipe Icon */
    .post-scroller-hint .hint-icon {
        width: 20px;
        height: 20px;
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='430' height='430' fill='none' viewBox='0 0 430 430'%3E%3Cg stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='12'%3E%3Cpath stroke='black' d='M368.199 241.8c-3.2 11.9-7.8 29.3-12.8 47.9-9.1 34.1-25.5 54-25.5 54l-11 41.1-76.3-20.4-43.2-11.6 11-41.1a105.8 105.8 0 0 1-27-70.2l-.2-54.1c0-6.6 5.1-12 11.7-12.4 17.5-1 32.4 12.7 32.9 30.2l.6 20 9.5-35.5'/%3E%3Cpath stroke='black' d='m233.5 205.8 31.2-116.4C267 80.6 277 75.7 285.8 78c9.8 2.6 14.7 12.5 12.1 22.3l-30.7 114.5m33.601 9 14.1-52.8c2.3-8.8 11.3-14 20.1-11.6 9.8 2.6 15.7 12.7 13 22.6l-13.6 50.9m.099 0 7-26.2c2.5-9.3 11.3-12 20.6-9.5s14.8 12 12.3 21.3l-6.3 23.3'/%3E%3Cpath stroke='black' d='m267.199 214.8 36.8-137.5c2.5-9.3 12-14.8 21.3-12.3s14.8 12 12.3 21.3l-36.8 137.5'/%3E%3Cpath stroke='black' d='M69 74.8c83.3-16.7 149.9 0 149.9 0'/%3E%3Cpath stroke='black' d='m206.001 55.1 13 19.7-19.7 12.9'/%3E%3C/g%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        flex-shrink: 0;
    }
    
    /* Hint Text */
    .post-scroller-hint .hint-text {
        font-size: 11px;
        color: black;
        font-weight: 500;
    }
    
    /* fadeUp - Visible state */
    .post-scroller-hint.visible {
        opacity: 1;
        transform: translateY(0);
    }
    
    /* fadeDown - Hidden state */
    .post-scroller-hint.hidden {
        opacity: 0;
        transform: translateY(-10px);
    }
    /*Typography*/
    .post-scroller-title{
        font-size:18px;
        margin-top:15px;
        font-weight:bold;
    }
    .post-scroller-date{
        font-size:14px;
    }
    .post-scroller-excerpt{
        font-size:13px;
        margin-top:10px;
    }
}
@media only screen and (min-width: 768px) {
    /*Post scroller*/
    .scroller-container{
        overflow:hidden;
    }
    .post-scroller{
        overflow:visible;
    }
    .post-scroller-hint {
        justify-content: center;
    }
    /* Hint - Larger on desktop */
    .post-scroller-hint .hint-icon {
        width: 40px;
        height: 40px;
    }
    
    .post-scroller-hint .hint-text {
        font-size: 16px;
    }
    /*Admin side stuff*/
    .editor-styles-wrapper .post-scroller .gb-grid-column{
        width:25%;
        padding:0;
    }
}

@media only screen and (min-width: 1024px) {
    .post-scroller-hint {
        display:none;
    }
}