@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');

html,body{
  overscroll-behavior-x:none;
  overflow-x: hidden;
  width: 100vw;
  height:100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #FFFAF3;
  font-family: 'Helvetica Neue';
}

@font-face {
  font-family: "IBM";
  src:
    local("IBM"),
    url("fonts/IBMPlexMono-Regular.ttf");
}

@font-face {
  font-family: "IBM Bold";
  src:
    local("IBM Bold"),
    url("fonts/IBMPlexMono-Bold.ttf");
}

@font-face {
  font-family: "Lekton";
  src:
    local("Lekton"),
    url("fonts/Lekton-Regular.ttf");
}

header{
  padding-top:3vh;
  padding-left:30px;
}

.link{
  color: #0E0E0E;
  text-decoration: none;
}

.logo{
  text-transform: uppercase;
  font-family: 'Lekton';
  font-size: 2.8vw;
  font-weight: 600;
}

.i-contact{
  padding-left:30px;
  position: fixed;
  bottom: 0;
  padding-bottom:20px;
}

.i-contact a{
  text-decoration: none;
  color:black;
}

.i-contact img{
  width:15px;
  margin-right:10px;
}


@media (aspect-ratio: 16/10) {  

  .logo{
    font-size:2.8vw;
  }

}

@media (aspect-ratio: 16/9) and (min-width: 3000px) { 

  .logo{
    font-size:2.8vw;
  }


}

@media (min-aspect-ratio: 4/3) and (max-aspect-ratio: 5/4){  

  .logo{
    font-size:2.8vw;
  }

}

@media screen and (min-width: 900px) and (max-width: 1100px) {
  header{
    grid-template-columns: 60% 20% 20%;
}

}

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

header{
    grid-template-columns: 55% 25% 20%;
}
.logo{
  font-size:4.8vw;
}
.i-contact{
  grid-template-columns: auto;
}
}