@import url(../../common/css/menustyle.css);
@import url(../../common/css/jshover.css);
@import url(../../common/css/megamenu-components.css);

/*****************************
 * MEGA MENU 
 *****************************/
/* Tooltip Level2*/
ul.navi div.fxcontent ul.level2:before{border-width: 0;}

ul.navi li.level1 div.mega-content:before{
    content:"";position:Absolute;top:-19px;left: 43px;z-index: 8;right: auto;
	border:10px solid transparent;
	border-bottom:9px solid #a1af33;
}
ul.navi li.level1 div.wrap-toleft div.mega-content:before{left: auto;right: 43px;}
ul.navi li.level1 div.mega-content div.mega-content:before{border: none;}

ul.navi li.level1 div.mega-content:before{border-color:transparent transparent #3db3c4 transparent;}
ul.navi li.menu1 div.mega-content:before{border-color:transparent transparent #3097a5 transparent;}
ul.navi li.menu2 div.mega-content:before{border-color:transparent transparent #cd798c transparent;}
ul.navi li.menu3 div.mega-content:before{border-color:transparent transparent #a1af33 transparent;}
ul.navi li.menu4 div.mega-content:before{border-color:transparent transparent #cd6c25 transparent;}
ul.navi li.menu5 div.mega-content:before{border-color:transparent transparent #62b263 transparent;}
ul.navi li.menu6 div.mega-content:before{border-color:transparent transparent #4ab0dc transparent;left: 68%;}


ul.navi li.menu3 ul.level2:before{border: none;}
ul.navi li.level1.menu3 li.level2,
ul.navi li.level1.menu3 li.level3,
ul.navi li.level1.menu3 li.level4{
	background: #F1E8DE;
	box-shadow: none;
}

/* Menu Level2*/
ul.navi div.fxcontent{
	position: absolute;	
	display: block;
	background: #ddd;
	border: 1px solid rgba(255,255,255,0.2);
	border-radius:  10px;
	margin-top: 10px !important;
    box-shadow: 1px 2px 3px rgba(0,0,0,0.5);
}
ul.navi div.fxcontent div.fxcontent{margin-top: 0px !important;}
ul.navi div.fxcontent>div.mega-content.insidefx{
	top: auto;
	right: auto;
	bottom: auto;
	left: auto;
}

#meganavigator ul.subnavi > li{
	background: #f1e8de;
	background: rgba(241,232,222,0.9);
	box-shadow: none;
	padding: 0;
	margin-bottom: 1px;
}
#meganavigator ul.subnavi > li.hover,
#meganavigator ul.subnavi > li.active{background: #fff;}

/*Color default  */
ul.navi li.level1  div.fxcontent{
		background: #3db3c4;
		background-color: rgba(61,179,196,0.9);
	}
	ul.navi li.level1 li.hover > a.level2:before,
	ul.navi li.level1 li.hover > a.level3:before,
	ul.navi li.level1 li.active > a.level2:before,
	ul.navi li.level1 li.active > a.level3:before{
		color: #6cbbc6;
	}
	
	ul.navi li.level1 li.level2.hover a.level2,
	ul.navi li.level1 li.level3.hover a.level3,
	ul.navi li.level1 li.level2.active a.level2,
	ul.navi li.level1 li.level3.active a.level3{
		color: #6cbbc6;
	}

/*Color Pink  */
ul.navi li.menu2 div.fxcontent{
		background: #cd798c;
		background-color: rgba(205,121,140,0.9);
	}
	ul.navi li.menu2 li.hover > a.level2:before,
	ul.navi li.menu2 li.hover > a.level3:before,
	ul.navi li.menu2 li.active > a.level2:before,
	ul.navi li.menu2 li.active > a.level3:before{
		color: #cd798c;
	}
	
	ul.navi li.menu2 li.level2.hover a.level2,
	ul.navi li.menu2 li.level3.hover a.level3,
	ul.navi li.menu2 li.level2.active a.level2,
	ul.navi li.menu2 li.level3.active a.level3{
		color: #cd798c;
	}

/*Color Green  */
ul.navi li.menu3 div.fxcontent{
		background: #a1af33;
		background-color: rgba(160,176,6,0.9);
	}
	ul.navi li.menu3 li.hover > a.level2:before,
	ul.navi li.menu3 li.hover > a.level3:before,
	ul.navi li.menu3 li.active > a.level2:before,
	ul.navi li.menu3 li.active > a.level3:before,
	
	ul.navi li.menu3 li.hover > div.level2:before,
	ul.navi li.menu3 li.hover > div.level3:before,
	ul.navi li.menu3 li.active > div.level2:before,
	ul.navi li.menu3 li.active > div.level3:before{
		color: #a1af33;
	}
	
	ul.navi li.menu3 li.level2.hover a.level2,
	ul.navi li.menu3 li.level3.hover a.level3,
	ul.navi li.menu3 li.level2.active a.level2,
	ul.navi li.menu3 li.level3.active a.level3,
	
	ul.navi li.menu3 li.level2.hover div.level2,
	ul.navi li.menu3 li.level3.hover div.level3,
	ul.navi li.menu3 li.level2.active div.level2,
	ul.navi li.menu3 li.level3.active div.level3{
		color: #a1af33;
	}
    
/*Color Red  */
ul.navi li.menu4 div.fxcontent{
		background: #cd6c25;
		background-color: rgba(203,108,37,0.9);
	}
	ul.navi li.level1.menu4 li.hover > a.level2:before,
	ul.navi li.level1.menu4 li.hover > a.level3:before,
	ul.navi li.level1.menu4 li.active > a.level2:before,
	ul.navi li.level1.menu4 li.active > a.level3:before,
	
	ul.navi li.level1.menu4 li.hover > div.level2:before,
	ul.navi li.level1.menu4 li.hover > div.level3:before,
	ul.navi li.level1.menu4 li.active > div.level2:before,
	ul.navi li.level1.menu4 li.active > div.level3:before{
		color: #cd6c25;
	}
	ul.navi li.menu4 li.level2.hover a.level2,
	ul.navi li.menu4 li.level3.hover a.level3,
	ul.navi li.menu4 li.level2.active a.level2,
	ul.navi li.menu4 li.level3.active a.level3,
	
	ul.navi li.menu4 li.level2.hover div.level2,
	ul.navi li.menu4 li.level3.hover div.level3,
	ul.navi li.menu4 li.level2.active div.level2,
	ul.navi li.menu4 li.level3.active div.level3{
		color: #cd6c25;
	}
	
/*Color Turquoise  */
ul.navi li.menu5 div.fxcontent{
		background: #62b263;
		background-color: rgba(95,172,96,0.9);
	}
	ul.navi li.level1.menu5 li.hover > a.level2:before,
	ul.navi li.level1.menu5 li.hover > a.level3:before,
	ul.navi li.level1.menu5 li.active > a.level2:before,
	ul.navi li.level1.menu5 li.active > a.level3:before{
		color: #62b263;
	}
	
	ul.navi li.menu5 li.level2.hover a.level2,
	ul.navi li.menu5 li.level3.hover a.level3,
	ul.navi li.menu5 li.level2.active a.level2,
	ul.navi li.menu5 li.level3.active a.level3{
		color: #62b263;
	}

/*Color Blue  */
ul.navi li.menu6 div.fxcontent{
		background: #4ab0dc;
		background-color: rgba(74,176,200,0.9);
	}
	ul.navi li.level1.menu6 li.hover > a.level2:before,
	ul.navi li.level1.menu6 li.hover > a.level3:before,
	ul.navi li.level1.menu6 li.active > a.level2:before,
	ul.navi li.level1.menu6 li.active > a.level3:before{
		color: #4ab0dc;
	}
	
	ul.navi li.menu6 li.level2.hover a.level2,
	ul.navi li.menu6 li.level3.hover a.level3,
	ul.navi li.menu6 li.level2.active a.level2,
	ul.navi li.menu6 li.level3.active a.level3{
		color: #4ab0dc;
	}
	
/* LTR SLIDE */
ul.navi div.fxcontent.slide.drop>div.mega-content.insidefx{
	left: 0;
	right: 0;
}
ul.navi div.fxcontent.slide.toleft>div.mega-content.insidefx{
	top: 0;
	left: 0;
}
ul.navi div.fxcontent.slide.toright>div.mega-content.insidefx{
	top: 0;
	
}

/* LTR SCROLL */
ul.navi div.fxcontent.scroll.drop>div.mega-content.insidefx{
	top: 0;
	left: 0;
}
ul.navi div.fxcontent.scroll.toleft>div.mega-content.insidefx{
	top: 0;
	right: 0;
}
ul.navi div.fxcontent.scroll.toright>div.mega-content.insidefx{
	top: 0;
	left: 0;
}

ul.navi div.fxcontent>div.fxcontent-bar{
	/* as div.mega-content background */
	background-color: #909090;
	height: 15px !important;
	display: block;
	position: absolute;
	width: 100% !important;
}
ul.navi div.fxcontent.slide.drop>div.fxcontent-bar{
	top: -15px;
	left: 0;
}
ul.navi div.fxcontent.slide.toleft>div.fxcontent-bar{
	right: 0;
}
ul.navi div.fxcontent.slide.toright>div.fxcontent-bar{
	left: 0;
}

ul.navi div.fxcontent.scroll.drop>div.fxcontent-bar{
	bottom: 0;
	left: 0;
}
ul.navi div.fxcontent.scroll.toleft>div.fxcontent-bar{
	bottom: 0;
	left: 0;
}
ul.navi div.fxcontent.scroll.toright>div.fxcontent-bar{
	bottom: 0;
	right: 0;
}

ul.navi div.fxcontent>div.fxcontent-pinner {
	background: #f00;
	display: block;
	position: absolute;
	top: -8px;
	left: -8px;
	width: 16px;
	height: 16px;
}

/** For RTL **/
ul.navirtl div.fxcontent{
	position: absolute;	
	display: block;
}

ul.navirtl li.menu1 div.mega-content:before{}
ul.navirtl li.menu2 div.mega-content:before{left: 86%;}
ul.navirtl li.menu3 div.mega-content:before{left: 70%;}
ul.navirtl li.menu4 div.mega-content:before{left: 70%;}
ul.navirtl li.menu5 div.mega-content:before{left: 70%;}
ul.navirtl li.menu6 div.mega-content:before{left: 22%;}


ul.navirtl div.fxcontent>div.mega-content.insidefx{
	top: auto;
	right: auto;
	bottom: auto;
	left: auto;
}

ul.navirtl div.fxcontent.slide.drop>div.mega-content.insidefx{

}
ul.navirtl div.fxcontent.slide.toleft>div.mega-content.insidefx{
	top: 0;
	left: 0;
}
ul.navirtl div.fxcontent.slide.toright>div.mega-content.insidefx{
	top: 0;
	left: 0;
}

ul.navirtl div.fxcontent.scroll.drop>div.mega-content.insidefx{
	top: 0;
	right: 0;
}
ul.navirtl div.fxcontent.scroll.toleft>div.mega-content.insidefx{
	top: 0;
	right: 0;
}
ul.navirtl div.fxcontent.scroll.toright>div.mega-content.insidefx{
	top: 0;
	left: 0;
}

ul.navirtl div.fxcontent>div.fxcontent-bar{
	/* as div.mega-content background */
	background-color: #909090;
	display: block;
	position: absolute;	
}
ul.navirtl div.fxcontent.slide.drop>div.fxcontent-bar{
	right: 0;
}
ul.navirtl div.fxcontent.slide.toleft>div.fxcontent-bar{
	right: 0;
}
ul.navirtl div.fxcontent.slide.toright>div.fxcontent-bar{
	top: 0;
	left: 0;
}

ul.navirtl div.fxcontent.scroll.drop>div.fxcontent-bar{
	bottom: 0;
	left: 0;
}
ul.navirtl div.fxcontent.scroll.toleft>div.fxcontent-bar{
	bottom: 0;
	left: 0;
}
ul.navirtl div.fxcontent.scroll.toright>div.fxcontent-bar{
	bottom: 0;
	right: 0;
}

ul.navirtl div.fxcontent>div.fxcontent-pinner {
	background: #f00;
	display: block;
	position: absolute;
	top: -8px;
	left: -8px;
	width: 16px;
	height: 16px;
}