@font-face {
    font-family: 'SahelBlack';
    src: url('font/Sahel-Black.eot');
    src: url('font/Sahel-Black.eot?#iefix') format('embedded-opentype'),
        url('font/Sahel-Black.woff2') format('woff2'),
        url('font/Sahel-Black.woff') format('woff'),
        url('font/Sahel-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

*,
*:after,
*:before {
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
    font: normal 70vh/normal 'SahelBlack';
    background-color: red;
}
.button-wrapper{position: fixed;top: 0;right: 0; display: flex; height: 46px; z-index: 1;gap: 16px; padding: 8px 12px;}
.button-wrapper button{width: 32px; height: 32px; background-color: unset; border: none; cursor: pointer;padding: 0;}
.button-wrapper button svg{width: 100%;}
.button-wrapper button.plus{}
.button-wrapper button.minus{}
.button-wrapper button.fullscreen{margin-right: 32px;}
.button-wrapper button.fullscreen.enable{}

.button-wrapper button.fullscreen span.full-screen{display: block;}
.button-wrapper button.fullscreen.enable span.full-screen{display: none;}

.button-wrapper button.fullscreen span.normal-screen{display: none;}
.button-wrapper button.fullscreen.enable span.normal-screen{display: block;}

p{ margin: 0; }

main{ display: flex; width: 100%; height: 100%; overflow: hidden;}
.ticker{ display: flex; }
.ticker .ticker-content{ display: flex; align-items: center; }
.ticker .ticker-content p{ display: flex; margin: 0 300px; white-space: nowrap; color: #fff; }

/* .ticker {
    overflow: hidden;
    white-space: nowrap;
}

.ticker-content {
    display: inline-block;
    animation: ticker 3s linear infinite;
}

@keyframes ticker {
    from {
        transform: translateX(-100%);
    }

    to {
        transform: translateX(100%);
    }
} */