style.css

@import url(http://fonts.googleapis.com/css?family=Roboto:300);

*{margin: 0; padding: 0;
}

html {
  scroll-behavior: smooth;
}

@media only screen and (min-width: 1200px){
header {
width: 100%;
display: block;}

.logo {
  width: 20%;
  float: left;
height: 24vh;
background-color: #007CAA;
display: block;
  min-width: 220px;
}


.nav {
float: right;
width: 80%;
background-color: #FFF;
height: 24vh;
display: block;
min-width: 950px;
max-width: 1200px;
}

.nav ul {
padding: 5%;
padding-top:4%;
padding-left: 0%;
padding-bottom: 4%;
  float: right;
  list-style-type: none;
}

.nav li a {
  display: block;
}

.nav li {
  float: right;
  margin: 20px;
}

.nav a {
    text-decoration: none;
    font-family: 'Lato', sans-serif;
    font-size: 1.5vw;
    color: #007CAA;
    text-transform: uppercase;
}

.container {
  height: 100vh;
  background-color: #5CCA0E;
  width: 100%;
  display: inline-block;
  }

  .container1 {
    height: 76vh;
    background-image: url("fyn.jpg");
    background-position: right;
    background-size: cover;
    width: 80%;
    display: block;
    float: right;
    border-top: 0.1px #007CAA solid;
    }

.text3 {float: left;width:50%;display: inline;  color: #FFF;background-color: #5CCA0E;
text-align: center; height: 100vh;}

.text3 h3 {
  font-family: "Roboto";
  font-size: 30px;
  text-align: center;
  text-transform: uppercase;
  font-family: 'Lato', sans-serif;
  padding-top: 100px;
}

.text3 p {
  font-size: 20px;
font-family: 'Roboto';
padding-left: 40px;
padding-right: 40px;
text-align: left;
}

.text7 {float: left;width:100%;display: inline-block;  color: #FFF;background-color: #013220;
text-align: center; height: auto;  height: 270vh; border-bottom: 40px solid #5CCA0E;
}

.text7 h1 {
  font-family: "Roboto";
  font-size: 30px;
  text-align: center;
  text-transform: uppercase;
  font-family: 'Lato', sans-serif;
  padding-top: 50px;
}

.text7 p {
  font-size: 20px;
font-family: 'Roboto';
padding-left: 40px;
padding-right: 40px;
padding-bottom: 40px;
text-align: center;
}

.text {
  width: 50%;
  height: 100vh;
  background-color: #FFF;
  float: right;
  display: inline-block;
}

.tex {
  width: 50%;
  height: 100vh;
  background-color: #FFF;
  float: right;
  display: inline-block;
  background-image: url("aktivitet.png");
  background-size: cover;
  background-position: center;
}

.container1 {
  height: 76vh;
  background-image: url("fyn.jpg");
  background-position: top;
  background-size: contain;
  width: 80%;
  display: block;
  float: right;
  border-top: 0.1px #007CAA solid;
  }

.text4 {float: right;width:50%;display: inline;  color: #FFF;background-color: #5CCA0E;
text-align: center; height: 100vh;}

.text4 h3 {
font-family: "Roboto";
font-size: 30px;
text-align: center;
text-transform: uppercase;
font-family: 'Lato', sans-serif;
padding-top: 100px;
}

.text4 p {
  font-size: 20px;
font-family: 'Roboto';
padding-left: 40px;
padding-right: 40px;
text-align: left;}

.text5 {
width: 50%;
height: 100vh;
background-color: #FFF;
float: left;
display: inline-block;
background-image: url("billed.jpg");
background-size: cover;
background-position: center;
}


.line {
  width: auto;
  min-width: 220px;
  height: 76vh;
  min-height: 300px;
  background-color: #FFF;
background-image: url("banner.jpg");
background-size: cover;
background-position: left;
display: flex;
border-top: 0.1px #007CAA solid;
border-right: 0.1px #007CAA solid;
}
.button1 {
  margin: 16vh;
  padding: 30px;
  font-size: 20px;
  background-color: #FFF;
  color: #5CCA0E;
  border: 0px;
}

.button1 {
  text-decoration: none;
  color: #5CCA0E;
  font-family:'Lato', sans-serif;
  display: block;
}


.button2  {
  text-decoration: none;
  color: #5CCA0E;
  font-family: 'Lato', sans-serif;
  display: block;
}

.button1:hover {
  background-color: #013220;
  color: #FFF;
  border: 0px;
}

.button2 {
  margin: 16vh;
  padding: 30px;
  font-size: 20px;
  background-color: #FFF;
  color: #5CCA0E;
  border: 0px;
}

.button2:hover {
  background-color: #013220;
  color: #FFF;
  border: 0px;
}

.button11 {
  font-size: 20px;
  background-color: #FFF;
  color: #000;
  border: 0px;
  display: inline-block;
  width: 100%;
text-align: left;
margin-top: 1.0em;
padding: 1.4em;
background-image: url("ok5.jpg");
background-size: cover;
height: 60vh;
}


.button11:hover {
  background-image: url("ok4.jpg");
  color: #FFF;
}

.button12 {
  font-size: 20px;
  background-color: #FFF;
  color: #000;
  border: 0px;
  display: inline-block;
  width: 100%;
text-align: left;
margin-top: 1.0em;
padding: 1.4em;
background-image: url("ok8.jpg");
background-size: cover;
height: 60vh;
}


.button12:hover {
  background-image: url("ok7.jpg");
  color: #FFF;
}


.button13 {
  font-size: 20px;
  background-color: #FFF;
  color: #000;
  border: 0px;
  display: inline-block;
  width: 100%;
text-align: left;
margin-top: 1.0em;
padding: 1.4em;
background-image: url("banneret.jpg");
background-size: cover;
background-position: center;
height: 60vh;
}


.button13:hover {
  background-image: url("banneret.jpg");
  color: #FFF;
}

.button10 {
  font-size: 20px;
  background-color: #FFF;
  color: #000;
  border: 0px;
  display: inline-block;
  width: 100%;
text-align: left;
margin-top: 1.0em;
padding: 1.4em;
background-image: url("ok2.jpg");
background-size: cover;
height: 60vh;
}


.button10:hover {
  background-image: url("ok.jpg");
  color: #FFF;
}



footer {
  width: 100%;
  display: inline-block;
  height: 25vh;
  background-color: #013220;
  text-align: center;
  background-image: url("grass.png");
    background-repeat: no-repeat;
  background-position: bottom;

}

footer p {
padding-top: 5vh;
font-family: "lato";
color: #FFF;
font-size: 125%;
}

.text6 {
width: 50%;
height: 100vh;
background-color: #FFF;
float: left;
display: inline-block;
background-image: url("borger.jpg");
background-size: cover;
background-position: center;
}

.text1 {}


}

@media only screen and (max-width: 1200px){
.nav {
  display: none;
}


  .text3 {float:left;width:100%;display: inline-block;  color: #FFF; background-color: #5CCA0E;
  text-align: center; height: auto;}

  .text3 h3 {
    font-family: "Roboto";
    font-size: 150%;
    text-align: center;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    padding: 5%;
    background-color: #007CAA;
  }

  .text3 p {
    font-size: 120%;
  font-family: 'Roboto';
padding: 40px;
  text-align: left;
  }
  .button1 {
    margin: 10%;
    padding: 30px;
    font-size: 20px;
    background-color: #FFF;
    color: #5CCA0E;
    border: 0px;
  }

  .button1:hover {
    background-color: #013220;
    color: #FFF;
    border: 0px;
  }

  .text40 {
    width: 100%;
    height: 400px;
    background-color: #FFF;
    display: inline-block;
    background-image: url("aktivitet.png");
    background-size: cover;
    background-position: center;
  }

  .text50 {
    width: 100%;
    height: 400px;
    background-color: #FFF;
    display: inline-block;
    background-image: url("billed.jpg");
    background-size: cover;
    background-position: center;
  }

  .text4 {float:left;width:100%;display: inline-block;  color: #FFF; background-color: #5CCA0E;
  text-align: center; height: auto;}

  .text4 h3 {
    font-family: "Roboto";
    font-size: 150%;
    text-align: center;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    padding: 5%;
    background-color: #007CAA;
  }

  .text4 p {
    font-size: 120%;
  font-family: 'Roboto';
  padding: 40px;
  text-align: left;
  }
  .button2 {
    margin: 10%;
    padding: 30px;
    font-size: 20px;
    background-color: #FFF;
    color: #5CCA0E;
    border: 0px;
  }

  .button2:hover {
    background-color: #013220;
    color: #FFF;
    border: 0px;
  }

  .text50 {
    width: 100%;
    height: 400px;
    background-color: #FFF;
    display: inline-block;
object-fit: cover;
  }

  .button11 {
    font-size: 20px;
    background-color: #FFF;
    color: #000;
    border: 0px;
    display: inline-block;
    width: 100%;
  text-align: left;
  margin-top: 1.0em;
  padding: 1.4em;
  background-image: url("ok5.jpg");
  background-size: cover;
  height: 60vh;
  }


  .button11:hover {
    background-image: url("ok4.jpg");
    color: #FFF;
  }

  .button12 {
    font-size: 20px;
    background-color: #FFF;
    color: #000;
    border: 0px;
    display: inline-block;
    width: 100%;
  text-align: left;
  margin-top: 1.0em;
  padding: 1.4em;
  background-image: url("ok8.jpg");
  background-size: cover;
  height: 60vh;
  }


  .button1 {
    margin: 16vh;
    padding: 30px;
    font-size: 20px;
    background-color: #FFF;
    color: #5CCA0E;
    border: 0px;
  }

  .button1 {
    text-decoration: none;
    color: #5CCA0E;
    font-family:'Lato', sans-serif;
    display: block;
  }


  .button2  {
    text-decoration: none;
    color: #5CCA0E;
    font-family: 'Lato', sans-serif;
    display: block;
  }

  .button1:hover {
    background-color: #013220;
    color: #FFF;
    border: 0px;
  }

  .button2 {
    margin: 16vh;
    padding: 30px;
    font-size: 20px;
    background-color: #FFF;
    color: #5CCA0E;
    border: 0px;
  }

  .button2:hover {
    background-color: #013220;
    color: #FFF;
    border: 0px;
  }

  .button12:hover {
    background-image: url("ok7.jpg");
    color: #FFF;
  }


  .button13 {
    font-size: 20px;
    background-color: #5CCA0E;
    color: #000;
    border: 0px;
    display: inline-block;
    width: 100%;
  text-align: left;
  background-image: url("banneret.jpg");
  background-size: contain; background-repeat: no-repeat;
  background-position: center;
  height: 300px;
  }


  .button13:hover {
    color: #FFF;
    opacity: 0.7;
  }

  .button10 {
    font-size: 20px;
    background-color: #FFF;
    color: #000;
    border: 0px;
    display: inline-block;
    width: 100%;
  text-align: left;
  margin-top: 1.0em;
  padding: 1.4em;
  background-image: url("ok2.jpg");
  background-size: cover;
  height: 60vh;
  }


  .button10:hover {
    background-image: url("ok.jpg");
    color: #FFF;
  }

  .text7 {float: left;width:100%;display: inline-block;  color: #FFF;background-color: #013220;
  text-align: center; height: auto;  height: 270vh;
  }

  .text7 h1 {
    font-family: "Roboto";
    font-size: 30px;
    text-align: center;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    padding-top: 50px;
  }

  .text7 p {
    font-size: 20px;
  font-family: 'Roboto';
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 40px;
  text-align: center;
  }

  footer {
    width: 100%;
    display: inline-block;
    height: 150px;
    background-color: #013220;
    text-align: center;

  }

  footer h2 {
  padding-top: 4%;
  font-family: "lato";
  color: #FFF;
  font-size: 125%;
  }

.text {
display: none;

}

.text5 {
  display: none;
}
  }