/*
 * MEDIUM DOWN
 */
@media screen and #{breakpoint(medium down)}{
	
	.top-bar{flex-wrap: wrap;}
	
	.top-bar-left{width:100%;}
	.top-bar .top-bar-left svg{height:2em;}
	
	.top-bar .top-bar-right{flex: 1 1 auto;}

		
	.toggle-navigation{float:right;position:relative;float:right;width:2em;height:2em;padding:0;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out;transition:.5s ease-in-out;cursor:pointer;}
	.toggle-navigation span{display:block;position:absolute;height:0.125em;width:2em;background:$black;opacity:1;left:0;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out;}
	.toggle-navigation span:nth-child(1){top:0.25em;}
	.toggle-navigation span:nth-child(2),.toggle-navigation span:nth-child(3){top:0.875em;}
	.toggle-navigation span:nth-child(4){top:1.5em;}
	
	.toggle-navigation.open span:nth-child(1){top:18px;width:0%;left:50%;}
	.toggle-navigation.open span:nth-child(2){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);}
	.toggle-navigation.open span:nth-child(3){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);}
	.toggle-navigation.open span:nth-child(4){top:18px;width:0%;left:50%;}
	
	.top-bar-right{}
	.top-bar .menu{margin:1rem 0 0;background:none;}
	.top-bar .menu > li{border-bottom:solid 1px $light-gray;text-align:center;}
	.top-bar .menu > li:last-child{border:none;}
	.top-bar .menu > li a{padding:1rem 0;}
	
	.top-bar .menu ul.submenu{margin-top:0;}

	.top-bar .menu .button{font-size:0.875rem;padding:0.5rem 1rem;margin:0.5rem 0.25em;display:inline-block;}

	.top-bar a.toggle-search{float:none;}
	
	.login-menu{display:none;}
	
	.image-showcase{padding:0;height:30em;text-align:center;}
	.image-showcase .case-foreground h1{font-size:2rem;margin-top:1em;}
	.image-showcase .case-foreground h1 + p {display:none;}
	.image-showcase .case-foreground img{margin-bottom:1em;}
	.image-showcase .case-foreground{width:auto;}
}