body { font-size: 15px; line-height: 1.4em; font-family: 'microsoft yahei'; color: #555; --z-focus-color: #f04494; } img { margin: 5px 0; max-width: 100%; height: auto; } h3, h4, h5 { padding: 0 0; margin: 20px 0; color: #555; font-weight: 700; } h1, h2 { font-weight: 700; margin: 20px 0; padding-bottom: 10px; } h1 { font-size: 20px; } h2 { font-size: 18px; } h3 { font-size: 16px; } h4 { font-size: 15px; } h5 { font-size: 14px; } li { margin-bottom: 6px; } p { margin-bottom: 20px; word-wrap: break-word; } pre { word-wrap: break-word; } .opacity5 { opacity: 0.5; } .opacity8 { opacity: 0.8; } .svg-icon { width: 1em; height: 1em; } .mt20 { margin-top: 20px; } .but { border-radius: 4px; background: var(--this-bg); color: var(--this-color); display: inline-block; border-radius: 4px; transition: 0.15s; border: 1px solid var(--this-border); vertical-align: middle; font-size: 14px; padding: 5px 20px; text-align: center; box-shadow: var(--this-shadow); --main-color: var(--this-color); --this-bg: rgba(136, 136, 136, 0.1); --this-border: transparent; --this-shadow: none; --this-color: #888; } a.but { cursor: pointer; } .but a { color: inherit; } .but.radius { border-radius: 50px; padding: 0.3em 0.8em; } .but.hollow { background: 0 0; --this-border: var(--this-color); } .but.hollow[class*='b-'] { background: 0 0; --this-border: var(--this-bg); --this-color: var(--this-bg); } .but:focus, .but:hover { opacity: 0.8; color: var(--this-color); } .but:active { --this-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.08); } .but.hollow:hover { background: var(--this-bg); } .but.hollow[class*='b-']:hover { color: #fff; } .but.padding-lg, .padding-lg { padding: 0.5em 2em; } .but.circular { padding: 0; border-radius: 5em; display: inline-flex; justify-content: center; align-items: center; height: 1.6em; min-width: 1.6em; } .but.circular svg.icon, .but.circular > .fa { margin-right: 0; } .px12 { font-size: 12px; } .em09 { font-size: 0.9em; } .em12 { font-size: 1.2em; } .mr3 { margin-right: 3px; } .mr6 { margin-right: 6px; } .mr10 { margin-right: 10px; } .mr20 { margin-right: 20px; } .ml3 { margin-left: 3px; } .mln3 { margin-left: -3px; } .ml6 { margin-left: 6px; } .ml10 { margin-left: 10px; } .ml20 { margin-left: 20px; } .mt6 { margin-top: 6px; } .mt10 { margin-top: 10px; } .mt15 { margin-top: 15px; } .mt20 { margin-top: 20px; } .mb6 { margin-bottom: 6px; } .mb10 { margin-bottom: 10px; } .mb20 { margin-bottom: 20px; } .padding-10 { padding: 10px; } .padding-15 { padding: 15px; } .muted-box { background: #f4f4f4; border-radius: 4px; padding: 15px; } .muted-2-color { color: #626262; } /**flex布局轮子**/ .flex { display: flex; } .inflex { display: inline-flex; } /**flex布局上下方向**/ .inflex.xx, .flex.xx { flex-direction: column; } /**flex布局上下居中**/ .inflex.ac, .flex.ac { align-items: center; } /**flex布局上下靠底部**/ .inflex.ab, .flex.ab { align-items: baseline; } /**flex布局上下左右居中**/ .inflex.jc, .flex.jc { align-items: center; justify-content: center; } /**flex布局两端对齐**/ .inflex.jsb, .flex.jsb { justify-content: space-between; } /**flex元素放大比例-1**/ .flex .grow1 { flex-grow: 1; } /**flex元素缩小比例-0:不缩小**/ .flex .shrink0 { flex-shrink: 0; } /**flex元素放大0缩小0**/ .flex .flex0 { flex: none; } /**flex元素放大1缩小1**/ .flex .flex1 { flex: 1; } .b-blue, .b-green, .b-purple, .b-red, .b-theme, .b-yellow, .jb-blue, .jb-green, .jb-purple, .jb-red, .jb-yellow { color: #fff; background: var(--this-bg); --this-color: #fff; } .jb-blue, .jb-green, .jb-purple, .jb-red, .jb-yellow { border: none; } .b-theme { --this-bg: var(--focus-color); } .b-red { --this-bg: #ff5473; } .b-yellow { --this-bg: #ff6f06; } .b-blue { --this-bg: #2997f7; } .b-green { --this-bg: #12b928; } .b-purple { --this-bg: #d448f5; } .c-blue, .c-green, .c-purple, .c-blue-2, .c-red, .c-yellow { color: var(--this-color); } .c-red { --this-color: #ff5473; --this-bg: rgba(255, 84, 115, 0.1); } .c-yellow { --this-color: #ff6f06; --this-bg: rgba(255, 111, 6, 0.1); } .c-blue { --this-color: #2997f7; --this-bg: rgba(41, 151, 247, 0.1); } .c-blue-2 { --this-color: #5c7cff; --this-bg: rgba(77, 130, 249, 0.1); } .c-green { --this-color: #12b928; --this-bg: rgba(18, 185, 40, 0.1); } .c-purple { --this-color: #d448f5; --this-bg: rgba(213, 72, 245, 0.1); } .jb-red { --this-bg: linear-gradient(135deg, #fd7a64 10%, #fb2d2d 100%); } .jb-yellow { --this-bg: linear-gradient(135deg, #fdab64 10%, #f7631d 100%); } .jb-blue { --this-bg: linear-gradient(135deg, #59c3fb 10%, #268df7 100%); } .jb-green { --this-bg: linear-gradient(135deg, #60e464 10%, #5cb85b 100%); } .jb-purple { --this-bg: linear-gradient(135deg, #f98dfb 10%, #ea00f9 100%); } .block-editor-rich-text__editable code { font-size: 95%; color: #f52a74; background-color: #fbebf0; } .text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; } .text-ellipsis-2 { line-height: 1.4em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; white-space: normal; } .mce-content-body code, code .gl { display: block; padding: 10px; border-radius: 8px; background: #f2f4f5; border: 1px solid #0ca1f8; font-size: 13px; line-height: 14px; } table { border-top: solid 1px #ddd; border-left: solid 1px #ddd; width: 100%; margin-bottom: 20px; } table th { background-color: #f9f9f9; text-align: center; } table td, table th { border-bottom: solid 1px #ddd; border-right: solid 1px #ddd; padding: 5px 10px; } .btn a { color: inherit !important; } .alignnone { margin: 0 auto; } .alignleft { float: left; text-align: left; margin-right: 10px; } .aligncenter { margin: 0 auto; text-align: center; display: block; } .alignright { float: right; text-align: right; margin-left: 10px; } .wp-dopts { color: #437e30; } .wp-caption { margin-bottom: 20px; background-color: #f6f6f6; padding: 10px 10px 1px; max-width: 100%; } .wp-caption img { margin: 0 0 5px; } .wp-caption p { margin-bottom: 10px; text-indent: 0; } .wp-caption.alignnone { text-align: center; } .wp-caption:hover .wp-caption-text { color: #45b6f7; } a { text-decoration: underline; color: #45b6f7; } a:hover { color: #ff5e52; } .comment pre, pre { margin: 0; font: 12px/20px 'courier new'; background: #e4e4e4; border: 1px solid #40b7fd; padding: 10px; } blockquote { margin: 30px 30px; padding: 15px 20px; font-size: 16px; color: #999; border-left: 5px solid #eee; } blockquote p { margin: 0; padding: 0; margin-bottom: 10px; } .title-theme h1, .title-theme h2, .title-theme h3, .title-theme h4, .title-theme h5 { margin: 0 !important; border-bottom: none; padding-bottom: 0; letter-spacing: 1px; color: inherit; } .title-theme { border-left: 4px solid var(--z-focus-color); padding: 0px 1em; margin: 10px 0; color: var(--z-focus-color); line-height: 1.4; } .wp-block-post-content > h1, .wp-block-post-content > h2, .wp-block-post-content > h3, .wp-block-post-content > h4 { line-height: 1.4; } .wp-block-post-content > h1.wp-block-heading:before, .wp-block-post-content > h2.wp-block-heading:before, .wp-block-post-content > h3.wp-block-heading:before, .wp-block-post-content > h4.wp-block-heading:before { position: absolute; content: ''; width: 50px; height: 4px; background: var(--z-focus-color); bottom: 8px; left: 0; border-radius: 5px; box-shadow: 1px 1px 3px -1px var(--z-focus-color); } .wp-block-post-content > h1.has-text-align-center:before, .wp-block-post-content > h2.has-text-align-center:before, .wp-block-post-content > h3.has-text-align-center:before, .wp-block-post-content > h4.has-text-align-center:before, .tab-nav-theme li:before, .title-h-center:before { left: 0; right: 0; margin: auto; transform-origin: center; } .wp-block-post-content > h1.has-text-align-right:before, .wp-block-post-content > h2.has-text-align-right:before, .wp-block-post-content > h3.has-text-align-right:before, .wp-block-post-content > h4.has-text-align-right:before { left: auto; right: 0; transform-origin: right; } .wp-block-post-content > h3:not([class]):before, .wp-block-post-content > h4:not([class]):before, .wp-block-post-content > h3.wp-block-heading:before, .wp-block-post-content > h4.wp-block-heading:before { width: 30px !important; height: 3px !important; bottom: 0; } .but { padding: 6px 15px; min-height: 34px; border-radius: 4px; display: inline-block; min-width: 80px; margin: 0.5em; text-align: center; transition: all 0.2s ease; } .radius .but { border-radius: 30px; } .but.but-icon { min-width: 33px; padding-left: 5px; padding-right: 5px; } .but.but-icon > .fa { margin: 0; } .but a { text-decoration: none; color: inherit; } button { cursor: pointer !important; } button:focus { outline: 0 !important; } .g_extend.anz button { margin: 5px; padding: 3px; min-height: 25px; min-width: 25px; } .g_extend.anz button:hover { opacity: 0.7; box-shadow: 0 0 10px #ddd; } .quote_q { padding: 1.2em; margin: 10px 0 20px 0; opacity: 0.7; position: relative; --quote-color: #555; color: var(--quote-color); } .quote_q:before { content: ''; border-radius: 6px; position: absolute; bottom: 0; left: 0; opacity: 0.05; right: 0; background: var(--quote-color); top: 0; } .quote_q > div { position: relative; } .qe_wzk_c-red { --quote-color: #dc3f3f; } .qe_wzk_lan { --quote-color: #0092ff; } .qe_wzk_lv { --quote-color: #23790e; } .quote_q .fa { margin-right: 15px; opacity: 0.3; font-size: 40px; float: left; } .anz.sz { height: 32px; width: 32px; border-radius: 30px; border: none; color: #666; padding: 7px; background: #efefef; } .g_extend.anz.an { display: none; } .qe_fxan { padding: 6px 15px; min-height: 34px; border-radius: 60px; border: none; box-shadow: -1px 4px 10px rgba(0, 0, 0, 0.2); display: inline-block; min-width: 80px; margin: 0.5em; text-align: center; color: #fff; transition: all 0.2s ease; } .qe_fxan a, .qe_fxan a:hover { color: #fff; } .qe_fxan.b1 { background-image: linear-gradient(135deg, #f58852 10%, #e43e2f 100%); } .qe_fxan.b2 { background-image: linear-gradient(135deg, #59b7fb 10%, #036bff 100%); } .qe_fxan.b3 { background-image: linear-gradient(135deg, #ce9ffc 10%, #7367f0 100%); } .qe_fxan.b4 { background-image: linear-gradient(135deg, #fccf31 10%, #f77f2d 100%); } .qe_fxan.b5 { background-image: linear-gradient(135deg, #54ea98 10%, #0db757 100%); } .qe_fxan.b6 { background-image: linear-gradient(135deg, #f577eb 10%, #cd32d8 100%); } .qe_fxan.b1:hover, .qe_fxan.b2:hover, .qe_fxan.b3:hover, .qe_fxan.b4:hover, .qe_fxan.b5:hover, .qe_fxan.b6:hover { box-shadow: -1px 4px 10px rgba(0, 0, 0, 0.3); } .aniuzu > div { border-radius: 4px; margin: 0.5em; padding: 6px 15px; font-size: 14px; } .radius .btn, .radius .qe_fxan, .radius .qe_yxan { border-radius: 6px; } .enlighter-pre { padding: 7px 7px 5px 7px; background-image: linear-gradient(135deg, #5cd9cd 10%, #2d4cf7 100%); border-radius: 6px; border: none; } .enlighter-label { text-align: right; color: #fff; font-weight: 700; margin: 0 3px 3px; } .enlighter-pre textarea { min-height: 60px; max-height: 320px; overflow: auto; background: rgba(255, 255, 255, 0.9); } .g_extend.hide { background-image: linear-gradient(357deg, #fb7aa4 10%, #f53b90 100%); font-size: 15px; text-align: center; color: #fff; font-size: 15px; border-radius: 50px 50px 0 0; } .g_extend.hide.js { border-radius: 0 0 50px 50px; background-image: linear-gradient(357deg, #f53b90 10%, #fb7aa4 100%); font-size: 15px; } .g_extend.hide p { margin: 0; font-size: 12px; opacity: 0.6; } .alert { padding: 15px 15px 10px 30px; position: relative; color: #fff; border: none; border-radius: 12px; } .alert a { color: #fff; } .alert_b button { color: #fff; font-size: 12px; height: 33px; width: 33px; border: none; border-radius: 50px; } .alert .editor-rich-text__tinymce a { color: #fff; font-style: italic; } .alert:before { font: normal normal 900 18px/1 "Font Awesome 5 Free"; position: absolute; left: -15px; top: 50%; background: inherit; width: 30px; height: 30px; text-align: center; padding: 4px 0; border-radius: 20px; transform: translateY(-50%); border: 3px solid #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.19); } .alert.jb-blue:before { content: '\f00c'; } .alert.jb-green:before { content: '\f0a1'; } .alert.jb-yellow:before { content: '\f12a'; } .alert.jb-red:before { content: '\f00d'; } .editor-styles-wrapper .alert p { font-size: 14px; } .close_an { display: inline-block; padding-left: 20px; } button.close { position: absolute; top: 0; right: 10px; color: #888; background: 0 0; border: none; font-size: 28px; font-weight: 700; } .wp-block-heading h1 { font-size: 1.5em; } .wp-block-heading h2 { font-size: 1.4em; } .wp-block-heading h3 { font-size: 1.3em; } .wp-block-heading h4 { font-size: 1.2em; } .wp-block-heading h5 { font-size: 1.1em; } .wp-block-heading h6 { font-size: 1em; } .wp-block { max-width: 900px; line-height: 2; } .wp-block[data-align='left'], .wp-block[data-align='right'] { height: auto !important; } .wp-block:after { content: ''; display: block; height: 0; clear: both; visibility: hidden; } figure.wp-block-image:not(.wp-block) { margin-bottom: 20px; } .block-editor-block-patterns-list__item, .components-flex.css-1n451hs, .components-flex.components-select-control { height: auto; } .edit-post-visual-editor__post-title-wrapper .editor-post-title, .editor-post-title__block .editor-post-title__input { font-size: 1.2em; border-bottom: 3px solid #3d87f6; padding: 8px 14px; } .blocks-gallery-item .components-button.block-library-gallery-add-item-button { min-height: 30px; } .carousel.iss { background-image: linear-gradient(#f0f1f7 10%, #e2e4ea 100%); border-radius: 6px; text-align: center; padding: 10px 10px 0; } .carousel.iss .leab { border-bottom: 1px solid #d2d2d2; padding-bottom: 10px; color: #666; cursor: pointer; } .carousel.iss .dashicons { float: right; margin: 5px 15px; } .carousel.iss .leab:hover .dashicons { color: #0997ec; } .tab-content .wp-block + .block-list-appender, .carousel.iss .wp-block + .block-list-appender { display: none !important; } .seamless-img .wp-block-gallery { margin: 0 !important; gap: 0; display: block !important; } .seamless-img .wp-block-gallery .wp-block-image img, .seamless-img .wp-block-gallery .wp-block-image { width: 100% !important; margin: 0 !important; } .carousel.seamless-img.full-container { padding:10px 0 0 0; } .panel .isshow { position: absolute; top: 15px; right: 5px; color: #666; cursor: pointer; transition: 0.3s; text-align: center; } .panel .ffhide.isshow { transform: rotate(-90deg); } .ffhide.panel-body { display: none; } .g_extend.anz.panel_b button { border-radius: 4px; height: 30px; width: 50px; border-width: 1px; border-style: solid; } .g_extend.anz.panel_b button.panel-default { border-color: #bfbfbf; background-color: #f1f1f1; } .g_extend.anz.panel_b button.panel-info { border-color: #8fcfdc; background-color: #dff6fd; } .g_extend.anz.panel_b button.panel-warning { border-color: #e8ca8a; background-color: #fbf7e9; } .g_extend.anz.panel_b button.panel-danger { border-color: #e4afb8; background-color: #f9efef; } .g_extend.anz.panel_b button.panel-success { border-color: #a1da71; background-color: #dff0d8; } .panel { background-color: rgba(245, 245, 245, 0.15); border: 1px solid #f5f5f5; border-radius: 4px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); margin: 0 -10px; } .panel-body { padding: 0 20px; } .panel-heading { padding: 10px 15px; border-bottom: 1px solid #f5f5f5; border-top-left-radius: 4px; border-top-right-radius: 4px; background: #f9f9f9; } .panel-default { border-color: #ddd; } .panel-success { border-color: #d6e9c6; } .panel-info { border-color: #bce8f1; } .panel-warning { border-color: #faebcc; } .panel-danger { border-color: #ebccd1; } .panel-default > .panel-heading { color: #333; background-color: #f5f5f5; border-color: #ddd; } .panel-info > .panel-heading { color: #31708f; background-color: #d9edf7; border-color: #bce8f1; } .panel-warning > .panel-heading { color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc; } .panel-danger > .panel-heading { color: #a94442; background-color: #f2dede; border-color: #ebccd1; } .panel-success > .panel-heading { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; } .modal { background-color: #fff; border: 1px solid #0000000f; border-radius: 6px; box-shadow: 0 1px 5px #eaeaea; margin: 0 auto; max-width: 100%; width: 600px; } .modal.modal-sm { width: 300px; } .modal.modal-mini { width: 400px; } .modal.modal-lg { width: 900px; } .modal-title { padding: 10px 15px; background: #f9f9f9; border-bottom: 1px solid #eaeaea; color: #666; font-weight: 700; line-height: 30px; position: relative; } .modal-body { padding: 0 20px; } .modal-footer { padding: 10px; text-align: right; border-top: 1px solid #e5e5e5; background: #fbfbfb; } .btn { display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: 400; min-width: 80px; line-height: 1.42857143; text-align: center; background-image: none; border: 1px solid transparent; border-radius: 4px; } .btn-default { color: #666; background-color: #fff; border-color: #ccc; } .modal-footer .btn + .btn { margin-bottom: 0; margin-left: 5px; } .padding-h { padding: 0 15px; } .modal-ss h5 { margin: 20px 0 5px; border-bottom: 1px solid #f58d8d; color: #ef5c5c; } .modal-code { background: snow; padding: 8px; border-radius: 4px; border: 1px solid #f5cbcb; } .modal-ss .Copy { margin-bottom: 10px; width: 100%; } .modal-bu { display: block; margin-bottom: 20px; margin-top: -20px; } .modal-bu button { min-width: 28px; min-height: 28px; margin: 3px; } .color_popover .components-popover__content { padding: 10px 5px; } .remove-Format { float: right; padding: 5px; color: #888; height: 32px; width: 32px; border-radius: 30px; } .remove-Format:focus { border: 1px solid #999; background: #f9f9f9; } .color_popover .components-button-group button { padding: 5px; min-width: 65px; border-radius: 30px 0 0 30px; } .color_popover .components-button-group button:last-child { border-left: none; border-radius: 0 30px 30px 0; } .color_popover .components-button-group button.isS { color: #0aa7e4; background: #f9f9f9; } .color_popover .components-color-palette, .feature .components-color-palette { width: 100%; } .color_popover .components-color-palette__item.is-active + .dashicons-saved, .feature .components-color-palette__item.is-active + .dashicons-saved { left: 1px; top: 2px; color: #666; } .color_popover .components-color-palette__item-wrapper, .feature .components-color-palette__item-wrapper { margin-right: 4px; margin-bottom: 4px; height: 23px; width: 23px; } .color_popover .components-color-palette__item:focus:after, .feature .components-color-palette__item:focus:after { width: 28px; height: 28px; } .color_popover .components-color-palette__custom-clear-wrapper, .feature .components-color-palette__custom-clear-wrapper .components-color-palette__clear { display: none; } .feature { width: 220px; background: #f1f1f1; border-radius: 8px; text-align: center; } .feature-icon { font-size: 50px; padding: 30px 5px; } .feature-title { padding: 0 10px; } .feature-note { opacity: 0.6; line-height: 1.5em; padding: 5px 10px 20px 10px; font-size: 0.8em; } .feature-iconbj { margin: 0 30px; } .feature-icont { font-size: 12px; color: #777; text-align: left; } .g_extend.anz button.feature-icon { margin: 3px; width: 25px; height: 25px; border-radius: 20px; border-color: #e8e8e8; } .feature-icon.no1 { color: #f33723; } .postsbox { padding: 10px 20px; text-align: center; background: #f3f3f4; } .hide-content { background-image: linear-gradient(357deg, #f55e8b 10%, #ff6b60 100%); border-radius: 10px; padding: 6px; } .hide-content .hide-title { color: #fff; text-align: center; padding-bottom: 6px; } .hide-innerblocks { background: #fff; border-radius: 6px; padding: 1px 13px; } .aksrtblock-iframe-div { padding-bottom: 56%; position: relative; overflow: hidden; width: 100%; } .aksrtblock-iframe-div iframe, .aksrtblock-iframe-div .iframe-mask { position: absolute; left: 0; top: 0; height: 100%; width: 100%; } .aksrtblock-iframe-div .iframe-mask { display: none; } .aksrtblock-iframe .nois_selected .iframe-mask { display: block; } .aksrtblock-iframe .iframe-label { font-size: 13px; font-weight: 600; margin-bottom: 10px; } .aksrtblock-iframe .components-base-control { width: 100%; margin-top: 5px; } .theme-card-box { padding: 15px; color: #444; background: #f5f6f7; } .featured-item { padding: 10px; padding-bottom: 2px; background: #ffffff; margin-bottom: -1px; border: 1px solid #e8e8e8; } .tab-card { border-radius: 8px; border: 1px solid #e8e8e8; background: #fbfbfb; padding-bottom: 0; } .tab-header { padding-bottom: 10px; border-bottom: 1px solid #e8e8e8; } .tab-header-item { position: relative; } .tab-header-item .tab-header-input { margin: 0 2px !important; min-width: 40px; font-size: 14px !important; line-height: 1.4; transition: 0.2s; padding: 0; border-bottom: 2px solid transparent; max-width: 70px; } .tab-header-item .tab-header-input > div { margin-bottom: 2px; } .tab-header-item:not(.active) .tab-header-input { cursor: pointer; } .tab-header-item.active .tab-header-input { border-color: #ff499d; color: #ff499d; } .tab-header-item .tab-header-input input[type='text'] { text-align: center; border: none; } .tab-operation { position: absolute; right: 0; visibility: hidden; opacity: 0; left: 0; right: 0; margin: auto; top: -26px; text-align: center; transition: 0.2s; } .tab-header-item:hover .tab-operation { visibility: unset; opacity: 1; } .tab-card.nav-left { display: flex; padding: 0; } .tab-card.nav-left .tab-header { border: none; border-right: 1px solid #e8e8e8; padding-right: 8px; min-width: 80px; } .tab-card.nav-left .tab-header { border: none; border-right: 1px solid #e8e8e8; padding: 8px 8px 8px 12px; min-width: 80px; display: block; flex-shrink: 0; } .tab-card.nav-left .tab-header > .tab-header-item { display: block; } .tab-card.nav-left .tab-header-item { padding: 6px 0; } .tab-card.nav-left .tab-header-item .tab-header-input { border-bottom: none; border-left: 2px solid transparent; } .tab-card.nav-left .tab-header-item.active .tab-header-input { border-left: 2px solid #ff499d; } .tab-card.nav-left .tab-operation { left: -24px; right: auto; top: 2px; } .tab-card.nav-left .tab-content { flex: 1; padding: 0 15px; } .tab-card.nav-left.nav-right .tab-header { order: 2; border: none; padding-left: 8px; margin-left: 8px; border-left: 1px solid #e8e8e8; } .file-download-icon { background: #e3e3e3; border-radius: 4px; width: 3em; height: 0; padding-bottom: 100%; overflow: hidden; position: relative; } .file-download-icon img.fit-cover { height: 100%; position: absolute; margin: 0; } .file-download-icon::before { position: absolute; content: '\f019'; font: normal normal 900 16px/1 "Font Awesome 5 Free"; top: 0.8em; left: 0.8em; font-size: 1.2em; }