body{
	margin: 0px;
}

h2{
	font-family: Phenomena;
	font-size: 30px;
}

.wrapper{
	padding-left: 15%;
	padding-right: 15%;
	padding-top: 0.5%;
	padding-bottom: 1%;
}

@font-face {
  font-family: Phenomena;
  src: url('../src/Phenomena-Regular.otf')
}

#navBar{
	display: flex;
	justify-content: center;
	background-color: #161616;
}

#selectionMenu{
	display: flex;
	justify-content: space-between;
	background-color: #ffffff;
	padding-bottom: 0.5%;
}

a{
	font-family: Phenomena;
	font-size: 32px;
	text-decoration: none;
	color: #161616;
}

a:hover{
	text-decoration: underline;
	text-decoration-color: #161616;
}



@keyframes slidy {
0% { left: 0%; }
20% { left: -100%; }
25% { left: -100%; }
45% { left: -200%; }
50% { left: -200%; }
70% { left: -300%; }
75% { left: -300%; }
95% { left: -400%; }
100% { left: -400%; }
}

#slider { 
overflow: hidden;
height: 75vh;
}

#slider figure div {
	width: 20%;
	height: 75vh; 
	float: left;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100vw, 75vh;
}
#slider figure { 
  position: relative;
  width: 500%;
  margin: 0;
  left: 0;
  text-align: center;
  animation: 20s slidy infinite; 
}

#wood{
	text-align: center;
}


@media (max-width: 920px) {
  .productCard {
    flex-basis: 40%;
  }
}

#newProducts{
	text-align: center;
	background-color: #161616;
}

#newProducts h2{
	color: #ffffff;
}

.wsButton{
	border-radius: 20px;
	background-color: #ffffff;
	border-style: none;
	padding: 0.5%;
}

.wsButton:hover{
	background-color: #d4d4d4;
}

.wsButton:hover span{
	text-decoration: underline;
}

.wsButton span{
	font-family: Phenomena;
	font-size: 20px;
}


#contact{
	text-align: center;
	display: flex;

}

#about{
	text-align: center;
	height: 75vh; 
	background-image: url(./src/vanBG.png);
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	background-size: 100vw, 75vh;
}

#about h2{
	color:white;
}

#about p{
	color:white;
}

#sum{
	display: flex;
	background-color: #161616;
	color: white;
}