@font-face {
  font-family: Georgia;
  src: url(../../assets/fonts/Georgia/static/NotoSansGeorgian/NotoSansGeorgian-Regular.ttf);
}

@font-face {
  font-family: Arial;
  src: url(../../assets/fonts/Arial/ArialMT.woff);
}

body {
  max-width: 1280px;
  margin: 0 auto;
}

.wrapper-1 {
  background: url(../../assets/images/footer-background.png), radial-gradient(100% 215% at 0% 0%, #5B483A 0%, #262425 100%), #211F20;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.header {
  width: 94%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4%;
}

.header_logo h1 {
  margin: 0;
}

.header_logo a {
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 32px;
  line-height: 110%;
  letter-spacing: 0.06em;
  color: #F1CDB3;
  text-decoration: none;
}

.header_logo p {
  font-family: Arial, sans-serif;
  font-size: 13px;
  line-height: 115%;
  letter-spacing: 0.1em;
  color: #FFFFFF;
}

.header_burger {
  display: none;
}

.header_menu {
  display: flex;
  list-style: none;
  gap: 3vw;
}

.header_menu a {
  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 160%;
  color: #CDCDCD;
  text-decoration: none;
}

.header_menu a:hover {
  color: #FAFAFA;
}

.header_menu_a-current {
  border-bottom: 3px solid #F1CDB3;
}

.header_menu_a-current a {
  color: #FAFAFA;
  cursor: default;
}

.not-only {
 width: 94%;
 display: flex;
 justify-content: space-between;
 align-items: center;
 margin-top: 5%;
}

.not-only_text {
  width: 39%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2vw;
  margin-bottom: 10%;
}

.not-only_text h2 {
  width: 67%;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 130%;
  color: #FFFFFF;
  margin: 0;
}

.not-only_text p {
  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 160%;
  color: #CDCDCD;
  margin: 0;
}

.not-only_text button {
  width: 207px;
  height: 52px;
  background: #F1CDB3;
  border-radius: 100px;
  font-family: Georgia, serif;
  font-size: 17px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #292929;
}

.not-only_text button:hover {
  cursor: pointer;
  transition: all 0.3s;
  background: #FDDCC4;
}

.wrapper-2 {
  background: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
}

.about-the-shelter {
  width: 94%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5vw;
  margin: 7% auto;
}

.about-the-shelter_text {
  width: 35%;
}

.about-the-shelter_text h3 {
  width: 90%;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #545454;
}

.about-the-shelter_text p {
  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 160%;
  color: #4C4C4C;
}

.wrapper-3 {
  background: #F6F6F6;
  display: flex;
  justify-content: center;
  align-items: center;
}

.our-friends {
  width: 94%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 7vh;
  margin: 7% auto;
}

.our-friends h3 {
  width: 30%;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 130%;
  letter-spacing: 0.06em;
  text-align: center;
  color: #545454;
  margin: 0;
}

.our-friends_animals {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3vw;
}

.our-friends_animals_arrow-left {
  width: 52px;
  height: 52px;
  border: 2px solid #F1CDB3;
  border-radius: 100px;
}

.our-friends_animals_arrow-left:hover {
  cursor: pointer;
  background: #FDDCC4;
}

.our-friends_animals_katrine {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  background-color: #FAFAFA;
  border-radius: 9px;
}

.our-friends_animals_katrine:hover {
  cursor: pointer;
  background: #FFFFFF;
  box-shadow: 0px 2px 35px 14px rgba(13, 13, 13, 0.04);
}

.our-friends_animals_katrine:hover button {
  background-color: #FDDCC4;
}

.our-friends_animals_katrine p {
  font-family: Georgia, serif;
  text-align: center;
  font-size: 20px;
  line-height: 115%;
  letter-spacing: 0.06em;
  color: #545454;
}

.our-friends_animals_katrine button {
  width: 187px;
  height: 52px;
  border: 2px solid #F1CDB3;
  border-radius: 100px;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #292929;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  margin-bottom: 3vh;
}

.our-friends_animals_katrine button:hover {
  cursor: pointer;
  background-color: #FDDCC4;
}

.our-friends_animals_jennifer {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  background-color: #FAFAFA;
  border-radius: 9px;
}

.our-friends_animals_jennifer:hover {
  cursor: pointer;
  background: #FFFFFF;
  box-shadow: 0px 2px 35px 14px rgba(13, 13, 13, 0.04);
}

.our-friends_animals_jennifer:hover button {
  background: #FDDCC4;
}

.our-friends_animals_jennifer p {
  font-family: Georgia, serif;
  font-weight: 400;
  text-align: center;
  font-size: 20px;
  line-height: 115%;
  letter-spacing: 0.06em;
  color: #545454;
}

.our-friends_animals_jennifer button {
  width: 187px;
  height: 52px;
  border: 2px solid #F1CDB3;
  border-radius: 100px;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #292929;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  margin-bottom: 3vh;
}

.our-friends_animals_jennifer button:hover {
  cursor: pointer;
  background-color: #FDDCC4;
}

.our-friends_animals_woody {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  background-color: #FAFAFA;
  border-radius: 9px;
}

.our-friends_animals_woody:hover {
  cursor: pointer;
  background: #FFFFFF;
  box-shadow: 0px 2px 35px 14px rgba(13, 13, 13, 0.04);
}

.our-friends_animals_woody:hover button {
  background: #FDDCC4;
}

.our-friends_animals_woody p {
  font-family: Georgia, serif;
  font-weight: 400;
  text-align: center;
  font-size: 20px;
  line-height: 115%;
  letter-spacing: 0.06em;
  color: #545454;
}

.our-friends_animals_woody button {
  width: 187px;
  height: 52px;
  border: 2px solid #F1CDB3;
  border-radius: 100px;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #292929;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  margin-bottom: 3vh;
}

.our-friends_animals_woody button:hover {
  cursor: pointer;
  background-color: #FDDCC4;
}

.our-friends_animals_arrow-right {
  width: 52px;
  height: 52px;
  border: 2px solid #F1CDB3;
  border-radius: 100px;
}

.our-friends_animals_arrow-right:hover {
  cursor: pointer;
  background: #FDDCC4;
}

.our-friends_buttons-mobile {
  display: none;
}

.our-friends_button-get {
  width: 261px;
  height: 52px;
  border: 2px solid #F1CDB3;
  background: #F1CDB3;
  border-radius: 100px;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color:#292929;
}

.our-friends_button-get:hover {
  cursor: pointer;
  background: #FDDCC4;
  border: none;
  transition: all 0.3s;
}

.wrapper-4 {
  background: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
}

.help {
  width: 94%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 5vh;
  margin: 7% auto;
}

.help h3 {
  width: 25%;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 130%;
  letter-spacing: 0.06em;
  text-align: center;
  color: #545454;
  margin: 0 auto;
}

.help_images {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 3vw;
}

.help_images figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: Georgia, serif;
  font-size: 20px;
  line-height: 115%;
  letter-spacing: 0.06em;
  text-align: center;
  color: #545454;
}

.wrapper-5 {
  background: #F6F6F6;
  display: flex;
  justify-content: center;
  align-items: center;
}

.in-addition {
  width: 71%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2vw;
  margin: 7% auto;
}

.in-addition_donation {
  display: flex;
  flex-direction: column;
  gap: 2vh;
}

.in-addition_donation h3 {
  width: 80%;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #545454;
  margin: 0;
}

.in-addition_donation h5 {
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 110%;
  letter-spacing: 0.06em;
  color: #545454;
  margin: 0;
}

.in-addition_donation button {
  background: #F1CDB3;
  border: none;
  border-radius: 9px;
  padding: 3%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1vw;
  font-family: Georgia, serif;
  font-size: 20px;
  line-height: 115%;
  letter-spacing: 0.06em;
  color: #545454;
  text-decoration: none;
}

.in-addition_donation button:hover {
  cursor: pointer;
  background: #FDDCC4;
  transition: all 0.3s;
}

.in-addition_donation p {
  font-family: Arial, sans-serif;
  font-style: italic;
  font-size: 12px;
  line-height: 150%;
  color: #B2B2B2;
  margin: 0;
}

.wrapper-6 {
  background: url(../../assets/images/footer-background.png), radial-gradient(100% 215.42% at 0% 0%, #5B483A 0%, #262425 100%), #211F20;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.footer {
  width: 94%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4%;
}

.footer_for-questions {
  width: 25%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 4vh;
}

.footer_for-questions h3 {
  width: 90%;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #FFFFFF;
  margin: 0;
}

.footer_for-questions h4 {
  display: flex;
  margin: 0;
}

.footer_for-questions a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1vw;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 115%;
  letter-spacing: 0.06em;
  color: #F1CDB3;
  text-decoration: none;
}

.footer_we-are-waiting {
  width: 25%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 3vh;
}

.footer_we-are-waiting h3 {
  width: 90%;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 35px;
  line-height: 130%;
  letter-spacing: 0.06em;
  color: #FFFFFF;
  margin: 0;
}

.footer_we-are-waiting h4 {
  display: flex;
  margin: 0;
}

.footer_we-are-waiting a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1vw;
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 115%;
  letter-spacing: 0.06em;
  color: #F1CDB3;
  text-decoration: none;
}



@media (min-width: 768px) and (max-width: 1279px) {
  .not-only {
    flex-direction: column;
  }

  .not-only img {
    width: 75%;
    align-self: flex-end;
  }

  .not-only_text {
    width: 75%;
    gap: 3vh;
  }

  .not-only_text p {
    width: 85%;
  }

  .not-only_text form {
    align-self: center;
  }

  .about-the-shelter {
    flex-direction: column-reverse;
  }

  .about-the-shelter_text {
    width: 59%;
  }

  .our-friends h3 {
    width: 55%;
  }

  .our-friends_animals_woody {
    display: none;
  }

  .help h3 {
    width: 45%;
  }

  .help_images figure {
    width: 20%;
  }

  .in-addition {
    flex-direction: column-reverse;
    align-items: center;
    gap: 5vh;
  }

  .in-addition_donation {
    width: 66%;
  }

  .footer {
    justify-content: center;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 5vh 5vw;
  }

  .footer_for-questions {
    width: 40%;
  }

  .footer_we-are-waiting {
    width: 45%;
    gap: 3.4vh;
  }
}

@media (min-width: 320px) and (max-width: 767px) {
  .header_burger {
    display: inline-block;
  }
  
  .header_menu {
    display: none;
  }

  .not-only {
    flex-direction: column;
  }

  .not-only_text {
    width: 100%;
    align-items: center;
    gap: 5vh;
    margin: 10% auto;
  }

  .not-only_text h2 {
    font-size: 25px;
    text-align: center;
  }

  .not-only_text p {
    text-align: center;
  }

  .not-only img {
    width: 90%;
    align-self: flex-end;
    margin-top: 20%;
  }

  .about-the-shelter {
    flex-direction: column-reverse;
  }

  .about-the-shelter_text {
    width: 90%;
  }

  .about-the-shelter_text h3 {
    font-size: 25px;
    text-align: center;
  }

  .about-the-shelter_text p {
    text-align: justify;
  }

  .about-the-shelter img {
    width: 90%;
  }

  .our-friends h3 {
    width: 90%;
    font-size: 25px;
  }

  .our-friends_animals_arrow-left {
    display: none;
  }

  .our-friends_animals_arrow-right {
    display: none;
  }

  .our-friends_animals_jennifer {
    display: none;
  }

  .our-friends_animals_woody {
    display: none;
  }

  .our-friends_buttons-mobile {
    width: 60%;
    display: flex;
    justify-content: space-between;
  }

  .our-friends_buttons-mobile_arrow-left {
    width: 52px;
    height: 52px;
    border: 2px solid #F1CDB3;
    border-radius: 100px;
  }

  .our-friends_buttons-mobile_arrow-left:hover {
    cursor: pointer;
    background: #FDDCC4;
  }

  .our-friends_buttons-mobile_arrow-right {
    width: 52px;
    height: 52px;
    border: 2px solid #F1CDB3;
    border-radius: 100px;
  }

  .our-friends_buttons-mobile_arrow-right:hover {
    cursor: pointer;
    background: #FDDCC4;
  }

  .help {
    width: 100%;
  }

  .help h3 {
    width: 80%;
    font-size: 25px;
  }

  .help_images {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .help_images figure {
    width: 20%;
    font-size: 15px;
    line-height: 110%;
  }

  .in-addition {
    width: 89%;
    flex-direction: column-reverse;
    gap: 5vh;
  }

  .in-addition_dog {
    width: 90%;
  }

  .in-addition_donation {
    align-items: center;
  }

  .in-addition_donation h3 {
    width: 70%;
    font-size: 25px;
    text-align: center;
  }

  .in-addition_donation h5 {
    width: 100%;
    font-size: 15px;
    text-align: center;
  }

  .in-addition_donation form {
    width: 100%;
  }

  .in-addition_donation button {
    width: 100%;
    font-size: 15px;
    justify-content: center;
    gap: 5vw;
  }

  .in-addition_donation p {
    font-size: 12px;
    text-align: justify;
  }

  .footer {
    flex-direction: column;
    gap: 5vh;
  }

  .footer_for-questions {
    width: 90%;
    align-items: center;
  }

  .footer_for-questions h3 {
    width: 80%;
    font-size: 25px;
    text-align: center;
  }

  .footer_we-are-waiting {
    width: 90%;
    align-items: center;
  }

  .footer_we-are-waiting h3 {
    width: 80%;
    font-size: 25px;
    text-align: center;
  }

  .footer_dog {
    width: 90%;
  }
}