* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

html::-webkit-scrollbar {
  display: none;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
}

ul,
ol,
li {
  list-style-type: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  padding: 0;
  font-size: inherit;
}

button,
.button {
  border: inherit;
  color: inherit;
}

body {
  font-family: "Gilroy";
}

.container {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
}

@font-face {
  font-family: "Gilroy";
  src: url(/SRC/fonts/Gilroy-Bold.ttf);
  font-weight: 400;
}
@font-face {
  font-family: "Gilroy";
  src: url(/SRC/fonts/Gilroy-Medium.ttf);
  font-weight: 500;
}
@font-face {
  font-family: "Gilroy";
  src: url(/SRC/fonts/Gilroy-Regular.ttf);
  font-weight: 600;
}
@font-face {
  font-family: "Gilroy";
  src: url(/SRC/fonts/Gilroy-SemiBold.ttf);
  font-weight: 700;
}
.body10-regular {
  /* Body/10px Regular */
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

.body10-bold {
  /* Body/10px Bold */
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
}

.body12-medium, #adaption p {
  /* Body/12px Medium */
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
}

.body12-bold {
  /* Body/12px Medium */
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
}

.body14-regular {
  /* Body/14px Regular */
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.body14-medium {
  /* Body/14px Medium */
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.body14-bold {
  /* Body/14px Bold */
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}

.body16-medium, .site__banner .banner-title p, #header p {
  /* Body/16px Medium */
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.body16-bold {
  /* Body/16px Bold */
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

.section-title {
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px;
  text-transform: capitalize;
}

#header {
  background-color: #fceed5;
  height: 700px;
  overflow: hidden;
  position: relative;
}
#header .container .navbar {
  display: flex;
  justify-content: space-between;
  padding: 20px;
}
#header .container .navbar ul {
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 25px;
}
#header .container .navbar ul li {
  display: flex;
  list-style: none;
}
#header .container .navbar ul li a {
  text-decoration: none;
  color: #002a48;
  padding: 10px;
}
#header .container .navbar ul li:hover {
  color: blue;
}
#header .container .navbar .search {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}
#header .container .navbar .search .search-input {
  border-radius: 50px;
  border: none;
  font-weight: 500;
  font-size: 14px;
  text-align: center;
  width: 250px;
  height: 40px;
  background-image: url(/SRC/Monito-icons/u_search.png);
  background-repeat: no-repeat;
  background-position: 4% 50%;
}
#header .container .navbar .search .primary-btn {
  text-decoration: none;
  border-radius: 50px;
  background-color: #003459;
  color: #fff;
  padding-top: 10px;
  width: 200px;
  height: 40px;
  text-align: center;
}
#header .showcase {
  width: 1200px;
  position: relative;
  display: flex;
  flex-direction: column;
  margin-top: 80px;
}
#header .showcase .show-main {
  margin-left: 30px;
}
#header h1,
#header h2 {
  margin-top: 50px;
  font-size: 60px;
  font-style: normal;
  font-weight: 100;
  line-height: 68px;
  color: #002a48;
  position: relative;
}
#header h1 {
  z-index: 1;
}
#header h2 {
  margin-top: 4px;
  font-size: 46px;
  line-height: 60px;
}
#header p {
  width: 480px;
  margin: 24px 0 34px;
  color: #002a48;
}
#header .main-img {
  position: absolute;
  width: 1100px;
  height: 700px;
  z-index: 1;
  left: 360px;
  top: -60px;
}
#header .hero-btns {
  font-size: 16px;
  font-weight: 500;
  margin-top: 30px;
}
#header .hero-btns a {
  border-radius: 50px;
  border: 1px;
  padding: 12px 30px;
  border: 1.5px solid #003459;
}
#header .hero-btns .explore {
  color: white;
  background-color: #003459;
  margin-left: 25px;
}
#header .frame {
  z-index: 1;
}
#header .background .box1 {
  position: absolute;
  width: 635px;
  height: 635px;
  border-radius: 99px;
  background-color: #f7dba7;
  top: -750px;
  left: -400px;
  rotate: 20.23deg;
}
#header .background .box2 {
  position: absolute;
  width: 70px;
  height: 70px;
  top: 45px;
  left: 20px;
  border-radius: 20px;
  rotate: 25.23deg;
  background-color: #f7dba7;
}
#header .background .box3 {
  position: absolute;
  width: 15px;
  height: 15px;
  top: 5px;
  left: 700px;
  border-radius: 4px;
  rotate: 20deg;
  background-color: #f7dba7;
}
#header .background .box4 {
  position: absolute;
  background-color: #f7dba7;
  border-radius: 9px;
  width: 28px;
  height: 28px;
  top: 70px;
  left: 660px;
  rotate: -22deg;
}
#header .background .box5 {
  position: absolute;
  width: 22px;
  height: 22px;
  top: 80px;
  left: 660px;
  background-color: #003459;
  border-radius: 6px;
  rotate: -43deg;
}
#header .background .box6 {
  position: absolute;
  width: 635px;
  height: 635px;
  top: 190px;
  left: 600px;
  border-radius: 99px;
  rotate: 10deg;
  background-color: #003459;
}
#header .background .box7 {
  position: absolute;
  width: 635px;
  height: 635px;
  top: 150px;
  left: 650px;
  border-radius: 99px;
  rotate: 25deg;
  background-color: #f7dba7;
}
#header .background .box8 {
  position: absolute;
  width: 635px;
  height: 635px;
  top: 690px;
  left: 200px;
  border-radius: 99px;
  rotate: 58deg;
  background-color: #f7dba7;
}

#our-pets {
  margin-top: 100px;
}
#our-pets .our-pets {
  height: 990px;
}
#our-pets .our-pets .hero {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#our-pets .our-pets p {
  font-weight: 500;
  font-size: 16px;
  color: #667479;
}
#our-pets .our-pets h3 {
  font-weight: 700;
  font-size: 24px;
  line-height: 36px;
  color: #002a48;
  text-transform: capitalize;
}
#our-pets .our-pets .view {
  color: #003459;
  background-color: #fff;
}
#our-pets .our-pets .view a {
  border-radius: 50px;
  padding: 10px 30px;
  margin-top: 35px;
  border: 1.5px solid #003459;
}
#our-pets .our-pets .pets-card {
  margin-top: 48px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  row-gap: 30px;
}
#our-pets .our-pets .pets-card .pet-cards {
  width: 270px;
  border: 1px solid #fff;
  box-shadow: 0px 4px 28px -2px rgba(0, 0, 0, 0.08);
  background-color: #fdfdfd;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 8px;
  border-radius: 12px;
}
#our-pets .our-pets .pets-card .pet-cards img {
  width: 265px;
  height: 265px;
  border-radius: 10px;
  top: 150px;
}
#our-pets .our-pets .pets-card .pet-cards .pets-status {
  display: flex;
  justify-content: space-between;
  align-items: start;
  flex-direction: column;
}
#our-pets .our-pets .pets-card .pet-cards .pets-status .body12-medium, #our-pets .our-pets .pets-card .pet-cards .pets-status #adaption p, #adaption #our-pets .our-pets .pets-card .pet-cards .pets-status p {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  margin: 8px;
}
#our-pets .our-pets .pets-card .pet-cards .pets-status .body14-bold {
  margin-left: 8px;
}
#our-pets .our-pets .pets-card .pet-cards .pets-status .body16-bold {
  padding-left: 8px;
  padding-top: 8px;
}
#our-pets .our-pets .pets-card .pet-cards .pets-status .dot {
  width: 4px;
  height: 4px;
  background-color: #667479;
  border-radius: 50%;
}
#our-pets .our-pets .pets-card .pet-cards .pets-status span {
  font-weight: 700;
}

.site__banner {
  display: flex;
  justify-content: space-between;
  border: 1px;
  border-radius: 20px;
  background-color: #003459;
  position: relative;
  overflow: hidden;
}
.site__banner .banner-title {
  padding: 65px 100px;
  z-index: 15;
  width: 60%;
  text-align: end;
}
.site__banner .banner-title h1,
.site__banner .banner-title h2 {
  font-size: 60px;
  font-style: normal;
  font-weight: 100;
  line-height: 68px;
  color: #002a48;
}
.site__banner .banner-title h3 {
  margin-top: 4px;
  font-size: 40px;
  line-height: 60px;
  color: #002a48;
}
.site__banner .banner-title p {
  font-size: 12px;
  margin: 8px 10px;
  color: #002a48;
}
.site__banner .explore-img {
  position: relative;
  width: 515px;
  height: 345px;
  z-index: 250;
  top: 65px;
  left: 40px;
}
.site__banner .right-effect {
  position: absolute;
  border: 1px solid #fceed5;
  border-radius: 99px;
  background-color: #fceed5;
  width: 785px;
  height: 635px;
  rotate: 25.23deg;
  top: -205px;
  left: 575px;
}
.site__banner .left-effect {
  position: absolute;
  background-color: #002a48;
  border: 1px solid #002a48;
  border-radius: 99px;
  width: 788px;
  height: 788px;
  rotate: 35deg;
  top: 200px;
  left: -225px;
}

.banner-btns {
  font-size: 16px;
  font-weight: 500;
  margin-top: 40px;
}
.banner-btns a {
  border-radius: 50px;
  border: 1px;
  padding: 10px 30px;
  border: 1.5px solid #003459;
  margin-left: 10px;
}
.banner-btns .explore-btn {
  color: white;
  background-color: #003459;
}

#our-products .site-our-products {
  margin: 0 auto;
  margin-top: 60px;
}
#our-products .site-our-products .our-products__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#our-products .site-our-products .our-products__title .section-title {
  font-weight: 700;
  color: #003459;
  font-size: 24px;
  line-height: 36px;
}
#our-products .site-our-products .our-products__title .view-btn {
  border-radius: 50px;
  border: 1px;
  padding: 10px 30px;
  border: 1.5px solid #003459;
}
#our-products .site-our-products .our-products-cards {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  row-gap: 30px;
  margin-top: 30px;
}
#our-products .site-our-products .our-products-cards .our-product-card {
  width: 270px;
  border: 1px solid #fff;
  box-shadow: 0px 4px 28px -2px rgba(0, 0, 0, 0.08);
  background-color: #fdfdfd;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 8px;
  border-radius: 12px;
}
#our-products .site-our-products .our-products-cards .our-product-card img {
  border-radius: 10px;
  top: 150px;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status {
  display: flex;
  justify-content: space-between;
  align-items: start;
  flex-direction: column;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status .body12-medium, #our-products .site-our-products .our-products-cards .our-product-card .product-status #adaption p, #adaption #our-products .site-our-products .our-products-cards .our-product-card .product-status p {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  margin: 8px;
  color: #667479;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status .body14-bold {
  margin: 0 0 8px 8px;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status .body16-bold {
  padding: 8px 0 0 8px;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status .free-gift {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 240px;
  height: 34px;
  padding: 7px;
  border: 1px solid #fceed5;
  border-radius: 8px;
  background-color: #fceed5;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status .free-gift .gift {
  width: 20px;
  height: 20px;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status .free-gift .body14-bold {
  margin: 0;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status .dot {
  width: 4px;
  height: 4px;
  background-color: #000000;
  border-radius: 50%;
}
#our-products .site-our-products .our-products-cards .our-product-card .product-status span {
  font-weight: 700;
}

.site-partners {
  margin: 0 auto;
  margin-top: 90px;
}
.site-partners .site-partners__title .title-content {
  display: flex;
  align-items: center;
}
.site-partners .site-partners__title .title-content p {
  font-weight: 500;
  font-size: 16px;
  line-height: 30px;
}
.site-partners .site-partners__title .title-content .section-title {
  font-weight: 700;
  font-size: 24px;
  line-height: 36px;
  color: #003459;
  margin-left: 8px;
}
.site-partners .site-partners__title .view-btn {
  margin-left: 995px;
  border-radius: 50px;
  border: 1px;
  padding: 10px 30px;
  border: 1.5px solid #003459;
  font-weight: 500;
  font-size: 14px;
}
.site-partners .our-partners {
  margin-top: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#adaption .site-adoption {
  width: 100%;
  height: 378px;
  border-radius: 20px;
  background: #ffb775;
  display: flex;
  margin-top: 40px;
  flex-direction: column;
  justify-content: center;
  padding-left: 80px;
  position: relative;
  overflow: hidden;
}
#adaption .site-adoption__title {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 200;
  margin-top: 20px;
}
#adaption h2 {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 52px;
  font-style: bold;
  font-weight: 100;
  line-height: 68px;
  text-transform: capitalize;
  color: #003459;
}
#adaption h3 {
  font-size: 36px;
  font-style: normal;
  font-weight: 200;
  line-height: 54px;
  text-transform: capitalize;
  color: #003459;
}
#adaption p {
  margin: 8px 0 42px;
  color: #242b33;
  font-size: 16px;
}
#adaption .adoption-btns {
  display: flex;
  gap: 20px;
}
#adaption .adoption-btns a {
  border-radius: 50px;
  border: 1px;
  padding: 12px 30px;
  border: 1.5px solid #003459;
}
#adaption .adoption-btns .explore-btn {
  color: white;
  background-color: #003459;
}

.adoption-effect-one {
  width: 782.292px;
  height: 635px;
  rotate: -25deg;
  top: -200px;
  left: -250px;
  border-radius: 99px;
  position: absolute;
  background-color: #fceed5;
}

.adoption-effect-two {
  width: 787.54px;
  height: 787.54px;
  rotate: -30deg;
  top: 170px;
  left: 590px;
  border-radius: 99px;
  background-color: #fbd58f;
  position: absolute;
}

.adoption-img {
  position: absolute;
  rotate: -355deg;
  width: 600px;
  height: 400px;
  z-index: 100;
  left: 590px;
}

#useful-knowledge .pets-knowledge {
  margin-top: 60px;
}
#useful-knowledge .pets-knowledge .pets-knowledge__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#useful-knowledge .pets-knowledge .pets-knowledge__title .section-title {
  font-weight: 700;
  color: #003459;
  font-size: 24px;
  line-height: 36px;
}
#useful-knowledge .pets-knowledge .view-btn {
  border-radius: 50px;
  border: 1px;
  padding: 10px 30px;
  border: 1.5px solid #003459;
}
#useful-knowledge .pets-knowledge .knowledge-cards {
  row-gap: 30px;
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#useful-knowledge .pets-knowledge .knowledge-cards .knowledge-card {
  width: 380px;
  height: 425px;
  border: 1px solid #fff;
  box-shadow: 0px 4px 28px -2px rgba(0, 0, 0, 0.08);
  background-color: #fdfdfd;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 8px;
  border-radius: 12px;
}
#useful-knowledge .pets-knowledge .knowledge-cards .knowledge-card .img {
  width: 365px;
  height: 245px;
}
#useful-knowledge .pets-knowledge .knowledge-cards .knowledge-card img {
  border-radius: 10px;
  top: 150px;
  width: 100%;
  height: 100%;
}
#useful-knowledge .pets-knowledge .knowledge-status {
  display: flex;
  justify-content: space-between;
  align-items: start;
  flex-direction: column;
  margin-left: 8px;
}
#useful-knowledge .pets-knowledge .knowledge-status .body10-bold {
  margin-top: 16px;
  background-color: #00a7e7;
  border-radius: 28px;
  color: #fff;
  padding: 2px 10px;
}
#useful-knowledge .pets-knowledge .knowledge-status .body16-bold {
  margin: 10px 0 6px 0;
}

#footer {
  background-color: #ffe7ba;
  border-top-left-radius: 40px;
  border-top-right-radius: 40px;
}
#footer .footer {
  width: 1440px;
  height: 440px;
  margin-top: 60px;
  position: relative;
}
#footer .Our-programs {
  position: absolute;
  width: 1050px;
  height: 136px;
  background-color: #003459;
  border-radius: 16px;
  margin: 80px 70px;
}
#footer .Our-programs .section-title {
  position: absolute;
  color: #fdfdfd;
  align-items: start;
  margin: 32px;
}
#footer .Our-programs .subscribe {
  position: absolute;
  right: 32px;
  top: 32px;
  background-color: #fff;
  border-radius: 14px;
}
#footer .Our-programs .subscribe .subscribe-input {
  width: 400px;
  height: 48px;
  border-radius: 50px;
  border: 1px solid #99a2a5;
  border-radius: 8px;
  padding: 0 20px;
  margin: 12px;
  left: 20px;
}
#footer .Our-programs .subscribe .subscribe-btn {
  width: 400px;
  height: 48px;
  border-radius: 50px;
  border: 1px;
  border-radius: 8px;
  background-color: #003459;
  color: #fdfdfd;
  font-weight: 600;
  cursor: pointer;
  margin: 12px;
  padding: 15px 30px;
}
#footer .footer-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 200px 10px 0;
}
#footer .body16-medium, #footer #header p, #header #footer p, #footer .site__banner .banner-title p, .site__banner .banner-title #footer p {
  color: #00171f;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
}
#footer .our-social-networks {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
}
#footer .horizontal {
  border: 1px solid #a7abac;
  border-radius: 1px;
  width: 1040px;
  height: 0.5px;
  margin-top: 40px;
}
#footer .footer-end {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 40px 130px;
}
#footer .footer-end p {
  margin-left: -120px;
}
#footer .footer-end .privacy {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-right: -120px;
}
#footer .footer-end .body14-medium {
  color: #667479;
}/*# sourceMappingURL=main.css.map */