.footer-nav {
  width: 100%;
  height: 80px;
  margin-top: 6em;
  margin-bottom: 6em;
  background-color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.footer-logo {
  height: 140px;
}

.hp-work-gallery {
  margin: 1.5em 2em 1.5em 2.5em;
  background-color: white;
}

.hp-hero-image {
  margin-bottom: 1em;
}

.hp-subtitle {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.hp-subtitle p {
  margin-right: 1em;
}

.hp-introduction {
  margin-top: 1.5em;
  margin-left: 3em;
}

.hp-introduction h1 {
  margin-bottom: 0.2em;
}

.hp-coffee {
  margin-left: 2.5em;
  margin-right: 2.5em;
  display: flex;
  flex-direction: column;
  background-color: #ffffff;
}

.coffee-image {
  background-size: cover;
  width: 100%;
  height: 400px;
}

.coffee-text-titles {
  text-align: center;
  margin-bottom: 2em;
}

.coffee-text-titles h2 {
  font-weight: lighter;
  font-size: 65px;
  color: #FCC8C8;
  letter-spacing: 1px;
}

.coffee-text-titles h3 {
  font-weight: lighter;
  font-size: 80px;
  color: #EF7D7D;
  letter-spacing: 2px;
}

.coffee-text-titles h4 {
  font-weight: lighter;
  font-size: 100px;
  letter-spacing: 6px;
  color: #F75959;
}

.coffee-text-container {
  padding: 4em;
}

.coffee-text-container p {
  line-height: 1.4;
  margin-bottom: 1em;
}

.hp-middle-half-size-container {
  display: flex;
  flex-direction: column;
}

.hp-half-size-image-one,
.hp-half-size-image-two {
  width: 100%;
  height: 300px;
  background-position: center;
  background-size: cover;
}

.hp-half-size-image-one,
.hp-half-size-image-two {
  margin-bottom: 1em;
}

.hp-full-width-small-images {
  width: 100%;
  height: 300px;
  background-size: cover;
  background-repeat: no-repeat;
}

.long-image-container {
  margin-top: 1em;
}

.hp-long-image {
  width: 100%;
  height: 300px;
  background-size: cover;
  background-repeat: no-repeat;
}

.hp-image-container {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1050px) {
  .long-image-container {
    margin-top: 0;
  }

  .hp-middle-half-size-container {
    display: flex;
    flex-direction: row;
  }

  .hp-image-container {
    flex-direction: row;
  }

  .hp-middle-container {
    width: 70%;
  }

  .long-image-container {
    width: 34%;
  }

  .hp-long-image {
    height: 746px;
  }

  .hp-middle-full-width-container {
    margin-right: 1em;
  }

  .hp-full-width-small-images {
    margin-right: 1em;
  }

  .hp-half-size-image-one,
.hp-half-size-image-two {
    height: 430px;
    margin-right: 1em;
  }

  .hp-coffee {
    flex-direction: row;
    justify-content: space-between;
  }

  .coffee-text-container {
    width: 45%;
    padding-left: 5em;
    height: 680px;
  }

  .coffee-image-container {
    width: 45%;
    height: 700px;
    padding-right: 5em;
  }

  .coffee-image {
    margin-top: 5em;
    margin-bottom: 5em;
    width: 100%;
    height: 650px;
  }
}
.project-container {
  background-color: #FAFAFA;
  width: 100%;
  padding-top: 6em;
  padding-bottom: 6em;
}

.project-container h1,
.project-container p {
  text-align: center;
}

.project-container p {
  padding-bottom: 2em;
  padding-top: 1.5em;
}

.bg-project {
  display: flex;
  flex-wrap: wrap;
  padding-left: 10%;
  padding-top: 1em;
  padding-bottom: 1em;
  padding-right: 5%;
}

.insta-size {
  width: 270px;
  height: 270px;
}

.insta-overlay {
  position: relative;
  margin: 0.5em;
}

.overlay-box {
  color: white;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 275px;
  height: 275px;
  background-color: white;
}

.overlay-box:hover {
  opacity: 1;
  transition: 0.2s;
}

.overlay-box p {
  margin-top: 48%;
  color: black;
}

.insta-size:hover {
  opacity: 0.5;
}

.insta-overlay p:hover {
  opacity: 1;
  width: 100%;
  height: 100;
}

.overlay {
  width: 280px;
  height: 280px;
  background-color: black;
}

.overlay:hover {
  background-color: red;
}

.privi {
  margin: 5%;
}

.privi ul {
  margin-left: 5%;
  margin-bottom: 2%;
  list-style: initial;
}

.privi p {
  margin-bottom: 2%;
}

.contact-heading,
.contact-description {
  text-align: center;
}

.contact-heading {
  padding-top: 5em;
}

.contact-description {
  padding-top: 1em;
}

.contact-container {
  height: 500px;
  color: white;
  background-image: linear-gradient(-45deg, #f2f2f2, #F9E4E4, #FCC8C8, #EF7D7D, #e86f6f);
  display: flex;
}

.contact-form {
  width: 100%;
  background-color: #F0F0F0;
}

.contact-heading {
  text-align: center;
}

.contact {
  padding-top: 1em;
}

.contact input {
  margin-left: 1em;
  margin-top: 1em;
  margin-bottom: 1em;
  padding-top: 1em;
}

#message {
  margin-top: 1em;
  height: 100px;
}

.large-image {
  background-position: center;
  background-size: cover;
  height: 500px;
  width: 100%;
  background-repeat: nono-repeat;
}

h1 {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  font-size: 40px;
  color: #707070;
}

h2, h3, h4 {
  font-family: "Lato", sans-serif;
  font-weight: 400;
}

p,
li {
  font-family: "Open Sans", sans-serif;
  font-weight: 300;
}

@-webkit-keyframes fadein-web {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadein-moz {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-o-keyframes fadein-o {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadein-fx {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/* CSS reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}

body {
  background-color: #f2f2f2;
}

/* Media Queries */
/* footer  */
footer {
  width: 100%;
  height: 400px;
  display: flex;
  flex-direction: column-reverse;
}

.footer-titles {
  display: flex;
  flex-direction: column;
}

.footer-titles-services {
  display: flex;
  flex-direction: column;
}

.footer-contact {
  display: flex;
  flex-direction: column;
}

.contact-icons img {
  height: 25px;
  opacity: 0.5;
}

.icon-container {
  display: flex;
  flex-direction: row;
}

@media (min-width: 1050px) {
  footer {
    height: 200px;
    flex-direction: row;
    justify-content: space-evenly;
  }
}

/*# sourceMappingURL=styles.css.map */