body{
	font-family: 'Roboto' !important;
}

.row {
        display: flex;
        justify-content: space-between;
        margin-top: 20px;
    }

    .col {
        padding-right: 20px;
        max-height: 400px;
        overflow-y: auto;
    }
    .col1 {
        flex: 0 0 35%;
    }
    .col2 {
        flex: 0 0 65%;
    }

    /* Estilo para la lista de familias */
    .familias-list {
        list-style: none;
        padding: 0;
	font-size: 14px;
    }

    .familia-item {
        padding: 10px;
        cursor: pointer;
        background-color: #dbe9f4;
        margin-bottom: 5px;
        border-radius: 5px;
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    .familia-item:hover {
        background-color: #cee0ee;
    }

    /* Estilo para el elemento seleccionado */
    .familia-item.selected {
        background-color: #274c5e;
        color: white;
        font-weight: bold;
    }

    /* Estilo para los acordeones */
    .accordion {
        margin-top: 20px;
    }

    .accordion h3 {
        background-color: #274c5e;
        color: white;
        padding: 10px;
        cursor: pointer;
        margin: 0;
        border-radius: 5px;
        position: relative;
    }

    .accordion h3 .accordion-toggle {
        position: absolute;
        right: 10px;
        font-size: 20px;
        transition: transform 0.3s ease;
    }

    .accordion-content {
        padding: 10px;
        background-color: white;
        display: none;
    }

    .accordion-content ul {
        list-style-type: none;
        padding: 0;
    }

    .accordion-content li {
        margin-bottom: 8px;
	font-size: 14px;
    }

    /* Estilo para los títulos del acordeón */
    .accordion2 li {
        padding: 10px;
        cursor: pointer;
        background-color: #dbe9f4;
        margin-bottom: 5px;
        border-radius: 5px;
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    .accordion2 li:hover {
        background-color: #cee0ee;
    }

    /* Estilo para el contenido del acordeón */
    .accordion2-content {
        display: none;
    }

    .accordion2-content div {
        padding: 10px;
        background-color: #fafafa;
        margin-bottom: 5px;
        border-radius: 5px;
    }
    .accordion2 p {
        margin: 5px;
	font-size: 14px;
	color: black;
    }