/* Estilos CSS */
        /* Estilos para el encabezado */
        header {
            background-color: rgb(54, 40, 248);
            color: #fff;
            padding: 10px 0;
            text-align: center;
            align-items: center;
        }
        /* Estilos para la barra de navegación */
        nav {
            display: flex;
            justify-content: space-between;
            background-color:rgb(128, 128, 128);
            color: #fff;
            padding: 12px 0;
            text-align: center;
            
        }
        nav a {
            color: #fff;
            text-decoration: none;
            margin: 0 10px;
        }
        /* Estilos para el contenido */
        main {
            padding: 20px;
            
        }
        /* Estilos para el pie de página */
        footer {
            background-color: #333;
            color: #fff;
            text-align: center;
            padding: 10px 0;
            position: fixed;
            bottom: 0;
            width: 100%;
        }
        .inicio{
            text-align: center;
        }
        .imagen{
            display: flex;
            align-items: center;
            text-align: center;
        }

        h2{
            align-items: center;
        }
        h1{
            color:white;
        
        }
        label{
            color: blue;
            font-weight: bold;
            margin-bottom: -.1rem;
            display: block;
            font-style: oblique;
            }
            .input-text{
            width: 100%;
            border: none;
            padding: .5rem;
            border-radius: .5rem;
            }
           
            .formulario{
                align-items: center;
                display: flex;
    
                background-color: rgb(151, 151, 153);
                width: min(40rem, 100%);
                margin: 0 auto;
                padding: 1rem;
                border-radius: 1rem;
                text-align: center;
                display: flex;
                margin: center;
                justify-content: center;
            }
            table {
                width:30%;
                border-collapse: collapse;
                margin-bottom: 20px;
            }
            th, td {
                border: 1px solid #ddd;
                padding: 8px;
                text-align: left;
            }
            th {
                background-color: #005588;
                color: #fff;
            }

            .slideshow-container {
                position: relative;
                max-width: 100%;
                margin: auto;
              }
              
              .slides img {
                position: absolute;
                width: 100%;
                height: auto;
                opacity: 0;
                transition: opacity 1s ease-in-out;
                z-index: -1; /* Para asegurar que las imágenes estén detrás de otros elementos */
              }
              
              .fade-in {
                animation: fade-in 2s infinite;
              }
              
              @keyframes fade-in {
                0% {
                  opacity: 0;
                }
                100% {
                  opacity: 1;
                }
              }

              .imagen1{
                display: flex;
                justify-content: space-evenly; /*Coloca las imágenes con espacio entre ellas*/
                align-items: center;
                background-color: #333;
            }
            .logo{
            width: 10rem;
        }

        mark {
            background-color: gray;
            color: black;
        }