<footer>
  <div class="nuzsam-satula">
  <h3>Руководство Веб-мастера</h3>
  <p>Здесь идет тематическое описание, в которое можно поставить ссылки на переход.</p>
  <ul class="lodesamib">
  <li><a href="#"><i class="fa fa-facebook"></i></a></li>
  <li><a href="#"><i class="fa fa-twitter"></i></a></li>
  <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
  <li><a href="#"><i class="fa fa-youtube"></i></a></li>
  <li><a href="#"><i class="fa fa-linkedin-square"></i></a></li>
  </ul>
  <div class="lasderu-cesesan">
  <ul class="f-menu">
  <li><a href="">ZORNET.RU</a></li>
  <li><a href="">CSS</a></li>
  <li><a href="">HTML</a></li>
  <li><a href="">БЛОГ</a></li>
  <li><a href="">КОНТАКТЫ</a></li>
  </ul>
  </div>
  </div>
  <div class="asepon-migtunas">
  <p>ZORNET.RU - <a href="#">Все для создания сайта!</a> </p>

  </div>

  </footer>

footer{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: #111;
  height: auto;
  width: 100vw;

  padding-top: 40px;
  color: #fff;
}
.nuzsam-satula{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
.nuzsam-satula h3{
  font-size: 2.1rem;
  font-weight: 500;
  text-transform: capitalize;
  line-height: 3rem;
}
.nuzsam-satula p{
  max-width: 500px;
  margin: 10px auto;
  line-height: 28px;
  font-size: 14px;
  color: #cacdd2;
}
.lodesamib{
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 1rem 0 3rem 0;
}
.lodesamib li{
  margin: 0 10px;
}
.lodesamib a{
  text-decoration: none;
  color: #fff;
  border: 1.1px solid white;
  padding: 5px;

  border-radius: 50%;

}
.lodesamib a i{
  font-size: 1.1rem;
  width: 20px;

  transition: color .4s ease;

}

.lodesamib a:hover i{
  color: aqua;
}

.asepon-migtunas{
  background: #000;
  width: 100vw;
  padding: 20px;

  text-align: center;
}
.asepon-migtunas p{
  text-align: center;
  font-size: 14px;
  word-spacing: 2px;
  text-transform: capitalize;
}
.asepon-migtunas p a{
  color:#44bae8;
  font-size: 16px;
  text-decoration: none;
}
.asepon-migtunas span{
  text-transform: uppercase;
  opacity: .4;
  font-weight: 200;
}
.lasderu-cesesan{
  margin-bottom: 20px;
}
.lasderu-cesesan ul{
  display: flex;
}
.lasderu-cesesan ul li{
padding-right: 10px;
display: block;
}
.lasderu-cesesan ul li a{
  color: #cfd2d6;
  border: 1.3px solid white;
  padding: 6px 15px;
  border-radius: 50px;
  text-decoration: none;
}
.lasderu-cesesan ul li a:hover{
  color: #27bcda;
}

@media (max-width:500px) {
.lasderu-cesesan ul{
  display: inline;

}
.lasderu-cesesan ul li{
  margin-bottom: 20px;
}
}