body{
  margin: 0;padding: 0;
  background-color: #1b1a1a;
}


header{
  position: fixed;
  width: 100%;
  height: 50px;
  background-color: #000;
  display: flex;
  justify-content: space-around;
  align-items: center;
  
  font-family: Fira Code ,-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;

  top: 0;



}

.logo-mobile{
  display: none;
}
.logo{
  margin: 0;
  padding: 13px 20px;
  color: #ff8282;
  transition: all .3s;
  border-bottom: rgba(0,0,0,0) 2px solid;

}
#logo-active{
  border-bottom: #ff8282 2px solid;

}
.logo:hover{
  color: #000;
  background-color: #ff8282;

}
.list-tab{
  display: flex;
  color: #eee;
}
.l-item{
  padding: 13px 20px;
  transition: all .3s;
  border-bottom: rgba(0,0,0,0) 2px solid;

}
.l-i-active{
  border-bottom: #fff 2px solid;

}
.l-item:hover{
  color: #000;
  background-color: #fff;
}


.list-tab-mobile{
  display: none;
}



.main {
  padding-top: 50px;
}




@media(max-width: 609px) {
  .logo-mobile{
      display: block;
  }
  .logo-desktop{
      display: none;
  }
  .logo{
      padding: 13px 19px;
  }
  .list-tab-desktop{
      display: none;
  }
  .list-tab-mobile{
      display: flex;
  }
  .l-cmd{
      padding: 13px 21.7px;
  }
}


#nojs{
  z-index: 1000;
  position: fixed;
  background-color: #ff3333;
  color: white;
  height: 37px;
  padding: 13px 0 0;
  text-align: center;
  font-family: Fira Code;
  width: 100%;
  top: 0;
}