Адаптивный дизайн страницы сайта HTML

<header>
<h1>Название, что расположилось в шапке</h1>
<h2>Описание в кратком в самой шапке</h2>
</header>
<main>
  <h2>Заголовок на главную статью</h2>
  <p>Описание под вверх сайта</p>

<p>Описание под шапкой</p>
  <div class="photo_row">
  <div><img src="Здесь контент или изображения №1"></div>
  <div><img src="Здесь контент или изображения №2"></div>
  <div><img src="Здесь контент или изображения №3е"></div>
  </div>
  <p>1. Первое описание</p>

<p>2. Второе описание</p>
</main>
<footer>
  <p><a href="http://zornet.ru/">ZorNet.Ru — сайт для вебмастера</a></p>
</footer>

body {
  margin:0;
  padding:0;
  background-color:#e6e3d8;
  color:#141b24;
}

h1, h2, h3 {
  font-family: 'Red Rose', cursive;
}
h1 {
  font-size:4em;
  line-height:.95em;
}

h2{
  font-size: 2em;
}

p {
  font-family: 'Open Sans', sans-serif;
}

header h1, header h2 {
  background-color:#2080a9;
  margin:0 auto 20 auto;
  padding:.5em;
}

header {
  padding:20%;
  color:#e6e3d8;
  background-image: url("Ссылка на изображение фона");
  background-size:cover;
}
.photo_row {
  text-align:center;
}

.photo_row img {
  display:inline-block;
  width: 200px;
}

main{
  margin:0 auto;
  padding:2em;
  max-width:900px;
}

footer {
  margin:0;
  padding:1em;
  background-color:#d04f42;
  text-align:right;
}

footer a {
  font-weight: 800;
  color:#e6e3d8;
  text-decoration:none;
  opacity:.75;
}

footer a:hover {
  opacity:1;
}