/* *********************************
	Promo as listed song (charts et al)
***********************************/
    .promoAsSong {background: rgb(40, 47, 51) !important;}
    .promoAsSong:hover {background: rgba(50,61,67,1.00) !important;}
 
 
 /* *********************************
	Promo Charts Top
***********************************/
    #charts_promoTop_wrapper {
        width: 100%;
        margin: 40px 0 15px 0;
    }
    
    /* media */
    @media (max-width:1400px) {
        #charts_promoTop_wrapper { margin: 23px 0 15px 0; }
    }
    @media (max-width:600px) {
        #charts_promoTop_wrapper { margin: 25px 0 15px 0; }
    }
    
    #charts_promoTop_wrapper:after {
        content: "";
        display: table;
        clear: both;
    }
    #charts_promoTop_container {
        max-width: 1500px;
        margin: 0 auto; 
        padding: 20px 0 5px 0;
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto; overflow-y: hidden;
        -webkit-overflow-scrolling: touch; /* to ensure smooth momentum scrolling on ios */
    }
    #charts_promoTop_container::-webkit-scrollbar {
        display: none;
    }
    #charts_promoTop_list {
        width: 100%;
        display: flex; 
    }
    
    /* each promo box  */
    .promoBoxSongs {
        width: 25%;
        position: relative; 
    }
    .promobox_tag {
        position: absolute; z-index: 1;
        top: 5px; left: 5px; 
        padding: 2px;
        text-align: center;
        background: rgba(0,0,0,0.5); color: rgba(255,255,255);
        border-radius: 4px;
        font-size: 12.5px;
        opacity: 0.5;
    }
    .promobox_picture {
        /*height: 170px; */
        height: 14vW; max-height: 200px; min-height: 150px;
        width: 100%;
        background: center center no-repeat; background-size: cover;
        opacity: 0.9; transition: 0.15s;
        cursor: pointer;
    }
    .promobox_songname {
        padding: 4px 0 3px 0;
        width: 70%; margin: auto;
        color: rgb(240,240,240);
        text-align: center;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
        transition: 0.15s;
    }
    .promobox_artist {
        padding: 0 5px;
        text-align: center;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .promobox_artist a {
        color: rgb(150,150,150);
        font-size: 14.5px; font-weight: 500;
        transition: 0.2s;
    }
    
    /* hover */
    .promoBoxSongs:hover .promobox_picture {
        opacity: 1;
    }
    .promoBoxSongs:hover .promobox_songname {
        color: rgb(250,250,250);
    }
    .promoBoxSongs:hover .promobox_artist a {
        color: rgb(220,220,220);
    }
    
    /* media */
    @media (max-width:600px) {
        .promoBoxSongs { min-width: 50%; }
        .promobox_songname { padding: 3px 0 0 0; }
    }