@charset "UTF-8";

/*	BAREBONES RESPONSIVE GRID FRAMEWORK (Navigation)
	Version 3.0
	November 2017
	www.dawgeatdawg.com
*/


/*--- NAVIGATION ---*/

/* @group --- MENU | Mobile Menu Toggle ---*/

#menuToggle {
	display: none;
	margin: 0;
/* 	padding: 6px 15px; */
/* 	background: hsla(0, 0%, 0%, 0.6); */
/* 	border-bottom: 1px solid hsla(50, 20%, 30%, 0.0); */
/* 	color: white; */
	font-size: 1.2em;
	letter-spacing: 0;
	text-transform: uppercase;
	text-align: left;
	cursor: pointer;
}
	
	#menuToggle a,
	#menuToggle a:visited {
/* 		color: hsl(50, 40%, 60%); */
/* 				background: hsla(150, 50%, 50%, 0.2); */
	}
	
		#menuToggle a:hover,
		#menuToggle.current > a {
/* 			color: hsl(50, 40%, 100%); */
		}
		
/* @end */



/* @group --- MENU | Social ---*/

div.menuSocial {
	position: absolute;
	top: 1.0rem;
	right: 1.0rem;
}

	div.menuSocial ul {
		display: flex;
		flex-flow: row nowrap;
		justify-content: flex-end;
		align-items: center;
		align-content: top;
/* 				background: hsla(150, 50%, 50%, 0.2); */
	}

		div.menuSocial ul li {
			display: inline-block;
			flex: 0 1 auto;
			margin: 0 0 0 0.6em;
		}
		
			div.menuSocial ul li a > svg {
				width: 1.3rem;
				height: 1.3rem;
				margin: 0;
			}

/* @end */



/* @group --- MENU | Top ---*/

nav#menuTop {
	position: relative;
	margin-top: 1.2em;
/* 			background: hsla(150, 50%, 50%, 0.2); */
}
	
nav#menuTop ul {
/* 	display: none; */
	clear: both;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: flex-start;
	align-content: center;
	width: 100%;
	text-align: center;
/* 			background: hsla(250, 50%, 50%, 0.2); */
}

	nav#menuTop ul li {
		display: inline-block;
		flex: 0 1 auto;
		background-color: transparent;
	}
	
		nav#menuTop ul li a,
		nav#menuTop ul li a:visited {
			display: block;
			margin: 0;
			padding: 0.2em 0;
			font-family: 'Dalli', 'Baskerville', 'Baskerville Old Face', 'Hoefler Text', 'Garamond', 'Times New Roman', Georgia, serif;
			font-size: 1.4rem;
/* 						background: hsla(50, 50%, 50%, 0.2); */
/* 						border: 1px dotted hsla(0, 50%, 50%, 0.4); */
		}
		
			nav#menuTop ul li a > svg {
				width: 1.2em;
				height: 1.2em;
				margin-left: 1.0em;
				margin-right: 1.0em;
			}

		body#art nav#menuTop ul li#nav-art a,
		body#catering nav#menuTop ul li#nav-catering a { color: 	hsl(50, 40%, 60%); }

/* @end */



/* @group --- MEDIA SIZE | Tablet (700px) ---*/
@media only screen and (min-width: 630px) {

	nav#menuTop {
		margin-top: 1.2em;
/* 			background: hsla(150, 50%, 50%, 0.2); */
	}

		nav#menuTop ul li a > svg {
			width: 1.2em;
			height: 1.2em;
			margin-left: 0;
			margin-right: 0.4em;
		}
	
}

/* @end */



/* @group --- MEDIA SIZE | Desktop ---*/
@media only screen and (min-width: 1000px) {

	/*--- MENU | Top ---*/

/*
	#menuToggle {
		display: none;
	}
*/
	
	div.menuSocial {
		position: relative;
		top: 0;
		right: 0;
	}
	
		div.menuSocial ul li a > svg {
			width: 1.2rem;
			height: 1.2rem;
		}
	
	nav#menuTop {
		position: absolute;
		bottom: 0.2rem;
		right: 1.9rem;
		width: calc(55% - 2.1rem);
		margin-top: 0.5em;
/* 				background: hsla(150, 50%, 50%, 0.2); */
	}
	
	nav#menuTop ul {
		justify-content: flex-end;
/* 				background: hsla(150, 50%, 50%, 0.2); */
	}
	
		nav#menuTop ul li {
/* 					background: hsla(150, 50%, 50%, 0.2); */
		}

			nav#menuTop ul li a {
				padding: 0.4em 0 0.4em 1.0em;
				font-size: 1.0rem;
			}
			
}

/* @end */
