@font-face {
    font-family: 'LeMondeLivre';
    src: url('./LeMondeLivre-Italic.eot');
    src: local('./LeMondeLivre-Italic'),
        url('./LeMondeLivre-Italic.eot?#iefix') format('embedded-opentype'),
        url('./LeMondeLivre-Italic.woff2') format('woff2'),
        url('./LeMondeLivre-Italic.woff') format('woff'),
        url('./LeMondeLivre-Italic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TheMix';
    src: url('./TheMix-6_SemiBold.otf');
    font-weight: 600;
    font-display: swap;
}

.desktop {
    display: none;
}
body {
    position: relative;
    min-height: 100vh;
}

body:after {
    content: " ";
    display: block;
    background-image: url('./footer.svg');
    background-repeat:no-repeat;
    background-size: cover;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100vw;
    height: 120px;
}

* {margin: 0; padding: 0; margin: 0;}
.head, .footer {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80vw;
    padding: 0 10vw;
    margin-bottom: 20px;
}
.head {
    min-height:calc(100vw *.5625);
}
.head:before {
    content: " ";
    display: block;
    background-image: url('./header-mobile.svg');
    background-repeat:no-repeat;
    background-size: cover;
    position: absolute;
    width: 100vw;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;    
}
p {
    font-family:'LeMondeLivre'; 
    font-size: 1.7em; 
    color: #BF8C21;
    background: #FFF;
    z-index: 1;
    display: block;
    padding: 10px;
    text-align: center;
}
iframe {
    width: 100vw;
    height: calc(100vw * .5625);
}

.legenda {
    font-family: 'TheMix';
    text-transform: uppercase;
    font-size: 0.8em;
    color: #000;
    padding: 0;
}

.embed {
    margin-bottom: 60px;
}

.logo {
    position: absolute;
    bottom: 2vh;
    width: 100vw;
    height: fit-content;
    z-index: 1;
}

.logo a {
    width: 50%;
    margin: 0 auto;
    display: block;
    background-color: #FFF;
    padding: 10px;
}
.logo img {
    display: block;
    width: 100%;
    height: auto;
}