@media only screen and (orientation: portrait) {
	nav{
		display: grid;
    	grid-template-columns: repeat(1, 1fr);
		font-size: 3vw;
	}
}

@media only screen and (orientation: landscape) {
	nav{
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		margin:auto;
	}
}

*{
	margin:0;
	padding:0;
	font-family: 'Josefin Sans', sans-serif;
}

.main{
	padding: 3em;
}

.welcome{
	font-size: 10vw;
	font-weight: 100;
	font-family: 'Josefin Sans', sans-serif;
	text-align: center;
}

.slogan{
	font-size: 0.75em;
	font-style: italic;
	font-family: 'Josefin Sans', sans-serif;
	text-align: center;
	color: #d5d5d5;
}

.button{
    background-color: #00B050;
    border: none;
    position: relative;
    color: #000000;
    text-align: center;
    text-decoration: none;
    font-family: 'Josefin Sans', sans-serif;
    font-size: 1em;
    align-content: center;
    width: 100%;
    margin: auto;
    padding-top: 1em;
    padding-bottom: 1em;
}

.button:hover{
	background-color: rgba(0, 176, 79, 0.548);
}



ol{
	padding: 1rem;
	list-style: none;
}

td,li{
	font-size: calc(1em + 1vh);
}

table{
	width: 40vw;
}

h1{
	color: #00B050;
}

section,#profileImage{
	padding: 3em;
}

.left{
	font-weight: 300;
	font-size: calc(1em * 1vh);
}

.right{
	font-size: calc(1em * 2vh);
}

.top{
	font-weight: 800;
}

#profileImage{
	padding-right: 2.5em;
	float:right;
	min-width: 20vw;
    max-height: 80vh;
}