html {
  height: 100%;
  background-color: #3a3c3e;
}

body {
  height: 100%;
  background: #3a3c3e;
  display: flex;
  align-items: center;
}

header {
  width: 100%;
  text-align: right;
  margin-bottom: 4%;
  display: flex;
    align-items: center;
    justify-content: center;
}

i:hover {
  transition: .5s all ease-out;
  color: #2bb77a;
}

.logo-container {
  text-align: center;
}

header ul {
  margin: 0 20px!important;
  font-size: 30px;
  position: absolute;
  right: 22%;
}

img {
  width: 250px;
}

.content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 70%;
  margin: 30px auto;
  background: white;
  padding: 30px;
  border-radius: 10px;
}

.message {
  height: 50%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

h3 {
  width: 100%
}

.message p {
  text-align: justify;
  font-size: 15px;
  width: 80%;
}

.mayus {
  text-transform: uppercase;
}

p:last-of-type {
  text-align: right;
}

@media screen and (max-width: 1000px) {
  body {
    height: fit-content;
  }

  header {
    flex-wrap: wrap;
  }

  header ul {
    position: relative;
    width: 100%;
    right: auto;
  }

  i {
    color: #9f9f9f;
  }

  .message p {
    width: 90%
  }

}
