.bx-page-image-container img, .bx-page-html-container img { max-width:100%; height:auto; } .bx-page-html-container { overflow:hidden; } /* --------------- toolbar */ .bx-toolbar-anim { -webkit-transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; -o-transition: all .25s ease-in-out; transition: all .25s ease-in-out } .bx-toolbar-reset { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .bx-toolbar-up { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%) } #bx-toolbar { position:fixed; width:100%; height:48px; height:3rem; } .bx-toolbar-content { display: -webkit-flex; display: flex; z-index: 500; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; } .bx-toolbar-content .bx-toolbar-item { position: relative; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } .bx-toolbar-content .bx-toolbar-item.bx-ti-stretcher { -webkit-flex-grow: 1; flex-grow: 1; white-space: nowrap; } .bx-toolbar-content .bx-toolbar-item.bx-ti-logo { white-space: nowrap; } .bx-toolbar-content .bx-toolbar-item.bx-ti-logo img { display: block; } #bx-menu-toolbar-1-container, #bx-menu-toolbar-2-container { position:relative; } #bx-logo-container { -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; height: 3rem; margin:0 1.0rem; text-align: center; font-size: 2rem; } #bx-logo-container a { position: relative; display: block; text-decoration: none; } #bx-logo-container a span { position: relative; display: block; max-width: 100%; line-height: 48px; line-height: 3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #bx-logo { vertical-align:middle; } /* --------------- Submenu */ .bx-menu-main-bar-gap { position: relative; } .bx-media-tablet .bx-menu-main-bar-gap.bx-def-page-width, .bx-media-phone .bx-menu-main-bar-gap.bx-def-page-width { width: 100%; } .bx-media-phone .bx-menu-main-bar-gap { padding-left: 0; padding-right: 0; } .bx-menu-main-bar-wrapper { position: relative; border-top-left-radius: 0; border-top-right-radius: 0; } .bx-menu-main-bar-wrapper:before, .bx-menu-main-bar-wrapper:after { display: block; content: ""; position: absolute; top: 0; width: 1.5rem; height: 100%; z-index: 1; } .bx-menu-main-bar-wrapper:before { left: 0px; } .bx-menu-main-bar-wrapper:after { right: 0px; } .bx-media-phone .bx-menu-main-bar-wrapper { border-left-width: 0; border-right-width: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .bx-media-phone .bx-menu-main-bar-wrapper:before { border-bottom-left-radius: 0; } .bx-media-phone .bx-menu-main-bar-wrapper:after { border-bottom-right-radius: 0; } .bx-menu-main-bar { text-align: center; -webkit-overflow-scrolling: touch; } .bx-menu-main-bar:not(.bx-menu-more-auto) { overflow-x: auto; } /* --------------- content */ #bx-content-wrapper { position: relative; -webkit-flex-grow: 3; flex-grow: 3; } /* --------------- footer */ #bx-footer-wrapper { position: relative; -webkit-flex-grow: 0; flex-grow: 0; width: 100%; bottom: 0; } #bx-footer-wrapper .bx-def-hr { margin-top: 0px; } #bx-menu-bottom ul { text-align: center; } #bx-menu-bottom ul li { line-height: 2rem; } .bx-menu-switch-language-inline { float: none; clear: both; } .bx-menu-switch-language-inline .bx-menu-hor { text-align: center; } .bx-menu-switch-language-inline .bx-menu-hor li { float: none; display: inline-block; } /* --------------- 'Add to Homescreen' popup */ .ath-container { color: #333; } /* --------------- Account */ p.bx-account-unit-thumb { display: block; margin: 0px; background: #ffffff; background-clip: padding-box; box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.2); line-height: 46px; line-height: 2.9rem; font-size: 32px; font-size: 2.0rem; font-weight: 700; color: #d0d0d0; } p.bx-account-unit-thumb.bx-def-icon-size { line-height: 26px; line-height: 1.75rem; font-size: 19.5px; font-size: 1.3rem; } p.bx-account-unit-thumb.bx-def-border { border-width: 2px; border-color: #ffffff; } div.bx-account-unit-online { position: absolute; right: 0; bottom: 0; width: 0.625rem; height: 0.625rem; border: 1px solid #ffffff; border-radius: 0.625rem; background-color: #7ed321; } /* --------------- Mentions */ .bx-mention-row img { width:1rem; height:1rem; vertical-align:middle; } .bx-mention-row span { vertical-align:middle; } /* --------------- Profile Avatar */ .bx-profile-avatar { overflow: hidden; } .bx-profile-avatar-cnt { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: flex-start; justify-content: flex-start; } .bx-profile-avatar .bx-def-ava-size { width: 3.75rem; height: 3.75rem; } .bx-profile-avatar .bx-def-ava-size, .bx-profile-avatar div.bx-def-unit-img p.bx-base-pofile-unit-thumb.bx-def-ava-size { line-height: 3.5rem; font-size: 2.325rem; } .bx-profile-avatar .bx-pa-img, .bx-profile-avatar .bx-pa-actions { -webkit-flex: 0 2 auto; flex: 0 2 auto; } .bx-profile-avatar .bx-pa-info { -webkit-flex: 1 1 auto; flex: 1 1 auto; overflow: hidden; } .bx-profile-avatar .bx-pa-info-cnt { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-flex-direction: column; flex-direction: column; } .bx-profile-avatar .bx-pai-line, .bx-profile-avatar .bx-pai-line a { max-width: 100%; } .bx-profile-avatar .bx-pai-line a { display: inline-block; overflow: hidden; text-overflow: ellipsis; } .bx-profile-avatar .bx-pa-action .sys-icon { display: inline-block; text-align: center; line-height: 1.5rem; width: 1.5rem; height: 1.5rem; font-size: 1.0rem; } .bx-profile-avatar-switcher .bx-def-hr { display: none; } .bx-profile-avatar-switcher .sys-profile-switch-row { padding-left: 0px; padding-right: 0px; } .bx-profile-avatar-switcher .bx-pas-list-link .bx-btn { float: none; display: inline-block; } /* --------------- Profile Stats */ .bx-profile-stats { overflow: hidden; } .bx-profile-stats .bx-ps-user-cnt { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: flex-start; justify-content: flex-start; } .bx-profile-stats .bx-ps-user-cnt .bx-def-ava-size { width: 3.75rem; height: 3.75rem; } .bx-profile-stats .bx-ps-user-cnt .bx-def-ava-size, .bx-profile-stats .bx-ps-user-cnt div.bx-def-unit-img p.bx-base-pofile-unit-thumb.bx-def-ava-size { line-height: 3.5rem; font-size: 2.325rem; } .bx-profile-stats .bx-ps-user-img { -webkit-flex: 0 2 auto; flex: 0 2 auto; } .bx-profile-stats .bx-ps-user-info { -webkit-flex: 1 1 auto; flex: 1 1 auto; overflow: hidden; } .bx-profile-stats .bx-ps-user-info-cnt { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-flex-direction: column; flex-direction: column; } .bx-profile-stats .bx-ps-user-line, .bx-profile-stats .bx-ps-user-line a { max-width: 100%; } .bx-profile-stats .bx-ps-user-line a { display: inline-block; overflow: hidden; text-overflow: ellipsis; } /* --------------- Join/Login Forms */ #sys_account .bx-form-element .bx-form-input-submit.bx-btn, #sys-form-login .bx-form-element .bx-form-input-submit.bx-btn { width: 100%; text-align: center; } #bx-form-element-submit_text .bx-form-value { text-align: right; } .sys-jf-login .bx-btn, .sys-lf-join .bx-btn { float: none; } /* --------------- Create Post Form */ .sys-create-post-form { position: relative; } .sys-create-post-form .bx-loading-ajax { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; top: 0; width: 100%; height: 100%; } .sys-cpf-header { position: relative; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; height: 3.125rem; border-bottom: 2px solid rgba(0,0,0,0.1); } .sys-cpf-title, .sys-cpf-submenu { position: relative; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 1 1 auto; line-height: 3.125rem; } .sys-cpf-title, .sys-cpf-submenu-cnt { height: 3.125rem; } .sys-cpf-title { -webkit-flex-grow: 3; flex-grow: 3; max-width: 20%; white-space: nowrap; font-size: 1rem; font-weight: 400; } .sys-cpf-title-cnt { white-space: nowrap; overflow: hidden; text-overflow:ellipsis; } .sys-cpf-submenu { max-width: 80%; } .bx-media-phone .sys-cpf-title { max-width: 30%; } .bx-media-phone .sys-cpf-submenu { max-width: 70%; } .sys-cpf-submenu-cnt ul.bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto:not(.bx-menu-submenu-more-auto) { display: -webkit-flex; display: flex; -webkit-justify-content: flex-end; justify-content: flex-end; } .sys-cpf-submenu-cnt ul.bx-menu-submenu-more-auto { line-height: normal; } .sys-cpf-submenu-cnt ul li { border-radius: 0; white-space: nowrap; } .sys-cpf-submenu-cnt ul:not(.bx-menu-submenu-more-auto) > li { -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; height: 3.125rem; border-bottom: 2px solid transparent; line-height: 3.125rem; } .sys-cpf-submenu-cnt ul li > span { margin: 0; padding: 0; } .sys-cpf-submenu-cnt ul li:not(.bx-menu-item-more-auto) a .sys-icon { display: none; } .sys-cpf-submenu-cnt ul li:not(.bx-menu-item-more-auto) a span, .sys-cpf-submenu-cnt ul.bx-menu-custom.bx-menu-custom-ver.bx-menu-submenu-more-auto li:not(.bx-menu-item-more-auto) a span { margin: 0; } .sys-cpf-submenu-cnt ul li.bx-menu-tab-active { border-bottom: 2px solid #364f6b; } .sys-cpf-form { position: relative; } .sys-cpf-form .sys-cpf-user { position: absolute; top: 0; left: 0; } .sys-cpf-form .sys-cpf-content { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; } .sys-cpf-form.sys-cpf-default .sys-cpf-content { -webkit-align-items: stretch; align-items: stretch; } .sys-cpf-form.sys-cpf-default .sys-cpf-content > div { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; width: 100%; cursor: text; } .sys-cpf-form .bx-uploader-ghost .bx-base-general-icon-wrapper img { max-width: 9.375rem; } .sys-cpf-close { position: absolute; display: none; right: 0; bottom: 0; } /* --------------- Account Unit */ .bx-account-unit .bx-def-unit-img, .bx-account-unit-wo-info .bx-def-unit-img { position: relative; overflow: visible; } /* --------------- Author Info */ .sys-author-info { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .sys-author-profile ul.bx-menu-custom.bx-menu-custom-hor { line-height: 0.625rem; } .sys-author-profile ul.bx-menu-custom.bx-menu-custom-hor > li.bx-menu-item-nl { width: 100%; } .sys-author-profile .bx-menu-custom.bx-menu-custom-hor > li > span { margin-right: 0; } .sys-author-profile .bx-menu-custom.bx-menu-custom-hor > li > span.bx-base-profile-unit-meta-item.bx-def-padding-thd-leftright { padding-left: 0; padding-right: 0.5rem; } .sys-author-profile .bx-menu-custom.bx-menu-custom-hor > li:first-child .bx-base-general-unit-meta-div { display: none; } /* --------------- Author Info */ audio.bx-player-embed, video.bx-player-embed { width:100vw; height:100vh; } /* --------------- Search */ .bx-sys-search-results-pages { text-align:left; line-height:150%; } .bx-page-block-container .bx-search-results:first-child { padding-top:0; } /* --------------- Content loader placeholder */ @-webkit-keyframes bxPlaceHolderShimmer { 0% { background-position: -468px 0; } 100% { background-position: 468px 0; } } @keyframes bxPlaceHolderShimmer { 0% { background-position: -468px 0; } 100% { background-position: 468px 0; } } .bx-cont-ph-inline, .bx-cont-ph { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-name: bxPlaceHolderShimmer; animation-name: bxPlaceHolderShimmer; -webkit-animation-timing-function: linear; animation-timing-function: linear; background: #f6f7f8; background: -webkit-gradient(linear, left top, right top, color-stop(8%, #eeeeee), color-stop(18%, #dddddd), color-stop(33%, #eeeeee)); background: -webkit-linear-gradient(left, #eeeeee 8%, #dddddd 18%, #eeeeee 33%); background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%); -webkit-background-size: 800px 104px; background-size: 800px 104px; position: relative; } .bx-cont-ph-inline { display:inline-block; }