/*
This file is part of the SiteMenu plugin. When this plugin is enabled, must be included in the includes.less file, under the Plugins section.
This classes use the BEM methodology for CSS naming conventions.
for more information on BEM, please refer to https://en.bem.info/methodology/quick-start/
*/
// SiteMenu CSS
.siteMenu {
    // This is the container for the menu item
    &__item {

    }
    // This is the link for the menu item
    &__link {

    }
    // This is the heading for the menu item
    &__heading {
        margin: 0;
        cursor: pointer;
        color: var(--flyout_link_color);
        position: relative;
        &:hover {
            color: var(--primary_color);
        }

    }

}
.childMenu {
    display: none;
    transition: visibility 0.3s ease-in-out;

    &__link {
        .rems(16);
        color: var(--flyout_link_color);
        text-decoration: none;
        margin: 0.7em;
        @media @flyout {
            margin: 0.5em;
            color: var(--light_color);
        }

        &:hover {
            color: var(--primary_color);
        }
    }

   &--open {
       display: flex;
   }
    @media @flyout {
        top: 0;
        position: static;
    }
}
