@font-face {
	font-family: "sanafonmaru";
	src: url("sanafonmaru.ttf");
}

body {
	font-family: "sanafonmaru";
	font-size: 20px;
	color: #00020;
  animation: fadeIn 1.5s;
background-color: #e5e5f7;
opacity: 1;
background-image:  linear-gradient(30deg, #d5b8ff 12%, transparent 12.5%, transparent 87%, #d5b8ff 87.5%, #d5b8ff), linear-gradient(150deg, #d5b8ff 12%, transparent 12.5%, transparent 87%, #d5b8ff 87.5%, #d5b8ff), linear-gradient(30deg, #d5b8ff 12%, transparent 12.5%, transparent 87%, #d5b8ff 87.5%, #d5b8ff), linear-gradient(150deg, #d5b8ff 12%, transparent 12.5%, transparent 87%, #d5b8ff 87.5%, #d5b8ff), linear-gradient(60deg, #d5b8ff77 25%, transparent 25.5%, transparent 75%, #d5b8ff77 75%, #d5b8ff77), linear-gradient(60deg, #d5b8ff77 25%, transparent 25.5%, transparent 75%, #d5b8ff77 75%, #d5b8ff77);
background-size: 32px 56px;
background-position: 0 0, 0 0, 16px 28px, 16px 28px, 0 0, 16px 28px;
}

a:link {
	color: #0f021a;
	text-decoration: underline;
}

a:visited {
	color: #0f021a;
	text-decoration: underline;
}
h1 {
	text-align: center;
}
li {
	text-align: center;
}
h2 {
	text-align: center;
}
p {
	text-align: center;
}
div {
	text-align: center;
}

span {
	text-align: center;
}


.header {
  padding: 5px;
  text-align: center;
  background: #d6bfde;
  font-size: 20px;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-webkit-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-o-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-ms-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
.mytabs {
    display: flex;
    flex-wrap: wrap;
    max-width: 700px;
    margin: 50px auto;
    padding: 25px;
	text-align: center;
}
.mytabs input[type="radio"] {
    display: none;
}
.mytabs label {
    padding: 25px;
    background: #e2e2e2;
    font-weight: bold;
}

.mytabs .tab {
    width: 150%;
    padding: 20px;
    background: #fff;
    order: 1;
    display: none;
}
.mytabs .tab h2 {
    font-size: 3em;
}

.mytabs input[type='radio']:checked + label + .tab {
    display: block;
}

.mytabs input[type="radio"]:checked + label {
    background: #fff;
}