:root {
	--accent1: #70369b;
	--accentmedium1: #7f4ba5;
	--accentlighter1: #df84de;	
	--accent2: #e87110;
	--accentlighter2: orange;
	--accent3: #1ee7b9;
	--backgroundColor: linen;
	--textColor: #333;
	--navColor: #fff;
	
	--navWidth: 12em;
	--mainWidth: min(48em, calc(100% - var(--navWidth)));
	--headerLineHeight: 3em;
}

body {
	background: var(--backgroundColor);
	color:      var(--textColor);
	font-family: Avenir, Arial, sans-serif; 
	min-height: 100vh;
	margin: 0;
	padding: 0;
}
header {
	padding: 2em;
}
nav {
    background: linear-gradient(90deg, var(--accentlighter1), var(--accentmedium1)) ;
    color: var(--navColor);
    padding: 1em;
}