@font-face {
	font-family: segafont;
	src: url("retrostereowide.woff");
}

/* Light theme - Sega Master System */

@media (prefers-color-scheme: light) {

/* Styling for main body things */

@media only screen and (min-width: 601px) {

body {
	background-color: white;
	background-image: url("qualitymark.png"), url("smsgraph.png");
	background-attachment: fixed;
	background-size: 20%, 1%;
	background-position: right bottom, left top;
	background-repeat: no-repeat, repeat;
	font-family: 'Segoe UI', Helvetica, 'OnePlus Sans', Arial, sans-serif;
	Margin-top: 65px;
	Margin-bottom: 45px;
}

h1 {
	font-family: segafont;
	text-shadow: -1px 1px 0 white,
                  1px 1px 0 white,
                  1px -1px 0 white,
                 -1px -1px 0 white;
	Font-Size: 40px;
	color: #0063A9;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:80%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
	
}

h2 {
	Font-Size: 25px;
	color: black;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:80%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
}

p {
	font-size: 20px;
	color: white;
	border-radius: 0px;
	padding: 15px;
	border: solid 0px;
	background-color: rgba(0,0,0,0.75);
	width: 80%;
	margin: auto;
	line-height: 2;
	white-space: auto;
}

a {
	color: white;
}

/* Navigation bar black magic followed by a simple footer thing */

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #000;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}

li {
  float: left;
  border-right:1px solid #bbb;
}

li:last-child {
  border-right: none;
}

li a {
  display: block;
  color: #0047AB;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover:not(.active) {
  color: white;
  background-color: #0063A9;
}

.active {
	color: white;
	background-color: #0063A9;
}

footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: #000;
   color: white;
   text-align: center;
}

}

@media only screen and (max-width: 600px) {

body {
	background-color: black;
	background-image: url("qualitymark.png"), url("smsgraph.png");
	background-attachment: fixed;
	background-size: 38%, 5%;
	background-position: right bottom, left top;
	background-repeat: no-repeat, repeat;
	font-family: 'Segoe UI', Helvetica, 'OnePlus Sans', Arial, sans-serif;
	Margin-top: 65px;
	Margin-bottom: 45px;
}

h1 {
	font-family: segafont;
	text-shadow: -1px 1px 0 white,
                  1px 1px 0 white,
                  1px -1px 0 white,
                 -1px -1px 0 white;
	Font-Size: 32px;
	color: #0063A9;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:94%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
	
}

h2 {
	Font-Size: 20px;
	color: black;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:94%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
}

p {
	font-size: 20px;
	color: white;
	border-radius: 0px;
	padding: 15px;
	border: solid 0px;
	background-color: rgba(0,0,0,0.75);
	width: 94%;
	margin: auto;
	line-height: 2;
	white-space: auto;
}

a {
	color: white;
	display: flex;
	flex-direction: column;
}

/* Navigation bar black magic followed by a simple footer thing */

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #000;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}

li {
  float: left;
  border-right:1px solid #bbb;
}

li:last-child {
  border-right: none;
}

li a {
  display: block;
  color: #0047AB;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover:not(.active) {
  color: white;
  background-color: #0063A9;
}

.active {
	color: white;
	background-color: #0063A9;
}

footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: #000;
   color: white;
   text-align: center;
}

}

}

/* Dark Theme - Sega Genesis */

@media (prefers-color-scheme: dark) {

@media only screen and (min-width: 601px) {

body {
	background-color: black;
	background-image: url("qualitymark.png"), url("gengraph.png");
	background-attachment: fixed;
	background-size: 20%, 1%;
	background-position: right bottom, left top;
	background-repeat: no-repeat, repeat;
	font-family: 'Segoe UI', Helvetica, 'OnePlus Sans', Arial, sans-serif;
	Margin-top: 65px;
	Margin-bottom: 45px;
}

h1 {
	font-family: segafont;
	text-shadow: -1px 1px 0 white,
                  1px 1px 0 white,
                  1px -1px 0 white,
                 -1px -1px 0 white;
	Font-Size: 40px;
	color: #0063A9;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:80%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
	
}

h2 {
	Font-Size: 25px;
	color: white;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:80%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
}

p {
	font-size: 20px;
	color: white;
	border-radius: 0px;
	padding: 15px;
	border-color: #3B3B3B;
	border: solid 1px;
	background-color: rgba(0,0,0,0.75);
	width: 80%;
	margin: auto;
	line-height: 2;
	white-space: auto;
}

a {
	color: white;
}

/* Navigation bar black magic followed by a simple footer thing */

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #FF112A;
  background-image: repeating-linear-gradient(135deg,#FF112A 0px,#FF112A 15px, #FF112A 15px,#C30313 10px,#C30313 30px);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}

li {
  float: left;
  border-right:1px solid #bbb;
}

li:last-child {
  border-right: none;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover:not(.active) {
  background-color: #C30313;
}

.active {
	color: white;
	background-color: #C30313;
}

footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: #FF112A;
   background-image: repeating-linear-gradient(135deg,#FF112A 0px,#FF112A 15px, #FF112A 15px,#C30313 10px,#C30313 30px);
   color: white;
   text-align: center;
}

}

@media only screen and (max-width: 600px) {

body {
	background-color: black;
	background-image: url("qualitymark.png"), url("gengraph.png");
	background-attachment: fixed;
	background-size: 38%, 5%;
	background-position: right bottom, left top;
	background-repeat: no-repeat, repeat;
	font-family: 'Segoe UI', Helvetica, 'OnePlus Sans', Arial, sans-serif;
	Margin-top: 65px;
	Margin-bottom: 45px;
}

h1 {
	font-family: segafont;
	text-shadow: -1px 1px 0 white,
                  1px 1px 0 white,
                  1px -1px 0 white,
                 -1px -1px 0 white;
	Font-Size: 32px;
	color: #0063A9;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:94%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
	
}

h2 {
	Font-Size: 20px;
	color: white;
	text-align: center;
	border-radius: 0px;
	border: solid 0px;
	width:94%;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
}

p {
	font-size: 20px;
	color: white;
	border-radius: 0px;
	padding: 15px;
	border: solid 0px;
	border-color: #3B3B3B;
	border: solid 1px;
	background-color: rgba(0,0,0,0.75);
	width: 94%;
	margin: auto;
	line-height: 2;
	white-space: auto;
}

a {
	color: white;
	display: flex;
	flex-direction: column;
}

/* Navigation bar black magic followed by a simple footer thing */

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #FF112A;
  background-image: repeating-linear-gradient(135deg,#FF112A 0px,#FF112A 15px, #FF112A 15px,#C30313 10px,#C30313 30px);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}

li {
  float: left;
  border-right:1px solid #bbb;
}

li:last-child {
  border-right: none;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover:not(.active) {
  background-color: #C30313;
}

.active {
	color: white;
	background-color: #C30313;
}

footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
  background-color: #FF112A;
  background-image: repeating-linear-gradient(135deg,#FF112A 0px,#FF112A 15px, #FF112A 15px,#C30313 10px,#C30313 30px);
   color: white;
   text-align: center;
}

}
		
}