@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');

:root {
    --dark: #0827f5;
    --medium: #018281;
    --light: #240090;
    --grey: #818181;
    --textlight: #cec8c8;
    --textdark: #000000;
    --texthover: #5c5c5c;
}

html {
    font-size: 16px;
    --bs-font-font-family: monospace;
}

@media (min-width: 768px) {
  html {
    font-size: 18px;
  }
}

body {
    --bs-font-monospace: 'VT323', monospace;
    --bs-body-font-family: var(--bs-font-monospace);
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
    margin-bottom: 60px;
    /* START USER CODE */
    background-color: var(--medium);
}

nav {
    margin: .5rem;
}

.navbar {
    border-bottom: none;
}

.navbar-light .navbar-brand {
    color: aliceblue;
}

.navbar-light .navbar-nav .nav-link {
    color: var(--text);
}

.nav-link {
    color:var(--textlight);
}

.navbar-nav .nav-item.active .nav-link,
.navbar-nav .nav-item:hover .nav-link {
    color: #5c5c5c;
}

.navLogo {
    padding-top: .3125rem;
    padding-bottom: .3125rem;
    margin-right: 1rem;
    font-size: 1.25rem;
    text-decoration: none;
    color:var(--textlight) !important;
}

.footer {
    background-color: var(--grey);
    border-top: ridge 1px lightgray;
    color: var(--textdark);
    line-height: 1rem !important;
}

.footerExtension {
    margin: .25rem;
    max-width:fit-content;
}

.pageTitle {
    color: var(--textlight);
}

.generalMessage {
    color: var(--textlight);
}


/* Win95 Theming */
.window95 {
    padding: .25rem;
    box-shadow: 2px 2px rgba(0, 0, 0, 0.5);
    border-top: ridge 1px lightgray;
    border-left: ridge 1px lightgray;
    background-color: var(--grey);
    color: var(--textdark)
}

.inWindow95 {
    padding: .25rem;
    box-shadow: inset 2px 2px rgba(0, 0, 0, 0.5);
    border-bottom: ridge 1px lightgray;
    border-right: ridge 1px lightgray;
    background-color: var(--grey);
    color: var(--textdark)
}

.subWindow95 {
    margin:.25rem;
    max-width:fit-content;
}

.title95 {
    
    background-image: linear-gradient(to right, black, var(--dark));
    color: var(--textlight);
    box-shadow: 1px 1px rgba(0, 0, 0, 0.5);
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: .5rem;
}

.errorTitle95 {
    background-image: linear-gradient(to right, darkred, var(--dark));
    color: var(--textlight);
    box-shadow: 1px 1px rgba(0, 0, 0, 0.5);
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: .5rem;
}

.errorImage {
    box-shadow: none;
    border-top: none;
    border-left: none;
    border-bottom: none;
    border-right: none;
}

.winImg {
    box-shadow: inset 2px 2px rgba(0, 0, 0, 0.5);
    border-top: groove 2px black;
    border-left: groove 2px black;
    border-bottom: ridge 1px lightgray;
    border-right: ridge 1px lightgray;
}

textarea {
    box-shadow: inset 1px 1px rgba(0, 0, 0, 0.5);
    border-bottom: ridge 2px lightgray;
    border-right: ridge 2px lightgray;
}

select {
    box-shadow: inset 1px 1px rgba(0, 0, 0, 0.5);
    border-bottom: ridge 2px lightgray;
    border-right: ridge 2px lightgray;
}

input[type=text] {
    box-shadow: inset 1px 1px rgba(0, 0, 0, 0.5);
    border-bottom: ridge 2px lightgray;
    border-right: ridge 2px lightgray;
}

button {
    background-color: var(--grey);
    border-top: ridge 2px lightgray;
    border-left: ridge 2px lightgray;
    box-shadow: 1px 1px rgba(0, 0, 0, 0.5);
}

input[type=button] {
    background-color: var(--grey);
    border-top: ridge 2px lightgray;
    border-left: ridge 2px lightgray;
    box-shadow: 1px 1px rgba(0, 0, 0, 0.5);
}

input[type=submit] {
    background-color: var(--grey);
    border-top: ridge 2px lightgray;
    border-left: ridge 2px lightgray;
    box-shadow: 1px 1px rgba(0, 0, 0, 0.5);
}




/*
    This is needed so div's inside of rows but not columns don't ruin formatting
*/
.inside {
    display: flex;
    flex-basis: 100%;
    flex-wrap: wrap;
}