/*
- Name: megamenu.js - style.css
- Version: 1.0
- Latest update: 29.01.2016.
- Author: Mario Loncarek
- Author web site: http://marioloncarek.com
*/

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
megamenu.js STYLE STARTS HERE
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Screen styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.standard-menu ul {
    width: 400px !important;
    left: 0;
}
.standard-menu ul > li {
    width: 100% !important;
    margin-bottom: 1em !important;
}
.standard-menu ul > li > ul {
    margin-top: 0 !important;
}
.standard-menu ul > li > ul > li {
    margin-bottom: 0 !important;
    padding: 0 !important;
}
.standard-menu ul > li > ul > li a {
    font-size: 1.2em !important;
    font-weight: 300 !important;
}
.standard-menu ul > li > a {
    font-family: proxima-nova, sans-serif !important;
    color: #fff !important;
    font-size: 1em !important;
}
.hidden-menu-item a {
    color: #0000 !important;
    visibility: hidden !important;
}
.hidden-menu-item ul li a {
    color: #fff !important;
    visibility: visible !important;
}

.menu > ul > li > ul > li > ul > li a:not([href]):not([tabindex]) {
    color: #fff;
    font-size: 1.2em;
    font-family: proxima-nova, sans-serif;
    border: 0;
    font-weight: 900;
    padding: 0;
}

.menu-container {
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    position: absolute;
    right: -3em;
}

.menu-mobile {
    display: none;
    padding: 20px;
}

.menu-mobile:after {
    content: '\f0c9';
    font-family: 'Font Awesome 5 Free';
    color: #fff;
    font-size: 2.5rem;
    padding: 0;
    float: right;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-25%);
    -ms-transform: translateY(-25%);
    transform: translateY(-25%);
}

.menu-dropdown-icon:before {
    content: '\f067';
    font-family: 'Font Awesome 5 Free';
    display: none;
    cursor: pointer;
    float: right;
    font-size: .85em;
    font-weight: 900;
    padding: 1.5em;
    background: #0150a6;
    color: #fff;
}
.menu > ul {
    margin: 0 auto;
    width: 100%;
    list-style: none;
    padding: 0;
    position: relative;
    /* IF .menu position=relative -> ul = container width, ELSE ul = 100% width */
    box-sizing: border-box;
}

.menu > ul:before,
.menu > ul:after {
    content: "";
    display: table;
}

.menu > ul:after {
    clear: both;
}

.menu > ul > li {
    float: left;
    background: transparent;
    padding: 0;
    margin: 0;
    list-style: none;
    height: 120px;
    display: flex;
    align-items: center;
}

.menu > ul > li a {
    text-decoration: none;
    padding: 2.5em 3em;
    display: block;
    color: #fff;
}
.menu-container.v3 .menu > ul > li > a {
    padding: 2.5em 2em;
}
.menu > ul > li a:hover {
    color: #f8ad3a;
}
.menu > ul > li:hover {
    background: transparent;
}

.menu > ul > li > ul {
    display: none;
    width: 90vw;
    max-width: 1280px;
    background: rgb(6,60,118);
    background: -moz-radial-gradient(circle, rgba(6,60,118,1) 0%, rgba(1,80,166,1) 100%);
    background: -webkit-radial-gradient(circle, rgba(6,60,118,1) 0%, rgba(1,80,166,1) 100%);
    background: radial-gradient(circle, rgba(6,60,118,1) 0%, rgba(1,80,166,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#063c76",endColorstr="#0150a6",GradientType=1);
    padding: 3em 2em 2em;
    position: absolute;
    z-index: 1000000;
    right: 2em;
    top: 120px;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
}

.menu > ul > li > ul:before,
.menu > ul > li > ul:after {
    content: "";
    display: table;
}

.menu > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li {
    margin: 0;
    padding-bottom: 0;
    list-style: none;
    width: 32%;
    background: none;
    float: left;
}

.menu > ul > li > ul > li a,
.menu > ul > li > ul > li a:not([href]):not([tabindex]) {
    color: #f8ad3a;
    font-family: utopia-std, serif;
    font-size: 1.4em;
    padding: .2em 0;
    width: 95%;
    display: block;
}

.menu > ul > li > ul > li > ul {
    display: block;
    padding: 0;
    margin: 10px 0 0;
    list-style: none;
    box-sizing: border-box;
}

.menu > ul > li > ul > li > ul:before,
.menu > ul > li > ul > li > ul:after {
    content: "";
    display: table;
}

.menu > ul > li > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li > ul > li {
    float: left;
    width: 100%;
    padding: .75em 0 .25em;
    margin: 0;
    font-size: .8em;
    list-style: none;
}

.menu > ul > li > ul > li > ul > li a {
    color: #fff;
    font-size: 1.2em;
    font-family: proxima-nova, sans-serif;
    border: 0;
    font-weight: 900;
    padding: 0;
}
.menu > ul > li > ul > li > ul > li > ul {
    padding: 0;
    margin-top: 0;
}
.menu > ul > li > ul > li > ul > li > ul > li {
    list-style: none;
    margin-bottom: 0;
}

.menu > ul > li > ul > li > ul > li > ul > li a {
    border: 0;
    font-weight: 300;
    padding: 0;
}
.menu > ul > li > ul > li > ul > li > ul > li > ul {
    padding-left: 0;
    margin-top: 0;
}
.menu > ul > li > ul > li > ul > li > ul > li > ul > li {
    list-style: none;
    padding: 0 0 0 1em;
    margin: 0;
}
.menu > ul > li > ul > li > ul > li > ul > li > ul > li > ul {
    padding: 0;
}
.menu > ul > li > ul.normal-sub {
    width: 300px;
    left: auto;
    padding: 10px 20px;
}

.menu > ul > li > ul.normal-sub > li {
    width: 100%;
}

.menu > ul > li > ul.normal-sub > li a {
    border: 0;
    padding: 1em 0;
}


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Mobile style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media only screen and (max-width: 1600px) {
    .menu-container {
        right: -2em;
    }
    .menu > ul > li a {
        padding: 2.5em 2em;
    }
}
@media only screen and (min-width: 992px) and (max-width: 1400px) {
    .menu-container.v3 .menu>ul>li>a {
        font-size: 0.85em;
        padding: 2.5em 1.25em;    }

}
@media only screen and (max-width: 1280px) {
    .menu-container {
        right: -1em;
    }
    .menu > ul > li a {
        font-size: 0.9em;
        padding: 2.5em 1.25em;
    }
    .menu-container.v3 .menu > ul > li > a {
        font-size: 1em;
        padding: 2.0em 1.25em;
    }
    .menu > ul > li > ul {
        top: 118px;
        right: 1em;
    }
}
@media only screen and (max-width: 1140px) {
    .menu-container {
        right: -1em;
        width: calc(100% - 200px);
    }
    .menu > ul > li a {
        font-size: 0.85em;
        padding: 2.5em 1em;
    }
    .menu > ul > li > ul {
        width: calc(100vw - 4em);
    }
    @media only screen and (min-width: 992px) and (max-width: 1400px) {
        .menu-container.v3 .menu>ul>li>a {
            font-size: 0.71em;
            padding: 2.5em 1.15em;
        }           
    }   
}

@media only screen and (max-width: 991px) {
    .hidden-menu-item a {
        color: #0000 !important;
        visibility: hidden !important;
        display: none !important;
    }
    .hidden-menu-item {
        margin-top: 0 !important;
    }
    .hidden-menu-item ul li a {
        color: #fff !important;
        visibility: visible !important;
        display: block !important;
    }
    .standard-menu ul {
        width: 100% !important;
    }
    .menu-container {
        width: 100%;
        position: absolute;
        right: 1em;
    }
    .menu-mobile {
        display: block;
    }
    /* .menu-mobile:after {
        right: -18px;
    } */
    .menu-dropdown-icon:before {
        display: block;
    }
    .menu > ul {
        display: none;
    }
    .menu > ul > li {
        width: 100%;
        float: none;
        display: block;
    }
    .menu > ul > li a {
        padding: 1.5em;
        width: 100%;
        display: block;
    }
    .menu > ul > li > ul {
        position: relative;
        width: 100%;
        right: 0;
        background: #063C76;
        padding: 1em 1.5em;
        top: unset;
    }
    .menu > ul > li > ul.normal-sub {
        width: 100%;
    }
    .menu > ul > li > ul > li {
        float: none;
        width: 100%;
        margin-top: 20px;
    }
    .standard-menu ul li a {
        font-size: 1em !important;
    }
    .menu > ul > li > ul > li a {
        font-size: 1.1em;
    }
    .menu > ul > li > ul > li:first-child {
        margin: 0;
    }
    .menu > ul > li > ul > li > ul {
        position: relative;
    }
    .menu > ul > li > ul > li > ul > li {
        float: none;
    }
    .menu .show-on-mobile {
        display: block;
        position: absolute;
        z-index: 1000000;
        right: -1em;
        background: #0150a6;
        /* background: -moz-radial-gradient(circle, rgba(0,117,221,1) 0%, rgba(6,60,118,1) 100%);
        background: -webkit-radial-gradient(circle, rgba(0,117,221,1) 0%, rgba(6,60,118,1) 100%);
        background: radial-gradient(circle, rgba(0,117,221,1) 0%, rgba(6,60,118,1) 100%); */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0075dd",endColorstr="#063c76",GradientType=1);
        top: calc(100% + .7em);
    }
    .menu .show-on-mobile {
        width: 100%;
    }
}
@media only screen and (max-width: 767px) {
    .menu-container {
        position: absolute;
        right: 0;
    }
    .menu .show-on-mobile {
        right: 0;
    }
}