﻿
.LanguageBox-Mobile
{
    background-color: #666;    
}

@media screen and (min-width: 979px) {

    .LanguageBox .memberBox:first-of-type {
        display: none
    }        

    .logoff-top-nav-list-item
    {
        margin-left: 0!important;
        padding-left: 16px!important;;
    }

    .btnLogout
    {
        padding-right: 16px!important;        
    }

    .header .main-menu li .linkClass {
        position: relative;
    }
    .header .main-menu li .linkClass:after {
        content: "";
        display: inline-block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #d0343a;
        height: 2px;
        opacity: 0
    }
    .header .main-menu li.activeLink .linkClass:after {
        opacity: 1
    }
    .header .menu {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        margin: 0;
        z-index: 1;
    }
    .header .menu, .header .main-menu {
        background-color: transparent !important;
    }
    .header .main-menu > li > a:visited {
        color: #5a5858;
    }
    .header .main-menu {
        padding: 0 0 0 calc(2.5% + 168px);
        height: 61px;
    }
    .main-menu li .linkClass {
        padding: 15px;
    }
    .header .main-menu > li {
        height: 62px;
    }
    .header .header-normal .header-content {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: end;
        justify-content: flex-end;
        width: auto;
        min-height: 50px;
        z-index: 5;
    }
    .header .logo {
        z-index: 5;
    }
    .header .header-normal .logo > a {
        width: 160px;
    }
    .header .logo > a {
        padding-top: 0;
    }
    .nav-wrapper {
        height: 62px;
    }
    .submenuCon {
        top: 62px;
        border-top: 1px solid #e8e8e9;
    }
    .header .main-menu > li > a {
        line-height: 33px;
    }
    .header-right-top {
        margin-bottom: 0;
    }

    .memberBox {
         margin-left: 0!important;
    }

    .header .nav, .LanguageBox {
        margin-top: 0;
        padding-right: 16px;
    }

    .header .nav-menu a, .se-dropdown.dropdown-lang .Language, .se-dropdown.dropdown-lang .Lang-mb, .se-dropdown.dropdown-lang .dropdown-text, .se-dropdown.dropdown-lang .dropdown-menu, .member-menu > li a {
        line-height: 62px;
    }
    .Language, .member-menu > li {
        border-right: none;
    }
    .header-right-bottom {
        display: -ms-flexbox;
        display: flex;
    }
    .LanguageBox .memberBox {
        -ms-flex-order: 1;
        order: 1;
        margin-left: 0;
    }
    div.LanguageBox > div.memberBox > ul > li:nth-child(1) > a {
        padding: 0 16px;
    }
    .header-search {
        padding: 16px 0 16px 16px;
        margin-left: 0;
        -ms-flex-order: 2;
        order: 2;
        display: block;
    }
    .header-search .btn-black {
        margin-right: 2px;
    }
    .header .nav-menu > li {
        margin: 0;
    }
    .header-search .btn-black, .header-search .btn-black:focus {
        color: #5a5858;
        font-size: 22px;
        width: auto;
        height: auto;
        top: 50%;
        transform: translateY(-50%);
    }
    .header-search input[type="text"], .header-search input[type="text"]:focus {
        color: #5a5858;
        padding: 3px 20px 3px 5px;
        width: 150px;
        -webkit-transition: .2s ease-in-out;
        transition: .2s ease-in-out;
    }
    .header .nav {
        margin-right: 0;
    }
    .Language {
        margin-right: 0;
    }
    .se-dropdown.dropdown-lang {
        margin-top: 0;
        margin-left: 0;
    }
    .member-menu > li {
        padding-right: 5px;
    }
    .header .header-share {
        margin-left: 0;
    }
    .se-dropdown.dropdown-lang .dropdown-menu {
        margin-top: 2px;
    }

    /*
    .se-dropdown.dropdown-lang .Language, .member-menu > li:last-child {
        display: none
    }
    */

    .member-menu > li {
        padding-right: 0;
    }
}
/*****************************************************************************************/
@media only screen and (min-width: 980px) and (max-width: 1270px) {
    .header .header-normal .header-content {
        width: 105.2%;
        position: absolute;
        bottom: -53px;
        left: 50%;
        background-color: #fff;
        transform: translateX(-50%);
    }
    .header .nav-menu a, .se-dropdown.dropdown-lang .Language, .se-dropdown.dropdown-lang .Lang-mb, .se-dropdown.dropdown-lang .dropdown-text, .se-dropdown.dropdown-lang .dropdown-menu, .member-menu > li a {
        line-height: 50px;
    }
    .header-search {
        padding: 10px 0 10px 28px;
    }
    .header-normal {
        height: 116px;
    }
    .header-right-top {
        padding-left: calc(2.5% + 176px);
    }
    .header .header-normal .header-content {
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
}
/*****************************************************************************************/
@media only screen and (max-width: 980px) {
    .header .menu 
    {
        background-color: rgba(204, 51, 51, 1);
    }

    ul > li.member
    {
        display: none!important;
    }

    .mobile-nav-menu-my-account-link
    {
        color: #fff!important;        
    }

    .member-menu-my-account-mobile
    {
        border-right: 1px solid #cecece;
        height: 14px;
    }
    
    .member-menu-logoff-mobile
    {
        height: 14px;
    }
    
    html.offcanvas-open body {
        overflow: hidden;
        position: fixed;
        width: 100vw;
    }

    .header-mobile {
        position: relative;
        z-index: 1000;
    }

    .header .header-mobile .menu {
        position: absolute;
        width: 100vw;
        height: 100%;
        height: calc(100% - 60px);
        top: 60px;
        left: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overflow: hidden;
        transform: translateX(-100%);
        transition: all ease-out 0.3s;
        z-index: 1;
    }
    html.offcanvas-open .header .header-mobile .menu {
        position: fixed;
    }
    .header .header-mobile .menu .menu.MenuCon {
        position: inherit;
        width: 100%;
        height: inherit;
        top: inherit;
        left: inherit;
        overflow: inherit;
        transform: none;
        z-index: 1;
        padding: 0 !important;
    }
    .header .menu.menu-open .main-menu {
        height: 100%;
    }
    .header .menu.menu-open {
        transform: translateX(0);
    }
    .main-menu.top-nav {
        overflow-x: hidden;
        overflow-y: auto;
    }
    .header .header-mobile .menu .breadCrumbHolder {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #666;
        color: #Fff;
        z-index: 5;
    }
    html.offcanvas-open .header .row.top {
        position: fixed;
        z-index: 5;
        background-color: #fff;
    }
    .header-mobile .LanguageBox {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center;
        height: 50px;
        width: 100%;
        padding: 0;
        float: none;
    }
    .header .main-menu .LanguageBox .memberBox:nth-of-type(2) .member-menu li:nth-of-type(2) {
        display: none
    }
    .header .main-menu .LanguageBox .memberBox {
        margin: 0;
    }
    .header .main-menu .LanguageBox .memberBox, .header-mobile .se-dropdown.dropdown-lang {
        width: calc(100% /2);
    }
    .header-mobile .se-dropdown.dropdown-lang {
        -ms-flex-order: 1;
        order: 1;
    }
    .header .main-menu .LanguageBox .memberBox {
        -ms-flex-order: 2;
        order: 2;
    }
    .header-mobile .se-dropdown.dropdown-lang {
        border-left: none !important;
        border-right: 1px solid #cecece;
        padding: 0;
    }
    .header-mobile .member-menu > li {
        border: none;
    }
    .header-mobile .se-dropdown.dropdown-lang {
        margin-left: 0;
        border-left: 1px solid #cecece;
        padding-left: 15px;
        padding: 0;
        text-align: center;
    }
    .se-dropdown.dropdown-lang {
        margin-top: 0;
        margin-left: 0;
        float: none;
    }
    .header .header-mobile .menu > div.menu-content {
        height: calc(100% - 25px);
        padding-bottom: 50px;
    }
    .se-dropdown.dropdown-lang > i {
        display: none;
    }
    .se-dropdown.dropdown-lang > .dropdown-text {
        position: relative;
        color: #fff !important;
        display: inline-block;
    }
    .se-dropdown.dropdown-lang > .dropdown-text, .header .header-mobile .main-menu li a.LoginOpen.btnLogin, .se-dropdown.dropdown-lang > .dropdown-text:hover, .header .header-mobile .main-menu li a.LoginOpen.btnLogin:hover {
        color: #fff;
        padding-left: 34px !important;
    }
    .se-dropdown.dropdown-lang > .dropdown-text::after, .header .header-mobile .main-menu li a.LoginOpen.btnLogin::after {
        font-family: MaterialDesignIcons;
        visibility: visible;
        overflow: inherit;
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        height: auto;
        font-size: 21px;
    }
    .se-dropdown.dropdown-lang > .dropdown-text::after {
        content: "\F59F";
    }
    .header .header-mobile .main-menu li a.LoginOpen.btnLogin {
        display: inline-block;
        background-color: transparent;
        padding: 0;
        position: relative;
    }
    .header .header-mobile .main-menu li a.LoginOpen.btnLogin::after {
        content: "\F009";
    }

    .upward.se-dropdown > .dropdown-menu {
        bottom: 232%;
    }

    .header .menu-toggle-hamburger {
        display: block;
        width: 24px;
        height: 3px;
        background: #5a5858;
        position: relative;
    }
    .header .menu-toggle {
        position: relative;
        width: 25px;
        height: 15px;
        padding: 0;
        margin: 0 10px;
        z-index: 1
    }
    .header-mobile .header-search.active .searchEnter, .header-mobile .header-search.active .searchClose {
        z-index: 999;
        background-color: #fff;
    }
    .header .menu-toggle-hamburger, .header .menu-toggle::before, .header .menu-toggle::after {
        content: '';
        overflow: visible;
        visibility: visible;
        display: block;
        background: white;
        width: 25px;
        height: 3px;
        position: absolute;
        border-radius: 2px;
        transition: all 0.4s;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        background-color: #5a5858;
    }
    .header .menu-toggle::before, .header .menu-toggle::after {
        visibility: visible;
    }
    .header .menu-toggle::before {
        top: 0;
    }
    .header .menu-toggle-hamburger {
        top: 50%;
    }
    .header .menu-toggle::after {
        top: 100%;
    }
    html.offcanvas-open .header .menu-toggle::before {
        transform: translateY(5px) translateX(0) rotate(45deg);
        -webkit-transform: translateY(5px) translateX(0) rotate(45deg);
        -moz-transform: translateY(5px) translateX(0) rotate(45deg);
    }
    html.offcanvas-open .header .menu-toggle-hamburger {
        opacity: 0;
    }
    html.offcanvas-open .header .menu-toggle::after {
        transform: translateY(-10px) translateX(0) rotate(-45deg);
        -webkit-transform: translateY(-10px) translateX(0) rotate(-45deg);
        -moz-transform: translateY(-10px) translateX(0) rotate(-45deg);
    }
    .header .menu-toggle-hamburger::before, .header .menu-toggle-hamburger::after {
        display: none;
    }
    .header-mobile .header-content > div {
        margin-top: 14px;
    }
    .header-mobile .header-search {
        margin-top: 0;
        background-color: #fff;
    }
    .header-mobile .header-search input[type="text"] {
        background-color: #fff;
    }
    .header-mobile .header-search.active input[type="text"] {
        width: 92%;
        padding: 0 4%;
        z-index: 999
    }
}

@media screen and (max-width: 980px)
{
    .header ~ .container {
        margin-top: 0px!important;
    }

    .btnLogout
    {
        color: #fff;
    }
}

@media only screen and (min-width: 980px) and (max-width: 1270px) 
{
    .submenuCon {    
        top: 116px;    
    }    
}