/*---------------------------------------------------------------------
    File Name: barra-superior.css
---------------------------------------------------------------------*/

.container-fluid {
	position: fixed;
	top: 0px;
}

.col-md-3 {
    padding: 0px 0px;
	background-image: linear-gradient(
        to bottom, 
        rgba(188, 136, 61, 0.6),  /* 60% opaco */
        rgba(245, 228, 123, 0.6),
        rgba(188, 136, 61, 0.6)
    );
}

.col-md-9 {
    padding: 0px 0px;
	background-image: linear-gradient(
        to bottom, 
        rgba(188, 136, 61, 0.6),  /* 60% opaco */
        rgba(245, 228, 123, 0.6),
        rgba(188, 136, 61, 0.6)
    );
}

.c-header__button-nav {
    display: inline-block;
    cursor: pointer;
    width: 30px;
    height: 22px;
	z-index: 999; /* más alto que el overlay */
	position: relative; /* importante para que z-index funcione */
	margin-top: 8px; /* ajusta el valor a tu gusto */
	margin-right: 16px; /* se aleja del borde derecho */
}

.c-header__button-nav-item {
    display: block;
    height: 4px;
    width: 100%;
    background-color: #fff; /* color de las líneas */
    margin: 4px 0;
    transition: 0.3s;
}

.c-header__button-nav.open .c-header__button-nav-item--top {
    transform: rotate(45deg) translate(5px, 5px);
}

.c-header__button-nav.open .c-header__button-nav-item--middle {
    opacity: 0;
}

.c-header__button-nav.open .c-header__button-nav-item--bottom {
    transform: rotate(-45deg) translate(6px, -6px);
}