.boton-imagen img {
    display: block;
    width: 100px; /* Ancho de la imagen */
    height: auto;
}

.boton-imagen:hover {
    opacity: 0.8; /* Cambia la opacidad cuando se pasa el ratón por encima */
}

.pp{
    background-color:#ffffff  ;
}
.container-fluid{
    background-color: #033d5e   ;
}
.navbar-nav .nav-link {
    color: white !important;
    font-size: 17px;
    font-weight: 600; /* Cambia el color del texto a blanco */
}
.nav-link:hover{

    opacity: 0.2;
}

.card-img-top{
    background-color:white ;
}

.card-body{
    background-color:#f8f6f6   ;
}
.btn btn-outline-light{
    justify-content: center;
}


.footer {
    background-color: #033d5e;
padding: 10px;
    color: #ffffff;
    font-size: 17px;
    font-weight: 600;
}

.card-text{
    font-size: 22px;
    justify-content: center;
  
   
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
        Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif,
        Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
      ;
      font-weight: 900;
}
.btn-17,
    .btn-17 *,
    .btn-17 :after,
    .btn-17 :before,
    .btn-17:after,
    .btn-17:before {
      border: 0 solid;
      box-sizing: border-box;
    }

    .btn-17 {
      -webkit-tap-highlight-color: transparent;
      -webkit-appearance: button;
      background-color: #000;
      background-image: none;
      color: #fff;
      cursor: pointer;
      font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
        Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif,
        Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
      font-size: 100%;
      font-weight: 900;
      line-height: 1.5;
      margin: 0;
      
      padding: 0;
      text-transform: uppercase;
      text-decoration: none; /* Para eliminar subrayado en enlaces */
    }

    .btn-17:disabled {
      cursor: default;
    }

    .btn-17:-moz-focusring {
      outline: auto;
    }

    .btn-17 svg {
      display: block;
      
    }

    .btn-17 [hidden] {
      display: none;
    }

    .btn-17 {
      border-radius: 99rem;
      border-width: 2px;
      padding: 0.8rem 3rem;
      z-index: 0;
    }

    .btn-17,
    .btn-17 .text-container {
      overflow: hidden;
      position: relative;
    }

    .btn-17 .text-container {
      display: block;
      mix-blend-mode: difference;
    }

    .btn-17 .text {
      display: block;
      position: relative;
    }

    .btn-17:hover .text {
      -webkit-animation: move-up-alternate 0.3s forwards;
      animation: move-up-alternate 0.3s forwards;
    }

    @-webkit-keyframes move-up-alternate {
      0% {
        transform: translateY(0);
      }

      50% {
        transform: translateY(80%);
      }

      51% {
        transform: translateY(-80%);
      }

      to {
        transform: translateY(0);
      }
    }

    @keyframes move-up-alternate {
      0% {
        transform: translateY(0);
      }

      50% {
        transform: translateY(80%);
      }

      51% {
        transform: translateY(-80%);
      }

      to {
        transform: translateY(0);
      }
    }

    .btn-17:after,
    .btn-17:before {
      --skew: 0.2;
      background: #fff;
      content: "";
      display: block;
      height: 102%;
      left: calc(-50% - 50% * var(--skew));
      pointer-events: none;
      position: absolute;
      top: -104%;
      transform: skew(calc(150deg * var(--skew))) translateY(var(--progress, 0));
      transition: transform 0.2s ease;
      width: 100%;
    }

    .btn-17:after {
      --progress: 0%;
      left: calc(50% + 50% * var(--skew));
      top: 102%;
      z-index: -1;
    }

    .btn-17:hover:before {
      --progress: 100%;
    }

    .btn-17:hover:after {
      --progress: -102%;
    }