/* adds some margin below the link sets  */
.navbar .dropdown-menu div[class*="col"] {
    margin-bottom: 1rem;
}
.navbar .dropdown-menu {
    border: none;
    background-color: #fafafa !important;
}
.navbar .dropdown-menu {
}
/* breakpoint and up - mega dropdown styles */
@media all and (min-width: 1199px) {
    /* remove the padding from the navbar so the dropdown hover state is not broken */
    .navbar {
        padding-top: 0px;
        padding-bottom: 0px;
        display: flex;
        height:100%
    }

    /* remove the padding from the nav-item and add some margin to give some breathing room on hovers */
    /* .navbar .nav-item {
    padding:.5rem .5rem;
    margin:0 .25rem;
    } */

    /* makes the dropdown full width  */
    .navbar .dropdown {
        position: static;
    }
    .navbar .dropdown-menu {
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        /*  height of nav-item  */
        top: 100px;
        display: block;
        visibility: hidden;
        height: 0;
        opacity: 0;
        transition: 0.3s height cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s padding cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s margin cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s 0.1s;
    }
    .main-header.navbar-fixed-top .navbar .dropdown-menu {
        top: 80px;
    }
    header.navbar-fixed-top .navbar .dropdown-menu {
        top: 80px;
    }
    .navbar .dropdown-menu ul {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .navbar .dropdown-menu ul > li {
        margin: 0 15px;
    }
    .navbar .dropdown-menu ul > li > a {
        font-size: var(--font-16);
        color: var(--color-dark);
    }
    .navbar .dropdown-menu ul > li.on > a,
    .navbar .dropdown-menu ul > li > a:hover {
        color: var(--color-orange);
    }
    /* shows the dropdown menu on hover */
    .navbar .dropdown:hover .dropdown-menu,
    .navbar .dropdown .dropdown-menu:hover {
        display: block;
        visibility: visible;
        color: #313131;
        opacity: 1;
        height: 60px;
        transition: 0.3s height cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s padding cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s margin cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s 0.1s;
    }
    .navbar .dropdown .show {
        display: block;
        visibility: visible;
        color: #313131;
        opacity: 1;
        height: 60px;
        z-index: 100;
        /* transition: 0.3s height cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s padding cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s margin cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.3s 0.1s; */
    }
    .navbar .dropdown-menu {
        background-color: #fff;
    }
}