
body {
  font-family: monospace;
  margin: 0;
  padding: 0;
  height: 100vh;
  background-image: url('/about/clouds2.png');
  background-repeat: repeat;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.main {
  margin: 200px auto auto auto;
  width:700px;
  height: 563px;
  border: 4px solid #5b748d;
  border-radius: 4px;
  box-shadow: 10px 5px 10px rgba(0,0,0,0.3);

  background-image: url('/about/lines.png');
  background-position: 20px;
}

h1 {
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  padding-top:10px;
  padding-bottom: 20px;
  background-image: url('/about/tile.png');
  color: #37424c;
  -webkit-text-stroke: white 6px;
  paint-order: stroke fill;
}

.box {
  overflow-y: scroll;
  font-size: large;
  margin: 15px;
  height:83%;
  border: 1px solid #5b748d;
  background: #F6F3F1;
  background: linear-gradient(0deg,rgba(218, 225, 233, 1) 0%, rgba(246, 243, 241, 1) 38%);
}

p {margin: 15px;}

/* deco*/
.minecraft, .bandera, .rblxx, .meee, .back {
  position: fixed;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
}

.back {
  top: 65px;
  left: 120px;
  width: 200px;
  height: 60px;
  background-image: url('/about/back.png');
  transition: transform 0.1s;
  }

.back:hover {
  transform: scale(110%) rotate(5deg);
}

.minecraft {
  top: 73px;
  left: calc(50% + 180px);
  width: 155px;
  height: 200px;
  background-image: url('/about/minecraft.png');
}

.bandera {
  top: 150px;
  left: calc(50% + 330px);
  width: 68px;
  height: 50px;
  background-image: url('/about/uyu.gif');
}

.rblxx {
  bottom: 0;
  left: calc(50% + 250px);
  width: 319px;
  height: 363px;
  background-image: url('/about/roblox.png');
}

.meee {
  top: 250px;
  left: calc(50% - 850px);
  width: calc(0.7 * 758px);
  height: calc(0.7 * 810px);
  background-image: url('/about/avatar.png');
}

.button, .interestz {
  display: inline-block;
  margin: 15px 17px auto;
  width: 120px;
  border: 1px solid #5b748d;
  transition: filter, transform 0.15s;
}

/*boxes*/

.button:hover{
  filter: blur(1px);
  transform: scale(95%);
}

.btnTop {
  font-weight: bold;
  padding: 3px;
  border-bottom: 1px solid #5b748d;
  text-align: center;
  background-image: url('/about/tile.png');
  color: #37424c;
  -webkit-text-stroke: white 6px;
  paint-order: stroke fill;
}

.btnBot {
  padding: 3px;
  text-align: center;
}

.interestz {
  margin: auto 24px 15px 24px;
  width: 25%;
}

li {
  text-align: left;
  list-style-position: inside;
}
