/* @group Secundary Nav
------------------------------------ */
.secundary-nav { margin: 0 0 4.4rem; position: relative; z-index: 5; 
    -webkit-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    -moz-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    -ms-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    -o-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
}
.secundary-nav .nav-wrapper { position: relative; }
.secundary-nav h6 { color: var(--timeline-title); font: 700  .9em / 1.339em var(--bilo-font); letter-spacing: 1.44px; padding: 0 3rem; margin: 0 0 1.1rem; }
.secundary-nav button { background: var(--bg-white); border: .05rem solid var(--light-grey); height: 7rem; padding: 0 7rem 0 3rem; }
.secundary-nav button i { position: absolute; right: 2.5rem; color: var(--br-color); }
.secundary-nav button,
.secundary-nav li { color: var(--snav-color); font: 400 1.4em / 7rem var(--bilo-font); letter-spacing: 2.24px; text-transform: uppercase; }
.secundary-nav button em,
.secundary-nav li em { font-weight: 500; }
.secundary-nav .menu a { color: var(--snav-color); }

.secundary-nav li:not(.current-menu-item) .sub-menu { display: none; }
.secundary-nav .sub-menu { position: fixed; width: 100%; left: 0; 
    -webkit-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    -moz-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    -ms-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    -o-transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
    transition: background .2s cubic-bezier(0.4,0.0,0.2,1), height .8s cubic-bezier(0.4,0.0,0.2,1), top .8s cubic-bezier(0.4,0.0,0.2,1);
}
.pinedHeader .secundary-nav .sub-menu { background: rgba(245,245,245,.9); }
.secundary-nav .sub-menu li { font-size: .929em; letter-spacing: 2.08px; line-height: 1.542em; margin: 0 2.5rem; }
.secundary-nav .menu .sub-menu a { padding: 0; }
.secundary-nav .menu .sub-menu a::after { content: none; }
/* Dark
----------------------*/
body[data-bg="dark"].pinedHeader .secundary-nav .sub-menu { background: rgba(23,23,39,.9); }
body[data-bg="dark"] .secundary-nav button, 
body[data-bg="dark"] .secundary-nav li { border-color: var(--bg-dark-br); }
body[data-bg="dark"] .secundary-nav .menu a { color: var(--title-light); }
body[data-bg="dark"] .secundary-nav button { color: var(--title-light); background: var(--bg-dark); border-color: var(--bg-dark-br); }

/* Visit
----------------------*/
body[data-bg="visit"] .secundary-nav { background: var(--bg-visit); border-bottom-color: rgba(138,147,149,.6); }
body[data-bg="visit"].pinedHeader .secundary-nav .sub-menu { background: rgba(51,51,64,.9); }
body[data-bg="visit"] .secundary-nav button, 
body[data-bg="visit"] .secundary-nav li { border-color: var(--bg-dark-br); }
body[data-bg="visit"] .secundary-nav .menu a { color: var(--title-light); } 
body[data-bg="visit"] .secundary-nav .sub-menu a { color: var(--timeline-text); } 
body[data-bg="visit"] .secundary-nav button { color: var(--title-light); background: var(--bg-dark); border-color: var(--bg-dark-br); }

@media only screen
and (min-width : 961px) {
    .secundary-nav { position: fixed; left: 0; width: 100%; z-index: 5; top: 7rem; background: var(--bg-card); border-bottom: .05rem solid var(--light-grey); text-align: center; margin: 0; }
    .secundary-nav ul { white-space: nowrap; overflow-y: auto; scrollbar-color: rgba(0,0,0,.5) rgba(255,255,255,0); scrollbar-width: thin;  }
    .secundary-nav ul::-webkit-scrollbar { height: .3rem; }
      /* Track */
    .secundary-nav ul::-webkit-scrollbar-track { background:rgba(255,255,255,0); }
      /* Handle */
    .secundary-nav ul::-webkit-scrollbar-thumb { background: rgba(0,0,0,.25); border-radius: 5rem; }     
      /* Handle on hover */
    .secundary-nav ul::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,.5); } 
    body[data-bg="dark"] .secundary-nav { background: var(--bg-dark); border-bottom: none; }
    .scrollhidden .secundary-nav { top: -7rem; }
    .secundary-nav .menu .current-menu-item { overflow: hidden; }
    .secundary-nav .menu > .current-menu-item > a { font-weight: 500; }
    .secundary-nav .menu a::after { content: ''; display: block; height: .2rem; width: 100%; background: rgba(138,147,149,1); position: absolute; left: 0; bottom: -.2rem; 
        -webkit-transition: bottom 0.3s linear;
        -moz-transition: bottom 0.3s linear;
        -ms-transition: bottom 0.3s linear;
        -o-transition: bottom 0.3s linear;
        transition: bottom 0.3s linear;
    }
    .secundary-nav .menu .current-menu-item a::after { bottom: 0; }
    .secundary-nav .menu li { display: inline-block; padding: 0; margin: 0 1rem; vertical-align: top; }
    .secundary-nav .menu a { display: block; padding: 0 3rem; line-height: 7rem; position: relative; overflow: hidden; }
    .secundary-nav .sub-menu a { margin: 0 2rem; }
    .Explorer .secundary-nav .menu a:hover::after,
    .Mozilla.v11 .secundary-nav .menu a:hover::after { bottom: 0; }
    .Explorer .secundary-nav .sub-menu a:hover,
    .Mozilla.v11 .secundary-nav .sub-menu a:hover { text-decoration: underline; }
    @media (hover: hover) {
        .secundary-nav .menu a:hover::after { bottom: 0; }
        .secundary-nav .sub-menu a:hover { text-decoration: underline; }
    }
    /* Visit
    ----------------------*/
    body[data-bg="visit"] .secundary-nav .menu a::after { background: rgba(229,229,229,.6); }
    /* Light
    ----------------------*/
    body[data-bg="light"]:not(.pinedHeader) .secundary-nav .sub-menu a { color: var(--light-grey); }
    /* Dark
    ----------------------*/
    body[data-bg="dark"] .secundary-nav .menu a { color: var(--light-grey); }
    body[data-bg="dark"] .secundary-nav .menu a::after { background: rgba(229,229,229,.6); }
    
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 961px)
and (max-width : 1340px) {
    .secundary-nav .menu a { padding: 0 1.8rem; }
    .secundary-nav .sub-menu a { margin: 0 2rem; }
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .secundary-nav .col-12-10 { padding: 0 1rem; }
    .secundary-nav ul { background: var(--bg-white); position: absolute; top: 7rem; width: 100%; animation: closeDraw .25s 1 cubic-bezier(1,.2,0,.4) forwards; overflow: hidden; }
    body[data-bg="dark"] .secundary-nav ul { background: var(--bg-dark); }
    .secundary-nav .nav-wrapper[data-state="open"] ul { animation: openDraw 2s 1 cubic-bezier(0.4,0.0,0.2,1) forwards; }
    .secundary-nav .menu li { padding: 0 3rem; margin: 0; border: .05rem solid var(--light-grey); border-top: none; }
    body[data-bg="dark"] .secundary-nav .menu li { border-color: var(--bg-dark-br); }
    .secundary-nav .sub-menu { display: none; }
    .secundary-nav .menu .current-menu-item { display: none; }

    /* Dark
    ----------------------*/
    body[data-bg="dark"]  .secundary-nav ul { color: var(--title-light); background: var(--bg-dark); border-color: var(--bg-dark-br); }

    /* Visit
    ----------------------*/
    body[data-bg="visit"] .secundary-nav ul { color: var(--title-light); background: var(--bg-dark); border-color: var(--bg-dark-br); }
}

/* @end */