@media all {
 html {
  scroll-behavior: smooth;
 }

 body {
  background-color: #000000;
  color: #EEEEEE;
  margin: 0;
  padding: 0;
  font-family: Consolas, "Courier New", Courier, "Lucida Console", Geneva, Verdana;
  font-size: 135%;
 }

 div {
  width: 1200px;
  margin: 0 auto;
 }

 table {
  background-color: #313131;
  width: 100%;
  margin: 20px 0 15px;
  padding: 20px;
  border: 15px solid #474747;
  border-radius: 45px;
  border-spacing: 0;
  font-family: Consolas, "Courier New", Courier, "Lucida Console", Geneva, Verdana;
  font-size: 100%;
 }

 td {
  margin: 0;
  padding: 0;
  border: none;
 }
 td.option1 {
  width: 20%;
  padding: 0 5px 0;
  text-align: left;
 }
 td.header {
  width: 60%;
  text-align: center;
 }
 td.option2 {
  width: 20%;
  padding: 0 5px 0;
  text-align: right;
 }
 td.subheader {
  color: #FFCC58;
  padding: 10px 5px 10px;
  font-size: 135%;
  font-weight: bold;
  text-align: left;
 }
 td.subheader:hover {
  text-shadow: 0px 0px 75px;
 }
 td.topdown {
  padding: 0 6px 7px;
  text-align: right;
 }
 td.personal, td.contents {
  padding: 0 10px 0;
 }
 td.icon {
  width: 30%;
  padding: 12px 10px 0;
  text-align: center;
 }

 h1 {
  color: #FFCC58;
  margin: 0;
  padding: 0;
  font-size: 250%;
 }
 h1:hover {
  text-shadow: 0px 0px 150px;
 }

 ul {
  margin: 0;
  padding: 0 0 0 28px;
  font-size: 80%;
  text-align: left;
 }
 .personal ul {
  list-style-type: none;
 }
 .contents ul {
  list-style-type: disc;
 }

 li {
  margin: 0;
  padding: 0 0 8px;
 }

 .contents p {
  color: #EEEEEE;
  margin: 0;
  padding: 0 0 8px 0;
  font-size: 100%;
  font-weight: bold;
  text-align: left;
 }
 p.footer {
  color: #474747;
  margin: 0;
  padding: 0 25px 10px;
  font-size: 60%;
  text-align: center;
 }

 .option1 a, .option2 a {
  color: #FFCC58;
  font-size: 100%;
  font-weight: bold;
  text-decoration: none;
  transition: 0.3s;
 }
 .option1 a:hover, .option2 a:hover {
  color: #474747;
  text-decoration: none;
 }
 .topdown a {
  color: #FFCC58;
  font-size: 80%;
  font-weight: bold;
  text-decoration: none;
  transition: 0.3s;
 }
 .topdown a:hover {
  color: #474747;
  text-decoration: none;
 }
 .contents a {
  color: #FFCC58;
  text-decoration: none;
  transition: 0.3s;
 }
 .contents a:hover {
  color: #474747;
  text-decoration: none;
 }
 .contents a.bonus {
  text-decoration: none;
  cursor: crosshair;
 }

 img {
  width: 88px;
  height: 31px;
  border: 0;
  transition: 0.3s;
 }
 img:hover {
  filter: grayscale(100%) brightness(0.3);
 }

 ::selection {
  background-color: #474747;
 }
}

@media print {
 body, h1, td.subheader, .contents p, p.footer {
  background-color: #FFFFFF;
  color: #000000;
 }

 div {
  width: 1100px;
 }

 table {
  margin: 0;
  padding: 0;
  border: none;
 }

 td.option1, td.option2, td.topdown, td.icon {
  visibility: hidden;
 }

 .contents a {
  color: #000000;
  text-decoration: none;
 }
}
