/* Добавить черный цвет фона для верхней навигации */
.topnav {
  background-color: Khaki;
  border-radius: 5px;
  overflow: hidden;
}

/* Стиль ссылок внутри панели навигации */
.topnav a {
  float: left;
  display: block;
  color: DarkRed;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  border-radius: 5px;
}

/* Изменение цвета ссылок при наведении курсора */
.topnav a:hover {
  background-color: Orange;
  color: black;
}

/* Добавить активный класс, чтобы выделить текущую страницу
.topnav a.active {
  background-color: #4CAF50;
  color: white;
}
*/

/* Скрыть ссылку, которая должна открывать и закрывать верхнюю навигационную панель на небольших экранах */
.topnav .icon {
  display: none;
} 
  
 /* Если ширина экрана меньше 600 пикселей, скройте все ссылки, кроме первой ("Главная"). Показать ссылку, которая содержит должен открыть и закрыть верхнюю навигационную панель topnav (.icon) */
@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

/* Класс "responsive" добавляется в верхнюю навигационную панель с помощью JavaScript, когда пользователь нажимает на значок. Этот класс делает topnav хорошо выглядеть на небольших экранах (отображать ссылки по вертикали, а не по горизонтали) */
@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}  



/* dropbatton */

/* Кнопка выпадающего списка */
.dropbtn {
  background-color: Orange;
  color: DarkRed;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
  border-radius: 5px;
}

/* Кнопка выпадающего меню при наведении и фокусировке */
.dropbtn:hover, .dropbtn:focus {
  background-color: DarkOrange;
}

/* Контейнер <div> - необходим для размещения выпадающего содержимого */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Выпадающее содержимое (скрыто по умолчанию) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: Khaki;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-radius: 5px;
}

/* Ссылки внутри выпадающего списка */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  border-radius: 5px;
}

/* Изменение цвета выпадающих ссылок при наведении курсора */
.dropdown-content a:hover {background-color: Orange;}

/* Показать выпадающее меню (используйте JS, чтобы добавить этот класс .dropdown-content содержимого, когда пользователь нажимает на кнопку выпадающего списка) */
.show {display:block;} 

/* dropbatton */



  
  
   .brd {
    text-align: center;
    border: 2px solid DarkRed;
    /*border: 4px double black; Параметры границы */
    background: Khaki; /* Цвет фона */
    padding: 10px; /* Поля вокруг текста */
    border-radius: 10px;
    margin: 5px;
   }

   .user {
    text-align: center;
    border: 2px solid DarkRed;
    /*border: 4px double black; Параметры границы */
    background: Khaki; /* Цвет фона */
    padding: 10px; /* Поля вокруг текста */
    border-radius: 10px;
    margin: 5px;
   }

   .auth {
       text-align: center;
   }
   
   input[type=text], input[type=password] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 10px;
    resize: vertical;
   }

  label {
    padding: 12px 12px 12px 0;
    display: inline-block;
  }

  input[type=submit] {
    background-color: #4CAF50;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    float: right;
  }

  input[type=submit]:hover {
    background-color: #45a049;
  }
  
    button {
    background-color: #4CAF50;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    float: top;
  }

  button:hover {
    background-color: #45a049;
  }
  
  .footer {
      text-align: right;
  }