/* Default view - if the product list panel gets smaller than 1000px hide the image */
@element '#productListPanel' and (max-width: 1000px) {
    #productListPanel .sr_img,
    #productListPanel .th_img {
        display: none;
    }

    #result-default td.sr_mat_no,
    #result-default td.sr_man_mat_no,
    #result-default td.sr_desc,
    #result-default td.sr_avail,
    #result-default td.sr_hek,
    #result-default td.sr_evp {
        padding-top: 8px
    }

}

/* Default view - if the product list panel gets smaller than 950px hide the ALSO material number */
@element '#productListPanel' and (max-width: 950px) {
    #productListPanel .sr_mat_no,
    #productListPanel .th_mat_no {
        display: none;
    }
}

/* Default view - the product list panel gets smaller than 900px hide the retail price */
@element '#productListPanel' and (max-width: 900px) {
    #productListPanel .sr_evp,
    #productListPanel .th_evp {
        display: none;
    }
}

/* Detailed view - if the containter gets smaller than 1000px change the absolute size of the image to relative */
@element '#result-template-a-list' and (max-width: 1000px) {
    #result-template-a-list .srp-img {
        width: 99%;
    }
}

/* Detailed view - if the containter gets smaller than 700px hide the whole left panel (the image, the promotion information and the debug information) */
@element '#result-template-a-list' and (max-width: 700px) {
    #result-template-a-list .left-column {
        display: none;
    }
}

/* Dashboard MCP 6/4/3 */

/* show 4 */
@element '#mcp[data-gs-width="3"]' and (max-width: 1400px) {
    #mcp .js-gallery-box:nth-of-type(n+5)  {
        display:none;
    }

    #mcp .js-gallery-box {
        width: 25%;
    }
}
/* show 3 */
@element '#mcp[data-gs-width="3"]' and (max-width: 1000px) {
    #mcp .js-gallery-box:nth-of-type(n+4) {
        display:none;
    }

    #mcp .js-gallery-box {
        width: 33.33333333333333333333333%;
    }
}
/* show 2 */
@element '#mcp[data-gs-width="3"]' and (max-width: 800px) {
    #mcp .js-gallery-box:nth-of-type(n+3) {
        display:none;
    }

    #mcp .js-gallery-box {
        width: 50%;
    }
}


/* Dashboard MCP 4/3/2 */
/* show 3 */
@element '#mcp[data-gs-width="2"]' and (max-width: 950px) {
    #mcp .js-gallery-box:nth-of-type(n+3) {
        display:none;
    }

    #mcp .js-gallery-box {
        width: 33.33333333333333333333333%;
    }
}
/* show 2 */
@element '#mcp[data-gs-width="3"]' and (max-width: 700px) {
    #mcp .js-gallery-box:nth-of-type(n+2) {
        display:none;
    }

    #mcp .js-gallery-box {
        width: 50%;
    }
}