ul#vertical-multilevel-menu, #vertical-multilevel-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 300px;
    /*width: 100%;*/
    font-size: 12px;
    text-align: left;
}

ul#vertical-multilevel-menu {
    /*margin-top: 120px;*/
    background: #f5f5f5;
    direction: rtl;
    height: 70vh;
    overflow-y: auto;
}

ul#vertical-multilevel-menu::-webkit-scrollbar {
    width: 3px;
}

ul#vertical-multilevel-menu::-webkit-scrollbar-thumb {
    background-color: #008bcc;
}

/*Submenu box*/

#vertical-multilevel-menu li ul {
    position: absolute;
    /* top: -999em; */
    top: auto;
    display: none;
    z-index: 500;
    /* border: 1px solid #C1C1C1; */
    border-bottom: none;
    width: 600px;
    box-shadow: 0 5px 6px rgb(0 0 0 / 16%);
    padding: 20px;
    box-sizing: border-box;
    background: #f5f5f5;
    height: 70vh;
    overflow-y: auto;
}


/* Submenu Items */
#vertical-multilevel-menu li a, #vertical-multilevel-menu div a {
    display: block;
    text-decoration: none;
    color: #4f4f4f !important;
    /*font-weight:bold;*/
    padding: 5px;
    background: #f5f5f5;
    /*border-bottom:1px solid #C1C1C1;*/
    border: none;
    padding: 15px;
}

#vertical-multilevel-menu > li > div > a,#vertical-multilevel-menu > div > div > a {
    font-size: 14px;
    padding: 5px 8px 7px 15px;
    line-height: 2;
}

#vertical-multilevel-menu li.level2 a {
    text-decoration: none;
    color: #345197 !important;
    font-weight: 700;
}

#vertical-multilevel-menu li.level2 a:hover {
    text-decoration: underline !important;
}

#vertical-multilevel-menu li.level3 a {
    text-decoration: none;
    color: #000000;
    font-weight: 400;
}

#vertical-multilevel-menu li.level3 a:hover {
    color: #000000 !important;
    text-decoration: underline !important;
}

#vertical-multilevel-menu li, #vertical-multilevel-menu>div:not(:last-child) {
    border-left: 3px solid #f5f5f5;
    direction: ltr;
    /*height: 40px;*/
}

#vertical-multilevel-menu li:not(:last-child), #vertical-multilevel-menu>div:not(:last-child) {
    /*border-bottom: 1px solid #4F4F4F;*/
    border-bottom: 1px solid #afafaf;
}

ul#vertical-multilevel-menu li:not(:first-child) {
    margin-bottom: 0;
    margin-top: 0;
}

ul#vertical-multilevel-menu li:first-child {
    margin-bottom: 0;
    margin-top: 0;
}

#vertical-multilevel-menu > li:hover {
    /*border-left: 3px solid #018BCA;*/
    border-left: 3px solid #f5f5f5;
}

/*Items selected*/
#vertical-multilevel-menu li a.item-selected {
    /*background-color: #D6D6D6;*/
}

/*Items Hover */
#vertical-multilevel-menu > li a:hover {
    /*background-color: #D6D6D6;*/
    color: #018bca !important;
}

#vertical-multilevel-menu a.root-item {
    /* color: #fff; */
    /*font-weight: normal;*/
    font-size: 14px;
    padding: 5px 8px 7px 15px;

    /* background: #61656A url(images/item_bg.gif) 0 0 no-repeat; */
    border: none;
    box-sizing: border-box;
    line-height: 2;
    -moz-box-sizing: border-box;
    color: #018bca;
}

/*Rootmenu Items hover*/
#vertical-multilevel-menu a.root-item:hover, #vertical-multilevel-menu a.root-item-selected:hover {
    /*background:#61656A url(images/item_bg.gif) 0 -26px no-repeat;*/
}

/*Rootmenu Items Selected*/
#vertical-multilevel-menu a.root-item-selected {
    color: #ffffff;
    font-weight: bold;
    font-size: 12px;
    padding: 5px 0 7px 35px;
    background: #61656a url(images/item_bg.gif) 0 -26px no-repeat;
    border: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    /*height:26px;
    overflow:hidden;*/
}

/*Parent item*/
#vertical-multilevel-menu a.parent {
    background: #f5f5f5 url(images/arrow.gif) center right no-repeat;
    padding-right: 10px;
}

/*Denied items*/
#vertical-multilevel-menu a.denied {
    background: #f5f5f5 url(images/lock.gif) center right no-repeat;
    color: #dddddd;
    padding-right: 10px;
}

/* Holly Hack. IE Requirement \*/
* html ul#vertical-multilevel-menu li {
    float: left;
    height: 1%;
}

* html ul#vertical-multilevel-menu li a {
    height: 1%;
}

/* End */


/*Submenu margin*/
#vertical-multilevel-menu li ul.root-item {
    margin: 0 0 0 295px;
    top: 0;
    display: none;
    flex-wrap: wrap;
}


/*Submenu hide*/
#vertical-multilevel-menu li:hover ul ul,
#vertical-multilevel-menu li.jsvhover ul ul,
#vertical-multilevel-menu li:hover ul ul ul,
#vertical-multilevel-menu li.jsvhover ul ul ul {
    /*top:-999em;*/
    display: none;
}

/*Submenu show*/
#vertical-multilevel-menu li:hover ul,
#vertical-multilevel-menu li.jsvhover ul,
#vertical-multilevel-menu li li:hover ul,
#vertical-multilevel-menu li li.jsvhover ul,
#vertical-multilevel-menu li li li:hover ul,
#vertical-multilevel-menu li li li.jsvhover ul {
    /*z-index:1000;
    top:auto;*/
    display: block;
}

i.icon-right-arrow {
    background: url(/local/templates/capybara/components/bitrix/menu/vertical_multilevel/images/arrow-right-nav.svg) center no-repeat;
    background-size: 10px;
    top: 4px;
    right: 0px;
    width: 30px;
    height: 30px;
    display: block;
    position: absolute;
    transition: transform .3s ease;
}

#vertical-multilevel-menu > li:hover i {
    transform: rotate(90deg);
}

.site-nav div, .site-nav span:is(.nav-span) {
    /*position: fixed;*/
    /*z-index: 2;*/
    display: none;
}

/*.site-nav.stickytop #vertical-multilevel-menu {
	margin-left: 37px;
	margin-top: 50px;
}*/

.level2 {
    border: none !important;
}

.level2 a {
    /*padding: 0!important;*/
    padding: 0 15px !important;
}

.level3 {
    border: none !important;
}

.level3 a {
    padding: 0 15px !important;
    font-weight: normal !important;
}

#vertical-multilevel-menu li.level2, #vertical-multilevel-menu li.level3 {
    height: auto;
}

.site-nav div.sublevel {
    position: relative;
    z-index: 2;
    display: block;
    /*padding-left: 10px;
    padding-right: 10px;*/
    margin-top: 10px;
    margin-bottom: 10px;
}

#vertical-multilevel-menu > li:hover .root-item {
    display: flex !important;
    flex-wrap: wrap !important;
    align-content: flex-start;
}

#vertical-multilevel-menu > li > a {
    font-size: 14px;
}

.sublevel {
    width: 33%;
}

.sublevel a {
    white-space: pre-wrap;
}
span.nav-span.sublevel {
	margin-bottom: 10px;
}

#vertical-multilevel-menu .root-item li.sublevel {
	flex: 0 0 calc(33% - 5px);
	width: auto;
	height: max-content;
	border-bottom: 0;
}

#vertical-multilevel-menu li:hover ul {
	display: block;
}

#vertical-multilevel-menu .level2 {
	font-size: 14px;
	padding: 5px 8px 7px 15px;
	border: none;
	box-sizing: border-box;
	line-height: 2;
	-moz-box-sizing: border-box;
	color: #018bca;
}

#vertical-multilevel-menu li:hover ul.root-item {
	display: flex;
}

#vertical-multilevel-menu .level2 a {
	text-decoration: none;
	color: #345197 !important;
	font-weight: 700;
	font-size: 13px;
	line-height: 1.2;
}