/*------------------------------------------------------------------
1. Logo / .logo
-------------------------------------------------------------------*/
.logo{
	max-width: 120px;
	@include media-breakpoint-up(sm){
		max-width: 150px;
	}
	@include media-breakpoint-up(md){
		max-width: 171px;
	}
}
/*------------------------------------------------------------------
2. PageHeader / .pageHeader
-------------------------------------------------------------------*/
.pageHeader{
	padding-top: 20px;
	padding-bottom: 16px;
	position: fixed;
	left: 0;
	right: 0;
	z-index: 2;
	transition: padding-top 0.35s ease;
	@include media-breakpoint-up(sm){
		padding-top: 30px;
		padding-bottom: 20px;
	}
	@include media-breakpoint-up(md){
		padding-top: 40px;
	}
	@include media-breakpoint-up(lg){
		padding-top: 50px;
	}
}
/*------------------------------------------------------------------
3. HeaderFixed / .headerFixed
-------------------------------------------------------------------*/
.headerFixed{
	margin-top: -69px;
	@include media-breakpoint-up(sm){
		margin-top: -96px;
	}
	@include media-breakpoint-up(md){
		margin-top: -106px;
	}
	@include media-breakpoint-up(lg){
		margin-top: -123px;
	}
	@include media-breakpoint-up(xl){
		margin-top: -125px;
	}
	.pageHeader{
		padding-top: 16px;
		background-color: $white;
		box-shadow: 2px 0 5px rgba($black, 0.3);
		@include media-breakpoint-up(sm){
			padding-top: 20px;
		}
	}
}
/*------------------------------------------------------------------
4. MainNavHolder / .mainNavHolder
-------------------------------------------------------------------*/
.mainNavHolder{
	font-size: 16px;
	line-height: 18px;
	@include media-breakpoint-down(xs){
		font-size: 14px;
		line-height: 16px;
	}
	.nav-item{
		margin-left: 36px;
		.active{
			color: $primary;
		}
		.nav-link{
			padding: 0;
			transition: color 0.35s ease;
			@include media-breakpoint-up(lg){
				color: $gray-800;
			}
			@include media-breakpoint-down(md){
				background-color: $white;
			}
			&:hover,
			&:active{
				color: $primary;
			}
		}
	}
	.btn{
		max-width: 98px;
		padding-top: 10px;
		padding-bottom: 10px;
		font-size: 9px;
		@include media-breakpoint-up(sm){
			font-size: 12px;
			min-width: 138px;
			padding-top: 13px;
			padding-bottom: 13px;
			font-size: 12px;
		}
		@include media-breakpoint-up(lg){
			min-width: 175px;
			padding-top: 15px;
			padding-bottom: 15px;
			font-size: 14px;
		}
		@include media-breakpoint-up(xl){
			min-width: 192px;
			padding-top: 16px;
			padding-bottom: 16px;
		}
		&:active,
		&:focus,
		&:hover{
			box-shadow: none;
		}
	}
	@include media-breakpoint-down(md){
		.mainNavCollapse{
			position: absolute;
			left: 0;
			top: 100%;
			width: 100%;
			margin-top: 16px;
			@include media-breakpoint-up(sm){
				margin-top: 20px;
				padding-left: 15px;
				padding-right: 15px;
			}
			.navbar-nav{
				box-shadow: 0px 2px 5px rgba($black, 0.5);
			}
			.nav-item{
				margin-left: 0;
				.active{
					color: $primary;
					background-color: $white;
				}
			}
			.nav-link{
				padding: 9px 15px;
				background-color: $primary;
				color: $white;
				transition: color 0.35s ease, background-color 0.35s ease;
				&:hover{
					color: $primary;
					background-color: $white;
				}
			}
		}
	}
}
/*------------------------------------------------------------------
5. NavToggler / .NavToggler
-------------------------------------------------------------------*/
.NavToggler{
	@include media-breakpoint-up(sm){
		font-size: 20px;
		padding: 5px 8px;
	}
}