/* Banner */
#success_message{ display: none;}
#banner {
    background-image: url("../../images/portadas/trasnparencia.png");
    background-position: center center;
    background-size: cover;
    height: 25em;
    text-align: center;
    position: relative;
    background-attachment: fixed;
   
}

@media (max-width: 768px) {
    #banner {
      background-image: url("../../images/portadas/trasnparencia.png");
      background-position: center top;
      background-repeat: no-repeat;
      background-size: contain;
      height: 270px; /* Ajustalo según el resultado visual */
    }
  }
  
  


#banner header {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background: #212121;
        background: rgba(27, 27, 27, 0.75);
        color: #fff;
        padding: 1.5em 0;
    }

        #banner header h2 {
            display: inline-block;
            margin: 0;
            font-size: 1.25em;
            vertical-align: middle;
        }

            #banner header h2 em {
                opacity: 0.75;
            }

            #banner header h2 a {
                border-bottom-color: rgba(255, 255, 255, 0.5);
            }

                #banner header h2 a:hover {
                    border-bottom-color: transparent;
                }

        #banner header .button {
            vertical-align: middle;
            margin-left: 1em;
        }
        @media screen and (max-width: 768px) {
   

            #banner header .button {
                display: block;
                margin: 1em auto 0 auto;
            }
        }


        :root {
            --transparencia-color: #009C8C; /* Puedes cambiar este color a tu gusto */
        }
        
        #transparencia-section {
            padding: 4em 2em;
            background-color: #f9f9f9;
            text-align: center;
        }
        
        #transparencia-section .major h2 {
            color: var(--transparencia-color);
        }
        
        .pdf-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: 2em;
            margin-top: 2em;
        }
        
        .pdf-card {
            background-color: white;
            border-radius: 10px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
            padding: 2em 1em;
            text-align: center;
            text-decoration: none;
            transition: transform 0.2s ease, box-shadow 0.2s ease;
            color: #333;
            border-top: 5px solid var(--transparencia-color);
        }
        
        .pdf-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
        }
        .pdf-card i {
            font-size: 3.5em; /* antes 2.9em */
            color: var(--transparencia-color);
            margin-bottom: 0.7em;
            display: block;
        }
        
        .pdf-card h3 {
            margin: 0;
            font-size: 1.3em; /* antes 1.1em */
            color: #222;
        }
        .pdf-submenu a {
            font-size: 1.05em;
            color: #009C8C; /* Cambia este color a lo que prefieras */
            text-decoration: none;
            font-weight: 500;
            transition: color 0.3s ease;
        }
        
        
        .pdf-card.has-multiple {
            position: relative;
            padding-bottom: 3em;
        }
        
        .pdf-submenu {
            margin-top: 1em;
            display: flex;
            flex-direction: column;
            gap: 0.5em;
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        
        .pdf-card.has-multiple:hover .pdf-submenu {
            opacity: 1;
        }
        
       
        
        .pdf-submenu a:hover {
            color: #6c3483; /* Un tono más oscuro para el hover */
            text-decoration: none;
        }