.dws-menu *{
 margin: 0;
 padding: 0;
}
.dws-menu ul,
.dws-menu ol{
 list-style: none;
}
.dws-menu > ul{
 display: flex;
 justify-content: center;
}
.dws-menu > ul li{
 position: relative;
 border-right: 1px solid #c7c8ca;
}
.dws-menu > ul li:first-child{
 border-left: 1px solid #b2b3b5;
}
.dws-menu > ul li:last-child{
 border-right: 1px solid #babbbd;
}

.dws-menu > ul li a{
 display: block;
 padding: 15px 20px;
 font-size: 15px;
 color: #454547;
 text-decoration: none;
 text-transform:uppercase;
 transition: all 0.45s ease;
}
.dws-menu li a:hover{
 
 background: rgba(220,20,60,1); /* Old browsers */
 
 color: #ffffff;
 box-shadow: 1px 5px 5px -5px black;
 transition: all 0.45s ease;
}


/*==== MEDIA ====*/
.dws-menu [type="checkbox"],

.dws-menu label.toggleMenu{
  
 display: none;
 padding: 1px 4px;
 
 cursor: pointer;
 position: relative;
    width: 100px;
    height: 35px;
}
.dws-menu label.toggleMenu>img {
 width: 35px;
    height: 35px;  
    border-top: 1.6px solid rgba(218,0,0,1);
    border-top-right-radius: 9px;
}
.dws-menu label.toggleMenu>a#cloz {
    display: none;
}
.dws-menu label.toggleMenu>a {
    font-family: fontbig, arial;
    text-transform:uppercase;
    font-size: 15px;
    vertical-align:super; 

}
@media all and (max-width: 768px){
 .dws-menu{
  overflow: hidden;
     width: 60%;
 }
 .dws-menu ul{
  display: block;
  max-height: 0;
  transition: max-height 0.45s;
     
 }
    .dws-menu > ul li a{
 display: block;
        background: #c7c8ca;
    padding-left: 40px;
    }
    
 .dws-menu li>ul li ul{
  position: absolute;
  right: auto;
  top: auto;

 }
 .dws-menu label.toggleMenu{
    display: block;
 }
 input.toggleMenu:checked + label.toggleMenu{
     background: #000;
     color: #fff;
     width: 100%;
 }
    input.toggleMenu:checked + label.toggleMenu>img {
          border-top: none;
 }
    input.toggleMenu:checked + label.toggleMenu>a#cloz {
        display:inline ;
    } 
    
 input.toggleMenu:checked ~ ul,
 input.toggleSubmenu:checked ~ ul{
  display: block;
  position: relative;
  max-height: 5000px;
  transition: max-height 2s ease-in;
     
 }
 .dws-menu label.toggleSubmenu{
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  display: block;
 }
 input.toggleSubmenu:checked ~ a{
  background: #454547;
  color: #fff;
 }
}
    @media all and (max-width: 480px){
 .dws-menu{
       width: 80%;
        }
    }