/*!*******************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/App.scss ***!
  \*******************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
/*!***********************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/App.scss (1) ***!
  \***********************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Karla:wght@200;300;400;500;600;700;800&display=swap);
/*!*************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Logo/Logo.scss ***!
  \*************************************************************************************************************************/
.Logo {
  width: 153px;
  max-width: 100%;
}
/*!*************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/UserButton/UserButton.scss ***!
  \*************************************************************************************************************************************/
.UserButton #dropdown-item-button {
  padding: 0.5rem;
  margin: 0;
  height: 40px;
  background: var(--orange-color);
  border-radius: 6px;
  border: none;
  -webkit-transition: all ease 0.3s;
  transition: all ease 0.3s;
  color: #fff !important;
  font-weight: 400;
  font-size: var(--font-boton);
}
@media (max-width: 950px) {
  .UserButton #dropdown-item-button {
    background: transparent;
    border: none;
  }
}
.UserButton .dropdown-item.active,
.UserButton .dropdown-item:active {
  background-color: var(--orange-color);
}
.UserButton .dropdown-item.active a,
.UserButton .dropdown-item:active a {
  color: var(--white) !important;
}
.UserButton .dropdown-menu.show {
  min-width: 12rem;
}
.UserButton .dropdown-menu.show .dropdown-item-text span {
  font-style: italic;
}
.UserButton .dropdown-menu.show a {
  text-decoration: none !important;
  color: var(--dark-color);
}
/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Navbar/Menu.scss ***!
  \***************************************************************************************************************************/
.bg-onScroll {
  background-color: rgba(0, 0, 0, 0.842) !important;
}

.Navbar {
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 2em 3em;
  z-index: 5;
  background-color: transparent;
  position: fixed;
  top: 0;
  width: 100%;
  transition: 0.5s all ease;
  height: 5rem !important;
  background-color: rgba(255, 255, 255, 0);
}
.Navbar.initial {
  background-color: rgba(0, 0, 0, 0.4117647059);
}
.Navbar.hmaxcontent {
  height: max(200px, 25%);
}
.Navbar:hover {
  background-color: rgba(0, 0, 0, 0.4117647059);
}
.Navbar .title {
  font-weight: 600;
  font-size: var(--font-grande);
}
.Navbar ul.links {
  display: flex;
  gap: 0 4rem;
  justify-content: space-around;
  align-items: center;
  list-style: none;
  opacity: 1;
  transition: all ease 0.5s;
}
@media (max-width: 1090px) {
  .Navbar ul.links {
    gap: 0 2rem;
  }
}
.Navbar ul.links.initial {
  opacity: 1;
}
.Navbar ul.links.show {
  opacity: 1;
}
.Navbar ul.links li.link {
  transition: all ease 0.5s;
}
.Navbar ul.links li.link.hassublinks {
  display: flex;
  align-items: center;
  flex-direction: column;
}
.Navbar ul.links li.link ul.sublinks {
  display: none;
  transition: all ease 0.3s;
}
.Navbar ul.links li.link ul.sublinks.showSublinks {
  opacity: 1;
}
.Navbar ul.links li.link ul.sublinks.hideSublinks {
  opacity: 0;
}
.Navbar ul.links li.link:hover {
  position: relative;
}
.Navbar ul.links li.link:hover .linkTitle:before {
  width: 100%;
}
.Navbar ul.links li.link:hover ul.sublinks {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  position: absolute;
  background: rgba(43, 43, 43, 0.788);
  top: 105%;
  border-radius: 12px;
  width: 13rem;
  z-index: 2;
}
.Navbar ul.links li.link:hover ul.sublinks .sublink {
  position: relative;
  list-style: none;
  transition: 0.5s;
  width: 100%;
  border-radius: 12px;
}
.Navbar ul.links li.link:hover ul.sublinks .sublink:hover {
  background-color: var(--orange-color-transparent);
}
.Navbar ul.links li.link:hover ul.sublinks .sublink a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  width: 100%;
  height: 100%;
  color: #fff;
}
.Navbar ul.links li.link a {
  text-decoration: none;
  outline: none;
  color: rgb(255, 255, 255);
  position: relative;
  font-weight: 400;
  font-size: var(--font-mediana);
}
.Navbar ul.links li.link a::before {
  content: "";
  position: absolute;
  width: 0%;
  transition: all 0.3s ease-in;
  height: 20px;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  bottom: -17%;
  text-align: center;
}
.Navbar ul.links li.link a:hover::before {
  width: 100%;
}
@media (max-width: 1094px) {
  .Navbar {
    grid-template-columns: 17% 83%;
  }
}
@media (max-width: 950px) {
  .Navbar {
    display: none;
  }
}

.fadeIn {
  animation: fadeIn ease 0.8s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Navbar/MenuMobile.scss ***!
  \*********************************************************************************************************************************/
.Navbar-bottom {
  display: none;
}
@media (max-width: 950px) {
  .Navbar-bottom {
    display: inline-block;
    position: fixed;
    top: 0px;
    height: 3.5rem;
    width: 100%;
    z-index: 5;
    align-items: center;
  }
  .Navbar-bottom .menu {
    width: 100%;
    display: inline-block;
    position: fixed;
    bottom: 0;
    transition: height ease-out 0.5s;
    background: var(--grey-color);
    display: flex;
    justify-content: center;
  }
  .Navbar-bottom .menu.abierto {
    transition: height ease-out 0.5s;
    height: 100%;
    z-index: 4;
    animation: show 0.5s ease-out alternate;
    padding-top: 3.5rem;
    overflow: scroll;
    overscroll-behavior: contain;
  }
  .Navbar-bottom .menu.abierto .sublinks {
    list-style: none;
    width: 100%;
    padding: 1rem;
  }
  .Navbar-bottom .menu.abierto .sublinks li.link:not(.hassublinks) {
    height: 5rem;
  }
  .Navbar-bottom .menu.abierto .sublinks .link {
    position: relative;
    font-size: var(--font-mediana);
    width: 100%;
    padding: 2%;
    display: flex;
    align-items: center;
    align-content: center;
    min-width: 50px;
    min-height: 5rem;
  }
  .Navbar-bottom .menu.abierto .sublinks .link a {
    text-decoration: none;
    outline: none;
    color: white;
    position: relative;
    font-weight: 700;
    padding: 3%;
  }
  .Navbar-bottom .menu.abierto .sublinks .link::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    background: var(--dark-color);
    height: 2px;
  }
  .Navbar-bottom .menu.abierto .sublinks .link.hassublinks {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    padding-left: 5%;
    justify-content: center;
  }
  .Navbar-bottom .menu.abierto .sublinks .link.hassublinks .linkfather {
    padding: 0;
    color: white;
    position: relative;
    font-weight: 700;
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .Navbar-bottom .menu.abierto .sublinks .link.hassublinks .sublinks {
    display: flex;
    flex-direction: column;
    height: 0%;
    opacity: 0;
    overflow: hidden;
    transition: all ease-out 0.3s;
    animation: forwards hide 0.2s ease-out;
  }
  .Navbar-bottom .menu.abierto .sublinks .link.hassublinks .sublinks .sublink a {
    padding: 0;
    font-weight: 700;
    font-weight: normal;
    margin: 3% 0;
  }
  .Navbar-bottom .menu.abierto .sublinks .link.hassublinks .sublinks .sublink::marker {
    color: transparent !important;
  }
  .Navbar-bottom .menu.abierto .sublinks .link.hassublinks .sublinks.showsublink {
    height: 100%;
    animation: forwards show 0.2s ease-out !important;
    opacity: 1;
  }
  .Navbar-bottom .menu.cerrado {
    transition: height ease 0.5s;
    height: 0%;
    animation: forwards hide 0.5s ease;
  }
  .Navbar-bottom .menu.cerrado .sublinks {
    display: none;
  }
  .Navbar-bottom .menu.oculto {
    height: 0%;
    transition: none;
  }
  .Navbar-bottom .Navbar-bottom_container {
    position: relative;
    height: 100%;
    background: rgba(0, 0, 0, 0.842);
    z-index: 5;
  }
  .Navbar-bottom .Navbar-bottom_container .logoContenedor {
    position: relative;
    top: -39%;
    background: rgb(0, 0, 0);
    border-radius: 100%;
    aspect-ratio: 1;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .Navbar-bottom .Navbar-bottom_container .logoContenedor .logo {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .Navbar-bottom .Navbar-bottom_container .logoContenedor .logo img {
    height: clamp(70px, 30vw, 90px);
    width: clamp(70px, 30vw, 90px);
  }
  .Navbar-bottom .Navbar-bottom_container > ul.links {
    width: 100%;
    list-style: none;
    height: 100%;
    padding: 0 2rem !important;
    display: flex;
    justify-content: flex-end;
    gap: 0 1rem;
    align-items: center;
  }
  .Navbar-bottom .Navbar-bottom_container > ul.links .logo-navbar-mobile {
    display: grid;
    place-items: center;
    width: 20%;
    margin-right: auto;
  }
  .Navbar-bottom .Navbar-bottom_container > ul.links .logo-navbar-mobile .Logo {
    max-height: 3rem;
    width: auto;
  }
  .Navbar-bottom .Navbar-bottom_container > ul.links li.link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
  }
  .Navbar-bottom .Navbar-bottom_container > ul.links li.link .icon {
    font-size: 2rem;
    color: var(--black-color);
  }
  .Navbar-bottom .Navbar-bottom_container > ul.links li.link .navlink {
    color: #fff;
    font-size: 1.3rem;
    text-decoration: none;
    outline: none;
    font-size: var(--font-normal);
    font-weight: 500;
  }
}

.close {
  transition: height ease 0.2s;
  height: 0%;
  animation: forwards hide 0.2s ease;
}

.open {
  transition: height ease 0.2s;
  height: 100%;
  animation: forwards show 0.2s ease;
}

@keyframes show {
  0% {
    height: 0%;
  }
  100% {
    height: 100%;
  }
}
@keyframes hide {
  0% {
    height: 100%;
  }
  100% {
    height: 0%;
  }
}
.arrowMobile {
  transition: all ease 0.5s;
  transform: rotate(180deg);
}
.arrowMobile.rotate {
  transform: rotate(0deg);
}
/*!***************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Colaboradores/Colaboradores.scss ***!
  \***************************************************************************************************************************************/
.appButtons {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.waveColaboradores .texto p {
  text-align: left;
}
.waveColaboradores .imagen img {
  max-width: 80vw;
}

.appContainer {
  background-color: var(--stronggreen-color);
  padding: 0.5rem 1rem;
  box-shadow: -11px 10px 0px 0px var(--orange-color);
  -webkit-box-shadow: -11px 10px 0px 0px var(--orange-color);
  -moz-box-shadow: -11px 10px 0px 0px var(--orange-color);
  color: var(--darker-color);
  transition: all 200ms ease-in-out;
}
.appContainer:hover {
  box-shadow: -16px 15px 0px 0px var(--orange-color);
  -webkit-box-shadow: -16px 15px 0px 0px var(--orange-color);
  -moz-box-shadow: -16px 15px 0px 0px var(--orange-color);
  color: white;
  text-decoration: var(--darker-color);
}

.consultasColumna > * ul :last-child li {
  border-left: 2px solid white;
}
.consultasColumna > * ul :first-child div li::after {
  content: "";
  height: 50%;
  width: 2px;
  background-color: var(--orange-color);
  border-left: 2px solid var(--orange-color);
}
/*!***********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/WaveCorta/WaveCorta.scss ***!
  \***********************************************************************************************************************************/
.wave-container {
  overflow: hidden;
  position: absolute;
  bottom: -1px;
  width: 100%;
}
.wave-container .waveCorta {
  background-image: url("data:image/svg+xml,%3Csvg width=%271384%27 height=%2760%27 viewBox=%270 0 1384 60%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cmask id=%27mask0_2202_5048%27 style=%27mask-type:alpha%27 maskUnits=%27userSpaceOnUse%27 x=%270%27 y=%270%27 width=%271384%27 height=%2760%27%3E%3Cpath d=%27M0 18.2577C0 18.2577 331.583 59.3375 692 18.2577C1052.42 -22.8221 1384 18.2577 1384 18.2577V60H0V18.2577Z%27 fill=%27white%27/%3E%3C/mask%3E%3Cg mask=%27url%28%23mask0_2202_5048%29%27%3E%3Cpath d=%27M0 18.2577C0 18.2577 331.583 59.3375 692 18.2577C1052.42 -22.8221 1384 18.2577 1384 18.2577V60H0V18.2577Z%27 fill=%27white%27/%3E%3Cpath d=%27M576 -12.75H-288V25.659C50.5754 64.2571 240.206 64.6364 576 25.659V-12.75Z%27 fill=%27%23BBCB47%27/%3E%3Cpath d=%27M1963 -12.75H1099V25.659C1437.58 64.2571 1627.21 64.6364 1963 25.659V-12.75Z%27 fill=%27%23BBCB47%27/%3E%3Cpath d=%27M1517.76 -556.139C1517.76 -556.139 812.951 -462.897 37.2144 -546.812L18.4658 14.0665C701.866 96.7978 1531.55 4.53479 1531.55 4.53479L1517.76 -556.139Z%27 fill=%27%23FF9933%27/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat;
  width: 170%;
  translate: -35%;
  height: 60px;
  z-index: 99999;
}
@media (max-width: 1366px) {
  .wave-container {
    width: 100%;
    translate: 0%;
  }
}
/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/BannerXL/BannerXL.scss ***!
  \*********************************************************************************************************************************/
.BannerXL {
  height: fit-content;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: start;
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  z-index: 0;
  position: relative;
  margin-bottom: 1rem;
  padding: 7rem 1rem;
  min-height: 20rem;
}
.BannerXL:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.7);
  height: 100%;
  z-index: -1;
  width: 100%;
}
.BannerXL .titulo {
  position: relative;
}
.BannerXL .titulo h1, .BannerXL .titulo h2, .BannerXL .titulo h3, .BannerXL .titulo h4, .BannerXL .titulo h5 {
  font-size: var(--font-titulo);
  text-align: center;
  margin-bottom: 2%;
  z-index: 2;
  max-width: 98vw;
}
.BannerXL .titulo.alone {
  font-size: var(--font-titulo);
  margin-bottom: 0;
}
.BannerXL .titulo::first-letter {
  text-transform: uppercase;
}
.BannerXL .titulo.postLineaNaranjaBottom::before {
  content: "";
  position: absolute;
  top: calc(0.3rem + 100%);
  background: var(--orange-color);
  height: 6px;
  display: block;
  width: 80%;
  transform: translate(-50%);
  left: 50%;
  margin: 0.8rem 0;
}
.BannerXL .descripcion {
  margin-top: 2.5rem;
  max-width: 70ch;
}
.BannerXL .descripcion:empty {
  margin-top: 0rem;
}
.BannerXL p {
  font-size: var(--font-mediana);
  text-align: center;
  z-index: 2;
}
/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Timeline/Timeline.scss ***!
  \*********************************************************************************************************************************/
.consultasColumna > * ul :last-child li {
  border-left: 2px solid white;
}
.consultasColumna > * ul :first-child div li::after {
  content: "";
  height: 50%;
  width: 2px;
  background-color: var(--orange-color);
  border-left: 2px solid var(--orange-color);
}
/*!*****************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/TimelineItem/TimelineItem.scss ***!
  \*****************************************************************************************************************************************/
.rowConsultas {
  position: relative;
}
.rowConsultas li {
  border-left: 2px solid var(--orange-color);
  padding: 0 0 0.5rem 1rem;
  position: relative;
  height: 5rem;
}
.rowConsultas li::marker {
  font-size: 0;
}
.rowConsultas li .containerTexto {
  margin-top: -5px;
}
.rowConsultas li::before {
  content: "";
  width: 15px;
  height: 15px;
  background: var(--orange-color);
  border-radius: 50%;
  position: absolute;
  left: -0.5rem;
}
.rowConsultas .imgConsultas {
  margin-right: 1rem;
  height: 5rem;
  width: 3rem;
  display: grid;
  place-items: center;
  position: relative;
  min-width: 3rem;
}
.rowConsultas .imgConsultas img {
  position: absolute;
  width: auto;
  top: -1rem;
  max-width: 100%;
  height: auto;
}
/*!*************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardGrupoGestion/CardGrupoGestion.scss ***!
  \*************************************************************************************************************************************************/
.CardGrupoGestion {
  justify-content: center;
  justify-items: center;
  align-items: center;
  margin: 3rem;
  min-height: 10rem;
  max-width: 70rem;
}
.CardGrupoGestion .cardTitle {
  height: 100%;
  position: relative;
}
.CardGrupoGestion .cardTitle h1,
.CardGrupoGestion .cardTitle h2,
.CardGrupoGestion .cardTitle h3,
.CardGrupoGestion .cardTitle h4,
.CardGrupoGestion .cardTitle h5 {
  height: 100%;
  display: grid;
  align-items: center;
  width: 100%;
  position: relative;
  margin-bottom: 0px;
}
@media (max-width: 768px) {
  .CardGrupoGestion .cardTitle h1::after,
  .CardGrupoGestion .cardTitle h2::after,
  .CardGrupoGestion .cardTitle h3::after,
  .CardGrupoGestion .cardTitle h4::after,
  .CardGrupoGestion .cardTitle h5::after {
    content: "";
    background: var(--orange-color);
    height: 3px;
    display: block;
    width: 60%;
    left: 22px;
    margin: 1rem 20%;
    position: static;
  }
}
@media (min-width: 768px) {
  .CardGrupoGestion .cardTitle::after {
    content: "";
    width: 3px;
    position: absolute;
    right: -3px;
    bottom: 0px;
    background: var(--orange-color);
    height: 100%;
    display: block;
  }
}
.CardGrupoGestion .cardTitle * {
  height: 100%;
}
@media (max-width: 768px) {
  .CardGrupoGestion .cardTitle * {
    text-align: center;
  }
}
.CardGrupoGestion .content {
  max-width: 70ch;
  position: relative;
}
@media (min-width: 768px) {
  .CardGrupoGestion .content::after {
    content: "";
    width: 3px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: var(--orange-color);
    height: 100%;
    display: block;
  }
}
.CardGrupoGestion .content p {
  margin-top: 0.3rem !important;
}
@media (max-width: 768px) {
  .CardGrupoGestion {
    margin-top: 2rem;
    place-items: center;
  }
}
@media (max-width: 768px) {
  .CardGrupoGestion {
    margin: 2rem;
  }
}
/*!***********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Card2wave/Card2wave.scss ***!
  \***********************************************************************************************************************************/
.wavesverdes {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  z-index: -1;
}

.Card2wave {
  width: min-content;
  height: 100%;
  width: 100%;
  padding: 7rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  margin: 4rem 0;
}
.Card2wave .fondowave {
  position: absolute;
  z-index: -1;
  object-fit: fill;
  width: 101vw;
  height: 100%;
}
@media (max-width: 630px) {
  .Card2wave .fondowave {
    width: 300%;
  }
}
.Card2wave .descripction {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: white;
  max-width: 900px;
}
.Card2wave .descripction .tituloBox {
  padding: 1.2rem;
  border-radius: 5px;
}
.Card2wave .descripction .tituloBox h1, .Card2wave .descripction .tituloBox h2, .Card2wave .descripction .tituloBox h3, .Card2wave .descripction .tituloBox h4, .Card2wave .descripction .tituloBox h5 {
  padding: 0;
}
.Card2wave .descripction div h1,
.Card2wave .descripction div h2,
.Card2wave .descripction div h3,
.Card2wave .descripction div h4,
.Card2wave .descripction div h5 {
  border-radius: 5px;
  font-size: var(--font-subtitulo);
  color: white;
  background-color: var(--stronggreen-color);
  padding: 1rem;
}
.Card2wave .descripction div p {
  margin-top: 0.5rem !important;
  max-width: 60ch;
}
.Card2wave .descripction div li {
  font-size: var(--font-mediana);
}
.Card2wave .descripction .title {
  border-radius: 5px;
  font-size: var(--font-grande);
  color: white;
  background-color: var(--stronggreen-color);
  padding: 1rem;
}
@media (max-width: 630px) {
  .Card2wave .descripction .title {
    max-width: 100vw;
  }
}
.Card2wave .descripction .wave-grupogestion2 h1,
.Card2wave .descripction .wave-grupogestion2 h2,
.Card2wave .descripction .wave-grupogestion2 h3,
.Card2wave .descripction .wave-grupogestion2 h4,
.Card2wave .descripction .wave-grupogestion2 h5,
.Card2wave .descripction .wave-grupogestion2 h6 {
  border-radius: 5px;
  font-size: var(--font-mediana2);
  color: white;
  background-color: var(--stronggreen-color);
  padding: 1rem;
}
@media (max-width: 630px) {
  .Card2wave .descripction .wave-grupogestion2 h1,
  .Card2wave .descripction .wave-grupogestion2 h2,
  .Card2wave .descripction .wave-grupogestion2 h3,
  .Card2wave .descripction .wave-grupogestion2 h4,
  .Card2wave .descripction .wave-grupogestion2 h5,
  .Card2wave .descripction .wave-grupogestion2 h6 {
    max-width: 100vw;
  }
}
.Card2wave p.descripcion,
.Card2wave p {
  margin-bottom: 2rem;
  text-align: center;
  font-size: var(--font-mediana);
  color: white;
}
/*!**************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/Backoffice/componentes/ModalCustom/ModalCustom.scss ***!
  \**************************************************************************************************************************************************/
.Modal .modal-header {
  background: #fafafa;
}
.Modal .modal-header .modal-title {
  color: #201B1B;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}
.Modal .modal-content {
  background: #fafafa;
}
.Modal .modal-content .CloseButton {
  position: absolute;
  top: 1rem;
  right: 1rem;
}
.Modal .modal-content .modal-body {
  border-radius: 10px;
  background: #fafafa;
  display: flex;
  width: 100%;
  flex-direction: row;
  justify-content: center;
}
.Modal .modal-content .modal-body position:relative .leftBody {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.Modal .modal-content .modal-body position:relative .leftBody img {
  width: 150px;
  height: 150px;
}
.Modal .modal-content .modal-body position:relative .leftBody .footerImg {
  display: flex;
  width: 100%;
  justify-content: space-around;
  align-items: center;
  padding-top: 1rem;
}
.Modal .modal-content .modal-body position:relative .leftBody .footerImg .orange {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2rem;
  width: 130px;
  color: #fff;
  background: #f88c1f;
  padding: 0.4rem;
  border: none;
  border-radius: 5px;
  stroke-width: 1.5px;
}
.Modal .modal-content .modal-body position:relative .leftBody .footerImg span {
  color: #201B1B;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.Modal .modal-content .modal-body .rightBody {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.Modal .modal-content .modal-body .btnContainer {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.Modal .modal-content .modal-body .btnContainer .orange {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2rem;
  width: 87px;
  color: #fff;
  background: #f88c1f;
  padding: 0.4rem;
  border: none;
  border-radius: 5px;
  stroke-width: 1.5px;
}
.Modal .modal-content .modal-body .btnContainer .gray {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2rem;
  width: 87px;
  color: #fff;
  background: #A7A7A7;
  padding: 0.4rem;
  border: none;
  border-radius: 5px;
  stroke-width: 1.5px;
}
.Modal .modal-content .modal-body .inputImg {
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  margin-bottom: 1rem;
}
.Modal .modal-content .modal-body .inputImg span {
  color: #201B1B;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}
.Modal .modal-content .modal-body .inputImg input {
  width: 70%;
  border-radius: 5px;
  border: 1px solid #A7A7A7;
  background: #FEFEFE;
}
/*!********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/utils/ui/buttons/CloseButton/CloseButton.scss ***!
  \********************************************************************************************************************************************/
.CloseButton {
  margin-left: 0.5rem;
  border: none;
  background-color: transparent;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
}
/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Toast/Toast.scss ***!
  \***************************************************************************************************************************/
.Toast {
  color: var(--black-800);
  padding: 10px;
  z-index: 9999999;
  background: var(--white);
  backdrop-filter: blur(4.5px);
  -webkit-backdrop-filter: blur(4.5px);
  border: 1px solid rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  border-radius: 0.5rem;
  margin-bottom: 0.5rem;
}
.Toast.success {
  border: 1px solid var(--green-800) !important;
}
.Toast.error {
  border: 1px solid var(--red-800) !important;
}
.Toast .Toast-items {
  display: flex;
  flex-direction: column;
  width: 70%;
}
.Toast span {
  flex: 1;
}
.Toast .close-button {
  margin-left: 0.5rem;
  border: none;
  background-color: transparent;
  color: var(--white);
  cursor: pointer;
  font-size: 14px;
}
/*!************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Modals/ModalRegister.scss ***!
  \************************************************************************************************************************************/
.ModalRegister input {
  background: #fafafa;
  width: 100%;
  outline: none;
  border: none;
  border-bottom: 1px solid #CDCDCD;
  padding: 0.2rem;
  border-radius: 0;
}
.ModalRegister fieldset span {
  background: #fafafa;
}
.ModalRegister .modal-body {
  padding: 2rem;
}
/*!*******************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Modals/ModalRecoverPassword.scss ***!
  \*******************************************************************************************************************************************/
.ModalRecoverPassword .modal-body {
  padding: 2rem;
}
/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Modals/ModalLogin.scss ***!
  \*********************************************************************************************************************************/
.ModalLogin {
  color: var(--dark-color);
}
.ModalLogin .modal-content {
  padding: 1rem;
  background: #fff;
}
.ModalLogin .modal-content > .modal-header {
  background: #fff;
}
.ModalLogin .modal-content .modal-body {
  background: #fff;
  padding: 1.52rem;
}
.ModalLogin input {
  width: 100%;
  outline: none;
  border: none;
  border-bottom: 1px solid #CDCDCD;
  padding: 0.2rem;
}
.ModalLogin a {
  color: var(--black);
  font-weight: 600;
}
.ModalLogin a.recuperarclave {
  font-size: 1rem;
  font-weight: 400;
}
.ModalLogin a:hover {
  color: var(--orange-color);
}
.ModalLogin h5 {
  font-size: 1.2rem;
  font-weight: 800;
}
.ModalLogin .btnGreen {
  margin-top: 0.5rem;
}
/*!****************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/Backoffice/componentes/LoaderCircle/LoaderCircle.scss ***!
  \****************************************************************************************************************************************************/
@keyframes spinner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.loading-spinner {
  width: 50px;
  height: 50px;
  border: 10px solid #f3f3f3; /* Light grey */
  border-top: 10px solid var(--primary-color); /* Blue */
  border-radius: 50%;
  animation: spinner 1.5s linear infinite;
}

.spinner-container {
  display: grid;
  justify-content: center;
  align-items: center;
  height: 350px;
}
/*!*************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardEmpleo/CardEmpleo.scss ***!
  \*************************************************************************************************************************************/
.containerCards {
  cursor: pointer;
  padding: 1rem 0.5rem;
  border-bottom: 1px solid var(--lightorange-color);
  transition: all 100ms ease-in-out;
}
.containerCards:hover {
  background-color: var(--lighterorange-color);
}
.containerCards .containerTitle {
  margin-bottom: 0.5rem;
}
.containerCards .containerTitle h2 {
  font-weight: bold;
  font-size: var(--font-mediana);
  text-align: start;
  color: var(--dark-color);
}
.containerCards .containerUbication {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  grid-column: 1/3;
}
@media (max-width: 900px) {
  .containerCards .containerUbication {
    margin: 1rem 0 0 0;
  }
}
.containerCards .containerUbication p {
  color: var(--orange-color);
  font-size: var(--font-chica);
}
.containerCards .containerUbication svg {
  margin-right: 0.5rem;
}
.containerCards .containerFecha {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 900px) {
  .containerCards .containerFecha {
    justify-content: start;
  }
}
.containerCards .containerFecha svg {
  margin-right: 0.5rem;
}
.containerCards .containerFecha p {
  font-size: var(--font-chica);
}
.containerCards .containerFecha .referencia {
  color: var(--grey-light);
  text-align: right;
  flex-grow: 1;
}
.containerCards .containerReferencia .referencia {
  color: var(--grey-light);
}
.containerCards[data-active=on] {
  background-color: var(--lightorange-color);
}

.modalEmpleoDescription p {
  font-size: var(--font-chica);
}
.modalEmpleoDescription .checkContainer {
  width: 2rem;
  display: grid;
  place-items: center;
}
.modalEmpleoDescription .referencia {
  color: var(--grey-light);
}
.modalEmpleoDescription .modal-body ul {
  font-size: var(--font-chica);
}
.modalEmpleoDescription .modal-body .buttonEmpleosDescription {
  margin-top: 2rem;
}
.modalEmpleoDescription .modal-body .buttonEmpleosDescription span {
  width: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  background-color: var(--orange-color);
  border-radius: 40px;
  padding: 1rem;
  font-size: var(--font-boton);
}
.modalEmpleoDescription .modal-body .buttonEmpleosDescription span svg {
  margin-left: 5px;
}
/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Card2/Card2.scss ***!
  \***************************************************************************************************************************/
.Card2 {
  border-radius: 20px;
  width: min-content;
  height: 100%;
  width: 70%;
  padding: 5rem 2rem;
  box-shadow: 0px 0px 10px 0px #cfcfcf;
  background-color: hsla(31, 59%, 65%, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 19rem;
}
.Card2 h3.title {
  margin-bottom: 1.5rem;
  text-align: center;
  font-size: var(--font-mediana);
}
.Card2 p.descripcion {
  margin-bottom: 2rem;
  text-align: center;
  font-size: var(--font-normal);
}
/*!***************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/empleoDescription/EmpleoDescription.scss ***!
  \***************************************************************************************************************************************************/
.containerEmpleosDescription {
  padding: 2rem 0 0 1rem;
  border-left: 1px solid var(--lightorange-color);
  height: 100%;
  overflow: scroll;
  max-width: 1140px;
}
.containerEmpleosDescription h3 {
  font-size: var(--font-grande);
  border-bottom: 1px solid #f3f3f3;
}
@media screen and (max-width: 900px) {
  .containerEmpleosDescription {
    display: none;
  }
}
.containerEmpleosDescription .containerTime {
  display: flex;
  margin-top: 1rem;
  align-items: baseline;
  flex-direction: column;
  gap: 0.2rem;
}
.containerEmpleosDescription .containerTime p {
  font-size: var(--font-mediana);
}
.containerEmpleosDescription .containerTime .checkDescription {
  height: 2rem;
  margin-right: 0.2rem;
}
.containerEmpleosDescription .containerTime .localidad {
  margin: 0 1rem;
}
.containerEmpleosDescription .containerTime .referencia {
  color: var(--grey-light);
  flex-grow: 1;
  text-align: right;
}
.containerEmpleosDescription .containerTime .svgIcon {
  width: 2rem;
}
.containerEmpleosDescription .buttonEmpleosDescription {
  margin-top: 2rem;
  margin-left: auto;
}
.containerEmpleosDescription .buttonEmpleosDescription span {
  margin-top: 2rem;
  width: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  background-color: var(--orange-color);
  border-radius: 40px;
  padding: 0.6rem 0.75rem;
  font-size: var(--font-boton);
  margin-left: auto;
}
.containerEmpleosDescription .buttonEmpleosDescription span svg {
  margin-left: 5px;
}
.containerEmpleosDescription .descriptionEmpleo {
  margin: 1.5rem 0;
}
.containerEmpleosDescription .descriptionEmpleo .puestoNombre {
  display: flex;
  flex-direction: row;
}
.containerEmpleosDescription .descriptionEmpleo p {
  font-size: var(--font-chica);
  line-height: 1.5rem;
}
.containerEmpleosDescription .descriptionEmpleo ul {
  padding-left: 2rem !important;
}
.containerEmpleosDescription .descriptionEmpleo ul li {
  font-size: var(--font-chica);
}
.containerEmpleosDescription .requisitosEmpleos {
  margin-bottom: 2rem;
}
.containerEmpleosDescription .requisitosEmpleos h2 {
  margin: 1rem;
}
.containerEmpleosDescription .requisitosEmpleos .requisitosEmpleosCircle {
  font-size: 0.3rem;
}
/*!*****************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Input1/Input1.scss ***!
  \*****************************************************************************************************************************/
.searcher-container {
  display: grid;
  justify-content: center;
}

.Input1 {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all ease 0.5s;
  background-color: transparent;
  border: 1px solid var(--grey-light);
  border-radius: 10px;
  padding: 0.2rem;
}
.Input1 input {
  width: 100%;
  border: none;
  outline: none;
  text-align: center;
  background-color: transparent;
  font-size: var(--font-mediana);
  padding-right: 1.5rem;
}
.Input1 .hideinput {
  opacity: 0;
  transition: all ease 0.5s;
}
.Input1 .hideinput.showinput {
  animation: showinput ease 0.5s forwards;
}
.Input1 .lupa {
  transition: all ease 1.1s;
  padding: 0 0.5rem;
  position: absolute;
  right: 0px;
}
.Input1 .underlined::after {
  animation: widther 0.5s forwards ease;
  position: absolute;
  bottom: -3px;
  width: 0;
  content: "";
  border-bottom: 1px solid grey;
  transition: all ease 0.5s;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 3;
  width: 100%;
  text-align: center;
}

@keyframes widther {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
@keyframes showinput {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes moverderecha {
  0% {
    transform: translate(-150px);
  }
  50% {
    transform: translate(-150px);
  }
  100% {
    transform: translate(0);
  }
}
/*!****************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/Backoffice/componentes/Button/Button.scss ***!
  \****************************************************************************************************************************************/
.btnGreen {
  background: var(--orange-color);
  border-radius: 6px;
  border: none;
  transition: all ease 0.3s;
  width: 10rem;
  padding: 0.5rem;
  color: #fff !important;
  font-weight: 400;
  font-size: var(--font-boton);
  margin-top: 1rem;
  max-height: 3rem;
}
.btnGreen a {
  color: #fff !important;
  text-decoration: none;
  outline: none;
  position: relative;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 1rem;
  text-align: center;
}
.btnGreen:hover {
  background: #e6811d;
}
.btnGreen:disabled, .btnGreen[disabled=true], .btnGreen[disabled=disabled] {
  filter: grayscale(0.6);
}

.btnOrange {
  background: var(--orange-color);
  border-radius: 6px;
  border: none;
  transition: all ease 0.3s;
  width: 10rem;
  padding: 0.5rem;
  color: #fff !important;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 0.4rem;
  border-radius: 10px;
  font-size: var(--font-chica);
}
.btnOrange a {
  color: #fff !important;
  text-decoration: none;
  outline: none;
  position: relative;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 1rem;
  text-align: center;
}
.btnOrange:hover {
  background: #f88c1f;
}
.btnOrange:disabled, .btnOrange[disabled=true], .btnOrange[disabled=disabled] {
  filter: grayscale(0.6);
}

.btnWhite {
  background: #fff !important;
  border-radius: 6px;
  border: none;
  transition: all ease 0.3s;
  width: 10rem;
  padding: 0.5rem;
  color: var(--orange-color) !important;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 0.4rem;
  border-radius: 10px;
  font-size: var(--font-chica);
  border: 1px solid var(--orange-color);
}
.btnWhite a {
  color: var(--orange-color) !important;
  text-decoration: none;
  outline: none;
  position: relative;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 1rem;
  text-align: center;
}
.btnWhite:hover {
  background: #f88c1f;
}
.btnWhite:disabled, .btnWhite[disabled=true], .btnWhite[disabled=disabled] {
  filter: grayscale(0.6);
}

.Button {
  min-width: 6rem;
  width: auto;
  height: 2rem;
  border-radius: 5px;
  border: none;
  color: var(--white);
  background-color: var(--green-color);
  border: none;
  z-index: 99;
  border: 2px solid transparent;
  -webkit-transition: 0.4s all;
  transition: 0.4s all;
}
.Button:hover {
  background-color: var(--white);
  transition: 0.4s all;
  border: 2px solid var(--green-color);
  color: var(--green-color);
}
.Button:disabled, .Button[disabled=true], .Button[disabled=disabled] {
  filter: grayscale(0.6);
}

.Button-orange {
  min-width: 6rem;
  width: auto;
  height: 2rem;
  border-radius: 5px;
  border: none;
  color: var(--white);
  background-color: var(--orange-color);
  border: none;
  z-index: 99;
  border: 2px solid transparent;
  -webkit-transition: 0.4s all;
  transition: 0.4s all;
}
.Button-orange:hover {
  background-color: var(--white);
  transition: 0.4s all;
  border: 2px solid var(--orange-color);
  color: var(--orange-color);
}
.Button-orange:disabled, .Button-orange[disabled=true], .Button-orange[disabled=disabled] {
  filter: grayscale(0.6);
}

.Button-gray {
  min-width: 6rem;
  width: auto;
  height: 2rem;
  border-radius: 5px;
  border: none;
  color: var(--white);
  background-color: var(--grey-light-color);
  border: none;
  z-index: 99;
  border: 2px solid transparent;
  -webkit-transition: 0.4s all;
  transition: 0.4s all;
}
.Button-gray:hover {
  background-color: var(--white);
  transition: 0.4s all;
  border: 2px solid var(--grey-light-color);
  color: var(--grey-light-color);
}
.Button-gray:disabled, .Button-gray[disabled=true], .Button-gray[disabled=disabled] {
  filter: grayscale(0.6);
}
/*!**************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Empleos/PostulantesHandler.scss ***!
  \**************************************************************************************************************************************/
.PostulantesHandler {
  width: 100% !important;
  display: flex;
  gap: 1rem;
  padding: 0 1rem;
  margin-bottom: 1rem;
  justify-content: center;
}
.PostulantesHandler .btnGreen {
  margin: 0;
  max-width: max-content;
}
/*!**************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Modals/ModalChangePassword/ModalChangePassword.scss ***!
  \**************************************************************************************************************************************************************/
.ModalChangePassword input {
  background: #fafafa;
  width: 100%;
  outline: none;
  border: none;
  border-bottom: 1px solid #CDCDCD;
  padding: 0.2rem;
  border-radius: 0;
}
.ModalChangePassword fieldset span {
  background: #fafafa;
}
.ModalChangePassword .modal-body {
  padding: 2rem;
}
/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Empleos/Empleos.scss ***!
  \***************************************************************************************************************************/
.sectionPublicados {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.sectionPublicados .trabajos {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.sectionPublicados .trabajos .filtros {
  width: 100%;
  display: flex;
  justify-content: center;
  justify-items: center;
  margin-bottom: 1rem;
}
@media (max-width: 760px) {
  .sectionPublicados .trabajos .filtros {
    display: flex;
    justify-content: center;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
}
.sectionPublicados .trabajos .filtros > * {
  margin: 1rem;
}
@media (max-width: 760px) {
  .sectionPublicados .trabajos .filtros > * {
    margin: 0.3rem;
    width: 100%;
  }
}
.sectionPublicados .trabajos .containerEmpleos {
  transition: all ease 100ms;
  display: grid;
  grid-template-columns: 50% 50%;
  border-top: 1px solid var(--lightorange-color);
  border-bottom: 1px solid var(--lightorange-color);
  max-height: 50rem;
  height: 50rem;
  min-height: 20rem;
  padding: 0;
  background: white;
}
.sectionPublicados .trabajos .containerEmpleos:has(div > div > h5) {
  width: 100%;
  margin-top: 3rem;
  grid-template-columns: 100%;
}
.sectionPublicados .trabajos .containerEmpleos .loader {
  grid-column-start: 1;
  grid-column-end: -1;
}
@media (max-width: 992px) {
  .sectionPublicados .trabajos .containerEmpleos {
    max-height: 79rem;
    grid-template-columns: 100%;
  }
}
@media (max-width: 1100px) {
  .sectionPublicados .trabajos .containerEmpleos {
    max-height: 75rem;
  }
}
@media (max-width: 1366px) {
  .sectionPublicados .trabajos .containerEmpleos {
    max-height: 64rem;
  }
}
.sectionPublicados .trabajos .containerEmpleos .empleos {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: auto;
  scrollbar-width: thin;
}
.sectionPublicados .trabajos .containerEmpleos .empleos .no-results {
  padding: 3rem 2rem;
  background: var(--lighterorange-color);
  font-size: var(--font-grande);
  text-align: center;
}
.sectionPublicados .trabajos .containerEmpleos .empleos .btn-container {
  width: 100%;
  display: grid;
  place-items: center;
}
.sectionPublicados .trabajos .containerEmpleos .empleos .btn-container .btn-loadmore {
  margin: 1rem 0;
  height: 3rem;
  width: 12rem;
  height: 2rem;
  border-radius: 2rem;
  display: grid;
  place-items: center;
  background-color: var(--secondary-color);
  border: 1px solid var(--orange-color);
  transition: all 200ms ease-in-out;
  color: white;
}
.sectionPublicados .trabajos .containerEmpleos .empleos .btn-container .btn-loadmore:hover {
  background-color: var(--orange-color);
}
.sectionPublicados .trabajos .containerEmpleos .modalEmpleoDescription {
  display: none;
}
@media (min-width: 900px) {
  .sectionPublicados .trabajos .containerEmpleos .modalEmpleoDescription {
    display: block;
    position: absolute;
  }
}

.cvEmpleosImagen {
  padding: 2rem 1rem !important;
}
.cvEmpleosImagen .empleosTips .btnContainer {
  display: grid;
  place-items: center;
}

.cvEmpleosImagen {
  min-height: 400px;
  margin-bottom: 2rem;
  min-width: 18rem;
}
.cvEmpleosImagen .descripction {
  height: 100%;
  width: 100% !important;
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}
@media screen and (max-width: 1200px) {
  .cvEmpleosImagen .descripction {
    grid-template-columns: 100%;
  }
}
.cvEmpleosImagen .descripction .imagenesrelative {
  min-height: 200px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  top: 12%;
  width: 50%;
}
.cvEmpleosImagen .descripction .imagenesrelative .imagenes {
  display: flex;
}
.cvEmpleosImagen .descripction .imagenesrelative .imagenes .imagenCV1 {
  transform: translate(8rem, -1rem);
}
@media screen and (max-width: 992px) {
  .cvEmpleosImagen .descripction .imagenesrelative .imagenes .imagenCV1 {
    display: none;
  }
}
.cvEmpleosImagen .descripction .imagenesrelative .imagenes .imagenCV2 {
  transform: translate(-8rem, -2rem);
}
@media screen and (max-width: 992px) {
  .cvEmpleosImagen .descripction .imagenesrelative .imagenes .imagenCV2 {
    display: none;
  }
}
.cvEmpleosImagen .empleosTips {
  width: 100%;
  max-width: 20rem;
}
.cvEmpleosImagen .empleosTips .empleosContent {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 1200px) {
  .cvEmpleosImagen .empleosTips .empleosContent {
    margin-top: 1rem;
  }
}
.cvEmpleosImagen .empleosTips .empleosContent h3 {
  color: #333;
  margin-bottom: 0.5rem !important;
  font-size: var(--font-mediana2);
}
.cvEmpleosImagen .empleosTips .empleosContent p {
  color: #333;
}
.cvEmpleosImagen .empleosTips .empleosContent ul {
  margin-top: 2rem;
}
.cvEmpleosImagen .empleosTips .empleosContent ul li {
  margin-left: 2rem;
}
/*!***********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/ServiciosHomev2/ServiciosHomev2.scss ***!
  \***********************************************************************************************************************************************/
.sectionServicios {
  margin-block: 5rem;
}
.sectionServicios .servicioshomev2-title {
  width: auto;
  background-color: var(--orange-color);
  color: white;
  margin-bottom: 2rem;
  padding: 1rem 1rem;
  font-size: var(--font-grande);
  border-radius: 5px;
}
@media (max-width: 630px) {
  .sectionServicios .servicioshomev2-title {
    width: 100%;
  }
}
.sectionServicios .ServiciosHomev2 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  gap: 2rem;
  max-width: 900px;
}
.sectionServicios .ServiciosHomev2 a {
  width: 100%;
  text-decoration: none;
}
.sectionServicios .ServiciosHomev2 a .cardHome {
  width: 100%;
}
@media (max-width: 768px) {
  .sectionServicios .ServiciosHomev2 {
    grid-template-columns: 1fr 1fr;
  }
  .sectionServicios .ServiciosHomev2 .Carta {
    height: 10rem;
  }
}
@media (max-width: 630px) {
  .sectionServicios .ServiciosHomev2 {
    grid-template-columns: 1fr;
    gap: 0.5rem;
    width: 100%;
  }
  .sectionServicios .ServiciosHomev2 .Carta {
    height: 5.5rem;
  }
}
/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Carta/Carta.scss ***!
  \***************************************************************************************************************************/
.Carta {
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 15px;
  height: 13rem;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (max-width: 768px) {
  .Carta {
    width: min(21rem, 100%);
    height: 18rem;
  }
}
.Carta::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 15px;
  height: 100%;
  width: 100%;
  background: var(--black-transparent);
  transition: all 0.4s;
}
.Carta:hover::after {
  background-color: var(--orange-color-transparent);
}
.Carta p {
  color: white;
  z-index: 3;
  text-align: center;
  font-weight: 800;
  padding: 0 5%;
  font-size: 1.2rem;
}
.Carta p::selection {
  background: none;
  color: initial;
}
.Carta .cardHome {
  width: 100px;
}
.Carta .cardHome p {
  font-size: var(--font-mediana2);
}
/*!*************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Industrias/Industrias.scss ***!
  \*************************************************************************************************************************************/
.industriasTitle {
  max-width: 90vw !important;
  width: 32ch !important;
}

.industrias {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 2rem;
  gap: 1rem;
  width: 100%;
}
.industrias .swiper-industrias {
  width: 100%;
  height: 100%;
  max-width: 90vw;
}
.industrias .swiper-industrias .swiper-button-next:after,
.industrias .swiper-industrias .swiper-button-prev:after {
  color: var(--orange-color) !important;
  scale: 50%;
}
.industrias .swiper-industrias .swiper-wrapper .swiper-slide-active {
  background: var(--lightorange-color);
  border: 2px solid var(--lightorange-color);
  transition: all 200ms ease-in-out;
}
.industrias .swiper-industrias .swiper-wrapper .swiper-slide-active img {
  scale: 1.5;
}
.industrias .swiper-industrias .swiper-wrapper .swiper-slide-active p {
  transition: all 200ms ease-in-out;
  font-size: var(--font-grande);
}
.industrias .swiper-industrias .swiper-pagination .swiper-pagination-bullet-active {
  background: var(--stronggreen-color) !important;
}
.industrias .swiperSlide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  height: 17rem;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  transition: all 500ms ease;
  border-radius: 5px;
  border: 1px solid rgba(0, 0, 0, 0.05);
}
/*!***********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Industria/Industria.scss ***!
  \***********************************************************************************************************************************/
.industria {
  width: 100%;
  height: 100%;
  padding: 0.5rem;
  justify-content: center;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 500ms ease-in-out;
}
.industria .industriaImg {
  display: grid;
  place-items: center;
}
.industria .industriaImg img {
  height: 5rem;
  width: auto;
}
.industria .industriaTexto {
  margin-top: 1rem;
}
.industria .industriaTexto p {
  font-size: var(--font-mediana2);
  text-align: center;
  color: var(--dark-color);
}
.industria:hover {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--lightorange-color);
  transform: 110%;
  transition: all 500ms ease-in-out;
}
.industria:hover p {
  transition: all 200ms ease-in-out;
  font-size: var(--font-grande);
}
.industria:hover img {
  transition: all 200ms ease-in-out;
  scale: 1.1;
}
/*!*****************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/FormularioEmpresas/FormularioEmpresas.scss ***!
  \*****************************************************************************************************************************************************/
textarea {
  resize: none;
}

.Contacto {
  display: flex;
  justify-content: center;
  position: relative;
  margin-top: 5rem;
  margin-bottom: 5rem;
}
@media (max-width: 768px) {
  .Contacto {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}
.Contacto .box {
  position: relative;
  padding: 2rem;
  border-radius: 10px;
  background-color: rgba(255, 164, 66, 0.2);
  max-width: 95vw;
  width: 45rem;
}
@media (max-width: 768px) {
  .Contacto .box {
    row-gap: 0.5rem;
    padding: 1rem;
  }
}
.Contacto .box.email-send {
  height: 15rem;
  display: grid;
  place-items: center;
}
.Contacto .box .contactoTitle {
  grid-column: 1/-1;
  width: 100%;
  display: flex;
  justify-content: center;
}
.Contacto .box .contactoTitle > * {
  text-align: center;
  margin: 1rem 0 !important;
}
.Contacto .box p {
  text-align: center;
}
.Contacto .box .inputs {
  display: flex;
  width: 100%;
  justify-content: center;
  margin: 0.6rem 0;
}
@media (max-width: 768px) {
  .Contacto .box .inputs {
    margin: 0;
    flex-wrap: wrap;
  }
}
.Contacto .box .inputs .inputComentarios {
  margin: 0 0.5rem;
  width: 100%;
}
@media (max-width: 768px) {
  .Contacto .box .inputs .inputComentarios {
    margin: 0 0.5rem;
  }
}
.Contacto .box .inputs .input-container {
  margin: 0 0.5rem;
  width: 100%;
}
.Contacto .box .inputs select:required:invalid {
  color: gray;
}
.Contacto .box .inputs .input {
  height: 3rem;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  padding: 0 1rem;
  width: 100%;
  background: #fffaf2;
}
@media (max-width: 768px) {
  .Contacto .box .inputs .input {
    width: 100%;
    margin-block: 0.2rem;
  }
}
.Contacto .box .inputs .comentarios {
  height: 6rem;
  width: 100% !important;
  padding: 1rem;
}
.Contacto .box .inputs .botones {
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.Contacto .box .inputs .botones .buttonCV {
  border: 1px solid var(--orange-color);
  background-color: white;
  color: var(--orange-color) !important;
}
.Contacto .box .inputs .botones .buttonCV .icon {
  color: #ff9933;
  fill: #ff9933;
  font-size: 1rem;
}
.Contacto .box .inputs .center {
  grid-column: 1/-1;
}
.Contacto .box .inputs .checkboxs {
  display: flex;
  justify-content: space-around;
  width: 20%;
}
.Contacto .box .botones {
  grid-column: 1/-1;
}
/*!*************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/GrupoGestion/GrupoGestion.scss ***!
  \*************************************************************************************************************************************/
.sectionGrupoGestion {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.sectionGrupoGestion .title {
  font-size: var(--font-mediana2);
}
.sectionGrupoGestion .item:not(:last-child) {
  margin-bottom: 1rem;
}

@media (max-width: 400px) {
  .wave-grupogestion {
    height: 44rem;
  }
}
@media (min-width: 401px) and (max-width: 500px) {
  .wave-grupogestion {
    height: 35rem;
  }
}
@media (min-width: 500px) {
  .wave-grupogestion {
    height: 90%;
    max-height: 40rem;
  }
}
@media (max-width: 500px) {
  .wave-grupogestion .fondowave {
    width: 1000px;
    translate: -400px;
  }
}
/*!***************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardAboutUs/CardAboutUs.scss ***!
  \***************************************************************************************************************************************/
.CardAboutUs {
  margin: 5rem 0;
  max-width: 70rem;
  color: var(--dark-color);
}
@media (max-width: 1200px) {
  .CardAboutUs {
    margin: 2rem 0;
  }
}
.CardAboutUs h1,
.CardAboutUs h2,
.CardAboutUs h3,
.CardAboutUs h4,
.CardAboutUs h5 {
  font-size: var(--font-grande);
  margin-bottom: 0.7rem !important;
  line-height: 1.8rem;
  font-weight: 800;
}
@media (max-width: 1200px) {
  .CardAboutUs h1,
  .CardAboutUs h2,
  .CardAboutUs h3,
  .CardAboutUs h4,
  .CardAboutUs h5 {
    text-align: center;
    margin-bottom: 1rem !important;
  }
}
.CardAboutUs .item,
.CardAboutUs p {
  color: var(--dark-color);
  margin-top: 0.5rem !important;
}
.CardAboutUs li {
  font-size: var(--font-mediana);
}
.CardAboutUs.case2 .Content {
  padding-right: 0;
  padding-left: 1rem;
}
.CardAboutUs .Content {
  height: 100%;
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: auto;
  padding-right: 1rem;
  max-width: 70ch;
}
.CardAboutUs .Content div p {
  min-height: var(--font-mediana);
}
.CardAboutUs .Content div ul {
  padding-left: 2rem !important;
}
@media screen and (min-width: 1200px) {
  .CardAboutUs .title {
    text-align: left;
  }
}
.CardAboutUs .textbox {
  display: -ms-grid;
  display: grid;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-grid-columns: 5% 95%;
  grid-template-columns: 5% 95%;
}
@media (max-width: 660px) {
  .CardAboutUs .textbox {
    -ms-grid-columns: 8% 92%;
    grid-template-columns: 8% 92%;
  }
}

.image {
  min-height: 5rem;
  display: grid;
  place-items: center;
}
@media screen and (max-width: 1200px) {
  .image {
    width: 100%;
    aspect-ratio: auto;
    max-width: 40rem;
  }
}
.image .imagen {
  width: 100%;
  height: 100%;
  border-radius: 1rem;
  box-shadow: 5px 4px 8px 0px rgba(0, 0, 0, 0.27);
  -webkit-box-shadow: 5px 4px 8px 0px rgba(0, 0, 0, 0.27);
  -moz-box-shadow: 5px 4px 8px 0px rgba(0, 0, 0, 0.27);
  place-self: end;
  object-fit: cover;
}
.image.m2::before {
  background-color: rgba(188, 203, 71, 0.33);
}
/*!*********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CaruselSliders/CaruselSliders.scss ***!
  \*********************************************************************************************************************************************/
.carouselTitle {
  max-width: 90vw !important;
  width: 32ch !important;
}

.industriasSection * > .carouselTitle {
  margin-bottom: 1rem;
  color: white;
  text-align: center;
  font-size: var(--font-grande);
  background-color: var(--stronggreen-color);
  padding: 1rem;
  border-radius: 5px;
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  left: 0px;
  right: auto;
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: 0px;
  left: auto;
}

.carousel {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 2rem;
  gap: 1rem;
  width: 100%;
}
.carousel .swiper-carousel {
  width: 100%;
  height: 100%;
  max-width: 90vw;
}
.carousel .swiper-carousel .swiper-button-next:after,
.carousel .swiper-carousel .swiper-button-prev:after {
  color: var(--grey-light-color) !important;
  scale: 50%;
}
.carousel .swiper-carousel .swiper-wrapper .swiper-slide-active {
  background: none;
  border: none;
  transition: all 200ms ease-in-out;
}
.carousel .swiper-carousel .swiper-wrapper .swiper-slide-active img {
  scale: 1.5;
}
.carousel .swiper-carousel .swiper-wrapper .swiper-slide-active p {
  transition: all 200ms ease-in-out;
  font-size: var(--font-grande);
}
.carousel .swiper-carousel .swiper-pagination .swiper-pagination-bullet-active {
  background: var(--stronggreen-color) !important;
}
.carousel .swiperSlide {
  text-align: center;
  font-size: 18px;
  background: transparent;
  height: 10rem;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  transition: all 500ms ease;
  border-radius: 5px;
  border: none;
}
/*!*****************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Slider/Slider.scss ***!
  \*****************************************************************************************************************************/
.slider {
  border: none;
  width: 100%;
  height: 100%;
  padding: 0.5rem;
  justify-content: center;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 500ms ease-in-out;
}
.slider .imagen {
  width: 80%;
}
@media (max-width: 768px) {
  .slider .imagen {
    width: 50%;
  }
}
.slider .industriaTexto {
  margin-top: 1rem;
}
.slider .industriaTexto p {
  font-size: var(--font-mediana2);
  text-align: center;
  color: var(--dark-color);
}
.slider:hover {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: none;
  transform: 110%;
  transition: all 500ms ease-in-out;
}
.slider:hover p {
  transition: all 200ms ease-in-out;
  font-size: var(--font-grande);
}
.slider:hover img {
  transition: all 200ms ease-in-out;
  scale: 1.1;
}
/*!***************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/WaveAnimada/WaveAnimada.scss ***!
  \***************************************************************************************************************************************/
.wave-containerHome {
  overflow: hidden;
  position: absolute;
  bottom: -19px;
  width: 100% !important;
}
.wave-containerHome .waveHome {
  background-image: url("data:image/svg+xml,%3Csvg width=%274656%27 height=%2760%27 viewBox=%270 0 4656 60%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cmask id=%27mask0_2235_5469%27 style=%27mask-type:alpha%27 maskUnits=%27userSpaceOnUse%27 x=%270%27 y=%270%27 width=%274656%27 height=%2760%27%3E%3Cpath d=%27M0 18.2577C0 18.2577 1115.5 59.3375 2328 18.2577C3540.5 -22.8221 4656 18.2577 4656 18.2577V60H0V18.2577Z%27 fill=%27white%27/%3E%3C/mask%3E%3Cg mask=%27url%28%23mask0_2235_5469%29%27%3E%3Cpath d=%27M0 18.2577C0 18.2577 1115.5 59.3375 2328 18.2577C3540.5 -22.8221 4656 18.2577 4656 18.2577V60H0V18.2577Z%27 fill=%27white%27/%3E%3Cpath d=%27M1937.76 -12.75H-968.878V25.659C170.145 64.2571 808.092 64.6364 1937.76 25.659V-12.75Z%27 fill=%27%23BBCB47%27/%3E%3Cpath d=%27M6603.85 -12.75H3697.21V25.659C4836.24 64.2571 5474.18 64.6364 6603.85 25.659V-12.75Z%27 fill=%27%23BBCB47%27/%3E%3Cpath d=%27M5106 -556.139C5106 -556.139 2734.9 -462.897 125.195 -546.812L62.1218 14.0666C2361.19 96.7978 5152.39 4.53483 5152.39 4.53483L5106 -556.139Z%27 fill=%27%23FF9933%27/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat;
  width: 16000px;
  height: 60px;
  z-index: 99999;
  overflow: hidden;
  animation: move-forever 30s linear infinite alternate;
}

@keyframes move-forever {
  0% {
    transform: translateX(0);
  }
}
@keyframes move-forever {
  100% {
    transform: translateX(-8000px);
  }
}
/*!***************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/BannerXLCarrousel/BannerXLCarrousel.scss ***!
  \***************************************************************************************************************************************************/
.BannerXLCarrousel {
  height: 50vh;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-position-y: initial;
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  z-index: 0;
  position: relative;
  padding-top: 3rem;
}
.BannerXLCarrousel:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.562);
  width: 100%;
  height: 100%;
  z-index: -1;
}
.BannerXLCarrousel .BannerBG {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.BannerXLCarrousel .titulo {
  font-size: var(--font-titulo);
  text-align: center;
  margin-bottom: 2%;
  z-index: 2;
  position: relative;
}
.BannerXLCarrousel .titulo.alone {
  font-size: var(--font-titulo);
  margin-bottom: 0;
}
.BannerXLCarrousel .titulo::first-letter {
  text-transform: uppercase;
}
.BannerXLCarrousel .titulo.postLineaNaranjaBottom::before {
  content: "";
  width: 100%;
  position: relative;
  bottom: -110%;
  background: var(--orange-color);
  height: 10px;
  display: block;
}
.BannerXLCarrousel p {
  font-size: var(--font-mediana);
  text-align: center;
  z-index: 2;
}

.SwiperHome {
  width: 100%;
  height: 100%;
  position: relative;
  left: 0;
  right: 0;
}
.SwiperHome .swiper-pagination {
  bottom: 60px !important;
}
.SwiperHome .swiper-pagination .swiper-pagination-bullet-active {
  background: white !important;
  scale: 1.2;
}

.swiperSliderBgImage {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.swiperSliderBgImage .titleContainer {
  height: 100%;
  display: flex;
  align-items: center;
}
.swiperSliderBgImage .titleContainer .titulo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-bottom: 6px solid var(--orange-color);
  margin-left: 4rem;
}
.swiperSliderBgImage .titleContainer .titulo > * {
  width: fit-content;
  max-width: 22ch;
  white-space: normal;
  overflow-wrap: anywhere;
}
.swiperSliderBgImage .swiperTitle {
  height: 100%;
}
.swiperSliderBgImage:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
}
/*!***********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/SectionIngresos/SectionIngresos.scss ***!
  \***********************************************************************************************************************************************/
.SectionIngresos {
  width: 100%;
  margin-top: 4rem;
  display: grid;
  place-items: center;
  min-height: 16rem;
  max-width: 900px;
}
@media (max-width: 768px) {
  .SectionIngresos {
    margin-top: 3rem;
    margin-bottom: -1rem;
  }
}
.SectionIngresos .cards {
  display: grid;
  place-items: center;
  grid-template-columns: 1fr 1fr 1fr;
  width: 100%;
  grid-gap: 3rem;
  flex-wrap: wrap;
}
.SectionIngresos .cards a {
  width: 100%;
  display: grid;
  place-items: center;
  text-decoration: none;
  transition: all 0.4s;
}
@media (max-width: 768px) {
  .SectionIngresos .cards {
    grid-template-columns: 1fr;
    grid-gap: 0.5rem;
    padding: 0 1rem;
  }
  .SectionIngresos .cards a .cardInicioIngreso {
    height: 5rem;
  }
}
.SectionIngresos .arrows {
  display: flex;
  justify-content: center;
}
/*!***********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CartaHome/CartaHome.scss ***!
  \***********************************************************************************************************************************/
.CartaHome {
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 15px;
  height: 15rem;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  transition: all 0.4s;
  box-shadow: 7px 7px 5px 0px rgba(0, 0, 0, 0.41);
  -webkit-box-shadow: 7px 7px 5px 0px rgba(0, 0, 0, 0.41);
  -moz-box-shadow: 7px 7px 5px 0px rgba(0, 0, 0, 0.41);
}
.CartaHome .textCartaHome p {
  color: white;
  width: 100%;
  z-index: 5;
  text-align: center;
  font-weight: 800;
  padding: 0 5%;
  margin: 0;
  font-size: var(--font-mediana2);
  position: relative;
  z-index: 2;
}
.CartaHome .textCartaHome p::selection {
  background: none;
  color: initial;
}
@media (max-width: 768px) {
  .CartaHome .textCartaHome {
    width: min(25rem, 100%);
  }
}
.CartaHome .textCartaHome::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 15px;
  height: 100%;
  width: 100%;
  background: var(--black-transparent);
  transition: all 0.4s;
}
.CartaHome .textCartaHome:hover::after {
  background: var(--orange-color-transparent);
}
.CartaHome .cardHome {
  width: 6rem;
}
.CartaHome .cardHome p {
  font-size: var(--font-mediana2);
}
/*!*************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Contadores/Contadores.scss ***!
  \*************************************************************************************************************************************/
.contadores {
  display: grid;
  grid-template-columns: repeat(auto-fill, clamp(6rem, 22vw, 25%));
  row-gap: 1rem;
  width: min(100%, 50rem);
  margin-top: 1.5rem;
  justify-items: center;
}
@media (max-width: 530px) {
  .contadores {
    grid-template-columns: 1fr 1fr;
  }
}
/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Contador/Contador.scss ***!
  \*********************************************************************************************************************************/
.CircularProgressbar {
  width: 8rem !important;
}
.CircularProgressbar text {
  font-weight: 800 !important;
}
/*!*****************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/ShowOnScreen/ShowOnScreen.scss ***!
  \*****************************************************************************************************************************************/

/*!*****************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/BannerXLdual/BannerXLdual.scss ***!
  \*****************************************************************************************************************************************/
.clip-path-t {
  clip-path: polygon(0 0, 100% 3rem, 100% 100%, 0% 100%);
}

.clip-path-b {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 3rem));
}

.bannerxl-bg {
  background: white;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.BannerXLdual {
  height: 50%;
  width: 100%;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 0;
  position: relative;
  align-items: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-position-y: initial;
}
.BannerXLdual:hover:after {
  transition: all 250ms ease-in-out;
  background: var(--darker-orange-color-transparent);
}
.BannerXLdual .top-container {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.BannerXLdual .top-container, .BannerXLdual .bottom-container {
  margin: 6rem 0;
}
.BannerXLdual:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  background: var(--black-transparent);
  width: 100%;
  height: 100%;
  z-index: -1;
}
.BannerXLdual .top-container .p-banner-top {
  width: 50%;
}
.BannerXLdual .top-container .p-banner-top p {
  font-size: var(--font-mediana);
  text-align: right;
  z-index: 2;
}
.BannerXLdual .text .p-banner-bot * {
  text-align: start !important;
}
.BannerXLdual .titulo {
  font-size: var(--font-titulo);
  margin-bottom: 1rem;
  z-index: 2;
  position: relative;
  color: white;
}
.BannerXLdual .titulo.alone {
  font-size: var(--font-gigante);
  margin-bottom: 0;
}
.BannerXLdual .titulo::first-letter {
  text-transform: uppercase;
}

.bannerxl-waveborde-t {
  position: absolute;
  z-index: 4;
  width: 103vw;
  margin-top: -1px;
  translate: -2vw;
}

.bannerxl-waveborde-b {
  position: absolute;
  z-index: 4;
  width: 103vw;
  bottom: -1px;
}

.bottom {
  color: white;
  border-top: 2px var(--orange-color);
  translate: 0 -2.5rem;
  text-align: start;
}
.bottom .bottom-container {
  display: flex;
  justify-content: space-between;
  position: relative;
}
.bottom .bottom-container .text .titulo {
  text-align: start;
}
.bottom .bannerxlb-button {
  width: 17rem;
  opacity: 0.8;
}
.bottom .p-banner-bot {
  width: max(50%, 30rem);
  text-align: start;
}

.bottom-container > .center-child > .bannerxlb-button {
  margin-top: 0px !important;
}

@media (max-width: 992px) {
  .bannerxl-waveborde-t {
    object-fit: fill;
    width: 200%;
  }
  .bannerxl-waveborde-b {
    object-fit: fill;
    width: 200%;
  }
  .BannerXLdual {
    align-items: center;
  }
  .BannerXLdual .top-container {
    align-items: center;
    padding: 3rem 1rem 2rem 1rem;
    margin: 0;
  }
  .BannerXLdual .top-container .titulo * {
    text-align: center;
  }
  .BannerXLdual .top-container .p-banner-top {
    width: 90vw;
  }
  .BannerXLdual .top-container .p-banner-top * {
    text-align: center !important;
  }
  .BannerXLdual .bottom-container {
    margin: 0;
    padding: 1rem 1rem 4rem;
  }
  .BannerXLdual .bottom-container .text .titulo {
    text-align: center;
  }
  .BannerXLdual .bottom-container .p-banner-bot {
    width: 90vw;
  }
  .BannerXLdual .bottom-container .p-banner-bot * {
    text-align: center;
  }
  .top {
    z-index: 2;
    border-bottom: 0.3rem solid white;
    height: fit-content;
    padding-top: 2.5rem;
  }
  .clip-path-t {
    clip-path: none;
  }
  .clip-path-b {
    clip-path: none;
  }
  .bottom {
    padding: 0;
    height: 55%;
    padding-top: 4rem;
  }
  .bottom .bottom-container {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem;
  }
  .bottom .bottom-container .p-banner-bot {
    text-align: center;
    width: 100%;
  }
}
/*!*************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Inicio/Inicio.scss ***!
  \*************************************************************************************************************************/
.modal-backdrop {
  display: grid;
  place-items: center;
}
.modal-backdrop .modal {
  max-width: 90vw !important;
}
.modal-backdrop .modal .modal-dialog {
  max-height: 90vh !important;
}

.modal-90vw {
  width: 100vw;
  height: 100vh;
  max-width: 100vw !important;
  display: grid;
  place-items: center;
  margin: 0 !important;
}
.modal-90vw .modal-content {
  border: 0 !important;
  background-color: transparent;
  display: grid;
  place-items: center;
  position: relative;
}
.modal-90vw .modal-content .closeButton {
  position: absolute;
  top: 1rem;
  z-index: 5;
  width: 12rem;
  height: 2rem;
  border-radius: 2rem;
  display: grid;
  place-items: center;
  background-color: var(--darker-color-transparent);
  border: 1px solid var(--dark-color);
  transition: all 200ms ease-in-out;
}
.modal-90vw .modal-content .closeButton:hover {
  background-color: var(--darker-color);
  box-shadow: 0 12px 16px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19);
}
.modal-90vw .modal-content .closeButton span {
  padding-right: 0.5rem;
  color: white;
}
.modal-90vw .modal-content .closeButton svg {
  color: white;
  font-size: var(--font-mediana);
}
.modal-90vw .modal-content .closeButton .cross {
  height: 100%;
  display: grid;
  place-items: center;
}
.modal-90vw .modal-content .modalImgbg {
  height: 90vh;
  width: 90vw;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.Inicio__BannerXL {
  height: 100vh;
  align-items: flex-start;
  padding-left: 5%;
}
.Inicio__BannerXL .tituloInicio {
  max-width: 22ch;
  text-align: left !important;
}
.Inicio__BannerXL .tituloInicio > * {
  font-size: var(--font-titulo);
  max-width: min(20ch, 90vw);
}
@media (max-width: 950px) {
  .Inicio__BannerXL .tituloInicio {
    align-self: center;
    margin-left: 1.5rem;
  }
}

.Cartas {
  display: flex;
  justify-content: center;
}
@media (max-width: 768px) {
  .Cartas {
    flex-direction: column;
    align-items: center;
    margin-block: 3rem;
  }
}

.btn-banner {
  width: fit-content;
  padding: 0.5rem 1rem;
}

.subtituloSection {
  line-height: 2rem;
}

.card2waveHome {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
/*!*******************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/MarcaEmpleadora/MarcaEmpleadora.scss ***!
  \*******************************************************************************************************************************************/
.card2waveMarcaEmpleadora {
  display: flex;
  flex-direction: column;
}
.card2waveMarcaEmpleadora iframe {
  border: 4px solid rgb(255, 223, 171);
  border-radius: 5px;
}
.card2waveMarcaEmpleadora .containerMarcaEmpleadoraBanner p {
  padding-top: 1rem;
}
.card2waveMarcaEmpleadora .containerMarcaEmpleadoraBanner .title {
  max-width: 100%;
}
.card2waveMarcaEmpleadora .containerMarcaEmpleadoraBanner .subtituloSection {
  text-align: start;
}
@media (max-width: 1024px) {
  .card2waveMarcaEmpleadora .containerMarcaEmpleadoraBanner {
    grid-template-columns: 1fr;
  }
}
/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Noticia/Noticia.scss ***!
  \***************************************************************************************************************************/
.noticiasContainer {
  display: grid;
  grid-template-columns: 10fr 2fr;
  gap: 1rem;
  margin-top: 3rem;
}
@media (max-width: 992px) {
  .noticiasContainer {
    grid-template-columns: 1fr;
  }
}
.noticiasContainer .blogPost h1, .noticiasContainer .blogPost h2, .noticiasContainer .blogPost h3, .noticiasContainer .blogPost h4, .noticiasContainer .blogPost h5 {
  margin-bottom: 1rem !important;
}
.noticiasContainer .blogPost ul, .noticiasContainer .blogPost ol {
  padding-left: 2rem !important;
  margin-bottom: 1rem !important;
}
.noticiasContainer .blogPost ul li, .noticiasContainer .blogPost ol li {
  line-height: 1.8rem;
  font-size: var(--font-mediana);
}
.noticiasContainer .blogPost ul li::marker, .noticiasContainer .blogPost ol li::marker {
  color: var(--darker-color) !important;
}
.noticiasContainer .blogPost p {
  margin-bottom: 1rem !important;
  min-height: var(--font-mediana);
}
/*!*******************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/SidebarPrensa/SidebarPrensa.scss ***!
  \*******************************************************************************************************************************************/
.sidebarPrensa .sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 50px;
  display: flex;
  flex-direction: column;
}
.sidebarPrensa .sticky .tituloBox {
  align-self: center;
}
.sidebarPrensa .sticky .sidebarPrensaNotas {
  display: flex;
  flex-direction: column;
  width: 20rem;
  align-self: center;
  background: white;
}
/*!***************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardNoticia/CardNoticia.scss ***!
  \***************************************************************************************************************************************/
.nota {
  height: fit-content;
  width: 100%;
  border-bottom: 1px solid var(--orange-color);
  background: white;
  display: flex;
  align-items: center;
  padding: 0.4rem 0;
}
.nota:first-child {
  border-top: 1px solid var(--orange-color);
}
.nota .notaTitle {
  display: flex;
  align-content: center;
  color: var(--darker-color);
  height: fit-content;
}
.nota .notaTitle * {
  align-self: center;
  padding-left: 0.2rem;
}
/*!*******************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Pagina404/Pagina404.scss ***!
  \*******************************************************************************************************************************/
.navbarBG {
  height: 5rem;
  width: 100%;
  background-color: black;
  position: sticky;
  top: 0;
  z-index: 4;
}

.Pagina404 {
  display: grid;
  place-items: center;
  height: 40vh;
}
.Pagina404 .content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.Pagina404 .content .logo {
  height: 100%;
  width: 100%;
  display: grid;
  place-items: center;
  margin-bottom: 1rem;
  scale: 1.5;
}
/*!*************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Prensa/Prensa.scss ***!
  \*************************************************************************************************************************/
.sectionPrensa {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.sectionPrensa .filtros {
  display: flex;
  justify-content: center;
}
.sectionPrensa .filtros > * {
  margin: 1rem;
}
.sectionPrensa .noticias {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}
@media (max-width: 992px) {
  .sectionPrensa .noticias {
    grid-template-columns: 100%;
  }
}

@media (max-width: 760px) {
  .sectionPrensa .filtros {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .sectionPrensa .noticias {
    grid-template-columns: 100%;
  }
}
/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardNews/CardNews.scss ***!
  \*********************************************************************************************************************************/
.CardNews {
  height: fit-content;
  display: flex;
  flex-direction: column;
}
.CardNews > .content {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: center;
  position: relative;
  text-align: center;
  height: 100%;
  width: 100%;
  min-height: 5rem;
}
.CardNews > .content .title-container {
  display: flex;
  flex-grow: 2;
  justify-content: center;
}
.CardNews > .content h1,
.CardNews > .content h2,
.CardNews > .content h3,
.CardNews > .content h4,
.CardNews > .content h5 {
  width: 100%;
  margin-bottom: 2rem;
}
@media (max-width: 768px) {
  .CardNews > .content h1,
  .CardNews > .content h2,
  .CardNews > .content h3,
  .CardNews > .content h4,
  .CardNews > .content h5 {
    text-align: start;
  }
}
.CardNews > .content .info {
  display: flex;
  justify-content: space-between;
  width: 100%;
  font-size: var(--font-chica);
  color: var(--dark-color);
  align-items: flex-end;
}
.CardNews > .content .info p {
  margin: 0;
}
.CardNews > .content h3 {
  font-size: var(--font-mediana);
}
.CardNews > .content .botones {
  display: flex;
  justify-content: space-around;
}
.CardNews > .content .botones button {
  font-size: var(--font-normal);
  margin: 0 0.3rem;
}
/*!*******************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Card1_0/Card1_0.scss ***!
  \*******************************************************************************************************************************/
.Card1_0 {
  border: 1px solid var(--grey-light);
  border-radius: 10px;
  width: 400px;
  height: min-content;
}
@media (max-width: 768px) {
  .Card1_0 {
    border: none;
  }
}
@media (max-width: 576px) {
  .Card1_0 {
    width: auto;
    padding: 1rem;
  }
}
@media (max-width: 768px) {
  .Card1_0 .bordeCard01_0 {
    width: 40%;
    height: 5px;
    background-color: var(--orange-color);
    margin-bottom: 0.5rem;
  }
}
.Card1_0 .imagen {
  background-size: cover;
  background-position: center;
  height: 200px;
  border-radius: 10px 10px 0 0;
}
@media (max-width: 768px) {
  .Card1_0 .imagen {
    height: 120px;
    border-radius: 0px;
  }
}
.Card1_0 .contentCard {
  background-color: white;
  padding: 1rem;
  border-radius: 10px;
  height: fit-content;
  min-height: 6rem;
}
@media (max-width: 768px) {
  .Card1_0 .contentCard {
    padding: 1rem 0;
    height: auto;
  }
}
/*!*********************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Servicios/AdministracionDeNominas/AdministracionDeNominas.scss ***!
  \*********************************************************************************************************************************************************************/

/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Redes/Redes.scss ***!
  \***************************************************************************************************************************/
.Redes {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  display: flex;
  width: 100%;
}
.Redes li {
  text-align: center;
  border-radius: 100%;
  margin-inline: 0.7rem;
}
.Redes li a {
  color: var(--grey-color);
  font-size: 1.7rem;
  transition: 0.3s all;
}
.Redes li a:hover {
  color: var(--orange-color);
}

@media (max-width: 1012px) {
  .Redes li a {
    font-size: 1.5rem;
  }
}
/*!*****************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Footer/Footer.scss ***!
  \*****************************************************************************************************************************/
.wave-footer {
  width: 100%;
  translate: 0 7px;
}

.arrowFooter {
  transition: all ease 0.5s;
  transform: rotate(180deg);
}
@media (max-width: 1024px) {
  .arrowFooter svg {
    width: 2.5rem;
  }
}
.arrowFooter.rotate {
  transform: rotate(0deg);
}

.footerlogo {
  position: relative;
}
.footerlogo img {
  margin-bottom: 2rem !important;
  width: 200px;
}

.Footers {
  height: 13rem;
  overflow: hidden;
  position: relative;
  transition: all ease 1s;
}
.Footers.agrandar {
  height: min-content;
}
@media (max-width: 925px) {
  .Footers.agrandar {
    height: min-content;
  }
}
@media (max-width: 600px) {
  .Footers.agrandar {
    height: min-content;
  }
}
.Footers.agrandar Footer {
  display: flex;
  flex-direction: column-reverse;
}
.Footers.agrandar Footer .columna {
  margin-bottom: 3rem;
}

.Footer {
  background: #fff;
  display: grid;
  grid-template-columns: 80% 20%;
  justify-items: center;
  padding: 2.5rem 0rem;
  transition: all ease 0.2s;
  height: 100%;
  overflow: hidden;
  opacity: 1;
}
.Footer.hide {
  height: 0;
  opacity: 0;
}
.Footer > * {
  padding-block: 0.4rem;
}
.Footer .title {
  font-weight: 600;
  font-size: var(--font-grande);
}
.Footer .tel {
  font-weight: 600;
  font-size: var(--font-grande);
}
.Footer .derechosReservados {
  text-align: center;
  padding-block: 2rem;
  padding-inline: 2em;
  font-size: var(--font-chica);
}
.Footer .trama {
  width: 100%;
  height: 70px;
  background-repeat: repeat-x;
  background-size: contain;
  background-color: #e4e4e4;
  background-position: center bottom;
}

.fila {
  width: 100%;
  display: flex;
  justify-content: center;
}

.serviciosFooter {
  display: flex;
  flex-wrap: wrap;
}
.serviciosFooter .columna {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 17rem;
  flex-grow: 1;
}
.serviciosFooter .columna .link {
  color: var(--orange-color);
  margin-bottom: 0.4rem;
  font-size: var(--font-grande);
  font-weight: 700;
  margin-bottom: 0.5rem !important;
  text-align: center;
}
.serviciosFooter .columna .sublink {
  color: var(--grey-color);
  margin-bottom: 0.4rem;
  text-decoration: none;
  font-size: var(--font-mediana);
  text-align: center;
  transition: all 100ms ease-in-out;
}
.serviciosFooter .columna .sublink:hover {
  color: var(--orange-color);
}

.columna {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.columna h3 {
  color: var(--dark-color);
  margin-bottom: 0.4rem;
  font-size: var(--font-mediana);
  font-weight: 700;
  margin-bottom: 0.5rem !important;
  text-align: center;
}
.columna p,
.columna a {
  color: var(--grey-color);
  margin-bottom: 0.4rem;
  text-decoration: none;
  font-size: var(--font-mediana);
  text-align: center;
}

.copyright {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--grey-color);
  width: 100%;
  padding: 0.9rem 4rem;
  font-size: var(--font-chica);
}

.Footer1 {
  z-index: 1;
  transform: translateY(15rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: all ease 1s;
  align-items: center;
}
.Footer1.show {
  transform: translateY(-4rem);
}

@media (max-width: 1012px) {
  .Footer {
    grid-template-columns: 100%;
    justify-items: center;
  }
  .Footer .fila {
    display: grid;
    grid-template-columns: repeat(3, auto);
  }
  .footerlogo img {
    width: 200px;
  }
  .footerlogo:after {
    font-size: 0.7rem;
  }
}
@media (max-width: 596px) {
  .Footer .fila {
    display: grid;
    grid-template-columns: 100%;
  }
  .Footer .fila h3 {
    margin: 1rem 0;
  }
  .copyright {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .copyright p {
    margin: 0.3rem;
    text-align: center;
    color: var(--grey-color);
  }
}
/*!*************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/ServiciosSection/ServiciosSection.scss ***!
  \*************************************************************************************************************************************************/
.serviciosSection {
  display: grid;
  grid-template-columns: 3fr 1fr;
  max-width: 1300px;
}
@media (max-width: 1200px) {
  .serviciosSection {
    display: flex;
    flex-direction: column;
  }
}
/*!*************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/BotonesServicios/BotonesServicios.scss ***!
  \*************************************************************************************************************************************************/
.SectionServicios {
  padding: 0 1rem;
  position: -webkit-sticky;
  position: sticky;
  top: 100px;
  align-self: start;
  background: white;
}
@media (max-width: 1200px) {
  .SectionServicios {
    place-self: center;
    margin-bottom: 5rem;
    margin-top: 3rem;
  }
}
.SectionServicios .tituloBox {
  max-width: none;
  padding: 0.2rem;
}
.SectionServicios .tituloBox * {
  margin: 0;
  font-size: var(--font-mediana2);
}
.SectionServicios .listaServicios {
  display: flex;
  flex-direction: column;
  width: 100%;
  border-top: 1px solid var(--grey-light-color);
}
.SectionServicios .listaServicios .serviciosLink {
  min-height: 3rem;
  border-bottom: 1px solid var(--grey-light-color);
  display: flex;
  align-items: center;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  color: var(--dark-color);
  font-size: var(--font-mediana);
  transition: all ease 0.2s;
}
.SectionServicios .listaServicios .serviciosLink.active {
  background: var(--orange-color);
  color: white;
}
.SectionServicios .listaServicios .serviciosLink:hover {
  background: var(--green-color);
  color: white;
}
/*!***********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Servicios/BusquedaYSeleccion/BusquedaYSeleccion.scss ***!
  \***********************************************************************************************************************************************************/

/*!***********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Servicios/OutsourcingCapital/OutsourcingCapital.scss ***!
  \***********************************************************************************************************************************************************/

/*!*******************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Puestos/Puestos.scss ***!
  \*******************************************************************************************************************************/
.puestos {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  font-size: var(--font-mediana);
  max-width: 50rem;
}
@media (max-width: 650px) {
  .puestos {
    grid-template-columns: 1fr 1fr;
  }
}
/*!*************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Puestos/Puesto/Puesto.scss ***!
  \*************************************************************************************************************************************/
.Puesto {
  max-width: 10rem;
  height: 7rem;
}
.Puesto img {
  max-width: 3rem;
  height: 2.5rem;
}
.Puesto .puestoTexto p {
  margin-top: 1rem;
  font-size: var(--font-chica);
  font-weight: 800;
  line-height: 1rem;
}
/*!*******************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/SectionCardServices/SectionCardServices.scss ***!
  \*******************************************************************************************************************************************************/
.cards-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 80rem;
}
/*!***********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardOutsourcing/CardOutsourcing.scss ***!
  \***********************************************************************************************************************************************/
.card-outsourcing {
  width: 16rem;
  margin: 1rem;
}
@media (max-width: 400px) {
  .card-outsourcing {
    width: 90vw;
    margin: 0;
  }
}
.card-outsourcing .img-container {
  height: 14rem;
  width: 100%;
  display: grid;
  place-items: center;
}
.card-outsourcing .img-container img {
  height: 13rem;
}
.card-outsourcing .text-container h1, .card-outsourcing .text-container h2, .card-outsourcing .text-container h3, .card-outsourcing .text-container h4, .card-outsourcing .text-container h5 {
  text-align: center;
  font-size: var(--font-mediana2);
  color: var(--grey-color);
  font-weight: 800;
  margin-bottom: 1rem !important;
}
.card-outsourcing .text-container p, .card-outsourcing .text-container li {
  font-size: var(--font-mediana);
  color: var(--dark-color);
}
.card-outsourcing .text-container li {
  margin-left: 2rem;
}
/*!*************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Servicios/OutsourcingProcesos/OutsourcingProcesos.scss ***!
  \*************************************************************************************************************************************************************/

/*!***********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/SliderServicios/SliderServicios.scss ***!
  \***********************************************************************************************************************************************/
.SliderServicios {
  width: 100%;
  width: 50rem;
  max-width: 90vw;
  margin: 3rem 0;
}
.SliderServicios div .tituloBox {
  width: fit-content;
  margin-bottom: 2rem;
  max-width: 90vw !important;
}
.SliderServicios .swiperProcesos {
  width: 100%;
}
.SliderServicios .swiperProcesos .swiper-button-next,
.SliderServicios .swiperProcesos .swiper-button-prev {
  top: 90%;
}
.SliderServicios .swiperProcesos .swiper-button-next:after,
.SliderServicios .swiperProcesos .swiper-button-prev:after {
  color: var(--orange-color) !important;
  padding: 0.8rem;
  scale: 50%;
}
.SliderServicios .swiperProcesos .swiper-wrapper .swiper-slide {
  border-radius: 10px;
}
.SliderServicios .swiperProcesos .swiper-pagination {
  bottom: 10px !important;
}
/*!*********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/SlideServicios/SlideServicios.scss ***!
  \*********************************************************************************************************************************************/
@charset "UTF-8";
.slideServicios {
  height: 100%;
  position: relative;
}
@media (max-width: 700px) {
  .slideServicios::after {
    position: absolute;
    bottom: 15px;
    display: grid;
    padding: 0 1rem;
    background: var(--orange-color-transparent);
    color: white;
    border-radius: 20px;
    place-items: center;
    content: "Más info";
    height: 2.5rem;
    left: 50%;
    translate: -50%;
  }
}
.slideServicios .content {
  height: 24rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  transition: all 200ms ease-in-out;
  border-radius: 20px;
  background-size: cover;
}
.slideServicios .content::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: var(--black-transparent);
  border-radius: 20px;
}
.slideServicios .content * {
  z-index: 2;
}
.slideServicios .content .title {
  width: 95%;
  padding: 1rem 0;
  height: 100%;
  display: grid;
  place-items: center;
  font-weight: 800;
  transition: all 400ms ease-in-out;
  color: rgb(255, 255, 255);
}
.slideServicios .content .description {
  position: absolute;
  width: 95%;
  height: 100%;
  text-align: center;
  transition: all 200ms ease-in-out;
  overflow: hidden;
  display: grid;
  place-items: center;
  color: var(--transparent);
}
.slideServicios .content .description * {
  line-height: var(--font-chica);
  font-size: var(--font-chica);
}
.slideServicios:hover .content .title * {
  color: var(--transparent);
  transition: all 200ms ease-in-out;
}
.slideServicios:hover .content::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: var(--orange-color-transparent);
  transition: all 200ms ease-in-out;
}
.slideServicios:hover .content .description {
  color: white;
  height: 24rem;
}
/*!*******************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Servicios/PersonalEventual/PersonalEventual.scss ***!
  \*******************************************************************************************************************************************************/
.cardPersonalEventual {
  width: 50%;
  margin: 0;
}
@media (max-width: 768px) {
  .cardPersonalEventual {
    width: 100%;
  }
}
/*!*******************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Servicios/RecibosDigitales/RecibosDigitales.scss ***!
  \*******************************************************************************************************************************************************/

/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Sucursales/Sucursales.scss ***!
  \*********************************************************************************************************************************/
.Sucursales {
  padding: 0 10%;
  margin-top: 2rem;
}
@media screen and (max-width: 1100px) {
  .Sucursales {
    grid-template-columns: 1fr;
    padding: 0 0.2rem;
  }
}
.Sucursales .searcher-container .Input1 {
  width: 25rem;
  text-align: start;
  max-width: 90vw;
}
.Sucursales .sucursalesMapa {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 7%;
  justify-content: center;
  justify-items: center;
  margin-top: 2rem;
}
@media screen and (max-width: 1100px) {
  .Sucursales .sucursalesMapa {
    grid-template-columns: 1fr;
  }
}
.Sucursales .sucursalesMapa .sucursales {
  width: 100%;
  overflow: scroll;
  height: 40rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 1100px) {
  .Sucursales .sucursalesMapa .sucursales {
    height: 15rem;
    flex-direction: row;
    width: 100%;
  }
}
.Sucursales .sucursalesMapa .mapa {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 600px;
  width: 100%;
  align-self: center;
}
.Sucursales .Searcher {
  display: flex;
  justify-content: center;
  position: sticky;
  top: 3%;
}
/*!*************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/BannerSucursales/BannerSucursales.scss ***!
  \*************************************************************************************************************************************************/
.BannerSucursales {
  margin: 2rem 0;
}
.BannerSucursales * {
  color: var(--darker-color);
}
.BannerSucursales .imgIcono {
  height: 8rem;
  width: 8rem;
}
.BannerSucursales .content {
  position: relative;
}
.BannerSucursales .content .itemIzq {
  position: relative;
}
@media (max-width: 768px) {
  .BannerSucursales .content .itemIzq {
    border-left: 0px;
  }
  .BannerSucursales .content .itemIzq::after {
    content: "";
    background: var(--orange-color);
    height: 3px;
    display: block;
    width: 60%;
    left: 22px;
    top: 0;
    margin: 1rem 20%;
    position: static;
  }
}
.BannerSucursales .itemDer {
  border-left: 3px solid var(--orange-color);
}
@media (max-width: 768px) {
  .BannerSucursales .itemDer {
    border-left: 0px;
  }
}
.BannerSucursales .textBannerSucursales {
  text-align: center;
}
/*!**********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardsSucursales/CardSucursales.scss ***!
  \**********************************************************************************************************************************************/
.sucursalesMapa .searcher-container {
  grid-column: 1/-1;
}

.sucursalSlide .cardSucursalSlide {
  width: 100%;
  max-width: none !important;
}

.swiperSucursales .sucursalSlide {
  margin-bottom: 2rem;
}
.swiperSucursales .swiper-button-next,
.swiperSucursales .swiper-button-prev {
  top: 90%;
}
.swiperSucursales .swiper-button-next:after,
.swiperSucursales .swiper-button-prev:after {
  color: var(--orange-color) !important;
  scale: 50%;
}
/*!*************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Card/Card.scss ***!
  \*************************************************************************************************************************/
.Card {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  padding: 1rem;
  border-radius: 10px;
  margin: 1rem;
  height: 15rem;
  width: 90%;
  box-shadow: var(--box-shadow-light);
  max-width: 30rem;
  max-height: 10rem;
  background: var(--white);
}
@media screen and (max-width: 1100px) {
  .Card {
    flex-shrink: 0;
    max-width: 23rem;
  }
}
.Card.hover {
  transition: all ease 0.5s;
  cursor: pointer;
}
.Card.hover:hover {
  transform: scale(0.97);
}
.Card.hover:focus, .Card.hover:active {
  transform: scale(1);
}
.Card .img {
  display: grid;
  place-items: center;
}
.Card .content .localidad {
  font-weight: 800;
}
.Card h3 {
  font-size: var(--font-mediana);
}
.Card p, .Card span, .Card .telefono {
  font-size: var(--font-mediana);
}
.Card .telefono {
  color: var(--bs-body-color);
  transition: all ease-in-out 200ms;
}
.Card .telefono:hover {
  color: var(--primary-color);
}
.Card .provincia {
  margin-left: 0.5rem;
  color: var(--dark-color);
}
/*!*************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardMobile/CardMobile.scss ***!
  \*************************************************************************************************************************************/
.CardMobile {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  padding: 1rem;
  border-radius: 10px;
  height: 15rem;
  width: 90%;
  box-shadow: var(--box-shadow-light);
  max-width: 80vw;
  max-height: 10rem;
  margin: 0.5rem 0;
}
@media screen and (max-width: 1100px) {
  .CardMobile {
    flex-shrink: 0;
    max-width: 23rem;
  }
}
.CardMobile.hover {
  transition: all ease 0.5s;
  cursor: pointer;
}
.CardMobile.hover:hover {
  transform: scale(0.97);
}
.CardMobile.hover:focus, .CardMobile.hover:active {
  transform: scale(1);
}
.CardMobile .img-container {
  margin-right: 0.2rem;
  display: grid;
  place-items: center;
}
.CardMobile .img-container .img {
  height: 2rem;
}
.CardMobile .content .localidad {
  font-weight: 800;
}
.CardMobile h3 {
  font-size: var(--font-mediana);
}
.CardMobile p {
  font-size: var(--font-chica);
}
/*!***********************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/Map/Map.scss ***!
  \***********************************************************************************************************************/
.imgMap {
  transform: translate(-50%, -100%);
  text-align: center;
}
/*!*********************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Tips/Tips.scss ***!
  \*********************************************************************************************************************/
.tips {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.tips .container .imagen {
  margin-bottom: 2rem;
}
.tips div {
  max-width: 80ch;
}
.tips div .tip h1,
.tips div .tip h2,
.tips div .tip h3,
.tips div .tip h4,
.tips div .tip h5 {
  margin-bottom: 1rem !important;
}
.tips div .tip p {
  margin-bottom: 1rem !important;
  min-height: var(--font-mediana);
}
.tips div .tip ul,
.tips div .tip ol {
  padding-left: 2rem !important;
  margin-bottom: 1rem !important;
}
.tips div .tip ul li,
.tips div .tip ol li {
  line-height: 1.8rem;
  font-size: var(--font-mediana);
}
.tips div .tip ul li::marker,
.tips div .tip ol li::marker {
  color: var(--darker-color) !important;
}
/*!*******************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/views/TransformamosVidas/TransformamosVidas.scss ***!
  \*******************************************************************************************************************************************************/
.img-background {
  background-image: url(/public/8c015be598ee713cefce.webp);
  background-size: cover;
  height: 100vh;
}

.TransformamosVidas {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  margin: 0 6rem;
}
.TransformamosVidas .postulate-text {
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 500px;
  line-height: 3.25rem;
  height: 85%;
  word-wrap: break-word;
}
@media (max-width: 960px) {
  .TransformamosVidas .postulate-text {
    display: none !important;
  }
}
.TransformamosVidas .postulate-text span {
  display: block;
  margin-top: 0;
}
.TransformamosVidas .postulate-text .principle-words {
  font-size: 105px;
  font-weight: bold;
  color: rgba(255, 255, 255, 0.8549019608);
}
.TransformamosVidas .postulate-text .secondary-words {
  font-size: 65px;
  font-weight: bold;
  color: orange;
  margin-left: 2rem;
}
/*!*********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/CardForm/CardForm.scss ***!
  \*********************************************************************************************************************************/
.CardForm {
  padding: 2rem;
  min-height: 450px;
  border-radius: 5px;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  background-color: white;
  position: relative;
  z-index: 4;
}
.CardForm .login {
  max-width: 300px;
}
.CardForm input {
  width: 100%;
  outline: none;
  text-align: center;
  border-radius: 5px;
  border: 1px solid #CDCDCD;
  padding: 0.1rem;
}
.CardForm input.custom-input {
  background-color: #f6f6f6;
  border-radius: 6px;
  height: 2rem;
  border: 0;
  border-bottom: 1px solid #CDCDCD;
}
.CardForm .ModalLogin {
  color: var(--dark-color);
}
.CardForm .ModalLogin .modal-content {
  padding: 1rem;
  background: #fff;
}
.CardForm .ModalLogin .modal-content .modal-header {
  background: #fff;
}
.CardForm .ModalLogin .modal-content .modal-body {
  background: #fff;
  padding: 1.52rem;
}
.CardForm .ModalLogin input {
  width: 100%;
  outline: none;
  border: none;
  border-bottom: 1px solid #CDCDCD;
  padding: 0.2rem;
}
.CardForm .ModalLogin a {
  color: var(--black);
  font-weight: 600;
}
.CardForm .ModalLogin a.recuperarclave {
  font-size: 1rem;
  font-weight: 400;
}
.CardForm .ModalLogin a:hover {
  color: var(--orange-color);
}
.CardForm .ModalLogin h5 {
  font-size: 1.2rem;
  font-weight: 800;
}
.CardForm .ModalLogin .btnGreen {
  margin-top: 0.5rem;
}
.CardForm .recuperarclave-LoginForm {
  color: var(--black-600);
}
.CardForm .recuperarclave-LoginForm:hover {
  color: var(--orange-800);
}
.CardForm .LoginForm-button {
  width: 100% !important;
  padding: 0.3 !important;
  margin-top: 1rem !important;
}
.CardForm .custom-input {
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0;
}

@media (max-width: 1500px) {
  .LoginForm {
    padding: 4rem 2rem !important;
  }
}
@media (min-width: 768px) {
  .LoginForm {
    margin-right: 3rem;
  }
}
@media (max-width: 350px) {
  .LoginForm {
    margin-top: 4rem !important;
  }
}
/*!*****************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/RestaurarClave/RestaurarClave.scss ***!
  \*****************************************************************************************************************************************/

/*!******************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/utils/ui/extra/InfoTooltip/InfoTooltip.scss ***!
  \******************************************************************************************************************************************/
.InfoTooltip {
  border-radius: 5px !important;
  max-width: 90vw;
  z-index: 50;
  opacity: 0.95;
  background: var(--black-800);
  box-shadow: 0 8px 32px 0 rgba(255, 153, 51, 0.0901960784);
  backdrop-filter: blur(50px) !important;
  -webkit-backdrop-filter: blur(50px) !important;
  border-radius: 10px;
}
.InfoTooltip ul li {
  line-height: 1rem;
}
/*!***********************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/componentes/LoginForm/LoginForm.scss ***!
  \***********************************************************************************************************************************/
.LoginForm {
  padding: 2rem;
  min-height: 450px;
  border-radius: 5px;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  background-color: white;
  position: relative;
  z-index: 4;
}
.LoginForm .login {
  max-width: 300px;
}
.LoginForm .ModalLogin {
  color: var(--dark-color);
}
.LoginForm .ModalLogin .modal-content {
  padding: 1rem;
  background: #fff;
}
.LoginForm .ModalLogin .modal-content .modal-header {
  background: #fff;
}
.LoginForm .ModalLogin .modal-content .modal-body {
  background: #fff;
  padding: 1.52rem;
}
.LoginForm .ModalLogin input {
  width: 100%;
  outline: none;
  border: none;
  border-bottom: 1px solid #CDCDCD;
  padding: 0.2rem;
}
.LoginForm .ModalLogin a {
  color: var(--black);
  font-weight: 600;
}
.LoginForm .ModalLogin a.recuperarclave {
  font-size: 1rem;
  font-weight: 400;
}
.LoginForm .ModalLogin a:hover {
  color: var(--orange-color);
}
.LoginForm .ModalLogin h5 {
  font-size: 1.2rem;
  font-weight: 800;
}
.LoginForm .ModalLogin .btnGreen {
  margin-top: 0.5rem;
}
.LoginForm .custom-input {
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0;
}
.LoginForm .recuperarclave-LoginForm {
  color: var(--black);
}
.LoginForm .recuperarclave-LoginForm:hover {
  color: var(--orange-800);
}
.LoginForm .LoginForm-button {
  width: 100% !important;
  padding: 0.3 !important;
  margin-top: 1rem !important;
}

@media (max-width: 1500px) {
  .LoginForm {
    padding: 4rem 2rem !important;
  }
}
@media (min-width: 768px) {
  .LoginForm {
    margin-right: 3rem;
  }
}
@media (max-width: 350px) {
  .LoginForm {
    margin-top: 4rem !important;
  }
  .login {
    max-width: 230px !important;
  }
  .login {
    max-width: 300px;
    font-family: var(--main-font);
  }
}
/*!******************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/ValidarCuenta/ValidateAccountCookieHandler.scss ***!
  \******************************************************************************************************************************************************/
.ValidateAccountCookieHandler .modal-body {
  position: relative;
}
/*!***************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/ValidarCuenta/ValidarCuenta.scss ***!
  \***************************************************************************************************************************************/
.img-background {
  background-image: url(/public/8c015be598ee713cefce.webp);
  background-size: cover;
  height: 100vh;
}

.green {
  color: #bbcb47 !important;
}

.ValidarCuenta {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
}
.ValidarCuenta .postulate-text {
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 500px;
  line-height: 2rem;
  margin-left: 6rem;
  height: 85%;
  word-wrap: break-word;
}
.ValidarCuenta .postulate-text br {
  display: block;
  /* makes it have a width */
  content: "";
  /* clears default height */
  margin-top: 0;
  /* change this to whatever height you want it */
}
.ValidarCuenta .postulate-text .principle-words {
  font-size: 105px;
  font-weight: bold;
  color: rgba(255, 255, 255, 0.7294117647);
}
.ValidarCuenta .postulate-text .secondary-words {
  font-size: 65px;
  font-weight: bold;
  color: orange;
  margin-left: 2rem;
}
.ValidarCuenta .modal-verificado {
  padding: 6rem 0rem;
}
.ValidarCuenta .modal-verificado .modal-header {
  border: none !important;
}

.wave-footer-validar {
  width: 100%;
  translate: 0 7px;
  position: absolute;
  bottom: 0;
}

@media (max-width: 960px) {
  .postulate-text {
    display: none !important;
  }
}
/*!****************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/Backoffice/componentes/Loader/Loader.scss ***!
  \****************************************************************************************************************************************/
.LoaderCustom {
  animation: myAnim 6s ease 0s infinite normal forwards;
}

@keyframes myAnim {
  0%, 50%, 100% {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}
/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/paginas/Soporte/soporte.scss ***!
  \***************************************************************************************************************************/
.contentSoporte {
  display: flex;
  justify-content: center;
  margin-bottom: 3rem;
}
.contentSoporte-element {
  width: 300px;
  display: flex;
  flex-direction: column;
  text-align: center;
  gap: 2rem;
}
.contentSoporte-element button {
  border: none;
  background-color: #C7DA3E;
  color: #1c1e21;
  border-radius: 7px;
  font-size: 30px;
  width: 100%;
  height: 50px;
}
/*!***********************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/App.scss (2) ***!
  \***********************************************************************************************************/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: var(--main-font) !important;
}

#root {
  width: 100%;
}
#root ul {
  padding: 0;
  margin: 0;
}
#root p {
  line-height: 1.8rem;
}
#root p,
#root h1,
#root h2,
#root h3 {
  margin: 0;
}

*.swiper-pagination {
  pointer-events: all !important;
}

*::marker {
  color: var(--orange-color) !important;
  width: 25px;
  height: 25px;
  place-content: center;
  place-items: center;
  font-size: 1.3rem;
}

body {
  background-image: url(/public/39fd84fd588249c5d909.webp);
  background-repeat: no-repeat;
  background-size: cover;
}

button {
  cursor: pointer;
  font-size: var(--font-boton);
}

a {
  cursor: pointer;
  text-decoration: none;
}

:root {
  --main-color: hotpink;
  --primary-color: #EF9729;
  --secondary-color: #EF9729;
  --orange-color: #FF9933;
  --lightorange-color: #ffc993;
  --orange-color-transparent: #d97b1ec9;
  --darker-orange-color-transparent: #4f2a05c9;
  --lighterorange-color: #FFEBD7;
  --button-color: #CCD443;
  --green-color: #BBCB47;
  --lightgreen-color: #bccb47a2;
  --stronggreen-color: #BBCB47;
  --celeste-color: #88D0C5;
  --lightgray-color:#f2f2f2;
  --text-editor-grey-border:#cecece;
  --grey-light-color: #A7A7A7;
  --grey-light: #a7a7a7a2;
  --dark-color: #3E434F;
  --darker-color-transparent: #1d2026b8;
  --darker-color: #1D2026;
  --main-font: "DM Sans", "Karla", sans-serif;
  --backoffice-font:"Inter","Karla", sans-serif;
  --grey-color: #212121;
  --black-transparent: rgba(0, 0, 0, 0.55);
  --transparent: rgba(0, 0, 0, 0);
  --blue-color: rgb(63, 63, 238);
  --lightgrey-color:#F5F5F5;
  --white:#fafafa;
  --orange-900: #db6f00;
  --orange-800: #ff9933;
  --orange-700: #ffa347;
  --orange-600: #ffad5c;
  --orange-500: #ffb870;
  --orange-400: #ffc285;
  --orange-300: #ffcc99;
  --orange-200: #ffd6ad;
  --orange-100: #ffe0c2;
  --green-900: #a8af55;
  --green-800: #ccd444;
  --green-700: #d3d959;
  --green-600: #d7dd69;
  --green-500: #dce17a;
  --green-400: #e0e58b;
  --green-300: #e5e89b;
  --green-200: #e5e89b;
  --green-100: #eef0bc;
  --blue-800: #6ebaae;
  --blue-700: #82c4ba;
  --blue-600: #90cbc2;
  --blue-500: #9ed1ca;
  --blue-400: #acd8d2;
  --blue-300: #baded9;
  --blue-200: #c8e4e1;
  --blue-100: #d6ebe9;
  --black-800: #303030;
  --black-700: #3d3d3d;
  --black-600: #474747;
  --black-500: #525252;
  --black-400: #5c5c5c;
  --black-300: #666666;
  --black-200: #707070;
  --black-100: #7a7a7a;
  --red-900: #ff4747;
  --red-800: #ff5555;
  --red-700: #ff7070;
  --red-600: #ff8585;
  --red-500: #ff9999;
  --red-400: #ffadad;
  --red-300: #ffc2c2;
  --red-200: #ffd6d6;
  --red-100: #ffebeb;
  --text-editor-grey:#f5f5f5;
  --query-mobile: 320px;
  --query-tablet: 768px;
  --query-large: 992px --query-notebook: 1024px;
  --font-chica: .9rem;
  --font-boton: 1rem;
  --font-mediana: 1.1rem;
  --font-mediana2: 1.3rem;
  --font-grande: 1.5rem;
  --font-subtitulo: 2rem;
  --font-titulo: 2.5rem;
  --font-gigante: 3rem;
  --box-shadow-light: 0px 2px 10px 5px #e9e9e9 ;
}
@media (max-width: 1100px) {
  :root {
    --font-titulo: 2rem;
  }
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 16px;
}

*::-webkit-scrollbar-track {
  background: #ffffff;
}

*::-webkit-scrollbar-thumb {
  background-color: #bcbcbc;
  border-radius: 10px;
  border: 3px solid #ffffff;
}

h3,
h4,
h5 {
  font-size: var(--font-subtitulo);
}

p {
  font-size: var(--font-mediana);
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.linkNegro {
  color: var(--dark-color);
}
.linkNegrohover {
  color: var(--dark-color);
}

input[type=number] {
  -moz-appearance: textfield;
  appearance: textfield;
}

@font-face {
  font-family: "BogleRegular";
  src: url(/public/d0be1d26741f2f7c2939.OTF) format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "BogleBold";
  src: url(/public/f5d2195088f7b53392a3.OTF) format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "BogleBlack";
  src: url(/public/4d9e8594bcf119a863a3.otf) format("truetype");
  font-weight: normal;
  font-style: normal;
}
.b400 {
  font-family: "BogleRegular", var(--main-font) !important;
}

.b800 {
  font-family: "BogleBold", var(--main-font) !important;
  font-weight: 800;
}

.font-chica {
  font-size: var(--font-chica);
}

.font-boton {
  font-size: var(--font-boton);
}

.font-mediana {
  font-size: var(--font-mediana);
}

.font-mediana2 {
  font-size: var(--font-mediana2);
}

.font-grande {
  font-size: var(--font-grande);
}

.font-subtitulo {
  font-size: var(--font-subtitulo);
}

.font-titulo {
  font-size: var(--font-titulo);
}

.font-gigante {
  font-size: var(--font-gigante);
}

.h0 {
  height: 0 !important;
}

.p0 {
  padding: 0 !important;
}

.w0 {
  width: 0rem !important;
}

.height0 {
  height: 0rem !important;
}

.h0vh {
  height: 0vh !important;
}

.m0 {
  margin: 0rem !important;
}

.ml0 {
  margin-left: 0rem !important;
}

.mb0 {
  margin-bottom: 0rem !important;
}

.mr0 {
  margin-right: 0rem !important;
}

.mt0 {
  margin-top: 0rem !important;
}

.mx0 {
  margin-inline: 0rem !important;
}

.my0 {
  margin-block: 0rem !important;
}

.w1 {
  width: 1rem !important;
}

.height1 {
  height: 1rem !important;
}

.h1vh {
  height: 10vh !important;
}

.m1 {
  margin: 1rem !important;
}

.ml1 {
  margin-left: 1rem !important;
}

.mb1 {
  margin-bottom: 1rem !important;
}

.mr1 {
  margin-right: 1rem !important;
}

.mt1 {
  margin-top: 1rem !important;
}

.mx1 {
  margin-inline: 1rem !important;
}

.my1 {
  margin-block: 1rem !important;
}

.w2 {
  width: 2rem !important;
}

.height2 {
  height: 2rem !important;
}

.h2vh {
  height: 20vh !important;
}

.m2 {
  margin: 2rem !important;
}

.ml2 {
  margin-left: 2rem !important;
}

.mb2 {
  margin-bottom: 2rem !important;
}

.mr2 {
  margin-right: 2rem !important;
}

.mt2 {
  margin-top: 2rem !important;
}

.mx2 {
  margin-inline: 2rem !important;
}

.my2 {
  margin-block: 2rem !important;
}

.w3 {
  width: 3rem !important;
}

.height3 {
  height: 3rem !important;
}

.h3vh {
  height: 30vh !important;
}

.m3 {
  margin: 3rem !important;
}

.ml3 {
  margin-left: 3rem !important;
}

.mb3 {
  margin-bottom: 3rem !important;
}

.mr3 {
  margin-right: 3rem !important;
}

.mt3 {
  margin-top: 3rem !important;
}

.mx3 {
  margin-inline: 3rem !important;
}

.my3 {
  margin-block: 3rem !important;
}

.w4 {
  width: 4rem !important;
}

.height4 {
  height: 4rem !important;
}

.h4vh {
  height: 40vh !important;
}

.m4 {
  margin: 4rem !important;
}

.ml4 {
  margin-left: 4rem !important;
}

.mb4 {
  margin-bottom: 4rem !important;
}

.mr4 {
  margin-right: 4rem !important;
}

.mt4 {
  margin-top: 4rem !important;
}

.mx4 {
  margin-inline: 4rem !important;
}

.my4 {
  margin-block: 4rem !important;
}

.w5 {
  width: 5rem !important;
}

.height5 {
  height: 5rem !important;
}

.h5vh {
  height: 50vh !important;
}

.m5 {
  margin: 5rem !important;
}

.ml5 {
  margin-left: 5rem !important;
}

.mb5 {
  margin-bottom: 5rem !important;
}

.mr5 {
  margin-right: 5rem !important;
}

.mt5 {
  margin-top: 5rem !important;
}

.mx5 {
  margin-inline: 5rem !important;
}

.my5 {
  margin-block: 5rem !important;
}

.w6 {
  width: 6rem !important;
}

.height6 {
  height: 6rem !important;
}

.h6vh {
  height: 60vh !important;
}

.m6 {
  margin: 6rem !important;
}

.ml6 {
  margin-left: 6rem !important;
}

.mb6 {
  margin-bottom: 6rem !important;
}

.mr6 {
  margin-right: 6rem !important;
}

.mt6 {
  margin-top: 6rem !important;
}

.mx6 {
  margin-inline: 6rem !important;
}

.my6 {
  margin-block: 6rem !important;
}

.w7 {
  width: 7rem !important;
}

.height7 {
  height: 7rem !important;
}

.h7vh {
  height: 70vh !important;
}

.m7 {
  margin: 7rem !important;
}

.ml7 {
  margin-left: 7rem !important;
}

.mb7 {
  margin-bottom: 7rem !important;
}

.mr7 {
  margin-right: 7rem !important;
}

.mt7 {
  margin-top: 7rem !important;
}

.mx7 {
  margin-inline: 7rem !important;
}

.my7 {
  margin-block: 7rem !important;
}

.w8 {
  width: 8rem !important;
}

.height8 {
  height: 8rem !important;
}

.h8vh {
  height: 80vh !important;
}

.m8 {
  margin: 8rem !important;
}

.ml8 {
  margin-left: 8rem !important;
}

.mb8 {
  margin-bottom: 8rem !important;
}

.mr8 {
  margin-right: 8rem !important;
}

.mt8 {
  margin-top: 8rem !important;
}

.mx8 {
  margin-inline: 8rem !important;
}

.my8 {
  margin-block: 8rem !important;
}

.w9 {
  width: 9rem !important;
}

.height9 {
  height: 9rem !important;
}

.h9vh {
  height: 90vh !important;
}

.m9 {
  margin: 9rem !important;
}

.ml9 {
  margin-left: 9rem !important;
}

.mb9 {
  margin-bottom: 9rem !important;
}

.mr9 {
  margin-right: 9rem !important;
}

.mt9 {
  margin-top: 9rem !important;
}

.mx9 {
  margin-inline: 9rem !important;
}

.my9 {
  margin-block: 9rem !important;
}

.w10 {
  width: 10rem !important;
}

.height10 {
  height: 10rem !important;
}

.h10vh {
  height: 100vh !important;
}

.m10 {
  margin: 10rem !important;
}

.ml10 {
  margin-left: 10rem !important;
}

.mb10 {
  margin-bottom: 10rem !important;
}

.mr10 {
  margin-right: 10rem !important;
}

.mt10 {
  margin-top: 10rem !important;
}

.mx10 {
  margin-inline: 10rem !important;
}

.my10 {
  margin-block: 10rem !important;
}

.mw0 {
  max-width: 0rem !important;
}

.mh0 {
  max-height: 0rem !important;
}

.mw1 {
  max-width: 1rem !important;
}

.mh1 {
  max-height: 1rem !important;
}

.mw2 {
  max-width: 2rem !important;
}

.mh2 {
  max-height: 2rem !important;
}

.mw3 {
  max-width: 3rem !important;
}

.mh3 {
  max-height: 3rem !important;
}

.mw4 {
  max-width: 4rem !important;
}

.mh4 {
  max-height: 4rem !important;
}

.mw5 {
  max-width: 5rem !important;
}

.mh5 {
  max-height: 5rem !important;
}

.mw6 {
  max-width: 6rem !important;
}

.mh6 {
  max-height: 6rem !important;
}

.mw7 {
  max-width: 7rem !important;
}

.mh7 {
  max-height: 7rem !important;
}

.mw8 {
  max-width: 8rem !important;
}

.mh8 {
  max-height: 8rem !important;
}

.mw9 {
  max-width: 9rem !important;
}

.mh9 {
  max-height: 9rem !important;
}

.mw10 {
  max-width: 10rem !important;
}

.mh10 {
  max-height: 10rem !important;
}

.mw11 {
  max-width: 11rem !important;
}

.mh11 {
  max-height: 11rem !important;
}

.mw12 {
  max-width: 12rem !important;
}

.mh12 {
  max-height: 12rem !important;
}

.mw13 {
  max-width: 13rem !important;
}

.mh13 {
  max-height: 13rem !important;
}

.mw14 {
  max-width: 14rem !important;
}

.mh14 {
  max-height: 14rem !important;
}

.mw15 {
  max-width: 15rem !important;
}

.mh15 {
  max-height: 15rem !important;
}

.mw16 {
  max-width: 16rem !important;
}

.mh16 {
  max-height: 16rem !important;
}

.mw17 {
  max-width: 17rem !important;
}

.mh17 {
  max-height: 17rem !important;
}

.mw18 {
  max-width: 18rem !important;
}

.mh18 {
  max-height: 18rem !important;
}

.mw19 {
  max-width: 19rem !important;
}

.mh19 {
  max-height: 19rem !important;
}

.mw20 {
  max-width: 20rem !important;
}

.mh20 {
  max-height: 20rem !important;
}

.mw21 {
  max-width: 21rem !important;
}

.mh21 {
  max-height: 21rem !important;
}

.mw22 {
  max-width: 22rem !important;
}

.mh22 {
  max-height: 22rem !important;
}

.mw23 {
  max-width: 23rem !important;
}

.mh23 {
  max-height: 23rem !important;
}

.mw24 {
  max-width: 24rem !important;
}

.mh24 {
  max-height: 24rem !important;
}

.mw25 {
  max-width: 25rem !important;
}

.mh25 {
  max-height: 25rem !important;
}

.mw26 {
  max-width: 26rem !important;
}

.mh26 {
  max-height: 26rem !important;
}

.mw27 {
  max-width: 27rem !important;
}

.mh27 {
  max-height: 27rem !important;
}

.mw28 {
  max-width: 28rem !important;
}

.mh28 {
  max-height: 28rem !important;
}

.mw29 {
  max-width: 29rem !important;
}

.mh29 {
  max-height: 29rem !important;
}

.mw30 {
  max-width: 30rem !important;
}

.mh30 {
  max-height: 30rem !important;
}

.mw31 {
  max-width: 31rem !important;
}

.mh31 {
  max-height: 31rem !important;
}

.mw32 {
  max-width: 32rem !important;
}

.mh32 {
  max-height: 32rem !important;
}

.mw33 {
  max-width: 33rem !important;
}

.mh33 {
  max-height: 33rem !important;
}

.mw34 {
  max-width: 34rem !important;
}

.mh34 {
  max-height: 34rem !important;
}

.mw35 {
  max-width: 35rem !important;
}

.mh35 {
  max-height: 35rem !important;
}

.mw36 {
  max-width: 36rem !important;
}

.mh36 {
  max-height: 36rem !important;
}

.mw37 {
  max-width: 37rem !important;
}

.mh37 {
  max-height: 37rem !important;
}

.mw38 {
  max-width: 38rem !important;
}

.mh38 {
  max-height: 38rem !important;
}

.mw39 {
  max-width: 39rem !important;
}

.mh39 {
  max-height: 39rem !important;
}

.mw40 {
  max-width: 40rem !important;
}

.mh40 {
  max-height: 40rem !important;
}

.mw41 {
  max-width: 41rem !important;
}

.mh41 {
  max-height: 41rem !important;
}

.mw42 {
  max-width: 42rem !important;
}

.mh42 {
  max-height: 42rem !important;
}

.mw43 {
  max-width: 43rem !important;
}

.mh43 {
  max-height: 43rem !important;
}

.mw44 {
  max-width: 44rem !important;
}

.mh44 {
  max-height: 44rem !important;
}

.mw45 {
  max-width: 45rem !important;
}

.mh45 {
  max-height: 45rem !important;
}

.mw46 {
  max-width: 46rem !important;
}

.mh46 {
  max-height: 46rem !important;
}

.mw47 {
  max-width: 47rem !important;
}

.mh47 {
  max-height: 47rem !important;
}

.mw48 {
  max-width: 48rem !important;
}

.mh48 {
  max-height: 48rem !important;
}

.mw49 {
  max-width: 49rem !important;
}

.mh49 {
  max-height: 49rem !important;
}

.mw50 {
  max-width: 50rem !important;
}

.mh50 {
  max-height: 50rem !important;
}

.mw51 {
  max-width: 51rem !important;
}

.mh51 {
  max-height: 51rem !important;
}

.mw52 {
  max-width: 52rem !important;
}

.mh52 {
  max-height: 52rem !important;
}

.mw53 {
  max-width: 53rem !important;
}

.mh53 {
  max-height: 53rem !important;
}

.mw54 {
  max-width: 54rem !important;
}

.mh54 {
  max-height: 54rem !important;
}

.mw55 {
  max-width: 55rem !important;
}

.mh55 {
  max-height: 55rem !important;
}

.mw56 {
  max-width: 56rem !important;
}

.mh56 {
  max-height: 56rem !important;
}

.mw57 {
  max-width: 57rem !important;
}

.mh57 {
  max-height: 57rem !important;
}

.mw58 {
  max-width: 58rem !important;
}

.mh58 {
  max-height: 58rem !important;
}

.mw59 {
  max-width: 59rem !important;
}

.mh59 {
  max-height: 59rem !important;
}

.mw60 {
  max-width: 60rem !important;
}

.mh60 {
  max-height: 60rem !important;
}

.mw61 {
  max-width: 61rem !important;
}

.mh61 {
  max-height: 61rem !important;
}

.mw62 {
  max-width: 62rem !important;
}

.mh62 {
  max-height: 62rem !important;
}

.mw63 {
  max-width: 63rem !important;
}

.mh63 {
  max-height: 63rem !important;
}

.mw64 {
  max-width: 64rem !important;
}

.mh64 {
  max-height: 64rem !important;
}

.mw65 {
  max-width: 65rem !important;
}

.mh65 {
  max-height: 65rem !important;
}

.mw66 {
  max-width: 66rem !important;
}

.mh66 {
  max-height: 66rem !important;
}

.mw67 {
  max-width: 67rem !important;
}

.mh67 {
  max-height: 67rem !important;
}

.mw68 {
  max-width: 68rem !important;
}

.mh68 {
  max-height: 68rem !important;
}

.mw69 {
  max-width: 69rem !important;
}

.mh69 {
  max-height: 69rem !important;
}

.mw70 {
  max-width: 70rem !important;
}

.mh70 {
  max-height: 70rem !important;
}

.mw71 {
  max-width: 71rem !important;
}

.mh71 {
  max-height: 71rem !important;
}

.mw72 {
  max-width: 72rem !important;
}

.mh72 {
  max-height: 72rem !important;
}

.mw73 {
  max-width: 73rem !important;
}

.mh73 {
  max-height: 73rem !important;
}

.mw74 {
  max-width: 74rem !important;
}

.mh74 {
  max-height: 74rem !important;
}

.mw75 {
  max-width: 75rem !important;
}

.mh75 {
  max-height: 75rem !important;
}

.mw76 {
  max-width: 76rem !important;
}

.mh76 {
  max-height: 76rem !important;
}

.mw77 {
  max-width: 77rem !important;
}

.mh77 {
  max-height: 77rem !important;
}

.mw78 {
  max-width: 78rem !important;
}

.mh78 {
  max-height: 78rem !important;
}

.mw79 {
  max-width: 79rem !important;
}

.mh79 {
  max-height: 79rem !important;
}

.mw80 {
  max-width: 80rem !important;
}

.mh80 {
  max-height: 80rem !important;
}

.mw81 {
  max-width: 81rem !important;
}

.mh81 {
  max-height: 81rem !important;
}

.mw82 {
  max-width: 82rem !important;
}

.mh82 {
  max-height: 82rem !important;
}

.mw83 {
  max-width: 83rem !important;
}

.mh83 {
  max-height: 83rem !important;
}

.mw84 {
  max-width: 84rem !important;
}

.mh84 {
  max-height: 84rem !important;
}

.mw85 {
  max-width: 85rem !important;
}

.mh85 {
  max-height: 85rem !important;
}

.mw86 {
  max-width: 86rem !important;
}

.mh86 {
  max-height: 86rem !important;
}

.mw87 {
  max-width: 87rem !important;
}

.mh87 {
  max-height: 87rem !important;
}

.mw88 {
  max-width: 88rem !important;
}

.mh88 {
  max-height: 88rem !important;
}

.mw89 {
  max-width: 89rem !important;
}

.mh89 {
  max-height: 89rem !important;
}

.mw90 {
  max-width: 90rem !important;
}

.mh90 {
  max-height: 90rem !important;
}

.mw91 {
  max-width: 91rem !important;
}

.mh91 {
  max-height: 91rem !important;
}

.mw92 {
  max-width: 92rem !important;
}

.mh92 {
  max-height: 92rem !important;
}

.mw93 {
  max-width: 93rem !important;
}

.mh93 {
  max-height: 93rem !important;
}

.mw94 {
  max-width: 94rem !important;
}

.mh94 {
  max-height: 94rem !important;
}

.mw95 {
  max-width: 95rem !important;
}

.mh95 {
  max-height: 95rem !important;
}

.mw96 {
  max-width: 96rem !important;
}

.mh96 {
  max-height: 96rem !important;
}

.mw97 {
  max-width: 97rem !important;
}

.mh97 {
  max-height: 97rem !important;
}

.mw98 {
  max-width: 98rem !important;
}

.mh98 {
  max-height: 98rem !important;
}

.mw99 {
  max-width: 99rem !important;
}

.mh99 {
  max-height: 99rem !important;
}

.mw100 {
  max-width: 100rem !important;
}

.mh100 {
  max-height: 100rem !important;
}

/* ---------------- */
@media (max-width: 1090px) {
  .h0-maxtablet {
    height: 0vh !important;
  }
}

@media (max-width: 1090px) {
  .m0-maxtablet {
    margin: 0rem !important;
  }
}

@media (max-width: 1090px) {
  .ml0-maxtablet {
    margin-left: 0rem !important;
  }
}

@media (max-width: 1090px) {
  .mb0-maxtablet {
    margin-bottom: 0rem !important;
  }
}

@media (max-width: 1090px) {
  .mr0-maxtablet {
    margin-right: 0rem !important;
  }
}

@media (max-width: 1090px) {
  .mt0-maxtablet {
    margin-top: 0rem !important;
  }
}

@media (max-width: 1090px) {
  .mx0-maxtablet {
    margin-inline: 0rem !important;
  }
}

@media (max-width: 1090px) {
  .my0-maxtablet {
    margin-block: 0rem !important;
  }
}

@media (max-width: 1090px) {
  .h1-maxtablet {
    height: 10vh !important;
  }
}

@media (max-width: 1090px) {
  .m1-maxtablet {
    margin: 1rem !important;
  }
}

@media (max-width: 1090px) {
  .ml1-maxtablet {
    margin-left: 1rem !important;
  }
}

@media (max-width: 1090px) {
  .mb1-maxtablet {
    margin-bottom: 1rem !important;
  }
}

@media (max-width: 1090px) {
  .mr1-maxtablet {
    margin-right: 1rem !important;
  }
}

@media (max-width: 1090px) {
  .mt1-maxtablet {
    margin-top: 1rem !important;
  }
}

@media (max-width: 1090px) {
  .mx1-maxtablet {
    margin-inline: 1rem !important;
  }
}

@media (max-width: 1090px) {
  .my1-maxtablet {
    margin-block: 1rem !important;
  }
}

@media (max-width: 1090px) {
  .h2-maxtablet {
    height: 20vh !important;
  }
}

@media (max-width: 1090px) {
  .m2-maxtablet {
    margin: 2rem !important;
  }
}

@media (max-width: 1090px) {
  .ml2-maxtablet {
    margin-left: 2rem !important;
  }
}

@media (max-width: 1090px) {
  .mb2-maxtablet {
    margin-bottom: 2rem !important;
  }
}

@media (max-width: 1090px) {
  .mr2-maxtablet {
    margin-right: 2rem !important;
  }
}

@media (max-width: 1090px) {
  .mt2-maxtablet {
    margin-top: 2rem !important;
  }
}

@media (max-width: 1090px) {
  .mx2-maxtablet {
    margin-inline: 2rem !important;
  }
}

@media (max-width: 1090px) {
  .my2-maxtablet {
    margin-block: 2rem !important;
  }
}

@media (max-width: 1090px) {
  .h3-maxtablet {
    height: 30vh !important;
  }
}

@media (max-width: 1090px) {
  .m3-maxtablet {
    margin: 3rem !important;
  }
}

@media (max-width: 1090px) {
  .ml3-maxtablet {
    margin-left: 3rem !important;
  }
}

@media (max-width: 1090px) {
  .mb3-maxtablet {
    margin-bottom: 3rem !important;
  }
}

@media (max-width: 1090px) {
  .mr3-maxtablet {
    margin-right: 3rem !important;
  }
}

@media (max-width: 1090px) {
  .mt3-maxtablet {
    margin-top: 3rem !important;
  }
}

@media (max-width: 1090px) {
  .mx3-maxtablet {
    margin-inline: 3rem !important;
  }
}

@media (max-width: 1090px) {
  .my3-maxtablet {
    margin-block: 3rem !important;
  }
}

@media (max-width: 1090px) {
  .h4-maxtablet {
    height: 40vh !important;
  }
}

@media (max-width: 1090px) {
  .m4-maxtablet {
    margin: 4rem !important;
  }
}

@media (max-width: 1090px) {
  .ml4-maxtablet {
    margin-left: 4rem !important;
  }
}

@media (max-width: 1090px) {
  .mb4-maxtablet {
    margin-bottom: 4rem !important;
  }
}

@media (max-width: 1090px) {
  .mr4-maxtablet {
    margin-right: 4rem !important;
  }
}

@media (max-width: 1090px) {
  .mt4-maxtablet {
    margin-top: 4rem !important;
  }
}

@media (max-width: 1090px) {
  .mx4-maxtablet {
    margin-inline: 4rem !important;
  }
}

@media (max-width: 1090px) {
  .my4-maxtablet {
    margin-block: 4rem !important;
  }
}

@media (max-width: 1090px) {
  .h5-maxtablet {
    height: 50vh !important;
  }
}

@media (max-width: 1090px) {
  .m5-maxtablet {
    margin: 5rem !important;
  }
}

@media (max-width: 1090px) {
  .ml5-maxtablet {
    margin-left: 5rem !important;
  }
}

@media (max-width: 1090px) {
  .mb5-maxtablet {
    margin-bottom: 5rem !important;
  }
}

@media (max-width: 1090px) {
  .mr5-maxtablet {
    margin-right: 5rem !important;
  }
}

@media (max-width: 1090px) {
  .mt5-maxtablet {
    margin-top: 5rem !important;
  }
}

@media (max-width: 1090px) {
  .mx5-maxtablet {
    margin-inline: 5rem !important;
  }
}

@media (max-width: 1090px) {
  .my5-maxtablet {
    margin-block: 5rem !important;
  }
}

@media (max-width: 1090px) {
  .h6-maxtablet {
    height: 60vh !important;
  }
}

@media (max-width: 1090px) {
  .m6-maxtablet {
    margin: 6rem !important;
  }
}

@media (max-width: 1090px) {
  .ml6-maxtablet {
    margin-left: 6rem !important;
  }
}

@media (max-width: 1090px) {
  .mb6-maxtablet {
    margin-bottom: 6rem !important;
  }
}

@media (max-width: 1090px) {
  .mr6-maxtablet {
    margin-right: 6rem !important;
  }
}

@media (max-width: 1090px) {
  .mt6-maxtablet {
    margin-top: 6rem !important;
  }
}

@media (max-width: 1090px) {
  .mx6-maxtablet {
    margin-inline: 6rem !important;
  }
}

@media (max-width: 1090px) {
  .my6-maxtablet {
    margin-block: 6rem !important;
  }
}

@media (max-width: 1090px) {
  .h7-maxtablet {
    height: 70vh !important;
  }
}

@media (max-width: 1090px) {
  .m7-maxtablet {
    margin: 7rem !important;
  }
}

@media (max-width: 1090px) {
  .ml7-maxtablet {
    margin-left: 7rem !important;
  }
}

@media (max-width: 1090px) {
  .mb7-maxtablet {
    margin-bottom: 7rem !important;
  }
}

@media (max-width: 1090px) {
  .mr7-maxtablet {
    margin-right: 7rem !important;
  }
}

@media (max-width: 1090px) {
  .mt7-maxtablet {
    margin-top: 7rem !important;
  }
}

@media (max-width: 1090px) {
  .mx7-maxtablet {
    margin-inline: 7rem !important;
  }
}

@media (max-width: 1090px) {
  .my7-maxtablet {
    margin-block: 7rem !important;
  }
}

@media (max-width: 1090px) {
  .h8-maxtablet {
    height: 80vh !important;
  }
}

@media (max-width: 1090px) {
  .m8-maxtablet {
    margin: 8rem !important;
  }
}

@media (max-width: 1090px) {
  .ml8-maxtablet {
    margin-left: 8rem !important;
  }
}

@media (max-width: 1090px) {
  .mb8-maxtablet {
    margin-bottom: 8rem !important;
  }
}

@media (max-width: 1090px) {
  .mr8-maxtablet {
    margin-right: 8rem !important;
  }
}

@media (max-width: 1090px) {
  .mt8-maxtablet {
    margin-top: 8rem !important;
  }
}

@media (max-width: 1090px) {
  .mx8-maxtablet {
    margin-inline: 8rem !important;
  }
}

@media (max-width: 1090px) {
  .my8-maxtablet {
    margin-block: 8rem !important;
  }
}

@media (max-width: 1090px) {
  .h9-maxtablet {
    height: 90vh !important;
  }
}

@media (max-width: 1090px) {
  .m9-maxtablet {
    margin: 9rem !important;
  }
}

@media (max-width: 1090px) {
  .ml9-maxtablet {
    margin-left: 9rem !important;
  }
}

@media (max-width: 1090px) {
  .mb9-maxtablet {
    margin-bottom: 9rem !important;
  }
}

@media (max-width: 1090px) {
  .mr9-maxtablet {
    margin-right: 9rem !important;
  }
}

@media (max-width: 1090px) {
  .mt9-maxtablet {
    margin-top: 9rem !important;
  }
}

@media (max-width: 1090px) {
  .mx9-maxtablet {
    margin-inline: 9rem !important;
  }
}

@media (max-width: 1090px) {
  .my9-maxtablet {
    margin-block: 9rem !important;
  }
}

@media (max-width: 1090px) {
  .h10-maxtablet {
    height: 100vh !important;
  }
}

@media (max-width: 1090px) {
  .m10-maxtablet {
    margin: 10rem !important;
  }
}

@media (max-width: 1090px) {
  .ml10-maxtablet {
    margin-left: 10rem !important;
  }
}

@media (max-width: 1090px) {
  .mb10-maxtablet {
    margin-bottom: 10rem !important;
  }
}

@media (max-width: 1090px) {
  .mr10-maxtablet {
    margin-right: 10rem !important;
  }
}

@media (max-width: 1090px) {
  .mt10-maxtablet {
    margin-top: 10rem !important;
  }
}

@media (max-width: 1090px) {
  .mx10-maxtablet {
    margin-inline: 10rem !important;
  }
}

@media (max-width: 1090px) {
  .my10-maxtablet {
    margin-block: 10rem !important;
  }
}

.z0 {
  position: relative;
  z-index: 0 !important;
}

.z-0 {
  position: relative;
  z-index: 0 !important;
}

.z1 {
  position: relative;
  z-index: 1 !important;
}

.z-1 {
  position: relative;
  z-index: -1 !important;
}

.z2 {
  position: relative;
  z-index: 2 !important;
}

.z-2 {
  position: relative;
  z-index: -2 !important;
}

.z3 {
  position: relative;
  z-index: 3 !important;
}

.z-3 {
  position: relative;
  z-index: -3 !important;
}

.p1 {
  padding: 1rem !important;
}

.pl1 {
  padding-left: 1rem !important;
}

.pb1 {
  padding-bottom: 1rem !important;
}

.pr1 {
  padding-right: 1rem !important;
}

.pt1 {
  padding-top: 1rem !important;
}

.px1 {
  padding-inline: 1rem !important;
}

.py1 {
  padding-block: 1rem !important;
}

.p2 {
  padding: 2rem !important;
}

.pl2 {
  padding-left: 2rem !important;
}

.pb2 {
  padding-bottom: 2rem !important;
}

.pr2 {
  padding-right: 2rem !important;
}

.pt2 {
  padding-top: 2rem !important;
}

.px2 {
  padding-inline: 2rem !important;
}

.py2 {
  padding-block: 2rem !important;
}

.p3 {
  padding: 3rem !important;
}

.pl3 {
  padding-left: 3rem !important;
}

.pb3 {
  padding-bottom: 3rem !important;
}

.pr3 {
  padding-right: 3rem !important;
}

.pt3 {
  padding-top: 3rem !important;
}

.px3 {
  padding-inline: 3rem !important;
}

.py3 {
  padding-block: 3rem !important;
}

.p4 {
  padding: 4rem !important;
}

.pl4 {
  padding-left: 4rem !important;
}

.pb4 {
  padding-bottom: 4rem !important;
}

.pr4 {
  padding-right: 4rem !important;
}

.pt4 {
  padding-top: 4rem !important;
}

.px4 {
  padding-inline: 4rem !important;
}

.py4 {
  padding-block: 4rem !important;
}

.p5 {
  padding: 5rem !important;
}

.pl5 {
  padding-left: 5rem !important;
}

.pb5 {
  padding-bottom: 5rem !important;
}

.pr5 {
  padding-right: 5rem !important;
}

.pt5 {
  padding-top: 5rem !important;
}

.px5 {
  padding-inline: 5rem !important;
}

.py5 {
  padding-block: 5rem !important;
}

.relative {
  position: relative;
}

.color-white {
  color: #FFF !important;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

.w0 {
  width: 0% !important;
}

@media (max-width: 1090px) {
  .w0-maxtablet {
    width: 0% !important;
  }
}

.w5 {
  width: 5% !important;
}

@media (max-width: 1090px) {
  .w5-maxtablet {
    width: 5% !important;
  }
}

.w10 {
  width: 10% !important;
}

@media (max-width: 1090px) {
  .w10-maxtablet {
    width: 10% !important;
  }
}

.w15 {
  width: 15% !important;
}

@media (max-width: 1090px) {
  .w15-maxtablet {
    width: 15% !important;
  }
}

.w20 {
  width: 20% !important;
}

@media (max-width: 1090px) {
  .w20-maxtablet {
    width: 20% !important;
  }
}

.w25 {
  width: 25% !important;
}

@media (max-width: 1090px) {
  .w25-maxtablet {
    width: 25% !important;
  }
}

.w30 {
  width: 30% !important;
}

@media (max-width: 1090px) {
  .w30-maxtablet {
    width: 30% !important;
  }
}

.w35 {
  width: 35% !important;
}

@media (max-width: 1090px) {
  .w35-maxtablet {
    width: 35% !important;
  }
}

.w40 {
  width: 40% !important;
}

@media (max-width: 1090px) {
  .w40-maxtablet {
    width: 40% !important;
  }
}

.w45 {
  width: 45% !important;
}

@media (max-width: 1090px) {
  .w45-maxtablet {
    width: 45% !important;
  }
}

.w50 {
  width: 50% !important;
}

@media (max-width: 1090px) {
  .w50-maxtablet {
    width: 50% !important;
  }
}

.w55 {
  width: 55% !important;
}

@media (max-width: 1090px) {
  .w55-maxtablet {
    width: 55% !important;
  }
}

.w60 {
  width: 60% !important;
}

@media (max-width: 1090px) {
  .w60-maxtablet {
    width: 60% !important;
  }
}

.w65 {
  width: 65% !important;
}

@media (max-width: 1090px) {
  .w65-maxtablet {
    width: 65% !important;
  }
}

.w70 {
  width: 70% !important;
}

@media (max-width: 1090px) {
  .w70-maxtablet {
    width: 70% !important;
  }
}

.w75 {
  width: 75% !important;
}

@media (max-width: 1090px) {
  .w75-maxtablet {
    width: 75% !important;
  }
}

.w80 {
  width: 80% !important;
}

@media (max-width: 1090px) {
  .w80-maxtablet {
    width: 80% !important;
  }
}

.w85 {
  width: 85% !important;
}

@media (max-width: 1090px) {
  .w85-maxtablet {
    width: 85% !important;
  }
}

.w90 {
  width: 90% !important;
}

@media (max-width: 1090px) {
  .w90-maxtablet {
    width: 90% !important;
  }
}

.w95 {
  width: 95% !important;
}

@media (max-width: 1090px) {
  .w95-maxtablet {
    width: 95% !important;
  }
}

.w100 {
  width: 100% !important;
}

@media (max-width: 1090px) {
  .w100-maxtablet {
    width: 100% !important;
  }
}

.w-fit {
  width: fit-content;
}

.d-none {
  display: none !important;
}

.wmincontent {
  width: min-content !important;
}

.hmincontent {
  height: min-content !important;
}

.wmaxcontent {
  width: max-content !important;
}

.hmaxcontent {
  height: max-content !important;
}

.title {
  text-align: center;
  font-size: var(--font-grande);
}

.text-l {
  text-align: left;
}

.text-r {
  text-align: right;
}

.secondarytitle {
  text-align: left;
  margin-bottom: 2rem;
  font-size: var(--font-grande);
}

.bg-attach-fix {
  background-attachment: fixed;
}

.gridcenter {
  grid-column: 1/-1 !important;
  width: 100% !important;
}

.dflex {
  display: flex !important;
}

.justify-center {
  justify-content: center !important;
}

.justify-between {
  justify-content: space-between !important;
}

.align-center {
  align-items: center !important;
}

.align-baseline {
  align-items: baseline !important;
}

.dcenter {
  display: flex !important;
  justify-content: center !important;
}

.dcol {
  display: flex;
  flex-direction: column !important;
}

.drow {
  display: flex;
  flex-direction: row !important;
}

.relative {
  position: relative;
}

.dcolcenter {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
}

.color-grey {
  color: var(--grey-color) !important;
}

.relative {
  position: relative;
}

.check {
  font-size: 1.2rem !important;
  display: inline-block;
  color: #FF9933;
  transform: translateY(4px);
}

.leermas {
  color: #FF9933;
  width: max-content;
  min-width: fit-content;
  cursor: pointer;
  transition: color 150ms ease-in-out;
}
.leermas svg {
  margin-left: 5px;
  font-size: 1.2rem;
}
.leermas:hover {
  color: var(--stronggreen-color) !important;
}

.center-child {
  display: grid;
  place-items: center;
}

.tituloImagen {
  font-size: var(--font-gigante) !important;
}

.tituloSection {
  font-size: var(--font-mediana2) !important;
}

.subtituloSection {
  font-size: var(--font-mediana) !important;
}

.parrafoSection {
  font-size: var(--font-normal) !important;
}

.tituloBox {
  margin-bottom: 1rem;
  color: white;
  text-align: center;
  font-size: var(--font-grande);
  background-color: var(--stronggreen-color);
  padding: 1rem;
  border-radius: 5px;
}

@media (max-width: 630px) {
  .mobile-dnone {
    display: none !important;
  }
}
.swiper-pagination-bullet-active {
  background: var(--orange-color) !important;
}

.rojo {
  color: var(--red-800);
}

.shadowButton {
  box-shadow: 0 10px 30px 0 rgba(95, 186, 233, 0.4);
}

.separador {
  display: grid;
  grid-template-columns: 30% 60%;
  grid-column-gap: 10%;
  color: white;
}
.separador .title {
  grid-column: 1/-1;
  font-weight: 500;
  font-size: var(--font-grande);
}

.btnGreen {
  background: var(--orange-color);
  border-radius: 6px;
  border: none;
  transition: all ease 0.3s;
  width: 10rem;
  padding: 0.5rem;
  color: #fff !important;
  font-weight: 400;
  font-size: var(--font-boton);
  margin-top: 1rem;
  max-height: 3rem;
}
.btnGreen a {
  color: #fff !important;
  text-decoration: none;
  outline: none;
  position: relative;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 1rem;
  text-align: center;
}
.btnGreen:hover {
  background: #e6811d;
}
.btnGreen:disabled, .btnGreen[disabled=true], .btnGreen[disabled=disabled] {
  filter: grayscale(0.6);
}

.btnOrange {
  background: var(--orange-color);
  border-radius: 6px;
  border: none;
  transition: all ease 0.3s;
  width: 10rem;
  padding: 0.5rem;
  color: #fff !important;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 0.4rem;
  border-radius: 10px;
  font-size: var(--font-chica);
}
.btnOrange a {
  color: #fff !important;
  text-decoration: none;
  outline: none;
  position: relative;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 1rem;
  text-align: center;
}
.btnOrange:hover {
  background: #f88c1f;
}
.btnOrange:disabled, .btnOrange[disabled=true], .btnOrange[disabled=disabled] {
  filter: grayscale(0.6);
}

.btnWhite {
  background: #fff !important;
  border-radius: 6px;
  border: none;
  transition: all ease 0.3s;
  width: 10rem;
  padding: 0.5rem;
  color: var(--orange-color) !important;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 0.4rem;
  border-radius: 10px;
  font-size: var(--font-chica);
  border: 1px solid var(--orange-color);
}
.btnWhite a {
  color: var(--orange-color) !important;
  text-decoration: none;
  outline: none;
  position: relative;
  font-weight: 400;
  font-size: var(--font-boton);
  padding: 1rem;
  text-align: center;
}
.btnWhite:hover {
  background: #f88c1f;
}
.btnWhite:disabled, .btnWhite[disabled=true], .btnWhite[disabled=disabled] {
  filter: grayscale(0.6);
}

.Button {
  min-width: 6rem;
  width: auto;
  height: 2rem;
  border-radius: 5px;
  border: none;
  color: var(--white);
  background-color: var(--green-color);
  border: none;
  z-index: 99;
  border: 2px solid transparent;
  -webkit-transition: 0.4s all;
  transition: 0.4s all;
}
.Button:hover {
  background-color: var(--white);
  transition: 0.4s all;
  border: 2px solid var(--green-color);
  color: var(--green-color);
}
.Button:disabled, .Button[disabled=true], .Button[disabled=disabled] {
  filter: grayscale(0.6);
}

.Button-orange {
  min-width: 6rem;
  width: auto;
  height: 2rem;
  border-radius: 5px;
  border: none;
  color: var(--white);
  background-color: var(--orange-color);
  border: none;
  z-index: 99;
  border: 2px solid transparent;
  -webkit-transition: 0.4s all;
  transition: 0.4s all;
}
.Button-orange:hover {
  background-color: var(--white);
  transition: 0.4s all;
  border: 2px solid var(--orange-color);
  color: var(--orange-color);
}
.Button-orange:disabled, .Button-orange[disabled=true], .Button-orange[disabled=disabled] {
  filter: grayscale(0.6);
}

.Button-gray {
  min-width: 6rem;
  width: auto;
  height: 2rem;
  border-radius: 5px;
  border: none;
  color: var(--white);
  background-color: var(--grey-light-color);
  border: none;
  z-index: 99;
  border: 2px solid transparent;
  -webkit-transition: 0.4s all;
  transition: 0.4s all;
}
.Button-gray:hover {
  background-color: var(--white);
  transition: 0.4s all;
  border: 2px solid var(--grey-light-color);
  color: var(--grey-light-color);
}
.Button-gray:disabled, .Button-gray[disabled=true], .Button-gray[disabled=disabled] {
  filter: grayscale(0.6);
}

.radio1 {
  position: relative;
  margin-right: 0.4rem;
  background-color: transparent;
}

input[type=radio]:after {
  width: 15px;
  height: 15px;
  border-radius: 15px;
  top: -2px;
  left: -1px;
  position: relative;
  background-color: white;
  content: "";
  display: inline-block;
  visibility: visible;
  border: 2px solid white;
}

input[type=radio]:checked:after {
  width: 15px;
  height: 15px;
  border-radius: 15px;
  top: -2px;
  left: -1px;
  position: relative;
  background-color: #ffa500;
  content: "";
  display: inline-block;
  visibility: visible;
  border: 2px solid white;
}