.app-container {left: 0;-webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;-o-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;}

/**** Mobile Navigation ****/
.mobile-nav {position: fixed;width: 0%;height: 100%;overflow-y: scroll;top: 62px;z-index: 9999;background: var(--primary-color);background: #fff;}
.mobile-nav nav { height: 100%; /* overflow: auto; margin-right: -10px;*/ }
.mobile-nav nav li { }
.mobile-nav nav li ul { display: none; background: #ffffff; }
.mobile-nav nav li ul.dropdown { margin-left: 25px; /* margin-bottom: 20px;*/
display: none; padding-bottom: 15px; }
.mobile-nav nav li ul.dropdown a { font-size: 12px; border: none; padding: 6px 39px; position: relative; }
.mobile-nav nav li ul.dropdown a:hover { color: var(--theme-black); background: transparent; }
.mobile-nav nav li ul li { }
.mobile-nav nav li ul li a {/* font-weight: 500; *//* font-size: 14px; *//* color: #000 !important; */}
.mobile-nav nav li ul li a:hover, .mobile-nav nav li ul li a.active { background: transparent; font-weight: 600; color: var(--dark-color); }

.mobile-nav nav li ul li ul li a:before {
    position: absolute;
    content: "" !important;
    font-family: 'icomoon' !important;
    left: 24px;
    top: 9px;
    font-size: 13px;
    font-weight: 600;
    color: var(--primary-color);
}

.mobile-nav nav li a {color: #000;font-weight: 400;font-size: 14px;display: block;padding: 12px 15px;/* border-top: 1px solid #d6d8db; */-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
.mobile-nav nav li a.active {color: #000;background: var(--primary-color);}
.mobile-nav nav li a .xicon { font-size: 20px; float: right; }
.mobile-nav.active {height: 100%;left: 0px;}
.mobile-nav .logo-main { font-size: 16px; color: #8795a0; padding: 15px 0px 15px 24px; display: inline-block; }
.extra-link { }
.extra-link a { border: 2px solid var(--theme-black); width: 40%; margin: 40px auto 10px; padding: 7px 0; font-size: 15px; text-align: center; }
.extra-link:hover { color: var(--theme-black); border: 2px solid var(--theme-black); background: transparent; }
.close-nav { position: absolute; top: 10px; right: 10px; border: 1px solid #ffffff; width: 26px; height: 26px; line-height: 1.5; }
/*** Mobile Nav Button ***/

.mobile-nav-btn {
     display: none;
     position: fixed;
     top: 28px;
     height: 30px;
     padding: 6px 7px;
     border-radius: 4px;
     left: 5%;
     z-index: 100;
     cursor: pointer;
     -webkit-transition: all 0.6s ease-in-out;
     -moz-transition: all 0.6s ease-in-out;
     -o-transition: all 0.6s ease-in-out;
     transition: all 0.6s ease-in-out;
     z-index: 9999;/*
     &:hover .lines {
         &:before {
             top: 8px;
         }
         &:after {
             top: -8px;
         }
     }
*/

    /*
     &.active .lines {
         transition: background .3s 0 ease;
         background: transparent;
         &:before, &:after {
             transition: top .3s ease,-webkit-transform .3s .5s ease;
             transition: top .3s ease,transform .3s .5s ease;
             top: 0;
             width: 30px;
             background-color: var(--primary-color);
         }
         &:before {
             -webkit-transform: rotate3d(0, 0, 1, 45deg);
             transform: rotate3d(0, 0, 1, 45deg);
         }
         &:after {
             -webkit-transform: rotate3d(0, 0, 1, -45deg);
             transform: rotate3d(0, 0, 1, -45deg);
         }
     }
     */
}

@media (max-width: 767px) {
.mobile-nav-btn { display: block; }
}
.mobile-nav-btn .lines:before { top: 6px; }
.mobile-nav-btn .lines:after { top: -6px; }
.mobile-nav-btn.active { transition: 0; }
.mobile-nav-btn span {display: none;height: 3px;width: 22px;background-color: var(--main-bg-color);display: block;margin-bottom: 6px;-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;position: relative;top: 17px;}
.mobile-nav-btn span:before, .mobile-nav-btn span:after {display: block;background-color: var(--main-bg-color);height: 3px;width: 22px;position: absolute;left: 0;content: '';-webkit-transform-origin: .28571rem center;transform-origin: .28571rem center;right: 0;margin: 0 auto;}

.lines { /* @include transition(background .3s .5s ease);*/
}
.lines:before, .lines:after { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; transition: top .3s .6s ease, -webkit-transform .3s ease; transition: top .3s .6s ease, transform .3s ease; }
.mobile-nav-btn.regional-mobile { top: 4px; }


.mobile-nav nav>ul>li:last-child a{
    /* color: #daa21c !important; */
    /* border: 1px solid; */
    /* border-radius: 5px; */
    /* margin: 0px 0 0 0px !important; */
    /* display: inline-block; */
    /* background: transparent; */
}

.mobile-nav nav li a i {
    /* float: right; */
    /* position: relative; */
    /* top: 4px; */
}

.mobile-nav nav a.active:before{

font-family: Fontawesome;

content: "\f068" !important;

font-size: 10px !important;
}

.mobile-nav nav li+li a.active i {
    /* float: right; */
    /* position: relative; */
    /* top: 4px; */
    /* transform: rotate(180deg); */
}
.mobile-nav nav>ul>.ct-sub-menu>a:before {
    content: "+";
    position: absolute;
    right: 10px;
    /* font-size: 15px !important; */
}
ul.firstlevel.unstyled>li>a:before {
    content: "+";
    position: absolute;
    right: 10px;
}
ul.firstlevel.unstyled li a {
    padding: 10px 35px;
}

ul.firstlevel.unstyled li ul li a {
    padding: 10px 50px !important;
}
a#regstr-mobile {
    background: #444;
    padding: 15px;
    color: #fff;
    border-bottom: 1px solid  #fff;
}

a#regstr-mobile i {margin: 0 6px 0 0;}

ul#mobile-secnd-menu {
    display: block;
    background: #444;
    padding: 0 0 10px 0;
}

ul#mobile-secnd-menu a {
    color: #fff;
}
a#regstr-mobile.active:before {content: "" !important;}