*, ::after, ::before {
    box-sizing: border-box;
  }

html {
  width: 100%;
  height: 100%;
}
  
body {
      min-height: 100%;
      letter-spacing: .015rem;
      width: 100%;
      height: 100%;
      font-family: Verdana, Geneva, Tahoma, sans-serif;
      margin: 0;
      font-size: 1vw;
      overflow: hidden;

      background-image: url(img/fence-1.jpg);
      display: flex;
}

#body {
  margin: auto;
  width: 80%;
  
}

.wrapper {
  padding: 30px;
  margin: 50px;

  background-color: rgba(255, 255, 255, 0.7);
}

h1 {
  font-size: 2vw;
  margin: 30px 0 0 0;
  font-weight: normal;
}

@media (max-width: 767px) {
	#body {
    width: 100%;
  }

  .wrapper {
    margin: 0;
  }

  h1 {
    font-size: 4vw;
  }
}

@media (max-width: 575px) {

  #body {
    margin-top: 10%;
  }

	.logo {
    width: 100%;
    height: auto;
  }
}