@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Inter:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";

@-webkit-keyframes pulsate-fwd {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes pulsate-fwd {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes pulsate-fwd {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes pulsate-fwd {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes blink {

    0%,
    50%,
    100% {
        opacity: 1;
    }

    25%,
    75% {
        opacity: 0;
    }
}

@keyframes blink {

    0%,
    50%,
    100% {
        opacity: 1;
    }

    25%,
    75% {
        opacity: 0;
    }
}

@keyframes pendar {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    80% {
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
    }
}

@-webkit-keyframes pendar {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    80% {
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
    }
}

@keyframes up-down {
    from {
        top: 0px;
    }

    to {
        top: 20px;
    }
}

@-webkit-keyframes up-down {
    from {
        top: 0px;
    }

    to {
        top: 20px;
    }
}

@keyframes left-right {
    from {
        right: 50px;
    }

    to {
        right: 70px;
    }
}

@-webkit-keyframes left-right {
    from {
        right: 50px;
    }

    to {
        right: 70px;
    }
}

@-webkit-keyframes wobble-hor-bottom {

    0%,
    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }

    15% {
        -webkit-transform: translateX(-30px) rotate(-6deg);
        transform: translateX(-30px) rotate(-6deg);
    }

    30% {
        -webkit-transform: translateX(15px) rotate(6deg);
        transform: translateX(15px) rotate(6deg);
    }

    45% {
        -webkit-transform: translateX(-15px) rotate(-3.6deg);
        transform: translateX(-15px) rotate(-3.6deg);
    }

    60% {
        -webkit-transform: translateX(9px) rotate(2.4deg);
        transform: translateX(9px) rotate(2.4deg);
    }

    75% {
        -webkit-transform: translateX(-6px) rotate(-1.2deg);
        transform: translateX(-6px) rotate(-1.2deg);
    }
}

@keyframes wobble-hor-bottom {

    0%,
    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }

    15% {
        -webkit-transform: translateX(-30px) rotate(-6deg);
        transform: translateX(-30px) rotate(-6deg);
    }

    30% {
        -webkit-transform: translateX(15px) rotate(6deg);
        transform: translateX(15px) rotate(6deg);
    }

    45% {
        -webkit-transform: translateX(-15px) rotate(-3.6deg);
        transform: translateX(-15px) rotate(-3.6deg);
    }

    60% {
        -webkit-transform: translateX(9px) rotate(2.4deg);
        transform: translateX(9px) rotate(2.4deg);
    }

    75% {
        -webkit-transform: translateX(-6px) rotate(-1.2deg);
        transform: translateX(-6px) rotate(-1.2deg);
    }
}

@-webkit-keyframes bounce-top {
    0% {
        -webkit-transform: translateY(-45px);
        transform: translateY(-45px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 1;
    }

    24% {
        opacity: 1;
    }

    40% {
        -webkit-transform: translateY(-24px);
        transform: translateY(-24px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    65% {
        -webkit-transform: translateY(-12px);
        transform: translateY(-12px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    82% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    93% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    25%,
    55%,
    75%,
    87% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }
}

@keyframes bounce-top {
    0% {
        -webkit-transform: translateY(-45px);
        transform: translateY(-45px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 1;
    }

    24% {
        opacity: 1;
    }

    40% {
        -webkit-transform: translateY(-24px);
        transform: translateY(-24px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    65% {
        -webkit-transform: translateY(-12px);
        transform: translateY(-12px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    82% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    93% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    25%,
    55%,
    75%,
    87% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }
}

*,
*:before,
*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
}

::-moz-selection {
    background-color: var(--sahara-sand);
    color: var(--dark-indigo);
}

::selection {
    background-color: var(--sahara-sand);
    color: var(--dark-indigo);
}

::-moz-selection {
    background-color: var(--sahara-sand);
    color: var(--dark-indigo);
}

::-webkit-scrollbar-track {
    box-shadow: var(--bluish);
    -webkit-box-shadow: var(--bluish);
    background-color: #f5f5f5;
}

body::-webkit-scrollbar {
    display: none;
}

body {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.3;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    margin: 0;
    padding: 0;
    background-color: var(--bg-white);
    color: var(--tc-white);
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
    display: block;
    margin: 0;
}

img {
    max-width: 100%;
    width: auto;
    height: auto;
    vertical-align: top;
    border: 0;
}

table {
    border-collapse: collapse;
}

iframe {
    border: none;
    vertical-align: top;
}

li,
ul,
ol {
    margin: 0;
    padding: 0;
}

ul li {
    list-style: none;
    vertical-align: top;
}

input,
button,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    -webkit-appearance: none;
}

input:focus::-webkit-input-placeholder,
input:focus:-moz-placeholder,
input:focus::-moz-placeholder,
input:focus:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0);
}

input[type=button],
input[type=checkbox],
input[type=radio],
input[type=reset],
input[type=submit],
label,
select {
    cursor: pointer;
}

input[type=search] {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-appearance: textfield;
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none;
}

button,
input[type=button],
input[type=checkbox],
input[type=radio],
input[type=reset],
input[type=submit],
label,
select {
    cursor: pointer;

}


.none {
    display: none !important;
}

.nogap {
    margin: 0 !important;
    padding: 0 !important;
}

.overflowhidden::-webkit-scrollbar {
    display: none;
}

.overflowhidden {
    overflow: hidden;
}

.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.flex-wrap {
    flex-wrap: wrap;
}

.items-end {
    align-items: flex-end;
}

.items-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.justify-evenly {
    justify-content: space-evenly;
}

.gap-2 {
    gap: .5rem;
}

.main .container {
    width: 100%
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.mt-topgiant {
    margin-top: 95px;
}

.mt-15 {
    margin-top: 15px;
}

.mt-section {
    margin-top: 16px;
}

.mb-section {
    margin-bottom: 25px;
}

.my-section {
    margin-top: 16px;
    padding-bottom: 16px;
}

.main>.my-section:first-child {
    margin-top: 0;
    padding-top: 16px;
}

.mt-30 {
    margin-top: 30px;
}

.my-adSection {
    margin-top: 30px;
    margin-bottom: 120px;
}

.w-full {
    width: 100%
}

.h-full {
    height: 100%
}

.swiper {
    width: 50%;
    height: 100%
}

.swiper {
    width: 100%;
    height: 100%
}

.swiper-button-next {
    background-color: #669B2E;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    padding: 1.5625rem;
    width: 1.875rem;
    height: 1.875rem;
    right: -0.3125rem !important;
}

.swiper-button-prev {
    background-color: #669B2E;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    padding: 1.5625rem;
    width: 1.875rem;
    height: 1.875rem;
    left: -1.5625rem !important;
}

.arr-next:after {
    content: "";
    background-image: url("../images/arrow-r.png") !important;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10px;
    height: 1.0625rem;
    z-index: 9;
    position: absolute;
}

.arr-prev:after {
    content: "";
    background-image: url("../images/arrow-l.png") !important;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10px;
    height: 1.0625rem;
    z-index: 9;
    position: absolute;
}

.uxBestview {
    position: fixed;
    z-index: 9999999;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #efeff0;
    display: none;
    font-size: 30px;
    line-height: normal;
    background-image: url("../images/bg-menu.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.uxBestview__title {
    font-size: 24px;
    text-align: center;
    color: #fff;
    text-transform: uppercase;
}

.uxBestview__icon {
    width: 100px;
    margin: auto;
    margin-bottom: 5px;
}

@media(max-width: 823px)and (orientation: landscape) {
    .uxBestview {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    margin-top: 0;
    line-height: 1.2;
    color: inherit;
    text-rendering: optimizelegibility;
}

h1 {
    font-size: clamp(1rem, 1rem + 2vw, 3.125rem);
}

h2 {
    font-size: clamp(1rem, 0.875rem + 1.5vw, 2.5rem);
}

h3 {
    font-size: clamp(1.25rem, 0.6875rem + 1vw, 2.0625rem);
}

p {
    margin-top: 0;
    font-size: 1rem;
}

a {
    color: inherit;
    text-decoration: none;
    vertical-align: top;
    outline: 0;
}

a:hover,
a:visited,
a:active {
    text-decoration: none;
}

a:focus,
button:focus {
    outline: 0;
    outline: -webkit-focus-ring-color auto 0;
    outline-offset: 0;
}

textarea {
    overflow: auto;
    vertical-align: top;
}

blockquote {
    position: relative;
    font-size: 1.25rem;
    font-weight: 400;
    margin: 1.5625rem 2.5rem;
}

blockquote:before,
blockquote:after {
    font-size: 1.875rem;
    line-height: 1;
    position: absolute;
}

blockquote:before {
    content: "";
    left: -2.5rem;
}

blockquote:after {
    content: "";
    padding-left: 10px;
}

:root {
    --bg-white: hsl(0, 0%, 100%);
    --bg-black: hsl(0, 0%, 0%);
    --bg-yellow: hsl(45, 95%, 57%);
    --bg-white-transparent: hsla(0, 0%, 100%, 0.595);
    --bg-btn-primary: hsla(152, 100%, 20%, 0.548);
    --bg-btn-secondary: hsla(207, 74%, 42%, 0.548);
    --bg-box-primary: hsl(32, 100%, 95%);
    --bg-box-secondary: hsl(194, 100%, 92%);
    --bg-box-tertiary: hsl(198, 100%, 97%);
    --bg-text-section-11: hsl(66, 46%, 65%);
    --bg-section-2-left: hsl(102, 100%, 92%);
    --bg-section-2-center: hsl(206, 100%, 88%);
    --bg-section-2-right: hsl(54, 86%, 84%);
    --bg-section-7: hsl(207, 100%, 88%);
    --bg-section-12: hsl(20, 4%, 14%);
    --bg-section-13-view-1: hsl(201, 60%, 46%);
    --bg-section-14-view-2: hsl(199, 78%, 86%);
    --bg-section-15-view-2: hsl(209, 65%, 88%);
    --bg-text-section-14: hsl(206, 85%, 39%);
    --bg-text-section-14-trans: hsla(206, 85%, 39%, 0.533);
    --bg-thead-trayek: hsl(85, 54%, 51%);
    --bg-tbody-trayek: hsl(25, 100%, 96%);
    --tc-table-trayek: hsl(60, 1%, 34%);
    --tc-h2-section-14: hsl(210, 91%, 35%);
    --tc-section-15: hsl(83, 35%, 41%);
    --tc-heading-section-16: hsl(68, 100%, 14%);
    --tc-color-section-16-view3: hsl(38, 51%, 18%);
    --tc-tertiary: hsl(144, 40%, 25%);
    --tc-yellow: hsl(45, 95%, 57%);
    --tc-white: hsl(0, 0%, 100%);
    --tc-dark: hsl(270, 2%, 25%);
    --dark-indigo: hsl(235, 78%, 19%);
    --golden-dream: hsl(51, 91%, 54%);
    --white: hsl(0, 0%, 100%);
    --greenish-blue: hsl(182, 53%, 35%);
    --macaroni-and-cheese: hsl(50, 79%, 50%);
    --bluish: hsl(207, 74%, 42%);
    --light-blue-grey: hsl(203, 41%, 78%);
    --sahara-sand: hsl(49, 91%, 74%);
}

body {
    height: 100vh;
    background-color: #fff;
}

html,
body {
    margin: 0;
    padding: 0;
}



.navmenu,
.kanalHeader {
    background: #6FA42E;
    background: linear-gradient(177deg, rgba(111, 164, 46, 1) 0%, rgba(111, 164, 46, 1) 30%, rgba(95, 135, 46, 1) 100%);
}

.navmenu .navmenu-item.active .navmenu-link:before {
    background-color: #10729F;
}

.kanalHeader ul li a:hover {
    color: #FBE524;
}

.kanalLogo~.kanalMenu:after {
    display: none;
}

.navmenu-kanalpage:after {
    display: none;
}

.main {
    background-color: #fff;
    padding-bottom: 80px;
}

/* .main img {
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
} */

.main .gate {
    background-color: #669B2E;
    padding: 0.9375rem 0.9375rem;
}

.main .gate h1 {
    text-align: center;
}

.main .tagline {
    border-bottom: 0;
    margin: 10px 0 0.3125rem;
    text-align: center;
}

.main .tagline img {
    height: 3.625rem;
    width: auto;
    object-fit: contain;
}

.main .headlineThumb {
    width: 100%
}

.main .headlineThumb a {
    width: 100%
}

.main .headlineThumb a img {
    max-height: 450px;
    object-fit: cover;
    height: 100%;
    width: 100%;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.main .headlineThumb a figure {
    position: relative;
    width: 100%;
    height: 100%
}

.main .headlineThumb a figure figcaption {
    position: absolute;
    bottom: 0;
    padding: 15px;
    z-index: 1;
}

.main .headlineThumb a figure figcaption hr {
    width: 10%;
    height: 1px;
    border-top: 20px solid #fff;
    top: 0;
    position: absolute;
}

.main .headlineThumb a figure figcaption h2 {
    color: #fff;
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.main .headlineThumb a figure figcaption p {
    color: #fff;
    font-family: "Inter", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 12px;
    padding-top: 5px;
    margin-bottom: 0;
}

.wSpec-subtitle {
    font-weight: 500 !important;
}

.card_date p span,
.artHl-date p span,
.artHl-date p.wSpec-date {
    font-weight: 400;
}

.card_date p span:before,
.artHl-date p span::before {
    content: "\2022";
    position: relative;
    margin: 0 8px;
    display: inline-block;
    color: #6c6f75;
    font-size: 12px;
    line-height: 1;
}

.headlineThumb p span::before {
    color: #fff;
}

.artHl-date p.wSpec-date {
    font-size: 12px;
    margin-bottom: 0;
    margin-top: 2px;
    line-height: 1.3;
}

.main .headlineThumb a figure .gradient {
    background: #75AB3D;
    background: linear-gradient(0deg, rgba(117, 171, 61, 0.80) 35%, rgba(117, 171, 61, 0.60) 60%, rgba(117, 171, 61, 0) 100%);

    height: 60%;
    width: 100%;
    position: absolute;
    bottom: -1px;
    z-index: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.main .headlineThumb a figure .play-btn {
    position: absolute;
    background-image: url("../images/play.png");
    background-repeat: no-repeat;
    background-size: contain;
    top: 40%;
    right: 0;
    left: 45%;
    bottom: 0;
    width: 3.125rem;
    z-index: 1;
}

.main .articleThumb {
    width: 100%;
    max-width: 100%;
    position: relative;
    margin-top: 24px;
    padding-bottom: 16px;
}

.list_articleThumb {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    row-gap: 24px;
}

.articleThumb a {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: calc(50% - (16px / 2));
}

.articleThumb .card_image {
    width: 100%;
    aspect-ratio: 16/9;
    flex: none;
    overflow: hidden;
    border-radius: 8px;
}

.articleThumb .card_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.articleThumb .card_title {
    color: #669B2E;
    font-size: 16px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-family: 'Inter', sans-serif;
}

.articleThumb .card_date p {
    color: #6D6F79;
    font-size: 12px;
    margin: 0;
    font-family: 'Inter', sans-serif;
}

.articleThumb .card_date p:first-child {
    margin-top: 5px;
}

.main .container.--listbaca {
    padding: 30px 0 0;

}

.contentArticle .container.--listbaca h3 {
    margin: 0;
}

.main .contentArticle {
    box-shadow: none;
}



.main .title {
    border-bottom: none !important;
    margin-bottom: 12px;
}

.main .title h3 {
    flex: none;
    width: auto;
    position: relative;
    padding: 0 10px;
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 20px;
    border-radius: 0;
    color: #669B2E;
    border-color: #669B2E;
    text-wrap: nowrap;
}

.main .title.--big h3 {
    font-size: 36px;
}

.main .title h3::after {
    content: " ";
    height: 70%;
    width: 2px;
    background-color: #669B2E;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;

}

.main .title hr {
    width: 100%;
    height: 1px;
    border-top: 0.1875rem solid #669B2E;

    flex: 1;
    margin-left: 5px;

    border-radius: 0;
    color: #669B2E;
    border-color: #669B2E;
}

.articleList.-list .articleTitle {
    color: #669B2E;
}

.main .title a {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 1rem;
    color: #4d4d4d;
    width: 15%;
    text-align: right;
    margin: 0;
    padding: 0;
}

.main .eachCardArticle1 {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}



.main .eachCardArticle1 .card {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 1rem;
}

.main .eachCardArticle1 .card_image {
    border-radius: 8px;
    overflow: hidden;
}

.main .eachCardArticle1 .card img {
    width: 100%;

}

.main .eachCardArticle1 .card .card_title {
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 18px;
    color: #669B2E;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-top: 10px;
    margin-bottom: 10px;
}

.main .eachCardArticle1 .card .card_body p {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    color: #4b4b4b;
}

.main .eachCardArticle1 .card .card_body .card_date p {
    font-size: 12px;
    margin-bottom: 0;
}

.main .eachCardArticle1 .card .card_body span {
    font-size: 0.75rem;
}

.main .eachCardArticle2 {
    display: flex;
    flex-direction: column;
}

.main .eachCardArticle2 .card {
    display: flex;
    flex-direction: row;
    gap: 10px;
    width: 100%;
    padding: .5rem .5rem .5rem 0;
    margin-top: 0.5625rem;
}

.main .eachCardArticle2 .card:first-child {
    margin-top: 0;
}

.main .eachCardArticle2 .card:last-child {
    border-bottom: none;
}

.main .eachCardArticle2 .card .card_image {
    display: flex;
    align-items: center;
    width: 90px;
    height: 90px;
    border-radius: 12px;

    flex: none;

    overflow: hidden;
}

.main .eachCardArticle2 .card .card_image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.main .eachCardArticle2 .card .card_content {
    display: flex;
    flex-direction: column;
    justify-content: start;
    width: 100%
}

.main .eachCardArticle2 .card .card_content .card_title {
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 16px;
    color: #4d4d4d;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    padding: 0;
    margin-bottom: 6px;
}

.main .eachCardArticle2 .card .card_content .card_body p,
.card_date .wSpec-subtitle,
.card_date .wSpec-tag {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #4b4b4b;
}

.main .eachCardArticle2 .card .card_content .card_footer p {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 0.875rem;
    color: #4d4d4d;
}

.main .eachCardArticle2 .card .card_content .card_footer p span.label {
    color: #669B2E;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.main .adsSection {
    position: relative;
    width: 300px;
    height: 600px;
    margin: 0 auto;
}

.main .adsSection img {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.main .pagination {
    position: relative;
    width: 100%;
    height: 12.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.main .pagination a {
    border: 0.125rem solid #669B2E;
    color: #669B2E;
    border-radius: 0.3125rem;
    -webkit-border-radius: 0.3125rem;
    -moz-border-radius: 0.3125rem;
    -ms-border-radius: 0.3125rem;
    -o-border-radius: 0.3125rem;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 0.8125rem;
    padding: 0.4375rem;
}

.main .pagination a.active {
    background-color: #669B2E;
    color: #fff;
}

.main .pagination a:first-child {
    background-color: rgba(92, 189, 206, .5647058824);
    color: #fff;
}

.main .pagination a:last-child {
    background-color: rgba(92, 189, 206, .5647058824);
    color: #fff;
}

.main ul.breadcrumb {
    padding: 10px 0 0.1875rem 0;
    list-style: none;
}

.main ul.breadcrumb li {
    display: inline;
    font-size: 0.9375rem;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.main ul.breadcrumb li+li:before {
    padding: 8px;
    color: #4d4d4d;
    content: "/ "
}

.main ul.breadcrumb li a {
    color: #4d4d4d;
    text-decoration: none;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.main ul.breadcrumb li a :hover {
    color: #01447e;
    text-decoration: underline;
}

.main ul.breadcrumb li a span.label {
    color: #669B2E;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.main .headTitle {
    max-width: 56.25rem;
}

.main .headTitle h1 {
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 1.875rem;
    color: #4d4d4d;
    margin: 0 0 10px;
}

.main .headTitle p {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 10px;
    color: #4d4d4d;
}

.main .headTitle p span.label {
    color: #669B2E;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.main .leftSectionArticle {
    max-width: 50rem;
    width: 100%
}

.main .leftSectionArticle .readContent {
    margin-top: 1.25rem;
    margin-bottom: 6.25rem;
}

.main .leftSectionArticle .readContent p {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 1rem;
    color: #4d4d4d;
}

.main .leftSectionArticle .readContent p a {
    color: #669B2E;
}

.main .leftSectionArticle .readContent p a:hover {
    color: #4da2b1;
}

.main .leftSectionArticle .readContent p a:active {
    color: #669B2E;
}

.main .moreArticle {
    margin-top: 1.25rem;
}

.main .moreArticle .card {
    width: 20%;
    margin-bottom: 9.375rem;
    position: relative;
}

.main .moreArticle .card .card_title {
    background-color: #669B2E;
    padding: 1.25rem;
    border-radius: 0.9375rem;
    -webkit-border-radius: 0.9375rem;
    -moz-border-radius: 0.9375rem;
    -ms-border-radius: 0.9375rem;
    -o-border-radius: 0.9375rem;
    top: 4.375rem;
    position: absolute;
    width: 80%;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.main .moreArticle .card .card_title h3 {
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 0.9375rem;
    padding: 0;
    color: #fff;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.main .section_btn {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    background-color: #3B7923;
    border: none;
    color: #FBE623;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    margin-top: 20px;
}

.articleMore {
    margin-top: 16px;
}

.articleMore:after {
    background-repeat: no-repeat;
}

/* Rolls mobile  */
.reelsCardHL-wrapper {
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    margin: 0px -15px 0 -7px;
}

.reelsCardHL-wrapper.--listidx {
    margin: 0;
}


.reelsCardHL-slider {
    position: relative;
    padding: 0 5px;
    overflow-x: scroll;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
}


.reelsCardHL-wrapper.--listidx .reelsCardHL-slider {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 0;
}

.reelsCardHL-slider .reelsItem {
    width: 240px;
    min-width: 117px;
    vertical-align: top;
    display: inline-block;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    padding: 0 7px;
}

.reelsCardHL-wrapper.--listidx .reelsItem {
    width: calc(50% - (16px / 2));
    padding: 0;
}

.reelsItem-img {
    border-radius: 8px;
    width: 100%;
    padding-bottom: 167.53%;
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
}

.reelsItem-box,
.reelsItem-img img {
    position: absolute;
    left: 0;
    width: 100%;
}

.reelsItem-img img {
    height: 100%;
    object-fit: cover;
}

.reelsItem-play {
    width: 48px;
    height: 48px;
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 .5A6.5 6.5 0 1 0 13.5 7 6.512 6.512 0 0 0 7 .5Zm2.275 6.919-3 2A.544.544 0 0 1 6 9.5a.531.531 0 0 1-.237-.056A.5.5 0 0 1 5.5 9V5a.5.5 0 0 1 .263-.444.519.519 0 0 1 .512.025l3 2a.5.5 0 0 1 0 .838Z' fill='%23000'/%3E%3C/svg%3E");
    -webkit-filter: invert(100%) sepia(0) saturate(6817%) hue-rotate(208deg) brightness(118%) contrast(82%);
    filter: invert(100%) sepia(0) saturate(6817%) hue-rotate(208deg) brightness(118%) contrast(82%);
    background-size: auto 100%;
    background-position: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0.8;
}

.reelsItem-cat {
    font-size: 10px;
    padding: 5px 0;
}

.reelsItem-cat,
.reelsItem-title {
    color: #fff;
    white-space: normal;
}

.reelsItem-img:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 65%;
    z-index: 1;
    pointer-events: none;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.8)));
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.8));
}

.reelsItem-title {
    font-size: 16px;
    font-weight: 600;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.reelsItem-brand {
    position: relative;
    width: 100%;
    height: 23px;
}

.reelsItem-brand>img {
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: left;
    object-position: left;
}

.reelsItem-box {
    position: absolute;
    left: 0;
    width: 100%;
    bottom: 0;
    z-index: 2;
    padding: 28px 12px;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(111, 164, 46, 0.8)));
    background: linear-gradient(180deg, transparent, rgba(111, 164, 46, 1));
}

.reelsCardHL-slider .reelsItem-box {
    padding: 15px;
}

.rolls-detailTxt {
    color: #000;
}

.embed-reels-mobile {
    margin: 0 auto;
    width: 100%;
    max-width: 500px;
}


/* Artikel Terkini Index */
.sectionTitle {
    background-color: #fff;
    color: #669B2E;
}

.sectionTitle:before {
    border-color: #669B2E;
}

.main .listSection.hlWrap .hlItem .hlTitle,
.paging li a {
    color: #36383a;
}

.listSection.hlWrap .hlItem .hlInfo .hlChannel,
.articlePost-subtitle {
    color: #515358;
}

.listSection.hlWrap .hlItem .hlInfo .hlTime,
.articlePost ul li:not(:last-child):after,
.articlePost ul li .articlePost-date {
    color: #6c6f75;
}

.paging li.first a:before,
.paging li.last a:before,
.paging li.next a:before,
.paging li.prev a:before {
    filter: none !important;
}

.paging__wrap .paging__link,
.paging__wrap .paging__link--next:before,
.paging__wrap .paging__link--prev:before,
.paging__wrap .paging__link--first:before,
.paging__wrap .paging__link--last:before {
    color: #000 !important;
    filter: none !important;
}

/* Gamification */

.socmedButton {
    flex-basis: 36px;
    min-width: 36px;
}

.socmedList {
    justify-content: start;
}

.socmedModal .socmedList {
    justify-content: center;
}

.socmedModal .socmedButton {
    flex-basis: 47px;
    width: 47px;
}


.socmedBlock.--sosmedonly .icoSocmed:after {
    filter: none !important;
}

.socmedBlock.--sosmedonly .icoFacebook:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M24%2012.073C24%2018.062%2019.606%2023.027%2013.87%2023.928V15.565H16.659L17.19%2012.105H13.87V9.86C13.87%208.913%2014.334%207.991%2015.82%207.991H17.329V5.045C17.329%205.045%2015.959%204.811%2014.65%204.811C11.916%204.811%2010.13%206.468%2010.13%209.467V12.104H7.091V15.564H10.13V23.927C4.395%2023.025%200%2018.061%200%2012.073C0%205.446%205.373%200.072998%2012%200.072998C18.627%200.072998%2024%205.445%2024%2012.073Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E");
}

.socmedBlock.--sosmedonly .icoLine:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_371_3720)%22%3E%3Cpath%20d%3D%22M18.59%200H5.41C2.422%200%200%202.422%200%205.41V18.59C0%2021.578%202.422%2024%205.41%2024H18.59C21.578%2024%2024%2021.578%2024%2018.59V5.41C24%202.422%2021.577%200%2018.59%200ZM18.284%2014.865C16.605%2016.797%2012.852%2019.151%2011.998%2019.511C11.144%2019.871%2011.27%2019.282%2011.305%2019.079C11.326%2018.959%2011.419%2018.394%2011.419%2018.394C11.446%2018.19%2011.474%2017.873%2011.393%2017.671C11.303%2017.448%2010.949%2017.333%2010.688%2017.276C6.843%2016.768%203.996%2014.08%203.996%2010.87C3.996%207.29%207.586%204.376%2011.998%204.376C16.41%204.376%2020%207.289%2020%2010.87C19.999%2012.302%2019.444%2013.593%2018.284%2014.865Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M15.81%2010.0119V10.6009H17.338C17.422%2010.6009%2017.491%2010.6699%2017.491%2010.7539V11.3219C17.491%2011.4059%2017.423%2011.4749%2017.338%2011.4749H15.81V12.0639H17.338C17.422%2012.0639%2017.491%2012.1329%2017.491%2012.2169V12.7849C17.491%2012.8689%2017.423%2012.9369%2017.338%2012.9369H15.09C15.006%2012.9369%2014.937%2012.8689%2014.937%2012.7849V9.29192C14.937%209.20792%2015.005%209.13892%2015.09%209.13892H17.338C17.422%209.13892%2017.491%209.20692%2017.491%209.29192V9.85892C17.491%209.94292%2017.423%2010.0119%2017.338%2010.0119H15.81Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M9.17409%2012.2169V12.7849C9.17409%2012.8689%209.10609%2012.9369%209.02109%2012.9369H6.77309C6.68909%2012.9369%206.62109%2012.8689%206.62109%2012.7849V9.29192C6.62109%209.20792%206.68909%209.13892%206.77309%209.13892H7.34109C7.42509%209.13892%207.49409%209.20692%207.49409%209.29192V12.0639H9.02209C9.10609%2012.0639%209.17409%2012.1329%209.17409%2012.2169Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M10.5283%209.29192V12.7839C10.5283%2012.8679%2010.4603%2012.9359%2010.3753%2012.9359H9.80827C9.72427%2012.9359%209.65527%2012.8679%209.65527%2012.7839V9.29192C9.65527%209.20792%209.72327%209.13892%209.80827%209.13892H10.3753C10.4593%209.13892%2010.5283%209.20792%2010.5283%209.29192Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M14.3913%209.29192V12.7839C14.3913%2012.8679%2014.3233%2012.9359%2014.2383%2012.9359H13.6743C13.6243%2012.9359%2013.5753%2012.9109%2013.5463%2012.8699L11.9463%2010.7099V12.7839C11.9463%2012.8679%2011.8783%2012.9359%2011.7933%2012.9359H11.2253C11.1413%2012.9359%2011.0723%2012.8679%2011.0723%2012.7839V9.29192C11.0723%209.20792%2011.1403%209.13892%2011.2253%209.13892H11.7893C11.8423%209.13892%2011.8883%209.16692%2011.9193%209.20792L13.5173%2011.3659V9.29192C13.5173%209.20792%2013.5853%209.13892%2013.6703%209.13892H14.2383C14.3233%209.13892%2014.3913%209.20792%2014.3913%209.29192Z%22%20fill%3D%22black%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_371_3720%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

.socmedBlock.--sosmedonly .icoTelegram:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_371_3722)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M12%200C5.373%200%200%205.373%200%2012C0%2018.627%205.373%2024%2012%2024C18.627%2024%2024%2018.627%2024%2012C24%205.373%2018.627%200%2012%200ZM17.562%208.161C17.382%2010.058%2016.6%2014.663%2016.203%2016.788C16.035%2017.688%2015.703%2017.989%2015.383%2018.018C14.686%2018.082%2014.157%2017.557%2013.482%2017.115C12.426%2016.423%2011.829%2015.992%2010.804%2015.316C9.619%2014.535%2010.387%2014.106%2011.062%2013.405C11.239%2013.221%2014.309%2010.428%2014.369%2010.175C14.376%2010.143%2014.384%2010.025%2014.313%209.963C14.242%209.901%2014.139%209.922%2014.065%209.939C13.959%209.963%2012.272%2011.078%209.003%2013.284C8.524%2013.613%208.09%2013.773%207.701%2013.765C7.273%2013.756%206.449%2013.523%205.836%2013.323C5.085%2013.079%204.487%2012.949%204.539%2012.535C4.566%2012.319%204.863%2012.098%205.431%2011.872C8.929%2010.348%2011.262%209.343%2012.429%208.857C15.762%207.471%2016.454%207.23%2016.906%207.222C17.472%207.214%2017.608%207.681%2017.562%208.161Z%22%20fill%3D%22black%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_371_3722%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

.socmedBlock.--sosmedonly .icoCopyLink:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_371_3721)%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2212%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M12%200C5.37281%200%200%205.37281%200%2012C0%2018.6272%205.37281%2024%2012%2024C18.6272%2024%2024%2018.6272%2024%2012C24%205.37281%2018.6272%200%2012%200ZM13.6627%2017.1L12.8972%2017.8655C12.4513%2018.3103%2011.9222%2018.663%2011.34%2018.9032C10.7578%2019.1435%2010.134%2019.2667%209.50421%2019.2658C8.8744%2019.2649%208.25093%2019.1399%207.66945%2018.8979C7.08797%2018.6559%206.55986%2018.3018%206.11531%2017.8556C4.24875%2015.9806%204.28719%2012.9338%206.1575%2011.0588L6.89062%2010.3275C7.04939%2010.1687%207.2647%2010.0796%207.48922%2010.0796C7.71373%2010.0796%207.92905%2010.1687%208.08781%2010.3275C8.24656%2010.4863%208.33575%2010.7016%208.33575%2010.9261C8.33575%2011.1506%208.24656%2011.3659%208.08781%2011.5247L7.32187%2012.2902C7.033%2012.5797%206.80428%2012.9235%206.6489%2013.3018C6.49353%2013.6802%206.41456%2014.0855%206.41657%2014.4945C6.41857%2014.9035%206.5015%2015.308%206.66058%2015.6848C6.81966%2016.0616%207.05174%2016.4032%207.34344%2016.6898C8.56219%2017.8833%2010.523%2017.8453%2011.7281%2016.6402L12.4655%2015.9028C12.5439%2015.8232%2012.6372%2015.76%2012.7402%2015.7167C12.8431%2015.6734%2012.9537%2015.6508%2013.0654%2015.6504C13.1771%2015.65%2013.2877%2015.6717%2013.391%2015.7143C13.4943%2015.7568%2013.5881%2015.8194%2013.6671%2015.8984C13.7461%2015.9774%2013.8086%2016.0712%2013.8512%2016.1745C13.8938%2016.2777%2013.9155%2016.3884%2013.915%2016.5001C13.9146%2016.6118%2013.8921%2016.7223%2013.8488%2016.8253C13.8055%2016.9282%2013.7422%2017.0216%2013.6627%2017.1ZM15.007%2010.1803L10.1789%2015.0084C10.0191%2015.1617%209.80559%2015.2462%209.58418%2015.244C9.36276%2015.2417%209.15106%2015.1527%208.99446%2014.9962C8.83786%2014.8396%208.74882%2014.628%208.74644%2014.4065C8.74406%2014.1851%208.82852%2013.9716%208.98172%2013.8117L13.8098%208.98359C13.969%208.82677%2014.1837%208.73923%2014.4071%208.74005C14.6306%208.74088%2014.8446%208.83%2015.0026%208.988C15.1606%209.14599%2015.2497%209.36005%2015.2506%209.58348C15.2514%209.80692%2015.1639%2010.0216%2015.007%2010.1808V10.1803ZM17.8664%2012.8991L17.1%2013.6627C17.0216%2013.7422%2016.9282%2013.8055%2016.8253%2013.8488C16.7223%2013.8921%2016.6118%2013.9146%2016.5001%2013.915C16.3884%2013.9155%2016.2777%2013.8938%2016.1745%2013.8512C16.0712%2013.8086%2015.9774%2013.7461%2015.8984%2013.6671C15.8194%2013.5881%2015.7568%2013.4943%2015.7143%2013.391C15.6717%2013.2877%2015.65%2013.1771%2015.6504%2013.0654C15.6508%2012.9537%2015.6734%2012.8431%2015.7167%2012.7402C15.76%2012.6372%2015.8232%2012.5439%2015.9028%2012.4655L16.6683%2011.7C16.9571%2011.4104%2017.1858%2011.0666%2017.3411%2010.6882C17.4965%2010.3099%2017.5754%209.90455%2017.5734%209.49557C17.5713%209.08658%2017.4883%208.68205%2017.3292%208.30528C17.1701%207.92851%2016.938%207.58696%2016.6462%207.30031C15.4298%206.10688%2013.4672%206.14438%2012.262%207.35L11.5247%208.08734C11.3659%208.24609%2011.1506%208.33528%2010.9261%208.33528C10.7016%208.33528%2010.4863%208.24609%2010.3275%208.08734C10.1687%207.92858%2010.0796%207.71326%2010.0796%207.48875C10.0796%207.26424%2010.1687%207.04892%2010.3275%206.89016L11.0625%206.1575C12.9342%204.28578%2015.9811%204.24875%2017.8594%206.11531C18.3053%206.56011%2018.6591%207.08841%2018.9008%207.67003C19.1424%208.25164%2019.2671%208.87517%2019.2677%209.50499C19.2682%2010.1348%2019.1447%2010.7586%2018.9041%2011.3406C18.6635%2011.9227%2018.3106%2012.4516%2017.8655%2012.8972L17.8664%2012.8991Z%22%20fill%3D%22black%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_371_3721%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

.icoSocmed:after {
    -webkit-filter: invert(99%) sepia(100%) saturate(2%) hue-rotate(318deg) brightness(110%) contrast(101%);
    filter: invert(99%) sepia(100%) saturate(2%) hue-rotate(318deg) brightness(110%) contrast(101%);
}

.main .socmedBlock .icoSocmed {
    display: inline-block;
    background-color: transparent;
}

/* mobile artikel */
.listSection.hlWrap .hlItem .hlTitle,
.paging li a {
    color: #36383a !important;
}

.listSection.hlWrap .hlItem .hlInfo .hlChannel,
.articlePost-subtitle {
    color: #515358;
}

.listSection.hlWrap .hlItem .hlInfo .hlTime,
.articlePost ul li:not(:last-child):after,
.articlePost ul li .articlePost-date {
    color: #6c6f75;
}

.paging li.first a:before,
.paging li.last a:before,
.paging li.next a:before,
.paging li.prev a:before {
    filter: none !important;
}



.article-headline-small {
    display: flex;
    width: 100%;
    margin-top: 24px;
    gap: 15px;
}

.artHl-list {
    flex: none;
    width: 50%;
}

.artHl-card {
    display: flex;
    gap: 10px;
}

.artHl-card .artHl-title {
    color: #669B2E;
    font-weight: 500;
    font-size: 17px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.artHl-img {
    width: 150px;
    flex: none;
    border-radius: 8px;
    overflow: hidden;
}

.artHl-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.artHl-text {
    display: flex;
    flex-direction: column;
    justify-content: start;

}

.artHl-date {
    font-size: 12px;
    color: #6D6F79;
}

.artHl-date .wSpec-subtitle {
    margin-bottom: 0;
    color: #515358;
}

/* banner */
.banner-mdk {
    max-width: 500px;
    margin: 0 auto;
    border-radius: 8px;
    overflow: hidden;
}

.banner-mdk,
.banner-mdk img {
    width: 100%;

    cursor: pointer;
}


/* Hal Baca Artikel */
.breadcum-new li {
    color: #000
}

.breadcum-new a,
.breadcum-new span,
.breadcrumb__item {
    color: #669B2E;
}

.read__subtitle {
    color: #545454;
    ;
}

.read__title {
    color: #1a1a1a;
}

.read__date,
.credit-title p {
    color: #888;
}

.reactionTxt {
    color: #666;
}

.credit-title-nameEditor,
.credit-title-name h6 {
    color: #333 !important;
}

.headline.column,
.breadcum-new,
.photoCarousel,
.read__credit,
.contentArticle,
.cover-photo,
.photoCarousel-img,
.cover-photo>.photo__caption,
.photo-infographic>.photo__caption,
.photo>.photo__caption {
    background-color: #fff;
    background: #fff;
}

.photo-infographic>.photo__caption,
.photo>.photo__caption {
    color: #999;
}

.breadcum-new li {
    color: #000
}

.breadcum-new a,
.breadcum-new span,
.breadcrumb__item {
    color: #669B2E;
}

.read__subtitle {
    color: #545454;
    ;
}

.read__title {
    color: #1a1a1a;
}

.read__date,
.credit-title p {
    color: #888;
}

.reactionTxt {
    color: #666;
}

.credit-title-nameEditor,
.credit-title-name h6 {
    color: #333 !important;
}

.reaction .icoComment {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M2.1 5A2.9 2.9 0 0 1 5 2.1h14A2.9 2.9 0 0 1 21.9 5v9.104a2.9 2.9 0 0 1-2.9 2.9h-7.973a1.1 1.1 0 0 0-.69.243L6.819 20.08c-1.898 1.528-4.72.178-4.72-2.258V5ZM5 3.9A1.1 1.1 0 0 0 3.9 5v12.822a1.1 1.1 0 0 0 1.79.856l3.518-2.833a2.9 2.9 0 0 1 1.819-.642H19a1.1 1.1 0 0 0 1.1-1.1V5A1.1 1.1 0 0 0 19 3.9H5Z' clip-rule='evenodd'/%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M7.235 8.1a.9.9 0 0 1 .9-.9h7.73a.9.9 0 0 1 0 1.8h-7.73a.9.9 0 0 1-.9-.9ZM7.235 11.1a.9.9 0 0 1 .9-.9h7.73a.9.9 0 0 1 0 1.8h-7.73a.9.9 0 0 1-.9-.9Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%);
}

.reaction .icoShare {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23000' d='M17.834 15.122a4.123 4.123 0 0 0-2.98 1.27l-4.801-3.112a4.22 4.22 0 0 0 0-3.038l4.8-3.112a4.137 4.137 0 0 0 5.57.347 4.226 4.226 0 0 0 .903-5.554A4.163 4.163 0 0 0 18.912.145a4.129 4.129 0 0 0-2.973.313 4.184 4.184 0 0 0-1.998 2.244 4.23 4.23 0 0 0 .01 3.015l-4.8 3.113a4.156 4.156 0 0 0-2.132-1.181 4.133 4.133 0 0 0-2.422.22A4.173 4.173 0 0 0 2.71 9.415a4.227 4.227 0 0 0 0 4.692 4.173 4.173 0 0 0 1.887 1.546c.768.315 1.611.392 2.422.22a4.156 4.156 0 0 0 2.131-1.18l4.801 3.112a4.235 4.235 0 0 0-.135 2.62 4.203 4.203 0 0 0 1.433 2.19 4.14 4.14 0 0 0 4.94.173 4.196 4.196 0 0 0 1.58-2.084 4.234 4.234 0 0 0 .045-2.624 4.2 4.2 0 0 0-1.508-2.139 4.141 4.141 0 0 0-2.472-.819Zm0-13.445c.495 0 .978.148 1.389.425a2.54 2.54 0 0 1 .379 3.879 2.48 2.48 0 0 1-2.724.546 2.504 2.504 0 0 1-1.122-.928 2.536 2.536 0 0 1 .312-3.182 2.492 2.492 0 0 1 1.766-.74ZM6.17 14.282c-.494 0-.978-.148-1.389-.425a2.516 2.516 0 0 1-.92-1.131 2.54 2.54 0 0 1 .541-2.748 2.48 2.48 0 0 1 2.724-.546c.457.19.847.514 1.122.928a2.537 2.537 0 0 1-.312 3.183 2.492 2.492 0 0 1-1.766.739Zm11.664 7.563c-.494 0-.977-.148-1.388-.425a2.517 2.517 0 0 1-.921-1.132 2.54 2.54 0 0 1 .542-2.747 2.48 2.48 0 0 1 2.724-.546c.456.19.847.514 1.122.928a2.536 2.536 0 0 1-.312 3.182 2.492 2.492 0 0 1-1.767.74Z'/%3E%3C/svg%3E");
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%);
}

.reaction .icoBookmark,
.reaction .icoShare {
    width: 40px;
    height: 40px;
    background-size: auto 24px
}

.reaction .icoBookmark {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='m9.694 2.15 4.627-.016c1.537-.006 2.779-.01 3.757.114 1.015.13 1.88.411 2.573 1.08.695.672.996 1.522 1.137 2.52.136.955.14 2.167.145 3.657l.026 7.615c.005 1.4.009 2.557-.117 3.414-.127.87-.433 1.751-1.329 2.178-.885.423-1.769.124-2.545-.306-.77-.426-1.705-1.135-2.844-2l-.822-.623c-.686-.52-1.14-.862-1.514-1.082-.354-.208-.555-.256-.724-.255-.17 0-.37.05-.723.26-.373.222-.824.567-1.506 1.093l-.818.629c-1.133.872-2.062 1.587-2.83 2.019-.774.435-1.655.74-2.543.324-.9-.422-1.21-1.3-1.344-2.17-.132-.856-.136-2.012-.14-3.413l-.027-7.615c-.005-1.49-.01-2.702.12-3.658.134-.999.428-1.85 1.12-2.527.688-.674 1.551-.962 2.565-1.098.977-.13 2.219-.135 3.756-.14ZM6.177 4.074c-.823.11-1.248.309-1.545.6-.294.287-.49.692-.596 1.481-.11.818-.108 1.905-.103 3.479l.026 7.47c.005 1.499.011 2.517.12 3.224.109.71.276.788.328.813.063.03.25.101.898-.263.64-.36 1.467-.993 2.674-1.923l.799-.614c.63-.486 1.165-.897 1.641-1.181.508-.303 1.03-.512 1.638-.514.61-.002 1.132.203 1.642.502.478.281 1.016.689 1.65 1.17l.803.61c1.213.92 2.044 1.547 2.687 1.903.65.36.837.287.9.257.051-.025.218-.105.322-.815.104-.707.103-1.726.098-3.225l-.026-7.47c-.005-1.573-.011-2.66-.127-3.478-.112-.789-.31-1.192-.606-1.477-.3-.29-.725-.484-1.55-.589-.847-.108-1.97-.106-3.586-.1l-4.5.015c-1.616.006-2.74.012-3.587.125Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    -webkit-filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    -webkit-transition: none;
    transition: none
}

.reaction .-active .icoBookmark {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='m9.694 2.15 4.627-.016c1.537-.006 2.779-.01 3.757.114 1.015.13 1.88.411 2.573 1.08.695.672.996 1.522 1.137 2.52.136.955.14 2.167.145 3.657l.026 7.615c.005 1.4.009 2.557-.117 3.414-.127.87-.433 1.751-1.329 2.178-.885.423-1.769.124-2.545-.306-.77-.426-1.705-1.135-2.844-2l-.822-.623c-.686-.52-1.14-.862-1.514-1.082-.354-.208-.555-.256-.724-.255-.17 0-.37.05-.723.26-.373.222-.824.567-1.506 1.093l-.818.629c-1.133.872-2.062 1.587-2.83 2.019-.774.435-1.655.74-2.543.324-.9-.422-1.21-1.3-1.344-2.17-.132-.856-.136-2.012-.14-3.413l-.027-7.615c-.005-1.49-.01-2.702.12-3.658.134-.999.428-1.85 1.12-2.527.688-.674 1.551-.962 2.565-1.098.977-.13 2.219-.135 3.756-.14Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    -webkit-filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
}

.reaction .icoDislike {
    width: 40px;
    height: 40px;
    background-size: auto 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23000' d='M5.261 14.652h3.855l-.871 3.906a2.561 2.561 0 0 0 .97 2.611l.6.448a1.916 1.916 0 0 0 2.806-.571 47.475 47.475 0 0 1 4.04-6.143.716.716 0 0 0 .646.41h3.976a.72.72 0 0 0 .717-.715V3.374a.713.713 0 0 0-.717-.714h-3.979a.71.71 0 0 0-.697.617A3.976 3.976 0 0 0 13.694 2H9.756a3.964 3.964 0 0 0-3.294 1.756L2.547 9.603a3.239 3.239 0 0 0 1.039 4.588 3.273 3.273 0 0 0 1.675.461ZM18.021 4.09h2.544v9.796h-2.543V4.089Zm-14.28 6.306 3.915-5.847a2.516 2.516 0 0 1 2.1-1.12h3.938a2.546 2.546 0 0 1 2.02 1.006l.873 1.159v7.335c-1.498 1.26-3.632 4.667-5.21 7.406a.465.465 0 0 1-.316.227.48.48 0 0 1-.386-.085l-.599-.448a1.143 1.143 0 0 1-.43-1.16l1.063-4.775a.71.71 0 0 0-.39-.799.721.721 0 0 0-.31-.07h-4.75a1.835 1.835 0 0 1-1.61-.962 1.814 1.814 0 0 1 .09-1.867h.002Z'/%3E%3C/svg%3E");
    -webkit-filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    -webkit-transition: none;
    transition: none
}

.reaction .-active .icoDislike {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M8.116 15.652H4.26a3.273 3.273 0 0 1-2.875-1.715 3.237 3.237 0 0 1 .161-3.334l3.915-5.847A3.964 3.964 0 0 1 8.756 3h3.938a3.99 3.99 0 0 1 2.912 1.277.705.705 0 0 1 .698-.617h3.979a.719.719 0 0 1 .717.714v11.224a.713.713 0 0 1-.717.714h-3.976a.72.72 0 0 1-.646-.409 47.475 47.475 0 0 0-4.04 6.143 1.904 1.904 0 0 1-1.274.915 1.92 1.92 0 0 1-1.532-.344l-.6-.448a2.572 2.572 0 0 1-.97-2.611l.87-3.906Zm7.384-.17h.804V4.5H15.5v10.982Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    -webkit-filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%);
}

.reaction .icoLike {
    width: 40px;
    height: 40px;
    background-size: auto 26px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Cpath fill='%23000' d='m18.77 9.366-3.853.013.857-3.908a2.561 2.561 0 0 0-.98-2.608l-.6-.446a1.915 1.915 0 0 0-2.805.581A47.468 47.468 0 0 1 7.37 9.155a.715.715 0 0 0-.647-.407l-3.976.013a.719.719 0 0 0-.715.717l.04 11.224a.713.713 0 0 0 .719.712l3.978-.014a.711.711 0 0 0 .696-.62 3.976 3.976 0 0 0 2.917 1.267l3.938-.013a3.963 3.963 0 0 0 3.288-1.767l3.894-5.861a3.24 3.24 0 0 0-1.054-4.584 3.273 3.273 0 0 0-1.677-.456ZM6.048 19.974l-2.544.009-.034-9.796 2.544-.01.034 9.797Zm14.26-6.356-3.896 5.86a2.517 2.517 0 0 1-2.096 1.127l-3.938.014a2.546 2.546 0 0 1-2.024-.999l-.877-1.155-.025-7.336c1.494-1.264 3.616-4.68 5.184-7.424a.464.464 0 0 1 .316-.228.48.48 0 0 1 .386.084l.6.446a1.143 1.143 0 0 1 .435 1.159l-1.047 4.778a.712.712 0 0 0 .703.867l4.75-.017a1.833 1.833 0 0 1 1.614.956 1.815 1.815 0 0 1-.084 1.868h-.002Z'/%3E%3C/svg%3E");
    -webkit-filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    -webkit-transition: none;
    transition: none
}

.reaction .-active .icoLike {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='m18.764 9.359-3.854.013.857-3.909a2.561 2.561 0 0 0-.98-2.608l-.6-.445a1.915 1.915 0 0 0-2.805.58 47.468 47.468 0 0 1-4.019 6.157.715.715 0 0 0-.647-.407l-3.976.014a.719.719 0 0 0-.714.717l.038 11.224a.713.713 0 0 0 .72.711l3.978-.013a.711.711 0 0 0 .696-.62 3.976 3.976 0 0 0 2.917 1.267l3.938-.014A3.965 3.965 0 0 0 17.6 20.26l3.895-5.86a3.239 3.239 0 0 0-1.055-4.584 3.273 3.273 0 0 0-1.677-.456ZM6 9h1v12H6V9Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    -webkit-filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%) !important;
    filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%);
}

.photoCarousel .icon-arrow:after {
    display: none;
}

.read__content {
    color: #000;
}

.video-vertical-wrap .read__content p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 15;
    -webkit-box-orient: vertical;
}

.titleBlock {
    margin: 15px 0 0 0;
}

.titleBlock h1,
.titleBlock .read__date {
    padding: 0;
}

footer {
    background-color: #669B2E;
    width: 100%;
    min-height: 22.875rem;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: column;
    padding: 3.125rem;
}

footer .logo img {
    height: 4.375rem;
    object-fit: contain;
}

@media screen and (min-width: 700px) {
    .header--sticky .nav .social--container {
        max-width: none !important;
    }

    .main .container {
        width: 1100px;
    }

    .main {
        margin-top: 0;
        width: 1100px;
    }

    .main.--mobile,
    .main.--mobile .container {
        width: 100%;
    }

    .--mobile .banner-mdk {
        max-width: 500px;
    }

    .banner-mdk,
    .banner-mdk img {
        max-width: 100%;
    }



    .main .gate {
        background-color: #669B2E;
        padding: 0.9375rem 0.9375rem;
    }

    .main .gate h1 {
        font-family: "Inter", sans-serif;
        font-style: normal;
        font-weight: 700;
        font-size: 1.25rem;
        color: #fff;
        text-align: left;
    }

    .main .tagline {
        border-bottom: 0.1875rem solid #669B2E;
        margin: 1.25rem 0 1.25rem;
        text-align: left;
    }

    .main .tagline img {
        height: 3.625rem;
        width: auto;
    }

    .main .left-section {
        max-width: 50rem;
        width: 100%;
        margin-right: 1.25rem;
        position: relative;
    }

    .main .left-section .headlineThumb {
        width: 100%
    }


    .main .left-section .headlineThumb a {
        width: 100%
    }

    .main>.my-section:first-child {
        margin-top: 0;
        padding-top: 24px;
    }

    .main .left-section .headlineThumb a img {
        max-height: 28.125rem;
        height: 100%;
        width: 100%;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

    .main .left-section .headlineThumb a figure {
        position: relative;
        width: 100%;
        height: 100%
    }

    .main .left-section .headlineThumb a figure figcaption {
        position: absolute;
        bottom: 0;
        padding: 1.25rem;
        z-index: 9;
    }

    .main .left-section .headlineThumb a figure figcaption hr {
        width: 10%;
        height: 1px;
        border-top: 0.125rem solid #fff;
        top: 0;
        position: absolute;
    }

    .main .left-section .headlineThumb a figure figcaption h2 {
        color: #fff;
        font-family: "Inter", sans-serif;
        font-style: normal;
        font-size: 26px;
        font-weight: 700;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .main .left-section .headlineThumb a figure figcaption p {
        color: #fff;
        font-family: "Inter", sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 12px;
        padding-top: 0;
    }

    .main .left-section .headlineThumb a figure .gradient {
        height: 60%;
        width: 100%;
        position: absolute;
        bottom: 0;
        z-index: 0;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

    .main .left-section .headlineThumb a figure .play-btn {
        position: absolute;
        background-image: url("../images/play.png");
        background-repeat: no-repeat;
        background-size: contain;
        top: 40%;
        right: 0;
        left: 45%;
        bottom: 0;
        width: 4.375rem;
        z-index: 9;
    }

    .main .left-section .articleThumb {
        width: 100%;
        height: 9.375rem;
        position: absolute;
    }

    .main .left-section .articleThumb .swiper-slide .card {
        display: flex;
        flex-direction: row;
        width: 100%;
        height: 100%;
        border-radius: 1rem;
        align-items: center;
        justify-content: center;
    }

    .main .left-section .articleThumb .swiper-slide .card .card_image {
        width: 35%;
        height: 70%;
        display: flex;
        justify-content: center;
        align-content: center;
        overflow: hidden;
    }

    .main .left-section .articleThumb .swiper-slide .card .card_image img {
        object-fit: cover;
        width: 100%;
        border-radius: 12px;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        -ms-border-radius: 12px;
        -o-border-radius: 12px;
    }

    .main .left-section .articleThumb .swiper-slide .card .card_content {
        width: 50%;
        margin-left: 0.9375rem;
    }

    .main .left-section .articleThumb .swiper-slide .card .card_content .card_date p {
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 10px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        color: #4d4d4d;
    }

    .main .left-section .articleThumb .swiper-slide .card .card_content .card_date p span {
        color: rgba(77, 77, 77, .5137254902);
    }

    .main .left-section .articleThumb .swiper-slide .card .card_content .card_title {
        font-family: "Inter", sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 0.875rem;
        border-radius: 12px;
        color: #51a5b5;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }


    .article-headline-small {
        flex-wrap: wrap;
        gap: 16px;
        row-gap: 24px;
    }

    .artHl-list {
        width: calc(50% - (16px / 2));
    }

    .artHl-img {
        width: 165px;
        min-height: 107px;
        height: 107px;
        max-height: 107px;
    }

    .main .right-section {
        max-width: 18.75rem;
        width: 100%;
    }

    .main .right-section .adsSection {
        position: relative;
        width: 18.75rem;
        height: 37.5rem;
    }

    .main .right-section .adsSection img {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
    }

    .main .title {
        border-bottom: none !important;
        position: relative;
        margin-bottom: 16px;
    }

    .main .title h3 {
        font-family: "Inter", sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 25px;
        width: auto;
        padding-left: 18px;
    }

    .main .title h3::after {
        width: 3px;
        height: 65%;
    }

    .main .title.big h3 {
        font-size: 36px;
    }

    .title .articleMore {
        position: absolute;
        top: 4px;
        right: 0;
        margin: auto;
    }

    .main .title hr {
        width: 100%;
        height: 1px;
        margin-left: 0;
    }

    .main .title a.articleMore {
        font-family: Inter, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 1;
        color: #0f79c6;
        padding-right: 20px;
        position: absolute;
        display: inline-table;
        top: 50%;
        transform: translateY(-50%);
    }

    .main .title a.articleMore::after {
        filter: invert(37%) sepia(61%) saturate(4987%) hue-rotate(188deg) brightness(90%) contrast(88%);
        background-image: url("data:image/svg+xml, %3Csvg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 9L5 5L1 1' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    }



    .main .eachCardArticle1 {
        display: flex;
        justify-content: center;
        flex-direction: row;
        gap: 20px;
        flex-wrap: wrap;
    }

    .main .eachCardArticle1.--morelist {
        gap: 0;
        justify-content: start;
    }


    .main .eachCardArticle1 .card {
        width: calc(33% - 10px);
    }

    .main .eachCardArticle1.--morelist .card {
        width: calc(20% - 16px);
        margin: 0 8px;
    }

    .--listbaca .title {
        padding: 0 8px;
    }



    .main .eachCardArticle1 .card img {
        height: 188px;
        object-fit: cover;
    }

    .main .eachCardArticle1.--morelist .card img {
        height: 120px;
    }

    .main .eachCardArticle1 .card .card_title {
        font-family: "Inter", sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 1.125rem;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .main .eachCardArticle1.--morelist .card .card_title {
        -webkit-line-clamp: 3;
        font-size: 15px;
    }

    .eachCardArticle1.--morelist .artHl-date p {
        font-size: 12px !important;
        margin: 0;
    }

    .main .eachCardArticle1 .card .card_body p {
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 14px;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        color: #4b4b4b;
    }

    .main .eachCardArticle1 .card .card_body span {
        font-size: 0.75rem;
    }

    .main .eachCardArticle2 {
        display: flex;
        flex-direction: column;
    }

    .main .eachCardArticle2 .card {
        display: flex;
        flex-direction: row;
        gap: 10px;
        width: 100%;
        padding: .5rem .5rem .5rem 0;
        margin-top: 0.5625rem;
    }

    .main .eachCardArticle2 .card .card_image img {
        border-radius: 12px;
        width: 43.75rem;
        height: 9.375rem;
        object-fit: cover;
    }

    .main .eachCardArticle2 .card .card_content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding-left: 10px;
        width: 100%
    }

    .main .eachCardArticle2 .card .card_content .card_title {
        font-family: "Inter", sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 18px;
        padding: .5rem;
        color: #4d4d4d;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        padding: 0;
        margin-bottom: 10px;
    }

    .main .eachCardArticle2 .card .card_content .card_body p {
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 0.875rem;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        color: #4b4b4b;
    }

    .main .eachCardArticle2 .card .card_content .card_footer p {
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 0.875rem;
        color: #4d4d4d;
    }

    .main .eachCardArticle2 .card .card_content .card_footer p span.label {
        color: #669B2E;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 700;
        font-style: normal;
    }

    .main ul.breadcrumb {
        padding: 10px 0 0.1875rem 0;
        list-style: none;
    }

    .main ul.breadcrumb li {
        display: inline;
        font-size: 0.9375rem;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 700;
        font-style: normal;
    }

    .main ul.breadcrumb li+li:before {
        padding: 8px;
        color: #4d4d4d;
        content: "/ "
    }

    .main ul.breadcrumb li a {
        color: #4d4d4d;
        text-decoration: none;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 700;
        font-style: normal;
    }

    .main ul.breadcrumb li a :hover {
        color: #01447e;
        text-decoration: underline;
    }

    .main ul.breadcrumb li a span.label {
        color: #669B2E;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 700;
        font-style: normal;
    }

    .main .headTitle {
        max-width: 56.25rem;
    }

    .main .headTitle h1 {
        font-family: "Inter", sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 2.5rem;
        color: #4d4d4d;
        margin: 0 0 10px;
    }

    .main .headTitle p {
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 0.875rem;
        color: #4d4d4d;
    }

    .main .headTitle p span.label {
        color: #669B2E;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 700;
        font-style: normal;
    }

    .main .leftSectionArticle {
        max-width: 50rem;
        width: 100%;
        margin-right: 0.9375rem;
    }

    .main .leftSectionArticle .readContent {
        margin-top: 1.25rem;
        margin-bottom: 6.25rem;
    }

    .main .leftSectionArticle .readContent p {
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 1rem;
        color: #4d4d4d;
    }

    .main .leftSectionArticle .readContent p a {
        color: #669B2E;
    }

    .main .leftSectionArticle .readContent p a:hover {
        color: #4da2b1;
    }

    .main .leftSectionArticle .readContent p a:active {
        color: #669B2E;
    }

    .main .rightSectionArticle {
        max-width: 18.75rem;
        width: 100%
    }

    .main .rightSectionArticle img {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
    }

    .main .moreArticle {
        margin-top: 1.25rem;
    }

    .main .moreArticle .card {
        width: 20%;
        margin-bottom: 9.375rem;
        position: relative;
    }

    .main .moreArticle .card .card_title {
        background-color: #669B2E;
        padding: 1.25rem;
        border-radius: 0.9375rem;
        -webkit-border-radius: 0.9375rem;
        -moz-border-radius: 0.9375rem;
        -ms-border-radius: 0.9375rem;
        -o-border-radius: 0.9375rem;
        top: 4.375rem;
        position: absolute;
        width: 80%;
        margin: 0 auto;
        left: 0;
        right: 0;
    }

    .main .moreArticle .card .card_title h3 {
        font-family: "Inter", sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 0.9375rem;
        padding: 0;
        color: #fff;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }

    .main .pagination {
        position: relative;
        width: 100%;
        height: 12.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }

    .main .pagination a {
        border: 0.125rem solid #669B2E;
        color: #669B2E;
        border-radius: 0.3125rem;
        -webkit-border-radius: 0.3125rem;
        -moz-border-radius: 0.3125rem;
        -ms-border-radius: 0.3125rem;
        -o-border-radius: 0.3125rem;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 1.25rem;
        padding: 10px;
    }

    .main .pagination a.active {
        background-color: #669B2E;
        color: #fff;
    }

    .main .pagination a:first-child {
        background-color: rgba(92, 189, 206, .5647058824);
        color: #fff;
    }

    .main .pagination a:last-child {
        background-color: rgba(92, 189, 206, .5647058824);
        color: #fff;
    }

    .video-vertical-mdk-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 16px;
    }

    .video-vertical-mdk-wrap.--listrolls {
        flex-wrap: wrap;
        row-gap: 24px;
    }


    .video-vertical-mdk-wrap.tns-slider {
        gap: 0;
    }



    .video-vertical-mdk-wrap .tns-item.articleItem {
        margin-right: 0;
    }

    .video-vertical-mdk-wrap .articleItem-box {
        content: "";
        padding: 15px 12px;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 1;
        pointer-events: none;
        background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(111, 164, 46, 0.8)));
        background: linear-gradient(180deg, transparent, rgba(111, 164, 46, 1));
        border-radius: 0 0 8px 8px;
    }

    .video-vertical-mdk-wrap .articleTitle {
        font-size: 18px;
        font-weight: 600;
        -webkit-line-clamp: 3;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        color: #fff;
        white-space: normal;
        line-height: 130%;
    }

    .video-vertical-mdk-wrap .article__link:hover,
    .video-vertical-mdk-wrap .article-link:hover .articleTitle,
    .video-vertical-mdk-wrap .articleTitle:hover {
        color: #fff;
    }


    .video-vertical-mdk-wrap .articleItem {
        width: calc(25% - (16px / 2));
        overflow: hidden;
        border-radius: 8px;
    }

    .video-vertical-mdk-wrap.--listrolls .articleItem {
        width: calc(25% - (24px / 2));
    }


    .articleItem a {
        position: relative;
        overflow: hidden;
    }

    .video-vertical-mdk-wrap .articleItem-img {
        border-radius: 8px;
        width: 100%;
        padding-bottom: 167.53%;
        position: relative;
        overflow: hidden;
        background: #f0f0f0;
    }

    .video-vertical-mdk-wrap .articleItem-img::before {
        padding-top: 0;

        content: "";
        display: block;
        pointer-events: none;
    }

    .video-vertical-mdk-wrap .articleItem-img img {
        position: absolute;
        left: 0;
        width: 100%;
    }

    .reelsItem-play {
        width: 60px;
        height: 60px;
        display: inline-block;
        background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 .5A6.5 6.5 0 1 0 13.5 7 6.512 6.512 0 0 0 7 .5Zm2.275 6.919-3 2A.544.544 0 0 1 6 9.5a.531.531 0 0 1-.237-.056A.5.5 0 0 1 5.5 9V5a.5.5 0 0 1 .263-.444.519.519 0 0 1 .512.025l3 2a.5.5 0 0 1 0 .838Z' fill='%23000'/%3E%3C/svg%3E");
        -webkit-filter: invert(100%) sepia(0) saturate(6817%) hue-rotate(208deg) brightness(118%) contrast(82%);
        filter: invert(100%) sepia(0) saturate(6817%) hue-rotate(208deg) brightness(118%) contrast(82%);
        background-size: auto 100%;
        background-position: 50%;
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 2;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        opacity: 0.8;
    }


    .video-vertical-wrap {
        display: flex;
        margin-top: 20px;
    }

    .video-vertical-wrap .embed-reels {
        width: 380px;
        flex-basis: 380px;

        flex-shrink: 0;
        height: 618px;
        overflow: hidden;
        border-bottom: 1px solid #F8F8F8;

    }

    .video-vertical-wrap .embed-reels:has(.tiktok-embed) {
        flex-basis: auto;
        width: fit-content;
        min-width: 325px;
        max-width: 325px;

        border-radius: 5px;
    }

    .video-vertical-wrap .read__content p {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 15;
        -webkit-box-orient: vertical;
    }

    .video-vertical-wrap .embed-reels iframe {
        width: 100% !important;
    }

    .video-vertical-wrap .tiktok-embed {
        margin: 0;
    }

    .video-vertical-info {
        width: 100%;
        padding: 24px;
        background: #F8F8F8;
        height: 618px;
        overflow: hidden;
        min-width: 325px;
    }

    .video-vertical-info .read__title {
        font-size: 24px;
        color: #000;
    }

    .read__time {
        color: #747474;
    }

    .video-others-vertical .videoKG-image {
        height: 233px;
    }

    .gamification-head {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .gamification-head .socmedList {
        padding: 0 10px;
    }

    .reaction .icoComment {
        width: 32px;
        height: 32px;
        background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 32 32' style='enable-background:new 0 0 32 32' xml:space='preserve'%3E%3Cstyle%3E.st1%7Bfill:none;stroke:%23000;stroke-width:1.8;stroke-linecap:round%7D%3C/style%3E%3Cpath d='M23 7H9c-1.1 0-2 .9-2 2v13.7c0 1.7 2 2.6 3.3 1.5l3.5-2.9c.4-.3.8-.5 1.3-.5H23c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2z' style='fill:none;stroke:%23000;stroke-width:1.8;stroke-linejoin:round'/%3E%3Cpath class='st1' d='M11.9 12.1h8.2M11.9 16.1h8.2'/%3E%3C/svg%3E");
    }

    .reaction .icoDislike {
        background-size: contain;
        background-repeat: no-repeat;
        width: 32px;
        height: 32px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' style='enable-background:new 0 0 32 32' xml:space='preserve'%3E%3Cpath d='M8.4 19.3h4l-.9 4.1c-.1.5-.1 1 .1 1.5s.5.9.9 1.2l.6.5c.2.2.5.3.8.4s.6.1.8 0c.3-.1.5-.2.8-.3l.6-.6c1.2-2.3 2.7-4.4 4.2-6.4l.3.3c.1.1.3.1.4.1h4.2c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.5v-12c0-.2-.1-.4-.2-.5-.1-.1-.3-.2-.5-.2H21c-.2 0-.4.1-.5.2-.1.1-.2.3-.2.5-.4-.4-.9-.8-1.4-1-.5-.3-1-.4-1.6-.4h-4.1c-.7 0-1.4.2-2 .5s-1.1.8-1.5 1.4L5.6 14c-.4.5-.6 1.1-.6 1.7 0 .6.1 1.2.4 1.8s.7 1 1.3 1.3c.5.3 1.1.5 1.7.5zM21.8 8.2h2.7v10.3h-2.7V8.2zm-15 6.6 4.1-6.1c.2-.4.6-.7 1-.9s.8-.3 1.3-.3h4.1c.4 0 .8.1 1.2.3s.7.4.9.8l.9 1.2v7.7c-1.6 1.3-3.8 4.9-5.5 7.8 0 .1-.1.1-.1.2-.1 0-.1.1-.2.1h-.2c-.1 0-.1 0-.2-.1l-.6-.5c-.2-.1-.3-.3-.4-.5-.1-.2-.1-.5 0-.7l1.1-5v-.3c0-.1-.1-.2-.1-.3-.1-.1-.2-.2-.3-.2-.1 0-.2-.1-.3-.1h-5c-.3 0-.7-.1-1-.3-.3-.2-.5-.4-.7-.7-.2-.3-.2-.6-.2-1-.1-.5 0-.8.2-1.1z'/%3E%3C/svg%3E");
    }

    .reaction .-active .icoDislike,
    .reaction .-active .icoLike {
        background-size: auto 26px;
        background-position: center;
    }

    .reaction .icoLike {
        background-size: contain;
        background-repeat: no-repeat;
        width: 32px;
        height: 32px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' style='enable-background:new 0 0 32 32' xml:space='preserve'%3E%3Cpath d='M22.6 12.7h-4l.9-4.1c.1-.5.1-1-.1-1.5s-.5-.9-.9-1.2l-.6-.5c-.3-.2-.6-.3-.9-.4h-.8c-.3.1-.5.2-.8.3-.2.2-.4.5-.6.7-1.2 2.3-2.7 4.4-4.2 6.4l-.3-.3c-.1-.1-.3-.1-.4-.1H5.8c-.2 0-.4.1-.5.2-.2.2-.3.4-.3.6v11.8c0 .2.1.4.2.5.1.1.3.2.5.2h4.2c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.5.4.4.9.8 1.4 1 .5.2 1.1.4 1.7.4h4.1c.7 0 1.4-.2 2-.5.6-.3 1.1-.8 1.5-1.4l4.1-6.1c.3-.5.5-1.1.6-1.7 0-.6-.1-1.2-.4-1.8s-.7-1-1.3-1.3c-.5-.3-1.1-.5-1.7-.5zM9.2 23.8H6.5V13.5h2.7v10.3zm15-6.6-4.1 6.1c-.2.4-.6.7-1 .9-.4.2-.8.3-1.3.3h-4.1c-.4 0-.8-.1-1.2-.3-.4-.2-.7-.4-.9-.8l-.9-1.2v-7.7c1.6-1.3 3.8-4.9 5.5-7.8 0-.1.1-.1.1-.2.1 0 .1-.1.2-.1h.2c.1 0 .1 0 .2.1l.6.5c.2.1.3.3.4.5.1.3.1.6.1.8l-1.1 5v.3c0 .1.1.2.1.3.1.1.2.2.3.2.1 0 .2.1.3.1h5c.3 0 .7.1 1 .3.3.2.5.4.7.7.2.3.2.6.2 1s-.1.7-.3 1z'/%3E%3C/svg%3E");
    }

    .socmedModal .socmedButton {
        flex-basis: 65px;
        width: 65px;
    }



    footer {
        background-color: #669B2E;
        width: 100%;
        min-height: 22.875rem;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        flex-direction: column;
    }

    footer .logo img {
        height: 4.375rem;
    }

    .wSpec-subtitle {
        margin-top: 10px;
    }

    .main .container.--listbaca {
        max-width: 100%;
        padding: 0 15px;
    }

}

@media screen and (min-width: 1100px) {

    .main {
        width: 100%;
    }
}

.grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    gap: 2.5rem;
    width: min(100% - 2.5rem, 68.75rem);
    margin-inline: auto;
}

@media(min-width: 56.25em) {
    .grid {
        grid-template-columns: 2fr 1fr;
        grid-template-rows: auto;
    }
}

.flex {
    display: flex;
}

.flex.wrap {
    flex-wrap: wrap;
}

.flex.row {
    flex-flow: row wrap;
}

.flex.col {
    flex-flow: column wrap;
}

.flex.dir-row {
    flex-direction: row;
}

.flex.dir-column {
    flex-direction: column;
}

.flex.col-reverse {
    flex-direction: column-reverse;
}

.flex.row-reverse {
    flex-direction: row-reverse;
}

.flex.just-start {
    justify-content: start;
}

.flex.just-end {
    justify-content: end;
}

.flex.space-around {
    justify-content: space-around;
}

.flex.just-center {
    justify-content: center;
}

.flex.align-start {
    align-items: flex-start;
}

.flex.align-end {
    align-items: flex-end;
}

.flex.align-center {
    align-items: center;
}

.gap {
    padding: 3.125rem;
}

img {
    vertical-align: middle;
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
    width: 100%
}

.main .container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.container-fluid {
    margin-right: auto;
    margin-left: auto;
}

.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
    position: relative;
    min-height: 0.0625rem;
    padding-left: 10px;
    padding-right: 10px;
}

.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12 {
    float: left;
}

.col-xs-12 {
    width: 100%
}

.col-xs-11 {
    width: 91.66666667%
}

.col-xs-10 {
    width: 83.33333333%
}

.col-xs-9 {
    width: 75%
}

.col-xs-8 {
    width: 66.66666667%
}

.col-xs-7 {
    width: 58.33333333%
}

.col-xs-6 {
    width: 50%
}

.col-xs-5 {
    width: 41.66666667%
}

.col-xs-4 {
    width: 33.33333333%
}

.col-xs-3 {
    width: 25%
}

.col-xs-2 {
    width: 16.66666667%
}

.col-xs-1 {
    width: 8.33333333%
}

.col-xs-pull-12 {
    right: 100%
}

.col-xs-pull-11 {
    right: 91.66666667%
}

.col-xs-pull-10 {
    right: 83.33333333%
}

.col-xs-pull-9 {
    right: 75%
}

.col-xs-pull-8 {
    right: 66.66666667%
}

.col-xs-pull-7 {
    right: 58.33333333%
}

.col-xs-pull-6 {
    right: 50%
}

.col-xs-pull-5 {
    right: 41.66666667%
}

.col-xs-pull-4 {
    right: 33.33333333%
}

.col-xs-pull-3 {
    right: 25%
}

.col-xs-pull-2 {
    right: 16.66666667%
}

.col-xs-pull-1 {
    right: 8.33333333%
}

.col-xs-pull-0 {
    right: auto;
}

.col-xs-push-12 {
    left: 100%
}

.col-xs-push-11 {
    left: 91.66666667%
}

.col-xs-push-10 {
    left: 83.33333333%
}

.col-xs-push-9 {
    left: 75%
}

.col-xs-push-8 {
    left: 66.66666667%
}

.col-xs-push-7 {
    left: 58.33333333%
}

.col-xs-push-6 {
    left: 50%
}

.col-xs-push-5 {
    left: 41.66666667%
}

.col-xs-push-4 {
    left: 33.33333333%
}

.col-xs-push-3 {
    left: 25%
}

.col-xs-push-2 {
    left: 16.66666667%
}

.col-xs-push-1 {
    left: 8.33333333%
}

.col-xs-push-0 {
    left: auto;
}

.col-xs-offset-12 {
    margin-left: 100%
}

.col-xs-offset-11 {
    margin-left: 91.66666667%
}

.col-xs-offset-10 {
    margin-left: 83.33333333%
}

.col-xs-offset-9 {
    margin-left: 75%
}

.col-xs-offset-8 {
    margin-left: 66.66666667%
}

.col-xs-offset-7 {
    margin-left: 58.33333333%
}

.col-xs-offset-6 {
    margin-left: 50%
}

.col-xs-offset-5 {
    margin-left: 41.66666667%
}

.col-xs-offset-4 {
    margin-left: 33.33333333%
}

.col-xs-offset-3 {
    margin-left: 25%
}

.col-xs-offset-2 {
    margin-left: 16.66666667%
}

.col-xs-offset-1 {
    margin-left: 8.33333333%
}

.col-xs-offset-0 {
    margin-left: 0%
}

@media(min-width: 43.75em) {

    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12 {
        float: left;
    }

    .col-sm-12 {
        width: 100%
    }

    .col-sm-11 {
        width: 91.66666667%
    }

    .col-sm-10 {
        width: 83.33333333%
    }

    .col-sm-9 {
        width: 75%
    }

    .col-sm-8 {
        width: 66.66666667%
    }

    .col-sm-7 {
        width: 58.33333333%
    }

    .col-sm-6 {
        width: 50%
    }

    .col-sm-5 {
        width: 41.66666667%
    }

    .col-sm-4 {
        width: 33.33333333%
    }

    .col-sm-3 {
        width: 25%
    }

    .col-sm-2 {
        width: 16.66666667%
    }

    .col-sm-1 {
        width: 8.33333333%
    }

    .col-sm-pull-12 {
        right: 100%
    }

    .col-sm-pull-11 {
        right: 91.66666667%
    }

    .col-sm-pull-10 {
        right: 83.33333333%
    }

    .col-sm-pull-9 {
        right: 75%
    }

    .col-sm-pull-8 {
        right: 66.66666667%
    }

    .col-sm-pull-7 {
        right: 58.33333333%
    }

    .col-sm-pull-6 {
        right: 50%
    }

    .col-sm-pull-5 {
        right: 41.66666667%
    }

    .col-sm-pull-4 {
        right: 33.33333333%
    }

    .col-sm-pull-3 {
        right: 25%
    }

    .col-sm-pull-2 {
        right: 16.66666667%
    }

    .col-sm-pull-1 {
        right: 8.33333333%
    }

    .col-sm-pull-0 {
        right: auto;
    }

    .col-sm-push-12 {
        left: 100%
    }

    .col-sm-push-11 {
        left: 91.66666667%
    }

    .col-sm-push-10 {
        left: 83.33333333%
    }

    .col-sm-push-9 {
        left: 75%
    }

    .col-sm-push-8 {
        left: 66.66666667%
    }

    .col-sm-push-7 {
        left: 58.33333333%
    }

    .col-sm-push-6 {
        left: 50%
    }

    .col-sm-push-5 {
        left: 41.66666667%
    }

    .col-sm-push-4 {
        left: 33.33333333%
    }

    .col-sm-push-3 {
        left: 25%
    }

    .col-sm-push-2 {
        left: 16.66666667%
    }

    .col-sm-push-1 {
        left: 8.33333333%
    }

    .col-sm-push-0 {
        left: auto;
    }

    .col-sm-offset-12 {
        margin-left: 100%
    }

    .col-sm-offset-11 {
        margin-left: 91.66666667%
    }

    .col-sm-offset-10 {
        margin-left: 83.33333333%
    }

    .col-sm-offset-9 {
        margin-left: 75%
    }

    .col-sm-offset-8 {
        margin-left: 66.66666667%
    }

    .col-sm-offset-7 {
        margin-left: 58.33333333%
    }

    .col-sm-offset-6 {
        margin-left: 50%
    }

    .col-sm-offset-5 {
        margin-left: 41.66666667%
    }

    .col-sm-offset-4 {
        margin-left: 33.33333333%
    }

    .col-sm-offset-3 {
        margin-left: 25%
    }

    .col-sm-offset-2 {
        margin-left: 16.66666667%
    }

    .col-sm-offset-1 {
        margin-left: 8.33333333%
    }

    .col-sm-offset-0 {
        margin-left: 0%
    }
}

@media(min-width: 56.25em) {

    .col-md-1,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-10,
    .col-md-11,
    .col-md-12 {
        float: left;
    }

    .col-md-12 {
        width: 100%
    }

    .col-md-11 {
        width: 91.66666667%
    }

    .col-md-10 {
        width: 83.33333333%
    }

    .col-md-9 {
        width: 75%
    }

    .col-md-8 {
        width: 66.66666667%
    }

    .col-md-7 {
        width: 58.33333333%
    }

    .col-md-6 {
        width: 50%
    }

    .col-md-5 {
        width: 41.66666667%
    }

    .col-md-4 {
        width: 33.33333333%
    }

    .col-md-3 {
        width: 25%
    }

    .col-md-2 {
        width: 16.66666667%
    }

    .col-md-1 {
        width: 8.33333333%
    }

    .col-md-pull-12 {
        right: 100%
    }

    .col-md-pull-11 {
        right: 91.66666667%
    }

    .col-md-pull-10 {
        right: 83.33333333%
    }

    .col-md-pull-9 {
        right: 75%
    }

    .col-md-pull-8 {
        right: 66.66666667%
    }

    .col-md-pull-7 {
        right: 58.33333333%
    }

    .col-md-pull-6 {
        right: 50%
    }

    .col-md-pull-5 {
        right: 41.66666667%
    }

    .col-md-pull-4 {
        right: 33.33333333%
    }

    .col-md-pull-3 {
        right: 25%
    }

    .col-md-pull-2 {
        right: 16.66666667%
    }

    .col-md-pull-1 {
        right: 8.33333333%
    }

    .col-md-pull-0 {
        right: auto;
    }

    .col-md-push-12 {
        left: 100%
    }

    .col-md-push-11 {
        left: 91.66666667%
    }

    .col-md-push-10 {
        left: 83.33333333%
    }

    .col-md-push-9 {
        left: 75%
    }

    .col-md-push-8 {
        left: 66.66666667%
    }

    .col-md-push-7 {
        left: 58.33333333%
    }

    .col-md-push-6 {
        left: 50%
    }

    .col-md-push-5 {
        left: 41.66666667%
    }

    .col-md-push-4 {
        left: 33.33333333%
    }

    .col-md-push-3 {
        left: 25%
    }

    .col-md-push-2 {
        left: 16.66666667%
    }

    .col-md-push-1 {
        left: 8.33333333%
    }

    .col-md-push-0 {
        left: auto;
    }

    .col-md-offset-12 {
        margin-left: 100%
    }

    .col-md-offset-11 {
        margin-left: 91.66666667%
    }

    .col-md-offset-10 {
        margin-left: 83.33333333%
    }

    .col-md-offset-9 {
        margin-left: 75%
    }

    .col-md-offset-8 {
        margin-left: 66.66666667%
    }

    .col-md-offset-7 {
        margin-left: 58.33333333%
    }

    .col-md-offset-6 {
        margin-left: 50%
    }

    .col-md-offset-5 {
        margin-left: 41.66666667%
    }

    .col-md-offset-4 {
        margin-left: 33.33333333%
    }

    .col-md-offset-3 {
        margin-left: 25%
    }

    .col-md-offset-2 {
        margin-left: 16.66666667%
    }

    .col-md-offset-1 {
        margin-left: 8.33333333%
    }

    .col-md-offset-0 {
        margin-left: 0%
    }
}

@media(min-width: 90em) {

    .col-lg-1,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12 {
        float: left;
    }

    .col-lg-12 {
        width: 100%
    }

    .col-lg-11 {
        width: 91.66666667%
    }

    .col-lg-10 {
        width: 83.33333333%
    }

    .col-lg-9 {
        width: 75%
    }

    .col-lg-8 {
        width: 66.66666667%
    }

    .col-lg-7 {
        width: 58.33333333%
    }

    .col-lg-6 {
        width: 50%
    }

    .col-lg-5 {
        width: 41.66666667%
    }

    .col-lg-4 {
        width: 33.33333333%
    }

    .col-lg-3 {
        width: 25%
    }

    .col-lg-2 {
        width: 16.66666667%
    }

    .col-lg-1 {
        width: 8.33333333%
    }

    .col-lg-pull-12 {
        right: 100%
    }

    .col-lg-pull-11 {
        right: 91.66666667%
    }

    .col-lg-pull-10 {
        right: 83.33333333%
    }

    .col-lg-pull-9 {
        right: 75%
    }

    .col-lg-pull-8 {
        right: 66.66666667%
    }

    .col-lg-pull-7 {
        right: 58.33333333%
    }

    .col-lg-pull-6 {
        right: 50%
    }

    .col-lg-pull-5 {
        right: 41.66666667%
    }

    .col-lg-pull-4 {
        right: 33.33333333%
    }

    .col-lg-pull-3 {
        right: 25%
    }

    .col-lg-pull-2 {
        right: 16.66666667%
    }

    .col-lg-pull-1 {
        right: 8.33333333%
    }

    .col-lg-pull-0 {
        right: auto;
    }

    .col-lg-push-12 {
        left: 100%
    }

    .col-lg-push-11 {
        left: 91.66666667%
    }

    .col-lg-push-10 {
        left: 83.33333333%
    }

    .col-lg-push-9 {
        left: 75%
    }

    .col-lg-push-8 {
        left: 66.66666667%
    }

    .col-lg-push-7 {
        left: 58.33333333%
    }

    .col-lg-push-6 {
        left: 50%
    }

    .col-lg-push-5 {
        left: 41.66666667%
    }

    .col-lg-push-4 {
        left: 33.33333333%
    }

    .col-lg-push-3 {
        left: 25%
    }

    .col-lg-push-2 {
        left: 16.66666667%
    }

    .col-lg-push-1 {
        left: 8.33333333%
    }

    .col-lg-push-0 {
        left: auto;
    }

    .col-lg-offset-12 {
        margin-left: 100%
    }

    .col-lg-offset-11 {
        margin-left: 91.66666667%
    }

    .col-lg-offset-10 {
        margin-left: 83.33333333%
    }

    .col-lg-offset-9 {
        margin-left: 75%
    }

    .col-lg-offset-8 {
        margin-left: 66.66666667%
    }

    .col-lg-offset-7 {
        margin-left: 58.33333333%
    }

    .col-lg-offset-6 {
        margin-left: 50%
    }

    .col-lg-offset-5 {
        margin-left: 41.66666667%
    }

    .col-lg-offset-4 {
        margin-left: 33.33333333%
    }

    .col-lg-offset-3 {
        margin-left: 25%
    }

    .col-lg-offset-2 {
        margin-left: 16.66666667%
    }

    .col-lg-offset-1 {
        margin-left: 8.33333333%
    }

    .col-lg-offset-0 {
        margin-left: 0%
    }
}

@-ms-viewport {
    width: device-width;
}

.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
    display: none !important;
}

@media(max-width: 20.62375em) {
    .visible-xs {
        display: block !important;
    }

    table.visible-xs {
        display: table !important;
    }

    tr.visible-xs {
        display: table-row !important;
    }

    th.visible-xs,
    td.visible-xs {
        display: table-cell !important;
    }
}

@media(max-width: 20.62375em) {
    .visible-xs-block {
        display: block !important;
    }
}

@media(max-width: 20.62375em) {
    .visible-xs-inline {
        display: inline !important;
    }
}

@media(max-width: 20.62375em) {
    .visible-xs-inline-block {
        display: inline-block !important;
    }
}

@media(min-width: 48em)and (max-width: 61.9375em) {
    .visible-sm {
        display: block !important;
    }

    table.visible-sm {
        display: table !important;
    }

    tr.visible-sm {
        display: table-row !important;
    }

    th.visible-sm,
    td.visible-sm {
        display: table-cell !important;
    }
}

@media(min-width: 48em)and (max-width: 61.9375em) {
    .visible-sm-block {
        display: block !important;
    }
}

@media(min-width: 48em)and (max-width: 61.9375em) {
    .visible-sm-inline {
        display: inline !important;
    }
}

@media(min-width: 48em)and (max-width: 61.9375em) {
    .visible-sm-inline-block {
        display: inline-block !important;
    }
}

@media(min-width: 62em)and (max-width: 74.9375em) {
    .visible-md {
        display: block !important;
    }

    table.visible-md {
        display: table !important;
    }

    tr.visible-md {
        display: table-row !important;
    }

    th.visible-md,
    td.visible-md {
        display: table-cell !important;
    }
}

@media(min-width: 62em)and (max-width: 74.9375em) {
    .visible-md-block {
        display: block !important;
    }
}

@media(min-width: 62em)and (max-width: 74.9375em) {
    .visible-md-inline {
        display: inline !important;
    }
}

@media(min-width: 62em)and (max-width: 74.9375em) {
    .visible-md-inline-block {
        display: inline-block !important;
    }
}

@media(min-width: 75em) {
    .visible-lg {
        display: block !important;
    }

    table.visible-lg {
        display: table !important;
    }

    tr.visible-lg {
        display: table-row !important;
    }

    th.visible-lg,
    td.visible-lg {
        display: table-cell !important;
    }
}

@media(min-width: 75em) {
    .visible-lg-block {
        display: block !important;
    }
}

@media(min-width: 75em) {
    .visible-lg-inline {
        display: inline !important;
    }
}

@media(min-width: 75em) {
    .visible-lg-inline-block {
        display: inline-block !important;
    }
}

@media(max-width: 56.24875em) {
    .hidden-xs {
        display: none !important;
    }
}

@media(min-width: 48em)and (max-width: 61.9375em) {
    .hidden-sm {
        display: none !important;
    }
}

@media(min-width: 62em)and (max-width: 74.9375em) {
    .hidden-md {
        display: none !important;
    }
}

@media(min-width: 75em) {
    .hidden-lg {
        display: none !important;
    }
}

/*# sourceMappingURL=style.css.map */