/*******************************************************************

    Module        : /Styles/monitor.css
    Desc.         : CSS Custom for Monitor
    Created By    : Siau Pheng (siaupheng@3fonia.com).
    Created Date  : December 20th, 2007.
    Last Modified : October 20th, 2026.

    (c) 3FONIA Software; WWW.3FONIA.COM.

*******************************************************************/

.monitor .disp-atas {
    height: 120px;
}

.monitor .disp-tengah {
    padding-top: 120px;
    height: 100%;
    max-height: calc(100vh - 180px);
}

.monitor .disp-bawah {
    height: 180px;
}

/****** TOP BANNER ******/

.monitor .marquee-container {
    width: 100%;
    height: 100%;
}

.monitor .marquee-content {
    white-space: nowrap;
    animation: marquee 20s linear infinite;
}

@keyframes marquee {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

.monitor .marquee-container:hover .marquee-content {
    animation-play-state: paused;
}

/****** MIDDLE IKLAN ******/

.monitor #divIklan {
    z-index: 20;
}
.monitor #divIklan img {
    max-height: calc(100vh - 300px);
}

/****** MIDDLE THANK YOU ******/

.monitor #divThank {
    width: 100%;
    height: calc(100vh - 300px);
    position: absolute;
    top: 120px;
    z-index: 50;
}
.monitor #divBlur {
    width: 100%;
    height: calc(100vh - 300px);
    position: absolute;
    top: 120px;
    z-index: 30;
}

/****** BOTTOM PROMO ******/

.monitor #divPromo img {
    max-height: 160px;
}