/* This is used for formatting the prologue part of the site*/

body {
  background: url("background images/landscape backgrounds/Repetitive back tiles - starry night sky.png");
  background-repeat: round;
  background-size: 150px 150px;
  color: white;
  font-family: Baskerville Old Face;
  padding-top: 60px;
  padding-bottom: 7cm;
  margin: 0px;
  width: 100%;
  cursor: url('cursors/Cursor 1 - default.tiny.png'), default;
}
.paper-textbox {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin: 0 auto;
  border: 15px solid transparent;
  border-image-source: url("icons, stamps etc./Message border - paper.png");
  border-image-repeat: round;
  border-image-slice: 32%;
  background: url("icons, stamps etc./Message box - paper.png");
  background-clip: padding-box;
  width: 30%;
  color: black;
}
.paper-textbox p {
    margin: 8px;
    text-align: left;
}
#neocities-image {
  width: 100%;
  height: 100%;
  text-align: center;
}
.nav-buttons {
  display:flex;
  justify-content: center;
  align-items: center;
  margin-left: 10%;
  margin-right: 10%;
}
.prev-arrow {
  width: 100px;
  height: 100px;
  background: url("buttons/Metallic navig. buttons - 1.png") 0 0;
  transition: 0.3s;
}
.next-arrow {
  width: 100px;
  height: 100px;
  background: url("buttons/Metallic navig. buttons - 1.png") -100px 0;
  transition: 0.3s;
}
.prev-arrow:hover {
  background: url("buttons/Metallic navig. buttons - 1 - glow.png") 0 0;
}
.next-arrow:hover {
  background: url("buttons/Metallic navig. buttons - 1 - glow.png") -100px 0;
}
.landscape-box {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin: 0 auto;
  border: 15px solid transparent;
  border-image-source: url("icons, stamps etc./Message border - metal.png");
  border-image-repeat: stretch;
  border-image-slice: 30%;
  width: 600px
}
.landscape-box img {
  width: 600px;
  height: 400px;
  object-fit: cover;
}
.portal-button {
  display:flex;
  justify-content: center;
  align-items: center;
}
.world-portal {
  background-image: url("buttons/Portal entrance - default.png");
  height: 300px;
  transition: 0.3s;
}
.world-portal:hover {
  background-image: url("buttons/Portal entrance - activated.png");
  height: 300px;
}