/* Responsive Menu */

@media screen and (max-width: 768px) {
    .js .menu-wrapper nav[role=navigation] {
        overflow:hidden;
        max-height: 0em;

    } 
    .js .menu-wrapper nav[role=navigation].active {
        max-height: 30em;
        transition: max-height 0.5s ease-out;
    }
    .menu-wrapper{   
        a.menu-link{
            display:block;
            width:auto;
            padding-right:15px;
            padding-left:10px;
  background:#86020B;
            border:none;
            margin:0;
            &:hover{
                background:#86020B;
            }
            &.active .ico-caret-down:before{
                content: "\f0d8";
            }
        } 

        .menu .menu{
             padding-bottom: 5px;
        }
        .menu  li {
            display:block;
            border:1px solid pink;
            border:none;
        }
        .menu > li{
            padding:0px;
            border:none;
            &+li{
                border-top:1px dashed #86020B;
            }
        } 
        .menu a{
            padding:0.5em 0;
            margin:0px;
            border:none;
            &:hover{
                background:@drred;
            }
        } 
        .menu .rightalign{
             float:none;
        }
        li + li a:before{
            content:"";
        }

        /* unhide the 2nd level */
        li:hover .sub-menu{ 
            max-height: 0em; 
            transition:none;      
        } 
        .sub-menu{    
            background:none;
            margin-left:0px;
            margin-top:1px;
            display:block;
            width: 100%;
            li,
            li a{
                margin:0;
                display:block;
                width:100%;
            }
            a{
                padding-left:0.8em;
                &:hover{
                   background:darken(@red,15%);
                }
            }
            li{
                border-bottom:1px dashed @lred;
            }
            li:last-child{
                padding:0;
                a{
                    border:none;
                }
            }
        }
        .menu .has-subnav{
            position:relative;
        }    
        li .sub-menu.active{        
            max-height: 30em;
            overflow:visible;
            position:relative;
            z-index:9;
            transition: max-height 0.5s ease-out;
        }

        /* styling the toggle menu */
        .toggle-link{ 
            height:67px;
            width: 60px; 
            display:block;
            position:absolute;
            right:0px;                 
            z-index:200;
            font-size:0em;      
            cursor:pointer;
            font-family: 'icomoon';
            speak: none;
            font-style: normal;
            font-weight: normal;
            line-height: 1;
            -webkit-font-smoothing: antialiased;        
            &:hover{
                transition:all 0.2s;
                background:lighten(@red,5%);
            }
        }
        /* arrow to indicate that we have subnav*/
         .menu .has-subnav > .toggle-link:after{        
            content: "\f0d7";           
            position:absolute;            
            width:50px;
            top:50%;
            margin-top:-15px;
            bottom:50%;
            right:4px;
            font-size:28px;
            color:#fff;
        }
         .menu .has-subnav  > .toggle-link.active:after{
             content: "\f0d8";
             margin-top:-18px;
        }
    }
}





@media screen and (max-device-width:600px){
   body{background-color:red;}
   .fix{overflow:hidden}
   .stucture{display:none}
   .mobile{ background:white; width:95%; margin:auto; padding:2%}
   .logo{}
   .menu1{ background:#49AADC; padding:5px; border-radius:3px;}
   .menu1 a{ color:#FFFFFF; font-size:18px; line-height:25px}
   .menu1 a:hover{border-bottom:2px solid #C60000; color:#CA0101}
.menu-wrapper a{color:#FFFFFF}
   .slider{}
   .content{ margin: 5px 0px;  padding:5px 10px;}
   .m_editor{ text-align:center; border-bottom:3px solid #73337D; border-top:3px solid #73337D; }
   .m_address{text-align:center}
   .desing{ text-align:center; background:#49AADC; padding:5px}
   .desing a{ color:#FFFFFF}
   .clear{ clear:both}
   .mobile_catagory{ margin:2px 0px; border-bottom:1px solid #D1D2D3; padding:10px 0px}
   .mobile_title{ font-size:18px; line-height:20px;; padding:5px 0px;}
   .mobile-thumb{float:left; border:1px solid #E3E4E4; margin:5px 5px 0px 0px;}
   .mobile_matar{ text-align:justify;}
   
   
   .contant_sidebar{display:none}
   .content_single{margin: 5px 0px; padding:5px 10px;}
   .single-post-thumb{ width:100%}



.mnav-previous{float:right; width:40%;margin-top:20px; text-align:right; padding:5px}
.mnav-previous a{font-size:18px;color:#CC0000 }
.mnav-previous a:hover{color:#0E4E01}
.mnav-next{ float:left; width:40%; margin-top:20px;  padding:5px}
.mnav-next a{font-size:18px; color:#CC0000 }
.mnav-next a:hover{color:#0E4E01}
   


}

@media screen and (min-device-width:600px){
.mobile{display:none}
.mobile_last{display:none}

}