/*
sirka menu 293px
sirka hover polozky 250px
*/
#menu{padding:10px;color:#666666;text-align:left;font-weight:normal;float:none;height:auto;
      /*font-size:24px;
      /*160407*/
      text-transform: uppercase; background: #f2f2f2;
      /*width: 370px;160407*/
      width: 305px;
      font-size: 1.0em;
      display:table-cell;}
#menu a{color:#666666;text-align:left;font-weight:normal;display:block;text-decoration:none;}
#menu p{background-repeat:no-repeat;background-position: 3px 3px;padding-left:15px;line-height:16px;}
#menu a:hover, #menu a.selected,  #menu a.v{color:#21a8d4 ;}

ul.menu {margin: 0px;padding: 0;list-style-type: none;}   
ul.menu a {text-decoration: none;padding: 0;margin: 0 0 0 35px;}
ul.menu a {}
ul.menu ul {list-style-type: none;/*padding: 0 0 0 20px;160407*/padding: 0 0 0 1em;margin: 0;}   

ul.menu li {margin: 0;
         /*line-height:50px;160407*/
         line-height: 2.6em;
         /*background-color: red;*/
         background-repeat: no-repeat;position: relative;}  
ul.menu li ul li{border-bottom:0px;}   

ul.menu li.r, ul.menu li.s{
    /*background-position: 0px 16px;
    background-size: 20px auto;160407*/
    background-repeat: no-repeat;
    background-position: 0px 0.8em;
    background-size: 1em auto;
    
}
ul.menu li.r {
    background-image: url("../img/koleckoSipkaModraNahoru.svg");
}
ul.menu li.s {  
    background-image: url("../img/koleckoSipkaDolu.svg");

}
ul.menu li.s:hover{background-image: url("../img/koleckoSipkaModraDolu.svg");
/*border-bottom: 1px dotted #000;
border-top: 1px dotted #000;*/
background-color: #EbEbEb;}
ul.menu li.r ul {
    background-image: url("../img/carkaDolu.png");
    background-repeat: repeat-y;
    /*background-position: 29px 0px;*/
    background-position: 1.5em 0;
    }
ul.menu li.s ul {display: none;}



#menu ul li ul li a{text-transform: none;font-weight:bold;}
#menu ul li ul li {text-transform: none;
                   /*font-size: 20px;line-height:40px;160407*/
                   font-size: 1em;
                   line-height: 2em;
                  
             background-repeat: repeat-y;}
#menu ul li ul li.r, #menu ul li ul li.s{
    background-repeat: no-repeat;
    /*background-position: 1px 14px;
    background-size: 16px auto;*/
    background-position: 0 0.7em;
    background-size: 1em auto;
    
}
#menu ul li ul li.r{
    background-image: url("../img/koleckoSipkaModraNahoru.svg");
  
} 
#menu ul li ul li.s{
  
    background-image: url("../img/koleckoSipkaDolu.svg");
 
} 



.debug{font-style: italic;background-color: yellow;opacity: 0.5;border:1px solid red;}


#menu span{width:25px;float:left;cursor: pointer;}

.hoverMenu{z-index: 10;}

ul.menu li.r ul.hoverMenu{background-image: none;}
ul.menu li.r ul.hoverMenu ul{background-image: none;display: block;}
.hoverMenu:before{
    content: "";
    width: 0px;height:0px;
    border-top: 25px solid #ebebeb;
    border-bottom: 25px solid transparent;
    border-left:25px solid transparent;
    border-right:25px solid #ebebeb;
    position: absolute;
    top:0px;
    left:-49px;
}
#menu ul.menu li ul.hoverMenu li {
    font-size: 1em;
    line-height: 1.2em;
}
ul.menu li ul.hoverMenu{
 
    position: absolute;
    /*left: 362px;160407*/
    left:293px;
    width: 950px;
    top: 0px;
    background-color: #ebebeb;
    text-transform: none;
    /*ZZ*/visibility: hidden;
    opacity: 0; 
    transform: translateZ(0);
    transform: translateY(10%);
    transition: all 0.5s ease 0s, visibility 0s linear 0.5s;
    /*padding:5px;;*/
}
ul.menu li.s:hover ul.hoverMenu{
    display: initial;
    visibility: visible;
    opacity: 1;
    transform: translateX(0%);
    transition-delay: 0s; 
    transition-duration: 0.5s;
}
ul.menu li ul li.hoverMenuPolozka1{
    /*border:1px solid black;*/
    width:250px;
    height:60px;
    font-size: 1em;
    line-height: 1.1em;;
    /*width: 310px;
    height: 100px;160407*/
    display: inline-table;
    vertical-align: central;
    
   
    text-align: left;
    margin: 5px;
    padding: 0px;
   
    position: relative;
    
}

ul.menu li:hover ul.hoverMenu li.hoverMenuPolozka1{
    display: inline-table;
   margin: 0;padding: 5px;
}
ul.menu li:hover ul.hoverMenu li ul{
    display: initial;margin: 0;padding: 0;
  
}
ul.menu li:hover ul.hoverMenu li ul li{
    display: initial;
    margin: 0;padding: 0;
}




ul.menu .hoverMenuPolozka1 ul{
  
    position: relative;
   
}
ul.menu .hoverMenuPolozka1 a{
    margin-left: 90px;
    margin-top:0.5em;
    padding: 0;
}
ul.menu .hoverMenuPolozka1 a.img{
    margin:0;
    padding: 0;
}
ul.menu .hoverMenuPolozka1 img{
    margin: 0;
    padding: 0;
    float: left;
   
}
.hoverMenuPolozka1 b{
   vertical-align: middle;
}
#menu ul li ul li.hoverMenuPolozka2, 
#menu ul li ul li.hoverMenuPolozka2 a{
    font-size: 1em;font-weight: normal;
    line-height: 1.1em;
}
/*ul.menu li.r ul.hoverMenu{display: none;visibility: hidden;}*/
