* {
  box-sizing: border-box;
  margin: 0px;
  padding: 0px;
}

body {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  background: #ffffff;
  color: #000000;
  font-size: 16px;
  line-height: 1.4;
  overflow-x: hidden;
}
a,
a:hover {
  color: inherit;
  text-decoration: none;
}

ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
img {
  max-width: 100%;
}
button {
  border: none;
  outline: none;
  box-shadow: none;
}
textarea:focus,
input:focus {
  border: none;
  outline: none;
  box-shadow: none;
}
::selection {
  color: white;
  background: #ff7675;
}

::-webkit-selection {
  color: white;
  background: #ff7675;
}

::-moz-selection {
  color: white;
  background: #ff7675;
}

.container_box {
  max-width: 1440px;
  width: 100%;
  padding: 0px 60px;
  margin: 0px auto;
}
.header_area {
  padding: 12px 0px;
  box-shadow: 0px 2px 4px 0px #00000033;
  background: #ffffff;
}
.page-header {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  padding: 13px 0;
  z-index: 1;
  background: #ffffff;
}
.page-header.is-sticky {
  position: fixed;
  box-shadow: 0px 2px 4px 0px #00000033;
  padding: 12px 0;
  backdrop-filter: blur(10px);
  animation: slideDown 0.35s ease-out;
}

@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}
.header_area .header_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo_box img {
  max-width: 166px;
  width: 100%;
}
.banner_img {
  line-height: 0;
  padding-top: 80px;
}
.banner_img img {
  width: 100%;
  margin: 0px auto;
}

.popup_content .donate_btn,
.header_btn button {
  display: block;
  width: 160px;
  color: #ffffff;
  background: #282057;
  padding: 14px;
  cursor: pointer;
  border-radius: 100px;
  text-align: center;
  transition: 0.2s ease-in-out;
}

.popup_content .donate_btn:hover,
.header_btn button:hover {
  background: #7263a2;
}
.section_gap {
  padding: 70px 0px;
}
.section_gap_bottom {
  padding-bottom: 80px;
}
.violete_bg {
  background: #282057;
  color: #ffffff;
}
.row_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.video_content,
.video_box {
  width: 48%;
}
.video_box iframe {
  width: 100%;
  height: 374px;
  border-radius: 20px;
}
.video_content p strong {
  font-size: 24px;
}
.video_content p {
  font-size: 20px;
  margin-bottom: 26px;
}
.video_content_list ul li {
  margin-bottom: 4px;
  display: block;
}
.video_content_list span {
  display: block;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
}
.heading_box p {
  font-size: 24px;
}
.heading_box h1 {
  font-size: 36px;
  font-weight: 700;
  text-align: center;
  color: #55407d;
  text-transform: uppercase;
}
.heading_box {
  margin-bottom: 40px;
  text-align: center;
}
.number_title {
  padding: 10px 20px;
  text-align: center;
  background: #55407d;
  color: #ffffff;
}

.number_title h2 {
  font-size: 36px;
  font-weight: 400;
  text-align: center;
  text-transform: uppercase;
}
.number_row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.number_item {
  padding: 10px;
  width: 30%;
  flex: 0 0 30%;
  margin: 0px auto;
  text-align: center;
  margin-bottom: 26px;
}

.number_item p {
  font-size: 20px;
  font-weight: 400;
  text-align: center;
}
.number_item span {
  color: #55407d;
  font-size: 90px;
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
}

.slider_box {
  display: flex;
  align-items: center;
  justify-content: center;
}
.wrapper {
  width: 90%;
  position: relative;
}
.wrapper button {
  top: 50%;
  height: 60px;
  width: 60px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  position: absolute;
  text-align: center;
  line-height: 50px;
  background: transparent;
  border-radius: 50%;
  box-shadow: none;
  transform: translateY(-50%);
  transition: transform 0.1s linear;
}
.wrapper button:active {
  transform: translateY(-50%) scale(0.85);
}
.wrapper button:first-child {
  left: -80px;
}
.wrapper button:last-child {
  right: -80px;
}
.wrapper button img {
  max-width: 30px;
}
.wrapper .carousel {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% / 3) - 17px);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 26px;
  border-radius: 8px;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.carousel::-webkit-scrollbar {
  display: none;
}
.carousel.no-transition {
  scroll-behavior: auto;
}
.carousel.dragging {
  scroll-snap-type: none;
  scroll-behavior: auto;
}
.carousel.dragging .card {
  cursor: grab;
  user-select: none;
}
.carousel :where(.card, .img) {
  display: flex;
  justify-content: center;
  align-items: center;
}
.carousel .card {
  scroll-snap-align: start;
  list-style: none;
  background: #fff;
  cursor: pointer;
  padding-bottom: 15px;
  flex-direction: column;
  border-radius: 8px;
}
.carousel .card .img {
  background: #8b53ff;
  height: 148px;
  width: 148px;
  border-radius: 50%;
}
.card img {
  max-width: 100%;
  margin: 0px auto;
  border-radius: 16px;
  overflow: hidden;
}

@media screen and (max-width: 900px) {
  .wrapper .carousel {
    grid-auto-columns: calc((100% / 2) - 9px);
  }
}

@media screen and (max-width: 600px) {
  .wrapper .carousel {
    grid-auto-columns: 100%;
  }
}

.footer_area {
  padding: 20px 0px;
  background: #282057;
  color: #ffffff;
}

.copyright_info,
.footer_row {
  display: flex;
  align-items: center;
  justify-content: center;
}
.copyright_info span {
  display: block;
  margin: 0px 8px;
}
.social_links {
  display: flex;
  align-items: center;
  justify-content: center;
}

.social_links li a img {
  max-width: 100%;
  margin: 0px auto;
  line-height: 1;
}
.social_links li a {
  display: block;
  line-height: 0;
}

.social_links li {
  margin: 0px 10px;
}
.mobile_block {
  display: none;
}
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 40px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  display: none;
  align-items: center;
  justify-content: center;
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0, 0, 0); /* Fallback color */
  background-color: rgba(0, 0, 0, 0.9); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 36px 20px;
  border: 1px solid #888;
  width: 90%;
  max-width: 500px;
  text-align: center;
  border-radius: 20px;
}

/* The Close Button */
.close {
  color: #ffffff;
  font-size: 34px;
  font-weight: bold;
  width: 40px;
  height: 40px;
  line-height: 40px;
  position: absolute;
  top: -16px;
  right: -16px;
  background: #282057;
  border-radius: 50%;
}

.close:hover,
.close:focus {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}

.popup_content .container-radio {
  font-weight: 600;
  font-size: 26px;
  display: block;
  max-width: 165px;
  margin: 0px auto 16px;
  cursor: pointer;
  text-align: left;
}
.popup_content input[type="radio"] {
  margin-right: 10px;
  margin-bottom: 6px;
}
.popup_content input[type="radio"]:after {
  width: 18px;
  height: 18px;
  border-radius: 15px;
  top: -8px;
  left: -4px;
  position: relative;
  background-color: #ffffff;
  content: "";
  display: inline-block;
  visibility: visible;
  border: 3px solid #55407d;
}

.popup_content input[type="radio"]:checked:after {
  width: 18px;
  height: 18px;
  border-radius: 15px;
  top: -8px;
  left: -4px;
  position: relative;
  background-color: #55407d;
  content: "";
  display: inline-block;
  visibility: visible;
  border: 3px solid #55407d;
}
.popup_content p {
  font-size: 20px;
  margin-bottom: 16px;
}

.popup_content .donate_btn {
  margin: 10px auto 0px;
}
.whatsapp_box {
  position: fixed;
  bottom: 40%;
  right: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: right;
}

.whatsapp_box a {
  transition: 0.2s ease-in-out;
}
.whatsapp_box a img {
  max-width: 80px;
  margin: 0px;
  transition: 0.2s ease-in-out;
}
.whatsapp_box a img:hover {
  transform: scale(1.1);
}
.whatsapp_btn {
  margin-right: 60px;
}

.btn_sede {
  text-align: right;
  width: 100%;
  margin-right: 20px;
}