.wrap-index-section {
    width: 100%;
    height: auto;
    overflow: hidden;
}

.index-section {
    box-sizing: border-box;
    margin: 0px auto 0px auto;
    overflow: hidden;
    padding: 0px;
    width: 100%;
}

@media (min-width:1350px) {
    .index-section {
        max-width: 1350px;
    }
}

@media (max-width: 1000px) {
    .index-section {
        width: auto;
    }
}
/************************************************/
.wrap-index-section-separator {
    background-color: transparent;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(1, 1fr);
}

.wrap-index-section-separator .col {
    height: 10px;
}

.wrap-index-section-separator .col1 {
    background-color: #0000ff;
}

.wrap-index-section-separator .col2 {
    background-color: #000099;
}

.wrap-index-section-separator .col3 {
    background-color: #cccccc;
}
/************************************************/
/*                   Seccion 1                  */
/************************************************/
.wrap-index-section-1 {
    background-color: transparent;
    padding-top: 40px;
}

.index-section-1 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(1, 1fr);
    gap: 0px;
    position: relative;
    overflow: hidden;
    padding: 0px;
}

.index-section-1 .figure {
    position: absolute;
    padding: 0px;
    margin: 0px;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 11;
    opacity: 0;
    transition: 1s all;
}

.index-section-1 .overlay {
    background-color: transparent;
    box-shadow: 80px 0px 80px #fefefe inset,
                -80px 0px 80px #fefefe inset;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: absolute;
    z-index: 12;
    transition: 1s all;
    opacity: 0;
}

.index-section-1 .col1 {
    position: relative;
    z-index: 20;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 400px;

    overflow: none;
}

.index-section-1 .col1 img {
    position: relative;
    width: 80%;
    height: auto;
    padding: 0px;
    margin: 0px;
    align-self: flex-start;
    z-index: 20;
    filter: drop-shadow(10px 10px 10px rgb(0,0,0,.6));
    transition: 1s all;
}

.index-section-1 .col2 {
    position: relative;
    z-index: 20;
    padding: 10px;
}

.index-section-1 .col2 h2 {
    text-align: right;
    font-size: clamp(14pt, 2vw, 24pt);
    font-family: 'headm', serif;
    font-weight: 600;
    color: #666666;
}

.index-section-1 .col2 p {
    text-align: right;
    font-size: clamp(11pt, 1.5vw, 14pt);
    font-family: 'textm', serif;
    font-weight: 300;
    color: #333333;
    transition: 1s all;
}

@media (max-width:1000px) {
    .index-section-1 .overlay {
        background-color: transparent;
        box-shadow: 10px 0px 80px #fefefe inset,
                    -10px 0px 80px #fefefe inset;
    }
}

.wrap-index-section-1.active .index-section-1 .figure {
    opacity: .5;
}

.wrap-index-section-1.active .index-section-1 .overlay {
    opacity: 1;
}

.wrap-index-section-1.active .index-section-1 .col1 img {
    width: 90%;
    height: auto;
    filter: drop-shadow(10px 10px 10px rgb(0,0,153,.6));
}

@media (max-width:1200px) {
    .wrap-index-section-1.active .index-section-1 .col1 img {
        width: 100%;
        height: auto;
        filter: drop-shadow(10px 10px 10px rgb(0,0,153,.6));
    }
}

@media (max-width:1100px) {
    .wrap-index-section-1.active .index-section-1 .col1 img {
        width: 110%;
        height: auto;
        filter: drop-shadow(10px 10px 10px rgb(0,0,153,.6));
    }
}

@media (max-width:1000px) {
    .wrap-index-section-1.active .index-section-1 .col1 img {
        width: 120%;
        height: auto;
        filter: drop-shadow(10px 10px 10px rgb(0,0,153,.6));
    }
}

@media (max-width:900px) {
    .wrap-index-section-1.active .index-section-1 .col1 img {
        width: 130%;
        height: auto;
        filter: drop-shadow(10px 10px 10px rgb(0,0,153,.6));
    }
}

@media (max-width:800px) {
    .wrap-index-section-1.active .index-section-1 .col1 img {
        width: 140%;
        height: auto;
        filter: drop-shadow(10px 10px 10px rgb(0,0,153,.6));
    }
}

.wrap-index-section-1.active .index-section-1 .col2 p {
    color: #222222;
}

.wrap-index-section-1.active .index-section-1 .col2 img {
    opacity: .7;
}

@media (max-width:510px) {
    .index-section-1 {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .index-section-1 .col1 {
        display: none;
    }

    .index-section-1 .col2 h2 {
        text-align: center;
    }

    .index-section-1 .col2 p {
        text-align: center;
    }
}
/***************************************************/
/*             Index section about                 */
/***************************************************/
.wrap-index-section-about {
    background-color: transparent;
}

.index-section-about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(1, 1fr);
    gap: 0px;
}

.index-section-about .col1 {
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
    padding: 20px;
    justify-content:flex-start;
    align-items: center;
}

.index-section-about .col1 span {
    margin: 0px;
    background-color: rgb(0, 0, 153,.1);
    padding: 10px;
    border-radius: 10px;
    color: rgb(0,0,153);
    font-size: clamp(14pt, 4vw, 20pt);
    font-family: 'textt', serif;
    font-weight: 300;
}

.index-section-about .col1 h2 {
    margin: 0px;
    padding: 0px;
    text-align: left;
    width: 100%;
    color: rgb(0,0,153,.8);
    font-family: 'headm', serif;
    font-weight: 400;
    font-size: clamp(26pt, 4vw, 30pt);
    text-shadow: 4px 4px 1px rgb(0,0,153,.1);
}

.index-section-about .col1 p {
    margin: 0px;
    padding: 0px;
    font-size: clamp(11pt, 1.5vw, 12pt);
    font-family: 'textm', serif;
    font-weight: 300;
    text-align: justify;
    color: #666666;
}

.index-section-about .col1 button {
    background-color: rgb(0, 0, 153);
    color: rgb(255, 255, 255);
    cursor: pointer;
    border: none;
    padding: 10px 20px;
    border-radius: 20px;
    font-family: 'textt', serif;
    font-weight: 900;
    font-size: 12pt;
    transition: .5s all;
}

.index-section-about .col1 button:hover {
    transform: translateY(-3px);
    box-shadow: 0px 4px 10px rgb(0,0,0,.5);
}

.index-section-about .col2 {
    padding: 40px;
}

.index-section-about .col2 img {
    border-radius: 10px;
    box-shadow: 10px 10px 0px rgb(0, 0, 153, .8);
    width: 100%;
    height: auto;
}

@media (max-width:800px) {
    .index-section-about {
        display: block;
    }
}

@media (max-width:1100px) {
    .index-section-about .col1 h4 {
        margin-bottom: 20px;
    }

    .index-section-about .col1 h1 {
        margin-bottom: 20px;
    }

    .index-section-about .col1 p {
        margin-bottom: 40px;
    }
}
/*************************************************/
/*                    Section Services           */
/*************************************************/
.wrap-index-section-services {
    position: relative;
    padding: 20px 0px;
    background-color: rgb(0,0,153);
    z-index: 5000;
}

.wrap-background {
    background-image: url(../img/A1.png);
    background-repeat: repeat-x;
    background-position: 0px -200px;
    top:0px;
    height: 300px;
    width: 100%;
    background-size: 2000px;
    position: absolute;
    z-index: 5001;
    opacity: .5;
}

.index-section-services {
    padding-bottom: 60px;
    padding-left: 20px;
    padding-right: 20px;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 4rem;
    text-align: center;
    flex-wrap: wrap;
    background-color: transparent;
    z-index: 5002;
    position: relative;
}

.index-section-services article {
    width: 100%;
    text-align: center;
    margin: 0px;
    padding: 0px;
    display: block;
}

.index-section-services article h2 {
    width: 100%;
    font-size: clamp(22pt, 4vw, 34pt);
    font-family: 'headm', serif;
    font-weight: 600;
    margin: 0px;
    padding: 0px;
    color: aliceblue;
    z-index: 10;
    position: relative;
}

.index-section-services article p {
    text-align: center;
    font-size: clamp(10pt, 1.5vw, 12pt);
    font-family: 'textm', serif;
    font-weight: 300;
    padding-left: 0px 20px;
    color: #eeeeee;
    margin: 10px 0px 0px 0px;
    z-index: 5;
}

.index-section-services .box-section-service {
    background-color: #fefefe;
    width: 100%;
    max-width: 260px;
    height: auto;
    overflow: hidden;
    padding: 0px 0px 20px 0px;
    transition: all 1s;
    border-radius: 5px;
}

.index-section-services .box-section-service:hover {
    background-color: rgb(80, 195, 244, .1);
    transform: scaleX(1.2) scaleY(1.2);
}

.index-section-services .box-section-service figure {
    width: 100%;
    height: 110px;
    margin: 0;
    position: relative;
    overflow: hidden;
    border-radius: 5px 5px 0px 0px;
}

.index-section-services .box-section-service figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.index-section-services .box-section-service button {
    display: none;
    transition: all 1s;
}

.index-section-services .box-section-service:hover button {
    display: block;
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background-color: transparent;
    border: none;
    color: transparent;
    transition: all 1s;
}

.index-section-services .box-section-service:hover h3 {
    color: #fefefe;
}

.index-section-services .box-section-service:hover .parrafo-section-service {
    color: #fefefe;
}

.index-section-services .box-section-service h3 {
    margin: 10px 0;
    color: #222222;
    font-family: 'headm', serif;
    font-weight: 600;
    font-size: 11pt;
    padding: 0px 10px;
}

.index-section-services .box-section-service .parrafo-section-service {
    overflow: hidden;
    margin-top: 20px;
    font-family: 'textm', serif;
    font-weight: 300;
    font-size: 11.5pt;
    color: #222222;
    text-align: center;
    padding: 5px 20px;
}

.index-section-services .wrap-button {
    background-color: transparent;
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 0px 0px 20px 0px;
    text-align: center;
}

.index-section-services .wrap-button h4 {
    color: rgb(255,255,255);
    font-family: 'headm', serif;
    font-weight: 600;
    font-size: 14pt;
}

.index-section-services .wrap-button button {
    cursor: pointer;
    color: rgb(0,0,153);
    background-color: rgb (255,255,255);
    border-radius: 20px;
    border: none;
    padding: 10px 20px;
    font-size: 14pt;
    font-family: 'textt', serif;
    font-weight: 700;
    transition: .5s all;
}

.index-section-services .wrap-button button:hover {
    transform: translateY(-3px);
    box-shadow: 0px 5px 5px rgb(255,255,255,.5);
}
/********************************************************/
/*                    Seccion 4                         */
/********************************************************/
.wrap-index-section-4 {
    background-color: #fefefe;
    padding-top: 40px;
}

.index-section-4 {
    background-color: none;
}

.index-section-4 h2 {
    width: 100%;
    font-size: clamp(16pt, 4vw, 24pt);
    font-family: 'headm', serif;
    text-shadow: 4px 4px 1px rgb(0,0,153,.1);
    font-weight: 600;
    color: #222222;
    margin: 0 0 100px 0;
    text-align: center;
    margin-bottom: 10px;
}

.index-section-4 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

.index-section-4 .wrap-slider-section-4 {
    position: relative;
    width: auto;
    overflow: hidden;
  }

 .index-section-4 article {
    display: flex;
    width: 200%;
    animation: bannermove1 20s linear infinite;
  }

 .index-section-4 div {
    width: 100%;
  }

 .index-section-4 ul {
    display: flex;
    background: none;
    list-style-type: none;
    padding-left: 0;
    margin: 0;
  }

  @keyframes bannermove1 {
    0% {
      transform: translateX(0%);
    }
    100% {
      transform: translateX(-50%);
    }
  }
  /********************************************/
  /*                Secion 5                  */
  /********************************************/
.wrap-index-section-5 {
    background-color: #fefefe;
    padding-top: 20px;
    padding-bottom: 40px;
}

.index-section-5 {
    background-color: none;
}

.index-section-5 h2 {
    width: 100%;
    font-size: clamp(16pt, 4vw, 24pt);
    font-family: 'headm', serif;
    font-weight: 600;
    text-shadow: 4px 4px 1px rgb(0,0,153,.1);
    color: #222222;
    margin: 0 0 100px 0;
    text-align: center;
    margin-bottom: 10px;
}

.index-section-5 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .index-section-5 .wrap-slider-section-5 {
    position: relative;
    width: auto;
    overflow: hidden;
  }

 .index-section-5 article {
    display: flex;
    width: 200%;
    animation: bannermove2 20s linear infinite;
  }

 .index-section-5 div {
    width: 100%;
  }

 .index-section-5 ul {
    display: flex;
    background: none;
    list-style-type: none;
    padding-left: 0;
    margin: 0;
  }

 @keyframes bannermove2 {
    0% {
      transform: translateX(-50%);
    }
    100% {
      transform: translateX(0%);
    }
  }

  /*********************************************************/
  /*                   Seccion 6                           */
  /*********************************************************/
  .wrap-index-section-6 {
    background: rgb(6, 9, 34);
  }

  .index-section-6 {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    align-items: center;
  }

  .index-section-6 .partner {
    width: 180px;
    display: block;
    padding: 0px;
  }

  .index-section-6 .partner img {
    width: 100%;
    filter: drop-shadow(5px 5px 1px rgb(0,0,0,.1));
  }
/*******************************************************/
/*                      Seccion de contacto            */
/*******************************************************/
.wrap-index-section-contac {
    background-color: transparent;
    background-image: url(../img/background_contact1.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    padding-top: 40px;
    padding-bottom: 40px;
    z-index: 10;
  }

  .wrap-index-section-contac .overlay {
    background-color: rgb(0,0,0,.6);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 11;
  }

  .index-section-contac {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(1, 1fr);
    padding: 40px;
    position: relative;
    z-index: 12;
  }

  .index-section-contac .col1 {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .index-section-contac .col1 p {
    font-family: 'textm', serif;
    font-weight: 500;
    color: rgb(255,255,255);
    font-size: clamp(14pt, 1.5vw, 18pt);
    text-align: center;
  }

  .index-section-contac .col1 button {
    cursor: pointer;
    background-color: rgb(255,255,255);
    color: rgb(0,0,0,.8);
    border: none;
    border-radius: 20px;
    padding: 10px 25px;
    font-family: 'textt', serif;
    font-weight: 900;
    font-size: 14pt;
    transition: .5s all;
  }

  .index-section-contac .col1 button:hover {
    transform: translateY(-3px);
    box-shadow: 0px 4px 10px rgb(255,255,255,.3);
  }

  .index-section-contac .col2 {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .index-section-contac .col2 img {
    width: 30%;
    height: auto;
  }

  @media (max-width:730px) {
    .index-section-contac {
        display: block;
    }
  }