_menu.scss 4.28 KB
.collapsing {
    overflow: visible !important;
  }

#wrapper-navbar{
    position: fixed;
    z-index: 999;
    display: inline-block;
    width: 275px;
    height: 100%;
    clear: both;
    vertical-align: top;
    padding: 41px 27px 41px 12px;
    background-color: #F6F6F6;
    box-shadow: 0px 3px 6px #00000029;
    transition:  0.5s;

    @media only screen and (max-width: 1260px) {
        position: fixed;
        right: -275px;
        top:0px;
    }

}


#wrapper-navbar.show{
    right: 0px;
}
.navbar-toggler{
    display: none;
    z-index: 999;
    position: absolute;
    right: 290px;
    top: 60px;
    height: 54px;
    width: 54px;
    background-color: #1A3668;
    border-radius: 0px;
    transition:  0s;
    @media only screen and (max-width: 1260px) {
        display: block !important;
    }
}

.hamburger .line{
    width: 30px;
    height: 4px;
    background-color: #fff;
    border-radius: 4px;
    display: block;
    margin: 8px auto;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  #wrapper-navbar.show{
  
   .hamburger .line:nth-child(2){
    opacity: 0;
  }
  
   .hamburger .line:nth-child(1){
    transform: translateY(13px) rotate(45deg);
  }
  
  .hamburger .line:nth-child(3){
    transform: translateY(-11px) rotate(-45deg);
  }
  }


#main-menu{
    flex-direction: column;
}
#main-nav{
    .container{
        flex-direction: column;
        align-items: flex-start;
        width: 275px;
        height: 768px;
        flex-wrap: nowrap;
        @media only screen and (max-width: 1260px) {
            height: 100vh;
        }
        @media only screen and (max-height: 575.98px) and (orientation: landscape) {
                overflow-y: scroll;
        }
        .custom-logo-link{
            width: 206px;
        }
        .navbar-collapse{
            flex-basis: 100%;
            display: flex!important;
            align-items: flex-start;
            margin-top: 70px;
            a{
                text-decoration: none;
                color: #000000;
                font-family:"trade-gothic-next";
            }
            a:hover{
                font-weight: 700 !important;
                font-family:"trade-gothic-next";
            }
        }
    }

    .um-login:not(.um-logout){
        display: none !important;
        }
    }
.um-logout,    
.um:not(.um-um_account_id):not(.um-register):not(.um-login):not(.um-directory):not(.um-profile){
    width: 275px !important;
    display: flex!important;
    flex-basis: auto;
    flex-direction: row;
    align-self: flex-end ;
    .um-form {
        margin-bottom: 40px;
        .um-misc-with-img{
            width: 28%;
            display: inline-block;
            border-bottom: 0px solid #eee;
            margin-bottom:0px;
            padding: 0px;
            div{
                strong{
                    display: none;
                }
            }
        }
        .um-misc-ul{
            width: 60%;
            display: inline-block;
            list-style: none;
            padding-left: 14px;
            vertical-align: top;
            a{
                font-size: 16px;
                text-decoration: none;
                color: #000000;
                font-family:"trade-gothic-next";
                font-weight: 400;
            }
            a:hover{
                font-weight: 700 !important;
                font-family:"trade-gothic-next";
            }
        }
    }
}

 .current-menu-item { 
    a{text-decoration: underline !important; color: #183668 !important; font-weight: bold;}
    ul{
        li{ 
            a{text-decoration: none !important; color: #000 !important; font-weight: 400;}
        }  
    }
}
 .wsmenu-submenu { display: none;  list-style-type:none; padding-left: 15px; }
 .current-menu-item .wsmenu-submenu { display:block; }
 .current-menu-ancestor .wsmenu-submenu { display:block; }


 .breadcrumb{
  a{
    font-family:"trade-gothic-next-condensed";
    text-decoration: none;
    color:#555555;
    font-size: 14px;
    line-height: 18px;
  }
  .current{
    font-family:"trade-gothic-next-condensed";
    color:#555555;
    font-size: 14px; 
    line-height: 18px;
  }
  .delimiter{
    font-family:"trade-gothic-next-condensed";
    padding:0px 5px;
    font-size: 14px; 
    line-height: 18px;
   }
 }