// Headers - Main nav - Top nav - Header Components - Mobile menu

#logo,
.header-layout-1 #logo{
	float: right;
}

.header-layout-1 .main-menu{
	float: left;
}

@include breakpoint(md){
	// Header menus arrows
	.menu-item-has-children,
	.mega-menu{
		> a:before{
			left: 12px;
			right: auto;
		}

		.menu-item-has-children > a:before{
			border-right-color: #ffffff;
			border-left-color: transparent;
		}
	}

	#theme-header .menu > li.menu-item-has-children:not(.is-icon-only) > a,
	#theme-header .main-menu li.mega-menu:not(.is-icon-only) > a{
		padding-left: 25px;
		padding-right: 15px;
	}

	// Main menu arrow
	.main-nav-light{
		.main-nav .menu-item-has-children,
		.mega-menu {
			.menu-item-has-children > a:before {
				border-right-color: $base-color;
				border-left-color: transparent !important;
			}

			li:hover > a:before{
				border-right-color: $brand-color;
			}
		}
	}

	// Top menu arrow
	.top-nav-dark{
		.top-menu .menu-item-has-children {
			.menu-item-has-children > a:before{
				border-right-color: $dark-base-color;
				border-left-color: transparent;
			}
		}
	}

	.theme-header .top-menu li{
		.menu-item-has-children > a:before{
			border-right-color: $base-color;
			border-left-color: transparent !important;
		}

		.current-menu-item > a:before,
		li:hover > a[href]:before{
			border-right-color: $brand-color;
		}
	}

	.main-menu,
	.top-menu,
	.header-menu .menu li,
	#sticky-logo,
	.weather-menu-item .weather-forecast-day,
	.main-menu .mega-cat-more-links > li,
	.top-nav .tie-alignleft .components,
	.top-nav .tie-alignleft .components > i{
		float: right;
	}

	.header-menu .menu ul ul{
		right: 100%;
		left: auto;
	}

	.components,
	.components > li{
		float: left;
	}

	.header-layout-1 .main-menu-wrap:only-child .menu>li:only-child{
		> .menu-sub-content {
	    left: 0;
	    right: auto;

	    ul{
		    right: auto;
		    left: 100%;
			}
	  }
	}

	// mega menu
	.main-menu .mega-cat-more-links > li ul {
    right: calc(100% - 10px);
    left: auto;
  }

	.main-menu {
		.cats-horizontal li{
			margin-right: 0;
			margin-left: 7px;
		}

		.cats-vertical{
			float: right;
			padding-right: 20px;
			padding-left:0;
		}

		.mega-recent-featured{
			.mega-menu-content {
				float: left;
			}

			&.menu-item-has-children .mega-recent-post{
				padding-right: 30px;
			}
		}

		// Posts List
		.mega-recent-post{
			float: right;
			padding-right: 0;
			padding-left: 30px;
		}

		.mega-check-also{
			float: right;

			li{
				&:nth-child(2n + 1){
					clear: right;
				}
			}

			.post-thumbnail{
				float: right;
				margin-left: 20px;
				margin-right: 0;
			}

			.post-details{
				padding-right: 130px;
				padding-left: 0;
			}
		}

		ul.mega-recent-featured-list{
			float: right;
			padding-right: 0;
			padding-left: 30px;

			&:after{
				left: 0;
				right: auto;
			}
		}

		ul li .mega-links-head:after{
			right: 0;
			left: auto;
		}
	}

	// Components
	.components {
		#search-input {
	    padding: 0 13px 0 35px;
		}

		#search-submit{
			left: 0;
			right: auto;
		}

		.top-nav-boxed & li:first-child.weather-menu-item,
		.main-nav-boxed & li:first-child.weather-menu-item,
		.search-bar + .weather-menu-item{
			padding-left: 10px;
			padding-right: 0;
		}
	}

	.menu-counter-bubble-outer,
	.notifications-total-outer{
		right: auto;
		left: 2px;
	}

	.comp-sub-menu{
		left: 0;
		right: auto;

		.product-thumb {
	    float: right;
	    margin-left: 15px;
	    margin-right: 0;
		}

		.product-title{
			padding-left: 30px;
			padding-right: 0;
		}

		&.bp-notifications-menu{
			li{
				a{
					padding: 12px 35px 12px 10px;

					span{
						margin-right: -22px;
	    			margin-left: 5px;
					}
				}
			}
		}
	}

	.weather-menu-item{
		padding-left: 5px;
		padding-right: 0;
	}

	// boxed main nav
	.main-nav-boxed .main-nav-wrapper .search-bar {
	  border-left-width: 0;
	  border-right-width: 1px;
	}

	// Top Nav
	.topbar-today-date{
		padding: 0 0 0 15px;
	}

	.tie-alignright .top-menu {
	  float: left;
	}

	#top-nav .tie-alignleft .comp-sub-menu {
    left: auto;
    right: -1px;
	}

	.top-nav-boxed {
		.tie-alignleft .search-bar {
				border-width: 0 0 0 1px;
		}

		.tie-alignright .search-bar {
				border-width: 0 1px 0 0;
		}

		.has-date-components,
		.has-date-components-menu{
			.tie-alignleft .search-bar {
					border-right-width: 1px;
			}
		}
	}


	// header components
	.grid-social-icons .comp-sub-menu.dropdown-social-icons li{
		float: right;
		border-width: 0 0 1px 1px;
	}

	.components .follow-btn .follow-text{
		float: left;
		margin-right: 8px;
		margin-left: 0;
	}
}

.menu-tiny-label{
	margin-left: auto;
	margin-right: 3px;
}

// breaking news -------
.ticker-content,
.ticker-swipe{
	left: auto;
	right: 10px;
}

.ticker-wrapper.has-js{
	padding-left: 20px;
	padding-right: 0;
}

@include breakpoint(xs){
	.ticker-wrapper.has-js {
		padding-left: 20px;
		padding-right: 0;

		.controls-is-active &{
			padding-left: 70px;
			padding-right: 0;
		}
	}
}

.breaking-title{
	float: right;
}

ul.breaking-news-nav{
	left: 0;
	right: auto;
	padding-right: 0;
	padding-left: 8px;

	li{
		float: right;
		margin: 6px 7px 6px 0;

		&.jnt-prev,
		&.jnt-next{
			transform: rotate(180deg);
			backface-visibility: hidden;
		}
	}
}



@include breakpoint(md){
	.header-layout-3 .stream-item-top-wrapper {
		&,
		& img{
	  	float: left;
		}
	}
}

@include breakpoint(max_min_md){
	#theme-header #logo {
	    text-align: right;
	}

	#mobile-menu-icon{
		left: 15px;
		right: auto;

		.header-layout-1 &{
			left: 0;
			right: auto; // override base.css
		}
	}

	#mobile-menu {
		.menu > li li {
			padding-left: 0;
			padding-right: 15px;
		}

		li {
			a {
		    padding: 15px 0 15px 50px;
			}

			a > .fa{
				margin-left: 3px;
				margin-right: 0;
			}
		}

		.mobile-arrows {
	    left: 0;
	    right: auto;
		}

		&:not(.hide-menu-icons) li.menu-item-has-icon{
			> ul,
			> div{
				padding-left: 0 !important;
				padding-right: 25px !important;
			}
		}
	}
}
