.region-primary-menu {
    /* padding:100px 0 0 0; */
    /* height:-webkit-fill-available; */
    font-family: 'BeirutDisplayWeb', serif;
}

body.path-frontpage .region-primary-menu {
    /* padding:100px 0 0 0; */
    /* height:-webkit-fill-available; */
    bottom: 0;
    position: absolute;
    width: 100%;
}

.region-primary-menu .menu a,
.region-primary-menu .sf-mega .menu {
    border-radius: 0;
    background: none;
    text-shadow: none;
    border-radius: 0;
    margin: 0;
    padding: 0;
}

.region-primary-menu .menu-item.menu-item--expanded.sfHover > div > ul > li > a,
.region-primary-menu .menu-item.menu-item--active-trail a,
.region-primary-menu .menu-item.menu-item--active-trail.sfHover > div > ul > li > a {
    /* background: #000;
     color: #ffd400;*/
    background: #ffd400;
    color: #000;
}

/*.region-primary-menu .menu-item.menu-item--active-trail a:hover,
.region-primary-menu .menu-item.menu-item--active-trail.sfHover > div > ul > li > a {
     background: #000;
     color: #ffd400;
}*/

/*.region-primary-menu .menu-item.menu-item--expanded.sfHover > div > ul > li > a:before,
.region-primary-menu .menu-item.menu-item--active-trail.sfHover > div > ul > li > a:before {
    content: '> ';
}*/

@media (max-width: 1600px) {
  .horizontal-menu {
    display: flex;
    flex-wrap: nowrap;
    margin-left: 9em;
    padding: 0;
  }

  .horizontal-menu > li {
    margin-right: 0;
    margin-bottom: 0.5em;
    white-space: nowrap;
  }
}

/*@media (min-width: 1601px) {
  .horizontal-menu {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin-left: initial;
  }

  .horizontal-menu > li {
    margin-right: 1em;
    white-space: nowrap;
  }
}*/

.horizontal-menu{
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;

}

.region-primary-menu .menu-item.menu-item--expanded.sfHover > div > ul > li > a,
.region-primary-menu .menu-item.menu-item--active-trail.sfHover > div > ul > li > a {
    padding: 5px;
    margin: 0 0 10px 0;
}

.region-primary-menu .sf-mega .menu a {
    /*font-size: 2em;*/
    font-size: 1.4em;
    background: none;
    color: #000;
}

.region-primary-menu .menu-item, body:not(:target) .region-primary-menu .menu-item {
    position: static;
    padding: 0;
    margin: 0 10px 0 0;
}

.region-primary-menu .horizontal-menu > li ul.menu {
    /*david*/
    /*display: ruby-base-container;
    display: contents;*/


    display: block;
}

.horizontal-menu > li > a {
  white-space: nowrap;
}

.horizontal-menu > li ul {
    position: unset;
    float: left;
    width: 100%;
    padding: 0 1em 1em 0;
    margin-right: 1em;
}

.horizontal-menu > li ul ul {
    /*left: unset;
    top: unset;*/
    left: 0;
    top: 0;
}

/*** mega menu dropdown ***/
.sf-mega {
    box-sizing: border-box;
    width: 100%;
    display: none;
    position: absolute;
    left: 0;
    /* padding: 2em 1em; */
    padding: 3.5em 1em 0;
}

.block-menu.navigation .clearfix.menu {
    margin: 0;
    padding: 0;
}

.block-region-first .block-menu.navigation .menu-item {
    padding: 0;
    margin: 0;
    list-style-image: none;
    list-style-type: none;
}
/*
.block-region-first .block-menu.navigation li.menu-item.menu-item--expanded.menu-item--active-trail > a,
.block-region-first .block-menu.navigation li.menu-item.menu-item--expanded.menu-item--active-trail > a:hover{
    color:#000;
    background: #ffd400 url("/themes/gdj/css/components/../../../../core/misc/menu-expanded.png") 7px 20px no-repeat;
    padding-left: 20px;
}
*/
.block-region-first .block-menu.navigation li.menu-item.menu-item--collapsed > a,
.block-region-first .block-menu.navigation li.menu-item.menu-item--collapsed > a:hover{
    /*background: url("/themes/gdj/css/components/../../../../core/misc/menu-collapsed.png") 0 20px no-repeat;*/
}
.block-region-first .block-menu.navigation .menu-item a {
    display: block;
    padding: 10px;
    border-bottom: 1px solid #ffd400;
    font-size: 1.1em;
    border-left: 0 solid #ffd400;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.block-region-first .block-menu.navigation .menu-item a:hover,
.block-region-first .block-menu.navigation .menu-item a.is-active a {
    background: #000;
    color: #ffd400;
    border-left: 5px solid #ffd400;
    -webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out;
}
.block-region-first .block-menu.navigation li.menu-item.menu-item--expanded.menu-item--active-trail > ul{
    padding: 0;
}
.block-region-first .block-menu.navigation li.menu-item.menu-item--expanded.menu-item--active-trail > ul > li > a{
    padding: 10px;
    display: block;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ffd400;
    font-size:medium;
}

/*.block-region-first .block-menu.navigation .menu-item a {
    padding: 0.7em 1.5em;
    border: 0;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
    position: relative;
    font-size: 1.4em;
}

.block-region-first .block-menu.navigation .menu-item:before {
    content: " ";
    width: 20px;
    height: 20px;
    background: transparent;
    float: left;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
    position: relative;
    z-index: 2;
    top: 10px;
}

.block-region-first .block-menu.navigation .menu-item:after {
    content: " ";
    width: 1px;
    height: 55px;
    background: #e6e6e6;
    position: absolute;
    left: 10px;
}

.block-region-first .block-menu.navigation .menu-item.active {
    font-weight: bold;
    font-size: 1.4em;
}

.block-region-first .block-menu.navigation .menu-item.active:before {
    background: #ffd400;
}*/

.block-menu.navigation .menu-item--expanded,
.block-menu.navigation .menu-item--collapsed {
    list-style-image: none;
    list-style-type: none;
    /*width: 90%;*/
}

.block-menu.navigation .menu-item--expanded a.is-active {
    background: #ffd400;
    display: grid;
}

@media all and (min-width: 901px) {
    .region-primary-menu .sf-mega .menu-item,
    body:not(:target) .region-primary-menu .sf-mega .menu-item {
        padding: 5px 0;
        /* margin: 0 20px 0 0;
         width: 20em;*/
        margin: 0 10px 10px 10px;
        width: 19em;
        display: inline-grid;
    }

    #horizontal-menu > li.menu-item.sfHover > div > ul > li > ul > li,
    #horizontal-menu > li.menu-item.menu-item--expanded.menu-item--active-trail.sfHover > div > ul > li > ul > li {
        clear: both;
        font-family: 'Lato', serif;
        font-size: 0.8em;
        font-style: italic;
        margin: 0;
        line-height: 22px;
        /*david*/
        /*display: inherit;*/
        /*padding: 10px 0;*/

        padding: 0;
        width: 100%;
    }

    #horizontal-menu > li.menu-item.sfHover > div > ul > li > ul > li a,
    #horizontal-menu > li.menu-item.menu-item--expanded.menu-item--active-trail.sfHover > div > ul > li > ul > li a {
        padding: 3px 5px 3px 5px;
        border-bottom: 1px solid rgba(0, 0, 0, 1);
    }

    #horizontal-menu > li.menu-item.sfHover > div > ul > li > ul > li a:hover,
    #horizontal-menu > li.menu-item.menu-item--expanded.menu-item--active-trail.sfHover > div > ul > li > ul > li a:hover {
        background: rgba(0, 0, 0, 0.1);
    }

    #horizontal-menu > li.menu-item.menu-item--expanded.menu-item--active-trail.sfHover > div > ul > li > ul > li a.is-active,
    #horizontal-menu > li.menu-item.menu-item--expanded.menu-item--active-trail.sfHover > div > ul > li > ul > li a.is-active:hover {
        background: rgba(0, 0, 0, 0.3);
    }
}