/* =======================================================
*
* 	Template Style 
*
* ======================================================= */
body html {
  height: 100%
}
body {
  font-family: "Amiri", Arial, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.7;
  background: #fff;

  display: flex;
  display: -webkit-flex; /* old versions of Chrome/Safari/Opera */
  display: -ms-flexbox; /* IE10 */
  flex-direction: column;

  height: 100vh;
  overflow-y: hidden;
}


h1, h2, h3 {
  color: #000;
  font-family: "Amiri", Arial, sans-serif;
  font-weight: 500;
  margin: 0;
}

.header {
  padding: 1rem;
  background-color: #cfe3ea;
}
.cover {
  background: url(../images/img_bg_2.jpg) no-repeat;
  background-size: cover;
  background-position: 30%;
  flex: auto;
}

.logo {
  background: url(../images/Peblinge_Invest-logos_transparent_3.png) no-repeat;
  background-size: cover;
  height: 100px;
  width: clamp(100px, 100%, 600px);
  margin-left: calc(-0.14 * clamp(100px, 100%, 600px));
  margin-right: calc(-0.14 * clamp(100px, 100%, 600px));
  background-position: left;
}

.p {
  font-size: 18px;
  line-height: 1.5;
  color: #303030;
}
.content {
  display: flex;
  display: -webkit-flex; /* old versions of Chrome/Safari/Opera */
  display: -ms-flexbox; /* IE10 */

  flex-wrap: wrap;
  -webkit-flex-wrap: wrap; /* old versions of Chrome/Safari/Opera */

}
.contact {
  padding: 1rem;
}
.contact p,
.contact a {
  margin: 0;
  padding-top: 0.1rem;
  color: white;
  text-decoration:  none;
}

@media (min-height: 300px) {
  .contact {
    padding-top: clamp(10px, 8vh, 50px);
  }
  .header {
    padding-top: clamp(5px, 3vh, 5rem);
    padding-bottom: clamp(5px, 3vh, 5rem);
  }
  h1 {
    font-size: clamp(16px, 5vh, 10rem);
  }
  h3 {
    font-size: clamp(12px, 3.5vh, 5rem);
  }
  .contact p,
  .contact a {
    margin: 0;
    padding-top: 0.05rem;
    font-size: clamp(12px, 2.5vh, 1.4rem);
    color: white;
    text-decoration:  none;
  }
}
@media (min-height: 600px) {
  .contact {
    padding-top: clamp(10px, 15vh, 500px);
  }
}
@media (min-height: 1440px) {
  .contact {
    padding-top: clamp(10px, 15vh, 500px);
  }
  .header {
    padding-top: clamp(5px, 3vh, 5rem);
    padding-bottom: clamp(5px, 3vh, 5rem);
  }
  h1 {
    font-size: clamp(16px, 6vh, 10rem);
  }
  h3 {
    font-size: clamp(12px, 4vh, 5rem);
  }
  .contact p,
  .contact a {
    margin: 0;
    padding-top: 0.05rem;
    font-size: clamp(12px, 3vh, 1.4rem);
    color: white;
    text-decoration:  none;
  }
}
@media (min-width: 400px) {
  .contact {
    padding-left: clamp(20px, 10vw, 200px);
    padding-right: 1rem;
  }
  .header {
    padding-left: clamp(20px, 10vw, 200px);
    padding-right: 1rem;
  }
}