/* #N - font-import */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/* #0 - Setup */
:root {
    --background: #16181c;
    --foreground-all: #ffffff;

    --layout: #27292e;
    --high-light-layout: #34363c;

}

* { /* html */
    /* -webkit-tap-highlight-color: transparent; */
    scroll-behavior: smooth;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

html, body { overflow-x: hidden}

body {
    background-color: var(--background);
    color: var(--foreground-all);
}

.header-title{
    width: 25%;
    height: 4rem;
    background-color: var(--high-light-layout);
    position: relative;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    padding: 1rem;
    border-radius: 0 0 15px 0;
    margin-bottom: 2rem;
}

.main-nav{
    width: 80%;
    height: 4rem;
    background-color: var(--layout);
    z-index: -1;
    position: fixed;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    padding: 1rem 1rem 1rem 3rem;
    border-radius: 0 0 15px 0;
    margin-bottom: 2rem;
}

main{
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 3rem;
}

section {
    background-color: var(--layout);
    padding: 1rem;
    border-radius: 15px;
}

/* 
footer{
} */


/* #1 - Main layout */