/* -Reset- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0; padding: 0; border: 0; outline: 0; background: transparent;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: -wmozebkit-crip-edges;
    -ms-interpolation-mode: nearest-neighbor;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}
body {height: 100vh; background-color: crimson; align-content: center}
#main {height: fit-content; margin: auto 0; font-family: "DM Serif Display", serif; font-weight: 400; font-style: normal; text-align: center; font-size: 6px}

    #title {
        display: block;
        color: #000;
        font-size: 12em
    }
    
    #subtitle {
        display: block;
        color: #fff;
        font-size: 8em;
        padding-bottom: 0.5em
    }
    
    #picture {
        display: block;
        margin: auto;
        background: url(picture.svg) 0/100% 100%;
        height: 72em; width: 106em;
    }

/*------@@@@@@@@@@@----------- @MEDIA -----------@@@@@@@@@@@------*/
@media screen and (max-width: 680px) {
    #main {font-size: 3px}
}