body { 
  background-image: url(./img/map-zelda.png);
    background-size: cover;
    margin:0px;
    padding:0px
  }
    @font-face {
  font-family: 'HyliaSerif';
  src: url('../fonts/HyliaSerif.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: 'HyliaSerif', serif;
}

h1, h2, p {
  font-family: 'HyliaSerif', serif;
}
.parent  {
  font-size: 40px;
  display: flex;
  justify-content: center;
  position: relative;
  width: 100%;
  background-color:#6D8543 ;
  height: 100%;
  margin-top: -1%;
}
h2 {
  left: 1%;
}
h1 {
  font-size: 40px;
}
p {
  display: inline;
  padding:10px ;
  color: white;
  font-size: 30px;
}
.teba {
  margin-left: 3%;
}
#teba-name {
  margin-left: 3%;
}
#teba-info {
  margin-left: -12.6%;
  line-height: 15px;
}
.Riju {
  position: relative;
  float: inline-start;
  margin-left: 3%;
  margin-top: 30%;
}
#riju-img {
  width: 25%;
}
#Riju-name {
  margin-left: 9.4%;
}
#Riju-info {
  text-align: left;
  position: relative;
  display: flex;
  margin-top: 10%;
  margin-left: -2.5%;
}
.yunobo {
  position: relative;
  display: flex;
  justify-content: right;
  margin-top: -23%;
  flex-direction: column;
  left: -5%;
}
#yunobo-img {
  width: 35%;
  margin-left: 70%;
}
#yunobo-name {
  top:-16%;
  left: 83%;
  position: absolute;
}
#yunobo-info {
text-align: right;
}
.sidon {
  justify-content: right;
}

#sidon-name {
  position: relative;
  text-align: right;
  left: -5%;
  margin-top: 30%;
}
#sidon-img {
  align-content: right;
  float: right;
  width: 20%;
  left: -5%;
}
#sidon-info {
  text-align: right;
  float: right;
  margin-right:-20% ;
  margin-top: 25%;
}
#builder {
  position: relative;
  right: -50%;
  top: -1090px;
  width: 4.5%;
}
#guardian {
  position: relative;
  width:10%;
  top: -1100px;
  margin-left:-40% ;
}
#power {
  position: relative;
  left: 74%;
  bottom: 1060px;
}
#verhaal{
  position: relative;
  left: -14.5%;
  bottom: 1080px;
}