* {
  padding: 0;
  margin: 0;
}

html {
  height: 100%;
  scroll-behavior: smooth;
}

body {
  background-position: center;
  background-size: cover;
  background-color: #404045;
  background-image: url(img/profilepicture.jpg);
  background-repeat: no-repeat;
}

header {
  display: none;
}
/* Navigation bar ========================================== */
.nav-phone {
  position: fixed;
  top: 0;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  background: -webkit-linear-gradient(to right, #0b1b2bd8, #7c879498);
  background: linear-gradient(to right, #070808da, #272b3081);
}
.nav-phone img {
  margin-left: auto;
  margin-right: auto;
  height: 23vw;
  width: 60vw;
}
/* Burger menu  */
label {
  color: rgb(255, 250, 225);
  margin-left: 30px;
  font-size: 30px;
  line-height: 20px;
  cursor: pointer;
  float: left;
  margin-top: 7vw;
  size: 7vw;
}
.menu {
  margin-top: 5vw;
  text-align: center;
  display: none;
}
.nav-link {
  text-decoration: none;
  color: rgb(252, 202, 109);
  line-height: 30px;
  display: block;
  border-bottom: 1px solid mistyrose;
}
/* logikken under finn jeg fra kilden som er nevnt i kommentaren inni ".nav-phone"*/
#openmenu {
  display: none;
}
#openmenu:checked + .menu {
  display: block;
}
/* bruk av kilde = ferdig */

.nav-laptop {
  display: none;
  background: -webkit-linear-gradient(to right, #151718bd, #51575fa9);
  background: linear-gradient(to right, #070808be, #1c1e2086);
}

h1 {
  /* the line below is from grepper, google searhed: css font with border. Didnt find link*/
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
  font-family: sans;
  color: white;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 110px;
  font-weight: 600;
  font-size: 28px;
}
/* Gallery   ================================================= */
.project-display {
  background: -webkit-linear-gradient(to right, #131210, #f2f7b1);
  background: linear-gradient(to right, #95977f, #f8f7b7);
  margin-top: 140px;
  padding-top: 1px;
  height: 330vw;
  display: block;
}
.project-display p {
  font-family: sans, Calibri;
  padding-top: 15px;
  font-size: 18px;
  color: lightyellow;
}

.project1 {
  background: -webkit-linear-gradient(to right, #010102, #4a4c69);
  background: linear-gradient(to right, #000000, #424253);
  margin: 13px 5px 15px 5px;
  height: 70vw;
}
.project1 img {
  float: left;
  width: 63%;
}

.project2 {
  background: -webkit-linear-gradient(to right, #010102, #37285c);
  background: linear-gradient(to right, #000000, #2d423a);
  margin: 13px 5px 15px 5px;
  height: 72vw;
}
.project2 img {
  float: left;
  width: 63%;
}

.project3 {
  background: -webkit-linear-gradient(to right, #010102, #403757);
  background: linear-gradient(to right, #000000, #393864);
  margin: 13px 5px 15px 5px;
  height: 71vw;
}
.project3 img {
  float: left;
  width: 63%;
}

.project4 {
  background: -webkit-linear-gradient(to right, #020101, #853030);
  background: linear-gradient(to right, #000000, #813c51);
  margin: 13px 5px 15px 5px;
  height: 71vw;
}
.project4 img {
  /* padding-top: 17px; */
  float: left;
  width: 63%;
}
.undertext {
  text-align: center;
  color: black;
  text-decoration: none;
}
.undertext h3 {
  font-family: Sans, Calibri;
  font-size: 14px;
}
.undertext a {
  font-family: Sans;
  padding: 5px;
  font-weight: 400;
  color: rgb(4, 1, 37);
  font-size: 20px;
  text-decoration: none;
  border-bottom: 1px solid rgb(0, 0, 0);
}

.background2 {
  width: 100vw;
}

.googlemaps {
  width: 100vw;
  padding-bottom: 30px;
  padding-top: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.googlemaps iframe {
  width: 90vw;
}

footer {
  background: -webkit-linear-gradient(to right, #151718, #006eff);
  background: linear-gradient(to right, #070808, #56687a);
  width: right, left;
  margin-left: auto;
  margin-right: auto;
  padding-top: 15px;
  padding-bottom: 15px;
  text-align: center;
  color: mistyrose;
}
footer a {
  color: mistyrose;
}

@media only screen and (min-width: 700px) {
  .nav-phone img {
    height: 12vw;
    width: 30vw;
    margin-left: 35vw;
  }
  .label {
    margin-bottom: 5vw;
    margin-top: 2;
  }
  .menu {
    margin-top: 5vw;
  }
}