@import url("https://use.typekit.net/uwb0jhd.css");

body {
  font-family: freight-display-pro, serif;
  font-weight: 300;
  font-style: normal;
  letter-spacing: 0.04em;
  background-color: rgba(170,170,170,1);
  color: white;
  margin:0 auto;
  margin-top: 2%;
  max-width: 1024px;
}

body a {
  color: white;
  text-decoration: none;
  border-bottom: 1px solid white;
  margin-bottom: -1px;
}

a:hover {
  opacity: 0.5;
}

/* ///////////////// FONT SIZES ///////////////// */

h1 {
  font-family: aktiv-grotesk-extended, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 50px;
  font-weight: 400;
  letter-spacing: 0em;
  margin: 0 0 0px;
}

h2 {
  font-family: aktiv-grotesk-extended, sans-serif;
  font-weight: 400;
  font-style: normal;
  text-transform: uppercase;
  font-size: 28px;
  letter-spacing: 0em;
  margin: 0 0 5px;
}

p {
  font-size: 32px;
  line-height: 1.2;
  margin: 0 0 15px;
}

.info {
  font-family: aktiv-grotesk-extended, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
  letter-spacing: 0em;
  line-height: 1.4;
  margin: 0 0 0px;
}

.small {
  font-family: freight-display-pro, serif;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
  letter-spacing: 0.03em;
  margin: 0 0 0px;
}

.names_head {
  font-family: freight-display-pro, serif;
  text-align: right;
}

/* ///////////////// IMG ///////////////// */

.img_normal {
  width: 100%;
  mix-blend-mode: multiply;
}

.img_normal:hover {
  animation-name: img_multi;
  animation-duration: 1s;

}

/* ///////////////// DIV BOXES ///////////////// */

.javascript {
  position:fixed;
}

.big_space {
  margin: 35%;
}

.space {
  margin: 10%;
}


.siteback_blog {
  width: 96%;
  overflow: auto;
  padding-left: 2%;
}

.siteback_blog:hover {
}


@media only screen and (max-width: 668px) {
  h1 {
    font-size: 30px;
  }

  h2 {
    font-size: 22px;
  }

  h3 {
    font-size: 20px;
  }

  p {
    font-size: 25px;
  }

  .info {
    font-size: 14px;
  }

  .big_space {
    margin: 55vh;
  }
}