.menu-mobile {

    display: none;

    /*padding: 15px 7px;*/

}



.menu-mobile:after {

    content: "\f0c9";

    font-family:'Font Awesome 5 Free';

    font-weight:900;

    font-size: 1.5rem;

    padding: 0 5px 0 0;

    float: right;

    position: relative;

    top: -50px;

    right:0px;

    margin-bottom:-64px;

    color:var(--green);

}

.menu-mobileClose:after{content:'\f00d';}



.menu-dropdown-icon:before {

    content: "\f0d7";

    font-family:'Font Awesome 5 Free';

    font-weight:900;

    display: block;

    cursor: pointer;

    padding: 0.5em 1.5em;

    /*background: #0d9cd8;*/

    color: #fff;

    position:absolute;

    right:-10px;

    z-index:99;

    transform: rotate(-90deg);

    transition:.2s ease-in-out;



}

.menu-dropdown-icon:hover:before{color:var(--dark);transform: rotate(0deg);}



.menu > ul {

    margin: 0;

    width: 100%;

    list-style: none;

    padding: 0;

    position: relative;

    /* IF .menu position=relative -> ul = container width, ELSE ul = 100% width */

    box-sizing: border-box;

    text-align:center;

}



.menu > ul:before,

.menu > ul:after {

    content: "";

    display: table;

}



.menu > ul:after {

    clear: both;

}



.menu > ul > li {

display:inline-block;

    padding: 0;

    margin: 0 0 0 -5px; text-align:left; border-left:1px #fff dotted;

    position:relative;

}

.menu > ul > li:first-child{border:none;}



.menu > ul > li a {

    text-decoration: none;

    padding: 8px 50px;

    display: block;

    color:#fff; font-size:17px; font-weight:700; text-transform:uppercase;

}

.sticky .menu > ul > li > a{}

.menu > ul > li > a > i{ margin-left:5px; font-size:14px;}

.menu > ul > li:hover > a, .menu > ul > li.active > a{ color:var(--dark);}





.menu > ul > li > ul {

    display: none;

    width: 100%;

    background:#fff;

    padding: 20px 20px 15px;

    position: absolute;

    z-index: 99;

    left: 0;

    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: 25%;

    background: none;

    float: left;

}

.menu > ul > li > ul > li.fullSize {

    width: 50%;

}



.menu > ul > li > ul > li img{ width:100%; margin-top:12px;}

.menu > ul > li > ul > li a {

    color:var(--dark);

    padding:0;

    width: 100%;

    display: block;

    border-bottom: 1px dotted rgba(255,255,255,0.4); font-weight:normal; text-transform:none;

}

.menu > ul > li > ul > li > a{padding:2px 0;}



.menu > ul > li > ul > li > ul {

    display: block;

    padding: 0;

    margin: 10px 0 15px;

    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: 0;

    margin: 0;

    font-size: .6em;

}



.menu > ul > li > ul > li > ul > li a {

    border: 0; color:#fff; font-size:14px; padding:7px 15px; position:relative;

}

.menu > ul > li > ul > li > ul > li a:before{ position:absolute; content:''; left:0; top:7px; display:block; font-family: "Ionicons"; color:var(--bage);}



.menu > ul > li > ul.normal-sub {

    width: 220px;

    left: auto;

    padding: 10px 15px;

    max-height:300px; overflow-y:auto; background:var(--dark);

}



.menu > ul > li > ul.normal-sub > li {

    width: 100%;

}



.menu > ul > li > ul.normal-sub > li a {

    border: 0;

    padding:8px 0;

    border-bottom:1px #fff dotted; background:var(--dark); color:#fff;

}

.menu > ul > li > ul.normal-sub > li a:hover{color:var(--blue);}

.menu > ul > li > ul.normal-sub > li:last-child a{border:none;}





/* ––––––––––––––––––––––––––––––––––––––––––––––––––

Mobile style's

–––––––––––––––––––––––––––––––––––––––––––––––––– */



@media only screen and (max-width: 959px) {

    .menu-container {

        width: 100%;

    }

    .menu-mobile + ul{

    height: 100vh;

	overflow-y: auto;

	position: fixed;

	top: 0;

	animation: ;

	z-index: 1000;

	background:#fff;

	border-right:1px #ddd solid;

	left: -200%;

	width: 75%;

	transition:.2s ease-in-out;

	opacity:0;

	padding:20px;

    }

    .menu-mobile {

        display: block; color:#fff;

    }

    .menu-dropdown-icon:before {

        display: block;

    }

    .menu > ul {

        display: block; margin-top:0;

    }

    .menu > ul > li {

        width: 100%;

        float: none;

        display: block;

		clear:both;

		overflow:hidden; margin:0; border-left:none;

    }

    .menu > ul > li a {

        padding: 8px 10px!important;

        width: 100%;

        display: block;

        border-top:1px rgba(255,255,255,0.4) dotted; border-radius:0; color:#fff;

    }

    .menu > ul > li:first-child a{border:none;}

    .menu > ul > li a:hover{background:var(--dark); color:#fff;}

    .menu > ul > li > a > i{ display:none;}

    .menu > ul > li > ul {

        position: relative;

    }

    .menu > ul > li > ul.normal-sub {

        width: 100%;

    }

    .menu > ul > li > ul > li {

        float: none;

        width: 100%!important;

        margin-top: 0; text-align:left;

    }

    .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 {

    	left:0;

        display: block;

        transition:.2s ease-in-out;

        opacity:1;

        background:var(--green);

    }

    .menuImg{ display:none;}

    

    

    .menu-dropdown-icon:before {padding: 0.55em 1.5em;}



    

}