﻿

.mid-nav .menu-link {
    position: relative;
}

.mid-nav .menu-link:hover .mega-menu-container .menu-space {
    opacity: 1;
    transition: opacity .25s ease-in;
}


.mid-nav .mega-menu-container.open .menu-space {
    opacity: 1;
    transition: opacity .25s ease-in;
}

.mid-nav .mega-menu-container .menu-space {
    padding: 25px 0;
    opacity: 0;
    transition: opacity .25s ease-in;
    display: block;
}

.mid-nav .mega-menu-container .menu-space[data-di-id] {
    display: none;
}

.mid-nav .mega-menu-container .menu-space:first-child {
    display: block;
}

.mid-nav .mega-menu-container .menu-item.active + .menu-space[data-di-id],
.mid-nav .mega-menu-container .menu-item:hover + .menu-space[data-di-id] {
    display: block;
}

.mid-nav .mega-menu-container .menu-item[data-di-id]:hover,
.mid-nav .mega-menu-container .menu-item.has-sub-menu:hover {
    background-color: #f0f5ff;
}

.mid-nav .mega-menu-container .menu-space .menu-item {
    padding: 5px 30px;
    position: relative;
    transition: all .2s ease-in;
    color: #414245 !important;
    display: block;
    width: 100%;
}

.mid-nav .mega-menu-container .menu-space .menu-item:hover.hover-highlight {
    color: #1876d1 !important;
}

.mid-nav .mega-menu-container .menu-space .menu-item.active,
.mid-nav .mega-menu-container .menu-space .menu-item:hover {
    color: #414245;
    background-color: #0000000d;
    transition: all .2s ease-in;
}

.mid-nav .mega-menu-container .menu-space .menu-item.active {
    background-color: #f0f5ff; 
    position: relative;
}

.mid-nav .mega-menu-container .menu-space .menu-item.active::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    /*width: 3px;
    background-color: #1876d1;*/
}

.mid-nav .mega-menu-container .menu-space .menu-item .menu-arrow {
    position: absolute;
    top: 0;
    right: 0;
    color: #1876d1;
    padding: 8px
}

.mid-nav .menu-link:hover::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    bottom: 3px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #ddd; 
    z-index: 100;
}
