@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@500&display=swap');

:root {
    color-scheme: dark;
}

::-webkit-scrollbar {
    width: 20px;
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #d3e0e8;
    border-radius: 20px;
    border: 6px solid transparent;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #b8c5d2;
}

body { 
    height: 100vh;
    width: 100vw; 
    padding: 0; 
    margin: 0; 
    overflow: hidden; 
    display: flex;
    font-family: 'DM Mono', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

a {
    color: inherit;
}

body > div { 
    flex: 1; 
    height: 100%; 
}

@media screen and (max-width: 1000px) {
    body {
        flex-direction: column;
        height: unset;
        overflow: unset;
        overflow-x: hidden;
    }

    body > div { 
        flex: 1; 
        height: unset; 
    }
}

#div1 { 
    background-color: #d3e0e8; 
    color: #1f1e1d;
    display: flex;
    align-items: flex-end;
    padding: 60px;
    box-sizing: border-box;
}

#div2 { 
    background-color: #1f1e1d; 
    color: #d3e0e8;
    font-family: 'DM Mono', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.2em;
    padding: 60px;
    overflow: auto;
    box-sizing: border-box;
}

#header {
    font-size: 9vw;
    margin: 0;
}