* {
    box-sizing: border-box;
}

body {
    /* background: brown url("images/bg.jpg") no-repeat fixed center; */
    background-size: cover; 
    /* padding: 0 12%; */
    background-color: #bcb7b1;
    font-family: Quicksand;
    color: #45403D;
}

header {
    text-align: center;
   /* background-color: rgba(255,255,255, 0.95); */
    padding: 3% 0 1% 0;
}

header h1 {
    padding: 3% 0 0 0;
    font-size: calc(27px + 1em);
    display: inline;
}

header h2 {
    padding: 0 0 2% 0;
    font-variant: small-caps;
    display: inline;
}

li.nav {display: inline;
text-decoration: none;
padding: 0 1%;
margin: 0 auto;
text-align: center;
box-sizing: border-box;
}

ul.nav {list-style-type: none;
margin: 0;
padding: 1% 0.5% 3% 0.5%;
overflow: hidden;
text-align: center;}

nav {
    list-style-type: none;
   /* background-color: rgba(255,255,255, 0.95); */
}

nav li {
    padding: 4%;
    font-size: calc(9px + 1em);
}

nav li a {
    width: 1em;
    color: #45403D;
    text-decoration: none;
}

nav li a:active{
    color: black;
}

nav li a:hover { 
    transition: 0.6s;
	color: black;
}

img {max-width: 100%;}

@media screen and (max-width: 1000px){
	.big {
		display: none;
	}
}

@media screen and (min-width: 1000px){
	.small {
		display: none;
	}
}