/* 

1. v3 Add your custom Css styles below
2. Place the this code in your template: 

*/

 /* menu style start */
	/* #mainMenu nav > ul > li .multilevel-linkul-0 > li {
	    position: relative;
	}
	#mainMenu nav > ul > li .multilevel-linkul-0 > li:before {
	    line-height: 40px;
	    content: "\e930";
	    font-family: "inspiro-icons";
	    opacity: 0.6;
	    position: absolute;
	    right: 16px;
	    color: #262626;
	    font-size: 12px;
	    transition: all .2s ease;
	}
	#mainMenu nav > ul > li .multilevel-linkul-0 > li:not(.hover-active):hover:before {
	    right: 12px;
	}
		#mainMenu nav > ul > li .multilevel-linkul-0 li > .multilevel-linkul-1 {
		    margin-left: -6px;
		    left: 100%;
		    top: -1px;
		    z-index: 1;
		} */
	@media (max-width: 1024px){
		
		#mainMenu:not(.menu-overlay) nav > ul li > .multilevel-linkul-0 {
		    border: 0 none;
		    background-color: transparent;
		    display: block;
		}
		#mainMenu:not(.menu-overlay) nav > ul > li .multilevel-linkul-0 {
		    background-image: none !important;
		    max-height: 0;
		    overflow: hidden;
		    opacity: 0;
		    transition: max-height 0.5s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
		    position: static;
		    clear: both;
		    float: none;
		    box-shadow: none;
		    border: 0 !important;
		    min-width: 100%;
		    margin: 0;
		    border-radius: 0px;
		    padding: 0 16px;
		}
		#mainMenu:not(.menu-overlay) nav > ul li.hover-active > .multilevel-linkul-0 {
		    visibility: visible;
		    opacity: 1;
		    max-height: 3000px;
		}
		#mainMenu:not(.menu-overlay) nav > ul > li .multilevel-linkul-0 > li:before {
		    right: 0;
		    top: 0;
		    font-size: 16px;
		}
		#mainMenu:not(.menu-overlay) nav > ul li > .multilevel-linkul-0 > li:before {
		    right: 0;
		    transform: rotate(90deg);
		    font-size: 16px;
		}
		.multilevel-linkul-1{
			padding-right: 0 !important;
		}
		
	}
		
/* menu style end */