footer в странице сайта поднимается под самый верх, расположившись прямо под header. Я сделал код в

Следуя указаниям урока ХТМЛ верстки по шаблону учебного сайта делаю свой сайт. Возникла проблема: footer в странице сайта поднимается под самый верх, расположившись прямо под header. 

<div class="footer">
<p>
<a href="#">Главная</a> |
<a href="#">История Уэчи рю</a> |
<a href="#">Мастера Уэчи рю</a> |
<a href="#">Статьи о каратэ</a> |
<a href="#">Видео коллекция</a> |
<a href="#">Фото коллекция</a> |
<a href="#">Додзе Уэчи рю в Регионах</a> |
<a href="#">Контакты</a> |

</p>
<p>Yechi Ryu Moskov.com 2020</p>
</div>

/* footer */

.footer {
width: 100%;
height: 100px;
padding: 28px 0 5px 0;
text-align: center;
background-color: darkslateblue;
color: #a8aa94;
margin-left: 0px;
margin-right: 0px;
min-width: 900px;
}

.footer a {
color: #a8aa94;
text-decoration: none;
}
/* реакция при наведении курсора (меняет цвет) */
.footer a:hover {
color: #fff;
text-decoration: none;
}
.footer p {
padding: 0 0 10px 0;
}