

.menu ul {

  margin: 0;

  padding: 0;

}



.menu .main-menu {

  display: none;

}



#tm:checked + .main-menu {

  display: block;

}



.menu input[type="checkbox"], 

.menu ul span.drop-icon {

  display: none;

}



.menu li, 

#toggle-menu, 

.menu .sub-menu {

  /*border-style: solid;

  border-color: rgba(0, 0, 0, .05);*/

}



.menu li, 

#toggle-menu {

  /*border-width: 0 0 1px;*/

}



.menu .sub-menu {

  background-color:#5d6bba;

  border-width: 1px 1px 0;

  margin: 0 1em;

}



.menu .sub-menu li:last-child {

  border-width: 0;

}



.menu li, 

#toggle-menu, 

.menu a {

    position: relative;

    display: block;

    color: #fff;

    font-size: 15px;

    letter-spacing: 1.5px;

    /*font-weight: 600;*/

}



.menu, 

#toggle-menu {

  /*background-color: #09c;*/

}



#toggle-menu, 

.menu a {

  padding: 14px 15px;

}



/*.menu a {

  transition: all .125s ease-in-out;

  -webkit-transition: all .125s ease-in-out;

}*/



.menu a:hover {

  background-color:#5d6bba;

/*  color:#fff;

  font-weight:400;*/

}



.menu .sub-menu {

  display: none;

}



.menu input[type="checkbox"]:checked + .sub-menu {

  display: block;

}



.menu .sub-menu a:hover {

  color: #fff;

}



#toggle-menu .drop-icon, 

.menu li label.drop-icon {

  position: absolute;

  right: 1.5em;

  top: 15px;

}



.menu label.drop-icon, #toggle-menu span.drop-icon {

  border-radius: 50%;

  width: 1em;

  height: 1em;

  text-align: center;

  background-color: rgba(0, 0, 0, .125);

  text-shadow: 0 0 0 transparent;

  color: rgba(255, 255, 255, .75);

}



.menu .drop-icon {

  line-height: 1;

}

@media only screen and (max-width: 1200px) and (min-width: 1041px) {


  .menu .sub-menu li {

    width: auto;

  }
  #toggle-menu, .menu a {
      padding: 14px 13px;
  }
}



@media only screen and (min-width: 1040px) {

  .menu .main-menu {

    display: block;

  }



  #toggle-menu, 

  .menu label.drop-icon {

    display: none;

  }



  .menu ul span.drop-icon {

    display: inline-block;

  }



  .menu li {

    float: left;

    border-width: 0 1px 0 0;

  }



  .menu .sub-menu li {

    float: none;

  }



  .menu .sub-menu {

    border-width: 0;

    margin: 0;

    position: absolute;

    top: 100%;

    left: 0;

    width: 230px;

    z-index: 3000;

  }



  .menu .sub-menu, 

  .menu input[type="checkbox"]:checked + .sub-menu {

    display: none;

  }



  .menu .sub-menu li {

    border-width: 0 0 1px;

	padding:2px;

  }

  .menu .sub-menu li a{

      color:#fff;

	  letter-spacing:1px;

	  padding:10px;

	  font-weight:400;

   } 

  .menu .sub-menu .sub-menu {

    top: 0;

    left: 100%;

  }



  .menu li:hover > input[type="checkbox"] + .sub-menu {

    display: block;

  }

}

@media screen and (min-width: 320px) and (max-width: 768px) {
  #toggle-menu, .menu a {
    padding: 10px 15px;
    border-bottom: 1px solid #555555;
  }

}


