/* Estilos para el contenedor principal */
.content-container {
    display: flex;               /* Usa flexbox para alinear en fila */
    align-items: flex-start;     /* Alinea la imagen y el texto en la parte superior */
    gap: 20px;                   /* Espacio entre la imagen y el texto */
    margin: 20px;                /* Margen alrededor del contenedor */
}

/* Estilos para la imagen */
#sistemas {
    width: 15%;                  /* La imagen ocupará el 50% del contenedor */
    height: auto;                /* Mantiene la proporción de la imagen */
    border-radius: 10px;         /* Bordes redondeados para la imagen */
    order: 2;                    /* Mueve la imagen al segundo lugar en flexbox */
}

/* Estilos para el texto */
.text-content {
    flex: 1;                     /* El texto ocupa el espacio restante */
    font-family: 'Droid Sans', sans-serif;
    order: 1;                    /* Mantiene el texto en primer lugar */
}

#texto {
    color: #333;                 /* Color del texto */
    font-size: 18px;             /* Tamaño de fuente */
    line-height: 1.6;            /* Altura de línea */
}

/* Estilo para el título y subtítulo */
.text-content h2,
.text-content h3 {
    margin: 0;
    padding: 5px 0;
    font-weight: bold;
}

.text-content ul {
    list-style-type: none;       /* Quitar viñetas de la lista */
    padding: 0;
}

.text-content li {
    margin: 10px 0;
}

.text-content a {
    color: #0056b3;              /* Color de los enlaces */
    text-decoration: none;       /* Quitar subrayado de los enlaces */
}

.text-content a:hover {
    text-decoration: underline;  /* Subrayado al pasar el cursor */
}