.meniu {
   position:absolute;
   top:116px;
   padding: 0;
   margin: 0;
   border: 0;
   line-height: 1;
   background: #fff;
   height: 444px;
   z-index: 3;

}
.open_menu:hover .meniu{
   background: red;
   display: block !important;
}

.meniu a{
   color: #333 !important;
   font-size:14px !important;
   font-family:'Roboto';
   font-weight: 500;
   line-height: 20px;
   display: block;
}

.meniu .has-children a::before{
   content:"»";
   float: right;
}

.meniu ul li {
   border-bottom:1px solid #f2f2f2;
   padding:padding: 13px 20px;
   display: block;
   background: linear-gradient(to right, #f29f29, #f29f29);
   transition: background-size 0.3s 0s;
   background-size: 0 100%;
   background-repeat: no-repeat;
}

.meniu ul li:hover{
   background-size: 100% 100%;
}

.meniu ul li:hover > a{
   color:#fff !important;
}

.subcategorii{
   background: white;
   width:897px;
   height: 443px;
   overflow-y: auto;
   overflow-x: hidden;
   top:0;
   padding: 15px !important;
   color: #54595F;
}

.subcategorii a::before{
   content: "" !important;
}

.subcategorii a{
   transition: ease-out 0.3s all;
   border-left: 1px solid white;
   font-size:14px !important;
   line-height: 15px;
}

.subcategorii a:hover{
   color:#f29f29  !important;
   border-left: 3px solid white;
}

.meniu ul,
.meniu ul li,
.meniu ul ul {
   list-style: none;
   margin: 0;
   padding: 0;
}

.subcategorie{
   font-weight:bold;
   line-height:20px;
   margin-bottom:0;
}

li .subcategorie:not(:first-child){
   padding-top:20px;
}

.subsubcategorie{
   line-height:20px;
   margin-bottom:0;
   font-weight:500 !important;
}

.meniu ul li{
   padding: 8px 12px;
}

.meniu{
   width:213px;
}

.meniu-content{
   position:relative;
}

.meniu-content .subcategorii{
   position: absolute;
   top:0px;
   left:220px;
   display:none;
}

.meniu-content .has-children:hover .subcategorii{
   display:flex;
}

/* ------------------------------- RESPONSIVE ----------------------------------- */

/* mobile */
@media all and (min-width:0px) and (max-width: 767px) {
   .meniu{
      display: none;
      top: 42px;
      height: calc(100vh - 122px);
      overflow-y: auto;
      left: 0;
      max-height: none;
   }
   .meniu .iconExpand{
      float: right;
      font-size: 12px;
   }
   .meniu .iconBack{
      float: left;
      margin-right: 10px;
      font-size: 12px;
   }
   .meniu span{
      display: block;
      padding: 8px 12px;
      font-size: 1rem !important;
      font-family: "Roboto";
      font-weight: 400;
      font-size: 14px;
   }
   .meniu .subcategoriiMobile{
      display: none;
      background: #f1ad6f17;
   }
   .meniu .subsubcategoriiMobile{
      display: none;
   }
   .meniu ul li:hover{
      background: transparent;
   }
   .meniu ul li span:hover{
      color: #2B3089;
   }
   .subcategoriiMobile li:last-child{
      border:none;
   }
   .meniu li:last-child{
      border-bottom: none;
   }
   .meniu a{
      font-size: 14px !important;
      font-family: "Roboto";
      font-weight: 400;
      color: #212529 !important;
   }
   .meniu .has-children a::before{
      content: "";
   }
   .meniu li{
      cursor: pointer;
   }
   .meniu .has-children .subcategoriiMobile a, .meniu .has-children .subcategoriiMobile span {
      font-size: 14px !important;
   }
   .meniu .has-children .subsubcategoriiMobile a{
      font-size: 12px !important;
   }
}

/* tableta */
@media all and (min-width:768px) and (max-width: 1023px) {
   .meniu-content .subcategorii{
      left: 233px;
      width: 523px;
   }

   .meniu{
      top: 110px;
      width: 85% !important
   }

   #listaDinGradient li:first-child{
      width: 61.5% !Important;
   }
   .header2 a{
      font-size: 14px !Important;
   }

   .sectiune-cards .col-6:first-child{
      padding-left: 15px;
      padding-right: 5px;
   }

   .sectiune-cards .col-6:nth-child(2){
      padding-right: 15px;
      padding-left: 5px;
   }

   .sectiune-cards .col-6:nth-child(3){
      padding-left: 15px;
      padding-roght: 5px;
   }
}
@media all and (min-width:1024px) and (max-width: 1366px) {
   #listaDinGradient li:first-child{
      width: 34% !important;
   }

   .meniu{
      top: 116px;
      width: 56.4% !important;
      width: 216px;
   }
   .meniu-content .subcategorii{
      left: 194px;
      width: 751px;
      top: 0px;
   }
}
