/*========================================
a00. Colors! Jibunn woooo!
==========================================*/

.plugin a, ul li a, .footer_entry a, .judul_artikel a {
    color: #DE004A; /*solen as intended, but bad for accessibility: #F06525 */
    font-weight: 700;
}

.plugin a:hover, ul li a:hover, .footer_entry a:hover, .judul_artikel a:hover {
    color: #F06387; /*solen as intended, but bad for accessibility: #F6852A */
    font-weight: 700;
}

.white_bg {
    background-color: #ffffff;
}

blockquote {
    box-shadow: inset 5px 0 rgba(255, 165, 0);
}

/*== For icon font use only

.sr-only {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }

==*/ 

/*========================================
a01. Body and Navigation Area
==========================================*/

.flex {
    width: 100%;
}

nav .brand * {
    vertical-align: baseline;
}

body{
    font-family: 'Quicksand', sans-serif;
    display:flex;
    flex-direction:column;
    min-height: 100vh;
    margin:0;
    font-weight: 500;
}

.main_menu {
    font-weight: 700;
    border-bottom: #ffa500 1px solid;
    padding: 0 0 10px 0;
    min-height: 50px;
    box-sizing: content-box;
}

.fixed_top {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
}

nav {
    position: relative;
}

.header{
    box-shadow: none;
    padding: 10px 0 0 0;
}

.limit_width {
    margin: 0 auto;
    max-width: 1152px;
}

.burger {
    padding-left: 2em;
}

.brand {
    font-size: 2em;
    width: .6em;
}

/*
.cari {
    width: 10rem;
    font-family: simple-line-icons, Quicksand;
}
*/

.bottom_foot {
    flex: 1;
}

/*========================================
a02. Mini Hero Area
==========================================*/

.mini_hero {
    /* background by SVGBackgrounds.com */
    background-color: #ee5522;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 1500'%3E%3Cdefs%3E%3CradialGradient id='a' gradientUnits='objectBoundingBox'%3E%3Cstop offset='0' stop-color='%23FB3'/%3E%3Cstop offset='1' stop-color='%23ee5522'/%3E%3C/radialGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='0' y1='750' x2='1550' y2='750'%3E%3Cstop offset='0' stop-color='%23f7882b'/%3E%3Cstop offset='1' stop-color='%23ee5522'/%3E%3C/linearGradient%3E%3Cpath id='s' fill='url(%23b)' d='M1549.2 51.6c-5.4 99.1-20.2 197.6-44.2 293.6c-24.1 96-57.4 189.4-99.3 278.6c-41.9 89.2-92.4 174.1-150.3 253.3c-58 79.2-123.4 152.6-195.1 219c-71.7 66.4-149.6 125.8-232.2 177.2c-82.7 51.4-170.1 94.7-260.7 129.1c-90.6 34.4-184.4 60-279.5 76.3C192.6 1495 96.1 1502 0 1500c96.1-2.1 191.8-13.3 285.4-33.6c93.6-20.2 185-49.5 272.5-87.2c87.6-37.7 171.3-83.8 249.6-137.3c78.4-53.5 151.5-114.5 217.9-181.7c66.5-67.2 126.4-140.7 178.6-218.9c52.3-78.3 96.9-161.4 133-247.9c36.1-86.5 63.8-176.2 82.6-267.6c18.8-91.4 28.6-184.4 29.6-277.4c0.3-27.6 23.2-48.7 50.8-48.4s49.5 21.8 49.2 49.5c0 0.7 0 1.3-0.1 2L1549.2 51.6z'/%3E%3Cg id='g'%3E%3Cuse href='%23s' transform='scale(0.12) rotate(60)'/%3E%3Cuse href='%23s' transform='scale(0.2) rotate(10)'/%3E%3Cuse href='%23s' transform='scale(0.25) rotate(40)'/%3E%3Cuse href='%23s' transform='scale(0.3) rotate(-20)'/%3E%3Cuse href='%23s' transform='scale(0.4) rotate(-30)'/%3E%3Cuse href='%23s' transform='scale(0.5) rotate(20)'/%3E%3Cuse href='%23s' transform='scale(0.6) rotate(60)'/%3E%3Cuse href='%23s' transform='scale(0.7) rotate(10)'/%3E%3Cuse href='%23s' transform='scale(0.835) rotate(-40)'/%3E%3Cuse href='%23s' transform='scale(0.9) rotate(40)'/%3E%3Cuse href='%23s' transform='scale(1.05) rotate(25)'/%3E%3Cuse href='%23s' transform='scale(1.2) rotate(8)'/%3E%3Cuse href='%23s' transform='scale(1.333) rotate(-60)'/%3E%3Cuse href='%23s' transform='scale(1.45) rotate(-30)'/%3E%3Cuse href='%23s' transform='scale(1.6) rotate(10)'/%3E%3C/g%3E%3C/defs%3E%3Cg transform='rotate(0 0 0)'%3E%3Cg transform='rotate(0 0 0)'%3E%3Ccircle fill='url(%23a)' r='3000'/%3E%3Cg opacity='0.5'%3E%3Ccircle fill='url(%23a)' r='2000'/%3E%3Ccircle fill='url(%23a)' r='1800'/%3E%3Ccircle fill='url(%23a)' r='1700'/%3E%3Ccircle fill='url(%23a)' r='1651'/%3E%3Ccircle fill='url(%23a)' r='1450'/%3E%3Ccircle fill='url(%23a)' r='1250'/%3E%3Ccircle fill='url(%23a)' r='1175'/%3E%3Ccircle fill='url(%23a)' r='900'/%3E%3Ccircle fill='url(%23a)' r='750'/%3E%3Ccircle fill='url(%23a)' r='500'/%3E%3Ccircle fill='url(%23a)' r='380'/%3E%3Ccircle fill='url(%23a)' r='250'/%3E%3C/g%3E%3Cg transform='rotate(0 0 0)'%3E%3Cuse href='%23g' transform='rotate(10)'/%3E%3Cuse href='%23g' transform='rotate(120)'/%3E%3Cuse href='%23g' transform='rotate(240)'/%3E%3C/g%3E%3Ccircle fill-opacity='0.1' fill='url(%23a)' r='3000'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;
    /* end background */
    text-align: center;
    color: #ffffff;
    margin: 73px 0 1rem 0;
    box-shadow: inset 0px 11px 15px -14px rgb(128, 128, 128), inset 0px -11px 15px -14px rgb(128, 128, 128);
}

.section_title {
    padding-bottom: 0px;
}

.hero_welcome {
    font-size: 1.4em;
    font-weight: 500;
    margin: -5px 0 1rem 0;
}

.section_title span {
    display: inline-block;
    margin-bottom: -1px;
}

.page_spacer {
    margin: 0 0 4em 0;
}

/*========================================
a03. Body Area
==========================================*/

.section_wrapper {
    padding: 0 0.6rem 1rem 0;
}

.judul_artikel {
    padding-bottom: 0px;
    font-size: 2em;
}

hr, .article_spacer {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(255, 165, 0) 15%, rgba(255, 165, 0, 0.35) 15% 30%, rgba(0, 0, 0, 0));
}

.inside_spacer {
    border: 0;
    height: 5px;
    background: #DE004A;
    display: block;
    width: 7.5%;
}

.meta_top, .meta_bottom {
    font-size: .7em;
    margin-bottom: 5px;
}
.button harmonytab-btn {
  background-color: #F06525;
}

.meta_top {
    margin-bottom: 10px;
}

.meta_top img {
    position: relative;
    top: 2px;
}

.meta_author::after, .meta_read::after {
    content: '\2022';
    margin: 0 5px 0 5px;
}

.meta_tag {
    padding-left: 0px;
    list-style-type: none;
}

.meta_tag:before {
    content: url("data:image/svg+xml,%3Csvg preserveAspectRatio='xMinYMin meet' width='18' height='18' viewBox='0 0 1920 1920' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23F06525' d='M1152.821 372.968c-2.453 17.493-4.693 35.093-4.693 53.333 0 18.24 2.24 36.16 4.907 53.974-56.214-1.28-112.96 19.093-155.734 61.866-83.093 83.094-83.093 218.56 0 301.654 41.6 41.6 96.214 62.4 150.827 62.4s109.227-20.8 150.827-62.4c83.093-83.094 83.093-218.56 0-301.654-8.214-8.213-17.387-15.146-26.56-21.653l-.747-2.027c-11.093-29.866-16.853-60.906-16.853-92.16 0-18.453 2.346-36.053 6.186-53.333h153.814c29.333 0 53.333 24 53.333 53.333v625.494l-638.4 638.506-678.933-678.933 638.506-638.4h363.52Zm-4.693 213.44c14.827 0 29.227 3.627 42.987 9.707 16 31.68 36.48 60.48 61.44 86.08 3.306 30.826-5.44 62.613-29.014 86.186-41.706 41.707-109.12 41.707-150.826 0-41.6-41.6-41.6-109.226 0-150.826 20.8-20.8 48.106-31.147 75.413-31.147Zm373.333-533.44c-146.24 0-276.48 85.333-335.68 213.333h-440.64L-.032 1011.368l829.76 829.76 745.067-745.173V426.3c0-88.213-71.787-160-160-160h-106.347c48.853-65.706 127.147-106.666 213.013-106.666 147.094 0 266.667 119.573 266.667 266.666h106.667c0-205.866-167.467-373.333-373.334-373.333Z' fill-rule='evenodd'/%3E%3C/svg%3E");
    margin: 0 5px 0 0;
    position: relative;
    top: 2px;
}

.meta_tag li {
    display: inline;
    border: 1px solid #DE004A;
    background-color: #DE004A; /*solen as intended, but bad for accessibility: #F06525*/
    border-radius: 3px;
    padding: 5px 0 5px 0;
}

.meta_tag .pseudo {
    color: #ffffff;
}

.meta_tag .pseudo.button:hover {
    background-color: #F06525; /*solen as intended, but bad for accessibility: #F6852A */
    box-shadow: none;
}

.featured_image {
    height: 200px;
    /* background by SVGBackgrounds.com */
    background-color: #ff7700;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMidYMin slice' viewBox='0 0 1600 900'%3E%3Cpolygon fill='%23cc0000' points='957 450 539 900 1396 900'/%3E%3Cpolygon fill='%23aa0000' points='957 450 872.9 900 1396 900'/%3E%3Cpolygon fill='%23d6002b' points='-60 900 398 662 816 900'/%3E%3Cpolygon fill='%23b10022' points='337 900 398 662 816 900'/%3E%3Cpolygon fill='%23d9004b' points='1203 546 1552 900 876 900'/%3E%3Cpolygon fill='%23b2003d' points='1203 546 1552 900 1162 900'/%3E%3Cpolygon fill='%23d3006c' points='641 695 886 900 367 900'/%3E%3Cpolygon fill='%23ac0057' points='587 900 641 695 886 900'/%3E%3Cpolygon fill='%23c4008c' points='1710 900 1401 632 1096 900'/%3E%3Cpolygon fill='%239e0071' points='1710 900 1401 632 1365 900'/%3E%3Cpolygon fill='%23aa00aa' points='1210 900 971 687 725 900'/%3E%3Cpolygon fill='%23880088' points='943 900 1210 900 971 687'/%3E%3C/svg%3E");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
    /* end background */
}

.featured_image img, a {
    object-fit: cover;
    height: 100%;
    width: 100%;
    transition: transform .5s ease;
}

.featured_image img:hover, .isi_artikel img:hover {
    filter: brightness(75%);
}

.isi_artikel h2 {
    border-bottom: 1px solid #000000;
    border-top: 1px solid #000000;
}

.isi_artikel a {
    color: #DE004A;
    font-weight: 700;  
}

/* Truncate Article Fallback sapa teu kan berubah spesifikasinya
.pratinjau_artikel {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
*/

.pratinjau_artikel p {
    max-height: calc(4rem * 1.33);
      overflow: hidden;
      position: relative;
}

.pratinjau_artikel p:after {
    content: "";
    background: linear-gradient(to right, transparent, #ffffff 80%);
    display: block;
    height: calc(1rem * 1.9 + 1px);
    position: absolute;
    inset-block-end: 0;
    pointer-events: none;
    width: 100%;
}
.harmonytab{
    display: block;
    margin-top:10px;
}

.harmonytab-content{
display: none;
padding: 10px;
}

.harmonytab-content.show{
display: block;
animation: fadeNow 300ms ease-in-out;
}   

.plugin-harmonytab-list{
    border-bottom: solid 1px #ddd;
}

.harmonytab-btn{
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border:solid 1px #ddd;
    background-color: #ff7700;
    background: #F06525;
    margin-bottom: -1px;
    padding: 10px;
    cursor: pointer;
    color:#F06525;
}

.harmonytab-btn.active{
    border-bottom: solid 1px #ccc;
    color:#F06525;
    background: none;
}

.pagination {
    text-align: center;
}

.pagination img {
    position: relative;
    top: 2px;
}

.share_icons {
    padding: 8px;
    border-radius: 3px;
    background: #DE004A; /*solen as intended, but bad for accessibility: #F06525*/
    height: 50px;
}

.share_icons a {
    margin: 0 15px 0 15px;
    color: #ffffff;
    position: relative;
    top: -28px;
}

.ikon_berbagi {
    border: 6px solid white;
    padding: 10px;
    border-radius: 50%;
    color: #ffffff;
    top: -10px;
    position: relative;
}

[data-tooltip]::after {
    margin-top: 11px;
}

article img {
    max-width: 100%;
    height: auto;
}

.informasi_filter {
    border: 1px solid #F06525;
    margin-top: 25px;
    border-radius: 3px;
    padding: 0 1rem 0 1rem;
    background-color: #DE004A;
    color: #ffffff;
    font-weight: 700;
}

/*========================================
a04. Sidebar Area
==========================================*/

@media only screen and (min-width: 60em) {
    .sidebar_page, .sidebar_home {
        margin: 25px 0 0 0;
    }
}

.plugin ul {
    padding-left: 0px;
    list-style-type: none;
}

.author_thumb {
    text-align: center;
    margin: 0 0 -30px 0;
}

.author_thumb img {
    border-radius: 50%;
    border: 2px solid #F06525;
    width: 100px;
    height: 100px;
    box-shadow: 0 0 0 5px hsl(0, 0%, 100%), 0 0 0 10px hsla(0, 0%, 100%, 0.34), 0 0 0 15px hsla(0, 0%, 100%, 0.64);
}

.plugin-about {
    background: linear-gradient(#ffffff, #ffffff), linear-gradient(to right, #F06525, #DE004A);
    background-origin: padding-box, border-box;
    background-repeat: no-repeat;
    border: 2px solid transparent;
    padding: 1rem;
    margin: 0 0 10px 0;
}

.plugin-about > .plugin-label {
    text-align: center;
}

.plugin-label {
    background: linear-gradient(#ffffff, #ffffff), linear-gradient(to right, rgba(255, 165, 0) 15%, rgba(255, 165, 0, 0.35) 15% 30%, rgba(0, 0, 0, 0));
    background-origin: padding-box, border-box;
    background-repeat: no-repeat;
    border-style: solid;
    border-width: 0 0 2px 0;
    border-color: transparent;
    padding: 0 0 5px 0;
    margin: 0 0 5px 0;
}

.plugin-tags li {
    display:inline-block;
}

.plugin-tags li:before {
    content: url("data:image/svg+xml,%3Csvg preserveAspectRatio='xMinYMin meet' width='18' height='18' viewBox='0 0 1920 1920' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23F06525' d='M1152.821 372.968c-2.453 17.493-4.693 35.093-4.693 53.333 0 18.24 2.24 36.16 4.907 53.974-56.214-1.28-112.96 19.093-155.734 61.866-83.093 83.094-83.093 218.56 0 301.654 41.6 41.6 96.214 62.4 150.827 62.4s109.227-20.8 150.827-62.4c83.093-83.094 83.093-218.56 0-301.654-8.214-8.213-17.387-15.146-26.56-21.653l-.747-2.027c-11.093-29.866-16.853-60.906-16.853-92.16 0-18.453 2.346-36.053 6.186-53.333h153.814c29.333 0 53.333 24 53.333 53.333v625.494l-638.4 638.506-678.933-678.933 638.506-638.4h363.52Zm-4.693 213.44c14.827 0 29.227 3.627 42.987 9.707 16 31.68 36.48 60.48 61.44 86.08 3.306 30.826-5.44 62.613-29.014 86.186-41.706 41.707-109.12 41.707-150.826 0-41.6-41.6-41.6-109.226 0-150.826 20.8-20.8 48.106-31.147 75.413-31.147Zm373.333-533.44c-146.24 0-276.48 85.333-335.68 213.333h-440.64L-.032 1011.368l829.76 829.76 745.067-745.173V426.3c0-88.213-71.787-160-160-160h-106.347c48.853-65.706 127.147-106.666 213.013-106.666 147.094 0 266.667 119.573 266.667 266.666h106.667c0-205.866-167.467-373.333-373.334-373.333Z' fill-rule='evenodd'/%3E%3C/svg%3E");
    margin: 0 5px 0 0;
    position: relative;
    top: 2px;
}

.plugin-tags li:after {
    content: "";
    margin: 0 0px 0 10px;
}

.plugin-categories li {
    display:inline-block;
}

.plugin-categories li:before {
    content: url("data:image/svg+xml,%3Csvg preserveAspectRatio='xMinYMin meet' width='18' height='18' viewBox='0 0 1920 1920' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23F06525' d='M1807.059 1637.706c0 31.172-25.412 56.47-56.47 56.47H169.411c-31.06 0-56.47-25.298-56.47-56.47V225.94h590.907L854.4 451.824H225.882v112.94H1807.06v1072.942ZM990.269 451.824 764.385 113H0v1524.706c0 93.402 76.01 169.412 169.412 169.412h1581.176c93.403 0 169.412-76.01 169.412-169.412V451.824H990.268Z' fill-rule='evenodd'/%3E%3C/svg%3E");
    margin: 0 5px 0 0;
    position: relative;
    top: 2px;
}

.plugin-categories li:after {
    content: "";
    margin: 0 0px 0 10px;
}

.plugin-search [type=button] {
    font-weight: 900;
    margin: 5px 0 0 0;
    border: 1px solid #DE004A;
    background-color: #DE004A;
    border-radius: 3px;
    color: #ffffff;
    width: 80px;
    position: relative;
    float: right;
    top: -42px;
    right: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    height: 37px;
}

/*========================================
a05. Footer Area
==========================================*/

.footer {
    background: #ffffff;
    border-top: 1px solid #ffa500;
    min-height:50px;
    min-height: calc(50px + 2vh);
    width: calc(100% + 0.6em);
}

.footer_entry {
    padding: 10px 5px 0 0;
    text-align: right;
    font-weight: 500;
    font-size: .7em;
}

.logo_cc {
    width: 4em;
}

.logo_rss{
    width: .7em;
}


@keyframes fadeNow {
    
    from{
        opacity: 0;
        
    }

    to{
        opacity: 1;
    }

}
@media (min-width:320px)  { /* smartphones, iPhone, portrait 480x320 phones */ }
@media (min-width:481px)  { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ }
@media (min-width:641px)  { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ }
@media (min-width:961px)  { /* tablet, landscape iPad, lo-res laptops ands desktops */ }
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ }
@media (min-width:1281px) { /* hi-res laptops and desktops */ }
/*
 +-+-+-+-+-+ +-+-+ +-+-+-+-+-+
 |S|o|l|e|n| |b|y| |A|n|g|g|a|
 +-+-+-+-+-+ +-+-+ +-+-+-+-+-+
 出来上がりました！
*/