@font-face {
  font-family: "Balooda2SemiBold";
  src: url("https://fachman.online/balooda2-semibold.woff2") format("woff2");
  src: url("balooda2-semibold.woff2") format("woff2");
}

@font-face {
  font-family: "ChceckpointCharlie";
  src: url("https://fachman.online/checkpointcharlie.woff2") format("woff2");
  src: url("checkpointcharlie.woff2") format("woff2");
}

html,
body {
  font-size: larger;
  margin: 1%;
  height: 100%;
  background-color: #d5e8f7;
}

.slogan {
  display: block;
  flex: 100%;
  margin: 2%;
  align-items: center;
  text-align: center;
}


.number {
  display: block;
  flex: 33%;
  margin: 2%;
  align-items: center;
  text-align: center;
  margin-bottom: 5%;
}

@media (orientation: landscape) {


  .landscape {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .portrait {
    display: none;
  }

  .photo {
    flex: 55%;
    margin: 2%;
  }

  .margin {
    flex: 10%;
    margin: 2%;
  }

  .about {
    flex: 35%;
    margin: 2%;

  }


}

@media (orientation: portrait) {

  .landscape {
    display: none;
  }

  .portrait {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .bigphoto {
    display: block;
    flex: 100%;
    margin-left: 2%;
    margin-top: 2%;
    margin-top: 15%;
    margin-bottom: 10%;
  }

  .photo {
    flex: 80%;
    margin: 2%;
  }

  .margin {
    flex: 10%;
    margin: 2%;
    align-items: center;
    text-align: end;
  }

  .about {
    flex: 100%;
    margin: 2%;

  }

}

a {
  color: #006080;
  text-decoration: none;
}

.footerl {
  flex: 74%;
  margin: 2%;

}

.footerr {
  flex: 20%;
  margin: 2%;

}

.marginmini {
  flex: 3%;
  margin: 2%;
}

img {
  max-width: 100%;
}

p {
  font-family: 'Balooda2SemiBold';
  font-weight: normal;
  font-style: normal;
  text-align: justify;
  color: #006080;
  margin-left: 3%;
  margin-right: 3%;
  line-height: 1.8;
}

sup {
  vertical-align: 15%;
}

ul {
  list-style-type: disc;
  list-style-position: outside;
  font-family: 'Balooda2SemiBold';
  font-weight: normal;
  font-style: normal;
  text-align: left;
  color: #006080;
  margin-left: 3%;
  margin-right: 3%;
  line-height: 1.8;
}

p.rotate {

  font-family: 'Balooda2SemiBold';
  font-weight: normal;
  font-style: normal;
  text-justify: auto;
  color: #006080;
  margin-left: 3%;
  margin-right: 3%;
  line-height: 1.8;
  writing-mode: vertical-lr;

  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);

}