@font-face {
    font-family: 'inconsolata';
    src: url('../font/Inconsolata.ttf');
}

@font-face {
    font-family: 'space_mono';
    src: url('../font/SpaceMono-Regular.ttf');
}

@font-face {
    font-family: "syne_mono";
    src: url('../font/SyneMono-Regular.ttf');
}

@font-face {
    font-family: 'jgs';
    src: url('../font/jgs.ttf');
}
  
@font-face {
    font-family: 'jgs5';
    src: url('../font/jgs5.woff2');
}
  
@font-face {
    font-family: 'jgs7';
    src: url('../font/jgs7.woff2');
}
  
@font-face {
    font-family: 'jgs9';
    src: url('../font/jgs9.woff2');
}

/* GENERAL -------------------------------------------------------------------------------------------------*/
:root{
    --white: rgb(244, 244, 244);  
    --black: rgb(40, 40, 40);
    --control-font-size: clamp(1.1rem, 1.1vw, 3rem);
}

*{
    margin: 0%;
    padding: 0%;
}

body{
    overflow: hidden;
    font-family: "inconsolata";
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100vw;
    height: 100%;
    background-color: var(--black) !important;
}

h1, h2{
    font-weight: normal;
}

.inc_regular{
    font-family: "inconsolata";
    font-style: normal;
    font-weight: 300;
    font-variation-settings: 'wdth' 120;
}

.inc_bold{
    font-family: "inconsolata";
    font-style: normal;
    font-weight: 900;
    font-variation-settings: 'wdth' 120;
}

.inc_extended{
    font-family: "inconsolata";
    font-style: normal;
    font-weight: 900;
    font-variation-settings: 'wdth' 180;
}

.inc_arrow{
    font-family: "inconsolata";
    font-style: normal;
    font-weight: 300;
    font-variation-settings: 'wdth' 180;
}

.inc_counter{
    font-family: "inconsolata";
    font-style: normal;
    font-weight: 300;
    font-variation-settings: 'wdth' 120;
}

.inc_mode{
    font-family: "inconsolata";
    font-style: normal;
    font-weight: 350;
    font-variation-settings: 'wdth' 120;
}