.webd-brand-bar .nav { display: inline-block; position: absolute; padding-top: 0; top: 0; right: 0; z-index: 8; }

.webd-brand-bar .nav ul { list-style: none; white-space: nowrap; }

/*Menu*/

.webd-brand-bar .menu { padding:0 20px !important; }

.webd-brand-bar .menu > ul { padding-left: 0 !important; white-space: nowrap; }

.webd-brand-bar .menu.on { animation: an-fadeIn .2s; opacity: 1; }

.webd-brand-bar .menu.off { animation: an-fadeOut .2s; opacity: 0; }

/*Menu item*/

.webd-brand-bar .menu-item { float: left; line-height: 60px; min-height: 60px; position: relative; zoom: 1; font-family: 'Oswald'; text-transform: uppercase; }

.webd-brand-bar .menu-item a { color: #ffffff; font-size: 16px; font-weight: 700 !important; display: block; min-height: 60px; line-height: 60px; padding: 0 20px; }

/****************************/

.webd-brand-bar .page_item { float: left; line-height: 60px; min-height: 60px; position: relative; zoom: 1; }

.webd-brand-bar .page_item a { color: #ffffff; font-size: 16px; display: block; min-height: 60px; line-height: 60px; padding: 0 16px; }

/****************************/

@media only screen and (min-width: 992px) {

	.webd-brand-bar .nav ul { text-align: left; }

	.webd-brand-bar .menu-item:hover .sub-menu { display: block; }

	.webd-brand-bar .current_page_item a { border-bottom: 2px solid #f4ae30; }

	.webd-brand-bar .current_page_item .sub-menu  a,
	.webd-brand-bar .current_page_item .sub-menu .current_page_item a { border-bottom: 1px solid #f5f5f5; color: #333333; }

	/****************************/

	.webd-brand-bar .page_item:hover .children { display: block; }

	.webd-brand-bar .current_page_item .children  a,
	.webd-brand-bar .current_page_item .children .current_page_item a { border-bottom: 2px solid red; color: #333333; }

	/****************************/

}

/* Submenu */

.webd-brand-bar .sub-menu { animation: an-fadeIn .2s; background: #ffffff; display: none; left: 0; padding: 4px !important; position: absolute; text-align: left; width: 260px; }

.webd-brand-bar .sub-menu li:first-child { border-top: 1px solid #f5f5f5; }

.webd-brand-bar .sub-menu li { border-bottom: 1px solid #f5f5f5; float: none; display: block; line-height: 40px; min-height: 40px; }

.webd-brand-bar .sub-menu li:last-child { border-bottom: none; }

.webd-brand-bar .sub-menu li a { color: #333333; display: block; font-size: 14px; padding: 0 10px; line-height: 40px; min-height: 40px; }

.webd-brand-bar .sub-menu li a:before { content: "\00BB"; margin-right: 4px; }

.webd-brand-bar .sub-menu li a:hover { background: #f5f5f5; }

.webd-brand-bar .sub-menu:after { bottom: 100%; border: solid transparent; content: ""; height: 0; width: 0; border-color: rgba(51, 51, 51, 0); border-bottom-color: #ffffff; border-width: 10px; left: 20%; margin-left: -10px; position: absolute; pointer-events: none; }

/****************/

.webd-brand-bar .children { animation: an-fadeIn .2s; background: #ffffff; display: none; left: 0; padding: 4px !important; position: absolute; text-align: left; width: 260px; }

.webd-brand-bar .children li:first-child { border-top: 1px solid #f5f5f5; }

.webd-brand-bar .children li { border-bottom: 1px solid #f5f5f5; }

.webd-brand-bar .children li:last-child { border-bottom: none; }

.webd-brand-bar .children li { float: none; display: block; line-height: 40px; min-height: 40px; }

.webd-brand-bar .children li a { display: block; font-size: 14px; padding: 0 10px; line-height: 40px; min-height: 40px; }

.webd-brand-bar .children li a:before { content: "\00BB"; margin-right: 4px; }

.webd-brand-bar .children li a:hover { background: #f5f5f5; }

.webd-brand-bar .children:after { bottom: 100%; border: solid transparent; content: ""; height: 0; width: 0; border-color: rgba(51, 51, 51, 0); border-bottom-color: #ffffff; border-width: 10px; left: 20%; margin-left: -10px; position: absolute; pointer-events: none; }

/* Mobile navigation */

.webd-brand-bar .nav-mobile { color: #ffffff; cursor: pointer; display: none; font-size: 40px; height: 40px; line-height: 44px; position:absolute; top: 0; right: 20px; text-align: center; width: 40px; }

.webd-brand-bar .nav-click { background: #ffffff; border-left: 2px solid #f5f5f5; cursor: pointer; color: #333333; display: none; font-size: 20px; height: 60px; line-height: 60px; text-align: center; position: absolute; top: 0; right: 0; width: 60px; }

.webd-brand-bar .nav-click:hover { background-color: #ffffff; }

.webd-brand-bar .nav-click span { display:block; height:58px; line-height: 58px; width:60px; }

.webd-brand-bar .nav-rotate { transform: rotate(180deg); }

/**/

@media only screen and (max-width: 992px) {
	
	.webd-brand-bar .nav { border-radius: 0; position: absolute; top: 20px; right: 0; left: 0; padding: 60px 0 0; }

	.webd-brand-bar .nav-mobile { border-radius: 0; display: block; }

	.webd-brand-bar .menu { background: #ffffff; border-radius: 0; display: none; overflow: hidden; padding: 20px !important; }

	.webd-brand-bar .menu-item { border-bottom: 1px solid #f5f5f5; float:none; width:100%; }

	.webd-brand-bar .menu-item > a { background: #ffffff; color: #333333; padding:0 20px; line-height: 60px; min-height: 60px; }

	.webd-brand-bar .menu-item > a:hover { background: #f5f5f5; }
	
	/**/

	.webd-brand-bar .nav-click { display:block; }

	.webd-brand-bar .nav-click:hover { background: #f5f5f5; }

	.webd-brand-bar .nav-mobile-open { border-radius: 4px 4px 0 0; }

	/*Sub-menu*/

	.webd-brand-bar .sub-menu { display: none; padding: 0 !important; position: static; width: 100%; }

	.webd-brand-bar .sub-menu .menu-item a { padding: 0 20px; }

	.webd-brand-bar .sub-menu.on { animation: an-fadeIn .2s; opacity: 1; }

	.webd-brand-bar .sub-menu.off { animation: an-fadeOut .2s; opacity: 0; }

	.webd-brand-bar .sub-menu:after { display: none; }

	/****************/

	.webd-brand-bar .page_item { border-bottom: 1px solid #f5f5f5; float:none; width: 100%; }

	.webd-brand-bar .page_item > a { background: #ffffff; padding:0 20px; line-height: 60px; min-height: 60px; }

	.webd-brand-bar .page_item > a:hover { background: #f5f5f5; }

	/*Sub-menu*/

	.webd-brand-bar .children { display: none; padding: 0 !important; position: static; width: 100%; }

	.webd-brand-bar .children .page-item a { padding: 0 20px; }

	.webd-brand-bar .children.on { animation: an-fadeIn .2s; opacity: 1; }

	.webd-brand-bar .children.off { animation: an-fadeOut .2s; opacity: 0; }

	.webd-brand-bar .children:after { display: none; }
	
	/****************/

}

/**/

@keyframes an-fadeIn {
	
	0% {
	opacity: 0;
	}

	100% {
	opacity: 1;
	}

}

@keyframes an-fadeOut {
	
	0% {
	opacity: 1;
	}

	100% {
	opacity: 0;
	}

}