@import url(fontawesome-all.min.css);
/*@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,400italic,600italic|Roboto+Slab:400,700");*/
@font-face {
  font-family: 'PSans';
  src: url('fonts/Product Sans Bold.ttf') format('ttf');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Gotham';
  src: url('fonts/Gotham-Medium.otf') format('otf');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Gotham-Bold';
  src: url('fonts/Gotham-Bold.otf') format('otf');
  font-weight: 700;
  font-style: normal;
}

html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }
  blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

body {
  -webkit-text-size-adjust: none; }

mark {
  background-color: transparent;
  color: inherit; }

input::-moz-focus-inner {
  border: 0;
  padding: 0; }

input, select, textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none; }

/* Basic */
@-ms-viewport {
  width: device-width; }

body {
  -ms-overflow-style: scrollbar; }

@media screen and (max-width: 480px) {
  html, body {
    min-width: 320px; } }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  background: #ffffff; }
  body.is-preload *, body.is-preload *:before, body.is-preload *:after, body.is-resizing *, body.is-resizing *:before, body.is-resizing *:after {
    -moz-animation: none !important;
    -webkit-animation: none !important;
    -ms-animation: none !important;
    animation: none !important;
    -moz-transition: none !important;
    -webkit-transition: none !important;
    -ms-transition: none !important;
    transition: none !important; }

/* Type */
body, input, select, textarea {
  color: #0049ab;
  font-family: "PSans", sans-serif;
  font-size: 13pt;
  font-weight: 400;
  line-height: 1.65; }
  @media screen and (max-width: 1680px) {
    body, input, select, textarea {
      font-size: 11pt; } }
  @media screen and (max-width: 1280px) {
    body, input, select, textarea {
      font-size: 10pt; } }
  @media screen and (max-width: 360px) {
    body, input, select, textarea {
      font-size: 9pt; } }
 /* color boton activo */
a {
  -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  border-bottom: dotted 1px;
  color: #0049ab;
  text-decoration: none; }
  a:hover {
    border-bottom-color: #00c8ff;
    color: #00c9ff !important; }
    a:hover strong {
      color: inherit; }

strong, b {
  color: #3d4449;
  font-weight: 600; }

em, i {
  font-style: italic; }

p {
  margin: 0 0 2em 0; }



h1, h2, h3, h4, h5, h6 {
  color: #ffffff;
  font-family: "Gotham", sans-serif;
  font-weight: 700;
  line-height: 1.5;
  margin: 0 0 1em 0; }
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: inherit;
    text-decoration: none;
    border-bottom: 0; }

    .letra-destacada {
      font-size: 150%;
      font-family: "Gotham", sans-serif;
      color: #0049ab;
      font-weight: 500;
      position: relative;

    }

   

    .letra-destacada2 {
      font-size: 170%; /* Tamaño fluido (120% en móviles, 170% en desktop) */
      font-family: "Gotham", sans-serif;
      color: #0049ab;
      font-weight: 500;
      position: bottom ;
      margin-top: -20px; 

    }


        /* Ajustes adicionales para pantallas pequeñas (≤ 600px) */
    @media (max-width: 600px) {
        .letra-destacada2 {
            font-size: 150%;
            margin-top: -13px; /* Reduce el margen negativo en móviles */
        }
    }

    @media (max-width: 560px) {
        .letra-destacada2 {
            font-size: 140%;
            margin-top: -9px; /* Reduce el margen negativo en móviles */
        }
    }

    @media (max-width: 480px) {
        .letra-destacada2 {
            font-size: 130%;
            margin-top: -7px; /* Reduce el margen negativo en móviles */
        }
    }

    @media (max-width: 468px) {
        .letra-destacada2 {
            font-size: 120%;
            margin-top: -4px; /* Reduce el margen negativo en móviles */
        }
    }

    .letra-destacada3 {
      font-size: 170%;
      font-family: "Gotham", sans-serif;
      color: #FFFFFF;
      font-weight: 500;
      position: bottom ;
      
    }

    .letra-destacada4 {
      font-size: 170%;
      font-family: "Gotham", sans-serif;
      color: #0049ab;
      font-weight: 500;
      position: bottom ;
      
    }

    .letra-destacada5 {
      font-size: 130%;
      font-family: "Gotham", sans-serif;
      color: #FFFFFF;
      font-weight: 500;
      position: bottom ;
      
    }

    .letra-destacada7 {
      font-size: 150%;
      font-family: "Gotham", sans-serif;
      color: #0049ab;
      font-weight: 500;
      position: relative;
      
    }
    .espacio {
    margin: 0 0.1em; /* Ajusta este valor según necesites */
    /* o también puedes usar: */
    padding: 0 0.1em;
   }

h1 {
  color: #0049ab;
  font-size: 4em;
  margin: 0 0 0em 0;
  line-height: 1.3; 
  
}
 
 .titulo-destacado{
   font-size: 40px;

   
 }

 .titulo-destacado2{
   font-size: 20px;

   
 }
@media (max-width: 680px) {
  .titulo-destacado {
    font-size: 1.5rem;
    align-items: center;
  }

  .titulo-destacado2 {
    font-size: 1.5rem;
    align-items: center;
  }
  /* Opcional: ajustar el span dentro si es necesario */
  .titulo-destacado .letra-destacada3 {
    font-size: inherit; /* Hereda el tamaño del h1 */
  }
}

h2 {
  font-size: 1.75em; }

.fuente-ligera {
  font-weight: 300; }

h3 {
  font-size: 1.9em; 
  text-align: center;
  color: #0049ab;
  margin-bottom: -2em;
 }

  @media (max-width: 480px) {
           h3{
           font-size: 18px;
        }
          
        }

h4 {
  font-size: 1.1em; }

h5 {
  font-size: 0.9em; }

h6 {
  font-size: 0.7em; }

@media screen and (max-width: 1680px) {
  h1 {
    font-size: 3.5em; } }

@media screen and (max-width: 980px) {
  h1 {
    font-size: 3.25em; } }

@media screen and (max-width: 836px) {
  h1 {
    
    font-size: 2em;
    line-height: 1.4; }
  h2 {
    font-size: 1.5em; } }

sub {
  font-size: 0.8em;
  position: relative;
  top: 0.5em; }

sup {
  font-size: 0.8em;
  position: relative;
  top: -0.5em; }

blockquote {
  border-left: solid 3px rgb(0, 200, 255);
  font-style: italic;
  margin: 0 0 2em 0;
  padding: 0.5em 0 0.5em 2em; }

code {
  background: rgba(230, 235, 237, 0.25);
  border-radius: 0.375em;
  border: solid 1px rgba(210, 215, 217, 0.75);
  font-family: "Courier New", monospace;
  font-size: 0.9em;
  margin: 0 0.25em;
  padding: 0.25em 0.65em; }

pre {
  -webkit-overflow-scrolling: touch;
  font-family: "Courier New", monospace;
  font-size: 0.9em;
  margin: 0 0 2em 0; }
  pre code {
    display: block;
    line-height: 1.75;
    padding: 1em 1.5em;
    overflow-x: auto; }

hr {
  border: 0;
  border-bottom: solid 1px rgb(0, 200, 255);
  margin: 2em 0; }
  hr.major {
    margin: 3em 0; }

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

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

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

/* Row */
.row {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  align-items: stretch; }
  .row > * {
    box-sizing: border-box; }
  .row.gtr-uniform > * > :last-child {
    margin-bottom: 0; }
  .row.aln-left {
    justify-content: flex-start; }
  .row.aln-center {
    justify-content: center; }
  .row.aln-right {
    justify-content: flex-end; }
  .row.aln-top {
    align-items: flex-start; }
  .row.aln-middle {
    align-items: center; }
  .row.aln-bottom {
    align-items: flex-end; }
  .row > .imp {
    order: -1; }
  .row > .col-1 {
    width: 8.33333%; }
  .row > .off-1 {
    margin-left: 8.33333%; }
  .row > .col-2 {
    width: 16.66667%; }
  .row > .off-2 {
    margin-left: 16.66667%; }
  .row > .col-3 {
    width: 25%; }
  .row > .off-3 {
    margin-left: 25%; }
  .row > .col-4 {
    width: 33.33333%; }
  .row > .off-4 {
    margin-left: 33.33333%; }
  .row > .col-5 {
    width: 41.66667%; }
  .row > .off-5 {
    margin-left: 41.66667%; }
  .row > .col-6 {
    width: 50%; }
  .row > .off-6 {
    margin-left: 50%; }
  .row > .col-7 {
    width: 58.33333%; }
  .row > .off-7 {
    margin-left: 58.33333%; }
  .row > .col-8 {
    width: 66.66667%; }
  .row > .off-8 {
    margin-left: 66.66667%; }
  .row > .col-9 {
    width: 75%; }
  .row > .off-9 {
    margin-left: 75%; }
  .row > .col-10 {
    width: 83.33333%; }
  .row > .off-10 {
    margin-left: 83.33333%; }
  .row > .col-11 {
    width: 91.66667%; }
  .row > .off-11 {
    margin-left: 91.66667%; }
  .row > .col-12 {
    width: 100%; }
  .row > .off-12 {
    margin-left: 100%; }
  .row.gtr-0 {
    margin-top: 0;
    margin-left: 0em; }
    .row.gtr-0 > * {
      padding: 0 0 0 0em; }
    .row.gtr-0.gtr-uniform {
      margin-top: 0em; }
      .row.gtr-0.gtr-uniform > * {
        padding-top: 0em; }
  .row.gtr-25 {
    margin-top: 0;
    margin-left: -0.375em; }
    .row.gtr-25 > * {
      padding: 0 0 0 0.375em; }
    .row.gtr-25.gtr-uniform {
      margin-top: -0.375em; }
      .row.gtr-25.gtr-uniform > * {
        padding-top: 0.375em; }
  .row.gtr-50 {
    margin-top: 0;
    margin-left: -0.75em; }
    .row.gtr-50 > * {
      padding: 0 0 0 0.75em; }
    .row.gtr-50.gtr-uniform {
      margin-top: -0.75em; }
      .row.gtr-50.gtr-uniform > * {
        padding-top: 0.75em; }
  .row {
    margin-top: 0;
    margin-left: -1.5em; }
    .row > * {
      padding: 0 0 0 1.5em; }
    .row.gtr-uniform {
      margin-top: -1.5em; }
      .row.gtr-uniform > * {
        padding-top: 1.5em; }
  .row.gtr-150 {
    margin-top: 0;
    margin-left: -2.25em; }
    .row.gtr-150 > * {
      padding: 0 0 0 2.25em; }
    .row.gtr-150.gtr-uniform {
      margin-top: -2.25em; }
      .row.gtr-150.gtr-uniform > * {
        padding-top: 2.25em; }
  .row.gtr-200 {
    margin-top: 0;
    margin-left: -3em; }
    .row.gtr-200 > * {
      padding: 0 0 0 3em; }
    .row.gtr-200.gtr-uniform {
      margin-top: -3em; }
      .row.gtr-200.gtr-uniform > * {
        padding-top: 3em; }
  @media screen and (max-width: 1680px) {
    .row {
      display: flex;
      flex-wrap: wrap;
      box-sizing: border-box;
      align-items: stretch; }
      .row > * {
        box-sizing: border-box; }
      .row.gtr-uniform > * > :last-child {
        margin-bottom: 0; }
      .row.aln-left {
        justify-content: flex-start; }
      .row.aln-center {
        justify-content: center; }
      .row.aln-right {
        justify-content: flex-end; }
      .row.aln-top {
        align-items: flex-start; }
      .row.aln-middle {
        align-items: center; }
      .row.aln-bottom {
        align-items: flex-end; }
      .row > .imp-xlarge {
        order: -1; }
      .row > .col-1-xlarge {
        width: 8.33333%; }
      .row > .off-1-xlarge {
        margin-left: 8.33333%; }
      .row > .col-2-xlarge {
        width: 16.66667%; }
      .row > .off-2-xlarge {
        margin-left: 16.66667%; }
      .row > .col-3-xlarge {
        width: 25%; }
      .row > .off-3-xlarge {
        margin-left: 25%; }
      .row > .col-4-xlarge {
        width: 33.33333%; }
      .row > .off-4-xlarge {
        margin-left: 33.33333%; }
      .row > .col-5-xlarge {
        width: 41.66667%; }
      .row > .off-5-xlarge {
        margin-left: 41.66667%; }
      .row > .col-6-xlarge {
        width: 50%; }
      .row > .off-6-xlarge {
        margin-left: 50%; }
      .row > .col-7-xlarge {
        width: 58.33333%; }
      .row > .off-7-xlarge {
        margin-left: 58.33333%; }
      .row > .col-8-xlarge {
        width: 66.66667%; }
      .row > .off-8-xlarge {
        margin-left: 66.66667%; }
      .row > .col-9-xlarge {
        width: 75%; }
      .row > .off-9-xlarge {
        margin-left: 75%; }
      .row > .col-10-xlarge {
        width: 83.33333%; }
      .row > .off-10-xlarge {
        margin-left: 83.33333%; }
      .row > .col-11-xlarge {
        width: 91.66667%; }
      .row > .off-11-xlarge {
        margin-left: 91.66667%; }
      .row > .col-12-xlarge {
        width: 100%; }
      .row > .off-12-xlarge {
        margin-left: 100%; }
      .row.gtr-0 {
        margin-top: 0;
        margin-left: 0em; }
        .row.gtr-0 > * {
          padding: 0 0 0 0em; }
        .row.gtr-0.gtr-uniform {
          margin-top: 0em; }
          .row.gtr-0.gtr-uniform > * {
            padding-top: 0em; }
      .row.gtr-25 {
        margin-top: 0;
        margin-left: -0.375em; }
        .row.gtr-25 > * {
          padding: 0 0 0 0.375em; }
        .row.gtr-25.gtr-uniform {
          margin-top: -0.375em; }
          .row.gtr-25.gtr-uniform > * {
            padding-top: 0.375em; }
      .row.gtr-50 {
        margin-top: 0;
        margin-left: -0.75em; }
        .row.gtr-50 > * {
          padding: 0 0 0 0.75em; }
        .row.gtr-50.gtr-uniform {
          margin-top: -0.75em; }
          .row.gtr-50.gtr-uniform > * {
            padding-top: 0.75em; }
      .row {
        margin-top: 0;
        margin-left: -1.5em; }
        .row > * {
          padding: 0 0 0 1.5em; }
        .row.gtr-uniform {
          margin-top: -1.5em; }
          .row.gtr-uniform > * {
            padding-top: 1.5em; }
      .row.gtr-150 {
        margin-top: 0;
        margin-left: -2.25em; }
        .row.gtr-150 > * {
          padding: 0 0 0 2.25em; }
        .row.gtr-150.gtr-uniform {
          margin-top: -2.25em; }
          .row.gtr-150.gtr-uniform > * {
            padding-top: 2.25em; }
      .row.gtr-200 {
        margin-top: 0;
        margin-left: -3em; }
        .row.gtr-200 > * {
          padding: 0 0 0 3em; }
        .row.gtr-200.gtr-uniform {
          margin-top: -3em; }
          .row.gtr-200.gtr-uniform > * {
            padding-top: 3em; } }
  @media screen and (max-width: 1280px) {
    .row {
      display: flex;
      flex-wrap: wrap;
      box-sizing: border-box;
      align-items: stretch; }
      .row > * {
        box-sizing: border-box; }
      .row.gtr-uniform > * > :last-child {
        margin-bottom: 0; }
      .row.aln-left {
        justify-content: flex-start; }
      .row.aln-center {
        justify-content: center; }
      .row.aln-right {
        justify-content: flex-end; }
      .row.aln-top {
        align-items: flex-start; }
      .row.aln-middle {
        align-items: center; }
      .row.aln-bottom {
        align-items: flex-end; }
      .row > .imp-large {
        order: -1; }
      .row > .col-1-large {
        width: 8.33333%; }
      .row > .off-1-large {
        margin-left: 8.33333%; }
      .row > .col-2-large {
        width: 16.66667%; }
      .row > .off-2-large {
        margin-left: 16.66667%; }
      .row > .col-3-large {
        width: 25%; }
      .row > .off-3-large {
        margin-left: 25%; }
      .row > .col-4-large {
        width: 33.33333%; }
      .row > .off-4-large {
        margin-left: 33.33333%; }
      .row > .col-5-large {
        width: 41.66667%; }
      .row > .off-5-large {
        margin-left: 41.66667%; }
      .row > .col-6-large {
        width: 50%; }
      .row > .off-6-large {
        margin-left: 50%; }
      .row > .col-7-large {
        width: 58.33333%; }
      .row > .off-7-large {
        margin-left: 58.33333%; }
      .row > .col-8-large {
        width: 66.66667%; }
      .row > .off-8-large {
        margin-left: 66.66667%; }
      .row > .col-9-large {
        width: 75%; }
      .row > .off-9-large {
        margin-left: 75%; }
      .row > .col-10-large {
        width: 83.33333%; }
      .row > .off-10-large {
        margin-left: 83.33333%; }
      .row > .col-11-large {
        width: 91.66667%; }
      .row > .off-11-large {
        margin-left: 91.66667%; }
      .row > .col-12-large {
        width: 100%; }
      .row > .off-12-large {
        margin-left: 100%; }
      .row.gtr-0 {
        margin-top: 0;
        margin-left: 0em; }
        .row.gtr-0 > * {
          padding: 0 0 0 0em; }
        .row.gtr-0.gtr-uniform {
          margin-top: 0em; }
          .row.gtr-0.gtr-uniform > * {
            padding-top: 0em; }
      .row.gtr-25 {
        margin-top: 0;
        margin-left: -0.375em; }
        .row.gtr-25 > * {
          padding: 0 0 0 0.375em; }
        .row.gtr-25.gtr-uniform {
          margin-top: -0.375em; }
          .row.gtr-25.gtr-uniform > * {
            padding-top: 0.375em; }
      .row.gtr-50 {
        margin-top: 0;
        margin-left: -0.75em; }
        .row.gtr-50 > * {
          padding: 0 0 0 0.75em; }
        .row.gtr-50.gtr-uniform {
          margin-top: -0.75em; }
          .row.gtr-50.gtr-uniform > * {
            padding-top: 0.75em; }
      .row {
        margin-top: 0;
        margin-left: -1.5em; }
        .row > * {
          padding: 0 0 0 1.5em; }
        .row.gtr-uniform {
          margin-top: -1.5em; }
          .row.gtr-uniform > * {
            padding-top: 1.5em; }
      .row.gtr-150 {
        margin-top: 0;
        margin-left: -2.25em; }
        .row.gtr-150 > * {
          padding: 0 0 0 2.25em; }
        .row.gtr-150.gtr-uniform {
          margin-top: -2.25em; }
          .row.gtr-150.gtr-uniform > * {
            padding-top: 2.25em; }
      .row.gtr-200 {
        margin-top: 0;
        margin-left: -3em; }
        .row.gtr-200 > * {
          padding: 0 0 0 3em; }
        .row.gtr-200.gtr-uniform {
          margin-top: -3em; }
          .row.gtr-200.gtr-uniform > * {
            padding-top: 3em; } }
  @media screen and (max-width: 980px) {
    .row {
      display: flex;
      flex-wrap: wrap;
      box-sizing: border-box;
      align-items: stretch; }
      .row > * {
        box-sizing: border-box; }
      .row.gtr-uniform > * > :last-child {
        margin-bottom: 0; }
      .row.aln-left {
        justify-content: flex-start; }
      .row.aln-center {
        justify-content: center; }
      .row.aln-right {
        justify-content: flex-end; }
      .row.aln-top {
        align-items: flex-start; }
      .row.aln-middle {
        align-items: center; }
      .row.aln-bottom {
        align-items: flex-end; }
      .row > .imp-medium {
        order: -1; }
      .row > .col-1-medium {
        width: 8.33333%; }
      .row > .off-1-medium {
        margin-left: 8.33333%; }
      .row > .col-2-medium {
        width: 16.66667%; }
      .row > .off-2-medium {
        margin-left: 16.66667%; }
      .row > .col-3-medium {
        width: 25%; }
      .row > .off-3-medium {
        margin-left: 25%; }
      .row > .col-4-medium {
        width: 33.33333%; }
      .row > .off-4-medium {
        margin-left: 33.33333%; }
      .row > .col-5-medium {
        width: 41.66667%; }
      .row > .off-5-medium {
        margin-left: 41.66667%; }
      .row > .col-6-medium {
        width: 50%; }
      .row > .off-6-medium {
        margin-left: 50%; }
      .row > .col-7-medium {
        width: 58.33333%; }
      .row > .off-7-medium {
        margin-left: 58.33333%; }
      .row > .col-8-medium {
        width: 66.66667%; }
      .row > .off-8-medium {
        margin-left: 66.66667%; }
      .row > .col-9-medium {
        width: 75%; }
      .row > .off-9-medium {
        margin-left: 75%; }
      .row > .col-10-medium {
        width: 83.33333%; }
      .row > .off-10-medium {
        margin-left: 83.33333%; }
      .row > .col-11-medium {
        width: 91.66667%; }
      .row > .off-11-medium {
        margin-left: 91.66667%; }
      .row > .col-12-medium {
        width: 100%; }
      .row > .off-12-medium {
        margin-left: 100%; }
      .row.gtr-0 {
        margin-top: 0;
        margin-left: 0em; }
        .row.gtr-0 > * {
          padding: 0 0 0 0em; }
        .row.gtr-0.gtr-uniform {
          margin-top: 0em; }
          .row.gtr-0.gtr-uniform > * {
            padding-top: 0em; }
      .row.gtr-25 {
        margin-top: 0;
        margin-left: -0.375em; }
        .row.gtr-25 > * {
          padding: 0 0 0 0.375em; }
        .row.gtr-25.gtr-uniform {
          margin-top: -0.375em; }
          .row.gtr-25.gtr-uniform > * {
            padding-top: 0.375em; }
      .row.gtr-50 {
        margin-top: 0;
        margin-left: -0.75em; }
        .row.gtr-50 > * {
          padding: 0 0 0 0.75em; }
        .row.gtr-50.gtr-uniform {
          margin-top: -0.75em; }
          .row.gtr-50.gtr-uniform > * {
            padding-top: 0.75em; }
      .row {
        margin-top: 0;
        margin-left: -1.5em; }
        .row > * {
          padding: 0 0 0 1.5em; }
        .row.gtr-uniform {
          margin-top: -1.5em; }
          .row.gtr-uniform > * {
            padding-top: 1.5em; }
      .row.gtr-150 {
        margin-top: 0;
        margin-left: -2.25em; }
        .row.gtr-150 > * {
          padding: 0 0 0 2.25em; }
        .row.gtr-150.gtr-uniform {
          margin-top: -2.25em; }
          .row.gtr-150.gtr-uniform > * {
            padding-top: 2.25em; }
      .row.gtr-200 {
        margin-top: 0;
        margin-left: -3em; }
        .row.gtr-200 > * {
          padding: 0 0 0 3em; }
        .row.gtr-200.gtr-uniform {
          margin-top: -3em; }
          .row.gtr-200.gtr-uniform > * {
            padding-top: 3em; } }
  @media screen and (max-width: 736px) {
    .row {
      display: flex;
      flex-wrap: wrap;
      box-sizing: border-box;
      align-items: stretch; }
      .row > * {
        box-sizing: border-box; }
      .row.gtr-uniform > * > :last-child {
        margin-bottom: 0; }
      .row.aln-left {
        justify-content: flex-start; }
      .row.aln-center {
        justify-content: center; }
      .row.aln-right {
        justify-content: flex-end; }
      .row.aln-top {
        align-items: flex-start; }
      .row.aln-middle {
        align-items: center; }
      .row.aln-bottom {
        align-items: flex-end; }
      .row > .imp-small {
        order: -1; }
      .row > .col-1-small {
        width: 8.33333%; }
      .row > .off-1-small {
        margin-left: 8.33333%; }
      .row > .col-2-small {
        width: 16.66667%; }
      .row > .off-2-small {
        margin-left: 16.66667%; }
      .row > .col-3-small {
        width: 25%; }
      .row > .off-3-small {
        margin-left: 25%; }
      .row > .col-4-small {
        width: 33.33333%; }
      .row > .off-4-small {
        margin-left: 33.33333%; }
      .row > .col-5-small {
        width: 41.66667%; }
      .row > .off-5-small {
        margin-left: 41.66667%; }
      .row > .col-6-small {
        width: 50%; }
      .row > .off-6-small {
        margin-left: 50%; }
      .row > .col-7-small {
        width: 58.33333%; }
      .row > .off-7-small {
        margin-left: 58.33333%; }
      .row > .col-8-small {
        width: 66.66667%; }
      .row > .off-8-small {
        margin-left: 66.66667%; }
      .row > .col-9-small {
        width: 75%; }
      .row > .off-9-small {
        margin-left: 75%; }
      .row > .col-10-small {
        width: 83.33333%; }
      .row > .off-10-small {
        margin-left: 83.33333%; }
      .row > .col-11-small {
        width: 91.66667%; }
      .row > .off-11-small {
        margin-left: 91.66667%; }
      .row > .col-12-small {
        width: 100%; }
      .row > .off-12-small {
        margin-left: 100%; }
      .row.gtr-0 {
        margin-top: 0;
        margin-left: 0em; }
        .row.gtr-0 > * {
          padding: 0 0 0 0em; }
        .row.gtr-0.gtr-uniform {
          margin-top: 0em; }
          .row.gtr-0.gtr-uniform > * {
            padding-top: 0em; }
      .row.gtr-25 {
        margin-top: 0;
        margin-left: -0.375em; }
        .row.gtr-25 > * {
          padding: 0 0 0 0.375em; }
        .row.gtr-25.gtr-uniform {
          margin-top: -0.375em; }
          .row.gtr-25.gtr-uniform > * {
            padding-top: 0.375em; }
      .row.gtr-50 {
        margin-top: 0;
        margin-left: -0.75em; }
        .row.gtr-50 > * {
          padding: 0 0 0 0.75em; }
        .row.gtr-50.gtr-uniform {
          margin-top: -0.75em; }
          .row.gtr-50.gtr-uniform > * {
            padding-top: 0.75em; }
      .row {
        margin-top: 0;
        margin-left: -1.5em; }
        .row > * {
          padding: 0 0 0 1.5em; }
        .row.gtr-uniform {
          margin-top: -1.5em; }
          .row.gtr-uniform > * {
            padding-top: 1.5em; }
      .row.gtr-150 {
        margin-top: 0;
        margin-left: -2.25em; }
        .row.gtr-150 > * {
          padding: 0 0 0 2.25em; }
        .row.gtr-150.gtr-uniform {
          margin-top: -2.25em; }
          .row.gtr-150.gtr-uniform > * {
            padding-top: 2.25em; }
      .row.gtr-200 {
        margin-top: 0;
        margin-left: -3em; }
        .row.gtr-200 > * {
          padding: 0 0 0 3em; }
        .row.gtr-200.gtr-uniform {
          margin-top: -3em; }
          .row.gtr-200.gtr-uniform > * {
            padding-top: 3em; } }
  @media screen and (max-width: 480px) {
    .row {
      display: flex;
      flex-wrap: wrap;
      box-sizing: border-box;
      align-items: stretch; }
      .row > * {
        box-sizing: border-box; }
      .row.gtr-uniform > * > :last-child {
        margin-bottom: 0; }
      .row.aln-left {
        justify-content: flex-start; }
      .row.aln-center {
        justify-content: center; }
      .row.aln-right {
        justify-content: flex-end; }
      .row.aln-top {
        align-items: flex-start; }
      .row.aln-middle {
        align-items: center; }
      .row.aln-bottom {
        align-items: flex-end; }
      .row > .imp-xsmall {
        order: -1; }
      .row > .col-1-xsmall {
        width: 8.33333%; }
      .row > .off-1-xsmall {
        margin-left: 8.33333%; }
      .row > .col-2-xsmall {
        width: 16.66667%; }
      .row > .off-2-xsmall {
        margin-left: 16.66667%; }
      .row > .col-3-xsmall {
        width: 25%; }
      .row > .off-3-xsmall {
        margin-left: 25%; }
      .row > .col-4-xsmall {
        width: 33.33333%; }
      .row > .off-4-xsmall {
        margin-left: 33.33333%; }
      .row > .col-5-xsmall {
        width: 41.66667%; }
      .row > .off-5-xsmall {
        margin-left: 41.66667%; }
      .row > .col-6-xsmall {
        width: 50%; }
      .row > .off-6-xsmall {
        margin-left: 50%; }
      .row > .col-7-xsmall {
        width: 58.33333%; }
      .row > .off-7-xsmall {
        margin-left: 58.33333%; }
      .row > .col-8-xsmall {
        width: 66.66667%; }
      .row > .off-8-xsmall {
        margin-left: 66.66667%; }
      .row > .col-9-xsmall {
        width: 75%; }
      .row > .off-9-xsmall {
        margin-left: 75%; }
      .row > .col-10-xsmall {
        width: 83.33333%; }
      .row > .off-10-xsmall {
        margin-left: 83.33333%; }
      .row > .col-11-xsmall {
        width: 91.66667%; }
      .row > .off-11-xsmall {
        margin-left: 91.66667%; }
      .row > .col-12-xsmall {
        width: 100%; }
      .row > .off-12-xsmall {
        margin-left: 100%; }
      .row.gtr-0 {
        margin-top: 0;
        margin-left: 0em; }
        .row.gtr-0 > * {
          padding: 0 0 0 0em; }
        .row.gtr-0.gtr-uniform {
          margin-top: 0em; }
          .row.gtr-0.gtr-uniform > * {
            padding-top: 0em; }
      .row.gtr-25 {
        margin-top: 0;
        margin-left: -0.375em; }
        .row.gtr-25 > * {
          padding: 0 0 0 0.375em; }
        .row.gtr-25.gtr-uniform {
          margin-top: -0.375em; }
          .row.gtr-25.gtr-uniform > * {
            padding-top: 0.375em; }
      .row.gtr-50 {
        margin-top: 0;
        margin-left: -0.75em; }
        .row.gtr-50 > * {
          padding: 0 0 0 0.75em; }
        .row.gtr-50.gtr-uniform {
          margin-top: -0.75em; }
          .row.gtr-50.gtr-uniform > * {
            padding-top: 0.75em; }
      .row {
        margin-top: 0;
        margin-left: -1.5em; }
        .row > * {
          padding: 0 0 0 1.5em; }
        .row.gtr-uniform {
          margin-top: -1.5em; }
          .row.gtr-uniform > * {
            padding-top: 1.5em; }
      .row.gtr-150 {
        margin-top: 0;
        margin-left: -2.25em; }
        .row.gtr-150 > * {
          padding: 0 0 0 2.25em; }
        .row.gtr-150.gtr-uniform {
          margin-top: -2.25em; }
          .row.gtr-150.gtr-uniform > * {
            padding-top: 2.25em; }
      .row.gtr-200 {
        margin-top: 0;
        margin-left: -3em; }
        .row.gtr-200 > * {
          padding: 0 0 0 3em; }
        .row.gtr-200.gtr-uniform {
          margin-top: -3em; }
          .row.gtr-200.gtr-uniform > * {
            padding-top: 3em; } }

/* Section/Article */
section.special, article.special {
  text-align: center; }

header p {
  font-family: "Gotham", sans-serif;
  font-size: 1em;
  font-weight: 400;
  letter-spacing: 0.075em;
  margin-top: -0.5em;
  text-transform: uppercase; }

header.major > :last-child {
  border-bottom: solid 3px #00c8ff;
  display: inline-block;
  margin: 0 0 2em 0;
  padding: 0 0.75em 0.5em 0; }

header.main > :last-child {
  margin: 0 0 1em 0; }

  header h1:nth-child(1) {
  position: relative;
  padding-left: clamp(40px, 8vw, 60px); /* Tamaño responsive con límites */
  
  /* Imagen de fondo responsive */
  background-image: url('images/logo_izquierda.png');
  background-size: clamp(30px, 6vw, 50px); /* Tamaño ajustable */
  background-position: left center;
  background-repeat: no-repeat;
  
  /* Asegurar contraste en móviles */
  min-height: clamp(30px, 6vw, 50px); /* Misma medida que el icono */
  
  
}

header h1:not(:first-child) {
  background-image: none !important;
  padding-left: 0;
}



/* Versión para pantallas muy pequeñas */
@media (max-width: 480px) {
  h1:nth-child(1) {
    padding-left: 35px;
    background-size: 25px;
    min-height: 25px;
  }
}


/* Form */
form {
  margin: 0 0 2em 0; }

label {
  color: #3d4449;
  display: block;
  font-size: 0.9em;
  font-weight: 600;
  margin: 0 0 1em 0; }

input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"],
select,
textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  background: #ffffff;
  border-radius: 0.375em;
  border: none;
  border: solid 1px rgb(0, 200, 255);
  color: inherit;
  display: block;
  outline: 0;
  padding: 0 1em;
  text-decoration: none;
  width: 100%; }
  input[type="text"]:invalid,
  input[type="password"]:invalid,
  input[type="email"]:invalid,
  input[type="tel"]:invalid,
  input[type="search"]:invalid,
  input[type="url"]:invalid,
  select:invalid,
  textarea:invalid {
    box-shadow: none; }
  input[type="text"]:focus,
  input[type="password"]:focus,
  input[type="email"]:focus,
  input[type="tel"]:focus,
  input[type="search"]:focus,
  input[type="url"]:focus,
  select:focus,
  textarea:focus {
    border-color: #00c8ff;
    box-shadow: 0 0 0 1px #00c8ff; }

select {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='rgba(210, 215, 217, 0.75)' /%3E%3C/svg%3E");
  background-size: 1.25em;
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) center;
  height: 2.75em;
  padding-right: 2.75em;
  text-overflow: ellipsis; }
  select option {
    color: #3d4449;
    background: #ffffff; }
  select:focus::-ms-value {
    background-color: transparent; }
  select::-ms-expand {
    display: none; }

input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"],
select {
  height: 2.75em; }

textarea {
  padding: 0.75em 1em; }

input[type="checkbox"],
input[type="radio"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  display: block;
  float: left;
  margin-right: -2em;
  opacity: 0;
  width: 1em;
  z-index: -1; }
  input[type="checkbox"] + label,
  input[type="radio"] + label {
    text-decoration: none;
    color: #7f888f;
    cursor: pointer;
    display: inline-block;
    font-size: 1em;
    font-weight: 400;
    padding-left: 2.4em;
    padding-right: 0.75em;
    position: relative; }
    input[type="checkbox"] + label:before,
    input[type="radio"] + label:before {
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      line-height: 1;
      text-transform: none !important;
      font-family: 'Font Awesome 5 Free';
      font-weight: 900; }
    input[type="checkbox"] + label:before,
    input[type="radio"] + label:before {
      background: #ffffff;
      border-radius: 0.375em;
      border: solid 1px rgba(210, 215, 217, 0.75);
      content: '';
      display: inline-block;
      font-size: 0.8em;
      height: 2.0625em;
      left: 0;
      line-height: 2.0625em;
      position: absolute;
      text-align: center;
      top: 0;
      width: 2.0625em; }
  input[type="checkbox"]:checked + label:before,
  input[type="radio"]:checked + label:before {
    background: #3d4449;
    border-color: #3d4449;
    color: #ffffff;
    content: '\f00c'; }
  input[type="checkbox"]:focus + label:before,
  input[type="radio"]:focus + label:before {
    border-color: #00c8ff;
    box-shadow: 0 0 0 1px #00c8ff; }

input[type="checkbox"] + label:before {
  border-radius: 0.375em; }

input[type="radio"] + label:before {
  border-radius: 100%; }

::-webkit-input-placeholder {
  color: #9fa3a6 !important;
  opacity: 1.0; }

:-moz-placeholder {
  color: #9fa3a6 !important;
  opacity: 1.0; }

::-moz-placeholder {
  color: #9fa3a6 !important;
  opacity: 1.0; }

:-ms-input-placeholder {
  color: #9fa3a6 !important;
  opacity: 1.0; }

/* Box */
.box {
  border-radius: 0.375em;
  border: solid 1px rgba(210, 215, 217, 0.75);
  margin-bottom: 2em;
  padding: 1.5em; }
  .box > :last-child,
  .box > :last-child > :last-child,
  .box > :last-child > :last-child > :last-child {
    margin-bottom: 0; }
  .box.alt {
    border: 0;
    border-radius: 0;
    padding: 0; }

/* Icon */
.icon {
  text-decoration: none;
  border-bottom: none;
  position: relative; }
  .icon:before {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    text-transform: none !important;
    font-family: 'Font Awesome 5 Free';
    font-weight: 400; }
  .icon > .label {
    display: none; }
  .icon:before {
    line-height: inherit; }
  .icon.solid:before {
    font-weight: 900;
     }
  .icon.brands:before {
    font-family: 'Font Awesome 5 Brands'; }

/* Image */
.image {
  border-radius: 0.375em;
  border: 0;
  display: inline-block;
  position: relative; 
  
  }
  .image img {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    border-radius: 0.375em;
    display: block; 
    transition: transform 0.5s ease, box-shadow 0.3s ease; /* Transición suave */
    transform-origin: center; /* Zoom desde el centro */
    width: 100%;
    height: auto;
  }


  .image.left, .image.right {
    max-width: 40%; }
    .image.left img, .image.right img {
      width: 100%; }
  .image.left {
    float: left;
    padding: 0 1.5em 1em 0;
    top: 0.25em; }
  .image.right {
    float: right;
    padding: 0 0 1em 1.5em;
    top: 0.25em; }
  .image.fit {
    display: block;
    margin: 0 0 2em 0;
    width: 100%; }
    .image.fit img {
      width: 100%; }
  .image.main {
    display: block;
    margin: 0 0 3em 0;
    width: 100%; }
    .image.main img {
      width: 100%; }
     .image:hover img {
  transform: scale(1.05); /* Zoom del 5% */
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); /* Sombra más pronunciada */
}

/* Versión para dispositivos táctiles */
@media (hover: none) {
  .image:active img {
    transform: scale(1.03); /* Efecto más sutil en touch */
  }
}

/* Mantener todos los estilos existentes */
.image.left, .image.right {
  max-width: 40%;
}
.image.left img, .image.right img {
  width: 100%;
}
.image.left {
  float: left;
  padding: 0 1.5em 1em 0;
  top: 0.25em;
}
.image.right {
  float: right;
  padding: 0 0 1em 1.5em;
  top: 0.25em;
}
.image.fit {
  display: block;
  margin: 0 0 2em 0;
  width: 100%;
}
.image.fit img {
  width: 100%;
}
.image.main {
  display: block;
  margin: 0 0 3em 0;
  width: 100%;
}
.image.main img {
  width: 100%;
}

.image:hover img {
  transform: scale(1.05) translateY(-5px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.image::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 0.375em;
  
  pointer-events: none; /* Permite interactuar con la imagen */
}

a.image {
  overflow: hidden; }
  a.image img {
    -moz-transition: -moz-transform 0.2s ease;
    -webkit-transition: -webkit-transform 0.2s ease;
    -ms-transition: -ms-transform 0.2s ease;
    transition: transform 0.2s ease; }
  a.image:hover img {
    -moz-transform: scale(1.075);
    -webkit-transform: scale(1.075);
    -ms-transform: scale(1.075);
    transform: scale(1.075); }

    @media (hover: none) {
      .image:active img {
        transform: scale(1.03);
      }
    }

/* List */
ol {
  list-style: decimal;
  margin: 0 0 2em 0;
  padding-left: 1.25em; }
  ol li {
    padding-left: 0.25em; }

ul {
  list-style: disc;
  margin: 2em 0 2em 0;
  padding-left: 1em; }
  ul li {
    padding-left: 0.5em; }
  ul.alt {
    list-style: none;
    padding-left: 0; }
    ul.alt li {
      border-top: solid 1px rgba(210, 215, 217, 0.75);
      padding: 0.5em 0; }
      ul.alt li:first-child {
        border-top: 0;
        padding-top: 0; }

dl {
  margin: 0 0 2em 0; }
  dl dt {
    display: block;
    font-weight: 600;
    margin: 0 0 1em 0; }
  dl dd {
    margin-left: 2em; }

/* Actions */
ul.actions {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  cursor: default;
  list-style: none;
  margin-left: -1em;
  padding-left: 0; }
  ul.actions li {
    padding: 0 0 0 1em;
    vertical-align: middle; }
  ul.actions.special {
    -moz-justify-content: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    width: 100%;
    margin-left: 0; }
    ul.actions.special li:first-child {
      padding-left: 0; }
  ul.actions.stacked {
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-left: 0; }
    ul.actions.stacked li {
      padding: 1.3em 0 0 0; }
      ul.actions.stacked li:first-child {
        padding-top: 0; }
  ul.actions.fit {
    width: calc(100% + 1em); }
    ul.actions.fit li {
      -moz-flex-grow: 1;
      -webkit-flex-grow: 1;
      -ms-flex-grow: 1;
      flex-grow: 1;
      -moz-flex-shrink: 1;
      -webkit-flex-shrink: 1;
      -ms-flex-shrink: 1;
      flex-shrink: 1;
      width: 100%; }
      ul.actions.fit li > * {
        width: 100%; }
    ul.actions.fit.stacked {
      width: 100%; }

/* Icons */
ul.icons {
  cursor: default;
  list-style: none;
  padding-left: 0; 
 
}
  ul.icons li {
    display: inline-block;
    padding: 0 1em 0 0; }
    ul.icons li:last-child {
      padding-right: 0; }
    ul.icons li .icon {
      color: inherit; }
      ul.icons li .icon:before {
        font-size: 1.25em; }
 /* Icons */
ul.icons2 {
  cursor: default;
  list-style: none;
  text-align: left; /* Alinea todo el contenido de la lista a la izquierda */
  padding-left: 0; /* Elimina el padding izquierdo por defecto */
  margin-left: 0; /* Elimina el margen izquierdo por defecto */
  list-style: none; /* Opcional: elimina los bullets de la lista */
}
  ul.icons2 li {
    display: inline-block;
    padding: 0 1em 0 0; }
    ul.icons2 li:last-child {
      padding-right: 0; }
    ul.icons2 li .icon {
      color: inherit; }
      ul.icons2 li .icon:before {
        font-size: 1.25em; }       

/* Contact */
ul.contact {
  color: #FFFFFF;
  list-style: none;
  padding: 0; }
  ul.contact li {
    text-decoration: none;
    border-top: solid 1px rgb(0, 200, 255);
    margin: 1.5em 0 0 0;
    padding: 1.5em 0 0 3em;
    position: relative; }
    ul.contact li:before {
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      line-height: 1;
      text-transform: none !important;
      font-family: 'Font Awesome 5 Free';
      font-weight: 400; }
    ul.contact li:before {
      color: #00c8ff;
      display: inline-block;
      font-size: 1.5em;
      height: 1.125em;
      left: 0;
      line-height: 1.125em;
      position: absolute;
      text-align: center;
      top: 1em;
      width: 1.5em; }
    ul.contact li:first-child {
      border-top: 0;
      margin-top: 0;
      padding-top: 0; }
      ul.contact li:first-child:before {
        top: 0; }
    ul.contact li a {
      color: #FFFFFF; }

/* menu texto contacto*/
p.extra {
  color: #FFFFFF; 
}

 

/* Pagination */
ul.pagination {
  cursor: default;
  list-style: none;
  padding-left: 0; }
  ul.pagination li {
    display: inline-block;
    padding-left: 0;
    vertical-align: middle; }
    ul.pagination li > .page {
      -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
      -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
      -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
      transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
      border-bottom: 0;
      border-radius: 0.375em;
      display: inline-block;
      font-size: 0.8em;
      font-weight: 600;
      height: 2em;
      line-height: 2em;
      margin: 0 0.125em;
      min-width: 2em;
      padding: 0 0.5em;
      text-align: center; }
      ul.pagination li > .page.active {
        background-color: #00c8ff;
        color: #ffffff !important; }
        ul.pagination li > .page.active:hover {
          background-color: #f67878; }
        ul.pagination li > .page.active:active {
          background-color: #f45c5c; }
    ul.pagination li:first-child {
      padding-right: 0.75em; }
    ul.pagination li:last-child {
      padding-left: 0.75em; }
  @media screen and (max-width: 480px) {
    ul.pagination li:nth-child(n+2):nth-last-child(n+2) {
      display: none; }
    ul.pagination li:first-child {
      padding-right: 0; } }

/* Table */
.table-wrapper {
  -webkit-overflow-scrolling: touch;
  overflow-x: auto; }

table {
  margin: 0 0 2em 0;
  width: 100%; }
  table tbody tr {
    border: solid 1px rgba(210, 215, 217, 0.75);
    border-left: 0;
    border-right: 0; }
    table tbody tr:nth-child(2n + 1) {
      background-color: rgba(230, 235, 237, 0.25); }
  table td {
    padding: 0.75em 0.75em; }
  table th {
    color: #3d4449;
    font-size: 0.9em;
    font-weight: 600;
    padding: 0 0.75em 0.75em 0.75em;
    text-align: left; }
  table thead {
    border-bottom: solid 2px rgba(210, 215, 217, 0.75); }
  table tfoot {
    border-top: solid 2px rgba(210, 215, 217, 0.75); }
  table.alt {
    border-collapse: separate; }
    table.alt tbody tr td {
      border: solid 1px rgba(210, 215, 217, 0.75);
      border-left-width: 0;
      border-top-width: 0; }
      table.alt tbody tr td:first-child {
        border-left-width: 1px; }
    table.alt tbody tr:first-child td {
      border-top-width: 1px; }
    table.alt thead {
      border-bottom: 0; }
    table.alt tfoot {
      border-top: 0; }

/* Button box */
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  background-color: transparent;
  border-radius: 0.375em;
  border: 0;
  /*box-shadow: inset 0 0 0 2px #0049ab;*/
  color: #FFFFFF !important;
  cursor: pointer;
  display: inline-block;
  font-family: "Roboto Slab", sans-serif;
  font-size: 0.8em;
  font-weight: 700;
  height: 3.5em;
  letter-spacing: 0.075em;
  line-height: 3.5em;
  padding: 0 2.25em;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap; }
  input[type="submit"]:hover,
  input[type="reset"]:hover,
  input[type="button"]:hover,
  button:hover,
  .button:hover {
    background-color: rgba(245, 106, 106, 0.05); }
  input[type="submit"]:active,
  input[type="reset"]:active,
  input[type="button"]:active,
  button:active,
  .button:active {
    background-color: rgba(245, 106, 106, 0.15); }
  input[type="submit"].icon:before,
  input[type="reset"].icon:before,
  input[type="button"].icon:before,
  button.icon:before,
  .button.icon:before {
    margin-right: 0.5em; }
  input[type="submit"].fit,
  input[type="reset"].fit,
  input[type="button"].fit,
  button.fit,
  .button.fit {
    width: 100%; }
  input[type="submit"].small,
  input[type="reset"].small,
  input[type="button"].small,
  button.small,
  .button.small {
    font-size: 0.6em; }
  input[type="submit"].large,
  input[type="reset"].large,
  input[type="button"].large,
  button.large,
  .button.large {
    font-size: 1em;
    height: 3.65em;
    line-height: 3.65em; }
  input[type="submit"].primary,
  input[type="reset"].primary,
  input[type="button"].primary,
  button.primary,
  .button.primary {
    background-color: #00c8ff;
    box-shadow: none;
    color: #ffffff !important; }
    input[type="submit"].primary:hover,
    input[type="reset"].primary:hover,
    input[type="button"].primary:hover,
    button.primary:hover,
    .button.primary:hover {
      background-color: #00c8ff; }
    input[type="submit"].primary:active,
    input[type="reset"].primary:active,
    input[type="button"].primary:active,
    button.primary:active,
    .button.primary:active {
      background-color: #0049ab; }
  input[type="submit"].disabled, input[type="submit"]:disabled,
  input[type="reset"].disabled,
  input[type="reset"]:disabled,
  input[type="button"].disabled,
  input[type="button"]:disabled,
  button.disabled,
  button:disabled,
  .button.disabled,
  .button:disabled {
    pointer-events: none;
    opacity: 0.25; }

/* Mini Posts */
.mini-posts article {
  border-top: solid 1px rgba(210, 215, 217, 0.75);
  margin-top: 2em;
  padding-top: 2em; }
  .mini-posts article .image {
    display: block;
    margin: 0 0 1.5em 0; }
    .mini-posts article .image img {
      display: block;
      width: 100%; }
  .mini-posts article:first-child {
    border-top: 0;
    margin-top: 0;
    padding-top: 0; }

/* Features */
.features {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -moz-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 0 2em -3em;
  width: calc(100% + 3em); }
  .features article {
    -moz-align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    margin: 0 0 3em 3em;
    position: relative;
    width: calc(50% - 3em); }
    .features article:nth-child(2n - 1) {
      margin-right: 1.5em; }
    .features article:nth-child(2n) {
      margin-left: 1.5em; }
    .features article:nth-last-child(1), .features article:nth-last-child(2) {
      margin-bottom: 0; }
    .features article .icon {
      -moz-flex-grow: 0;
      -webkit-flex-grow: 0;
      -ms-flex-grow: 0;
      flex-grow: 0;
      -moz-flex-shrink: 0;
      -webkit-flex-shrink: 0;
      -ms-flex-shrink: 0;
      flex-shrink: 0;
      display: block;
      height: 10em;
      line-height: 10em;
      margin: 0 2em 0 0;
      text-align: center;
      width: 10em; }
      .features article .icon:before {
        color: #00c8ff;
        font-size: 2.75rem;
        position: relative;
        top: 0.05em; }
      .features article .icon:after {
        -moz-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        border-radius: 0.25rem;
        border: solid 2px rgba(210, 215, 217, 0.75);
        content: '';
        display: block;
        height: 7em;
        left: 50%;
        margin: -3.5em 0 0 -3.5em;
        position: absolute;
        top: 50%;
        width: 7em; }
    .features article .content {
      -moz-flex-grow: 1;
      -webkit-flex-grow: 1;
      -ms-flex-grow: 1;
      flex-grow: 1;
      -moz-flex-shrink: 1;
      -webkit-flex-shrink: 1;
      -ms-flex-shrink: 1;
      flex-shrink: 1;
      width: 100%; }
      .features article .content > :last-child {
        margin-bottom: 0; }
  @media screen and (max-width: 980px) {
    .features {
      margin: 0 0 2em 0;
      width: 100%; }
      .features article {
        margin: 0 0 3em 0;
        width: 100%; }
        .features article:nth-child(2n - 1) {
          margin-right: 0; }
        .features article:nth-child(2n) {
          margin-left: 0; }
        .features article:nth-last-child(1), .features article:nth-last-child(2) {
          margin-bottom: 3em; }
        .features article:last-child {
          margin-bottom: 0; }
        .features article .icon {
          height: 8em;
          line-height: 8em;
          width: 8em; }
          .features article .icon:before {
            font-size: 2.25rem; }
          .features article .icon:after {
            height: 6em;
            margin: -3em 0 0 -3em;
            width: 6em; } }
  @media screen and (max-width: 480px) {
    .features article {
      -moz-flex-direction: column;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      -moz-align-items: -moz-flex-start;
      -webkit-align-items: -webkit-flex-start;
      -ms-align-items: -ms-flex-start;
      align-items: flex-start; }
      .features article .icon {
        height: 6em;
        line-height: 6em;
        margin: 0 0 1.5em 0;
        width: 6em; }
        .features article .icon:before {
          font-size: 1.5rem; }
        .features article .icon:after {
          height: 4em;
          margin: -2em 0 0 -2em;
          width: 4em; } }
  @media screen and (max-width: 480px) {
    .features article .icon:before {
      font-size: 1.25rem; } }

/* Posts */
.posts {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -moz-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 0 2em -6em;
  width: calc(100% + 6em); }
  .posts article {
    -moz-flex-grow: 0;
    -webkit-flex-grow: 0;
    -ms-flex-grow: 0;
    flex-grow: 0;
    -moz-flex-shrink: 1;
    -webkit-flex-shrink: 1;
    -ms-flex-shrink: 1;
    flex-shrink: 1;
    margin: 0 0 6em 6em;
    position: relative;
    width: calc(33.33333% - 6em); }
    .posts article:before {
      background: rgba(210, 215, 217, 0.75);
      content: '';
      display: block;
      height: calc(100% + 6em);
      left: -3em;
      position: absolute;
      top: 0;
      width: 1px; }
    .posts article:after {
      background: rgba(210, 215, 217, 0.75);
      bottom: -3em;
      content: '';
      display: block;
      height: 1px;
      position: absolute;
      right: 0;
      width: calc(100% + 6em); }
    .posts article > :last-child {
      margin-bottom: 0; }
    .posts article .image {
      display: block;
      margin: 0 0 2em 0; }
      .posts article .image img {
        display: block;
        width: 100%; }
  @media screen and (min-width: 1681px) {
    .posts article:nth-child(3n + 1):before {
      display: none; }
    .posts article:nth-child(3n + 1):after {
      width: 100%; }
    .posts article:nth-last-child(1), .posts article:nth-last-child(2), .posts article:nth-last-child(3) {
      margin-bottom: 0; }
      .posts article:nth-last-child(1):before, .posts article:nth-last-child(2):before, .posts article:nth-last-child(3):before {
        height: 100%; }
      .posts article:nth-last-child(1):after, .posts article:nth-last-child(2):after, .posts article:nth-last-child(3):after {
        display: none; } }
  @media screen and (max-width: 1680px) {
    .posts article {
      width: calc(50% - 6em); }
      .posts article:nth-last-child(3) {
        margin-bottom: 6em; } }
  @media screen and (min-width: 481px) and (max-width: 1680px) {
    .posts article:nth-child(2n + 1):before {
      display: none; }
    .posts article:nth-child(2n + 1):after {
      width: 100%; }
    .posts article:nth-last-child(1), .posts article:nth-last-child(2) {
      margin-bottom: 0; }
      .posts article:nth-last-child(1):before, .posts article:nth-last-child(2):before {
        height: 100%; }
      .posts article:nth-last-child(1):after, .posts article:nth-last-child(2):after {
        display: none; } }
  @media screen and (max-width: 736px) {
    .posts {
      margin: 0 0 2em -4.5em;
      width: calc(100% + 4.5em); }
      .posts article {
        margin: 0 0 4.5em 4.5em;
        width: calc(50% - 4.5em); }
        .posts article:before {
          height: calc(100% + 4.5em);
          left: -2.25em; }
        .posts article:after {
          bottom: -2.25em;
          width: calc(100% + 4.5em); }
        .posts article:nth-last-child(3) {
          margin-bottom: 4.5em; } }
  @media screen and (max-width: 480px) {
    .posts {
      margin: 0 0 2em 0;
      width: 100%; }
      .posts article {
        margin: 0 0 4.5em 0;
        width: 100%; }
        .posts article:before {
          display: none; }
        .posts article:after {
          width: 100%; }
        .posts article:last-child {
          margin-bottom: 0; }
          .posts article:last-child:after {
            display: none; } }

/* Wrapper */
#wrapper {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -moz-flex-direction: row-reverse;
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  min-height: 100vh; }

/* Main */
#main {
  -moz-flex-grow: 1;
  -webkit-flex-grow: 1;
  -ms-flex-grow: 1;
  flex-grow: 1;
  -moz-flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -ms-flex-shrink: 1;
  flex-shrink: 1;
  width: 100%; }
  #main > .inner {
    padding: 0 6em 0.1em 6em ;
    margin: 0 auto;
    max-width: 110em; }
    /* Main color linea */

    #main > .inner > section {
      padding: 6em 0 4em 0 ;
      border-top: solid 0px rgba(0, 200, 255, 1); }
      #main > .inner > section:first-of-type {
        border-top: 0 !important; }
  @media screen and (max-width: 1680px) {
    #main > .inner {
      padding: 0 5em 0.1em 5em ; }
      #main > .inner > section {
        padding: 5em 0 3em 0 ; } }
  @media screen and (max-width: 1280px) {
    #main > .inner {
      padding: 0 4em 0.1em 4em ; }
      #main > .inner > section {
        padding: 4em 0 2em 0 ; } }
  @media screen and (max-width: 736px) {
    #main > .inner {
      padding: 0 2em 0.1em 2em ; }
      #main > .inner > section {
        padding: 3em 0 1em 0 ; } }

/* Sidebar */
#search form {
  text-decoration: none;
  position: relative; }
  #search form:before {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    text-transform: none !important;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900; }
  #search form:before {
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
    color: #7f888f;
    content: '\f002';
    cursor: default;
    display: block;
    font-size: 1.5em;
    height: 2em;
    line-height: 2em;
    opacity: 0.325;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 2em; }
  #search form input[type="text"] {
    padding-right: 2.75em; }

#sidebar {
  -moz-flex-grow: 0;
  -webkit-flex-grow: 0;
  -ms-flex-grow: 0;
  flex-grow: 0;
  -moz-flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -ms-flex-shrink: 0;
  flex-shrink: 0;
  -moz-transition: margin-left 0.5s ease, box-shadow 0.5s ease;
  -webkit-transition: margin-left 0.5s ease, box-shadow 0.5s ease;
  -ms-transition: margin-left 0.5s ease, box-shadow 0.5s ease;
  transition: margin-left 0.5s ease, box-shadow 0.5s ease;
  background-color: #0049ab;
  font-size: 0.9em;
  position: relative;
  width: 26em; }
  #sidebar h2 {
    font-size: 1.38889em; }
  #sidebar > .inner {
    padding: 2.22222em 2.22222em 2.44444em 2.22222em ;
    position: relative;
    width: 26em; }
    #sidebar > .inner > * {
      border-bottom: solid 2px rgb(0, 200, 255);
      margin: 0 0 3.5em 0;
      padding: 0 0 3.5em 0; }
      #sidebar > .inner > * > :last-child {
        margin-bottom: 0; }
      #sidebar > .inner > *:last-child {
        border-bottom: 0;
        margin-bottom: 0;
        padding-bottom: 0; }
    #sidebar > .inner > .alt {
      background-color: #eff1f2;
      border-bottom: 0;
      margin: -2.22222em 0 4.44444em -2.22222em;
      padding: 2.22222em;
      width: calc(100% + 4.44444em); }
  #sidebar .toggle {
    text-decoration: none;
    -moz-transition: left 0.5s ease;
    -webkit-transition: left 0.5s ease;
    -ms-transition: left 0.5s ease;
    transition: left 0.5s ease;
    -webkit-tap-highlight-color: rgb(0, 200, 255);
    border: 0;
    display: block;
    height: 7.5em;
    left: 26em;
    line-height: 7.5em;
    outline: 0;
    overflow: hidden;
    position: absolute;
    text-align: center;
    text-indent: -15em;
    white-space: nowrap;
    top: 0;
    width: 6em;
    z-index: 10000; }
    #sidebar .toggle:before {
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      line-height: 1;
      text-transform: none !important;
      font-family: 'Font Awesome 5 Free';
      font-weight: 900; }
    #sidebar .toggle:before {
      content: '\f0c9';
      font-size: 2rem;
      height: inherit;
      left: 0;
      line-height: inherit;
      position: absolute;
      text-indent: 0;
      top: 0;
      width: inherit; }
  #sidebar.inactive {
    margin-left: -26em; }
  @media screen and (max-width: 1680px) {
    #sidebar {
      width: 24em; }
      #sidebar > .inner {
        padding: 1.66667em 1.66667em 1.33333em 1.66667em ;
        width: 24em; }
        #sidebar > .inner > .alt {
          margin: -1.66667em 0 3.33333em -1.66667em;
          padding: 1.66667em;
          width: calc(100% + 3.33333em); }
      #sidebar .toggle {
        height: 6.25em;
        left: 24em;
        line-height: 6.25em;
        text-indent: 5em;
        width: 5em; }
        #sidebar .toggle:before {
          font-size: 1.5rem; }
      #sidebar.inactive {
        margin-left: -24em; } }
  @media screen and (max-width: 1280px) {
    #sidebar {
      box-shadow: 0 0 5em 0 rgba(0, 0, 0, 0.175);
      height: 100%;
      left: 0;
      position: fixed;
      top: 0;
      z-index: 10000; }
      #sidebar.inactive {
        box-shadow: none; }
      #sidebar > .inner {
        -webkit-overflow-scrolling: touch;
        height: 100%;
        left: 0;
        overflow-x: hidden;
        overflow-y: auto;
        position: absolute;
        top: 0; }
        #sidebar > .inner:after {
          content: '';
          display: block;
          height: 4em;
          width: 100%; }
      #sidebar .toggle {
        text-indent: 6em;
        width: 6em; }
        #sidebar .toggle:before {
          font-size: 1.5rem;
          margin-left: -0.4375em; }
      body.is-preload #sidebar {
        display: none; } }
  @media screen and (max-width: 736px) {
    #sidebar .toggle {
      text-indent: 7.25em;
      width: 7.25em; }
      #sidebar .toggle:before {
        color: #7f888f;
        margin-left: -0.0625em;
        margin-top: -0.25em;
        font-size: 1.1rem;
        z-index: 1; }
      #sidebar .toggle:after {
        background: rgba(222, 225, 226, 0.75);
        border-radius: 0.375em;
        content: '';
        height: 3.5em;
        left: 1em;
        position: absolute;
        top: 1em;
        width: 5em; } }

/* Header */
#header {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  border-bottom: solid 5px #00c8ff;
  padding: 6em 0 1em 0;
  position: relative; }
  #header > * {
    -moz-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-bottom: 0; }
  #header .logo {
    border-bottom: 0;
    color: inherit;
    size: 10px;
    font-size: 1.125em; }
  #header .icons {
    text-align: right; }
  @media screen and (max-width: 1680px) {
    #header {
      padding-top: 5em; } }
  @media screen and (max-width: 736px) {
    #header {
      padding-top: 6.5em; }
      #header .logo {
        font-size: 1.25em;
        margin: 0; }
      #header .icons {
        height: 5em;
        line-height: 5em;
        position: absolute;
        right: -0.5em;
        top: 0; } }

    .logo img {
    width: 180px;
    height: auto;
    transition: transform 0.3s ease; /* Efecto hover suave */
}

.logo img:hover {
    transform: scale(1.05); /* Ligero zoom al pasar el mouse */
}

/* Banner */
#banner {
  padding: 0em 0 0em 0 ;
  margin-top: -2em;
  margin-bottom: -5em;
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex; }
  #banner h1 {
    margin-top: -0.5em;

    
   }
   #banner p {
    font-size: 20px;
    margin-top: -1em;
    margin-right: 1em;
   }
   p.fuenteBold{
    font-family: "Gotham";
    font-weight: bold;
   }
   p.fuenteItalic{
    font-family: "Gotham";
    font-style: italic;
   }
  #banner .content {
    -moz-flex-grow: 1;
    -webkit-flex-grow: 1;
    -ms-flex-grow: 1;
    flex-grow: 1;
    -moz-flex-shrink: 1;
    -webkit-flex-shrink: 1;
    -ms-flex-shrink: 1;
    flex-shrink: 1;
    width: 30%; }
  #banner .image {
    -moz-flex-grow: 0;
    -webkit-flex-grow: 0;
    -ms-flex-grow: 0;
    flex-grow: 0;
    -moz-flex-shrink: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0;
    display: block;
    margin: -1em 0em -1em 0em;
    width: 60%; }
    #banner .image img {
      height: 65%;
      -moz-object-fit: cover;
      -webkit-object-fit: cover;
      -ms-object-fit: cover;
      object-fit: cover;
      -moz-object-position: center;
      -webkit-object-position: center;
      -ms-object-position: center;
      object-position: center;
      width: 100%; }
  @media screen and (orientation: portrait) {
    #banner {
      -moz-flex-direction: column-reverse;
      -webkit-flex-direction: column-reverse;
      -ms-flex-direction: column-reverse;
      flex-direction: column-reverse; }
      #banner h1 br {
        display: none; }
      #banner .content {
        -moz-flex-grow: 0;
        -webkit-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
        -moz-flex-shrink: 0;
        -webkit-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
        width: 100%; }
      #banner .image {
        -moz-flex-grow: 0;
        -webkit-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
        -moz-flex-shrink: 0;
        -webkit-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
        margin: 0 0 0 0;
        height: 25em;
        max-height: 50vh;
        min-height: 18em;
        width: 100%; } }
  @media screen and (orientation: portrait) and (max-width: 480px) {
    #banner .image {
      max-height: 35vh; } }

      @media screen and (max-width: 830px) {
       #banner .image {
       max-height: 35vh; }
     

    }

/* Footer */
#footer .copyright {
  color: #9fa3a6;
  font-size: 0.9em; }
  #footer .copyright a {
    color: inherit; }

/* Menu */
#menu ul {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  color: #FFFFFF;
  font-family: "Gotham", sans-serif;
  font-weight: 300;
  letter-spacing: 0.075em;
  list-style: none;
  margin-bottom: 0;
  padding: 0;
  text-transform: uppercase; }
  #menu ul a, #menu ul span {
    border-bottom: 0;
    color: inherit;
    cursor: pointer;
    display: block;
    font-size: 0.9em;
    padding: 0.625em 0; }
    #menu ul a:hover, #menu ul span:hover {
      color: #00c8ff; }
    #menu ul a.opener, #menu ul span.opener {
      -moz-transition: color 0.2s ease-in-out;
      -webkit-transition: color 0.2s ease-in-out;
      -ms-transition: color 0.2s ease-in-out;
      transition: color 0.2s ease-in-out;
      text-decoration: none;
      -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
      position: relative; }
      #menu ul a.opener:before, #menu ul span.opener:before {
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        line-height: 1;
        text-transform: none !important;
        font-family: 'Font Awesome 5 Free';
        font-weight: 900; }
      #menu ul a.opener:before, #menu ul span.opener:before {
        -moz-transition: color 0.2s ease-in-out, -moz-transform 0.2s ease-in-out;
        -webkit-transition: color 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
        -ms-transition: color 0.2s ease-in-out, -ms-transform 0.2s ease-in-out;
        transition: color 0.2s ease-in-out, transform 0.2s ease-in-out;
        color: #00c8ff;
        content: '\f078';
        position: absolute;
        right: 0; }
      #menu ul a.opener:hover:before, #menu ul span.opener:hover:before {
        color: #00c8ff; }
      #menu ul a.opener.active + ul, #menu ul span.opener.active + ul {
        display: block; }
      #menu ul a.opener.active:before, #menu ul span.opener.active:before {
        -moz-transform: rotate(-180deg);
        -webkit-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg); }

#menu > ul > li {
  border-top: solid 1px rgb(0, 200, 255);
  margin: 0.5em 0 0 0;
  padding: 0.5em 0 0 0; }
  #menu > ul > li > ul {
    color: #ffffff;
    display: none;
    margin: 0.5em 0 1.5em 0;
    padding-left: 1em; }
    #menu > ul > li > ul a, #menu > ul > li > ul span {
      font-size: 0.8em; }
    #menu > ul > li > ul > li {
      margin: 0.125em 0 0 0;
      padding: 0.125em 0 0 0; }
  #menu > ul > li:first-child {
    border-top: 0;
    margin-top: 0;
    padding-top: 0; }

    /* Banner2 */

    a.extra1{
     
    }     
    a.extra2{
      
    }     
  #banner2 {
    position: relative;
    padding: 4.5em;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  }

    #banner2 h2 {
      margin: 0.1em 0 0.35em 0;
      text-align: left;
    }

    #banner2 p {
      font-size: 2.75em;
      line-height: 1.35em;
      margin: 0;
      text-align: left;


    }

    #banner2 .button {
      width: 70%;
      margin-bottom: 0.5em;
      text-align: left; 
    }


      #banner2 .button.icon:before {
        position: absolute;
        right: 0.15em;
        top: 50%;
        margin-top: -0.5em;
      }
       
      #banner2 .button.large {
        
        background-color: #00c8ff;

      }
      #banner2 .button.alt {
        background-color: #4190e5;

      }

    #banner2 ul {
      list-style: none;
      padding-left: 0;
      margin: 0em;
    }

      #banner2 ul li {

      }

    #banner2 {
        padding: 4.5em 3em;
        text-align: center;
      }

        #banner2 ul {
          margin: 2em 0 0 0;
        }

        #banner2 .button.icon:before {
          position: relative;
          right: auto;
          top: auto;
          color: #FFFFFF;
        }
        
      #banner2-wrapper {
        padding: 0 5px 0 5px;
      }


      #banner2 {
        text-align: center;
        padding: 15px 15px 15px 15px;
        margin: 0 auto !important;
      }

        #banner2 h2 {
          font-size: 2em;
          margin: 0.75em 0 0.5em 0;
        }

        #banner2 a {
    
        }

        #banner2 p {
          font-size: 1.5em;
          line-height: 1.5em;
          margin: 0;
          color: #fff;
        }

        #banner2 ul {
          margin: 2em 0 0 0;
        }


        .box2 {
    background: #0049ab;
    border-radius: 6px;
    box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.05);
    padding: 2em;
  }

    .box2.feature {
      padding: 0;
    }

      .box2.feature .inner {
        padding: 4em 2em 3em 2em;
      }

      .box2.feature h2 {
        font-size: 1.35em;
      }

      .box2.feature p {
        margin: 0;
      }

      .box2.feature .image {
        position: relative;
        margin: 0;
      }

        .box2.feature .image img {
          border-bottom-left-radius: 0;
          border-bottom-right-radius: 0;
        }
  
        .box2 {
                padding: 15px 15px 15px 15px;
                margin: 0;
              }

        .box2.feature {
          margin: 20px 0 0 0 !important;
          padding: 0;
        }

          .box2.feature .inner {
            padding: 30px 15px 30px 15px;
          }

          .box2.feature p {
            margin: 0;
          }

          .box2.feature .image {
            position: relative;
            margin: 0;
          }

            .box2.feature .image img {
              border-bottom-left-radius: 0;
              border-bottom-right-radius: 0;
            }


    .row2 {
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    align-items: stretch;
  }

    .row2 > * {
      box-sizing: border-box;
    }

    .row2.gtr-uniform > * > :last-child {
      margin-bottom: 0;
    }

    .row2.aln-left {
      justify-content: flex-start;
    }

    .row2.aln-center {
      justify-content: center;
    }

    .row2.aln-right {
      justify-content: flex-end;
    }

    .row2.aln-top {
      align-items: flex-start;
    }

    .row2.aln-middle {
      align-items: center;
    }

    .row2.aln-bottom {
      align-items: flex-end;
    }

    .row2 > .imp {
      order: -1;
    }

    .row2 > .col-1 {
      width: 8.33333%;
    }

    .row2 > .off-1 {
      margin-left: 8.33333%;
    }

    .row2 > .col-2 {
      width: 16.66667%;
    }

    .row2 > .off-2 {
      margin-left: 16.66667%;
    }

    .row2 > .col-3 {
      width: 25%;
    }

    .row2 > .off-3 {
      margin-left: 25%;
    }

    .row2 > .col-4 {
      width: 33.33333%;
    }

    .row2 > .off-4 {
      margin-left: 33.33333%;
    }

    .row2 > .col-5 {
      width: 41.66667%;
    }

    .row2 > .off-5 {
      margin-left: 41.66667%;
    }

    .row2 > .col-6 {
      width: 50%;
    }

    .row2 > .off-6 {
      margin-left: 50%;
    }

    .row2 > .col-7 {
      width: 58.33333%;
    }

    .row2 > .off-7 {
      margin-left: 58.33333%;
    }

    .row2 > .col-8 {
      width: 66.66667%;
    }

    .row2 > .off-8 {
      margin-left: 66.66667%;
    }

    .row2 > .col-9 {
      width: 75%;
    }

    .row2 > .off-9 {
      margin-left: 75%;
    }

    .row2 > .col-10 {
      width: 83.33333%;
    }

    .row2 > .off-10 {
      margin-left: 83.33333%;
    }

    .row2 > .col-11 {
      width: 91.66667%;
    }

    .row2 > .off-11 {
      margin-left: 91.66667%;
    }

    .row2 > .col-12 {
      width: 100%;
    }

    .row2 > .off-12 {
      margin-left: 100%;
    }

    .row2.gtr-0 {
      margin-top: 0px;
      margin-left: 0px;
    }

      .row2.gtr-0 > * {
        padding: 0px 0 0 0px;
      }

      .row2.gtr-0.gtr-uniform {
        margin-top: 0px;
      }

        .row2.gtr-0.gtr-uniform > * {
          padding-top: 0px;
        }

    .row2.gtr-25 {
      margin-top: -10px;
      margin-left: -10px;
    }

      .row2.gtr-25 > * {
        padding: 10px 0 0 10px;
      }

      .row2.gtr-25.gtr-uniform {
        margin-top: -10px;
      }

        .row2.gtr-25.gtr-uniform > * {
          padding-top: 10px;
        }

    .row2.gtr-50 {
      margin-top: -20px;
      margin-left: -20px;
    }

      .row2.gtr-50 > * {
        padding: 20px 0 0 20px;
      }

      .row2.gtr-50.gtr-uniform {
        margin-top: -20px;
      }

        .row2.gtr-50.gtr-uniform > * {
          padding-top: 20px;
        }

    .row2 {
      margin-top: -40px;
      margin-left: -40px;
    }

      .row2 > * {
        padding: 40px 0 0 40px;
      }

      .row2.gtr-uniform {
        margin-top: -40px;
      }

        .row2.gtr-uniform > * {
          padding-top: 40px;
        }

    .row2.gtr-150 {
      margin-top: -60px;
      margin-left: -60px;
    }

      .row2.gtr-150 > * {
        padding: 60px 0 0 60px;
      }

      .row2.gtr-150.gtr-uniform {
        margin-top: -60px;
      }

        .row2.gtr-150.gtr-uniform > * {
          padding-top: 60px;
        }

    .row2.gtr-200 {
      margin-top: -80px;
      margin-left: -80px;
    }

      .row2.gtr-200 > * {
        padding: 80px 0 0 80px;
      }

      .row2.gtr-200.gtr-uniform {
        margin-top: -80px;
      }

        .row2.gtr-200.gtr-uniform > * {
          padding-top: 80px;
        }

    @media screen and (max-width: 1680px) {

      .row2 {
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
        align-items: stretch;
      }

        .row2 > * {
          box-sizing: border-box;
        }

        .row2.gtr-uniform > * > :last-child {
          margin-bottom: 0;
        }

        .row2.aln-left {
          justify-content: flex-start;
        }

        .row2.aln-center {
          justify-content: center;
        }

        .row2.aln-right {
          justify-content: flex-end;
        }

        .row2.aln-top {
          align-items: flex-start;
        }

        .row2.aln-middle {
          align-items: center;
        }

        .row2.aln-bottom {
          align-items: flex-end;
        }

        .row2 > .imp-xlarge {
          order: -1;
        }

        .row2 > .col-1-xlarge {
          width: 8.33333%;
        }

        .row2 > .off-1-xlarge {
          margin-left: 8.33333%;
        }

        .row2 > .col-2-xlarge {
          width: 16.66667%;
        }

        .row2 > .off-2-xlarge {
          margin-left: 16.66667%;
        }

        .row2 > .col-3-xlarge {
          width: 25%;
        }

        .row2 > .off-3-xlarge {
          margin-left: 25%;
        }

        .row2 > .col-4-xlarge {
          width: 33.33333%;
        }

        .row2 > .off-4-xlarge {
          margin-left: 33.33333%;
        }

        .row2 > .col-5-xlarge {
          width: 41.66667%;
        }

        .row2 > .off-5-xlarge {
          margin-left: 41.66667%;
        }

        .row2 > .col-6-xlarge {
          width: 50%;
        }

        .row2 > .off-6-xlarge {
          margin-left: 50%;
        }

        .row2 > .col-7-xlarge {
          width: 58.33333%;
        }

        .row2 > .off-7-xlarge {
          margin-left: 58.33333%;
        }

        .row2 > .col-8-xlarge {
          width: 66.66667%;
        }

        .row2 > .off-8-xlarge {
          margin-left: 66.66667%;
        }

        .row2 > .col-9-xlarge {
          width: 75%;
        }

        .row2 > .off-9-xlarge {
          margin-left: 75%;
        }

        .row2 > .col-10-xlarge {
          width: 83.33333%;
        }

        .row2 > .off-10-xlarge {
          margin-left: 83.33333%;
        }

        .row2 > .col-11-xlarge {
          width: 91.66667%;
        }

        .row2 > .off-11-xlarge {
          margin-left: 91.66667%;
        }

        .row2 > .col-12-xlarge {
          width: 100%;
        }

        .row2 > .off-12-xlarge {
          margin-left: 100%;
        }

        .row2.gtr-0 {
          margin-top: 0px;
          margin-left: 0px;
        }

          .row2.gtr-0 > * {
            padding: 0px 0 0 0px;
          }

          .row2.gtr-0.gtr-uniform {
            margin-top: 0px;
          }

            .row2.gtr-0.gtr-uniform > * {
              padding-top: 0px;
            }

        .row2.gtr-25 {
          margin-top: -10px;
          margin-left: -10px;
        }

          .row2.gtr-25 > * {
            padding: 10px 0 0 10px;
          }

          .row2.gtr-25.gtr-uniform {
            margin-top: -10px;
          }

            .row2.gtr-25.gtr-uniform > * {
              padding-top: 10px;
            }

        .row2.gtr-50 {
          margin-top: -20px;
          margin-left: -20px;
        }

          .row2.gtr-50 > * {
            padding: 20px 0 0 20px;
          }

          .row2.gtr-50.gtr-uniform {
            margin-top: -20px;
          }

            .row2.gtr-50.gtr-uniform > * {
              padding-top: 20px;
            }

        .row2 {
          margin-top: -40px;
          margin-left: -40px;
        }

          .row2 > * {
            padding: 40px 0 0 40px;
          }

          .row2.gtr-uniform {
            margin-top: -40px;
          }

            .row2.gtr-uniform > * {
              padding-top: 40px;
            }

        .row2.gtr-150 {
          margin-top: -60px;
          margin-left: -60px;
        }

          .row2.gtr-150 > * {
            padding: 60px 0 0 60px;
          }

          .row2.gtr-150.gtr-uniform {
            margin-top: -60px;
          }

            .row2.gtr-150.gtr-uniform > * {
              padding-top: 60px;
            }

        .row2.gtr-200 {
          margin-top: -80px;
          margin-left: -80px;
        }

          .row2.gtr-200 > * {
            padding: 80px 0 0 80px;
          }

          .row2.gtr-200.gtr-uniform {
            margin-top: -80px;
          }

            .row2.gtr-200.gtr-uniform > * {
              padding-top: 80px;
            }

    }

    @media screen and (max-width: 1280px) {

      .row2 {
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
        align-items: stretch;
      }

        .row2 > * {
          box-sizing: border-box;
        }

        .row2.gtr-uniform > * > :last-child {
          margin-bottom: 0;
        }

        .row2.aln-left {
          justify-content: flex-start;
        }

        .row2.aln-center {
          justify-content: center;
        }

        .row2.aln-right {
          justify-content: flex-end;
        }

        .row2.aln-top {
          align-items: flex-start;
        }

        .row2.aln-middle {
          align-items: center;
        }

        .row2.aln-bottom {
          align-items: flex-end;
        }

        .row2 > .imp-large {
          order: -1;
        }

        .row2 > .col-1-large {
          width: 8.33333%;
        }

        .row2 > .off-1-large {
          margin-left: 8.33333%;
        }

        .row2 > .col-2-large {
          width: 16.66667%;
        }

        .row2 > .off-2-large {
          margin-left: 16.66667%;
        }

        .row2 > .col-3-large {
          width: 25%;
        }

        .row2 > .off-3-large {
          margin-left: 25%;
        }

        .row2 > .col-4-large {
          width: 33.33333%;
        }

        .row2 > .off-4-large {
          margin-left: 33.33333%;
        }

        .row2 > .col-5-large {
          width: 41.66667%;
        }

        .row2 > .off-5-large {
          margin-left: 41.66667%;
        }

        .row2 > .col-6-large {
          width: 50%;
        }

        .row2 > .off-6-large {
          margin-left: 50%;
        }

        .row2 > .col-7-large {
          width: 58.33333%;
        }

        .row2 > .off-7-large {
          margin-left: 58.33333%;
        }

        .row2 > .col-8-large {
          width: 66.66667%;
        }

        .row2 > .off-8-large {
          margin-left: 66.66667%;
        }

        .row2 > .col-9-large {
          width: 75%;
        }

        .row2 > .off-9-large {
          margin-left: 75%;
        }

        .row2 > .col-10-large {
          width: 83.33333%;
        }

        .row2 > .off-10-large {
          margin-left: 83.33333%;
        }

        .row2 > .col-11-large {
          width: 91.66667%;
        }

        .row2 > .off-11-large {
          margin-left: 91.66667%;
        }

        .row2 > .col-12-large {
          width: 100%;
        }

        .row2 > .off-12-large {
          margin-left: 100%;
        }

        .row2.gtr-0 {
          margin-top: 0px;
          margin-left: 0px;
        }

          .row2.gtr-0 > * {
            padding: 0px 0 0 0px;
          }

          .row2.gtr-0.gtr-uniform {
            margin-top: 0px;
          }

            .row2.gtr-0.gtr-uniform > * {
              padding-top: 0px;
            }

        .row2.gtr-25 {
          margin-top: -6.25px;
          margin-left: -6.25px;
        }

          .row2.gtr-25 > * {
            padding: 6.25px 0 0 6.25px;
          }

          .row2.gtr-25.gtr-uniform {
            margin-top: -6.25px;
          }

            .row2.gtr-25.gtr-uniform > * {
              padding-top: 6.25px;
            }

        .row2.gtr-50 {
          margin-top: -12.5px;
          margin-left: -12.5px;
        }

          .row2.gtr-50 > * {
            padding: 12.5px 0 0 12.5px;
          }

          .row2.gtr-50.gtr-uniform {
            margin-top: -12.5px;
          }

            .row2.gtr-50.gtr-uniform > * {
              padding-top: 12.5px;
            }

        .row2 {
          margin-top: -25px;
          margin-left: -25px;
        }

          .row2 > * {
            padding: 25px 0 0 25px;
          }

          .row2.gtr-uniform {
            margin-top: -25px;
          }

            .row2.gtr-uniform > * {
              padding-top: 25px;
            }

        .row2.gtr-150 {
          margin-top: -37.5px;
          margin-left: -37.5px;
        }

          .row2.gtr-150 > * {
            padding: 37.5px 0 0 37.5px;
          }

          .row2.gtr-150.gtr-uniform {
            margin-top: -37.5px;
          }

            .row2.gtr-150.gtr-uniform > * {
              padding-top: 37.5px;
            }

        .row2.gtr-200 {
          margin-top: -50px;
          margin-left: -50px;
        }

          .row2.gtr-200 > * {
            padding: 50px 0 0 50px;
          }

          .row2.gtr-200.gtr-uniform {
            margin-top: -50px;
          }

            .row2.gtr-200.gtr-uniform > * {
              padding-top: 50px;
            }

    }

    @media screen and (max-width: 980px) {

      .row2 {
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
        align-items: stretch;
      }

        .row2 > * {
          box-sizing: border-box;
        }

        .row2.gtr-uniform > * > :last-child {
          margin-bottom: 0;
        }

        .row2.aln-left {
          justify-content: flex-start;
        }

        .row2.aln-center {
          justify-content: center;
        }

        .row2.aln-right {
          justify-content: flex-end;
        }

        .row2.aln-top {
          align-items: flex-start;
        }

        .row2.aln-middle {
          align-items: center;
        }

        .row2.aln-bottom {
          align-items: flex-end;
        }

        .row2 > .imp-medium {
          order: -1;
        }

        .row2 > .col-1-medium {
          width: 8.33333%;
        }

        .row2 > .off-1-medium {
          margin-left: 8.33333%;
        }

        .row2 > .col-2-medium {
          width: 16.66667%;
        }

        .row2 > .off-2-medium {
          margin-left: 16.66667%;
        }

        .row2 > .col-3-medium {
          width: 25%;
        }

        .row2 > .off-3-medium {
          margin-left: 25%;
        }

        .row2 > .col-4-medium {
          width: 33.33333%;
        }

        .row2 > .off-4-medium {
          margin-left: 33.33333%;
        }

        .row2 > .col-5-medium {
          width: 41.66667%;
        }

        .row2 > .off-5-medium {
          margin-left: 41.66667%;
        }

        .row2 > .col-6-medium {
          width: 50%;
        }

        .row2 > .off-6-medium {
          margin-left: 50%;
        }

        .row2 > .col-7-medium {
          width: 58.33333%;
        }

        .row2 > .off-7-medium {
          margin-left: 58.33333%;
        }

        .row2 > .col-8-medium {
          width: 66.66667%;
        }

        .row2 > .off-8-medium {
          margin-left: 66.66667%;
        }

        .row2 > .col-9-medium {
          width: 75%;
        }

        .row2 > .off-9-medium {
          margin-left: 75%;
        }

        .row2 > .col-10-medium {
          width: 83.33333%;
        }

        .row2 > .off-10-medium {
          margin-left: 83.33333%;
        }

        .row2 > .col-11-medium {
          width: 91.66667%;
        }

        .row2 > .off-11-medium {
          margin-left: 91.66667%;
        }

        .row2 > .col-12-medium {
          width: 100%;
        }

        .row2 > .off-12-medium {
          margin-left: 100%;
        }

        .row2.gtr-0 {
          margin-top: 0px;
          margin-left: 0px;
        }

          .row2.gtr-0 > * {
            padding: 0px 0 0 0px;
          }

          .row2.gtr-0.gtr-uniform {
            margin-top: 0px;
          }

            .row2.gtr-0.gtr-uniform > * {
              padding-top: 0px;
            }

        .row2.gtr-25 {
          margin-top: -6.25px;
          margin-left: -6.25px;
        }

          .row2.gtr-25 > * {
            padding: 6.25px 0 0 6.25px;
          }

          .row2.gtr-25.gtr-uniform {
            margin-top: -6.25px;
          }

            .row2.gtr-25.gtr-uniform > * {
              padding-top: 6.25px;
            }

        .row2.gtr-50 {
          margin-top: -12.5px;
          margin-left: -12.5px;
        }

          .row2.gtr-50 > * {
            padding: 12.5px 0 0 12.5px;
          }

          .row2.gtr-50.gtr-uniform {
            margin-top: -12.5px;
          }

            .row2.gtr-50.gtr-uniform > * {
              padding-top: 12.5px;
            }

        .row2 {
          margin-top: -25px;
          margin-left: -25px;
        }

          .row2 > * {
            padding: 25px 0 0 25px;
          }

          .row2.gtr-uniform {
            margin-top: -25px;
          }

            .row2.gtr-uniform > * {
              padding-top: 25px;
            }

        .row2.gtr-150 {
          margin-top: -37.5px;
          margin-left: -37.5px;
        }

          .row2.gtr-150 > * {
            padding: 37.5px 0 0 37.5px;
          }

          .row2.gtr-150.gtr-uniform {
            margin-top: -37.5px;
          }

            .row2.gtr-150.gtr-uniform > * {
              padding-top: 37.5px;
            }

        .row2.gtr-200 {
          margin-top: -50px;
          margin-left: -50px;
        }

          .row2.gtr-200 > * {
            padding: 50px 0 0 50px;
          }

          .row2.gtr-200.gtr-uniform {
            margin-top: -50px;
          }

            .row2.gtr-200.gtr-uniform > * {
              padding-top: 50px;
            }

    }

    @media screen and (max-width: 736px) {

      .row2 {
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
        align-items: stretch;
      }

        .row2 > * {
          box-sizing: border-box;
        }

        .row2.gtr-uniform > * > :last-child {
          margin-bottom: 0;
        }

        .row2.aln-left {
          justify-content: flex-start;
        }

        .row2.aln-center {
          justify-content: center;
        }

        .row2.aln-right {
          justify-content: flex-end;
        }

        .row2.aln-top {
          align-items: flex-start;
        }

        .row2.aln-middle {
          align-items: center;
        }

        .row2.aln-bottom {
          align-items: flex-end;
        }

        .row2 > .imp-small {
          order: -1;
        }

        .row2 > .col-1-small {
          width: 8.33333%;
        }

        .row2 > .off-1-small {
          margin-left: 8.33333%;
        }

        .row2 > .col-2-small {
          width: 16.66667%;
        }

        .row2 > .off-2-small {
          margin-left: 16.66667%;
        }

        .row2 > .col-3-small {
          width: 25%;
        }

        .row2 > .off-3-small {
          margin-left: 25%;
        }

        .row2 > .col-4-small {
          width: 33.33333%;
        }

        .row2 > .off-4-small {
          margin-left: 33.33333%;
        }

        .row2 > .col-5-small {
          width: 41.66667%;
        }

        .row2 > .off-5-small {
          margin-left: 41.66667%;
        }

        .row2 > .col-6-small {
          width: 50%;
        }

        .row2 > .off-6-small {
          margin-left: 50%;
        }

        .row2 > .col-7-small {
          width: 58.33333%;
        }

        .row2 > .off-7-small {
          margin-left: 58.33333%;
        }

        .row2 > .col-8-small {
          width: 66.66667%;
        }

        .row2 > .off-8-small {
          margin-left: 66.66667%;
        }

        .row2 > .col-9-small {
          width: 75%;
        }

        .row2 > .off-9-small {
          margin-left: 75%;
        }

        .row2 > .col-10-small {
          width: 83.33333%;
        }

        .row2 > .off-10-small {
          margin-left: 83.33333%;
        }

        .row2 > .col-11-small {
          width: 91.66667%;
        }

        .row2 > .off-11-small {
          margin-left: 91.66667%;
        }

        .row2 > .col-12-small {
          width: 100%;
        }

        .row2 > .off-12-small {
          margin-left: 100%;
        }

        .row2.gtr-0 {
          margin-top: 0px;
          margin-left: 0px;
        }

          .row2.gtr-0 > * {
            padding: 0px 0 0 0px;
          }

          .row2.gtr-0.gtr-uniform {
            margin-top: 0px;
          }

            .row2.gtr-0.gtr-uniform > * {
              padding-top: 0px;
            }

        .row2.gtr-25 {
          margin-top: -5px;
          margin-left: -5px;
        }

          .row2.gtr-25 > * {
            padding: 5px 0 0 5px;
          }

          .row2.gtr-25.gtr-uniform {
            margin-top: -5px;
          }

            .row2.gtr-25.gtr-uniform > * {
              padding-top: 5px;
            }

        .row2.gtr-50 {
          margin-top: -10px;
          margin-left: -10px;
        }

          .row2.gtr-50 > * {
            padding: 10px 0 0 10px;
          }

          .row2.gtr-50.gtr-uniform {
            margin-top: -10px;
          }

            .row2.gtr-50.gtr-uniform > * {
              padding-top: 10px;
            }

        .row2 {
          margin-top: -20px;
          margin-left: -20px;
        }

          .row2 > * {
            padding: 20px 0 0 20px;
          }

          .row2.gtr-uniform {
            margin-top: -20px;
          }

            .row2.gtr-uniform > * {
              padding-top: 20px;
            }

        .row2.gtr-150 {
          margin-top: -30px;
          margin-left: -30px;
        }

          .row2.gtr-150 > * {
            padding: 30px 0 0 30px;
          }

          .row2.gtr-150.gtr-uniform {
            margin-top: -30px;
          }

            .row2.gtr-150.gtr-uniform > * {
              padding-top: 30px;
            }

        .row2.gtr-200 {
          margin-top: -40px;
          margin-left: -40px;
        }

          .row2.gtr-200 > * {
            padding: 40px 0 0 40px;
          }

          .row2.gtr-200.gtr-uniform {
            margin-top: -40px;
          }

            .row2.gtr-200.gtr-uniform > * {
              padding-top: 40px;
            }

    }

    /* Tiles */

  .tiles {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    postiion: relative;
    margin: -1.5em 0 0 -1.5em;
    border-radius: 4px;
  }

    .tiles p {
      font-size: 16px;
    }

    .tiles article {
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
      -moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease;
      -webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease;
      -ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease;
      transition: transform 0.5s ease, opacity 0.5s ease;
      position: relative;
      width: calc(33.33333% - 1.5em);
      margin: 1.5em 0 0 1.5em;
      aspect-ratio: 1/1; /* Hace que el tile sea cuadrado */
      overflow: hidden; /* Asegura que todo el contenido se mantenga dentro */
      z-index: 1;
      border-radius: 4px;
    }

      .tiles article > .image {
        -moz-transition: -moz-transform 0.5s ease;
        -webkit-transition: -webkit-transform 0.5s ease;
        -ms-transition: -ms-transform 0.5s ease;
        transition: transform 0.5s ease;
        position: relative;
        display: block;
        width: 100%;
        height: 100%; /* Ocupa todo el espacio del article */
        border-radius: 4px ;
        
      } 

        .tiles article > .image img {
          display: block;
          width: 100%;
          height: 100%;
          object-fit: cover; /* Asegura que la imagen cubra el espacio sin distorsión */
        }

        .tiles article > .image:before {
          pointer-events: none;
          -moz-transition: background-color 0.5s ease, opacity 0.5s ease;
          -webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
          -ms-transition: background-color 0.5s ease, opacity 0.5s ease;
          transition: background-color 0.5s ease, opacity 0.5s ease;
          content: '';
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          opacity: 1.0;
          z-index: 1;
          opacity: 0.8;
        }
       

      .tiles article > a {
        display: -moz-flex;
        display: -webkit-flex;
        display: -ms-flex;
        display: flex;
        -moz-flex-direction: column;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -moz-align-items: center;
        -webkit-align-items: center;
        -ms-align-items: center;
        align-items: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
        -moz-transition: background-color 0.5s ease, -moz-transform 0.5s ease;
        -webkit-transition: background-color 0.5s ease, -webkit-transform 0.5s ease;
        -ms-transition: background-color 0.5s ease, -ms-transform 0.5s ease;
        transition: background-color 0.5s ease, transform 0.5s ease;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        padding: 1em;
        border-radius: 4px;
        border-bottom: 0;
        color: #ffffff;
        text-align: center;
        text-decoration: none;
        z-index: 3;
      }

        .tiles article > a > :last-child {
          margin: 0;
        }

        .tiles article > a:hover {
          color: #ffffff !important;
        }

        .tiles article > a h2 {
          margin: 0;
        }

        .tiles article > a .content {
          -moz-transition: max-height 0.5s ease, opacity 0.5s ease;
          -webkit-transition: max-height 0.5s ease, opacity 0.5s ease;
          -ms-transition: max-height 0.5s ease, opacity 0.5s ease;
          transition: max-height 0.5s ease, opacity 0.5s ease;
          width: 100%;
          max-height: 0;
          line-height: 1.5;
          margin-top: 0.35em;
          opacity: 0;
        }

          .tiles article > a .content > :last-child {
            margin-bottom: 0;
          }

      .tiles article.style1 > .image:before {
        background-color: #00c8ff;
      }

      .tiles article.style2 > .image:before {
        background-color: #4190e5;
      }

      .tiles article.style3 > .image:before {
        background-color: #0049ab;

      }

      .tiles article.style4 > .image:before {
        background-color: #4017a4;
      }

      .tiles article.style5 > .image:before {
        background-color: #d52abc;
      }

      .tiles article.style6 > .image:before {
        background-color: #8499e7;
      }

      .tiles article:hover {
            transform: scale(1.03);
            z-index: 2; /* Eleva el tile sobre los demás */
        }

      body:not(.is-touch) .tiles article:hover > .image {
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
      }

        body:not(.is-touch) .tiles article:hover > .image:before {
          background-color: #333333;
          opacity: 0.35;
        }

        body:not(.is-touch) .tiles article:hover > .image:after {
          opacity: 0;
        }

      body:not(.is-touch) .tiles article:hover .content {
        max-height: 15em;
        opacity: 1;
      }

    * + .tiles {
      margin-top: 2em;
    }

    body.is-preload .tiles article {
      -moz-transform: scale(0.9);
      -webkit-transform: scale(0.9);
      -ms-transform: scale(0.9);
      transform: scale(0.9);
      opacity: 0;
    }

    body.is-touch .tiles article .content {
      max-height: 15em;
      opacity: 1;
    }

    @media screen and (max-width: 1280px) {

      .tiles {
        margin: -1.25em 0 0 -1.25em;
      }

        .tiles article {
          width: calc(33.33333% - 1.25em);
          margin: 1.25em 0 0 1.25em;
        }

    }

    @media screen and (max-width: 980px) {

      .tiles {
        margin: -2.5em 0 0 -2.5em;
      }

        .tiles article {
          width: calc(50% - 2.5em);
          margin: 2.5em 0 0 2.5em;
        }

    }

    @media screen and (max-width: 736px) {

      .tiles {
        margin: -1.25em 0 0 -1.25em;
      }

        .tiles article {
          width: calc(50% - 1.25em);
          margin: 1.25em 0 0 1.25em;
        }

          .tiles article:hover > .image {
            -moz-transform: scale(1.0);
            -webkit-transform: scale(1.0);
            -ms-transform: scale(1.0);
            transform: scale(1.0);
          }

    }

    @media screen and (max-width: 480px) {

      .tiles {
        margin: 0;
      }

        .tiles article {
          width: 100%;
          margin: 1.25em 0 0 0;
        }

    }

     h4 {
            display: flex;
            flex-direction: row;
            color: #0049ab ;
             font-size: clamp(16px, 4vw, 25px); /* Mínimo 16px, ajuste fluido (4vw), máximo 25px */ 
        }

        .icono-servicios {
          display: inline-block;
          width: 40px;
          height: 40px;
          background-image: url('images/logo_izquierda.png');
          background-size: contain;
          background-repeat: no-repeat;
          margin-right: 15px;
          flex-shrink: 0; /* Evita que se reduzca */
        }

        .icono-servicios2 {
          display: inline-block;
          width: 40px;
          height: 40px;
          background-image: url('images/logo_derecha.png');
          background-size: contain;
          background-repeat: no-repeat;
          margin-left: 15px;
          flex-shrink: 0; /* Evita que se reduzca */
        }

        .icono-servicios3 {
          display: inline-block;
          width: 50px;
          height: 50px;
          background-image: url('images/logo_izquierda.png');
          background-size: contain;
          background-repeat: no-repeat;
          margin-right: 2px;
          margin-left: -25px;
          flex-shrink: 0; /* Evita que se reduzca */
        }

        @media (max-width: 680px) {
                .icono-servicios3 {
                
                width: 20px;
                height: 20px;
               
                margin-right: 2px;
                margin-left: -25px;
                flex-shrink: 0; /* Evita que se reduzca */
              }
            }
        
        h4:before,
        h4:after {
            content: "";
            flex: 1 1;
            border-bottom: 6px solid #00c8ff;
            margin: 10px; 
            margin-bottom: 1em;
        }

         .container3 {
            max-width: 1200px;
            margin: 0 auto;
            padding: 40px 0px;
        }
        
        /* Estilos para las secciones */
        .section-container3 {
            display: flex;
            flex-wrap: wrap;
            gap: 30px;
            justify-content: center;
        }
        
        .section {
            background-color: white;
            border-radius: 12px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
            padding: 0;
            width: 100%;
            max-width: 350px;
            overflow: hidden;
            transition: transform 0.4s ease, box-shadow 0.4s ease;
            position: relative;
        }
        
        .section:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
        }
        
        .section-image {
            height: 200px;
            width: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }
        
        .section:hover .section-image {
            transform: scale(1.05);
        }
        
        .section-content {
            padding: 25px;
        }
        
        .section h2 {
            color: #0049ab;
            font-size: 1.2rem;
            margin-bottom: 15px;
            position: relative;
            padding-bottom: 10px;
            text-align: center;
            font-family: 'Gotham';
            font-weight: 500;
        }

         .letra-destacada6 {
          font-size: 130%;
          font-family: "Gotham", sans-serif;
          color: #0049ab;
          font-weight: 500;
          position: bottom ;
          
        }

        .letra-destacada7 {
          font-size: 130%;
          font-family: "Gotham", sans-serif;
          color: #0049ab;
          font-weight: 500;
          position: bottom ;
          
        }
        
        .section h2::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 50px;
            height: 3px;
            background: linear-gradient(90deg, #3498db, #9b59b6);

        }
        
        .section p {
            color: #666;
            font-size: 1rem;
            margin-top: 10px;
            text-align: center;
            color: #0049ab;
            font-weight: 700;
        }
        
        /* Efecto overlay para imágenes */
        .image-container3 {
            position: relative;
            overflow: hidden;
        }
        
        .image-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.3);
            opacity: 0;
            transition: opacity 0.3s ease;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .section:hover .image-overlay {
            opacity: 1;
        }
        
        .view-button {
            color: white;
            border: 2px solid white;
            padding: 8px 20px;
            border-radius: 30px;
            font-weight: bold;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 1px;
            cursor: pointer;
            transition: all 0.3s ease;
            background: rgba(255, 255, 255, 0.2);
        }
        
        .view-button:hover {
            background: rgba(255, 255, 255, 0.4);
        }
        
        /* Responsive */
        @media (max-width: 768px) {
            .section {
                max-width: 200%;
            }
            
            .section-container3 {
                gap: 20px;
            }
        }

        .diagnostico-container-externo{
            background-image: url('images/patron_container.png');
            background-repeat: repeat;
            background-size: 100px 100px;
            color: white;
            width: 100%;
            height: 30vh;
            min-height: 250px;
            display: flex;
            align-items: center;
            padding: 0 5%;
            box-sizing: border-box;
            border-radius: 5px;
            box-shadow: 70%;
        }

        .diagnostico-container {
            background-color: #0049ab;
            color: white;
            width: 200%;
            height: 20vh;
            min-height: 190px;
            display: flex;
            border-radius: 10px;
            align-items: center;
            padding: 0 6%;
            box-shadow: 70%;
            border: 6px solid #FFFFFF;
            border-style: dashed ;
        }

        .diagnostico-container h1{
          color: #ffffff;
          font-family: "Gotham", sans-serif;
          font-weight: 500;
          line-height: 1.5;
          font-size: 32px;
          margin-bottom: -1em;
        }

        .diagnostico-container p{
          color: #ffffff;
          font-size: 20px;
          font-weight: 300;
          margin-top: 0.2em;
        }
        
        .text-content {
          margin-top: 3em;
            flex: 1;
            padding-right: 30px;
        }

        .text-content h1 {
           /* Propiedades para manejo de texto largo */
              word-wrap: break-word;
              overflow-wrap: break-word;
              hyphens: auto; /* Para separación silábica */
        }

         .text-content p{
           font-size: 30px;
        }

         @media (max-width: 480px) {
          .text-content h1 {
           font-size: 20px;
           margin-left: -1em;
          }
          .text-content p{
           font-size: 17px;
        }
        }
        
        .button-group {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 12px;
            min-width: 200px;
        }

        /* Botón principal - Versión mejorada */
        .btn-primary {
          background: #00c9ff;
          color: white;
          text-align: center; /* Cambiado a center para mejor ajuste */
          border-radius: 10px;
          cursor: pointer;
          transition: all 0.3s ease;
          text-transform: uppercase;
          letter-spacing: 1px;
          font-weight: 500;
          min-height: 60px;
          width: 100%;
          max-width: 280px;
          box-sizing: border-box;
          padding: 10px 15px; /* Padding reducido */
          display: flex;
          align-items: center;
          justify-content: center; /* Centrado horizontal */
          margin: 0 auto;
          white-space: normal; /* Permite múltiples líneas */
          word-break: break-word; /* Rompe palabras largas */
          transform: scale(1); /* Estado inicial */
        }

        .btn-primary p {
          margin: 0;
          font-family: "Gotham", sans-serif;
          font-size: clamp(14px, 2vw, 24px); /* Tamaño más responsive */
          font-weight: 500;
          line-height: 1.3;
          width: 100%;
          text-align: center; /* Asegura centrado */
        }

        .btn-primary:hover {
          transform: scale(1.05); /* Aumenta tamaño un 5% */
          background-color: #00b4e6; /* Color ligeramente más oscuro */
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para efecto de elevación */
        }

        .btn-primary2 {
          background: #00c9ff;
          color: white;
          text-align: center; /* Cambiado a center para mejor ajuste */
          border-radius: 10px;
          cursor: pointer;
          transition: all 0.3s ease;
          text-transform: uppercase;
          letter-spacing: 1px;
          font-weight: 500;
          min-height: 60px;
          width: 100%;
          max-width: 280px;
          box-sizing: border-box;
          padding: 10px 15px; /* Padding reducido */
          display: flex;
          align-items: center;
          justify-content: center; /* Centrado horizontal */
          margin-right: 1em;
          white-space: normal; /* Permite múltiples líneas */
          word-break: break-word; /* Rompe palabras largas */
          transform: scale(1); /* Estado inicial */
        }

        .btn-primary2 p {
          margin: 0;
          font-family: "Gotham", sans-serif;
          font-size: clamp(14px, 2vw, 24px); /* Tamaño más responsive */
          font-weight: 500;
          line-height: 1.3;
          width: 100%;
          text-align: center; /* Asegura centrado */
        }

        .btn-primary2:hover {
          transform: scale(1.05); /* Aumenta tamaño un 5% */
          background-color: #00b4e6; /* Color ligeramente más oscuro */
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para efecto de elevación */
        }
        
        /* Botón secundario alineado por la izquierda */
        .btn-secondary {
            background: #4190e5;
            color: white;
            padding: 8px 20px 8px 30px; /* Mismo padding izquierdo que el botón principal */
            font-size: 12.8px;
            border-radius: 10px;
            cursor: pointer;
            font-weight: bold;
            transition: all 0.3s;
            text-transform: uppercase;
            letter-spacing: 0.8px;
            height: 42px;
            width: 184px;
            box-sizing: border-box;
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-left: 0; /* Eliminado el margen izquierdo */
            transform: scale(1); /* Estado inicial */
        }

         .btn-secondary p {
          margin-top: 2em;
            font-family: "Gotham";
            font-size: 20px;
            font-weight: 500;
        }

        .btn-primary p,
        .btn-secondary p {
          margin: 0;
          font-family: "Gotham", sans-serif;
          font-weight: 500;
          text-align: center;
          transition: all 0.3s ease; /* Transición también para el texto */
        }

        .btn-secondary:hover {
          transform: scale(1.05); /* Aumenta tamaño un 5% */
          background-color: #3a82d1; /* Color ligeramente más oscuro */
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para efecto de elevación */
        }
        
        .btn-primary:hover,
        .btn-secondary:hover {
            background-color: rgba(255, 255, 255, 0.1);
        }

        @media (hover: none) {
          .btn-primary:active,
          .btn-secondary:active {

            transform: scale(1.03); /* Efecto más sutil en touch */
          }
        }
        
        /* Ícono de interrogación */
        .info-icon {
            width: 16px;
            height: 16px;
            background-color: white;
            color: #1e88e5;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            font-size: 11.2px;
            line-height: 16px;
        }

        @media (max-width: 1500px) {
          .btn-primary {
            max-width: 240px;
            padding: 8px 12px;
          }
          
          .btn-primary p {
            font-size: clamp(12px, 2vw, 20px);
          }
        }

        @media (max-width: 768px) {
          .btn-primary {
            min-height: 50px;
            max-width: 200px;
          }
          
          .btn-primary p {
            font-size: clamp(12px, 3vw, 18px);
            line-height: 1.2;
          }
        }

        @media (max-width: 480px) {
          .btn-primary {
            width: 100%;
            max-width: none;
            padding: 8px 10px;
          }
          
          .btn-primary p {
            font-size: 14px;
          }
        }

         @media (max-width: 1500px) {
          .btn-secondary {
            max-width: 240px;
            padding: 8px 12px;
          }
          
          .btn-secondary p {
            font-size: clamp(12px, 2vw, 20px);
          }
        }

        @media (max-width: 768px) {
          .btn-secondary {
            min-height: 50px;
            max-width: 200px;
          }
          
          .btn-secondary p {
            font-size: clamp(12px, 3vw, 18px);
            line-height: 1.2;
          }
        }

        @media (max-width: 480px) {
          .btn-secondary {
            width: 100%;
            max-width: none;
            padding: 8px 10px;
          }
          
          .btn-secondary p {
            font-size: 14px;
          }
        }

        @media (max-width: 1500px) {
          .diagnostico-container {
            flex-direction: column;
            height: auto;
            padding: 30px 20px;
            width: 100%; /* Asegura que ocupe todo el ancho disponible */
            box-sizing: border-box; /* Incluye padding en el cálculo del ancho */
            overflow: hidden; /* Previene que los hijos se salgan */
          }
          
          .text-content {
            padding-right: 0;
            margin-bottom: 20px;
            text-align: center;
            width: 100%; /* Ocupa todo el ancho */
          }
          
          .button-group {
            display: inline-flex; /* Cambio clave: mantiene los botones unidos */
            flex-direction: row; /* Cambia a fila en pantallas medianas/grandes */
            align-items: center;
            justify-content: flex-start; /* Alineación a la izquierda */
            flex-wrap: nowrap; /* Evita que se separen */
            gap: 8px; /* Espacio más pequeño entre botones */
            width: auto;
            min-width: unset;
            margin: 0 auto; /* Centrado horizontal */
          }
          
          .btn-primary,
          .btn-secondary {
            width: auto; /* Ancho según contenido */
            min-width: 120px; /* Ancho mínimo para mantener legibilidad */
            padding: 10px 25px;
            box-sizing: border-box;
            white-space: nowrap; /* Evita que el texto se divida en varias líneas */
          }

          @media (max-width: 768px) {
            .button-group {
              flex-direction: row;
              gap: 6px;
            }
            
            .btn-primary {
              max-width: 200px;
            }
            
            .btn-secondary {
              width: auto;
              padding: 8px 15px;

            }
          }
          
          /* Opcional: para pantallas muy pequeñas */
          @media (max-width: 480px) {
            .button-group {
              flex-direction: column; /* Apila botones verticalmente */
              align-items: center;
            width: 100%;
            gap: 10px;
            }
            
            .btn-primary,
            .btn-secondary {
              width: 100%;
               max-width: none;
               justify-content: center;
            }
          }
        }

        @media (max-width: 1500px) {
            .diagnostico-container-externo {
                flex-direction: column;
                height: auto;
                padding: 30px 20px;
            }
            
            .text-content {
                padding-right: 0;
                margin-bottom: 20px;
                text-align: center;
            }
            
            .button-group {
                
                align-items: center;
            }
            
            .btn-primary,
            .btn-secondary {
                width: 100%;
                max-width: 200px;
                padding: 10px 30px;
            }
            
            .btn-secondary {
                padding: 8px 20px 8px 30px;
            }
        }

        .diagnostico-container2 {
            background-image: url('images/patron_container.jpg');
            background-repeat: repeat;
            background-size: 100px 100px;
            background-position: 0 0;
            width: 100%;
            height: 65vh;
            min-height: 190px;
            display: flex;
            border-radius: 10px;
            align-items: center;
            padding: 0 6%;
            box-shadow: 0 4px 8px rgba(0,0,0,0.2); /* Corregido el box-shadow */
            image-rendering: pixelated; /* Para patrones pixel-perfect */
        }

        .diagnostico-container3 {
            color: #FFFFFF;
            background-size: 100px 100px;
            background-position: 0 0;
            width: 100%;
            height: 65vh;
            min-height: 190px;
            display: flex;
            border-radius: 10px;
            align-items: center;
            padding: 0 6%;
            margin-bottom: 30px;
            image-rendering: pixelated; /* Para patrones pixel-perfect */
        }

        .cuadrado-container {
              background-color: #FFFFFF;
              color: #333; /* Cambiado para mejor contraste con fondo blanco */
              width: min(55vh, 90%); /* Más responsive */
              aspect-ratio: 1/1; /* Mantiene relación cuadrada */
              display: flex;
              flex-direction: column;
              justify-content: flex-start;
              align-items: flex-start;
              padding: 2em;
              border-radius: 10px;
              box-shadow: 0 4px 8px rgba(0,0,0,0.1);
              gap: 1em;
              margin: 1em auto; /* Centrado horizontal */

                /* Efecto zoom */
              transition: transform 0.3s ease, box-shadow 0.3s ease; /* Transición suave */
              transform-origin: center; /* Punto de origen del zoom */
        }

         .cuadrado-container:hover {
          transform: scale(1.05); /* Zoom del 5% */
          box-shadow: 0 8px 16px rgba(0,0,0,0.2); /* Sombra más pronunciada */
          z-index: 10; /* Asegura que el zoom se vea por encima de otros elementos */
          opacity: 0.95;

        }

        /* Versión para dispositivos táctiles */
        @media (hover: none) {
          .cuadrado-container:active {
            transform: scale(1.03);
          }
        }

        .cuadrado-container h3{
          color: #0049ab;
          text-align: center;
          font-family: "Gotham", sans-serif;
          font-weight: 500;
          line-height: 1.5;
          font-size: 32px;
           margin: 0; /* Elimina márgenes por defecto */
            padding: 0;
            width: 100%;
             /* Propiedades para manejo de texto largo */
              word-wrap: break-word;
              overflow-wrap: break-word;
              hyphens: auto; /* Para separación silábica */
        }

        @media (max-width: 480px) {
          .cuadrado-container h3{
           font-size: 20px;
        }
          .cuadrado-container p{
           font-size: 15px;
        }
        }
        

        .cuadrado-container p{
           color: inherit; /* Color añadido aquí para todos los párrafos */
           font-family: "Gotham"; /* Añadido para consistencia */
           margin: 0; /* Elimina márgenes por defecto */
            padding: 0;
            width: 100%;
            text-align: center;
            
        }

        .cuadrado-container3 {
              background-image: url('images/patron_container.png');
              background-repeat: repeat;
              background-size: 100px 100px;
              color: white;
              width: min(55vh, 90%); /* Más responsive */
              aspect-ratio: 1/1; /* Mantiene relación cuadrada */
              display: flex;
              flex-direction: column;
              justify-content: flex-start;
              align-items: flex-start;
              padding: 2em;
              border-radius: 10px;
              box-shadow: 0 4px 8px rgba(0,0,0,0.1);
              gap: 1em;
              margin: 1em auto; /* Centrado horizontal */

                /* Efecto zoom */
              transition: transform 0.3s ease, box-shadow 0.3s ease; /* Transición suave */
              transform-origin: center; /* Punto de origen del zoom */
        }

         .cuadrado-container3:hover {
          transform: scale(1.05); /* Zoom del 5% */
          box-shadow: 0 8px 16px rgba(0,0,0,0.2); /* Sombra más pronunciada */
          z-index: 10; /* Asegura que el zoom se vea por encima de otros elementos */
          opacity: 0.95;

        }

        /* Versión para dispositivos táctiles */
        @media (hover: none) {
          .cuadrado-container3:active {
            transform: scale(1.03);
          }
        }

        .cuadrado-container3 h3{
          color: #FFFFFF;
          text-align: center;
          font-family: "Gotham", sans-serif;
          font-weight: 500;
          line-height: 1.5;
          font-size: 32px;
           margin: 0; /* Elimina márgenes por defecto */
            padding: 0;
            width: 100%;
             /* Propiedades para manejo de texto largo */
              word-wrap: break-word;
              overflow-wrap: break-word;
              hyphens: auto; /* Para separación silábica */
        }

         @media (max-width: 480px) {
          .cuadrado-container3 h3{
           font-size: 20px;
        }
          
        }
        
        .cuadrado-container3 p{

           color: #FFFFFF; /* Color añadido aquí para todos los párrafos */
           font-family: "Gotham"; /* Añadido para consistencia */
           margin: 0; /* Elimina márgenes por defecto */
            padding: 0;
            width: 100%;
            text-align: center;
            
        }

        .color-fuente{
          color: #0049ab;
          font-size: 20px;
          font-weight: 300;
          margin-top: 0.2em;
        }

        .texto-destacado-abajo{
          font-family: "Gotham", sans-serif;
          font-weight: 700;
          color: #0049ab;
          font-size: 40px;
        }

        .fuenteItalic2{
         
         font-style: italic;
          
         } 

         .fuentebold2{
          font-weight: 700;
          
         } 

        .diagnostico-container2 h1{
          color: #ffffff;
          font-family: "Gotham", sans-serif;
          font-weight: 500;
          line-height: 1.5;
          font-size: 32px;
        }

        .diagnostico-container2 p{
          color: #0049ab;
          font-size: 20px;
          font-weight: 300;
          margin-top: 0.2em;
        }

         .diagnostico-container3 h1{
          color: #ffffff;
          font-family: "Gotham", sans-serif;
          font-weight: 500;
          line-height: 1.5;
          font-size: 32px;
        }

        .diagnostico-container3 p{
          
          font-size: 20px;
          font-weight: 300;
          margin-top: 0.2em;
        }
        
        .text-content2 {
          margin-top: 3em;
            flex: 1;
            padding-right: 30px;
        }
        
          .cuadrado-text{
            padding-top: 2em;
          }


         .text-content2 p{
           font-size: 30px;
        }

        .text-content3 {
          
            flex: 1;
            padding-right: 30px;
        }

        .text-content3 h2 {
           padding-right: 30px;
           color: #0049ab;
           font-size: 20px;
        }

         .text-content3 p{
         padding-left: 1px; /* Sangría en todo el lado izquierdo */
           font-size: 15px;
        }

        /* Media query para pantallas medianas (tablets, 768px - 992px) */
@media (max-width: 992px) {
    .text-content3 h2 {
        font-size: 20px; /* Reducción para tablets */
    }
    
    .text-content3 p {
        font-size: 14px; /* Reducción para tablets */
    }
}

/* Media query para pantallas pequeñas (móviles, menos de 768px) */
@media (max-width: 768px) {
    .text-content3 h2 {
        font-size: 20px; /* Reducción para móviles */
        padding-right: 15px; /* También puedes ajustar el padding */
    }
    
    .text-content3 p {
        font-size: 13px; /* Reducción para móviles */
    }
}

/* Opcional: para pantallas muy pequeñas (menos de 480px) */
@media (max-width: 480px) {
    .text-content3 h2 {
        font-size: 20px;
    }
    
    .text-content3 p {
        font-size: 12px;
    }
}

        @media (max-width: 1500px) {
            .diagnostico-container2 {
                flex-direction: column;
                height: auto;
                padding: 30px 20px;
                overflow: hidden; /* Previene que el contenido se salga */
                width: 100%;
                box-sizing: border-box; /* Incluye padding en el cálculo del ancho */
            }

             .diagnostico-container3 {
                flex-direction: column;
                height: auto;
                padding: 30px 20px;
                overflow: hidden; /* Previene que el contenido se salga */
                width: 100%;
                box-sizing: border-box; /* Incluye padding en el cálculo del ancho */
                margin-bottom: 10px;
            }
            
            .text-content2 {
               padding: 0 15px; /* Padding lateral reducido */
              margin: 0 auto 30px auto; /* Centrado con margen inferior */
              text-align: center;
              width: 100%; /* Ocupa todo el ancho disponible */
              max-width: 100%; /* Evita desbordamiento */
              box-sizing: border-box;
              
              /* Propiedades para manejo de texto largo */
              word-wrap: break-word;
              overflow-wrap: break-word;
              hyphens: auto; /* Para separación silábica */

            }

            .text-content2 h1 {
              max-width: 100%; /* Asegura que no excedan el contenedor */
              word-break: break-word; /* Rompe palabras muy largas */
            }

            .text-content3 {
               padding: 0 15px; /* Padding lateral reducido */
              margin: 0 auto 30px auto; /* Centrado con margen inferior */
              text-align: center;
              width: 100%; /* Ocupa todo el ancho disponible */
              max-width: 100%; /* Evita desbordamiento */
              box-sizing: border-box;
              
              /* Propiedades para manejo de texto largo */
              word-wrap: break-word;
              overflow-wrap: break-word;
              hyphens: auto; /* Para separación silábica */

            }

            .text-content3 h1 {
              max-width: 100%; /* Asegura que no excedan el contenedor */
              word-break: break-word; /* Rompe palabras muy largas */
            }
            
        }

        .aumento-fuente{
                font-size: 62px;
            }

            @media (max-width: 680px) {
                 .aumento-fuente{
                font-size: 30px;
            }
            }


        .whatsapp-float {
            position: fixed;
            bottom: 30px;
            right: 30px;
            z-index: 1000;
          }

          .whatsapp-float a {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 60px;
            height: 60px;
            background-color: #25D366; /* Color oficial de WhatsApp */
            border-radius: 50%;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
            transition: all 0.3s ease;
            animation: pulse 2s infinite;
          }

          .whatsapp-float a:hover {
            transform: scale(1.1) translateY(-5px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
            background-color: #128C7E; /* Color hover */
          }

          .whatsapp-float img {
            width: 40px;
            height: 40px;
            filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
          }

          /* Animación de pulso */
          @keyframes pulse {
            0% {
              box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
            }
            70% {
              box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
            }
            100% {
              box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
            }
          }

          /* Versión responsive */
          @media (max-width: 768px) {
            .whatsapp-float {
              bottom: 20px;
              right: 20px;
            }
            
            .whatsapp-float a {
              width: 50px;
              height: 50px;
            }
            
            .whatsapp-float img {
              width: 30px;
              height: 30px;
            }
          }

          .whatsapp-float i {
            font-size: 30px;
            color: white;
            line-height: 60px;
          }
        
        .profiles-container {
            display: flex;
            justify-content: center;
            gap: 30px;
            max-width: 1100px;
            margin: 0 auto;
            flex-wrap: nowrap;
            overflow-x: auto;
            padding: 20px;
        }
        
        .profile-card {
            background-color: white;
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            width: 220px;
            padding: 25px;
            text-align: center;
            flex-shrink: 0;
        }
        
        .profile-img {
            width: 180px;
            height: 180px;
            border-radius: 50%;
            object-fit: cover;
            border: 8px solid #00c8ff;
            margin: 0 auto 15px;
            display: block;
        }
        
        .name {
            font-size: 20px;
            font-family: "Gotham", sans-serif ;
            font-weight: 500;
            margin-bottom: 5px;
            color: #0049ab;
        }
        
        .title {
             font-family: "Gotham", sans-serif ;
            font-size: 16px;
            color: #0049ab;
            margin-bottom: 15px;
            font-weight: 300;
        }
        
        .description {
             font-family: "Gotham", sans-serif ;
            font-size: 15px;
            color: #0049ab;
            line-height: 1.5;
            margin-bottom: 15px;
            text-align: left;
             font-style: italic;
        }
        
        .highlight {
            font-weight: bold;
            color: #0049ab;
        }

        /* Estilos para scroll horizontal en dispositivos pequeños */
        @media (max-width: 1000px) {
            .profiles-container {
                justify-content: flex-start;
                padding-bottom: 20px;
            }
        }