:root {
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4
}

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji
}

hr {
    height: 0;
    color: inherit
}

abbr[title] {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b, strong {
    font-weight: bolder
}

code, kbd, pre, samp {
    font-family: ui-monospace, SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    text-indent: 0;
    border-color: inherit
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button, select {
    text-transform: none
}

button {
    -webkit-appearance: button
}

legend {
    padding: 0
}

progress {
    vertical-align: baseline
}

summary {
    display: list-item
}

blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre {
    margin: 0
}

button {
    background-color: transparent;
    background-image: none
}

button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color
}

fieldset, ol, ul {
    margin: 0;
    padding: 0
}

ol, ul {
    list-style: none
}


*, :after, :before {
    box-sizing: border-box;
    border: 0 solid
}

hr {
    border-top-width: 1px
}

img {
    border-style: solid
}

textarea {
    resize: vertical
}

input::-moz-placeholder, textarea::-moz-placeholder {
    opacity: 1;
    color: #a1a1aa
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    opacity: 1;
    color: #a1a1aa
}

input::placeholder, textarea::placeholder {
    opacity: 1;
    color: #a1a1aa
}

button {
    cursor: pointer
}

table {
    border-collapse: collapse
}

h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

button, input, optgroup, select, textarea {
    padding: 0;
    line-height: inherit;
    color: inherit
}

code, kbd, pre, samp {
    font-family: Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace, Quicksand, Product Sans
}

audio, canvas, embed, iframe, img, object, svg, video {
    display: block;
    vertical-align: middle
}

img, video {
    max-width: 100%;
    height: auto
}

* {
    --tw-shadow: 0 0 transparent;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, 0.5);
    --tw-ring-offset-shadow: 0 0 transparent;
    --tw-ring-shadow: 0 0 transparent
}


.container {
    width: 100%
}

.container-class {
    width:100%;
    min-height:100vh;
    font-size:18px;
    max-height:fit-content
}

@media (min-width: 640px) {
    .container {
        max-width: 640px
    }
    .container-class {
        font-size:31px;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 768px
    }
    .container-class {
        font-size:28px;
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: 1024px
    }
    .container-class {
        font-size:25px;
    }
}

@media (min-width: 1280px) {
    .container {
        max-width: 1280px
    }
    .container-class {
        font-size:22px;
    }
}

@media (min-width: 1536px) {
    .container {
        max-width: 1536px
    }
    .container-class {
        font-size:19px;
    }
}

.font-mono {
    font-family: Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace, Quicksand, Product Sans
}

.console
{
    font-family: Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace, Quicksand, Product Sans
}

input[type="button"]
{
    cursor: pointer;
}



.bg-accentedBlack {
    --tw-bg-opacity: 1;
    background-color: rgba(17, 17, 17, var(--tw-bg-opacity))
}



.text-white {
    --tw-text-opacity: 1;
    color: rgba(255, 255, 255, var(--tw-text-opacity))
}

.mt-4 {
    margin-top: 1rem
}

.mr-12 {
    margin-right: 3rem
}

.p-4 {
    padding: 1rem
}


@media (min-width: 640px) {
    .sm\:p-4 {
        padding: 1rem
    }
}

@media (min-width: 768px) {
    .md\:p-16 {
        padding: 4rem
    }
}

@media (min-width: 1024px) {
    .lg\:py-16 {
        padding-top: 4rem;
        padding-bottom: 4rem
    }

    .lg\:px-32 {
        padding-left: 8rem;
        padding-right: 8rem
    }
}

@media (min-width: 1280px) {
    .xl\:px-64 {
        padding-left: 16rem;
        padding-right: 16rem
    }
}

.underline {
    text-decoration: underline
}



.fadeIn {
    text-transform: none;
    animation: fadeIn 1s ease;
    -webkit-animation: fadeIn .4s ease
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.span-console-text{
    line-height: 1.8;
}