@font-face {
    font-family: 'TeletextMosaic';
    src: url('files/MODE7GX3.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
}


.teletext,
.red,
.green,
.blue,
.magenta,
.white {
    font-family: 'TeletextMosaic', monospace;
    /* If you like, set a mosaic-friendly size, e.g.: */
    font-size: 16px;
    line-height: 16px;
}

/* Basic page reset and overall styling */
html,
body {
    margin: 0;
    padding: 0;
    background-color: #000;
    /* Teletext black background */
    color: #fff;
    font-family: 'TeletextMosaic', monospace;
    font-size: 16px;
}

/* Utility classes for teletext colors */
.black {
    color: #000;
}

.red {
    color: #f00;
}

.green {
    color: #0f0;
}

.yellow {
    color: #ff0;
}

.blue {
    color: #00f;
}

.magenta {
    color: #f0f;
}

.cyan {
    color: #0ff;
}

.white {
    color: #fff;
}

/* Top bar styling */
.top-bar {
    padding: 8px;
    background-color: #000;
    white-space: nowrap;
    text-align: center;
    padding: 100px 1px 15px 15px;
    font-family: 'TeletextMosaic', monospace;
    font-size: 16px;
}

/* Title line / headline bar styling */
.headline-bar {
    font-family: 'TeletextMosaic', monospace;
    font-size: 16px;
    /* Adjust as needed */
    line-height: 14px;
    padding: 8px;
    background-color: #000;
    white-space: nowrap;
    text-align: center;
}

/* Large logo text that uses the Teletext TTF */
.logo {
    font-family: 'TeletextMosaic', monospace;
    font-size: 48px;
    /* Adjust as needed */
    line-height: 14px;
    /* Keep lines tight for mosaic effect */
    color: #f0f;
    /* Magenta, as in the sample “GALAX” */
    text-align: center;
    padding: 60px;
    margin: 20px 0;
}

/* Main content area */
.content {
    font-family: 'TeletextMosaic', monospace;
    font-size: 16px;
    /* Adjust as needed */
    line-height: 24px;
    padding: 0px 15px 15px 25px;
    text-align: center;
}

/* Bottom navigation/footer bar */
.footer {
    font-family: 'TeletextMosaic', monospace;
    font-size: 16px;
    padding: 8px;
    background-color: #000;
    text-align: center;
    padding: 30px;
}