@media screen and (max-width: 680px) {

	nav {
		position: relative;
	}

		nav .handheld {
			height: 100%;
		}

		nav .close {
			width: 40px;
			height: 40px;
			background-image: url('/img/close.svg');
			background-size: 40px 40px;
			background-repeat: no-repeat;
			position: absolute;
			top: 35px;
			right: 50px;
		}

	nav ul.navigation.handheld {
		padding: 160px 40px;
		text-transform: uppercase;
	}
		nav ul {
			padding-bottom: 50px;
			position: initial;
		}

		/* override custom widths from desktop styling*/
		body nav ul li a {
			width: initial !important;
		}

		nav ul li ul {
			padding-top: 40px;
			display: none;
		}

		nav ul li ul li a,
		nav ul li.active ul li a {
			color: #4DD1FF;
			text-transform: capitalize;
		}

		nav ul li {
			width: 100%;
			display: block;
			border: initial;
			margin-bottom: 40px;
			padding: 0px;
			position: relative;
		}

		nav ul li a {
			font-weight: 400;
			font-size: 20px;
			color: #093075;
			text-shadow: initial;
			line-height: 1.2em;
		}

		nav ul li.active {
			border: initial;
		}
			nav ul li.active a {
				color: #093075;
				border-left: 0px;
			}
	.hamburger {
		width: 64px;
		height: 45px;
		background-image: url('/img/hamburger.svg');
		background-size: 64px 45px;
		position: absolute;
		top: 55px;
		right: 40px;
		z-index: 10;
	}

	.logo img {
		width: 175px;
		height: auto;
	}
}