:root {
--red: red;
--highlight-row-red: #ffd7da;
--green: green;
--blue: blue;

--input-color: 				var(--dark-color);
--btn-background-color:			var(--dark-color);
--header-background-color: 		var(--dark-color);		
--header-background-color1: 		var(--medium-color); 		
--header-background-color2: 		var(--light-color);
--legend_color: 	    		black;
--legend_background-color:  		var(--medium-color);
--hover-background-color: 		var(--medium-color);
--btn-hover-color: 			var(--hover-medium-color);
--body-background-color: 		#bdbdbd;
--body-background-color: 		#f5f3f0;
--font-color-header: 			white;
--subtitle-color: 			var(--dark-color);
--heading-color: 			var(--dark-color);
--btn-selected-color: 		        var(--light-color);
--score-font-color: 		        white;
}

@media (prefers-color-scheme: dark) {
:root {
--red: 					#ff4d4d;
--green: 				#b3ff66;
--blue:					#99ddff;

--highlight-row-red: red;
--subtitle-color: 			var(--medium-color);
--btn-hover-color: 			var(--medium-color);
--heading-color: 			var(--medium-color);
 
--input-color: 				var(--medium-color);
--selected-background-color:		#00631e;
--alternate-row-background-color:	#171717;
--body-background-color: 		black;
--font-color: 				white;
--btn-font-color: 			white;
--btn-font-hover-color:			black;
--font-hyperlink-color: 		var(--light-color);
--btn-border-color: 		        var(--dark-color);
--btn-selected-color: 		        black;
--score-font-color: 		        black;
 }
}