.heroarea-licencia{

  background-image: url("back1.jpg");
   background-repeat: no-repeat;
  background-size: 100% 130%;
  overflow: hidden;
   height: 85vh;
   display: flex;
   flex-direction: column;
}



@media (min-width: 1px) {
.heroarea-licencia{
 min-height: 450px;
 height: 50vh;
}


@media (min-width: 600px) {
.heroarea-licencia {
min-height: 400px;
 height: 75vh;
}
}

@media (min-width: 900px) {
.heroarea-licencia {
min-height: 400px;
 height: 85vh;
}
}

@media (min-width: 1400px) {
.heroarea-licencia {
min-height: 700px;
}
}


@media (min-width: 1920px) {
.heroarea-licencia{
min-height: 1200px;
}
}


@media (min-width: 2400px) {
.heroarea-licencia{
min-height: 1200px;
}
}


.hero-content-wrappper {
display: grid;
align-items: center;
justify-items: center;
grid-template-columns: .7fr .4fr;
grid-template-rows: 1fr;
gap: 40px;
flex: 1 0 0;
align-self: stretch;
height: 100%;
width: 100%;

}

.hero-text-wrapper
{
  float: left;
display: flex;
flex-direction: column;
padding: 10px 5px;
justify-content: center;
align-items: center;
gap: 10px;
flex: 1 0 0;
width: 100%;
height: 30vw;
background: rgba(38, 157, 152, 0.5);
}



@media (min-width: 1px) {
.hero-text-wrapper {
padding: 10px 1px;
}
}


@media (min-width: 600px) {
.hero-text-wrapper {
padding: 10px 5px;
}
}

.h14 {
  display: flex;
align-items: center;
color: #fff;
}


.h24 {
  color: #fff;
}

.servicio {
background-size: 100% 100%;
background-repeat: no-repeat;
display: grid;
flex-direction: column;
justify-content: center;
justify-items: center;
flex: 1 0 0;
color: #FFF;
text-align: center;
font-family: Inter;
font-size: calc(10px + 2vw);
font-style: normal;
font-weight: 500;
line-height: normal;
width: 100%;
}

.servicio-green {
  color: #04BAA4;
  font-weight: 700;
}


/********************************BANNER**************************/
.banner {
  display: flex;
height: 40VW;
min-width: 200PX;
justify-content: center;
align-items: center;
gap: 10px;
align-self: stretch;
background: #04BAA4;
justify-content: center;
}

@media (min-width: 1px) {
.banner{
  display: flex;
height: 25VW;
min-height: 250PX;
justify-content: center;
align-items: center;
gap: 10px;
align-self: stretch;
background: #04BAA4;
justify-content: center;
}
.banner-text {
  display: flex;
width: 80%;
min-height: 150px;
height: 20vw;
max-height: 250px;
font-size: calc(12px + 1.5vw);
flex-direction: column;
justify-content: center;
color: #FFF;
text-align: center;
font-family: Inter;
font-size: calc();
font-style: normal;
font-weight: 800;
line-height: normal;
text-transform: uppercase;
}



.banner-text-green {
  color: #256081;
font-family: Inter;
font-size: calc(12px + 1.5vw)
font-style: italic;
font-weight: 800;
line-height: normal;
text-transform: uppercase;
}

/********************************GRID-INDEX**************************/

.grid-general-index
{
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, 1fr);
  padding: 10px 10px;
  background: linear-gradient(180deg, rgba(48, 102, 133, 0.70) 16.98%, rgba(56, 189, 181, 0.70) 100%), url(<path-to-image>), lightgray 50% / cover no-repeat;
}

@media (min-width: 1px) {
.grid-general-index {

  padding: 20px 0px;
}
}

@media (min-width: 410px) {
.grid-general-index {

  padding: 10px 10px;
}
}


.grid-wrapper-index {
 display: grid;
grid-template-columns: 1.1fr .7fr;
justify-content: center;
  align-items: center;
  align-items: center;
  gap: 0px;
  margin: 5vh auto;
  max-width: 1400px;
 height: 450px;
  min-height: 200px;
  overflow: hidden;
  grid-gap: 10PX;

}

@media (min-width: 1px) {
.grid-wrapper-index {

  margin: 5px auto;
  width: 95vw;
 max-width: 550px;
 height: 250px;
 overflow: hidden;
 justify-items: CENTER;
 grid-gap: 0PX;
}
}


@media (min-width: 600px) {
.grid-wrapper-index {

 min-height: 200px;
  margin: 10px auto;
 width: 95vw;
 max-width: 850px;
 height: 300px;
 overflow: hidden;
 position: relative;
 grid-gap: 0PX;
}
}

@media (min-width: 900px) {
.grid-wrapper-index {

 min-height: 200px;
 max-width: 1400px;
 margin: 10px auto;
  width: 95vw;
max-width: 1150px;
 height: 350px;
 grid-gap: 10PX;
}
}

@media (min-width: 1200px) {
.grid-wrapper-index {

 min-height: 200px;
 max-width: 1400px;
 margin: 10px auto;
 width: 95vw;
 max-width: 1550px;
 height: 450px;
  grid-gap: 10PX;
}
}

@media (min-width: 1600px) {
.grid-wrapper-index {

 min-height: 200px;
 max-width: 1400px;
 margin: 10px auto;
 width: 1850px;
 height: 480px;
}
}

@media (min-width: 1900px) {
.grid-wrapper-index {
width: 95vw;
max-width: 1850px;
margin: 20px auto;
 height: 600px;
}
}


.grid-wrapper-index-reverse {
 display: grid;
grid-template-columns: .6fr .7fr;
justify-content: center;
  align-items: center;
  gap: 0px;
  margin: 10px auto;
  max-width: 1400px;
  width: 100vw;
  height: 450px;
  min-height: 200px;
  grid-gap: 10PX;
  z-index: 10;

}


@media (min-width: 1px) {
.grid-wrapper-index-reverse {

  margin: 5px auto;
  width: 95vw;
 max-width: 550px;
 height: 250px;
 overflow: hidden;
 justify-items: CENTER;
 grid-gap: 0PX;
}
}

@media (min-width: 600px) {
.grid-wrapper-index-reverse {

 min-height: 200px;
  margin: 10px auto;
 width: 95vw;
 max-width: 850px;
 height: 300px;
 overflow: hidden;
 grid-gap: 0PX;
}
}

@media (min-width: 900px) {
.grid-wrapper-index-reverse {

 min-height: 200px;
 max-width: 1400px;
 margin: 0px auto;
  width: 95vw;
max-width: 1150px;
 height: 350px;
 grid-gap: 10PX;
}
}

@media (min-width: 1200px) {
.grid-wrapper-index-reverse {

 min-height: 200px;
 max-width: 1400px;
 margin: 10px auto;
 width: 95vw;
 max-width: 1550px;
 height: 450px;
}
}

@media (min-width: 1600px) {
.grid-wrapper-index-reverse {

 min-height: 200px;
 max-width: 1400px;
 margin: 10px auto;
 width: 1850px;
 height: 480px;
}
}

@media (min-width: 1900px) {
.grid-wrapper-index-reverse {
width: 95vw;
max-width: 1850px;
margin: 20px auto;
 height: 600px;
}
}


.textbox-index {
   display: grid;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
background: rgba(37, 159, 154, 0.75);
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
   margin: 0px;
   min-width: 150px;
  width: 100%;
  height: 100%;

}

@media (max-width: 900px) {
.textbox-index{
height: 100%;
}
}

@media (min-width: 1920px) {
.textbox-index{
height: 700px;
}
}

.textbox-blue {
  border-radius: 20px;
background: #256081;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.image-button-index
{
  text-align: center;
  min-width: 150PX;
  width: 100%;
  height: 100%;
  border-radius: 20px;
}

@media (max-width: 900px) {
.image-button-index{
height: 100%;
}
}


@media (max-width: 1700px) {
.image-button-index{
height: 100%;
}
}



.box-index > img {
  width: 80%;
    }

.big-card-text
{
  display: grid;
  grid-template-columns: 1fr;
  text-align: center;
  align-items: center;
  justify-items: center;
 min-width: 205px;
 min-height: 200px;
height: 100%;
 padding: 5px;
 border-radius: 20px;
height: 100%;
}

@media (min-width: 1px) {
.big-card-text{
display: grid;
  grid-template-columns: 1fr;
  text-align: center;
  align-items: center;
  justify-items: center;
height: 50%;
padding: 4px;
}
}

@media (min-width: 900px) {
.big-card-text{
height: 50%;
}
}

.header-card-index
{
  display: grid;
  color: #fff;
 font-family: Bebas Neue;
  font-size: calc(16px + 1.8vw);
  margin: 0px 5px;
  font-weight: 500;
  align-items: center;
  justify-items: center;
  align-self: center;
  max-width: 60%;
  align-self: center;
  justify-self: center;
  text-align: center;
}

.paragraph
{
 color: #FFF;
text-align: center;
font-family: Raleway;
font-size: 20px;
font-style: normal;
font-weight: 900;
line-height: normal;
  font-size: calc(8px + 0.4vw);
  font-weight: 100;
  justify-self: center;
  width: 50%;
  margin: 0px;
}

.btn-containers
{
  display: grid;
  grid-template-columns: 1fr ;
  justify-items: center;
  font-size: calc(9px + 0.2vw);
   font-family: 'Raleway', sans-serif;
  font-weight: 800;
  color: white;
  background-color: #105584;
  padding: 4px;
  border-radius: 100px;
  text-decoration: none;
  border-color: transparent;
  cursor: pointer;
  width: 110px;
}

.btn-containers-green {
background-color: #047E8F;
}

.btn-containers:hover {
    transition-timing-function: ease-in;
  transition-duration: .2s;
 filter: sepia(20%)  saturate(300%);
}

@media (min-width: 900px) {
.btn-containers{
 width: 130px;
}
}
/********************************SECTION-PARTNERS**************************/
.logo-partners-wrapper{
  display: grid;
  justify-items: center;
  justify-content: center;
  background: #306685;
  margin: 0px;
  padding: 50px 0px;
  display: grid;
  min-height: 300px;
  width: 100%;
  height: 25vw;
  grid-template-rows: .1fr .5fr;

}

@media (min-width: 1px) {
.logo-partners-wrapper{
display: grid;
min-height: 300px;
justify-items: center;
padding: 20px 0px;
}
}

@media (min-width: 760px) {
.logo-partners-wrapper{
display: grid;
min-height: 420px;
padding: 20px 0px;
 height: 20vw;
 padding: 50px 0px;

}
}

@media (min-width: 1100px) {
.logo-partners-wrapper{
display: grid;
min-height: 400px;
padding: 20px 0px;
 height: 20vw;

}
}

@media (min-width: 1400px) {
.logo-partners-wrapper{
display: grid;
min-height: 300px;
padding: 20px 0px;
 height: 20vw;

}
}


@media (min-width: 2400px) {
.logo-partners-wrapper{
display: grid;
min-height: 300px;
padding: 20px 0px;
 height: 15vw;

}
}

@media (min-width: 3400px) {
.logo-partners-wrapper{
display: grid;
min-height: 300px;
padding: 20px 0px;
 height: 10vh;

}
}


.clientes {
  display: grid;
margin: 0px;
font-size: calc(12px + 1vw);
justify-self: center;
color: #fff;
text-align: center;
font-family: bebas neue;
font-weight: 200;
max-width: 200px;
}

@media (min-width: 100px) {
.clientes{
display: grid;
max-width: 200px;

}
}

@media (min-width: 600px) {
.clientes{
display: grid;
max-width: 900px;

}
}

@media (min-width: 2400px) {
.clientes{
display: grid;
max-width: 1200px;

}
}

.logos-partners {
display: grid;
width: 60%;
justify-items: center;
grid-template-columns: repeat(auto-fit, 280px);
grid-template-rows: repeat(1, 1fr);
min-width: 220px;
padding: 10px 0px;
height: 20vw;
justify-content: center;
justify-self: center;
align-items: center;
gap: 0px;
min-height: 250px;
max-height: 500px;

}

@media (min-width: 1px) {
.logos-partners{
 grid-template-columns: repeat(auto-fit, 100px);
grid-template-rows: repeat(2, 1fr);
width: 100%;
}
}

@media (min-width: 300px) {
.logos-partners{
 grid-template-columns: repeat(auto-fit, 150px);
grid-template-rows: repeat(2, 1fr);
width: 100%;
}
}

@media (min-width: 600px) {
.logos-partners{
 grid-template-columns: repeat(auto-fit, 200px);
grid-template-rows: repeat(2, 1fr);
width: 99vw;
}
}

@media (min-width: 768px) {
.logos-partners{
 grid-template-columns: repeat(auto-fit, 300px);
grid-template-rows: repeat(2, 1fr);
width: 99vw;
}
}
@media (min-width: 900px) {
.logos-partners{
 grid-template-columns: repeat(auto-fit, 350px);
grid-template-rows: repeat(2, 1fr);
width: 80vw;
}
}
@media (min-width: 1100px) {
.logos-partners{
 grid-template-columns: repeat(auto-fit, 380px);
grid-template-rows: repeat(1, 1fr);
width: 80vw;
}
}

@media (min-width: 1400px) {
.logos-partners{
 grid-template-columns: repeat(auto-fit, 250px);
 width: 98vw;
 max-height: 450px;
}
}

.logo-partner-individual {
  max-height: 100px;
  height: calc(40px + 3.5vw);
  width: 150px;
  padding: 20px 0px;
}