/*menu 1*/

/* Corregido: el selector correcto es #custom-bootstrap-menu (nav padre) > #menu-1 (div hijo) */
#custom-bootstrap-menu .dropdown-menu {
    width: 450px;
    text-align: left;
}

#custom-bootstrap-menu .dropdown-menu .nav-header {
    font-size: 20px;
    color: #005EA8;
    font-weight: bold;
    padding-left: 15px;
    font-family: 'Muli', sans-serif;
}

#custom-bootstrap-menu .dropdown-menu > li > a {
    color: #626262;
    font-family: 'Muli', sans-serif;
    font-size: 18px;
}

#custom-bootstrap-menu .dropdown-menu > li > a:hover,
#custom-bootstrap-menu .dropdown-menu > li > a:focus {
    font-family: 'Muli', sans-serif;
    font-size: 18px;
}

#custom-bootstrap-menu .dropdown-menu > .active > a,
#custom-bootstrap-menu .dropdown-menu > .active > a:focus,
#custom-bootstrap-menu .dropdown-menu > .active > a:hover {
    background: #24B5E6;
    color: #FFFFFF;
}

#bs-example-navbar-collapse-1 {
    border: none;
}

#menu-1 {
    -webkit-box-shadow: inset 0px -108px 36px -118px rgba(184,184,184,1);
    -moz-box-shadow: inset 0px -108px 36px -118px rgba(184,184,184,1);
    box-shadow: inset 0px -108px 36px -118px rgba(184,184,184,1);
    margin-top: 10px;
}

#custom-bootstrap-menu {
    margin-top: 38px;
}

#custom-bootstrap-menu.navbar {
    border-width: 0px;
    border-radius: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
    background: #FFFFFF;
}

#custom-bootstrap-menu.navbar .navbar-nav > li > a {
    font-size: 20px;
    font-weight: 400;
    font-family: 'Muli', sans-serif;
    background: none;
    color: #2e2d31;
    padding-left: 22px;
}

#custom-bootstrap-menu.navbar .navbar-nav > li > a:hover,
#custom-bootstrap-menu.navbar .navbar-nav > li > a:focus {
    color: #00A8E2;
}

#custom-bootstrap-menu.navbar .navbar-nav > .active > a,
#custom-bootstrap-menu.navbar .navbar-nav > .active > a:hover,
#custom-bootstrap-menu.navbar .navbar-nav > .active > a:focus {
    color: #00A8E2;
}

/* Bootstrap 5: .navbar-toggler reemplaza al .navbar-toggle de Bootstrap 3 */
#custom-bootstrap-menu.navbar .navbar-toggler {
    background: #00A8E2;
    border: none;
}

#custom-bootstrap-menu.navbar .navbar-toggler:hover,
#custom-bootstrap-menu.navbar .navbar-toggler:focus {
    background: #00A8E2;
    box-shadow: none;
}

/* Bootstrap 5: .navbar-toggler-icon reemplaza a .icon-bar de Bootstrap 3 */
#custom-bootstrap-menu.navbar .navbar-toggler .navbar-toggler-icon {
    filter: brightness(0) invert(1);
}
