/* /$$ /$$ /$$$$ | $$ |_ $$ /$$$$$$$ /$$$$$$$$ | $$ /$$_____/ |__ $$__/ | $$ | $$$$$$ | $$ | $$ \____ $$ |__/ /$$$$$$ /$$$$$$$/ |______/|_______/ ================================ Keep calm and get rich. Is the best. --------------------------------------------- Theme Name: cdt2025 Theme URI: https://www.nicetheme.cn/ Author: nicetheme Author URI: https://www.nicetheme.cn/ Description: Version: 3.0.0 */ .modal-open { overflow: hidden; } .i-icon svg { display: block; } /*-------------------------------------------------------------- ## Text color style --------------------------------------------------------------*/ .text-primary { color: var(--color-primary) !important; } .text-dark { color: var(--color-dark) !important; } .text-secondary { color: var(--color-secondary) !important; } .text-muted { color: var(--color-muted) !important; } .text-light { color: var(--color-light) !important; } .text-danger { color: var(--color-danger) !important; } .text-warning { color: var(--color-warning) !important; } /*-------------------------------------------------------------- ## Background style --------------------------------------------------------------*/ .bg-primary { background-color: var(--color-primary) !important; } .bg-dark { background-color: var(--bg-dark) !important; } .bg-secondary { background-color: var(--bg-secondary) !important; } .bg-light { background-color: var(--bg-light) !important; } .bg-white { background-color: var(--bg-white) !important; } .bg-white-overlay { color: #fff; background-color: rgba(255, 255, 255, 0.35); } .bg-dark-overlay { color: #fff; background-color: rgba(0, 0, 0, 0.33); } .bg-cover { background-size: cover; background-repeat: no-repeat; } .bg-img { background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; } .bg-effect { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .bg-poster { background-size: cover; background-repeat: no-repeat; background-position: center; } .bg-fixed { background-attachment: fixed; } /*-------------------------------------------------------------- ## Buttons --------------------------------------------------------------*/ .btn { border-radius: var(--border-radius-sm); padding: 8px 26px; white-space: normal; transition: all 0.2s ease-in-out; } .btn:hover, .btn:focus, .btn:active, .btn.active { box-shadow: none !important; } .btn.disabled, .btn:disabled { color: var(--color-muted); background-color: var(--bg-light); border-color: var(--bg-light); } .btn.loading { position: relative; cursor: wait !important; color: var(--color-muted); border-color: var(--gray-3); background-color: var(--gray-3); pointer-events: none; } /*-------------------------------------------------------------- ## Button style --------------------------------------------------------------*/ .btn-primary { --bs-btn-color: #fff; --bs-btn-bg: var(--color-primary); --bs-btn-border-color: var(--color-primary); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--color-primary); --bs-btn-hover-border-color: var(--color-primary); --bs-btn-focus-shadow-rgb: 49, 132, 253; --bs-btn-focus-box-shadow: none; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--color-primary); --bs-btn-active-border-color: var(--color-primary); --bs-btn-active-shadow: none; --bs-btn-disabled-color: #fff; --bs-btn-disabled-bg: var(--color-primary); --bs-btn-disabled-border-color: var(--color-primary); } .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active { opacity: 0.7; } .btn-primary.disabled, .btn-primary:disabled { --bs-btn-disabled-opacity: 0.6; color: #fff; background-color: var(--color-primary); border-color: var(--color-primary); opacity: var(--bs-btn-disabled-opacity); } /*-------------------------------------------------------------- ## Button secondary style --------------------------------------------------------------*/ .btn-secondary { --bs-btn-color: var(--color-light); --bs-btn-bg: var(--gray-7); --bs-btn-border-color: var(--gray-7); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--gray-6); --bs-btn-hover-border-color: var(--gray-6); --bs-btn-focus-shadow-rgb: 130, 138, 145; --bs-btn-focus-box-shadow: none; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--gray-6); --bs-btn-active-border-color: var(--gray-6); --bs-btn-active-shadow: none; --bs-btn-disabled-color: var(--color-muted); --bs-btn-disabled-bg: var(--gray-7); --bs-btn-disabled-border-color: var(--gray-7); } /*-------------------------------------------------------------- ## Button light style --------------------------------------------------------------*/ .btn-light { --bs-btn-color: var(--color-muted); --bs-btn-bg: var(--gray-3); --bs-btn-border-color: var(--gray-3); --bs-btn-hover-color: var(--color-dark); --bs-btn-hover-bg: var(--gray-3); --bs-btn-hover-border-color: var(--gray-3); --bs-btn-focus-shadow-rgb: 211, 212, 213; --bs-btn-focus-box-shadow: none; --bs-btn-active-color: var(--color-dark); --bs-btn-active-bg: var(--gray-3); --bs-btn-active-border-color: var(--gray-3); --bs-btn-active-shadow: none; --bs-btn-disabled-color: var(--color-light); --bs-btn-disabled-bg: var(--gray-3); --bs-btn-disabled-border-color: var(--gray-3); } /*-------------------------------------------------------------- ## Button dark style --------------------------------------------------------------*/ .btn-dark { --bs-btn-color: var(--gray-1); --bs-btn-bg: var(--gray-8); --bs-btn-border-color: var(--gray-8); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--gray-7); --bs-btn-hover-border-color: var(--gray-7); --bs-btn-focus-shadow-rgb: 66, 70, 73; --bs-btn-focus-box-shadow: none; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--gray-7); --bs-btn-active-border-color: var(--gray-7); --bs-btn-active-shadow: none; --bs-btn-disabled-color: var(--color-light); --bs-btn-disabled-bg: var(--gray-7); --bs-btn-disabled-border-color: var(--gray-7); } /*-------------------------------------------------------------- ## Button danger style --------------------------------------------------------------*/ .btn-danger { --bs-btn-color: #fff; --bs-btn-bg: var(--color-danger); --bs-btn-border-color: var(--color-danger); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--color-danger); --bs-btn-hover-border-color: var(--color-danger); --bs-btn-focus-shadow-rgb: 225, 83, 97; --bs-btn-focus-box-shadow: none; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--color-danger); --bs-btn-active-border-color: var(--color-danger); --bs-btn-active-shadow: none; --bs-btn-disabled-color: #fff; --bs-btn-disabled-bg: var(--color-danger); --bs-btn-disabled-border-color: var(--color-danger); } .btn-danger:hover, .btn-danger:focus, .btn-danger.active, .btn-danger:active { opacity: .8; } .btn-danger:disabled, .btn-danger.disabled { opacity: .6; } /*-------------------------------------------------------------- ## Button link style --------------------------------------------------------------*/ .btn-link { --bs-btn-color: var(--color-muted); --bs-btn-bg: transparent; --bs-btn-border-color: transparent; --bs-btn-hover-color: var(--color-secondary); --bs-btn-hover-border-color: transparent; --bs-btn-active-color: var(--color-secondary); --bs-btn-font-weight: 400; --bs-btn-active-border-color: transparent; --bs-btn-disabled-color: var(--color-muted); --bs-btn-disabled-border-color: transparent; --bs-btn-box-shadow: none; text-decoration: underline } /*-------------------------------------------------------------- ## Button success style --------------------------------------------------------------*/ .btn-success { --bs-btn-color: #fff; --bs-btn-bg: var(--color-success); --bs-btn-border-color: var(--color-success); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--color-success); --bs-btn-hover-border-color: var(--color-success); --bs-btn-focus-shadow-rgb: 60, 153, 110; --bs-btn-focus-box-shadow: none; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--color-success); --bs-btn-active-border-color: var(--color-success); --bs-btn-active-shadow: none; --bs-btn-disabled-color: #fff; --bs-btn-disabled-bg: var(--color-success); --bs-btn-disabled-border-color: var(--color-success); } .btn-success:hover, .btn-success:focus, .btn-success.active, .btn-success:active { opacity: .8; } .btn-success:disabled, .btn-success.disabled { opacity: .6; } /*-------------------------------------------------------------- ## Button outline style --------------------------------------------------------------*/ .btn-outline-primary { --bs-btn-color: var(--color-primary); --bs-btn-border-color: var(--color-primary); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--color-primary); --bs-btn-hover-border-color: var(--color-primary); --bs-btn-focus-shadow-rgb: 13, 110, 253; --bs-btn-focus-box-shadow: none; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--color-primary); --bs-btn-active-border-color: var(--color-primary); --bs-btn-active-shadow: none; --bs-btn-disabled-color: var(--color-primary); --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: var(--color-primary); --bs-gradient: none; } /*-------------------------------------------------------------- ## Button outline dark style --------------------------------------------------------------*/ .btn-outline-dark { --bs-btn-color: var(--color-muted); --bs-btn-border-color: var(--border-secondary); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--gray-5); --bs-btn-hover-border-color: var(--gray-5); --bs-btn-focus-shadow-rgb: 108, 117, 125; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--gray-5); --bs-btn-active-border-color: var(--gray-5); --bs-btn-active-shadow: none; --bs-btn-disabled-color: var(--color-light); --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: var(--border-secondary); --bs-gradient: none; } /*-------------------------------------------------------------- ## Button outline secondary style --------------------------------------------------------------*/ .btn-outline-secondary { --bs-btn-color: var(--color-muted); --bs-btn-border-color: var(--border-secondary); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--gray-5); --bs-btn-hover-border-color: var(--gray-5); --bs-btn-focus-shadow-rgb: 108, 117, 125; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--gray-5); --bs-btn-active-border-color: var(--gray-5); --bs-btn-active-shadow: none; --bs-btn-disabled-color: var(--color-light); --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: var(--border-secondary); --bs-gradient: none; } /*-------------------------------------------------------------- ## Button outline light style --------------------------------------------------------------*/ .btn-outline-light { --bs-btn-color: var(--color-muted); --bs-btn-border-color: var(--border-color); --bs-btn-hover-color: var(--color-secondary); --bs-btn-hover-bg: var(--gray-2); --bs-btn-hover-border-color: var(--gray-3); --bs-btn-focus-shadow-rgb: 248, 249, 250; --bs-btn-active-color: var(--color-secondary); --bs-btn-active-bg: var(--gray-2); --bs-btn-active-border-color: var(--gray-3); --bs-btn-active-shadow: none; --bs-btn-disabled-color: var(--color-secondary); --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: var(--border-color); --bs-gradient: none; } /*-------------------------------------------------------------- ## Button size style --------------------------------------------------------------*/ .btn-xs { font-size: 12px; padding: 4px 12px; } .btn-sm { font-size: 14px; padding: 5px 14px; } .btn-lg { font-size: 18px; padding: 10px 32px; } .btn-block { width: 100%; display: block; padding-left: 8px; padding-right: 8px; } .btn-xs.btn-rounded { padding-left: 12.8px; padding-right: 12.8px; } .btn-lg.btn-rounded { border-radius: 64px; padding-left: 40px; padding-right: 40px; } @media (min-width: 768px) and (max-width: 991.98px) { .btn-sm { font-size: 13px; } .btn-lg { font-size: 15px; } } @media (max-width: 767.98px) { .btn { font-size: 14px; padding: 8px 26px; } .btn-xs { font-size: 12px; padding: 4px 12px; } .btn-sm { font-size: 12px; padding: 4px 15px; } .btn-lg { font-size: 16px; padding: 10px 28px; } } /*-------------------------------------------------------------- ## Button radius style --------------------------------------------------------------*/ .btn-rounded { border-radius: 80px; padding-left: 20px; padding-right: 20px; } /*-------------------------------------------------------------- ## Button width style --------------------------------------------------------------*/ .btn-w-xs { min-width: 65px; padding-left: 6px; padding-right: 6px; } .btn-w-sm { min-width: 75px; padding-left: 6px; padding-right: 6px; } .btn-w-md { min-width: 95px; padding-left: 12px; padding-right: 12px; } .btn-w-lg { min-width: 176px; padding-left: 12px; padding-right: 12px; } .btn-w-xl { min-width: 192px; padding-left: 12px; padding-right: 12px; } @media (max-width: 767.98px) { .btn-sm.btn-w-sm { min-width: 60px; padding-left: 4px; padding-right: 4px; } .btn-sm.btn-w-md { min-width: 80px; } .btn-lg.btn-w-lg { min-width: 135px; padding-left: 12px; padding-right: 12px; } } @media (min-width: 768px) and (max-width: 991.98px) { .btn-w-lg { min-width: 135px; } } @media (min-width: 768px) { .btn-sm.btn-w-md { min-width: 85px; } .btn-sm.btn-w-sm { min-width: 70px; } } /*-------------------------------------------------------------- ## Button icon style --------------------------------------------------------------*/ .btn-icon { position: relative; width: 42px; height: 42px; padding: 0; font-size: 24px; text-align: center; } .btn-icon span { position: absolute; width: 100%; height: 100%; top: 0; display: flex; align-items: center; justify-content: center; } .btn-icon small { position: absolute; right: 0; top: 0; font-size: 10px; line-height: 1; padding: 1px 4px; border-radius: 10px; color: #fff; background-color: var(--color-danger); transform: translate(12%, -30%); z-index: 2; } .btn-icon:hover, .btn-icon:active, .btn-icon:focus { box-shadow: none; } .btn-icon.btn-xs { width: 28px; height: 28px; padding: 0; font-size: 18px; } .btn-icon.btn-sm { width: 35px; height: 35px; padding: 0; font-size: 20px; } .btn-icon.btn-md { width: 44px; height: 44px; padding: 0; font-size: 24px; } .btn-icon.btn-lg { width: 48px; height: 48px; padding: 0; font-size: 28px; } .btn-icon.btn-rounded { border-radius: 80px; } @media (max-width: 767.98px) { .btn-icon.btn-md { width: 38px; height: 38px; font-size: 18px; } .btn-icon.btn-lg { width: 42px; height: 42px; padding: 0; font-size: 24px; } } /*-------------------------------------------------------------- ## Border --------------------------------------------------------------*/ .border-dark { border-color: var(--border-dark) !important; } .border-secondary { border-color: var(--border-secondary) !important; } .border-muted { border-color: var(--border-muted) !important; } .border-primary { border-color: var(--color-primary) !important; } .border-light { border-color: var(--border-color) !important; } /*-------------------------------------------------------------- ## Border radius --------------------------------------------------------------*/ .rounded { border-radius: var(--border-radius-sm) !important; } .rounded-1 { border-radius: var(--border-radius-xs) !important; } .rounded-2 { border-radius: var(--border-radius-md) !important; } .rounded-3 { border-radius: var(--border-radius-lg) !important; } /*-------------------------------------------------------------- ## Form control --------------------------------------------------------------*/ .form-control { font-size: 16px; padding: 8px 14px; border-color: var(--border-color); background-color: #fff; color: var(--color-muted); border-radius: var(--border-radius-sm); transition: all 0.15s ease-in-out; } .form-control:focus, .form-control:active { color: var(--color-dark); border-color: var(--color-primary); background-color: #fff; box-shadow: none; } .form-control::-webkit-input-placeholder { color: var(--color-muted); opacity: 1; } .form-control::-moz-placeholder { color: var(--color-muted); opacity: 1; } .form-control:-ms-input-placeholder { color: var(--color-muted); opacity: 1; } .form-control::-ms-input-placeholder { color: var(--color-muted); opacity: 1; } .form-control::placeholder { color: var(--color-muted); opacity: 1; } .form-control:disabled, .form-control[readonly] { color: var(--color-muted); background-color: #fff; border-color: var(--border-color); opacity: 1; } textarea.form-control { text-align: justify; height: auto; padding: 8px 14px; } .form-control-lg { padding: 10px 16px; font-size: 18px; } @media (max-width: 767.98px) { .form-control { font-size: 14px; padding: 8px 12px; } .form-control-lg { padding: 8px 16px; font-size: 16px; } } /*-------------------------------------------------------------- Form check style --------------------------------------------------------------*/ .form-check { min-height: 0; padding-left: 32px; margin-bottom: 0; } .form-check .form-check-input { margin-left: -30px; } .form-check-input { width: 18px; height: 18px; background-color: var(--bg-light); border-color: var(--bg-light); margin-top: 3px; } .form-check-input:active { -webkit-filter: brightness(90%); filter: brightness(90%); } .form-check-input:focus { border-color: var(--bg-light); outline: 0; box-shadow: none; } .form-check-input:checked { background-color: #49d665; border-color: #49d665; } .form-check-input[type="checkbox"] { border-radius: 100px; } .form-check-input[type="checkbox"]:indeterminate { background-color: #49d665; border-color: #49d665; } .form-switch .form-check-input { width: 32px; margin-left: -32px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9Jy00IC00IDggOCc+PGNpcmNsZSByPSczJyBmaWxsPScjZmZmJy8+PC9zdmc+"); border-radius: 32px; } .form-switch .form-check-input:focus { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9Jy00IC00IDggOCc+PGNpcmNsZSByPSczJyBmaWxsPScjZmZmJy8+PC9zdmc+"); } .form-switch .form-check-input:checked { background-position: right center; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9Jy00IC00IDggOCc+PGNpcmNsZSByPSczJyBmaWxsPScjZmZmJy8+PC9zdmc+"); } .form-input-group { position: relative; display: flex; align-items: center; width: 100%; border: 1px solid var(--border-light); border-radius: var(--border-radius-sm); } .form-input-group .form-input-icon { display: flex; align-items: center; justify-content: center; font-size: 1.125rem; padding: 0 .25rem 0 1.125rem; } .form-input-group .form-input-button { flex-shrink: 0; background-color: transparent; border: 0; } .form-input-group .form-control, .form-input-group .form-select { font-size: 1rem; border: 0; padding: .6875rem 1rem; } .form-input-group .form-control[disabled] { background-color: transparent; } .form-input-group.form-input-lg .form-input-icon { font-size: 1.25rem; } .form-input-group.form-input-lg > .form-input-button { font-size: 1rem; padding: .375rem 1rem; } /*-------------------------------------------------------------- ## Avatar --------------------------------------------------------------*/ .flex-avatar { position: relative; display: flex; justify-content: center; align-items: center; flex-shrink: 0; line-height: 1; white-space: nowrap; font-weight: bold; border-radius: 100%; } .flex-avatar img { width: inherit; height: inherit; border-radius: inherit; -o-object-fit: cover; object-fit: cover; } .flex-avatar .avatar-badge { position: absolute; right: 0; bottom: 0; width: 15px; height: 15px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNiIgaGVpZ2h0PSIzNiIgZmlsbD0ibm9uZSI+PGNpcmNsZSBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiIGZpbGw9InVybCgjYSkiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yOS4wNSAxMS4zNWMuNjQuNjQuNjQgMS42OCAwIDIuMzJMMTYuNzQ3IDI1Ljk3M2ExLjc1IDEuNzUgMCAwIDEtMi40NzYgMEw4LjE2IDE5Ljg2YTEuNjQxIDEuNjQxIDAgMCAxIDIuMzIxLTIuMzIxbDUuMDMgNS4wMjlMMjYuNzI3IDExLjM1Yy42NDEtLjY0MSAxLjY4LS42NDEgMi4zMjEgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjMxLjcxNCIgeDI9Ii0zLjczMSIgeTE9Ii44NTciIHkyPSIxMS44MzkiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjRkZCNzRBIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjRkQ5MDBGIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PC9zdmc+'); transform: translate(0%, 0%); } .flex-avatar .avatar-badge.editor { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNiIgaGVpZ2h0PSIzNiIgZmlsbD0ibm9uZSI+PGNpcmNsZSBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiIGZpbGw9InVybCgjYSkiLz48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yOS4wNSAxMS4zNWMuNjQuNjQuNjQgMS42OCAwIDIuMzJMMTYuNzQ3IDI1Ljk3M2ExLjc1IDEuNzUgMCAwIDEtMi40NzYgMEw4LjE2IDE5Ljg2YTEuNjQxIDEuNjQxIDAgMCAxIDIuMzIxLTIuMzIxbDUuMDMgNS4wMjlMMjYuNzI3IDExLjM1Yy42NDEtLjY0MSAxLjY4LS42NDEgMi4zMjEgMFoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjMxLjcxNCIgeDI9Ii0zLjczMSIgeTE9Ii44NTciIHkyPSIxMS44MzkiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjN0NCMUZGIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMEY2RUZEIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PC9zdmc+'); } .flex-avatar.w-24 .avatar-badge { width: 10px; height: 10px; } /*-------------------------------------------------------------- avatar group --------------------------------------------------------------*/ .avatar-group { display: flex; align-items: center; } .avatar-group .flex-avatar { position: relative; } .avatar-group .flex-avatar + .flex-avatar { margin-left: -8px; } .avatar-group .flex-avatar:hover, .avatar-group .flex-avatar:active, .avatar-group .flex-avatar.active { z-index: 1; } /*-------------------------------------------------------------- ## Media --------------------------------------------------------------*/ .media { position: relative; display: block; overflow: hidden; padding: 0; flex-shrink: 0; border-radius: inherit; } .media:after { content: ""; display: block; padding-top: 100%; } .media-overlay { position: absolute; display: flex; align-items: center; color: #fff; top: 0; left: 0; right: 0; bottom: 0; padding: 12px; z-index: 1; } .media-opacity { opacity: 0.4; transition: 0.3s ease-out; } .media-overlay.bg-dark-overlay { background-color: rgba(0, 0, 0, 0.5); } .media-overlay.overlay-top { bottom: auto; } .media-overlay.overlay-bottom { top: auto; background: rgba(0, 0, 0, 0.6); /* fallback for old browsers */ /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .media-action { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); pointer-events: none; transition: opacity 0.3s; display: flex; align-items: center; } .media-action .btn { border-color: transparent; background-color: rgba(0, 0, 0, 0.5); color: #fff; } @media (max-width: 767.98px) { .media-overlay { padding: 8px 10px; } } .media-content { position: absolute; top: 0; bottom: 0; left: 0; right: 0; border: 0; border-radius: inherit; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; background-color: rgba(0, 0, 0, 0.01); } .media-content img { display: block; -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .media-contain { background-color: transparent; background-size: contain; } @media (max-width: 768px) { .media-content { -webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translate3d(0, 0, 0); } } .media-36x17:after { padding-top: 47.222222%; } .media-21x9:after { padding-top: 42.857143%; } .media-16x9:after { padding-top: 56.25%; } .media-4x3:after { padding-top: 75%; } .media-2x3:after { padding-top: 150%; } .media-3x2:after { padding-top: 66.66666%; } .media-3x4:after { padding-top: 133.33333%; } .media-1x2:after { padding-top: 200%; } .media-2x1:after { padding-top: 50%; } .media-3x1:after { padding-top: 33%; } .media-4x1:after { padding-top: 25%; } .media-5x1:after { padding-top: 20%; } .media-10x1:after { padding-top: 10%; } .media-1-4:after { padding-top: 25vh; min-height: 160px; } .media-1-3:after { padding-top: 33vh; min-height: 200px; } .media-1-2:after { padding-top: 50vh; min-height: 240px; } /*-------------------------------------------------------------- Badge --------------------------------------------------------------*/ .badge { font-size: 13px; font-weight: 600; padding: 4px 6px; border-radius: var(--border-radius-xs); box-shadow: none !important; outline: none !important; } .badge-advert { position: absolute; right: 10px; top: 0; border-top-left-radius: 0; border-top-right-radius: 0; color: #fff; background-color: rgb(73 73 73 / 20%); } .badge-cat { position: relative; color: var(--color-primary); } .badge-cat span { position: relative; z-index: 1; } .badge-cat i { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--color-primary); border-radius: inherit; opacity: 0.1; } .badge-cat:hover, .badge-cat:focus { color: inherit; } .badge-locked { color: #fff; background: linear-gradient(45deg, #ffaa69, #ff872b); } .badge-pay { color: #fff; background: var(--color-danger); background: linear-gradient(135deg, #ff3714, #ff9203 70%, #ff7830); } .badge-sticky { color: #fff; background: var(--color-danger); background: linear-gradient(to right, #ff7556, #fe4821); } .list-item .badge-pay, .list-item .badge-locked, .list-item .badge-sticky { position: absolute; right: 8px; top: 8px; } .badge-tag { color: var(--color-primary); border-width: 0; background-color: rgb(254 72 33 / 10%); } .badge-danger { color: var(--color-danger); background: var(--outline-danger); } .apollo-user-level { background: #f2995f; background: linear-gradient(to right, #f7c797, #f2995f); color: #fff; } .apollo-user-level.badge-pill { padding: 3px 8px; } .badge-pill { border-radius: 160px; padding: 6px 12px; } @media (max-width: 1199.98px) { .badge { font-size: 11px; padding: 4px 6px; } } .list-featured-tag { display: flex; flex-direction: row; gap: 4px; } /*-------------------------------------------------------------- Signin dropdown sub menu --------------------------------------------------------------*/ .signin-dropdown { position: relative; } .signin-dropdown .dropdown-toggle::after { display: none; } .signin-dropdown-menu { position: absolute; display: inline; width: 160px; top: 120%; right: 0; padding: 20px; opacity: 0; visibility: hidden; border-radius: var(--border-radius-sm); background-color: #fff; border: 0; box-shadow: 0 4px 25px 0 var(--shadow-2); transform: translateY(20px); transition: all 0.3s ease-in-out; } .signin-dropdown.w-lg .signin-dropdown-menu { width: 390px; } .signin-dropdown-menu.show { visibility: visible; opacity: 1; transform: translateY(10px); } .signin-dropdown-content .item { position: relative; display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 12px 4px; border-radius: var(--border-radius-sm); transition: none; } .signin-dropdown-content .item:hover { background: linear-gradient(to top, rgba(255, 255, 255, 0), var(--outline-primary)); } .signin-dropdown-content .item .menu-icon { display: flex; align-items: center; justify-content: center; font-size: 22px; width: 30px; height: 30px; } .signin-dropdown-content .item .menu-text { flex: 1 1 auto; font-size: 14px; } .signin-dropdown-content .item .menu-num { position: absolute; right: 0; top: 0; min-width: 15px; font-size: 11px; line-height: 1; text-align: center; padding: 2px 3px; background-color: var(--color-danger); transform: translate(-35px, 10px); color: #fff; border-radius: 4px; } @media (max-width: 767.98px) { .signin-dropdown.w-lg .signin-dropdown-menu { width: 320px; } } /* -------------------------------- vip badge -------------------------------- */ .avatar-badge { position: relative; display: inline-block; vertical-align: middle; width: 25px; height: 25px; background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI3LjIuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IuWbvuWxgl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjAwIDIwMCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjAwIDIwMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNGRkZGRkY7fQo8L3N0eWxlPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNOTkuOCwxNjIuNGMtNC42LDAtOC45LTEuOS0xMi01LjNMMjcuMSw5MS40Yy01LjYtNi4xLTUuOC0xNS41LTAuMy0yMS44bDIzLTI2LjRjMy4xLTMuNiw3LjYtNS42LDEyLjMtNS42CgloNzUuNmM0LjcsMCw5LjIsMiwxMi4yLDUuNmwyMy4xLDI2LjRjNS41LDYuMyw1LjQsMTUuNy0wLjMsMjEuOGwtNjEsNjUuN0MxMDguNywxNjAuNSwxMDQuMywxNjIuNCw5OS44LDE2Mi40eiIvPgo8cGF0aCBkPSJNOTksMTI1LjVjLTEsMC0yLjEtMC40LTMtMS4yTDU2LjIsODMuNWMtMS41LTEuNi0xLjUtNC4yLDAuMS01LjhjMS42LTEuNSw0LjItMS41LDUuOCwwLjFsMzYuOSwzNy45bDM4LjktMzgKCWMxLjYtMS41LDQuMi0xLjUsNS44LDAuMWMxLjUsMS42LDEuNSw0LjItMC4xLDUuOGwtNDEuOCw0MC44QzEwMSwxMjUuMSwxMDAsMTI1LjUsOTksMTI1LjVMOTksMTI1LjV6Ii8+Cjwvc3ZnPgo="); } .avatar-badge.active { background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iX+WbvuWxgl8yIiBkYXRhLW5hbWU9IuWbvuWxgiAyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjEuNjUgMTcuNTEiPgogIDxkZWZzPgogICAgPHN0eWxlPgogICAgICAuY2xzLTEgewogICAgICAgIGZpbGw6IG5vbmU7CiAgICAgIH0KCiAgICAgIC5jbHMtMiB7CiAgICAgICAgZmlsbDogdXJsKCNf5pyq5ZG95ZCN55qE5riQ5Y+YXzI1MCk7CiAgICAgIH0KCiAgICAgIC5jbHMtMyB7CiAgICAgICAgZmlsbDogdXJsKCNf5pyq5ZG95ZCN55qE5riQ5Y+YXzI0MCk7CiAgICAgIH0KCiAgICAgIC5jbHMtNCB7CiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXBwYXRoKTsKICAgICAgfQoKICAgICAgLmNscy01IHsKICAgICAgICBmaWxsOiAjZmZlMjdmOwogICAgICB9CgogICAgICAuY2xzLTYgewogICAgICAgIGNsaXAtcGF0aDogdXJsKCNjbGlwcGF0aC0xKTsKICAgICAgfQogICAgPC9zdHlsZT4KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0iX+acquWRveWQjeeahOa4kOWPmF8yNTAiIGRhdGEtbmFtZT0i5pyq5ZG95ZCN55qE5riQ5Y+YIDI1MCIgeDE9IjYuMTciIHkxPSIxNC45NyIgeDI9IjE1LjM0IiB5Mj0iLS45MSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgogICAgICA8c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNmYWNkOGQiLz4KICAgICAgPHN0b3Agb2Zmc2V0PSIuNiIgc3RvcC1jb2xvcj0iI2ZmZTVjOSIvPgogICAgICA8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNmZmQ2ODUiLz4KICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgICA8bGluZWFyR3JhZGllbnQgaWQ9Il/mnKrlkb3lkI3nmoTmuJDlj5hfMjQwIiBkYXRhLW5hbWU9IuacquWRveWQjeeahOa4kOWPmCAyNDAiIHgxPSI3MS44MyIgeTE9Ii0xMDUuMDIiIHgyPSI3NS44MyIgeTI9Ii0xMDUuMDIiIGdyYWRpZW50VHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTc1LjgzIDExNS43KSBzY2FsZSgxLjEzIDEpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgIDxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2M5OTAwNCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICAgIDxzdG9wIG9mZnNldD0iLjMxIiBzdG9wLWNvbG9yPSIjZDQ4NDBlIiBzdG9wLW9wYWNpdHk9Ii4xNCIvPgogICAgICA8c3RvcCBvZmZzZXQ9Ii45OSIgc3RvcC1jb2xvcj0iI2YwNjYyOCIgc3RvcC1vcGFjaXR5PSIuNDkiLz4KICAgICAgPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZjE2NjI5IiBzdG9wLW9wYWNpdHk9Ii41Ii8+CiAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPGNsaXBQYXRoIGlkPSJjbGlwcGF0aCI+CiAgICAgIDxwYXRoIGNsYXNzPSJjbHMtMSIgZD0ibTEwLjc4LDguMDJsLTIuODMtMi44M2MtLjItLjItLjUxLS4yLS43MSwwbC0xLjQxLDEuNDFjLS4yLjItLjIuNTEsMCwuNzFsMy4xOCwzLjE4LDEuNzcsMS43N2MuMi4yLjUxLjIuNzEsMGwxLjc3LTEuNzcsMy4xOC0zLjE4Yy4yLS4yLjItLjUxLDAtLjcxbC0xLjQxLTEuNDFjLS4yLS4yLS41MS0uMi0uNzEsMGwtMi44MywyLjgzYy0uMi4yLS41MS4yLS43MSwwWiIvPgogICAgPC9jbGlwUGF0aD4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcHBhdGgtMSI+CiAgICAgIDxyZWN0IGNsYXNzPSJjbHMtMSIgeD0iLjY4IiB5PSIuMDUiIHdpZHRoPSIyMC45IiBoZWlnaHQ9IjE3LjM2Ii8+CiAgICA8L2NsaXBQYXRoPgogIDwvZGVmcz4KICA8ZyBpZD0iX+WbvuWxgl8xLTIiIGRhdGEtbmFtZT0i5Zu+5bGCIDEiPgogICAgPGc+CiAgICAgIDxwYXRoIGNsYXNzPSJjbHMtMiIgZD0ibTEwLjEyLDE3LjJMLjM0LDcuNzNjLS4zNi0uMzYtLjQ2LS45OC0uMTUtMS4zOUw0LjE1LjQ2Yy4yMS0uMzEuNTctLjQ2Ljg4LS40NmgxMS41OWMuMzYsMCwuNjcuMTUuODguNDZsMy45Nyw1LjgyYy4zMS40Ni4yNiwxLjAzLS4xNSwxLjM5bC05LjczLDkuNTNjLS40MS40MS0xLjAzLjQxLTEuNDQsMFoiLz4KICAgICAgPHBhdGggY2xhc3M9ImNscy01IiBkPSJtMTAuNyw4LjY1Yy4wNS4wNS4xNS4xNS4yNi4yMS0uMS0uMDUtLjIxLS4xLS4yNi0uMjEiLz4KICAgICAgPHJlY3QgY2xhc3M9ImNscy0zIiB4PSI1LjE2IiB5PSI2LjY4IiB3aWR0aD0iNC41MSIgaGVpZ2h0PSI4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNS4zOCA4LjM3KSByb3RhdGUoLTQ1KSIvPgogICAgICA8ZyBjbGFzcz0iY2xzLTQiPgogICAgICAgIDxnIGNsYXNzPSJjbHMtNiI+CiAgICAgICAgICA8aW1hZ2Ugd2lkdGg9IjQ0IiBoZWlnaHQ9IjM3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSguNDkgLS4yKSBzY2FsZSguNDgpIiB4bGluazpocmVmPSJkYXRhOmltYWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQUN3QUFBQWxDQVlBQUFBNWl3dkpBQUFBQ1hCSVdYTUFBQmNSQUFBWEVRSEtKdk0vQUFBSElrbEVRVlJZaGFXWVQ2Z2ZWeFhIUCtmT3hHS2lkR1B3Vld4dFg2eTJqV2toVGJVeHNhSlNVSERqUm90YU1mYWZDdDJvQlYwWVVPb2YxSW9iRVlPQ0d6Y0tJZ2pxcTBzM0dpc21JQktqeGZXajZzWTI5UDFtN2prdXpybC81cjJYNUtYNXdYQm43c3p2enVkKzcvZWNlKytJbVJsNy9ObjU3L1JYaTN0eXoxTlgvdTkvbm9QLy9obEVRRktVQWdoeTI2bTlJaUI3QWJiejM4WE9QUU5vZ0pZRHJJQ0xJR3Nua0h1ZVFsNy9Uci8zd2xuNDkxbjA0ZzlnR0VBR0w5TUlLU0dTSUEyUUJ1VFdVOGliSHI1TzRNMC9ZTC85TUxZQVZTaC9FUXRnOGV2azZzbmFTV1R0QkhyaCt3NDBEQldzdjVhK1RxTHVsb2VSbXovNkNvQTMvNGh0UEFTbWdEWm9DK2hlWHltdEpZZXVZS09yT2ZUWHJaUlF1aWhlb1crOEc3bnJhN3RpcGN2RGZpeEl1c01xV1dPSDNpSCtUQjJNZU1pNmVsamFQM3pzblhWdjIvLytobDA0dlVmZ3piUFl4aWM2UU5ubHZIdmVPbkxyQUxmZnIvV2xuZFJLNmRvT2NIdnhBbmJ4cTFjQjN2d1R0dkhKYlkwbU1FRklvWm8wdGJiSG9EWlZUZjFvQ25kSDdYUVJJamxvZVo5RVFMNTRBZnZuMGhvTmVQTTViT05UT3hVdERaWmhaVGRJQjYxQ2xycmVDbWJMVWVyZ1hPRlUxWlZhbitDbGk5anozOXdKYkJ1UHRJWnNBSVlsdENYRXBJRVVOWlZRTktBMGpwSlE2alBSbG5vYndqWjRpYUFqTW9ZTW9ickFwWC9BUzMvdmdNLy9rT3FwSGNwMkZpam5WZFdBekFHWnUrR3YwQklXVHl3dHNZdmFpRnVoVGl3Rk9tSC9lZ2FBRWNET25lbitxTXRHTFhWREdzT3FYZkRWbUROdm9nK3lFbjBxbUlLa1RvUUtXVlJOaUF5aDl0QXMwWGZnMGtWR3pwM3hCcVMwbjRKaW0xZE5XOENwWURXWURLVE5kczV1UHVSSmxtMW9kRGFWWUc3S0xtMlJsdGN4amRzTHYyYXN3NkxpTDdhWUZDdzFSWXVxdTlqQlFrMFhMV3d4Z0psNmxvcU8rSVFpRGJSYXdsV1dUdWtHV3M3eDh0THpqUHpsUjRnVlpZclhDbmdCQlRTQkdxSUpVMjMxQlJwZzZHeGdSYnp5WEdvZFQyRTF4Z2JaVzZUemJsMHM0U3FQcURkYVJoV0t5TkZvVFUvV2hsUjdwY1ZQUkR5MUZSOFBoZ1NqRENuKzB3MS9IZllCa2JGbGhzVTlDWSszR1hac1U2WVB2d0ZpaHBYQXFoTkZhdEE1WHA1TG1oTk1MSWE5K0RwQnh1dXl3RkRhR1pDaUxFTzAyL201MktBSHI5NkN4RTFIVy9vSjFheEFaa0ZVRUUzSW5HQVd5QUV5R3phRFRXQ3p3Y3F3bFdFcnhTWmdNaXdEV2J3OWxjNFdWRURwbFBaT2ROZGR3Slg2eE5wUlRMdlpTWEdnN0FuZnNzQnNrRUd5T1BRazJBcFlnVTNtNWV5ZElFcUhMZlhFYUFoWXA2Nm1wbkpWYyt6QWx6azZMTkVpSGdwMG04R29hNEt1RTNQQVRISGZ6QzBoRVhnanlFekxETllOZlZVNnZHdEYzZkF4TENjdG9jTEs2eDRrY2V6UkJqaGJPMWVEeVdCV21CUldHZHZ5Z3luNzBLOFVYU202bGJFdHhWNVdMMWVHVFg0dzB3Sk9SeVN5ZzFRTERNMHFKbDNXMkNVRjdqL2tVN01jZTNRNXZXYXRwVTJLellyTkdac3p1cHJSbFRyOHJMQlM5K3ZMR1YxRlJ3SzZCbWhPQVJ4cU03U3lab1p0QWJpWXVnWDJyOFArOVZoTHZPTXhlTU5SQjUzVlBiZzFZMWtiOU5hTXJiS1hWZUdNYmdYb0ZNK3R0S1k3bTRxNkhtUVNReTk5VHQ0KzIvV3F4aEpCek8wQTNXcE43bjhNc2xVMXlRNWtxOW1QV2IyY2V1aGNTOTF5V0p1Yng5SGtRV3NKVVZkUXFwcWhiTFdMZExad0g0c0pvc0RCQjEzaEhwaWI3MFVlT2xOVnRsbGh6ZzE2eXUwb29KTmhzNFdTeGZ0ZGxsaGNGejg3bk5UYzNsYUpZajZCU2Jtdk9PakI5MVhNQmd4d3l6SFN4My9jckJDSDJ5TDdkWFNtM1F2WUxLQkR5N0hXcFMxTkxSdVlWRXM0V0FlNDJNVVlIRmlIOWNjWGlFdGdnRnZ2STUzNkNUWVhWV2QwaDdMRnMwWEp0QnpleU4wVzhVQTJCeXJ4a1Qydit6WktJdDlIZmNsUUI5Ymh6WS92d05zSkRNaHRiMmQ0NHFmWVBJZTZzMmVKS1h2REdxQ0w1V2RiZWRYRWI2bDJ4bUlTc2dXMEgrMjhnMzNMRTd1aFhXYWJEOGloKzluMzVNK3dhWWJzU3JzRmNpZ1IyNkpGcEhmUjNTOUJsVkEzZHpsZVljcGVuN1Z1cmV3MTYzRFhweStIZFhsZ0FMbjlPUHMrLzR2bTNTakpaUTlYbEJVVzYxdHIxelpIUHA4Vnk3VFJ5cmwxb29DL2RoMjUrN05YUXJveU1FQzY0d1EzZk9sWG9CRjgyM2NRaTYxVXZ5aVBSWktDVGFIaUlnTkYrcHhtaDc1eEhibjN5YXZoWEIwWUlOMTVraHRPLzhZWDZtVnRVUlR1WmlQcGszN2RYZnM2eExLNXNxcXdtaDEwOGhpUmsxOUFqbjl1THloN0F3WVlEcitMVjM5bFk2bHcvMEdrS3QzVjEwVlRyM0J1NEdySWU3NElCOSs2VjR5OUF3TU1iM3VBL1U4L1czZEJpN20rWEVzMFdaNHAwRVpkanpETnNKcVJEM3daMXU2OEZvUnJBNjdRWC84ZFJ1d0RLMlRaMHZTd05OaWNmVEtZTTJnbWZlaHA1S2JEMS9yNmF3Y0dHSTQ4d0lGdlBNdDQ1TjIwcjQvRkZsUm8zMUM3ZDMwMjlObHkrTWkza1RjZWVTV3YzdHNYK0N2OThsOS96NlhUSC9UdnVzTUE0NGlNSXpMdTgvTjlmaTZ2MnNmNC9zOHd2UGVSNjNuZDlRT1gzK3JuMzRydkQ0bnBsOTlEeHBIaDhBbUdPNDdEa0VpMzMwYzZkT3k2My9OLzF2ZG1IUi9qODlRQUFBQUFTVVZPUks1Q1lJST0iLz4KICAgICAgICA8L2c+CiAgICAgIDwvZz4KICAgIDwvZz4KICA8L2c+Cjwvc3ZnPg=="); } .flex-avatar .avatar-badge { position: absolute; right: 0; bottom: 0; width: 15px; height: 15px; } /*-------------------------------------------------------------- card style --------------------------------------------------------------*/ .card, .block { position: relative; background: var(--card-bg); border: 0 solid var(--card-border-color); border-radius: var(--border-radius-md); box-shadow: var(--shadow); } .card-header, .card-footer { background-color: transparent; border-color: transparent; background-clip: padding-box; border: 0; padding: 20px; } .card-header { padding: 20px 20px 0; } .card-body { padding: 20px; } .card-body p:last-child { margin-bottom: 0; } .card-title { line-height: 1.5; } .card-md .card-header { padding: 32px 32px 0; } .card-md .card-body { padding: 32px; } .card-md .card-footer { padding: 0 32px 24px; } @media (max-width: 767.98px) { .card-header { padding: 16px 16px 0; } .card-body { padding: 16px; } .card-md .card-header { padding: 20px 20px 0; } .card-md .card-body { padding: 20px; } } @media (min-width: 768px) and (max-width: 991.98px) { .card-md .card-header { padding: 24px 24px 0; } .card-md .card-body { padding: 24px; } } /*-------------------------------------------------------------- List style --------------------------------------------------------------*/ .list { padding-left: 0; padding-right: 0; } .list-item { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; } .list-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; } .list-body { flex: 1 1 auto; } .list-footer { margin-top: 12px; } .list-footer .flex-avatar .avatar-badge { width: 12px; height: 12px; transform: translate(2px, 2px); } .list-title { line-height: 1.45; color: inherit; } .list-goto { position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 2; } /*-------------------------------------------------------------- List grouped style --------------------------------------------------------------*/ .list-grouped > div { display: flex; } .list-grouped .list-item { flex: 1 1 auto; } @media (max-width: 991.98px) { .list-footer .flex-avatar { width: 16px !important; height: 16px !important; top: -1px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .list-footer .flex-avatar { width: 16px !important; height: 16px !important; top: -1px; } } /*-------------------------------------------------------------- List + block --------------------------------------------------------------*/ .list-grouped .list-item.block .list-content { padding: 14px; } .list-grouped .list-item.block .media { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .list-grouped .list-item.block.recommend .media { border-radius: inherit; } @media (max-width: 767.98px) { .list-grouped .list-item.block .list-content { padding: 10px 10px 8px; } } @media (min-width: 768px) and (max-width: 991.98px) { .list-grouped .list-item.block .list-content { padding: 10px 10px 8px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .list-grouped .list-item.block .list-content { padding: 14px 14px 12px; } } /*-------------------------------------------------------------- List larger --------------------------------------------------------------*/ .list-larger.list-grouped .list-item.block .list-content { padding: 16px; } @media (max-width: 767.98px) { .list-larger.list-grouped .list-item.block .list-content { padding: 12px; } } @media (min-width: 768px) and (max-width: 991.98px) { .list-larger.list-grouped .list-item.block .list-content { padding: 14px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .list-larger.list-grouped .list-item.block .list-content { padding: 15px; } } /*-------------------------------------------------------------- List grid style --------------------------------------------------------------*/ .list-grid .list-item { flex-direction: row; margin: 0 0 16px; } .list-grid .list-item .list-content { padding: 0; } .list-grid .list-item .media { border-radius: var(--border-radius-sm); } /*-------------------------------------------------------------- List grid padding style --------------------------------------------------------------*/ .list-grid.list-grid-padding .list-item { padding: 16px; gap:12px; } .list-grid.list-grid-padding .list-item .media { width: 120px; height: 90px; border-radius: var(--border-radius-sm); } @media (max-width: 767.98px) { .list-grid.list-grid-padding .list-item { padding: 12px; margin: 0 0 12px; } .list-grid.list-grid-padding .list-item .media { width: 100px; height: 80px; } } @media (min-width: 1200px) and (max-width: 1399.98px) { } /*-------------------------------------------------------------- List overlay style --------------------------------------------------------------*/ .list-overlay { color: #fff; background-color: transparent; border-radius: var(--border-radius-md); } .list-overlay:hover .media-opacity { transform: scale(1.2); } .list-overlay .list-content { position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: inherit; padding: 10px 14px; z-index: 2; } .list-overlay .list-body { display: flex; flex-direction: column; } .list-grouped .list-item.list-overlay .media { border-radius: inherit; } .list-grouped .list-item.list-overlay .list-title { text-align: left; } .list-grouped .list-item.list-overlay .list-content, .list-grouped .list-item.list-overlay.overlay-bottom .list-content { padding: 14px 20px; } .list-overlay a, .list-overlay a:hover, .list-overlay a:active { color: #fff; } .list-overlay .text-muted:not(i) { color: var(--color-light) !important; } .list-overlay.overlay-bottom .list-content { top: auto; } @media (max-width: 767.98px) { .list-overlay .list-content { padding: 12px 14px; } .list-grouped .list-item.list-overlay .list-content, .list-grouped .list-item.list-overlay.overlay-bottom .list-content { padding: 14px 16px; } } @media (min-width: 768px) and (max-width: 991.98px) { .list-overlay .list-content { padding: 8px; } .list-grouped .list-item.list-overlay .list-content, .list-grouped .list-item.list-overlay.overlay-bottom .list-content { padding: 14px 16px; } } /*-------------------------------------------------------------- list index pushes --------------------------------------------------------------*/ @media (min-width: 768px) { .list-index-pushes .col-md-2{ width:12.5%; } } /*-------------------------------------------------------------- Custom style --------------------------------------------------------------*/ .custom-hover { position: relative; } .custom-hover .media-content, .custom-hover-img { max-width: 100%; transition: all 444ms ease-in-out; } .custom-hover:hover .media-content, .custom-hover:hover .custom-hover-img { transform: scale(1.05); } .custom-hover .custom-hover-icon { position: absolute; left: 0; right: 0; text-align: center; top: 50%; opacity: 0; transform: translateY(-50%); visibility: visible; z-index: 9; transition: 0.3s; } .custom-hover .custom-hover-icon span { width: 40px; height: 40px; line-height: 40px; border-radius: 40px; display: inline-block; background-color: rgba(255, 255, 255, 0.68); } .custom-hover:hover .custom-hover-icon { opacity: 1; } @media (max-width: 991.98px) { .custom-hover:hover img, .custom-hover:hover .media-content, .custom-hover:hover .custom-hover-img { transform: none; } } /*-------------------------------------------------------------- Overlay style --------------------------------------------------------------*/ .overlay { width: 100%; height: 100%; background-color: rgba(22, 29, 39, 0.66); position: absolute; opacity: 0; top: 0; left: 0; transition: opacity 0.3s ease-in-out; } .overlay-hover:hover .overlay, a:hover .overlay { opacity: 0.5; } .overlay-1 { width: 100%; height: 100%; background-color: rgba(0, 0, 0); position: absolute; opacity: 0.4; top: 0; left: 0; transition: opacity 0.3s ease-in-out; } .overlay-hover:hover .overlay-1, a:hover .overlay-1 { opacity: 0.6; } .overlay-grad { width: 100%; height: 100%; position: absolute; opacity: 0.5; top: 0; left: 0; transition: opacity 0.3s ease-in-out; background: var(--color-dark); background: linear-gradient(to top, rgb(0 0 0 / 80%), rgb(0 0 0 / 0%)); } .overlay-hover:hover .overlay-grad, a:hover .overlay-grad { opacity: 0.9; } /*-------------------------------------------------------------- Poster animation style --------------------------------------------------------------*/ .poster-zoom { -webkit-animation: posterZoom 30s linear; animation: posterZoom 30s linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } @-webkit-keyframes posterZoom { from { transform: scale(1); } to { transform: scale(1.3); } } @keyframes posterZoom { from { transform: scale(1); } to { transform: scale(1.3); } } /*-------------------------------------------------------------- Line-clamp style --------------------------------------------------------------*/ .h-1x { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .h-2x { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; } .h-3x { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .h-4x { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; } /*-------------------------------------------------------------- index posts menu style --------------------------------------------------------------*/ .index-posts-menu { position: relative; display: flex; flex-wrap: wrap; flex-direction: row; gap: 24px; padding: 0 20px; } .index-posts-menu a { position: relative; cursor: pointer; flex-shrink: 0; } .index-posts-menu a.active { color: var(--color-primary); } .index-posts-menu a:after { content: ''; position: absolute; left: 50%; bottom: 0; width: 0; height: 4px; background-color: var(--color-primary); border-radius: 6px; transform: translateX(-50%); opacity: 0; transition: all 0.3s ease-in-out; } .index-posts-menu a:hover:after, .index-posts-menu a.active:after { opacity: 1; width: 30px; } @media (max-width: 991.98px) { .index-posts-menu { flex-wrap: nowrap; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; gap: 8px; } .index-posts-menu::-webkit-scrollbar { display: none; } } /*-------------------------------------------------------------- ## Post --------------------------------------------------------------*/ .post { padding: 24px; } .post .post-title { color: var(--color-dark); } @media (max-width: 767.98px) { .post { padding: 12px; } } /*-------------------------------------------------------------- Archive header style --------------------------------------------------------------*/ .archive-header .archive-icon { position: absolute; } .archive-header .archive-body { padding: 0 0 0 60px; margin-top: 2px; } .archive-header .archive-body sup { font-size: 80%; font-weight: normal; } @media (min-width: 768px) and (max-width: 991.98px) { .archive-header .archive-body { padding: 0 0 0 50px; margin-top: 0; } } @media (max-width: 767.98px) { .archive-header .archive-body { padding: 4px 0 0 50px; margin-top: 0; } } /*-------------------------------------------------------------- post tags style --------------------------------------------------------------*/ .post-tags { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; } .post-tags a { position: relative; display: inline-block; font-size: 14px; color: var(--color-muted); padding: 4px 12px 4px 28px; border-radius: 24px; background-color: var(--gray-2); } .post-tags a::before { content: ''; position: absolute; left: 9px; top: 7px; width: 16px; height: 16px; display: flex; justify-content: center; align-items: center; background-repeat: no-repeat; background-position: center; background-size: contain; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuMDUzNzUgMS41Njk5NkM2LjE3NTkyIDEuNTg1MTkgNi4yOTM5IDEuNjI0MzIgNi40MDA5NCAxLjY4NTE0QzYuNTA3OTkgMS43NDU5NiA2LjYwMiAxLjgyNzI3IDYuNjc3NjMgMS45MjQ0MkM2Ljc1MzI1IDIuMDIxNTggNi44MDg5OSAyLjEzMjY3IDYuODQxNjggMi4yNTEzN0M2Ljg3NDM2IDIuMzcwMDcgNi44ODMzNSAyLjQ5NDA0IDYuODY4MTIgMi42MTYyMUw2LjY0ODEzIDQuMzc0OTZIOS4xMzMxMkw5LjM4MjUgMi4zODM3MUM5LjM5Nzc3IDIuMjYxNTQgOS40MzY5NSAyLjE0MzU3IDkuNDk3OCAyLjAzNjU1QzkuNTU4NjYgMS45Mjk1MiA5LjY0IDEuODM1NTIgOS43MzcxOCAxLjc1OTkzQzkuODM0MzcgMS42ODQzNCA5Ljk0NTQ5IDEuNjI4NjMgMTAuMDY0MiAxLjU5NTk4QzEwLjE4MjkgMS41NjMzMyAxMC4zMDY5IDEuNTU0MzggMTAuNDI5MSAxLjU2OTY1QzEwLjU1MTIgMS41ODQ5MiAxMC42NjkyIDEuNjI0MDkgMTAuNzc2MiAxLjY4NDk1QzEwLjg4MzMgMS43NDU4MSAxMC45NzczIDEuODI3MTUgMTEuMDUyOCAxLjkyNDMzQzExLjEyODQgMi4wMjE1MSAxMS4xODQxIDIuMTMyNjMgMTEuMjE2OCAyLjI1MTM1QzExLjI0OTQgMi4zNzAwNiAxMS4yNTg0IDIuNDk0MDQgMTEuMjQzMSAyLjYxNjIxTDExLjAyMzEgNC4zNzQ5NkgxMi41QzEyLjc0ODYgNC4zNzQ5NiAxMi45ODcxIDQuNDczNzMgMTMuMTYyOSA0LjY0OTU1QzEzLjMzODcgNC44MjUzNiAxMy40Mzc1IDUuMDYzODIgMTMuNDM3NSA1LjMxMjQ2QzEzLjQzNzUgNS41NjExIDEzLjMzODcgNS43OTk1NiAxMy4xNjI5IDUuOTc1MzdDMTIuOTg3MSA2LjE1MTE5IDEyLjc0ODYgNi4yNDk5NiAxMi41IDYuMjQ5OTZIMTAuNzg4OEwxMC40NzYyIDguNzQ5OTZIMTIuMTg3NUMxMi40MzYxIDguNzQ5OTYgMTIuNjc0NiA4Ljg0ODczIDEyLjg1MDQgOS4wMjQ1NUMxMy4wMjYyIDkuMjAwMzYgMTMuMTI1IDkuNDM4ODIgMTMuMTI1IDkuNjg3NDZDMTMuMTI1IDkuOTM2MSAxMy4wMjYyIDEwLjE3NDYgMTIuODUwNCAxMC4zNTA0QzEyLjY3NDYgMTAuNTI2MiAxMi40MzYxIDEwLjYyNSAxMi4xODc1IDEwLjYyNUgxMC4yNDE5TDkuOTkzMTIgMTIuNjE2MkM5Ljk2MjI5IDEyLjg2MjkgOS44MzQ3MSAxMy4wODczIDkuNjM4NDQgMTMuMjRDOS40NDIxNyAxMy4zOTI3IDkuMTkzMyAxMy40NjExIDguOTQ2NTYgMTMuNDMwM0M4LjY5OTgzIDEzLjM5OTQgOC40NzU0NSAxMy4yNzE5IDguMzIyNzggMTMuMDc1NkM4LjE3MDExIDEyLjg3OTMgOC4xMDE2NyAxMi42MzA0IDguMTMyNSAxMi4zODM3TDguMzUxODcgMTAuNjI1SDUuODY3NUw1LjYxODc1IDEyLjYxNjJDNS42MDM0OCAxMi43Mzg0IDUuNTY0MyAxMi44NTYzIDUuNTAzNDUgMTIuOTYzNEM1LjQ0MjU5IDEzLjA3MDQgNS4zNjEyNSAxMy4xNjQ0IDUuMjY0MDcgMTMuMjRDNS4xNjY4OCAxMy4zMTU2IDUuMDU1NzYgMTMuMzcxMyA0LjkzNzA1IDEzLjQwMzlDNC44MTgzNCAxMy40MzY2IDQuNjk0MzYgMTMuNDQ1NSA0LjU3MjE5IDEzLjQzMDNDNC40NTAwMiAxMy40MTUgNC4zMzIwNSAxMy4zNzU4IDQuMjI1MDIgMTMuMzE1QzQuMTE3OTkgMTMuMjU0MSA0LjAyNCAxMy4xNzI4IDMuOTQ4NDEgMTMuMDc1NkMzLjg3MjgxIDEyLjk3ODQgMy44MTcxIDEyLjg2NzMgMy43ODQ0NSAxMi43NDg2QzMuNzUxODEgMTIuNjI5OSAzLjc0Mjg2IDEyLjUwNTkgMy43NTgxMiAxMi4zODM3TDMuOTc2ODggMTAuNjI1SDIuODEyNUMyLjU2Mzg2IDEwLjYyNSAyLjMyNTQgMTAuNTI2MiAyLjE0OTU5IDEwLjM1MDRDMS45NzM3NyAxMC4xNzQ2IDEuODc1IDkuOTM2MSAxLjg3NSA5LjY4NzQ2QzEuODc1IDkuNDM4ODIgMS45NzM3NyA5LjIwMDM2IDIuMTQ5NTkgOS4wMjQ1NUMyLjMyNTQgOC44NDg3MyAyLjU2Mzg2IDguNzQ5OTYgMi44MTI1IDguNzQ5OTZINC4yMTEyNUw0LjUyMzc1IDYuMjQ5OTZIMy4xMjVDMi44NzYzNiA2LjI0OTk2IDIuNjM3OSA2LjE1MTE5IDIuNDYyMDkgNS45NzUzN0MyLjI4NjI3IDUuNzk5NTYgMi4xODc1IDUuNTYxMSAyLjE4NzUgNS4zMTI0NkMyLjE4NzUgNS4wNjM4MiAyLjI4NjI3IDQuODI1MzYgMi40NjIwOSA0LjY0OTU1QzIuNjM3OSA0LjQ3MzczIDIuODc2MzYgNC4zNzQ5NiAzLjEyNSA0LjM3NDk2SDQuNzU4MTJMNS4wMDc1IDIuMzgzNzFDNS4wMjI2NSAyLjI2MTQ5IDUuMDYxNzMgMi4xNDM0NCA1LjEyMjUyIDIuMDM2MzNDNS4xODMzIDEuOTI5MjEgNS4yNjQ2IDEuODM1MTIgNS4zNjE3NiAxLjc1OTQzQzUuNDU4OTIgMS42ODM3NSA1LjU3MDA1IDEuNjI3OTUgNS42ODg3OCAxLjU5NTIyQzUuODA3NTEgMS41NjI1IDUuOTMxNTMgMS41NTM0OSA2LjA1Mzc1IDEuNTY4NzFWMS41Njk5NlpNOC41ODc1IDguNzQ5OTZMOC45IDYuMjQ5OTZINi40MTQzN0w2LjEwMTg3IDguNzQ5OTZIOC41ODc1WiIgZmlsbD0iIzE2NURGRiIvPgo8L3N2Zz4K"); } .post-tags a:hover { color: var(--color-primary); background-color: var(--outline-primary); } .user-filter-menu { display: flex; flex-direction: row; flex-wrap: wrap; gap: 24px; } .user-filter-menu a { cursor: pointer; } .user-filter-menu a.active { color: var(--color-primary); } /*--------------------------------------------------- post actions --------------------------------------------------------------*/ .like-button.active { color: var(--color-danger) } .btn.like-button { background-color: transparent !important; border: 0 !important; padding: 0; } .like-button i { transition: color .1s ease } .like-button.active i { -webkit-animation: icon-expand-animation 1.2s both cubic-bezier(.45, .05, .55, .95); animation: icon-expand-animation 1.2s both cubic-bezier(.45, .05, .55, .95) } .like-button.active i:before { content: "\e986"; } @-webkit-keyframes loading-spin-animation { from { transform: rotate(0deg) } to { transform: rotate(360deg) } } @keyframes loading-spin-animation { from { transform: rotate(0deg) } to { transform: rotate(360deg) } } @-webkit-keyframes icon-expand-animation { 0% { transform: scale(0) } 15% { transform: scale(1.4) } 32% { transform: scale(.8) } 50% { transform: scale(1); opacity: 1 } to { transform: scale(1); opacity: 1 } } @keyframes icon-expand-animation { 0% { transform: scale(0) } 15% { transform: scale(1.4) } 32% { transform: scale(.8) } 50% { transform: scale(1); opacity: 1 } to { transform: scale(1); opacity: 1 } } /*--------------------------------------------------- widget --------------------------------------------------------------*/ .widget { position: relative; padding: 16px 16px; margin-bottom: 16px; } .widget.hidden { opacity: .1; pointer-events: none; } .widget-header { position: relative; font-weight: bold; margin: 0 0 16px; padding-left: 25px; } .widget-border { position: absolute; top: -3px; left: 0; width: 36px; height: 30px; border-radius: 4px; } .widget-border::before { content: ''; position: absolute; left: 0; top: 50%; width: 3px; height: 18px; border-radius: 10px; background-color: var(--color-primary); opacity: 1; transform: translateY(-50%) rotate(15deg); transition: all .4s ease-in-out; } .widget-border::after { content: ''; position: absolute; left: 8px; top: 50%; width: 3px; height: 16px; border-radius: 10px; background-color: var(--color-primary); opacity: .6; transform: translateY(-50%) rotate(15deg); transition: all .4s ease-in-out; } .widget:hover .widget-border::before, .widget:hover .widget-border::after { transform: translateY(-50%) rotate(-165deg); } /*-------------------------------------------------------------- widget categories + tagcloud style --------------------------------------------------------------*/ .widget-tags .tag-list { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; } .widget-tags .tag-list a { position: relative; display: flex; align-items: center; font-size: 14px; padding: 6px 10px; color: var(--color-secondary); background-color: var(--bg-light); border-radius: var(--border-radius-sm); } .widget-tags .tag-list a:hover { background-color: var(--color-primary); color: #fff; } .widget-tags .tag-list a i { position: relative; top: -1px; margin-left: 4px; color: var(--color-primary); } .widget-tags .tag-list a:hover i { color: #fff; } .widget-posts .post-list { display: flex; flex-direction: column; gap: 12px; } .widget-posts .post-list a { position: relative; padding-left: 14px; } .widget-posts .post-list a:before { content: ''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; background-color: var(--gray-3); border-radius: 8px; } /*-------------------------------------------------------------- widget_media_image style --------------------------------------------------------------*/ .widget_media_image img { max-width: 100%; height: auto; width: auto; } /*-------------------------------------------------------------- widget_recent_comments style --------------------------------------------------------------*/ .widget_nav_menu ul li { position: relative; text-transform: none; margin-bottom: 8px; } .widget_nav_menu ul li:last-child { margin-bottom: 0; } .widget_nav_menu ul li a { display: block; padding: 8px 12px; background-color: var(--gray-2); border-radius: var(--border-radius-sm); } .widget_nav_menu ul li.menu-item-has-children::after { content: ""; display: block; position: absolute; top: 15px; right: 15px; height: 6px; width: 6px; border-left: 1px solid var(--color-secondary); border-bottom: 1px solid var(--color-secondary); transform: rotate(315deg); transition: all 0.2s; } .widget_nav_menu ul li.menu-item-has-children:hover::after { margin-top: 2px; transform: rotate(135deg); } .widget_nav_menu ul li ul { margin-top: 8px; } .widget_nav_menu ul li > ul { display: none; } .widget_nav_menu ul li:hover > ul { display: block; } .widget_nav_menu ul li > ul ul li a { background-color: var(--bg-light); } /* -------------------------------- widget pinned_post -------------------------------- */ .widget_pinned_post { position: relative; padding: 0; } .widget_pinned_post .media-overlay { background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3)); } .widget_pinned_post .pinned-content { position: absolute; left: 0; bottom: 0; width: 100%; padding: 16px; color: #fff; z-index: 3; } .widget_pinned_post .pinned-content .pinned-post-title a { color: #fff; } /*-------------------------------------------------------------- widget menu style --------------------------------------------------------------*/ .widget-menu ul { display: flex; flex-direction: column; padding: 8px; gap: 4px; } .widget-menu li a { display: flex; align-items: center; gap: 8px; padding: 8px 12px 8px 16px; border-radius: var(--border-radius-xs); } .widget-menu li.current-menu-parent a { background-color: var(--outline-primary); color: var(--color-primary); } .widget-menu li .menu-icon { display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; font-size: 20px; } /*-------------------------------------------------------------- Widget post banner style --------------------------------------------------------------*/ .widget_post_banner .media { height: 240px; } /*-------------------------------------------------------------- comment style --------------------------------------------------------------*/ .comments .comment-respond { position: relative; } .comments .comment-form, .comments .comment { position: relative; padding-left: 48px; margin-bottom: 32px; } .comments .comment:last-child { margin-bottom: 0; } .comments .comment-text { text-align: justify; word-wrap: break-word; word-break: break-all; line-height: 1.65 } .comments .comment-text .comment_at { color: var(--color-muted); } .comments .comment-avatar { position: absolute; left: 0; width: 36px; height: 36px; } .comments .comment-info { font-weight: bold; } .comments .comment .children { margin-top: 20px; } .comments .comment .children .comment { padding-left: 40px; margin-bottom: 20px; } .comments .comment .children .comment .comment-avatar { width: 28px; height: 28px; } @media (max-width: 767.98px) { .comments .comment-avatar { width: 32px; height: 32px; } .comments .comment .children .comment { padding-left: 40px; margin-bottom: 20px; } .comments .comment .children .comment .comment-avatar { width: 28px; height: 28px; } } /*-------------------------------------------------------------- breadcrumbs --------------------------------------------------------------*/ .breadcrumbs { flex-wrap: wrap; align-items: center; } .breadcrumbs span.sep { margin: 0 4px; } /* -------------------------------- Footer -------------------------------- */ .site-footer { background-color: #fff; } .site-footer .footer-content { display: flex; justify-content: space-between; } .site-footer .footer-menu { display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; } .site-footer .footer-menu li { position: relative; margin: 4px 16px 4px 0; padding: 0 16px 0 0; } .site-footer .footer-menu li:last-child { margin-right: 0; padding-right: 0; } .site-footer .footer-menu li:after { content: ''; position: absolute; right: 0; top: 50%; width: 4px; height: 4px; border-radius: 10px; background-color: var(--color-primary); transform: translate(50%, -50%); } .site-footer .footer-menu li:last-child:after { display: none; } .site-footer .footer-menu li a { display: block; white-space: nowrap; } .site-footer .footer-social { display: flex; flex-wrap: wrap; flex-direction: row; gap: 10px; } @media (max-width: 991.98px) { .site-footer .footer-content { flex-direction: column; justify-content: center; } .site-footer .footer-menu { justify-content: center; } } .footer-links { display: flex; flex-wrap: wrap; } .footer-links a { display: inline-block; color: var(--color-muted); margin: 0 8px 0 0; white-space: nowrap; } .footer-mps { margin-right: 8px; } .footer-mps img { position: relative; top: -1px; } /*-------------------------------------------------------------- ## slide style index --------------------------------------------------------------*/ .index-slide .media { height: 240px; } .index-slide .swiper-pagination.swiper-pagination-bullets { bottom: 5px; } .index-slide .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet { --swiper-pagination-bullet-horizontal-gap: 2px } @media (min-width: 992px) and (max-width: 1199.98px) { .index-slide .media { height: 220px; } } @media (min-width: 768px) and (max-width: 991.98px) { .index-slide .media { height: 170px; } } @media (max-width: 767.98px) { .index-slide .media { height: 150px; } .index-slide .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet { --swiper-pagination-bullet-width: 4px; --swiper-pagination-bullet-height: 4px; --swiper-pagination-bullet-horizontal-gap: 2px } } .slide-nextprev .swiper-button-next, .slide-nextprev .swiper-button-prev { width: var(--swiper-navigation-size); color: var(--swiper-pagination-color); background-color: rgba(0, 0, 0, 0.2); border-radius: 100%; opacity: 0; visibility: hidden; transform-origin: 0 0 0; transition: all 0.3s ease-out 0s; } .slide-nextprev:hover .swiper-button-next, .slide-nextprev:hover .swiper-button-prev { opacity: 1; visibility: visible; } .slide-nextprev:hover .swiper-button-next { right: 3% } .slide-nextprev:hover .swiper-button-prev { left: 3% } .slide-nextprev .swiper-button-next:hover { background-color: rgba(0, 0, 0, 0.5); } .slide-nextprev .swiper-button-prev:hover { background-color: rgba(0, 0, 0, 0.5); } .slide-nextprev .swiper-button-next:after, .slide-nextprev .swiper-button-prev:after { position: relative; font-size: calc((var(--swiper-navigation-size) / 2.25)) } .slide-nextprev .swiper-button-prev:after { left: -1px } .slide-nextprev .swiper-button-next:after { left: 1px } .slide-nextprev .swiper-button-next.swiper-button-disabled, .slide-nextprev .swiper-button-prev.swiper-button-disabled { opacity: 0; visibility: hidden; } .slide-nextprev .swiper-pagination { display: flex; left: 50%; width: auto; padding: 4px 2px; border-radius: 48px; transform: translateX(-50%); background-color: rgb(0 0 0 / 20%); } .slide-nextprev .swiper-pagination.swiper-pagination-lock { display: none; } /* --------------------------------------------------- SIDEBAR STYLE ----------------------------------------------------- */ .mobile-sidebar { width: 80%; position: fixed; top: 0; left: 0; display: flex; flex-direction: column; height: 100vh; z-index: 999; background: var(--gray-2); transform: translateX(-100%); transition: 300ms ease; } @media (min-width: 767.98px) { .mobile-sidebar::-webkit-scrollbar { display: none; } } .mobile-sidebar.active { transform: translateX(0); transition: 300ms ease; } .mobile-overlay { display: none; position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; background: rgba(120, 129, 147, 0.22); z-index: 998; opacity: 0; transition: all 0.5s ease-in-out; cursor: pointer; } .mobile-overlay.active { display: block; opacity: 1; } @media (min-width: 768px) and (max-width: 1199.98px) { .mobile-sidebar { width: 300px; } } /*-------------------------------------------------------------- navbar mobile --------------------------------------------------------------*/ .mobile-sidebar-inner { overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; flex: 1 1 auto; } .mobile-sidebar-menu { position: relative; padding: 0 16px; } .mobile-sidebar-menu > li { position: relative; margin: 0 0 12px; padding: 13px 16px; background-color: #fff; border-radius: var(--border-radius-md); } .mobile-sidebar-menu > li:last-child { border-bottom: 0; } .mobile-sidebar-menu li a { position: relative; display: flex; align-items: center; font-size: 16px; gap: 4px; padding: 0; } .mobile-sidebar-menu li a .menu-icon { display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; font-size: 21px; } .mobile-sidebar-menu li a .menu-text { flex: 1 1 auto; } .mobile-sidebar-menu > li:last-child a { border-width: 0; } .mobile-sidebar-menu li a:hover { opacity: 1; } .mobile-sidebar-menu > li.in > a { color: var(--color-primary) } /*-------------------------------------------------------------- navbar mobile sub --------------------------------------------------------------*/ .mobile-sidebar-menu .sub-menu { display: none; position: relative; } .mobile-sidebar-menu .sub-menu li { margin: 16px 0 0; } .mobile-sidebar-menu .sub-menu li:first-child { margin: 16px 0 0; } .mobile-sidebar-menu > li.current-menu-item > a, .mobile-sidebar-menu .sub-menu li > a:hover, .mobile-sidebar-menu .sub-menu li.current_page_item > a, .mobile-sidebar-menu .sub-menu li.current-menu-item > a, .mobile-sidebar-menu .sub-menu li.current_page_ancestor > a, .mobile-sidebar-menu .sub-menu li.current-menu-ancestor > a, .mobile-sidebar-menu .sub-menu li.current-menu-parent > a { color: var(--color-primary); } /*-------------------------------------------------------------- navbar mobile menu sign --------------------------------------------------------------*/ .mobile-sidebar-menu li .dropdown-sub-menu { position: absolute; top: 9px; right: 0; width: 6px; opacity: .3; transition: all 0.3s ease; } .mobile-sidebar-menu li.menu-item-has-children .dropdown-sub-menu { right: 2px; } .mobile-sidebar-menu li.menu-item-has-children .dropdown-sub-menu:after { content: ""; display: block; height: 6px; width: 6px; border-right: 1px solid #000; border-top: 1px solid #000; transform: rotate(46deg); transition: all 0.3s ease; } .mobile-sidebar-menu li.in > a > .dropdown-sub-menu:after { transform: rotate(135deg); } /*-------------------------------------------------------------- author info --------------------------------------------------------------*/ .author-info .author-cover { position: relative; height: 240px; background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: inherit; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .author-info .author-inner { position: relative; padding: 0 32px 20px; } .author-info .author-avatar { position: relative; width: 128px; height: 128px; margin-top: -56px; } .author-info .author-avatar img { border: 2px solid #fff; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); } .author-info .author-avatar .avatar-badge { width: 24px; height: 24px; right: 6px; bottom: 6px; } .author-info .author-content { padding: 20px 0 0 20px; } .author-info .author-meta .item { position: relative; display: flex; align-items: center; padding-right: 24px; margin-right: 24px; } .author-info .author-meta .item::after { content: ''; position: absolute; top: 50%; right: 0; width: 1px; height: 15px; background-color: var(--bg-light); transform: translateY(-50%); } .author-info .author-meta .item:last-child { padding-right: 0; margin-right: 0; } .author-info .author-meta .item:last-child::after { display: none; } @media (max-width: 767.98px) { .author-info .author-cover { height: 120px; } .author-info .author-meta { position: relative; /* padding: 32px 0 16px; */ text-align: center; justify-content: center; } .author-info .author-avatar { position: absolute; width: 80px; height: 80px; left: 50%; top: 0; transform: translate(-50%, 20%); } .author-info .author-content { text-align: center; padding: 56px 0 0; } } /*-------------------------------------------------------------- tags list style --------------------------------------------------------------*/ .tags-list .item { position: relative; overflow: hidden; display: flex; flex: 1 1 auto; flex-direction: column; } .tags-list .item .item-count { position: absolute; right: 5px; bottom: 0; font-size: 48px; line-height: 1; font-style: italic; transform: translate(-10px, 0%); opacity: .1; transition: all 300ms ease-in-out; } .tags-list .item:hover .item-count { transform: translate(-20px, 55%); } .tags-list .item .item-flag { position: relative; display: inline-block; width: 15px; height: 15px; top: 2px; right: -5px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMSIgaGVpZ2h0PSIyMSIgZmlsbD0ibm9uZSI+PHJlY3Qgd2lkdGg9IjIxIiBoZWlnaHQ9IjIxIiBmaWxsPSJ1cmwoI2EpIiByeD0iMyIvPjxwYXRoIGZpbGw9IiNmZmYiIGQ9Im00LjIwNiAxMi4yMjIgMS4yMjQtLjE0NGMuMDEyLjMzNi4wNDIuNTY0LjA5LjY4NC4wNDguMTIuMDk2LjE4Ni4xNDQuMTk4LjA2IDAgLjExNC0uMDYuMTYyLS4xOC4wNi0uMTMyLjEwOC0uMzY2LjE0NC0uNzAyTDYuMjA0IDkuOWExNi43IDE2LjcgMCAwIDEtMS4yNi4yNTJsLS4xOTgtMS40NGMuMjc2LS4wNDguNTQ2LS4wOTYuODEtLjE0NC4yNzYtLjA2LjU0Ni0uMTIuODEtLjE4bC4zMjQtMi44MjZINS4zOTRsLjE2Mi0xLjQ3NmgxLjI3OGwuMjM0LTIuMDdoMS40OTRsLS4yMTYgMi4wN0g5LjNsLS4xNjIgMS40NzZoLS45NTRsLS4yNTIgMi4zOTRjLjI3Ni0uMDk2LjU0LS4xOTIuNzkyLS4yODhsLjM2IDEuMzY4Yy0uNDIuMTY4LS44NjQuMzI0LTEuMzMyLjQ2OGwtLjI4OCAyLjc1NGMtLjA4NC44NzYtLjMgMS40NzYtLjY0OCAxLjgtLjM0OC4zMjQtLjcwOC40OC0xLjA4LjQ2OC0uNDgtLjAyNC0uODQ2LS4yMDQtMS4wOTgtLjU0LS4yNC0uMzQ4LS4zODQtLjkzNi0uNDMyLTEuNzY0Wm05LjMyNC0xLjk0NC0uODY0IDEuMDYyYy0uMzYtLjQzMi0uNzMyLS44NC0xLjExNi0xLjIyNGExOC4xODggMTguMTg4IDAgMCAxLTEuMTE2IDIuNTM4Yy0uNDIuNzY4LS44NzYgMS40NC0xLjM2OCAyLjAxNmwtMS4yNi0uOTU0YTkuOTM4IDkuOTM4IDAgMCAwIDEuNDU4LTIuMDUyQTE1LjA2IDE1LjA2IDAgMCAwIDEwLjM4IDlhMTcuODE3IDE3LjgxNyAwIDAgMC0xLjIwNi0uOTcybC44MjgtMS4xMTZjLjI3Ni4yMTYuNTM0LjQyNi43NzQuNjMuMTU2LS42Ni4yODItMS4zNDQuMzc4LTIuMDUySDkuNjc4bC4xNjItMS41MTJoMS40OTRsLjE5OC0xLjk2MmgxLjQ5NGwtLjIxNiAxLjk2MmgxLjYyYy40NTYgMCAuNzkyLjEyNiAxLjAwOC4zNzguMjE2LjI0LjI3Ni42My4xOCAxLjE3YTgzLjIyNiA4My4yMjYgMCAwIDAtLjQ4NiAzLjE2OGMtLjEyLjk4NC0uMTkyIDEuODQ4LS4yMTYgMi41OTItLjAxMi40OC0uMDA2Ljg2NC4wMTggMS4xNTIuMDI0LjI3Ni4xMDIuNDE0LjIzNC40MTQuMTA4IDAgLjIwNC0uMTk4LjI4OC0uNTk0LjA5Ni0uNDA4LjE4Ni0xLjA2OC4yNy0xLjk4bDEuMTM0LjEwOGMtLjEyIDEuNDA0LS4zMTggMi40NTQtLjU5NCAzLjE1LS4yNjQuNjg0LS42NjYgMS4wMjYtMS4yMDYgMS4wMjYtLjU2NCAwLS45NzItLjI1Mi0xLjIyNC0uNzU2LS4yNC0uNTA0LS4zNTQtMS4xNzYtLjM0Mi0yLjAxNi4wMTItLjkuMDc4LTEuODU0LjE5OC0yLjg2Mi4xMi0xLjAyLjI4Mi0yLjE2Ni40ODYtMy40MzhIMTIuNjNBMjMuNTk4IDIzLjU5OCAwIDAgMSAxMiA4LjY0Yy4yNjQuMjUyLjUyMi41MTYuNzc0Ljc5Mi4yNTIuMjY0LjUwNC41NDYuNzU2Ljg0NlptLTguNTE0IDkuMjctMS4yNi0uNzU2YTE0LjM1OCAxNC4zNTggMCAwIDAgMS43ODItMy43NjJsMS4zNjguNDMyYy0uMjA0LjY2LS40NjIgMS4zNDQtLjc3NCAyLjA1MmExMy40MDggMTMuNDA4IDAgMCAxLTEuMTE2IDIuMDM0Wm0xMC45OTgtLjYzLTEuMzg2LjU1OGExOC45NDIgMTguOTQyIDAgMCAwLS41NTgtMi4wMTYgMjguODUgMjguODUgMCAwIDAtLjY4NC0xLjgxOGwxLjM1LS41NzZjLjI0LjU1Mi40NjggMS4xNTguNjg0IDEuODE4LjIxNi42NDguNDE0IDEuMzI2LjU5NCAyLjAzNFptLTMuMjIyLS4xMDgtMS40NC4zNzhhMTYuNDg4IDE2LjQ4OCAwIDAgMC0uMzQyLTEuOCAyNC45NTMgMjQuOTUzIDAgMCAwLS40NS0xLjY5MmwxLjQwNC0uMzZhMzAuNyAzMC43IDAgMCAxIC40NjggMS42NzRjLjE0NC41NzYuMjY0IDEuMTc2LjM2IDEuOFptLTMuMzY2LjE0NC0xLjQ1OC4xOThjMC0uNi0uMDE4LTEuMTk0LS4wNTQtMS43ODJhMjEuOTU2IDIxLjk1NiAwIDAgMC0uMTgtMS43NjRsMS40MjItLjE2MmMuMDk2LjU4OC4xNjIgMS4xNzYuMTk4IDEuNzY0LjA0OC41ODguMDcyIDEuMTcuMDcyIDEuNzQ2WiIvPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjE4LjUiIHgyPSItMi4xNzciIHkxPSIuNSIgeTI9IjYuOTA2IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agc3RvcC1jb2xvcj0iI0ZGN0I1MSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0ZGMEUwRSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjwvc3ZnPg=='); } .tags-list .item .item-icon { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: 24px; height: 24px; border-radius: var(--border-radius-xs); background-color: var(--color-dark); font-size: 16px; color: #fff; text-shadow: 0 2px 4px rgb(0 0 0/10%); } .tags-list div:nth-child(6n+1) .item .item-icon { background: #9469ff; background: linear-gradient(to bottom, #9469ff, #9aacf1); } .tags-list div:nth-child(6n+2) .item .item-icon { background: #ff3737; background: linear-gradient(to bottom, #ff3737, #ff9e9e); } .tags-list div:nth-child(6n+3) .item .item-icon { background: #FFC837; background: linear-gradient(to bottom, #FFC837, #ffc995); } .tags-list div:nth-child(6n+4) .item .item-icon { background: #4df48a; background: linear-gradient(to bottom, #4df48a, #8ad6bb); } .tags-list div:nth-child(6n+5) .item .item-icon { background: #3858F6; background: linear-gradient(to bottom, #a28fff, #3858F6); } .tags-list div:nth-child(6n+6) .item .item-icon { background: #ff6135; background: linear-gradient(to bottom, #ff6135, #ffbaa7); } /*-------------------------------------------------------------- ## Search popup --------------------------------------------------------------*/ .search-popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; pointer-events: none; opacity: 0; visibility: hidden; transition: all 0.3s ease-in-out; transform: translateY(-20px); z-index: 9999 } .search-popup.active { pointer-events: auto; opacity: 1; visibility: visible; transform: translateY(0px); } .search-popup .search-popup-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.6); opacity: 0; visibility: hidden; cursor: pointer; } @supports (((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px)))) { .search-popup .search-popup-overlay { -webkit-backdrop-filter: saturate(180%) blur(6px); backdrop-filter: saturate(180%) blur(6px) } } .search-popup.active .search-popup-overlay { opacity: 1; visibility: visible; } .search-popup .search-popup-inner { position: relative; max-width: 600px; width: 100%; margin: 10% auto 32px; opacity: 0; visibility: hidden; transition: all 0.3s ease-in-out; } .search-popup.active .search-popup-inner { opacity: 1; visibility: visible; } .search-popup .search-popup-content { position: relative; overflow: hidden; } .search-popup .search-popup-body { opacity: 0; visibility: hidden; } .search-popup .search-popup-close { position: absolute; right: 50%; bottom: 0; transform: translate(50%, 125%); } .search-tags { display: flex; flex-direction: row; flex-wrap: wrap; margin: -4px; } .search-tags li { flex-shrink: 0; padding: 4px; margin: 0 } .search-tags li a { display: flex; align-items: center; white-space: nowrap; padding: 5px 10px 5px 8px; color: var(--color-secondary); border-radius: var(--border-radius-sm); border: 1px solid var(--border-light); } .search-tags li a .category-name { display: flex; align-items: center; } .search-tags li a small { position: relative; flex-shrink: 0; margin-left: 4px; color: var(--color-muted); background-color: var(--gray-2); font-size: 10px; padding: 2px 4px; border-radius: var(--border-radius-xs); line-height: 1.2; } .search-tags li.hot a { background-color: rgb(255 38 38 / 5%); color: var(--color-danger); border-color: rgb(255 38 38 / 10%); } .search-tags li.hot small { background-color: var(--color-danger); color: #fff; } .search-tags li .category-icon { font-size: 16px; } @media (max-width: 767.98px) { .search-popup .search-popup-inner { max-width: 90%; margin: 10% auto 32px; } .search-popup.focused .search-popup-inner { max-width: 90%; } } /*-------------------------------------------------------------- popup css --------------------------------------------------------------*/ .nice-popup { position: fixed; display: flex; align-items: center; justify-content: center; left: 0; top: 0; height: 100%; width: 100%; opacity: 0; visibility: hidden; z-index: 999; overflow-x: hidden; overflow-y: auto; } .nice-popup-open { opacity: 1; visibility: visible; } .nice-popup-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.6); opacity: 0; visibility: hidden; } .nice-popup-open .nice-popup-overlay { opacity: 1; visibility: visible; pointer-events: auto; } /*-------------------------------------------------------------- popup size --------------------------------------------------------------*/ .nice-popup-content { position: relative; width: 100%; max-width: 320px; padding: 32px; background-color: #fff; border-radius: var(--border-radius-md); transform: translateY(-40px); opacity: 0; visibility: hidden; transition: all .3s ease-in-out; } .nice-popup-open .nice-popup-content { transform: translateY(0); pointer-events: auto; opacity: 1; visibility: visible; } .nice-popup-xl .nice-popup-content { max-width: 790px; } .nice-popup-lg .nice-popup-content { max-width: 750px; } .nice-popup-md .nice-popup-content { max-width: 540px; } .nice-popup-sm .nice-popup-content { max-width: 350px; padding: 24px; } @media (min-width: 768px) and (max-width: 991.98px) { .nice-popup-xl .nice-popup-content { max-width: 670px; } } @media (max-width: 767.98px) { .nice-popup-content { width: 95%; } .nice-popup-xl .nice-popup-content { height: 100vh; } } .nice-popup-header { margin-bottom: 16px; } /*-------------------------------------------------------------- hidden body --------------------------------------------------------------*/ .nice-hidden { overflow: hidden; } /*-------------------------------------------------------------- Popup close button --------------------------------------------------------------*/ .nice-popup-close { position: absolute; bottom: 0; left: 50%; width: 32px; height: 32px; z-index: 99; cursor: pointer; background-image: url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlLz48L2RlZnM+PHBhdGggZD0iTTUxMiAwQzIyOS4yIDAgMCAyMjkuMTk5OTk5IDAgNTEyYzAgMjgyLjggMjI5LjIgNTEyIDUxMiA1MTIgMjgyLjgwMDAwMSAwIDUxMi0yMjkuMiA1MTItNTEyQzEwMjQgMjI5LjE5OTk5OSA3OTQuODAwMDAxIDAgNTEyIDB6bTIxMy40NjA1MjIgNzI1Ljk3NTY1OWMtNi4wNzcyNDkgNi4wNzcyNDgtMTQuMDY0NDg4IDkuMTE1ODcyLTIyLjA1MTcyNyA5LjExNTg3Mi03Ljk4NzI0MiAwLTE2LjA2MTI5OC0zLjAzODYyNC0yMi4xMzg1NDgtOS4yMDI2OUw1MTIgNTU2LjI3MTMyMyAzNDIuNzI5NzUyIDcyNS44ODg4NDFjLTYuMDc3MjQ4IDYuMTY0MDY2LTE0LjE1MTMwNiA5LjIwMjY5LTIyLjEzODU0NiA5LjIwMjY5LTcuOTg3MjQgMC0xNS45NzQ0NzktMy4wMzg2MjQtMjIuMDUxNzI3LTkuMTE1ODcyLTEyLjI0MTMxMy0xMi4xNTQ0OTYtMTIuMjQxMzEzLTMxLjk0ODk2LS4wODY4MTgtNDQuMTkwMjczTDQ2Ny44OTY1NDYgNTExLjk5NDIzIDI5OC40NTI2NjEgMzQyLjIwMzA3NGMtMTIuMTU0NDk1LTEyLjI0MTMxMi0xMi4xNTQ0OTUtMzIuMDM1Nzc2LjA4NjgxOC00NC4xOTAyNzEgMTIuMjQxMzEzLTEyLjE1NDQ5NSAzMi4wMzU3NzctMTIuMTU0NDk1IDQ0LjE5MDI3My4wODY4MTdMNTEyIDQ2Ny43MTcxNDFsMTY5LjI3MDI0Ny0xNjkuNzA0MzM4YzEyLjE1NDQ5NS0xMi4yNDEzMTMgMzEuOTQ4OTU5LTEyLjI0MTMxMyA0NC4xOTAyNzUtLjA4NjgxOCAxMi4yNDEzMTMgMTIuMTU0NDk1IDEyLjI0MTMxMyAzMS45NDg5NTkuMDg2ODE4IDQ0LjE5MDI3Mkw1NTYuMTAzNDU0IDUxMS45OTQyMyA3MjUuNTQ3MzQgNjgxLjc4NTM4NmMxMi4xNTQ0OTUgMTIuMjQxMzEzIDEyLjE1NDQ5NSAzMi4wMzU3NzctLjA4NjgxOCA0NC4xOTAyNzN6IiBmaWxsPSIjZmZmIi8+PC9zdmc+"); background-size: contain; background-position: center; background-repeat: no-repeat; transform: translate(-50%, 125%); } /*-------------------------------------------------------------- ## Popup other style --------------------------------------------------------------*/ .wechat-share-popup .wechat-share-qrcode { margin: 0 auto; } .wechat-share-popup .wechat-share-qrcode svg { width: 150px; height: 150px; } /*-------------------------------------------------------------- ## Popup style --------------------------------------------------------------*/ .popup-tips { position: fixed; top: 0; left: 0; display: flex; justify-content: center; flex-direction: column; width: 100%; visibility: hidden; opacity: 0; } .popup-tips.is-visible { visibility: visible; opacity: 1; z-index: 999; } .popup-tips.is-visible .popup-tips-content { transform: scale(1) translateY(0px); } .popup-tips-container { max-width: 435px; margin: 32px auto 64px; } .popup-tips-content { position: relative; display: flex; justify-content: center; align-items: center; color: #fff; background-color: rgba(0, 0, 0, 0.6); padding: 14px 28px 14px 20px; cursor: auto; border-radius: 100px; box-shadow: 0 2px 15px 0 rgb(0 0 0 / 9%); transform: scale(.95) translateY(50px); transition-property: transform; transition-duration: 0.5s; } @supports ((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px))) { .popup-tips-content { background-color: rgba(0, 0, 0, 0.6); -webkit-backdrop-filter: saturate(180%) blur(6px); backdrop-filter: saturate(180%) blur(6px); } } .popup-tips .popup-tips-icon { display: flex; justify-content: center; align-items: center; font-size: 14px; width: 20px; height: 20px; margin-right: 8px; border-radius: 100px; } .popup-tips .success .popup-tips-icon { background-color: var(--color-success); } .popup-tips .popup-tips-icon { background-color: var(--color-danger); } /*-------------------------------------------------------------- fixed scroll widget --------------------------------------------------------------*/ .scroll-toolbar { position: fixed; bottom: 5%; right: 16px; z-index: 99; } .scroll-toolbar .scroll-backtotop { opacity: 0; visibility: hidden; transform: translateY(15px); transition: all 500ms ease; } .scroll-toolbar .scroll-backtotop.active { opacity: 1; visibility: visible; transform: translateY(0); } @media (min-width: 768px) and (max-width: 991.98px) { .scroll-toolbar { bottom: 10%; } } @media (min-width: 992px) and (max-width: 1199.98px) { .scroll-toolbar { bottom: 10%; } } /*-------------------------------------------------------------- ## login style --------------------------------------------------------------*/ .login-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgb(11 14 30 / 50%); z-index: 999; cursor: pointer; overflow-y: auto; visibility: hidden; opacity: 0; } @supports ((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px))) { .login-modal { background-color: rgb(11 14 30 / 50%); -webkit-backdrop-filter: saturate(180%) blur(6px); backdrop-filter: saturate(180%) blur(6px); } } .login-modal.is-visible { visibility: visible; opacity: 1; } .login-modal.is-visible .login-modal-container { transform: scale(1) translateY(0px); } .login-modal-container { position: relative; width: 96%; max-width: 435px; padding: 2rem; background: #fff; margin: 3em auto 4em; cursor: auto; border-radius: var(--border-radius-md); transform: scale(.95) translateY(50px); transition-property: transform; transition-duration: 0.3s; } .login-modal-title { font-weight: bold; } .login-modal-qrcode { max-width: 200px; padding: 5px; border: 1px solid var(--border-color); border-radius: var(--border-radius-sm); } .login-modal-tab { display: flex; } .login-modal-tab ul { display: flex; flex-direction: row; border-radius: var(--border-radius-sm); background: rgba(51, 51, 51, 0.05); padding: .25rem; } .login-modal-tab li a { display: block; padding: .25rem 1.75rem; border-radius: var(--border-radius-xs); } .login-modal-tab li.selected a { background-color: #fff; } .login-modal-others { margin-top: 2rem; } .login-modal-close { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 125%); z-index: 2; } .others-hr { position: relative; display: table; width: 100%; white-space: nowrap } .others-hr:after, .others-hr:before { content: ""; border-top: 1px solid var(--gray-2); display: table-cell; width: 50%; position: relative; top: 10px } .others-hr span { position: relative; padding: 0 15px } .wechat-login-button { background-color: #fff; border: 1px solid var(--border-light); color: var(--color-secondary) } .wechat-login-button i { color: #00d382 } .wechat-login-button:hover, .wechat-login-button:focus { border: 1px solid var(--border-light); color: var(--color-dark) } /*-------------------------------------------------------------- ## user style --------------------------------------------------------------*/ .user-menu { display: flex; flex-direction: row; flex-wrap: wrap; gap: 12px; } .user-menu a { flex-shrink: 0; } .user-menu a.active { border-color: var(--color-primary); background-color: var(--color-primary); color: #fff; } @media (max-width: 767.98px) { .user-menu { flex-wrap: nowrap; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } .user-menu::-webkit-scrollbar { display: none; } } /*-------------------------------------------------------------- ## user account style --------------------------------------------------------------*/ .user-account-edit { } .user-account-edit .item { display: flex; flex-direction: row; align-items: center; position: relative; min-width: 0; word-wrap: break-word; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--gray-2); } .user-account-edit .item:last-child { padding-bottom: 0; margin-bottom: 0; border-width: 0; } .user-account-edit .item .item-icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32px; height: 32px; font-size: 24px; } .user-account-edit .item .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; padding: 0 16px; } .user-account-edit .item .item-body { flex: 1 1 auto; } .user-account-edit .item .item-action { flex-shrink: 0; } /*-------------------------------------------------------------- ## Empty --------------------------------------------------------------*/ .empty-block .empty-icon { width: 400px; height: 300px; } .empty-block .empty-icon img { display: block; -o-object-fit: contain; object-fit: contain; width: 100%; height: 100%; } /* -------------------------------- ## Comment -------------------------------- */ .comments .card-header h2 span { font-size: 12px; padding: 1px 8px; border-radius: 20px; background-color: var(--color-primary); color: #fff; } .comment-respond { display: flex; flex-direction: row; } .comment-respond .flex-avatar { width: 36px; height: 36px; } .comment-respond .respond-input { flex: 1 1 auto; } .comment-list .comment { margin-bottom: 16px; } .comment-list .comment:last-child { margin-bottom: 0; } .comment-list .comment .comment-body { display: flex; flex-direction: row; } .comment-list .comment .comment-avatar { width: 36px; height: 36px; } .comment-list .comment .comment-inner { flex: 1 1 auto; } /* -------------------------------- ## video container -------------------------------- */ .video-container { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; margin-bottom: 24px; } .video-container iframe { width: 100%; height: 100%; border: none; } /*-------------------------------------------------------------- filter style --------------------------------------------------------------*/ .filter-block { display: flex; flex-direction: column; gap: 12px; } .filter-block .filter-item { position: relative; display: flex; flex-direction: row; gap: 0 12px; } .filter-block .filter-item .filter-title { position: relative; flex-shrink: 0; top: 4px; } .filter-block .filter-item .filter-content { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; padding-right: 30px; } .filter-block .filter-item .filter-list { display: flex; flex-direction: row; flex-wrap: wrap; gap: 4px 8px; } .filter-block .filter-item .filter-list { max-height: 30px; overflow: hidden; transition: max-height 0.3s ease; } .filter-block .filter-item .readmore-button { border: 0 !important; background-color: transparent !important; padding: 0; } .filter-block .filter-item .readmore-button.open + .filter-list { max-height: none; } .filter-block .filter-item .filter-list li { flex-shrink: 0; } .filter-block .filter-item .filter-list li a { display: block; color: var(--color-secondary); padding: 4px 8px; border-radius: var(--border-radius-xs); } .filter-block .filter-item .filter-list li a:hover, .filter-block .filter-item .filter-list li.active a { color: var(--color-primary); background-color: var(--outline-primary); } .filter-block .filter-item .brand-select { display: none; flex-direction: row; flex-wrap: wrap; gap: 4px 16px; padding: 12px 14px; margin-top: 8px; background-color: var(--gray-2); border-radius: var(--border-radius-sm); } .filter-block .filter-item .brand-select.active { display: flex; } .filter-block .filter-item .brand-select li { flex-shrink: 0; } .filter-block .filter-item .brand-select li a { display: block; color: var(--color-secondary); } .filter-block .filter-item .brand-select li:hover a, .filter-block .filter-item .brand-select li.active a { color: var(--color-primary) } .filter-block .filter-item .readmore-button { position: absolute; top: 1px; right: 0; display: none; justify-content: center; align-items: center; width: 24px; height: 24px; padding: 0; z-index: 2; transition: transform 0.3s ease; } .filter-block .filter-item .readmore-button.open { transform: rotate(180deg); } .filter-block .filter-item .readmore-button:after { content: ''; display: block; height: 6px; width: 6px; border-left: 1px solid var(--border-secondary); border-bottom: 1px solid var(--border-secondary); transform: rotate(315deg); transition: all .2s; opacity: .6; } .filter-block .filter-item .readmore-button.open:after { margin-top: -5px; } .filter-block .filter-item .readmore-button.open:after, .filter-block .filter-item .readmore-button:hover:after { border-color: var(--color-primary); opacity: 1; } /*-------------------------------------------------------------- product info style --------------------------------------------------------------*/ .post-info { position: relative; display: flex; min-width: 0; word-wrap: break-word; } .post-info .media { width: 100px; height: 100px; } .post-info.brand-info .media .media-content { padding: 4px; } @media (max-width: 767.98px) { .post-info .media { width: 80px; height: 80px; } } .post-info.brand-info .media { width: 100px; height: 100px; border: 1px solid var(--border-color) } @media (max-width: 767.98px) { .post-info.brand-info .media { width: 80px; height: 80px; } } .post-info.meeting-info .media { width: 213.333px; height: 120px; } @media (max-width: 991.98px) { .post-info.meeting-info .media { width: 100%; height: auto; } } .post-info .info-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; } .post-info .info-body { padding-right: 40px; } @media (max-width: 767.98px) { .post-info .info-body { padding-right: 0px; } } .post-info .info-actions { position: absolute; right: 0; top: 0; z-index: 2; } .info-tags { font-size: 11px; } .info-tags a { background-color: var(--outline-primary); color: var(--color-primary); padding: 1px 6px; border-radius: 24px; } .info-tags a:hover { opacity: .8; } /*-------------------------------------------------------------- post actions --------------------------------------------------------------*/ .post-actions .post-collect-button { transition: color 100ms ease; } .post-actions .post-collect-button.active { --bs-btn-active-color:var(--color-danger); --bs-btn-active-bg:var(--outline-primary); --bs-btn-active-border-color:var(--outline-primary); } .post-actions .post-collect-button.active .iconfont { -webkit-animation: icon-expand-animation 1.2s both cubic-bezier(0.45, 0.05, 0.55, 0.95); animation: icon-expand-animation 1.2s both cubic-bezier(0.45, 0.05, 0.55, 0.95); } .post-actions .post-collect-button.active .iconfont::before { content: "\e98f"; } /*-------------------------------------------------------------- product filter --------------------------------------------------------------*/ .product-filter ul { } .product-filter ul li { position: relative; } .product-filter ul li:before { content: ''; position: absolute; width: 0; height: 4px; left: 50%; bottom: 0; border-radius: 4px; background-color: var(--color-primary); transform: translate(-50%, 0%); opacity: 0; transition: all 0.3s ease-in-out; } .product-filter ul li:hover:before, .product-filter ul li.active:before { width: 30px; opacity: 1; } .product-filter ul li a { display: block; padding-bottom: 12px; } .product-filter ul li.active { } .product-filter ul li.active a { font-weight: bold; color: var(--color-primary); } /*-------------------------------------------------------------- product tab --------------------------------------------------------------*/ .tabmenu-block { display: flex; flex-direction: row; gap: 0 24px; border-bottom: 1px solid var(--border-color); } .tabmenu-block a { position: relative; padding: 0 0 12px; } .tabmenu-block a.active { font-weight: bold; color: var(--color-primary); } .tabmenu-block a:before { content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background-color: var(--color-primary); opacity: 0; } .tabmenu-block a.active:before { opacity: 1; } /*-------------------------------------------------------------- product data --------------------------------------------------------------*/ .post-data { position: relative; } .post-data .data-list { display: flex; flex-direction: column; gap: 16px; overflow: hidden; transition: max-height 0.3s ease; } .post-data .data-content { position: relative; overflow: hidden; max-height: 150px; } .post-data.open .data-content { max-height: none; } .post-data ul li { display: flex; justify-content: space-between; gap: 16px; } .post-data ul li .data-title { flex-shrink: 0; } .post-data ul li .data-desc { text-align: right; } .post-data .data-action { position: relative; display: none; background-color: #fff; z-index: 1; } .post-data .data-action:before { content: ''; position: absolute; left: 0; right: 0; bottom: 98%; height: 40px; background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0)); } .post-data.open .data-action:before { display: none; } /*-------------------------------------------------------------- product list --------------------------------------------------------------*/ .list-products .list-item .media { width: 80px; height: 80px; } .list-brands .list-item .media .media-content { padding: 4px; } .product-list .item { position: relative; display: flex; gap: 12px; min-width: 0; word-wrap: break-word; padding: 12px; border: 1px solid var(--border-light); border-radius: var(--border-radius-xs); } .product-list .item .media { width: 100px; height: 100px; } .product-list .item .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; } .product-list .item .item-body { flex: 1 1 auto; } /*-------------------------------------------------------------- left sidebar --------------------------------------------------------------*/ .sidebar-inner { position: -webkit-sticky; position: sticky; top: 0; height: calc(100vh - 120px); overflow: hidden; display: flex; flex-direction: column; -ms-scroll-chaining: none; overscroll-behavior: contain; scrollbar-width: thin; } .sidebar-inner .widget-quickmenu { position: relative; margin-top: auto; margin-bottom: 24px; } .sidebar-inner .widget-quickmenu .quick-action { display: flex; align-items: center; gap: 8px; padding: 8px 12px 8px 16px; } .sidebar-inner .widget-quickmenu .quick-action .menu-icon { display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; font-size: 20px; } .sidebar-inner .widget-quickmenu .quick-action .menu-text { flex: 1 1 auto; } .sidebar-inner .widget-quickmenu .quick-menu { position: absolute; left: 0; bottom: 125%; width: 100%; display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: var(--border-radius-sm); background: #fff; box-shadow: var(--shadow); border: 1px solid var(--gray-2); visibility: hidden; opacity: 0; transform: translateY(30px); transition: all 0.1s ease-in-out; } .sidebar-inner .widget-quickmenu .quick-menu li { padding: 0 4px; } .sidebar-inner .widget-quickmenu .quick-menu li a { position: relative; display: block; } .sidebar-inner .widget-quickmenu .quick-menu li a:after { content: '\e933'; position: absolute; right: 0; top: 50%; font-family: "iconfont"; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; transform: translate(-5px, -50%); opacity: 0; transition: all 0.1s ease-in-out; } .sidebar-inner .widget-quickmenu .quick-menu li a:hover:after { opacity: 0.4; transform: translate(0, -50%); } .sidebar-inner .widget-quickmenu.active .quick-menu { visibility: visible; opacity: 1; transform: translateY(0); } /*-------------------------------------------------------------- loader page --------------------------------------------------------------*/ .loading-more-spinners { display: flex; align-items: center; justify-content: center; height: 48px; margin-bottom: 24px; } .loading-more-spinners:before { content: ""; width: 24px; height: 24px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAAq1BMVEUAAAAuav8uav8tav8taP8taP8taP8taP8taP8taP8uaP8taP8taP8taP8taP8taP8taP8taP8taP8taP8taP8uaP8taf8taP8taP8taP8taP8taP8uaP8taP8taP8uaP8taP8taf8taP8taP8uaf8taP8uaP8taP8taP8taP8taP8taP8uaP8taP8taf8taP8taP8taP8uaP8taP8taP8taP8taP8taP8taP//mrn8AAAAOXRSTlMACwUQXVPHt05YO828i3NAbkXCkIEfFNmxhiN8L5lJJ3hi5qk2lBjy3iuhahzRnTOl7mb26uL7rdUZeLXlAAADPUlEQVR42p3Qh3KzOhDF8QMCd1ps4d5t0tzS8/5Pdlc7uhKMg8Hfz5OpOX8WUEbMEt97D8M49tqL88TBXWQST1erVUjiOH59fX9/96MMNblROJgSLnBAFdbrtV/rDjeZDkgxwHvP8/xZZaIzGI/HJQHSbk1wi3gNxrlAeB1otxc3jojGQRBwwBQ4QN9Q74lffoTf73OgcAJ/w9wBPlniT16fAqQ0QHsOtFoz/GG13/eLJ5gAfwKzp0Crgyue2pvCdcC+QIssrm5ozffEvkQhYA4w+8ViiYJkPrcFe0L87vleMdDSgUQiJ+3PCQe4oAKrZCbAUhn5+f1C7ZPIgRWcTnN7gwqsJQomLfMCvCdnGJ2TohMqsJrAsAmzT1h0gJYGLy8cIHxCy8Uf3Jl5Pu+jjgsG/4XYG/oLlFjS3syJhP6CL+z/wg6lDnofsc7OhRJdLpdcooUblnbfIRLK/qIKF11o46alebxyBnnebrcXpgqBg5vcjlmTnQDwulWFrS50UEGY+Y5IAMFWU4k+Ks3MnMyA9IeYRoRKgsfsfD672NHeNPaoQY9pTlK0R6ORabyiBklrbTY7YDXSVGaHGlK9ZRL9kS2MJGpwZzlLnJpNm0Atzzx9fn6mvyWa1uiEWpbPOTZAAtQysfNlMbBHLXKZQ4Fes6ddal5QCFx61qhmwFhOJOY96yFDDa6cWAcM1FD9lAVqcKQykdzJED/kxKhBHIjUBBZm3Wg0eqghpb1pOMjMWjmjkptl2eGQ6YYLbHnMut05Kok0zZhqZABiuyeVJ7gpMQkB4GzXpClwmyOEsA0XZGT3x+NxVXGAI0yBflDeu9qR/P7GFQEuqARxoDi93Hw4HPoVAZsQLswJR70nT/GtABUIF4QDMOehsH/6GogbAXuD/S+P13pPga9GuzzABW64ME78eLPfbDbddkWBwMoa+T0FPj/fjnN5u4A8r7DnwNvjZloS4IKLgtX1/vHjIyi9weyNMe2J3uvA97SsgGuXp+IBHPiOUF9g9zZwwh1ifgFzAAeecI/1L+8poD8BwV0ODRXgvQ684U7t7mch0MO9DmFXf0IOeLjfoX00gT7+TWff4ECAfydbU0+g2n8vuL2AqNmuhgAAAABJRU5ErkJggg==); background-size: contain; background-position: center; -webkit-animation: loader 2s linear infinite; animation: loader 2s linear infinite; } .btn .loading-more-spinners { height: 28px; margin-top: 0; margin-bottom: 0; } .btn .loading-more-spinners:before { width: 20px; height: 20px; } @-webkit-keyframes loader { 100% { transform: rotate(-360deg); } } @keyframes loader { 100% { transform: rotate(-360deg); } } /*-------------------------------------------------------------- image modal --------------------------------------------------------------*/ .modal-open { overflow: hidden; } .image-modal { position: fixed; z-index: 998; left: 0; top: 0; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.6); transition: opacity 0.3s ease; opacity: 0; visibility: hidden; } .image-modal.open { visibility: visible; opacity: 1 } .image-modal-content { background: #fff; max-width: 800px; width: 90vw; max-height: 90vh; overflow: auto; position: relative; border-radius: 8px; box-shadow: 0 4px 24px rgba(0, 0, 0, 0.18); margin: auto; top: 10%; } .image-modal-body { padding-right: 6px; max-height: 500px; overflow: hidden; overflow-y: auto; } .image-modal-body::-webkit-scrollbar { width: 6px; background-color: transparent; } .image-modal-body::-webkit-scrollbar-thumb { border-radius: 10px; background-color: var(--bg-muted); } .image-modal-body::-webkit-scrollbar-track { border-radius: 10px; background-color: var(--bg-light); } /*-------------------------------------------------------------- product banner --------------------------------------------------------------*/ .docs-banner .swiper-slide { width: 20%; } /*-------------------------------------------------------------- topics --------------------------------------------------------------*/ .topic-list { } .topic-list .item { position: relative; display: flex; flex-direction: row; gap: 12px; padding: 12px; min-width: 0; word-wrap: break-word; } .topic-list .item .item-img { width: 64px; } .topic-list .item .item-icon { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; background-color: rgba(0, 0, 0, 0.4); } .topic-list .item .item-icon:before { content: ''; position: absolute; left: 4px; top: 4px; width: 24px; height: 24px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuNjg2IDIuNTEyMDRDOS44ODE0NyAyLjUzNjM5IDEwLjA3MDIgMi41OTkwMiAxMC4yNDE1IDIuNjk2MzNDMTAuNDEyOCAyLjc5MzYzIDEwLjU2MzIgMi45MjM3MyAxMC42ODQyIDMuMDc5MTdDMTAuODA1MiAzLjIzNDYyIDEwLjg5NDQgMy40MTIzNyAxMC45NDY3IDMuNjAyMjlDMTAuOTk5IDMuNzkyMjEgMTEuMDEzNCAzLjk5MDU2IDEwLjk4OSA0LjE4NjA0TDEwLjYzNyA3LjAwMDA0SDE0LjYxM0wxNS4wMTIgMy44MTQwNEMxNS4wMzY0IDMuNjE4NTYgMTUuMDk5MSAzLjQyOTgyIDE1LjE5NjUgMy4yNTg1N0MxNS4yOTM5IDMuMDg3MzIgMTUuNDI0IDIuOTM2OTMgMTUuNTc5NSAyLjgxNTk5QzE1LjczNSAyLjY5NTA0IDE1LjkxMjggMi42MDU5IDE2LjEwMjcgMi41NTM2NkMxNi4yOTI3IDIuNTAxNDIgMTYuNDkxIDIuNDg3MTEgMTYuNjg2NSAyLjUxMTU0QzE2Ljg4MiAyLjUzNTk2IDE3LjA3MDcgMi41OTg2NSAxNy4yNDIgMi42OTYwMkMxNy40MTMyIDIuNzkzMzkgMTcuNTYzNiAyLjkyMzU0IDE3LjY4NDYgMy4wNzkwM0MxNy44MDU1IDMuMjM0NTIgMTcuODk0NiAzLjQxMjMxIDE3Ljk0NjkgMy42MDIyNUMxNy45OTkxIDMuNzkyMTkgMTguMDEzNCAzLjk5MDU2IDE3Ljk4OSA0LjE4NjA0TDE3LjYzNyA3LjAwMDA0SDIwQzIwLjM5NzggNy4wMDAwNCAyMC43Nzk0IDcuMTU4MDcgMjEuMDYwNyA3LjQzOTM4QzIxLjM0MiA3LjcyMDY4IDIxLjUgOC4xMDIyMSAyMS41IDguNTAwMDRDMjEuNSA4Ljg5Nzg2IDIxLjM0MiA5LjI3OTM5IDIxLjA2MDcgOS41NjA3QzIwLjc3OTQgOS44NDIgMjAuMzk3OCAxMCAyMCAxMEgxNy4yNjJMMTYuNzYyIDE0SDE5LjVDMTkuODk3OCAxNCAyMC4yNzk0IDE0LjE1ODEgMjAuNTYwNyAxNC40Mzk0QzIwLjg0MiAxNC43MjA3IDIxIDE1LjEwMjIgMjEgMTUuNUMyMSAxNS44OTc5IDIwLjg0MiAxNi4yNzk0IDIwLjU2MDcgMTYuNTYwN0MyMC4yNzk0IDE2Ljg0MiAxOS44OTc4IDE3IDE5LjUgMTdIMTYuMzg3TDE1Ljk4OSAyMC4xODZDMTUuOTM5NyAyMC41ODA4IDE1LjczNTUgMjAuOTM5OCAxNS40MjE1IDIxLjE4NDFDMTUuMTA3NSAyMS40Mjg0IDE0LjcwOTMgMjEuNTM3OSAxNC4zMTQ1IDIxLjQ4ODVDMTMuOTE5NyAyMS40MzkyIDEzLjU2MDcgMjEuMjM1MSAxMy4zMTY1IDIwLjkyMUMxMy4wNzIyIDIwLjYwNyAxMi45NjI3IDIwLjIwODggMTMuMDEyIDE5LjgxNEwxMy4zNjMgMTdIOS4zODhMOC45OSAyMC4xODZDOC45NjU1NyAyMC4zODE1IDguOTAyODkgMjAuNTcwMyA4LjgwNTUyIDIwLjc0MTVDOC43MDgxNCAyMC45MTI3IDguNTc4IDIxLjA2MzEgOC40MjI1MSAyMS4xODQxQzguMjY3MDEgMjEuMzA1IDguMDg5MjIgMjEuMzk0MiA3Ljg5OTI4IDIxLjQ0NjRDNy43MDkzNCAyMS40OTg2IDcuNTEwOTcgMjEuNTEzIDcuMzE1NSAyMS40ODg1QzcuMTIwMDMgMjEuNDY0MSA2LjkzMTI4IDIxLjQwMTQgNi43NjAwMyAyMS4zMDQxQzYuNTg4NzkgMjEuMjA2NyA2LjQzODQgMjEuMDc2NSA2LjMxNzQ1IDIwLjkyMUM2LjE5NjUgMjAuNzY1NiA2LjEwNzM2IDIwLjU4NzggNi4wNTUxMyAyMC4zOTc4QzYuMDAyODkgMjAuMjA3OSA1Ljk4ODU3IDIwLjAwOTUgNi4wMTMgMTkuODE0TDYuMzYzIDE3SDQuNUM0LjEwMjE4IDE3IDMuNzIwNjQgMTYuODQyIDMuNDM5MzQgMTYuNTYwN0MzLjE1ODA0IDE2LjI3OTQgMyAxNS44OTc5IDMgMTUuNUMzIDE1LjEwMjIgMy4xNTgwNCAxNC43MjA3IDMuNDM5MzQgMTQuNDM5NEMzLjcyMDY0IDE0LjE1ODEgNC4xMDIxOCAxNCA0LjUgMTRINi43MzhMNy4yMzggMTBINUM0LjYwMjE4IDEwIDQuMjIwNjQgOS44NDIgMy45MzkzNCA5LjU2MDdDMy42NTgwNCA5LjI3OTM5IDMuNSA4Ljg5Nzg2IDMuNSA4LjUwMDA0QzMuNSA4LjEwMjIxIDMuNjU4MDQgNy43MjA2OCAzLjkzOTM0IDcuNDM5MzhDNC4yMjA2NCA3LjE1ODA3IDQuNjAyMTggNy4wMDAwNCA1IDcuMDAwMDRINy42MTNMOC4wMTIgMy44MTQwNEM4LjAzNjI0IDMuNjE4NDcgOC4wOTg3NyAzLjQyOTYgOC4xOTYwMyAzLjI1ODIyQzguMjkzMjkgMy4wODY4MyA4LjQyMzM2IDIuOTM2MjkgOC41Nzg4MiAyLjgxNTE5QzguNzM0MjggMi42OTQwOSA4LjkxMjA3IDIuNjA0ODIgOS4xMDIwNSAyLjU1MjQ2QzkuMjkyMDIgMi41MDAxIDkuNDkwNDUgMi40ODU2OCA5LjY4NiAyLjUxMDA0VjIuNTEyMDRaTTEzLjc0IDE0TDE0LjI0IDEwSDEwLjI2M0w5Ljc2MyAxNEgxMy43NFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo="); } .topic-list .item .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; } .topic-list .item .item-content .item-title { flex: 1 1 auto; } .topic-list .item .item-content .item-footer { } /*-------------------------------------------------------------- topics --------------------------------------------------------------*/ .tag-header { position: relative; display: flex; flex-direction: row; gap: 16px; min-width: 0; word-wrap: break-word; } .tag-header .item-img { width: 120px; } .tag-header .item-icon { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; background-color: rgba(0, 0, 0, 0.4); } .tag-header .item-icon:before { content: ''; position: absolute; left: 12px; top: 12px; width: 32px; height: 32px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuNjg2IDIuNTEyMDRDOS44ODE0NyAyLjUzNjM5IDEwLjA3MDIgMi41OTkwMiAxMC4yNDE1IDIuNjk2MzNDMTAuNDEyOCAyLjc5MzYzIDEwLjU2MzIgMi45MjM3MyAxMC42ODQyIDMuMDc5MTdDMTAuODA1MiAzLjIzNDYyIDEwLjg5NDQgMy40MTIzNyAxMC45NDY3IDMuNjAyMjlDMTAuOTk5IDMuNzkyMjEgMTEuMDEzNCAzLjk5MDU2IDEwLjk4OSA0LjE4NjA0TDEwLjYzNyA3LjAwMDA0SDE0LjYxM0wxNS4wMTIgMy44MTQwNEMxNS4wMzY0IDMuNjE4NTYgMTUuMDk5MSAzLjQyOTgyIDE1LjE5NjUgMy4yNTg1N0MxNS4yOTM5IDMuMDg3MzIgMTUuNDI0IDIuOTM2OTMgMTUuNTc5NSAyLjgxNTk5QzE1LjczNSAyLjY5NTA0IDE1LjkxMjggMi42MDU5IDE2LjEwMjcgMi41NTM2NkMxNi4yOTI3IDIuNTAxNDIgMTYuNDkxIDIuNDg3MTEgMTYuNjg2NSAyLjUxMTU0QzE2Ljg4MiAyLjUzNTk2IDE3LjA3MDcgMi41OTg2NSAxNy4yNDIgMi42OTYwMkMxNy40MTMyIDIuNzkzMzkgMTcuNTYzNiAyLjkyMzU0IDE3LjY4NDYgMy4wNzkwM0MxNy44MDU1IDMuMjM0NTIgMTcuODk0NiAzLjQxMjMxIDE3Ljk0NjkgMy42MDIyNUMxNy45OTkxIDMuNzkyMTkgMTguMDEzNCAzLjk5MDU2IDE3Ljk4OSA0LjE4NjA0TDE3LjYzNyA3LjAwMDA0SDIwQzIwLjM5NzggNy4wMDAwNCAyMC43Nzk0IDcuMTU4MDcgMjEuMDYwNyA3LjQzOTM4QzIxLjM0MiA3LjcyMDY4IDIxLjUgOC4xMDIyMSAyMS41IDguNTAwMDRDMjEuNSA4Ljg5Nzg2IDIxLjM0MiA5LjI3OTM5IDIxLjA2MDcgOS41NjA3QzIwLjc3OTQgOS44NDIgMjAuMzk3OCAxMCAyMCAxMEgxNy4yNjJMMTYuNzYyIDE0SDE5LjVDMTkuODk3OCAxNCAyMC4yNzk0IDE0LjE1ODEgMjAuNTYwNyAxNC40Mzk0QzIwLjg0MiAxNC43MjA3IDIxIDE1LjEwMjIgMjEgMTUuNUMyMSAxNS44OTc5IDIwLjg0MiAxNi4yNzk0IDIwLjU2MDcgMTYuNTYwN0MyMC4yNzk0IDE2Ljg0MiAxOS44OTc4IDE3IDE5LjUgMTdIMTYuMzg3TDE1Ljk4OSAyMC4xODZDMTUuOTM5NyAyMC41ODA4IDE1LjczNTUgMjAuOTM5OCAxNS40MjE1IDIxLjE4NDFDMTUuMTA3NSAyMS40Mjg0IDE0LjcwOTMgMjEuNTM3OSAxNC4zMTQ1IDIxLjQ4ODVDMTMuOTE5NyAyMS40MzkyIDEzLjU2MDcgMjEuMjM1MSAxMy4zMTY1IDIwLjkyMUMxMy4wNzIyIDIwLjYwNyAxMi45NjI3IDIwLjIwODggMTMuMDEyIDE5LjgxNEwxMy4zNjMgMTdIOS4zODhMOC45OSAyMC4xODZDOC45NjU1NyAyMC4zODE1IDguOTAyODkgMjAuNTcwMyA4LjgwNTUyIDIwLjc0MTVDOC43MDgxNCAyMC45MTI3IDguNTc4IDIxLjA2MzEgOC40MjI1MSAyMS4xODQxQzguMjY3MDEgMjEuMzA1IDguMDg5MjIgMjEuMzk0MiA3Ljg5OTI4IDIxLjQ0NjRDNy43MDkzNCAyMS40OTg2IDcuNTEwOTcgMjEuNTEzIDcuMzE1NSAyMS40ODg1QzcuMTIwMDMgMjEuNDY0MSA2LjkzMTI4IDIxLjQwMTQgNi43NjAwMyAyMS4zMDQxQzYuNTg4NzkgMjEuMjA2NyA2LjQzODQgMjEuMDc2NSA2LjMxNzQ1IDIwLjkyMUM2LjE5NjUgMjAuNzY1NiA2LjEwNzM2IDIwLjU4NzggNi4wNTUxMyAyMC4zOTc4QzYuMDAyODkgMjAuMjA3OSA1Ljk4ODU3IDIwLjAwOTUgNi4wMTMgMTkuODE0TDYuMzYzIDE3SDQuNUM0LjEwMjE4IDE3IDMuNzIwNjQgMTYuODQyIDMuNDM5MzQgMTYuNTYwN0MzLjE1ODA0IDE2LjI3OTQgMyAxNS44OTc5IDMgMTUuNUMzIDE1LjEwMjIgMy4xNTgwNCAxNC43MjA3IDMuNDM5MzQgMTQuNDM5NEMzLjcyMDY0IDE0LjE1ODEgNC4xMDIxOCAxNCA0LjUgMTRINi43MzhMNy4yMzggMTBINUM0LjYwMjE4IDEwIDQuMjIwNjQgOS44NDIgMy45MzkzNCA5LjU2MDdDMy42NTgwNCA5LjI3OTM5IDMuNSA4Ljg5Nzg2IDMuNSA4LjUwMDA0QzMuNSA4LjEwMjIxIDMuNjU4MDQgNy43MjA2OCAzLjkzOTM0IDcuNDM5MzhDNC4yMjA2NCA3LjE1ODA3IDQuNjAyMTggNy4wMDAwNCA1IDcuMDAwMDRINy42MTNMOC4wMTIgMy44MTQwNEM4LjAzNjI0IDMuNjE4NDcgOC4wOTg3NyAzLjQyOTYgOC4xOTYwMyAzLjI1ODIyQzguMjkzMjkgMy4wODY4MyA4LjQyMzM2IDIuOTM2MjkgOC41Nzg4MiAyLjgxNTE5QzguNzM0MjggMi42OTQwOSA4LjkxMjA3IDIuNjA0ODIgOS4xMDIwNSAyLjU1MjQ2QzkuMjkyMDIgMi41MDAxIDkuNDkwNDUgMi40ODU2OCA5LjY4NiAyLjUxMDA0VjIuNTEyMDRaTTEzLjc0IDE0TDE0LjI0IDEwSDEwLjI2M0w5Ljc2MyAxNEgxMy43NFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo="); } .tag-header .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; } .tag-like-button { display: flex; justify-content: center; align-items: center; width: 32px; height: 32px; font-size: 24px; } .tag-like-button.active .icon-heart_line:before { content: '\e986'; color: var(--color-danger); } .tag-filter-dropdown { position: relative; } .tag-filter-dropdown.open { } .tag-filter-dropdown .filter-dropdown-action { display: flex; align-items: center; gap: 6px; font-size: 14px; background-color: #fff; padding: 8px 16px; border-radius: 8px; color: var(--color-secondary); } .tag-filter-dropdown .filter-dropdown-action:after { content: ''; display: block; position: relative; top: -1px; height: 6px; width: 6px; border-left: 1px solid var(--border-secondary); border-bottom: 1px solid var(--border-secondary); transform: rotate(315deg); transition: all .2s; opacity: .6; } .tag-filter-dropdown .filter-dropdown-action:hover { color: var(--color-dark); } .tag-filter-dropdown .filter-dropdown-action.active { color: var(--color-dark); } .tag-filter-dropdown .filter-dropdown-menu { position: absolute; right: 0; width: 160px; display: flex; flex-direction: column; gap: 4px; top: 100%; padding: 8px; background-color: #fff; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .1); border-radius: var(--border-radius-sm); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.3s ease; z-index: 99; } .tag-filter-dropdown .filter-dropdown-menu li { } .tag-filter-dropdown .filter-dropdown-menu li a { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--color-muted); padding: 8px 16px; border-radius: var(--border-radius-xs); } .tag-filter-dropdown .filter-dropdown-menu li a:hover { background-color: var(--bg-light); color: var(--color-dark); } .tag-filter-dropdown .filter-dropdown-menu li.active a { color: var(--color-dark); } .tag-filter-dropdown.open .filter-dropdown-menu { opacity: 1; visibility: visible; transform: scale(1) translateY(10px); } /*-------------------------------------------------------------- topics --------------------------------------------------------------*/ .tag-filter-list .item .item-icon { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: inherit; background-color: rgba(0, 0, 0, 0.4); } .tag-filter-list .item .item-icon:before { content: ''; position: absolute; left: 12px; top: 12px; width: 32px; height: 32px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuNjg2IDIuNTEyMDRDOS44ODE0NyAyLjUzNjM5IDEwLjA3MDIgMi41OTkwMiAxMC4yNDE1IDIuNjk2MzNDMTAuNDEyOCAyLjc5MzYzIDEwLjU2MzIgMi45MjM3MyAxMC42ODQyIDMuMDc5MTdDMTAuODA1MiAzLjIzNDYyIDEwLjg5NDQgMy40MTIzNyAxMC45NDY3IDMuNjAyMjlDMTAuOTk5IDMuNzkyMjEgMTEuMDEzNCAzLjk5MDU2IDEwLjk4OSA0LjE4NjA0TDEwLjYzNyA3LjAwMDA0SDE0LjYxM0wxNS4wMTIgMy44MTQwNEMxNS4wMzY0IDMuNjE4NTYgMTUuMDk5MSAzLjQyOTgyIDE1LjE5NjUgMy4yNTg1N0MxNS4yOTM5IDMuMDg3MzIgMTUuNDI0IDIuOTM2OTMgMTUuNTc5NSAyLjgxNTk5QzE1LjczNSAyLjY5NTA0IDE1LjkxMjggMi42MDU5IDE2LjEwMjcgMi41NTM2NkMxNi4yOTI3IDIuNTAxNDIgMTYuNDkxIDIuNDg3MTEgMTYuNjg2NSAyLjUxMTU0QzE2Ljg4MiAyLjUzNTk2IDE3LjA3MDcgMi41OTg2NSAxNy4yNDIgMi42OTYwMkMxNy40MTMyIDIuNzkzMzkgMTcuNTYzNiAyLjkyMzU0IDE3LjY4NDYgMy4wNzkwM0MxNy44MDU1IDMuMjM0NTIgMTcuODk0NiAzLjQxMjMxIDE3Ljk0NjkgMy42MDIyNUMxNy45OTkxIDMuNzkyMTkgMTguMDEzNCAzLjk5MDU2IDE3Ljk4OSA0LjE4NjA0TDE3LjYzNyA3LjAwMDA0SDIwQzIwLjM5NzggNy4wMDAwNCAyMC43Nzk0IDcuMTU4MDcgMjEuMDYwNyA3LjQzOTM4QzIxLjM0MiA3LjcyMDY4IDIxLjUgOC4xMDIyMSAyMS41IDguNTAwMDRDMjEuNSA4Ljg5Nzg2IDIxLjM0MiA5LjI3OTM5IDIxLjA2MDcgOS41NjA3QzIwLjc3OTQgOS44NDIgMjAuMzk3OCAxMCAyMCAxMEgxNy4yNjJMMTYuNzYyIDE0SDE5LjVDMTkuODk3OCAxNCAyMC4yNzk0IDE0LjE1ODEgMjAuNTYwNyAxNC40Mzk0QzIwLjg0MiAxNC43MjA3IDIxIDE1LjEwMjIgMjEgMTUuNUMyMSAxNS44OTc5IDIwLjg0MiAxNi4yNzk0IDIwLjU2MDcgMTYuNTYwN0MyMC4yNzk0IDE2Ljg0MiAxOS44OTc4IDE3IDE5LjUgMTdIMTYuMzg3TDE1Ljk4OSAyMC4xODZDMTUuOTM5NyAyMC41ODA4IDE1LjczNTUgMjAuOTM5OCAxNS40MjE1IDIxLjE4NDFDMTUuMTA3NSAyMS40Mjg0IDE0LjcwOTMgMjEuNTM3OSAxNC4zMTQ1IDIxLjQ4ODVDMTMuOTE5NyAyMS40MzkyIDEzLjU2MDcgMjEuMjM1MSAxMy4zMTY1IDIwLjkyMUMxMy4wNzIyIDIwLjYwNyAxMi45NjI3IDIwLjIwODggMTMuMDEyIDE5LjgxNEwxMy4zNjMgMTdIOS4zODhMOC45OSAyMC4xODZDOC45NjU1NyAyMC4zODE1IDguOTAyODkgMjAuNTcwMyA4LjgwNTUyIDIwLjc0MTVDOC43MDgxNCAyMC45MTI3IDguNTc4IDIxLjA2MzEgOC40MjI1MSAyMS4xODQxQzguMjY3MDEgMjEuMzA1IDguMDg5MjIgMjEuMzk0MiA3Ljg5OTI4IDIxLjQ0NjRDNy43MDkzNCAyMS40OTg2IDcuNTEwOTcgMjEuNTEzIDcuMzE1NSAyMS40ODg1QzcuMTIwMDMgMjEuNDY0MSA2LjkzMTI4IDIxLjQwMTQgNi43NjAwMyAyMS4zMDQxQzYuNTg4NzkgMjEuMjA2NyA2LjQzODQgMjEuMDc2NSA2LjMxNzQ1IDIwLjkyMUM2LjE5NjUgMjAuNzY1NiA2LjEwNzM2IDIwLjU4NzggNi4wNTUxMyAyMC4zOTc4QzYuMDAyODkgMjAuMjA3OSA1Ljk4ODU3IDIwLjAwOTUgNi4wMTMgMTkuODE0TDYuMzYzIDE3SDQuNUM0LjEwMjE4IDE3IDMuNzIwNjQgMTYuODQyIDMuNDM5MzQgMTYuNTYwN0MzLjE1ODA0IDE2LjI3OTQgMyAxNS44OTc5IDMgMTUuNUMzIDE1LjEwMjIgMy4xNTgwNCAxNC43MjA3IDMuNDM5MzQgMTQuNDM5NEMzLjcyMDY0IDE0LjE1ODEgNC4xMDIxOCAxNCA0LjUgMTRINi43MzhMNy4yMzggMTBINUM0LjYwMjE4IDEwIDQuMjIwNjQgOS44NDIgMy45MzkzNCA5LjU2MDdDMy42NTgwNCA5LjI3OTM5IDMuNSA4Ljg5Nzg2IDMuNSA4LjUwMDA0QzMuNSA4LjEwMjIxIDMuNjU4MDQgNy43MjA2OCAzLjkzOTM0IDcuNDM5MzhDNC4yMjA2NCA3LjE1ODA3IDQuNjAyMTggNy4wMDAwNCA1IDcuMDAwMDRINy42MTNMOC4wMTIgMy44MTQwNEM4LjAzNjI0IDMuNjE4NDcgOC4wOTg3NyAzLjQyOTYgOC4xOTYwMyAzLjI1ODIyQzguMjkzMjkgMy4wODY4MyA4LjQyMzM2IDIuOTM2MjkgOC41Nzg4MiAyLjgxNTE5QzguNzM0MjggMi42OTQwOSA4LjkxMjA3IDIuNjA0ODIgOS4xMDIwNSAyLjU1MjQ2QzkuMjkyMDIgMi41MDAxIDkuNDkwNDUgMi40ODU2OCA5LjY4NiAyLjUxMDA0VjIuNTEyMDRaTTEzLjc0IDE0TDE0LjI0IDEwSDEwLjI2M0w5Ljc2MyAxNEgxMy43NFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo="); } .tag-filter-list .item .item-tagname { position: absolute; bottom: 12px; left: 12px; z-index: 2; font-size: 24px; font-weight: bold; color: #fff; } @media (min-width: 768px) and (max-width: 1199.98px) { .tag-filter-list .item .item-tagname { font-size: 20px; } } @media (max-width: 767.98px) { .tag-filter-list .item .item-tagname { font-size: 18px; } } /*-------------------------------------------------------------- Texas --------------------------------------------------------------*/ @media (max-width: 767.98px) { .texas-navber .navbar-site a { font-size: 12px; } .texas-navber .navbar-site li a { padding: 8px 2px; } } .texas-banner { background-color: #fff; } .texas-banner, .texas-banner .container { position: relative; } .texas-banner .banner-content { position: relative; padding: 48px 0; max-width: 50%; z-index: 2; } .texas-banner .banner-image { position: absolute; left: 0; right: 0; bottom: 0; } .texas-banner .banner-ads { position: absolute; overflow: hidden; right: 0; top: 16px; width: 240px; z-index: 2; border-radius: 8px; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.11); } .texas-banner .banner-title { font-size: 32px; font-weight: bold; line-height: 1.5; } .texas-banner .banner-tags span { font-size: 16px; background-color: rgb(232 246 251); border: 1px solid rgba(3, 100, 120, 0.1); color: rgb(3 100 120); padding: 4px 16px; border-radius: 32px; } .texas-block-news1 .item { position: relative; display: flex; flex-direction: row; gap: 16px; min-width: 0; word-wrap: break-word; padding: 16px; border: 1px solid var(--gray-3); background-color: #fff; border-radius: var(--border-radius-md); } .texas-block-news1 .item .item-image { width: 150px; } .texas-block-news1 .item .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; padding: 4px 0; } .texas-block-news1 .item .item-body { flex: 1 1 auto; margin-bottom: 24px; } .texas-block-news1 .item .item-tag { } .texas-block-news1 .item .item-title { } .texas-block-news1 .item .item-description { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .texas-block-news1 .item .item-footer a { display: flex; align-items: center; gap: 4px; color: #1d7e91; } .texas-block-news1 .item .item-footer a:hover { opacity: 0.8; } .texas-block-news1 .item .item-footer i { position: relative; top: 1px; } .texas-block-news2 .item { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; padding: 16px; border: 1px solid var(--gray-3); background-color: #fff; border-radius: var(--border-radius-md); } .texas-block-news2 .item .item-inner { position: relative; display: flex; flex-direction: row; align-items: center; gap: 16px; min-width: 0; word-wrap: break-word; } .texas-block-news2 .item .item-image { width: 150px; height: 150px; flex-shrink: 0; } .texas-block-news2 .item .item-image .media-content img { -o-object-fit: contain; object-fit: contain; } .texas-block-news2 .item .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; } .texas-block-news2 .item .item-body { flex: 1 1 auto; } .texas-block-news2 .item .item-tag span { background-color: #035c77; color: #fff; border-radius: 4px; padding: 4px 16px; } .texas-block-news2 .item .item-footer a { border: 1px solid var(--color-dark); color: #035c77; border-radius: 4px; display: block; text-align: center; color: var(--color-dark); padding: 4px; } .texas-block-news2 .item .item-footer a:hover { color: #035c77; border: 1px solid #035c77; } .texas-block-news2 .item .item-description ul { padding-left: 18px; } .texas-block-news2 .item .item-description ul li { list-style: disc; padding: 2px 0; font-size: 12px; } @media (max-width: 767.98px) { .texas-banner { position: relative; overflow: hidden; padding: 24px 0; } .texas-banner .banner-content { width: 100%; max-width: 100%; padding: 0; padding-bottom: 150px; text-align: center; } .texas-banner .banner-image { width: 700px; left: auto; } .texas-banner .banner-image img { width: 100%; } .texas-banner .banner-title { font-size: 20px; line-height: 1.4; } .texas-banner .banner-buttons, .texas-banner .banner-tags { justify-content: center } .texas-block-news1 .item .item-image { width: 120px; } .texas-block-news2 .item .item-image { width: 120px; height: 120px; flex-shrink: 0; } .texas-banner .banner-ads { width: 160px; left: 24px; bottom: 12px; top: auto; } } @media (min-width: 768px) and (max-width: 991.98px) { .texas-banner { position: relative; overflow: hidden; padding: 24px 0; } .texas-banner .banner-content { max-width: 100%; padding-bottom: 250px; text-align: center; } .texas-banner .banner-image { width: 1100px; left: auto; } .texas-banner .banner-image img { width: 100%; } .texas-banner .banner-title { font-size: 24px; line-height: 1.4; } .texas-banner .banner-buttons, .texas-banner .banner-tags { justify-content: center } .texas-block-news1 .item .item-image { width: 120px; } .texas-block-news2 .item .item-image { width: 120px; height: 120px; flex-shrink: 0; } .texas-banner .banner-ads { width: 200px; left: 24px; bottom: 12px; top: auto; } } @media (min-width: 992px) and (max-width: 1199.98px) { .texas-banner .banner-title { font-size: 24px; line-height: 1.4; } .texas-banner .banner-content { max-width: 80%; } .texas-banner .banner-image { left: 0; } .texas-block-news1 .item .item-image { width: 120px; } .texas-block-news2 .item .item-image { width: 120px; height: 120px; flex-shrink: 0; } .texas-banner .banner-ads { width: 180px; } } @media (min-width: 1200px) and (max-width: 1399.98px) { .texas-banner .banner-content { max-width: 60%; } .texas-block-news1 .item .item-image { width: 120px; } .texas-block-news2 .item .item-image { width: 120px; height: 120px; flex-shrink: 0; } .texas-banner .banner-ads { width: 200px; } } /** cosy style 2026**/ @media (min-width: 992px) { .py-lg-36 { padding: 40px 0 !important; } } @media (min-width: 1400px) { .post-wrapper { width: 71%; } .site-sidebar { width: 29%; } } /*-------------------------------------------------------------- Navbar style --------------------------------------------------------------*/ .site-navbar { width: 100%; background-color: #fff; box-shadow: 0 5px 20px 0 rgb(17 58 93 / 5%); transition: all 0.3s ease-in-out; z-index: 99; } .site-navbar.fixed { position: fixed; top: 0; left: 0; right: 0; padding-top: 4px; padding-bottom: 4px; background-color: rgba(255, 255, 255, 0.8); -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; } .site-navbar.fixed-top { position: fixed; left: 0; right: 0; padding-top: 16px; padding-bottom: 16px; background-color: transparent; box-shadow: none; } .site-navbar.fixed-top.fixed { padding-top: 8px; padding-bottom: 8px; background-color: rgb(0 0 0 / 80%); } @supports (((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px)))) { .site-navbar.fixed { background-color: rgba(255, 255, 255, 0.6); -webkit-backdrop-filter: saturate(180%) blur(6px); backdrop-filter: saturate(180%) blur(6px); } } @supports (((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px)))) { } /*-------------------------------------------------------------- Navbar brand --------------------------------------------------------------*/ .site-navbar .navbar-brand { position: relative; padding: 0; margin: 0; } .site-navbar .navbar-brand .logo { max-width: 200px; max-height: 50px; } .site-navbar .navbar-brand .logo-night { display: none; } .site-navbar.fixed-top .navbar-brand .logo { display: none; } .site-navbar.fixed-top .navbar-brand .logo-night { display: block; } @media (max-width: 767.98px) { .site-navbar .navbar-brand { padding: 0; margin: 0; } .site-navbar .navbar-brand .logo { max-width: 165px; max-height: 40px; } } @media (min-width: 768px) and (max-width: 991.98px) { .site-navbar .navbar-brand { margin: 0; } .site-navbar .navbar-brand .logo { max-width: 165px; max-height: 40px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .site-navbar .navbar-brand { margin: 0; } } /*-------------------------------------------------------------- Navbar slogan --------------------------------------------------------------*/ .site-navbar .navbar-slogan { position: relative; height: 50px; margin-right: auto; } .site-navbar .navbar-slogan::after { background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.2)); content: ""; position: absolute; display: block; width: 25%; height: 100%; top: 0; left: -75%; z-index: 2; transform: skewX(-25deg); pointer-events: none; -webkit-animation: shine 1s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955); animation: shine 1s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955); } .site-navbar .navbar-slogan img { width: inherit; height: inherit; -o-object-fit: cover; object-fit: cover; } .site-navbar.fixed .navbar-slogan::after { display: none; } @media (max-width: 767.98px) { .site-navbar .navbar-slogan { height: 40px; } } @-webkit-keyframes shine { 0% { left: -75%; } 100% { left: 125%; } } @keyframes shine { 0% { left: -75%; } 100% { left: 125%; } } /*-------------------------------------------------------------- ## Main Navigation ----------------------------------------------------------------*/ .navbar-site { flex-wrap: nowrap; gap: 12px; } .navbar-site li { position: relative; flex-shrink: 0; } .navbar-site li a { display: block; font-size: 16px; padding: 12px 8px; } .navbar-site > li a { opacity: .7; } .navbar-site > li:hover > a, .navbar-site > li.current-menu-parent > a, .navbar-site > li.current-menu-item > a { color: var(--color-primary); opacity: 1; } .fixed-top .navbar-site > li > a { color: #fff; } /* Submenu */ .navbar-site li ul.sub-menu { position: absolute; left: 0; top: 100%; min-width: 200px; text-align: left; padding: 10px 0; opacity: 0; visibility: hidden; background: #fff; box-shadow: 0 0 15px rgb(0 0 0 / 7%); border-radius: var(--border-radius-md); transform: translateY(-10px); transition: all 300ms ease; z-index: 100; } .navbar-site li:last-child ul.sub-menu { left: auto; right: -10px; } .navbar-site li ul.sub-menu li { display: block; position: relative; } .navbar-site li ul.sub-menu li:last-child { margin-bottom: 0; } .navbar-site li ul.sub-menu li a { position: relative; display: block; padding: 10px 18px; transition: all 0.3s ease-in; z-index: 1; } .navbar-site li ul.sub-menu li > a:hover, .navbar-site li ul.sub-menu li.current-menu-item > a { color: var(--color-primary); opacity: 1; } .navbar-site li:hover ul.sub-menu { opacity: 1; visibility: visible; transform: scale(1) translateY(0px); } .navbar-site li ul.sub-menu .sub-menu { position: absolute; left: 99%; top: 0; background: #fff; transition: 0.5s; transition-delay: 0.1s; transform: translateY(10px); pointer-events: none; visibility: hidden; opacity: 0; z-index: 999; } .navbar-site li ul.sub-menu li:hover > .sub-menu { visibility: visible; opacity: 1; transform: translate(0, -10px); transition-delay: 0s; pointer-events: all; } .navbar-site li:last-child ul.sub-menu .sub-menu { left: auto; right: 99%; } /*-------------------------------------------------------------- ## site submenu icon Navigation ----------------------------------------------------------------*/ .navbar-site li.menu-item-has-children > a:after { content: ''; position: absolute; top: 50%; right: -6px; height: 6px; width: 6px; border-left: 1px solid var(--border-secondary); border-bottom: 1px solid var(--border-secondary); transform: translate(-50%, -50%) rotate(315deg); opacity: 0.3; transition: all 0.2s; } .site-navbar.fixed-top .navbar-site li.menu-item-has-children > a:after { border-left: 1px solid #fff; border-bottom: 1px solid #fff; } .navbar-site li.menu-item-has-children > a:hover:after { transform: translate(-50%, -50%) rotate(135deg); } .navbar-site li ul.sub-menu li.menu-item-has-children > a:after { right: 12px; } .navbar-site li ul.sub-menu li.menu-item-has-children > a:after { transform: translate(-50%, -50%) rotate(315deg); } .navbar-site li ul.sub-menu li.menu-item-has-children > a:hover:after, .navbar-site li ul.sub-menu li.menu-item-has-children > a:hover:after { transform: translate(-50%, -50%) rotate(225deg); } .fixed-top .navbar-submenu .btn-link { --bs-btn-color: rgba(255, 255, 255, 0.5); --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff; } /*-------------------------------------------------------------- Site main style --------------------------------------------------------------*/ .site-main.format-image { margin-top: -100px; } @media (max-width: 767.98px) { .site-main.format-image { margin-top: -50px; } } /*-------------------------------------------------------------- List topic style --------------------------------------------------------------*/ .list-topic .list-item .list-title { position: relative; color: #fff; padding: 0 28px; display: inline-block; } .list-topic .list-item .list-title::after, .list-topic .list-item .list-title::before { content: ""; position: absolute; display: inline-block; top: 50%; width: 12px; height: 1px; background: var(--bg-light); transition: 0.3s ease-out; transform: translate(0%, 0%); z-index: 1; opacity: 0; } .list-topic .list-item .list-title::before { left: 0; } .list-topic .list-item .list-title::after { right: 0; } .list-topic .list-item:hover .list-title::after { right: 8px; opacity: 1; transform: translate(0%, -50%); } .list-topic .list-item:hover .list-title::before { left: 8px; opacity: 1; transform: translate(0%, -50%); } /*-------------------------------------------------------------- Special poster style --------------------------------------------------------------*/ .special-poster { position: relative; overflow: hidden; display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; align-items: center; height: 350px; } .special-inner { position: relative; text-align: center; text-shadow: 0 2px 5px rgb(0 0 0 / 30%); } .special-data { position: absolute; left: 50%; top: 50%; font-size: 10em; font-style: italic; line-height: 1; color: #fff; opacity: 0.3; white-space: nowrap; transform: translate(-50%, -50%); } .special-round { position: absolute; width: 50vh; height: 50vh; top: 50%; left: 50%; opacity: 0.08; border-radius: 50%; transform: translate(-50%, -50%); border: 5em solid #fff; display: none; } @media (max-width: 767.98px) { .special-poster { height: 160px; } .special-data { font-size: 5em; } } @media (min-width: 768px) and (max-width: 1199.98px) { .special-poster { height: 240px; } .special-data { font-size: 8em; } } /*-------------------------------------------------------------- Aside mobile --------------------------------------------------------------*/ .aside-mobile { position: fixed; left: 0; top: 0; bottom: 0; display: flex; flex-direction: column; width: 320px; transition: all 0.2s ease-in-out; z-index: 999; transform: translateX(-100%); background-color: var(--color-secondary); } .aside-overlay { position: fixed; left: 0; top: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.8); z-index: 998; opacity: 0; visibility: hidden; } .hidden-wrapper { overflow: hidden; } .hidden-wrapper .aside-overlay { opacity: 1; visibility: visible; } .hidden-wrapper .aside-mobile { transform: translateX(0%); } @media (max-width: 767.98px) { .aside-mobile { width: 288px; } } /*-------------------------------------------------------------- Aside menu --------------------------------------------------------------*/ .aside-mobile .aside-inner { display: flex; flex-direction: column; height: 100%; overflow: auto; } .aside-mobile .aside-body { display: flex; flex-direction: column; height: 100%; overflow: auto; } .aside-mobile .aside-menu { padding: 0 16px; } .aside-mobile .aside-menu li { position: relative; } .aside-mobile .aside-menu > li { margin: 16px 0; background-color: var(--bg-light); border-radius: var(--border-radius-sm); } .aside-mobile .aside-menu > li > a:hover, .aside-mobile .aside-menu > li.current-menu-item > a, .aside-mobile .aside-menu > li.active > a { color: var(--color-primary); } .aside-mobile .aside-menu li a { position: relative; display: block; padding: 14px 16px; transition: all 0.3s; } .aside-mobile .aside-menu li a:hover { opacity: 1; } .aside-mobile .aside-menu > li.current-menu-item > a { color: var(--color-primary); opacity: 1; } .aside-mobile .aside-menu > li > ul { display: none; padding: 4px 0 0; } .aside-mobile .aside-menu > li.current-menu-parent > ul { display: block; } .aside-mobile .aside-menu li > ul li { padding-top: 0; padding-bottom: 0; } .aside-mobile .aside-menu li > ul li a { padding: 0 16px 16px; } .aside-mobile .aside-menu li > ul li.current-menu-item a { color: var(--color-primary); opacity: 1; } .aside-mobile .aside-menu li a .menu-sign { position: absolute; right: 15px; top: 50%; height: 8px; width: 8px; margin-top: -4px; opacity: 0.5; } .aside-mobile .aside-menu li a .menu-sign:after { content: ""; display: block; height: 8px; width: 8px; border-left: 1px solid var(--color-dark); border-bottom: 1px solid var(--color-dark); transform: rotate(225deg); transition: all 0.2s; } .aside-mobile .aside-menu li.active a .menu-sign { margin-top: -6px; } .aside-mobile .aside-menu li.active a .menu-sign:after { transform: rotate(315deg); } /*-------------------------------------------------------------- Post tags style --------------------------------------------------------------*/ .post-tags { display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px; } .post-tags a:before { content: ''; display: block; position: absolute; left: 6px; top: 5px; width: 18px; height: 18px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGlkPSLlm77lsYJfMSIgeD0iMCIgeT0iMCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjAwIDIwMCIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjAwIDIwMCI+PHN0eWxlPi5zdDF7ZmlsbDojZmZmfTwvc3R5bGU+PGNpcmNsZSBjeD0iMTAwIiBjeT0iMTAwIiByPSI5OSIgc3R5bGU9ImZpbGw6I2ZmNTIyYiIvPjxwYXRoIGQ9Ik0xNTYuMyA3MC44YzEuNCAwIDIuNiAxLjMgMi43IDN2MTIuN2MwIDEuNy0xLjEgMy0yLjYgMy4xSDUwLjZjLTEuNCAwLTIuNi0xLjMtMi43LTNWNzMuOGMwLTEuNyAxLjEtMyAyLjYtMy4xaDEwNS44em0tLjIgMzcuN2MxLjYgMCAyLjggMS4zIDIuOSAzdjEyLjdjMCAxLjctMS4yIDMtMi44IDMuMUg0MS45Yy0xLjYgMC0yLjgtMS4zLTIuOS0yLjl2LTEyLjdjMC0xLjcgMS4yLTMgMi44LTMuMWwxMTQuMy0uMXoiIGNsYXNzPSJzdDEiLz48cGF0aCBkPSJNNzUuOCA0Ny4xYy4xLTEuNCAxLjYtMi42IDMuMi0yLjdoMTIuN2MxLjcgMCAyLjkgMS4xIDIuOSAyLjZsLTkuOSAxMDUuOGMtLjEgMS40LTEuNSAyLjYtMy4yIDIuN0g2OC44Yy0xLjcgMC0yLjktMS4xLTIuOS0yLjZsOS45LTEwNS44em0zOC4xLTQuMmMuMS0xLjYgMS42LTIuOCAzLjItMi45aDEyLjdjMS43IDAgMi45IDEuMiAyLjkgMi44TDEyMiAxNTcuMWMtLjEgMS42LTEuNiAyLjgtMy4yIDIuOWgtMTIuN2MtMS43IDAtMi45LTEuMi0yLjktMi44bDEwLjctMTE0LjN6IiBjbGFzcz0ic3QxIi8+PC9zdmc+'); z-index: 1; } .post-tags a { position: relative; display: block; font-size: 13px; color: var(--color-muted); padding: 4px 14px 4px 30px; background-color: var(--bg-light); border-radius: 100px; white-space: nowrap; } .post-tags a:hover { color: var(--color-primary); } /**-------------------------------------------------------------- Post hidden tips --------------------------------------------------------------**/ .post-pay-content { position: relative; } .post-pay-body { position: relative; overflow: hidden; z-index: 1 } .post-pay-content .post-pay-wall { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 80px; transform: translateY(-99%); background-image: linear-gradient(360deg, #ffffff 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.4) 75%, rgba(255, 255, 255, 0) 100%); z-index: 1; } .post-pay-content .post-pay-body { position: relative; display: flex; align-items: center; justify-content: space-between; border: 2px solid var(--border-light); border-radius: var(--border-radius-sm); z-index: 2 } .post-pay-content.paying { margin-top: -30px } .post-pay-content .post-pay-form { position: relative; display: flex; background: #fff; border-radius: 100px; padding: 5px; } .post-pay-content .post-pay-input { border-color: transparent; background-color: transparent; color: var(--color-secondary); border-radius: var(--border-radius-sm); } .post-pay-content .post-pay-submit { flex-shrink: 0; } /*-------------------------------------------------------------- Post password form --------------------------------------------------------------*/ .post-password-form form { max-width: 400px; margin: 0 auto; } /*-------------------------------------------------------------- List Teleplay --------------------------------------------------------------*/ .video-list-cover { position: relative; overflow: hidden; } .video-list-inner { position: relative; display: flex; word-wrap: break-word; flex-direction: row; padding: 20px; border-radius: inherit; } .video-list-cover .bg-poster { -webkit-filter: blur(15px); filter: blur(15px); transform: scale(1.15); } .video-list-inner .media { width: 110px; } .video-list-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; color: #fff; padding: 4px 0 4px 24px; } .video-list-body { flex: 1 1 auto; } .video-list-group { position: relative; border: 1px solid var(--border-muted); border-radius: var(--border-radius-sm); } .video-list-group .item-video-group { position: relative; padding: 12px 16px; border-bottom: 1px solid var(--border-muted); } .video-list-group .item-video-group:last-child { border-bottom: 0; } @media (max-width: 767.98px) { .video-list-inner .media { width: 85px; } .video-list-inner { padding: 16px; } .video-list-content { padding: 4px 0 4px 16px; } .video-list-group .item-video-group { position: relative; padding: 10px 12px; border-bottom: 1px solid var(--border-muted); } } /*-------------------------------------------------------------- ## post sticky --------------------------------------------------------------*/ .sticky-actions { transform: translateX(-84px); z-index: 98; } .sticky-actions.sticky { position: -webkit-sticky; position: sticky; top: 0; } @media (max-width: 1365.98px) { .sticky-actions { display: none; } } @media (min-width: 1366px) and (max-width: 1599.98px) { .sticky-actions { transform: translateX(-80px); } } .sticky-actions ul { position: absolute; display: flex; flex-direction: column; transform: translateY(20px); transition: all 0.3s ease-in-out; } .sticky-actions.sticky ul { transform: translateY(100px); } /*-------------------------------------------------------------- Archive header style --------------------------------------------------------------*/ .archive-poster { position: relative; overflow: hidden; display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; align-items: center; min-height: 280px; } .archive-poster .poster-inner { position: relative; width: 100%; text-align: center; z-index: 2; } .archive-poster .poster-title { position: relative; display: flex; align-items: center; justify-content: center; text-transform: uppercase; } .svg-icon-tag { display: inline-block; position: relative; top: 1px; width: 32px; height: 32px; margin-right: 8px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGlkPSLlm77lsYJfMSIgeD0iMCIgeT0iMCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjAwIDIwMCIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjAwIDIwMCI+PHN0eWxlPi5zdDF7ZmlsbDojZmZmfTwvc3R5bGU+PGNpcmNsZSBjeD0iMTAwIiBjeT0iMTAwIiByPSI5OSIgc3R5bGU9ImZpbGw6I2ZmNTIyYiIvPjxwYXRoIGQ9Ik0xNTYuMyA3MC44YzEuNCAwIDIuNiAxLjMgMi43IDN2MTIuN2MwIDEuNy0xLjEgMy0yLjYgMy4xSDUwLjZjLTEuNCAwLTIuNi0xLjMtMi43LTNWNzMuOGMwLTEuNyAxLjEtMyAyLjYtMy4xaDEwNS44em0tLjIgMzcuN2MxLjYgMCAyLjggMS4zIDIuOSAzdjEyLjdjMCAxLjctMS4yIDMtMi44IDMuMUg0MS45Yy0xLjYgMC0yLjgtMS4zLTIuOS0yLjl2LTEyLjdjMC0xLjcgMS4yLTMgMi44LTMuMWwxMTQuMy0uMXoiIGNsYXNzPSJzdDEiLz48cGF0aCBkPSJNNzUuOCA0Ny4xYy4xLTEuNCAxLjYtMi42IDMuMi0yLjdoMTIuN2MxLjcgMCAyLjkgMS4xIDIuOSAyLjZsLTkuOSAxMDUuOGMtLjEgMS40LTEuNSAyLjYtMy4yIDIuN0g2OC44Yy0xLjcgMC0yLjktMS4xLTIuOS0yLjZsOS45LTEwNS44em0zOC4xLTQuMmMuMS0xLjYgMS42LTIuOCAzLjItMi45aDEyLjdjMS43IDAgMi45IDEuMiAyLjkgMi44TDEyMiAxNTcuMWMtLjEgMS42LTEuNiAyLjgtMy4yIDIuOWgtMTIuN2MtMS43IDAtMi45LTEuMi0yLjktMi44bDEwLjctMTE0LjN6IiBjbGFzcz0ic3QxIi8+PC9zdmc+'); } .svg-icon-cat { display: inline-block; position: relative; width: 32px; height: 32px; margin-right: 8px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDIwMCAyMDAiIHZpZXdCb3g9IjAgMCAyMDAgMjAwIj48Y2lyY2xlIGN4PSIxMDAiIGN5PSIxMDAiIHI9Ijk5IiBzdHlsZT0iZmlsbDojZmYzZDI4Ii8+PHBhdGggZD0iTTEyNS40IDQ1SDc0LjZjLTE0IDAtMjUuNCAxMS40LTI1LjQgMjUuNHY1OS4yYzAgMTQgMTEuNCAyNS40IDI1LjQgMjUuNGg1MC44YzE0IDAgMjUuNC0xMS40IDI1LjQtMjUuNFY3MC40YzAtMTQtMTEuNC0yNS40LTI1LjQtMjUuNHptLTE0LjMgNjRjMCAyLjMtMS45IDQuMi00LjIgNC4ySDcyLjhjLTIuMyAwLTQuMi0xLjktNC4yLTQuMnYtOC41YzAtMi4zIDEuOS00LjIgNC4yLTQuMmgzNC4xYzIuMyAwIDQuMiAxLjkgNC4yIDQuMnY4LjV6bTIwLjYtMjYuNWMwIDIuMy0xLjkgNC4yLTQuMiA0LjJINzIuNmMtMi4zIDAtNC4yLTEuOS00LjItNC4yVjc0YzAtMi4zIDEuOS00LjIgNC4yLTQuMmg1NC45YzIuMyAwIDQuMiAxLjkgNC4yIDQuMnY4LjV6IiBzdHlsZT0iZmlsbDojZmZmIi8+PC9zdmc+'); } @media (max-width: 767.98px) { .archive-poster { min-height: 160px; } .svg-icon-tag { top: 1px; width: 24px; height: 24px; } .svg-icon-cat { width: 24px; height: 24px; } } @media (min-width: 768px) and (max-width: 1199.98px) { .archive-poster { min-height: 240px; } } /*-------------------------------------------------------------- Archive heading --------------------------------------------------------------*/ .archive-heading h1 { display: flex; justify-content: center; align-items: center; } /*-------------------------------------------------------------- Archive filter --------------------------------------------------------------*/ .archive-filter .filter-list { position: relative; display: flex; flex-direction: row; } .archive-filter .filter-list .filter-heading { position: relative; top: 3px; flex-shrink: 0; min-width: 100px; } .archive-filter .filter-list ul { position: relative; display: flex; flex-wrap: wrap; flex: 1 1 auto; gap: 12px; margin-bottom: 14px; } .archive-filter .filter-list:last-child ul { margin-bottom: 0; } .archive-filter .filter-list ul li a { display: block; padding: 4px 12px; border-radius: var(--border-radius-sm); } .archive-filter .filter-list ul li a:hover, .archive-filter .filter-list ul li.current a { color: var(--color-primary); background-color: var(--outline-primary); opacity: 1; } @media (max-width: 767.98px) { .archive-filter { margin: 0 0 16px; } .archive-filter .filter-list { flex-direction: column; border: 1px solid var(--border-light); border-radius: var(--border-radius-sm); padding: 18px 12px 12px; margin-bottom: 16px; } .archive-filter .filter-list:last-child { margin: 0; } .archive-filter .filter-list .filter-heading { position: absolute; top: 0; left: 0; flex-shrink: 0; min-width: auto; font-size: 12px; background-color: #fff; padding: 0 4px; margin: 0; transform: translate(12px, -50%); } .archive-filter .filter-list ul { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; } } @media (min-width: 768px) and (max-width: 991.98px) { .archive-filter { margin: 0 0 24px; } } /*-------------------------------------------------------------- Format image style --------------------------------------------------------------*/ .post-poster { position: relative; } .post-poster .media:after { padding-top: 30%; } .post-format-image { position: relative; z-index: 1; } @media (max-width: 767.98px) { .post-poster .media:after { padding-top: 75%; } } .post-poster .bg-image-color { opacity: 0.9; } .post-poster .bg-image-cover { opacity: 0.2; -webkit-filter: blur(15px); filter: blur(15px); transform: scale(1.25); } .post-poster.bg-dark, .post-poster.bg-dark h1, .post-poster.bg-dark a { text-align: center; color: #fff; margin: auto; } @media (max-width: 767.98px) { .post-poster .media:after { padding-top: 50%; } .post-format-image { margin: -32px 0 0; } } @media (min-width: 768px) and (max-width: 991.98px) { .post-poster .media:after { padding-top: 45%; } .post-format-image { margin: -80px 0 0; } } @media (min-width: 992px) and (max-width: 1199.98px) { .post-poster .media:after { padding-top: 40%; } .post-format-image { margin: -96px 0 0; } } @media (min-width: 1200px) and (max-width: 1399.98px) { .post-poster .media:after { padding-top: 40%; } .post-format-image { margin: -96px 0 0; } } @media (min-width: 1400px) { .post-poster .media:after { padding-top: 30%; } .post-format-image { margin: -96px 0 0; } } /*-------------------------------------------------------------- Post --------------------------------------------------------------*/ .post-content { font-size: 16px; line-height: 1.85; word-break: normal; word-wrap: break-word; } .post-content > *:first-child { margin-top: 0; } .post-content > *:last-child { margin-bottom: 0; } .post-content a:hover, .post-content a:focus { text-decoration: none; } .post-content p { margin: 0 0 20px; } .post-content hr { margin: 64px auto; } .post-content > .wp-block-cover.alignwide:first-child, .post-content > .wp-block-cover.alignfull:first-child { margin-top: 0; } /* Font Families ----------------------------- */ .post-content h1, .post-content h2, .post-content h3 { line-height: 1.5; margin: 32px 0 24px; color: var(--color-dark); } .post-content h4, .post-content h5, .post-content h6 { margin: 32px 0 24px; } .post-content h2 { position: relative; padding: 0 0 0 24px; } .post-content h2:before { content: ""; position: absolute; left: 0; top: 6px; width: 6px; height: 24px; border-radius: 10px; background: var(--color-primary); } .post-inner .post-content > .wp-block-cover.alignwide:first-child, .post-inner .post-content > .wp-block-cover.alignfull:first-child { margin-top: 0; } @media (max-width: 767.98px) { .post-content h1, .post-content h2, .post-content h3 { margin: 32px auto 16px; } .post-content h4, .post-content h5, .post-content h6 { margin: 32px auto 16px; } .post-content h2:before { top: 5px; height: 20px; } } @media (min-width: 768px) and (max-width: 991.98px) { .post-content h1, .post-content h2, .post-content h3 { margin: 16px auto 16px; } .post-content h4, .post-content h5, .post-content h6 { margin: 16px auto 16px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .post-content h1, .post-content h2, .post-content h3 { margin: 24px auto 16px; } .post-content h4, .post-content h5, .post-content h6 { margin: 24px auto 16px; } } /* Font link ----------------------------- */ .post-content p > a, .post-content li > a, .post-content dd > a, .post-content td a, .post-content th a, .post-content h1 a, .post-content h2 a, .post-content h3 a, .post-content h4 a, .post-content h5 a, .post-content h6 a, .post-content em a, .post-content strong a { box-shadow: 0 -1px 0 0 var(--color-primary) inset; transition: 0.3s ease-in; } .post-content p > a:hover, .post-content li > a:hover, .post-content dd > a:hover, .post-content td a:hover, .post-content th a:hover, .post-content h1 a:hover, .post-content h2 a:hover, .post-content h3 a:hover, .post-content h4 a:hover, .post-content h5 a:hover, .post-content h6 a:hover, .post-content em a:hover, .post-content strong a:hover { opacity: 1; } /* Post quote style ----------------------------- */ .wp-block-quote a, .wp-block-quote p > a { border-color: var(--border-muted); } .wp-block-quote a, .wp-block-quote a:hover { color: inherit; } /* Alignment Classes ------------------------- */ .post-content .alignnone, .wp-block-image, .wp-block-embed { margin: 24px 0 } .alignright, a img.alignright, .wp-block-image .alignright { float: right; margin: 4px 0 20px 30px } .alignleft, a img.alignleft, .wp-block-image .alignleft { float: left; margin: 4px 30px 20px 0 } .aligncenter, div.aligncenter { display: block; margin: 40px auto } .aligncenter > img, div.aligncenter > img { margin: 0 auto } p img.alignnone, img.alignnone { display: block; margin: 40px 0 } /*-------------------------------------------------------------- Ul - style --------------------------------------------------------------*/ .post-content ul, .post-content ol { padding: 0 0 0 20px; margin-bottom: 24px; } .post-content ul { list-style: disc; } .post-content ul ul, .post-content ol ol, .post-content ul ol, .post-content ol ul { margin-bottom: 16px; } .post-content ul ul { list-style: circle; margin: 12px 0; } .post-content ul ul ul { list-style: square; } .post-content ol { list-style: decimal; } .post-content ol ol { list-style: lower-alpha; } .post-content ol ol ol { list-style: lower-roman; } .post-content li { line-height: 1.5; margin: 0 0 16px; } .post-content li li { margin: 0 0 8px; } .post-content li img { display: inline-block; } /*-------------------------------------------------------------- block table style --------------------------------------------------------------*/ @media (min-width: 768px) { .post-content table { min-width: 540px; } } .wp-block-table th, .wp-block-table td { border-color: var(--border-muted); } .wp-block-table tfoot, .wp-block-table thead { border-color: var(--border-muted); } .wp-block-table.aligncenter, .wp-block-table.alignleft, .wp-block-table.alignright { display: table; width: auto; } .wp-block-table.aligncenter td, .wp-block-table.aligncenter th, .wp-block-table.alignleft td, .wp-block-table.alignleft th, .wp-block-table.alignright td, .wp-block-table.alignright th { word-break: break-word; } .wp-block-table.is-style-stripes { border-bottom: 0; } .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: var(--bg-light); } .wp-block-table.is-style-stripes td, .wp-block-table.is-style-stripes th { border-color: transparent; } /*-------------------------------------------------------------- wp caption style --------------------------------------------------------------*/ .wp-caption { max-width: 100%; } /*-------------------------------------------------------------- ## Post video style --------------------------------------------------------------*/ .post-video .wp-video { margin-top: 0; } /*-------------------------------------------------------------- ## thumbnail style --------------------------------------------------------------*/ .post-thumbnail img { width: 100%; height: auto; } /*-------------------------------------------------------------- ## Post excerpt --------------------------------------------------------------*/ .post-excerpt { position: relative; font-size: 16px; line-height: 1.85; word-break: normal; word-wrap: break-word; } /**-------------------------------------------------------------- ## Post hidden tips --------------------------------------------------------------**/ .post-password-content { position: relative; } .post-password-content form { max-width: 400px; margin: 0 auto; } /*-------------------------------------------------------------- ## Pagination (WordPress CSS classes) --------------------------------------------------------------*/ .pagination-container { position: relative; display: flex; justify-content: center; flex-direction: row; flex-wrap: wrap; align-items: center; margin: 24px 0 0; } .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px; overflow: hidden; position: absolute !important; word-wrap: normal !important; } .pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; width: 100%; } .page-numbers, .post-page-numbers { display: flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; text-align: center; padding: 0 6px; margin: 4px; background-color: var(--gray-2); color: var(--color-muted); border-radius: var(--border-radius-sm); } .page-numbers:hover, .page-numbers.current, .post-page-numbers:hover, .post-page-numbers.current { color: #fff; background-color: var(--color-primary); } .page-numbers.dots { min-width: auto; text-align: center; padding: 0 6px; margin: 4px; background-color: transparent; border-radius: 0; } .page-numbers.dots:hover { color: var(--color-muted); background-color: transparent; } @media (max-width: 767.98px) { .pagination-container { margin: 16px 0 0 } .page-numbers { min-width: 32px; height: 32px; margin: 4px; } } .pagination-quick-jumper { margin-left: 4px; } .pagination-quick-jumper .quick-jumper-input { min-width: 30px; background: var(--color-light); border-radius: var(--border-radius-xs); text-align: center; border: 0; padding: 4px; margin: 0 4px; } .pagination-quick-jumper .quick-jumper-input::-webkit-inner-spin-button, .pagination-quick-jumper .quick-jumper-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .pagination-quick-jumper .quick-jumper-input { -moz-appearance: textfield; } /*-------------------------------------------------------------- post navigation style --------------------------------------------------------------*/ .post-in-navigation span, .post-in-navigation a { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; margin: 5px; text-align: center; color: var(--color-muted); border-radius: var(--border-radius-xs); background-color: var(--bg-light); } .post-in-navigation a:focus, .post-in-navigation a:active, .post-in-navigation a:hover, .post-in-navigation .current { color: #fff; background-color: var(--color-primary); } .post-in-navigation .current, .post-in-navigation a.prev, .post-in-navigation a.next { display: flex; } .post-in-navigation a.dots { min-width: 0; background-color: transparent; color: var(--color-muted); } @media (max-width: 767.98px) { .post-in-navigation { margin: 20px 0 0; } .post-in-navigation span, .post-in-navigation a { min-width: 32px; height: 32px; border-radius: var(--border-radius-sm); } } @media (min-width: 768px) and (max-width: 991.98px) { .post-in-navigation { margin: 24px 0 0; } .post-in-navigation span, .post-in-navigation a { min-width: 36px; height: 36px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .post-in-navigation { margin: 24px 0 0; } } @media (min-width: 1200px) and (max-width: 1399.98px) { .post-in-navigation { margin: 32px 0 0; } } /*-------------------------------------------------------------- Post status icon --------------------------------------------------------------*/ .post-status-icon { position: absolute; right: 10px; top: 10px; width: 32px; height: 15px; background-position: center; background-size: contain; background-repeat: no-repeat; } .post-status-icon.draft { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDIiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCA0MiAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgZmlsdGVyPSJ1cmwoI2ZpbHRlcjBfaV8xMTJfMTIyKSI+CjxyZWN0IHdpZHRoPSI0MiIgaGVpZ2h0PSIyMSIgcng9IjMiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8xMTJfMTIyKSIvPgo8L2c+CjxwYXRoIGQ9Ik0xMi40NDggNi4zNkwxMi41NiA1LjI0SDEwLjI1NkwxMC40IDMuOTI4SDEyLjcwNEwxMi44MTYgMi44MjRIMTQuMjRMMTQuMTI4IDMuOTI4SDE2Ljc2OEwxNi44OCAyLjgyNEgxOC4zMDRMMTguMTkyIDMuOTI4SDIwLjQ4TDIwLjMzNiA1LjI0SDE4LjA0OEwxNy45MiA2LjM2SDE2LjUxMkwxNi42MjQgNS4yNEgxMy45ODRMMTMuODU2IDYuMzZIMTIuNDQ4Wk0xMy4yIDE4LjI4TDEzLjQyNCAxNi4xNjhIOS4wMjRMOS4xNjggMTQuNzI4SDEzLjU2OEwxMy43MjggMTMuMjU2SDEwLjQ5NkwxMS4xNjggNi44NEgxNy43NDRDMTguMTQ5MyA2Ljg0IDE4LjQ0MjcgNi45NjI2NiAxOC42MjQgNy4yMDhDMTguODE2IDcuNDQyNjcgMTguODkwNyA3Ljc0NjY3IDE4Ljg0OCA4LjEyTDE4LjMwNCAxMy4yNTZIMTUuMkwxNS4wNCAxNC43MjhIMTkuNDg4TDE5LjMyOCAxNi4xNjhIMTQuODk2TDE0LjY3MiAxOC4yOEgxMy4yWk0xMi4yNzIgOS40MTZIMTcuMzQ0TDE3LjQ3MiA4LjJIMTIuNEwxMi4yNzIgOS40MTZaTTEyLjAxNiAxMS44OTZIMTcuMDcyTDE3LjIxNiAxMC42NDhIMTIuMTQ0TDEyLjAxNiAxMS44OTZaIiBmaWxsPSJ3aGl0ZSIvPgo8cGF0aCBkPSJNMzMuMzU2OSA0LjA0TDMzLjIyODkgNS4yNzJIMjYuNjIwOUwyNi43NDg5IDQuMDRIMjkuMzg4OUwyOS41MTY5IDIuODA4SDMwLjg0NDlMMzAuNzE2OSA0LjA0SDMzLjM1NjlaTTIxLjE0ODkgMTUuMDMyQzIxLjUzMjkgMTQuMjQyNyAyMS44NjM1IDEzLjQ5NiAyMi4xNDA5IDEyLjc5MkMyMi40Mjg5IDEyLjA3NzMgMjIuNjc5NSAxMS4zNjggMjIuODkyOSAxMC42NjRDMjMuMTE2OSA5Ljk0OTMzIDIzLjMzMDIgOS4xOTIgMjMuNTMyOSA4LjM5MkgyMi42MjA5TDIyLjc2NDkgNy4wNDhIMjQuMDc2OUwyNC4zMzI5IDQuODI0QzI0LjAwMjIgNC45MDkzMyAyMy42NzY5IDQuOTg0IDIzLjM1NjkgNS4wNDhMMjMuMDM2OSAzLjcyQzIzLjU3MDIgMy42MjQgMjQuMTE0MiAzLjUwNjY2IDI0LjY2ODkgMy4zNjhDMjUuMjM0MiAzLjIyOTMzIDI1Ljc0MDkgMy4wOCAyNi4xODg5IDIuOTJMMjYuNTg4OSA0LjE2OEMyNi4yOTAyIDQuMjc0NjYgMjUuOTcwMiA0LjM3NiAyNS42Mjg5IDQuNDcyTDI1LjM1NjkgNy4wNDhIMjYuMzMyOUwyNi4xODg5IDguMzkySDI1LjE2NDlMMjUuMDA0OSA5Ljg5NkMyNS4xNzU1IDEwLjA3NzMgMjUuMzQwOSAxMC4yNjkzIDI1LjUwMDkgMTAuNDcyQzI1LjY3MTUgMTAuNjY0IDI1Ljg0NzUgMTAuODY2NyAyNi4wMjg5IDExLjA4TDI2LjE0MDkgMTAuMDcySDMxLjUxNjlDMzIuMzE2OSAxMC4wNzIgMzIuNjc0MiAxMC40NDUzIDMyLjU4ODkgMTEuMTkyTDMyLjAyODkgMTYuNDU2QzMxLjk3NTUgMTcgMzEuODEwMiAxNy40NDggMzEuNTMyOSAxNy44QzMxLjI1NTUgMTguMTUyIDMwLjgwMjIgMTguMzI4IDMwLjE3MjkgMTguMzI4QzI5Ljc2NzUgMTguMzI4IDI5LjQxNTUgMTguMjEwNyAyOS4xMTY5IDE3Ljk3NkMyOC44MTgyIDE3Ljc1MiAyOC41OTQyIDE3LjQzNzMgMjguNDQ0OSAxNy4wMzJMMjkuNTAwOSAxNi41NTJDMjkuNjgyMiAxNi45NjggMjkuOTE2OSAxNy4xNzYgMzAuMjA0OSAxNy4xNzZDMzAuNDA3NSAxNy4xNzYgMzAuNTQ2MiAxNy4wOTA3IDMwLjYyMDkgMTYuOTJDMzAuNzA2MiAxNi43NDkzIDMwLjc1NDIgMTYuNTk0NyAzMC43NjQ5IDE2LjQ1NkwzMS4zMDg5IDExLjI3MkgyNy4yNzY5TDI2LjU0MDkgMTguMjhIMjUuMjc2OUwyNi4wMTI5IDExLjMzNkwyNS4zNTY5IDEyLjEyQzI1LjE3NTUgMTEuODY0IDI1LjAwNDkgMTEuNjI5MyAyNC44NDQ5IDExLjQxNkwyNC4xMDg5IDE4LjI4SDIyLjg2MDlMMjMuNzcyOSAxMC43MTJDMjMuNTgwOSAxMS41MzMzIDIzLjM1MTUgMTIuMzM4NyAyMy4wODQ5IDEzLjEyOEMyMi44Mjg5IDEzLjkwNjcgMjIuNTE0MiAxNC43MjI3IDIyLjE0MDkgMTUuNTc2TDIxLjE0ODkgMTUuMDMyWk0zMi4yNTI5IDYuOTY4TDMxLjk5NjkgOS4yODhIMjYuOTI0OUwyNy4yNzY5IDUuOTI4SDMxLjI2MDlDMzEuNjY2MiA1LjkyOCAzMS45MzgyIDYuMDI0IDMyLjA3NjkgNi4yMTZDMzIuMjI2MiA2LjQwOCAzMi4yODQ5IDYuNjU4NjcgMzIuMjUyOSA2Ljk2OFpNMjguMjY4OSA4LjE2OEgzMC44NzY5TDMxLjAwNDkgNy4wNDhIMjguMzgwOUwyOC4yNjg5IDguMTY4Wk0zMC40OTI5IDEzTDMwLjE4ODkgMTUuNzg0SDI3LjQyMDlMMjcuODIwOSAxMi4xNTJIMjkuNzI0OUMzMC4wNjYyIDEyLjE1MiAzMC4yODQ5IDEyLjIzMiAzMC4zODA5IDEyLjM5MkMzMC40ODc1IDEyLjU1MiAzMC41MjQ5IDEyLjc1NDcgMzAuNDkyOSAxM1pNMjguNTcyOSAxNC43OTJIMjkuMjQ0OUwyOS40MzY5IDEzLjE0NEgyOC43NDg5TDI4LjU3MjkgMTQuNzkyWiIgZmlsbD0id2hpdGUiLz4KPGRlZnM+CjxmaWx0ZXIgaWQ9ImZpbHRlcjBfaV8xMTJfMTIyIiB4PSIwIiB5PSIwIiB3aWR0aD0iNDIiIGhlaWdodD0iMjEiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJCYWNrZ3JvdW5kSW1hZ2VGaXgiIHJlc3VsdD0ic2hhcGUiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldC8+CjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIiLz4KPGZlQ29tcG9zaXRlIGluMj0iaGFyZEFscGhhIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazI9Ii0xIiBrMz0iMSIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwLjY4NzUgMCAwIDAgMCAwLjE2NSAwIDAgMCAwIDAgMCAwIDAgMC4yNSAwIi8+CjxmZUJsZW5kIG1vZGU9Im5vcm1hbCIgaW4yPSJzaGFwZSIgcmVzdWx0PSJlZmZlY3QxX2lubmVyU2hhZG93XzExMl8xMjIiLz4KPC9maWx0ZXI+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8xMTJfMTIyIiB4MT0iMzciIHkxPSIwLjUwMDAwMSIgeDI9IjQuMjUxOTYiIHkyPSIyMC43OTI4IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRjhENTUiLz4KPHN0b3Agb2Zmc2V0PSIwLjc3MDgzMyIgc3RvcC1jb2xvcj0iI0ZENUUwRiIvPgo8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNGRjg1NDgiLz4KPC9saW5lYXJHcmFkaWVudD4KPC9kZWZzPgo8L3N2Zz4K"); } .post-status-icon.pending { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDIiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCA0MiAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgZmlsdGVyPSJ1cmwoI2ZpbHRlcjBfaV8xMTJfMTI1KSI+CjxyZWN0IHdpZHRoPSI0MiIgaGVpZ2h0PSIyMSIgcng9IjMiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8xMTJfMTI1KSIvPgo8L2c+CjxwYXRoIGQ9Ik0yMC4yODggNy44OTZMMjAuMTQ0IDkuMjcySDEyLjk3NkwxMy4xMiA3Ljg5NkgxNi4wNDhMMTYuMjU2IDUuOTZIMTMuNjk2TDEzLjg0IDQuNTg0SDE2LjRMMTYuNTkyIDIuNzkySDE3LjkyTDE3LjcyOCA0LjU4NEgyMC4yNTZMMjAuMTEyIDUuOTZIMTcuNTg0TDE3LjM3NiA3Ljg5NkgyMC4yODhaTTEzLjM0NCAzLjQ2NEMxMi45Mzg3IDQuMTg5MzMgMTIuNDkwNyA0Ljg4MjY3IDEyIDUuNTQ0QzExLjUyIDYuMTk0NjcgMTAuOTcwNyA2LjgzNDY3IDEwLjM1MiA3LjQ2NEw5LjM2IDYuNTM2QzkuOTI1MzMgNS45NzA2NyAxMC40MzczIDUuMzc4NjcgMTAuODk2IDQuNzZDMTEuMzY1MyA0LjE0MTMzIDExLjc4NjcgMy40OTA2NyAxMi4xNiAyLjgwOEwxMy4zNDQgMy40NjRaTTExLjA0IDE4LjI4SDkuNjY0TDEwLjQxNiAxMS4zMDRDMTAuMTYgMTEuNTkyIDkuODk4NjcgMTEuODY5MyA5LjYzMiAxMi4xMzZMOC43NjggMTEuMDhDOS40NjEzMyAxMC40NCAxMC4wOCA5Ljc1MiAxMC42MjQgOS4wMTZDMTEuMTY4IDguMjY5MzMgMTEuNjggNy40ODUzMyAxMi4xNiA2LjY2NEwxMy4yNDggNy40MTZDMTIuODUzMyA4LjA4OCAxMi40MzIgOC43Mzg2NyAxMS45ODQgOS4zNjhMMTEuMDQgMTguMjhaTTE0LjU5MiAxNS44NjRDMTQuNzk0NyAxNi42MzIgMTUuMTg5MyAxNy4wMTYgMTUuNzc2IDE3LjAxNkMxNi4xNDkzIDE3LjAxNiAxNi40MzIgMTYuOTE0NyAxNi42MjQgMTYuNzEyQzE2LjgyNjcgMTYuNDk4NyAxNi45NTQ3IDE2LjEyIDE3LjAwOCAxNS41NzZMMTcuMzQ0IDEyLjQ1NkgxMi44NjRMMTMuMDA4IDExLjA5NkgxNy40ODhMMTcuNjE2IDkuODQ4SDE5LjAwOEwxOC44OCAxMS4wOTZIMTkuODRMMTkuNjk2IDEyLjQ1NkgxOC43MzZMMTguMzg0IDE1Ljc2OEMxOC4zMzA3IDE2LjIzNzMgMTguMjA4IDE2LjY2NCAxOC4wMTYgMTcuMDQ4QzE3LjgzNDcgMTcuNDMyIDE3LjU2OCAxNy43MzYgMTcuMjE2IDE3Ljk2QzE2Ljg3NDcgMTguMTg0IDE2LjQ0MjcgMTguMjk2IDE1LjkyIDE4LjI5NkMxNS4yMzczIDE4LjI5NiAxNC42NzIgMTguMDk4NyAxNC4yMjQgMTcuNzA0QzEzLjc4NjcgMTcuMzA5MyAxMy40OTMzIDE2Ljc4NjcgMTMuMzQ0IDE2LjEzNkwxNC41OTIgMTUuODY0Wk0xNS45MzYgMTQuODI0TDE0LjkxMiAxNS41NkMxNC43MzA3IDE1LjIxODcgMTQuNTEyIDE0Ljg3MiAxNC4yNTYgMTQuNTJDMTQuMDEwNyAxNC4xNjggMTMuNzM4NyAxMy44NDI3IDEzLjQ0IDEzLjU0NEwxNC40MTYgMTIuODA4QzE0LjY4MjcgMTMuMDUzMyAxNC45NiAxMy4zNjggMTUuMjQ4IDEzLjc1MkMxNS41MzYgMTQuMTI1MyAxNS43NjUzIDE0LjQ4MjcgMTUuOTM2IDE0LjgyNFoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik0yNC4yODQ5IDcuMDMySDIyLjgxMjlMMjMuMTAwOSA0LjI0OEgyNy40MzY5TDI3LjU4MDkgMi43OTJIMjkuMDUyOUwyOC45MDg5IDQuMjQ4SDMxLjgyMDlDMzIuMzAwOSA0LjI0OCAzMi42NDc1IDQuMzc2IDMyLjg2MDkgNC42MzJDMzMuMDc0MiA0Ljg3NzMzIDMzLjE1OTUgNS4xOTczMyAzMy4xMTY5IDUuNTkyTDMyLjk3MjkgNy4wMzJIMzEuNTAwOUwzMS42NDQ5IDUuNjRIMjQuNDI4OUwyNC4yODQ5IDcuMDMyWk0yNi4wOTI5IDE4LjYzMkwyNi40Mjg5IDE1LjMzNkgyMy4wMDQ5VjE1LjMwNEwyMi43MDA5IDE1LjMzNkwyMy41MTY5IDcuOTQ0SDI3LjIxMjlMMjcuMzcyOSA2LjM2SDI4Ljc5NjlMMjguNjM2OSA3Ljk0NEgzMS4xMDA5QzMxLjUzODIgNy45NDQgMzEuODQ3NSA4LjA2NjY3IDMyLjAyODkgOC4zMTJDMzIuMjIwOSA4LjU0NjY3IDMyLjI5NTUgOC44NDUzMyAzMi4yNTI5IDkuMjA4TDMxLjU0ODkgMTUuMzM2SDI3Ljg1MjlMMjcuNTE2OSAxOC42MzJIMjYuMDkyOVpNMjQuNTA4OSAxMUgyNi44OTI5TDI3LjA2ODkgOS4yNzJIMjQuNzE2OUwyNC41MDg5IDExWk0yOC4zMTY5IDExSDMwLjYzNjlMMzAuODI4OSA5LjI3MkgyOC40OTI5TDI4LjMxNjkgMTFaTTI0LjE1NjkgMTQuMDI0SDI2LjU3MjlMMjYuNzY0OSAxMi4ySDI0LjM2NDlMMjQuMTU2OSAxNC4wMjRaTTI3Ljk5NjkgMTQuMDI0SDMwLjI4NDlMMzAuNDkyOSAxMi4ySDI4LjE4ODlMMjcuOTk2OSAxNC4wMjRaIiBmaWxsPSJ3aGl0ZSIvPgo8ZGVmcz4KPGZpbHRlciBpZD0iZmlsdGVyMF9pXzExMl8xMjUiIHg9IjAiIHk9IjAiIHdpZHRoPSI0MiIgaGVpZ2h0PSIyMSIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPgo8ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPgo8ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJzaGFwZSIvPgo8ZmVDb2xvck1hdHJpeCBpbj0iU291cmNlQWxwaGEiIHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAxMjcgMCIgcmVzdWx0PSJoYXJkQWxwaGEiLz4KPGZlT2Zmc2V0Lz4KPGZlR2F1c3NpYW5CbHVyIHN0ZERldmlhdGlvbj0iMiIvPgo8ZmVDb21wb3NpdGUgaW4yPSJoYXJkQWxwaGEiIG9wZXJhdG9yPSJhcml0aG1ldGljIiBrMj0iLTEiIGszPSIxIi8+CjxmZUNvbG9yTWF0cml4IHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwLjE1IDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9InNoYXBlIiByZXN1bHQ9ImVmZmVjdDFfaW5uZXJTaGFkb3dfMTEyXzEyNSIvPgo8L2ZpbHRlcj4KPGxpbmVhckdyYWRpZW50IGlkPSJwYWludDBfbGluZWFyXzExMl8xMjUiIHgxPSIzNyIgeTE9IjAuNTAwMDAxIiB4Mj0iNC4yNTE5NiIgeTI9IjIwLjc5MjgiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0ZGQjc0QSIvPgo8c3RvcCBvZmZzZXQ9IjAuNzcwODMzIiBzdG9wLWNvbG9yPSIjRkQ5MDBGIi8+CjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0ZGQjY0OCIvPgo8L2xpbmVhckdyYWRpZW50Pgo8L2RlZnM+Cjwvc3ZnPgo="); } .post-status-icon.private { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDIiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCA0MiAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjQyIiBoZWlnaHQ9IjIxIiByeD0iMyIgZmlsbD0idXJsKCNwYWludDBfbGluZWFyXzExMl8xMTkpIi8+CjxwYXRoIGQ9Ik05LjU1MiAxNi4wMDhMOC42MjQgMTUuNDE2QzkuMTc4NjcgMTQuNDI0IDkuNjc0NjcgMTMuMzYyNyAxMC4xMTIgMTIuMjMyQzEwLjU2IDExLjEwMTMgMTAuOTMzMyA5Ljg0OCAxMS4yMzIgOC40NzJIOS44MjRMOS45NjggNy4xMjhIMTEuODA4TDEyLjA0OCA0LjkwNEMxMS41NTczIDUuMDEwNjcgMTEuMDY2NyA1LjEwNjY3IDEwLjU3NiA1LjE5MkwxMC4yMjQgMy44OTZDMTAuOTQ5MyAzLjc3ODY3IDExLjY4IDMuNjM0NjcgMTIuNDE2IDMuNDY0QzEzLjE2MjcgMy4yODI2NyAxMy44NTA3IDMuMDkwNjcgMTQuNDggMi44ODhMMTQuOTI4IDQuMTA0QzE0LjQ2OTMgNC4yNjQgMTMuOTg0IDQuNDEzMzMgMTMuNDcyIDQuNTUyTDEzLjE4NCA3LjEyOEgxNC43MkwxNC41NzYgOC40NzJIMTIuOTkyTDEyLjg5NiA5LjMzNkMxMy4xNzMzIDkuNjEzMzMgMTMuNDM0NyA5Ljg5MDY3IDEzLjY4IDEwLjE2OEMxMy45MjUzIDEwLjQ0NTMgMTQuMTg2NyAxMC43NTQ3IDE0LjQ2NCAxMS4wOTZMMTMuNzEyIDEyLjAyNEMxMy4zODEzIDExLjU1NDcgMTMuMDYxMyAxMS4xMzMzIDEyLjc1MiAxMC43NkwxMS45NTIgMTguMjhIMTAuNjRMMTEuNiA5Ljg2NEMxMS4zNDQgMTEuMDI2NyAxMS4wNTA3IDEyLjEwOTMgMTAuNzIgMTMuMTEyQzEwLjQgMTQuMTE0NyAxMC4wMTA3IDE1LjA4IDkuNTUyIDE2LjAwOFpNMTguMzUyIDExLjA0OEMxOC42MjkzIDEyLjE3ODcgMTguODc0NyAxMy4yODggMTkuMDg4IDE0LjM3NkMxOS4zMDEzIDE1LjQ2NCAxOS40ODggMTYuNTYyNyAxOS42NDggMTcuNjcyTDE4LjI4OCAxNy45NkMxOC4yMjQgMTcuNTIyNyAxOC4xNTQ3IDE3LjA3NDcgMTguMDggMTYuNjE2QzE3LjIyNjcgMTYuODI5MyAxNi4zNjggMTcuMDMyIDE1LjUwNCAxNy4yMjRDMTQuNjQgMTcuNDE2IDEzLjc2IDE3LjYwOCAxMi44NjQgMTcuOEwxMi42NCAxNi41MzZDMTIuODY0IDE2LjQ5MzMgMTMuMDgyNyAxNi40NTA3IDEzLjI5NiAxNi40MDhDMTQuMDc0NyAxNC4zNiAxNC42OTMzIDEyLjI0OCAxNS4xNTIgMTAuMDcyQzE1LjYyMTMgNy44ODUzMyAxNi4wMTYgNS41MjI2NyAxNi4zMzYgMi45ODRMMTcuODA4IDMuMTQ0QzE3LjYxNiA0LjY1ODY3IDE3LjM4NjcgNi4xMjUzMyAxNy4xMiA3LjU0NEMxNi44NjQgOC45NjI2NyAxNi41NTQ3IDEwLjM3NiAxNi4xOTIgMTEuNzg0QzE1LjgyOTMgMTMuMTgxMyAxNS4zODEzIDE0LjYxMDcgMTQuODQ4IDE2LjA3MkMxNS4zNiAxNS45NTQ3IDE1Ljg2NjcgMTUuODM3MyAxNi4zNjggMTUuNzJDMTYuODY5MyAxNS41OTIgMTcuMzY1MyAxNS40NjQgMTcuODU2IDE1LjMzNkMxNy43Mzg3IDE0LjcxNzMgMTcuNjEwNyAxNC4wOTMzIDE3LjQ3MiAxMy40NjRDMTcuMzQ0IDEyLjgyNCAxNy4yMDUzIDEyLjE3MzMgMTcuMDU2IDExLjUxMkwxOC4zNTIgMTEuMDQ4WiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZD0iTTI0LjMwMDkgNi42MzJIMjIuOTg4OUwyMy4yNDQ5IDQuMTM2SDI3LjQ4NDlMMjcuNjI4OSAyLjc5MkgyOS4wMDQ5TDI4Ljg2MDkgNC4xMzZIMzIuMDYwOUMzMi40NDQ5IDQuMTM2IDMyLjcyNzUgNC4yNDI2NyAzMi45MDg5IDQuNDU2QzMzLjEwMDkgNC42NTg2NyAzMy4xNzU1IDQuOTMwNjcgMzMuMTMyOSA1LjI3MkwzMi45MjQ5IDcuMTI4SDMxLjYxMjlMMzEuODA0OSA1LjM2OEgyNy4yNzY5QzI3Ljc3ODIgNS45ODY2NyAyOC4yMjA5IDYuNjUzMzMgMjguNjA0OSA3LjM2OEwyNy42Mjg5IDguMDA4QzI3LjQyNjIgNy42MzQ2NyAyNy4yMDc1IDcuMjcyIDI2Ljk3MjkgNi45MkMyNi43MzgyIDYuNTU3MzMgMjYuNDgyMiA2LjIxMDY3IDI2LjIwNDkgNS44OEwyNi45NDA5IDUuMzY4SDI0LjQyODlMMjQuMzAwOSA2LjYzMlpNMzEuMDA0OSA5LjU5MkMzMC44NjYyIDEwLjU2MjcgMzAuNTUxNSAxMS4zNTIgMzAuMDYwOSAxMS45NkMyOS41ODA5IDEyLjU1NzMgMjguODUwMiAxMi44NTYgMjcuODY4OSAxMi44NTZDMjcuMzAzNSAxMi44NTYgMjYuODM5NSAxMi43MzMzIDI2LjQ3NjkgMTIuNDg4QzI2LjExNDIgMTIuMjMyIDI1LjgyNjIgMTEuODg1MyAyNS42MTI5IDExLjQ0OEMyNC42NzQyIDExLjg3NDcgMjMuNjE4MiAxMi4yNDggMjIuNDQ0OSAxMi41NjhMMjIuMTQwOSAxMS40QzIyLjcyNzUgMTEuMjUwNyAyMy4yNzY5IDExLjA4NTMgMjMuNzg4OSAxMC45MDRDMjQuMzAwOSAxMC43MTIgMjQuNzg2MiAxMC41MDQgMjUuMjQ0OSAxMC4yOEMyNS4xNDg5IDkuODIxMzMgMjUuMDk1NSA5LjMxNDY3IDI1LjA4NDkgOC43NkMyNS4wODQ5IDguMjA1MzMgMjUuMTA2MiA3LjYyNCAyNS4xNDg5IDcuMDE2TDI2LjQ0NDkgNi45ODRDMjYuNDIzNSA3LjM4OTMzIDI2LjQwNzUgNy44MjY2NyAyNi4zOTY5IDguMjk2QzI2LjM5NjkgOC43NTQ2NyAyNi40MjM1IDkuMTkyIDI2LjQ3NjkgOS42MDhDMjcuMjM0MiA5LjEzODY3IDI3LjkyMjIgOC42MTA2NyAyOC41NDA5IDguMDI0QzI5LjE3MDIgNy40MzczMyAyOS43NzgyIDYuNzg2NjcgMzAuMzY0OSA2LjA3MkwzMS4zMDg5IDYuODI0QzMwLjYyNjIgNy42NjY2NyAyOS45Mjc1IDguNDE4NjcgMjkuMjEyOSA5LjA4QzI4LjQ5ODIgOS43MzA2NyAyNy42OTI5IDEwLjMxMiAyNi43OTY5IDEwLjgyNEMyNi45MTQyIDExLjA1ODcgMjcuMDYzNSAxMS4yNDUzIDI3LjI0NDkgMTEuMzg0QzI3LjQzNjkgMTEuNTEyIDI3LjY3MTUgMTEuNTc2IDI3Ljk0ODkgMTEuNTc2QzI4LjQ4MjIgMTEuNTc2IDI4Ljg3NjkgMTEuNDA1MyAyOS4xMzI5IDExLjA2NEMyOS4zOTk1IDEwLjcyMjcgMjkuNjAyMiAxMC4xNjggMjkuNzQwOSA5LjRMMzEuMDA0OSA5LjU5MlpNMjQuOTcyOSA3LjE5MkMyNC44MzQyIDcuNzI1MzMgMjQuNjQ3NSA4LjI4IDI0LjQxMjkgOC44NTZDMjQuMTg4OSA5LjQzMiAyMy44OTAyIDEwLjA0IDIzLjUxNjkgMTAuNjhMMjIuMzk2OSAxMC4xMzZDMjIuNzE2OSA5LjU5MiAyMi45OTQyIDkuMDQ4IDIzLjIyODkgOC41MDRDMjMuNDYzNSA3Ljk0OTMzIDIzLjY2NjIgNy4zOTQ2NyAyMy44MzY5IDYuODRMMjQuOTcyOSA3LjE5MlpNMzEuNzQwOSA3LjQ0OEMzMS45OTY5IDcuOTYgMzIuMjI2MiA4LjUwOTMzIDMyLjQyODkgOS4wOTZDMzIuNjMxNSA5LjY3MiAzMi44MDIyIDEwLjI2OTMgMzIuOTQwOSAxMC44ODhMMzEuNzI0OSAxMS4zMDRDMzEuNDY4OSAxMC4wOTg3IDMxLjA4NDkgOC45ODQgMzAuNTcyOSA3Ljk2TDMxLjc0MDkgNy40NDhaTTI0LjU1NjkgMTMuNzJMMjQuMjIwOSAxNi44NEgyNi40MTI5TDI2Ljc4MDkgMTMuMjg4SDI4LjIzNjlMMjcuODg0OSAxNi44NEgzMC4wNDQ5TDMwLjM4MDkgMTMuNzJIMzEuODIwOUwzMS4zNTY5IDE4LjE4NEgyMi42MzY5TDIzLjExNjkgMTMuNzJIMjQuNTU2OVoiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfMTEyXzExOSIgeDE9IjM3IiB5MT0iMC41MDAwMDEiIHgyPSI0LjI1MTk2IiB5Mj0iMjAuNzkyOCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgo8c3RvcCBzdG9wLWNvbG9yPSIjMzkzOTM5Ii8+CjxzdG9wIG9mZnNldD0iMC41MzEyNSIvPgo8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiM0NzQ3NDciLz4KPC9saW5lYXJHcmFkaWVudD4KPC9kZWZzPgo8L3N2Zz4K"); } /*-------------------------------------------------------------- Post audio cover --------------------------------------------------------------*/ .post-film-cover { position: relative; overflow: hidden; display: flex; flex-direction: row; min-width: 0; word-wrap: break-word; border-radius: var(--border-radius-sm); margin: 0 0 24px; } .post-film-cover .bg-film-cover { background-position: center; } .post-film-cover .bg-image-color { opacity: 0.9; } .post-film-cover .bg-film-cover { opacity: 0.3; -webkit-filter: blur(10px); filter: blur(10px); transform: scale(1.15); } .post-film-cover .media { padding-left: 0; padding-right: 0; } .post-film-cover .film-content { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; color: #fff; } @media (max-width: 767.98px) { .post-film-cover .film-content { margin: 0 0 0 16px; } } @media (min-width: 768px) and (max-width: 991.98px) { .post-film-cover .film-content { margin: 0 0 0 16px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .post-film-cover .film-content { margin: 0 0 0 16px; } } @media (min-width: 1200px) { .post-film-cover .film-content { margin: 0 0 0 24px; } } /*-------------------------------------------------------------- data-style --------------------------------------------------------------*/ @-webkit-keyframes like-button-animation { 0%, to { transform: scale(1); } 25% { transform: scale(1.3); } 50% { transform: scale(0.95); } } @keyframes like-button-animation { 0%, to { transform: scale(1); } 25% { transform: scale(1.3); } 50% { transform: scale(0.95); } } /*-------------------------------------------------------------- Post like style --------------------------------------------------------------*/ .post-actions .like-toggle { position: relative; } .like-toggle { border-width: 0; } .like-toggle span { z-index: 1; } .like-toggle span .solid { display: none; } .like-toggle .like-overlay { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 50%; background: #ff0755; transform: scale(0); transition: all 0.4s; z-index: 0; } .like-toggle.active .like-overlay { transform: scale(1); } .like-toggle.active span { color: #fff; } .like-toggle.active span .line { display: none; } .like-toggle.active span .solid { display: block; } .like-toggle.active span.bouncy i { -webkit-animation: bouncy 0.6s; animation: bouncy 0.6s; -webkit-animation-duration: 0.6s; animation-duration: 0.6s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes bouncy { from, to { -webkit-transform: scale(1, 1); } 25% { -webkit-transform: scale(0.9, 1.1); } 50% { -webkit-transform: scale(1.1, 0.9); } 75% { -webkit-transform: scale(0.95, 1.05); } } @-webkit-keyframes bouncy { from, to { transform: scale(1, 1); } 25% { transform: scale(0.9, 1.1); } 50% { transform: scale(1.1, 0.9); } 75% { transform: scale(0.95, 1.05); } } @keyframes bouncy { from, to { transform: scale(1, 1); } 25% { transform: scale(0.9, 1.1); } 50% { transform: scale(1.1, 0.9); } 75% { transform: scale(0.95, 1.05); } } /*-------------------------------------------------------------- Post share style --------------------------------------------------------------*/ .post-share-channel a { margin: 5px; } /*-------------------------------------------------------------- Post meta style --------------------------------------------------------------*/ .post-meta .flex-avatar { width: 40px; height: 40px; cursor: pointer; } @media (max-width: 767.98px) { .post-meta .flex-avatar { width: 32px; height: 32px; } } @media (min-width: 768px) and (max-width: 991.98px) { .post-meta .flex-avatar { width: 36px; height: 36px; } } /*-------------------------------------------------------------- post dock --------------------------------------------------------------*/ .post-fixed-dock { display: none; } .post-fixed-dock .collect-toggle.active, .post-fixed-dock .like-toggle.active { color: var(--color-primary) !important; } @supports (bottom: env(safe-area-inset-bottom)) { .post-fixed-dock { padding-bottom: env(safe-area-inset-bottom); } } @media (max-width: 991.98px) { .post-fixed-dock { position: fixed; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; will-change: transform; transition: transform 0.25s ease-in-out; z-index: 999; transform: translateY(100%); } .dock-inner { position: relative; display: flex; align-items: center; flex-shrink: 0; background-color: #fff; padding: 12px 14px 12px; border-radius: 50px; box-shadow: 0px 10px 30px 0px rgb(26 26 26 / 12%); } .post-fixed-dock a { margin: 0 12px; } .post-fixed-dock.sticky { transform: translateY(-30px); } } /*-------------------------------------------------------------- Toc --------------------------------------------------------------*/ .toc { max-height: 450px; overflow: hidden; overflow-y: auto; } .toc-list { position: relative; } .toc-list li { position: relative; margin: 0 0 10px; padding-left: 16px; } .toc-list li::before { content: ''; position: absolute; left: 0; top: 8px; width: 8px; height: 8px; border-radius: 10px; border: 1px solid var(--color-dark); background-color: var(--color-dark); opacity: .2; } .toc-list li:last-child { margin: 0; } .toc-list .toc-list li { margin: 10px 0 0; } .toc-list .toc-list li::before { content: ''; position: absolute; left: 0; top: 8px; } .toc-link { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; opacity: .6; } .toc-link:hover, .toc-link.is-active-link { font-weight: bold; color: var(--color-primary); opacity: 1 } .toc-list .is-active-li::before { border-color: var(--color-primary); background-color: var(--color-primary); opacity: 1; } #toc-scrollbar::-webkit-scrollbar { width: 6px; height: 6px; background-color: transparent; } #toc-scrollbar::-webkit-scrollbar-thumb { border-radius: 10px; background-color: var(--color-dark); } #toc-scrollbar::-webkit-scrollbar-track { border-radius: 10px; background-color: var(--bg-light); } .widget_post_toc { transition: all 300ms ease-in-out; } .widget_post_toc.sticky { position: -webkit-sticky; position: sticky; top: 86px; z-index: 1; -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; } /*-------------------------------------------------------------- Comment style --------------------------------------------------------------*/ .comment-respond { margin: 0 0 32px 0; } .comment-login { display: flex; align-items: center; justify-content: space-between; border-radius: 100px; } .comment { position: relative; margin: 24px 0; padding-left: 48px; } .comment-form { position: relative; padding-left: 48px; } .comment_at { font-weight: 500; color: var(--color-dark); } .comment-avatar { width: 40px; height: 40px; position: absolute; top: 0; left: 0; } .comment-logged { display: flex; align-items: center; gap: 4px; } .comment-logged a { display: flex; align-items: center; justify-content: center; line-height: 1; color: var(--color-muted); } .comment-logged a:hover { color: var(--color-primary) } .comment .comment-inner .apollo-user-level { padding: 2px 8px 2px 8px; } .comment .comment-author .author-badge { position: relative; top: -1px; font-size: 12px; padding: 2px 4px; margin-left: 4px; border-radius: 4px; color: var(--color-primary); background-color: var(--outline-primary); border: 1px solid var(--outline-primary); } .comment .comment-content { margin: 4px 0; } .comment .comment-author a { color: var(--color-secondary); } .comment .comment-author a:hover { color: var(--color-primary); } .children { margin: 24px 0 0; } .children .comment-form { margin: 20px 0 0; padding: 0 0 0 45px; } .children .comment { margin: 20px 0 0; padding: 0 0 0 36px; border-top: 0; } .children .comment:first-child { margin: 0; } .children .comment-avatar { width: 30px; height: 30px; } .children .comment .comment-content { margin: 6px 0; word-wrap: break-word; word-break: break-all; } .children .comment .comment-inner { margin: 4px 0 0 0; } .children .comment .comment-footer .comment-date { flex: none; } @media only screen and (max-width: 767px) { .comment-list .comment-respond { margin: 0 0 32px; } .comment-form { padding-left: 35px; } .comment { margin: 24px 0; padding-left: 35px; } .comment-avatar { width: 28px; height: 28px; } .comment .comment-content { margin: 8px 0; } .children .comment-form, .children .comment { padding: 0 0 0 35px; margin: 16px 0 0; } .children .comment-avatar { width: 28px; height: 28px; } .children .comment .comment-content { margin: 5px 0; } } /*-------------------------------------------------------------- author info style --------------------------------------------------------------*/ .author-info-block { position: relative; overflow: hidden; border-radius: inherit; } .author-info-block .media { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .author-info-block .author-info-body { position: relative; padding: 76px 20px 20px; } .author-info-block .flex-avatar { position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); z-index: 2; } .author-info-block .avatar-badge { width: 25px; height: 25px; transform: translate(-5px, 0px); } .author-info-link { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } /*-------------------------------------------------------------- Widget style --------------------------------------------------------------*/ .widget { padding: 24px; margin-bottom: 16px; } .widget.hidden { opacity: .1; pointer-events: none; } .widget-title { position: relative; padding-left: 20px; margin-bottom: 16px; } .widget-title::before { content: ''; position: absolute; left: 0; top: 3px; width: 5px; height: 19px; background: var(--color-primary); border-radius: 20px; } /*-------------------------------------------------------------- ## widget search style --------------------------------------------------------------*/ .widget_search .search-form { position: relative; } .widget_search .search-form label { display: block; margin: 0; } .widget_search .search-form .search-field { width: 100%; padding: 8px 12px; background-color: transparent; border: 1px solid var(--gray-3); border-radius: var(--border-radius-sm); } .widget_search .search-form .search-field:focus { border-color: var(--color-primary) } .widget_search .search-form .search-submit { display: none; } /*-------------------------------------------------------------- ## widget recent entries style --------------------------------------------------------------*/ .widget_recent_entries ul { padding-left: 16px; } .widget_recent_entries ul li { margin-bottom: 8px; list-style-type: circle; } .widget_recent_entries ul li a { display: block; } .widget_recent_entries ul li span { color: #8a92a9; font-size: 12px; } /*-------------------------------------------------------------- ## widget categories + tag cloud style --------------------------------------------------------------*/ .widget_categories ul, .tagcloud { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; } .widget_categories ul li a, .tagcloud a { position: relative; display: flex; align-items: center; font-size: 12px; padding: 6px 14px; border: 1px solid var(--bg-light); background-color: var(--bg-light); border-radius: var(--border-radius-sm); } .widget_categories ul li a { font-size: 14px; color: var(--color-muted); } .widget_categories ul li a:hover { color: #fff; border-color: var(--color-primary); background-color: var(--color-primary); } .widget_categories .postform { width: 100%; padding: 8px 12px; border-radius: var(--border-radius-sm); border-color: var(--gray-3); outline: 0; } .widget_categories .postform:active, .widget_categories .postform:focus { border-color: var(--gray-2); } .tagcloud a { font-size: 14px !important; padding: 6px 12px; color: var(--color-muted); } .tagcloud a:hover { border: 1px solid var(--color-primary); background-color: var(--color-primary); color: #fff; } .tagcloud a span { font-size: 12px; color: var(--color-muted); } /*-------------------------------------------------------------- ## widget other style --------------------------------------------------------------*/ .widget_meta li, .widget_archive li { position: relative; font-size: 14px; color: var(--color-muted); padding: 12px 0; text-transform: uppercase; border-top: 1px solid var(--gray-3); display: flex; flex-direction: row; align-items: center; text-align: justify; justify-content: space-between; } .widget_archive select { width: 100%; font-size: 16px; padding: 10px 16px; color: var(--color-muted); background-color: var(--bg-light); border-color: var(--gray-3); border-radius: var(--border-radius-sm); } /*-------------------------------------------------------------- ## widget blogroll style --------------------------------------------------------------*/ .blogroll li { position: relative; display: flex; flex-direction: column; font-size: 12px; padding: 12px 56px 12px 16px; color: var(--color-muted); background-color: var(--bg-light); border-radius: var(--border-radius-sm); margin-bottom: 16px; } .blogroll li:last-child { margin-bottom: 0; } .blogroll li a { font-size: 14px; text-transform: uppercase; } .blogroll li a img { position: absolute; top: 50%; right: 12px; width: 40px; height: 40px; -o-object-fit: cover; object-fit: cover; transform: translateY(-50%); } /*-------------------------------------------------------------- widget_media_image style --------------------------------------------------------------*/ .widget_media_image img { max-width: 100%; height: auto; width: auto; } /*-------------------------------------------------------------- ## widget_recent_comments style --------------------------------------------------------------*/ .widget_recent_comments ul li { font-size: 14px; padding: 12px 0; text-transform: uppercase; border-top: 1px solid var(--gray-3); } .widget_recent_comments ul li span { margin-right: 5px; } .widget_recent_comments ul li:first-child { border-top: 0; padding-top: 0; } .widget_recent_comments ul li:last-child { padding-bottom: 0; } /*-------------------------------------------------------------- ## widget_recent_comments style --------------------------------------------------------------*/ .widget_nav_menu ul li { position: relative; text-transform: none; margin-bottom: 8px; } .widget_nav_menu ul li:last-child { margin-bottom: 0; } .widget_nav_menu ul li a { display: block; padding: 8px 12px; background-color: var(--bg-light); border-radius: var(--border-radius-sm); } .widget_nav_menu ul li.menu-item-has-children::after { content: ""; display: block; position: absolute; top: 15px; right: 15px; height: 6px; width: 6px; border-left: 1px solid var(--gray-3); border-bottom: 1px solid var(--gray-3); transform: rotate(315deg); transition: all 0.2s; } .widget_nav_menu ul li.menu-item-has-children:hover::after { margin-top: 2px; transform: rotate(135deg); } .widget_nav_menu ul li ul { margin-top: 8px; } .widget_nav_menu ul li > ul { display: none; } .widget_nav_menu ul li:hover > ul { display: block; } .widget_nav_menu ul li > ul ul li a { background-color: var(--bg-light); } /*-------------------------------------------------------------- ## widget_calendar style --------------------------------------------------------------*/ .widget_calendar table { width: 100%; min-width: auto; margin: 0; border-collapse: collapse; } .widget_calendar caption { padding: 10px 0; border-bottom: 0; color: var(--color-muted); } .widget_calendar th, .widget_calendar td { padding: 8px 4px; text-align: center; color: var(--color-muted); } .widget_calendar tbody td a { position: relative } .widget_calendar tbody td a::after { content: ''; position: absolute; left: 50%; bottom: -4px; width: 4px; height: 4px; background: var(--color-success); border-radius: 10px; margin: 0 0 0 -2px } .widget_calendar td#today { font-weight: bold } /*-------------------------------------------------------------- ## widget_media_gallery style --------------------------------------------------------------*/ .widget_media_gallery .gallery { padding: 12px 12px 0; margin-bottom: 0; } .widget_media_gallery .gallery-caption { padding: 4px; } /*-------------------------------------------------------------- ## widget_rss style --------------------------------------------------------------*/ .widget_rss .widget-title .rsswidget:first-child { float: right; } .widget_rss ul li { text-transform: uppercase; margin-bottom: 10px; padding-top: 12px; border-top: 1px solid var(--gray-3); } .widget_rss ul li:first-child { border: none; padding-top: 0; } .widget_rss ul li .rsswidget { font-size: 12px; display: block; } .widget_rss ul li .rss-date { font-size: 12px; color: var(--color-muted); } .widget_rss ul li .rssSummary { font-size: 12px; margin-top: 5px; color: var(--color-muted); } .widget_rss ul li cite { font-size: 12px; font-style: normal; color: var(--color-muted); } /*-------------------------------------------------------------- Widget hots comments --------------------------------------------------------------*/ .widget-hots-comments .author-comment { position: relative; display: flex; min-width: 0; word-wrap: break-word; flex-direction: row; border-radius: var(--border-radius-sm); margin: 0 0 16px; background-color: var(--color-dark); } .widget-hots-comments .author-comment:last-child { margin: 0; } .widget-hots-comments .author-comment .media { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .widget-hots-comments .author-comment .media .media-content { -webkit-filter: blur(15px); filter: blur(15px); transform: scale(1.1); } .widget-hots-comments .author-comment .hots-comment-content { position: relative; padding: 16px 8px; color: #fff; z-index: 1; } .widget-hots-comments .author-comment .hots-comment-body { position: relative; padding: 0 16px 0 24px; } .widget-hots-comments .author-comment .hots-comment-title { position: relative; } .widget-hots-comments .author-comment .hots-comment-title .icon-quote1 { position: absolute; font-size: 20px; left: -24px; top: -4px; opacity: 0.8; } .widget-hots-comments .author-comment .hots-comment-title .icon-quote2 { position: absolute; font-size: 20px; right: -16px; bottom: 0; opacity: 0.8; } .widget-hots-comments .author-comment .hots-comment-goto { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } /*-------------------------------------------------------------- Apollo widget style --------------------------------------------------------------*/ .widget-time-tags-list li { display: inline-block; padding: 5px 5px 5px 0; } .widget-time-tags-list li .btn-time { background: #6d7685; background: linear-gradient(to right, #9ca2a9, #6d7685); border: 0; color: #fff; transition: all 0.3s ease; } .widget-time-tags-list li .btn-time:hover { opacity: 0.8; } .widget-time-tags-list li:nth-child(1) .btn-time { background: #eb3349; background: linear-gradient(to right, #ff6e41, #ff0844); border: 0; color: #fff; } .widget-time-tags-list li:nth-child(3) .btn-time { background: #43e97b; background: linear-gradient(to right, #43e97b, #38f9d7); color: #fff; border: 0; } .widget-time-tags-list li:nth-child(2) .btn-time { background: #66a6ff; background: linear-gradient(to right, #89f7fe, #66a6ff); color: #fff; border: 0; } /*-------------------------------------------------------------- Apollo list time style --------------------------------------------------------------*/ .widget-time-hots-list .list-item { flex-direction: row; align-items: center; margin: 0 0 16px; } .widget-time-hots-list .list-item:last-child { margin: 0 0 0; } .widget-time-hots-list .list-item .list-title { font-size: 14px; } .widget-time-hots-list .list-item .list-num { position: relative; width: 18px; height: 18px; font-size: 12px; text-align: center; padding: 0 !important; flex-shrink: 0; border-radius: 100%; background-color: var(--color-secondary); color: #fff; margin: 0 8px 0 0; } .widget-time-hots-list .list-item .list-num span { position: absolute; width: 100%; height: 100%; top: 0; display: flex; align-items: center; justify-content: center; } .widget-time-hots-list .list-item:nth-child(1) .list-num { background-color: #ff0f44; border-color: #ff0f44; color: #fff; } .widget-time-hots-list .list-item:nth-child(2) .list-num { background-color: #ff552f; color: #fff; } .widget-time-hots-list .list-item:nth-child(3) .list-num { background-color: #ff8036; color: #fff; } /*-------------------------------------------------------------- Widget featured topics --------------------------------------------------------------*/ .widget-featured-topics .list-item { margin: 0 0 16px; } .widget-featured-topics .list-item:last-child { margin: 0; } /*-------------------------------------------------------------- Author comments --------------------------------------------------------------*/ .author-comment-list .author-comment { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; flex: 1 1 auto; margin-bottom: 16px; } .author-comment-list .author-comment:last-child { margin-bottom: 0; } .author-comment-list .author-comment .author-comment-content { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; padding: 24px 24px 24px 52px; } .author-comment-list .author-comment .author-comment-body { position: relative; flex: 1 1 auto; } .author-comment-list .author-comment .author-comment-title { position: relative; } .author-comment-list .author-comment .author-comment-title .iconfont { position: absolute; font-size: 20px; left: -32px; top: -4px; opacity: 0.8; } .author-comment-list .author-comment .author-comment-footer { position: relative; } .author-comment-list .author-comment .author-comment-goto { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } @media (max-width: 767.98px) { .author-comment-list .author-comment { margin-bottom: 16px; } .author-comment-list .author-comment .author-comment-content { padding: 16px 16px 16px 40px; } .author-comment-list .author-comment .author-comment-title .iconfont { left: -28px; } } /*-------------------------------------------------------------- Footer style --------------------------------------------------------------*/ .site-footer { background-color: var(--black); } .site-footer, .site-footer p, .site-footer a:not(.btn) { color: var(--color-light); } .site-footer a:not(.btn):hover { color: #fff; } /*-------------------------------------------------------------- Footer widget style --------------------------------------------------------------*/ .footer-widget-header { position: relative; color: #fff; padding: 0 0 0 20px; } .footer-widget-header::before { content: ""; position: absolute; top: 50%; left: 0; width: 4px; height: 18px; background-color: var(--color-primary); border-radius: 10px; transform: translate(0%, -50%); } .footer-widget-content p { line-height: 1.8; color: var(--color-light); } .footer-widget-content a { color: var(--color-light); } .footer-widget-content a:hover { color: #fff; } .footer-widget-content .footer-widget-links { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; } .footer-widget-content .footer-widget-links a { flex-shrink: 0; } .footer-widget-social { display: flex; flex-wrap: wrap; } .footer-widget-social .btn { margin: 0 6px 6px 0; } /*-------------------------------------------------------------- Index magazine style --------------------------------------------------------------*/ .index-magazine { position: relative; padding: 40px 0; } .index-magazine .magazine-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--bg-light); background-position: center; background-size: cover; background-repeat: no-repeat; } .index-magazine .magazine-content { position: relative; } .index-magazine .magazine-content .item { position: relative; } .index-magazine .magazine-content .item .item-content { position: absolute; left: 0; bottom: 0; right: 0; padding: 12px 16px; } .index-magazine .magazine-content .item .item-goto { position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 1; } .index-magazine.magazine-fixed { position: relative; overflow: hidden; } .index-magazine.magazine-fixed .bg-magazine { opacity: 0.2; -webkit-filter: blur(10px); filter: blur(10px); transform: scale(1.1); } .index-magazine.magazine-fixed .bg-image-color { opacity: 0.6; } @media (max-width: 767.98px) { .index-magazine { position: relative; overflow: hidden; padding-top: 16px; padding-bottom: 16px; } .index-magazine .magazine-content .item .item-content { padding: 8px; } .index-magazine .magazine-content .item .item-title { font-size: 10px; } .index-magazine .magazine-content .item.big .item-content { padding: 12px 16px; } .index-magazine .magazine-content .item.big .item-title { font-size: 16px; } } @media (min-width: 768px) and (max-width: 991.98px) { .index-magazine { padding-top: 24px; padding-bottom: 24px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .index-magazine { padding-top: 32px; padding-bottom: 32px; } } @media (min-width: 1200px) { .index-magazine.magazine-fixed { background-color: var(--color-dark); } } /*-------------------------------------------------------------- index category column --------------------------------------------------------------*/ .index-category-column .item { position: relative; overflow: hidden; } .index-category-column .item .item-content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 4px; color: #fff; z-index: 2; } .index-category-column .item .item-content .text-sm { transition: all .3s ease-in-out } .index-category-column .item:hover .item-content .text-sm { transform: scale(1.1) } @supports ((-webkit-backdrop-filter: blur(4px)) or (backdrop-filter: blur(4px))) { .index-category-column .item:hover .item-content { -webkit-backdrop-filter: saturate(120%) blur(4px); backdrop-filter: saturate(120%) blur(4px); background-color: rgba(0, 0, 0, 0.3); border-radius: inherit; } } /*-------------------------------------------------------------- list index pushes --------------------------------------------------------------*/ @media (min-width: 768px) { .index-category-column .col-md-2{ width:12.5%; } } /*-------------------------------------------------------------- Index category style --------------------------------------------------------------*/ .index-category-grid { padding: 32px 0; } .index-category-grid.bg-white .list-grid.list-grid-padding .list-item, .index-category-grid.bg-white .list-grouped .list-item { border: 1px solid var(--border-color) } @media (max-width: 767.98px) { .index-category-grid { padding: 20px 0; } } /*-------------------------------------------------------------- Index ajax post --------------------------------------------------------------*/ .index-ajax-menu { position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } .index-ajax-menu li { position: relative; margin: 0 16px 0 0; padding: 0 16px 0 0; } .index-ajax-menu li::before { content: ""; position: absolute; right: -8px; top: 50%; width: 15px; height: 1px; background-color: var(--bg-muted); transform: rotate(-45deg); } .index-ajax-menu li:last-child { margin: 0; padding: 0; } .index-ajax-menu li:last-child::before { display: none; } .index-ajax-menu li a { position: relative; color: var(--color-secondary); transition: all 0.3s ease-in-out; } .index-ajax-menu li.active a { color: var(--color-primary); } @media (max-width: 767.98px) { .index-ajax-menu { flex-wrap: nowrap; overflow-x: scroll; overflow-y: hidden; justify-content: start; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } .index-ajax-menu::-webkit-scrollbar { display: none; } .index-ajax-menu li { flex-shrink: 0; } } /*-------------------------------------------------------------- Index author pushes style --------------------------------------------------------------*/ .index-author-grid.bg-white .list-item.block { border: 1px solid var(--border-color); } .index-author-grid .list-item.block .list-content { position: relative; padding-top: 72px; } .index-author-grid .list-item.block .flex-avatar { position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); } .index-author-grid .list-item.block .bg-author { opacity: 0.75; } .index-author-grid .list-item.block .bg-poster { opacity: 0.15; -webkit-filter: blur(10px); filter: blur(10px); } @media (max-width: 767.98px) { .index-author-grid .list-item.block .flex-avatar { width: 48px; height: 48px; } .index-author-grid .list-item.block .list-content { padding-top: 35px; } } @media (min-width: 768px) and (max-width: 991.98px) { .index-author-grid .list-item.block .flex-avatar { width: 64px; height: 64px; } .index-author-grid .list-item.block .list-content { padding: 44px 10px 16px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .index-author-grid .list-item.block .flex-avatar { width: 64px; height: 64px; } .index-author-grid .list-item.block .list-content { padding-top: 45px; } } /*-------------------------------------------------------------- List index style --------------------------------------------------------------*/ .index-grid-heading h2 { position: relative; padding-left: 20px; } .index-grid-heading h2::before { content: ""; position: absolute; top: 50%; left: 0; width: 4px; height: 18px; border-radius: 10px; background-color: var(--color-primary); transform: translate(0%, -50%); } /*-------------------------------------------------------------- notice --------------------------------------------------------------*/ .index-notice .notice-action { flex-shrink: 0; } .index-notice .notice-icon { position: relative; width: 25px; height: 25px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNjE5NDIzNTQ0MTMzIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9Ijg2MSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4Ij48ZGVmcz48c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwvc3R5bGU+PC9kZWZzPjxwYXRoIGQ9Ik02MTEuNTU1NTU2IDU3My42Mjk2M20tNDAyLjk2Mjk2MyAwYTQwMi45NjI5NjMgNDAyLjk2Mjk2MyAwIDEgMCA4MDUuOTI1OTI2IDAgNDAyLjk2Mjk2MyA0MDIuOTYyOTYzIDAgMSAwLTgwNS45MjU5MjYgMFoiIGZpbGw9IiNmMDRhNGMiIGZpbGwtb3BhY2l0eT0iLjEiIHAtaWQ9Ijg2MiIgZGF0YS1zcG0tYW5jaG9yLWlkPSJhMzEzeC43NzgxMDY5LjAuaTIiIGNsYXNzPSJzZWxlY3RlZCI+PC9wYXRoPjxwYXRoIGQ9Ik0xNjEuMTg1MTg1IDg3Mi4yOTYyOTZsMjk0LjM1MjU5My0wLjAyODQ0NCA0LjMxNDA3NCAwLjAyODQ0NEM2NjYuNjkwMzcgODcyLjI5NjI5NiA4MzQuMzcwMzcgNzA0LjYxNjI5NiA4MzQuMzcwMzcgNDk3Ljc3Nzc3OFM2NjYuNjkwMzcgMTIzLjI1OTI1OSA0NTkuODUxODUyIDEyMy4yNTkyNTkgODUuMzMzMzMzIDI5MC45MzkyNTkgODUuMzMzMzMzIDQ5Ny43Nzc3Nzh2Mjk5LjczODA3NEE3NS44NTE4NTIgNzUuODUxODUyIDAgMCAwIDE2MS4xODUxODUgODcyLjI5NjI5NnpNOS40ODE0ODEgNTAyLjMwMDQ0NGwwLjAwOTQ4Mi0yLjg3Mjg4OEw5LjQ4MTQ4MSA0OTcuNzc3Nzc4QzkuNDgxNDgxIDI0OS4wNDA1OTMgMjExLjEyNDE0OCA0Ny40MDc0MDcgNDU5Ljg1MTg1MiA0Ny40MDc0MDcgNzA4LjU4OTAzNyA0Ny40MDc0MDcgOTEwLjIyMjIyMiAyNDkuMDQwNTkzIDkxMC4yMjIyMjIgNDk3Ljc3Nzc3OFM3MDguNTg5MDM3IDk0OC4xNDgxNDggNDU5Ljg1MTg1MiA5NDguMTQ4MTQ4Yy0xLjcxNjE0OCAwLTMuNDQxNzc4LTAuMDA5NDgxLTQuNzQwNzQxLTAuMDI4NDQ0TDE2MS4xODUxODUgOTQ4LjE0ODE0OEM3Ny40MTYyOTYgOTQ4LjE0ODE0OCA5LjQ4MTQ4MSA4ODAuMjQxNzc4IDkuNDgxNDgxIDc5Ni40NTM5MjZWNTAyLjMwMDQ0NHoiIGZpbGw9IiNmMDRhNGMiIHAtaWQ9Ijg2MyIgZGF0YS1zcG0tYW5jaG9yLWlkPSJhMzEzeC43NzgxMDY5LjAuaTAiIGNsYXNzPSIiPjwvcGF0aD48cGF0aCBkPSJNMjg3LjMzNjI5NiA0NzQuMDc0MDc0QzI1OS42MDI5NjMgNDc0LjA3NDA3NCAyMzcuMDM3MDM3IDQ1Mi44ODI5NjMgMjM3LjAzNzAzNyA0MjYuNjY2NjY3czIyLjU1NjQ0NC00Ny40MDc0MDcgNTAuMjk5MjU5LTQ3LjQwNzQwOGgzMjYuMDY4MTQ4QzY0MS4xMzc3NzggMzc5LjI1OTI1OSA2NjMuNzAzNzA0IDQwMC40NTAzNyA2NjMuNzAzNzA0IDQyNi42NjY2NjdzLTIyLjU1NjQ0NCA0Ny40MDc0MDctNTAuMjk5MjYgNDcuNDA3NDA3aC0zMjYuMDY4MTQ4ek0yODkuOTA1Nzc4IDY2My43MDM3MDRDMjYwLjc2OTE4NSA2NjMuNzAzNzA0IDIzNy4wMzcwMzcgNjQyLjUzMTU1NiAyMzcuMDM3MDM3IDYxNi4yOTYyOTZzMjMuNzMyMTQ4LTQ3LjQwNzQwNyA1Mi44Njg3NDEtNDcuNDA3NDA3aDE1MC4yNjI1MThDNDY5LjMwNDg4OSA1NjguODg4ODg5IDQ5My4wMzcwMzcgNTkwLjA2MTAzNyA0OTMuMDM3MDM3IDYxNi4yOTYyOTZzLTIzLjczMjE0OCA0Ny40MDc0MDctNTIuODY4NzQxIDQ3LjQwNzQwOEgyODkuOTA1Nzc4eiIgZmlsbD0iI2YwNGE0YyIgcC1pZD0iODY0IiBkYXRhLXNwbS1hbmNob3ItaWQ9ImEzMTN4Ljc3ODEwNjkuMC5pMSIgY2xhc3M9IiI+PC9wYXRoPjwvc3ZnPg=="); flex-shrink: 0; } .index-notice .notice-content { position: relative; z-index: 2; } .notice-goto { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } @media (max-width: 767.98px) { .index-notice .notice-icon { width: 16px; height: 16px; } .index-notice .notice-content { font-size: 11px; } } /*-------------------------------------------------------------- Popup --------------------------------------------------------------*/ @media (max-width: 767.98px) { .nice-popup-md .nice-popup-content { padding: 16px; } } /*-------------------------------------------------------------- Popup wrap --------------------------------------------------------------*/ #search-popup-wrap, #author-popup-wrap { display: none; } /*-------------------------------------------------------------- Fixed post --------------------------------------------------------------*/ .fixed-to-top { position: fixed; right: 35px; bottom: 35px; z-index: 1000; } #back-to-top { transition: all 0.3s ease; opacity: 0; visibility: hidden; } #back-to-top.current { opacity: 1; visibility: visible; } /*-------------------------------------------------------------- Banner navigation --------------------------------------------------------------*/ .slider-navigation .swiper-container .swiper-button-next, .slider-navigation .swiper-container .swiper-button-prev { opacity: 0; width: calc(var(--swiper-navigation-mini-size) / 30 * 25); height: var(--swiper-navigation-mini-size); transition: all 0.3s linear; } .slider-navigation .swiper-container .swiper-button-next:after, .slider-navigation .swiper-container .swiper-button-prev:after { font-size: var(--swiper-navigation-mini-size); } .slider-navigation .swiper-container .swiper-button-next { right: -100px; } .slider-navigation .swiper-container .swiper-button-prev { left: -100px; } .slider-navigation .swiper-container .swiper-button-next, .slider-navigation .swiper-container .swiper-button-prev, .slider-navigation .swiper-container .swiper-button-next:focus, .slider-navigation .swiper-container .swiper-button-prev:focus { -webkit-appearance: none; -moz-appearance: none; outline: none; } .slider-navigation .swiper-container:hover .swiper-button-next { opacity: 1; right: 10px; } .slider-navigation .swiper-container:hover .swiper-button-prev { opacity: 1; left: 10px; } /*-------------------------------------------------------------- Banner pagination --------------------------------------------------------------*/ .slider-navigation .swiper-pagination-bullet { -webkit-appearance: none; -moz-appearance: none; outline: none !important; box-shadow: none !important; } .slider-navigation .swiper-pagination-white .swiper-pagination-bullet { width: 5px; height: 5px; border-radius: 5px; background-color: #fff; transition: all 0.5s; } .slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { padding: 10px 0; bottom: 0; } .slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet-active { width: 30px; } @media (max-width: 767.98px) { .slider-navigation .swiper-horizontal > .swiper-pagination-bullets { bottom: 0; } .slider-navigation .swiper-pagination-white .swiper-pagination-bullet { width: 4px; height: 4px; } .slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet-active { width: 20px; } .slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { padding: 0; } } /*-------------------------------------------------------------- Banner style --------------------------------------------------------------*/ .slider-style-3 .swiper-container { padding: 32px 0; } .slider-style-3 .swiper-slide { width: 1260px; transition: all 300ms ease-in-out; } .slider-style-3 .swiper-slide.swiper-slide-prev, .slider-style-3 .swiper-slide.swiper-slide-next { transform: scaleY(0.95); } .slider-style-3 .swiper-slide.swiper-slide-active { transform: scaleY(1); z-index: 1; } .slider-style-3.slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { padding: 10px 0; bottom: 30px; } @media (max-width: 1199.98px) { .slider-style-2 .swiper-slide .media-4x1:after { padding-top: 33%; } } @media (max-width: 767.98px) { .slider-style-4 .swiper-slide .media-3x1:after { padding-top: 50%; } } @media (max-width: 767.98px) { .slider-style-3 .swiper-container { padding: 12px; } .slider-style-3 .swiper-slide { width: 100%; } .slider-style-1 .swiper-slide .h2, .slider-style-2 .swiper-slide .h2, .slider-style-3 .swiper-slide .h2, .slider-style-4 .swiper-slide .h2 { font-size: 15px; } .slider-style-3.slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 5px; } } @media (min-width: 768px) and (max-width: 991.98px) { .slider-style-3 .swiper-container { padding: 24px 0; } .slider-style-3 .swiper-slide { width: 696px; } .slider-style-1 .swiper-slide .h2, .slider-style-2 .swiper-slide .h2, .slider-style-3 .swiper-slide .h2, .slider-style-4 .swiper-slide .h2 { font-size: 20px; } .slider-style-3.slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 30px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .slider-style-3 .swiper-container { padding: 24px 0; } .slider-style-3 .swiper-slide { width: 940px; } .slider-style-3.slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 30px; } } @media (min-width: 1200px) and (max-width: 1399.98px) { .slider-style-3 .swiper-container { padding: 32px 0; } .slider-style-3 .swiper-slide { width: 1110px; } .slider-style-3.slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 30px; } } @media (min-width: 1400px) { .slider-style-3 .swiper-container { padding: 32px 0; } .slider-style-3 .swiper-slide { width: 1260px; } .slider-style-3.slider-navigation .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 30px; } } /*-------------------------------------------------------------- Friends list --------------------------------------------------------------*/ .friends-menu ul li { margin-bottom: 10px; } .friends-menu ul li:last-child { margin-bottom: 0; } .friends-menu ul li a { display: flex; align-items: center; padding: 10px 15px; border-radius: var(--border-radius-sm); } .friends-menu ul li a .menu-icon { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; font-size: 16px; margin-right: 8px; } .friends-menu ul li a .menu-text { flex: 1 1 auto; } .friends-menu ul li.active a, .friends-menu ul li a:hover { color: var(--color-primary); background-color: var(--outline-primary); } .friends-icon { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; font-size: 24px; margin-right: 8px; } .friends-grid { margin-bottom: 32px; } .friends-grid:last-child { margin-bottom: 0; } .friends-list .item { flex: 1 1 auto; transition: all 0.3s ease-in-out; } .friends-list .item:hover { transform: translateY(-5px); } .friends-list .item .media { flex-shrink: 0; } .friends-list .item .item-goto { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; } @media (max-width: 767.98px) { .friends-grid { margin-bottom: 20px; } } /* -------------------------------- author info -------------------------------- */ .author-info { position: relative; } .author-info .author-poster .poster-text { font-size: 5em; font-style: italic; opacity: .1; } .author-info .author-info-content { position: relative; z-index: 2; margin-top: -75px; } .author-info .author-info-content .author-avatar { position: relative; left: 50%; width: 150px; height: 150px; transform: translate(-50%, 0%); } .author-info .author-info-content .author-avatar .avatar-badge { width: 30px; height: 30px; transform: translate(-25%, -25%); } .author-info .author-info-content .author-desc { max-width: 60%; margin-left: auto; margin-right: auto; } .author-name-mw { max-width: 60px; } @media (min-width: 768px) and (max-width: 1199.98px) { .author-info .author-info-content .author-desc { max-width: 80%; } } @media (max-width: 767.98px) { .author-info .author-poster::after { padding-top: 40%; } .author-info .author-poster .poster-text { font-size: 3em; } .author-info .author-info-content { margin-top: -40px; } .author-info .author-info-content .author-avatar { width: 80px; height: 80px; } .author-info .author-info-content .author-desc { max-width: 100%; } } /*-------------------------------------------------------------- author tabmenu --------------------------------------------------------------*/ .author-tabmenu { position: relative; display: flex; justify-content: center; } .author-tabmenu ul { display: flex; justify-content: center; padding: 6px; gap: 6px; background-color: var(--bg-light); border: 1px solid var(--gray-3); border-radius: var(--border-radius-md); } .author-tabmenu ul li a { position: relative; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; min-width: 130px; padding: 10px 20px; color: var(--color-muted); } .author-tabmenu ul li.active a { color: var(--color-dark); } .author-tabmenu ul li a::before { position: absolute; content: ''; display: block; top: 15%; bottom: 15%; left: 15%; right: 15%; border-radius: var(--border-radius-sm); background: #fff; transition: all 0.2s linear; opacity: 0; } .author-tabmenu ul li.active a::before, .author-tabmenu ul li a:hover::before { transition: 0.2s; top: 0; bottom: 0; left: 0; right: 0; opacity: 1; } .author-tabmenu .nav-text { position: relative; margin: 0 8px; } .author-tabmenu .nav-icon { position: relative; font-size: 20px; } .author-tabmenu .nav-num { position: relative; min-width: 15px; font-size: 11px; line-height: 1; text-align: center; padding: 2px 3px; background-color: var(--bg-muted); color: #fff; border-radius: 4px; } @media (max-width: 767.98px) { .author-tabmenu ul { width: 100%; } .author-tabmenu ul li { width: 50%; } .author-tabmenu ul li a { justify-content: center; min-width: 0; padding: 8px 2px; } } /* --------------------------------------------------- loading spinners ----------------------------------------------------- */ .loading-spinners { position: relative; display: none; width: 32px; height: 32px; border: 4px solid rgba(0, 0, 0, 0.2); border-top: 4px solid var(--color-dark); border-radius: 50%; margin: 20px auto; -webkit-animation: spCircRot 0.6s infinite linear; animation: spCircRot 0.6s infinite linear; } .loading-spinners.spinners-sm { width: 24px; height: 24px; border-width: 3px; margin: 0 auto; } .btn .loading-spinners { display: block; } @-webkit-keyframes spCircRot { from { transform: rotate(0deg); } to { transform: rotate(359deg); } } @keyframes spCircRot { from { transform: rotate(0deg); } to { transform: rotate(359deg); } } /*-------------------------------------------------------------- Content error style --------------------------------------------------------------*/ .error-empty { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; } .error-empty .error-icon { max-width: 300px; width: 100% } /*-------------------------------------------------------------- Apollo style --------------------------------------------------------------*/ .apollo-svg-no-safe { display: block; width: 64px; height: 64px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjggMTI4Ij48cGF0aCBkPSJNMzAuMiAxMDkuOGMwIDMuMiAxNS4xIDUuNyAzMy44IDUuN3MzMy44LTIuNiAzMy44LTUuN2MwLTMuMi0xNS4xLTUuNy0zMy44LTUuN3MtMzMuOCAyLjUtMzMuOCA1Ljd6IiBmaWxsPSIjYjhlNGNmIi8+PHBhdGggZD0iTTY2LjQgMTNjNS41IDIuNCAxMS44IDQuOCAxOC43IDcuMiA2LjUgMi4yIDEzIDQuMiAxOS43IDUuOSAyLjUuNyA0LjIgMi45IDQuMiA1LjR2MjIuMWMwIDE2LjYtOCAzMi4xLTIxLjUgNDEuN2wtMjAuMiAxNC40Yy0yIDEuNC00LjYgMS40LTYuNSAwTDQwLjUgOTUuNEMyNyA4NS44IDE5IDcwLjIgMTkgNTMuNnYtMjJjMC0yLjYgMS44LTQuOSA0LjMtNS41IDguNi0yLjEgMTUuNy00LjEgMjEuMy02IDUuOC0yIDExLjUtNC4zIDE3LTcuMSAxLjUtLjYgMy4zLS43IDQuOCAwem0tNiA0NC40TDUzLjEgNTBjLTItMi01LjItMi03LjItLjFsLS4xLjFjLTIgMi0yIDUuNCAwIDcuNGwxMC45IDExLjFjMiAyIDUuMiAyIDcuMi4xbC4xLS4xTDgyLjIgNTBjMi0yIDItNS40IDAtNy40cy01LjItMi03LjItLjFsLS4xLjEtMTQuNSAxNC44eiIgZmlsbD0iIzRkYmI4OCIvPjwvc3ZnPg=='); } .apollo-svg-remind { display: block; width: 64px; height: 64px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlLz48L2RlZnM+PHBhdGggZD0iTTUxMiA3Ni44Yy0yMzYuOCAwLTQzNS4yIDE5Mi00MzUuMiA0MzUuMnMxOTIgNDM1LjIgNDM1LjIgNDM1LjIgNDM1LjItMTkyIDQzNS4yLTQzNS4yUzc0OC44IDc2LjggNTEyIDc2Ljh6bTI0OS42IDMyMEw0ODAgNzA0Yy0xMi44IDEyLjgtMzguNCAxMi44LTUxLjIgMEwyODggNTU2LjhjLTEyLjgtMTIuOC0xMi44LTM4LjQgMC01MS4yIDEyLjgtMTIuOCAzOC40LTEyLjggNTEuMiAwbDExNS4yIDExNS4yTDcwNCAzMzkuMmMxMi44LTEyLjggMzguNC0xMi44IDUxLjIgMCAyNS42IDEyLjggMjUuNiAzOC40IDYuNCA1Ny42eiIgZmlsbD0iIzY4RDI3OSIvPjxwYXRoIGQ9Ik03MTAuNCAzMzkuMmwtMjU2IDI4MS42LTExNS4yLTExNS4yYy0xMi44LTEyLjgtMzguNC0xMi44LTUxLjIgMC0xMi44IDEyLjgtMTIuOCAzOC40IDAgNTEuMmwxNDcuMiAxNDAuOGMxMi44IDEyLjggMzguNCAxMi44IDUxLjIgMEw3NjggMzkwLjRjMTIuOC0xMi44IDEyLjgtMzguNCAwLTUxLjItMTkuMi0xMi44LTQ0LjgtMTIuOC01Ny42IDB6IiBmaWxsPSIjRkZGIi8+PC9zdmc+'); } .apollo-svg-mail { display: block; width: 64px; height: 64px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlLz48L2RlZnM+PHBhdGggZD0iTTY0IDUxMmE0NDggNDQ4IDAgMTA4OTYgMCA0NDggNDQ4IDAgMTAtODk2IDB6IiBmaWxsPSIjNjA4QkU5Ii8+PHBhdGggZD0iTTIyNCAzMDJoNTc2cTMyIDAgMzIgMzJ2MzU2cTAgMzItMzIgMzJIMjI0cS0zMiAwLTMyLTMyVjMzNHEwLTMyIDMyLTMyeiIgZmlsbD0iI0VBRURGNSIvPjxwYXRoIGQ9Ik0yMjQgNzIyaDU3NmMxNy42NzMgMCAzMi0xNC4zMjcgMzItMzJ2LTU4QzY2MC45NiA0OTMuMzMzIDU1NC4yOTQgNDI0IDUxMiA0MjRjLTQyLjI5NCAwLTE0OC45NiA2OS4zMzMtMzIwIDIwOHY1OGMwIDE3LjY3MyAxNC4zMjcgMzIgMzIgMzJ6IiBmaWxsPSIjQ0NEQUY3Ii8+PHBhdGggZD0iTTIyNCAzMDJoNTc2YzE3LjY3MyAwIDMyIDE0LjMyNyAzMiAzMnY1OEM2NTEuMzUgNTE3LjMzMyA1NDQuNjgzIDU4MCA1MTIgNTgwYy0zMi42ODMgMC0xMzkuMzUtNjIuNjY3LTMyMC0xODh2LTU4YzAtMTcuNjczIDE0LjMyNy0zMiAzMi0zMnoiIGZpbGw9IiNGRkYiLz48L3N2Zz4='); } .apollo-svg-set { display: block; width: 64px; height: 64px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlLz48L2RlZnM+PHBhdGggZD0iTTAgNTEyYTUxMiA1MTIgMCAxMDEwMjQgMEE1MTIgNTEyIDAgMTAwIDUxMnoiIGZpbGw9IiNEQkRCREIiLz48cGF0aCBkPSJNODYzLjg4MzYzNiA0ODguNzI3MjczbC02Mi44MzYzNjMtMTAuOTM4MTgyYTI4OS41MTI3MjcgMjg5LjUxMjcyNyAwIDAwLTIxLjQxMDkwOS03OC4xOTYzNjRMODI4Ljk3NDU0NSAzNTguNGEyNC42NjkwOTEgMjQuNjY5MDkxIDAgMDAtMjMuMjcyNzI3LTQyLjM1NjM2NGwtNjEuMjA3MjczIDIzLjI3MjcyOGEyOTIuNzcwOTA5IDI5Mi43NzA5MDkgMCAwMC01Ni43ODU0NTQtNTYuMDg3MjczbDIzLjI3MjcyNy02MS42NzI3MjdhMjQuNjY5MDkxIDI0LjY2OTA5MSAwIDAwLTQyLjM1NjM2My0yMy4yNzI3MjhsLTQyLjEyMzYzNyA1MC41MDE4MTlhMjg5Ljc0NTQ1NSAyODkuNzQ1NDU1IDAgMDAtNzYuOC0yMC4yNDcyNzNsLTE0LjQyOTA5MS02OC40MjE4MThhMjQuNjY5MDkxIDI0LjY2OTA5MSAwIDAwLTQ4Ljg3MjcyNyAwTDQ3NC45OTYzNjQgMjI1LjI4YTI4OS43NDU0NTUgMjg5Ljc0NTQ1NSAwIDAwLTc2LjggMjAuMjQ3MjczbC00MC45Ni01MC41MDE4MThBMjQuNjY5MDkxIDI0LjY2OTA5MSAwIDAwMzE0Ljg4IDIxOC4yOTgxODJsMjMuMjcyNzI3IDYxLjY3MjcyN2EyOTIuNzcwOTA5IDI5Mi43NzA5MDkgMCAwMC01Ni43ODU0NTQgNTYuMDg3MjczTDIyMC4xNiAzMTIuNzg1NDU1YTI0LjY2OTA5MSAyNC42NjkwOTEgMCAwMC0yMy4yNzI3MjcgNDIuMzU2MzYzbDQ5LjMzODE4MiA0MS4xOTI3MjdhMjg5LjUxMjcyNyAyODkuNTEyNzI3IDAgMDAtMjEuNDEwOTEgNzguMTk2MzY0bC02NC42OTgxODEgMTQuMTk2MzY0YTI0LjY2OTA5MSAyNC42NjkwOTEgMCAwMDAgNDguODcyNzI3bDYyLjEzODE4MSAxMC43MDU0NTVhMjg5Ljc0NTQ1NSAyODkuNzQ1NDU1IDAgMDAyMC40OCA3OS44MjU0NTRsLTQ3LjcwOTA5IDM4LjYzMjcyN0EyNC42NjkwOTEgMjQuNjY5MDkxIDAgMDAyMTguMjk4MTgyIDcwOS4xMkwyNzYuNDggNjg3LjcwOTA5MWEyOTIuNzcwOTA5IDI5Mi43NzA5MDkgMCAwMDU4LjQxNDU0NSA1OS4xMTI3MjdsLTIxLjE3ODE4MSA1Ny43MTYzNjRhMjQuNjY5MDkxIDI0LjY2OTA5MSAwIDAwNDIuMzU2MzYzIDIzLjI3MjcyN2wzOC44NjU0NTUtNDYuNTQ1NDU0YTI4OS43NDU0NTUgMjg5Ljc0NTQ1NSAwIDAwODAuOTg5MDkxIDIxLjY0MzYzNmwxMi44IDYwLjk3NDU0NWEyNC42NjkwOTEgMjQuNjY5MDkxIDAgMDA0OC44NzI3MjcgMGwxMC40NzI3MjctNTkuODEwOTA5YTI4OS43NDU0NTUgMjg5Ljc0NTQ1NSAwIDAwODAuMjkwOTA5LTIxLjg3NjM2M2wzOC44NjU0NTUgNDYuNTQ1NDU0YTI0LjY2OTA5MSAyNC42NjkwOTEgMCAwMDQyLjM1NjM2NC0yMy4yNzI3MjdsLTIxLjE3ODE4Mi01Ny43MTYzNjRBMjkyLjc3MDkwOSAyOTIuNzcwOTA5IDAgMDA3NDYuODIxODE4IDY4OC42NGw1OC4xODE4MTggMjEuNDEwOTA5YTI0LjY2OTA5MSAyNC42NjkwOTEgMCAwMDIzLjI3MjcyOC00Mi4zNTYzNjRsLTQ3LjcwOTA5MS0zOS43OTYzNjNhMjg5Ljc0NTQ1NSAyODkuNzQ1NDU1IDAgMDAyMC40OC03OS44MjU0NTVsNjIuODM2MzYzLTEyLjhhMjQuNjY5MDkxIDI0LjY2OTA5MSAwIDAwMC00OC44NzI3Mjd6TTcyMS40NTQ1NDUgNTE0LjU2YTIwOS40NTQ1NDUgMjA5LjQ1NDU0NSAwIDAxLTE2LjA1ODE4MSA4MC43NTYzNjRsLTE3MC4xMjM2MzctOTguNDQzNjM3VjMwNi41MDE4MThBMjA5LjQ1NDU0NSAyMDkuNDU0NTQ1IDAgMDE3MjEuNDU0NTQ1IDUxNC41NnpNNDg4LjcyNzI3MyAzMDYuNTAxODE4djE5MC44MzYzNjRsLTE2OS40MjU0NTUgOTcuNzQ1NDU0YTIwOS40NTQ1NDUgMjA5LjQ1NDU0NSAwIDAxMTY5LjQyNTQ1NS0yODguNTgxODE4ek01MTIgNzI0LjAxNDU0NWEyMDkuNDU0NTQ1IDIwOS40NTQ1NDUgMCAwMS0xNzAuNTg5MDkxLTg4LjIwMzYzNkw1MTIgNTM3LjM2NzI3M2wxNzAuNTg5MDkxIDk4LjQ0MzYzNkEyMDkuNDU0NTQ1IDIwOS40NTQ1NDUgMCAwMTUxMiA3MjQuMDE0NTQ1eiIgZmlsbD0iIzhFOEU4RSIvPjwvc3ZnPg=='); } .apollo-svg-message { display: block; width: 64px; height: 64px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlLz48L2RlZnM+PHBhdGggZD0iTTY0IDUxMmE0NDggNDQ4IDAgMTA4OTYgMCA0NDggNDQ4IDAgMTAtODk2IDB6IiBmaWxsPSIjNTdFMDg3Ii8+PHBhdGggZD0iTTUxMiAyNTZjMTQxLjM4NSAwIDI1NiAxMTQuNjE1IDI1NiAyNTZTNjUzLjM4NSA3NjggNTEyIDc2OEgyOTJjLTE5Ljg4MiAwLTM2LTE2LjExOC0zNi0zNlY1MTJjMC0xNDEuMzg1IDExNC42MTUtMjU2IDI1Ni0yNTZ6IiBmaWxsPSIjRkZGIi8+PHBhdGggZD0iTTYwOCA1MTJhMzIgMzIgMCAxMDY0IDAgMzIgMzIgMCAxMC02NCAwek00ODAgNTEyYTMyIDMyIDAgMTA2NCAwIDMyIDMyIDAgMTAtNjQgMHpNMzUyIDUxMmEzMiAzMiAwIDEwNjQgMCAzMiAzMiAwIDEwLTY0IDB6IiBmaWxsPSIjNDJEQTc3Ii8+PHBhdGggZD0iTTI1NiA1NzZjMTIuOTE2IDUxLjU4MyAzNC45MTYgOTIuOTE2IDY2IDEyNCAzMS4wODQgMzEuMDg0IDczLjA4NCA1My43NSAxMjYgNjhIMjkyYy0xOS44ODIgMC0zNi0xNi4xMTgtMzYtMzZWNTc2eiIgZmlsbD0iI0YyRjVGMyIvPjwvc3ZnPg=='); } .apollo-svg-check-wait { background-size: contain; background-position: center; background-repeat: no-repeat; vertical-align: middle; width: 64px; height: 64px; display: inline-block; background-image: url('data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlLz48L2RlZnM+PHBhdGggZD0iTTgzMiAxMDI0SDE5MkM4NS45NTQgMTAyNCAwIDkzOC4wNDYgMCA4MzJWMTkyQzAgODUuOTU0IDg1Ljk1NCAwIDE5MiAwaDY0MGMxMDYuMDQ2IDAgMTkyIDg1Ljk1NCAxOTIgMTkydjY0MGMwIDEwNi4wNDYtODUuOTU0IDE5Mi0xOTIgMTkyem0wIDAiIGZpbGw9IiNGRkY5REQiLz48cGF0aCBkPSJNNTU0LjY1NiAzNjIuNjU2YzAgNTguOTA2LTQ3Ljc1IDEwNi42NTYtMTA2LjY1NiAxMDYuNjU2cy0xMDYuNjU2LTQ3Ljc1LTEwNi42NTYtMTA2LjY1NlMzODkuMDk0IDI1NiA0NDggMjU2czEwNi42NTYgNDcuNzUgMTA2LjY1NiAxMDYuNjU2em0tOTYgMjY2LjY4OGMwLTQ1LjQzOCAxNy45ODQtODYuNzIgNDcuMDQtMTE3LjM0NEgzNTcuMzEyQzMwMS40NjggNTEyIDI1NiA1NTcuNDY4IDI1NiA2MTMuMzQ0VjY4OGMwIDguODI4IDcuMTcyIDE2IDE2IDE2aDIwNC4wOTRjLTExLjA0LTIyLjU5NC0xNy40MzgtNDcuODc2LTE3LjQzOC03NC42NTZ6bTAgMCIgZmlsbD0iI0ZGRDIwMCIvPjxwYXRoIGQ9Ik02MjkuMzQ0IDQ5MC42NTZjLTc2LjQ0NiAwLTEzOC42NTYgNjIuMjEyLTEzOC42NTYgMTM4LjY1NlM1NTIuODY4IDc2OCA2MjkuMzQ0IDc2OCA3NjggNzA1Ljc5IDc2OCA2MjkuMzQ0cy02Mi4yMS0xMzguNjg4LTEzOC42NTYtMTM4LjY4OHptNDcuMDcgMTg1Ljc1OGEyMS4yNTQgMjEuMjU0IDAgMDEtMTUuMDcgNi4yNDJjLTUuNDY4IDAtMTAuOTE0LTIuMDc4LTE1LjA3LTYuMjQybC0zMi0zMmEyMS4xODQgMjEuMTg0IDAgMDEtNi4yNzQtMTUuMDdWNTc2YzAtMTEuNzc0IDkuNTctMjEuMzQ0IDIxLjM0NC0yMS4zNDRzMjEuMzQ0IDkuNTQgMjEuMzQ0IDIxLjM0NHY0NC41MTZsMjUuNzU4IDI1Ljc1OGM4LjI4OCA4LjMyIDguMjg4IDIxLjgyLS4wMzIgMzAuMTR6bTAgMCIgZmlsbD0iI0ZGRTc3NyIvPjwvc3ZnPg=='); } .apollo-svg-check-pass { background-size: contain; background-position: center; background-repeat: no-repeat; vertical-align: middle; width: 64px; height: 64px; display: inline-block; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjggMTI4Ij48cGF0aCBkPSJNMTA0IDEyOEgyNGMtMTMuMyAwLTI0LTEwLjctMjQtMjRWMjRDMCAxMC43IDEwLjcgMCAyNCAwaDgwYzEzLjMgMCAyNCAxMC43IDI0IDI0djgwYzAgMTMuMy0xMC43IDI0LTI0IDI0eiIgZmlsbD0iI2ZmZTZlMiIvPjxwYXRoIGQ9Ik02OS4zIDQ1LjNjMCA3LjQtNiAxMy4zLTEzLjMgMTMuM3MtMTMuMy02LTEzLjMtMTMuM1M0OC42IDMyIDU2IDMyczEzLjMgNiAxMy4zIDEzLjN6bS0xMiAzMy40YzAtNS43IDIuMi0xMC44IDUuOS0xNC43SDQ0LjdjLTcgMC0xMi43IDUuNy0xMi43IDEyLjdWODZjMCAxLjEuOSAyIDIgMmgyNS41Yy0xLjQtMi44LTIuMi02LTIuMi05LjN6IiBmaWxsPSIjZmM1NzNiIi8+PHBhdGggZD0iTTc4LjcgNjEuM2MtOS42IDAtMTcuMyA3LjgtMTcuMyAxNy4zUzY5LjEgOTYgNzguNyA5NiA5NiA4OC4yIDk2IDc4LjdzLTcuOC0xNy40LTE3LjMtMTcuNHptOCAxNC40bC04LjcgMTBjLS41LjYtMS4yLjktMS45LjlINzZjLS43IDAtMS40LS4zLTEuOS0uOGwtNC43LTQuN2MtMS0xLTEtMi43IDAtMy44czIuNy0xIDMuOCAwbDIuNiAyLjYgNi44LTcuOGMxLTEuMSAyLjYtMS4yIDMuOC0uMyAxLjEgMS4xIDEuMiAyLjguMyAzLjl6IiBmaWxsPSIjZmQ5MDdlIi8+PC9zdmc+'); } .apollo-svg-check-error { background-size: contain; background-position: center; background-repeat: no-repeat; vertical-align: middle; width: 64px; height: 64px; display: inline-block; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjggMTI4Ij48cGF0aCBkPSJNMTA0IDEyOEgyNGMtMTMuMyAwLTI0LTEwLjctMjQtMjRWMjRDMCAxMC43IDEwLjcgMCAyNCAwaDgwYzEzLjMgMCAyNCAxMC43IDI0IDI0djgwYzAgMTMuMy0xMC43IDI0LTI0IDI0eiIgZmlsbD0iI2ZmZTZlMiIvPjxwYXRoIGQ9Ik02OS4zIDQ1LjNjMCA3LjQtNiAxMy4zLTEzLjMgMTMuM3MtMTMuMy02LTEzLjMtMTMuM1M0OC42IDMyIDU2IDMyczEzLjMgNiAxMy4zIDEzLjN6bS0xMiAzMy40YzAtNS43IDIuMi0xMC44IDUuOS0xNC43SDQ0LjdjLTcgMC0xMi43IDUuNy0xMi43IDEyLjdWODZjMCAxLjEuOSAyIDIgMmgyNS41Yy0xLjQtMi44LTIuMi02LTIuMi05LjN6IiBmaWxsPSIjZmM1NzNiIi8+PHBhdGggZD0iTTkxIDY2LjRjLTYuOC02LjgtMTcuOC02LjgtMjQuNSAwLTYuOCA2LjgtNi44IDE3LjggMCAyNC41IDYuOCA2LjggMTcuOCA2LjggMjQuNSAwIDYuNy02LjggNi43LTE3LjcgMC0yNC41em0tOSAxOS4zbC0zLjMtMy4zLTMuMyAzLjNjLTEgMS0yLjcgMS0zLjggMC0xLTEtMS0yLjcgMC0zLjhsMy4zLTMuMy0zLjMtMy4zYy0xLTEtMS0yLjcgMC0zLjggMS0xIDIuNy0xIDMuOCAwbDMuMyAzLjMgMy4zLTMuM2MxLTEgMi43LTEgMy44IDAgMSAxIDEgMi43IDAgMy44bC0zLjMgMy4zIDMuMyAzLjNjMSAxIDEgMi43IDAgMy44LTEuMSAxLjEtMi44IDEuMS0zLjggMHoiIGZpbGw9IiNmZDkwN2UiLz48L3N2Zz4='); } /*-------------------------------------------------------------- apollo user sign style --------------------------------------------------------------*/ .apollo-sign-container { position: relative; display: flex; flex-direction: row; overflow: hidden; height: 100vh; } .apollo-sign-container .sign-cover { position: relative; flex-grow: 0; width: 450px; } @media (min-width: 992px) and (max-width: 1199.98px) { .apollo-sign-container .sign-cover { width: 320px; } } @media (min-width: 1400px) { .apollo-sign-container .sign-cover { width: 60%; } } .apollo-sign-container .sign-content { position: relative; display: flex; flex: 1; flex-direction: column; overflow: auto; width: 100%; background: var(--bg-white); } .apollo-sign-container .sign-body { display: flex; flex-grow: 1; align-items: center; justify-content: center; margin: 0; padding: 0; } .apollo-sign-container .sign-box { width: 100%; max-width: 450px; padding: 48px; } @media (min-width: 768px) and (max-width: 1198.99px) { .apollo-sign-container .sign-box { margin: 0 auto; } } .apollo-sign-container .sign-logo { max-width: 300px; max-height: 60px; } .apollo-sign-container .sign-logo.dark { display: none; } .apollo-sign-container .sign-qrcode { text-align: center; } .apollo-sign-container .sign-qrcode img { max-width: 300px; } .apollo-sign-container .sign-footer a { color: var(--color-primary) } .apollo-sign-container .sign-footer a:hover { opacity: .8 } .apollo-sign-container .sign-hr { position: relative; display: table; width: 100%; white-space: nowrap; } .apollo-sign-container .sign-hr:after, .apollo-sign-container .sign-hr:before { content: ""; border-top: 1px solid var(--bg-light); display: table-cell; width: 50%; position: relative; top: 10px; } .apollo-sign-container .sign-hr span { position: relative; padding: 0 15px; } .apollo-sign-container .sign-rule { text-decoration: underline; } @media (min-width: 768px) { .apollo-sign-container .sign-box { width: 100%; min-width: 450px; padding: 48px; } } .apollo-sign-container .sige-getpwd { margin: auto; flex: none; } .apollo-sign-container .sign-badge { background-color: var(--outline-primary); color: var(--color-primary); padding: 10px 20px; border-radius: 48px; text-align: center; } /*-------------------------------------------------------------- apollo points style --------------------------------------------------------------*/ .apollo-points-poster, .apollo-points-progress { position: relative; } .apollo-points-progress .progress { border-radius: 160px; height: 10px; background-color: var(--bg-light); } .apollo-points-progress .progress .progress-bar { background: var(--color-primary); background: linear-gradient(to left, #ff522b, #ff9e88); } /*-------------------------------------------------------------- Apollo note style --------------------------------------------------------------*/ .apollo-moment-item { margin-bottom: 24px; } .apollo-moment-item:last-child { margin-bottom: 0; } .apollo-moment-content { line-height: 1.75; } .apollo-moment-action { position: relative; display: flex; align-items: center; } .apollo-moment-info .author-avatar { width: 48px; height: 48px; } .apollo-moment-info .author-avatar .avatar-badge { width: 20px; height: 20px; transform: translate(10%, 10%); } .apollo-moment-info .author-name { display: inline-block; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .apollo-moment-images { position: relative; } .apollo-moment-link { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } @media (max-width: 767.98px) { .apollo-moment-item { margin-bottom: 16px; } } /*-------------------------------------------------------------- apollo dropdown style --------------------------------------------------------------*/ .apollo-moment-dropdown .dropmenu-toggle { position: relative; display: block; opacity: .6; } .apollo-moment-dropdown .dropmenu-toggle:hover, .apollo-moment-dropdown.active .dropmenu-toggle { opacity: 1; } .apollo-moment-dropdown .dropmenu-box { position: absolute; top: 100%; left: 0; width: 100%; padding: 16px; border-radius: var(--border-radius-sm); background-color: var(--bg-white); border: 1px solid var(--border-light); pointer-events: none; z-index: 999; } .apollo-moment-dropdown .dropmenu-box.fadeup { opacity: 0; visibility: hidden; display: block; transform-origin: 0 0 0; transition: all 0.3s ease-out 0s; transform: translateY(15px); box-shadow: 0 0 25px 5px rgba(28, 31, 36, 0.1); } .apollo-moment-dropdown.active .dropmenu-box.fadeup { pointer-events: initial; opacity: 1; visibility: visible; transform: translateY(10px); } @media (min-width: 1200px) { .apollo-moment-dropdown .dropmenu-box { width: 80% } } .apollo-tags-box a { position: relative; display: inline-block; padding: 8px 16px 8px 36px; margin: 4px; color: var(--color-muted); background-color: var(--bg-light); border-radius: var(--border-radius-sm); } .apollo-tags-box a::before { content: ''; display: block; position: absolute; left: 12px; top: 50%; width: 16px; height: 16px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGlkPSLlm77lsYJfMSIgeD0iMCIgeT0iMCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjAwIDIwMCIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjAwIDIwMCI+PHN0eWxlPi5zdDF7ZmlsbDojZmZmfTwvc3R5bGU+PGNpcmNsZSBjeD0iMTAwIiBjeT0iMTAwIiByPSI5OSIgc3R5bGU9ImZpbGw6I2ZmNTIyYiIvPjxwYXRoIGQ9Ik0xNTYuMyA3MC44YzEuNCAwIDIuNiAxLjMgMi43IDN2MTIuN2MwIDEuNy0xLjEgMy0yLjYgMy4xSDUwLjZjLTEuNCAwLTIuNi0xLjMtMi43LTNWNzMuOGMwLTEuNyAxLjEtMyAyLjYtMy4xaDEwNS44em0tLjIgMzcuN2MxLjYgMCAyLjggMS4zIDIuOSAzdjEyLjdjMCAxLjctMS4yIDMtMi44IDMuMUg0MS45Yy0xLjYgMC0yLjgtMS4zLTIuOS0yLjl2LTEyLjdjMC0xLjcgMS4yLTMgMi44LTMuMWwxMTQuMy0uMXoiIGNsYXNzPSJzdDEiLz48cGF0aCBkPSJNNzUuOCA0Ny4xYy4xLTEuNCAxLjYtMi42IDMuMi0yLjdoMTIuN2MxLjcgMCAyLjkgMS4xIDIuOSAyLjZsLTkuOSAxMDUuOGMtLjEgMS40LTEuNSAyLjYtMy4yIDIuN0g2OC44Yy0xLjcgMC0yLjktMS4xLTIuOS0yLjZsOS45LTEwNS44em0zOC4xLTQuMmMuMS0xLjYgMS42LTIuOCAzLjItMi45aDEyLjdjMS43IDAgMi45IDEuMiAyLjkgMi44TDEyMiAxNTcuMWMtLjEgMS42LTEuNiAyLjgtMy4yIDIuOWgtMTIuN2MtMS43IDAtMi45LTEuMi0yLjktMi44bDEwLjctMTE0LjN6IiBjbGFzcz0ic3QxIi8+PC9zdmc+'); transform: translate(0, -50%); z-index: 1; } @-webkit-keyframes apollofadeInUp { from { opacity: 0; transform: translate3d(0, 20%, 0); } to { opacity: 1; transform: none; } } @keyframes apollofadeInUp { from { opacity: 0; transform: translate3d(0, 20%, 0); } to { opacity: 1; transform: none; } } /*-------------------------------------------------------------- user navbar --------------------------------------------------------------*/ .apollo-profile-navbar { position: relative } .apollo-profile-navbar ul li { margin: 32px 0 0 } .apollo-profile-navbar ul li:first-child { margin: 0 } .apollo-profile-navbar ul li .nav-inner { position: relative; display: flex; align-items: center } .apollo-profile-navbar .nav-text { padding: 0 16px; flex: 1 1 auto } .apollo-profile-navbar .nav-icon { width: 42px; height: 42px; display: flex; justify-content: center; align-items: center; flex-shrink: 0; font-size: 20px; background-color: var(--bg-light); border-radius: 50%; } .apollo-profile-navbar .nav-icon i { position: relative; transition: all 0.3s ease-in-out; } .apollo-profile-navbar li:nth-child(1) .nav-icon { background-color: rgba(254, 85, 1, 0.09); color: rgb(254, 85, 1); } .apollo-profile-navbar li:nth-child(2) .nav-icon { background-color: rgb(254 190 1 / 9%); color: rgb(254 190 1); } .apollo-profile-navbar li:nth-child(3) .nav-icon { background-color: rgb(254 85 1 / 9%); color: rgb(254 85 1); } .apollo-profile-navbar li:nth-child(4) .nav-icon { background-color: rgb(255 147 59 / 9%); color: rgb(255 147 59); } .apollo-profile-navbar li:nth-child(5) .nav-icon { background-color: rgb(4 156 255 / 9%); color: rgb(4 156 255); } .apollo-profile-navbar li:nth-child(6) .nav-icon { background-color: rgb(39 164 95 / 9%); color: rgb(39 164 95); } @media (max-width: 767.98px) { .apollo-profile-navbar ul li { margin: 24px 0 0 } } /*-------------------------------------------------------------- user navbar --------------------------------------------------------------*/ .apollo-menu-widget ul { display: flex; flex-direction: column; gap: 16px; } .apollo-menu-widget ul li a { display: flex; align-items: center; color: var(--color-secondary); } .apollo-menu-widget ul li a .item-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; font-size: 18px; margin-right: 8px; } .apollo-menu-widget ul li a:hover, .apollo-menu-widget ul li.active a { color: var(--color-primary); } .apollo-menu-widget ul li.active a .item-icon { color: var(--color-primary); } .apollo-menu-widget ul li a small { position: relative; min-width: 15px; font-size: 11px; line-height: 1; background-color: var(--bg-light); color: var(--color-muted); border-radius: 4px; padding: 2px 3px; margin-left: 4px; text-align: center; } @media (max-width: 991.98px) { .apollo-menu-widget ul { display: flex; justify-content: space-evenly; flex-direction: row; gap: 8px; } .apollo-menu-widget ul li a { flex-direction: column; justify-content: center; padding: 4px; } .apollo-menu-widget ul li a .item-icon { font-size: 24px; margin: 0 0 4px; } .apollo-menu-widget ul li a .item-title { font-size: 14px; } } @media (max-width: 767.98px) { .apollo-menu-widget ul { flex-wrap: nowrap; justify-content: start; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } .apollo-menu-widget ul::-webkit-scrollbar { display: none; } .apollo-menu-widget ul li { flex-shrink: 0; } .apollo-menu-widget ul li a { flex-direction: row; align-items: center; gap: 4px; padding: 4px 12px 4px 6px; background-color: var(--bg-light); border-radius: var(--border-radius-sm); } .apollo-menu-widget ul li.active a { background-color: var(--outline-primary); } .apollo-menu-widget ul li a .item-icon { margin: 0; } } /*-------------------------------------------------------------- apollo user animation style --------------------------------------------------------------*/ @-webkit-keyframes spin { 0% { transform: rotate(0) } 100% { transform: rotate(359deg) } } @keyframes spin { 0% { transform: rotate(0) } 100% { transform: rotate(359deg) } } @-webkit-keyframes burst { 0% { transform: scale(1); opacity: 1 } 90% { transform: scale(1.5); opacity: 0 } } @keyframes burst { 0% { transform: scale(1); opacity: 1 } 90% { transform: scale(1.5); opacity: 0 } } @-webkit-keyframes flashing { 0% { opacity: 1 } 45% { opacity: 0 } 90% { opacity: 1 } } @keyframes flashing { 0% { opacity: 1 } 45% { opacity: 0 } 90% { opacity: 1 } } @-webkit-keyframes fade-left { 0% { transform: translateX(0); opacity: 1 } 75% { transform: translateX(-20px); opacity: 0 } } @keyframes fade-left { 0% { transform: translateX(0); opacity: 1 } 75% { transform: translateX(-20px); opacity: 0 } } @-webkit-keyframes fade-right { 0% { transform: translateX(0); opacity: 1 } 75% { transform: translateX(20px); opacity: 0 } } @keyframes fade-right { 0% { transform: translateX(0); opacity: 1 } 75% { transform: translateX(20px); opacity: 0 } } @-webkit-keyframes fade-up { 0% { transform: translateY(0); opacity: 1 } 75% { transform: translateY(-20px); opacity: 0 } } @keyframes fade-up { 0% { transform: translateY(0); opacity: 1 } 75% { transform: translateY(-20px); opacity: 0 } } @-webkit-keyframes fade-down { 0% { transform: translateY(0); opacity: 1 } 75% { transform: translateY(20px); opacity: 0 } } @keyframes fade-down { 0% { transform: translateY(0); opacity: 1 } 75% { transform: translateY(20px); opacity: 0 } } @-webkit-keyframes tada { from { transform: scale3d(1, 1, 1) } 10%, 20% { transform: scale3d(.95, .95, .95) rotate3d(0, 0, 1, -10deg) } 30%, 50%, 70%, 90% { transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 10deg) } 40%, 60%, 80% { transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg) } to { transform: scale3d(1, 1, 1) } } @keyframes tada { from { transform: scale3d(1, 1, 1) } 10%, 20% { transform: scale3d(.95, .95, .95) rotate3d(0, 0, 1, -10deg) } 30%, 50%, 70%, 90% { transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 10deg) } 40%, 60%, 80% { transform: rotate3d(0, 0, 1, -10deg) } to { transform: scale3d(1, 1, 1) } } .apollo-spin { -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite } .apollo-spin-hover:hover { -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite } .apollo-tada { -webkit-animation: tada 1.5s ease infinite; animation: tada 1.5s ease infinite } .apollo-tada-hover:hover { -webkit-animation: tada 1.5s ease infinite; animation: tada 1.5s ease infinite } .apollo-flashing { -webkit-animation: flashing 1.5s infinite linear; animation: flashing 1.5s infinite linear } .apollo-flashing-hover:hover { -webkit-animation: flashing 1.5s infinite linear; animation: flashing 1.5s infinite linear } .apollo-burst { -webkit-animation: burst 1.5s infinite linear; animation: burst 1.5s infinite linear } .apollo-burst-hover:hover { -webkit-animation: burst 1.5s infinite linear; animation: burst 1.5s infinite linear } .apollo-fade-up { -webkit-animation: fade-up 1.5s infinite linear; animation: fade-up 1.5s infinite linear } .apollo-fade-up-hover:hover { -webkit-animation: fade-up 1.5s infinite linear; animation: fade-up 1.5s infinite linear } .apollo-fade-down { -webkit-animation: fade-down 1.5s infinite linear; animation: fade-down 1.5s infinite linear } .apollo-fade-down-hover:hover { -webkit-animation: fade-down 1.5s infinite linear; animation: fade-down 1.5s infinite linear } .apollo-fade-left { -webkit-animation: fade-left 1.5s infinite linear; animation: fade-left 1.5s infinite linear } .apollo-fade-left-hover:hover { -webkit-animation: fade-left 1.5s infinite linear; animation: fade-left 1.5s infinite linear } .apollo-fade-right { -webkit-animation: fade-right 1.5s infinite linear; animation: fade-right 1.5s infinite linear } .apollo-fade-right-hover:hover { -webkit-animation: fade-right 1.5s infinite linear; animation: fade-right 1.5s infinite linear } /* -------------------------------- user orders style -------------------------------- */ .apollo-user-orders .order-card { margin: 0 0 24px; } .apollo-user-orders .order-card:last-child { margin: 0; } @media (max-width: 767.98px) { .apollo-user-orders .order-card { margin: 0 0 20px; } } /*-------------------------------------------------------------- user orders cart total --------------------------------------------------------------*/ .apollo-cart-header { position: relative; display: flex; flex-direction: row; min-width: 0; word-wrap: break-word; } .apollo-cart-header .cart-header-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; } .apollo-cart-header .cart-header-body { flex: 1 1 auto; } .apollo-cart-paying li { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; border-bottom: 1px solid var(--gray-2); margin: 0 0 12px; padding: 0 0 12px; } .apollo-cart-paying li:last-child { border: 0; margin: 0; padding: 0; } /*-------------------------------------------------------------- user cart defray menu --------------------------------------------------------------*/ .apollo-cart-defraymenu .item-defray .check-input { display: none; } .apollo-cart-defraymenu .item-defray .check-label { position: relative; overflow: hidden; width: 100%; height: 80px; cursor: pointer; text-indent: -100%; border-radius: var(--border-radius-sm); } .apollo-cart-defraymenu .item-defray .check-alipay { border: 1px solid var(--gray-2); } .apollo-cart-defraymenu .item-defray .check-wechat { border: 1px solid var(--gray-2); } .apollo-cart-defraymenu .item-defray .check-input:checked ~ .check-label { opacity: 1; -webkit-filter: none; filter: none; } .apollo-cart-defraymenu .item-defray .check-input:checked ~ .check-alipay { border-color: #96dcfb; } .apollo-cart-defraymenu .item-defray .check-input:checked ~ .check-wechat { border-color: #c8e5ce; } .apollo-cart-defraymenu .item-defray .check-label:after { content: ''; position: absolute; left: 50%; top: 50%; width: 80%; height: 80%; background-position: center; background-repeat: no-repeat; background-size: contain; opacity: .6; transition: all 0.15s linear; transform: translate(-50%, -50%); -ms-filter: grayscale(100%); -webkit-filter: gray; filter: gray; z-index: 2 } .apollo-cart-defraymenu .item-defray .check-wechat:after { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NTUuNjkgMTg2LjI1Ij48ZGVmcz48c3R5bGU+LmNscy0ze2ZpbGw6IzIyMjEyMX08L3N0eWxlPjwvZGVmcz48ZyBpZD0i5Zu+5bGCXzIiIGRhdGEtbmFtZT0i5Zu+5bGCIDIiPjxnIGlkPSLlm77lsYJfMS0yIiBkYXRhLW5hbWU9IuWbvuWxgiAxIj48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDQ1NS42OXYxODYuMjVIMHoiLz48cGF0aCBkPSJNODguMzUgMTA1LjQ0YTIuODMgMi44MyAwIDAgMS0xLjMuMzEgMi44OCAyLjg4IDAgMCAxLTIuNTEtMS40N2wtLjE4LS40MS03Ljg2LTE3LjI0YTEuNDMgMS40MyAwIDAgMSAyLjE2LTEuNzZsOS4yNyA2LjZhNC4zMyA0LjMzIDAgMCAwIDIuMzYuNyA0LjQ1IDQuNDUgMCAwIDAgMS40Ny0uMjZsNDMuNjEtMTkuNDFjLTcuODItOS4yMS0yMC42OS0xNS4yMy0zNS4yNi0xNS4yMy0yMy44MyAwLTQzLjE1IDE2LjEtNDMuMTUgMzYgMCAxMC44NCA1LjgxIDIwLjYgMTQuOTEgMjcuMTlhMi44NiAyLjg2IDAgMCAxIDEuMjEgMi4zNCAzLjIzIDMuMjMgMCAwIDEtLjE2LjkyYy0uNzIgMi43MS0xLjg4IDctMS45NCA3LjI1YTQuMjkgNC4yOSAwIDAgMC0uMjMgMSAxLjQzIDEuNDMgMCAwIDAgMS40NCAxLjQ0IDEuNTcgMS41NyAwIDAgMCAuODMtLjI3bDkuNDQtNS40NWE0LjU4IDQuNTggMCAwIDEgMi4zLS42NiA0LjE2IDQuMTYgMCAwIDEgMS4yNy4xOSA1MS4yOCA1MS4yOCAwIDAgMCAxNC4wOCAyYzIzLjg0IDAgNDMuMTYtMTYuMSA0My4xNi0zNmEzMS4wNyAzMS4wNyAwIDAgMC00LjkyLTE2LjY2bC00OS42OSAyOC43WiIgZmlsbD0iIzIyYWMzOCIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0iTTI0Ny4xNyA4Mi44NGgzMi4zN3YyLjloLTMyLjM3ek0yNDcuMTcgOTEuOTFoMzIuMzd2My4xM2gtMzIuMzd6TTI3OC43MiAxMDEuMjFIMjQ4djE3LjUyaDMwLjczWm0tMjcuNiAyLjloMjQuNDd2MTEuNzFoLTI0LjQ3Wk0yMzguMjggMTIwLjU1VjgwLjIzYTk4LjY4IDk4LjY4IDAgMCAwIDQuNzktMTIuNTNsLTIuODktMS43YTkyLjEgOTIuMSAwIDAgMS0xMi4zMSAyNi44OGwxLjczIDNjMS44Mi0yLjcgMy43NC01Ljg3IDUuNTUtOS4xOXYzMy44NlpNMzU1LjkxIDEyMC41NVY4MC4yM2ExMDAuMjEgMTAwLjIxIDAgMCAwIDQuNzktMTIuNTNsLTIuOS0xLjdhOTIuMzQgOTIuMzQgMCAwIDEtMTIuMyAyNi44OGwxLjcyIDNjMS44Mi0yLjcgMy43NS01Ljg3IDUuNTYtOS4xOXYzMy44NlpNMjgyLjk0IDczLjU1aC0xOWwyLTEuMTZoLjA3di0uMDhjLS4yMy0uNTQtLjg0LTEuODEtMS40OC0zLjE2cy0xLjIxLTIuNTQtMS41MS0zLjIxdi0uMDlsLTIuODkgMS42Ni4wNS4wOGMxIDIgMS45MiAzLjczIDIuNzEgNS40NWEyLjY2IDIuNjYgMCAwIDEgLjIxLjU1SDI0NHYzLjEzaDM4Ljk0Wk0xOTkuNCA3MS4xN2gtMi45djEwLjJoLTUuNDhWNjYuODZoLTIuOTF2MTQuNTFoLTUuNzF2LTEwLjJoLTIuOXYxMy4xMWgxOS45VjcxLjE3ek0xODAuNDEgODkuOTloMTcuNjR2Mi45aC0xNy42NHpNMTg0LjIxIDEwNC4xM3YtMi42M2g4Ljg5djYuNWMtLjExIDIuMjYtLjIyIDMtMSA0bDEuNzggMy4wOS4wOC0uMDdjMS41Ny0xLjI1IDQuMjMtMy41NCA3LjkzLTYuNzl2LS4wNWwtMS40LTIuNDJ2LS4xbC00LjQ5IDMuODhWOTguNmgtMTQuOTF2NC40Yy40MiA2LTEuMDkgMTAuMzUtNC40OCAxMi44MmgtLjA3bDEuNjIgMi44LjA1LjA5LjA5LS4wNmM0LjIzLTMuNDkgNi4yMi04LjM5IDUuOTEtMTQuNThNMTY1LjE2IDgwLjU4bDEuNzUgM2E1OS4xNyA1OS4xNyAwIDAgMCAxMS4yMS0xNS43OWwtMi43MS0xLjU2YTQ5LjU2IDQ5LjU2IDAgMCAxLTEwLjI1IDE0LjMxTTE2NC4zNyA5OC44MmwxLjYgMi43OS4wNy4xMS4wOC0uMWMxLjcyLTIgMy4zOS00LjExIDUtNi4yOHYyNS4yMUgxNzR2LTMwYTc5LjE2IDc5LjE2IDAgMCAwIDMuNzctNy43NnYtLjA4bC0yLjc3LTEuNnYuMDlhNjAuNzEgNjAuNzEgMCAwIDEtMTAuNTYgMTcuNTdaIi8+PHBhdGggY2xhc3M9ImNscy0zIiBkPSJNMjIwLjcgNzkuNzR2LTIuOTFoLTEyLjg5YTYxIDYxIDAgMCAwIDIuODMtMTAuNjVoLTNhNzIuMzcgNzIuMzcgMCAwIDEtOC40NiAyMi41NUwyMDEgOTEuOWwxLjM1LTIuNjljLjUtLjg4LjkxLTEuNjMgMS4yMi0yLjIzLjkxIDcuODMgMi40OSAxNC4xMyA0LjcyIDE4LjczYTQ4LjIyIDQ4LjIyIDAgMCAxLTkuNzUgMTEuMzhoLS4wNmwxLjY3IDIuOS4wNi4xLjA5LS4wOGM0LjU5LTQuMyA3Ljc3LTguMDcgOS40NS0xMS4yMWE1Ny45MSA1Ny45MSAwIDAgMCA4LjkzIDExLjM4bC4wOC4wOCAxLjcyLTN2LS4wN2gtLjA1YTQ2LjQxIDQ2LjQxIDAgMCAxLTktMTEuMjljMy4yOS02IDUuMzQtMTQuODMgNi4xLTI2LjJaTTIxMCAxMDIuMzFjLTEuOTEtNC45My0zLjMzLTExLjY0LTQuMjItMTkuOTNhMjAuMjcgMjAuMjcgMCAwIDEgMS4xLTIuNjRoNy43OGMtLjYgOS40Ni0yLjE3IDE3LjA1LTQuNjYgMjIuNTdNMzQxLjggNzYuNjZ2LTMuMDloLTI0Ljc0di03Ljg1aC0zLjE3djcuODVoLTI0LjUydjMuMDloMjQuNTJWODdIMjk4djIuODNhNTUuMzQgNTUuMzQgMCAwIDAgNy4zOCAxMS40NyA1Mi40MyA1Mi40MyAwIDAgMCA3LjM0IDcuMzcgNjQuNjUgNjQuNjUgMCAwIDEtMjIuMjMgOC41N2wxLjgzIDMuMTZhNzYuMTggNzYuMTggMCAwIDAgMjIuODgtOS44MyA2MCA2MCAwIDAgMCAyMS44IDkuNzNoLjA5bDEuMjktMi40NGE4OC4xNyA4OC4xNyAwIDAgMS04LjU2LTIuODggNjIuMjUgNjIuMjUgMCAwIDEtMTIuMzYtNi4zOCA0NiA0NiAwIDAgMCAxNS41Mi0yMC4xNkwzMzAuMzcgODdoLTEzLjMxVjc2LjY2Wm0tMTIuNTUgMTNzLTMuMTkgOS4xMy0xNC4xMSAxNi45M2E0OCA0OCAwIDAgMS0xNC0xNi45M1pNMzgxLjU0IDExNi41M2gtMS44MXYzLjEzaDIuNzNjMy4wNyAwIDQuNzUtLjY1IDYuMDYtMnMxLjg5LTMuMjIgMS44MS01Ljc5VjgyLjhoOC40MXYtMy4xMmgtOC40MVY2Ni4yNmgtMy4xNHYxMy40MmgtMjUuODJ2My4xMmgyNS44MnYyOS4wOWMwIDMuMTYtMiA0LjY0LTUuNjUgNC42NCIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0ibTM3NC41NCAxMDYuMTggMy4xLTEuODJDMzc2IDEwMSAzNzMuNzUgOTYuNDggMzcxIDkxbC0yLjg0IDEuNjVjMS45MSAzLjczIDQgOC4yNyA2LjM4IDEzLjU3Ii8+PC9nPjwvZz48L3N2Zz4='); } .apollo-cart-defraymenu .item-defray .check-alipay:after { background-image: url('data:image/svg+xml;base64,PHN2ZyBkYXRhLW5hbWU9IuWbvuWxgiAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMDAgMTUwIj48cGF0aCBkPSJNNjMuNjkgNDAuODRhMTEgMTEgMCAwIDAtMTEgMTAuOTV2NDYuNDJhMTEgMTEgMCAwIDAgMTEgMTFoNDYuODdhMTEgMTEgMCAwIDAgMTEtMTF2LS40N2MtLjIxLS4wOS0xNy45My03LjQxLTI2LjkzLTExLjctNi4wOCA3LjQxLTEzLjkxIDExLjktMjIuMDUgMTEuOS0xMy43IDAtMTguMzgtMTEuOTQtMTEuODYtMTkuNzhhMTMuODUgMTMuODUgMCAwIDEgNy41OC00LjI2YzUuODctMS40MyAxNS4yMS44OSAyNCAzLjc1YTQ3IDQ3IDAgMCAwIDMuODgtOS40aC0yN3YtMi43MWgxMy45di00Ljg1SDY2LjI0VjU4aDE2Ljg0di02Ljk0YTEuMTUgMS4xNSAwIDAgMSAxLjE5LTEuMTZoNi44VjU4aDE2LjY1djIuNzFIOTEuMDd2NC44NWgxMy41OWE1NSA1NSAwIDAgMS01Ljc1IDE0LjRjNC4xMiAxLjQ4IDcuODIgMi44OCAxMC41OCAzLjggOS4yIDMuMDUgMTEuNzggMy40MiAxMi4xMiAzLjQ2VjUxLjc5YTExIDExIDAgMCAwLTExLTEwLjk1SDYzLjY5Wm03LjU3IDM3YTE3LjY4IDE3LjY4IDAgMCAwLTEuNzguMDljLTEuNzMuMTctNSAuOTMtNi43MyAyLjQ4LTUuMyA0LjU4LTIuMTMgMTIuOTUgOC42IDEyLjk1IDYuMjMgMCAxMi40Ny0zLjk1IDE3LjM2LTEwLjI4LTYuMzEtMy0xMS43NS01LjMxLTE3LjQ1LTUuMjRaIiBmaWxsPSIjMDBhMWU5Ii8+PHBhdGggZD0iTTI0MS41NCA4OC4zMyAyMzguNDYgOTVsLTMuMTItNi42NWgtMy4wNWw0LjcxIDkuMTd2Ni40aDIuOHYtNi40bDQuNzMtOS4xNVptLTIyLjU0IDQgMi4xNyA2LjQ3aC00LjQxWm0yLjg0IDguNDMgMSAzLjE0aDIuOTNMMjIwIDg4LjMzaC0yLjJsLTUuOCAxNS41OWgzbDEuMDktMy4xNFptLTIxLjktNWgtMy4xMXYtNS4zMWgzLjExYTIuNTggMi41OCAwIDAgMSAyLjUxIDIuNjggMi41NCAyLjU0IDAgMCAxLTIuNTEgMi42Nm0uMTYtNy40NkgxOTR2MTUuNTloMi44M3YtNmgzLjI3YzMgMCA1LjE3LTIgNS4xNy00LjhzLTIuMTMtNC44LTUuMTctNC44bS0yMC4zNiAxNS41OWgyLjgzVjg4LjMzaC0yLjgzWm0tMTkuODUtMTUuNTh2MTUuNTloOS41di0yLjEyaC02LjY4Vjg4LjMzWm0tMTYuMDcgNCAyLjE4IDYuNDloLTQuNDJabTIuODQgOC40MyAxIDMuMTRoMi45M2wtNS43Ny0xNS41OWgtMi4yNGwtNS43NiAxNS41OWgyLjkzbDEuMDktMy4xNFptMTkuODYtNDIuOTJoLTEyLjF2LTQuMjloMTR2LTIuNjhoLTE0di01LjQ2aC02LjI2YTEuMjUgMS4yNSAwIDAgMC0xLjI0IDEuMjd2NC4xOUgxMzN2Mi42OGgxMy45NHY0LjMxaC0xMS43OXYyLjY4aDIzLjQ0cy0xLjMgNS03LjczIDEwLjQ1Yy01Ljc2LTQuMzMtNy42OC03Ljc4LTcuNjgtNy43OGgtNi4yOWEzNC44MiAzNC44MiAwIDAgMCAxMC4wNSAxMC42NyA1NC43OSA1NC43OSAwIDAgMS0xNC4yIDYuMzF2My4yMmE2My44OCA2My44OCAwIDAgMCAxOC4xOC03IDY1LjQ4IDY1LjQ4IDAgMCAwIDE3Ljk0IDd2LTNBNzQuODMgNzQuODMgMCAwIDEgMTU1IDczLjc5YzUuMTgtMy44MiA5LjczLTkgMTEuNTUtMTUuOTNtMzkuMzItMTEuOTJoLTYuM3Y2LjU1SDE4NHYyLjYzaDE1LjUzdjIzLjUyYTEuMDggMS4wOCAwIDAgMS0xIDFoLTMuMnYyLjczaDguMTdhMi40NyAyLjQ3IDAgMCAwIDIuMzUtMi40NFY1NS4xMmgyLjU2di0yLjY0aC0yLjU2Wm0tMTMuMzIgMTMuNjJhMS40MiAxLjQyIDAgMCAwLTEuMjUtLjhoLTUuMjVsNC4xIDEyLjhoNi4yWm0tMTUuNS0xMy45My03LjIzIDE3aDUuNTR2MjAuMmg2LjA3VjU2aC0yLjJsNC41Ni0xMC4zOVptNzAuMyAzNi4yNy0yLjIxLTcuNDNhMS4xNSAxLjE1IDAgMCAwLTEuMS0uODJoLTUuODdsMS43IDUuNzFIMjMzVjY4LjNoMTMuNTZ2LTIuNjNIMjMzdi01LjIxaDEzLjU2di0yLjYzSDIxMi43djIuNjNoMTMuNTV2NS4yMUgyMTIuN3YyLjYzaDEzLjU1djExLjA2SDIxMi43VjgyaDM0LjY1di0uMDlabS0yNy42LTMwLjM1aDE5Ljc0djMuODhoN3YtNC42MmExLjg4IDEuODggMCAwIDAtMS44My0xLjg5SDIzMy4zVjQ1LjNoLTcuMzh2My42MkgyMTIuN3Y2LjUxaDcuMDVaIiBmaWxsPSIjM2YzYjNhIi8+PC9zdmc+'); } .apollo-cart-defraymenu .item-defray .check-input:checked ~ .check-label:after { opacity: 1; -webkit-filter: none; filter: none; } .apollo-cart-defraymenu .item-defray .check-input:checked ~ .check-label:before { content: ''; position: absolute; left: 0; top: 0; border-radius: inherit; width: 100%; height: 100%; } .apollo-cart-defraymenu .item-defray .check-input:checked ~ .check-alipay:before { background-color: #96dcfb; opacity: .1 } .apollo-cart-defraymenu .item-defray .check-input:checked ~ .check-wechat { background-color: #eaf9ed; } /* -------------------------------- order qr -------------------------------- */ .apollo-order-QrPay { max-width: 300px; } .apollo-order-QrPay .wechatpay-icon { width: 100%; height: 100px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NTUuNjkgMTg2LjI1Ij48ZGVmcz48c3R5bGU+LmNscy0ze2ZpbGw6IzIyMjEyMX08L3N0eWxlPjwvZGVmcz48ZyBpZD0i5Zu+5bGCXzIiIGRhdGEtbmFtZT0i5Zu+5bGCIDIiPjxnIGlkPSLlm77lsYJfMS0yIiBkYXRhLW5hbWU9IuWbvuWxgiAxIj48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDQ1NS42OXYxODYuMjVIMHoiLz48cGF0aCBkPSJNODguMzUgMTA1LjQ0YTIuODMgMi44MyAwIDAgMS0xLjMuMzEgMi44OCAyLjg4IDAgMCAxLTIuNTEtMS40N2wtLjE4LS40MS03Ljg2LTE3LjI0YTEuNDMgMS40MyAwIDAgMSAyLjE2LTEuNzZsOS4yNyA2LjZhNC4zMyA0LjMzIDAgMCAwIDIuMzYuNyA0LjQ1IDQuNDUgMCAwIDAgMS40Ny0uMjZsNDMuNjEtMTkuNDFjLTcuODItOS4yMS0yMC42OS0xNS4yMy0zNS4yNi0xNS4yMy0yMy44MyAwLTQzLjE1IDE2LjEtNDMuMTUgMzYgMCAxMC44NCA1LjgxIDIwLjYgMTQuOTEgMjcuMTlhMi44NiAyLjg2IDAgMCAxIDEuMjEgMi4zNCAzLjIzIDMuMjMgMCAwIDEtLjE2LjkyYy0uNzIgMi43MS0xLjg4IDctMS45NCA3LjI1YTQuMjkgNC4yOSAwIDAgMC0uMjMgMSAxLjQzIDEuNDMgMCAwIDAgMS40NCAxLjQ0IDEuNTcgMS41NyAwIDAgMCAuODMtLjI3bDkuNDQtNS40NWE0LjU4IDQuNTggMCAwIDEgMi4zLS42NiA0LjE2IDQuMTYgMCAwIDEgMS4yNy4xOSA1MS4yOCA1MS4yOCAwIDAgMCAxNC4wOCAyYzIzLjg0IDAgNDMuMTYtMTYuMSA0My4xNi0zNmEzMS4wNyAzMS4wNyAwIDAgMC00LjkyLTE2LjY2bC00OS42OSAyOC43WiIgZmlsbD0iIzIyYWMzOCIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0iTTI0Ny4xNyA4Mi44NGgzMi4zN3YyLjloLTMyLjM3ek0yNDcuMTcgOTEuOTFoMzIuMzd2My4xM2gtMzIuMzd6TTI3OC43MiAxMDEuMjFIMjQ4djE3LjUyaDMwLjczWm0tMjcuNiAyLjloMjQuNDd2MTEuNzFoLTI0LjQ3Wk0yMzguMjggMTIwLjU1VjgwLjIzYTk4LjY4IDk4LjY4IDAgMCAwIDQuNzktMTIuNTNsLTIuODktMS43YTkyLjEgOTIuMSAwIDAgMS0xMi4zMSAyNi44OGwxLjczIDNjMS44Mi0yLjcgMy43NC01Ljg3IDUuNTUtOS4xOXYzMy44NlpNMzU1LjkxIDEyMC41NVY4MC4yM2ExMDAuMjEgMTAwLjIxIDAgMCAwIDQuNzktMTIuNTNsLTIuOS0xLjdhOTIuMzQgOTIuMzQgMCAwIDEtMTIuMyAyNi44OGwxLjcyIDNjMS44Mi0yLjcgMy43NS01Ljg3IDUuNTYtOS4xOXYzMy44NlpNMjgyLjk0IDczLjU1aC0xOWwyLTEuMTZoLjA3di0uMDhjLS4yMy0uNTQtLjg0LTEuODEtMS40OC0zLjE2cy0xLjIxLTIuNTQtMS41MS0zLjIxdi0uMDlsLTIuODkgMS42Ni4wNS4wOGMxIDIgMS45MiAzLjczIDIuNzEgNS40NWEyLjY2IDIuNjYgMCAwIDEgLjIxLjU1SDI0NHYzLjEzaDM4Ljk0Wk0xOTkuNCA3MS4xN2gtMi45djEwLjJoLTUuNDhWNjYuODZoLTIuOTF2MTQuNTFoLTUuNzF2LTEwLjJoLTIuOXYxMy4xMWgxOS45VjcxLjE3ek0xODAuNDEgODkuOTloMTcuNjR2Mi45aC0xNy42NHpNMTg0LjIxIDEwNC4xM3YtMi42M2g4Ljg5djYuNWMtLjExIDIuMjYtLjIyIDMtMSA0bDEuNzggMy4wOS4wOC0uMDdjMS41Ny0xLjI1IDQuMjMtMy41NCA3LjkzLTYuNzl2LS4wNWwtMS40LTIuNDJ2LS4xbC00LjQ5IDMuODhWOTguNmgtMTQuOTF2NC40Yy40MiA2LTEuMDkgMTAuMzUtNC40OCAxMi44MmgtLjA3bDEuNjIgMi44LjA1LjA5LjA5LS4wNmM0LjIzLTMuNDkgNi4yMi04LjM5IDUuOTEtMTQuNThNMTY1LjE2IDgwLjU4bDEuNzUgM2E1OS4xNyA1OS4xNyAwIDAgMCAxMS4yMS0xNS43OWwtMi43MS0xLjU2YTQ5LjU2IDQ5LjU2IDAgMCAxLTEwLjI1IDE0LjMxTTE2NC4zNyA5OC44MmwxLjYgMi43OS4wNy4xMS4wOC0uMWMxLjcyLTIgMy4zOS00LjExIDUtNi4yOHYyNS4yMUgxNzR2LTMwYTc5LjE2IDc5LjE2IDAgMCAwIDMuNzctNy43NnYtLjA4bC0yLjc3LTEuNnYuMDlhNjAuNzEgNjAuNzEgMCAwIDEtMTAuNTYgMTcuNTdaIi8+PHBhdGggY2xhc3M9ImNscy0zIiBkPSJNMjIwLjcgNzkuNzR2LTIuOTFoLTEyLjg5YTYxIDYxIDAgMCAwIDIuODMtMTAuNjVoLTNhNzIuMzcgNzIuMzcgMCAwIDEtOC40NiAyMi41NUwyMDEgOTEuOWwxLjM1LTIuNjljLjUtLjg4LjkxLTEuNjMgMS4yMi0yLjIzLjkxIDcuODMgMi40OSAxNC4xMyA0LjcyIDE4LjczYTQ4LjIyIDQ4LjIyIDAgMCAxLTkuNzUgMTEuMzhoLS4wNmwxLjY3IDIuOS4wNi4xLjA5LS4wOGM0LjU5LTQuMyA3Ljc3LTguMDcgOS40NS0xMS4yMWE1Ny45MSA1Ny45MSAwIDAgMCA4LjkzIDExLjM4bC4wOC4wOCAxLjcyLTN2LS4wN2gtLjA1YTQ2LjQxIDQ2LjQxIDAgMCAxLTktMTEuMjljMy4yOS02IDUuMzQtMTQuODMgNi4xLTI2LjJaTTIxMCAxMDIuMzFjLTEuOTEtNC45My0zLjMzLTExLjY0LTQuMjItMTkuOTNhMjAuMjcgMjAuMjcgMCAwIDEgMS4xLTIuNjRoNy43OGMtLjYgOS40Ni0yLjE3IDE3LjA1LTQuNjYgMjIuNTdNMzQxLjggNzYuNjZ2LTMuMDloLTI0Ljc0di03Ljg1aC0zLjE3djcuODVoLTI0LjUydjMuMDloMjQuNTJWODdIMjk4djIuODNhNTUuMzQgNTUuMzQgMCAwIDAgNy4zOCAxMS40NyA1Mi40MyA1Mi40MyAwIDAgMCA3LjM0IDcuMzcgNjQuNjUgNjQuNjUgMCAwIDEtMjIuMjMgOC41N2wxLjgzIDMuMTZhNzYuMTggNzYuMTggMCAwIDAgMjIuODgtOS44MyA2MCA2MCAwIDAgMCAyMS44IDkuNzNoLjA5bDEuMjktMi40NGE4OC4xNyA4OC4xNyAwIDAgMS04LjU2LTIuODggNjIuMjUgNjIuMjUgMCAwIDEtMTIuMzYtNi4zOCA0NiA0NiAwIDAgMCAxNS41Mi0yMC4xNkwzMzAuMzcgODdoLTEzLjMxVjc2LjY2Wm0tMTIuNTUgMTNzLTMuMTkgOS4xMy0xNC4xMSAxNi45M2E0OCA0OCAwIDAgMS0xNC0xNi45M1pNMzgxLjU0IDExNi41M2gtMS44MXYzLjEzaDIuNzNjMy4wNyAwIDQuNzUtLjY1IDYuMDYtMnMxLjg5LTMuMjIgMS44MS01Ljc5VjgyLjhoOC40MXYtMy4xMmgtOC40MVY2Ni4yNmgtMy4xNHYxMy40MmgtMjUuODJ2My4xMmgyNS44MnYyOS4wOWMwIDMuMTYtMiA0LjY0LTUuNjUgNC42NCIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0ibTM3NC41NCAxMDYuMTggMy4xLTEuODJDMzc2IDEwMSAzNzMuNzUgOTYuNDggMzcxIDkxbC0yLjg0IDEuNjVjMS45MSAzLjczIDQgOC4yNyA2LjM4IDEzLjU3Ii8+PC9nPjwvZz48L3N2Zz4='); } .apollo-order-QrPay .wechatpay-img { width: 100%; padding: 16px; border: 1px solid var(--border-light); } .apollo-order-QrPay .wechatpay-text { font-weight: bold; padding: 12px 8px; background: #eef3ef; color: #1caa39; border: 1px solid #c1dec9; } /* -------------------------------- Editor tags style -------------------------------- */ .editor-tags-radio { display: flex; flex-direction: row; flex-wrap: wrap; margin: -6px } .editor-tags-radio .item { padding: 6px } .editor-tags-radio .item .check-input { display: none } .editor-tags-radio .item .check-label { position: relative; padding: 8px 40px 8px 14px; display: block; cursor: pointer; background-color: var(--bg-light); color: var(--color-secondary); border-radius: var(--border-radius-sm) } .editor-tags-radio .item .check-input:checked ~ .check-label { background-color: var(--bg-secondary); color: #fff; } .editor-tags-radio .item .check-label .cheak-icon { position: absolute; top: 50%; right: 14px; width: 12px; height: 12px; transform: translateY(-50%); transition: all .3s ease-in-out; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iIzA5MDkwOSIgZmlsbC1vcGFjaXR5PSIuMiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTIuNjIxIDEyLjYyMWg3LjVhMS41IDEuNSAwIDAgMCAwLTNoLTcuNXYtNy41YTEuNSAxLjUgMCAxIDAtMyAwdjcuNWgtNy41YTEuNSAxLjUgMCAxIDAgMCAzaDcuNXY3LjVhMS41IDEuNSAwIDEgMCAzIDB2LTcuNVoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==') } .editor-tags-radio .item .check-input:checked ~ .check-label .cheak-icon { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjIiIHZpZXdCb3g9IjAgMCAyMiAyMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMi42MjEgMTIuNjIxMUgyMC4xMjFDMjAuNTE4OCAxMi42MjExIDIwLjkwMDMgMTIuNDYzMSAyMS4xODE2IDEyLjE4MThDMjEuNDYyOSAxMS45MDA0IDIxLjYyMSAxMS41MTg5IDIxLjYyMSAxMS4xMjExQzIxLjYyMSAxMC43MjMzIDIxLjQ2MjkgMTAuMzQxNyAyMS4xODE2IDEwLjA2MDRDMjAuOTAwMyA5Ljc3OTEzIDIwLjUxODggOS42MjEwOSAyMC4xMjEgOS42MjEwOUgxMi42MjFWMi4xMjEwOUMxMi42MjEgMS43MjMyNyAxMi40NjI5IDEuMzQxNzQgMTIuMTgxNiAxLjA2MDQzQzExLjkwMDMgMC43NzkxMjkgMTEuNTE4OCAwLjYyMTA5NCAxMS4xMjEgMC42MjEwOTRDMTAuNzIzMSAwLjYyMTA5NCAxMC4zNDE2IDAuNzc5MTI5IDEwLjA2MDMgMS4wNjA0M0M5Ljc3OTAxIDEuMzQxNzQgOS42MjA5NyAxLjcyMzI3IDkuNjIwOTcgMi4xMjEwOVY5LjYyMTA5SDIuMTIwOTdDMS43MjMxNSA5LjYyMTA5IDEuMzQxNjIgOS43NzkxMyAxLjA2MDMxIDEwLjA2MDRDMC43NzkwMDcgMTAuMzQxNyAwLjYyMDk3MiAxMC43MjMzIDAuNjIwOTcyIDExLjEyMTFDMC42MjA5NzIgMTEuNTE4OSAwLjc3OTAwNyAxMS45MDA0IDEuMDYwMzEgMTIuMTgxOEMxLjM0MTYyIDEyLjQ2MzEgMS43MjMxNSAxMi42MjExIDIuMTIwOTcgMTIuNjIxMUg5LjYyMDk3VjIwLjEyMTFDOS42MjA5NyAyMC41MTg5IDkuNzc5MDEgMjAuOTAwNCAxMC4wNjAzIDIxLjE4MThDMTAuMzQxNiAyMS40NjMxIDEwLjcyMzEgMjEuNjIxMSAxMS4xMjEgMjEuNjIxMUMxMS41MTg4IDIxLjYyMTEgMTEuOTAwMyAyMS40NjMxIDEyLjE4MTYgMjEuMTgxOEMxMi40NjI5IDIwLjkwMDQgMTIuNjIxIDIwLjUxODkgMTIuNjIxIDIwLjEyMTFWMTIuNjIxMVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo='); transform: translateY(-50%) rotate(45deg); opacity: .6; } /*-------------------------------------------------------------- Apollo insign date style --------------------------------------------------------------*/ .insign-date-body { position: relative; display: flex; justify-content: space-between; border-radius: 12px 12px 0 0; } .insign-date-body::after { content: ""; position: absolute; left: 10px; right: 10px; top: 15%; height: 2px; margin-top: 9px; background-color: var(--border-color); } .insign-date-body .item { position: relative; z-index: 2; opacity: 1; border-radius: 50%; } @-webkit-keyframes insign-button-animation { 0%, to { transform: scale(1) } 25% { transform: scale(1.3) } 50% { transform: scale(.95) } } @keyframes insign-button-animation { 0%, to { transform: scale(1) } 25% { transform: scale(1.3) } 50% { transform: scale(.95) } } .insign-date-body .item .item-day { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; font-size: 18px; border-radius: 100px; background-color: var(--bg-light); -webkit-animation-duration: .45s; animation-duration: .45s; -webkit-animation-name: insign-button-animation; animation-name: insign-button-animation; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; transform: scale(1); } .insign-date-body .item.current .item-day { background-color: var(--color-primary); color: #fff; } @media (min-width: 992px) and (max-width: 1199.98px) { .insign-date-body .item-day { width: 36px; height: 36px; } } /* -------------------------------- ## ck style -------------------------------- */ .ck-body-wrapper, #post-editor { --ck-color-base-foreground: #fff; --ck-color-base-background: #fff; --ck-color-base-border: var(--gray-2); --ck-color-base-action: #53a336; --ck-color-base-focus: #6cb5f9; --ck-color-base-text: var(--color-secondary); --ck-color-base-active: var(--color-primary); --ck-color-base-active-focus: var(--color-primary); --ck-color-base-error: #db3700; --ck-color-focus-border-coordinates: 218, 81.8%, 56.9%; --ck-color-focus-border: hsl(var(--ck-color-focus-border-coordinates)); --ck-color-focus-outer-shadow: #cae1fc; --ck-color-focus-disabled-shadow: rgba(119, 186, 248, .3); --ck-color-focus-error-shadow: rgba(255, 64, 31, .3); --ck-color-text: var(--ck-color-base-text); --ck-color-shadow-drop: rgba(0, 0, 0, .15); --ck-color-shadow-drop-active: rgba(0, 0, 0, .2); --ck-color-shadow-inner: rgba(0, 0, 0, .1); --ck-color-button-default-background: transparent; --ck-color-button-default-hover-background: var(--gray-1); --ck-color-button-default-active-background: var(--gray-1); --ck-color-button-default-disabled-background: transparent; --ck-color-button-on-background: var(--gray-1); --ck-color-button-on-hover-background: var(--gray-2); --ck-color-button-on-active-background: var(--gray-2); --ck-color-button-on-disabled-background: var(--gray-1); --ck-color-button-on-color: #2977ff; --ck-color-button-action-background: var(--ck-color-base-action); --ck-color-button-action-hover-background: #4d9d30; --ck-color-button-action-active-background: #4d9d30; --ck-color-button-action-disabled-background: #7ec365; --ck-color-button-action-text: var(--ck-color-base-background); --ck-color-button-save: #008a00; --ck-color-button-cancel: #db3700; --ck-color-switch-button-off-background: var(--gray-3); --ck-color-switch-button-off-hover-background: var(--gray-3); --ck-color-switch-button-on-background: var(--ck-color-button-action-background); --ck-color-switch-button-on-hover-background: #4d9d30; --ck-color-switch-button-inner-background: var(--ck-color-base-background); --ck-color-switch-button-inner-shadow: rgba(0, 0, 0, .1); --ck-color-dropdown-panel-background: var(--ck-color-base-background); --ck-color-dropdown-panel-border: var(--ck-color-base-border); --ck-color-dialog-background: var(--ck-custom-background); --ck-color-dialog-form-header-border: var(--ck-custom-border); --ck-color-input-background: var(--ck-color-base-background); --ck-color-input-border: var(--ck-color-base-border); --ck-color-input-error-border: var(--ck-color-base-error); --ck-color-input-text: var(--ck-color-base-text); --ck-color-input-disabled-background: var(--gray-1); --ck-color-input-disabled-border: var(--ck-color-base-border); --ck-color-input-disabled-text: var(--color-muted); --ck-color-list-background: var(--ck-color-base-background); --ck-color-list-button-hover-background: var(--ck-color-button-default-hover-background); --ck-color-list-button-on-background: var(--ck-color-button-on-color); --ck-color-list-button-on-background-focus: var(--ck-color-button-on-color); --ck-color-list-button-on-text: var(--ck-color-base-background); --ck-color-panel-background: var(--ck-color-base-background); --ck-color-panel-border: var(--ck-color-base-border); --ck-color-toolbar-background: var(--ck-color-base-background); --ck-color-toolbar-border: var(--ck-color-base-border); --ck-color-tooltip-background: var(--ck-color-base-text); --ck-color-tooltip-text: var(--ck-color-base-background); --ck-color-engine-placeholder-text: #707070; --ck-color-upload-bar-background: #6cb5f9; --ck-color-link-default: var(--color-primary); --ck-color-link-selected-background: rgba(31, 176, 255, .1); --ck-color-link-fake-selection: rgba(31, 176, 255, .3); --ck-color-highlight-background: #ff0; --ck-color-light-red: #fcc; --ck-disabled-opacity: .5; --ck-focus-outer-shadow-geometry: 0 0 0 3px; --ck-focus-outer-shadow: var(--ck-focus-outer-shadow-geometry) var(--ck-color-focus-outer-shadow); --ck-focus-disabled-outer-shadow: var(--ck-focus-outer-shadow-geometry) var(--ck-color-focus-disabled-shadow); --ck-focus-error-outer-shadow: var(--ck-focus-outer-shadow-geometry) var(--ck-color-focus-error-shadow); --ck-focus-ring: 1px solid var(--ck-color-focus-border); --ck-font-size-base: 13px; --ck-line-height-base: 1.84615; --ck-font-face: Helvetica, Arial, Tahoma, Verdana, Sans-Serif; --ck-font-size-tiny: 0.7em; --ck-font-size-small: 0.75em; --ck-font-size-normal: 1em; --ck-font-size-big: 1.4em; --ck-font-size-large: 1.8em; --ck-ui-component-min-height: 2.3em; --ck-border-radius: var(--border-radius-sm); --ck-inner-shadow: 2px 2px 3px var(--ck-color-shadow-inner) inset; --ck-drop-shadow: 0 1px 2px 1px var(--ck-color-shadow-drop); --ck-drop-shadow-active: 0 3px 6px 1px var(--ck-color-shadow-drop-active); --ck-spacing-small: 0; } #post-editor .ck.ck-button { box-shadow: none !important; transition: all .2s ease-in-out; } .ck.ck-list__item .ck-button.ck-on:hover { background-color: var(--color-primary); color: #fff; } #post-editor .ck.ck-toolbar { border: 0; margin-bottom: 12px; } #post-editor .ck-dropdown__panel .ck.ck-toolbar { margin-bottom: 0; padding: 10px; } #post-editor .ck.ck-toolbar > .ck-toolbar__items { gap: 8px; } #post-editor .ck.ck-toolbar .ck.ck-toolbar__separator { display: none; } #post-editor .ck-rounded-corners .ck.ck-editor__main > .ck-editor__editable, #post-editor .ck.ck-editor__main > .ck-editor__editable.ck-rounded-corners { border-radius: var(--ck-border-radius); } #post-editor .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) { box-shadow: none !important; } #post-editor .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused { border-color: var(--color-primary); } #post-editor .ck.ck-content:not(.ck-style-grid__button__preview) { min-height: 600px; } #post-editor .ck.ck-content ul, #post-editor .ck.ck-content ol { padding: 0 0 0 20px; margin-bottom: 24px; } #post-editor .ck.ck-content ul { list-style: disc; } #post-editor .ck.ck-content ul ul, #post-editor .ck.ck-content ol ol, #post-editor .ck.ck-content ul ol, #post-editor .ck.ck-content ol ul { margin-bottom: 16px; } #post-editor .ck.ck-contentul ul { list-style: circle; margin: 12px 0; } #post-editor .ck.ck-content ul ul ul { list-style: square; } #post-editor .ck.ck-content ol { list-style: decimal; } #post-editor .ck.ck-content ol ol { list-style: lower-alpha; } #post-editor .ck.ck-content ol ol ol { list-style: lower-roman; } #post-editor .ck.ck-content li { line-height: 1.5; margin: 0 0 8px; } #post-editor .ck.ck-content li li { margin: 0 0 8px; } #post-editor .ck.ck-content li img { display: inline-block; } @media (max-width: 767.98px) { #post-editor .ck.ck-content:not(.ck-style-grid__button__preview) { min-height: 400px; } } .ck-body-wrapper .ck.ck-input:focus { box-shadow: none; } .ck-body-wrapper .ck-rounded-corners .ck.ck-balloon-panel .ck.ck-label { top: -2px !important; } /*-------------------------------------------------------------- ## Fileuploader style --------------------------------------------------------------*/ .fileuploader { background: transparent; border-radius: 0; padding: 0; margin: 0; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner { font-size: 30px; line-height: 1; color: var(--color-muted); background: var(--gray-6); border-radius: var(--border-radius-sm); border: 0; opacity: 1; transition: all 0.2s ease; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner:hover { background: var(--gray-5); color: var(--color-secondary); border-color: transparent; opacity: 1; } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove i:before, .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success i:before { content: ""; display: block; width: 15px; height: 15px; margin: auto; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCI+PHBhdGggZD0iTTgyNy44ODEgMTkzLjk5OWMxOC41OSAxOC41MjUgMTguODMgNDguNDk3LjY3NiA2Ny4zMTVsLS41NTYuNTY3TDU3OS43NjIgNTExbDI0OC4yNCAyNDkuMTE5YzE4LjcxMSAxOC43NzggMTguNjU3IDQ5LjE3LS4xMjEgNjcuODgyLTE4LjU5IDE4LjUyNS00OC41NjQgMTguNjU4LTY3LjMxNy40MzhsLS41NjUtLjU1OEw1MTIgNTc5LjAwMyAyNjQuMDAxIDgyNy44ODFjLTE4LjcxMiAxOC43NzgtNDkuMTA0IDE4LjgzMi02Ny44ODIuMTItMTguNTktMTguNTI1LTE4LjgzLTQ4LjQ5Ny0uNjc2LTY3LjMxNWwuNTU2LS41NjdMNDQ0LjIzNyA1MTEgMTk1Ljk5OSAyNjEuODgxYy0xOC43MTItMTguNzc4LTE4LjY1OC00OS4xNy4xMi02Ny44ODIgMTguNTktMTguNTI1IDQ4LjU2NC0xOC42NTggNjcuMzE3LS40MzhsLjU2NS41NThMNTEyIDQ0Mi45OTdsMjQ3Ljk5OS0yNDguODc4YzE4LjcxMi0xOC43NzggNDkuMTA0LTE4LjgzMiA2Ny44ODItLjEyeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg=="); } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success:active i:before, .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success:hover i:before { content: ""; display: block; width: 15px; height: 15px; margin: auto; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCI+PHBhdGggZD0iTTgyNy44ODEgMTkzLjk5OWMxOC41OSAxOC41MjUgMTguODMgNDguNDk3LjY3NiA2Ny4zMTVsLS41NTYuNTY3TDU3OS43NjIgNTExbDI0OC4yNCAyNDkuMTE5YzE4LjcxMSAxOC43NzggMTguNjU3IDQ5LjE3LS4xMjEgNjcuODgyLTE4LjU5IDE4LjUyNS00OC41NjQgMTguNjU4LTY3LjMxNy40MzhsLS41NjUtLjU1OEw1MTIgNTc5LjAwMyAyNjQuMDAxIDgyNy44ODFjLTE4LjcxMiAxOC43NzgtNDkuMTA0IDE4LjgzMi02Ny44ODIuMTItMTguNTktMTguNTI1LTE4LjgzLTQ4LjQ5Ny0uNjc2LTY3LjMxNWwuNTU2LS41NjdMNDQ0LjIzNyA1MTEgMTk1Ljk5OSAyNjEuODgxYy0xOC43MTItMTguNzc4LTE4LjY1OC00OS4xNy4xMi02Ny44ODIgMTguNTktMTguNTI1IDQ4LjU2NC0xOC42NTggNjcuMzE3LS40MzhsLjU2NS41NThMNTEyIDQ0Mi45OTdsMjQ3Ljk5OS0yNDguODc4YzE4LjcxMi0xOC43NzggNDkuMTA0LTE4LjgzMiA2Ny44ODItLjEyeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg=="); } @media (max-width: 767.98px) { .fileuploader-theme-thumbnails { padding: 10px; margin: 0; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-items-list { margin: -10px 0 0 -10px; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input, .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item { width: calc(33.33333% - 10px); padding-top: 25%; margin: 10px 0 0 10px; } } /*-------------------------------------------------------------- ## fileuploader avatar --------------------------------------------------------------*/ .fileuploader-avatar .fileuploader-theme-thumbnails { max-width: 200px; margin: 32px auto 40px; } .fileuploader-avatar .fileuploader-theme-thumbnails .fileuploader-items-list { margin: 0; } .fileuploader-avatar .fileuploader-theme-thumbnails .fileuploader-thumbnails-input, .fileuploader-avatar .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item { width: 100%; margin: 0; padding-top: 100%; } .fileuploader-avatar .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action { box-shadow: none; } .aplayer .aplayer-info .aplayer-music .aplayer-author { display: none; } .xmems-banner .swiper-slide { position: relative; } .xmems-banner .banner-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #8E2DE2; /* fallback for old browsers */ /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to top, #111344, #004771, #044446, #00161b); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .xmems-banner .banner-content { position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 7rem 0; } .xmems-banner .banner-content .banner-title { font-size: 3.5rem; font-weight: bold; line-height: 1.25; color: #02afe7; } .xmems-banner .banner-content .banner-subtitle { font-size: 1.75rem; color: #fff; } .xmems-banner .banner-content .banner-body { margin-top: 4rem; max-width: 700px; display: flex; } .xmems-banner .banner-content .banner-body img { margin: auto; max-width: 400px; } .xmems-banner .banner-content .banner-body .flex-avatar { width: 200px; height: 200px } .xmems-banner .banner-content .banner-body .text-lg { color: #00afe7 } @media (max-width: 767.98px) { .xmems-banner .banner-content { position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 3rem 0; } .xmems-banner .banner-content .banner-title { font-size: 1.75rem; } .xmems-banner .banner-content .banner-subtitle { font-size: 1.25rem; } .xmems-banner .banner-content .banner-body .flex-avatar { width: 100px; height: 100px } .xmems-banner .banner-content .banner-body { flex-direction: column; align-items: center; justify-content: center; text-align: center; margin-top: 2rem; } } /** xmems-block-3 **/ .xmems-block-3 { position: relative; } .xmems-block-3 .block-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; } .xmems-block-3 .block-content { position: relative; padding-top: 6rem; padding-bottom: 6rem; } .xmems-block-3 .block-title { font-size: 2.5rem; font-weight: bold; color: #fff; } .xmems-block-3 .block-subtitle { font-size: 1.5rem; color: #fff; } .xmems-block-3 .block-desc { font-size: 1rem; color: #fff; } .xmems-block-3 .block-holder { } .xmems-block-3 .block-holder .item { position: relative; flex: 1 1 auto; background-color: #2299ce; border-radius: var(--radius-md); padding: 1.5rem 1rem 1rem; } @supports (((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px)))) { .xmems-block-3 .block-holder .item { background-color: rgba(34, 154, 206, 0.6); -webkit-backdrop-filter: saturate(180%) blur(6px); backdrop-filter: saturate(180%) blur(6px); } } .xmems-block-3 .block-holder .item .item-icon { width: 78px; margin: 0 auto; } .xmems-block-3 .block-holder .item .item-text { text-align: center; color: #fff; } @media (max-width: 767.98px) { .xmems-block-3 { padding-top: 2rem; padding-bottom: 2rem; } .xmems-block-3 .block-title { font-size: 1.75rem; } .xmems-block-3 .block-subtitle { font-size: 1.25rem; } .xmems-block-3 .block-content { padding-top: 0; padding-bottom: 0; } } /** xmems-block-4 **/ .xmems-block-4 { position: relative; padding-top: 4rem; padding-bottom: 4rem; background-position: center; background-repeat: no-repeat; background-size: cover; } .xmems-block-4 .swiper { height: 380px; } .xmems-block-4 .swiper .item { position: relative; display: flex; flex-direction: row; /* align-items: center; */ min-width: 0; word-wrap: break-word; margin: 0 0 0; } .xmems-block-4 .swiper .item .media { width: 35%; flex-shrink: 0; } .xmems-block-4 .swiper .item .item-body { flex: 1 1 auto; display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; padding: 0.25rem 0 0.25rem 1rem; } .xmems-block-4 .swiper .item .item-body h2 { font-size: 1.75rem; } .xmems-block-4 .swiper .item .item-more { } .xmems-block-4 .swiper .item .item-more .iconfont { position: relative; transition: all 0.3s ease-in-out; margin-left: 5px; } .xmems-block-4 .swiper .item .item-more:hover .iconfont { margin-left: 15px; } .xmems-block-4 .slide-prev-button:disabled, .xmems-block-4 .slide-next-button:disabled { opacity: 0.8; } .xmems-block-4 .block-title { position: relative; font-weight: bold; } .xmems-block-4 .block-title h2 { position: relative; font-size: 2.5rem; /* text-align: center; */ z-index: 1; } .xmems-block-4 .block-subtitle { position: absolute; left: 0%; top: 50%; transform: translate(0%, -75%); font-size: 2rem; font-style: italic; opacity: 0.23; } @media (max-width: 767.98px) { .xmems-block-4 { position: relative; padding-top: 2rem; padding-bottom: 2rem; } .xmems-block-4 .swiper .item .item-body { padding: 0.125rem 0 0.125rem 0.75rem; } .xmems-block-4 .swiper .item .item-body h2 { font-size: 1.125rem; } .xmems-block-4 .block-title h2 { font-size: 1.75rem; } .xmems-block-4 .block-subtitle { font-size: 2rem; } .block-4-slide-2, .block-4-slide-1 { border-bottom: 1px solid var(--bg-light); } } /** xmems-block-5 **/ .xmems-block-5 { position: relative; padding-top: 4rem; padding-bottom: 4rem; } .xmems-block-5 .block-title { position: relative; font-weight: bold; } .xmems-block-5 .block-title h2 { position: relative; font-size: 2.5rem; /* text-align: center; */ z-index: 1; } .xmems-block-5 .block-subtitle { position: absolute; left: 0%; top: 50%; transform: translate(0%, -75%); font-size: 2.75rem; font-style: italic; opacity: 0.3; } .xmems-block-5 .product-item { position: relative; padding: 2rem; flex: 1 1 auto; min-height: 350px; transition: all 0.3s ease-in-out; } .xmems-block-5 .product-item:hover { transform: translateY(-15px); box-shadow: 0 20px 30px 5px rgba(0, 0, 0, 0.1); } .xmems-block-5 .product-item .product-img { height: 80px; margin-top: 10px; } .xmems-block-5 .product-item .product-title { font-size: 1.375rem; font-weight: bold; color: #000; } .xmems-block-5 .product-item .product-more { position: absolute; bottom: 1.5rem; left: 2rem; } .xmems-block-5 .product-item .product-more .iconfont { position: relative; transition: all 0.3s ease-in-out; margin-left: 5px; } .xmems-block-5 .product-item .product-more:hover .iconfont { margin-left: 15px; } @media (max-width: 767.98px) { .xmems-block-5 { position: relative; padding-top: 2rem; padding-bottom: 2rem; } .xmems-block-5 .block-title h2 { font-size: 1.75rem; /* text-align: center; */ z-index: 1; } .xmems-block-5 .block-subtitle { font-size: 2rem; } .xmems-block-5 .product-item { padding: 1rem; } .xmems-block-5 .product-item .product-more { left: 1rem; } } /** xmems-block-5 1 **/ .xmems-block-5-1 { position: relative; padding-top: 4rem; padding-bottom: 4rem; background-color: #06217a; } .xmems-block-5-1 .top-content { display: flex; justify-content: space-between; align-items: center; } .xmems-block-5-1 .top-content .content-body { width: 40%; color: #fff; } .xmems-block-5-1 .top-content .content-body h2 { font-size: 2.5rem; color: #00afe7; } @media (max-width: 767.98px) { .xmems-block-5-1 { padding-top: 2rem; padding-bottom: 2rem; } .xmems-block-5-1 .top-content .content-body h2 { font-size: 1.75rem; } .xmems-block-5-1 .top-content { display: flex; justify-content: flex-start; align-items: start; flex-direction: column; } .xmems-block-5-1 .top-content .content-body { width: 100%; } .xmems-block-5-1 .top-content .content-image { width: 50%; } } .xmems-block-5-1 .top-content .content-image { width: 50%; } .xmems-block-5-1 .top-content .content-action { background-color: #fff; border-color: #fff; color: #06217a } .xmems-block-5-1 .top-content .content-action:hover, .xmems-block-5-1 .top-content .content-action:focus, .xmems-block-5-1 .top-content .content-action:active { background-color: #0cf4ad; border-color: #0cf4ad; color: #06217a } .xmems-block-5-1 .bottom-content h2 { color: #00afe7; } .xmems-block-5-1 .bottom-content .applications-list { } .xmems-block-5-1 .bottom-content .applications-list .item { flex: 1 1 auto; text-align: center; background-color: #001466; border-radius: var(--radius-md); padding: 2rem 1rem; } .xmems-block-5-1 .bottom-content .applications-list .item img { height: 70px } @media (max-width: 767.98px) { .xmems-block-5-1 .bottom-content .applications-list .item img { height: 40px } .xmems-block-5-1 .bottom-content .applications-list .item { padding: 1.25rem .5rem 1.25rem; } } /** xmems-block-5 2 **/ .xmems-block-5-2 { position: relative; padding-top: 4rem; padding-bottom: 4rem; background-color: #fff; } .xmems-block-5-2 .top-content { display: flex; justify-content: space-between; align-items: center; } .xmems-block-5-2 .top-content .content-body { width: 40%; } .xmems-block-5-2 .top-content .content-body h2 { font-size: 2.5rem; } .xmems-block-5-2 .top-content .content-image { width: 50%; } @media (max-width: 767.98px) { .xmems-block-5-2 { padding-top: 2rem; padding-bottom: 2rem; } .xmems-block-5-2 .top-content .content-body h2 { font-size: 1.75rem; color: #00afe7; } .xmems-block-5-2 .top-content { display: flex; justify-content: flex-start; align-items: start; flex-direction: column; } .xmems-block-5-2 .top-content .content-body { width: 100%; margin-bottom: 30px } .xmems-block-5-2 .top-content .content-image { width: 50%; } #block-5-2.xmems-block-5-2 .top-content .content-image { width: 100%; } } .xmems-block-5-2 .bottom-content h2 { color: #00afe7; } .xmems-block-5-2 .bottom-content .applications-list { } .xmems-block-5-2 .bottom-content .applications-list .item { flex: 1 1 auto; text-align: center; background-color: #001466; border-radius: var(--radius-md); padding: 2rem 1rem 1.5rem; } .xmems-block-5-2 .bottom-content .applications-list .item img { height: 70px } @media (max-width: 767.98px) { .xmems-block-5-2 .bottom-content .applications-list .item img { height: 40px } .xmems-block-5-2 .bottom-content .applications-list .item { padding: 1.25rem .5rem 1.25rem; } } /** xmems-block-6 **/ .xmems-block-6 { position: relative; padding-top: 4rem; padding-bottom: 4rem; } .xmems-block-6 .block-title { position: relative; font-weight: bold; } .xmems-block-6 .block-title h2 { position: relative; font-size: 2.5rem; /* text-align: center; */ z-index: 1; } .xmems-block-6 ul { padding-left: 18px; list-style: disc; line-height: 2; } .xmems-block-6 ol { list-style: decimal; padding-left: 18px; line-height: 2; } @media (max-width: 767.98px) { .xmems-block-6 { position: relative; padding-top: 2rem; padding-bottom: 2rem; } .xmems-block-6 img { width: 100%; } .xmems-block-6 .block-title h2 { font-size: 1.75rem; } .xmems-block-6 .block-subtitle { font-size: 2rem; } .xmems-block-6 .text-lg { padding: 0 20px; } .xmems-block-6 ul, .xmems-block-6 ol { } .xmems-block-6 ul, .xmems-block-6 ol { padding: 0 40px; } .xmems-block-6 ul li { position: relative; } } /** xmems-block-7 **/ .xmems-block-7 { position: relative; padding-top: 4rem; padding-bottom: 4rem; background-color: #fff; } .xmems-block-7 .block-title { position: relative; font-weight: bold; } .xmems-block-7 .block-title h2 { position: relative; font-size: 2.5rem; /* text-align: center; */ z-index: 1; } .xmems-block-7 .block-subtitle { position: absolute; left: 0%; top: 50%; transform: translate(0%, -75%); font-size: 2.75rem; font-style: italic; opacity: 0.3; } @media (max-width: 767.98px) { .xmems-block-7 { position: relative; padding-top: 2rem; padding-bottom: 2rem; } .xmems-block-7 .block-title h2 { font-size: 2rem; } .xmems-block-7 .block-subtitle { font-size: 2rem; } } /** footer **/ .footer-xmems { padding: 4rem 0; background-size: contain; background-repeat: no-repeat; background-position: left bottom; background-color: #000; } .footer-xmems-menu li { padding: 5px 0; } .footer-xmems-menu li a { color: #fff; opacity: 0.6; } .footer-xmems-menu li a:hover { opacity: 1; } @media (max-width: 767.98px) { .footer-xmems-menu li { text-align: center; } } /** tablepress **/ .tablepress-scroll-wrapper { overflow-x: auto; overflow-y: hidden; } table.tablepress { border-width: 0; color: #111; width: 100%; } table.tablepress th, table.tablepress td { background: transparent; border: 0; padding: .75rem 1rem } table.tablepress th { text-transform: uppercase; letter-spacing: 1px; color: #111; font-weight: 800; } table.tablepress th, table.tablepress tr:not(:last-child) td { border-bottom: 1px solid #020202; } table.tablepress th:not(:last-child), table.tablepress td:not(:last-child) { border-right: 1px solid #020202; } table.tablepress.white { color: #fff; } table.tablepress.white th { color: #fff; } table.tablepress.white th, table.tablepress.white tr:not(:last-child) td { border-bottom: 1px solid #00afe7; } table.tablepress.white th:not(:last-child), table.tablepress.white td:not(:last-child) { border-right: 1px solid #00afe7; } /** knowles **/ .knowles-block-1 .knowles-block-bg { position: relative; height: 500px; background-position: center; background-repeat: no-repeat; background-size: cover; } .knowles-block-1 .knowles-block-bg a { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; } .knowles-block-1 .knowles-block-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; } .knowles-block-1 .knowles-block-logo img { max-width: 250px; } .knowles-block-1 .knowles-block-logo h1 { font-size: 40px; text-shadow: 0 5px 20px rgb(0 0 0 / 20%); } .knowles-block-1 .knowles-block-content { position: relative; margin-top: -40px; z-index: 3; } .knowles-block-1 .knowles-block-content p { margin-bottom: 20px; } .knowles-block-1 .knowles-block-content p:last-child { margin-bottom: 0; } .knowles-block-title { font-size: 36px } .knowles-block-title span { position: relative; } .knowles-block-title span:after { content: ''; position: absolute; right: 0; bottom: 5px; width: 70px; height: 12px; border-radius: 20px; background: linear-gradient(270deg, #02E6D2 0%, #13AAF7 100%); transform: rotate(-8.5deg); z-index: -1; } .knowles-block-2 .knowles-block-img { max-width: 480px; } .knowles-block-3 .knowles-block-content { position: relative; height: 400px; } .knowles-block-2 .knowles-block-content h3, .knowles-block-3 .knowles-block-content h3 { font-size: 28px; } .knowles-block-3 .knowles-block-body { position: relative; padding: 2.5rem; z-index: 2; } .knowles-block-2 .knowles-block-content ul, .knowles-block-3 .knowles-block-content ul { display: flex; flex-direction: column; gap: 8px; } .knowles-block-2 .knowles-block-content ul li { position: relative; padding-left: 30px; font-size: 1rem; transition: all 0.3s ease-in-out; } .knowles-block-2 .knowles-block-content ul li:hover { transform: translateX(4px); } .knowles-block-2 .knowles-block-content ul li:before { content: ''; position: absolute; left: 0; top: 50%; width: 20px; height: 20px; transform: translate(0, -50%); background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iIzJGODBFRCIgZD0iTTE2LjQ4NSAzLjk5NmEuODQ0Ljg0NCAwIDEgMSAuNzU0IDEuNTFsLTkuNzAyIDQuODRhLjg0NC44NDQgMCAwIDEtLjc1My0xLjUxbDkuNzAxLTQuODRaIi8+PHBhdGggZmlsbD0iIzAwMCIgZD0iTTExLjYzNCAxLjU2NiAxLjk0MyA2LjQxYS44NDQuODQ0IDAgMCAwLS40NjYuNzU1djkuNjkxYS44NDQuODQ0IDAgMCAwIC40NjYuNzU1bDkuNjkxIDQuODQ2YS44NDMuODQzIDAgMCAwIC43NTUgMGw5LjY5Mi00Ljg0NmEuODQ0Ljg0NCAwIDAgMCAuNDY2LS43NTVWNy4xNjZhLjg0NS44NDUgMCAwIDAtLjQ2Ni0uNzU1bC05LjY5Mi00Ljg0NWEuODQ0Ljg0NCAwIDAgMC0uNzU1IDBabS4zNzggMS42OTggOC44NDcgNC40MjN2OC42NDlsLTguODQ3IDQuNDI0LTguODQ4LTQuNDI0VjcuNjg3bDguODQ4LTQuNDIzWiIvPjxwYXRoIGZpbGw9IiMwMDAiIGQ9Ik0xLjU2NiA2Ljc4NGEuODQ0Ljg0NCAwIDAgMSAxLjEzMS0uMzc4bDkuNzAyIDQuODRhLjg0NC44NDQgMCAwIDEtLjc1MyAxLjUxbC05LjcwMi00Ljg0YS44NDQuODQ0IDAgMCAxLS4zNzgtMS4xMzJaIi8+PHBhdGggZmlsbD0iIzAwMCIgZD0iTTEyLjAzMiAxMS4xNThjLjQ2NiAwIC44NDQuMzc3Ljg0NC44NDN2OS43MDJhLjg0NC44NDQgMCAwIDEtMS42ODggMHYtOS43MDJjMC0uNDY2LjM3OC0uODQzLjg0NC0uODQzWiIvPjxwYXRoIGZpbGw9IiMwMDAiIGQ9Ik0yMS4zMjYgNi40MDZhLjg0NC44NDQgMCAwIDEgLjc1NCAxLjUxbC05LjcwMiA0Ljg0YS44NDQuODQ0IDAgMSAxLS43NTQtMS41MWw5LjcwMi00Ljg0WiIvPjwvc3ZnPg=='); } .knowles-block-3 .knowles-block-content ul li { font-size: 1rem; transition: all 0.3s ease-in-out; } .knowles-block-3 .knowles-block-content ul li:hover { transform: translateX(4px); } .knowles-block-3 .knowles-block-content ul li a i { position: relative; top: 5px; display: inline-block; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOSIgaGVpZ2h0PSIyOSIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iIzJGODBFRCIgZD0iTTIwLjE3IDkuNDU5IDkuNDU5IDIwLjE3YS44MDguODA4IDAgMCAxLTEuMTQgMGMtLjI4NC0uMjg1LS4yODQtLjg1NSAwLTEuMTRMMTkuMDMyIDguMzJhLjgwNy44MDcgMCAwIDEgMS4xNCAwIC44MDcuODA3IDAgMCAxIDAgMS4xNFoiLz48cGF0aCBmaWxsPSIjMkY4MEVEIiBkPSJNMjAuMTcxIDE2LjYzOGEuNzMyLjczMiAwIDAgMS0uNTcuMjI4Ljg3Ni44NzYgMCAwIDEtLjg1NC0uODU0VjkuNzQ0aC02LjI2OGEuODc2Ljg3NiAwIDAgMS0uODU1LS44NTVjMC0uNDU2LjM5OS0uODU1Ljg1NS0uODU1bDcuMTIyLjA1N2MuNDU2IDAgLjg1NS40Ljg1NS44NTVsLjA1NyA3LjEyM2MtLjA1Ny4xNy0uMTcuMzk4LS4zNDIuNTdaIi8+PC9zdmc+'); } .knowles-block-3 .knowles-block-bg { position: absolute; bottom: 0; width: 100%; height: 300px; background-repeat: no-repeat; background-size: cover; background-position: center; border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; } .knowles-block-4 .knowles-block-list .swiper { height: 380px } .knowles-block-4 .knowles-block-list .item { display: flex; flex-direction: row; min-width: 0; word-wrap: break-word; gap: 15px; border-radius: var(--radius-md); } .knowles-block-4 .knowles-block-list .item .item-content { display: flex; flex-direction: column; justify-content: center; flex: 1 1 auto; min-width: 0; } .footer-knowles .footer-knowles-logo { max-width: 220px; } @media (max-width: 767.98px) { .knowles-block-1 .knowles-block-bg { position: relative; height: 300px; background-position: center; background-repeat: no-repeat; background-size: cover; } .knowles-block-1 .knowles-block-logo img { max-width: 200px; margin-bottom: 10px; } .knowles-block-1 .knowles-block-logo h1 { font-size: 32px; } .knowles-block-1 .knowles-block-content { margin-top: -40px; } .knowles-block-title { font-size: 28px } .knowles-block-title span:after { bottom: 5px; width: 50px; height: 10px; transform: rotate(-8.5deg); } .knowles-block-2 .knowles-block-img { max-width: 480px; } .knowles-block-3 .knowles-block-content { height: 400px; } .knowles-block-2 .knowles-block-content h3, .knowles-block-3 .knowles-block-content h3 { font-size: 22px; } .knowles-block-3 .knowles-block-body { padding: 1.5rem; } .knowles-block-2 .knowles-block-content ul, .knowles-block-3 .knowles-block-content ul { gap: 8px; } .knowles-block-2 .knowles-block-content ul li { padding-left: 30px; } .knowles-block-2 .knowles-block-content ul li:before { width: 20px; height: 20px; } .knowles-block-3 .knowles-block-content ul li a i { top: 5px; width: 20px; height: 20px; } .knowles-block-3 .knowles-block-bg { position: absolute; bottom: 0; width: 100%; height: 300px; background-repeat: no-repeat; background-size: cover; background-position: center; border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; } .knowles-block-4 .knowles-block-list .item { gap: 10px; } .knowles-block-4 .knowles-block-list .swiper { height: 380px } .knowles-block-4 .knowles-block-content .slide-prev-button, .knowles-block-4 .knowles-block-content .slide-next-button { width: 1.75rem; height: 1.75rem; } .footer-knowles .footer-knowles-logo { max-width: 220px; } } @media (min-width: 768px) and (max-width: 991.98px) { .knowles-block-1 .knowles-block-bg { position: relative; height: 300px; background-position: center; background-repeat: no-repeat; background-size: cover; } .knowles-block-1 .knowles-block-logo img { max-width: 200px; margin-bottom: 10px; } .knowles-block-1 .knowles-block-logo h1 { font-size: 32px; } .knowles-block-1 .knowles-block-content { margin-top: -40px; } .knowles-block-title { font-size: 28px } .knowles-block-title span:after { bottom: 5px; width: 50px; height: 10px; transform: rotate(-8.5deg); } .knowles-block-2 .knowles-block-img { max-width: 200px; } .knowles-block-3 .knowles-block-content { height: 400px; } .knowles-block-2 .knowles-block-content h3, .knowles-block-3 .knowles-block-content h3 { font-size: 22px; } .knowles-block-3 .knowles-block-body { padding: 1.5rem; } .knowles-block-2 .knowles-block-content ul, .knowles-block-3 .knowles-block-content ul { gap: 8px; } .knowles-block-2 .knowles-block-content ul li { padding-left: 30px; } .knowles-block-2 .knowles-block-content ul li:before { width: 20px; height: 20px; } .knowles-block-3 .knowles-block-content ul li a i { top: 5px; width: 20px; height: 20px; } .knowles-block-3 .knowles-block-bg { position: absolute; bottom: 0; width: 100%; height: 300px; background-repeat: no-repeat; background-size: cover; background-position: center; border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; } .knowles-block-4 .knowles-block-list .item { gap: 10px; } .knowles-block-4 .knowles-block-list .swiper { height: 280px } .knowles-block-4 .knowles-block-content .slide-prev-button, .knowles-block-4 .knowles-block-content .slide-next-button { width: 1.75rem; height: 1.75rem; } .footer-knowles .footer-knowles-logo { max-width: 220px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .knowles-block-4 .knowles-block-list .swiper { height: 280px } } /** LHDC **/ .page-template-page-lhdc { --color-primary: #02758d; --btn-primary: #02758d; } .lhdc-banner img { width: 100%; } .lhdc-block { padding: 56px 0; } @media (max-width: 767.98px) { .lhdc-block { padding: 24px 0; } } @media (min-width: 768px) and (max-width: 991.98px) { .lhdc-block { padding: 40px 0; } } @media (min-width: 992px) and (max-width: 1199.98px) { .lhdc-block { padding: 40px 0; } } .lhdc-block .lhdc-block-title { font-size: 2.5rem; } @media (max-width: 767.98px) { .lhdc-block .lhdc-block-title { font-size: 1.375rem; } } @media (min-width: 768px) and (max-width: 991.98px) { .lhdc-block .lhdc-block-title { font-size: 1.75rem; } } @media (min-width: 992px) and (max-width: 1199.98px) { .lhdc-block .lhdc-block-title { font-size: 2rem; } } .lhdc-block .four-column-nav { padding: 0; } /** LHDC 1 **/ .lhdc-block-1 { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; height: 600px; background-position: center; background-repeat: no-repeat; background-size: cover; } .lhdc-block-1 .block { padding: 60px 420px 60px 60px; } .lhdc-block-1 .block .block-image { position: absolute; width: 360px; right: 0; top: 50%; transform: translate(0%, -50%); } @media (max-width: 767.98px) { .lhdc-block-1 { height: auto; } .lhdc-block-1 .block { padding: 32px; display: flex; align-items: center; gap: 20px; } .lhdc-block-1 .block .block-image { display: none; } } @media (min-width: 768px) and (max-width: 991.98px) { .lhdc-block-1 { height: auto; } .lhdc-block-1 .block { padding: 32px; display: flex; align-items: center; gap: 20px; } .lhdc-block-1 .block .block-image { /* display: none; */ position: relative; right: auto; top: auto; transform: none; width: 200px; flex-shrink: 0; } } @media (min-width: 992px) and (max-width: 1199.98px) { .lhdc-block-1 .block { padding: 40px 420px 40px 40px; } } /** LHDC 3 **/ .lhdc-news-list { position: relative; } .lhdc-news-list .swiper { height: 420px; } .lhdc-news-list .swiper .item { position: relative; display: flex; flex-direction: row; align-items: center; min-width: 0; word-wrap: break-word; margin: 0 0 0; } .lhdc-news-list .swiper .item .media { width: 110px; flex-shrink: 0; } .lhdc-news-list .swiper .item .item-body { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; padding: 0 0 0 1rem; } @media (max-width: 767.98px) { .lhdc-news-list .swiper { height: 390px; } } @media (min-width: 768px) and (max-width: 991.98px) { .lhdc-news-list .swiper .item .media { width: 16.6667%; } .lhdc-news-list .swiper { height: 400px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .lhdc-news-list .swiper { height: 395px; } } /** LHDC 7 **/ .lhdc-about { position: relative; overflow: hidden; background-repeat: no-repeat; background-position: center; background-size: cover; } .lhdc-about .about-content { position: relative; z-index: 3; } .lhdc-about .about-cover-2 { position: absolute; bottom: -30px; right: 8%; width: 600px; height: 600px; background-repeat: no-repeat; background-position: center; background-size: contain; z-index: 1; } @media (max-width: 767.98px) { .lhdc-about .about-cover-2 { display: none; } } @media (min-width: 768px) and (max-width: 991.98px) { .lhdc-about .about-cover-2 { display: none; } } @media (min-width: 992px) and (max-width: 1199.98px) { .lhdc-about .about-cover-2 { bottom: -30px; right: 8%; width: 400px; height: 400px; } } .lhdc-about .about-cover-3 { position: absolute; right: 10%; top: 20%; width: 200px; height: 200px; background-repeat: no-repeat; background-position: center; background-size: contain; animation: alltuchtopdown 8s infinite linear; } @media (max-width: 767.98px) { .lhdc-about .about-cover-3 { right: 4%; top: 4%; width: 80px; height: 80px; } } @keyframes alltuchtopdown { 0% { transform: rotateX(0deg) translateY(0px); } 50% { transform: rotateX(0deg) translateY(-50px); } 100% { transform: rotateX(0deg) translateY(0px); } } .lhdc-about .about-desc { } .lhdc-about .about-column .block { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; padding: 24px 30px 24px 60px; } .lhdc-about .about-column .block:before { content: ''; position: absolute; left: 20px; top: 22px; width: 30px; height: 30px; background-repeat: no-repeat; background-position: center; background-size: contain; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNCcgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyBmaWxsPSdub25lJz48cGF0aCBkPSdNMjQgMHYyNEgwVjB6TTEyLjU5MyAyMy4yNThsLS4wMTEuMDAyLS4wNzEuMDM1LS4wMi4wMDQtLjAxNC0uMDA0LS4wNzEtLjAzNWMtLjAxLS4wMDQtLjAxOS0uMDAxLS4wMjQuMDA1bC0uMDA0LjAxLS4wMTcuNDI4LjAwNS4wMi4wMS4wMTMuMTA0LjA3NC4wMTUuMDA0LjAxMi0uMDA0LjEwNC0uMDc0LjAxMi0uMDE2LjAwNC0uMDE3LS4wMTctLjQyN2MtLjAwMi0uMDEtLjAwOS0uMDE3LS4wMTctLjAxOG0uMjY1LS4xMTMtLjAxMy4wMDItLjE4NS4wOTMtLjAxLjAxLS4wMDMuMDExLjAxOC40My4wMDUuMDEyLjAwOC4wMDcuMjAxLjA5M2MuMDEyLjAwNC4wMjMgMCAuMDI5LS4wMDhsLjAwNC0uMDE0LS4wMzQtLjYxNGMtLjAwMy0uMDEyLS4wMS0uMDItLjAyLS4wMjJtLS43MTUuMDAyYS4wMjMuMDIzIDAgMCAwLS4wMjcuMDA2bC0uMDA2LjAxNC0uMDM0LjYxNGMwIC4wMTIuMDA3LjAyLjAxNy4wMjRsLjAxNS0uMDAyLjIwMS0uMDkzLjAxLS4wMDguMDA0LS4wMTEuMDE3LS40My0uMDAzLS4wMTItLjAxLS4wMXonLz48cGF0aCBmaWxsPScjMkFDNjcwRkYnIGQ9J00xMiAyYzUuNTIzIDAgMTAgNC40NzcgMTAgMTBzLTQuNDc3IDEwLTEwIDEwUzIgMTcuNTIzIDIgMTIgNi40NzcgMiAxMiAybTMuNTM1IDYuMzgxLTQuOTUgNC45NS0yLjEyLTIuMTIxYTEgMSAwIDAgMC0xLjQxNSAxLjQxNGwyLjc1OCAyLjc1OGExLjEgMS4xIDAgMCAwIDEuNTU2IDBsNS41ODYtNS41ODZhMSAxIDAgMCAwLTEuNDE1LTEuNDE1Jy8+PC9nPjwvc3ZnPg=='); } @media (max-width: 767.98px) { .lhdc-about .about-column .block { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; padding: 14px 12px 14px 48px; } .lhdc-about .about-column .block:before { left: 12px; top: 14px; width: 28px; height: 28px; } } .lhdc-about .lhdc-brand-list { display: flex; flex-direction: row; flex-wrap: wrap; gap: 4px; } .lhdc-about .lhdc-brand-list li { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: 72px; height: 40px; border-radius: 4px; border: 1px solid var(--color-light); } .lhdc-about .lhdc-brand-list li img { width: inherit; height: inherit; object-fit: contain; } .lhdc-block-8 { } .lhdc-block-8 ul li { position: relative; padding-left: 40px; } .lhdc-block-8 ul li:before { content: ''; position: absolute; left: 0px; top: 0px; width: 30px; height: 30px; background-repeat: no-repeat; background-position: center; background-size: contain; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNCcgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyBmaWxsPSdub25lJz48cGF0aCBkPSdNMjQgMHYyNEgwVjB6TTEyLjU5MyAyMy4yNThsLS4wMTEuMDAyLS4wNzEuMDM1LS4wMi4wMDQtLjAxNC0uMDA0LS4wNzEtLjAzNWMtLjAxLS4wMDQtLjAxOS0uMDAxLS4wMjQuMDA1bC0uMDA0LjAxLS4wMTcuNDI4LjAwNS4wMi4wMS4wMTMuMTA0LjA3NC4wMTUuMDA0LjAxMi0uMDA0LjEwNC0uMDc0LjAxMi0uMDE2LjAwNC0uMDE3LS4wMTctLjQyN2MtLjAwMi0uMDEtLjAwOS0uMDE3LS4wMTctLjAxOG0uMjY1LS4xMTMtLjAxMy4wMDItLjE4NS4wOTMtLjAxLjAxLS4wMDMuMDExLjAxOC40My4wMDUuMDEyLjAwOC4wMDcuMjAxLjA5M2MuMDEyLjAwNC4wMjMgMCAuMDI5LS4wMDhsLjAwNC0uMDE0LS4wMzQtLjYxNGMtLjAwMy0uMDEyLS4wMS0uMDItLjAyLS4wMjJtLS43MTUuMDAyYS4wMjMuMDIzIDAgMCAwLS4wMjcuMDA2bC0uMDA2LjAxNC0uMDM0LjYxNGMwIC4wMTIuMDA3LjAyLjAxNy4wMjRsLjAxNS0uMDAyLjIwMS0uMDkzLjAxLS4wMDguMDA0LS4wMTEuMDE3LS40My0uMDAzLS4wMTItLjAxLS4wMXonLz48cGF0aCBmaWxsPScjMkFDNjcwRkYnIGQ9J00xMiAyYzUuNTIzIDAgMTAgNC40NzcgMTAgMTBzLTQuNDc3IDEwLTEwIDEwUzIgMTcuNTIzIDIgMTIgNi40NzcgMiAxMiAybTMuNTM1IDYuMzgxLTQuOTUgNC45NS0yLjEyLTIuMTIxYTEgMSAwIDAgMC0xLjQxNSAxLjQxNGwyLjc1OCAyLjc1OGExLjEgMS4xIDAgMCAwIDEuNTU2IDBsNS41ODYtNS41ODZhMSAxIDAgMCAwLTEuNDE1LTEuNDE1Jy8+PC9nPjwvc3ZnPg=='); } .lhdc-block-8 .points-list { } .lhdc-block-8 .points-list .item { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; flex: 1 1 auto; padding: 3px; background: linear-gradient(to right, #00B3F2, #00E091); border-radius: 8px; } .lhdc-block-8 .points-list .item .item-inner { flex: 1 1 auto; background: #fff; padding: 32px; border-radius: 6px; } .lhdc-block-8 .points-list .item .item-title span { position: relative; } .lhdc-block-8 .points-list .item .item-title span:before { content: ''; position: absolute; right: -2px; bottom: -3px; left: -2px; background-color: #000; height: 12px; border-radius: 30px; opacity: 0.1; z-index: 0; } .lhdc-block-8 .points-list .item .item-content { display: flex; flex-direction: row; flex: 1 1 auto; justify-content: center; } .lhdc-block-8 .points-list .item .item-image { width: 100px; } .lhdc-block-8 .points-list .item .item-body { flex: 1 1 auto; } .lhdc-block-8 .points-list .item .item-desc { border-top: 1px solid var(--border-color); margin-top: 20px; padding-top: 16px; } /** LHDC 2 **/ .lhdc-block-2 .block-menu { } .lhdc-block-2 .block-menu .item { position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column; word-wrap: break-word; flex: 1 1 auto; text-align: center; min-width: 1px; padding: 40px 12px; border: 2px solid transparent; border-radius: var(--radius-md); transition: all .3s ease-in-out; } @media (min-width: 768px) and (max-width: 991.98px) { .lhdc-block-2 .block-menu .item { padding: 24px 12px; } } .lhdc-block-2 .block-menu .item:hover { border-color: var(--color-primary); transform: scale(1.05) } .lhdc-block-2 .block-menu .item .item-icon { width: 64px; height: 64px; display: flex; justify-content: center; align-items: center; background-color: var(--color-primary); border-radius: 100%; } .lhdc-block-2 .block-menu .item .item-icon:after { content: ''; display: block; width: 44px; height: 44px; background-position: center; background-size: contain; background-repeat: no-repeat; } .lhdc-block-2 .block-menu .item .item-title { font-size: 1.25rem; } @media (max-width: 767.98px) { .lhdc-block-2 .block-menu .item { padding: 12px 4px; } .lhdc-block-2 .block-menu .item .item-icon { width: 48px; height: 48px; } .lhdc-block-2 .block-menu .item .item-icon:after { width: 24px; height: 24px; } .lhdc-block-2 .block-menu .item .item-title { font-size: .875rem; } } .lhdc-block-2 .block-menu .item .item-icon.icon-1:after { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNCcgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyBmaWxsPSdub25lJyBmaWxsLXJ1bGU9J2V2ZW5vZGQnPjxwYXRoIGQ9J00yNCAwdjI0SDBWMHpNMTIuNTk0IDIzLjI1OGwtLjAxMi4wMDItLjA3MS4wMzUtLjAyLjAwNC0uMDE0LS4wMDQtLjA3MS0uMDM2Yy0uMDEtLjAwMy0uMDE5IDAtLjAyNC4wMDZsLS4wMDQuMDEtLjAxNy40MjguMDA1LjAyLjAxLjAxMy4xMDQuMDc0LjAxNS4wMDQuMDEyLS4wMDQuMTA0LS4wNzQuMDEyLS4wMTYuMDA0LS4wMTctLjAxNy0uNDI3Yy0uMDAyLS4wMS0uMDA5LS4wMTctLjAxNi0uMDE4bS4yNjQtLjExMy0uMDE0LjAwMi0uMTg0LjA5My0uMDEuMDEtLjAwMy4wMTEuMDE4LjQzLjAwNS4wMTIuMDA4LjAwOC4yMDEuMDkyYy4wMTIuMDA0LjAyMyAwIC4wMjktLjAwOGwuMDA0LS4wMTQtLjAzNC0uNjE0Yy0uMDAzLS4wMTItLjAxLS4wMi0uMDItLjAyMm0tLjcxNS4wMDJhLjAyMy4wMjMgMCAwIDAtLjAyNy4wMDZsLS4wMDYuMDE0LS4wMzQuNjE0YzAgLjAxMi4wMDcuMDIuMDE3LjAyNGwuMDE1LS4wMDIuMjAxLS4wOTMuMDEtLjAwOC4wMDMtLjAxMS4wMTgtLjQzLS4wMDMtLjAxMi0uMDEtLjAxeicvPjxwYXRoIGZpbGw9JyNGRkZGRkZGRicgZD0nTTQgNGEyIDIgMCAwIDEgMi0yaDEyYTIgMiAwIDAgMSAyIDJ2NmgtMlY0SDZ2MTZoNXYySDZhMiAyIDAgMCAxLTItMnptNCA0YTEgMSAwIDAgMSAxLTFoNmExIDEgMCAxIDEgMCAySDlhMSAxIDAgMCAxLTEtMW0wIDRhMSAxIDAgMCAxIDEtMWgxYTEgMSAwIDEgMSAwIDJIOWExIDEgMCAwIDEtMS0xbTkgMmEzIDMgMCAxIDAgMCA2IDMgMyAwIDAgMCAwLTZtLTUgM2E1IDUgMCAxIDEgMTAgMCA1IDUgMCAwIDEtMTAgMG01LTIuNWExIDEgMCAwIDEgMSAxdi41YTEgMSAwIDEgMSAwIDJoLTFhMSAxIDAgMCAxLTEtMXYtMS41YTEgMSAwIDAgMSAxLTEnLz48L2c+PC9zdmc+'); } .lhdc-block-2 .block-menu .item .item-icon.icon-2:after { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNCcgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyBmaWxsPSdub25lJyBmaWxsLXJ1bGU9J2V2ZW5vZGQnPjxwYXRoIGQ9J00yNCAwdjI0SDBWMHpNMTIuNTkzIDIzLjI1OGwtLjAxMS4wMDItLjA3MS4wMzUtLjAyLjAwNC0uMDE0LS4wMDQtLjA3MS0uMDM1Yy0uMDEtLjAwNC0uMDE5LS4wMDEtLjAyNC4wMDVsLS4wMDQuMDEtLjAxNy40MjguMDA1LjAyLjAxLjAxMy4xMDQuMDc0LjAxNS4wMDQuMDEyLS4wMDQuMTA0LS4wNzQuMDEyLS4wMTYuMDA0LS4wMTctLjAxNy0uNDI3Yy0uMDAyLS4wMS0uMDA5LS4wMTctLjAxNy0uMDE4bS4yNjUtLjExMy0uMDEzLjAwMi0uMTg1LjA5My0uMDEuMDEtLjAwMy4wMTEuMDE4LjQzLjAwNS4wMTIuMDA4LjAwNy4yMDEuMDkzYy4wMTIuMDA0LjAyMyAwIC4wMjktLjAwOGwuMDA0LS4wMTQtLjAzNC0uNjE0Yy0uMDAzLS4wMTItLjAxLS4wMi0uMDItLjAyMm0tLjcxNS4wMDJhLjAyMy4wMjMgMCAwIDAtLjAyNy4wMDZsLS4wMDYuMDE0LS4wMzQuNjE0YzAgLjAxMi4wMDcuMDIuMDE3LjAyNGwuMDE1LS4wMDIuMjAxLS4wOTMuMDEtLjAwOC4wMDQtLjAxMS4wMTctLjQzLS4wMDMtLjAxMi0uMDEtLjAxeicvPjxwYXRoIGZpbGw9JyNGRkZGRkZGRicgZD0nTTE4LjYzMyA5LjE3NyAxNCAxMC43MnY2Ljc4YTQuNSA0LjUgMCAxIDEtMi0zLjc0MlY2LjQ0MmEzIDMgMCAwIDEgMi4wNTEtMi44NDZsMy45NzUtMS4zMjVBMS41IDEuNSAwIDAgMSAyMCAzLjY5NHYzLjU4NWEyIDIgMCAwIDEtMS4zNjcgMS44OThtLTMuOTUtMy42ODRMMTggNC4zODdWNy4yOGwtNCAxLjMzNFY2LjQ0MmExIDEgMCAwIDEgLjY4NC0uOTVaTTEyIDE3LjVhMi41IDIuNSAwIDEgMS01IDAgMi41IDIuNSAwIDAgMSA1IDAnLz48L2c+PC9zdmc+'); } .lhdc-block-2 .block-menu .item .item-icon.icon-3:after { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNCcgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyBmaWxsPSdub25lJyBmaWxsLXJ1bGU9J2V2ZW5vZGQnPjxwYXRoIGQ9J00yNCAwdjI0SDBWMHpNMTIuNTk0IDIzLjI1OGwtLjAxMi4wMDItLjA3MS4wMzUtLjAyLjAwNC0uMDE0LS4wMDQtLjA3MS0uMDM2Yy0uMDEtLjAwMy0uMDE5IDAtLjAyNC4wMDZsLS4wMDQuMDEtLjAxNy40MjguMDA1LjAyLjAxLjAxMy4xMDQuMDc0LjAxNS4wMDQuMDEyLS4wMDQuMTA0LS4wNzQuMDEyLS4wMTYuMDA0LS4wMTctLjAxNy0uNDI3Yy0uMDAyLS4wMS0uMDA5LS4wMTctLjAxNi0uMDE4bS4yNjQtLjExMy0uMDE0LjAwMi0uMTg0LjA5My0uMDEuMDEtLjAwMy4wMTEuMDE4LjQzLjAwNS4wMTIuMDA4LjAwOC4yMDEuMDkyYy4wMTIuMDA0LjAyMyAwIC4wMjktLjAwOGwuMDA0LS4wMTQtLjAzNC0uNjE0Yy0uMDAzLS4wMTItLjAxLS4wMi0uMDItLjAyMm0tLjcxNS4wMDJhLjAyMy4wMjMgMCAwIDAtLjAyNy4wMDZsLS4wMDYuMDE0LS4wMzQuNjE0YzAgLjAxMi4wMDcuMDIuMDE3LjAyNGwuMDE1LS4wMDIuMjAxLS4wOTMuMDEtLjAwOC4wMDMtLjAxMS4wMTgtLjQzLS4wMDMtLjAxMi0uMDEtLjAxeicvPjxwYXRoIGZpbGw9JyNGRkZGRkZGRicgZD0nTTE5LjAyNiAyLjI3YTEuNSAxLjUgMCAwIDEgMS45NjggMS4yOTJsLjAwNi4xMzJ2My41ODVhMiAyIDAgMCAxLTEuMjE4IDEuODRsLS4xNS4wNTdMMTUgMTAuNzIxVjE3LjVsLS4wMDUuMjEyYTQuNSA0LjUgMCAxIDEtMi4yMTQtNC4wOTJsLjIxOS4xMzhWNi40NGEzIDMgMCAwIDEgMS44OC0yLjc4MmwuMTcxLS4wNjR6TTEwLjUgMTVhMi41IDIuNSAwIDEgMCAyLjQ5NSAyLjY2NEwxMyAxNy41YTIuNSAyLjUgMCAwIDAtMi41LTIuNU03IDFhMSAxIDAgMCAxIC45NDYuNjc3bC4xMy4zNzhhMyAzIDAgMCAwIDEuODY5IDEuODdsLjM3OC4xMjlhMSAxIDAgMCAxIDAgMS44OTJsLS4zNzguMTNhMyAzIDAgMCAwLTEuODcgMS44NjlsLS4xMjkuMzc4YTEgMSAwIDAgMS0xLjg5MiAwbC0uMTMtLjM3OGEzIDMgMCAwIDAtMS44NjktMS44N2wtLjM3OC0uMTI5YTEgMSAwIDAgMSAwLTEuODkybC4zNzgtLjEzYTMgMyAwIDAgMCAxLjg3LTEuODY5bC4xMjktLjM3OEExIDEgMCAwIDEgNyAxbTEyIDMuMzg3LTMuMzE2IDEuMTA2YTEgMSAwIDAgMC0uNjc3LjgzMkwxNSA2LjQ0MXYyLjE3MWw0LTEuMzMzem0tMTItLjE5QTUuMDA0IDUuMDA0IDAgMCAxIDYuMTk2IDVjLjI5OC4yMzYuNTY4LjUwNi44MDQuODA0LjIzNi0uMjk4LjUwNi0uNTY4LjgwNC0uODA0QTUuMDA0IDUuMDA0IDAgMCAxIDcgNC4xOTYnLz48L2c+PC9zdmc+'); } .lhdc-block-2 .block-menu .item .item-icon.icon-4:after { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNzYwNjk3MTM0NjE0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjE1NjA4IiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEyOCIgaGVpZ2h0PSIxMjgiPjxwYXRoIGQ9Ik03NjggNDI2LjY2NjY2N2ExNzAuNjY2NjY3IDE3MC42NjY2NjcgMCAwIDEgMTI4IDI4My41NjI2NjZ2MTc4Ljg1ODY2N2E0Ni45MzMzMzMgNDYuOTMzMzMzIDAgMCAxLTY3LjkyNTMzMyA0MS45ODRMNzY4IDkwMS4wMzQ2NjdsLTYwLjA3NDY2NyAzMC4wMzczMzNBNDYuOTMzMzMzIDQ2LjkzMzMzMyAwIDAgMSA2NDAgODg5LjA4OHYtMTc4Ljg1ODY2N0ExNzAuNjY2NjY3IDE3MC42NjY2NjcgMCAwIDEgNzY4IDQyNi42NjY2Njd6IG04NS4zMzMzMzMtMjU2YTg1LjMzMzMzMyA4NS4zMzMzMzMgMCAwIDEgODUuMzMzMzM0IDg1LjMzMzMzM3Y4NS4zMzMzMzNhNDIuNjY2NjY3IDQyLjY2NjY2NyAwIDAgMS04NS4zMzMzMzQgMFYyNTZIMTcwLjY2NjY2N3Y1MTJoMzQxLjMzMzMzM2E0Mi42NjY2NjcgNDIuNjY2NjY3IDAgMCAxIDAgODUuMzMzMzMzSDE3MC42NjY2NjdhODUuMzMzMzMzIDg1LjMzMzMzMyAwIDAgMS04NS4zMzMzMzQtODUuMzMzMzMzVjI1NmE4NS4zMzMzMzMgODUuMzMzMzMzIDAgMCAxIDg1LjMzMzMzNC04NS4zMzMzMzNoNjgyLjY2NjY2NnogbS00Mi42NjY2NjYgNTkxLjk1NzMzM2ExNzEuMDkzMzMzIDE3MS4wOTMzMzMgMCAwIDEtODUuMzMzMzM0IDB2NjQuMzQxMzMzbDIzLjU5NDY2Ny0xMS43NzZhNDIuNjY2NjY3IDQyLjY2NjY2NyAwIDAgMSAzOC4xNDQgMGwyMy41OTQ2NjcgMTEuNzc2di02NC4zNDEzMzN6TTc2OCA1MTJhODUuMzMzMzMzIDg1LjMzMzMzMyAwIDEgMCAwIDE3MC42NjY2NjcgODUuMzMzMzMzIDg1LjMzMzMzMyAwIDAgMCAwLTE3MC42NjY2Njd6IG0tMzg0IDQyLjY2NjY2N2E0Mi42NjY2NjcgNDIuNjY2NjY3IDAgMCAxIDQuOTkyIDg1LjAzNDY2NkwzODQgNjQwSDI5OC42NjY2NjdhNDIuNjY2NjY3IDQyLjY2NjY2NyAwIDAgMS00Ljk5Mi04NS4wMzQ2NjdMMjk4LjY2NjY2NyA1NTQuNjY2NjY3aDg1LjMzMzMzM3ogbTE3MC42NjY2NjctMTcwLjY2NjY2N2E0Mi42NjY2NjcgNDIuNjY2NjY3IDAgMSAxIDAgODUuMzMzMzMzSDI5OC42NjY2NjdhNDIuNjY2NjY3IDQyLjY2NjY2NyAwIDAgMSAwLTg1LjMzMzMzM2gyNTZ6IiBwLWlkPSIxNTYwOSIgZmlsbD0iI2ZmZmZmZiI+PC9wYXRoPjwvc3ZnPg=='); } .lhdc-block-2 .block-menu .item .item-link { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } /** LHDC 4 **/ .lhdc-block-4 .block { } .lhdc-block-4 .block .block-img { border-radius: 0; } .lhdc-block-4 .block .block-img .media-content { background-size: contain; background-color: transparent; background-position: center; } .lhdc-block-4 .lhdc-pk-block .item { position: relative; overflow: hidden; display: flex; flex-direction: column; min-width: 1px; word-wrap: break-word; flex: 1 1 auto; padding: 72px 32px 32px; border: 1px solid #ddd; } .lhdc-block-4 .lhdc-pk-block .item .item-pk-title { position: absolute; top: 0; right: 0; left: 0; padding: 12px 16px; background-color: #ddd; transform: translateY(0); } @media (max-width: 767.98px) { .lhdc-block-4 .lhdc-pk-block .item { padding: 68px 24px 24px; } .lhdc-block-4 .lhdc-pk-block .item .item-pk-title { position: absolute; top: 0; left: 0; right: 0; max-width: 100%; transform: translateY(0); border-radius: 0; } } @media (min-width: 768px) and (max-width: 1199.98px) { .lhdc-block-4 .lhdc-pk-block .item { padding: 68px 24px 24px; } .lhdc-block-4 .lhdc-pk-block .item .item-pk-title { position: absolute; top: 0; left: 0; right: 0; max-width: 100%; transform: translateY(0); border-radius: 0; } } .lhdc-block-4 .lhdc-pk-block .item .item-pk-subtitle { font-size: 36px; font-weight: bold; } .lhdc-block-4 .lhdc-pk-block .item.item-two { color: #ff3442; border-color: #ff3442; } .lhdc-block-4 .lhdc-pk-block .item.item-two .item-pk-title { background-color: #ff3442; color: #fff; } .lhdc-block-4 .lhdc-pk-block .audio-player { position: relative; top: -3px; } @media (max-width: 767.98px) { .lhdc-block-4 .lhdc-pk-block .audio-player { } } @media (min-width: 768px) and (max-width: 1199.98px) { .lhdc-block-4 .lhdc-pk-block .audio-player { } } .audio-player .play-btn { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: 100%; background-color: var(--color-muted); } .audio-player .play-btn.active { background-color: var(--color-dark); } .audio-player .play-btn:after { content: ''; position: relative; display: block; width: 24px; height: 24px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNCcgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyBmaWxsPSdub25lJyBmaWxsLXJ1bGU9J2V2ZW5vZGQnPjxwYXRoIGQ9J00yNCAwdjI0SDBWMHpNMTIuNTkzIDIzLjI1OGwtLjAxMS4wMDItLjA3MS4wMzUtLjAyLjAwNC0uMDE0LS4wMDQtLjA3MS0uMDM1Yy0uMDEtLjAwNC0uMDE5LS4wMDEtLjAyNC4wMDVsLS4wMDQuMDEtLjAxNy40MjguMDA1LjAyLjAxLjAxMy4xMDQuMDc0LjAxNS4wMDQuMDEyLS4wMDQuMTA0LS4wNzQuMDEyLS4wMTYuMDA0LS4wMTctLjAxNy0uNDI3Yy0uMDAyLS4wMS0uMDA5LS4wMTctLjAxNy0uMDE4bS4yNjUtLjExMy0uMDEzLjAwMi0uMTg1LjA5My0uMDEuMDEtLjAwMy4wMTEuMDE4LjQzLjAwNS4wMTIuMDA4LjAwNy4yMDEuMDkzYy4wMTIuMDA0LjAyMyAwIC4wMjktLjAwOGwuMDA0LS4wMTQtLjAzNC0uNjE0Yy0uMDAzLS4wMTItLjAxLS4wMi0uMDItLjAyMm0tLjcxNS4wMDJhLjAyMy4wMjMgMCAwIDAtLjAyNy4wMDZsLS4wMDYuMDE0LS4wMzQuNjE0YzAgLjAxMi4wMDcuMDIuMDE3LjAyNGwuMDE1LS4wMDIuMjAxLS4wOTMuMDEtLjAwOC4wMDQtLjAxMS4wMTctLjQzLS4wMDMtLjAxMi0uMDEtLjAxeicvPjxwYXRoIGZpbGw9JyNGRkZGRkZGRicgZD0nTTUuNjY5IDQuNzZhMS40NjkgMS40NjkgMCAwIDEgMi4wNC0xLjE3N2MxLjA2Mi40NTQgMy40NDIgMS41MzMgNi40NjIgMy4yNzYgMy4wMjEgMS43NDQgNS4xNDYgMy4yNjcgNi4wNjkgMy45NTguNzg4LjU5MS43OSAxLjc2My4wMDEgMi4zNTYtLjkxNC42ODctMy4wMTMgMi4xOS02LjA3IDMuOTU2LTMuMDYgMS43NjYtNS40MTIgMi44MzItNi40NjQgMy4yOC0uOTA2LjM4Ny0xLjkyLS4yLTIuMDM4LTEuMTc3LS4xMzgtMS4xNDItLjM5Ni0zLjczNS0uMzk2LTcuMjM3IDAtMy41LjI1Ny02LjA5Mi4zOTYtNy4yMzUnLz48L2c+PC9zdmc+'); } .audio-player .play-btn.active:after { background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyNCcgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0Jz48ZyBmaWxsPSdub25lJz48cGF0aCBkPSdNMjQgMHYyNEgwVjB6TTEyLjU5MyAyMy4yNThsLS4wMTEuMDAyLS4wNzEuMDM1LS4wMi4wMDQtLjAxNC0uMDA0LS4wNzEtLjAzNWMtLjAxLS4wMDQtLjAxOS0uMDAxLS4wMjQuMDA1bC0uMDA0LjAxLS4wMTcuNDI4LjAwNS4wMi4wMS4wMTMuMTA0LjA3NC4wMTUuMDA0LjAxMi0uMDA0LjEwNC0uMDc0LjAxMi0uMDE2LjAwNC0uMDE3LS4wMTctLjQyN2MtLjAwMi0uMDEtLjAwOS0uMDE3LS4wMTctLjAxOG0uMjY1LS4xMTMtLjAxMy4wMDItLjE4NS4wOTMtLjAxLjAxLS4wMDMuMDExLjAxOC40My4wMDUuMDEyLjAwOC4wMDcuMjAxLjA5M2MuMDEyLjAwNC4wMjMgMCAuMDI5LS4wMDhsLjAwNC0uMDE0LS4wMzQtLjYxNGMtLjAwMy0uMDEyLS4wMS0uMDItLjAyLS4wMjJtLS43MTUuMDAyYS4wMjMuMDIzIDAgMCAwLS4wMjcuMDA2bC0uMDA2LjAxNC0uMDM0LjYxNGMwIC4wMTIuMDA3LjAyLjAxNy4wMjRsLjAxNS0uMDAyLjIwMS0uMDkzLjAxLS4wMDguMDA0LS4wMTEuMDE3LS40My0uMDAzLS4wMTItLjAxLS4wMXonLz48cGF0aCBmaWxsPScjRkZGRkZGRkYnIGQ9J005IDNhMSAxIDAgMCAxIDEgMXYxNmExIDEgMCAwIDEtMSAxSDdhMSAxIDAgMCAxLTEtMVY0YTEgMSAwIDAgMSAxLTFabTggMGExIDEgMCAwIDEgMSAxdjE2YTEgMSAwIDAgMS0xIDFoLTJhMSAxIDAgMCAxLTEtMVY0YTEgMSAwIDAgMSAxLTFaJy8+PC9nPjwvc3ZnPg=='); } .lhdc-block-4 .lhdc-pk-block .item.item-two .play-btn, .lhdc-block-4 .lhdc-pk-block .item.item-two .play-btn.active { background-color: #ff3441; } /** LHDC 5 **/ .lhdc-block-5 { background-repeat: no-repeat; background-position: center; background-size: cover; } .lhdc-block-5 .block-list .item { display: flex; flex-direction: column; min-width: 1px; word-wrap: break-word; flex: 1 1 auto; background-color: rgba(0, 0, 0, 0.4); } @supports (((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px)))) { .lhdc-block-5 .block-list .item { -webkit-backdrop-filter: saturate(180%) blur(6px); backdrop-filter: saturate(180%) blur(6px); } } .lhdc-block-5 .block-list .item .block-icon { width: 80px; height: 80px; display: flex; align-items: center; justify-content: center; background-position: center; background-size: cover; background-repeat: no-repeat; } .lhdc-block-5 .block-list .item .block-icon.icon-1 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzU1MV8zNSkiPgo8cGF0aCBkPSJNNi4zMTcwOCA1QzYuMDMwMjYgNSA1Ljc0MzQ2IDUuMTk2ODkgNS43NDg4OSA1LjU5MTMzVjkuNzUwMDlDNC43NzQ1NCAxMC4wMTI5IDQuMDQ1NDcgMTAuOTIxMyA0LjA0NTQ3IDEyLjAwMDRDNC4wNDU0NyAxMy4wNzk0IDQuNzc0NTQgMTMuOTg2NyA1Ljc0ODg5IDE0LjI0OTVWMTguNDA4MkM1LjczODA0IDE5LjE5NzIgNi44OTYxIDE5LjE5NzIgNi44ODUyNSAxOC40MDgyVjE0LjI1MDZDNy44NjA2NiAxMy45ODg2IDguNTkwOSAxMy4wODAyIDguNTkwOSAxMi4wMDA0QzguNTkwOSAxMC45MjA2IDcuODYwNjYgMTAuMDExIDYuODg1MjUgOS43NDg5M1Y1LjU5MTMzQzYuODkwOTQgNS4xOTY4OSA2LjYwMzg4IDUgNi4zMTcwOCA1Wk02LjMxODIxIDEwLjgzMzZDNi45NTI1MiAxMC44MzM2IDcuNDU0NTcgMTEuMzQ5MSA3LjQ1NDU3IDEyLjAwMDRDNy40NTQ1NyAxMi42NTE2IDYuOTUyNTIgMTMuMTY3MSA2LjMxODIxIDEzLjE2NzFDNS42ODM4OCAxMy4xNjcxIDUuMTgxODUgMTIuNjUxNiA1LjE4MTg1IDEyLjAwMDRDNS4xODE4NSAxMS4zNDkxIDUuNjgzODggMTAuODMzNiA2LjMxODIxIDEwLjgzMzZaIiBmaWxsPSJ3aGl0ZSIvPgo8cGF0aCBkPSJNMTcuNjgxOCA1QzE3LjM5NSA1IDE3LjEwODEgNS4xOTY4OCAxNy4xMTM2IDUuNTkxM1YxMi4wODMxQzE2LjEzODcgMTIuMzQ1NiAxNS40MDkxIDEzLjI1MzkgMTUuNDA5MSAxNC4zMzMzQzE1LjQwOTEgMTUuNDEyNiAxNi4xMzg3IDE2LjMxOTkgMTcuMTEzNiAxNi41ODIzVjE4LjQwODZDMTcuMTA5IDE4LjczNzUgMTcuMzcwNSAxOS4wMDUgMTcuNjg3MyAxOC45OTk5QzE4LjAwNDEgMTguOTk0NyAxOC4yNTQyIDE4LjczMDMgMTguMjQ5OSAxOC40MDg2VjE2LjU4MjNDMTkuMjI0NyAxNi4zMTk4IDE5Ljk1NDUgMTUuNDEyNSAxOS45NTQ1IDE0LjMzMzNDMTkuOTU0NSAxMy4yNTQgMTkuMjI0NyAxMi4zNDU3IDE4LjI0OTkgMTIuMDgzMVY1LjU5MTNDMTguMjU1NiA1LjE5Njg4IDE3Ljk2ODYgNSAxNy42ODE4IDVaTTE3LjY4MTggMTMuMTY2NkMxOC4zMTYxIDEzLjE2NjYgMTguODE4MSAxMy42ODIxIDE4LjgxODEgMTQuMzMzM0MxOC44MTgxIDE0Ljk4NDUgMTguMzE2MSAxNS40OTk5IDE3LjY4MTggMTUuNDk5OUMxNy4wNDc0IDE1LjQ5OTkgMTYuNTQ1NCAxNC45ODQ1IDE2LjU0NTQgMTQuMzMzM0MxNi41NDU0IDEzLjY4MjEgMTcuMDQ3NCAxMy4xNjY2IDE3LjY4MTggMTMuMTY2NloiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik0xMiA1QzExLjcxMzIgNSAxMS40MjY0IDUuMTk2ODggMTEuNDMxOCA1LjU5MTNWNy40MTY0OUMxMC40NTY5IDcuNjc4OTEgOS43MjcyOSA4LjU4NzMgOS43MjcyOSA5LjY2NjY1QzkuNzI3MjkgMTAuNzQ2IDEwLjQ1NjkgMTEuNjUzMiAxMS40MzE4IDExLjkxNTZWMTguNDA4NkMxMS40MjczIDE4LjczNzUgMTEuNjg3NiAxOS4wMDUgMTIuMDA0NCAxOC45OTk5QzEyLjMyMTMgMTguOTk0NyAxMi41NzI1IDE4LjczMDMgMTIuNTY4MiAxOC40MDg2VjExLjkxNTZDMTMuNTQyOSAxMS42NTMxIDE0LjI3MjcgMTAuNzQ1OSAxNC4yNzI3IDkuNjY2NjVDMTQuMjcyNyA4LjU4NzQgMTMuNTQyOSA3LjY3OTAyIDEyLjU2ODIgNy40MTY0OVY1LjU5MTNDMTIuNTczOSA1LjE5Njg4IDEyLjI4NjggNSAxMiA1Wk0xMiA4LjQ5OTk4QzEyLjYzNDMgOC40OTk5OCAxMy4xMzY0IDkuMDE1NDEgMTMuMTM2NCA5LjY2NjY1QzEzLjEzNjQgMTAuMzE3OSAxMi42MzQzIDEwLjgzMzMgMTIgMTAuODMzM0MxMS4zNjU3IDEwLjgzMzMgMTAuODYzNiAxMC4zMTc5IDEwLjg2MzcgOS42NjY2NUMxMC44NjM2IDkuMDE1NDEgMTEuMzY1NyA4LjQ5OTk4IDEyIDguNDk5OThaIiBmaWxsPSJ3aGl0ZSIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzU1MV8zNSI+CjxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxNCIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQgNSkiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K'); } .lhdc-block-5 .block-list .item .block-icon.icon-2 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzU1MF8yMykiPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTQuMTU3NzggNS44ODU4OEM0LjE1Nzc4IDQuODQ0MzUgNS4wMDkyMiA0IDYuMDU5NSA0SDEyLjQwOTdDMTMuNDU5OSA0IDE0LjMxMTQgNC44NDQzNSAxNC4zMTE0IDUuODg1ODhWNy44NDUzMUgxMy4zMDY5VjUuODg1ODhDMTMuMzA2OSA1LjM5NDQ4IDEyLjkwNTIgNC45OTYxIDEyLjQwOTcgNC45OTYxSDYuMDU5NUM1LjU2Mzk3IDQuOTk2MSA1LjE2MjI1IDUuMzk0NDggNS4xNjIyNSA1Ljg4NTg4VjE5LjExNDFDNS4xNjIyNSAxOS42MDU1IDUuNTYzOTcgMjAuMDAzOSA2LjA1OTUgMjAuMDAzOUgxMi40MDk3QzEyLjkwNTIgMjAuMDAzOSAxMy4zMDY5IDE5LjYwNTUgMTMuMzA2OSAxOS4xMTQxVjE4LjgxNUgxNC4zMTE0VjE5LjExNDFDMTQuMzExNCAyMC4xNTU2IDEzLjQ1OTkgMjEgMTIuNDA5NyAyMUg2LjA1OTVDNS4wMDkyMiAyMSA0LjE1Nzc4IDIwLjE1NTYgNC4xNTc3OCAxOS4xMTQxVjUuODg1ODhaIiBmaWxsPSJ3aGl0ZSIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTYuNzg0ODUgNC42MTYzNkw3Ljc2MDYgNC4zNzk4OEw4LjEzMzU0IDUuODkzMTNIMTAuMzM1NUwxMC43MDg1IDQuMzc5ODhMMTEuNjg0MiA0LjYxNjM2TDExLjEyNDEgNi44ODkyMUg3LjM0NDk5TDYuNzg0ODUgNC42MTYzNloiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTMuODA5MSA4LjM0MzI4QzExLjAzMTkgOC4zNDMyOCA4Ljc4MDQ2IDEwLjU3NTkgOC43ODA0NiAxMy4zM0M4Ljc4MDQ2IDE2LjA4NDEgMTEuMDMxOSAxOC4zMTY4IDEzLjgwOTEgMTguMzE2OEMxNi41ODY0IDE4LjMxNjggMTguODM3OCAxNi4wODQxIDE4LjgzNzggMTMuMzNDMTguODM3OCAxMC41NzU5IDE2LjU4NjQgOC4zNDMyOCAxMy44MDkxIDguMzQzMjhaTTcuNzc2IDEzLjMzQzcuNzc2IDEwLjAyNTggMTAuNDc3MSA3LjM0NzE3IDEzLjgwOTEgNy4zNDcxN0MxNy4xNDExIDcuMzQ3MTcgMTkuODQyMyAxMC4wMjU4IDE5Ljg0MjMgMTMuMzNDMTkuODQyMyAxNi42MzQzIDE3LjE0MTEgMTkuMzEyOSAxMy44MDkxIDE5LjMxMjlDMTAuNDc3MSAxOS4zMTI5IDcuNzc2IDE2LjYzNDMgNy43NzYgMTMuMzNaIiBmaWxsPSJ3aGl0ZSIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEzLjgwOTEgMTAuODMwMUMxMy4zMTM5IDEwLjgzMDEgMTIuOTEyNSAxMS4yMjgyIDEyLjkxMjUgMTEuNzE5MkMxMi45MTI1IDEyLjIxMDMgMTMuMzEzOSAxMi42MDg0IDEzLjgwOTEgMTIuNjA4NEMxNC4zMDQzIDEyLjYwODQgMTQuNzA1NyAxMi4yMTAzIDE0LjcwNTcgMTEuNzE5MkMxNC43MDU3IDExLjIyODIgMTQuMzA0MyAxMC44MzAxIDEzLjgwOTEgMTAuODMwMVpNMTEuOTA4IDExLjcxOTJDMTEuOTA4IDEwLjY3OCAxMi43NTkyIDkuODMzOTggMTMuODA5MSA5LjgzMzk4QzE0Ljg1OTEgOS44MzM5OCAxNS43MTAyIDEwLjY3OCAxNS43MTAyIDExLjcxOTJDMTUuNzEwMiAxMi43NjA0IDE0Ljg1OTEgMTMuNjA0NSAxMy44MDkxIDEzLjYwNDVDMTIuNzU5MiAxMy42MDQ1IDExLjkwOCAxMi43NjA0IDExLjkwOCAxMS43MTkyWiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMS44MjcgMTUuMjAyNkgxNS43OTEyQzE1Ljc2MTIgMTQuMzE0OSAxNS4wMjYxIDEzLjYwNDUgMTQuMTIzNyAxMy42MDQ1SDEzLjQ5NDVDMTIuNTkyMSAxMy42MDQ1IDExLjg1NyAxNC4zMTQ5IDExLjgyNyAxNS4yMDI2Wk0xMC44MjE1IDE1LjI1OTFDMTAuODIxNSAxMy43OTUxIDEyLjAxODMgMTIuNjA4NCAxMy40OTQ1IDEyLjYwODRIMTQuMTIzN0MxNS41OTk5IDEyLjYwODQgMTYuNzk2NyAxMy43OTUyIDE2Ljc5NjcgMTUuMjU5MVYxNi4xOTg3SDEwLjgyMTVWMTUuMjU5MVoiIGZpbGw9IndoaXRlIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfNTUwXzIzIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE3IiBmaWxsPSJ3aGl0ZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNCA0KSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo='); } .lhdc-block-5 .block-list .item .block-icon.icon-3 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzU1MV80OCkiPgo8cGF0aCBkPSJNNy4zMDY5NyA4LjE5ODIzQzcuMDU4NDggOC4wNzM5MSA2Ljc1ODQzIDguMTc0MzIgNi42MzY1MiA4LjQyNzc5QzYuMjE0NTcgOS4yODg1NyA1Ljk5ODkgMTAuMjA2NyA1Ljk5ODkgMTEuMTU4NEM1Ljk5ODkgMTIuMTEgNi4yMTQ1NyAxMy4wMjgyIDYuNjM2NTIgMTMuODg5QzYuNzU4NDMgMTQuMTQyNSA3LjA1ODQ4IDE0LjI0MjkgNy4zMDY5NyAxNC4xMTg1QzcuNTU1NDQgMTMuOTk0MiA3LjY1Mzg5IDEzLjY4ODEgNy41MzIgMTMuNDM0N0M3LjE4MDM4IDEyLjcxNzQgNy4wMDIyMiAxMS45NTIyIDcuMDAyMjIgMTEuMTU4NEM3LjAwMjIyIDEwLjM2NDUgNy4xODAzOCA5LjU5OTM5IDcuNTMyIDguODgyMDhDNy42NTM4OSA4LjYyODYyIDcuNTU1NDQgOC4zMjI1NyA3LjMwNjk3IDguMTk4MjNaIiBmaWxsPSJ3aGl0ZSIvPgo8cGF0aCBkPSJNMTUuOTY2MyA0LjY0NTA2QzE2LjA5MjkgNC4zOTYzOSAxNi4wMDM4IDQuMDg1NTUgMTUuNzYgMy45NTY0M0MxNC42MDY3IDMuMzI5OTcgMTMuMzA4IDMgMTEuOTk5OSAzQzEwLjY5MTkgMyA5LjM5MzE5IDMuMzI5OTcgOC4yMzk4NSAzLjk1NjQzQzcuOTk2MDYgNC4wOTAzMyA3LjkwNjk4IDQuMzk2MzkgOC4wMzM1NyA0LjY0NTA2QzguMTY0ODQgNC44OTM3MyA4LjQ2NDkxIDQuOTg5MzcgOC43MDg3IDQuODU1NDdDOS43MTY3IDQuMzA1NTMgMTAuODUxMyA0LjAxODYgMTEuOTk1MyA0LjAxODZDMTMuMTM5MiA0LjAxODYgMTQuMjczOCA0LjMxMDMxIDE1LjI4MTggNC44NTU0N0MxNS41MzAzIDQuOTg5MzcgMTUuODM1IDQuODkzNzMgMTUuOTY2MyA0LjY0NTA2WiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZD0iTTE4LjM4NTYgMTUuMjA0MUMxOC42Mjk0IDE1LjMzMzIgMTguOTM0MiAxNS4yNDI0IDE5LjA2MDggMTQuOTkzN0MxOS42NzQ5IDEzLjgxNzMgMTkuOTk4NCAxMi40OTI2IDE5Ljk5ODQgMTEuMTU4NEMxOS45OTg0IDkuODI0MTkgMTkuNjc0OSA4LjQ5OTU2IDE5LjA2MDggNy4zMjMxNUMxOC45Mjk1IDcuMDc0NDYgMTguNjI5NCA2Ljk4MzYgMTguMzg1NiA3LjExMjcyQzE4LjE0MTggNy4yNDY2MSAxOC4wNDggNy41NTI2OSAxOC4xNzkzIDcuODAxMzVDMTguNzE4NSA4LjgyOTUxIDE4Ljk5OTggOS45ODY3OSAxOC45OTk4IDExLjE1MzZDMTguOTk5OCAxMi4zMjA1IDE4LjcxMzggMTMuNDc3OCAxOC4xNzkzIDE0LjUwNTlDMTguMDQ4IDE0Ljc1OTQgMTguMTQxOCAxNS4wNzAyIDE4LjM4NTYgMTUuMjA0MVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik0xMi4wMDAxIDUuMDM3MTFDMTEuMDY3MSA1LjAzNzExIDEwLjE2NjkgNS4yNTcwOSA5LjMyMyA1LjY4NzQ4QzkuMDc0NSA1LjgxMTgzIDguOTc2MDYgNi4xMTc4NyA5LjA5Nzk0IDYuMzcxMzRDOS4yMTk4NCA2LjYyNDc4IDkuNTE5ODkgNi43MjUyMiA5Ljc2ODM5IDYuNjAwODhDMTAuNDcxNiA2LjI0MjIyIDExLjIyMTggNi4wNjA0OSAxMi4wMDAxIDYuMDYwNDlDMTIuNzc4MyA2LjA2MDQ5IDEzLjUyODUgNi4yNDIyMiAxNC4yMzE3IDYuNjAwODhDMTQuNDgwMiA2LjcyNTIyIDE0Ljc4MDMgNi42MjQ3OCAxNC45MDIyIDYuMzcxMzRDMTUuMDI0MSA2LjExNzg3IDE0LjkyNTYgNS44MTE4MyAxNC42NzcxIDUuNjg3NDhDMTMuODMzMiA1LjI1NzA5IDEyLjkzMyA1LjAzNzExIDEyLjAwMDEgNS4wMzcxMVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik0xNy4wMDI1IDE4LjcyODRWMTguMjk4QzE3LjAwMjUgMTYuNTI4NiAxNS44OTEzIDE1LjAyMjMgMTQuMzQ0MiAxNC40NThDMTUuMzQ3NSAxMy43MTY3IDE2LjAwMzggMTIuNTExNiAxNi4wMDM4IDExLjE1ODNDMTYuMDAzOCA4LjkwNTg5IDE0LjIwODIgNy4wNzkxIDEyLjAwNDYgNy4wNzkxQzkuODAxMTIgNy4wNzkxIDguMDA1NDcgOC45MTA2OSA4LjAwNTQ3IDExLjE1ODNDOC4wMDU0NyAxMi41MTY0IDguNjYxODUgMTMuNzE2NyA5LjY2NTE0IDE0LjQ1OEM4LjExNzk5IDE1LjAyMjMgNy4wMDY4NCAxNi41Mjg2IDcuMDA2ODQgMTguMjk4VjE5Ljk4NjFWMjAuNDg4M0M3LjAwNjg0IDIwLjc3MDQgNy4yMzE4NyAyMC45OTk5IDcuNTA4NTEgMjAuOTk5OUgxNi41MTAyQzE2Ljc1NCAyMC45OTk5IDE2Ljk1NTYgMjAuODIzIDE3LjAwMjUgMjAuNTg4N0wxNy4wMTE4IDE5Ljk3NjZWMTguNzQyOFYxOS45ODEzVjE4LjcyODRIMTcuMDAyNVpNOC45OTk0IDExLjE1ODNDOC45OTk0IDkuNDcwMiAxMC4zNDUgOC4wOTc3MSAxMiA4LjA5NzcxQzEzLjY1NSA4LjA5NzcxIDE1LjAwMDUgOS40NzAyIDE1LjAwMDUgMTEuMTU4M0MxNS4wMDA1IDEyLjg0NjQgMTMuNjU1IDE0LjIxODkgMTIgMTQuMjE4OUMxMC4zNDUgMTQuMjE4OSA4Ljk5OTQgMTIuODQ2NCA4Ljk5OTQgMTEuMTU4M1pNMTUuOTk5MSAxOS45ODEzSDguMDAwNzlWMTguMzAyOEM4LjAwMDc5IDE2LjYxNDcgOS4zNDYzNCAxNS4yNDIyIDExLjAwMTMgMTUuMjQyMkgxMy4wMDMzQzE0LjY1ODMgMTUuMjQyMiAxNi4wMDM4IDE2LjYxNDcgMTYuMDAzOCAxOC4zMDI4VjE5Ljk4MTNIMTUuOTk5MVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik01LjAwMDIxIDExLjE1ODNDNS4wMDAyMSA5Ljk5MTQxIDUuMjg2MiA4LjgzNDEzIDUuODIwNjggNy44MDU5N0M1Ljk1MTk1IDcuNTU3MzEgNS44NTgxOSA3LjI0NjQ2IDUuNjE0MzkgNy4xMTczNkM1LjM3MDU5IDYuOTg4MjQgNS4wNjU4NSA3LjA3OTA4IDQuOTM5MjYgNy4zMjc3N0M0LjMyNTA4IDguNTA0MTggNC4wMDE1OSA5LjgyODgzIDQuMDAxNTkgMTEuMTYzQzQuMDAxNTkgMTIuNDk3MyA0LjMyNTA4IDEzLjgyMTkgNC45MzkyNiAxNC45OTgzQzUuMDcwNTQgMTUuMjQ3IDUuMzcwNTkgMTUuMzM3OSA1LjYxNDM5IDE1LjIwODdDNS44NTgxOSAxNS4wNzQ4IDUuOTUxOTUgMTQuNzY4OCA1LjgyMDY4IDE0LjUyMDFDNS4yODE1MSAxMy40ODI0IDUuMDAwMjEgMTIuMzI1MSA1LjAwMDIxIDExLjE1ODNaIiBmaWxsPSJ3aGl0ZSIvPgo8cGF0aCBkPSJNMTYuNjkzMSAxNC4xMTg1QzE2Ljk0MTYgMTQuMjQyOSAxNy4yNDE2IDE0LjE0MjUgMTcuMzYzNSAxMy44ODlDMTcuNzg1NSAxMy4wMjgyIDE4LjAwMTIgMTIuMTEgMTguMDAxMiAxMS4xNTg0QzE4LjAwMTIgMTAuMjA2NyAxNy43ODU1IDkuMjg4NTcgMTcuMzYzNSA4LjQyNzc5QzE3LjI0MTYgOC4xNzQzMiAxNi45NDE2IDguMDczOTEgMTYuNjkzMSA4LjE5ODIzQzE2LjQ0NDYgOC4zMjI1NyAxNi4zNDYyIDguNjI4NjIgMTYuNDY4MSA4Ljg4MjA4QzE2LjgxOTcgOS41OTkzOSAxNi45OTc5IDEwLjM2NDUgMTYuOTk3OSAxMS4xNTg0QzE2Ljk5NzkgMTEuOTUyMiAxNi44MTk3IDEyLjcxNzQgMTYuNDY4MSAxMy40MzQ3QzE2LjM0NjIgMTMuNjg4MSAxNi40NDQ2IDEzLjk5NDIgMTYuNjkzMSAxNC4xMTg1WiIgZmlsbD0id2hpdGUiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF81NTFfNDgiPgo8cmVjdCB3aWR0aD0iMTYiIGhlaWdodD0iMTgiIGZpbGw9IndoaXRlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0IDMpIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg=='); } .lhdc-block-5 .play-btn { width: 60px; height: 48px; border-radius: 24px; background-color: var(--color-primary); } /** LHDC 6 **/ .lhdc-block-6 { background-position: top center; background-size: cover; background-repeat: no-repeat; } /** Contact Form **/ .contact-form { max-width: 800px; margin: 0 auto; } .wpcf7-form input[type="text"], .wpcf7-form input[type="email"], .wpcf7-form input[type="tel"], .wpcf7-form textarea { width: 100%; padding: 12px 15px; border: 1px solid var(--color-light); border-radius: 8px; font-size: 16px; transition: all 0.3s ease; background-color: #fff; } .wpcf7-form textarea { max-height: 120px; } .wpcf7-form input[type="text"]:focus, .wpcf7-form input[type="email"]:focus, .wpcf7-form input[type="tel"]:focus, .wpcf7-form textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: none; } .wpcf7-form .wpcf7-form-control-wrap { display: block; } .wpcf7-submit { background-color: var(--color-primary); color: #fff; padding: 16px 32px; border: none; border-radius: 25px; font-size: 16px; font-weight: bold; cursor: pointer; transition: all 0.3s ease; display: block; margin: 0 auto; min-width: 200px; } .wpcf7-submit:hover { background-color: var(--color-primary); transform: translateY(-2px); } .wpcf7-form label { display: block; font-weight: 500; margin-bottom: 12px; color: var(--color-muted); } .wpcf7-not-valid-tip { color: var(--color-danger); font-size: 14px; margin-top: -15px; margin-bottom: 15px; } .wpcf7 form .wpcf7-response-output { margin: 20px 0; padding: 15px; border-radius: 8px; text-align: center; } .form-row { display: flex; gap: 20px; margin-bottom: 32px; } .form-col { flex: 1; } @media (max-width: 768px) { .form-row { flex-direction: column; gap: 0; } } .wpcf7 .ajax-loader { position: absolute; margin-left: 10px; } .wpcf7-form.submitting .wpcf7-submit.has-spinner { display: none; } .wpcf7-form .wpcf7-spinner { display: none; margin: 40px auto 0; } .wpcf7-form.submitting .wpcf7-spinner { display: block; } /** Video Modal **/ .video-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; } .video-modal .video-modal-wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); display: flex; align-items: center; justify-content: center; } .video-modal .video-modal-content { position: relative; display: flex; flex-direction: column; width: 90%; max-width: 1000px; background: #fff; border-radius: 4px; outline: 0; pointer-events: auto; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .2); } .video-modal .video-modal-header { padding: 1rem; display: flex; justify-content: flex-end; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .video-modal .close-modal { background: none; border: none; font-size: 24px; cursor: pointer; padding: 0 10px; } .video-modal .video-modal-container video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } body.modal-open { overflow: hidden; } .video-modal .video-switch.active { color: #000; } /* 添加 switch 样式 */ .video-lhdc-icon { width: 100px; height: 28px; background-repeat: no-repeat; background-position: center; background-size: contain; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAYCAYAAAAMAljuAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAeXSURBVHgB7VpdbBTXFf7u7EIxYHsc6iY0Cb5+SINCUi8SIPqURWpVqZEDkfpEVRU/VKraqAkvlZtIxVQpIX3BKA+oVSU7balUqRKkTaWmL2x+FCU4CeuQH3gJAwkhyg87LASv92duzpl7Z3d2dvYvXlCQ+KSjmXvuucez97vn/pxrgZtYEkpbZ9Kq7KUSCWsE8GwFIYWCLSzYStXs6NWx6OFBXRKwHHhwvATml706kQn7E7iJr4QrqT+nliWsGerClABRQF2ugv4MejVEiICuJivB70r4BS5nVCUx0ZedcIKmO0juJ7FN27MkU+gMcW2nSdwm9lPmOWJssyRHY+wkSdo8R4zONn6DdiwOuodtvnvMvEvjh33Pk2TQxu9CakaWVeUE9agt6sY0vzMLmiDzUmehwlY1tVMUiY1D2QmXdbMkP4v8zU4jZ7bLtjnUyGMcJHk0VH7ElCU6g0Oy13xHO6RJ9phnO2SN37jBAnfDX45Rl6aFov4WevBXpyfBLGi9CpSs44BQWs0qHSlkAj9WIDxMD773890Wri/cNmUeuRKdg21p2gB1UB3RUewxNml0hlQz29z6Q7JcUmkSlMqeKJU8JHduwMqDP8CKJ+6H963VKHFdSalyCapSBj/9srrrFvQd/L5YOfMjkUhLxe3LZcD3VVG72H8SjeHponM4uLZ4AXqa42+yjaRJtqOeONYdIdkW4+MA6qOQkYGOzmDak9CD4ZGQ3+kYXyiUkxIVD0LowOj78XfEyse+V61Pbr4NuZ/8V1Q+vKwDh8KF42P5PWvEwF8fgDXwDd9u9Za1orTzORRfu+BHDjm0L6yfkXER0g0h3bZtFyFRZIxkzZOnEO7cjaYcRppkV0S3C41kMBHbjC/H6Pg5bfT8vhdNBlul6KV4VHMU8NO6+5a6+sQd/Rg6/AC8W1dRBCnB0SHuGoJ9uEZGFWtXGz9C+VHyRTHV6ymr14S08vMQGttH17M9kbKDRoKi9Uz2VDODxaJn81REne1PWYWTnzfYMCnD/xzXHU52yS23N5JBKDh5BH6Y3EoJg9d7DeklmIxnIro0amtJ3Hq0F535bYpyBbJUCeZ+qNzhU8j96a0Gu+Sd/bjtX+MQa/tx8dA8Pv/j63X1XL7y4kf++lFhgmktonXETqK34M6YalEv0VtkY3Rp6OkoHVOXwRJRKQUbVs88oT6efEWUc0UMT26qs2VSbj8yjrPj/8YnT875kWPvvBuf7n8dnz01F7SnpcYT+lhSGboWhOzB9YOD+G9gjEX0LnqwCSmX/K2qLvgLtsaFP8zB8xRufWxznf2ydf1Y958Hcfqev6uLfzslCmfy+IQIMcdEfznXW2X/sIheE/J1xlI2K1UUK4r7EcJQYdjxu/T87+cER8Wan66va7OcSBF39IvcsfNwj33kn+mDkzsCUvhcQhXXghAn8i5DZYkbHEXP08kPhg6U6gFv1XfXYHB8NLbdVXcRiZF+v8niuct+OyhVn2axIHpNiEMy2qK+m8NZJ7CbfAMjGhESPcCCJcz5O9SZNHUN3DusNvx/u0jajbup95+Yw+V8Ad9+cBSjj2/Gmz88ioWzeUSzLhw5N/Iui5GK0QUL/XxMXRpLxIKlxALNLYs0wRQsgQKN8+X3rcHGJmScprXl3X3HIUYGIB/fhBUUJRuf3wEhB7BAJLAUrJrc6IREzx0Z1CIjE2O/A50jNhVDHZjjjrvKxNBOy5L9YuvzDyGOjHeIiJP7XkNC9mPr/7ajj0hh9I3ocmVohWJfATHFhOXcyISE0xwBdofeM2gkhdvERVUYTATnx2IPkAuUbfZHNUUGTV8Y/dUYlsWQMU/b3BP75vwokg+nsNKQEYDLw+NSaF9C8fMqPLfZGiJb6HgEZtH8x7SC3cHf6cQfd2w01xTkpsKYIDkR8cM5LybuaIzfNDQZEnotmooaFCyPfr+ls7Q08V/8IN/g5I0nj+MNnqYsvUi8NPkivrhUwKbfbqmzu5JfRIGXDr195hyxT0hcJ51BczyL5qHfLSHtwHctPFKDaYjPFnGZ2GcQP6Id6BTLkdDflqYc5McukQyi8WQvUbuDqaKUSGTLnle9iDr5j9Pq3l+OiYF1OgJe3X8cx/f7ZBjS9AbqFdKVqbR1UpPy4cvnceq593kVr+7SvEQ52+w+pBUyqGVVZ9HdfcgZ1P9oTmVMhcrd7sK4sw6i/YWaNL4lOvfL3zYdV/nU4NM5FRpc/IOH7/sm8ucuq8KlRWF0OodrXnwdvQ/cOeATlD+Xr15UMSwhMr9xH952Lc4hEs1PxDJSHomUeWfEEdAuknh0c6S2up0Mw4Heju+CTt2nm/yNDHTKv6XfRaH2UrLjAFRwPahw9u1P+cgdvkAUNVaqZ3ssfJDn20ThK1G7qKLYm9CNavcMncJF/ceG2zsdtJehd6eNXdi3G5GlQqL2LQ66TKtM2k9PUbf+TpdU/awQrAhmLtIqX8HHfGEO9tqG/+lBYfd+99ezQdOb+Ip41D4gYSWZmBFKgIzRUB9SOi/i/wMDz1dBYqRa9tdwIl8JVwjvWUqAzU67u53A501Ceoxf2IdktZAsyEp5ubsKlonogkud3zK6vwRI4AWrwzpcJwAAAABJRU5ErkJggg=="); } .video-switch-wrapper { display: flex; align-items: center; justify-content: center; gap: 10px; } .video-switch-button { position: relative; display: inline-block; width: 60px; height: 34px; } .video-switch-button input { opacity: 0; width: 0; height: 0; } .video-switch-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--color-muted); transition: .4s; border-radius: 34px; } .video-switch-slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: white; transition: .4s; border-radius: 50%; } input:checked + .video-switch-slider { background-color: #02758d; } input:checked + .video-switch-slider:before { transform: translateX(26px); } /** Qualcomm 2025 **/ .qualcomm-2025 { --color-primary: #e71324; } .qualcomm-section-2025 { padding: 80px 0 0; } .qualcomm-section-2025 .section-title { font-size: 36px; line-height: 44px; } @media (max-width: 767.98px) { .qualcomm-section-2025 { padding: 32px 0 0; } .qualcomm-section-2025 .section-title { font-size: 24px; line-height: 32px; } } @media (min-width: 768px) and (max-width: 991.98px) { .qualcomm-section-2025 { padding: 40px 0 0; } .qualcomm-section-2025 .section-title { font-size: 24px; line-height: 32px; } } .qualcomm-section-1 { position: relative; } .qualcomm-section-1 .qualcomm-section-video { position: relative; overflow: hidden; width: 100%; height: 500px; } @media (max-width: 767.98px) { .qualcomm-section-1 .qualcomm-section-video { height: 350px; } } @media (min-width: 768px) and (max-width: 991.98px) { .qualcomm-section-1 .qualcomm-section-video { height: 350px; } } .qualcomm-section-1 .qualcomm-section-video video { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.005); } .qualcomm-section-1 .qualcomm-section-content { position: absolute; left: 0; top: 50%; width: 100%; transform: translateY(-50%); z-index: 2; } .qualcomm-section-2 .qualcomm-section-where { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; } .qualcomm-section-2 .qualcomm-section-where .item { text-align: center; } .qualcomm-section-2 .qualcomm-section-where .item .item-icon { width: 80px; height: 80px; } .qualcomm-section-2 .qualcomm-section-where .item .item-icon img { width: inherit; height: inherit; object-fit: contain; } .qualcomm-section-2 .qualcomm-section-where .item .item-title { color: var(--color-primary) } @media (max-width: 767.98px) { .qualcomm-section-2 .qualcomm-section-where .item .item-icon { width: 36px; height: 36px; } } @media (min-width: 768px) and (max-width: 991.98px) { .qualcomm-section-2 .qualcomm-section-where .item .item-icon { width: 56px; height: 56px; } } /*-------------------------------------------------------------- ## .qualcomm-section-3 --------------------------------------------------------------*/ .premium-sound-Swiper { margin-bottom: 16px; } .premium-sound-Swiper .swiper-slide { position: relative; cursor: pointer; width: auto; font-size: 1.25rem; font-weight: bold; padding: 16px 0; opacity: .6; } @media (max-width: 767.98px) { .premium-sound-Swiper .swiper-slide { font-size: 1rem; } } @media (min-width: 768px) and (max-width: 991.98px) { .premium-sound-Swiper .swiper-slide { font-size: 1rem; } } .premium-sound-Swiper .swiper-slide:after { content: ''; position: absolute; left: 0; width: 100%; height: 1px; background-color: #000; bottom: 0; opacity: 0; } .premium-sound-Swiper .swiper-slide.swiper-slide-thumb-active { opacity: 1; } .premium-sound-Swiper .swiper-slide.swiper-slide-thumb-active:after { opacity: .3; } .premium-sound-block { position: relative; } .premium-sound-1 { background-color: #170061; } .premium-sound-box { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 32px; height: 500px; } .premium-sound-1-content { width: 50%; color: #fff; } .premium-sound-1-content .premium-sound-1-title { font-size: 2.25rem; font-weight: bold; } .premium-sound-1-image { width: 50%; } @media (max-width: 767.98px) { .premium-sound-box { flex-direction: column; height: auto; padding: 32px 0; } .premium-sound-1-content { width: 100%; } .premium-sound-1-content .premium-sound-1-title { font-size: 1.25rem; } .premium-sound-1-image { width: 80%; margin: 0 auto; } } @media (min-width: 768px) and (max-width: 991.98px) { .premium-sound-box { flex-direction: column; height: 450px; padding: 40px 0; } .premium-sound-1-content { width: 100%; } .premium-sound-1-content .premium-sound-1-title { font-size: 1.75rem; } .premium-sound-1-image { width: 60%; margin: 0 auto; } } .premium-sound-2 { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; } .premium-sound-2-content { display: flex; flex-direction: column; justify-content: center; width: 40%; height: 500px; color: #fff; } .premium-sound-2-content .premium-sound-2-title { font-size: 2.25rem; font-weight: bold; } .premium-sound-video { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .premium-sound-video video { position: relative; flex: 1 1 0; z-index: 1; padding: 0; width: 100%; height: inherit; max-width: 100%; max-height: 100%; outline: none; object-fit: cover; transform: scale(1.005); } .premium-sound-5-content { position: relative; display: flex; flex-direction: column; justify-content: center; width: 40%; height: 500px; color: #fff; z-index: 2; } .premium-sound-5-content .premium-sound-5-title { font-size: 2.25rem; font-weight: bold; } @media (max-width: 767.98px) { .premium-sound-2-content { width: 100%; height: auto; padding: 32px 0; } .premium-sound-2-content .premium-sound-2-title { font-size: 1.25rem; } .premium-sound-5-content { width: 100%; height: 350px; } .premium-sound-5-content .premium-sound-5-title { font-size: 1.25rem; } } @media (min-width: 768px) and (max-width: 991.98px) { .premium-sound-2-content { width: 100%; height: 450px; } .premium-sound-2-content .premium-sound-2-title { font-size: 1.75rem; } .premium-sound-5-content { width: 60%; height: 450px; } .premium-sound-5-content .premium-sound-5-title { font-size: 1.75rem; } } .qualcomm-section-4 { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; padding-bottom: 80px; } .qualcomm-section-4 .section-content { width: 50%; } @media (max-width: 767.98px) { .qualcomm-section-4 { padding-bottom: 32px; } .qualcomm-section-4 .section-content { width: 80%; } } @media (min-width: 768px) and (max-width: 991.98px) { .qualcomm-section-4 .section-content { width: 80%; } } .qualcomm-section-4 ul li { margin-bottom: 32px; padding-bottom: 32px; border-bottom: 1px solid rgba(255, 255, 255, 0.1) } .qualcomm-section-4 ul li:last-child { margin: 0; padding: 0; border-bottom: 0; } .qualcomm-section-4 ul li a { color: #fff; } .qualcomm-section-4 ul li a i { position: relative; top: -1px; transition: all 0.25s; transform: translateX(5px); } .qualcomm-section-4 ul li a:hover i { transform: translateX(10px); } .qualcomm-section-5 { background-color: #3500ac; padding-bottom: 80px; } .qualcomm-section-5 .item { flex: 1 1 auto; position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; border: 1px solid rgba(255, 255, 255, 0.1); } .qualcomm-section-5 .item .item-content { flex: 1 1 auto; } .qualcomm-section-5 a { color: #fff; } .qualcomm-section-5 a:hover, .qualcomm-section-5 a:focus { color: #000; } .qualcomm-section-6 { background-size: cover; background-repeat: no-repeat; background-position: center; padding-top: 150px; height: 720px; } .qualcomm-section-6 .section-content { width: 50%; } .qualcomm-section-6 .section-logo img { height: 100px; } .qualcomm-section-6 a { color: #fff; } .qualcomm-section-6 a:hover, .qualcomm-section-6 a:focus { color: #000; } @media (max-width: 767.98px) { .qualcomm-section-5 { padding-bottom: 32px; } .qualcomm-section-5 .item img { width: 80px; } .qualcomm-section-6 { padding-top: 48px; height: 400px; } .qualcomm-section-6 .section-logo img { height: 56px; } .qualcomm-section-6 .section-content { width: 100%; } } @media (min-width: 768px) and (max-width: 991.98px) { .qualcomm-section-6 .section-content { width: 70%; } } .section-7-list-banner-1, .section-7-list-banner-2, .section-7-list-banner-3 { height: 400px; } .qualcomm-section-7-list .item { position: relative; display: flex; flex-direction: row; min-width: 0; word-wrap: break-word; margin: 0 0 0; } .qualcomm-section-7-list .item .media { width: 120px; flex-shrink: 0; border-radius: var(--radius-sm); } .qualcomm-section-7-list .item .media img { display: block; -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .qualcomm-section-7-list .item .item-body { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; padding: 0.25rem 0 0.25rem 1rem; } /*-------------------------------------------------------------- ## injoinic 2025 --------------------------------------------------------------*/ .injoinic-2025 { --color-primary: #122b88; } .injoinic-section { padding: 56px 0; } .injoinic-section .section-header { position: relative; padding-left: 32px; margin-bottom: 32px; } .injoinic-section .section-header:after { content: ''; position: absolute; top: 12px; left: 0; width: 8px; height: 36px; border-radius: 8px; background-color: var(--color-primary); } @media (max-width: 767.98px) { .injoinic-section { padding: 32px 0; } .injoinic-section .section-header { position: relative; padding-left: 24px; margin-bottom: 24px; } .injoinic-section .section-header .text-40 { font-size: 24px !important; line-height: 32px; } .injoinic-section .section-header:after { top: 6px; left: 0; width: 6px; height: 22px; } } @media (min-width: 768px) and (max-width: 991.98px) { .injoinic-section { padding: 36px 0; } .injoinic-section .section-header { position: relative; padding-left: 32px; margin-bottom: 32px; } .injoinic-section .section-header .text-40 { font-size: 32px !important; line-height: 40px; } .injoinic-section .section-header:after { top: 7px; left: 0; width: 6px; height: 26px; } } .injoinic-section .section-header { } .injoinic-section-1 .swiper-slide img { width: 100%; } .injoinic-section-3 .news-block-banner-1, .injoinic-section-3 .news-block-banner-2, .injoinic-section-3 .news-block-banner-3 { height: 400px; } .injoinic-section-3 .swiper .item { position: relative; display: flex; flex-direction: row; min-width: 0; word-wrap: break-word; margin: 0 0 0; } .injoinic-section-3 .swiper .item .media { width: 120px; flex-shrink: 0; border-radius: var(--radius-sm); } .injoinic-section-3 .swiper .item .media img { display: block; -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .injoinic-section-3 .swiper .item .item-body { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; padding: 0.25rem 0 0.25rem 1rem; } .injoinic-product-list { } .injoinic-product-list .swiper-slide { width: 380px; padding: 16px 0; } @media (max-width: 767.98px) { .injoinic-product-list .swiper-slide { width: 80%; } .injoinic-section-3 .swiper .item .media { width: 100px; } } .injoinic-product-list .item { position: relative; display: flex; flex-direction: row; gap: 16px; padding: 12px; min-width: 0; word-wrap: break-word; transition: all 0.3s ease-in-out; min-height: 160px; } .injoinic-product-list .item:hover { box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06); } .injoinic-product-list .item .item-image { width: 120px; } .injoinic-product-list .item .item-image .media-content img { object-fit: contain; } .injoinic-product-list .item .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; } .injoinic-product-list .item .item-body { flex: 1 1 auto; } .injoinic-section-5 table { font-size: 12px; text-align: center; } .injoinic-section-5 table tr { } .injoinic-section-5 table td, .injoinic-section-5 table th, .injoinic-section-5 table td, .injoinic-section-5 table th { border-color: #e3e7ee } .injoinic-section-5 table thead { border-bottom: 1px; } .injoinic-section-5 table thead tr { background-color: #f3f5fc; } .injoinic-section-5 table tr:hover td { background-color: var(--bg-light); } .injoinic-section-5 table tr a { color: var(--color-primary); } .injoinic-section-6 .section-list { justify-content: center; } .injoinic-section-6 .section-list .item { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 12px; min-width: 0; padding: 20px 12px; word-wrap: break-word; transition: all 0.3s ease-in-out; background-color: #fff; border-radius: 10px; } .injoinic-section-6 .section-list .item:hover { box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06); } .injoinic-section-6 .section-list .item .item-image { width: 120px; } .injoinic-section-6 .section-list .item .item-image .media-content img { object-fit: contain; } @media (min-width: 768px) and (max-width: 991.98px) { .injoinic-section-6 .section-list .item .item-image { width: 100px; } } @media (max-width: 767.98px) { .injoinic-section-6 .section-list .item .item-image { width: 80px; } } /*-------------------------------------------------------------- ## NearLink 2026 --------------------------------------------------------------*/ .NL-main { --primary: #28e1ca; --color-primary: var(--primary); } .NL-block { padding: 64px 0; } .NL-block-title { font-size: 36px; font-weight: bold; margin-bottom: 40px; text-align: center; } @media (max-width: 767.98px) { .NL-block { padding: 32px 0; } .NL-block-title { font-size: 24px; margin-bottom: 24px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-block { padding: 32px 0; } .NL-block-title { font-size: 32px; margin-bottom: 36px; } } .NL-block-title span { position: relative; padding: 12px 24px; } .NL-block-title span:before, .NL-block-title span:after { content: ''; position: absolute; width: 12px; height: 12px; background-repeat: no-repeat; background-size: contain; background-position: center; } .NL-block-title span:before { bottom: 0; left: 0; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDEwLjAwMUgyVjBIMFYxMi4wMDFIMTJWMTAuMDAxWiIgZmlsbD0iIzAwQzA4QiIvPgo8L3N2Zz4K'); } .NL-block-title span:after { top: 0; right: 0; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAgMFYySDEwVjEySDEyVjBIMFoiIGZpbGw9IiMwMEMwOEIiLz4KPC9zdmc+Cg=='); } /*-------------------------------------------------------------- ## NearLink 2 --------------------------------------------------------------*/ .NL-block-2 { position: relative; background-color: #000; padding: 64px 0; } .NL-block-2 .block-2-bg { position: absolute; bottom: 0; left: 0; width: 100%; height: 300px; background-size: contain; background-repeat: no-repeat; background-position: center bottom; } .NL-block-2 .block-2-menu { display: flex; justify-content: space-around; align-items: center; } .NL-block-2 .block-2-menu .item { position: relative; display: flex; align-items: center; justify-content: center; width: 20%; height: 250px; gap: 8px; } @media (max-width: 767.98px) { .NL-block-2 { padding-top: 36px; } .NL-block-2 .block-2-menu { flex-wrap: wrap; flex-direction: row; gap: 16px; } .NL-block-2 .block-2-menu .item { flex-shrink: 0; width: 45%; height: 160px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-block-2 .block-2-menu { } } .NL-block-2 .NL-block-content { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: space-between; min-width: 0; word-wrap: break-word; margin: 56px 0 0; gap: 24px; z-index: 2; } .NL-block-2 .NL-block-body { max-width: 560px; } .NL-block-2 .NL-block-video { width: 350px; height: 350px; flex-shrink: 0; } .NL-block-2 .NL-block-video video { width: 100%; height: 100%; object-fit: contain; } @media (max-width: 767.98px) { .NL-block-2 .NL-block-content { flex-direction: column; text-align: center; margin: 24px 0 0; } .NL-block-2 .NL-block-body { max-width: 560px; } .NL-block-2 .NL-block-video { width: 280px; height: 280px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-block-2 .NL-block-content { margin: 24px 0 0; } .NL-block-2 .NL-block-body { max-width: 560px; } .NL-block-2 .NL-block-video { width: 280px; height: 280px; } } .NL-block-3 .NL-block-content { display: flex; flex-direction: row; align-items: center; min-width: 0; word-wrap: break-word; padding: 32px; gap: 24px; } .NL-block-3 .media { width: 220px; } .NL-block-3 .NL-block-body { font-size: 24px; font-weight: bold; } @media (max-width: 767.98px) { .NL-block-3 .NL-block-content { flex-direction: column; padding: 16px; gap: 16px; } .NL-block-3 .media { width: 100%; } .NL-block-3 .NL-block-body { font-size: 18px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-block-3 .NL-block-content { padding: 16px; gap: 16px; } .NL-block-3 .media { width: 160px; } .NL-block-3 .NL-block-body { font-size: 20px; } } .NL-block-3 .NL-block-subtitle { display: flex; justify-content: center; align-items: center; margin-top: 40px; margin-bottom: 40px; border-bottom: 1px solid var(--gray-3); } .NL-block-3 .NL-block-subtitle .subtitle-box { position: relative; display: flex; justify-content: center; align-items: center; gap: 16px; width: 33.333%; border-bottom: 2px solid var(--color-primary); padding-bottom: 24px; bottom: -1px; } @media (max-width: 767.98px) { .NL-block-3 .NL-block-subtitle .subtitle-box { width: 80%; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-block-3 .NL-block-subtitle .subtitle-box { width: 50%; } } .NL-block-3 .NL-block-subtitle .subtitle-icon { width: 48px; height: 48px; background-position: center; background-repeat: no-repeat; -moz-background-size: contain; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI0IDMwQzMwLjYyNzQgMzAgMzYgMjQuNDY5NCAzNiAxNy42NDcxVjRIMTJWMTcuNjQ3MUMxMiAyNC40Njk0IDE3LjM3MjYgMzAgMjQgMzBaIiBmaWxsPSJ1cmwoI3BhaW50MF9saW5lYXJfMTk1NV8xNDgpIi8+CjxwYXRoIGQ9Ik0zNCA2SDE0VjE3LjY0NjVDMTQgMjMuNDE5MyAxOC41MzE0IDI4IDI0IDI4QzI5LjQ2ODYgMjggMzQgMjMuNDE5MyAzNCAxNy42NDY1VjZaTTM4IDE3LjY0NjVDMzggMjUuNTE4MyAzMS43ODYyIDMyIDI0IDMyQzE2LjIxMzggMzIgMTAgMjUuNTE4MyAxMCAxNy42NDY1VjRDMTAgMi44OTU0MyAxMC44OTU0IDIgMTIgMkgzNkMzNy4xMDQ2IDIgMzggMi44OTU0MyAzOCA0VjE3LjY0NjVaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0xMiA5QzEzLjEwNDYgOSAxNCA5Ljg5NTQzIDE0IDExVjIxQzE0IDIyLjEwNDYgMTMuMTA0NiAyMyAxMiAyM0M2LjcwMjQ0IDIzIDIgMTguNTY3OSAyIDExQzIgOS44OTU0MyAyLjg5NTQzIDkgNCA5SDEyWk02LjE0NjQ4IDEzQzYuNjMwODMgMTYuMTA4NiA4LjI0NzkxIDE3Ljg1NzYgMTAgMTguNTg3OVYxM0g2LjE0NjQ4WiIgZmlsbD0iIzFEMjEyOSIvPgo8cGF0aCBkPSJNNDQgOUM0NS4xMDQ2IDkgNDYgOS44OTU0MyA0NiAxMUM0NiAxOC41Njc5IDQxLjI5NzYgMjMgMzYgMjNDMzQuODk1NCAyMyAzNCAyMi4xMDQ2IDM0IDIxVjExQzM0IDkuODk1NDMgMzQuODk1NCA5IDM2IDlINDRaTTM4IDE4LjU4NzlDMzkuNzUyMSAxNy44NTc2IDQxLjM2OTIgMTYuMTA4NiA0MS44NTM1IDEzSDM4VjE4LjU4NzlaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0yMiAzNlYzMkMyMiAzMC44OTU0IDIyLjg5NTQgMzAgMjQgMzBDMjUuMTA0NiAzMCAyNiAzMC44OTU0IDI2IDMyVjM2QzI2IDM3LjEwNDYgMjUuMTA0NiAzOCAyNCAzOEMyMi44OTU0IDM4IDIyIDM3LjEwNDYgMjIgMzZaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0yOS4wNDMgMzRMMjkuMjkzIDM0LjAxNTZDMjkuODY4MSAzNC4wODgyIDMwLjM4OTIgMzQuNDA3NyAzMC43MTI5IDM0Ljg5ODRMMzQuNjY5OSA0MC44OTg0QzM1LjA3NDkgNDEuNTEyNCAzNS4xMSA0Mi4yOTk1IDM0Ljc2MTcgNDIuOTQ3M0MzNC40MTI5IDQzLjU5NTIgMzMuNzM1OCA0NCAzMyA0NEgxNUMxNC4yNzU3IDQ0IDEzLjYwNzUgNDMuNjA4NyAxMy4yNTM5IDQyLjk3NjZDMTIuOTAwNSA0Mi4zNDQzIDEyLjkxNzYgNDEuNTcwMiAxMy4yOTY5IDQwLjk1MzFMMTYuOTg2MyAzNC45NTMxQzE3LjM1MDIgMzQuMzYxNSAxNy45OTUgMzQuMDAwMiAxOC42ODk1IDM0SDI5LjA0M1pNMTguNTc4MSA0MEgyOS4yODUyTDI3Ljk2NDkgMzhIMTkuODA4NkwxOC41NzgxIDQwWiIgZmlsbD0iIzFEMjEyOSIvPgo8ZGVmcz4KPGxpbmVhckdyYWRpZW50IGlkPSJwYWludDBfbGluZWFyXzE5NTVfMTQ4IiB4MT0iMjQiIHkxPSI0IiB4Mj0iMjQiIHkyPSIzMCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgo8c3RvcCBzdG9wLWNvbG9yPSIjRTJGRkY3Ii8+CjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzAwQzA4QiIvPgo8L2xpbmVhckdyYWRpZW50Pgo8L2RlZnM+Cjwvc3ZnPgo='); } .NL-block-3 .NL-block-subtitle .subtitle-1 { font-size: 24px; font-weight: bold; color: var(--color-primary); } .NL-block-3 .NL-block-subtitle .subtitle-2 { font-size: 16px; color: var(--color-muted); } .NL-news-list { position: relative; overflow: hidden; } .NL-news-list .NL-news-list-title { display: flex; justify-content: space-between; align-items: center; } .NL-news-list .NL-news-list-title-content { display: flex; align-items: center; gap: 8px; } .NL-news-list .NL-news-list-icon { width: 36px; height: 36px; background-position: center; background-size: contain; background-repeat: no-repeat; } .NL-news-list-1 .NL-news-list-icon { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwMjhfMzE4KSI+CjxwYXRoIGQ9Ik0xOCAyQzE4LjUzMDQgMiAxOS4wMzkxIDIuMjEwNzEgMTkuNDE0MiAyLjU4NTc5QzE5Ljc4OTMgMi45NjA4NiAyMCAzLjQ2OTU3IDIwIDRWMTYuOTlDMjAgMTcuMTU4IDE5Ljk2MiAxNy4zMTIgMTkuODg3IDE3LjQ2MkwxOS4zNDIgMTguNTUyQzE5LjI3MjUgMTguNjkwOSAxOS4yMzYzIDE4Ljg0NDEgMTkuMjM2MyAxOC45OTk1QzE5LjIzNjMgMTkuMTU0OSAxOS4yNzI1IDE5LjMwODEgMTkuMzQyIDE5LjQ0N0wxOS44ODUgMjAuNTM1QzE5Ljk2NSAyMC42ODc0IDIwLjAwNDQgMjAuODU3OCAxOS45OTkyIDIxLjAyOTlDMTkuOTk0MSAyMS4yMDE5IDE5Ljk0NDYgMjEuMzY5NyAxOS44NTU2IDIxLjUxNzFDMTkuNzY2NiAyMS42NjQ0IDE5LjY0MTEgMjEuNzg2MyAxOS40OTEyIDIxLjg3MDlDMTkuMzQxMyAyMS45NTU1IDE5LjE3MjEgMjEuOTk5OSAxOSAyMkg3QzYuMjA0MzUgMjIgNS40NDEyOSAyMS42ODM5IDQuODc4NjggMjEuMTIxM0M0LjMxNjA3IDIwLjU1ODcgNCAxOS43OTU2IDQgMTlWNUM0IDQuMjA0MzUgNC4zMTYwNyAzLjQ0MTI5IDQuODc4NjggMi44Nzg2OEM1LjQ0MTI5IDIuMzE2MDcgNi4yMDQzNSAyIDcgMkgxOFpNMTcuNDA4IDE4SDdDNi43NDUxMiAxOC4wMDAzIDYuNDk5OTcgMTguMDk3OSA2LjMxNDYzIDE4LjI3MjhDNi4xMjkzIDE4LjQ0NzggNi4wMTc3NyAxOC42ODcgNi4wMDI4MyAxOC45NDE0QzUuOTg3ODkgMTkuMTk1OCA2LjA3MDY3IDE5LjQ0NjQgNi4yMzQyNiAxOS42NDE4QzYuMzk3ODYgMTkuODM3MyA2LjYyOTkgMTkuOTYyOSA2Ljg4MyAxOS45OTNMNyAyMEgxNy40MDhDMTcuMjA1MyAxOS40MjY2IDE3LjE4MTYgMTguODA1MiAxNy4zNCAxOC4yMThMMTcuNDA4IDE4Wk0xOCA0SDdDNi43NTUwNyA0LjAwMDAzIDYuNTE4NjYgNC4wODk5NiA2LjMzNTYzIDQuMjUyNzJDNi4xNTI1OSA0LjQxNTQ3IDYuMDM1NjYgNC42Mzk3NSA2LjAwNyA0Ljg4M0w2IDVWMTYuMTdDNi4yNSAxNi4wODIgNi41MTYgMTYuMDI2IDYuNzkxIDE2LjAwN0w3IDE2SDE4VjRaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0xNCA3QzE0LjI1NDkgNy4wMDAyOCAxNC41IDcuMDk3ODggMTQuNjg1NCA3LjI3Mjg1QzE0Ljg3MDcgNy40NDc4MiAxNC45ODIyIDcuNjg2OTUgMTQuOTk3MiA3Ljk0MTM5QzE1LjAxMjEgOC4xOTU4NCAxNC45MjkzIDguNDQ2MzggMTQuNzY1NyA4LjY0MTgzQzE0LjYwMjIgOC44MzcyOSAxNC4zNzAxIDguOTYyOSAxNC4xMTcgOC45OTNMMTQgOUgxMEM5Ljc0NTEzIDguOTk5NzIgOS40OTk5NyA4LjkwMjEyIDkuMzE0NjQgOC43MjcxNUM5LjEyOTMgOC41NTIxOCA5LjAxNzc3IDguMzEzMDUgOS4wMDI4MyA4LjA1ODYxQzguOTg3OSA3LjgwNDE2IDkuMDcwNjggNy41NTM2MiA5LjIzNDI3IDcuMzU4MTdDOS4zOTc4NiA3LjE2MjcxIDkuNjI5OTEgNy4wMzcxIDkuODgzMDEgNy4wMDdMMTAgN0gxNFoiIGZpbGw9IiMwMEMwOEIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMDI4XzMxOCI+CjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K'); } .NL-news-list-2 .NL-news-list-icon { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwMjhfNDAyKSI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNiA0QzYgMy43MzQ3OCA2LjEwNTM2IDMuNDgwNDMgNi4yOTI4OSAzLjI5Mjg5QzYuNDgwNDMgMy4xMDUzNiA2LjczNDc4IDMgNyAzSDIwQzIwLjI2NTIgMyAyMC41MTk2IDMuMTA1MzYgMjAuNzA3MSAzLjI5Mjg5QzIwLjg5NDYgMy40ODA0MyAyMSAzLjczNDc4IDIxIDRWMThDMjEgMTguNzk1NiAyMC42ODM5IDE5LjU1ODcgMjAuMTIxMyAyMC4xMjEzQzE5LjU1ODcgMjAuNjgzOSAxOC43OTU2IDIxIDE4IDIxSDUuNUM0LjgzNjk2IDIxIDQuMjAxMDcgMjAuNzM2NiAzLjczMjIzIDIwLjI2NzhDMy4yNjMzOSAxOS43OTg5IDMgMTkuMTYzIDMgMTguNVYxMUMzIDEwLjczNDggMy4xMDUzNiAxMC40ODA0IDMuMjkyODkgMTAuMjkyOUMzLjQ4MDQzIDEwLjEwNTQgMy43MzQ3OCAxMCA0IDEwSDZWNFpNNiAxMkg1VjE4LjVDNSAxOC42MzI2IDUuMDUyNjggMTguNzU5OCA1LjE0NjQ1IDE4Ljg1MzZDNS4yNDAyMSAxOC45NDczIDUuMzY3MzkgMTkgNS41IDE5QzUuNjMyNjEgMTkgNS43NTk3OSAxOC45NDczIDUuODUzNTUgMTguODUzNkM1Ljk0NzMyIDE4Ljc1OTggNiAxOC42MzI2IDYgMTguNVYxMlpNNy45NSAxOUgxOEMxOC4yNjUyIDE5IDE4LjUxOTYgMTguODk0NiAxOC43MDcxIDE4LjcwNzFDMTguODk0NiAxOC41MTk2IDE5IDE4LjI2NTIgMTkgMThWNUg4VjE4LjVDOCAxOC42NzEgNy45ODMgMTguODM4IDcuOTUgMTlaTTEwIDE1QzEwIDE0LjczNDggMTAuMTA1NCAxNC40ODA0IDEwLjI5MjkgMTQuMjkyOUMxMC40ODA0IDE0LjEwNTQgMTAuNzM0OCAxNCAxMSAxNEgxNUMxNS4yNjUyIDE0IDE1LjUxOTYgMTQuMTA1NCAxNS43MDcxIDE0LjI5MjlDMTUuODk0NiAxNC40ODA0IDE2IDE0LjczNDggMTYgMTVDMTYgMTUuMjY1MiAxNS44OTQ2IDE1LjUxOTYgMTUuNzA3MSAxNS43MDcxQzE1LjUxOTYgMTUuODk0NiAxNS4yNjUyIDE2IDE1IDE2SDExQzEwLjczNDggMTYgMTAuNDgwNCAxNS44OTQ2IDEwLjI5MjkgMTUuNzA3MUMxMC4xMDU0IDE1LjUxOTYgMTAgMTUuMjY1MiAxMCAxNVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMCA4QzEwIDcuNzM0NzggMTAuMTA1NCA3LjQ4MDQzIDEwLjI5MjkgNy4yOTI4OUMxMC40ODA0IDcuMTA1MzYgMTAuNzM0OCA3IDExIDdIMTZDMTYuMjY1MiA3IDE2LjUxOTYgNy4xMDUzNiAxNi43MDcxIDcuMjkyODlDMTYuODk0NiA3LjQ4MDQzIDE3IDcuNzM0NzggMTcgOFYxMUMxNyAxMS4yNjUyIDE2Ljg5NDYgMTEuNTE5NiAxNi43MDcxIDExLjcwNzFDMTYuNTE5NiAxMS44OTQ2IDE2LjI2NTIgMTIgMTYgMTJIMTFDMTAuNzM0OCAxMiAxMC40ODA0IDExLjg5NDYgMTAuMjkyOSAxMS43MDcxQzEwLjEwNTQgMTEuNTE5NiAxMCAxMS4yNjUyIDEwIDExVjhaTTEyIDlWMTBIMTVWOUgxMloiIGZpbGw9IiMwMEMwOEIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMDI4XzQwMiI+CjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K'); } .NL-news-list-3 .NL-news-list-icon { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwMjhfNDI2KSI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMjAgM0MyMC41MDQ2IDIuOTk5ODQgMjAuOTkwNiAzLjE5MDQxIDIxLjM2MDUgMy41MzM1QzIxLjczMDUgMy44NzY1OSAyMS45NTcyIDQuMzQ2ODQgMjEuOTk1IDQuODVMMjIgNVYxOUMyMi4wMDAyIDE5LjUwNDYgMjEuODA5NiAxOS45OTA2IDIxLjQ2NjUgMjAuMzYwNUMyMS4xMjM0IDIwLjczMDUgMjAuNjUzMiAyMC45NTcyIDIwLjE1IDIwLjk5NUwyMCAyMUg0QzMuNDk1NDIgMjEuMDAwMiAzLjAwOTQzIDIwLjgwOTYgMi42Mzk0NSAyMC40NjY1QzIuMjY5NDcgMjAuMTIzNCAyLjA0Mjg0IDE5LjY1MzIgMi4wMDUgMTkuMTVMMiAxOVY1QzEuOTk5ODQgNC40OTU0MiAyLjE5MDQxIDQuMDA5NDMgMi41MzM1IDMuNjM5NDVDMi44NzY1OSAzLjI2OTQ3IDMuMzQ2ODQgMy4wNDI4NCAzLjg1IDMuMDA1TDQgM0gyMFpNMjAgNUg0VjE5SDIwVjVaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuMzQgNy42Mzc5NkwxMC44NTggNy44Njc5NkwxMS4xOTYgOC4wMjc5NkwxMS41ODMgOC4yMTc5NkwxMi4wMTMgOC40MzU5NkwxMi40ODMgOC42ODU5NkwxMi45OSA4Ljk2NTk2TDEzLjI1NiA5LjExNzk2TDEzLjc3NCA5LjQyMjk2TDE0LjI0OCA5LjcxNDk2TDE0LjY3OCA5Ljk4Nzk2TDE1LjA1OCAxMC4yNDFMMTUuNTM4IDEwLjU3MUwxNS45MDIgMTAuODM0TDE1Ljk5NyAxMC45MDRDMTYuMTUxMyAxMS4wMTg4IDE2LjI3NjYgMTEuMTY4MSAxNi4zNjMgMTEuMzRDMTYuNDQ5NCAxMS41MTE5IDE2LjQ5NDMgMTEuNzAxNiAxNi40OTQzIDExLjg5NEMxNi40OTQzIDEyLjA4NjMgMTYuNDQ5NCAxMi4yNzYgMTYuMzYzIDEyLjQ0NzlDMTYuMjc2NiAxMi42MTk4IDE2LjE1MTMgMTIuNzY5MSAxNS45OTcgMTIuODg0TDE1LjY3NCAxMy4xMTlMMTUuMjM0IDEzLjQyN0wxNC44NzggMTMuNjY2TDE0LjQ3MyAxMy45MjlMMTQuMDIgMTQuMjEyTDEzLjUyMSAxNC41MTJMMTIuOTg3IDE0LjgyMUwxMi40NzggMTUuMTAzTDEyLjAwNyAxNS4zNTNMMTEuNTc3IDE1LjU3M0wxMS4xOTEgMTUuNzYxTDEwLjU2OSAxNi4wNDlMMTAuMzM5IDE2LjE0OUMxMC4xNjI0IDE2LjIyNSA5Ljk3MDQ4IDE2LjI1ODggOS43Nzg1NCAxNi4yNDc2QzkuNTg2NTkgMTYuMjM2NCA5LjM5OTkzIDE2LjE4MDQgOS4yMzM0MyAxNi4wODQzQzkuMDY2OTQgMTUuOTg4MSA4LjkyNTIyIDE1Ljg1NDQgOC44MTk1OCAxNS42OTM3QzguNzEzOTQgMTUuNTMzIDguNjQ3MyAxNS4zNDk5IDguNjI0OTcgMTUuMTU5TDguNTY2OTcgMTQuNTk0TDguNTM0OTcgMTQuMjJMOC40OTI5NyAxMy41NTZMOC40Njk5NyAxMy4wNDhMOC40NTQ5NyAxMi40OTNDOC40NTMxOSAxMi4zOTUgOC40NTE4NiAxMi4yOTcgOC40NTA5NyAxMi4xOTlMOC40NDg5NyAxMS44OTRDOC40NDg5NyAxMS42ODcgOC40NTA5NyAxMS40ODcgOC40NTQ5NyAxMS4yOTRMOC40Njk5NyAxMC43MzlMOC40OTI5NyAxMC4yMzJMOC41MTk5NyA5Ljc3NDk2TDguNTQ5OTcgOS4zNzM5Nkw4LjYyNDk3IDguNjI5OTZDOC42NDcxNyA4LjQzODc4IDguNzEzNzMgOC4yNTU0MyA4LjgxOTM3IDguMDk0NTRDOC45MjUgNy45MzM2NSA5LjA2Njc3IDcuNzk5NjggOS4yMzMzOCA3LjcwMzMxQzkuMzk5OTggNy42MDY5NCA5LjU4NjggNy41NTA4NSA5Ljc3ODkzIDcuNTM5NUM5Ljk3MTA2IDcuNTI4MTYgMTAuMTYzMiA3LjU2MTg3IDEwLjM0IDcuNjM3OTZaTTEwLjk1MSAxMC4xMzlMMTAuNTE1IDkuOTIwOTZMMTAuNDg2IDEwLjQwOEwxMC40NjQgMTAuOTU5TDEwLjQ1MSAxMS41NjlMMTAuNDQ5IDExLjg5NEwxMC40NTEgMTIuMjE5TDEwLjQ2NCAxMi44MjhMMTAuNDc0IDEzLjExMUwxMC41IDEzLjYzMUwxMC41MTUgMTMuODY2TDEwLjk0OSAxMy42NDhMMTEuNDM2IDEzLjM5MkwxMS45NzEgMTMuMDk4TDEyLjI1NSAxMi45MzZMMTIuODA2IDEyLjYxTDEzLjMgMTIuMzA0TDEzLjczNiAxMi4wMjRMMTMuOTMyIDExLjg5NEwxMy41MjUgMTEuNjI0TDEzLjA1OSAxMS4zM0MxMi43OTM4IDExLjE2NTggMTIuNTI2MSAxMS4wMDU4IDEyLjI1NiAxMC44NUwxMS45NzMgMTAuNjg5TDExLjQzOSAxMC4zOTVMMTAuOTUxIDEwLjEzOVoiIGZpbGw9IiMwMEMwOEIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMDI4XzQyNiI+CjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K'); } .NL-news-list-title { font-size: 24px; font-weight: bold; } @media (max-width: 767.98px) { .NL-news-list-title { font-size: 18px; } .NL-news-list .NL-news-list-title { font-size: 18px; } .NL-news-list .NL-news-list-icon { width: 24px; height: 24px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-news-list-title { font-size: 20px; } .NL-news-list .NL-news-list-icon { width: 24px; height: 24px; } } .NL-news-list-banner { display: flex; flex-direction: column; gap: 12px; overflow: hidden; overflow-y: auto; height: 400px; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } .NL-news-list-banner::-webkit-scrollbar { width: 6px; height: 6px; background-color: transparent } .NL-news-list-banner::-webkit-scrollbar-thumb { border-radius: 10px; background-color: var(--color-dark) } .NL-news-list-banner::-webkit-scrollbar-track { border-radius: 10px; background-color: var(--bg-light) } .NL-news-list-banner .item { position: relative; display: flex; flex-direction: row; align-items: center; min-width: 0; overflow-wrap: break-word; gap: 16px; } .NL-news-list-banner .item .media { width: 120px; flex-shrink: 0; } @media (min-width: 768px) and (max-width: 991.98px) { .NL-news-list-banner .item { gap: 8px; } .NL-news-list-banner .item .media { width: 60px; flex-shrink: 0; } } .NL-news-list-banner .item .item-body { flex: 1 1 auto; } .NL-products-list .item { } .NL-products-list .item .item-icon { width: 60px; height: 60px; background-repeat: no-repeat; background-position: center; background-size: contain; } .NL-products-list .item .item-icon.item-icon-1 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQyIDIuOTE2NzVDNDYuNzQyOSAyLjkxNjc1IDUwLjg1MyA1LjYxMjczIDUyLjg4NzQgOS41NDc2MUM1My4wMTU4IDkuNzk2MDIgNTMuMDgzMyAxMC4wNzIzIDUzLjA4MzMgMTAuMzUyVjE5Ljk4MTVDNTMuMDgzMyAyMC4yNjEyIDUzLjAxNTggMjAuNTM3NSA1Mi44ODc0IDIwLjc4NTlDNTAuODUzIDI0LjcyMDggNDYuNzQyOCAyNy40MTY3IDQyIDI3LjQxNjdDNDEuNDA2MSAyNy40MTY3IDQwLjgyMjMgMjcuMzY4OSA0MC4yNSAyNy4yODY5VjUxLjMzMzRDNDAuMjUgNTIuMjk5OSAzOS40NjY1IDUzLjA4MzQgMzguNSA1My4wODM0SDMxLjVDMzAuNTMzNSA1My4wODM0IDI5Ljc1IDUyLjI5OTkgMjkuNzUgNTEuMzMzNFYxNS4xNjY3QzI5Ljc1IDguNDAxMjcgMzUuMjM0NSAyLjkxNjc1IDQyIDIuOTE2NzVaTTMzLjI1IDQ5LjU4MzRIMzYuNzVWMjUuMDY5N0MzNi43NSAyNC41MDE3IDM3LjAyNjggMjMuOTY5IDM3LjQ5MDYgMjMuNjQxQzM3Ljk1NDMgMjMuMzEzMyAzOC41NDc5IDIzLjIzMDggMzkuMDgzMyAyMy40MkMzOS45OTMzIDIzLjc0MTUgNDAuOTc0NCAyMy45MTY3IDQyIDIzLjkxNjdDNDUuMjQxNyAyMy45MTY3IDQ4LjA3MDIgMjIuMTUxOSA0OS41ODMzIDE5LjUyNThWMTAuODA1NEM0OC4wNyA4LjE4MDI5IDQ1LjI0MSA2LjQxNjc1IDQyIDYuNDE2NzVDMzcuMTY3NSA2LjQxNjc1IDMzLjI1IDEwLjMzNDMgMzMuMjUgMTUuMTY2N1Y0OS41ODM0WiIgZmlsbD0iIzFEMjEyOSIvPgo8cGF0aCBkPSJNMjIuNzUgMTUuMTY2N0MyMi43NSAxMC4zMzQzIDE4LjgzMjUgNi40MTY3NSAxNCA2LjQxNjc1QzEwLjc1OSA2LjQxNjc1IDcuOTMwMDcgOC4xODAyNyA2LjQxNjY3IDEwLjgwNTRWMTkuNTI1OEM3LjkyOTgyIDIyLjE1MTkgMTAuNzU4MyAyMy45MTY3IDE0IDIzLjkxNjdDMTUuMDI1NiAyMy45MTY3IDE2LjAwNjcgMjMuNzQxNSAxNi45MTY3IDIzLjQyQzE3LjQ1MjEgMjMuMjMwOCAxOC4wNDU3IDIzLjMxMzMgMTguNTA5NCAyMy42NDFDMTguOTczMyAyMy45NjkgMTkuMjUgMjQuNTAxNyAxOS4yNSAyNS4wNjk3VjQ5LjU4MzRIMjIuNzVWMTUuMTY2N1pNMjYuMjUgNTEuMzMzNEMyNi4yNSA1Mi4yOTk5IDI1LjQ2NjUgNTMuMDgzNCAyNC41IDUzLjA4MzRIMTcuNUMxNi41MzM1IDUzLjA4MzQgMTUuNzUgNTIuMjk5OSAxNS43NSA1MS4zMzM0VjI3LjI4NjlDMTUuMTc3NyAyNy4zNjg5IDE0LjU5MzkgMjcuNDE2NyAxNCAyNy40MTY3QzkuMjU3MSAyNy40MTY3IDUuMTQ3MDIgMjQuNzIwOCAzLjExMjY0IDIwLjc4NTlDMi45ODQyMiAyMC41Mzc1IDIuOTE2NjcgMjAuMjYxMiAyLjkxNjY3IDE5Ljk4MTVWMTAuMzUyTDIuOTI4MDYgMTAuMTQyM0MyLjk1Mjk4IDkuOTM1NDIgMy4wMTY0MiA5LjczMzc0IDMuMTEyNjQgOS41NDc2MUM1LjE0NzAxIDUuNjEyNzQgOS4yNTcwOSAyLjkxNjc1IDE0IDIuOTE2NzVDMjAuNzY1NSAyLjkxNjc1IDI2LjI1IDguNDAxMjcgMjYuMjUgMTUuMTY2N1Y1MS4zMzM0WiIgZmlsbD0iIzFEMjEyOSIvPgo8cGF0aCBkPSJNMTcuNSAxMy40MTY3QzE4LjQ2NjUgMTMuNDE2NyAxOS4yNSAxNC4yMDAyIDE5LjI1IDE1LjE2NjdDMTkuMjUgMTYuMTMzMiAxOC40NjY1IDE2LjkxNjcgMTcuNSAxNi45MTY3SDE2LjMzMzNDMTUuMzY2OCAxNi45MTY3IDE0LjU4MzMgMTYuMTMzMiAxNC41ODMzIDE1LjE2NjdDMTQuNTgzMyAxNC4yMDAyIDE1LjM2NjggMTMuNDE2NyAxNi4zMzMzIDEzLjQxNjdIMTcuNVoiIGZpbGw9IiMwMEMwOEIiLz4KPHBhdGggZD0iTTM5LjY2NjcgMTMuNDE2N0M0MC42MzMyIDEzLjQxNjcgNDEuNDE2NyAxNC4yMDAyIDQxLjQxNjcgMTUuMTY2N0M0MS40MTY3IDE2LjEzMzIgNDAuNjMzMiAxNi45MTY3IDM5LjY2NjcgMTYuOTE2N0gzOC41QzM3LjUzMzUgMTYuOTE2NyAzNi43NSAxNi4xMzMyIDM2Ljc1IDE1LjE2NjdDMzYuNzUgMTQuMjAwMiAzNy41MzM1IDEzLjQxNjcgMzguNSAxMy40MTY3SDM5LjY2NjdaIiBmaWxsPSIjMDBDMDhCIi8+Cjwvc3ZnPgo='); } .NL-products-list .item .item-icon.item-icon-2 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQ0LjkxNjYgNC42NjY1OUM0NC45MTY2IDQuMzQ0NCA0NC42NTU1IDQuMDgzMjUgNDQuMzMzMyA0LjA4MzI1SDExLjY2NjZDMTEuMzQ0NSA0LjA4MzI1IDExLjA4MzMgNC4zNDQ0MiAxMS4wODMzIDQuNjY2NTlWNTEuMzMzM0MxMS4wODMzIDUxLjY1NTQgMTEuMzQ0NSA1MS45MTY2IDExLjY2NjYgNTEuOTE2Nkg0NC4zMzMzQzQ0LjY1NTUgNTEuOTE2NiA0NC45MTY2IDUxLjY1NTUgNDQuOTE2NiA1MS4zMzMzVjQuNjY2NTlaTTQ4LjQxNjYgNTEuMzMzM0M0OC40MTY2IDUzLjU4ODQgNDYuNTg4NSA1NS40MTY2IDQ0LjMzMzMgNTUuNDE2NkgxMS42NjY2QzkuNDExNSA1NS40MTY2IDcuNTgzMzEgNTMuNTg4NSA3LjU4MzMxIDUxLjMzMzNWNC42NjY1OUM3LjU4MzMxIDIuNDExNDIgOS40MTE0OCAwLjU4MzI1MiAxMS42NjY2IDAuNTgzMjUySDQ0LjMzMzNDNDYuNTg4NSAwLjU4MzI1MiA0OC40MTY2IDIuNDExNDQgNDguNDE2NiA0LjY2NjU5VjUxLjMzMzNaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0zMy4yNSAzNy4zMzMzQzMzLjI1IDM0LjQzMzggMzAuODk5NSAzMi4wODMzIDI4IDMyLjA4MzNDMjUuMTAwNSAzMi4wODMzIDIyLjc1IDM0LjQzMzggMjIuNzUgMzcuMzMzM0MyMi43NSA0MC4yMzI3IDI1LjEwMDUgNDIuNTgzMyAyOCA0Mi41ODMzQzMwLjg5OTUgNDIuNTgzMyAzMy4yNSA0MC4yMzI3IDMzLjI1IDM3LjMzMzNaTTM2Ljc1IDM3LjMzMzNDMzYuNzUgNDIuMTY1NyAzMi44MzI1IDQ2LjA4MzMgMjggNDYuMDgzM0MyMy4xNjc1IDQ2LjA4MzMgMTkuMjUgNDIuMTY1NyAxOS4yNSAzNy4zMzMzQzE5LjI1IDMyLjUwMDggMjMuMTY3NSAyOC41ODMzIDI4IDI4LjU4MzNDMzIuODMyNSAyOC41ODMzIDM2Ljc1IDMyLjUwMDggMzYuNzUgMzcuMzMzM1oiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTMwLjkxNjYgMTYuMzMzNEMzMC45MTY2IDE0LjcyMjYgMjkuNjEwOCAxMy40MTY3IDI4IDEzLjQxNjdDMjYuMzg5MiAxMy40MTY3IDI1LjA4MzMgMTQuNzIyNiAyNS4wODMzIDE2LjMzMzRDMjUuMDgzMyAxNy45NDQyIDI2LjM4OTIgMTkuMjUwMSAyOCAxOS4yNTAxQzI5LjYxMDggMTkuMjUwMSAzMC45MTY2IDE3Ljk0NDIgMzAuOTE2NiAxNi4zMzM0Wk0zNC40MTY2IDE2LjMzMzRDMzQuNDE2NiAxOS44NzcyIDMxLjU0MzggMjIuNzUwMSAyOCAyMi43NTAxQzI0LjQ1NjIgMjIuNzUwMSAyMS41ODMzIDE5Ljg3NzIgMjEuNTgzMyAxNi4zMzM0QzIxLjU4MzMgMTIuNzg5NiAyNC40NTYyIDkuOTE2NzUgMjggOS45MTY3NUMzMS41NDM4IDkuOTE2NzUgMzQuNDE2NiAxMi43ODk2IDM0LjQxNjYgMTYuMzMzNFoiIGZpbGw9IiMwMEMwOEIiLz4KPC9zdmc+Cg=='); } .NL-products-list .item .item-icon.item-icon-3 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI2LjI1IDEyLjgzMzNWNS44MzMyNUMyNi4yNSA0Ljg2Njc1IDI3LjAzMzUgNC4wODMyNSAyOCA0LjA4MzI1QzI4Ljk2NjUgNC4wODMyNSAyOS43NSA0Ljg2Njc1IDI5Ljc1IDUuODMzMjVWMTIuODMzM0MyOS43NSAxMy43OTk3IDI4Ljk2NjUgMTQuNTgzMyAyOCAxNC41ODMzQzI3LjAzMzUgMTQuNTgzMyAyNi4yNSAxMy43OTk3IDI2LjI1IDEyLjgzMzNaIiBmaWxsPSIjMDBDMDhCIi8+CjxwYXRoIGQ9Ik0zNS41ODMzIDE0LjAwMDFDMzUuNTgzMyA5LjgxMTkyIDMyLjE4ODIgNi40MTY3NSAyOCA2LjQxNjc1QzIzLjgxMTggNi40MTY3NSAyMC40MTY3IDkuODExOTIgMjAuNDE2NyAxNC4wMDAxVjI4LjAwMDFDMjAuNDE2NyAzMi4xODgyIDIzLjgxMTggMzUuNTgzNCAyOCAzNS41ODM0QzMyLjE4ODIgMzUuNTgzNCAzNS41ODMzIDMyLjE4ODIgMzUuNTgzMyAyOC4wMDAxVjE0LjAwMDFaTTM5LjA4MzMgMjguMDAwMUMzOS4wODMzIDM0LjEyMTIgMzQuMTIxMiAzOS4wODM0IDI4IDM5LjA4MzRDMjEuODc4OCAzOS4wODM0IDE2LjkxNjcgMzQuMTIxMiAxNi45MTY3IDI4LjAwMDFWMTQuMDAwMUMxNi45MTY3IDcuODc4OTMgMjEuODc4OCAyLjkxNjc1IDI4IDIuOTE2NzVDMzQuMTIxMiAyLjkxNjc1IDM5LjA4MzMgNy44Nzg5MyAzOS4wODMzIDE0LjAwMDFWMjguMDAwMVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTkuOTE2NjcgMjhWMjQuNUM5LjkxNjY3IDIzLjUzMzUgMTAuNzAwMiAyMi43NSAxMS42NjY3IDIyLjc1QzEyLjYzMzIgMjIuNzUgMTMuNDE2NyAyMy41MzM1IDEzLjQxNjcgMjQuNVYyOEMxMy40MTY3IDM2LjA1NDIgMTkuOTQ1OCA0Mi41ODMzIDI4IDQyLjU4MzNDMzYuMDU0MiA0Mi41ODMzIDQyLjU4MzMgMzYuMDU0MiA0Mi41ODMzIDI4VjI0LjVDNDIuNTgzMyAyMy41MzM1IDQzLjM2NjggMjIuNzUgNDQuMzMzMyAyMi43NUM0NS4yOTk4IDIyLjc1IDQ2LjA4MzMgMjMuNTMzNSA0Ni4wODMzIDI0LjVWMjhDNDYuMDgzMyAzNy45ODcyIDM3Ljk4NzIgNDYuMDgzMyAyOCA0Ni4wODMzQzE4LjAxMjggNDYuMDgzMyA5LjkxNjY3IDM3Ljk4NzIgOS45MTY2NyAyOFoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTI0LjUgMTYuOTE2N0MyNS40NjY1IDE2LjkxNjcgMjYuMjUgMTcuNzAwMiAyNi4yNSAxOC42NjY3QzI2LjI1IDE5LjYzMzIgMjUuNDY2NSAyMC40MTY3IDI0LjUgMjAuNDE2N0gxOC42NjY3QzE3LjcwMDIgMjAuNDE2NyAxNi45MTY3IDE5LjYzMzIgMTYuOTE2NyAxOC42NjY3QzE2LjkxNjcgMTcuNzAwMiAxNy43MDAyIDE2LjkxNjcgMTguNjY2NyAxNi45MTY3SDI0LjVaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0zNy4zMzMzIDE2LjkxNjdDMzguMjk5OCAxNi45MTY3IDM5LjA4MzMgMTcuNzAwMiAzOS4wODMzIDE4LjY2NjdDMzkuMDgzMyAxOS42MzMyIDM4LjI5OTggMjAuNDE2NyAzNy4zMzMzIDIwLjQxNjdIMzEuNUMzMC41MzM1IDIwLjQxNjcgMjkuNzUgMTkuNjMzMiAyOS43NSAxOC42NjY3QzI5Ljc1IDE3LjcwMDIgMzAuNTMzNSAxNi45MTY3IDMxLjUgMTYuOTE2N0gzNy4zMzMzWiIgZmlsbD0iIzFEMjEyOSIvPgo8cGF0aCBkPSJNMjQuNSAyMy45MTY3QzI1LjQ2NjUgMjMuOTE2NyAyNi4yNSAyNC43MDAyIDI2LjI1IDI1LjY2NjdDMjYuMjUgMjYuNjMzMiAyNS40NjY1IDI3LjQxNjcgMjQuNSAyNy40MTY3SDE4LjY2NjdDMTcuNzAwMiAyNy40MTY3IDE2LjkxNjcgMjYuNjMzMiAxNi45MTY3IDI1LjY2NjdDMTYuOTE2NyAyNC43MDAyIDE3LjcwMDIgMjMuOTE2NyAxOC42NjY3IDIzLjkxNjdIMjQuNVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTM3LjMzMzMgMjMuOTE2N0MzOC4yOTk4IDIzLjkxNjcgMzkuMDgzMyAyNC43MDAyIDM5LjA4MzMgMjUuNjY2N0MzOS4wODMzIDI2LjYzMzIgMzguMjk5OCAyNy40MTY3IDM3LjMzMzMgMjcuNDE2N0gzMS41QzMwLjUzMzUgMjcuNDE2NyAyOS43NSAyNi42MzMyIDI5Ljc1IDI1LjY2NjdDMjkuNzUgMjQuNzAwMiAzMC41MzM1IDIzLjkxNjcgMzEuNSAyMy45MTY3SDM3LjMzMzNaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0yOS43NSA0NC4zMzMzVjUxLjMzMzNIMjYuMjVWNDQuMzMzM0gyOS43NVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTM3LjMzMzMgNDkuNTgzM0MzOC4yOTk4IDQ5LjU4MzMgMzkuMDgzMyA1MC4zNjY4IDM5LjA4MzMgNTEuMzMzM0MzOS4wODMzIDUyLjI5OTggMzguMjk5OCA1My4wODMzIDM3LjMzMzMgNTMuMDgzM0gxOC42NjY3QzE3LjcwMDIgNTMuMDgzMyAxNi45MTY3IDUyLjI5OTggMTYuOTE2NyA1MS4zMzMzQzE2LjkxNjcgNTAuMzY2OCAxNy43MDAyIDQ5LjU4MzMgMTguNjY2NyA0OS41ODMzSDM3LjMzMzNaIiBmaWxsPSIjMUQyMTI5Ii8+Cjwvc3ZnPgo='); } .NL-products-list .item .item-icon.item-icon-4 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQ5LjU4MzQgMjguMDAwMUM0OS41ODM0IDE2LjA3OTkgMzkuOTIwMiA2LjQxNjc1IDI4IDYuNDE2NzVDMTYuMDc5OSA2LjQxNjc1IDYuNDE2NjkgMTYuMDc5OSA2LjQxNjY5IDI4LjAwMDFDNi40MTY2OSAzOS45MjAyIDE2LjA3OTkgNDkuNTgzNCAyOCA0OS41ODM0QzM5LjkyMDIgNDkuNTgzNCA0OS41ODM0IDM5LjkyMDIgNDkuNTgzNCAyOC4wMDAxWk01My4wODM0IDI4LjAwMDFDNTMuMDgzNCA0MS44NTMyIDQxLjg1MzIgNTMuMDgzNCAyOCA1My4wODM0QzE0LjE0NjkgNTMuMDgzNCAyLjkxNjY5IDQxLjg1MzIgMi45MTY2OSAyOC4wMDAxQzIuOTE2NjkgMTQuMTQ2OSAxNC4xNDY5IDIuOTE2NzUgMjggMi45MTY3NUM0MS44NTMyIDIuOTE2NzUgNTMuMDgzNCAxNC4xNDY5IDUzLjA4MzQgMjguMDAwMVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTMzLjI1IDM1VjIxQzMzLjI1IDIwLjAzMzUgMzQuMDMzNSAxOS4yNSAzNSAxOS4yNUMzNS45NjY1IDE5LjI1IDM2Ljc1IDIwLjAzMzUgMzYuNzUgMjFWMzVDMzYuNzUgMzUuOTY2NSAzNS45NjY1IDM2Ljc1IDM1IDM2Ljc1QzM0LjAzMzUgMzYuNzUgMzMuMjUgMzUuOTY2NSAzMy4yNSAzNVoiIGZpbGw9IiMwMEMwOEIiLz4KPHBhdGggZD0iTTQwLjI1IDMwLjMzMzRWMjUuNjY2N0M0MC4yNSAyNC43MDAyIDQxLjAzMzUgMjMuOTE2NyA0MiAyMy45MTY3QzQyLjk2NjUgMjMuOTE2NyA0My43NSAyNC43MDAyIDQzLjc1IDI1LjY2NjdWMzAuMzMzNEM0My43NSAzMS4yOTk5IDQyLjk2NjUgMzIuMDgzNCA0MiAzMi4wODM0QzQxLjAzMzUgMzIuMDgzNCA0MC4yNSAzMS4yOTk5IDQwLjI1IDMwLjMzMzRaIiBmaWxsPSIjMDBDMDhCIi8+CjxwYXRoIGQ9Ik0xOS4yNSAzNVYyMUMxOS4yNSAyMC4wMzM1IDIwLjAzMzUgMTkuMjUgMjEgMTkuMjVDMjEuOTY2NSAxOS4yNSAyMi43NSAyMC4wMzM1IDIyLjc1IDIxVjM1QzIyLjc1IDM1Ljk2NjUgMjEuOTY2NSAzNi43NSAyMSAzNi43NUMyMC4wMzM1IDM2Ljc1IDE5LjI1IDM1Ljk2NjUgMTkuMjUgMzVaIiBmaWxsPSIjMDBDMDhCIi8+CjxwYXRoIGQ9Ik0xMi4yNSAzMC4zMzM0VjI1LjY2NjdDMTIuMjUgMjQuNzAwMiAxMy4wMzM1IDIzLjkxNjcgMTQgMjMuOTE2N0MxNC45NjY1IDIzLjkxNjcgMTUuNzUgMjQuNzAwMiAxNS43NSAyNS42NjY3VjMwLjMzMzRDMTUuNzUgMzEuMjk5OSAxNC45NjY1IDMyLjA4MzQgMTQgMzIuMDgzNEMxMy4wMzM1IDMyLjA4MzQgMTIuMjUgMzEuMjk5OSAxMi4yNSAzMC4zMzM0WiIgZmlsbD0iIzAwQzA4QiIvPgo8cGF0aCBkPSJNMjYuMjUgMzkuNjY2NlYxNi4zMzMzQzI2LjI1IDE1LjM2NjggMjcuMDMzNSAxNC41ODMzIDI4IDE0LjU4MzNDMjguOTY2NSAxNC41ODMzIDI5Ljc1IDE1LjM2NjggMjkuNzUgMTYuMzMzM1YzOS42NjY2QzI5Ljc1IDQwLjYzMzEgMjguOTY2NSA0MS40MTY2IDI4IDQxLjQxNjZDMjcuMDMzNSA0MS40MTY2IDI2LjI1IDQwLjYzMzEgMjYuMjUgMzkuNjY2NloiIGZpbGw9IiMwMEMwOEIiLz4KPC9zdmc+Cg=='); } .NL-products-list .item .item-title { font-size: 24px; font-weight: bold; } @media (max-width: 767.98px) { .NL-products-list .item .item-title { font-size: 20px; } } /*-------------------------------------------------------------- ## NearLink 5 --------------------------------------------------------------*/ .NL-block-5 .block-5-list { } .NL-block-5 .block-5-list .item { position: relative; margin-bottom: 56px; } .NL-block-5 .block-5-list .item:last-child { margin-bottom: 0; } .NL-block-5 .block-5-list .item .item-images { position: absolute; left: 92px; bottom: 82px; display: flex; gap: 24px; z-index: 2; } .NL-block-5 .block-5-list .item .item-images a { position: relative; } .NL-block-5 .block-5-list .item .item-images img { width: 200px; } .NL-block-5 .block-5-list .item .item-images div { position: absolute; background-color: #000; border-radius: 8px; padding: 16px; color: #fff; left: 0; bottom: 100%; transform: translateY(10px); transition: all 0.25s; opacity: 0; visibility: hidden; width: 240px; } .NL-block-5 .block-5-list .item .item-images a:hover div, .NL-block-5 .block-5-list .item .item-images a.active div { transform: translateY(-10px); opacity: 1; visibility: visible; } @media (min-width: 1200px) and (max-width: 1399.98px) { .NL-block-5 .block-5-list .item .item-images { left: 83px; bottom: 72px; } .NL-block-5 .block-5-list .item .item-images img { width: 160px; } } @media (max-width: 767.98px) { .NL-block-5 .block-5-list .item { position: relative; margin-bottom: 32px; } .NL-block-5 .block-5-list .item:last-child { margin-bottom: 0; } .NL-block-5 .block-5-list .item .item-images { gap: 8px; left: 30px; bottom: 23px; } .NL-block-5 .block-5-list .item .item-images img { width: 80px; } .NL-block-5 .block-5-list .item .item-images div { width: 220px; } .NL-block-5 .block-5-list .item .item-images a:last-child div { left: auto; right: 0; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-block-5 .block-5-list .item .item-images { gap: 16px; left: 53px; bottom: 43px; } .NL-block-5 .block-5-list .item .item-images img { width: 120px; } .NL-block-5 .block-5-list .item .item-images a:last-child div { left: auto; right: 0; } } @media (min-width: 992px) and (max-width: 1199.98px) { .NL-block-5 .block-5-list .item .item-images { left: 68px; bottom: 60px; } .NL-block-5 .block-5-list .item .item-images img { width: 160px; } .NL-block-5 .block-5-list .item .item-images a:last-child div { left: auto; right: 0; } } /*-------------------------------------------------------------- ## NearLink 2026 06 --------------------------------------------------------------*/ .NL-03-main { --primary: #28e1ca; --color-primary: var(--primary); } .NL-03-block { padding: 64px 0; } .NL-03-block-title { font-size: 36px; font-weight: bold; margin-bottom: 40px; text-align: center; } @media (max-width: 767.98px) { .NL-03-block { padding: 32px 0; } .NL-03-block-title { margin-bottom: 16px; } .NL-03-block-title h2 { font-size: 18px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-03-block { padding: 32px 0; } .NL-03-block-title { font-size: 32px; margin-bottom: 36px; } } .NL-03-block-title span { position: relative; padding: 12px 24px; } .NL-03-block-title span:before, .NL-03-block-title span:after { content: ''; position: absolute; width: 12px; height: 12px; background-repeat: no-repeat; background-size: contain; background-position: center; } .NL-03-block-title span:before { bottom: 0; left: 0; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDEwLjAwMUgyVjBIMFYxMi4wMDFIMTJWMTAuMDAxWiIgZmlsbD0iIzAwQzA4QiIvPgo8L3N2Zz4K'); } .NL-03-block-title span:after { top: 0; right: 0; background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAgMFYySDEwVjEySDEyVjBIMFoiIGZpbGw9IiMwMEMwOEIiLz4KPC9zdmc+Cg=='); } /*-------------------------------------------------------------- ## NearLink 1 --------------------------------------------------------------*/ .NL-03-block-1 { position: relative; } .NL-03-block-1 .block-1-content { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); margin-top: -150px; } .NL-03-block-1 .block-1-title { width: 60%; } .NL-03-block-media { position: relative; width: 100%; margin-bottom: -100px; margin-top: -100px; } @media (max-width: 767.98px) { .NL-03-block-1 .block-1-content { margin-top: -38px; left: 10px; } .NL-03-block-1 .block-1-title { width: 60%; } .NL-03-block-media { margin-top: -50px; margin-bottom: -60px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-03-block-1 .block-1-content { margin-top: -38px; left: 10px; } .NL-03-block-1 .block-1-title { width: 60%; } } @media (min-width: 992px) and (max-width: 1199.98px) { .NL-03-block-1 .block-1-content { margin-top: -100px; } } /*-------------------------------------------------------------- ## NearLink 2 --------------------------------------------------------------*/ .NL-03-block-2 { position: relative; padding-top: 200px; } .NL-03-block-2 .block-2-video { position: absolute; left: 50%; bottom: 32px; max-width: 480px; padding: 0 32px; z-index: 2; transform: translate(-50%, 0); } .NL-03-block-2 .block-2-menu { position: absolute; left: 0; right: 0; top: 0px; transform: translateY(-50%); } .NL-03-block-2 .block-2-menu-box { position: relative; display: flex; justify-content: space-around; align-items: center; background-color: #fff; border-radius: 24px; box-shadow: 0 0px 16px rgb(0 0 0 / 0.06); } .NL-03-block-2 .block-2-menu .item { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 16px; width: 20%; height: 250px; font-size: 16px; text-align: center; } .NL-03-block-2 .block-2-menu .item img { width: 120px; height: 120px; object-fit: contain; } @media (max-width: 767.98px) { .NL-03-block-2 .block-2-video { bottom: 0; } .NL-03-block-2 .block-2-menu { position: absolute; left: 0; right: 0; top: 0px; transform: translateY(-30%); flex-wrap: wrap; flex-direction: row; gap: 16px; } .NL-03-block-2 .block-2-menu-box { display: flex; justify-content: space-around; align-items: center; flex-direction: row; flex-wrap: wrap; background-color: #fff; padding: 16px 0; gap: 12px; border-radius: 16px; } .NL-03-block-2 .block-2-menu .item { flex-shrink: 0; gap: 16px; width: 45%; height: auto; font-size: 14px; text-align: center; } .NL-03-block-2 .block-2-menu .item img { width: 40px; height: 40px; object-fit: contain; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-03-block-2 { padding-top: 140px; } .NL-03-block-2 .block-2-menu { position: absolute; left: 0; right: 0; top: 0px; transform: translateY(-30%); flex-wrap: wrap; flex-direction: row; gap: 16px; } .NL-03-block-2 .block-2-menu-box { display: flex; justify-content: space-around; align-items: center; flex-direction: row; flex-wrap: wrap; background-color: #fff; padding: 16px 0; gap: 12px; border-radius: 16px; } .NL-03-block-2 .block-2-menu .item { flex-shrink: 0; gap: 16px; width: 20%; height: auto; font-size: 16px; text-align: center; } .NL-03-block-2 .block-2-menu .item img { width: 40px; height: 40px; object-fit: contain; } } @media (min-width: 992px) and (max-width: 1199.98px) { .NL-03-block-2 .block-2-menu .item { height: auto; padding: 36px 0; } .NL-03-block-2 .block-2-menu .item img { width: 80px; height: 80px; object-fit: contain; } } @media (max-width: 767.98px) { .NL-03-block-2 .NL-03-block-content { font-size: 17px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-03-block-2 .NL-03-block-content { } .NL-03-block-2 .NL-03-block-body { } } .NL-03-block-title { position: relative; text-align: center; } .NL-03-block-title h2 { font-size: 32px; font-weight: bold; position: relative; padding-bottom: 32px; } .NL-03-block-title h2:after { content: ''; position: absolute; left: 50%; bottom: 0; width: 80px; height: 4px; background-color: #02dfa3; transform: translate(-50%, 0); } .NL-03-block-subtitle { margin-top: 32px; font-size: 24px; } .NL-03-block-content { font-size: 20px; line-height: 1.75; } .NL-03-block-body p { margin-bottom: 32px; } .NL-03-block-3 .NL-03-block-content { } .NL-03-block-3 .media { } .NL-03-block-3 .NL-03-block-body { } @media (max-width: 767.98px) { .NL-03-block-3 .NL-03-block-content { } .NL-03-block-3 .media { width: 100%; } .NL-03-block-3 .NL-03-block-body { font-size: 18px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-03-block-3 .NL-03-block-content { } .NL-03-block-3 .media { } .NL-03-block-3 .NL-03-block-body { } } .NL-news-list { position: relative; overflow: hidden; } .NL-news-list .NL-news-list-title { display: flex; justify-content: space-between; align-items: center; } .NL-news-list .NL-news-list-title-content { display: flex; align-items: center; gap: 8px; } .NL-news-list .NL-news-list-icon { width: 36px; height: 36px; background-position: center; background-size: contain; background-repeat: no-repeat; } .NL-news-list-1 .NL-news-list-icon { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwMjhfMzE4KSI+CjxwYXRoIGQ9Ik0xOCAyQzE4LjUzMDQgMiAxOS4wMzkxIDIuMjEwNzEgMTkuNDE0MiAyLjU4NTc5QzE5Ljc4OTMgMi45NjA4NiAyMCAzLjQ2OTU3IDIwIDRWMTYuOTlDMjAgMTcuMTU4IDE5Ljk2MiAxNy4zMTIgMTkuODg3IDE3LjQ2MkwxOS4zNDIgMTguNTUyQzE5LjI3MjUgMTguNjkwOSAxOS4yMzYzIDE4Ljg0NDEgMTkuMjM2MyAxOC45OTk1QzE5LjIzNjMgMTkuMTU0OSAxOS4yNzI1IDE5LjMwODEgMTkuMzQyIDE5LjQ0N0wxOS44ODUgMjAuNTM1QzE5Ljk2NSAyMC42ODc0IDIwLjAwNDQgMjAuODU3OCAxOS45OTkyIDIxLjAyOTlDMTkuOTk0MSAyMS4yMDE5IDE5Ljk0NDYgMjEuMzY5NyAxOS44NTU2IDIxLjUxNzFDMTkuNzY2NiAyMS42NjQ0IDE5LjY0MTEgMjEuNzg2MyAxOS40OTEyIDIxLjg3MDlDMTkuMzQxMyAyMS45NTU1IDE5LjE3MjEgMjEuOTk5OSAxOSAyMkg3QzYuMjA0MzUgMjIgNS40NDEyOSAyMS42ODM5IDQuODc4NjggMjEuMTIxM0M0LjMxNjA3IDIwLjU1ODcgNCAxOS43OTU2IDQgMTlWNUM0IDQuMjA0MzUgNC4zMTYwNyAzLjQ0MTI5IDQuODc4NjggMi44Nzg2OEM1LjQ0MTI5IDIuMzE2MDcgNi4yMDQzNSAyIDcgMkgxOFpNMTcuNDA4IDE4SDdDNi43NDUxMiAxOC4wMDAzIDYuNDk5OTcgMTguMDk3OSA2LjMxNDYzIDE4LjI3MjhDNi4xMjkzIDE4LjQ0NzggNi4wMTc3NyAxOC42ODcgNi4wMDI4MyAxOC45NDE0QzUuOTg3ODkgMTkuMTk1OCA2LjA3MDY3IDE5LjQ0NjQgNi4yMzQyNiAxOS42NDE4QzYuMzk3ODYgMTkuODM3MyA2LjYyOTkgMTkuOTYyOSA2Ljg4MyAxOS45OTNMNyAyMEgxNy40MDhDMTcuMjA1MyAxOS40MjY2IDE3LjE4MTYgMTguODA1MiAxNy4zNCAxOC4yMThMMTcuNDA4IDE4Wk0xOCA0SDdDNi43NTUwNyA0LjAwMDAzIDYuNTE4NjYgNC4wODk5NiA2LjMzNTYzIDQuMjUyNzJDNi4xNTI1OSA0LjQxNTQ3IDYuMDM1NjYgNC42Mzk3NSA2LjAwNyA0Ljg4M0w2IDVWMTYuMTdDNi4yNSAxNi4wODIgNi41MTYgMTYuMDI2IDYuNzkxIDE2LjAwN0w3IDE2SDE4VjRaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0xNCA3QzE0LjI1NDkgNy4wMDAyOCAxNC41IDcuMDk3ODggMTQuNjg1NCA3LjI3Mjg1QzE0Ljg3MDcgNy40NDc4MiAxNC45ODIyIDcuNjg2OTUgMTQuOTk3MiA3Ljk0MTM5QzE1LjAxMjEgOC4xOTU4NCAxNC45MjkzIDguNDQ2MzggMTQuNzY1NyA4LjY0MTgzQzE0LjYwMjIgOC44MzcyOSAxNC4zNzAxIDguOTYyOSAxNC4xMTcgOC45OTNMMTQgOUgxMEM5Ljc0NTEzIDguOTk5NzIgOS40OTk5NyA4LjkwMjEyIDkuMzE0NjQgOC43MjcxNUM5LjEyOTMgOC41NTIxOCA5LjAxNzc3IDguMzEzMDUgOS4wMDI4MyA4LjA1ODYxQzguOTg3OSA3LjgwNDE2IDkuMDcwNjggNy41NTM2MiA5LjIzNDI3IDcuMzU4MTdDOS4zOTc4NiA3LjE2MjcxIDkuNjI5OTEgNy4wMzcxIDkuODgzMDEgNy4wMDdMMTAgN0gxNFoiIGZpbGw9IiMwMEMwOEIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMDI4XzMxOCI+CjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K'); } .NL-news-list-2 .NL-news-list-icon { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwMjhfNDAyKSI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNiA0QzYgMy43MzQ3OCA2LjEwNTM2IDMuNDgwNDMgNi4yOTI4OSAzLjI5Mjg5QzYuNDgwNDMgMy4xMDUzNiA2LjczNDc4IDMgNyAzSDIwQzIwLjI2NTIgMyAyMC41MTk2IDMuMTA1MzYgMjAuNzA3MSAzLjI5Mjg5QzIwLjg5NDYgMy40ODA0MyAyMSAzLjczNDc4IDIxIDRWMThDMjEgMTguNzk1NiAyMC42ODM5IDE5LjU1ODcgMjAuMTIxMyAyMC4xMjEzQzE5LjU1ODcgMjAuNjgzOSAxOC43OTU2IDIxIDE4IDIxSDUuNUM0LjgzNjk2IDIxIDQuMjAxMDcgMjAuNzM2NiAzLjczMjIzIDIwLjI2NzhDMy4yNjMzOSAxOS43OTg5IDMgMTkuMTYzIDMgMTguNVYxMUMzIDEwLjczNDggMy4xMDUzNiAxMC40ODA0IDMuMjkyODkgMTAuMjkyOUMzLjQ4MDQzIDEwLjEwNTQgMy43MzQ3OCAxMCA0IDEwSDZWNFpNNiAxMkg1VjE4LjVDNSAxOC42MzI2IDUuMDUyNjggMTguNzU5OCA1LjE0NjQ1IDE4Ljg1MzZDNS4yNDAyMSAxOC45NDczIDUuMzY3MzkgMTkgNS41IDE5QzUuNjMyNjEgMTkgNS43NTk3OSAxOC45NDczIDUuODUzNTUgMTguODUzNkM1Ljk0NzMyIDE4Ljc1OTggNiAxOC42MzI2IDYgMTguNVYxMlpNNy45NSAxOUgxOEMxOC4yNjUyIDE5IDE4LjUxOTYgMTguODk0NiAxOC43MDcxIDE4LjcwNzFDMTguODk0NiAxOC41MTk2IDE5IDE4LjI2NTIgMTkgMThWNUg4VjE4LjVDOCAxOC42NzEgNy45ODMgMTguODM4IDcuOTUgMTlaTTEwIDE1QzEwIDE0LjczNDggMTAuMTA1NCAxNC40ODA0IDEwLjI5MjkgMTQuMjkyOUMxMC40ODA0IDE0LjEwNTQgMTAuNzM0OCAxNCAxMSAxNEgxNUMxNS4yNjUyIDE0IDE1LjUxOTYgMTQuMTA1NCAxNS43MDcxIDE0LjI5MjlDMTUuODk0NiAxNC40ODA0IDE2IDE0LjczNDggMTYgMTVDMTYgMTUuMjY1MiAxNS44OTQ2IDE1LjUxOTYgMTUuNzA3MSAxNS43MDcxQzE1LjUxOTYgMTUuODk0NiAxNS4yNjUyIDE2IDE1IDE2SDExQzEwLjczNDggMTYgMTAuNDgwNCAxNS44OTQ2IDEwLjI5MjkgMTUuNzA3MUMxMC4xMDU0IDE1LjUxOTYgMTAgMTUuMjY1MiAxMCAxNVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMCA4QzEwIDcuNzM0NzggMTAuMTA1NCA3LjQ4MDQzIDEwLjI5MjkgNy4yOTI4OUMxMC40ODA0IDcuMTA1MzYgMTAuNzM0OCA3IDExIDdIMTZDMTYuMjY1MiA3IDE2LjUxOTYgNy4xMDUzNiAxNi43MDcxIDcuMjkyODlDMTYuODk0NiA3LjQ4MDQzIDE3IDcuNzM0NzggMTcgOFYxMUMxNyAxMS4yNjUyIDE2Ljg5NDYgMTEuNTE5NiAxNi43MDcxIDExLjcwNzFDMTYuNTE5NiAxMS44OTQ2IDE2LjI2NTIgMTIgMTYgMTJIMTFDMTAuNzM0OCAxMiAxMC40ODA0IDExLjg5NDYgMTAuMjkyOSAxMS43MDcxQzEwLjEwNTQgMTEuNTE5NiAxMCAxMS4yNjUyIDEwIDExVjhaTTEyIDlWMTBIMTVWOUgxMloiIGZpbGw9IiMwMEMwOEIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMDI4XzQwMiI+CjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K'); } .NL-news-list-3 .NL-news-list-icon { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwMjhfNDI2KSI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMjAgM0MyMC41MDQ2IDIuOTk5ODQgMjAuOTkwNiAzLjE5MDQxIDIxLjM2MDUgMy41MzM1QzIxLjczMDUgMy44NzY1OSAyMS45NTcyIDQuMzQ2ODQgMjEuOTk1IDQuODVMMjIgNVYxOUMyMi4wMDAyIDE5LjUwNDYgMjEuODA5NiAxOS45OTA2IDIxLjQ2NjUgMjAuMzYwNUMyMS4xMjM0IDIwLjczMDUgMjAuNjUzMiAyMC45NTcyIDIwLjE1IDIwLjk5NUwyMCAyMUg0QzMuNDk1NDIgMjEuMDAwMiAzLjAwOTQzIDIwLjgwOTYgMi42Mzk0NSAyMC40NjY1QzIuMjY5NDcgMjAuMTIzNCAyLjA0Mjg0IDE5LjY1MzIgMi4wMDUgMTkuMTVMMiAxOVY1QzEuOTk5ODQgNC40OTU0MiAyLjE5MDQxIDQuMDA5NDMgMi41MzM1IDMuNjM5NDVDMi44NzY1OSAzLjI2OTQ3IDMuMzQ2ODQgMy4wNDI4NCAzLjg1IDMuMDA1TDQgM0gyMFpNMjAgNUg0VjE5SDIwVjVaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuMzQgNy42Mzc5NkwxMC44NTggNy44Njc5NkwxMS4xOTYgOC4wMjc5NkwxMS41ODMgOC4yMTc5NkwxMi4wMTMgOC40MzU5NkwxMi40ODMgOC42ODU5NkwxMi45OSA4Ljk2NTk2TDEzLjI1NiA5LjExNzk2TDEzLjc3NCA5LjQyMjk2TDE0LjI0OCA5LjcxNDk2TDE0LjY3OCA5Ljk4Nzk2TDE1LjA1OCAxMC4yNDFMMTUuNTM4IDEwLjU3MUwxNS45MDIgMTAuODM0TDE1Ljk5NyAxMC45MDRDMTYuMTUxMyAxMS4wMTg4IDE2LjI3NjYgMTEuMTY4MSAxNi4zNjMgMTEuMzRDMTYuNDQ5NCAxMS41MTE5IDE2LjQ5NDMgMTEuNzAxNiAxNi40OTQzIDExLjg5NEMxNi40OTQzIDEyLjA4NjMgMTYuNDQ5NCAxMi4yNzYgMTYuMzYzIDEyLjQ0NzlDMTYuMjc2NiAxMi42MTk4IDE2LjE1MTMgMTIuNzY5MSAxNS45OTcgMTIuODg0TDE1LjY3NCAxMy4xMTlMMTUuMjM0IDEzLjQyN0wxNC44NzggMTMuNjY2TDE0LjQ3MyAxMy45MjlMMTQuMDIgMTQuMjEyTDEzLjUyMSAxNC41MTJMMTIuOTg3IDE0LjgyMUwxMi40NzggMTUuMTAzTDEyLjAwNyAxNS4zNTNMMTEuNTc3IDE1LjU3M0wxMS4xOTEgMTUuNzYxTDEwLjU2OSAxNi4wNDlMMTAuMzM5IDE2LjE0OUMxMC4xNjI0IDE2LjIyNSA5Ljk3MDQ4IDE2LjI1ODggOS43Nzg1NCAxNi4yNDc2QzkuNTg2NTkgMTYuMjM2NCA5LjM5OTkzIDE2LjE4MDQgOS4yMzM0MyAxNi4wODQzQzkuMDY2OTQgMTUuOTg4MSA4LjkyNTIyIDE1Ljg1NDQgOC44MTk1OCAxNS42OTM3QzguNzEzOTQgMTUuNTMzIDguNjQ3MyAxNS4zNDk5IDguNjI0OTcgMTUuMTU5TDguNTY2OTcgMTQuNTk0TDguNTM0OTcgMTQuMjJMOC40OTI5NyAxMy41NTZMOC40Njk5NyAxMy4wNDhMOC40NTQ5NyAxMi40OTNDOC40NTMxOSAxMi4zOTUgOC40NTE4NiAxMi4yOTcgOC40NTA5NyAxMi4xOTlMOC40NDg5NyAxMS44OTRDOC40NDg5NyAxMS42ODcgOC40NTA5NyAxMS40ODcgOC40NTQ5NyAxMS4yOTRMOC40Njk5NyAxMC43MzlMOC40OTI5NyAxMC4yMzJMOC41MTk5NyA5Ljc3NDk2TDguNTQ5OTcgOS4zNzM5Nkw4LjYyNDk3IDguNjI5OTZDOC42NDcxNyA4LjQzODc4IDguNzEzNzMgOC4yNTU0MyA4LjgxOTM3IDguMDk0NTRDOC45MjUgNy45MzM2NSA5LjA2Njc3IDcuNzk5NjggOS4yMzMzOCA3LjcwMzMxQzkuMzk5OTggNy42MDY5NCA5LjU4NjggNy41NTA4NSA5Ljc3ODkzIDcuNTM5NUM5Ljk3MTA2IDcuNTI4MTYgMTAuMTYzMiA3LjU2MTg3IDEwLjM0IDcuNjM3OTZaTTEwLjk1MSAxMC4xMzlMMTAuNTE1IDkuOTIwOTZMMTAuNDg2IDEwLjQwOEwxMC40NjQgMTAuOTU5TDEwLjQ1MSAxMS41NjlMMTAuNDQ5IDExLjg5NEwxMC40NTEgMTIuMjE5TDEwLjQ2NCAxMi44MjhMMTAuNDc0IDEzLjExMUwxMC41IDEzLjYzMUwxMC41MTUgMTMuODY2TDEwLjk0OSAxMy42NDhMMTEuNDM2IDEzLjM5MkwxMS45NzEgMTMuMDk4TDEyLjI1NSAxMi45MzZMMTIuODA2IDEyLjYxTDEzLjMgMTIuMzA0TDEzLjczNiAxMi4wMjRMMTMuOTMyIDExLjg5NEwxMy41MjUgMTEuNjI0TDEzLjA1OSAxMS4zM0MxMi43OTM4IDExLjE2NTggMTIuNTI2MSAxMS4wMDU4IDEyLjI1NiAxMC44NUwxMS45NzMgMTAuNjg5TDExLjQzOSAxMC4zOTVMMTAuOTUxIDEwLjEzOVoiIGZpbGw9IiMwMEMwOEIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMDI4XzQyNiI+CjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K'); } .NL-news-list-title { font-size: 24px; font-weight: bold; } @media (max-width: 767.98px) { .NL-03-block-title h2 { font-size: 24px; padding-bottom: 16px; } .NL-03-block-title h2:after { width: 64px; } .NL-03-block-subtitle { font-size: 16px; margin-top: 16px; } .NL-news-list .NL-news-list-icon { width: 24px; height: 24px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-news-list-title { font-size: 20px; } .NL-news-list .NL-news-list-icon { width: 24px; height: 24px; } } .NL-news-list-banner { display: flex; flex-direction: column; gap: 12px; overflow: hidden; overflow-y: auto; height: 400px; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } .NL-news-list-banner::-webkit-scrollbar { width: 6px; height: 6px; background-color: transparent } .NL-news-list-banner::-webkit-scrollbar-thumb { border-radius: 10px; background-color: var(--color-dark) } .NL-news-list-banner::-webkit-scrollbar-track { border-radius: 10px; background-color: var(--bg-light) } .NL-news-list-banner .item { position: relative; display: flex; flex-direction: row; align-items: center; min-width: 0; overflow-wrap: break-word; gap: 16px; } .NL-news-list-banner .item .media { width: 120px; flex-shrink: 0; } @media (min-width: 768px) and (max-width: 991.98px) { .NL-news-list-banner .item { gap: 8px; } .NL-news-list-banner .item .media { width: 90px; flex-shrink: 0; } } .NL-news-list-banner .item .item-body { flex: 1 1 auto; } .NL-products-list .item { } .NL-products-list .item .item-icon { width: 60px; height: 60px; background-repeat: no-repeat; background-position: center; background-size: contain; } .NL-products-list .item .item-icon.item-icon-1 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQyIDIuOTE2NzVDNDYuNzQyOSAyLjkxNjc1IDUwLjg1MyA1LjYxMjczIDUyLjg4NzQgOS41NDc2MUM1My4wMTU4IDkuNzk2MDIgNTMuMDgzMyAxMC4wNzIzIDUzLjA4MzMgMTAuMzUyVjE5Ljk4MTVDNTMuMDgzMyAyMC4yNjEyIDUzLjAxNTggMjAuNTM3NSA1Mi44ODc0IDIwLjc4NTlDNTAuODUzIDI0LjcyMDggNDYuNzQyOCAyNy40MTY3IDQyIDI3LjQxNjdDNDEuNDA2MSAyNy40MTY3IDQwLjgyMjMgMjcuMzY4OSA0MC4yNSAyNy4yODY5VjUxLjMzMzRDNDAuMjUgNTIuMjk5OSAzOS40NjY1IDUzLjA4MzQgMzguNSA1My4wODM0SDMxLjVDMzAuNTMzNSA1My4wODM0IDI5Ljc1IDUyLjI5OTkgMjkuNzUgNTEuMzMzNFYxNS4xNjY3QzI5Ljc1IDguNDAxMjcgMzUuMjM0NSAyLjkxNjc1IDQyIDIuOTE2NzVaTTMzLjI1IDQ5LjU4MzRIMzYuNzVWMjUuMDY5N0MzNi43NSAyNC41MDE3IDM3LjAyNjggMjMuOTY5IDM3LjQ5MDYgMjMuNjQxQzM3Ljk1NDMgMjMuMzEzMyAzOC41NDc5IDIzLjIzMDggMzkuMDgzMyAyMy40MkMzOS45OTMzIDIzLjc0MTUgNDAuOTc0NCAyMy45MTY3IDQyIDIzLjkxNjdDNDUuMjQxNyAyMy45MTY3IDQ4LjA3MDIgMjIuMTUxOSA0OS41ODMzIDE5LjUyNThWMTAuODA1NEM0OC4wNyA4LjE4MDI5IDQ1LjI0MSA2LjQxNjc1IDQyIDYuNDE2NzVDMzcuMTY3NSA2LjQxNjc1IDMzLjI1IDEwLjMzNDMgMzMuMjUgMTUuMTY2N1Y0OS41ODM0WiIgZmlsbD0iIzFEMjEyOSIvPgo8cGF0aCBkPSJNMjIuNzUgMTUuMTY2N0MyMi43NSAxMC4zMzQzIDE4LjgzMjUgNi40MTY3NSAxNCA2LjQxNjc1QzEwLjc1OSA2LjQxNjc1IDcuOTMwMDcgOC4xODAyNyA2LjQxNjY3IDEwLjgwNTRWMTkuNTI1OEM3LjkyOTgyIDIyLjE1MTkgMTAuNzU4MyAyMy45MTY3IDE0IDIzLjkxNjdDMTUuMDI1NiAyMy45MTY3IDE2LjAwNjcgMjMuNzQxNSAxNi45MTY3IDIzLjQyQzE3LjQ1MjEgMjMuMjMwOCAxOC4wNDU3IDIzLjMxMzMgMTguNTA5NCAyMy42NDFDMTguOTczMyAyMy45NjkgMTkuMjUgMjQuNTAxNyAxOS4yNSAyNS4wNjk3VjQ5LjU4MzRIMjIuNzVWMTUuMTY2N1pNMjYuMjUgNTEuMzMzNEMyNi4yNSA1Mi4yOTk5IDI1LjQ2NjUgNTMuMDgzNCAyNC41IDUzLjA4MzRIMTcuNUMxNi41MzM1IDUzLjA4MzQgMTUuNzUgNTIuMjk5OSAxNS43NSA1MS4zMzM0VjI3LjI4NjlDMTUuMTc3NyAyNy4zNjg5IDE0LjU5MzkgMjcuNDE2NyAxNCAyNy40MTY3QzkuMjU3MSAyNy40MTY3IDUuMTQ3MDIgMjQuNzIwOCAzLjExMjY0IDIwLjc4NTlDMi45ODQyMiAyMC41Mzc1IDIuOTE2NjcgMjAuMjYxMiAyLjkxNjY3IDE5Ljk4MTVWMTAuMzUyTDIuOTI4MDYgMTAuMTQyM0MyLjk1Mjk4IDkuOTM1NDIgMy4wMTY0MiA5LjczMzc0IDMuMTEyNjQgOS41NDc2MUM1LjE0NzAxIDUuNjEyNzQgOS4yNTcwOSAyLjkxNjc1IDE0IDIuOTE2NzVDMjAuNzY1NSAyLjkxNjc1IDI2LjI1IDguNDAxMjcgMjYuMjUgMTUuMTY2N1Y1MS4zMzM0WiIgZmlsbD0iIzFEMjEyOSIvPgo8cGF0aCBkPSJNMTcuNSAxMy40MTY3QzE4LjQ2NjUgMTMuNDE2NyAxOS4yNSAxNC4yMDAyIDE5LjI1IDE1LjE2NjdDMTkuMjUgMTYuMTMzMiAxOC40NjY1IDE2LjkxNjcgMTcuNSAxNi45MTY3SDE2LjMzMzNDMTUuMzY2OCAxNi45MTY3IDE0LjU4MzMgMTYuMTMzMiAxNC41ODMzIDE1LjE2NjdDMTQuNTgzMyAxNC4yMDAyIDE1LjM2NjggMTMuNDE2NyAxNi4zMzMzIDEzLjQxNjdIMTcuNVoiIGZpbGw9IiMwMEMwOEIiLz4KPHBhdGggZD0iTTM5LjY2NjcgMTMuNDE2N0M0MC42MzMyIDEzLjQxNjcgNDEuNDE2NyAxNC4yMDAyIDQxLjQxNjcgMTUuMTY2N0M0MS40MTY3IDE2LjEzMzIgNDAuNjMzMiAxNi45MTY3IDM5LjY2NjcgMTYuOTE2N0gzOC41QzM3LjUzMzUgMTYuOTE2NyAzNi43NSAxNi4xMzMyIDM2Ljc1IDE1LjE2NjdDMzYuNzUgMTQuMjAwMiAzNy41MzM1IDEzLjQxNjcgMzguNSAxMy40MTY3SDM5LjY2NjdaIiBmaWxsPSIjMDBDMDhCIi8+Cjwvc3ZnPgo='); } .NL-products-list .item .item-icon.item-icon-2 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQ0LjkxNjYgNC42NjY1OUM0NC45MTY2IDQuMzQ0NCA0NC42NTU1IDQuMDgzMjUgNDQuMzMzMyA0LjA4MzI1SDExLjY2NjZDMTEuMzQ0NSA0LjA4MzI1IDExLjA4MzMgNC4zNDQ0MiAxMS4wODMzIDQuNjY2NTlWNTEuMzMzM0MxMS4wODMzIDUxLjY1NTQgMTEuMzQ0NSA1MS45MTY2IDExLjY2NjYgNTEuOTE2Nkg0NC4zMzMzQzQ0LjY1NTUgNTEuOTE2NiA0NC45MTY2IDUxLjY1NTUgNDQuOTE2NiA1MS4zMzMzVjQuNjY2NTlaTTQ4LjQxNjYgNTEuMzMzM0M0OC40MTY2IDUzLjU4ODQgNDYuNTg4NSA1NS40MTY2IDQ0LjMzMzMgNTUuNDE2NkgxMS42NjY2QzkuNDExNSA1NS40MTY2IDcuNTgzMzEgNTMuNTg4NSA3LjU4MzMxIDUxLjMzMzNWNC42NjY1OUM3LjU4MzMxIDIuNDExNDIgOS40MTE0OCAwLjU4MzI1MiAxMS42NjY2IDAuNTgzMjUySDQ0LjMzMzNDNDYuNTg4NSAwLjU4MzI1MiA0OC40MTY2IDIuNDExNDQgNDguNDE2NiA0LjY2NjU5VjUxLjMzMzNaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0zMy4yNSAzNy4zMzMzQzMzLjI1IDM0LjQzMzggMzAuODk5NSAzMi4wODMzIDI4IDMyLjA4MzNDMjUuMTAwNSAzMi4wODMzIDIyLjc1IDM0LjQzMzggMjIuNzUgMzcuMzMzM0MyMi43NSA0MC4yMzI3IDI1LjEwMDUgNDIuNTgzMyAyOCA0Mi41ODMzQzMwLjg5OTUgNDIuNTgzMyAzMy4yNSA0MC4yMzI3IDMzLjI1IDM3LjMzMzNaTTM2Ljc1IDM3LjMzMzNDMzYuNzUgNDIuMTY1NyAzMi44MzI1IDQ2LjA4MzMgMjggNDYuMDgzM0MyMy4xNjc1IDQ2LjA4MzMgMTkuMjUgNDIuMTY1NyAxOS4yNSAzNy4zMzMzQzE5LjI1IDMyLjUwMDggMjMuMTY3NSAyOC41ODMzIDI4IDI4LjU4MzNDMzIuODMyNSAyOC41ODMzIDM2Ljc1IDMyLjUwMDggMzYuNzUgMzcuMzMzM1oiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTMwLjkxNjYgMTYuMzMzNEMzMC45MTY2IDE0LjcyMjYgMjkuNjEwOCAxMy40MTY3IDI4IDEzLjQxNjdDMjYuMzg5MiAxMy40MTY3IDI1LjA4MzMgMTQuNzIyNiAyNS4wODMzIDE2LjMzMzRDMjUuMDgzMyAxNy45NDQyIDI2LjM4OTIgMTkuMjUwMSAyOCAxOS4yNTAxQzI5LjYxMDggMTkuMjUwMSAzMC45MTY2IDE3Ljk0NDIgMzAuOTE2NiAxNi4zMzM0Wk0zNC40MTY2IDE2LjMzMzRDMzQuNDE2NiAxOS44NzcyIDMxLjU0MzggMjIuNzUwMSAyOCAyMi43NTAxQzI0LjQ1NjIgMjIuNzUwMSAyMS41ODMzIDE5Ljg3NzIgMjEuNTgzMyAxNi4zMzM0QzIxLjU4MzMgMTIuNzg5NiAyNC40NTYyIDkuOTE2NzUgMjggOS45MTY3NUMzMS41NDM4IDkuOTE2NzUgMzQuNDE2NiAxMi43ODk2IDM0LjQxNjYgMTYuMzMzNFoiIGZpbGw9IiMwMEMwOEIiLz4KPC9zdmc+Cg=='); } .NL-products-list .item .item-icon.item-icon-3 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI2LjI1IDEyLjgzMzNWNS44MzMyNUMyNi4yNSA0Ljg2Njc1IDI3LjAzMzUgNC4wODMyNSAyOCA0LjA4MzI1QzI4Ljk2NjUgNC4wODMyNSAyOS43NSA0Ljg2Njc1IDI5Ljc1IDUuODMzMjVWMTIuODMzM0MyOS43NSAxMy43OTk3IDI4Ljk2NjUgMTQuNTgzMyAyOCAxNC41ODMzQzI3LjAzMzUgMTQuNTgzMyAyNi4yNSAxMy43OTk3IDI2LjI1IDEyLjgzMzNaIiBmaWxsPSIjMDBDMDhCIi8+CjxwYXRoIGQ9Ik0zNS41ODMzIDE0LjAwMDFDMzUuNTgzMyA5LjgxMTkyIDMyLjE4ODIgNi40MTY3NSAyOCA2LjQxNjc1QzIzLjgxMTggNi40MTY3NSAyMC40MTY3IDkuODExOTIgMjAuNDE2NyAxNC4wMDAxVjI4LjAwMDFDMjAuNDE2NyAzMi4xODgyIDIzLjgxMTggMzUuNTgzNCAyOCAzNS41ODM0QzMyLjE4ODIgMzUuNTgzNCAzNS41ODMzIDMyLjE4ODIgMzUuNTgzMyAyOC4wMDAxVjE0LjAwMDFaTTM5LjA4MzMgMjguMDAwMUMzOS4wODMzIDM0LjEyMTIgMzQuMTIxMiAzOS4wODM0IDI4IDM5LjA4MzRDMjEuODc4OCAzOS4wODM0IDE2LjkxNjcgMzQuMTIxMiAxNi45MTY3IDI4LjAwMDFWMTQuMDAwMUMxNi45MTY3IDcuODc4OTMgMjEuODc4OCAyLjkxNjc1IDI4IDIuOTE2NzVDMzQuMTIxMiAyLjkxNjc1IDM5LjA4MzMgNy44Nzg5MyAzOS4wODMzIDE0LjAwMDFWMjguMDAwMVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTkuOTE2NjcgMjhWMjQuNUM5LjkxNjY3IDIzLjUzMzUgMTAuNzAwMiAyMi43NSAxMS42NjY3IDIyLjc1QzEyLjYzMzIgMjIuNzUgMTMuNDE2NyAyMy41MzM1IDEzLjQxNjcgMjQuNVYyOEMxMy40MTY3IDM2LjA1NDIgMTkuOTQ1OCA0Mi41ODMzIDI4IDQyLjU4MzNDMzYuMDU0MiA0Mi41ODMzIDQyLjU4MzMgMzYuMDU0MiA0Mi41ODMzIDI4VjI0LjVDNDIuNTgzMyAyMy41MzM1IDQzLjM2NjggMjIuNzUgNDQuMzMzMyAyMi43NUM0NS4yOTk4IDIyLjc1IDQ2LjA4MzMgMjMuNTMzNSA0Ni4wODMzIDI0LjVWMjhDNDYuMDgzMyAzNy45ODcyIDM3Ljk4NzIgNDYuMDgzMyAyOCA0Ni4wODMzQzE4LjAxMjggNDYuMDgzMyA5LjkxNjY3IDM3Ljk4NzIgOS45MTY2NyAyOFoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTI0LjUgMTYuOTE2N0MyNS40NjY1IDE2LjkxNjcgMjYuMjUgMTcuNzAwMiAyNi4yNSAxOC42NjY3QzI2LjI1IDE5LjYzMzIgMjUuNDY2NSAyMC40MTY3IDI0LjUgMjAuNDE2N0gxOC42NjY3QzE3LjcwMDIgMjAuNDE2NyAxNi45MTY3IDE5LjYzMzIgMTYuOTE2NyAxOC42NjY3QzE2LjkxNjcgMTcuNzAwMiAxNy43MDAyIDE2LjkxNjcgMTguNjY2NyAxNi45MTY3SDI0LjVaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0zNy4zMzMzIDE2LjkxNjdDMzguMjk5OCAxNi45MTY3IDM5LjA4MzMgMTcuNzAwMiAzOS4wODMzIDE4LjY2NjdDMzkuMDgzMyAxOS42MzMyIDM4LjI5OTggMjAuNDE2NyAzNy4zMzMzIDIwLjQxNjdIMzEuNUMzMC41MzM1IDIwLjQxNjcgMjkuNzUgMTkuNjMzMiAyOS43NSAxOC42NjY3QzI5Ljc1IDE3LjcwMDIgMzAuNTMzNSAxNi45MTY3IDMxLjUgMTYuOTE2N0gzNy4zMzMzWiIgZmlsbD0iIzFEMjEyOSIvPgo8cGF0aCBkPSJNMjQuNSAyMy45MTY3QzI1LjQ2NjUgMjMuOTE2NyAyNi4yNSAyNC43MDAyIDI2LjI1IDI1LjY2NjdDMjYuMjUgMjYuNjMzMiAyNS40NjY1IDI3LjQxNjcgMjQuNSAyNy40MTY3SDE4LjY2NjdDMTcuNzAwMiAyNy40MTY3IDE2LjkxNjcgMjYuNjMzMiAxNi45MTY3IDI1LjY2NjdDMTYuOTE2NyAyNC43MDAyIDE3LjcwMDIgMjMuOTE2NyAxOC42NjY3IDIzLjkxNjdIMjQuNVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTM3LjMzMzMgMjMuOTE2N0MzOC4yOTk4IDIzLjkxNjcgMzkuMDgzMyAyNC43MDAyIDM5LjA4MzMgMjUuNjY2N0MzOS4wODMzIDI2LjYzMzIgMzguMjk5OCAyNy40MTY3IDM3LjMzMzMgMjcuNDE2N0gzMS41QzMwLjUzMzUgMjcuNDE2NyAyOS43NSAyNi42MzMyIDI5Ljc1IDI1LjY2NjdDMjkuNzUgMjQuNzAwMiAzMC41MzM1IDIzLjkxNjcgMzEuNSAyMy45MTY3SDM3LjMzMzNaIiBmaWxsPSIjMUQyMTI5Ii8+CjxwYXRoIGQ9Ik0yOS43NSA0NC4zMzMzVjUxLjMzMzNIMjYuMjVWNDQuMzMzM0gyOS43NVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTM3LjMzMzMgNDkuNTgzM0MzOC4yOTk4IDQ5LjU4MzMgMzkuMDgzMyA1MC4zNjY4IDM5LjA4MzMgNTEuMzMzM0MzOS4wODMzIDUyLjI5OTggMzguMjk5OCA1My4wODMzIDM3LjMzMzMgNTMuMDgzM0gxOC42NjY3QzE3LjcwMDIgNTMuMDgzMyAxNi45MTY3IDUyLjI5OTggMTYuOTE2NyA1MS4zMzMzQzE2LjkxNjcgNTAuMzY2OCAxNy43MDAyIDQ5LjU4MzMgMTguNjY2NyA0OS41ODMzSDM3LjMzMzNaIiBmaWxsPSIjMUQyMTI5Ii8+Cjwvc3ZnPgo='); } .NL-products-list .item .item-icon.item-icon-4 { background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTQ5LjU4MzQgMjguMDAwMUM0OS41ODM0IDE2LjA3OTkgMzkuOTIwMiA2LjQxNjc1IDI4IDYuNDE2NzVDMTYuMDc5OSA2LjQxNjc1IDYuNDE2NjkgMTYuMDc5OSA2LjQxNjY5IDI4LjAwMDFDNi40MTY2OSAzOS45MjAyIDE2LjA3OTkgNDkuNTgzNCAyOCA0OS41ODM0QzM5LjkyMDIgNDkuNTgzNCA0OS41ODM0IDM5LjkyMDIgNDkuNTgzNCAyOC4wMDAxWk01My4wODM0IDI4LjAwMDFDNTMuMDgzNCA0MS44NTMyIDQxLjg1MzIgNTMuMDgzNCAyOCA1My4wODM0QzE0LjE0NjkgNTMuMDgzNCAyLjkxNjY5IDQxLjg1MzIgMi45MTY2OSAyOC4wMDAxQzIuOTE2NjkgMTQuMTQ2OSAxNC4xNDY5IDIuOTE2NzUgMjggMi45MTY3NUM0MS44NTMyIDIuOTE2NzUgNTMuMDgzNCAxNC4xNDY5IDUzLjA4MzQgMjguMDAwMVoiIGZpbGw9IiMxRDIxMjkiLz4KPHBhdGggZD0iTTMzLjI1IDM1VjIxQzMzLjI1IDIwLjAzMzUgMzQuMDMzNSAxOS4yNSAzNSAxOS4yNUMzNS45NjY1IDE5LjI1IDM2Ljc1IDIwLjAzMzUgMzYuNzUgMjFWMzVDMzYuNzUgMzUuOTY2NSAzNS45NjY1IDM2Ljc1IDM1IDM2Ljc1QzM0LjAzMzUgMzYuNzUgMzMuMjUgMzUuOTY2NSAzMy4yNSAzNVoiIGZpbGw9IiMwMEMwOEIiLz4KPHBhdGggZD0iTTQwLjI1IDMwLjMzMzRWMjUuNjY2N0M0MC4yNSAyNC43MDAyIDQxLjAzMzUgMjMuOTE2NyA0MiAyMy45MTY3QzQyLjk2NjUgMjMuOTE2NyA0My43NSAyNC43MDAyIDQzLjc1IDI1LjY2NjdWMzAuMzMzNEM0My43NSAzMS4yOTk5IDQyLjk2NjUgMzIuMDgzNCA0MiAzMi4wODM0QzQxLjAzMzUgMzIuMDgzNCA0MC4yNSAzMS4yOTk5IDQwLjI1IDMwLjMzMzRaIiBmaWxsPSIjMDBDMDhCIi8+CjxwYXRoIGQ9Ik0xOS4yNSAzNVYyMUMxOS4yNSAyMC4wMzM1IDIwLjAzMzUgMTkuMjUgMjEgMTkuMjVDMjEuOTY2NSAxOS4yNSAyMi43NSAyMC4wMzM1IDIyLjc1IDIxVjM1QzIyLjc1IDM1Ljk2NjUgMjEuOTY2NSAzNi43NSAyMSAzNi43NUMyMC4wMzM1IDM2Ljc1IDE5LjI1IDM1Ljk2NjUgMTkuMjUgMzVaIiBmaWxsPSIjMDBDMDhCIi8+CjxwYXRoIGQ9Ik0xMi4yNSAzMC4zMzM0VjI1LjY2NjdDMTIuMjUgMjQuNzAwMiAxMy4wMzM1IDIzLjkxNjcgMTQgMjMuOTE2N0MxNC45NjY1IDIzLjkxNjcgMTUuNzUgMjQuNzAwMiAxNS43NSAyNS42NjY3VjMwLjMzMzRDMTUuNzUgMzEuMjk5OSAxNC45NjY1IDMyLjA4MzQgMTQgMzIuMDgzNEMxMy4wMzM1IDMyLjA4MzQgMTIuMjUgMzEuMjk5OSAxMi4yNSAzMC4zMzM0WiIgZmlsbD0iIzAwQzA4QiIvPgo8cGF0aCBkPSJNMjYuMjUgMzkuNjY2NlYxNi4zMzMzQzI2LjI1IDE1LjM2NjggMjcuMDMzNSAxNC41ODMzIDI4IDE0LjU4MzNDMjguOTY2NSAxNC41ODMzIDI5Ljc1IDE1LjM2NjggMjkuNzUgMTYuMzMzM1YzOS42NjY2QzI5Ljc1IDQwLjYzMzEgMjguOTY2NSA0MS40MTY2IDI4IDQxLjQxNjZDMjcuMDMzNSA0MS40MTY2IDI2LjI1IDQwLjYzMzEgMjYuMjUgMzkuNjY2NloiIGZpbGw9IiMwMEMwOEIiLz4KPC9zdmc+Cg=='); } .NL-products-list .item .item-title { font-size: 24px; font-weight: bold; } @media (max-width: 767.98px) { .NL-products-list .item .item-title { font-size: 20px; } } /*-------------------------------------------------------------- ## NearLink 4 --------------------------------------------------------------*/ .NL-03-block-4 .block-4-list { } .NL-03-block-4 .block-4-list .item { position: relative; display: flex; min-width: 0; word-wrap: break-word; flex-direction: row; justify-content: space-between; gap: 32px; padding: 48px 56px; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 24px; margin-bottom: 32px; box-shadow: 0 8px 16px rgb(0 0 0 / 0.06); } .NL-03-block-4 .block-4-list .item:last-child { margin-bottom: 0; } .NL-03-block-4 .block-4-list .item .item-content { display: flex; flex-direction: column; flex: 1 1 auto; justify-content: center; min-width: 0; max-width: 640px; } .NL-03-block-4 .block-4-list .item .item-title { font-size: 24px; font-weight: bold; } .NL-03-block-4 .block-4-list .item .item-subtitle { font-size: 18px; font-weight: bold; } .NL-03-block-4 .block-4-list .item .item-desc { } .NL-03-block-4 .block-4-list .item .item-images { display: flex; gap: 24px; } .NL-03-block-4 .block-4-list .item .item-images a { position: relative; display: flex; align-items: center; gap: 8px; border: 1px solid var(--color-dark); border-radius: 12px; padding: 8px 24px 8px 12px; min-width: 220px; } .NL-03-block-4 .block-4-list .item .item-images img { width: 56px; height: 32px; object-fit: contain; } .NL-03-block-4 .block-4-list .item .item-media img { object-fit: contain; width: 240px; height: 240px; } @media (min-width: 1200px) and (max-width: 1399.98px) { .NL-03-block-4 .block-4-list .item .item-images { left: 83px; bottom: 72px; } } @media (max-width: 767.98px) { .NL-03-block-4 .block-4-list .item { position: relative; flex-direction: column; margin-bottom: 32px; padding: 24px; } .NL-03-block-4 .block-4-list .item:last-child { margin-bottom: 0; } .NL-03-block-4 .block-4-list .item .item-images { gap: 8px; } .NL-03-block-4 .block-4-list .item .item-images a { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; text-align: center; padding: 12px 8px; min-width: 100px; width: 100px; } .NL-03-block-4 .block-4-list .item .item-media { order: 1; } .NL-03-block-4 .block-4-list .item .item-media img { width: 160px; height: 160px; object-fit: contain; } .NL-03-block-4 .block-4-list .item .item-content { order: 2; } .NL-03-block-4 .block-4-list .item .item-title { font-size: 22px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-03-block-4 .block-4-list .item { padding: 32px; } .NL-03-block-4 .block-4-list .item .item-images { gap: 16px; left: 53px; bottom: 43px; } .NL-03-block-4 .block-4-list .item .item-images { gap: 8px; } .NL-03-block-4 .block-4-list .item .item-images a { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; text-align: center; padding: 12px 8px; min-width: 100px; } .NL-03-block-4 .block-4-list .item .item-media { flex-shrink: 0; } .NL-03-block-4 .block-4-list .item .item-media img { width: 160px; height: 160px; } .NL-03-block-4 .block-4-list .item .item-images img { width: 120px; } .NL-03-block-4 .block-4-list .item .item-images a:last-child div { left: auto; right: 0; } } @media (min-width: 992px) and (max-width: 1199.98px) { .NL-03-block-4 .block-4-list .item .item-images img { width: 160px; } .NL-03-block-4 .block-4-list .item .item-images { gap: 8px; } .NL-03-block-4 .block-4-list .item .item-images a { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; text-align: center; padding: 12px 8px; min-width: 100px; } .NL-03-block-4 .block-4-list .item .item-images a:last-child div { left: auto; right: 0; } } .block-6-image { position: relative; } .block-6-image .image-info { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; text-align: center; } .block-6-image .image-info a { display: inline-block; background: linear-gradient(to right, #05dafd, #3be1cb); font-size: 16px; color: #fff; padding: 8px 18px; border-radius: 8px; text-align: center; transition: all .15s ease-in-out; } .block-6-image .image-info a:hover { opacity: 0.6; } .block-6-image .image-title { font-size: 24px; font-weight: bold; } @media (max-width: 767.98px) { .block-6-image .image-bg { position: absolute; left: 0; right: 0; top: 0; bottom: 0; } .block-6-image .image-bg img { width: 100%; height: 100%; object-fit: cover; } .block-6-image .image-info { padding: 32px 0; position: relative; left: auto; top: auto; transform: none; } .block-6-image .image-title { font-size: 18px; } } .NL-03-block-point .item { position: relative; border-radius: 12px; background: #fff; box-shadow: 0 6px 12px #00000024; overflow: hidden; } .NL-03-block-point .item .item-content { position: absolute; left: 32px; top: 32px; z-index: 2; } .NL-03-block-point .item .item-title { font-size: 24px; font-weight: bold; background: linear-gradient(90deg, #08d9fc, #087ef4); background-clip: text; -webkit-background-clip: text; color: transparent; } .NL-03-block-point .item .item-subtitle { font-size: 16px; } @media (max-width: 767.98px) { .NL-03-block-point .item .item-content { left: 16px; top: 16px; } .NL-03-block-point .item .item-title { font-size: 18px; } .NL-03-block-point .item .item-subtitle { font-size: 14px; } } @media (min-width: 768px) and (max-width: 991.98px) { .NL-03-block-point .item .item-content { left: 0px; top: 0px; padding: 12px; } .NL-03-block-point .item .item-title { font-size: 18px; } .NL-03-block-point .item .item-subtitle { font-size: 14px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .NL-03-block-point .item .item-content { left: 0px; top: 0px; padding: 16px; } .NL-03-block-point .item .item-title { font-size: 20px; } } .NL-03-block-point .item .item-media { position: absolute; right: 0; left: 0; bottom: -9px; overflow: hidden; } .NL-03-block-point .item .item-media video { transform: scale(1.01); width: 100%; height: 100%; object-fit: contain; } .NL-03-block-point .item:after { content: ''; display: block; padding-top: 100%; } .NL-03-block-point .col-12 .item:after { content: ''; display: block; padding-top: 50%; }