/* universal classes used: icube-icon-bars, icube-icon-times, grid-col-33, grid-col-66 */
.mobile-menu-body-lock {overflow: hidden}
.mobile-menu-trigger,
.mobile-menu-trigger-label,
.mobile-menu .mobile-menu-submenu-trigger,
.mobile-menu .mobile-menu-submenu-trigger-label,
.mobile-menu .mobile-menu-submenu-box {display: none}

.mobile-menu-trigger-label {
    background: #fff; border: none; font-size: 36px; color: #000; text-align: center; position: absolute; right: 10px;
    top: 50%; margin-top: -18px; z-index: 12;
    -webkit-transition: top .2s, right .2s;
    -o-transition: top .2s, right .2s;
    transition: top .2s, right .2s
}
.mobile-menu .mobile-menu-submenu-trigger-label {
    display: none; font-size: 16px; padding: 20px 15px; position: absolute; top: 0; right: 0; height: 100%; width: 60px; 
    border-left: 1px solid #ccc; color: #000;
}
.mobile-menu .mobile-menu-submenu-trigger-label::after {
    content: "\e02e"; font-family: "icube-font"; font-size: 16px; line-height: 1; margin: 0 6px; position: relative; top: 2px; display: block;
    background: none; width: auto; height: auto
} 
.mobile-menu-trigger-label .mobile-menu-trigger-label-part::before {display: block}
.mobile-menu-trigger:checked + .mobile-menu-trigger-label {top: 38px; right: 20px}
.mobile-menu-trigger:checked ~ .mobile-menu {right: 0}
.mobile-menu-trigger:checked ~ .mobile-menu .mobile-menu-submenu-trigger:checked + .mobile-menu-submenu-trigger-label {
    position: fixed; z-index: 13; right: 80px; top: 20px; background: #fff; border: 1px solid; font-size: 14px; padding: 0 6px; width: auto; height: 40px;
    line-height: 38px; color: #000
}

.mobile-menu {       
    -webkit-transition: right .2s;
    -moz-transition: right .2s;
    -ms-transition: right .2s;
    transition: right .2s
}
.mobile-menu .mobile-menu-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}
.mobile-menu .mobile-menu-list > li > a {
    display: block; padding: 0 10px 20px; font-size: 14px;
    -webkit-transition: padding .2s;
    -moz-transition: padding .2s;
    -ms-transition: padding .2s;
    transition: padding .2s
}
.mobile-menu .mobile-menu-list > li > a:not(.mobile-menu-submenu-link)::after {
    content: ""; display: block; width: 0; height: 3px; background-color: #18396e; position: relative; top: 3px;
    -webkit-transition: width .2s;
    -moz-transition: width .2s;
    -ms-transition: width .2s;
    transition: width .2s
}
.mobile-menu .mobile-menu-has-submenu::after {
    bottom: 0; left: 50%; content: ""; height: 15px; width: 15px; position: absolute; background-color: #fff; display: none;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5);
    -webkit-transform: translate(-50%,50%) rotate(135deg);
    -ms-transform: translate(-50%,50%) rotate(135deg);
    transform: translate(-50%,50%) rotate(135deg)
}
.mobile-menu .mobile-menu-submenu-box {
    display: none; position: absolute; background-color: #fff; right: -304px; top: 42px; border-radius: 5px; overflow: hidden;
    -webkit-box-shadow: 0px 0 3px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0 3px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0 3px 0px rgba(0,0,0,0.5);
    -webkit-transition: top .2s, right .2s;
    -moz-transition: top .2s, right .2s;
    -ms-transition: top .2s, right .2s;
    transition: top .2s, right .2s
}
.mobile-menu .mobile-menu-submenu {padding: 30px 0; z-index: 1; position: relative; background-color: #fff}
.mobile-menu .mobile-menu-submenu ul {width: 33.333%; padding: 0 20px}
.mobile-menu .mobile-menu-submenu > li > a {
    display: block; padding: 10px 20px; font-size: 14px;
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -ms-transition: color .2s;
    transition: color .2s
}
.mobile-menu .mobile-menu-submenu ul > li a {display: block; padding: 5px 0; color: #4c4c4c; font-size: 13px}
.mobile-menu .mobile-menu-submenu ul > li img {display: block; max-width: 68px}

/* modifiers */
.mobile-menu .mobile-menu-list > li > .active {color: #18396e}
.mobile-menu .mobile-menu-submenu-box.is-submenu-box-2 {right: -114px}
.mobile-menu .mobile-menu-submenu ul > li .is-highlighted {display: block; font-size: 15px; font-weight: 500; color: #122f4d; padding: 8px 0}
.mobile-menu .mobile-menu-submenu ul.is-type-2 {width: 100%}
.mobile-menu .mobile-menu-submenu ul.is-type-2 li {width: 66.666%; padding: 0 10px}
.mobile-menu .mobile-menu-submenu ul.is-type-2 li:nth-child(2n+3) {width: 33.333%; padding: 0}
.mobile-menu .mobile-menu-submenu ul.is-type-2 li:first-child {width: 100%}
.mobile-menu .mobile-menu-list > li > a.is-red {color:#D8000B; font-weight: 700;}
/* overwrites */
.mobile-menu-trigger-label .mobile-menu-trigger-label-part.icube-icon-bars {display: block}
.mobile-menu-trigger-label .mobile-menu-trigger-label-part.icube-icon-bars::before {width: 36px; height: 36px}
.mobile-menu-trigger-label .mobile-menu-trigger-label-part.icube-icon-times {
    display: none; border: 1px solid; font-size: 14px; padding: 0 6px; height: 40px; line-height: 38px; color: #000;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}
.mobile-menu-trigger-label .mobile-menu-trigger-label-part.icube-icon-times::before {margin: 0 6px}
.mobile-menu-trigger:checked + .mobile-menu-trigger-label .mobile-menu-trigger-label-part.icube-icon-bars {display: none}
.mobile-menu-trigger:checked + .mobile-menu-trigger-label .mobile-menu-trigger-label-part.icube-icon-times {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.mobile-menu .mobile-menu-submenu .grid-col-66,
.mobile-menu .mobile-menu-submenu .grid-col-33 {padding: 0 20px}
.mobile-menu .mobile-menu-submenu .grid-col-66 ul:last-child {padding-right: 10px}
.mobile-menu .mobile-menu-submenu .grid-col-33 {border-left: 1px solid #e8e8e8}

@media screen and (min-width: 768px) {
    /* hovers */
    .mobile-menu.js-has-clickables .mobile-menu-list > li > a:hover::after {width: 100%}
    .mobile-menu.js-has-clickables .mobile-menu-has-submenu:hover::after {display: block}
    .mobile-menu.js-has-clickables .mobile-menu-has-submenu:hover > .mobile-menu-submenu-box {display: block}
    .mobile-menu.js-has-clickables .mobile-menu-submenu ul > li a:hover {color: #18396e}
}
@media screen and (max-width: 1164px) {
    .mobile-menu .mobile-menu-list > li > a {font-size: 14px; padding-bottom: 8px}  
    .mobile-menu .mobile-menu-submenu-box {position: fixed; width: 100%; right: 0; top: 80px}
    .mobile-menu .mobile-menu-submenu,
    .mobile-menu .mobile-menu-submenu ul {padding-right: 10px; padding-left: 10px}
    .mobile-menu .mobile-menu-submenu > li > a {font-size: 12px}    
    .mobile-menu .mobile-menu-has-submenu::after {display: none !important}
    .mobile-menu .mobile-menu-submenu ul > li a {font-size: 13px}
    .mobile-menu .mobile-menu-submenu ul > li img {max-width: 49px}
    
    /* modifiers */
    .mobile-menu .mobile-menu-submenu-box.is-submenu-box-2 {width: auto; position: absolute; top: 27px; right: -127px}
    .mobile-menu .mobile-menu-submenu ul > li .is-highlighted {font-size: 13px; padding-top: 5px; padding-bottom: 5px}
}
@media screen and (max-width: 980px) {
    .mobile-menu-trigger:checked ~ .mobile-menu .mobile-menu-submenu-trigger:checked ~ .mobile-menu-submenu-box {right: 0}
    .mobile-menu-trigger:checked ~ .mobile-menu .mobile-menu-submenu-trigger:checked ~ .mobile-menu-submenu-box .mobile-menu-submenu::before {
        content: ""; display: block; width: 100%; height: 80px; background-color: #fff; position: fixed; top: 0; right: 0; z-index: 2
    }
    .mobile-menu-trigger-label {display: block}
        
    .mobile-menu,
    .mobile-menu .mobile-menu-submenu-box {
        left: auto; width: 100%; position: fixed; top: 0; right: -100%; height: 100%; background-color: #fff; 
        overflow: auto; z-index: 11
    }
    .mobile-menu .mobile-menu-submenu-box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-line-pack: start;
        align-content: flex-start
    }
    .mobile-menu .mobile-menu-list {
        width: 100%; clear: both; margin-top: 80px; padding: 10px 0;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
    .mobile-menu .mobile-menu-list > li {width: 100%; border-bottom: 1px solid #ccc; min-height: 61px}
    .mobile-menu .mobile-menu-list > li > a {font-size: 16px; padding-top: 20px; padding-bottom: 20px}
    .mobile-menu .mobile-menu-list > li > a:not(.mobile-menu-submenu-link)::after {display: none}
    
    .mobile-menu .mobile-menu-list > li > .mobile-menu-submenu-link {padding-right: 70px}
    .mobile-menu .mobile-menu-submenu-link::after {content: "\e01c"; font-family: "icube-font"; margin-left: 10px; position: relative; top: 2px}
    
    .mobile-menu .mobile-menu-submenu {
        width: 100%; margin-top: 80px; padding:0;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
    .mobile-menu .mobile-menu-submenu ul {width: 100%; margin-bottom: 10px; padding-right: 0; padding-left: 0}
    .mobile-menu .mobile-menu-submenu ul > li {border-bottom: 1px solid #ccc}
    .mobile-menu .mobile-menu-submenu ul > li a {font-size: 16px; padding: 15px 20px}
    .mobile-menu .mobile-menu-submenu ul > li img {max-width: 29px; margin-right: 10px}
    .mobile-menu .mobile-menu-submenu ul > li:first-child a {
        padding-right: 20px; padding-left: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
      
    .mobile-menu .mobile-menu-submenu-trigger-label {display: block}
    .mobile-menu .mobile-menu-submenu-trigger:checked + .mobile-menu-submenu-trigger-label::before {
        content: "\4c"; font-family: "icube-font"; line-height: 1; margin: 0 6px; position: relative; top: 2px
    }
    .mobile-menu .mobile-menu-submenu-trigger:checked + .mobile-menu-submenu-trigger-label::after {display: none}
    
    /* modifiers */
    .mobile-menu .mobile-menu-submenu-box.is-submenu-box-2 {position: fixed;  top: 0; right: -100%; width: 100%}
    .mobile-menu .mobile-menu-submenu ul > li .is-highlighted {font-size: 16px; padding: 15px 20px}
    .mobile-menu .mobile-menu-submenu ul.is-type-2 li,
    .mobile-menu .mobile-menu-submenu ul.is-type-2 li:nth-child(2n+3) {width: 100%; padding: 0}
    
    /* overwrites */
    .mobile-menu .mobile-menu-submenu .grid-col-66,
    .mobile-menu .mobile-menu-submenu .grid-col-33 {
        width: 100%; padding: 0;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
    .mobile-menu .mobile-menu-submenu .grid-col-66 ul:last-child {padding-right: 0}
    .mobile-menu .mobile-menu-submenu .grid-col-33 {border-left: none; margin-top: 10px}
}