.main-nav nav {
    width: 80%;
    margin: auto;
    padding: 0;
}

/* chung */

ul>li.has-sub {
    position: static !important;
    width: auto;
}
.submenu-panel,
.submenu-panel .related-info {
    /* background: url('../images/rddm-images/bg-menu.png') repeat 0 0 #0a0a0a !important; */
    background-color: var(--primary);
}

.rdd-menu .submenu-panel .col {
    float: left;
    width: 86%;
    /*padding: 0 3%;*/
    display: none;
}

.rdd-menu .submenu-panel h3 {
    padding: 10px 20px;
    margin: 0;
}

.list-3.list-menu-child {
    background-color: #ffffffb5;
}

.list-3 ul li a {
    font-size: 11px;
    /*text-transform: uppercase !important;*/
}

.list-3 ul.single-list li {
    padding: 5px 20px 0;
}

section.col.submenu-links.has-child h3 {
    position: relative;
    border-bottom: 1px dotted var(--white);
    padding-bottom: 10px;
}

.submenu-links a {
    margin-left: 0 !important;
}

.submenu-panel a {
    color: var(--white) !important;
}

.submenu-links.has-child he a:after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}

.rdd-menu .submenu-panel h3 a {
    text-transform: capitalize !important;
}
/********************************************
 * Responsive Dropdown Menu
 * Big screens (up to 959px width) stylesheet
 * 
 * Contents:
 * 1) Responsive Dropdown Menu: Wrapper styles
 * 2) Responsive Dropdown Menu: Top level styles
 * 3) Responsive Dropdown Menu: Dropdown panel styles
 * 4) Responsive Dropdown Menu: Submenu columns
 * 
 ********************************************/



/***********************************
 * Responsive Dropdown Menu: Wrapper styles *
 ***********************************/

.rdd-menu-holder {
    float: none;
    width: 80%;
    margin: 0 auto;
}



/*************************************
 * Responsive Dropdown Menu: Top level styles *
 *************************************/

.rdd-menu > ul {
    position: relative;
    z-index: 100;
}

.rdd-menu > ul > li {
    position: static;
    width: auto;
}

.rdd-menu > ul > li > a{
    /* By changing padding you can control the width of the Top level menu item */
    padding: 0 50px;
}

/* Top level arrow (indicates the Submenu): position of the background image '35px' depends of the width of top level menu item (above). For better look it should be 15px less than top level menu item padding (by default: 50px - 15px = 35px). */
.rdd-menu > ul > li.parent > a,
.rdd-menu > ul > li.parent > span {
    background-repeat: no-repeat;
    background-position: 35px -106px;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.rdd-menu .ico-arrow.open,
.rdd-menu .ico-arrow.close {
    display: none;
}

.rdd-menu li:target .ico-arrow.open,
.rdd-menu li:target .ico-arrow.close {
    display: none;
}



/******************************************
 * Responsive Dropdown Menu: Dropdown panel styles *
 ******************************************/

.rdd-menu .submenu-panel {
    display: block;
    padding: 0;
    /*padding-left: 50px;*/
    font-size: 12px;
    position: absolute;
    top: 100%;
    /*left: 0;*/
    /*right: 0;*/
    z-index: 102;
    /*opacity: 0;*/
    overflow: hidden;
    display: none;
}

.rdd-menu .submenu-links ul li > a {
    padding: 6px 30px;
    font-size: 11px;
    text-transform: none;
    text-align: left;
    width: auto;
    height: auto;
    background-position: 10px -65px;
    background-repeat: no-repeat;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

.rdd-menu .submenu-panel h2,
.rdd-menu .submenu-panel .h2 {
    font-size: 17px;
    line-height: 18px;
    padding: 20px;
    color: var(--white);
    text-transform: uppercase;
    border-bottom: 1px dotted;
}

.rdd-menu .submenu-panel h3,
.rdd-menu .submenu-panel .h3 {
    font-size: 14px;
    /*margin-bottom: 17px;*/
    /*padding-bottom: 8px;*/
}

.rdd-menu .submenu-panel h4,
.rdd-menu .submenu-panel .h4 {
    font-size: 14px;
    margin-bottom: 15px;
}

.rdd-menu .submenu-panel .single-list {
    /*margin-top: 18px;*/
}

.rdd-menu .submenu-panel p,
.rdd-menu .submenu-panel .p {
    display: block;
    margin-bottom: 5px;
}

.rdd-menu .submenu-panel p.last,
.rdd-menu .submenu-panel .p.last {
    margin-bottom: 0px;
}

.rdd-menu .submenu-panel .submenu-separator {
    display: block;
    float: left;
    width: 94%;
    margin: 0 3%;
    height: 3px;
}

li.nav-item.active, li.nav-item:hover  {
    /* border: 1px solid #ccc;
    background: #eee; */
    border-bottom: none;
    border-top: none;
}

.cart-header a {
    padding-right: .5rem;
    padding-left: .5rem;
    position: relative;
}

/************************************
 * Responsive Dropdown Menu: Submenu columns *
 ************************************/

.rdd-menu .submenu-panel .colgroup {
    position: relative;
}

.rdd-menu .submenu-panel .col {
    display: block;
    width: auto;
    /*margin: 15px 10px;*/
    margin-bottom: 0;
}

/* Single column layout */
.rdd-menu .submenu-panel .single-col .col {
    width: 94%;
}

/* Two columns layout */
.rdd-menu .submenu-panel .two-cols .col {
    /*width: 35%;*/
}

/* Three columns layout */
.rdd-menu .submenu-panel .three-cols .col {
    width: 27%;
}

/* Four columns layout */
.rdd-menu .submenu-panel .col {
    /*width: 19%;*/
}

/* Column with map */
.rdd-menu .submenu-panel .col.submenu-map-wrapper {
    display: block;
}

.rdd-menu .submenu-panel .col .margin-25 {
    width: 100%;
    height: 25px;
    line-height: 25px;
}
    
/*col LEFT*/


/*end col left*/
/*col right*/

/* Column with Submenu related info (headline, image and text): Static */
.rdd-menu .submenu-panel .col.submenu-info {
    display: block;
    /*width: 65%;*/
    padding: 0 20px;
}

.rdd-menu .submenu-info p {
    font-size: 13px;
    line-height: 22px;
    padding: 20px 0;
    color: var(--white);
}

.rdd-menu .submenu-info img {
    display: block;
    max-width: 779px;
    width: 100%;
}

/* Submenu with related info (headline, image and text): Dynamic */
.rdd-menu .related-info {
    width: 27%;
    padding: 32px 0 32px 3%;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}

/* Using only CSS imposes certain restrictions: for correct work & better look of the menu please use images of the same size and the same amount of text */
.rdd-menu .related-info .p {
    font-size: 11px;
    line-height: 22px;
}

.rdd-menu .related-info img {
    display: block;
    max-width: 100%;
    margin-bottom: 17px;
}

.rdd-menu a:hover + .related-info {
    display: block;
}

.nav-link span {
    line-height: 0;
}

.nav-link .avt-cat i {
    font-size: 20px;
    line-height: .9;
}
    
/*End col RIGHT*/

ul.single-list li:last-child {
    padding-bottom: 10px;
}

@media screen and (min-width: 990px)
{

    .rdd-menu li:hover > .submenu-panel {
        opacity: 1;
        display: block;
        padding: 0 20px 0px;
        border-top: 3px solid var(--primary);
        border-radius: 5px;
        box-shadow: 0 0 15px 0 #ddd;
    }
    
    .rdd-menu .submenu-panel {
        left: 0;
        right: 0;
    }
    
    .menusub-box {
        box-shadow: 1px 1px 15px #f1f1f1;
        border-radius: 5px;
        /* padding-bottom: 10px; */
    }
    
    .rdd-menu .submenu-links {
        width: 100% !important;
    }

    .rdd-menu .submenu-panel .col {
        margin: 10px 0;
    }
    
    .rdd-menu li:hover > .submenu-panel {
        background-color: var(--white);
    }
    
    .rdd-menu li:hover > .submenu-panel a{
        color: unset !important;
    }
    
    .rdd-menu li:hover > .submenu-panel h3 {
        background: var(--primary);
        color: var(--white);
        border-radius: 5px;
    }
    
    .submenu-links svg.down-svg{
        display: none;
    }
    
    .submenu-links .avt-cat {
        margin: 0;
        margin-right: 5px;
    }
    
    .rdd-menu ul.single-list li:hover a {
        color: var(--primary) !important;
    }

}
@media screen and (max-width: 990px)
{
    .main-nav nav .navbar-nav .nav-item {
        padding-top: 5px;
        padding-bottom: 0;
    }

    .rdd-menu .submenu-panel{
        display: none;
        position: unset;
    }
    li.nav-item.has-sub {
        position: relative !important;
    }

    .rdd-menu .submenu-panel .col {
        width: 100%;
        /*padding: 0 7% 20px 7%;*/
    }
    
    .rdd-menu .submenu-panel {
        height: 100%;
        top: 45%;
        bottom: 0;
        padding: 0;
    }
    
    .rdd-menu .submenu-panel .colgroup {
        display: none;
    }
    
    .has-sub span {
        margin-bottom: 5px;
    }
    
    /*menu lefft*/
        
    
    
    .navbar-collapse.scroll::-webkit-scrollbar {
          width: 5px;
    }
    
    .navbar-collapse.scroll::-webkit-scrollbar-track {
          background-color: #000000;
    }
    .navbar-collapse.scroll::-webkit-scrollbar-thumb {
          background-image: linear-gradient(to right, #f2c066f5, #cb830ec4, #dc9f3adb, #dea649, #ce9a3c) !important;
          border-radius: 2px; 
    }
    
    .navbar-collapse.scroll:-webkit-scrollbar-corner {
          background-color: var(--primary);
          border-radius: 10px; 
    }
    
    .navbar-collapse.scroll{
        overflow-y: scroll;
    }
    
    /*End webkit*/
    
    
    section.col.submenu-links {
        padding: 0;
    }

    .rdd-menu .submenu-panel h3 {
        padding: 10px 20px;
        margin: 0;
        border-bottom: 1px solid #ffffff52;
    }
    
    
    .list-3 ul {
        margin: 0;
        padding: 0;
        background: #c19142;
    }

    .list-3 ul.single-list li {
        padding-bottom: 5px;
        border-bottom: 1px dotted #ffffff52;
    }
    
    .submenu-panel a {
        color: unset !important;
    }
    
    .rdd-menu .submenu-panel a.megamenu-title, .single-list a {
        font-size: 13px !important;
    }
    
    .rdd-menu .submenu-panel h3 a, .single-list a {
        text-transform: unset !important;
        color: var(--white) !important;
    }
    
    .has-sub a {
        margin-right: 5px !important;
    }
}

@media screen and (max-width: 768px) {
    .main-nav nav {
        padding-left: 0;
        padding-right: 0;
    }
    /*.main-nav {
        position: fixed;
         background-color: none; 
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 10;
    }*/
    /*div#navbar:before {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        content: '';
        background: #000000c4;
        z-index: 2;
    }*/
}