@import "https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700&amp;display=swap";

:root {
    --color1: #2163E8;
    /* linear-gradient(60deg, rgba(0, 142, 204, 1) 0%, rgba(255, 1, 162, 1) 100%) */
    --gradient: linear-gradient(60deg, #2163E8 0%, #E91E63 100%);
    --color2: #2163E8;
    --color3: #E91E63;
    --menu1: #F44336;
    --menu2: #E91E63;
    --menu3: #9C27B0;
    --menu4: #673AB7;
    --menu5: #3F51B5;
    --menu6: #2196F3;
    --textparallax:
        "Scroll untuk lanjut membaca";
    --widthparallaxdesktop: 100%;
    --heightparallaxdesktop: 250px;
    --border-radius: 0.7rem;

    --main-bg-color: #f3f2f1;
    /* Warna background default */
}

::-webkit-scrollbar-track {
    background: #faf9f8;
}

::-webkit-scrollbar-thumb {
    background: #c8c6c4;
}

::-webkit-scrollbar {
    width: 6px;
}

html {
    line-height: 1.5;
    text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    scroll-behavior: smooth;
    font-family: "Noto Sans", sans-serif;
}

*,
::before,
::after {
    box-sizing: border-box;
}

a,
button,
a:focus,
button:focus {
    outline: 0px;
    border: 0px;
    text-decoration: none;
}

img {
    max-width: 100%;
    height: auto;
}

.brand-title,
.brand-description {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
}

figure {
    margin: 0;
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-thumb {
    background: #c8c6c4;
}

::-webkit-scrollbar-track {
    background: #faf9f8;
}

@-webkit-keyframes shimmer {
    100% {
        transform: translateX(100%)
    }
}

@keyframes shimmer {
    100% {
        transform: translateX(100%)
    }
}

/* Slider */
.glider-track {
    gap: 12px;
}

.glider-contain .zagi-button {
    background-color: var(--color1);
    outline: transparent;
    color: #FFFFFF;
    border-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-family: inherit;
    padding: 0;
    outline: 0;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    -webkit-text-decoration: none !important;
    text-decoration: none !important;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    opacity: 1;
    border: solid 0px transparent;
    border-radius: 3px;
}

.glider-contain .zagi-button>.button {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    padding: 16px;
    justify-content: center;
    font-size: 1rem;
}

/* .glider-item {
    margin: 0px 7.5px !important;
} */

/* End Slider */

.billboard-container {
    width: 100%;
    height: var(--heightparallaxdesktop);
    position: relative;
    left: 0;
    right: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0;
    max-width: 1024px;
}

.billboard.parallax {
    background: #1a1a1a;
}

.billboard.parallax .widget {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(auto, auto, auto, auto);
}

.billboard.parallax .widget-parallax {
    width: var(--widthparallaxdesktop);
    height: auto;
    position: fixed;
    top: 0;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    margin: 0 auto;
    max-width: 970px;
    left: 0;
    right: 0;
}

.billboard.parallax .widget-parallax img {
    width: 100%;
    height: var(--heightparallaxdesktop) !important;
    object-fit: cover;
}

body {
    color: #222;
    margin: 0px;
    font-family: "Noto Sans", sans-serif;
    font-size: 14px;
    letter-spacing: 0px;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizelegibility;
    position: relative;
    overflow-x: hidden;
}

body.over-hide {
    overflow: hidden;
}

.overflow-hide {
    overflow: hidden;
}

.content {
    position: relative;
    min-width: 1024px;
}

.header {
    position: sticky;
    top: 0px;
    right: 0px;
    left: 0px;
    z-index: 899;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1),
        0 2px 4px -2px rgba(0, 0, 0, .1);
    background-color: #ffffff;
}

.header-box {
    /* padding: 0px 20px; */
    width: 1024px;
    margin: 0px auto;
    color: #000000;
}

.header-wrapper {
    display: flex;
    flex-direction: column;
}

.header-top {
    display: flex;
    flex-flow: row wrap;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}

.header-top-box {
    width: 100%;
    padding: 9px 0px;
    margin: 0px auto;
}

.header-top-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.header-brand {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}

.header-brand h1 {
    margin: 0;
}

.header-search {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}

.header-more {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.header-brand a {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}

.header-brand img {
    height: 55px;
    width: auto;
    display: block;
}

.header-search-wrapper {
    display: flex;
    flex: 1 1 0%;
    overflow: hidden;
    border-radius: 33px;
    border-width: 1px;
    border-style: solid;
    border-color: #e5e5e5;
    color: #000000;
    width: 320px;
    background-color: #ebebeb;
}

.header-input-search {
    display: flex;
    flex: 1 1 0%;
    text-align: left;
    appearance: none;
    line-height: 24px;
    font-weight: 400;
    border: 0px;
    font-family: inherit;
    outline: 0px;
    background: none;
    min-width: 12rem;
    resize: vertical;
    color: #000000;
    width: 100%;
    padding: 8px 12px;
    font-size: 14px;
    height: 32px;
}

.header-search-wrapper button {
    display: flex;
    padding-left: 12px;
    padding-right: 12px;
    -webkit-box-align: center;
    align-items: center;
    background-color: transparent;
    cursor: pointer;
}


.icon-search {
    filter: invert(0%) sepia(6%) saturate(26%) hue-rotate(336deg) brightness(103%) contrast(100%);
    width: 48px;
    max-width: 48px;
    height: 34px;
    background-image: url("../icon/search-gray.svg");
    background-size: 24px;
    background-position: center;
    background-repeat: no-repeat;
}

.header-button {
    display: flex;
    flex-direction: row;
}

.header-button>* {
    display: inline-block;
    position: relative;
    margin-right: 22px;
    appearance: none;
    user-select: none;
    font-family: inherit;
    padding: 0px;
    outline: 0px;
    transition: all 0.2s ease 0s;
    background: none transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    width: 24px;
    max-width: 24px;
    height: 35px;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.header-button>*:last-child {
    margin-right: 0;
}

.header-more nav {
    display: inline-block;
    width: unset;
    max-width: unset;

}



.header-more nav ul {
    list-style: none;
    display: inline-block;
    margin: 0;
    padding: 0;
}

.header-more nav ul li {
    display: inline-block;
}

.header-more nav ul li a {
    appearance: none;
    user-select: none;
    font-family: inherit;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    display: inline-block;
    background: var(--color3);
    border: 0px solid transparent;
    border-radius: 1rem;
    width: 120px;
    height: 35px;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none !important;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header-more nav ul li a .menu-image-title {
    padding: 0;
}

.icon-home {

    /* Mengubah warna garis tepi SVG */
    /* filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%); */
    filter: invert(33%) sepia(92%) saturate(2561%) hue-rotate(198deg) brightness(98%) contrast(92%);
    background-image: url("../icon/home.svg");
}

.icon-darkmode {
    /* filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%); */
    filter: invert(33%) sepia(92%) saturate(2561%) hue-rotate(198deg) brightness(98%) contrast(92%);
    background-image: url("../icon/moon.svg");
}

.icon-lightmode {
    filter: invert(33%) sepia(92%) saturate(2561%) hue-rotate(198deg) brightness(98%) contrast(92%);
    /* filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%); */
    background-image: url("../icon/sun.svg");
}

.icon-network {
    filter: invert(33%) sepia(92%) saturate(2561%) hue-rotate(198deg) brightness(98%) contrast(92%);
    /* Mengubah warna garis tepi SVG */
    /* filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%); */
    background-image: url("../icon/rss.svg");
    background-size: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 3px;
}

a.icon-network {
    list-style: none;
    padding: 0px 5px;
    text-align: left;
    display: none;
    visibility: hidden;
    position: absolute;
    top: 100%;
    z-index: 3;
    left: auto;
    right: auto;
    width: 200px;
    background: #f7f7f7;
    min-width: 200px;
    border-radius: 4px;
    height: auto;

}

a.icon-network:hover {
    display: block;
    visibility: visible;
}

.darkmode .icon-darkmode,
.darkmode .icon-home,
.darkmode .icon-lightmode,
.darkmode .icon-network {
    filter: invert(100%) brightness(100%) contrast(100%);
}


.header-bottom {
    display: flex;
    flex: 1 1 0%;
    background: var(--gradient);
}


.header-bottom-box {
    display: flex;
    flex-direction: column;
    width: 1024px;
    margin: 0px auto;
    position: relative;
}

.header-menu ul li.menu-item-has-children:last-child>a:after {
    content: "";
    filter: invert(100%) brightness(100%) contrast(100%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/more.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;

}

.header-menu ul li.menu-item-has-children>a:after {
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    font-size: 0.75rem;
    margin-left: 0.35rem;
    font-weight: 900;
    vertical-align: middle;
    border: none;
}



.header-menu ul.menu-main>li>a {
    cursor: pointer;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    padding: 0.7rem 4px;
    -webkit-font-smoothing: antialiased;
    color: #fff;
    font-size: 14px;
    line-height: 24px;
    font-weight: 700;
}

/* .header-menu ul.menu-main>li>a:hover,
.header-menu ul li.menu-item-has-children>a:after::hover {
    color: #ffc516;
} */

.header-menu ul li.current-menu-item a {
    color: var(--color1);
}

.header-menu .menu-image-title {
    padding: 0;
}

.header-menu ul li.menu-item-has-children .sub-menu {
    list-style: none;
    padding: 0px 5px;
    text-align: left;
    display: none;
    visibility: hidden;
    position: absolute;
    top: 100%;
    z-index: 3;
    left: auto;
    right: auto;
    width: 200px;
    background: #FFFFFF;
    min-width: 200px;
    border-radius: 4px;
    height: auto;
}

.header-menu ul li.menu-item-has-children:hover .sub-menu {
    display: block;
    visibility: visible;
    /* Saat hover, ubah warna ke hitam */
}



.header-menu ul li.menu-item-has-children .sub-menu a {
    font-size: 15px;
    color: #000;
}

/* Mega menu */

.header-menu>.menu>ul {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    gap: 10px;
}

.header .menu>ul>li {
    display: inline-block;
}

.header .menu>ul>li .single-column-menu>ul>li {
    line-height: 1;
}

.header .menu>ul>li .single-column-menu>ul>li>a {
    display: inline-block;
    padding: 10px 0;
    font-size: 15px;
    color: #555555;
    transition: color 0.3s ease;
    text-decoration: none;
    text-transform: capitalize;
}

.header .menu>ul>li .single-column-menu {
    min-width: 200px;
    max-width: 280px;
    box-shadow: 0px 20px 30px rgba(83, 88, 93, 0.05),
        0px 0px 30px rgba(83, 88, 93, 0.1);
}

.header .menu>ul>li .single-column-menu>li>a {
    cursor: pointer;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    padding: 0.7rem 4px;
    -webkit-font-smoothing: antialiased;
    font-size: 14px;
    line-height: 24px;
    font-weight: 700;
    border-bottom: 1px dotted #d1d1d1;
}

.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li {
    line-height: 1;
    display: block;
}

.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a {
    padding: 10px 0;
    display: inline-block;
    font-size: 15px;
    color: #000;
    transition: color 0.3s ease;
}

.header .menu>ul>li .sub-menu.mega-menu {
    left: 50%;
    transform: translateX(-50%);
}

.header .menu>ul>li .sub-menu.mega-menu-column-4 {
    /* max-width: 1024px; */
    width: 100vw;
    display: flex;
    flex-wrap: wrap;
    padding: 30px 15px 45px 15px;
    box-shadow: 0px 20px 30px rgba(83, 88, 93, 0.05),
        0px 0px 30px rgba(83, 88, 93, 0.1);
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item {
    flex: 0 0 25%;
    padding: 0 15px;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item .title {
    font-size: 16px;
    color: #000;
    font-weight: 700;
    line-height: 1;
    padding: 10px 0;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item h4 {
    margin-block-start: 1rem;
    margin-block-end: 0;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item ul {
    padding: 0;
    margin-inline-start: 0 !important;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center .title {
    text-align: center;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item img {
    max-width: 100%;
    width: 100%;
    vertical-align: middle;
    margin-top: 25px;
    height: 300px;
    object-fit: cover;
}


.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a:hover,
.header-menu ul li.menu-item-has-children .sub-menu a:hover,
.header .menu>ul>li .sub-menu>ul>li>a:hover,
.header .item-right a:hover {
    color: var(--color1);
}

.darkmode .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a:hover,
.darkmode .header-menu ul li.menu-item-has-children .sub-menu a:hover,
.darkmode .header .menu>ul>li .sub-menu>ul>li>a:hover,
.darkmode .header .item-right a:hover {
    color: var(--color3);
}

.darkmode .header-menu ul li.menu-item-has-children>a:last-of-type:hover::after,
.darkmode .header .menu>ul>li:hover>a,
.header-menu ul li.menu-item-has-children>a:last-of-type:hover::after,
.header .menu>ul>li:hover>a {
    color: #eee;
}

.menu-item-has-children .mega-menu>.content-menu {
    display: flex;
    margin: 0 auto;
    flex-direction: row;
}

.menu-item-has-children .mega-menu>.content-menu>.grid-menu {
    display: grid;
    grid-template-columns: 98px 98px 98px;
    margin-right: 50px;
}

.menu-item-has-children .mega-menu>.content-menu>.grid-menu>a>.icon-menu {
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 98px;
    width: 98px;
    display: flex;
}

.menu-item-has-children .mega-menu>.content-menu>.grid-menu>a>.icon-menu .text-icon {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    font-family: 'Heebo', sans-serif;
    margin-top: 8px;
}

.menu-item-has-children .mega-menu>.content-menu .text-menu {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-self: flex-start;
    margin-right: 80px;
}

.menu-item-has-children .mega-menu>.content-menu .text-menu ul.sosmed-menu {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-self: flex-start;
    list-style: none;
    padding-inline-start: 0px;
}

.menu-item-has-children .mega-menu>.content-menu .text-menu ul.list-menu {
    list-style: none;
    padding-inline-start: 0;
}

.darkmode .menu-item-has-children .mega-menu>.content-menu .text-menu>h3.title {
    color: #fff;
}

.darkmode .menu-item-has-children .mega-menu>.content-menu .text-menu .sosmed-menu>li>a:before {
    filter: invert(100%) brightness(1000%);
}

/* End Mega menu */


.header-submenu {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    margin-bottom: 4px;
}

.header-submenu ul {
    display: flex;
    flex-direction: row;
    list-style: none;
    margin: 0;
    padding: 0;
}

.header-submenu nav ul li {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin-right: 24px;
}

.header-submenu nav ul li.sub-menu {
    display: none;
}

.header-submenu nav ul li a {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    padding: 4px 0px;
    -webkit-font-smoothing: antialiased;
    color: #6c6c6c;
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
}

.header-submenu nav ul li:last-child {
    margin-right: 0;
}

.header-submenu .menu-image-title {
    padding: 0;
}

.header-submenu nav ul li.current-menu-item a {
    color: var(--color1);
}

.main {
    background-color: var(--main-bg-color);
    padding-bottom: 10px;
    padding-top: 0px;
}

.single .main {
    background-color: #fff;
}

.single .article-box {
    width: 100%;
}

.main-container {
    width: 1024px;
    margin: 0px auto;
    position: relative;
    padding: 20px;
    z-index: 180;
    min-height: 300px;

}

/* BILLBOARD */
.main .billboard>.widget {
    flex: 1 1 0%;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    text-align: center;
    display: block;
    overflow: visible;
    padding: 0;
}

.main .billboard>.widget img {
    display: block;
    margin: auto;
}

/* WIDGET CUSTOM TAG */
.custom-tag {
    padding: 0px 8px 8px;
    margin: 0px;
}

.custom-tag ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    gap: 6px;
}

.custom-tag ul li {
    display: flex;
    -webkit-box-flex: 0;
    flex: 0 0 auto;
}

.custom-tag ul li a {
    cursor: pointer;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    padding: 6px 12px;
    overflow: hidden;
    border-radius: 50em;
    border: 1.5px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, var(--gradient) border-box;
    -webkit-font-smoothing: antialiased;
    color: #333;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    transition: background 0.2s, color 0.2s;
}

.custom-tag ul li a:hover {
    background: var(--gradient) padding-box, var(--gradient) border-box;
    color: #fff;
}

.darkmode .custom-tag ul li a {
    background: linear-gradient(#2e2e2e, #2e2e2e) padding-box, var(--gradient) border-box;
    color: #e0e0e0;
}

.darkmode .custom-tag ul li a:hover {
    background: var(--gradient) padding-box, var(--gradient) border-box;
    color: #fff;
}

.custom-tag .menu-image-title {
    padding: 0;
}

/* WIDGET SLIDER */
.slider {
    display: flex;
    gap: 12px;
}

.headline {
    flex: 1;
    overflow: hidden;
    border-radius: var(--border-radius);
    position: relative;
    /* top: -1.3rem; */
}

button.slick-autoplay-toggle-button {
    background: transparent;
    outline: 0;
    border: 0;
}

span.slick-pause-text.slick-sr-only {
    font-size: 0;
}

.trending {
    display: flex;
    width: 320px;
    margin-top: 20px;
}

.headline img {
    border-radius: var(--border-radius);
    display: block;
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.carousel-item {
    position: relative;
    width: 652px;
}

.headline-big {
    display: flex;
    margin-bottom: 6px;
    width: 100%;
}

.headline-small-box {
    display: flex;
    width: 100%;
    gap: 6px;
}

.headline-small-box .headline-small:first-child {
    display: flex;
    flex: 1 1 0%;
    height: 100%;
}

.headline-small-box .headline-small:last-child {
    display: flex;
    flex: 1 1 0%;
    height: 100%;
}

.headline-big .headline-item {
    display: flex;
    flex-direction: column;
    -webkit-box-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    background-color: #ffffff;
    color: #000000;
    position: relative;
    border-radius: 0.7rem;
    width: 100%;
}

.headline-big .headline-image {
    width: 100%;
    height: 0;
    position: relative;
    overflow: hidden;
    border-radius: 0.7rem;
    background: #eeeeee;
    padding-bottom: 360px;
}

.headline-big .headline-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.headline-big .headline-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.headline-content {
    z-index: 3;
    position: absolute;
    height: 100%;
    bottom: 0px;
    left: 0px;
    right: 0px;
    color: #ffffff;
    -webkit-font-smoothing: antialiased;
    border-radius: 0.7rem;
    background: -webkit-linear-gradient(top, #000 1%, transparent);
    background: linear-gradient(to top, #000 1%, transparent);
}

.headline-text {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    padding: 16px;
    width: 100%;
    position: absolute;
    bottom: 0px;
}

.headline-text .headline-title h2 {
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.headline-text .headline-title a {
    cursor: pointer;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    -webkit-font-smoothing: antialiased;
    color: #ffffff;
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    display: block;
}

.headline-small .headline-item {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    -webkit-box-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    border-radius: var(--border-radius);
    background-color: #ffffff;
    color: #000000;
    position: relative;
}

.headline-small .headline-image {
    width: 100%;
    height: 0;
    position: relative;
    overflow: hidden;
    border-radius: var(--border-radius);
    background: #eeeeee;
    padding-bottom: 238px;
}

.headline-small .headline-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.headline-small .headline-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.headline-content .headline-author {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 10px;
}

.headline-content .headline-author img {
    margin-right: 6px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 500;
    border-radius: 50%;
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.headline-content .headline-author-name {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    font-size: 13px;
    font-weight: 500;
    word-break: break-all;
    white-space: normal;
    line-height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #cccccc;
}

.headline-content .headline-author .icon-verification {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-size: 15px;
    background-repeat: no-repeat;
    border-radius: 50em;
    background-image: url("data:image/svg+xml,%0A%3Csvg viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z' fill='%231d9bf0'%3E%3C/path%3E%3C/svg%3E%0A");
}

.headline-content .headline-more {
    display: flex;
    flex: 1 1 0%;
    margin-top: 12px;
    -webkit-box-align: center;
    align-items: center;
}

.headline-content .headline-more .headline-button {
    display: flex;
    flex: 1 1 0%;
    -webkit-box-align: center;
    align-items: center;
}

.headline-content .headline-more .icon-share {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
}

.headline-content .headline-more .btn-like {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 4px;
    min-width: 52px;
}

.headline-content .headline-more .btn-comment {
    display: flex;
    padding: 0px;
    border: none;
    height: 16px;
    min-width: 52px;
    -webkit-box-align: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    margin-right: 4px;
}

.headline-content .headline-more .timeago {
    -webkit-font-smoothing: antialiased;
    color: #cccccc;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.headline-content .headline-more .icon-like {
    filter: invert(100%) sepia(0%) saturate(7471%) hue-rotate(57deg) brightness(106%) contrast(60%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/like.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.headline-content .headline-more .icon-comment {
    filter: invert(100%) sepia(0%) saturate(7471%) hue-rotate(57deg) brightness(106%) contrast(60%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/comment.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.headline-content .headline-more .icon-share {
    filter: invert(100%) sepia(0%) saturate(7471%) hue-rotate(57deg) brightness(106%) contrast(60%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/share-2.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.headline-content .headline-more .like-counter,
.headline-content .headline-more .comment-counter {
    -webkit-font-smoothing: antialiased;
    color: #cccccc;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin-left: 4px;
}

.carousel-control-next {
    right: 0;
}

.carousel-control-prev {
    left: 0;
}

.carousel-control-next,
.carousel-control-prev {
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
    z-index: 10;
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
    margin-top: -12rem;
    display: flex;
    flex: 1 1 0%;
    height: 50px;
    width: 24px;
    -webkit-box-align: center;
    align-items: center;
}

.headline ul.slick-dots {
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 24px;
    position: absolute;
    display: flex;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 10;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 3px;
}

.headline ul.slick-dots button {
    display: block;
    cursor: pointer;
    height: 3px;
    max-width: 10px;
    background-color: #fff;
    border-radius: 999999px;
    font-size: 0;
}

.headline ul.slick-dots .slick-active button {
    background: var(--color1);
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    background-repeat: no-repeat;
    filter: invert(100%) sepia(0%) saturate(1534%) hue-rotate(43deg) brightness(114%) contrast(100%);
    width: 24px;
    max-width: 24px;
    background-size: 24px;
    display: block;
    height: 24px;
}

.carousel-control-prev-icon {
    background-image: url("../icon/chevron-back.svg");
}

.carousel-control-next-icon {
    background-image: url("../icon/chevron-next.svg");
}

.carousel-indicators {
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 24px;
    position: absolute;
    display: flex;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 10;
    list-style: none;
    margin: 0;
    padding: 0;
}

.carousel-indicators li {
    flex: 1 1 0%;
    margin: 0px 2px;
    display: inline-block;
    cursor: pointer;
    height: 3px;
    max-width: 10px;
    background-color: #fff;
    border-radius: 999999px;
}

.carousel-indicators li.active {
    background-color: var(--color1);
}

.grid-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    color: #000000;
}

.grid-box .grid-header-box {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding-left: 12px;
    padding-top: 8px;
    padding-bottom: 8px;
    position: relative;
}

.grid-box .grid-header-box:before {
    content: "";
    position: absolute;
    left: 0px;
    width: 6px;
    height: 12px;
    background: var(--color2);
}

.grid-box .grid-header {
    border-bottom: 1px solid #eeeeee;
}

.grid-box .grid-header .grid-title {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}

.grid-box .grid-header .grid-more {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}

.grid-box .grid-header .grid-title h2 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 30px;
    font-weight: 700;
    display: block;
    margin: 0;
}

.grid-box .grid-header .grid-more a {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-font-smoothing: antialiased;
    color: var(--color1);
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.grid-box .grid-header .grid-more a:after {
    content: "";
    display: flex;
    margin-left: 8px;
    -webkit-box-pack: center;
    justify-content: center;
    filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%);
    width: 20px;
    max-width: 20px;
    height: 20px;
    background-image: url("../icon/chevron-next.svg");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.slider .grid-box .grid-content {
    height: 553px;
    position: relative;
}

.grid-box .grid-scroll {
    overflow: hidden auto;
    height: 100%;
}

/* ::-webkit-scrollbar {
    height: 50px;
} */

.grid-scroll:hover::-webkit-scrollbar-thumb {
    background-color: #2163E8;

}

.grid-item {
    padding: 16px 10px;
    border-bottom: 1px solid #eeeeee;
}

.grid-text {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
}

.grid-image {
    margin-left: 16px;
    width: 80px;
    position: relative;
    border-radius: var(--border-radius);
    height: 0;
    background: #eeeeee;
    overflow: hidden;
    padding-bottom: 80px;
}

.grid-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.grid-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.grid-image img {
    border-radius: var(--border-radius);
    display: block;
    object-fit: cover;
    width: 80px;
    z-index: 2;
    position: absolute;
    height: auto;
}

.grid-item-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
    -webkit-box-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    border-radius: 0px;
    background-color: #ffffff;
    color: #000000;
}

.grid-title {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}

.grid-title h2 {
    margin: 0;
    display: -webkit-box;
    /* -webkit-line-clamp: 3; */
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.grid-title a {
    display: block;
    cursor: pointer;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 700;
}

.grid-author {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 10px;
}

.grid-author img {
    margin-right: 6px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 500;
    border-radius: 50%;
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.grid-author-name {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    font-size: 13px;
    font-weight: 500;
    word-break: break-all;
    white-space: normal;
    line-height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #6c6c6c;
}

.grid-author .icon-verification {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-size: 15px;
    background-repeat: no-repeat;
    border-radius: 50em;
    background-image: url("data:image/svg+xml,%0A%3Csvg viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z' fill='%231d9bf0'%3E%3C/path%3E%3C/svg%3E%0A");
}

.grid-more {
    display: flex;
    flex: 1 1 0%;
    margin-top: 12px;
    -webkit-box-align: center;
    align-items: center;
}

.grid-more .grid-button {
    display: flex;
    flex: 1 1 0%;
    -webkit-box-align: center;
    align-items: center;
}

.grid-more .icon-share {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
}

.grid-more .btn-like {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 4px;
    min-width: 52px;
}

.grid-more .btn-comment {
    display: flex;
    padding: 0px;
    border: none;
    height: 16px;
    min-width: 52px;
    -webkit-box-align: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    margin-right: 4px;
}

.grid-more .timeago {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.grid-more .icon-like {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/like.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.grid-more .icon-comment {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/comment.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.grid-more .icon-share {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/share-2.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.grid-more .like-counter,
.grid-more .comment-counter {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin-left: 4px;
}

.grid-box .grid-scroll .grid-item:last-child {
    border: 0;
}

.grid2-box {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 12px;
}

.grid2-item {
    max-width: calc(33.333333% - 8px);
}

.grid2-item .grid-item-box {
    display: flex;
    flex-direction: row;
    -moz-box-pack: justify;
    justify-content: space-between;
    background: #fff;
    padding: 12px;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    height: 100%;
}

.grid-label {
    -webkit-font-smoothing: antialiased;
    color: #dc1641;
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.stories ul {
    margin: 0;
    overflow-x: auto;
    white-space: nowrap;
    padding: 5px 0;
    text-align: center;
}

.stories ul li {
    text-align: center;
    list-style: none;
    display: inline-block;
    width: 90px;
    height: 68px;
    position: relative;
}

.stories ul li:before {
    content: "";
    width: 68px;
    height: 68px;
    position: absolute;
    padding-right: 0;
    border-radius: 50%;
    animation: spin 2s linear infinite;
    left: 11px;
    background: var(--color1) linear-gradient(-50deg, #6c6c6c, var(--color1), var(--color1)) repeat scroll 0 0;
    top: -1px;
}

.stories ul li a {
    display: block;
}

.stories ul li img.menu-image-title-after {
    width: 62px;
    height: 62px;
    margin: 2px auto;
    position: relative;
    border-radius: 50%;
    padding: 3px;
    background: #fff;
}

.stories ul li .menu-image-title {
    overflow: hidden;
    margin: 0;
    text-transform: none;
    letter-spacing: 0;
    font-size: 12px;
    color: #000;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    padding: 5px 0 0 0;
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

/* WIDGET */
.main .widget {
    margin-bottom: 20px;
}

.main .widget .widget-header-box {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding-left: 15px;
    padding-top: 0;
    padding-bottom: 0;
    position: relative;
    margin-bottom: 15px;
}

.main .widget .widget-header-box:before {
    content: "";
    position: absolute;
    left: 0px;
    width: 7px;
    height: 24px;
    background: var(--color1);
    top: 4px;
}

.main .widget .widget-title a,
.main .widget .widget-title h1,
.main .widget .widget-title h3 {
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
    display: block;
    margin: 0;
}

.main .widget .widget-more {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}

.main .widget .widget-more a {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-font-smoothing: antialiased;
    color: var(--color2);
    font-size: 15px;
    line-height: 24px;
    font-weight: 500;
}

.main .widget .widget-more a:after {
    content: "";
    display: flex;
    margin-left: 8px;
    -webkit-box-pack: center;
    justify-content: center;
    filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%);
    width: 20px;
    max-width: 20px;
    height: 20px;
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12H19' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 5L19 12L12 19' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

/* COLLECTION */
.collection .collection-box {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 12px;
}

.collection .collection-item {
    width: calc(20% - 10px);
}

.collection .collection-item a {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    display: block;
}

.collection .collection-card {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    width: 100%;
}

.collection .collection-image {
    margin-bottom: 10px;
    border-radius: var(--border-radius);
    height: 0;
    width: 100%;
    background: #eeeeee;
    overflow: hidden;
    position: relative;
    padding-bottom: 150%;
}

.collection .collection-image .pin {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    opacity: 0.8;
    overflow: hidden;
    border-radius: 17px;
    height: 32px;
    width: 32px;
    background-color: #000000;
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    background-image: url(../icon/pin.svg);
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.collection .collection-image .icon {
    display: flex;
    font-size: 3rem;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    overflow: hidden;
    background: transparent;
    position: absolute;
    z-index: 2;
    opacity: 0.8;
    color: #ebebeb;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.collection .collection-image .time {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    overflow: hidden;
    background-color: rgb(51, 51, 51);
    position: absolute;
    border-radius: 6px;
    bottom: 8px;
    right: 8px;
    z-index: 2;
    color: #fff;
    padding: 5px;
}

.collection .collection-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.collection .collection-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.collection .collection-image img {
    display: block;
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.collection .collection-label {
    -webkit-font-smoothing: antialiased;
    color: var(--color2);
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.collection .collection-title {
    word-break: break-word;
    overflow-wrap: break-word;
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 700;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 5px;
}

.collection .collection-subtitle {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.category .collection .collection-item {
    margin-bottom: 20px;
}

/* GRID WIDGET */
.headline-box {
    position: relative;
}

.headline-box .headline-image {
    height: 0;
    width: 100%;
    background: #eeeeee;
    border-radius: var(--border-radius);
    overflow: hidden;
    position: relative;
    padding-bottom: 451px;
}

.headline-box .headline-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.headline-box .headline-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.headline-box .headline-image img {
    border-radius: var(--border-radius);
    display: block;
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.grid-flex {
    display: flex;
    flex-direction: row;
    padding-bottom: 4px;
    margin-left: -6px;
    margin-right: -6px;
}

.grid-flex>div {
    flex: 1 1 0%;
    margin-left: 6px;
    margin-right: 6px;
    border-radius: var(--border-radius);
}

.grid .grid-box .grid-header-box:before {
    background: var(--color2);
}

.grid .grid-content,
.grid .grid-content {
    height: 408px;
    position: relative;
}

.grid .grid-title {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
}

.grid .grid-box .grid-header .grid-title {
    cursor: unset;
}

/* WIDGET VIDEO */
.video-box {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.video-box .video-item {
    width: calc(25% - 9px);
}

.single .video-box .video-item {
    width: calc(33.333333% - 8px);
}

.video-content {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding: 15px;
    overflow: hidden;
    border-radius: 0px;
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    color: #000000;
}

.video-image {
    width: 100%;
    height: 0;
    background: #eeeeee;
    border-radius: var(--border-radius);
    position: relative;
    overflow: hidden;
    padding-bottom: 57%;
}

.video-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.video-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.video-image a {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.video-image img {
    border-radius: var(--border-radius);
    display: block;
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.video-title {
    margin-top: 10px;
}

.video-title h2 {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 700;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.video-title h2 a {
    color: #000000;
    word-break: break-word;
    overflow-wrap: break-word;
    display: block;
}

.video-content .video-author {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 10px;
}

.video-content .video-author img {
    margin-right: 6px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 500;
    border-radius: 50%;
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.video-content .video-author-name {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    font-size: 13px;
    font-weight: 500;
    word-break: break-all;
    white-space: normal;
    line-height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #767676;
}

.video-content .video-author .icon-verification {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-size: 15px;
    background-repeat: no-repeat;
    border-radius: 50em;
    background-image: url("data:image/svg+xml,%0A%3Csvg viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z' fill='%231d9bf0'%3E%3C/path%3E%3C/svg%3E%0A");
}

.video-content .video-more {
    display: flex;
    flex: 1 1 0%;
    margin-top: 12px;
    -webkit-box-align: center;
    align-items: center;
}

.video-content .video-more .video-button {
    display: flex;
    flex: 1 1 0%;
    -webkit-box-align: center;
    align-items: center;
}

.video-content .video-more .icon-share {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
}

.video-content .video-more .btn-like {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 4px;
    min-width: 52px;
}

.video-content .video-more .btn-comment {
    display: flex;
    padding: 0px;
    border: none;
    height: 16px;
    min-width: 52px;
    -webkit-box-align: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    margin-right: 4px;
}

.video-content .video-more .timeago {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.video-content .video-more .icon-like {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/like.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.video-content .video-more .icon-comment {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/comment.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.video-content .video-more .icon-share {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/share-2.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.video-content .video-more .like-counter,
.video-content .video-more .comment-counter {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin-left: 4px;
}

.single .video-content .video-more .btn-like,
.single .video-content .video-more .btn-comment {
    min-width: 36px;
}

/* WIDGET POLLING */
.polling-box {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.polling-box .polling-item {
    width: calc(25% - 9px);
}

.single .polling-box .polling-item {
    width: calc(33.333333% - 8px);
}

.polling-content {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding: 15px;
    overflow: hidden;
    border-radius: 0px;
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    color: #000000;
    min-height: 500px;
}

.polling-image {
    width: 100%;
    height: 0;
    background: #eeeeee;
    border-radius: var(--border-radius);
    position: relative;
    overflow: hidden;
    padding-bottom: 57%;
}

.polling-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.polling-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.polling-image a {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.polling-image img {
    border-radius: var(--border-radius);
    display: block;
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.polling-title {
    margin-top: 10px;
}

.polling-title h2 {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: 'Heebo',
        sans-serif;
}

.polling-title h2 a {
    color: #000000;
    word-break: break-word;
    overflow-wrap: break-word;
    display: block;
}

.polling-content .polling-author {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 10px;
}

.polling-content .polling-author img {
    margin-right: 6px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 500;
    border-radius: 50%;
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.polling-content .polling-author-name {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    font-size: 13px;
    font-weight: 500;
    word-break: break-all;
    white-space: normal;
    line-height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #767676;
}

.polling-content .polling-author .icon-verification {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-size: 15px;
    background-repeat: no-repeat;
    border-radius: 50em;
    background-image: url("data:image/svg+xml,%0A%3Csvg viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z' fill='%231d9bf0'%3E%3C/path%3E%3C/svg%3E%0A");
}

.polling-content .polling-choice {
    padding-top: 12px;

}

.polling-content .polling-choice>.content-choice {
    width: 100%;
}

.polling-content .polling-choice>.content-choice>.choice {
    margin-bottom: 8px;
}

.polling-content .polling-choice>.content-choice>.choice>button {
    background-color: transparent;
    outline: var(--color1);
    color: var(--color1);
    border: 1px solid var(--color1);
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    appearance: none;
    user-select: none;
    font-family: inherit;
    padding: 0;
    outline: 0;
    transition: 0.2s;
    text-decoration: none !important;
    position: relative;
    display: inline-block;
    background: none;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    border-radius: 3px;
}

.polling-content .polling-choice>.content-choice>.choice>button>.respon {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    color: var(--color1);
    font-family: 'Heebo', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
}

.polling-content .polling-choice span {
    color: rgb(118, 118, 118);
    font-family: 'Heebo', sans-serif;
    font-weight: 400;
    font-size: 12px;
}

.polling-content .polling-choice>.content-choice>.result {
    display: flex;
    flex: 1 1 0%;
    margin-bottom: 8px;
    align-items: center;
}

.polling-content .polling-choice>.content-choice>.result>.text {
    display: flex;
    flex: 3 1 0%;
    position: relative;
    align-items: center;
}

.polling-content .polling-choice>.content-choice>.result>.text>.statistik {
    height: 40px;
    overflow: hidden;
    border-radius: 4px;
    background-color: rgb(221, 221, 221);
    padding: 8px;
}

.polling-content .polling-choice>.content-choice>.result>.text .jawaban {
    display: flex;
    word-break: break-word;
    flex-direction: column;
    position: absolute;
    margin-left: 8px;
    font-family: 'Heebo', sans-serif;
    font-weight: 400;
    color: #000;
    font-size: 16px;
    line-height: 24px;
}

.polling-content .polling-choice>.content-choice>.result .percent {
    font-family: 'Heebo', sans-serif;
    font-weight: 400;
    color: #000;
    font-size: 16px;
    line-height: 24px;
}

.polling-content .polling-more {
    display: flex;
    flex: 1 1 0%;
    margin-top: 12px;
}

.polling-content .polling-more .polling-button {
    display: flex;
    flex: 1 1 0%;
}

.polling-content .polling-more .icon-share {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
}

.polling-content .polling-more .btn-like {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 4px;
    min-width: 52px;
}

.polling-content .polling-more .btn-comment {
    display: flex;
    padding: 0px;
    border: none;
    height: 16px;
    min-width: 52px;
    -webkit-box-align: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    margin-right: 4px;
}

.polling-content .polling-more .timeago {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.polling-content .polling-more .icon-like {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/like.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.polling-content .polling-more .icon-comment {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/comment.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.polling-content .polling-more .icon-share {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/share-2.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.polling-content .polling-more .like-counter,
.polling-content .polling-more .comment-counter {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin-left: 4px;
}

.single .polling-content .polling-more .btn-like,
.single .polling-content .polling-more .btn-comment {
    min-width: 36px;
}

.poll-prev,
.poll-next {
    user-select: none;
    position: absolute;
    outline: none;
    background: none;
    padding: 0;
    z-index: 2;
    font-size: 40px;
    text-decoration: none;
    left: -23px;
    border: 0;
    top: 30%;
    cursor: pointer;
    color: #666;
    opacity: 1;
    line-height: 1;
    transition: opacity 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67),
        color 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67);
}

.poll-prev:hover,
.poll-next:hover,
.poll-prev:focus,
.poll-next:focus {
    color: #a89cc8;
}

.poll-next {
    right: -23px;
    left: auto;
}

.poll-next.disabled,
.poll-prev.disabled {
    opacity: 0.25;
    color: #666;
    cursor: default;
}

/* ARCHIVE GRID */
.archive-grid-box {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -12px;
    margin-right: -12px;
}

.archive-grid-box .archive-grid-item {
    display: flex;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
    margin-bottom: 20px;
}

.archive-grid-wrap {
    padding-left: 12px;
    padding-right: 12px;
}

.archive-grid-content {
    padding: 16px 20px;
    border-radius: 0px;
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    color: #000000;
    height: 100%;
}

.archive-grid-image {
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    background: #eeeeee;
    border-radius: var(--border-radius);
    position: relative;
    overflow: hidden;
}

.archive-grid-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.archive-grid-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.archive-grid-image a {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}

.archive-grid-image img {
    display: block;
    border-radius: var(--border-radius);
    object-fit: cover;
    width: 100%;
    height: auto;
    z-index: 2;
    position: relative;
}

.archive-grid-title {
    padding-top: 16px;
}

.archive-grid-title h2 {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.archive-grid-title h2 a {
    color: #000000;
    word-break: break-word;
    overflow-wrap: break-word;
    display: block;
}

.archive-grid-content .archive-grid-author {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 6px;
}

.archive-grid-content .archive-grid-author img {
    margin-right: 6px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 500;
    border-radius: 50%;
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.archive-grid-content .archive-grid-author-name {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    font-size: 14px;
    font-weight: 400;
    word-break: break-all;
    white-space: normal;
    line-height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #767676;
}

.archive-grid-content .archive-grid-author .icon-verification {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 12px;
    max-width: 12px;
    height: 12px;
    background-image: url("../icon/verified-round.svg");
    background-size: 12px;
    background-repeat: no-repeat;
}

.archive-grid-content .archive-grid-more {
    display: flex;
    flex: 1 1 0%;
    margin-top: 12px;
    -webkit-box-align: center;
    align-items: center;
}

.archive-grid-content .archive-grid-more .archive-grid-button {
    display: flex;
    flex: 1 1 0%;
    -webkit-box-align: center;
    align-items: center;
}

.archive-grid-content .archive-grid-more .icon-share {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
}

.archive-grid-content .archive-grid-more .btn-like {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 4px;
    min-width: 52px;
}

.archive-grid-content .archive-grid-more .btn-comment {
    display: flex;
    padding: 0px;
    border: none;
    height: 16px;
    min-width: 52px;
    -webkit-box-align: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    margin-right: 4px;
}

.archive-grid-content .archive-grid-more .timeago {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.archive-grid-content .archive-grid-more .icon-like {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/like.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.archive-grid-content .archive-grid-more .icon-comment {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/comment.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.archive-grid-content .archive-grid-more .icon-share {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/share-2.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.archive-grid-content .archive-grid-more .like-counter,
.archive-grid-content .archive-grid-more .comment-counter {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin-left: 4px;
}

/* LIST WIDGET */
.list .list-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -6px;
    margin-left: -6px;
}

.single .list .list-wrap {
    display: unset;
    flex-direction: unset;
    margin: unset;
}

.list .list-item {
    border-radius: var(--border-radius);
    display: flex;
    padding-left: 6px;
    padding-right: 6px;
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    margin-bottom: 12px;
}

.single .list .list-item {
    display: unset;
    -ms-flex: unset;
    flex: unset;
    max-width: unset;
    margin-bottom: 0;
    padding: 0;
}

.single .list .list-item:last-child .list-box {
    border: none;
}

.list .list-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding: 16px 20px;
    overflow: hidden;
    border-radius: 0px;
    color: #000000;
    background-color: #ffffff;
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
}

.single .list .list-box {
    border: 0;
    border-bottom: 1px solid #eeeeee;
    padding: 16px 0;
}

.list .list-content {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.list .list-image {
    margin-left: 16px;
    width: 80px;
    position: relative;
    border-radius: var(--border-radius);
    height: 0;
    background: #eeeeee;
    overflow: hidden;
    padding-bottom: 80px;
}

.list .list-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #eeeeee;
    animation: shine 1s infinite;
}

.list .list-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.list .list-image a {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.list .list-image img {
    border-radius: var(--border-radius);
    display: block;
    object-fit: cover;
    width: 100%;
    z-index: 2;
    position: absolute;
    height: 100%;
}

.list .list-label {
    -webkit-font-smoothing: antialiased;
    color: var(--color1);
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.list .list-title {}

.list .list-title h2 {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 700;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.list .list-title h2 a {
    color: #000000;
    word-break: break-word;
    overflow-wrap: break-word;
    display: block;
}

.list .list-author {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 10px;
}

.list .list-author img {
    margin-right: 6px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 500;
    border-radius: 50%;
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.list .list-author-name {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    font-size: 13px;
    font-weight: 500;
    word-break: break-all;
    white-space: normal;
    line-height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #767676;
}

.list .list-author .icon-verification {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-size: 15px;
    background-repeat: no-repeat;
    border-radius: 50em;
    background-image: url("data:image/svg+xml,%0A%3Csvg viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z' fill='%231d9bf0'%3E%3C/path%3E%3C/svg%3E%0A");
}

.list .list-more {
    display: flex;
    margin-top: 12px;
    -webkit-box-align: center;
    align-items: center;
    justify-content: space-between;
}

.list .list-more .list-button {
    display: flex;
    flex: 1;
    -webkit-box-align: center;
    align-items: center;
    justify-content: flex-start;
}

.list .list-more .icon-share {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    -webkit-box-align: center;
    align-items: center;
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/share-2.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.list .list-more .btn-like {
    display: flex;
    background-color: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    height: 16px;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 4px;
    min-width: 40px;
}

.list .list-more .btn-comment {
    display: flex;
    padding: 0px;
    border: none;
    height: 16px;
    min-width: 40px;
    -webkit-box-align: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    margin-right: 4px;
}

.list .list-more .timeago {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin-right: 4px;
}

.list .list-more .icon-like {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/like.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.list .list-more .icon-comment {
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(178deg) brightness(104%) contrast(81%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/comment.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.list .list-more .like-counter,
.list .list-more .comment-counter {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin-left: 4px;
}

.widget .btn-like.liked .icon-like {
    background-image: url(../icon/like-active.svg);
    filter: unset;
}

.single .sidebar .list .list-item {
    display: flex;
}

.single .sidebar .list .list-box {
    padding: 0 0 16px 0;
    border: 0;
}

/* SINGLE */
.content-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
}

.article {
    display: flex;
    flex: 1;
}

.content-box .sidebar {
    display: flex;
    flex-basis: 320px;
    flex-direction: column;
}

.article-box {
    width: 644px;
}

.info-post {
    width: 100%;
    display: block;
    margin-bottom: 10px;
    position: sticky;
    top: 117px;
    z-index: 5;
    background: #fff;
    padding: 10px 0;
}

.info-post .info-box {
    display: flex;
    flex-direction: row;
    -webkit-box-pack: justify;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    background-color: #ffffff;
    color: #000000;
    align-items: center;
}

.info-post .author-flex {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
}

.info-post .author-avatar {
    margin-right: 12px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    width: 48px;
    height: 48px;
    font-size: 28px;
    font-weight: 500;
    border-radius: var(--border-radius);
    background: #f6f8fc;
    position: relative;
    text-align: center;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
}

.info-post .author-avatar a {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
}

.info-post .author-avatar img {
    display: block;
    border-radius: var(--border-radius);
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.info-post .author-name-box {
    display: flex;
    flex-direction: column;
}

.info-post .author-name-flex {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
}

.info-post .author-name a {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    padding-right: 4px;
}

.prop-pos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.info-post .author-name-box {
    display: flex;
    flex-direction: column;
}

.info-post .author-verified {
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url(../icon/verified-round.svg);
    background-size: 16px;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 4px;
}

.info-post .info-box .author-box {
    flex: 1;
}

.info-post .share-box {
    display: flex;
    background: #ededed;
    padding: 0 9px;
    border-radius: 50em;
    height: 38px;
}

.info-post .likecomment {
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.info-post .share-wrapper {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.info-post .like-box {
    margin-right: 16px;
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
}

.info-post .like-btn {
    appearance: none;
    user-select: none;
    font-family: inherit;
    padding: 0px;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    background: none transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    cursor: pointer;
    vertical-align: middle;
    text-align: center;
    text-decoration: none !important;
    filter: invert(0%) sepia(6%) saturate(26%) hue-rotate(336deg) brightness(103%) contrast(100%);
    width: 24px;
    max-width: 24px;
    height: 24px;
    background-image: url(../icon/like.svg);
    margin-right: 8px;
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.info-post .like-btn.liked {
    background-image: url(../icon/like-active.svg);
    filter: unset;
}

.info-post .like-count {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.info-post .comment-box {
    margin-right: 16px;
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
}

.info-post .comment-btn {
    appearance: none;
    user-select: none;
    font-family: inherit;
    padding: 0px;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    background: none transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    cursor: pointer;
    vertical-align: middle;
    text-align: center;
    text-decoration: none !important;
    filter: invert(0%) sepia(6%) saturate(26%) hue-rotate(336deg) brightness(103%) contrast(100%);
    width: 24px;
    max-width: 24px;
    height: 24px;
    background-image: url(../icon/comment.svg);
    margin-right: 8px;
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.info-post .comment-count {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.info-post .share-btn {
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    cursor: pointer;
    margin-right: 16px;
}

.info-post .share-btn.whatsapp {
    background-color: #25d366;
    background-image: url(../icon/whatsapp.svg);
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.info-post .share-btn.copylink {
    background-color: #00a1b0;
    background-image: url(../icon/copylink.svg);
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.info-post .share-btn.more {
    filter: invert(0%) sepia(6%) saturate(26%) hue-rotate(336deg) brightness(103%) contrast(100%);
    background-color: transparent;
    background-image: url(../icon/more-vertical.svg);
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 0;
}

.info-post .timepost {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 13px;
    line-height: 24px;
    font-weight: 500;
}

.info-post .dot {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.info-post .readtime {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
}

.info-post .dot:after {
    content: "\00B7";
    margin: 0 4px;
}

.article-box {
    width: 644px;
}

.more a:after {
    content: "'\f078'";
    /* background-image: url("../icon/more-vertical.svg"); */
    filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%);
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-size: 16px;
    background-repeat: no-repeat;
    cursor: pointer;
    font-family: 'FontAwesome';
}

.header-post {
    margin-bottom: 10px;
}

.header-post .subheader-post {
    display: flex;
    flex: 1 1 0%;
    flex-flow: row wrap;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: start;
    justify-content: flex-start;
}

.header-post .category-post a {
    -webkit-font-smoothing: antialiased;
    color: var(--color1);
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

.header-post .category-post {
    padding-right: 4px;
}

.header-post .title-post {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 10px 0px 0px;
}

.header-post .title-post h1 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 34px;
    line-height: 42px;
    font-weight: 700;
    text-align: left;
    margin-top: 0px;
    margin-bottom: 0px;
}

.post-detail {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-family: "PT Serif", Georgia, serif;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    margin-bottom: 20px;
    max-width: 644px;
}

.post-detail a {
    color: var(--color1);
}

.post-detail h1,
.post-detail h2,
.post-detail h3,
.post-detail h4,
.post-detail h5,
.post-detail h6 {
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
}

.post-row {
    display: flex;
    margin-bottom: 15px;
    margin-top: 15px;
    flex-wrap: nowrap;
}

.post-article {
    flex: 1;
}

.article-adv {
    width: 160px;
    margin-left: 15px;
    margin-top: 8px;
}

.sticky-post {
    position: sticky;
    top: 100px;
}

.sticky-post .widget {
    margin-bottom: 30px;
    width: 160px;
    height: 600px;
}

.post-detail.notfull {
    max-width: 469px;
}

.post-detail .block-image img {
    display: block;
}

.post-detail .block-image img.featured-image {
    width: 100%;
    height: auto;
}

.post-detail .block-image a {
    position: relative;
    display: block;
}

.post-detail figcaption,
.article-featured figcaption {
    width: 100%;
    -webkit-font-smoothing: antialiased;
    color: #999999;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    margin: 0px;
    font-family: Heebo, sans-serif;
}

.image-box {
    position: relative;
    margin-bottom: 5px;
}

.post-detail figure {
    max-width: 100%;
}

.tag-post {
    margin-bottom: 20px;
}

.tag-post ul {
    padding: 0;
    margin: 0;
    display: flex;
    flex-flow: row wrap;
    align-items: flex-start;
    -webkit-box-pack: start;
    justify-content: flex-start;
    list-style: none;
    gap: 5px;
}

.tag-post ul li {
    display: flex;
    -webkit-box-flex: 0;
    flex: 0 0 auto;
}

.tag-post ul li a {
    display: block;
    padding: 6px 8px;
    overflow: hidden;
    border-radius: 50em;
    border-width: 1px;
    border-style: solid;
    border-color: var(--color1);
    background-color: transparent;
    -webkit-font-smoothing: antialiased;
    color: var(--color1);
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    max-width: 150px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* RELATED */
.related-item {
    flex: 1 1 0%;
}

.related-item .related-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding: 10px;
    overflow: hidden;
    border-radius: var(--border-radius);
    background-color: #eeeeee;
    color: #000000;
    margin: 0px;
    font-family: Heebo, sans-serif;
}

.related-item .related-content {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
}

.related-item .related-label {
    -webkit-font-smoothing: antialiased;
    color: var(--color1);
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.related-item .related-title a {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
}

.related-item .related-title a {
    color: #000000;
    word-break: break-word;
    overflow-wrap: break-word;
    display: block;
}

.related-item .related-image {
    margin-left: 16px;
    width: 80px;
    position: relative;
    border-radius: var(--border-radius);
    height: 80px;
    background: #eeeeee;
    overflow: hidden;
}

.related-item .related-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #dfdfdf;
    animation: shine 1s infinite;
}

.related-item .related-image:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: "";
}

.related-item .related-image a {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}

.related-item .related-image img {
    z-index: 2;
    display: block;
    border-radius: var(--border-radius);
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: relative;
}

.related-item .related-author {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 6px;
}

.related-item .related-author img {
    margin-right: 6px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 1px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 500;
    border-radius: 50%;
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.related-item .related-author-name {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    font-size: 12px;
    font-weight: 400;
    word-break: break-all;
    white-space: normal;
    line-height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #767676;
}

.related-item .icon-verification {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 12px;
    max-width: 12px;
    height: 12px;
    background-image: url("../icon/verified-round.svg");
    background-size: 12px;
    background-repeat: no-repeat;
}

.related-item .dot {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.related-item .timeago {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.related-author .dot:before {
    content: "\00B7";
    margin: 0 4px;
}

.redaksi .redaksi-header {
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    margin-top: 8px;
    margin-bottom: 8px;
}

.redaksi .redaksi-avatar {
    display: flex;
    flex: 1 1 0%;
}

.redaksi .redaksi-avatar-box {
    padding-right: 12px;
}

.redaksi .redaksi-avatar-box .image-ava {
    margin-right: -25px;
    display: inline-block;
    width: 30px;
    height: 30px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 50%;
    background: #eee;
    position: relative;
    text-align: center;
    vertical-align: middle;
}

.redaksi .redaksi-avatar-box img {
    display: block;
    border-radius: 50%;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.redaksi .btn-redaksi {
    appearance: none;
    user-select: none;
    padding: 0px;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    background: none transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    width: auto;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    display: flex;
    flex-direction: row-reverse;
    -webkit-box-align: center;
    align-items: center;
}

.redaksi .icon-arrow {
    display: flex;
    margin-left: 8px;
    -webkit-box-pack: center;
    justify-content: center;
    filter: invert(0%) sepia(6%) saturate(26%) hue-rotate(336deg) brightness(103%) contrast(100%);
    width: 20px;
    max-width: 20px;
    height: 20px;
    background-image: url("../icon/drop-down.svg");
    background-position: center;
    background-size: 20px;
    background-repeat: no-repeat;
}

.redaksi .label-btn {
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
}

.redaksi .redaksi-content {
    margin-top: 8px;
}

.redaksi .redaksi-content.hide {
    display: none;
}

.redaksi .author-item {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    padding-top: 8px;
    padding-bottom: 8px;
}

.redaksi .author-image {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    padding: 0px;
    width: 48px;
    height: 48px;
    overflow: hidden;
    background: #eeeeee;
    color: #ffffff;
    border-radius: 50%;
    margin-right: 6px;
}

.redaksi .author-image img {
    display: block;
    border-radius: var(--border-radius);
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.redaksi .author-text {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    padding-right: 8px;
}

.redaksi .author-name {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
}

.redaksi .author-role {
    -webkit-font-smoothing: antialiased;
    color: #6c6c6c;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

.icon-verification2 {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    margin-left: 6px;
    width: 20px;
    max-width: 20px;
    height: 20px;
    background-size: 20px;
    background-repeat: no-repeat;
    border-radius: 50em;
    background-image: url("data:image/svg+xml,%0A%3Csvg viewBox='0 0 22 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z' fill='%231d9bf0'%3E%3C/path%3E%3C/svg%3E%0A");
}

.author-share {
    display: flex;
    flex-direction: row;
    margin-top: 16px;
}

.author-share a {
    margin-left: 12px;
    margin-right: 12px;
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    width: 24px;
    max-width: 24px;
    height: 24px;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}

.author-share .url {
    background-image: url(../icon/site.svg);
}

.author-share .facebook {
    background-image: url(../icon/facebook.svg);
}

.author-share .twitter {
    background-image: url(../icon/twitter.svg);
}

.author-share .instagram {
    background-image: url(../icon/instagram.svg);
}

.share-transparent {
    z-index: 1000;
    transition: opacity 0.1s ease 0s;
    position: fixed;
    inset: 0px;
    background: #000000;
    opacity: 0.8;
    top: 0;
    display: none;
}

.share-popup {
    padding: 24px;
    background-color: #ffffff;
    color: #000000;
    transition: all 0.1s linear 0s;
    position: fixed;
    z-index: 1001;
    border-radius: var(--border-radius);
    min-width: 336px;
    max-height: 98%;
    overflow-y: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;
}

.share-popup .share-header {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.share-popup .share-title {
    display: flex;
    flex: 1 1 0%;
    text-align: center;
    width: 100%;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: end;
    justify-content: center;
    font-weight: 600;
}

.share-popup .close-popup {
    appearance: none;
    user-select: none;
    font-family: inherit;
    padding: 0px;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    display: inline-block;
    background: none transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none !important;
    filter: invert(0%) sepia(6%) saturate(26%) hue-rotate(336deg) brightness(103%) contrast(100%);
    width: 24px;
    max-width: 24px;
    height: 24px;
    background-image: url(../icon/close.svg);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
}

.share-popup .share-content {
    display: flex;
    flex: 1 1 0%;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 10px;
    -webkit-box-pack: center;
    justify-content: center;
}

.share-popup .share-content a,
.share-popup .share-content button {
    appearance: none;
    user-select: none;
    font-family: inherit;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    display: inline-block;
    border-radius: 50%;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    margin: 8px;
    width: 32px;
    height: 32px;
    background-size: 32px;
    background-repeat: no-repeat;
    background-position: center;
}

.share-popup .share-content .whatsapp {
    background-image: url(../icon/wa.svg);
}

.share-popup .share-content .facebook {
    background-image: url(../icon/facebook.svg);
}

.share-popup .share-content .twitter {
    background-image: url(../icon/twitter.svg);
}

.share-popup .share-content .line {
    background-image: url(../icon/line.svg);
}

.share-popup .share-content .copylink {
    background-image: url(../icon/copylink.svg);
}

.copylink-popup {
    display: none;
    position: sticky;
    top: 130px;
    width: 100%;
    z-index: 998;
    padding: 12px 20px;
    background-color: #49a849;
    width: 986px;
    margin: 0px auto;
    border-radius: 50em;
}

.copylink-flex {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}

.copylink-text {
    display: flex;
    flex: 1 1 0%;
    width: 100%;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: end;
    font-weight: 600;
    text-align: left;
    color: #fff;
}

.copylink-close {
    appearance: none;
    user-select: none;
    font-family: inherit;
    padding: 0px;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    display: inline-block;
    background: none transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    filter: invert(100%) sepia(0%) saturate(1534%) hue-rotate(43deg) brightness(114%) contrast(100%);
    width: 20px;
    max-width: 20px;
    height: 20px;
    background-image: url(../icon/close.svg);
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center;
}

/* COMMENT */
.comment-reply-title {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding-left: 12px;
    padding-top: 8px;
    padding-bottom: 8px;
    position: relative;
    margin: 0;
    font-size: 20px;
}

.comment-reply-title:before {
    content: "";
    position: absolute;
    left: 0px;
    width: 6px;
    height: 18px;
    background: var(--color1);
}

.comment-reply-title a {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-font-smoothing: antialiased;
    color: var(--color1);
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
}

.comments_title {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding-left: 12px;
    padding-top: 8px;
    padding-bottom: 8px;
    position: relative;
    margin: 0 0 1em;
    font-size: 20px;
}

.comments_title:before {
    content: "";
    position: absolute;
    left: 0px;
    width: 6px;
    height: 18px;
    background: var(--color1);
}

.logged-in-as a {
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    word-break: break-all;
}

.comment-form {
    flex: 1 1 0%;
    align-items: flex-end;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.logged-in-as {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

input#author {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    display: flex;
    border-radius: 5px;
    background-color: #ffffff;
    border: 1px solid #eeeeee;
    padding: 8px;
    transition: all 0.2s ease 0s;
    word-break: break-word;
    position: relative;
    outline: none;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    resize: none;
    margin-bottom: 10px;
    max-width: 100%;
}

input#email {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    display: flex;
    border-radius: 5px;
    background-color: #ffffff;
    border: 1px solid #eeeeee;
    padding: 8px;
    transition: all 0.2s ease 0s;
    word-break: break-word;
    position: relative;
    outline: none;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    resize: none;
    margin-bottom: 10px;
    max-width: 100%;
}

textarea#comment {
    display: flex;
    margin-right: 12px;
    border-radius: 5px;
    background-color: #ffffff;
    border: 1px solid #eeeeee;
    padding: 8px;
    transition: all 0.2s ease 0s;
    min-height: 58px;
    word-break: break-word;
    position: relative;
    outline: none;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    resize: none;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 10px;
}

.form-submit {
    position: relative;
    margin-top: 0;
    min-height: 40px;
    width: 100%;
    height: 40px;
    margin-bottom: 0;
}

.form-submit .submit {
    color: transparent;
    display: block;
    border-radius: 50%;
    border: 1px solid #e5e5e5;
    transition: all 0.2s ease 0s;
    cursor: pointer;
    background-color: transparent;
    width: 40px;
    height: 40px;
    position: absolute;
    right: 0;
}

.form-submit:before {
    content: "";
    background-image: url("../icon/submit.svg");
    background-size: 24px;
    width: 24px;
    height: 24px;
    display: block;
    text-align: center;
    position: absolute;
    top: 8px;
    right: 8px;
    filter: invert(100%) sepia(0%) saturate(7471%) hue-rotate(57deg) brightness(106%) contrast(60%);
}

.commentsArea ol {
    margin: 0;
    list-style: none;
    padding: 0 0 20px;
    border-bottom: 1px solid #eeeeee;
}

.comment-respond {
    padding-bottom: 20px;
}

.comment-success {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    margin-bottom: 20px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-left: 4px solid #16a34a;
    border-radius: 6px;
    color: #15803d;
    font-size: 14px;
    line-height: 1.5;
}

.comment-success::before {
    content: "✓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #16a34a;
    color: #fff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: bold;
    flex-shrink: 0;
    margin-top: 1px;
}

.comment-error {
    display: block;
    color: #dc2626;
    font-size: 12px;
    margin-top: 4px;
    margin-bottom: 4px;
}

.commentsArea ul {
    list-style: none;
}

.commentsArea ul ul {
    padding: 0;
}

.comment-notes {
    color: #999999;
}

.commentBox {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-bottom: 20px;
}

.commentAvatar {
    width: 32px;
    border-radius: 50%;
    height: 32px;
    background: #eee;
}

.commentAvatar img {
    display: block;
    border-radius: 50%;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.commentBody {
    margin-bottom: 4px;
    padding-left: 12px;
    padding-right: 12px;
    -ms-flex: 1;
    flex: 1;
}

.commentAuthorName,
.commentAuthorName a {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.commentBodyText {
    font-size: 14px;
    position: relative;
    line-height: 1.25;
    word-break: break-word;
    overflow-wrap: break-word;
    margin: 0 0 5px 0;
}

.commentBodyModeration {
    background-color: #eeeeee;
    padding: 5px;
    border-radius: var(--border-radius);
    color: #999999;
}

.commentBodyText p {
    margin: 0 0 5px 0;
}

.commentReplyTo {
    float: left;
    margin-right: 5px;
    font-weight: 600;
}

.commentBodyFooter {
    -webkit-font-smoothing: antialiased;
    color: #999999;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
}

.commentBodyFooter a {
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    color: #999999;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
}

.commentBodyFooter time::after,
.commentBodyFooter a::after {
    content: "\00B7";
    margin: 0 4px;
    font-weight: normal;
}

.commentBodyFooter a:last-child::after {
    content: "";
}

.navigation.comments-pagination {
    text-align: center;
    border-top: 1px solid #e6e8ea;
    padding-top: 10px;
}

.comments-pagination {
    padding-top: 12px;
    padding-bottom: 12px;
    appearance: none;
    user-select: none;
    font-family: inherit;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    cursor: not-allowed;
    vertical-align: middle;
    text-align: center;
}

.endLoadMore {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    justify-content: center;
    color: #999;
}

.iconCheck {
    margin-right: 8px;
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url(../icon/check-circle-green.svg);
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: center;
}

.loadingLoadMore {
    text-align: center;
    display: none;
    justify-content: center;
}

.no-more {
    display: none;
    justify-content: center;
}

.loadingLoadMore span {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background-color: var(--color1);
    margin: 4px 2px;
    opacity: 0;
}

.loadingLoadMore span:nth-child(1) {
    animation: 1s ease-in-out 0s infinite normal none running opacitychange;
}

.loadingLoadMore span:nth-child(2) {
    animation: 1s ease-in-out 0.33s infinite normal none running opacitychange;
}

.loadingLoadMore span:nth-child(3) {
    animation: 1s ease-in-out 0.66s infinite normal none running opacitychange;
}

@-webkit-keyframes opacitychange {

    0%,
    100% {
        opacity: 0;
    }

    60% {
        opacity: 1;
    }
}

@keyframes opacitychange {

    0%,
    100% {
        opacity: 0;
    }

    60% {
        opacity: 1;
    }
}

/* TRENDING */
.trending-wrapper {
    max-width: 1024px;
    padding: 0px 20px;
    margin: 0px auto;
}

.trending-header {
    text-align: center;
}

.trending-header h1 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 26px;
    font-weight: 700;
    text-align: center;
    margin: 0;
    margin-bottom: 20px;
}

.trending-content {
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    max-width: 640px;
    margin: 40px auto;
}

.trending-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    width: 100%;
}

.trending-menu {
    display: flex;
    flex: 1 1 0%;
}

.trending-article {
    background-color: #ffffff;
    color: #000000;
    border-top: 1px solid #eeeeee;
}

.trending-menu nav {
    box-sizing: border-box;
    display: block;
    height: inherit;
    position: relative;
    width: 100%;
    flex: 1 1 0%;
    overflow: visible;
    background: #f7f7f7;
}

.trending-menu ul.widget {
    width: 100%;
    margin: 0px;
    padding: 0px;
    display: flex;
    z-index: 1;
    list-style: none;
}

.trending-menu ul li {
    min-width: max-content;
}

.trending-menu ul li a {
    flex: 1 1 0%;
    appearance: none;
    user-select: none;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    background: none transparent;
    width: 100%;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    padding: 12px;
    -webkit-font-smoothing: antialiased;
    color: #999999;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    display: block;
}

.trending-menu .menu-image-title {
    padding: 0;
}

.page-template-trending .list-wrap {
    display: unset;
    flex-direction: unset;
    margin: unset;
}

.page-template-trending .list .list-item {
    display: unset;
    -ms-flex: unset;
    flex: unset;
    max-width: unset;
    margin-bottom: 0;
    padding: 0;
}

.trending-article .widget {
    padding-bottom: 0;
}

.trending-menu ul li.current-menu-item a {
    border-bottom: 5px solid var(--color1);
}

.page-template-trending .list .list-item .list-box {
    border: 0;
    margin: 16px 20px 0;
    border-bottom: 1px solid #eeeeee;
    padding: 0 0 16px 0;
}

.trending-article p {
    margin: 0;
}

/* TERKINI */
.terkini-wrapper {
    max-width: 1024px;
    padding: 0px 20px;
    margin: 0px auto;
}

.terkini-header {
    text-align: center;
}

.terkini-header h1 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 40px;
    line-height: 60px;
    font-weight: 700;
    text-align: center;
}

.terkini-content {
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    max-width: 640px;
    margin: 0 auto;
}

.terkini-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    width: 100%;
}

.terkini-menu {
    display: flex;
    flex: 1 1 0%;
}

.terkini-article {
    background-color: #ffffff;
    color: #000000;
    border-top: 1px solid #eeeeee;
}

.terkini-menu nav {
    box-sizing: border-box;
    display: block;
    height: inherit;
    position: relative;
    width: 100%;
    flex: 1 1 0%;
    overflow: visible;
    background: #e5e5e5;
}

.terkini-menu ul.widget {
    width: 100%;
    margin: 0px;
    padding: 0px;
    display: flex;
    z-index: 1;
    list-style: none;
    overflow: auto;
}

.terkini-menu ul li {
    min-width: max-content;
}

.terkini-menu ul li a {
    flex: 1 1 0%;
    appearance: none;
    user-select: none;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    background: none transparent;
    width: 100%;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    padding: 12px;
    -webkit-font-smoothing: antialiased;
    color: #6c6c6c;
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
    display: block;
}

.terkini-menu .menu-image-title {
    padding: 0;
}

.page-template-terkini .list-wrap {
    display: unset;
    flex-direction: unset;
    margin: unset;
}

.page-template-terkini .list .list-item {
    display: unset;
    -ms-flex: unset;
    flex: unset;
    max-width: unset;
    margin-bottom: 0;
    padding: 0;
}

.terkini-article .widget {
    padding-bottom: 0;
}

.terkini-menu ul li.current-menu-item a {
    border-bottom: 3px solid var(--color1);
    color: var(--color1);
}

.page-template-terkini .list .list-item .list-box {
    border: 0;
    margin: 16px 20px 0;
    border-bottom: 1px solid #eeeeee;
    padding: 0 0 16px 0;
}

.terkini-article p {
    margin: 0;
}

/* ARCHIVR */
.archive-wrapper {
    color: #000000;
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    max-width: 640px;
    margin: 6px auto;
}

.archive-wrapper .archive-header {
    display: flex;
    flex-direction: column;
    border-radius: 0px;
    overflow: hidden;
    border-bottom: 1px solid #eeeeee;
}

.popu .archive-header {
    display: flex;
    flex-direction: column;
    border-radius: 0px;
    overflow: hidden;
    border-bottom: 1px solid #eeeeee;
}

.archive-wrapper .author-box {
    display: flex;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
    background-color: #ffffff;
}

.archive-wrapper .author-avatar {
    margin: 40px 0px 20px;
    display: flex;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    border-color: #eeeeee;
    border-style: solid;
    border-width: 4px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0.1rem;
    width: 80px;
    height: 80px;
    font-size: 48px;
    font-weight: 500;
    border-radius: var(--border-radius);
    background: #f6f8fc;
    position: relative;
    text-align: center;
}

.archive-wrapper .author-avatar img {
    display: block;
    border-radius: var(--border-radius);
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.archive-wrapper .author-name {
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
}

.archive-wrapper .author-name h1 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 0px;
}

.archive-wrapper .author-bio {
    margin-top: 8px;
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    text-align: center;
}

.archive-wrapper .archive-content .list-wrap {
    display: unset;
    flex-direction: unset;
    margin: unset;
}

.archive-wrapper .archive-content .list .list-item {
    border: 0;
    border-bottom: 1px solid #eeeeee;
    margin: 0;
}

.archive-wrapper .archive-content .widget {
    padding-bottom: 0;
}

.archive-wrapper .archive-content .list .list-item:last-child {
    border: 0;
}

.archive-wrapper .archive-content {
    border-top: 1px solid #eeeeee;
}

/* TAG PAGE */
.archive-title {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    margin-bottom: 20px;
}

.archive-title h1 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 26px;
    line-height: 1.3;
    font-weight: 700;
    margin-top: 0px;
    margin-bottom: 0px;
}

.archive-main {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
}

body.category .carousel-item {
    width: 664px;
}

body.category .archive-box>* {
    margin-bottom: 20px;
}

.archive-main .archive-article {
    display: flex;
    flex: 1;
}

.archive-article .widget-content {
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background: #ffffff;
}

.archive-main .sidebar {
    width: 300px;
}

.archive-main .list-wrap {
    display: unset;
    flex-direction: unset;
    margin: unset;
}

.archive-main .list .list-item {
    max-width: unset;
    margin-bottom: 0;
    padding: 0;
}

.archive-main .list .list-item .list-box {
    border: 0;
    margin: 16px 20px 0;
    border-bottom: 1px solid #eeeeee;
    padding: 0 0 16px 0;
}

.archive-main .widget {
    padding-bottom: 0;
}

.archive-main2 {
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
}

.archive-main2 .archive-article {
    display: flex;
    flex: 2 1 0%;
    -webkit-box-flex: 2;
    flex-direction: column;
    margin-right: 16px;
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background: #ffffff;
}

.list-count {
    color: var(--color2);
    font-size: 20px;
    font-weight: 700;
    width: 30px;
    line-height: 1;
}

.archive-main .sidebar .list .list-item .list-box {
    background: transparent;
    margin: 0;
}

.archive-main2 .sidebar {
    display: flex;
    flex: 1 1 0%;
    -webkit-box-flex: 1;
    flex-direction: column;
}

.archive-main2 .list-wrap {
    display: unset;
    flex-direction: unset;
    margin: unset;
}

.archive-main2 .list .list-item {
    display: unset;
    -ms-flex: unset;
    flex: unset;
    max-width: unset;
    margin-bottom: 0;
    padding: 0;
}

.archive-main2 .list .list-item .list-box {
    border: 0;
    margin: 16px 20px 0;
    border-bottom: 1px solid #eeeeee;
    padding: 0 0 16px 0;
}

.archive-main2 .widget {
    padding-bottom: 0;
}

.archive-subtitle {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding-left: 12px;
    padding-top: 8px;
    padding-bottom: 8px;
    position: relative;
    margin: 0;
}

.archive-subtitle:before {
    content: "";
    position: absolute;
    left: 0px;
    width: 6px;
    height: 18px;
    background: var(--color1);
}

.popu {
    color: #000000;
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    max-width: 640px;
    margin: 6px auto 32px;
}

.search-wrapper {
    max-width: 1024px;
    padding: 0px 20px;
    margin: 0px auto;
}

.search-header {
    text-align: center;
}

.search-header h1 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    margin: 0;
    margin-bottom: 20px;
}

.search-content {
    overflow: hidden;
    border-radius: var(--border-radius);
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    background-color: #ffffff;
    max-width: 640px;
    margin: 0 auto;
}

.search-content .search-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    width: 100%;
}

.search-content .search-article {
    background-color: #ffffff;
    color: #000000;
}

.search-content .list .list-item {
    display: unset;
    -ms-flex: unset;
    flex: unset;
    max-width: unset;
    margin-bottom: 0;
    padding: 0;
    width: 100%;
}

.search-content .list .list-item .list-box {
    border: 0;
    margin: 16px 20px 0;
    border-bottom: 1px solid #eeeeee;
    padding: 0 0 16px 0;
}

.search-content .widget {
    padding-bottom: 0;
}

/* PAGE */
.page-template-default .article {
    margin: auto;
    padding: 0;
    max-width: 624px;
}

.page-template-default .main {
    background: #fff;
}

.page-template-default .info-post {
    position: relative;
    top: unset;
}

.page-template-default .info-post .subheader-post {
    display: flex;
    flex: 1 1 0%;
    flex-flow: row wrap;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: start;
    justify-content: flex-start;
}

.page-template-default .info-post .timepost {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    padding-right: 4px;
}

.page-template-default .info-post .dot {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    padding-right: 4px;
}

.page-template-default .info-post .readtime {
    -webkit-font-smoothing: antialiased;
    color: #767676;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.page-template-default .info-post .dot:after {
    content: "\00B7";
    margin: 0 4px;
}

.page .info-post .share-box {
    flex: 1 1 0%;
    padding-top: 8px;
    padding-bottom: 8px;
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

/* SIDEBAR */
.sidebar-sticky {
    position: sticky;
    top: 140px;
}

.pagination {
    text-align: right;
    padding: 12px 20px;
}

.paginationNext {
    display: none;
}

.pagination a,
.pagination .btnLoad {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-font-smoothing: antialiased;
    color: var(--color1);
    font-size: 15px;
    line-height: 24px;
    font-weight: 500;
    background: transparent;
    justify-content: flex-end;
    flex-wrap: wrap;
    width: 100%;
    cursor: pointer;
    padding: 0;
}

.pagination a:after,
.pagination .btnLoad:after {
    content: "";
    display: flex;
    margin-left: 8px;
    -webkit-box-pack: center;
    justify-content: center;
    filter: invert(57%) sepia(0%) saturate(61%) hue-rotate(240deg) brightness(105%) contrast(97%);
    width: 20px;
    max-width: 20px;
    height: 20px;
    background-image: url("../icon/chevron-next.svg");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
}

.ads-sticky-bottom {
    margin: 0 auto;
    padding: 0;
    position: fixed;
    bottom: 0;
    width: 728px;
    z-index: 999;
    height: auto;
    text-align: center;
    background: hsla(0, 0%, 100%, .8);
    min-height: 60px;
    max-height: 90px;
    left: 0;
    right: 0
}

.btn-ads-close {
    position: absolute;
    background: #767575;
    display: flex;
    right: calc(50% - 35px);
    top: -24px;
    padding: 2px 2px 2px 10px;
    line-height: 1;
    color: #fff;
    cursor: pointer;
    border-radius: 50em;
    align-items: center;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
}

.ads-close-icon {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: flex;
    width: 17px;
    height: 17px;
    background: #e3e2e2;
    align-items: center;
    justify-content: center;
    border-radius: 50em;
    margin-left: 5px;
}

.ads-close-icon:after,
.ads-close-icon:before {
    content: "";
    position: absolute;
    top: 45%;
    right: 2px;
    width: 65%;
    height: 2px;
    background: #666;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.ads-close-icon:before {
    content: "";
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

footer.footer {
    width: 100%;
    color: #000000;
    background: #f1f1f1;
}

.footer-container {
    margin: 0px auto;
    padding: 32px 20px;
    color: #000000;
    width: 1024px;
}

.footer-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.footer-right .widget {
    padding: 0 30px;
    min-width: 100px;
}

.footer-box .widget ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

.footer .widget-title {
    margin: 0;
    font-size: 16px;
    margin-bottom: 10px;
    color: #000;
}

.footer-box .widget ul li {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    outline: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
    line-height: 16px;
    width: 33.333333%;
}

.footer-box .widget ul li a {
    -webkit-font-smoothing: antialiased;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 6px;
    display: block;
}

.facebook a {
    display: flex;
    align-items: center;
}

.twitter a {
    display: flex;
    align-items: center;
}

.whatsapp a {
    display: flex;
    align-items: center;
}

.telegram a {
    display: flex;
    align-items: center;
}

.instagram a {
    display: flex;
    align-items: center;
}

.youtube a {
    display: flex;
    align-items: center;
}

.tiktok a {
    display: flex;
    align-items: center;
}

.facebook a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5H24a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Zm3,21a3,3,0,0,1-3,3H17V18h4a1,1,0,0,0,0-2H17V14a2,2,0,0,1,2-2h2a1,1,0,0,0,0-2H19a4,4,0,0,0-4,4v2H12a1,1,0,0,0,0,2h3v9H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3Z'%3E%3C/path%3E%3C/svg%3E");
}

.twitter a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 15px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 512 512'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z' fill='%23333'/%3E%3C/svg%3E");
}

.whatsapp a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg height='24' fill='%23333' viewBox='0 0 56.693 56.693' width='24' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg%3E%3Cpath class='st0' d='M46.3802,10.7138c-4.6512-4.6565-10.8365-7.222-17.4266-7.2247c-13.5785,0-24.63,11.0506-24.6353,24.6333 c-0.0019,4.342,1.1325,8.58,3.2884,12.3159l-3.495,12.7657l13.0595-3.4257c3.5982,1.9626,7.6495,2.9971,11.7726,2.9985h0.01 c0.0008,0-0.0006,0,0.0002,0c13.5771,0,24.6293-11.0517,24.635-24.6347C53.5914,21.5595,51.0313,15.3701,46.3802,10.7138z M28.9537,48.6163h-0.0083c-3.674-0.0014-7.2777-0.9886-10.4215-2.8541l-0.7476-0.4437l-7.7497,2.0328l2.0686-7.5558 l-0.4869-0.7748c-2.0496-3.26-3.1321-7.028-3.1305-10.8969c0.0044-11.2894,9.19-20.474,20.4842-20.474 c5.469,0.0017,10.6101,2.1344,14.476,6.0047c3.8658,3.8703,5.9936,9.0148,5.9914,14.4859 C49.4248,39.4307,40.2395,48.6163,28.9537,48.6163z'%3E%3C/path%3E%3Cpath class='st0' d='M40.1851,33.281c-0.6155-0.3081-3.6419-1.797-4.2061-2.0026c-0.5642-0.2054-0.9746-0.3081-1.3849,0.3081 c-0.4103,0.6161-1.59,2.0027-1.9491,2.4136c-0.359,0.4106-0.7182,0.4623-1.3336,0.1539c-0.6155-0.3081-2.5989-0.958-4.95-3.0551 c-1.83-1.6323-3.0653-3.6479-3.4245-4.2643c-0.359-0.6161-0.0382-0.9492,0.27-1.2562c0.2769-0.2759,0.6156-0.7189,0.9234-1.0784 c0.3077-0.3593,0.4103-0.6163,0.6155-1.0268c0.2052-0.4109,0.1027-0.7704-0.0513-1.0784 c-0.1539-0.3081-1.3849-3.3379-1.8978-4.5706c-0.4998-1.2001-1.0072-1.0375-1.3851-1.0566 c-0.3585-0.0179-0.7694-0.0216-1.1797-0.0216s-1.0773,0.1541-1.6414,0.7702c-0.5642,0.6163-2.1545,2.1056-2.1545,5.1351 c0,3.0299,2.2057,5.9569,2.5135,6.3676c0.3077,0.411,4.3405,6.6282,10.5153,9.2945c1.4686,0.6343,2.6152,1.013,3.5091,1.2966 c1.4746,0.4686,2.8165,0.4024,3.8771,0.2439c1.1827-0.1767,3.6419-1.489,4.1548-2.9267c0.513-1.438,0.513-2.6706,0.359-2.9272 C41.211,33.7433,40.8006,33.5892,40.1851,33.281z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.telegram a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath d='M24,28a1,1,0,0,1-.62-.22l-6.54-5.23a1.83,1.83,0,0,1-.13.16l-4,4a1,1,0,0,1-1.65-.36L8.2,18.72,2.55,15.89a1,1,0,0,1,.09-1.82l26-10a1,1,0,0,1,1,.17,1,1,0,0,1,.33,1l-5,22a1,1,0,0,1-.65.72A1,1,0,0,1,24,28Zm-8.43-9,7.81,6.25L27.61,6.61,5.47,15.12l4,2a1,1,0,0,1,.49.54l2.45,6.54,2.89-2.88-1.9-1.53A1,1,0,0,1,13,19a1,1,0,0,1,.35-.78l7-6a1,1,0,1,1,1.3,1.52Z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.instagram a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='sosmed-instagram' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='instagram' transform='translate(3.000000, 3.000000)'%3E%3Crect id='Rectangle-path' stroke='%23333' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' x='0' y='0' width='18' height='18' rx='5'%3E%3C/rect%3E%3Cpath d='M12.6,8.433 C12.8278102,9.96927443 12.0447233,11.4784601 10.6574639,12.1767065 C9.27020449,12.8749529 7.59154371,12.6048336 6.49335506,11.5066449 C5.39516641,10.4084563 5.12504715,8.72979551 5.82329354,7.34253613 C6.52153993,5.95527674 8.03072557,5.17218981 9.567,5.4 C11.1356791,5.6326154 12.3673846,6.86432091 12.6,8.433 Z' id='Shape' stroke='%23333' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3Ccircle id='Oval' fill='%23333' fill-rule='nonzero' cx='14' cy='4' r='1'%3E%3C/circle%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.youtube a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 21px;
    margin-right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='sosmed-youtub' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg id='youtube-(2)' transform='translate(3.000000, 6.000000)' stroke='%23333' stroke-width='1.6'%3E%3Cpath d='M17.6231882,1.87839586 C17.425371,1.12858322 16.8199376,0.536423176 16.035998,0.326002587 C14.6287984,0 9,0 9,0 C9,0 3.37120161,0 1.96400201,0.357050453 C1.18006236,0.567471041 0.574629023,1.15963108 0.376811764,1.90944373 C0.119273421,3.26433804 -0.00670254742,4.63879153 0.000467684954,6.01552393 C-0.00871241546,7.40262224 0.117271541,8.78755638 0.376811764,10.152652 C0.594723415,10.8785948 1.19661504,11.443743 1.96400201,11.6429495 C3.37120161,12 9,12 9,12 C9,12 14.6287984,12 16.035998,11.6429495 C16.8199376,11.432529 17.425371,10.8403689 17.6231882,10.0905563 C17.8787399,8.74586427 18.0047079,7.38188946 17.9995323,6.01552393 C18.0087124,4.62842563 17.8827285,3.24349148 17.6231882,1.87839586 Z' id='Shape'%3E%3C/path%3E%3Cpolygon id='Shape' points='7 9 12 6 7 3'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
}

.tiktok a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5H24a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Zm3,21a3,3,0,0,1-3,3H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3Z'%3E%3C/path%3E%3Cpath d='M22,12a3,3,0,0,1-3-3,1,1,0,0,0-2,0V19a3,3,0,1,1-3-3,1,1,0,0,0,0-2,5,5,0,1,0,5,5V13a4.92,4.92,0,0,0,3,1,1,1,0,0,0,0-2Z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.footer-box .widget ul li.facebook a {
    display: flex;
    align-items: center;
}

.footer-box .widget ul li.twitter a {
    display: flex;
    align-items: center;
}

.footer-box .widget ul li.whatsapp a {
    display: flex;
    align-items: center;
}

.footer-box .widget ul li.telegram a {
    display: flex;
    align-items: center;
}

.footer-box .widget ul li.instagram a {
    display: flex;
    align-items: center;
}

.footer-box .widget ul li.youtube a {
    display: flex;
    align-items: center;
}

.footer-box .widget ul li.tiktok a {
    display: flex;
    align-items: center;
}

.footer-box .widget ul li.facebook a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5H24a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Zm3,21a3,3,0,0,1-3,3H17V18h4a1,1,0,0,0,0-2H17V14a2,2,0,0,1,2-2h2a1,1,0,0,0,0-2H19a4,4,0,0,0-4,4v2H12a1,1,0,0,0,0,2h3v9H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3Z'%3E%3C/path%3E%3C/svg%3E");
}

.footer-box .widget ul li.twitter a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 15px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 512 512'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z' fill='%23333'/%3E%3C/svg%3E");
}

.footer-box .widget ul li.whatsapp a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg height='24' fill='%23333' viewBox='0 0 56.693 56.693' width='24' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg%3E%3Cpath class='st0' d='M46.3802,10.7138c-4.6512-4.6565-10.8365-7.222-17.4266-7.2247c-13.5785,0-24.63,11.0506-24.6353,24.6333 c-0.0019,4.342,1.1325,8.58,3.2884,12.3159l-3.495,12.7657l13.0595-3.4257c3.5982,1.9626,7.6495,2.9971,11.7726,2.9985h0.01 c0.0008,0-0.0006,0,0.0002,0c13.5771,0,24.6293-11.0517,24.635-24.6347C53.5914,21.5595,51.0313,15.3701,46.3802,10.7138z M28.9537,48.6163h-0.0083c-3.674-0.0014-7.2777-0.9886-10.4215-2.8541l-0.7476-0.4437l-7.7497,2.0328l2.0686-7.5558 l-0.4869-0.7748c-2.0496-3.26-3.1321-7.028-3.1305-10.8969c0.0044-11.2894,9.19-20.474,20.4842-20.474 c5.469,0.0017,10.6101,2.1344,14.476,6.0047c3.8658,3.8703,5.9936,9.0148,5.9914,14.4859 C49.4248,39.4307,40.2395,48.6163,28.9537,48.6163z'%3E%3C/path%3E%3Cpath class='st0' d='M40.1851,33.281c-0.6155-0.3081-3.6419-1.797-4.2061-2.0026c-0.5642-0.2054-0.9746-0.3081-1.3849,0.3081 c-0.4103,0.6161-1.59,2.0027-1.9491,2.4136c-0.359,0.4106-0.7182,0.4623-1.3336,0.1539c-0.6155-0.3081-2.5989-0.958-4.95-3.0551 c-1.83-1.6323-3.0653-3.6479-3.4245-4.2643c-0.359-0.6161-0.0382-0.9492,0.27-1.2562c0.2769-0.2759,0.6156-0.7189,0.9234-1.0784 c0.3077-0.3593,0.4103-0.6163,0.6155-1.0268c0.2052-0.4109,0.1027-0.7704-0.0513-1.0784 c-0.1539-0.3081-1.3849-3.3379-1.8978-4.5706c-0.4998-1.2001-1.0072-1.0375-1.3851-1.0566 c-0.3585-0.0179-0.7694-0.0216-1.1797-0.0216s-1.0773,0.1541-1.6414,0.7702c-0.5642,0.6163-2.1545,2.1056-2.1545,5.1351 c0,3.0299,2.2057,5.9569,2.5135,6.3676c0.3077,0.411,4.3405,6.6282,10.5153,9.2945c1.4686,0.6343,2.6152,1.013,3.5091,1.2966 c1.4746,0.4686,2.8165,0.4024,3.8771,0.2439c1.1827-0.1767,3.6419-1.489,4.1548-2.9267c0.513-1.438,0.513-2.6706,0.359-2.9272 C41.211,33.7433,40.8006,33.5892,40.1851,33.281z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.footer-box .widget ul li.telegram a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath d='M24,28a1,1,0,0,1-.62-.22l-6.54-5.23a1.83,1.83,0,0,1-.13.16l-4,4a1,1,0,0,1-1.65-.36L8.2,18.72,2.55,15.89a1,1,0,0,1,.09-1.82l26-10a1,1,0,0,1,1,.17,1,1,0,0,1,.33,1l-5,22a1,1,0,0,1-.65.72A1,1,0,0,1,24,28Zm-8.43-9,7.81,6.25L27.61,6.61,5.47,15.12l4,2a1,1,0,0,1,.49.54l2.45,6.54,2.89-2.88-1.9-1.53A1,1,0,0,1,13,19a1,1,0,0,1,.35-.78l7-6a1,1,0,1,1,1.3,1.52Z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.footer-box .widget ul li.instagram a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='sosmed-instagram' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='instagram' transform='translate(3.000000, 3.000000)'%3E%3Crect id='Rectangle-path' stroke='%23333' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' x='0' y='0' width='18' height='18' rx='5'%3E%3C/rect%3E%3Cpath d='M12.6,8.433 C12.8278102,9.96927443 12.0447233,11.4784601 10.6574639,12.1767065 C9.27020449,12.8749529 7.59154371,12.6048336 6.49335506,11.5066449 C5.39516641,10.4084563 5.12504715,8.72979551 5.82329354,7.34253613 C6.52153993,5.95527674 8.03072557,5.17218981 9.567,5.4 C11.1356791,5.6326154 12.3673846,6.86432091 12.6,8.433 Z' id='Shape' stroke='%23333' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3Ccircle id='Oval' fill='%23333' fill-rule='nonzero' cx='14' cy='4' r='1'%3E%3C/circle%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.footer-box .widget ul li.youtube a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 21px;
    margin-right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='sosmed-youtub' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg id='youtube-(2)' transform='translate(3.000000, 6.000000)' stroke='%23333' stroke-width='1.6'%3E%3Cpath d='M17.6231882,1.87839586 C17.425371,1.12858322 16.8199376,0.536423176 16.035998,0.326002587 C14.6287984,0 9,0 9,0 C9,0 3.37120161,0 1.96400201,0.357050453 C1.18006236,0.567471041 0.574629023,1.15963108 0.376811764,1.90944373 C0.119273421,3.26433804 -0.00670254742,4.63879153 0.000467684954,6.01552393 C-0.00871241546,7.40262224 0.117271541,8.78755638 0.376811764,10.152652 C0.594723415,10.8785948 1.19661504,11.443743 1.96400201,11.6429495 C3.37120161,12 9,12 9,12 C9,12 14.6287984,12 16.035998,11.6429495 C16.8199376,11.432529 17.425371,10.8403689 17.6231882,10.0905563 C17.8787399,8.74586427 18.0047079,7.38188946 17.9995323,6.01552393 C18.0087124,4.62842563 17.8827285,3.24349148 17.6231882,1.87839586 Z' id='Shape'%3E%3C/path%3E%3Cpolygon id='Shape' points='7 9 12 6 7 3'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
}

.footer-box .widget ul li.tiktok a:before {
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    background-size: 19px;
    margin-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg fill='%23333' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5H24a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Zm3,21a3,3,0,0,1-3,3H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3Z'%3E%3C/path%3E%3Cpath d='M22,12a3,3,0,0,1-3-3,1,1,0,0,0-2,0V19a3,3,0,1,1-3-3,1,1,0,0,0,0-2,5,5,0,1,0,5,5V13a4.92,4.92,0,0,0,3,1,1,1,0,0,0,0-2Z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.widget.app .widget-content {
    display: flex;
    gap: 10px;
    align-items: center;
}

.widget.app .widget-content img {
    display: block;
    height: 35px;
    width: auto;
}

.footer-box .widget {
    -webkit-font-smoothing: antialiased;
    color: #333;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    margin-bottom: 20px;
}

.footer-box .widget .textwidget strong {
    font-weight: bold;
}

.footer-left {
    width: 50%;
    font-weight: 600;
}

.footer-box .widget ul li:last-child::after {
    display: none;
}

/* CUSTOM MENU */
.custommenu ul li a {
    background-color: var(--color1);
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    border-radius: var(--border-radius);
    padding: 8px;
    overflow: hidden;
    color: #Fff;
    justify-content: center;
    flex-direction: column;
    height: 100%;
}

.widget.custommenu {
    padding: 20px;
    background: #e1e0e0;
    border-radius: 10px;
}

.custommenu ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style: none;
    gap: 20px;
}

body.single .custommenu ul {
    gap: 10px;
}

.custommenu ul li {
    width: calc(16.666666% - 17px);
}

.custommenu ul li span {
    -webkit-font-smoothing: antialiased;
    color: #ffffff;
    font-size: 12px;
    line-height: 14px;
    font-weight: 500;
    text-align: center;
}

.custommenu .menu-item a img {
    filter: brightness(0) invert(1);
    padding: 0;
    height: 30px;
    margin: 0;
    margin-bottom: 5px;
    width: auto;
}

.custommenu ul li.color1 a {
    background-color: var(--menu1);
}

.custommenu ul li.color2 a {
    background-color: var(--menu2);
}

.custommenu ul li.color3 a {
    background-color: var(--menu3);
}

.custommenu ul li.color4 a {
    background-color: var(--menu4);
}

.custommenu ul li.color5 a {
    background-color: var(--menu5);
}

.custommenu ul li.color6 a {
    background-color: var(--menu6);
}

body.single .custommenu ul li {
    width: calc(33.333333% - 7px);
}

body.single .custommenu ul li a {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 15px;
}

body.single .custommenu ul li a img {
    height: 20px;
    margin-bottom: 0;
    margin-right: 10px;
}

.transparent-footer {
    z-index: 888;
    transition: opacity 0.1s ease 0s;
    position: fixed;
    inset: 0px;
    background: #000000;
    opacity: 0.8;
    margin-top: 0;
    display: none;
}

/* 404 */
.notfound-box {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    color: #000000;
    height: 100vh;
}

.notfound-box .notfound-wrap {
    display: flex;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}

.notfound-box .notfound-image {
    background-color: transparent;
    float: left;
}

.notfound-box .img-404 {
    padding-bottom: 100%;
    width: 200px;
    height: 0px;
    position: relative;
    overflow: hidden;
    background: url("../img/404.png") center center / cover repeat;
}

.notfound-box .notfound-title {
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
    margin-top: 10px;
    text-align: center;
}

.notfound-box .notfound-title h1 {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    margin: 0;
}

.notfound-box .notfound-desc {
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    margin-top: 10px;
    text-align: center;
}

.notfound-box .notfound-desc p {
    -webkit-font-smoothing: antialiased;
    color: #000000;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    text-align: center;
    margin: 0;
}

.notfound-box .notfound-button a {
    appearance: none;
    user-select: none;
    outline: 0px;
    transition: all 0.2s ease 0s;
    position: relative;
    display: inline-block;
    background: none var(--color1);
    border: 0px solid transparent;
    border-radius: 3px;
    width: auto;
    cursor: pointer;
    opacity: 1;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    padding: 8px 16px;
    -webkit-font-smoothing: antialiased;
    color: #ffffff;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.notfound-box .notfound-button {
    padding-top: 20px;
}

/* STICKY ADS */
.sticky-ads-left {
    position: fixed;
    top: 7.5rem;
    left: 49%;
    margin-left: -660px;
    z-index: 3;
    text-align: left;
    width: 160px;
    height: 100vh;
}

.sticky-ads-right {
    position: fixed;
    top: 7.5rem;
    right: 49%;
    margin-right: -660px;
    z-index: 3;
    text-align: left;
    width: 160px;
    height: 100vh;
}

.sticky-ads-left .widget,
.sticky-ads-right .widget {
    flex: 1 1 0%;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    min-height: 600px;
    text-align: center;
    display: block;
    background-color: #eeeeee;
    overflow: visible;
    max-width: 160px;
}

.post-detail .block-image {
    position: relative;
}

.btn-viewbox {
    position: absolute;
    right: 0;
    bottom: 0;
}

.article-featured img,
.post-detail figure img {
    border-radius: var(--border-radius);
    width: 100%;
    height: auto;
}

.wp-block-embed__wrapper iframe {
    border-radius: var(--border-radius);
}

button.btn-biew {
    opacity: 0.5;
    margin: 10px;
    border-radius: var(--border-radius);
    width: fit-content;
    background-color: #000000;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    padding: 4px 8px;
    cursor: pointer;
}

.icon-serch {
    width: 16px;
    max-width: 16px;
    height: 16px;
    background-image: url("../icon/search-gray.svg");
    background-size: 16px;
    background-position: center;
    background-repeat: no-repeat;
    margin-right: 4px;
}

.text-view {
    -webkit-font-smoothing: antialiased;
    color: #ffffff;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}

#spotlight .header {
    box-shadow: none;
}

#spotlight .footer .title {
    font-weight: 700;
}

#spotlight .footer .description {
    font-size: 14px;
    color: #999;
}

#spotlight .footer {
    max-width: 640px;
    margin: 0 auto;
    right: 0;
    left: 0;
}

.comment-form-cookies-consent label {
    font-size: 14px;
    margin-left: 35px;
    color: #999999;
}

.comment-form-cookies-consent {
    display: flex;
    align-items: flex-start;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    margin-top: 0;
}

.comment-form-cookies-consent #wp-comment-cookies-consent {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.comment-form-cookies-consent label:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #c9c9c9;
    display: block;
    cursor: pointer;
    font-size: 17px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-radius: 5px;
}

.comment-form-cookies-consent #wp-comment-cookies-consent:checked~ ::before {
    content: "";
    background: var(--color1);
}

.comment-form-cookies-consent #wp-comment-cookies-consent:checked~ ::after {
    left: 10px;
    top: 6px;
    width: 7px;
    height: 12px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    content: "";
    position: absolute;
    top: 5px;
    left: 9px;
}

#spotlight .footer .title {
    font-weight: 700;
    font-size: 18px;
    line-height: 1.2
}

#spotlight .footer {
    font-size: 12px;
    margin: 0 auto;
    right: 0;
    left: 0;
    max-width: 640px
}

figure.slick-gallery {
    margin-bottom: 0 !important;
}

.pagination-post {
    border-radius: 4px;
    display: flex;
    align-items: center;
    align-content: flex-start;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.pagination-post .paginationPostNum {
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: wrap;
    align-items: center;
    flex: 1;
    width: 100%;
}

.pagination-post .paginationPostLink {
    padding-right: 13px;
    font-size: 14px;
    text-align: left
}

.pagination-post .paginationPostNav a .btn-next,
.pagination-post .showall-page a {
    position: relative;
    display: inline-flex;
    align-items: center;
    text-align: center;
    cursor: pointer;
    vertical-align: top;
    border: 1px solid transparent;
    border-radius: 50em;
    padding: 5px 12px;
    background: var(--color1);
    color: #fff;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
}

.pagination-post .paginationPostNav a .btn-next svg {
    height: 12px;
    margin-left: 10px
}

.pagination-post .paginationPostLabel {
    font-weight: 500;
    font-size: 16px;
    line-height: 18px;
    margin-right: 15px;
}

.pagination-post .paginationPostLink a,
.pagination-post .paginationPostLink span {
    border-radius: 50%;
    background: #c9c7c7;
    color: #fff;
    width: 30px;
    height: 30px;
    display: inline-block;
    margin: 0;
    padding: 6px 11px;
    line-height: 1.4;
    font-weight: 500;
}

.pagination-post .paginationPostLink .post-page-numbers.current {
    background: var(--color1);
    color: #fff
}

.sidebar-sticky .widget {
    margin-bottom: 20px;
}

.footer-right {
    display: flex;
    flex: 1;
    width: 50%;
    flex-direction: column;
}

.footer-left img {
    height: 35px !important;
    width: auto;
}

.banner {
    position: relative;
    display: block;
    margin: 0 auto;
}

.banner:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    /* background: #e1e0e0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 26px;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 6C4.44772 6 4 6.44772 4 7V8H6V7C6 6.44772 5.55228 6 5 6Z' fill='%23999'/%3E%3Cpath d='M11 8H9.5C9.22386 8 9 8.22386 9 8.5C9 8.77614 9.22386 9 9.5 9H11V8Z' fill='%23999'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 4.5C0 3.11929 1.11929 2 2.5 2H12.5C13.8807 2 15 3.11929 15 4.5V10.5C15 11.8807 13.8807 13 12.5 13H2.5C1.11929 13 0 11.8807 0 10.5V4.5ZM4 10V9H6V10H7V7C7 5.89543 6.10457 5 5 5C3.89543 5 3 5.89543 3 7V10H4ZM11 7H9.5C8.67157 7 8 7.67157 8 8.5C8 9.32843 8.67157 10 9.5 10H12V5H11V7Z' fill='%23999'/%3E%3C/svg%3E"); */
}

.banner.ads970250 {
    width: 970px;
    max-width: 100%;
    height: 250px;

}

.banner.ads160600 {
    width: 160px;
    max-width: 100%;
    height: 600px;

}

.banner.ads72890 {
    width: 728px;
    max-width: 100%;
    height: 90px;
}

.banner.ads300600 {
    width: 300px;
    max-width: 100%;
    height: 600px;
}

.banner.ads300300 {
    width: 300px;
    max-width: 100%;
    height: 300px;
}

.grid-title a:hover,
.video-title a:hover,
.collection a:hover .collection-title,
.list .list-title h2 a:hover {
    color: var(--color1);
}

.darkmode .banner:before,
.darkmode .info-post .share-box,
.darkmode .widget.custommenu {
    background-color: #1e1e1e;
}

/* DARKMODE */
.darkmode .header {
    background-color: #2e2e2e;
    box-shadow: #242424 0px 1px 0px;
}

.darkmode .main,
.darkmode .stories ul li img.menu-image-title-after {
    background-color: #262626;
}

.darkmode .trending-menu nav,
.darkmode .terkini-menu nav {
    background: #2e2e2e;
}


.darkmode .grid-box .grid-image:after,
.darkmode .headline-big .headline-image:after,
.darkmode .headline-small .headline-image:after,
.darkmode .collection .collection-image:after,
.darkmode .headline-box .headline-image:after,
.darkmode .video-image:after,
.darkmode .archive-grid-image:after,
.darkmode .list .list-image:after,
.darkmode .related-item .related-image:after,
.darkmode .grid-image:after {
    background-image: linear-gradient(90deg, rgba(21, 23, 27, 0) 0, rgba(21, 23, 27, .2) 20%, rgba(21, 23, 27, .5) 60%, rgba(21, 23, 27, 0));
}


.darkmode footer.footer,
.darkmode .info-post .author-avatar,
.darkmode .related-item .related-box,
.darkmode .video-image,
.darkmode .archive-grid-image,
.darkmode .headline-big .headline-image,
.darkmode .headline-small .headline-image,
.darkmode .grid-box .grid-image,
.darkmode .collection .collection-image,
.darkmode .headline-box .headline-image,
.darkmode .list .list-image,
.darkmode .list .list-author img,
.darkmode .redaksi .redaksi-avatar-box .image-ava,
.darkmode .redaksi .author-image,
.darkmode .commentAvatar,
.darkmode .grid-box .grid-image:before,
.darkmode .headline-big .headline-image:before,
.darkmode .headline-small .headline-image:before,
.darkmode .collection .collection-image:before,
.darkmode .headline-box .headline-image:before,
.darkmode .video-image:before,
.darkmode .archive-grid-image:before,
.darkmode .list .list-image:before,
.darkmode .popu .author-avatar,
.darkmode .archive-wrapper .author-avatar,
.darkmode .sticky-ads-left .widget,
.darkmode .sticky-ads-right .widget,
.darkmode .commentBodyModeration,
.darkmode .grid-image:before {
    background-color: #2e2e2e;
}

.darkmode .related-item .related-image:before {
    background-color: #222831;
}

.darkmode .glider-contain .polling-content,
.darkmode .header-search-wrapper,
.single .darkmode .main,
.darkmode .info-post .info-box,
.darkmode .list .list-box,
.darkmode .grid-box,
.darkmode .grid-box .grid-item-box,
.darkmode .video-content,
.darkmode .archive-grid-content,
.darkmode .trending-content,
.darkmode .trending-article,
.darkmode .terkini-content,
.darkmode .terkini-article,
.darkmode .related-item .related-image,
.darkmode .related-item .related-author img,
.darkmode input#author,
.darkmode input#email,
.darkmode textarea#comment,
.darkmode .share-popup,
.darkmode .search-content .search-article,
.darkmode .search-content,
.darkmode .notfound-box,
.darkmode .archive-main .archive-article,
.darkmode .archive-main2 .archive-article,
.darkmode .archive-wrapper .author-box,
.darkmode .archive-wrapper,
.darkmode .popu .author-box,
.darkmode .popu,
.darkmode .grid2-item .grid-item-box,
.darkmode .archive-article .widget-content,
.darkmode .info-post,
.darkmode .header-menu ul li.menu-item-has-children .sub-menu {
    background-color: #262626;
}

.darkmode .polling-content .polling-choice>.content-choice>.result>.text>.statistik {
    background-color: rgb(32, 76, 105);
}

.darkmode .glider-contain .polling-title a,
.darkmode .polling-content .polling-choice>.content-choice>.result .percent,
.darkmode .polling-content .polling-choice>.content-choice>.result>.text .jawaban,
.darkmode .header-menu ul li a,
.darkmode .info-post .author-name a,
.darkmode .info-post .like-count,
.darkmode .info-post .comment-count,
.darkmode .header-post .title-post h1,
.darkmode .post-detail,
.darkmode .redaksi .label-btn,
.darkmode .redaksi .author-name,
.darkmode .main .widget .widget-title a,
.darkmode .main .widget .widget-title h2,
.darkmode .related-item .related-title h2 a,
.darkmode .list .list-title h2 a,
.darkmode .collection .collection-title,
.darkmode .grid-box .grid-header .grid-title h2,
.darkmode .grid-box .grid-title a,
.darkmode .grid-box .grid-header .grid-title,
.darkmode .video-title h2 a,
.darkmode .archive-grid-title h2 a,
.darkmode .trending-header h1,
.darkmode .terkini-header h1,
.darkmode .comment-respond,
.darkmode input#author,
.darkmode input#email,
.darkmode textarea#comment,
.darkmode .commentsArea,
.darkmode .commentAuthorName,
.darkmode .commentAuthorName a,
.darkmode .share-popup,
.darkmode .search-header h1,
.darkmode .notfound-box .notfound-title h1,
.darkmode .notfound-box .notfound-desc p,
.darkmode .archive-title h1,
.darkmode .archive-wrapper .author-name h1,
.darkmode .popu .author-name h1,
.darkmode .header-input-search,
.darkmode .labelCheck,
.darkmode .stories ul li .menu-image-title,
.darkmode .archive-subtitle,
.darkmode .grid-title a,
.darkmode .pagination-post .paginationPostLabel,
.darkmode .main .widget .widget-title a,
.darkmode .main .widget .widget-title h1,
.darkmode .main .widget .widget-title h3,
.darkmode .footer .widget-title,
.darkmode .related-item .related-title a {
    color: #ffffff;
}

.darkmode .info-post .like-btn,
.darkmode .info-post .comment-btn,
.darkmode .info-post .share-btn.more,
.darkmode .redaksi .icon-arrow,
.darkmode .share-popup .close-popup {
    filter: invert(100%) sepia(0%) saturate(1534%) hue-rotate(43deg) brightness(114%) contrast(100%);
}

.darkmode .polling-content,
.darkmode .header-search-wrapper,
.darkmode .info-post .author-avatar,
.single .darkmode .article-box .widget-header,
.darkmode .related-item,
.single .darkmode .list .list-item,
.darkmode .grid-box .grid-header,
.darkmode .grid-box,
.darkmode .video-content,
.darkmode .archive-grid-content,
.darkmode .list .list-box,
.darkmode .trending-content,
.darkmode .trending-article,
.darkmode .terkini-content,
.darkmode .terkini-article,
.darkmode .list .list-author img,
.darkmode .related-item .related-author img,
.darkmode input#author,
.darkmode input#email,
.darkmode textarea#comment,
.darkmode .form-submit .submit,
.darkmode .commentsArea ol,
.darkmode .search-content,
.darkmode .archive-main .archive-article,
.darkmode .archive-main2 .archive-article,
.darkmode .archive-wrapper,
.darkmode .archive-wrapper .archive-content .list .list-item,
.darkmode .archive-wrapper .archive-content,
.darkmode .archive-wrapper .author-avatar,
.darkmode .popu,
.darkmode .popu .archive-content .list .list-item,
.darkmode .popu .archive-content,
.darkmode .popu .author-avatar,
.darkmode .archive-main .list .list-item .list-box,
.darkmode .archive-main2 .list .list-item .list-box,
.darkmode .grid-box .grid-item,
.page-template-trending .darkmode .list .list-item .list-box,
.page-template-terkini .darkmode .list .list-item .list-box,
.darkmode .search-content .list .list-item .list-box,
.darkmode .archive-wrapper .archive-header,
.darkmode .popu .archive-header,
.darkmode .grid2-item .grid-item-box,
.darkmode .grid3-item .grid-item-box,
.darkmode .archive-article .widget-content {
    border-color: #555555;
}

.darkmode .list .list-author-name,
.darkmode .list .list-more .like-counter,
.darkmode .list .list-more .comment-counter,
.darkmode .list .list-more .timeago,
.darkmode .headline .headline-author-name,
.darkmode .headline .headline-more .like-counter,
.darkmode .headline .headline-more .comment-counter,
.darkmode .headline .headline-more .timeago,
.darkmode .grid .grid-author-name,
.darkmode .grid .grid-more .like-counter,
.darkmode .grid .grid-more .comment-counter,
.darkmode .grid .grid-more .timeago,
.darkmode .video .video-author-name,
.darkmode .video .video-more .like-counter,
.darkmode .video .video-more .comment-counter,
.darkmode .video .video-more .timeago,
.darkmode .archive-grid .archive-grid-author-name,
.darkmode .archive-grid .archive-grid-more .like-counter,
.darkmode .archive-grid .archive-grid-more .comment-counter,
.darkmode .archive-grid .archive-grid-more .timeago,
.darkmode .collection .collection-subtitle,
.darkmode .info-post .timepost,
.darkmode .info-post .dot,
.darkmode .info-post .readtime,
.darkmode .logged-in-as a,
.darkmode .archive-wrapper .author-bio,
.darkmode .popu .author-bio,
.darkmode .grid-author-name,
.darkmode .grid-more .like-counter,
.darkmode .grid-more .comment-counter,
.darkmode .grid-more .timeago,
.darkmode .header-submenu nav ul li a,
.darkmode .footer-box .widget ul li a,
.darkmode .footer-box .widget,
.darkmode .footer-container,
.darkmode .redaksi .author-role {
    color: #999999;
}

.darkmode .info-post .like-btn.liked {
    filter: unset;
}

.darkmode .header-menu ul li a:hover,
.darkmode .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a:hover {
    color: #ffc516;
}

.darkmode .header .header-menu .menu ul li a,
.darkmode .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item .title,
.darkmode .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a {
    color: #fff;
}

.darkmode .pagination-post .paginationPostLink a,
.darkmode .pagination-post .paginationPostLink span {
    background: #5a5a5a;
}

.darkmode .footer-box .widget ul li.facebook a:before,
.darkmode .footer-box .widget ul li.twitter a:before,
.darkmode .footer-box .widget ul li.instagram a:before,
.darkmode .footer-box .widget ul li.telegram a:before,
.darkmode .footer-box .widget ul li.whatsapp a:before,
.darkmode .footer-box .widget ul li.youtube a:before,
.darkmode .footer-box .widget ul li.tiktok a:before,
.darkmode .header-menu ul li.menu-item-has-children>a:after {
    filter: brightness(0) invert(1);
}