*, *::before, *::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  background-color: rgb(250, 250, 250);
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

.footer {
  display: flex;
  justify-content: space-between;
  padding: 20px 80px;
  align-items: center;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.06);
}

#darkModeBtn {
  display: flex;
  gap: 10px;
  background-color: white;
  border: none
}

.country {
  padding: 45px 80px;
}

#countryList {
  display: grid;
  row-gap: 75px;
  grid-template-columns: repeat(4, 1fr);
  list-style-type: none;
  justify-items: center;
}

.country-item {
  width: 264px;
  box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.03);
  border-radius: 5px;
  /* background: rgba(255, 255, 255, 1); */
}

.country-item img {
  border-radius: 3px 3px 0 0 ;
  width: 100%;
  object-fit: cover;
}

.country-item-inform {
  padding: 24px 91px 48px 24px; 
}

.dark-theme {
  background-color: rgba(32, 44, 54, 1);
  color: rgba(255, 255, 255, 1);
}

.dark-theme .country-item {
  box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.03);
}

.dark-theme .country-item-inform{
  background: rgba(43, 56, 68, 1);
}

.dark-theme .footer {
  background: rgba(43, 56, 68, 1);
}

.dark-theme #darkModeBtn {
  background: rgba(43, 56, 68, 1);
  color: rgba(255, 255, 255, 1);
}