html {
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  html {
    color-scheme: dark;
    font-family:sans-serif;
    background-color:black;
  }
    a:link,a:visited,a:hover,a:active {
        color: lightblue;
    }


}

            
img,
video,
iframe {
  max-inline-size: 100%;
  block-size: auto;
}

.terminal_output {

  display: grid ;

}
.correct_letter {
	background-color:green;
	color:white;
	//padding: 0.5em;
	border-style:solid;
	border-color:black;
	border-width:1px;
  text-align: center;

}

.incorrect_letter {
	background-color:gray;
	color:white;
	//padding: 0.5em;
	border-style:solid;
	border-color:black;
	border-width:1px;
  text-align: center;

}


.possible_letter {
	background-color:yellow;
	color:black;
	//padding: 0.5em;
	border-style:solid;
	border-color:black;
	border-width:1px;
  text-align: center;

}

.table-container {
  max-inline-size: 100%;
  overflow-x: auto;
  scroll-snap-type: inline mandatory;
  scroll-behavior: smooth;
}
table {
  background-color: var(--color-off-white);

  /*border-collapse: collapse;*/
}
thead th {
  text-align: start;
}
tr {
	border-color:white;
	border-style:solid;
	border-width:thin;
}
th, td {
  scroll-snap-align: start;
  padding: var(--metric-box-spacing);

}


 /**input[type="text"],input[type="password"]{border-style:solid;border-width:1px;border-radius:5px;padding:8px;}
        textarea {border-style:solid;border-width:1px;border-radius:5px;}
            * {font-size:0.8rem;font-weight:bold;} **/

            
            /** Light mode 
@media (prefers-color-scheme: light) {
    body {
        font-family:sans-serif;
        background-color: white;
        color: black;
    }
}
*/

/* Dark mode 
@media (prefers-color-scheme: dark) {
    body,input,textarea {
        font-family:sans-serif;
        background-color: rgb(24,24,24);
        color: white;
    }
        input[type="text"],input[type="password"],textarea {
        background-color: rgb(0,0,0);
        color: white;
    }
            input[type="submit"] {
        background-color: rgb(48,48,48);
        color: white;
    }
    
    a:link { color: lightskyblue; }
a:visited { color: rgb(240,0,240); }
a:hover { color: rgb(0,240,0); }
a:active { color: rgb(0,240,0); text-decoration:none; }

    
} **/