/* 1. MEGA MENU RESPONSIVE CSS


*/
/* Mega Menu Width */
@media (min-width: 768px) {
    .width-sm-1{
        width:@width_1;
    }
    .width-sm-2{
        width:@width_2;
    }
    .width-sm-3{
        width:@width_3;
    }
    .width-sm-4{
        width:@width_4;
    } 
    .width-sm-5{
        width:@width_5;
    }
    .width-sm-6{
        width:@width_6;
    }     
    .width-sm-full{
        width:@width_full;
    }    
    .height-sm-auto .list-wrapper > li{
        height:auto;
    }
    .height-sm-1 .list-wrapper > li{
        height:@height_1;
    }
    .height-sm-2 .list-wrapper > li{
        height:@height_2;
    }
    .height-sm-3 .list-wrapper > li{
        height:@height_3;
    } 
    .height-sm-4 .list-wrapper > li{
        height:@height_4;
    } 
    .height-sm-5 .list-wrapper > li{
        height:@height_5;
    } 
    .height-sm-6 .list-wrapper > li{
        height:@height_6;
    }   
    .column-sm-1{
        .column-1();       
    }  
    .column-sm-2{
        .column-2();         
    }
    .column-sm-3{
        .column-3();    
    } 
    .column-sm-4{
        .column-4();       
    } 
    .column-sm-5{
        .column-5();   
    }
    .column-sm-6{
        .column-6();     
    }       
    .left-sm{
        .left-mega-menu();             
    }
    .right-sm{
        .right-mega-menu();     
    }
    .center-sm-1{
        .center-pos(@width_1,@width_extra);
    }
    .center-sm-2{
        .center-pos(@width_2,@width_extra);
    }
    .center-sm-3{
        .center-pos(@width_3,@width_extra);
    }
    .center-sm-4{
        .center-pos(@width_4,@width_extra);
    }
    .center-sm-5{
        .center-pos(@width_5,@width_extra);
    }
    .center-sm-6{
        .center-pos(@width_6,@width_extra);
    }
    .center-sm-5{
        .center-pos(@width_5,@width_extra);
    }
    .center-sm-6{
        .center-pos(@width_6,@width_extra);
    }
    .center-sm-full{
        .center-pos(@width_full,@width_extra);
    }   
    .mgbt-sm-0{
        margin-bottom:0 !important;
    }
    .mgbt-sm-5{
        margin-bottom:5px !important;
    }
    .mgbt-sm-10{
        margin-bottom:10px !important;
    }
    .mgbt-sm-15{
        margin-bottom:15px !important;
    }
    .mgbt-sm-20{
        margin-bottom:20px !important;
    }    
}
@media (min-width: 992px) {
    .width-md-1{
        width:@width_1;
    }
    .width-md-2{
        width:@width_2;
    }
    .width-md-3{
        width:@width_3;
    }
    .width-md-4{
        width:@width_4;
    } 
    .width-md-5{
        width:@width_5;
    }
    .width-md-6{
        width:@width_6;
    } 
    .width-md-full{
        width:@width_full;
    }     
    .height-md-auto .list-wrapper > li{
        height:auto;
    }
    .height-md-1 .list-wrapper > li{
        height:@height_1;
    }
    .height-md-2 .list-wrapper > li{
        height:@height_2;
    }
    .height-md-3 .list-wrapper > li{
        height:@height_3;
    } 
    .height-md-4 .list-wrapper > li{
        height:@height_4;
    } 
    .height-md-5 .list-wrapper > li{
        height:@height_5;
    } 
    .height-md-6 .list-wrapper > li{
        height:@height_6;
    }  
    .column-md-1{
        .column-1();       
    }  
    .column-md-2{
        .column-2();         
    }
    .column-md-3{
        .column-3();    
    } 
    .column-md-4{
        .column-4();       
    } 
    .column-md-5{
        .column-5();   
    }
    .column-md-6{
        .column-6();     
    }     
    .left-md{
        .left-mega-menu();        
    }
    .right-md{
        .right-mega-menu();     
    }    
    .center-md-1{
        .center-pos(@width_1,@width_extra);
    }
    .center-md-2{
        .center-pos(@width_2,@width_extra);
    }
    .center-md-3{
        .center-pos(@width_3,@width_extra);
    }
    .center-md-4{
        .center-pos(@width_4,@width_extra);
    }
    .center-md-5{
        .center-pos(@width_5,@width_extra);
    }
    .center-md-6{
        .center-pos(@width_6,@width_extra);
    }
    .center-md-full{
        .center-pos(@width_full,@width_extra);
    }  
    .mgbt-md-0{
        margin-bottom:0 !important;
    }
    .mgbt-md-5{
        margin-bottom:5px !important;
    }
    .mgbt-md-10{
        margin-bottom:10px !important;
    }
    .mgbt-md-15{
        margin-bottom:15px !important;
    }
    .mgbt-md-20{
        margin-bottom:20px !important;
    }    
}
@media (min-width: 1200px) {
    .width-lg-1{
        width:@width_1;
    }
    .width-lg-2{
        width:@width_2;
    }
    .width-lg-3{
        width:@width_3;
    }
    .width-lg-4{
        width:@width_4;
    } 
    .width-lg-5{
        width:@width_5;
    } 
    .width-lg-6{
        width:@width_6;
    }
    .width-lg-full{
        width:@width_full;
    }    
    .height-lg-auto .list-wrapper > li{
        height:auto;
    }
    .height-lg-1 .list-wrapper > li{
        height:@height_1;
    }
    .height-lg-2 .list-wrapper > li{
        height:@height_2;
    }
    .height-lg-3 .list-wrapper > li{
        height:@height_3;
    } 
    .height-lg-4 .list-wrapper > li{
        height:@height_4;
    } 
    .height-lg-5 .list-wrapper > li{
        height:@height_5;
    } 
    .height-lg-6 .list-wrapper > li{
        height:@height_6;
    }  
    .column-lg-1{
        .column-1();       
    }  
    .column-lg-2{
        .column-2();         
    }
    .column-lg-3{
        .column-3();    
    } 
    .column-lg-4{
        .column-4();       
    } 
    .column-lg-5{
        .column-5();   
    }
    .column-lg-6{
        .column-6();     
    }     
    .left-lg{
        .left-mega-menu();        
    }
    .right-lg{
        .right-mega-menu();     
    }    
    .center-lg-1{
        .center-pos(@width_1,@width_extra);
    }
    .center-lg-2{
        .center-pos(@width_2,@width_extra);
    }
    .center-lg-3{
        .center-pos(@width_3,@width_extra);
    }
    .center-lg-4{
        .center-pos(@width_4,@width_extra);
    }
    .center-lg-5{
        .center-pos(@width_5,@width_extra);
    }
    .center-lg-6{
        .center-pos(@width_6,@width_extra);
    }
    .center-lg-full{
        .center-pos(@width_full,@width_extra);
    }   
    .mgbt-lg-0{
        margin-bottom:0 !important;
    }
    .mgbt-lg-5{
        margin-bottom:5px !important;
    }
    .mgbt-lg-10{
        margin-bottom:10px !important; 
    }
    .mgbt-lg-15{
        margin-bottom:15px !important;
    }
    .mgbt-lg-20{
        margin-bottom:20px !important;
    }    
}
@media (max-width: 767px){
    .vd_mega-menu-content .child-menu .content-grid .menu-text .menu-info .menu-action .menu-action-icon{
        font-size:10px;
        height:16px;
        width:16px;
        line-height:12px;
    }  
    .vd_mega-menu-wrapper.horizontal-menu .vd_mega-menu{
        float:none;
        margin-left:-15px;
        margin-right:-15px;
        padding-top: 5px;
        padding-bottom:10px;
//        height:200px;
//        overflow-y:auto;
        background-color:rgba(0,0,0,.4);
        > .mega-ul > .mega-li{
            float:none;
            padding: 7px 15px;
            height:auto;
            margin:0;
            border-radius:0;
            > a{
                display:block;
            }
        }
        .vd_mega-menu-content{
            width: 100% !important;
            position:relative;
            left:auto;
            right:auto;
            top:auto;
            margin-top:5px;
            margin-bottom:10px;
            .vd_mega-menu-content {
                margin-bottom:0;
            }
        }
        .vd_mega-menu-content:before{
            display:none;
        }
        .open-right .list-wrapper > li,  .open-left .list-wrapper > li{
            padding: 0 0 0 15px !important;
        }      
        .vd_mega-menu-content.open-right, .vd_mega-menu-content.open-left{
            border-top:none;
            box-shadow:none;
            margin-top:0;
            > div > div > ul > li > a{
                border-left: 3px solid @main_color;
                padding: 3px 0px 3px 10px; 
            }
        }        
    }    
    .light-top-menu .vd_mega-menu-wrapper.horizontal-menu {
        .vd_mega-menu {
            background:rgba(0,0,0,.8);
            > .mega-ul > .mega-li{
                 > a {
                     color:#FFF
                 }
            }
        }    
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .vd_mega-menu-wrapper.horizontal-menu .vd_mega-menu{
        > .mega-ul > .mega-li{
            padding-left: 10px;
            padding-right:10px;
        }
    }       
}
