@font-face { 
  font-family: "PFBeauSansPro-Black"; 
  font-weight: bolder; 
  src: url("../fonts/PFBeauSansPro-Black.ttf") format("truetype");
}
.ff-pfbeau-black { font-family: 'PFBeauSansPro-Black'; }

@font-face { 
  font-family: "PFBeauSansPro-Bold"; 
  font-weight: bold; 
  src: url("../fonts/PFBeauSansPro-Bold.ttf") format("truetype");
}
.ff-pfbeau-bold { font-family: 'PFBeauSansPro-Bold'; }

@font-face { 
  font-family: "PFBeauSansPro-Light"; 
  font-weight: lighter; 
  src: url("../fonts/PFBeauSansPro-Light.ttf") format("truetype");
}
.ff-pfbeau-light { font-family: 'PFBeauSansPro-Light'; }

@font-face { 
  font-family: "PFBeauSansPro-Regular"; 
  font-weight: normal;
  src: url("../fonts/PFBeauSansPro-Regular.ttf") format("truetype");
}
.ff-pfbeau-regular { font-family: 'PFBeauSansPro-Regular'; }

@font-face { 
  font-family: "PFBeauSansPro-Semibold"; 
  font-weight: 700;
  src: url("../fonts/PFBeauSansPro-SemiBold.ttf") format("truetype");
}
.ff-pfbeau-semibold { font-family: 'PFBeauSansPro-SemiBold'; }

html body { 
  font-family: 'PFBeauSansPro-Regular';
}

.centered-element {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* rotate: 0 0 1 80deg; */
}

#map
{
  position: absolute;
  width: 100%;
  max-height: 100%;
}

.container-rectangle {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  /* padding: 1rem; */
}

.rectangle {
  display: block;
  width: 100%;
  height: 900px;
  border-radius: 5rem;
  transform: rotate(-8deg) scaleX(1.5) translateX(18%) translateY(-50%);
}

.rectangle-invert {
  display: block;
  width: 100%;
  height: 900px;
  border-radius: 5rem;
  transform: rotate(-8deg) scaleX(1.5) translateX(-18%) translateY(14%);
}

/* TESTIMONIAL SLIDER */
img.avatar {
  transform: translate(-50%, -50%);
}
.swiper-slide {
  opacity: 0;
}
.swiper-slide.swiper-slide-prev, .swiper-slide.swiper-slide-active, .swiper-slide.swiper-slide-next {
  opacity: 1;
}
.swiper-slide.swiper-slide-prev > .group, .swiper-slide.swiper-slide-active > .group, .swiper-slide.swiper-slide-next > .group {
  box-shadow: rgba(0, 0, 0, 0.09) 0px 10px 36px 0px, rgba(0, 0, 0, 0.09) 0px 0px 0px 1px;;
}
.swiper-slide.swiper-slide-active > .group {
  box-shadow: #3EA5E3 0px 3px 12px;
  border-color: #3EA5E3;
}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  width: 16px !important;
  height: 4px !important;
  border-radius: 5px !important;
  margin: 0 6px !important;
}

.swiper-pagination {
  bottom: 2px !important;
}

.swiper-wrapper {
  height: max-content !important;
  width: max-content !important;
  padding-bottom: 64px;
}

.swiper-pagination-bullet-active {
  background: rgb(27, 103, 182) !important;
}

.swiper-slide.swiper-slide-active>.slide_active\:border-indigo-600 {
  border-color: rgb(27, 103, 182);
}

.swiper-slide.swiper-slide-active>.group .slide_active\:text-gray-800 {
  border-color: rgb(27, 103, 182);
}

#svg-container path {
  stroke-dashoffset: 0;
  stroke-dasharray: 0; /* Inicialmente no se ve el trazo */
}
.fill-transparent {
  fill: transparent !important;
}

/* Extra small devices ( phones, 600px and down ) */
@media only screen and (max-width: 600px) {
  .rectangle {
    height: 1100px;
  }
  .rectangle-invert {
    height: 1100px;
    transform: rotate(-8deg) scaleX(1.5) translateX(-15%) translateY(5%);
  }
}
/* Small devices ( portrait tablets and large phones, 600px and down ) */
/* @media only screen and (max-width: 600px) { } */
/* Medium devices ( landscape tablets, 768px and down ) */
@media only screen and (max-width: 768px) { }
/* Large devices ( laptops / desktops, 992px and down ) */
@media only screen and (max-width: 992px) {
  .rectangle {
    height: 1000px;
    transform: rotate(-8deg) scaleX(1.5) translateX(18%) translateY(-40%);
  }
}
/* Extra large devices ( large laptops and desktops, 1200px and down ) */
@media only screen and (max-width: 1200px) { }