@import url('https://fonts.googleapis.com/css2?family=Barlow&family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Agbalumo&family=Arvo&family=Josefin+Sans&family=Rokkitt&family=Sanchez&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Bebas+Neue&family=Staatliches&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans&family=Press+Start+2P&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Mono&family=Noto+Sans+Mono&family=Sometype+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gajraj+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Barcode+128&family=Libre+Barcode+128+Text&family=Libre+Barcode+39+Extended+Text&family=Libre+Barcode+39+Text&family=Linefont:wght@200&display=swap');

:root {
    --main: rgb(255, 211, 134);
    --text-color: white;
    --bg-color: rgb(22, 22, 22);
    --lettuce: rgb(176, 255, 91);
    --magenta: rgb(255, 71, 234);
    --cyan: cyan;
    --tomato: tomato;
    --yellow: yellow;
    --purple: rgb(89, 86, 255);

    --highlight-color: white;
    --highlight-bg: black;
    --gray: rgb(164, 164, 164);

    --width: 600px;
    --minwidth: 550px;

    overflow-x: hidden;
    background-color: var(--bg-color);
    color: var(--text-color);
}

::selection {
    background-color: var(--highlight-color);
    color: var(--highlight-bg);
}

html{
    font-size: 62.7%;
    scroll-behavior: smooth;
    overflow-x: hidden;
}

* {
    box-sizing: border-box;
}

body{
    margin: 0;
    padding: 0 0 3rem 0;
    transition: 1s ease;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

a{
    transition: color .5s ease;
    transition: 0s;
    color: white;
    text-decoration: none;
}

a:hover,
a:focus, 
a:active{
    color: var(--magenta);
    text-decoration: line-through;
    /*font-family: 'Pixelify Sans', sans-serif;*/
}