/* @import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);   */



$blue: #09729f; /* #679EB9; */

* {
	box-sizing: border-box;
	/*margin: 0;
	padding: 0; */
}

ul#menu, ul.hamburger { 
	/*font-family: 'Montserrat';
	 background-color: #fff;	*/
	li {
		list-style-type: none;
	}
}

.nav {
	background-color: $blue;
	/*	width: 100%;*/
	position: fixed;
	z-index: 10;
}

ul#menu {
	display: none;

	li a {
		width: 100%;
		display: inline-block;
		background-color: $blue;
		color: white;
		font-size: 1.0em;
		padding: 0.7em 0.8em;
		transition: background 0.2s;
		text-decoration: none;
	}
	a:hover {
		background-color: darken($blue, 10%);
	}
}
//horizontal desktop menu
@media screen and (min-width: 2000px) {
	.hamburger-container { display: none; }
	.nav {
		ul#menu {
			display: inline;

			li {
				display: inline-block;
				/* margin-right: -5px; */
			}
		}
	}
}

// icon animaition
%burger {
	font-size:1.3em;
/*	height:5px;
	 background:black; */
	content:'☰';
	position:relative;
	transition:.25s ease-in-out;
}
.hidden {
	opacity:0;
}
.rot45deg {
	transform:rotate(45deg);
	top:10px !important;
}
.rot-45deg {
	transform:rotate(-45deg);
}
ul.hamburger {
	display:block;

	li {
		@extend %burger;
		&:nth-child(1) {
			top:0;
		}
		&:nth-child(2) {
			top:5px;
		}
		&:nth-child(3) {
			top:10px;
		}
	}
}
.hamburger-container {
	/**/ width:44px; 
	margin:0.4em 0.6em;
/**/	height:36px;
	cursor: pointer;
	font-size:1.4em;
}