/* >>>>>>>>>>>>>>>  Media Queries <<<<<<<<<<<<<<<<<< */

@media screen and (max-width: 1200px) {
  #top-section-profile-image .profile-image {
    width: 75px;
    height: 75px;
  }
} 

@media screen and (max-width: 900px) {
  .top-section-intro,
  .top-section-profile-text {
    width: 100%;
  }

  .primary-main {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  #main-menu li {
    margin: 0;
  } 
  
  #main-menu a {
    font-size: .75rem;
  } 
  
  .main-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .key-area-container,
  .contact-container {
    height: 450px;
  }

  #priser-content-section div.priser-container {
    width: 100%;
  }
  
} 

@media screen and (max-width: 780px) {
  #main-menu {
    display: none;
  }

  #secondary-menu{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
  
  .mobile-menu_svg {
    fill: var(--light-text-color);
    width: 35px;
    height: 25px;
  }

  #footer-container {
    font-size: .9rem;
  }
}

@media screen and (max-width: 700px) {
  #grid {
    grid-template-rows: 80px minmax(calc(100vh - 170px), auto) 95px;
  }
  
  #footer-container {
    flex-direction: column;
  }
  
  .footer-info,
  .footer-copyright {
    width: 100%;
    justify-content: center;
  }
}

@media screen and (max-width: 550px) {
  .company-information-card {
    flex-direction: column;
  }

  #info-content-section .information-card-left-column {
    padding: 20px;
  }

  #info-content-section .information-card-logo-wrapper > img {
    width: 200px;
  }

  #info-content-section .company-logo-edge {
    display: none;
  }
}

@media screen and (max-width: 480px) {
  #company-info {
    display: none;
  }

  #header-width {
    grid-template-columns: 200px calc(100% - 200px);
  }

  #main-nav {
    width: calc(100% - 10px);
  }

  .mobile-menu {
    right: 0;
  }

  #profile-content-section .cv-item-container-main {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    
  }

  #profile-content-section .cv-item-wrapper {
    font-size: .8rem;
  }
}

@media screen and (max-width: 390px) {
  #contact-formular-wrapper {
    padding: 15px;
  }
}