@font-face { font-family: "custom-navbar-font"; src: url('//s1.hdslb.com/bfs/seed/jinkela/header/asserts/iconfont.ttf') format('truetype'); } .custom-navbar-iconfont { color: inherit; font-family: "custom-navbar-font" !important; font-size: 24px; font-style: normal; } .custom-navbar-icon-logo::before { content: "\\E725"; } .custom-navbar { --navbar-height: 50px; position: absolute; top: 0; left: 0; height: var(--navbar-height); width: 100%; background: white; color: black; z-index: 10001; } .custom-navbar.shadow { box-shadow: #0004 0px 2px 10px 1px; } .custom-navbar.dark:not(.fill), .custom-navbar .popup { color: #eee; background: #222; } .custom-navbar *, .custom-navbar { transition: all .2s ease-out; } .custom-navbar.fill { background-color: var(--theme-color); color: #fffd; } .custom-navbar.fill.shadow { box-shadow: var(--theme-color-30) 0px 2px 10px 1px; } .custom-navbar>ul { display: flex; align-items: center; justify-content: space-between; margin: 0 5%; height: 100%; } .custom-navbar ul { list-style: none; } .custom-navbar>ul>li { position: relative; height: 100%; display: flex; align-items: center; } .custom-navbar>ul>li:not(.disabled) { cursor: pointer; } .custom-navbar>ul>li:not(.disabled):hover { background: rgba(0,0,0,0.1); } .custom-navbar .main-content { font-size: 10pt; height: 100%; display: flex; align-items: center; padding: 0 16px; } .custom-navbar .popup { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) scale(0); padding: 16px; box-shadow: #0002 0 4px 8px 8px; pointer-events: none; opacity: 0; transform-origin: top; transition: all 0.15s cubic-bezier(0.18, 0.89, 0.38, 1.15) .2s; } .custom-navbar .popup.no-padding { padding: 0; } .custom-navbar>ul>li:not(.disabled):hover>.popup, #custom-navbar-home-popup .category-item:hover .popup { transform: translateX(-50%) scale(1); pointer-events: initial; opacity: 1; } .custom-navbar a { color: inherit; } #custom-navbar-home-popup { max-height: 50vh; display: flex; flex-direction: column; flex-wrap: wrap; width: 300px; } #custom-navbar-home-popup .category-item { font-size: 12pt; padding: 8px 16px; cursor: pointer; position: relative; } #custom-navbar-home-popup .category-item:hover { background-color: #0001; } #custom-navbar-home-popup .category-item a { display: flex; justify-content: space-between; } #custom-navbar-home-popup .category-item .popup { z-index: 10002; width: max-content; } #custom-navbar-home-popup .category-item .popup a, #upload-actions a { padding: 8px 16px; display: flex; justify-content: center; border-bottom: 2px solid transparent; font-size: 11pt; } #custom-navbar-home-popup .category-item .popup a:hover, #upload-actions a:hover { border-bottom: 2px solid var(--theme-color); } #custom-navbar-home-popup .category-item span { opacity: 0.5; } .im-list-box { border-radius: 0 !important; } li.nav-item[report-id='playpage_dynamic'] iframe, li.nav-item[report-id='playpage_dynamic'] .i-frame { display: none !important; } #upload-button { padding-left: 4px; font-size: 12pt; font-weight: bold; } #upload-actions { width: max-content; }