:root{
  --background-color:gray;
}

* {
    box-sizing: border-box;
    min-width: 250px;
    background-color: var(--background-color);
}
.grid-container {
  display: grid;
  grid-template-areas:
  'header'
  'menu'
  'main'
  'footer'
  'contact'
  'flexvirk';
  font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  gap: 10px;
}
.header {
  grid-area: header;
  background-color: var(--background-color);
  text-align: center;
  color: white;
}

.header > h1 {
  font-size: 2em;
}
.header > #jessen_it_logo{
  height:fit-content;
}
nav.menu {
  grid-area: menu;
  font-size: 2em;
  background-color: var(--background-color) ;
  text-align: center;
  box-shadow: 2px 2px 5px hsla(0, 0%, 0%, 0.8);
  color:blue;
}
nav.menu a{
  padding: 10px 15px;
}

.main {
  grid-area: main;
  font-size: 2em;
  background-color: var(--background-color);
  margin: 10%;
}

.main > h1 {
  font-size: 30px;
  margin-bottom: 7px;
}
.main > .name_of_site{
  font-size:2em;
  text-align: center;
}
.main > p {
  margin-bottom: 7px;
}
.footer {
  grid-area: footer;
  background-color: var(--background-color);
  color: blac;
  text-align: center;
  font-size: 2em;
}
.footer .flexvirk {
  grid-area: flexvirk;
  border: 1px solid var(--background-color);
  background-color: var(--background-color);
  padding: 10px;
}
.footer .flexvirk > h2 {
  font-size: 2em;
}

.footer .flexvirk li {
  margin-bottom: 5px;
}
#flexvirk_logo{
  justify-content: center;
}


/* #call_now{
  width: 100px;
  height: 200px;
  position: sticky;
  border-radius: 30px;
  bottom:2%;
  right:2%;
  
} */
.dropdown{
  display: inline-block;
}
.dropdown #link_dropdown{
  background-color: var(--background-color);
  color: blue;
  text-decoration: underline;
  border: none;
  cursor: pointer;
}
.dropdown a{
  display: block;
  color: black;
  text-decoration: none;
  
}
.dropdown .content{
  display: none;
  position: absolute;
  background-color: var(--background-color);
  min-width: 100px;
  box-shadow: 2px 2px 5px hsla(0, 0%, 0%, 0.8);
}
.dropdown:hover .content{
  display: block;
}
.dropdown:hover #link_dropdown{
  background-color: var(--background-color);
}
.dropdown a:hover{
  background-color: hsl(0, 0%, 90%);
}
.image_simple{
  height: 25%;
  width: 25%;
}
@media(max-width:500px){
  .header > #jessen_it_logo {
    max-width: 100%;
  }
  #flexvirk_logo{
    max-width: 100%;
  }
  .image_simple{
    max-width: 100%;
  }
}
@media(min-width:800px){
  *{
    font-size: larger;
  }
  .image_simple{
    width: auto;
    height: auto;
  }

}