@charset "UTF-8";
body{font-family: 'Rubik', sans-serif;}
html{background-color: #fafafa;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}
label, h1, h2, h3, h4, a{font-family: 'Rubik';}
.green-utc{color: #00bb2d;}
.blue-utc{color:#162143;}
.bg-blue-utc{background-color:#162143 !important;}
.bg-green-utc{background-color:#D2E59E !important;}
.bg-blue{background-color:#639DBC;}
.enlace{color: #444444 !important;}
/* HOVER */
.enlace:hover{color: #006382 !important;}
.green-utc:hover{color: white;}
.gray-utc:{color: #40434E;}
button.bg-blue-utc:hover {
    background-color:#3C5BB9 !important;
    color:white !important;
}
/* CUSTOM ACCORDING*/
.accordion-button {
    background-color: white; /* Change to desired color */
    color: #162143; /* Optional: Change text color */
}

.accordion-button:not(.collapsed) {
    background-color: #162143; /* Change to desired color for active state */
    color: white;
}

/* Optional: Remove Bootstrap default background effect */
.accordion-button:focus {
    box-shadow: 0 0 5px #00bb2d;
}

.accordion-button:not(.collapsed)::after {
    filter: invert(1); /* Mantiene la flecha en blanco cuando está activo */
}