@font-face {
    font-family: "Keyzha";
    font-style: bold;
    font-weight: 500;
    font-display: swap;
    src: url(Keyzha.woff) format("woff");
}
@font-face {
    font-family: "Rotifera";
    font-style: oblique;
    font-weight: 500;
    font-display: swap;
    src: url(Rotifera.woff) format("woff");
}
@font-face {
    font-family: "Botanic";
    font-style: bold;
    font-weight: 500;
    font-display: swap;
    src: url(Botanic.woff) format("woff");
}

body {
  background: #ccc;
}

.container {
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

h1 {
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 1%;
  width: 48%;
  height: 50%;
  cursor: default;
  text-shadow: 2px 2px 3px rgba(0,0,0,.3);
  -webkit-transition: text-shadow 1s ease;
  transition: text-shadow 1s ease;
}

h1:hover {
text-shadow: none;
}

span.texture {
font-family: "Keyzha", sans-serif;
font-size: 5em;
line-height: 1;
-webkit-background-clip: text;
	background-clip: text;
	background-image: url('image6.jpg');
	color: transparent;
} 
span.in {
font-family: "Rotifera", sans-serif;
font-size: 1em;
line-height: 1;
-webkit-background-clip: text;
	background-clip: text;
	background-image: url('image3.jpg');
	color: transparent;
}
span.nature {
font-family: "Botanic", sans-serif;
font-size: 6em;
line-height: 1;
-webkit-background-clip: text;
	background-clip: text;
	background-image: url('image2.jpg');
	color: transparent;
}
.nav {
  position: fixed;
  left: 0;
  bottom:0;
  width: 100%;
  background-color: #fff;
  color: #666;
  opacity: 0.75;
  text-align: center;
  margin-bottom: 0;
  padding: 10px 0;
}