* {
  margin: 0;
}

body {
  margin: 0;
  padding: 0;
  font-family: "Roboto", sans-serif;
}

.nav{
  background-color: #444950;
  color: #ffffff;
  list-style: none;
  text-align: center;
  padding: 20px 0 20px 0;
}

.nav > li {
  display: inline;
  padding: 0 25px 0 25px;
}

.nav > li > a {
  text-decoration: none;
  color: #ffffff;
}

.nav > li > a:hover {
  color: #c1c1c1;
}

p {
  margin: 24px 0;
  line-height: 2;
}

.wrapper {
  padding: 32px;
}

.cookie-container {
  position: fixed;
  bottom: -100%;
  left: 0;
  right: 0;
  background: #2f3640;
  color: #f5f6fa;
  padding: 0 32px;
  box-shadow: 0 -2px 16px rgba(47, 54, 64, 0.39);

  transition: 400ms;
}

.cookie-container.active {
  bottom: 0;
}

.cookie-container a {
  color: #f5f6fa;
}

.cookie-btn {
  background: #46c016;
  border: 0;
  color: #f5f6fa;
  padding: 12px 48px;
  font-size: 18px;
  margin-bottom: 16px;
  border-radius: 8px;
  cursor: pointer;
}