@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');



body {
    margin: 0;
    padding: 0;
}


.navbar {
overflow: hidden;
position: fixed;
z-index: 10000;
display: flex;
flex-direction: row;
background-color: white;
font-family: 'Roboto', sans-serif;
list-style: none;
text-decoration: none;
width: 100%;
}


.menu {
   display: flex;
   gap: 100%;
}


.navbar a {
  color: black;
   padding: 14px 16px;
   text-decoration: none;
   font-size: 17px;
   display: block;
   list-style: none;
   text-decoration: none;
 }
 

.navbar #myLinks {
   display: none;
   
 }

.navbar a.icon {
   background: #F5C116;
   color: black;
  display: block;
  position: absolute;
  right: 30px;
  top: 30px;
}

.menu-links a:hover {
   color: #F5C116;
   
 }

.menu-links {
   display: flex;
   flex-direction: row;
    text-decoration: none;
    list-style: none;
    gap: 2em;
    align-items: center;
  
    
}

.menu-links2 {
   display: flex;
   flex-direction: column;
    text-decoration: none;
    list-style: none;
    gap: 0.5em;
  
    
}
.menu-links2 a {
    color: black;
    text-decoration: none;
    font-size: 17px;
    display: block;
    list-style: none;
    text-decoration: none;
}

.menu-links2 a:hover {
    color: #F5C116;

}

.menu-links2 p {
   font-size: 1.5em;

}




.logo img {
   width: 100px;
   cursor: pointer;
   padding-top: 1em;
   padding-left: 1em;
   padding-bottom: 1em;
}

.logo {

    text-decoration: none;
    list-style: none;
}




.landingpage h1 {
    font-size: 3em;
    font-family: 'Roboto', sans-serif;
}

.landingpage {
    padding: 6em 0 6em 6em;
    
  
 
}

.landingpage-tekst {
    
    padding-top: 2em;

}

.landingpage-boks p {
    font-family: 'Roboto', sans-serif;
    line-height: 25px;
}

.landingpage-boks {
    display: flex;
    gap: 4em;
    
}

.landingpage-boks img{
    width: 1000px;
    
}


.page2 {
    background-color: black;


}

.page2-boks img {
    border-radius: 50% 50% 0 0;
   width: 400px;
   height: 400px;
  

}

.page2-boks {
    display: flex;
    color: white;
    padding: 10em 7em 10em 7em;
    font-family: 'Roboto', sans-serif;
    justify-content: center;
}

.page2-tekst h2 {
   font-size: 2em;
   line-height: normal;
}

.page2-tekst {
    padding: 0 5em 0 5em;
    line-height: 25px;
 }

  button {
    border: none;
    padding: 1em 2em 1em 2em;
    cursor: pointer;
    
 }

 button:hover {
    
    background-color: #F5C116;
 }



 .page3 {
    background-image: url("/images/page3img.jpg");
    background-size: cover;
    padding: 10em;
 }


 .cards {
    display: flex;
    gap: 10em;
    padding-top: 10em;
    line-height: 25px;
    font-family: 'Roboto', sans-serif;
 }

 .card1 {
    background-color: white;
    padding: 2em 2em 2em 2em;
    padding-top: 2em;
    margin-bottom: 5em;
 }

 .card2 {
    padding: 2em;
    background-color: #F5C116;
    margin-top: 5em;
 }


 .card3 {
    background-color: #6bacff;
    padding: 2em;
    margin-bottom: 5em;
 }


 .page4 img {
    width: 633px;
    

 }

 .page4 {
    background-color: black;
 }

 .page4-boks  {
   background-color: black;
   color: white;
   display: flex;
   flex-direction: row-reverse;
   gap: 2em;
   padding: 10em 7em 2em 7em;
   font-family: 'Roboto', sans-serif;
   justify-content: center;
   
    

 }
 
 .page4-tekst {
 padding: 0 5em 0 5em;
 line-height: 25px;
}


.page4-tekst h3 {
    font-size: 2em;
    line-height: normal;
}

.page4-images {
   display: flex;
   flex-direction: row-reverse;
   gap: 2em;
   padding-right: 7em;
   padding-bottom: 10em;
}


.page4-images img {
    width: 380px;
 }


 .page5 img {
   width: 700px;
  
   

    border-radius:  0 0 50% 0;
 }

 .page5-boks {
    display: flex;
    flex-direction: row-reverse;
    gap: 2em;
    font-family: 'Roboto', sans-serif;
    
    
  }

  .page5-tekst {
    padding: 5em 5em 0 5em;
    line-height: 25px;
  }

  .page5-tekst h3 {
    font-size: 2em;
    line-height: normal;
  }



  .page5-tekst button {
    border: none;
    cursor: pointer;
    padding: 1em 2em 1em 2em;
    background-color: #F5C116;
    
  }

  .page5-tekst button:hover {
    
    background-color: white;
 }


 
 .page6 img {
    width: 633px;
    

 }

 .page6 {
    background-color: white
 }

 .page6-boks  {
   background-color: white;
   color: black;
   display: flex;
   flex-direction: row-reverse;
   gap: 2em;
   padding: 10em 7em 2em 7em;
   font-family: 'Roboto', sans-serif;
   justify-content: center;
   
    

 }
 
 .page6-tekst {
 padding: 0 5em 0 5em;
 line-height: 25px;
}


.page6-tekst h3 {
   font-size: 2em;
   line-height: normal;
}

.page6-images {
   display: flex;
   flex-direction: row-reverse;
   gap: 2em;
   padding-right: 7em;
   padding-bottom: 10em;
}


.page6-images img {
    width: 380px;
 }



 
.page7 {
    background-color: black;



}

.page7-boks img {
border-radius: 0 0 0 50%;
   width: 700px;
  

}

.page7-boks {
    display: flex;
    flex-direction: row-reverse;
    color: white;
    background-color: black;
    font-family: 'Roboto', sans-serif;
    justify-content: center;
   
}

.page7-tekst h2 {
   font-size: 2em;
    line-height: normal;
}

.page7-tekst {
    padding: 5em 5em 0px;
    line-height: 25px;
 }

 .page8 {
    background-color: black;


}

.page8-boks img {
    border-radius: 50% 50% 0 0;
   width: 400px;
   height: 400px;
  

}

.page8-boks {
    display: flex;
    color: white;
    padding: 0 7em 10em 7em;
    font-family: 'Roboto', sans-serif;
    justify-content: center;
}

.page8-tekst h2 {
   font-size: 3em;
}

.page8-tekst {
    padding: 5em 5em 0 5em;
    line-height: 25px;
 }


footer {
    background-color: white;
}

.footer-tekst {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 10em;
    font-family: 'Roboto', sans-serif;
    line-height: 25px;
    padding: 2em;
  align-items: center;
}




 





@media only screen and (max-width: 600px) {



    .landingpage-boks img {
        width: 100%;

    }

    .landingpage  {
        padding: 2em 0 0 0;
        width: 100%;
    }


    .landingpage-boks {
        padding: 2em;
        flex-direction: column;
    }

    .landingpage-tekst h1{
    padding: 0;
    }
  

    .landingpage-tekst {
    
        padding-top: 1em;
    
    }

    .page2-boks img {
        width: 100%;
        height: 100%;
      
     
     }

     .page2-boks {
        display: flex;
        flex-direction: column;
        padding: 2em;
     
     }

     .page2-tekst {
        padding: 0;
        
        }


    .cards {
        flex-direction: column;
        gap: 2em;
        margin: 0;
         }


         .page3 {
            padding: 2em;
         }

         .page4-boks {
            display: flex;
            flex-direction: column;
            padding: 2em;

         }

         .page4 img {
            width: 100%;
         }

         .page4-tekst {
            padding: 0;
         }

         .page4-images {
            padding: 2em;
            display: flex;
            flex-direction: column;
         }

         .page5-boks {
            padding: 2em;
            display: flex;
            flex-direction: column-reverse;
         }

         .page5-tekst {
            padding: 0;
           
         }

         .page5-boks img {
            width: 100%;
           
         }

         .page6-boks {
            padding: 2em;
            display: flex;
            flex-direction: column;
         }

         .page6-tekst {
            padding: 0;
         }

         .page6-boks img {
            width: 100%;
           
         }

         .page6-images {
            padding: 2em;
            display: flex;
            flex-direction: column;
         }

         .page6-images img {
           
            width: 100%;
         }


         .page7-boks {
            padding: 2em;
            display: flex;
            flex-direction: column;
            gap: 2em;
         }

         .page7-boks img {
            width: 100%;
         }

         .page7-tekst {
            padding: 0;
         }

         .page8-boks {
            padding: 2em;
            display: flex;
            flex-direction: column;
         }

         .page8-boks img {
            width: 100%;
            height: 100%;
        }

        .page8-tekst {
            padding: 0;
         }

         .footer-tekst {
            display: flex;
            flex-direction: column;
            align-items: center;

         }

         .menu-links {
            display: none;
           
         }

       
         .menu {
            flex-direction: column;
           
         }

         .cards {
            padding-top: 15em;
           }

         .card1 {
            margin: 0;

         }

         .card2 {
            margin: 0;
         }

         .footer-tekst {
            display: flex;
            gap: 2em
         }

      



      


  }


  @media only screen and (max-width: 1000px) and (min-width: 600px) {


    .landingpage-boks img {
        width: 100%;
   
    }

    .landingpage  {
        
      padding: 2em 0 0 0;
        
    }


    .landingpage-boks {
        padding: 2em;
        flex-direction: column;
    }

    .landingpage-tekst h1{
        padding: 0;
    }

    .landingpage-tekst {
    
        padding-top: 1em;
    
    }

    .page2-boks img {
        
        width: 100%;
        height: 100%;
      
     
     }

     .page2-boks {

        display: flex;
        flex-direction: column;
        padding: 10em;
     
     }

     .page2-tekst {
        padding: 0;
        
        }

    .cards {
        flex-direction: column;
        gap: 2em;
        margin: 0;
       
         }


         .page3 {
            padding: 10em;
         }

         .page4-boks {
            display: flex;
            flex-direction: column;
            padding: 10em;

         }

         .page4 img {
            width: 100%;
         }

         .page4-tekst {
            padding: 0;
         }

         .page4-images {
            padding: 2em;
            display: flex;
            flex-direction: column;
         }

         .page5-boks {
            padding: 10em;
            display: flex;
            flex-direction: column-reverse;
         }

         .page5-tekst {
            padding: 0;
           
         }

         .page5-boks img {
            width: 100%;
           
         }

         .page6-boks {
            padding: 10em;
            display: flex;
            flex-direction: column;
         }

         .page6-tekst {
            padding: 0;
         }

         .page6-boks img {
            width: 100%;
           
         }

         .page6-images {
          padding: 2em;
            flex-direction: column;
         }

         .page6-images img {
            
            width: 100%;
        
         }

         .page7-boks {
            padding: 10em;
            display: flex;
            flex-direction: column;
            gap: 2em;
         }

         .page7-boks img {
            width: 100%;
         }

         .page7-tekst {
            padding: 0;
         }

         .page8-boks {
            padding: 10em;
            display: flex;
            flex-direction: column;
         }

         .page8-boks img {
            width: 100%;
            height: 100%;
        }

        .page8-tekst {
            padding: 0;
         }

         .footer-tekst {
            display: flex;
            flex-direction: column;
            align-items: center;

         }

         .menu-links {
          display: none;
         }

         .menu {
            flex-direction: column;
         }


         .cards {
            padding-top: 15em;
           }
        
         
         .card1 {
            margin: 0;

         }

         .card2 {
            margin: 0;
         }

         .footer-tekst {
            display: flex;
            gap: 2em
         }

      
      


}


@media only screen and (max-width: 1500px)  {

   .menu {
      display: flex;
      gap: 80%;
     }
  
}

@media only screen and (max-width: 2000px) and (min-width: 1900px)   {

   .menu {
      display: flex;
      gap: 150%;
     }
  
 
 

}







@media only screen and (min-width: 1000px)  {
   .navbar a.icon {
      display: none;
   }

 
 

}