header{

	position:fixed;
	left:0;right:0;top:0;
	width:100%;
	z-index:1000;
	
	@include breakpoint(small only)
	{	
		position:relative;
		
		.top-bar-left,
		.top-bar-right{
			flex: 0 1 auto !important;
		}
	}	
	
	.top-bar{

		background:none;
		
		.top-bar-left{
						
		
			.logo{
				
								
				img{
					position:relative;
					display:block;
					
					height:3rem;				
					
					@include breakpoint(small only) {
						height:2rem;
					
					}
			
				}
				
				
			
			}
			.toggle-main-navigation{
				
				position:absolute;top:0rem;right:0.5rem;
				margin-top:0.375rem;
				
				.toggle-menu{
	
					
					width:2rem;height:2rem;
					padding:0;
					transform:rotate(0deg);
					cursor:pointer;
					@include animate();

					span{display:block;position:absolute;height:0.125em;width:100%;background:$black;opacity:1;left:0;transform:rotate(0deg);@include animate();}
					span:nth-child(1){top:0rem;}
					span:nth-child(2),
					span:nth-child(3){top:0.75rem;}
					span:nth-child(4){top:1.5rem;}
		
					&.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%;}

				}
			}
			
		}
		
		

		
		.top-bar-right{
			a{margin:0;}
		}
			
				
		
	}
	
	/*@include breakpoint(medium down)
	{
		position:fixed;
		
		.top-bar-ribbon{display:none;}
		
		&.has-scrolled{background: $white;}
	
		.top-bar{
			margin:0;
			border-radius:0;			
			&::after{display:none;}
						
			.top-bar-right{display:none;}
			.top-bar-right,
			.top-bar-left{
				flex: 0 0 100%;
				max-width: 100%;
			}
		
			.top-bar-left{
				z-index:10;
			}
		
			.top-bar-center{
				min-height:100vh;
				background: $white;
				position: absolute;
				top: 0;
			    right: 0;
			    left: 0;
				  
				
				> div{
					@include vertical-center();
					left:0;right:0;
				}
				
				ul{margin:0;padding:0 2rem;}
				ul li{text-align:center;border:none;}
				ul li:last-child{margin-left: 0;background:none;}
				ul li a{font-size:1.25rem;margin:0;display:block;padding:1.5rem 0;background:none;}			
			}
		
		}
	
	

	
	}
*/
}