@charset "utf-8";


.menu, .menu ul, .submenu ul{ /* общие свойства */
  margin: 0; 
  padding: 0;
  list-style: none;
  z-index:1000;
}
.menu {
  text-align: right;
}
.menu > li {          /*делаем горизонт меню */
  display: inline-block;
  position: relative;
  margin-right: -4px;
  padding: 0 15px;
     }
  
 
 .menu  li  a{             /*цвет всех ссылок */
   color: #fff;
   margin:0;
padding:21px 0;
   display:block;
   text-decoration:none;
   text-transform:uppercase;
   font:  18px Rob;
 }
 
  .menu > li:hover{     /*цвет пункта остается при доп меню */
      background:#4b4646; 
    }
    .menu li:hover a{     /*цвет link остается при доп меню */
    color:;
    }
  .menu li a:hover{
    color:#fff; 
  
  }
.submenu {            /*позиционируем подменю */
  position: absolute;
  display: none;
  width:200px;
  background: #4b4646;
  text-align: left;
  box-shadow: 1px 3px 3px 1px rgba(0,0,0,0.1);
  z-index: 999;
  left:0;
  overflow:hidden; transition: all .7s ease-out 0.2s;
}
 
li:hover .submenu {  /* показ при наведении */
  display: block; 
  
    }
.submenu li a{
  color:#fff;
  padding:7px 15px;
  text-transform:none;
  font: 14px Rob;
}

li:hover .submenu li a:hover{
    color:black;
    background:#88c9fc; transition: all .3s ease-out 0s;
  } 
 
li:hover .submenu li li a{
  color:#fff;
  background:#4b4646;
  padding-left:35px;
transition: left 2s liner 0.5s;
}
/* _****************************************************************__*/


/*__menu vertikal__*/
.hide,
.hide + label ~ .m_v {
    display: none; 
}
/* вид текста label */
.hide + label {
    margin: 0;
  margin-top:5px;
    padding: 0;
    color: #2196f3;
    cursor: pointer;
    display: block;
    text-transform:uppercase;
  
}
/* вид текста label при активном переключателе */
.hide:checked + label {
    color: #322e2e;
    border-bottom: 0;
}
/* когда чекбокс активен показываем блоки с содержанием  */
.hide:checked + label + .m_v {
    display: block; 
    padding: 0 20px;
    
}
.m_v {
    margin:5px 20px;
    padding:0;
  color:#2196f3;
}
.m_v li:hover{
  color: #322e2e;
}
.m_v a{display:block;}
.hide + label:before {
    background-color: #685f5f;
    color: #fff;
    content: "\25BC";
    display: block;
    float: left;
    font-size: 10px; 
    height: 13px;
	width: 13px; 
    line-height: 10px;
	margin: 5px ;
  padding:2px;
    text-align: center;
   
   -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
  box-sizing: border-box;
}
.hide:checked + label:before {
    content: "\25B2";
  	background-color: #ef4e1c;
  box-sizing: border-box;
}


 /*__*********************************__*/