@font-face {
font-family: 'Agrandir-Bold';
src: url('/fonts/agrandir/PPAgrandirText-Bold.woff2') format('woff2'),
url('/fonts/agrandir/PPAgrandirText-Bold.woff') format('woff');
font-weight: normal;
font-style: normal;
font-display: fallback;
}

@font-face {
font-family: 'Agrandir-Regular';
src: url('/fonts/agrandir/PPAgrandir-Regular.woff2') format('woff2'),
url('/fonts/agrandir/PPAgrandir-Regular.woff') format('woff');
font-weight: normal;
font-style: normal;
font-display: fallback;
}


:root{
    --primary-color: #e7dfd8;
    --text-color: #231f20;
    overflow-y: scroll;
}

*{
    font-family: 'Agrandir-Bold', sans-serif;
}

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    height: 100%;
}

.main-reel{
    margin-top: 20px;
    animation: fade 1s;
}

.main-reel h2 {
    font-size: 1.9rem;
    font-weight: normal;
    margin-bottom: 10px;
    font-family: Agrandir-Regular, serif;
}

.self-tape-reel h2 {
    font-size: 1.9rem;
    font-weight: normal;
    margin-bottom: 10px;
    font-family: Agrandir-Regular, serif;
}

@keyframes fade {
    0% {
        opacity: 0;
    }
    100% {
        opacity:1;
    }
}