#megamenu, .u-megamenu-categoria {
   display: none;
}

ul.nav-megamenu {
   display: flex;
   list-style: none;
   justify-content: center;
   align-content: center;
}
.nav-megamenu li {
   margin: 5px 0;
   padding: 0 10px;
   border-right: 1px solid #030303;
}
.nav-megamenu li:last-child {
   border-right: none;
}
.nav-megamenu li .link-megamenu {
   cursor: pointer;
   text-transform: capitalize;
   color: black;
   font-weight: 400;
}
.nav-megamenu li .active {
   color: #4b99e2;
}

.u-megamenu .active {
   display: block;
}

.u-megamenu .container-ul-subcategorias2 ul {
   max-height: 135px;
   overflow: hidden;
   padding-left: 0;
   text-transform: capitalize;
   /*transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);*/
}
.u-megamenu .container-ul-subcategorias2 ul > li {
   list-style: none;
}
.u-megamenu .ul-subcategorias2-visible ul {
   max-height: 100%;
   overflow: visible;
   /*transition: max-height 0.5s ease-in-out;*/
}
.u-megamenu .ul-desplegar {
   margin-left: 0;
   margin-top: 5px;
}
.u-megamenu .ul-desplegar a {
   margin: 0;
   color: #000;
   cursor: pointer;
   font-size: 0.9rem;
   transform: rotate(0);
   letter-spacing: inherit;
}
.u-megamenu .ul-subcategorias2-visible .ul-desplegar i {
   transform: rotate(180deg);
}
/* Again, you’re free to use and define the classes: */
.column { float: left; }
.size-1of1 { 
   width: 100%; 
}
.size-1of2 { 
   width: 50%; 
}
.size-1of3 { 
   width: 33.333%; 
}
.size-1of4 { 
   width: 25%; 
}

@media screen and (max-width: 480px){
	#grid[data-columns]::before {
		content: '1 .column.size-1of1';
	}
}

@media screen and (min-width: 481px) and (max-width: 768px) {
	#grid[data-columns]::before {
		content: '2 .column.size-1of2';
	}
}
@media screen and (min-width: 769px) {
	#grid[data-columns]::before {
		content: '3 .column.size-1of3';
	}
}
@media screen and (min-width: 991px) {
	#grid[data-columns]::before {
		content: '4 .column.size-1of4';
	}
}