/* ======================================== */
/* === MEDIA === */
/* ======================================== */

/* === FEATURED ARTICLE === */
[data-id="z-01"] {
    background: url("/media/catalog/z-01.jpg") no-repeat center 30%;
    background-size: cover;
}
[data-id="z-02"] {
    background: url("/media/catalog/z-02.jpg") no-repeat center 30%;
    background-size: cover;
}
[data-id="z-03"] {
    background: url("/media/catalog/z-03.jpg") no-repeat center 30%;
    background-size: cover;
}
[data-id="z-04"] {
    background: url("/media/catalog/z-04.jpg") no-repeat center 30%;
    background-size: cover;
}
[data-id="z-05"] {
    background: url("/media/catalog/z-05.jpg") no-repeat center 75%;
    background-size: cover;
}
[data-id="z-06"] {
    background: url("/media/catalog/z-06.jpg") no-repeat center top;
    background-size: cover;
}

/* === AUDIO PLAYER === */
[data-id="audio-display"] {
    background: url("/media/catalog/audio-display.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-01"] {
    background: url("/media/catalog/audio-01.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-02"] {
    background: url("/media/catalog/audio-02.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-03"] {
    background: url("/media/catalog/audio-03.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-04"] {
    background: url("/media/catalog/audio-04.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-05"] {
    background: url("/media/catalog/audio-05.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-06"] {
    background: url("/media/catalog/audio-06.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-07"] {
    background: url("/media/catalog/audio-07.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-08"] {
    background: url("/media/catalog/audio-08.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-09"] {
    background: url("/media/catalog/audio-09.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-10"] {
    background: url("/media/catalog/audio-10.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-11"] {
    background: url("/media/catalog/audio-11.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-12"] {
    background: url("/media/catalog/audio-12.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-13"] {
    background: url("/media/catalog/audio-13.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-14"] {
    background: url("/media/catalog/audio-14.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-15"] {
    background: url("/media/catalog/audio-15.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-16"] {
    background: url("/media/catalog/audio-16.jpg") no-repeat center top;
    background-size: cover;
}
[data-id="audio-17"] {
    background: url("/media/catalog/audio-17.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-18"] {
    background: url("/media/catalog/audio-18.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-19"] {
    background: url("/media/catalog/audio-19.jpg") no-repeat center center;
    background-size: cover;
}
[data-id="audio-20"] {
    background: url("/media/catalog/audio-20.jpg") no-repeat center center;
    background-size: cover;
}


/* ======================================== */
/* === ICONS === */
/* ======================================== */

/* Sidebar Icons (Stage) */
[data-id="icon-moon"] {
    background: url("/assets/icons/icon-moon.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-featured"] {
    background: url("/assets/icons/icon-featured.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-charts"] {
    background: url("/assets/icons/icon-charts.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-connect"] {
    background: url("/assets/icons/icon-connect.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-catalog"] {
    background: url("/assets/icons/icon-catalog.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-volunteer"] {
    background: url("/assets/icons/icon-volunteer.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-subscribe"] {
    background: url("/assets/icons/icon-subscribe.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-shop"] {
    background: url("/assets/icons/icon-shop.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-verified"] {
    background: url("/assets/icons/icon-verified.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-resource"] {
    background: url("/assets/icons/icon-resource.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-settings"] {
    background: url("/assets/icons/icon-settings.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-contact"] {
    background: url("/assets/icons/icon-email.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-arrow-right"] {
    background: url("/assets/icons/icon-arrow-right.png") no-repeat center center;
    background-size: contain;
}

/* Stage (Spotlight) */
[data-id="icon-expand"] {
    background: url("/assets/icons/icon-expand.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-layout"] {
    background: url("/assets/icons/icon-layout.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-cycle"] {
    background: url("/assets/icons/icon-cycle.png") no-repeat center center;
    background-size: contain;
}

/* Stage (Audio) */
[data-id="icon-shuffle"] {
    background: url("/assets/icons/icon-shuffle.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-play"] {
    background: url("/assets/icons/icon-play.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-pause"] {
    background: url("/assets/icons/icon-pause.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-volume"] {
    background: url("/assets/icons/icon-volume.png") no-repeat center center;
    background-size: contain;
}

[data-id="icon-search"] {
    background: url("/assets/icons/icon-search.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-music"] {
    background: url("/assets/icons/icon-music.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-category"] {
    background: url("/assets/icons/icon-category.png") no-repeat center center;
    background-size: contain;
}


/* Sidebar Icons (Bottom) */
[data-id="icon-default"] {
    background: url("/assets/icons/icon-home.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-apply"] {
    background: url("/assets/icons/icon-apply.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-screensaver"] {
    background: url("/assets/icons/icon-screensaver.png") no-repeat center center;
    background-size: contain;
}


/* Article Icons */
[data-id="icon-views"] {
    background: url("/assets/icons/icon-views.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-likes"] {
    background: url("/assets/icons/icon-heart.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-comments"] {
    background: url("/assets/icons/icon-comments.png") no-repeat center center;
    background-size: contain;
}
[data-id="icon-share"] {
    background: url("/assets/icons/icon-share.png") no-repeat center center;
    background-size: contain;
}
