/* 
    Created on : Feb 9, 2022, 3:11:38 PM
    Author     : Apon
*/


nav .mega ul.sub-menu {
    display: flex;
    flex-wrap: wrap;
    padding: 20px 10px;
    width: 100%;
    flex-direction: initial;
    justify-content: initial;
}
nav .mega {
    position: static !important;
}
nav .mega:hover ul.sub-menu {
    left: 0;
}
nav .mega:hover ul.sub-menu li {
    padding: 0 10px;
}
nav .mega.mega-4 ul.sub-menu li {
    flex-basis: 25%;
    max-width: 25%;
}
nav .mega.mega-5 ul.sub-menu li {
    flex-basis: 20%;
    max-width:20%;
}
nav .mega.mega-6 ul.sub-menu li {
    flex-basis: 16.666%;
    max-width: 16.666%;
}
nav .mega ul.sub-menu li a {
    width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: left !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    overflow: hidden;
    border-bottom: 1px solid #f4f4f4;
}
nav .mega ul.sub-menu li.current-menu-item a {
    border-color: var(--primary-color);
    color: var(--primary-color);
}
body nav.main-navigation .mega > a {
    padding: 24px 8px;
}


@media (min-width: 1200px) {
    body ul > li.current_page_item > a, body ul > li.current-menu-ancestor > a {
        font-weight: 500;
    }
    body .has-mega-menu {
        align-items: center;
        position: static;
    }
	
	ul.has-mega-menu li.mega-menu:hover > ul > li > a {
		font-weight: 400;
		color: #444;
	}

    ul.has-mega-menu li:hover > ul, .main-navigation ul li.focus > ul{
        right:0;
        border: 0;
    }
    header {
        position: relative;
    }
	.mega-menu:hover > a{
		position:relative;
	}
	.mega-menu:hover > a::after {
    	content: "";
    	position: absolute;
    	width: 0;
    	height: 0;
    	border: 10px solid transparent;
    	border-bottom-color: #ea2629;
    	bottom: -15px;
    	left: 50%;
    	transform: translate(-50%,0);
    }
    .menu-item-has-children.mega-menu {
    	padding-top: 13px;
    	padding-bottom: 13px;
    	position: static;
    }
    .header-inner .container {
        position: relative;
    }
    .siatex-main-navigation.site-navigation li.mega-menu {
        position: static;
    }

    .has-mega-menu .menu-item.menu-item-has-children.mega-menu > ul.sub-menu > li ul {
        position: initial;
        width: 100%;
        background: transparent;
        box-shadow: none;
        min-width: initial;
    }
    ul.has-mega-menu li.mega-menu:hover ul {
        display: inherit;
        position: absolute;
        left: 0;
        right: 0;
        width: 100%;
    }
    ul.has-mega-menu li.mega-menu:hover ul li ul {
        display: inherit;
        position: relative;
        left: 0;
    }
    ul.has-mega-menu li.mega-menu:hover ul li {
        position: static;
        display: block;
        padding-top: 0em;
        padding-right: 0 !important;
        width: 90%;
        text-align: left;
        border-bottom: none;
    }
    ul.has-mega-menu li.mega-menu:hover ul li ul li {
        float: none;
        padding-top: 0;
        padding-left: 0;
        border-bottom: 1px solid #f6f6f6;
    }
    .site-navigation .menu li {
        top: unset;
    }
    ul.has-mega-menu li.mega-menu:hover ul {
        display: inherit;
        position: absolute;
        left: 0;
        right: 0;
        width: 100%;
        background-color: #fff;
    }
 
	ul.has-mega-menu li.mega-menu > ul {
	  min-height: 200px;
	}

	 ul.has-mega-menu li.mega-menu:hover > ul {
		left: 0px;
		padding: 15px 20px;
		border: none;
		border-top: 3px solid #ea2629;
		display: flex;
		justify-content: space-around;
		flex-direction: row;
		right: 0;
		box-shadow: none;
		z-index: 99;
		border-bottom: 1px solid #ea2629;
	}
    .main-menu li a {
        display: block;
        line-height: 40px;
    }
    ul.has-mega-menu li.mega-menu:hover>ul>li>a {
        font-weight: 400;
    }
    ul > li.current_page_item > a {
        font-weight: 500;
    }
    .site-navigation>.menu>li>a {
        padding: 35px 25px;
    }
    .site-header {
        padding: 0;
    }
    .has-mega-menu .menu-item.menu-item-has-children.mega-menu > ul.sub-menu > li ul li a {
        font-weight: 300;
        padding-top: 2px;
        padding-bottom: 2px;
    }

}

@media only screen and (max-width: 580px) {
    .has-mega-menu .menu-item.menu-item-has-children.mega-menu > ul.sub-menu > li ul {
        position: initial;
        width: 100%;
        padding-left: 10px;
        display: none;
    }
    body .main-navigation ul.sub-menu > li > a {
        text-align: left !important;
    }
    nav .mega ul.sub-menu li {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100%;
    }

    nav .mega ul.sub-menu{
        display: none;
    }
    body nav.main-navigation .mega > a {
        padding: 8px 10px;
    }
    nav .mega ul.sub-menu li a {
        border-bottom: 1px solid #222121;
    }
}