*{box-sizing: border-box}

body{background-color: #40407a; 
	color:#40407a; 
	font-family: verdana, arial, sans-serif;
	margin: 0;}

#wrapper{background-color: #f5f5f5;
		padding: 2em;}

nav{text-align: right; 
	font-weight:bold;
	background-color: #ffffff;
	margin: 0;
	padding-top: 0.5em;
	padding-bottom: 1em;
	padding-right: 0em;
	position:fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	height: auto;}

nav ul{list-style-type: none;
		margin: 0;
		padding-right: 2em;
		font-size: 1.2em;}

nav li{display: inline;
		padding-left: 4em;}

nav a{text-decoration: none;}

nav a:link{color: #3f2860;}
nav a:visited{color: #497777;}
nav a:hover{color: #a26100;}

.home{height:20vh;
		padding-top: 2em;
		padding-left: 10%;}

header{background-color: #40407a; 
	color: #ffffff;
	line-height: 400%; 
	text-indent: 1em; 
	background-image: url(sunrise.jpg); 
	background-size: 100% 100%;
	margin-top: 50px;
    font-size: 90%;
    min-height: 200px;}

header a{text-decoration: none;}
header a:link{color: #ffffff;}
header a:visited{color: #ffffff;}
header a:hover{color: #edf5f5;}


.content{height: 20vh;
		padding-top: 2em;
		padding-left: 10%;}

#mathero{height: 300px;
		background-image: url(yogamat.jpg);
		background-size: 100% 100%;
		background-repeat: no-repeat;
        display: none;}

#loungehero{height: 300px;
			background-image: url(yogalounge.jpg);
			background-size: 100% 100%;
			background-repeat: no-repeat;
            display: none;}

h2{margin: 0;}

footer{text-align: center; 
	font-style: italic; 
	font-size: small;
    clear: right;}

li{font-size: 90%;}

section{padding-left: .5em;
        padding-right: .5em;}

#flow{display:block;}

@media (min-width:600px){nav ul{display:flex; flex-wrap:nowrap; flex-direction: row; justify-content: flex-end;}section{padding-left: 2em; padding-right: 2em; flex-basis: 1;} #mathero{display:block; margin-bottom: 1em;} #loungehero{display:block; margin-bottom: 1em;} #flow{display: flex; flex-direction: row;flex-wrap: wrap;}}

@media (min-width: 1024px) {header{font-size: 120%;} .home{height:50vh; padding-top: 5em; padding-left: 8em;} .content{height:30vh; padding-top: 2em; padding-left: 8em;} #wrapper{margin: auto; width: 80%;}}

