/* maintop */ #main_top { display: flex; justify-content: center; z-index: 1; max-width: 1400px; margin: 20px auto; width: 100%; padding: 0 15px; margin-top: 40px; margin-bottom: 0px; } .hide-aside #main_top { width: 80%; } .hide-aside #main_top #bber-talk { max-width: 936px; } @media screen and (min-width: 2000px) { .hide-aside #main_top #bber-talk { max-width: 80%; } #main_top { max-width: 70%; } } @media screen and (max-width: 1210px) { .hide-aside #main_top { padding: 0 12px; } } @media screen and (max-width: 900px) { .hide-aside #main_top { width: 100%; padding: 0 15px; } } @media screen and (max-width: 768px) { .hide-aside #main_top { padding: 0 5px; } div#main_top { margin-top: 20px; padding: 0 5px; } } #bber-talk { /* border-radius: 8px; */ /* background: var(--card-bg); */ /* box-shadow: none; */ box-sizing: border-box; /* transition: all .3s ease-in-out; */ cursor: pointer; width: 100%; min-height: 50px; padding: .5rem 1rem; display: flex; align-items: center; overflow: hidden; font-weight: 700; } #bber-talk, #bber-talk a { color: var(--font-color); } #bber-talk svg.icon { width: 1em; height: 1em; vertical-align: -.15em; fill: currentColor; overflow: hidden; font-size: 20px; } #bber-talk .item i { margin-left: 5px; } #bber-talk > i { font-size: 1.1rem; } #bber-talk .talk-list { flex: 1; max-height: 32px; font-size: 16px; padding: 0; margin: 0; overflow: hidden; } #bber-talk .talk-list:hover { color: var(--default-bg-color); transition: all .2s ease-in-out; } #bber-talk .talk-list li { list-style: none; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-left: 10px; } @media screen and (min-width: 770px) { #bber-talk .talk-list { text-align: center; margin-right: 20px; } }