.hamburger-menu {
    margin:0 10 0 0 ;
    cursor: pointer;
    display: none;
  }
  
  .hamburger-menu span {
    display: none;
    width: 0px;
    height: 0px;
    margin: 0px;
    background-color:   #ffffff;
  }


header nav{
  background-color:#1C2431;
  width:100%;
  height:45px;
  display:flex;
  align-items: center;
  justify-content: space-between;
  }
header nav ul{
  width:100%;
  list-style-type: none;
  margin:0;
  padding:0;
  display:flex;
  justify-content:space-between;

}
header nav ul>li{
margin:0;
padding:0;
}
header nav ul>li>ul{
 
    z-index:100;
    max-height:0px;  
    overflow:hidden; 
    background-color:#1C2431;
    display:flex;
    flex-direction: column;
    align-items :flex-start;
    position:absolute;
    width:230px !important;
 
}
header nav ul>li>ul>li{
padding:5px 3px 5px 10px       
}

header nav ul>li>ul>li>a:hover{
   text-decoration: none;;
}

header nav ul>li:hover>ul{
    padding-top:10px;
    width:400px;
    box-shadow:3px 5px 4px rgba(0,0,0,0.4);
    max-height:900px;
    -webkit-transition:max-height  0.7s linear;
    -moz-transition:max-height 0.7s linear;
    transition:max-height 0.7s linear;
}

header nav ul  li a{
text-decoration: none;
font-size: 14px;
color: #f6f6f6;
text-decoration: underline;
text-decoration-style: solid;
text-underline-offset: 3px;
text-decoration-thickness: 2px;
text-decoration-color: #EDE164;
}

header nav ul  li a >div{
    font-weight: 300;
    padding:2px 0 5px 0;
    color: #000000;
}

header nav ul .show {
    display: block;
  }



@media (max-width: 768px) {

   .hamburger-menu {
    border-radius: 4px;
    border: 2px solid #949494;
    margin: 5px;  
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 37px;
    height:37px;
  }
  
  .hamburger-menu span {
    display: block;
    width: 25px;    
    height: 3px;
    margin: 1px 0; 
    background-color: #ffffff;
    border-radius: 2px;
  }
  header nav{
    height:0px;
    }


  header nav ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    position: fixed;
    left: -100vw;
    width: 100vw;
    height: 100vh;
    background: #1C2431;
    z-index: 1000;
    box-shadow: 3px 5px 4px rgba(0,0,0,0.4);
    top: 51px; 
    transition: left 0.4s cubic-bezier(.77,0,.18,1);
    overflow-y: auto;
  }

header nav ul  li a{
text-decoration: none;
font-size: 16px;
color: #f6f6f6;
}
  header nav ul.show {
   left: 0; 
 
}

  header nav ul > li {
    text-align: left;;
    width: 100%;
    margin: 0;
    padding: 18px 24px;
    border-bottom: 1px solid #333;
    cursor: pointer;
  }

    header nav ul > li:first-child{
          border-top: 1px solid #333;
    }
  
  header nav ul > li:hover{
    background: #2c323c;
  }

       header nav ul>li:hover>ul{
        padding-top:0px;
        box-shadow:0px 0px 0px rgba(0,0,0,0.4);
        max-height:0px;
    }

}
 

/* Скрываем подменю по умолчанию */
header nav ul > li > ul {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s cubic-bezier(.77,0,.18,1);
}

/* Открытое подменю */
header nav ul > li.open > ul {
  max-height: 260px; /* достаточно большое значение */
}

/* Кнопка-стрелочка */
.dropdown-toggle {
  display: none;
  background: none;
  border: none;
  margin-left: 8px;
  font-size: 22px;
  color: #fff;
  cursor: pointer;
}

@media (max-width: 768px) {
  .dropdown-toggle {
    display: inline;
  }
  header nav ul > li > ul {
    position: static;
    width: 100vw !important;
    background: #232b39;
    box-shadow: none;
    padding-left: 24px;
  }
}

@media (max-width: 400px) {


  .tab{
    flex-direction: column;
  }

.tab > div{
    width:99% !important;
  }
}