body {                                      /* Определяем свойства основной страницы*/
    background: #f5f6f7;                 /* Определяем её цвет фона*/    
    color: #1b1b32;                       /* Определяем цвет шрифта*/
    font-family: Helvetica;                 /* Определяем вид шрифта*/
    margin: 0;                              /* Определяем нулевые гранцы от окна браузера*/
  }

  header{
    display: flex;                          /*помещаем все элементы header в один контейнер*/
    width: 100%;                            /*распределяем размер блока на всю ширину страницы*/
    height: 50px;                           /*определяем высоту блока*/
    background-color: #1b1b32;            /*определяем фон блока*/  
  }

  header img{                               /*определяем размер эмблемы*/
    width: 75px;
    height: 50px;
}

.emblema{
    display: flex;
    color: #f5f6f7;
}

nav {                                   /*определяем свойства панели навигации*/
    width: 50%;                         /*ширина*/
    max-width: 600px;                   /*максимальная ширина*/
    height: 50px;                       /*высота*/
    margin-left: auto;                  /*переносим список в крайне правое положение путем задавания отступа*/
}

  nav > ul {                            /*определяем свойства списка в панели навигации*/
    display: flex;
    justify-content: space-evenly;      /*выравниваем элементы списка в блоке  вдоль оси в пределах границ относительно централного элемента*/
    flex-wrap: wrap;                    /*разрешаем перенос элементов списка на другую строку в зависимости от ширины экрана*/
    align-items: center;                /*выравниваем элементы списка вдоль основной оси, в данном случае блоки стоят по центру поперечной оси*/
    padding-inline-start: 0;            /*Определяет начальный внутренний отступ элемента по строчной оси*/
    margin-block: 0;
    height: 100%;
}

  nav > ul > li {                       /*Определяем свойства элементов списка*/
    color: #dfdfe2;
    margin: 0 0.2rem;
    padding: 0.2rem;
    display: block;                     /*Каждый элемент списка выступает как отдельный блок*/
}

  nav > ul > li:hover {                 /*При выборе элемента списка он будет подкрашиватся в заданный цвет,*/
    background-color: #dfdfe2;
    color: #1b1b32;
    cursor: pointer;                    /*меняем вид курсора*/
  }

  li > a {                              /*оформляем ссылки*/
    color: inherit;
    text-decoration: none;
  }