*{margin:0;padding:0;box-sizing: border-box;}

body{
    font-family: 'Roboto', sans-serif;
}

nav{

    background-color: white;
    grid-row: 1/2;
    
    margin-left: 100px;
    margin-top: 20px;
    padding: 15px;
    
}

nav ul {
    display: flex;
    gap: 40px;
    list-style-type: none;
    text-transform: uppercase;
    font-weight: 900;
    font-size: 1.5em;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.søg img{

    padding-left: 50px;
    width: 40%;
}
/* nav ul{
    display: flex;
    gap: 40px;
    list-style-type: none;
    text-transform: uppercase;
    
    font-weight: 900;
    font-size: 1.5em;
    
} */
nav ul li{
   text-decoration: none;
}
nav ul li a{
    text-decoration: none;
    color: #053b3b
 }

nav ul li a:hover{
    text-decoration: none;
    color:#ff5715;
    padding-bottom: 4px;
}

.hero{

    height: 100vh;
    width: 100%;

    display: grid;
    grid-template-columns: 200px 500px 200px;
    grid-template-rows: 100px 500px;   
  

    background-image: url(../img/studiokay_hero.png);
    background-position: center;
    margin-top: 10px;
}

li.logotop {
    width: 250%;
    height: auto;
    padding-bottom: 1.5%;
    padding-right: 2.8%;
}

/* .logo{
    grid-column: 1/2;
    grid-row: 1/2;
    background-color: white;
} */

.logotop img{

    width: 100%;
    padding: 100, 0, 0, 100;
    
    margin-top: 30px;
}



.spot {
  font-family: "Bodoni Moda", serif;
  font-weight: 400;
  font-style: normal;
  margin-top: 50px;
  margin-bottom: 50px;

  
}


section#spot {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
  
}

.spot h1{

    font-size: 1.5em;
    padding-top: 100px;

    color:#053b3b;

}

p {
    padding-top: 60px;
    font-size: 0.8em;
}


article#spot-artikel {

    font-size: 1.5em;
    color: #053b3b;

    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    padding-left: 8%;
}

.cta {
    
    
    background-color:#053b3b;
    height: 50px;
    
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    margin: 20px 20px;
    
}

.cta:hover{
    background-color: #ff5715;
    color: white;
}

article#spot-img {
    padding-left: 10%;
}

img.genbrug-img {
    width: 70%;
}


.artikelitems{

    height: 100vh;
    width: 100%;

    font-family: 'Besley', serif;
    font-weight: 600;

    background-color:#ff5715;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 3fr 1fr 1fr;

}
.artikelitems h2{
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
    color: #053b3b;
    font-size: 2em;

    
}
.artikelitems h2 a{
    color:#053b3b;
    margin-top: 60px;

}

.artikel{
  
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 50px;
    padding: 0 100px;

}
.item{
    background-color: white;
}
.itemimg{
    width: 100%;
    height: 200px;

    
}
.itemimg img{
    width: 70%;
    max-height: 100%;
    padding-bottom: 65px;
    padding-left: 90px;
    
    object-fit: cover;
    object-position: center;
    
}
.itemtext{
    height: 200px;
    padding:20px;
}
.itemtext h4{
   font-weight: 800;
   margin-bottom: 10px;
   font-size: 1.5em;
}
.itemtext p{
    font-weight: 100;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9em;
 }


.cta{
    background-color:#053b3b;
    height: 50px;
    
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    margin: 20px 20px;
   

}
.cta:hover{
    background-color: #ff5715;
    color: white;
}
.content{

    width: 100%;
    height: 80vh;

    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 200px auto auto;

}


.content1{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 50px;

    height: 70vh;


    
}
.content1text{
    grid-column: 1/2;
    grid-row: 1/2;
    text-align: right;
   

    padding-top: 100px;
}

.content1text h3{
    font-weight: 900;
    font-size: 3em;
   

}

.content1 img{
    grid-column: 2/3;
    grid-row: 1/2;
    width: 100%;
}
.content2{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 50px;

    height: 70vh;
    margin-top: 60px;

   
}
.content2text{
    grid-column: 2/3;
    grid-row: 1/2;
    text-align: left;

    padding-top: 100px;
}

.content2text h3{
    font-weight: 900;
    font-size: 3em;
   

}

.content2 img{
    grid-column: 1/2;
    grid-row: 1/2;
    width: 100%;
}

.footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 20vh;

    
}

.logofooter img {
    padding: 20px;
    width: 35%;
}

.om,
.skribent,
.adresse {
    font-family: 'Roboto', sans-serif;
    font-weight: 100;
    color: #053b3b;
    text-align: center;
}

.some {
    scale: 50%; 
}


/* .footer{

    width: 100%;
    height: 10vh;


}

footer .logo img{

    
    scale: 20%


}

.om,
.skribent,
.adresse{

    font-family: 'Roboto', sans-serif;
    font-weight: 100;
    color: #053b3b;

    text-align: center;
}

.some{

    scale: 50%
        

} */

/* footer{

    width: 100%;
    height: 10vh;

    display: grid;
    grid-template-columns: 1fr 2fr 1fr;

    padding: 40px 100px;

}

footer .logo img{

    scale: 80%;


}

footer .om{
    
    
    text-align: center;
 
 }

 footer .om h5{
   
    font-family: 'Roboto', sans-serif;
    font-weight: 100;
    color: #053b3b;

}

 footer .skribent{
    
    
    text-align: center;
 
 }

 footer .skribent h5{
   
    font-family: 'Roboto', sans-serif;
    font-weight: 100;
    color: #053b3b;

}

footer .adresse{
    
    
   text-align: center;

}



footer .adresse h5{
   
    font-family: 'Roboto', sans-serif;
    font-weight: 100;
    color: #053b3b;

}

.om,
.skribent,
.adresse {
    display: block;
}


footer .some img{
    width: 50%;
   

} */