* {
    padding: 0;
    margin: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

html {
    /* font-family: 'Share Tech Mono', monospace; */
    /* font-family: 'Silkscreen', cursive; */
    /* font-family: 'Offside', cursive; */

    font-family: 'Arvo', serif;
    /* font-family: 'Rajdhani', sans-serif; */

    /* background-color: #292929; */
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background-color: #383838;
    background-color: #292929;
    overflow: auto;
}


h1 {
    /* font-family: 'Silkscreen', cursive; */
    /* font-size: xx-large; */
    font-size: 5em;
    line-height: 100%;
}

h2 {
    /* font-family: 'Silkscreen', cursive; */
    font-size: xx-large;
    /* font-weight: 300; */
}

h3 {
    /* font-family: 'Silkscreen', cursive; */
    font-size: x-large;
}

p {
    font-size: smaller;
}

a {
    color: unset;
    text-decoration: none;
}

li {
    list-style-type: none;
    /* list-style: none; */
}





/* Calc Colors: */

.drkLht {
    background-color: #383838;
    color: #ebebeb;
}

.drkLht img {
    filter: invert();
}

.underline {
    height: 20px;
    border-bottom: 10px solid;
}

.orange {
    color: orangered;
}

.blue {
    color: rgb(47, 224, 255);
}

.yellow {
    /* color: #fff200; */
    color: #ffd600;
}

.green {
    color: #00ff95;
}






.block {
    flex: 1 1 480px;
    margin: 20px 10px;
    margin-top: 100px;
}



.roundedBtn {
    border: 1px solid;
    border-radius: 50px;
    padding: 10px 20px;
    width: fit-content;
}

#new {
    cursor: pointer;
    background-color: #ebebeb3c;
    transition: background-color 0.5s linear;
}

#new:hover {
    background-color: #00a2ff;
    transition: background-color 0.5s linear;
}

.sIcon {
    filter: invert(100%);
    max-width: 25px;
    height: auto;
}



/* Input Fields: */

input, textarea, button, select {
    min-height: 30px;
    padding: 10px;
    /* width: -webkit-fill-available; */
    margin: 5px auto;

    border: unset;
    border: 1px dashed;
    border-radius: 5px;
    color: unset;

    /* font-family: 'Arvo', serif; */
}

label {
    font-size: smaller;
    font-family: 'Arvo', serif;
}

.fakeLabel {
    width: 60px;
    text-align: center;
}

input[type="number"] {
    font-family: 'IBM Plex Mono', monospace;
    font-size: larger;
    margin: 5px;
}

input[type="text"] {
    font-family: 'Arvo', serif;
    font-size: larger;
    /* width: -webkit-fill-available; */
}

fieldset {
    border: unset;
}







/* @media screen and (max-width: 640px){ */
@media screen and (max-width: 768px){



}