@media (max-width: 767px) {
    body openerbtn.carousel-cards-open-trigger {
        flex-direction: column;
        top: 85%;
        transform: translate(0%, 0%);
        right: 25px;
    }
    body openerbtn.carousel-cards-open-trigger.open {
        top: 50%;
        right: 25px;
        transform: translate(0%, 100%);
    } 
    body openerbtn.carousel-cards-open-trigger spanarrow{
        transform: rotate(90deg);
        line-height: 0em;
    }    
    body openerbtn.carousel-cards-open-trigger.open spanarrow{
            transform: rotate(270deg);
    }
    
    carousel-cards {
        transform: translate(0% , 0% );
        overflow-x: scroll;
        flex-direction: row;
        flex-wrap: nowrap;
        flex-direction: row;
        z-index: 500;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        direction: ltr!important;
        bottom: 0em;
        top: auto;
        right: unset;
        max-width: 100vw;
        /* WIDTH IS DYNAMIC BASE ON THE TOTAL RESPONSE CARDS   go.gosezon.com/logic/rest-response-geoids-posts.js */
        width:100%;
        /*display it if it has any RESPONSE CARDS */
         display:none;
    }
carousel-cards.open {
    transform: translate(0%, 0%);
        overflow-x: scroll;
}

carousel-cards.closed{
    transform: translate(0% , 78% );
}
    
    
/* [on devices show the more button always] */
    carousel-cards .scrollingCards-wrapper {
        display: flex;
        flex-direction: row;
        column-gap: 12px;
            width: 100%;
    }
/* [on devices card width 50%] */
    carousel-cards card {
        width: 50vw;
    }
/* [on devices logo ] */
card .author_logo{
    box-shadow: var(--theme-box-shadow-outline);
    border-radius: 50px;
}
        
/* [on devices show each data on 1 line] */
    carousel-cards card .card_data_item {
            width: 100% ;
        }
    
    /* [on devices show the more button always] */
    carousel-cards card .card_head_actions{
        opacity: 1;
        height: 25px;
        display: flex;
        pointer-events: all;
    }
    
    #get_data_button{
        min-width: 70px;
        margin-left: 10px;
        border-radius: 15px;
        margin-top: auto;
        margin-bottom: auto;
        height: 200px;  
    }
    /* ------------------ [STATES] ------------------ */
    /* ------------------ [STATES] ------------------ */

    /* [on full open card] */  
carousel-cards.full_view_mode {
    height: 100vh;
    max-width: 100vw;
    overflow: visible;
}
    carousel-cards.full_view_mode card.open {
        bottom: 0px!important;
        top: auto!important;
        left: unset!important;
        width: 95vw;
    }
carousel-cards.full_view_mode card .highlighted_card{
    background: var(--theme-light-grey);
}

    /* [on devices logo place on open] */
    carousel-cards.full_view_mode card.open .author_logo {
transform: translate(100%, -50%);
    width: 60px;
    height: 60px;
    right: 35%;
    top: -20px;
    }
carousel-cards.full_view_mode card.open .card_data_item {
    width: 50%;
}    
    /* ------------------ [STATES] ------------------ */
    /* ------------------ [STATES] ------------------ */

    carousel-cards::-webkit-scrollbar {
        height: 0px;
    }
    
}