/*
 * Header
 */
.header{
	
	&::before{
		content:"";
		position:absolute;
		top:0;
		left:0;
		right:0;
		height:7rem;
		z-index:0;
		background: linear-gradient(to bottom,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 100%);
		@include animate();
	}
	
	z-index:2000;
	//min-height:4.5rem;
	position:relative;
	top:0;
	left:0;
	right:0;
	@include animate();
	

	/*
	 * Top bar 
	 */
	.top-bar{
		
	
		background:$white;
		width:100%;
		padding:0.5rem;
		z-index:1000;
		position:relative;
	    flex-wrap: wrap;
		@include animate();
	
		
		@include breakpoint(medium down) {
			padding:0.75rem;
			position:fixed;
			box-shadow: 0 0 0.25em rgba($black, 0.25);

			.top-bar-left,
			.top-bar-right{
				flex: 0 0 100%;
				max-width: 100%;
			}
			
		}	
		
		/*
		 * left 
		 */
		.top-bar-left{
			
			padding:0.5rem;
			@include breakpoint(medium down) {
				padding:0;
			}
			
			// Logo
			.logo{
	
				display:block;
				float:left;
				height:2.5rem;
				position:relative;
			
				svg{
					position:relative;
					display:block;
					height:100%;display:block;
					@include animate();		
				//	*{fill: #fff;}
					
					
				}
			
				@include breakpoint(medium down) {
					margin:0.125rem 0;
					height:2rem;
					
				}
				
				&:hover{
					svg{margin-left:0.25rem;}
					.cls-1{fill:#c98e56;}
					.cls-2{}
				}
			
			
			}
			.toggle-main-navigation{
				float:right;
				margin-top:0.375rem;
				
				// toggle navigation
				.toggle-menu{
	
					float:right;position:relative;width:1.5rem;height:1.5rem;padding:0;transform:rotate(0deg);transition:.5s ease-in-out;cursor:pointer;

					span{display:block;position:absolute;height:0.125em;width:100%;background:$black;opacity:1;left:0;transform:rotate(0deg);transition:.25s ease-in-out;}
					span:nth-child(1){top:0.125em;}
					span:nth-child(2),
					span:nth-child(3){top:0.625em;}
					span:nth-child(4){top:1.125em;}
		
					&.open span:nth-child(1){top:18px;width:0%;left:50%;}
					&.open span:nth-child(2){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);}
					&.open span:nth-child(3){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);}
					&.open span:nth-child(4){top:18px;width:0%;left:50%;}

				}
			}
			
		}
		
		
		/*
		 * right
		 */
		.top-bar-right{
			
			padding:0.5em;
			
			ul{
				
				background:none;
				padding-right:7rem;
						
				li a{
					
					text-transform:uppercase;
					font-size:0.875rem;
					padding: 0.75rem;
					color:$secondary-color;
					@include breakpoint(large up){
						+ ul{display:none;visibility:hidden;}
						&.current{font-weight:400;}
						&.current::after{content:"";bottom:calc(-1.25rem + 3px);left:1rem;right:1rem;border-bottom:solid 2px $primary-color;z-index:1;}
					}

				}
					
			
				@include breakpoint(medium down){
					
					//padding-bottom:3rem;
					padding-right:0;
					
					li{
						border-bottom:solid 1px rgba($light-gray,0.5);
						text-align:center;
						&:last-child{border:none;}
					}
					
					li a{
						font-size:1.125rem;padding:1rem;
						&.is-active{font-weight:400;}
					}
					
					
					li ul{
						margin:0 0 1.5rem 0;
						background:$white;
						a{font-size:0.875rem;}
					}
					li ul li:last-child{border:none;};
					
					&::after{
						top:auto;
						bottom:-0.5rem;
						border:none;
						width:100%;
						background-position:50% 50%;
						background-size: auto 1.5rem;
						height:3rem;
					}
					
				}
				
					
					
				&::after{
			
					border-left:solid 1px $light-gray;
					content:"";
					background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 107.97 28.8'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%23004f9f%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M0 .88h8.68c2 0 4.33 1.85 5.38 2.88l15.24 16.9V.88h5.18v27h-9.07a6.83 6.83 0 01-5.06-2.2L5.15 8.73v19.15H0zM108 28.06a85.3 85.3 0 01-18.77.4 27.76 27.76 0 01-10.6-2.8c-4.16-2.16-5.48-7-5.43-11.44 0-4.07 1.26-8.4 4.88-10.76A19.25 19.25 0 0185.67.89a77.61 77.61 0 0121.94-.22v3.85c-8.49-1.64-17.44-1.24-20.48 2.66A10.4 10.4 0 0085 14c0 3.67 1.24 9.21 8.67 10.3a44.64 44.64 0 0014.33-.64zM54.88 23.85c.73 0 12.43.07 16.44 0v4c-8.09.31-15.86.44-24 .1-6.92-.28-8.12-3.77-8.26-7.11V.88h31.86v3.84h-20.6v6.88h18.77v3.75H50.32c0 2 0 4.33.07 4.74.11 2.62 1.33 3.6 4.49 3.76'/%3E%3C/svg%3E") no-repeat 100% 50%;
					background-size: auto 100%;
					height:1.25rem;
					width:6rem;
					position:absolute;
					margin-top:-0.625rem;
					top:50%;
					right:0.5rem;
					z-index:100;
					
					@include breakpoint(medium down){
						display:none;
					}
										
				}
				
		
			}
			
			
		}
		
	}
	
}