.header nav{
  height: 50px;
  width: 100%;
  background: rgba(0,0,0,0.7);
  text-transform: uppercase;
  font-size: 18px;
  position: fixed;
  z-index: 120;
}

.menu-button{
  display: none;
}
.ac-container{
  display: none;
}

.menu{
  width: 720px;
}

nav ul{
  height: 100%;
  display: flex;
  flex-direction: row;
  list-style-type: none;
  margin: 0 auto;
  z-index: 999;
}

nav ul li{
  margin: 0 auto;
  margin-left: 0;
  margin-right: 0;
  padding: 0 20 0 20;
  border-bottom: 4px solid transparent;
  cursor: pointer;
  height: 46px;
  vertical-align: middle;
  transition: .4s;
  line-height: 45px;
  z-index: 999;
}

.menu li:hover{
  border-bottom: 4px solid white;
}

.menu li ul li:hover{
  border-bottom: 4px solid transparent;
}

nav ul li:hover >  ul
{
  display: block; 
}
nav ul li a:hover{

}

nav ul li{
  -webkit-transition: all .1s ease-in-out;
  -moz-transition: all .1s ease-in-out;
  transition: all .1s ease-in-out;
  z-index: 999;
}
nav ul li a{
  display: block; 
  height: 50px;
  color: white; 
  vertical-align: middle;      
  text-decoration: none;
  text-transform: uppercase;
  z-index: 999;
}

nav ul ul li a{
  display: block; 
  margin-left: -40px;
  padding: 0 18 0 18;
  color: white; 
  vertical-align: middle;      
  background: rgba(0,0,0,0.6);
  text-decoration: none;
  text-transform: uppercase;
  z-index: 999;
  border-left: 2px solid transparent;
}

nav ul ul li a:hover{
  background: rgba(0,0,0,0.7);
  border-left: 2px solid white;
  transition: all .2s ease-in-out;
}

nav ul ul{
  display: none;        
  position: absolute; 
  top: 100%;       
  z-index: 999;
}


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

  .header nav{
    display: none;
  }

  .ac-container{
    display: block;
    position: absolute;
    margin-top: 126px;
    z-index: 333;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .ac-container label{
    width: 100%;
    padding: 20px 60px;
    position: relative;
    z-index: 20;
    display: block;
    cursor: pointer;
    color: white;
    line-height: 1;
    font-size: 3.6em;
    background: rgba(0,0,0,0.8);
    border-bottom: 5px solid transparent;
  }


  .ac-container label:hover{
    border-bottom: 5px solid white;
  }

  .ac-container input{
    display: none;
  }

  .ac-container article{
    background: rgba(0,0,0, 0.7);
    margin-top: -0px;
    border: none;
    overflow: hidden;
    height: 0px;
    position: relative;
    z-index: 10;
    -webkit-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
    -moz-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
    -o-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
    -ms-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
    transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
    display: flex;
    flex-direction: column;
    width: 110%;
  }
  .ac-container input:checked ~ article {
   -webkit-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
   -moz-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
   -o-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
   -ms-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
   transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
   height: 640px;
 }


 .list-m{
  color: white;
  line-height: 1.8;
  font-size: 2.6em;
  padding: 16;
  height: 80px;
  padding-left: 90px;
  border-bottom: 1px solid rgba(255,255,255,0.4);
}

.menu-button{
  display: block;
  background: rgba(0,0,0, 0.7);
  overflow: hidden;
  height: 126px;
  width: 97%;
  position: absolute;
  z-index: 10;
  color: white;
  -webkit-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
  -moz-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
  -o-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
  -ms-transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
  transition: height 0.15s ease-in-out, box-shadow 0.15s linear;
  font-size: 95px;
  padding-left: 3%;
}
}