/**
 * Theme Name: ByggoventTail
 */



h1{
    font-size: clamp(2rem, 4vw, 3.5rem);
}

body{
    font-family: 'Inter', sans-serif;
    font-weight: 399;
    font-size: clamp(1rem, 1.5vw, 1.5rem);
}

#heightFlow {
  height: max-content;
}

#footerFlow {
  height: max-content;
}

footer{
    font-size: clamp(0.75rem, 2vw, 1.125rem);
}

.logotyper{
    width: clamp(126px, 40%, 331px);
}
.arrow{
    width: clamp(26px, 5vw, 56px);
    height: auto;
}

.contain{
    padding-left: 1rem;
    padding-right: 1rem;
}

.kontakt {
    color: #E4E3E3;
    text-decoration: none;
    position: relative;
    transition: color 0.3s ease;
  }


  
  .kontakt::after {
    content: '';
    position: absolute;
    right: 0;
    bottom: -2px;
    width: 0;
    height: 2px;
    background: #ffffff;
    transition: width 0.3s ease;
  }
  
  .kontakt:hover {
    color: #ffffff;
  }
  
  .kontakt:hover::after {
    width: 100%;
  }

  a svg {
    transition: transform 0.3s ease;
  }
  
  a:hover svg {
    transform: scale(1.1);
  }
  
  a:hover svg path {
    stroke: #ffffff;
  }

.adress {
    text-decoration: none;
  }
  
  .adress p {
    position: relative;
    padding-bottom: 2px;      
    margin: 0;                
  }

  .adress p::after {
    content: '';
    position: absolute;
    left: 0;                 
    bottom: 0;
    width: 0;
    height: 2px;
    background: #ffffff;      
    transition: width 0.3s ease;
  }
  
  .adress:hover p::after {
    width: 100%;
  }

.slideIn{
    transform: translateY(-30%);
    opacity: 0;
    animation: slideInTop 0.7s ease-in-out forwards;
}


@keyframes slideInTop {
    from {
      transform: translateY(-30%);
      opacity: 0;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }

  .slideInBottom{
    transform: translateY(30%);
    opacity: 0;
    animation: slideInUnder 0.5s ease-in-out forwards;
    animation-delay: 0.3s;
}

  @keyframes slideInUnder {
    from {
      transform: translateY(30%);
      opacity: 0;
    }
    to {
      transform: translateX(0);
      opacity: 1;
    }
  }
/*   @keyframes slideInLarge {
    from {
      transform: translateY(-100%);
      opacity: 0;
    }
    to {
      transform: translateX(0);
      opacity: 1;
    }
  }

  .uppdateringContainer{
    animation: slideInLarge 0.5s ease ;
  } */

  @media (min-width:450px) {
    .contain{
       padding-left: 2rem;
       padding-right: 2rem;

    }
   }
  @media (min-height:538px) {
    #heightFlow {
      height: 70svh;
    }
    
    #footerFlow {
      height: 30svh;
    }
   }

  @media (min-width:768px) {
    .contain{
       padding-left: 3rem;
       padding-right: 3rem;

    }
   }

@media (min-width:1024px) {
 .contain{
    padding-left: 4rem;
    padding-right: 4rem;
    max-width: 1512px;
    margin-left: auto;
    margin-right: auto;
 }

 .adress p::after {
    left: auto;
    right: 0;                 
  }

  .kontakt::after {
    right: auto;
    left: 0;
  }
}