One UI Redesign Blogger Template
DEMO ; https://one-ui-redesign.blogspot.com/> Features
You don’t need any coding knowledge to customize this theme,
It very easy to customize everything from layout section .
Dark Mode feature
Card view for posts in homepage
Added List and Grid view option
Wave Animation in Footer
Suits Best for Blogs, Magazine related sites
Mobile friendly, Responsive and Fast loading
Grid view and list view
AdSense friendly and User friendly
Top to back button with progress bar
Extra Side menu & Sub menu
Can customize everything easily from Layout
Fast loading
Social media share buttons
Ads slots
SEO Friendly
Mobile Friendly
Extra Sliding menu design
Custom 404 page
Fully Responsive
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:css='false' b:defaultwidgetversion='2' b:layoutsVersion='3' b:responsive='true' b:templateUrl='indie.xml' b:templateVersion='1.3.0' expr:dir='data:blog.languageDirection' lang='id' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:dmata='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:if cond='data:view.isError'><title>Error 404: Page Not Found</title></b:if>
<b:if cond='!data:view.isMultipleItems'><title><data:blog.pageName/></title></b:if>
<b:if cond='data:view.isMultipleItems'>
<b:if cond='data:view.isHomepage'><title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:view.search.query'><title><data:messages.search/>: <data:view.search.query/></title></b:if>
<b:if cond='data:view.search.label'>
<title><data:blog.pageName/> - <data:blog.title/></title>
<b:else/>
<title>Recent post: <data:blog.title/></title>
</b:if>
<b:if cond='data:view.isArchive'><title>Blog archive in: <data:blog.pageName/></title></b:if>
</b:if>
</b:if>
<!-- Meta Title -->
<b:if cond='data:view.isMultipleItems'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.pageTitle' property='og:image:alt'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta expr:content='data:blog.pageTitle' name='twitter:image:alt'/>
<b:else/>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.pageName' property='og:image:alt'/>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.pageName' name='twitter:image:alt'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<!-- Meta Image -->
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjutletAbLQVQq78jFP_oTEtlgOsvZuBh1I11tSZNDMEzKszbwUoNgA74Mc46KD4pPrWEHGnSWL4jbNlMwCNS_02bNsY_WbH5ifRaR7rScnIk8EzuS3DWwSlRY3P5nQPeBPOcr8ZIgBpiA/s320/median-img.png' property='og:image'/>
</b:if>
</b:if>
<b:if cond='data:view.isMultipleItems'>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjutletAbLQVQq78jFP_oTEtlgOsvZuBh1I11tSZNDMEzKszbwUoNgA74Mc46KD4pPrWEHGnSWL4jbNlMwCNS_02bNsY_WbH5ifRaR7rScnIk8EzuS3DWwSlRY3P5nQPeBPOcr8ZIgBpiA/s320/median-img.png' name='twitter:image'/>
<b:else/>
<meta expr:content='data:blog.postImageUrl' name='twitter:image'/>
</b:if>
<b:if cond='data:view.isPost'>
<link expr:href='resizeImage(data:blog.postImageUrl, 700, "18:9")' rel='image_src'/>
</b:if>
<!-- Meta Description -->
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='data:post.snippet' property='og:description'/>
</b:if>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
<!-- Meta Keywords -->
<meta expr:content='data:blog.title + ", " + data:blog.pageName' name='keywords'/>
<meta expr:content='data:blog.title' property='article:tag'/>
<!-- Link Canonical -->
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.url' hreflang='x-default' rel='alternate'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<!-- Site Owner -->
<meta content='Muhammad Maki' name='Author'/>
<link href='https://www.facebook.com/kiibao' rel='me'/>
<link href='https://www.facebook.com/kiibao' rel='author'/>
<link href='https://www.facebook.com/kiibao' rel='publisher'/>
<meta content='100001578783517' property='fb:admins'/>
<meta content='696750553739909' property='fb:pages'/>
<meta content='1804789006468790' property='fb:app_id'/>
<meta content='https://www.facebook.com/100001578783517' property='article:author'/>
<meta content='https://www.facebook.com/100001578783517' property='article:publisher'/>
<meta content='' name='twitter:site'/>
<meta content='' name='twitter:creator'/>
<!-- Theme Color -->
<meta content='#005af0' name='theme-color'/>
<meta content='#005af0' name='msapplication-navbutton-color'/>
<meta content='#005af0' name='apple-mobile-web-app-status-bar-style'/>
<meta content='yes' name='apple-mobile-web-app-capable'/>
<!-- Blogger Rss -->
<meta content='blogger' name='generator'/>
<link href='https://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.url' rel='openid.delegate'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='"//www.blogger.com/feeds/" + data:blog.blogId + "/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " - RSS"' rel='alternate' type='application/rss+xml'/>
<!-- Open Graph -->
<meta content='article' property='og:type'/>
<meta content='id_ID' property='og:locale'/>
<meta content='en_US' property='og:locale:alternate'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='summary_large_image' name='twitter:card'/>
<!-- Robots Search -->
<meta content='width=device-width, initial-scale=1.0, user-scalable=1.0, minimum-scale=1.0, maximum-scale=5.0' name='viewport'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='IE=Edge' http-equiv='X-UA-Compatible'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='id' name='geo.country'/>
<meta content='ID-BT' name='geo.region'/>
<meta content='id' name='language'/>
<meta content='global' name='target'/>
<meta content='global' name='distribution'/>
<meta content='general' name='rating'/>
<meta content='1 days' name='revisit-after'/>
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='index, follow' name='googlebot'/>
<meta content='follow, all' name='Googlebot-Image'/>
<meta content='follow, all' name='msnbot'/>
<meta content='follow, all' name='Slurp'/>
<meta content='follow, all' name='ZyBorg'/>
<meta content='follow, all' name='Scooter'/>
<!-- Sife Verification -->
<meta content='eOkJqbD1CfzsteobkhlDoaA6kQ1Vry3HJSpluwvV5_g' name='google-site-verification'/>
<meta content='' name='msvalidate.01'/>
<meta content='' name='p:domain_verify'/>
<meta content='' name='majestic-site-verification'/>
<meta content='Jago Desain' name='copyright'/>
<script type='application/ld+json'>
{
"@context": "https://schema.org",
"@type": "WebSite",
"url": "<data:blog.homepageUrl.canonical/>",
"name": "<data:blog.title/>",
"alternateName": "<data:blog.title/>",
"potentialAction": {
"@type": "SearchAction",
"target": "<data:blog.homepageUrl.canonical/>search?q={search_term_string}&max-results=8",
"query-input": "required name=search_term_string"
}
}
</script>
<style><!-- /* <b:skin version='1.3.0'><![CDATA[
/*
<Variable name="fontBody" description="Nunito Sans" type="font" default="'Nunito Sans', sans-serif" hideEditor="true" value="'Nunito Sans', sans-serif"/>
<Group description="New Comment Required - Dont edit">
<Variable name="body.background" description="Background" color="#505050" type="background" default="$(color) none repeat scroll center center" value="#505050 url() no-repeat scroll bottom center"/>
<Variable name="body.text.font" description="Font komentar Blogger" type="font" default="$(fontBody)" value="400 14px 'Roboto', sans-serif"/>
<Variable name="body.text.color" description="Color" type="color" default="#505050" value="#505050"/>
<Variable name="body.link.color" description="Link color" type="color" default="$(link.colors)" value="#161617"/>
<Variable name="posts.title.color" description="Post title color" type="color" default="$(main.colors)" value="#0060ff"/>
<Variable name="posts.text.color" description="Post text color" type="color" default="$(text.colors)" value="#505050"/>
<Variable name="posts.icons.color" description="Post info color" type="color" default="$(main.colors)" value="#505050"/>
<Variable name="posts.background.color" description="Post background color" type="color" default="#f7f7fc" value="transparent"/>
<Variable name="tabs.font" description="Font" type="font" default="$(fontBody)" value="400 14px 'Roboto', sans-serif"/>
<Variable name="tabs.color" description="Text color" type="color" default="#4d4d4d" value="#505050"/>
<Variable name="tabs.selected.color" description="Selected color" type="color" default="#fff" value="#ffffff"/>
<Variable name="tabs.overflow.background.color" description="Popup background color" type="color" default="$(posts.background.color)" value="#ffffff"/>
<Variable name="tabs.overflow.color" description="Popup text color" type="color" default="$(text.colors)" value="#4d4d4d"/>
<Variable name="tabs.overflow.selected.color" description="Popup selected color" type="color" default="$(main.colors)" value="#161617"/>
<Variable name="labels.background.color" description="Labels background color" type="color" default="#fff" value="#FFFFFF"/>
<Variable name="blog.title.font" description="Blog title font" type="font" default="$(fontBody)" value="400 14px 'Roboto', sans-serif"/>
<Variable name="blog.title.color" description="Blog title color" type="color" default="#fff" value="#ffffff"/>
</Group>
<Group description="Width Content">
<Variable name="nav.width" description="Ukuran navbar" type="length" max="300px" default="220px" value="220px"/>
<Variable name="side.width" description="Ukuran sidebar" type="length" max="450px" default="396px" value="360px"/>
<Variable name="header.height" description="Tinggi header" type="length" max="70px" default="60px" value="60px"/>
</Group>
<Group description="Colors">
<Variable name="main.colors" description="Warna utama" type="color" default="#09204C" value="#161617"/>
<Variable name="text.colors" description="Warna teks" type="color" default="#505050" value="#48525c"/>
<Variable name="alt.text.colors" description="Warna teks alternatif" type="color" default="#989b9f" value="#767676"/>
<Variable name="link.colors" description="Warna link" type="color" default="#3a7bd5" value="#005af0"/>
<Variable name="link.hover.colors" description="Warna hover link" type="color" default="#989b9f" value="#767676"/>
</Group>
<Group description="Background Colors">
<Variable name="nav.bg.colors" description="Warna background navbar" type="color" default="#f7f9f8" value="#fefefe"/>
<Variable name="nav.colors" description="Warna teks dan icon navbar" type="color" default="#09204C" value="#161617"/>
<Variable name="header.bg.colors" description="Warna background header" type="color" default="#fefefe" value="#fefefe"/>
<Variable name="header.text.colors" description="Warna teks header" type="color" default="#161617" value="#161617"/>
<Variable name="body.bg.colors" description="Warna background template" type="color" default="#f7f9f8" value="#fafafc"/>
<Variable name="link.bg.colors" description="Warna tombol link" type="color" default="#3a7bd5" value="#005af0"/>
</Group>
<Group description="Night Mode Colors">
<Variable name="bg.night.colors" description="Background utama nightmode" type="color" default="#202442" value="#1e1e1e"/>
<Variable name="bg.sec.night.colors" description="Background kedua nightmode" type="color" default="#2d325a" value="#2d2d30"/>
<Variable name="bg.hover.night.colors" description="Background hover nightmode" type="color" default="#282d54" value="#252526"/>
<Variable name="night.colors" description="Warna utama nightmode" type="color" default="#fff" value="#fefefe"/>
<Variable name="sec.night.colors" description="Warna kedua nightmode" type="color" default="#989b9f" value="#989b9f"/>
<Variable name="link.night.colors" description="Warna link dan tombol nightmode" type="color" default="$(link.bg.colors)" value="#0060ff"/>
</Group>
<Group description="Fonts">
<Variable name="body.font" description="Font body" type="font" default="$(fontBody)" value="'Nunito Sans', sans-serif"/>
<Variable name="heading.font" description="Font heading" type="font" default="$(fontBody)" value="Poppins, sans-serif"/>
</Group>
*/
/*
Name : ONE UI Premium Template
Version : 1.0
Date : November 18, 2020
Type : Premium
Designer : Pro Templates
Website :https://protemplates.in
============================================================================
NOTE :
This theme is premium (paid).
You can only get it by purchasing officially.
If you get it for free through any method, that means you get it illegally.
============================================================================
*/
body#layout{width:922px}
body#layout .mainContainer{display:flex;}
body#layout .header{width:100%}
body#layout .mainbar{width:65%}
body#layout .sidebar{width:35%}
body#layout div#HTML2, body#layout div#HTML3{width:calc(50% - 4px);float:left}
body#layout div#HTML3{float:right}
body#layout div.section:after{content:'';display:block;clear:both}
#layout:before { content: 'ONE UI Premium Template by ProTemplates.in';
text-transform: uppercase;
font-size: 20px;
color: #fc3556;
margin: 0 0 20px 0;
display: inline-block;
font-weight: 700;
padding: 20px;
font-family: sans-serif;
border: 4px double #2844fa
;}
/* Body Font */
@font-face {font-family: 'Nunito Sans';font-style: normal;font-weight: 400;font-display: swap;src: local('Nunito Sans Regular'), local('NunitoSans-Regular'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe0qMImSLYBIv1o4X1M8cfe5.woff) format('woff'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe0qMImSLYBIv1o4X1M8cce9I9s.woff2) format('woff2')}
@font-face {font-family: 'Nunito Sans';font-style: normal;font-weight: 700;font-display: swap;src: local('Nunito Sans Bold'), local('NunitoSans-Bold'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe03MImSLYBIv1o4X1M8cc8GBv5p.woff) format('woff'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe03MImSLYBIv1o4X1M8cc8GBs5tU1E.woff2) format('woff2')}
@font-face {font-family: 'Nunito Sans';font-style: italic;font-weight: 400;font-display: swap;src: local('Nunito Sans Italic'), local('NunitoSans-Italic'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe0oMImSLYBIv1o4X1M8cce4I90.woff) format('woff'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe0oMImSLYBIv1o4X1M8cce4E9lKdg.woff2) format('woff2')}
@font-face {font-family: 'Nunito Sans';font-style: italic;font-weight: 700;font-display: swap;src: local('Nunito Sans Bold Italic'), local('NunitoSans-BoldItalic'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe01MImSLYBIv1o4X1M8cce4G2JvU1c.woff) format('woff'), url(https://fonts.gstatic.com/s/nunitosans/v6/pe01MImSLYBIv1o4X1M8cce4G2JvY1MIUg.woff2) format('woff2')}
/* Heading Font */
@font-face {font-family: 'Poppins';font-style: normal;font-weight: 700;font-display: swap;src: local('Poppins Bold'), local('Poppins-Bold'), url(https://fonts.gstatic.com/s/poppins/v13/pxiByp8kv8JHgFVrLCz7V1g.woff) format('woff'), url(https://fonts.gstatic.com/s/poppins/v13/pxiByp8kv8JHgFVrLCz7Z1xlFQ.woff2) format('woff2')}
/* Source Code Font */
@font-face {font-family: 'Fira Mono';font-style: normal;font-weight: 400;font-display: swap;src: local('Fira Mono Regular'), local('FiraMono-Regular'), url(https://fonts.gstatic.com/s/firamono/v9/N0bX2SlFPv1weGeLZDtQIg.woff) format('woff'), url(https://fonts.gstatic.com/s/firamono/v9/N0bX2SlFPv1weGeLZDtgJv7S.woff2) format('woff2');}
/* Standar Element */
*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box}
a{-webkit-transition:all .2s ease;transition:all .2s ease;color:$(link.colors);text-decoration:none}a:hover{color:$(link.hover.colors)}
h1, h2, h3, h4, h5, h6{margin:0;font-weight:700;font-family:$(heading.font);color:$(main.colors)} h1{font-size:1.8rem} h2{font-size:1.7rem} h3{font-size:1.5rem} h4{font-size:1.3rem} h5{font-size:1.2rem} h6{font-size:1.1rem}
table{border-spacing:0} iframe{width:100%;border:0} input,button,select,textarea{font:inherit;font-size:100%;color:inherit;line-height:normal;vertical-align:baseline} img{display:block;position:relative;max-width:100%;font-size:10px;color:transparent}
svg{width:22px;height:22px;vertical-align:middle;fill:$(main.colors)}
svg .svg-c{fill:$(link.bg.colors)}
svg.line{fill:none;stroke:$(nav.colors);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}
svg.line .svg-c{fill:none;stroke:$(link.bg.colors)}
.hidden, .replaced{display:none} .invisible{visibility:hidden} .clear{width:100%;display:block;margin:0;padding:0;float:none;clear:both}
.full-close{display:block;position:fixed;top:0;left:0;width:100%;height:100%;z-index:2;-webkit-transition:all .2s ease-in;transition:all .2s ease-in;background:transparent;opacity:0;visibility:hidden}
/* Scrollbar Custom */
html, #nav-widget, .Blog pre, .Blog pre code{scrollbar-width:thin}
/* Main Content */
html{scroll-behavior:smooth;overflow-x:hidden}
body{position:relative;margin:0;padding:0;width:100%;font-family:$(body.font);font-size:14px;color:$(text.colors);background-color:$(body.bg.colors);-webkit-font-smoothing: antialiased;}
main{display:block;padding:30px 10px 30px 245px;-webkit-transition:all .2s ease;transition:all .2s ease}
main > *:not(:last-child), .sidebar > *:not(:last-child){margin-bottom:40px}
#nav-widget{position:fixed;top:0;left:0;background-color:$(nav.bg.colors);width:220px;height:100%;padding:calc($(header.height) + 15px) 0 0 0;-webkit-transition:all .2s ease;transition:all .2s ease;z-index:2;overflow:hidden;box-shadow:0 6px 18px 0 rgba(30,30,30,.035)}
#nav-widget:hover{overflow-y:auto;}
#nav-widget:before{content:'';position:fixed;top:0;left:0;width:220px;height:$(header.height);background-color:$(nav.bg.colors);z-index:2;-webkit-transition:all .2s ease;transition:all .2s ease}
#nav-widget .widget{padding-bottom:90px}
#add-widget{padding-top:40px}
#large-ads{width:100%;padding:0 30px 0 245px;-webkit-transition:all .2s ease;transition:all .2s ease}
#large-ads .widget{margin:30px 0 10px}
.mainContainer{display:flex;justify-content:space-between;flex-wrap:wrap}
.mainIner:before{content:'';display:block;width:100%;padding-top:$(header.height)}
.asideIner{position:absolute;left:0;bottom:0;width:100%}
.mainbar{min-height:100vh;width:calc(100% - $(side.width))}
.sidebar{background-color:transparent;width:$(side.width);padding:30px 30px;flex:0 0 auto}
#sidebar-sticky{position:sticky;top:calc($(header.height) + 20px)}
/* Header */
.header{position: sticky;top:0;left:0;display:flex;width:100%;height:$(header.height);padding:0 30px 0 25px;background-color:$(header.bg.colors);color:$(header.text.colors);fill:$(header.text.colors);z-index:20;box-shadow:0 2px 10px 0 rgba(0,0,0,.07);-webkit-transition:all .2s ease;transition:all .2s ease;}
.header #header-widget{flex:0 0 auto;display:flex;align-items:center;height:100%;width:173px;padding:0 0 0 23px;overflow:hidden}
.header .widget{margin:auto 0;background-repeat:no-repeat;background-size:100%;background-position:center}
.header .header-inner img{max-width:142px;max-height:30px;}
.header .header-inner h1, #header-widget .header-inner h2{max-width:152px;font-size:18px;color:inherit;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.header .header-inner a{color:inherit;-webkit-transition:none;transition:none}
/* Header Navicon */
.header .navicon{position:relative;flex:0 0 auto;display:flex;align-items:center;height:100%;z-index:1}
.header .navicon.right{margin-left:auto}
.header .navicon.search{display:flex;width:22px;position:absolute;top:-100%;right:10px;padding:0;border:0;outline:0;background:transparent;-webkit-transition:all .3s ease;transition:all .3s ease;opacity:0;visibility:hidden}
.header .navicon.search > *{cursor:default;fill:#5f6368}
.header .navicon > *{margin:auto 0;width:20px;cursor:pointer}
.header .navicon > * svg{width:20px}
.header .navicon .nav{height:20px;padding:3px 0;-webkit-transition:all .2s ease-out;transition:all .2s ease-out;}
.header .navicon .nav i{position:relative;display:block;width:60%;height:2px;background-color:#161617;margin:0 0 4px 0;-webkit-transition:all .2s ease-out;transition:all .2s ease-out;border-radius:2px}
.header .navicon .nav i:nth-child(2){width:100%;margin:0;z-index:2}
.header .navicon .nav i:nth-child(3){width:60%;background-color:$(link.bg.colors);margin:4px 0 0 auto}
.header .navicon .nav.home{display:none}
.header .navicon .dark-switch{display:flex;align-items:center;width:auto;font-size:11px;color:$(text.colors);white-space:nowrap}
.header .navicon .dark-switch:before{content:''}
.header .navicon .dark-switch i{position:relative;margin-left:8px;width:30px;height:10px;border-radius:8px;background-color:rgba(0,0,0,.15)}
.header .navicon .dark-switch i:before{content:'';display:block;position:absolute;top:-4px;left:0;width:18px;height:18px;border-radius:50%;background-color:$(link.bg.colors);-webkit-transition:all .2s ease;transition:all .2s ease}
.header .navicon .navSearch{margin-left:15px;display:none}
.drK .navicon .dark-switch i:before{left:13px}
/* Header Search */
.header .searchbar{flex:0 0 auto;display:flex;align-items:center;width:50%;height:100%;max-width:550px;padding:0 0 0 25px}
.header .searchbar form{position:relative;display:flex;align-items:center;width:100%;margin:auto 0;}
.header .searchbar .search-button{position:absolute;top:0;left:15px;display:flex;height:100%;align-items:center;padding:0;border:0;outline:0;background:transparent;cursor:pointer}
.header .searchbar .search-button svg{width:18px;height:18px;fill:#5f6368;-webkit-transition:all .3s ease;transition:all .3s ease}
.header .searchbar input[type=text]{background-color:rgba(236,239,241,.8);outline:0;border:0;padding:12px 20px 12px 45px;border-radius:5px;width:100%;transition: box-shadow .3s;-webkit-transition: box-shadow .3s}
.header .searchbar input[type=text]:focus{box-shadow:0 2px 3px 0 rgba(0,0,0,.1)}
.header .searchbar input[type=text]:focus + .search-button svg{fill:$(link.bg.colors)}
.header .searchbar input[type=text]:focus + .search-button + .navicon.search{top:0;opacity:1;visibility:visible}
/* Navigation Menu */
.navigation-menu, .navigation-mobile{list-style:none;margin:0;padding:0;color:$(nav.colors);fill:$(nav.colors);font-size:90%}
.navigation-menu > li{position:relative;padding:10px 20px 10px 25px}
.navigation-menu > li:before{content:'';position:absolute;top:0;left:0;display:block;width:2px;height:42px;border-radius:0 3px 3px 0;}
.navigation-menu > li:hover:before{background-color:$(link.bg.colors)}
.navigation-menu > li.break:after{content:'';display:block;width:100%;border-bottom:1px solid #ebeced;margin-top:20px}
.navigation-menu li .link{display:flex;align-items:center}
.navigation-menu li .link svg{height:20px;flex:0 0 auto;fill:inherit}
.navigation-menu li .link svg.name{flex:0 0 auto;width:14px;height:14px;margin-left:auto}
.navigation-menu li .link span.name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}
.navigation-menu li .link span.new:after{content:'New!';margin-left:5px;font-size:85%;font-weight:400;color:$(link.colors)}
.navigation-menu li .link .name{display:block;margin-left:21px}
.navigation-menu li a{display:block;color:inherit;white-space:nowrap}
.navigation-menu ul{list-style:none;margin:0;padding:0;overflow:hidden;-webkit-transition:all .2s ease;transition:all .2s ease}
.navigation-menu ul li{height:0;padding:0 20px 0 43px;-webkit-transition:inherit;transition:inherit;opacity:0;visibility:hidden}
.navigation-menu .close{display:none;position:fixed;top:0;left:0;margin-left:-100%;padding:20px 20px 20px 25px;width:85%;max-width:480px;background:$(nav.bg.colors);-webkit-transition:all .2s ease;transition:all .2s ease}
.navigation-menu .sosmed{position:fixed;bottom:0;left:0;padding:20px 20px 30px 25px;width:220px;background:$(nav.bg.colors);-webkit-transition:all .2s ease;transition:all .2s ease}
.navigation-menu .sosmed:before, .navigation-menu .close:before{top:10px}
.navigation-menu .sosmed .link{display:none}
.navigation-menu .sosmed .link svg{width:22px;height:22px}
.navigation-menu .sosmed ul{display:flex;}
.navigation-menu .sosmed ul li{height:auto;opacity:1;visibility:visible;padding:0 7px 0 0}
.navigation-menu .sosmed ul svg{fill:$(text.colors)}
.navigation-menu .sub-menu:checked + .link + ul{padding:10px 0 0}
.navigation-menu .sub-menu:checked + .link + ul li{height:38px;padding:10px 20px 10px 43px;opacity:1;visibility:visible}
.navigation-menu .sub-menu:checked + .link svg.name{-webkit-transform:rotate(180deg);transform: rotate(180deg)}
.nav-menu:checked + .mainWrapper .mainIner #large-ads,
.nav-menu:checked + .mainWrapper .mainIner main,
.nav-menu:checked + .mainWrapper .mainIner .footbar{padding-left:90px}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li{width:calc(25% - 15px)}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(3n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(3n){margin-right:20px}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(4n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(4n){margin-right:0}
.nav-menu:checked + .mainWrapper .asideIner #nav-widget,
.nav-menu:checked + .mainWrapper .asideIner #nav-widget:before,
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed{width:68px}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed .link{display:block;}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu li > * .name,
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed ul{display:none}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu ul{padding:0}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu ul li{height:0;padding:0 20px 0 43px;opacity:0;visibility:hidden}
.nav-menu:checked + .mainWrapper .mainIner.singleItem main,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .footbar{padding-right:40px;padding-left:150px}
.nav-menu:checked + .mainWrapper .mainIner.singleItem .footbar{padding-right:30px}
/* Navigation Mobile */
.navigation-mobile{display:flex;align-items:center;justify-content:space-evenly;position:fixed;left:0;bottom:-50px;width:100%;height:50px;padding:0 25px;background-color:transparent;z-index:-1;border-radius:20px 20px 0 0}
.navigation-mobile li{visibility:hidden;opacity:0;width:20%;text-align:center}
.navigation-mobile a{display:block}
.navigation-mobile svg{fill:$(text.colors);height:20px;width:20px}
.navigation-mobile svg.line{fill:none;stroke:$(text.colors)}
.navigation-mobile .dark-link .svg-2{display:none}
.navigation-mobile .top-link{visibility:visible;opacity:1}
.navigation-mobile .top-link a{display:flex;align-items:center;justify-content:center;position:fixed;right:20px;bottom:20px;width:45px;height:45px;background-color:#fefefe;border-radius:20px;box-shadow:0 10px 20px 0 rgba(30,30,30,.1)}
.navigation-mobile .top-link svg.line{stroke:$(text.colors)}
.drK .navigation-mobile .dark-link .svg-2{display:inline-block}
.drK .navigation-mobile .dark-link .svg-1{display:none}
/* Widget Default */
.widget-title, .sidebar .title, .related-posts .title, .comments .title{display:flex;align-items:center;justify-content:space-between;margin:0 0 25px;font-size:15px}
.widget-title > *{font-size:inherit}
.widget-title a{font-size:85%;color:$(text.colors)}
.widget:not(:last-child){margin-bottom:50px}
.widget .post-thumb{display:block;position:absolute;top:50%;left:50%;max-width:none;max-height:100%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}
.widget input[type=email], .widget input[type=text], .widget textarea{width:100%;padding:8px 12.5px;outline:0;border:0;border-radius:3px;line-height:22px;box-shadow:0 10px 20px 0 rgba(30,30,30,.08)}
.widget input[type=submit], .widget input[type=button]{outline:0;border:0;border-radius:3px;padding:8px 12.5px;line-height:22px;background-color:$(link.bg.colors);color:#fefefe;cursor:pointer;font-size:90%;box-shadow:0 10px 20px 0 rgba(30,30,30,.08)}
.widget input[type=button]{padding:8px 30px}
.sidebar ul, .sidebar ol{list-style:none;margin:0;padding:0}
/* Widget Blog */
.multipleItem .Blog .blog-posts{display:flex;flex-wrap:wrap}
.multipleItem .Blog .blog-posts article{width:calc(33.333% - 13.333px);margin-right:20px}
.multipleItem .Blog .blog-posts article:nth-of-type(3n){margin-right:0}
.Blog article, .FeaturedPost article{display:block;background-color:#fefefe;margin:0 0 20px;padding:10px 10px 15px;border-radius:4px;box-shadow:0 10px 20px 0 rgba(30,30,30,.07)}
.Blog article .post-thumbnail{margin-bottom:15px}
.Blog article .post-thumbnail a, .FeaturedPost article .item-thumbnail a, .PopularPosts article .item-thumbnail a, .Blog .related-posts li .item-thumbnail > *{position:relative;display:block;width:100%;padding-top:52.5%;background-color:#f7f9f8;border-radius:4px;overflow:hidden}
.Blog article .post-content{}
.Blog article .post-label{font-size:11px;line-height:1.58em;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.Blog article .post-label a{color:$(link.colors)}
.Blog article .post-label a:before{content:'#';font-size:80%}
.Blog article .post-label a:not(:last-child):after, .FeaturedPost article .item-label > *:not(:last-child):after, .PopularPosts article .item-label a:not(:last-child):after{content:',';margin-right:3px}
.Blog article .post-label a:hover, .Blog article .post-info .post-author a:hover{text-decoration:underline}
.Blog article .post-title{font-size:90%}
.Blog article .post-title a, .Blog article .post-info .post-author a, .FeaturedPost article a, .PopularPosts article a{color:inherit}
/* Ubah jadi display:block; untuk menampilkan snippet artikel */
.Blog article .post-snippet{display:none;margin-top:12px;font-size:11px;color:$(alt.text.colors)}
.Blog article .post-info, .FeaturedPost article .item-header, .PopularPosts article .item-header{display:flex;justify-content:space-between;align-items:flex-end;margin-top:12px;font-size:11px;color:$(text.colors)}
.Blog article .post-info .post-author, .FeaturedPost article .item-label, .PopularPosts article .item-label{font-size:11px;line-height:1.58em}
.Blog article .post-info .post-header, .FeaturedPost article .item-header .item-info, .PopularPosts article .item-header .item-info{width:calc(100% - 65px)}
.Blog article .post-info .post-header .post-timestamp, .Blog article .post-info .post-author .post-authorName,
.FeaturedPost article .item-header .item-timestamp, .FeaturedPost article .item-header .item-label,
.PopularPosts article .item-header .item-timestamp, .PopularPosts article .item-header .item-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.Blog article .post-info .post-author .post-authorName{display:block}
.Blog article .post-info .post-comment, .FeaturedPost article .item-comment, .PopularPosts article .item-comment{display:flex;width:65px;flex-shrink:0;justify-content:flex-end}
.Blog article .post-info .post-comment > *, .FeaturedPost article .item-comment > *, .PopularPosts article .item-comment > *{display:flex;align-items:flex-end;color:inherit}
.Blog article .post-info .post-comment > * svg, .FeaturedPost article .item-comment > * svg, .PopularPosts article .item-comment > * svg{width:20px;height:20px;fill:$(alt.text.colors);margin-left:5px}
.Blog article .post-info .post-comment > * svg.line, .FeaturedPost article .item-comment > * svg.line, .PopularPosts article .item-comment > * svg.line{fill:none;stroke:$(alt.text.colors)}
.Blog article .post-info .post-comment > .post-shareIcon svg{height:18px}
.Blog article.noThumbnail .post-thumb{color:#989b9f;font-size:10px}
.Blog article.post{margin:0 15px 30px;padding:0;box-shadow:none;background:transparent;border-radius:0;border-bottom:1px solid #ebeced}
.Blog article.post h1, .Blog article.post h2, .Blog article.post h3, .Blog article.post h4, .Blog article.post h5, .Blog article.post h6{margin:1.7em 0 20px;line-height:1.3em}
.Blog article.post h1:target, .Blog article.post h2:target, .Blog article.post h3:target, .Blog article.post h4:target, .Blog article.post h5:target, .Blog article.post h6:target{padding-top:70px;margin-top:0}
.Blog article.post img{display:inline-block;border-radius:3px}
.Blog article.post .post-headline{margin-bottom:2.5rem;}
.Blog article.post .post-thumbnail{margin-bottom:20px}
.Blog article.post .post-thumbnail a{padding-top:34.61%}
.Blog article.post .post-title{font-size:24px;margin:0}
.Blog article.post .post-info{margin-top:25px}
.Blog article.post .post-info .post-author{font-size:inherit;color:$(text.colors)}
.Blog article.post .post-info .post-author .post-authorName:before{content:attr(data-text)}
.Blog article.post .post-info .post-timestamp .publish{display:none}
.Blog article.post .post-info .post-timestamp .publish:before{content:attr(data-text)}
.Blog article.post .post-info .post-timestamp .publish:after{content:'\2027';margin:0 5px}
.Blog article.post .post-info .post-timestamp .updated:before{content:'published on : '}
.Blog article.post .post-info .post-header{width:calc(100% - 125px)}
.Blog article.post .post-info .post-comment{width:125px}
.Blog article.post .post-entry{font-size:16px;line-height:1.58em}
.Blog article.post .post-entry p{margin:1.7em 0;}
.Blog article.post .post-labels{display:flex;flex-wrap:wrap;margin:30px 0 30px;padding:0;font-size:13px}
.Blog article.post .post-labels a{margin:0 10px 10px 0}
.Blog article.post .post-labels a:before{content:'#';font-size:80%}
.Blog article.post .post-labels a:not(:last-child):after{content:','}
.Blog article.post .post-share{position:relative;display:flex;flex-wrap:wrap;margin:20px 0 30px;font-size:13px;line-height:22px;}
.Blog article.post .post-share:before{display:block;content:'Share this article';width:100%;margin-bottom:20px;font-size:14px;font-weight:700;font-family:$(heading.font)}
.Blog article.post .post-share .share-icon{flex-grow:1}
.Blog article.post .post-share .share-icon:not(:first-child){margin-left:10px}
.Blog article.post .post-share .share-icon > *{display:flex;align-items:center;padding:12px;border-radius:3px;background-color:#fefefe;box-shadow:0 10px 20px 0 rgba(30,30,30,.1)}
.Blog article.post .post-share .share-icon > a{padding:12px 15px;color:#fefefe}
.Blog article.post .post-share .share-icon > a svg{fill:#fefefe}
.Blog article.post .post-share .share-icon svg{width:20px;fill:$(alt.text.colors)}
.Blog article.post .post-share .facebookThis a{background-color:#3059b0}
.Blog article.post .post-share .facebookThis a:after{content:'Facebook';margin-left:15px}
.Blog article.post .post-share .twitterThis a{background-color:#55acef}
.Blog article.post .post-share .twitterThis a:after{content:'Twitter';margin-left:15px}
.Blog article.post .post-share .whatsappThis a{background-color:#25D366}
.Blog article.post .post-share .whatsappThis a:after{content:'Whatsapp';margin-left:15px}
.Blog article.post .post-share .shareThis{flex-grow:0}
.Blog article.post .post-share .share-popup, .Profile .team .all-member, .Blog .post-font .post-fontContainer{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;z-index:50;-webkit-transition:all .2s ease;transition:all .2s ease;opacity:0;visibility:hidden}
.Blog article.post .post-share .share-notif{display:flex;position:fixed;left:0;right:0;bottom:0;margin-bottom:25px}
.Blog article.post .post-share .share-notif span{position:relative;bottom:-200px;display:block;width:240px;margin:0 auto;padding:10px;border-radius:3px;background-color:#48525c;color:#fefefe;font-size:13px;line-height:22px;text-align:center;opacity:0;transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out;-webkit-animation:slidein 2s ease forwards;animation:slidein 2s ease forwards;}
.Blog article.post .post-share .share-check:checked + .share-popup, .Profile .team .all-team:checked + .all-member, .Blog .post-font .post-fontContainer.active{opacity:1;visibility:visible}
.Blog article.post .post-share .share-check:checked + .share-popup ul, .Profile .team .all-team:checked + .all-member .all-memberBox, .Blog .post-font .post-fontContainer.active ul{margin:0 auto}
.Blog article.post .post-share .share-check:checked + .share-popup .full-close, .Profile .team .all-team:checked + .all-member .full-close, .Blog .post-font .post-fontContainer.active .full-close{background:rgba(0,0,0,.35);opacity:1;visibility:visible}
.Blog article.post .post-share ul, .Blog .post-font .post-fontContainer ul{position:relative;display:flex;flex-wrap:wrap;width:95%;max-width:500px;list-style:none;margin:0 auto -50%;padding:25px 25px 20px;background-color:#fafafc;border-radius:30px;z-index:3;-webkit-transition:all .2s ease;transition:all .2s ease}
.Blog article.post .post-share ul:before, .Blog .post-font .post-fontContainer ul:before{content:'Share this article';display:block;width:100%;margin:0 0 15px;font-size:15px;font-family:$(heading.font);font-weight:700;text-align:center;color:$(main.colors)}
.Blog article.post .post-share li{position:relative;width:calc(25% - 15px);margin-right:20px}
.Blog article.post .post-share li:nth-of-type(4n){margin-right:0}
.Blog article.post .post-share li > *{display:block;margin:8px 0;text-align:center;color:inherit;cursor:pointer}
.Blog article.post .post-share li > * span{display:block;margin:5px 0 0;font-size:90%;color:$(text.colors)}
.Blog article.post .post-share li > * svg{width:48px;height:48px;fill:$(alt.text.colors);padding:13px;background-color:#ebeced;border-radius:18px;}
.Blog article.post .post-share li > * svg.line{fill:none;stroke:$(alt.text.colors);padding:16px}
.Blog article.post .post-share li input{margin:0;padding:0;outline:0;border:0;width:1px;height:0;opacity:0}
.Blog article.post .post-share li.share-close, .Profile .team .all-member .member-close, .Blog .post-font .post-fontContainer .close{width:30px;height:30px;margin:0;position:absolute;top:20px;right:-15px;z-index:1}
.Blog article.post .post-share li.share-close > *, .Profile .team .all-member .member-close label, .Blog .post-font .post-fontContainer .close > *{margin:0;display:flex;align-items:center;justify-content:center;height:100%;background-color:$(link.bg.colors);border-radius:50%}
.Blog article.post .post-share li.share-close > * svg, .Blog .post-font .post-fontContainer .close > * svg{width:22px;height:22px;padding:0;margin:0;background:transparent;fill:#fefefe}
.Blog .separate{display:block;margin:20px 0}
.Blog .separate:before{content:'\2027 \2027 \2027';display:block;color:#505050;text-align:center;font-size:28px;font-style:normal;letter-spacing:0.6em;text-indent:0.6em;clear:both}
.Blog blockquote{position:relative;font-size:15px;}
.Blog blockquote.style-1{margin-left:0;margin-right:0;padding:30px 25px 30px 90px;border-radius:4px;border:2px solid #ebeced}
.Blog blockquote.style-1:before{content:'\201D';display:block;position:absolute;font-weight:700;font-size:70px;font-family:$(heading.font);top:7px;left:25px;line-height:normal;color:rgba(0,0,0,.15)}
.Blog blockquote.style-1 ul{font-size:90%}
.Blog table.tr-caption-container{min-width:inherit;width:auto;margin:0 auto;border:0;position:relative}
.Blog table.tr-caption-container tr td{background-color:transparent;border:0;padding:0}
.Blog table.tr-caption-container tr:nth-child(2n+1) td, .Blog table.tr-caption-container tr:nth-child(2n+1) td:first-child{border:0;background:transparent}
.Blog table.tr-caption-container .tr-caption{display:block;font-size:12px;font-style:italic;color:$(alt.text.colors);background-color:transparent;border:0}
.Blog table{min-width:70%;margin:0 auto;border:0;overflow:hidden;font-size:14px;}
.Blog table th{background-color:transparent;padding:15px 20px;border:1px solid #ddd;border-top:0;border-left:0;font-family:$(heading.font);font-size:13px}
.Blog table th:last-child, .Blog table tr td:last-child, .Blog table tr:nth-child(2n) td:last-child{border-right:0}
.Blog table td{padding:15px 20px;border:1px solid #ddd;border-left:0;border-top:0;vertical-align:middle}
.Blog table tr:nth-child(2n + 1) td{background-color:rgba(0,0,0,.025)}
.Blog .table{display:block;overflow-y:hidden;overflow-x:auto;border-radius:3px;scroll-behavior:smooth;}
.Blog pre{font-size:13px;position:relative;width:100%;background-color:#29323c;color:rgba(255,255,255,.9);border-radius:3px;padding:20px 20px;margin:25px auto;-moz-tab-size:2;-o-tab-size:2;tab-size:2;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;overflow:auto;font-family: 'Fira Mono', monospace;line-height:1.5em;}
.Blog pre code{display:block;padding:0;white-space:pre;font-family: 'Fira Mono', monospace}
.Blog pre span{color:#e6db74}
.Blog pre span.block{color:#fff;background:#3a7bd5}
.Blog pre i{color:#519bd6;font-style:normal}
.Blog pre i.comment, .Blog pre i.tag{color:#75715e;user-select:text;-moz-user-select:text;-ms-user-select:text;-khtml-user-select:text;-webkit-user-select:text;-webkit-touch-callout:text;}
.Blog pre i.tag{color:#f15a5a}
.Blog .code{display:inline;padding:2px 4px;font-size:85%;line-height:inherit;color:#f15a5a;background-color:rgba(0,0,0,.05);font-family: 'Fira Mono', monospace;}
.Blog .daftar-isi, .Blog .spoiler{border:2px solid #ebeced;border-left:0;border-right:0;padding:25px 15px;margin:30px 0;font-size:15px}
.Blog .daftar-isi .isi-judul, .Blog .spoiler .spoiler-judul{outline:0;font-weight:700;font-family:$(heading.font);color:$(main.colors);display:flex;}
.Blog .daftar-isi .isi-judul:after{content: ' Hide all ';font-weight:400;font-size:85%;font-family:$(body.font);color:$(text.colors);margin-left:auto}
.Blog .daftar-isi .isi-content{max-height:1000vh;transition:all .4s ease;-webkit-transition:all .4s ease;overflow:hidden}
.Blog .daftar-isi .isi-content a{font-weight:400;color:$(text.colors)}
.Blog .daftar-isi .isi-content ol{counter-reset:daftar-count;margin-bottom:0;padding:0;list-style:none;font-size:14px}
.Blog .daftar-isi .isi-content ol ol{width:100%;margin-bottom:10px;padding-left:26px}
.Blog .daftar-isi .isi-content ol li, .Blog .post-tocContent ol li{display:flex;flex-wrap:wrap}
.Blog .daftar-isi .isi-content ol li a{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.Blog .daftar-isi .isi-content li ul li a{max-width:none}
.Blog .daftar-isi .isi-content ol li a:before, .Blog .post-tocContent ol li a:before{content:counters(daftar-count,'.')'. ';counter-increment:daftar-count;display:inline-block;min-width:20px;margin-right:5px;color:$(text.colors);flex-shrink:0;font-weight:700;font-family:$(heading.font)}
.Blog .daftar-isi .isi-content ol ul{width:100%;padding-left:45px}
.Blog .daftar-isi .isi-content ol ul li{display:list-item}
.Blog .daftar-isi .isi-content ol ul li:before{display:none}
.Blog .daftar-isi .isi-content ul{margin-bottom:0;padding-left:20px}
.Blog .daftar-isi .isi-input:checked + .isi-judul + .isi-content{max-height:0}
.Blog .daftar-isi .isi-input:checked + .isi-judul:after{content: ' Show all '}
.Blog .post-toc{width:360px;height:calc(100% - $(header.height));padding:30px;background-color:#fafafc;position:absolute;top:$(header.height);right:0;z-index:2;font-size:15px;-webkit-transition:all .2s ease;transition:all .2s ease;}
.Blog .post-tocContainer{position:sticky;top:calc($(header.height) + 30px)}
.Blog .post-tocHeader{position:relative}
.Blog .post-tocHeader label{display:flex;align-items:center;font-weight:700;font-family:$(heading.font);margin:0;color:$(main.colors)}
.Blog .post-tocHeader label svg.drop{margin-left:auto;width:18px;height:18px;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transition:all .2s ease;transition:all .2s ease;}
.Blog .post-tocHeader label .show{width:50px;height:40px;display:flex;align-items:center;justify-content:center;background-color:#fefefe;border-radius:50px 0 0 50px;box-shadow:0 10px 20px 0 rgba(30,30,30,.08);position:absolute;top:0;left:-80px;-webkit-transition:all .2s ease;transition:all .2s ease;opacity:0;visibility:hidden}
.Blog .post-tocContent ol{padding:0;list-style:none;font-size:14px;font-weight:400;line-height:1.9em;counter-reset: toc-count;}
.Blog .post-tocContent ol li a:before{content:counters(toc-count,'.')'. ';counter-increment:toc-count;}
.Blog .post-tocContent ol ol{width:100%;padding-left:26px;margin-bottom:10px}
.Blog .post-tocContent a{color:$(main.colors);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.Blog .toc-menu:checked + .post-toc{right:-360px}
.Blog .toc-menu:checked + .post-toc .post-tocHeader label .show{opacity:1;visibility:visible}
.Blog .spoiler{padding:20px 15px}
.Blog .spoiler .spoiler-judul{align-items:center}
.Blog .spoiler .spoiler-judul .button{margin:0 0 0 auto;padding:5px 15px;font-size:11px;font-weight:400;font-family:$(body.font);}
.Blog .spoiler .spoiler-judul .button:before{content:' Show all'}
.Blog .spoiler .spoiler-isi{max-height:0;margin-top:0;transition:all .2s ease;-webkit-transition:all .2s ease;overflow:hidden}
.Blog .spoiler .spoiler-isi p, .Blog article.post .spoiler .spoiler-isi p{margin-top:10px}
.Blog .spoiler .spoiler-isi pre{margin:10px auto 0}
.Blog .spoiler .spoiler-input:checked + .spoiler-judul .button:before{content:' Hide all'}
.Blog .spoiler .spoiler-input:checked + .spoiler-judul + .spoiler-isi{max-height:1000vh;margin-top:1em}
.Blog .post-font > span, .Blog .post-shareIcon label{margin-left:7px}
.Blog .post-font .post-fontContainer ul:before{content:'Change text size'}
.Blog .post-font .post-fontContainer li{width:33.333%;text-align:center}
.Blog .post-font .post-fontContainer li label{display:block;margin:0 auto;cursor:pointer}
.Blog .post-font .post-fontContainer li label:before{content:'A';font-size:35px;font-weight:700;font-family:$(heading.font);color:#ddd;line-height:60px}
.Blog .post-font .post-fontContainer li label:hover:before{color:$(main.colors)}
.Blog .post-font .post-fontContainer li:nth-child(1) label:before{font-size:25px}
.Blog .post-font .post-fontContainer li:nth-child(3) label:before{font-size:45px}
.Blog article .post-info .post-comment .post-fontContainer .close > * svg{fill:#fefefe}
.font-size1:checked + .font-size2 + .font-size3 + article .post-font .post-fontContainer li:nth-child(1) label:before,
.font-size2:checked + .font-size3 + article .post-font .post-fontContainer li:nth-child(2) label:before,
.font-size3:checked + article .post-font .post-fontContainer li:nth-child(3) label:before{color:$(main.colors)}
.font-size1:checked + .font-size2 + .font-size3 + article .post-entry{font-size:14px}
.font-size3:checked + article .post-entry{font-size:18px}
.Blog .post-tabs .post-tabsHeader{display:flex;border-bottom:1px solid #ebeced;margin-bottom:30px;font-size:13px}
.Blog .post-tabs .post-tabsHeader > *:not(:last-child){margin-right:7px}
.Blog .post-tabs .post-tabsHeader > *{padding:8px 15px;border:1px solid #ebeced;border-bottom:0;border-radius:4px 4px 0 0;position:relative}
.Blog .post-tabs .post-tabsHeader > *:after{content:'';display:block;width:100%;height:2px;background-color:#fafafc;position:absolute;left:0;bottom:-1px;visibility:hidden;opacity:0}
.Blog .post-tabs .post-tabsContent{position:relative}
.Blog .post-tabs .post-tabsContent > *{display:none;transition:all .2s ease;-webkit-transition:all .2s ease;}
.Blog .post-tabs .post-tabsContent > *:not(:first-child){width:100%}
.Blog .post-tabs .post-tabsContent > * p:first-child{margin-top:0}
.tab-1:checked + .tab-2 + .post-tabs .post-tabsHeader > *:first-child:after,
.tab-2:checked + .post-tabs .post-tabsHeader > *:nth-child(2):after{opacity:1;visibility:visible}
.tab-1:checked + .tab-2 + .post-tabs .post-tabsContent > *:first-child,
.tab-2:checked + .post-tabs .post-tabsContent > *:nth-child(2){display:block}
.Blog .post-pagenav > *{padding:6px 15px}
.Blog .post-pagenav > *:not(:last-child){margin-right:12px}
.Blog .blog-pager, .Blog .post-pagenav{display:flex;flex-wrap:wrap;justify-content:center;margin:20px 0 0;font-size:12px;color:#fefefe;line-height:22px}
.Blog .blog-pager > *, .Blog .post-pagenav > *{display:flex;align-items:center;padding:8px 15px;border-radius:3px;background-color:$(link.bg.colors);color:inherit;box-shadow:0 10px 20px 0 rgba(30,30,30,.1)}
.Blog .blog-pager > * svg{width:20px;fill:#fefefe}
.Blog .blog-pager > * svg.line{fill:none;stroke:#fefefe}
.Blog .blog-pager .no-post, .Blog .post-pagenav .current{cursor:not-allowed;background-color:#fefefe;color:$(alt.text.colors)}
.Blog .blog-pager .newer-link{margin-right:auto}
.Blog .blog-pager .older-link{margin-left:auto}
.Blog .blog-pager .js-load svg{margin-right:10px}
.Blog .blog-pager .js-load.error{background-color:#f15a5a}
.Blog .blog-pager > span{margin:0 10px 10px 0}
.Blog .blog-pager > span:last-child{margin-right:0}
.Blog .breadcrumbs{display:flex;align-items:center;margin:0 15px 8px;font-size:11px;font-weight:700;font-family:$(heading.font);color:$(alt.text.colors);}
.Blog .breadcrumbs > *:first-child{display:none}
.Blog .breadcrumbs > *:not(:last-child):after{content:'\203A';margin:0 7px 0 4px;font-size:13px;line-height:16px}
.Blog .breadcrumbs > *{flex-shrink:0}
.Blog .breadcrumbs > .title-link{flex-shrink:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:$(alt.text.colors)}
.Blog .accordion{position:relative;list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;font-size:14px}
.Blog .accordion li{width:100%;padding:20px 0;border-bottom:2px solid #ebeced}
.Blog .accordion .accor-title{display:flex;align-items:center}
.Blog .accordion .accor-title .accor-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:15px;position:relative}
.Blog .accordion .accor-title .accor-icon:before, .Blog .accordion .accor-title .accor-icon:after{content:'';display:block;width:60%;height:2px;border-radius:2px;background-color:$(main.colors)}
.Blog .accordion .accor-title .accor-icon:after{position:absolute;transform:rotate(90deg);-webkit-transform:rotate(90deg)}
.Blog .accordion .accor-title .title{flex-grow:1;margin:0;line-height:1.48em;font-weight:700;font-family:$(heading.font);color:$(main.colors)}
.Blog .accordion .accor-menu:checked + .accor-title .title{color:$(link.colors)}
.Blog .accordion .accor-menu:checked + .accor-title .accor-icon:before, .Blog .accordion .accor-menu:checked + .accor-title .accor-icon:after{background-color:$(link.colors)}
.Blog .accordion .accor-menu:checked + .accor-title .accor-icon:after{visibility:hidden;opacity:0}
.Blog .accordion .accor-menu:checked + .accor-title + .content{max-height:100vh;padding-top:15px;padding-bottom:8px}
.Blog .accordion .content{margin:0;padding-left:35px;position:relative;overflow:hidden;max-height:0;-webkit-transition:all .2s ease;transition:all .2s ease;}
.Blog .download-info{display:flex;align-items:center;margin:1.7em 0;padding:15px;border:2px solid #ebeced;border-radius:3px;font-size:13px}
.Blog .download-info .file-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:50px;height:50px;padding:10px;border-radius:15px;color:#fefefe;background:#ebeced linear-gradient(225deg,#00dcc0 0,#005af0 75%);font-weight:700;font-family:$(heading.font)}
.Blog .download-info .file-text{padding:0 12px;width:calc(100% - 150px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.Blog .download-info .file-link{flex-shrink:0;display:flex;font-size:11px;margin:0 0 0 auto;padding:6px 10px}
.Blog .download-info .file-link .m-icon{width:15px;height:15px}
.Blog .author-posts{display:flex;align-items:center;margin:30px 15px;position:relative;padding:15px;border-radius:4px;background:#fefefe;overflow:hidden;box-shadow:0 10px 20px 0 rgba(30,30,30,.08);font-size:13px;}
.Blog .author-posts .authorImage{flex-shrink:0;margin-right:15px}
.Blog .author-posts .authorImage div{position:relative;width:50px;padding-top:100%;background-color:#f2f2f2;border-radius:20px}
.Blog .author-posts .authorInfo{flex-grow:1;}
.Blog .author-posts .author-name{font-weight:700;font-family:$(heading.font);color:$(main.colors);font-size:13px}
.Blog .author-posts .author-name:before{content:attr(data-text);display:none}
.Blog .author-posts .author-desc{color:$(alt.text.colors);margin-top:2px}
.Blog .author-posts .author-link{list-style:none;margin:0}
.Blog .author-posts a, .Blog .related-posts a, .Blog .comments a{color:inherit}
.Blog .related-posts{margin:60px 15px 30px}
.Blog .related-posts ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
.Blog .related-posts li{width:calc(33.333% - 13.333px);margin-right:20px;margin-bottom:20px;padding:10px 10px 18px;background-color:#fefefe;border-radius:4px;box-shadow:0 10px 20px 0 rgba(30,30,30,.07)}
.Blog .related-posts li:nth-of-type(3n){margin-right:0}
.Blog .related-posts li .item-thumbnail{margin-bottom:12px}
.Blog .related-posts li .item-thumbnail > *{padding-top:60%}
.Blog .related-posts li .item-thumbnail > *:before{content:'No image';display:block;position:absolute;top:50%;left:50%;max-width:none;max-height:100%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);color:$(sec.night.colors);font-size:10px}
.Blog .related-posts li .item-title{padding:0 5px;font-size:12px;font-weight:700;font-family:$(heading.font);color:$(main.colors)}
.Blog .related-post.style-1 a:before{content:'';display:block;position:absolute;bottom:0;right:0;width:70px;height:65px;background:rgba(0,0,0,.025);border-radius:70px 0 5px 0;}
.Blog #disqus_thread{margin:30px 15px}
.Blog .show-comment{margin:30px 15px;font-size:13px}
.Blog .show-comment label{display:block;margin:0;padding:15px;text-align:center;border:2px solid #ebeced}
.Blog .show-comment + .comments{height:0;overflow:hidden}
.Blog .all-comment:checked + .show-comment{display:none}
.Blog .all-comment:checked + .show-comment + .comments{height:auto;overflow:visible}
.Blog .comments{margin:30px 15px 0;height:auto}
.Blog .comments .avatar-image-container{width:52px}
.Blog .comments .avatar-image-container div{position:relative;overflow:hidden;padding-top:100%;border-radius:50%;background-color:#f2f2f2;box-shadow:0 6px 18px 0 rgba(30,30,30,.035)}
.Blog .comments .comment-header, .Blog .comments .comment-header > *{display:flex;align-items:center}
.Blog .comments .comment-header .user{font-weight:700;font-size:13px;font-family:$(heading.font)}
.Blog .comments .comment-header .user span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:120px}
.Blog .comments .comment-header .user svg{width:16px;height:16px;margin-left:5px;fill:#519bd6}
.Blog .comments .comment-header .datetime{margin-left:auto;font-size:11px;color:$(alt.text.colors)}
.Blog .comments .comment-content{margin-top:15px}
.Blog .comments .comment-thread .thread-toggle{margin:0 0 0 25px;font-size:13px}
.Blog .comments .comment-thread .thread-chrome{margin:15px 0 0}
.Blog .comments .comment-add .button{display:block;margin:20px 0 0 25px;text-align:center;cursor:pointer}
.Blog .comments .comment-form{margin-left:26px}
.Blog .comments ol, .Blog .comments ul{list-style:none;margin:0;padding:0}
.Blog .comments ol > li{position:relative;margin:0 0 20px 26px;padding:15px 0 0;background-color:#fefefe;border-radius:12px;box-shadow:0 10px 20px 0 rgba(30,30,30,.07)}
.Blog .comments ol > li > .avatar-image-container{position:absolute;top:10px;left:-26px}
.Blog .comments ol > li > .comment-block{padding:10px 15px 0 40px}
.Blog .comments ol > li > .comment-actions{padding:12px 15px 15px 40px;font-size:13px;color:$(alt.text.colors)}
.Blog .comments ol > li > .comment-actions a, .Blog .comments .comment-reply a, .Blog .comments .comment-thread .thread-toggle{display:inline-flex;align-items:center;color:$(alt.text.colors)}
.Blog .comments ol > li > .comment-actions svg, .Blog .comments .comment-reply svg, .Blog .comments .comment-thread .thread-toggle svg{height:14px;fill:none;stroke:$(alt.text.colors)}
.Blog .comments ol > li > .comment-replies + .comment-actions{display:none}
.Blog .comments ol > li > .comment-replies{padding:12px 15px 15px 15px;margin-top:15px;background-color:rgba(0,0,0,.015);border-radius:0 0 12px 12px}
.Blog .comments ol > li > .comment-replies .comment-reply{padding:12px 0 0 40px;font-size:13px}
.Blog .comments ol > li > .comment-replybox-single{padding:0 15px 0 40px}
.Blog .comments li li {position:relative}
.Blog .comments li li:not(:last-child){margin-bottom:20px;padding-bottom:20px;border-bottom:1px dashed #ebeced}
.Blog .comments li li .avatar-image-container{position:absolute;top:0;left:0;width:32px}
.Blog .comments li li .avatar-image-container div{box-shadow:none}
.Blog .comments li li .comment-block{padding:5px 0 0 46px}
.Blog .comments li li .comment-content{margin-top:10px}
.Blog .comments .thread-show:checked + .comment-thread .thread-chrome,
.Blog .comments .thread-show:checked + .comment-thread + .comment-reply{display:none}
.Blog .comments .thread-show:checked + .comment-thread .thread-toggle svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.Blog .sitemaps .sitemap-box{font-size:14px;line-height:1.5em;padding:18px 20px 25px;border-radius:4px;border:2px solid #ebeced}
.Blog .sitemaps .sitemap-box:not(:last-child){margin-bottom:15px}
.Blog .sitemaps .judul{margin-top:0;font-size:14px;color:$(text.colors)}
.Blog .sitemaps .judul:before{content:'Label: ';margin-right:5px}
.Blog .sitemaps ol{list-style:none;margin:0;padding:0;counter-reset:panduan-count}
.Blog .sitemaps li:not(:last-child){margin-bottom:10px}
.Blog .sitemaps li{display:flex}
.Blog .sitemaps li:before{content:counter(panduan-count) '.';counter-increment:panduan-count;flex-shrink:0;width:40px;font-size:22px;font-family:$(heading.font);line-height:normal;color:rgba(0,0,0,.15);}
.Blog .sitemaps li a{color:$(main.colors);font-size:90%;font-weight:700;font-family:$(heading.font)}
.Blog .sitemaps li a:after{content:'Read more';display:block;margin-top:2px;color:$(text.colors);font-size:11px;font-family:$(body.font);font-weight:400;line-height:1.58em}
.Blog .sitemaps li a:hover:after{text-decoration:underline}
.page .Blog article.post{border:0}
.page .Blog .breadcrumbs > *:first-child{display:block}
/* Widget FeaturedPost */
.FeaturedPost article{display:flex;align-items:center;flex-wrap:wrap;margin:0;padding:10px;position:relative;overflow:hidden}
.FeaturedPost article:after{content:'';display:block;min-width:25px;padding:4px 0;background-color:$(link.bg.colors);position:absolute;top:0;right:0;border-radius:0 0 0 3px}
.FeaturedPost article .item-thumbnail{flex:0 0 auto;width:310px;margin-right:20px}
.FeaturedPost article .item-content{flex:1 0;padding:8px 8px 8px 0;width:calc(100% - 330px)}
.FeaturedPost article .item-label a:hover, .PopularPosts article .item-label a:hover, .Label li .label-title:hover{text-decoration:underline}
.FeaturedPost article .item-title{font-size:105%;line-height:1.48em}
.FeaturedPost article .item-entry{margin-top:12px;font-size:90%}
.sidebar .FeaturedPost article{display:block;padding:0;box-shadow:none}
.sidebar .FeaturedPost article .item-content{padding:15px 0 0}
.sidebar .FeaturedPost article .item-title, .PopularPosts article .item-title{font-size:90%}
/* Widget PopularPosts */
.PopularPosts{counter-reset:popular-count}
.PopularPosts article:not(:last-child){margin-bottom:25px}
.PopularPosts article .item-thumbnail{margin-bottom:15px}
.PopularPosts article .item-thumbnail a{padding-top:34.61%;background-color:#fefefe;border-radius:3px}
.PopularPosts article .item-header{margin-top:5px}
.PopularPosts article.no-thumbnail{display:flex}
.PopularPosts article.no-thumbnail:before{flex-shrink:0;content:'0' counter(popular-count);counter-increment:popular-count;width:45px;font-weight:700;font-size:22px;font-family:$(heading.font);color:rgba(0,0,0,.15);}
.PopularPosts article.no-thumbnail .item-content{flex-grow:1;width:calc(100% - 45px)}
/* Widget Label */
.Label .widget-content{font-size:90%;color:$(main.colors)}
.Label ul, .Label .cloud-label, .Label .cloud-label .label-all{display:flex;flex-wrap:wrap}
.Label li{width:calc(50% - 12.5px);margin-bottom:13px}
.Label li:nth-child(2n+1){margin-right:25px}
.Label li a{display:flex;align-items:center;color:inherit}
.Label li a svg{flex-shrink:0;width:20px;height:20px;margin-left:5px;fill:$(alt.text.colors)}
.Label li a:hover svg{fill:$(link.bg.colors)}
.Label li:nth-child(2n+1).label-show{margin:0}
.Label .label-show{width:100%;margin:0}
.Label .label-show ul, .Label .cloud-label .label-all{margin:0;padding:0;max-height:0;overflow:hidden;-webkit-transition:all .4s ease;transition:all .4s ease;}
.Label .label-show label{display:flex;align-items:center;justify-content:center;margin-top:4px;padding:4px 0;color:$(alt.text.colors);cursor:pointer}
.Label .label-show label:before{content: attr(data-show);margin-right:5px; display:none}
.Label .label-show label span{margin-right:10px}
.Label .label-show label svg{fill:$(alt.text.colors);height:14px}
.Label .label-input:checked + .label-all ul, .Label .cloud-label .label-input:checked + .label-all{max-height:100vh}
.Label .label-input:checked + .label-all + label:before{content: attr(data-hide)}
.Label .label-input:checked + .label-all + label svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.Label .label-title{margin-right:auto;padding-right:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.Label .label-count{flex-shrink:0;font-size:11px;color:$(alt.text.colors)}
.Label .cloud-label .label-show label{margin:0 10px 0 0;padding:5px 12.5px;line-height:22px;border-radius:3px;background-color:#f2f2f2}
.Label .cloud-label > *, .Label .cloud-label .label-all > *{display:block;flex:1 0 auto}
.Label .cloud-label a{display:flex;justify-content:space-between;margin:0 10px 10px 0;padding:5px 12.5px;line-height:22px;border-radius:3px;background-color:#f2f2f2;color:$(text.colors)}
/* Widget Profile Individual */
.Profile .widget-content{font-size:13px}
.Profile .individual{display:flex;align-items:center;flex-direction:row;position:relative;padding:12px 15px;border-radius:4px;background:#fefefe;overflow:hidden;box-shadow:0 10px 20px 0 rgba(30,30,30,.08)}
.Profile .individual .profile-image{flex:0 0 auto;width:60px;height:60px;border-radius:20px;background-color:#f1f1f0}
.Profile .individual .profile-image .profile-g{position:relative;padding-top:100%}
.Profile .individual .profile-image img, .Blog .author-posts .authorImage div img{border-radius:20px}
.Profile .individual .profile-info{flex-grow:1;margin-right:auto;padding-left:15px}
.Profile .individual .profile-link{color:$(main.colors);font-weight:700;font-size:13px}
.Profile .individual .profile-text{font-size:11px;margin:4px 0 0;color:$(alt.text.colors);line-height:1.4em}
.Profile .individual .profile-media, .Blog .author-posts .author-link{position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:#fefefe;padding:15px;opacity:0;visibility:hidden;-webkit-transition:all .2s ease;transition:all .2s ease;z-index:2}
.Profile .individual .profile-media li:not(:last-child) a, .Blog .author-posts .author-link li:not(:last-child) a{margin-right:10px}
.Profile .individual .profile-media li a, .Blog .author-posts .author-link li a{display:block;padding:5px}
.Profile .individual .profile-media li a:hover svg, .Blog .author-posts .author-link li a:hover svg{fill:$(link.bg.colors)}
.Profile .individual .profile-media li svg, .Blog .author-posts .author-link li svg{width:24px;height:24px;fill:$(alt.text.colors)}
/* Widget Profile Team */
.Profile .team ul{display:flex;flex-wrap:wrap}
.Profile .team ul li{width:60px;margin:0 15px 20px 0}
.Profile .team .team-member > *, .Profile .team .more-member > *, .Profile .team .more-member{display:block;position:relative}
.Profile .team .team-member > * .profile-image{position:relative;padding-top:100%;background-color:#fefefe;border-radius:28px;box-shadow:0 10px 20px 0 rgba(30,30,30,.08);-webkit-transition:transform .2s cubic-bezier(.25,.1,.25,1);transition:transform .2s cubic-bezier(.25,.1,.25,1)}
.Profile .team .team-member > * .profile-image svg{fill:$(alt.text.colors)}
.Profile .team .team-member > * .profile-image > *{border-radius:28px}
.Profile .team .team-member > * .profile-image:after, .Profile .individual .profile-g:after, .Blog .author-posts .authorImage div:after{content:'+';display:flex;align-items:center;justify-content:center;width:18px;height:18px;background-color:#fefefe;color:$(link.bg.colors);border-radius:50%;position:absolute;right:0;bottom:-2px;box-shadow:0 4px 10px 0 rgba(30,30,30,.08);-webkit-transition:all .1s ease;transition:all .1s ease;}
.Profile .team .team-member > * .profile-name, .Profile .team .more-member > span{position:absolute;width:100%;text-align:center;color:$(text.colors);font-size:80%;line-height:1.3em;-webkit-transition:all .2s ease;transition:all .2s ease;opacity:0;visibility:hidden;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.Profile .team .team-member > *:hover .profile-image, .Profile .team .more-member:hover > .profile-more{transform:translateY(-8px);-webkit-transform:translateY(-8px)}
.Profile .team .team-member > *:hover .profile-image:after, .Profile .individual .profile-image:hover .profile-g:after, .Blog .author-posts .authorImage:hover div:after{opacity:0;visibility:hidden;}
.Profile .team .team-member > *:hover .profile-name, .Profile .team .more-member:hover > span, .Profile .individual .profile-image:hover .profile-media, .Blog .author-posts .authorImage:hover .author-link{opacity:1;visibility:visible}
.Profile .team .more-member > *{padding-top:calc(100% - 4px);border-radius:28px;border:2px dashed #ebeced}
.Profile .team .more-member > * svg{fill:$(link.bg.colors)}
.Profile .team .more-member > .profile-more{-webkit-transition:transform .2s cubic-bezier(.25,.1,.25,1);transition:transform .2s cubic-bezier(.25,.1,.25,1)}
.Profile .team .more-member > span{padding:0;border:0;border-radius:0}
.Profile .team .all-member .all-memberBox{position:relative;width:95%;height:45%;max-width:500px;margin:0 auto -50%;background-color:#fafafc;border-radius:30px;z-index:3;-webkit-transition:all .2s ease;transition:all .2s ease}
.Profile .team .all-member .all-memberBox:before{content:'All authors / contributors';width:100%;display:block;padding:25px 25px 5px;border-radius:30px 30px 0 0;background-color:#fafafc;font-size:15px;font-weight:700;font-family:$(heading.font);color:$(main.colors);position:absolute;z-index:1}
.Profile .team .all-member ul{overflow-x:hidden;overflow-y:auto;width:100%;height:100%;padding:65px 10px 10px 25px}
.Profile .team .all-member ul li{margin:0 20px 25px 0}
.Profile .team .all-member .member-close svg{fill:#fefefe}
/* Widget FollowByEmail */
.FollowByEmail{position:relative;padding:18px 20px 25px;border:2px solid #ebeced;border-radius:4px;font-size:90%}
.FollowByEmail:after{content:'';display:block;position:absolute;top:0;right:0;width:80px;height:60px;background:rgba(0,0,0,.01);border-radius:0 0 0 100px}
.FollowByEmail .title{font-size:14px;margin-bottom:15px;color:$(text.colors)}
.FollowByEmail .follow-by-email-text{display:block;margin-bottom:15px;}
.FollowByEmail .follow-by-email-label{position:absolute;right:0;display:inline-block;padding:8px 12.5px;cursor:pointer;background-color:$(link.bg.colors);border-radius:3px}
.FollowByEmail .follow-by-email-label svg{fill:#fefefe}
.FollowByEmail form, .FollowByEmail > *{position:relative;z-index:1}
.FollowByEmail input[type=email]{width:calc(100% - 60px)}
.FollowByEmail input[type=email]:focus + input + label, .FollowByEmail .follow-by-email-label:hover{box-shadow:0 10px 20px 0 rgba(30,30,30,.08)}
.FollowByEmail input[type=submit]{display:none;margin-top:10px}
/* Widget Contact Form */
.ContactForm{font-size:14px;margin-top:30px;max-width:480px}
.ContactForm form > *:not(:last-child){margin-bottom:15px}
.ContactForm label{display:inline-block;margin-bottom:8px}
.ContactForm div p{display:flex;align-items:center;margin-bottom:0}
/* Widget Slider */
@keyframes tonext{75%{left:0;} 95%{left:100%;} 98%{left:100%;} 99%{left:0}}
@keyframes tostart{75%{left:0} 95%{left:-300%} 98%{left:-300%} 99%{left:0}}
@keyframes snap{96%{scroll-snap-align:center} 97%{scroll-snap-align:none} 99%{scroll-snap-align:none} 100%{scroll-snap-align:center}}
@media (hover:hover){
.carousel-snapper{animation-name:tonext, snap;animation-timing-function:ease;animation-duration:4s;animation-iteration-count:infinite}
.carousel-slide:last-child .carousel-snapper{animation-name:tostart, snap}}
@media (prefers-reduced-motion:reduce){
.carousel-snapper{animation-name:none}}
.carousel{position:relative;padding-top:30%;border-radius:5px;overflow:hidden}
.carousel ol{list-style:none;margin:0;padding:0;scrollbar-color: transparent transparent;scrollbar-width: 0px;}
.carousel ol::-webkit-scrollbar{height:0}
.carousel-viewport{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;overflow-x:scroll;scroll-behavior:smooth;scroll-snap-type:x mandatory}
.carousel-slide{display:flex;align-items:center;position:relative;flex:0 0 100%;width:100%;background-color:#f1f1f0;outline:0;}
.carousel-slide:nth-child(even){background-color:#99f}
.carousel-snapper{position:absolute;top:0;left:0;width:100%;height:100%;scroll-snap-align:center}
.carousel-navigation{position:absolute;right:0;bottom:5px;left:0;text-align:center}
.carousel-navigation-list{display:flex;align-items:center;justify-content:center}
.carousel-navigation-button{display:block;width:18px;height:12px;background-color:#fff;background-clip:content-box;border:0.25rem solid transparent;border-radius:10px;-webkit-transition:all .1s ease;transition:all .1s ease}
.carousel-navigation-button:hover{width:30px}
.carousel-prev, .carousel-next{position:absolute;width:4rem;height:4rem;outline:0;z-index:2;cursor:default}
.carousel-prev, .carousel:hover:before{left:0;opacity:1;visibility:visible}
.carousel-next, .carousel:hover:after{right:0;opacity:1;visibility:visible}
.carousel:hover .carousel-snapper,
.carousel:focus-within .carousel-snapper{animation-name:none}
.carousel:before{left:-1em} .carousel:after{right:-1em}
.carousel:before, .carousel:after{content:'';z-index:1;background-size:1.5rem 1.5rem;background-repeat:no-repeat;background-position:center center;position:absolute;width:3rem;height:3rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:all .2s ease;transition:all .2s ease;opacity:0;visibility:hidden}
.carousel:before{background-image:url('data:image/svg+xml,<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M217.9 256L345 129c9.4-9.4 9.4-24.6 0-33.9-9.4-9.4-24.6-9.3-34 0L167 239c-9.1 9.1-9.3 23.7-.7 33.1L310.9 417c4.7 4.7 10.9 7 17 7s12.3-2.3 17-7c9.4-9.4 9.4-24.6 0-33.9L217.9 256z" fill="%23fff"/></svg>')}
.carousel:after{background-image:url('data:image/svg+xml,<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M294.1 256L167 129c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.3 34 0L345 239c9.1 9.1 9.3 23.7.7 33.1L201.1 417c-4.7 4.7-10.9 7-17 7s-12.3-2.3-17-7c-9.4-9.4-9.4-24.6 0-33.9l127-127.1z" fill="%23fff"/></svg>')}
/* Footer */
.footbar{margin-top:0;padding:30px 30px 20px 245px;color:inherit;font-size:85%;-webkit-transition:all .2s ease;transition:all .2s ease;}
.footbar .credit p{margin:20px 0 0;overflow:hidden;white-space:nowrap}
.footbar .credit a:hover{text-decoration:underline}
.footbar .credit .creator{opacity:0}
/* Error 404 Page */
.mainIner.error-404{display:flex;align-items:center;justify-content:center;height:100vh;text-align:center}
.mainIner.error-404:before{display:none}
.error-container{margin:auto;width:90%;max-width:500px}
.error-container h3{font-size:1.414rem}
.error-container h3 span{display:block;font-size:140px;line-height:.8;margin-bottom:-2.4rem;color:#ebebf0} .drK .error-container h3 span{color:rgba(0,0,0,.2)}
.error-container p{margin:15px 5% 30px;font-size:16px;line-height:1.4em}
.error-container .button{margin:0;padding:1em 2em;font-size:1em;font-weight:700;font-family:$(heading.font);line-height:1.2em}
/* Dark Mode */
.drK, .drK .Blog .post-toc, .drK .Blog .post-tabs .post-tabsHeader > *:after{background-color:$(bg.night.colors)}
.drK .header .navicon > * svg, .drK .header .navicon.search > *, .drK .header .searchbar .search-button svg, .drK .Blog article .post-info .post-comment > * svg, .drK .FeaturedPost article .item-comment > * svg, .drK .PopularPosts article .item-comment > * svg, .drK .Label li a svg, .drK .Label .label-show label svg, .drK .Profile .individual .profile-media li svg, .drK .Blog .author-posts .author-link li svg, .drK .Blog .post-tocHeader label svg.drop
{fill:$(sec.night.colors)}
.drK .Blog article .post-info .post-comment > * svg.line{stroke:$(sec.night.colors)}
.drK, .drK .Blog .blog-pager, .drK .Blog .post-pagenav, .drK .Label .widget-content, .drK h1, .drK h2, .drK h3, .drK h4, .drK h5, .drK h6, .drK .FollowByEmail .title, .drK .Profile .individual .profile-link, .drK .Profile .team .team-member a .profile-name, .drK .Profile .team .more-member > span, .drK .Blog .sitemaps .judul, .drK .Blog .sitemaps li a, .drK .Blog .daftar-isi .isi-judul, .drK .Blog .spoiler .spoiler-judul, .drK .Blog .daftar-isi .isi-content a, .drK .Blog .accordion .accor-title .title, .drK .Blog .author-posts .author-name, .drK .Blog .related-posts li .item-title, .drK .Blog .post-tocHeader label, .drK .Blog .post-tocContent a
{color:$(night.colors)}
.drK .header, .drK .Blog article, .drK .Blog .blog-pager .no-post, .drK .Blog .post-pagenav .current, .drK .FeaturedPost article, .drK .Profile .individual, .drK .Profile .individual .profile-media, .drK #nav-widget, .drK #nav-widget:before, .drK .navigation-menu .sosmed, .drK .Blog .author-posts, .drK .Blog .author-posts .author-link, .drK .Blog .related-posts li, .drK .Blog .comments ol > li
{background-color:$(bg.sec.night.colors)}
.drK .header .searchbar input[type=text], .drK .Blog article .post-thumbnail a, .drK .FeaturedPost article .item-thumbnail a, .drK .PopularPosts article .item-thumbnail a, .drK .Profile .individual .profile-image, .drK .Label .cloud-label .label-show label, .drK .Label .cloud-label a, .drK .widget input[type=email], .drK .widget input[type=text], .drK .widget textarea, .drK .Blog .related-posts li .item-thumbnail > *, .drK .Blog .comments ol > li > .comment-replies
{background-color:$(bg.hover.night.colors)}
.drK .header .navicon .nav i, .drK .Blog .accordion .accor-title .accor-icon:before, .drK .Blog .accordion .accor-title .accor-icon:after
{background-color:$(night.colors)}
.drK .header, .drK .navigation-menu, .drK .navigation-mobile, .drK .navigation-menu .sosmed ul svg
{color:$(night.colors);fill:$(night.colors)}
.drK .header .navicon .dark-switch, .drK .widget-title a, .drK .FeaturedPost article .item-header, .drK .PopularPosts article .item-header, .drK .PopularPosts article.no-thumbnail:before, .drK .Profile .individual .profile-text, .drK .Label .label-count, .drK .Label .cloud-label a, .drK .Label .label-show label, .drK .FollowByEmail .follow-by-email-text, .drK .button.outline, .drK .Blog .sitemaps li:before, .drK .Blog .sitemaps li a:after, .drK .Blog blockquote.style-1:before, .drK .Blog article .post-info, .drK .Blog .blog-pager .no-post, .drK .Blog article.post .post-info .post-author, .drK .Blog .daftar-isi .isi-judul:after, .drK .Blog .daftar-isi .isi-content ol li:before, .drK .Blog .post-tocContent ol li:before, .drK .Blog .author-posts .author-desc, .drK .Blog article .separate:before, .drK .error-container p, .drK .footbar, .drK .Blog .comments .comment-header .datetime, .drK .Blog .comments ol > li > .comment-actions a, .drK .Blog .comments .comment-reply a, .drK .Blog .comments .comment-thread .thread-toggle
{color:$(sec.night.colors)}
.drK .Blog .comments ol > li > .comment-actions svg, .drK .Blog .comments .comment-reply svg, .drK .Blog .comments .comment-thread .thread-toggle svg
{fill:none;stroke:$(sec.night.colors)}
.drK .button{color:$(night.colors)}
.drK .button.outline{border-color:$(night.colors)}
.drK .FollowByEmail, .drK .navigation-menu > li.break:after, .drK .Blog .sitemaps .sitemap-box, .drK .Blog blockquote.style-1, .drK .Blog article.post, .drK .Blog table td, .drK .Blog table th, .drK .Blog .daftar-isi, .drK .Blog .accordion li, .drK .Blog .spoiler, .drK .Blog .download-info, .drK .Blog .comments li li:not(:last-child), .drK .Blog .post-tabs .post-tabsHeader, .drK .Blog .post-tabs .post-tabsHeader > *
{border-color:rgba(255,255,255,.1)}
.drK .Blog table tr:nth-child(2n+1) td, .drK .Blog pre{background-color:rgba(0,0,0,.1)}
.drK .Blog table.tr-caption-container .tr-caption, .drK .Blog article.post{background-color:transparent}
/* Addtional Style */
.button{display:inline-flex;align-items:center;margin:15px 15px 15px 0;padding:10px 20px;outline:0;border:0;color:#fefefe;background-color:$(link.bg.colors);border-radius:3px;font-size:13px;line-height:22px;}
.button.outline{color:$(text.colors);background-color:transparent;border:1px solid $(alt.text.colors)}
.button.whatsapp{background-color:#25D366}
.button:hover{color:#fefefe;opacity:.75}
.button.outline:hover{color:$(link.bg.colors);border-color:$(link.bg.colors)}
.button-info{display:flex;flex-wrap:wrap;justify-content:center;margin:12px 0 0}
.button-info > *{margin:0 12px 12px 0}
.button-info > *:last-child{margin-right:0}
.lazy-youtube{background-color:#505050;position:relative;overflow:hidden;padding-top:56.30%;cursor:pointer;border-radius:3px;}
.lazy-youtube img{width:100%;top:-16.84%;left:0;opacity:.95;cursor:pointer}
.lazy-youtube .play-button{width:60px;height:60px;z-index:1;opacity:.98;border-radius:50px;border:2px solid rgba(255,255,255,.8);cursor:pointer}
.lazy-youtube .play-button:hover{border-color:#3a7bd5}
.lazy-youtube .play-button:hover:before{border-color:transparent transparent transparent #3a7bd5}
.lazy-youtube .play-button:before{content:'';border-style:solid;border-width:12px 0 12px 18px;border-color:transparent transparent transparent rgba(255,255,255,.8);border-radius:3px;margin-left:1px}
.lazy-youtube img, .lazy-youtube iframe, .lazy-youtube .play-button,.lazy-youtube .play-button:before{position:absolute!important}
.lazy-youtube .play-button, .lazy-youtube .play-button:before{top:50%;left:50%;transform:translate3d(-50%,-50%,0)}
.lazy-youtube iframe{height:100%;width:100%;top:0;left:0}
.lazy-youtube .playBut{display:inline-block;position:absolute;width:70px;height:70px;z-index:1;top:50%;left:50%;transform:translate3d(-50%,-50%,0);-webkit-transform:translate3d(-50%,-50%,0);-webkit-transition:all 0.5s ease;transition:all 0.5s ease}
.lazy-youtube .playBut svg{width:inherit;height:inherit}
.lazy-youtube .playBut .svg-play{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-width:7}
.lazy-youtube .circle{stroke:rgba(255,255,255,.8);stroke-dasharray:650;stroke-dashoffset:650;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;opacity:0.3;}
.lazy-youtube .triangle{stroke:rgba(255,255,255,.8);stroke-dasharray:240;stroke-dashoffset:480;-webkit-transition:all 0.7s ease-in-out;transition:all 0.7s ease-in-out;transform:translateY(0);-webkit-transform:translateY(0)}
.lazy-youtube .playBut:hover .triangle{stroke-dashoffset:0;opacity:1;stroke:#fefefe;animation:nudge 0.7s ease-in-out;-webkit-animation:nudge 0.7s ease-in-out}
.lazy-youtube .playBut:hover .circle{stroke-dashoffset:0;opacity:1;stroke:#fefefe}
.iklan-atas + .widget, .iklan-bawah + .widget, .post-entry .widget{margin:30px 0}
.Blog pre .widget, .Blog pre code .widget, #main-widget > #HTML4{display:none}
/* Non-user Select */
.post pre code i{user-select:none;-moz-user-select:none;-ms-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;}
/* Background Icon */
.m-icon{display:inline-block;margin-right:12px;width:18px;height:18px;background-size:cover;background-repeat:no-repeat;background-position:center center;}
.m-icon.download{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23161617" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M3 17v3a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-3"/><polyline points="8 12 12 16 16 12"/><line x1="12" x2="12" y1="2" y2="16"/></svg>')}
.m-icon.whatsapp{background-image:url("data:image/svg+xml,<svg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'><path d='M16,3A13,13,0,0,0,4.53,22.13L3,27.74a1,1,0,0,0,.27,1A1,1,0,0,0,4,29a.84.84,0,0,0,.27,0l5.91-1.65a1,1,0,0,0-.53-1.93L5.42,26.56l1.15-4.3a1,1,0,0,0-.1-.76A11,11,0,1,1,16,27a11.23,11.23,0,0,1-1.84-.15,1,1,0,0,0-1.15.82,1,1,0,0,0,.82,1.15A13,13,0,1,0,16,3Z' fill='%23fff'/><path d='M15,11.21l-1.16-1.6a2.06,2.06,0,0,0-1.5-.84,2.08,2.08,0,0,0-1.62.6l-1.2,1.2a2.81,2.81,0,0,0-.8,2.08c0,1.77,1.36,4,4,6.6,3.09,3,5.23,4,6.69,4a2.7,2.7,0,0,0,2-.81l1.2-1.2a2,2,0,0,0-.24-3.11L20.8,17a2.09,2.09,0,0,0-1.83-.3l-1.49.47a.53.53,0,0,1-.26-.09,11.42,11.42,0,0,1-2.35-2.26.31.31,0,0,1,0-.11c.13-.44.35-1.15.5-1.64A2,2,0,0,0,15,11.21Zm1.29,7.63a2.33,2.33,0,0,0,1.75.2l1.54-.46,1.61,1.25L20,21c-.48.47-2.25.33-5.86-3.21-3-2.91-3.41-4.5-3.41-5.18A.89.89,0,0,1,11,12l1.28-1.19,1.18,1.65c-.16.49-.39,1.22-.51,1.65A2.12,2.12,0,0,0,13,15.51,11.24,11.24,0,0,0,16.33,18.84Z' fill='%23fff'/></svg>")}
/* Keyframes Animation */
@-webkit-keyframes slidein{0%{opacity:0}20%{opacity:1;bottom:0}50%{opacity:1;bottom:0}80%{opacity:1;bottom:0}100%{opacity:0;bottom:-200px}}
@keyframes slidein{0%{opacity:0}20%{opacity:1;bottom:0}50%{opacity:1;bottom:0}80%{opacity:1;bottom:0}100%{opacity:0;bottom:-200px}}
@-webkit-keyframes nudge{0%{transform:translateX(0)}30%{transform:translateX(-5px)}50%{transform:translateX(5px)}70%{transform:translateX(-2px)}100%{transform:translateX(0)}}
@keyframes nudge{0%{transform:translateX(0)}30%{transform:translateX(-5px)}50%{transform:translateX(5px)}70%{transform:translateX(-2px)}100%{transform:translateX(0)}}
/* Responsive */
@media screen and (min-width:768px){::-webkit-scrollbar{-webkit-appearance:none;width:4px;height:5px}::-webkit-scrollbar-track{background-color:transparent}::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.15);border-radius:10px}::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.45)}::-webkit-scrollbar-thumb:active{background-color:rgba(0,0,0,.45)}}
@media screen and (max-width:1100px){
.header #header-widget{width:155px}
.sidebar{width:300px;padding:30px 25px 50px}
.mainbar{width:calc(100% - 300px)}
#nav-widget, #nav-widget:before, .navigation-menu .sosmed{width:200px}
#large-ads, main, .footbar{padding-left:225px} #large-ads, .footbar{padding-right:25px}
.nav-menu:checked + .mainWrapper .mainIner.singleItem main,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .footbar{padding-left:120px}
.nav-menu:checked + .mainWrapper .mainIner.singleItem .footbar{padding-right:25px}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li{width:calc(33.333% - 13.333px)}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(2n),
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(4n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(2n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(4n){margin-right:20px}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(3n),
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(6n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-child(3n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-child(6n){margin-right:0}
.FeaturedPost article .item-thumbnail{width:240px}
.FeaturedPost article .item-content{width:calc(100% - 260px)}
.FeaturedPost article .item-title{font-size:97%}
.Blog article.post, .Blog .breadcrumbs, .Blog .related-posts, .Blog .author-posts, .Blog .show-comment, .Blog #disqus_thread{margin-right:0;margin-left:0}
.Blog article.post .post-title{font-size:22px}
.Blog article.post .post-share .twitterThis{display:none}
.Blog .related-posts li{width:calc(50% - 10px)}
.Blog .related-posts li .item-thumbnail > *{padding-top:57%}
.Blog .post-toc{width:300px;padding-left:25px;padding-right:25px}
.Blog .post-tocHeader label .show{left:-75px}
.Blog .toc-menu:checked + .post-toc{right:-300px}
.multipleItem .Blog .blog-posts article{width:calc(50% - 10px)}
.multipleItem .Blog .blog-posts article:nth-of-type(3n), .Blog .related-posts li:nth-of-type(3n){margin-right:20px}
.multipleItem .Blog .blog-posts article:nth-of-type(2n),
.multipleItem .Blog .blog-posts article:nth-of-type(6n),
.Blog .related-posts li:nth-of-type(2n),
.Blog .related-posts li:nth-of-type(6n){margin-right:0}
}
@media screen and (max-width:768px){
.header{padding:0 25px}
.mainbar, .asideIner{width:100%;position:relative}
.sidebar{width:100%;padding:0 25px 30px 225px;-webkit-transition:all .2s ease;transition:all .2s ease}
main{padding-right:25px}
.nav-menu:checked + .mainWrapper .mainIner .sidebar{padding-left:90px}
.nav-menu:checked + .mainWrapper .mainIner .PopularPosts .item-popular{display:flex;flex-wrap:wrap}
.nav-menu:checked + .mainWrapper .mainIner .PopularPosts .item-popular article,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li{width:calc(50% - 10px);margin-right:20px}
.nav-menu:checked + .mainWrapper .mainIner .PopularPosts .item-popular article:nth-of-type(2n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(2n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(4n){margin-right:0}
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(3n){margin-right:20px}
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(6n){margin-right:0}
.nav-menu:checked + .mainWrapper .mainIner.singleItem .sidebar{padding:0 50px 30px 120px}
.nav-menu:checked + .mainWrapper .mainIner.singleItem .footbar{padding-right:50px}
.Blog .post-toc{width:100%;height:auto;padding:15px 20px;margin-bottom:30px;position:relative;top:0;background-color:#fefefe;border-radius:4px;box-shadow:0 10px 20px 0 rgba(30,30,30,.08);font-size:14px}
.Blog .post-tocContent{-webkit-transition:all .3s ease;transition:all .3s ease;max-height:0;overflow:hidden}
.Blog .toc-menu:checked + .post-toc{right:0}
.Blog .toc-menu:checked + .post-toc .post-tocHeader label .show{visibility:hidden;opacity:0}
.Blog .toc-menu:checked + .post-toc .post-tocHeader label svg.drop{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
.Blog .toc-menu:checked + .post-toc .post-tocContent{max-height:1000vh}
.drK .Blog .post-toc{background-color:$(bg.sec.night.colors)}
}
@media screen and (max-width:640px){
.header{padding:0 20px;position:absolute;}
.header .header-inner h1, #header-widget .header-inner h2{font-size:16px}
.header #header-widget{width:auto;max-width:220px}
.header .searchbar{position:fixed;top:0;left:0;width:100%;height:auto;max-width:none;padding:0 20px;z-index:10}
.header .searchbar input[type=text]{background-color:#fefefe;margin-top:-100px;padding:20px 20px 20px 55px;width:100%;z-index:3;border-radius:18px;-webkit-transition:all .3s ease;transition:all .3s ease}
.header .searchbar .search-button{top:-100px;left:20px;padding-top:20px;z-index:4;-webkit-transition:all .3s ease;transition:all .3s ease}
.header .searchbar input[type=text]:focus{margin-top:20px}
.header .searchbar input[type=text]:focus + .search-button, .header .searchbar input[type=text]:focus + .search-button + .navicon.search{top:0}
.header .searchbar input[type=text]:focus + .search-button + .navicon.search + .full-close.search{background:rgba(0,0,0,.25);opacity:1;visibility:visible}
.header .navicon.search{top:-100px;padding-top:20px}
.singleItem.post .header{background-color:#fefefe} .drK .singleItem.post .header{background-color:$(bg.sec.night.colors)}
.singleItem .navicon .nav{display:none;transform: rotate(180deg);-webkit-transform: rotate(180deg)}
.singleItem .navicon .nav.home{display:block}
.singleItem .navicon .nav i:nth-child(1){width:45%;margin-left:55%;-webkit-transform:translateY(3px) rotate(40deg);transform:translateY(3px) rotate(40deg)}
.singleItem .navicon .nav i:nth-child(2){width:95%;margin-left:0%}
.singleItem .navicon .nav i:nth-child(3){width:10%;margin-left:62.5%;background-color:transparent;-webkit-transform:translateY(0px) rotate(-40deg);transform:translateY(0px) rotate(-40deg)}
.widget:not(:last-child){margin-bottom:40px}
#large-ads, main, .sidebar, .footbar{padding-left:20px;padding-right:20px} .footbar{padding-bottom:70px}
#nav-widget:before, .navigation-menu .home{display:none}
#nav-widget{width:100%;padding:0;background:transparent;box-shadow:none;z-index:49;margin-left:-100%}
.navigation-menu{position:fixed;top:0;left:0;background-color:$(nav.bg.colors);max-width:480px;width:85%;height:100%;margin-left:-100%;padding:calc($(header.height) + 15px) 0 90px 0;-webkit-transition:all .2s ease;transition:all .2s ease;z-index:3;overflow:hidden;box-shadow:0 6px 18px 0 rgba(30,30,30,.035);border-radius:0 20px 20px 0}
.navigation-menu .sosmed{max-width:480px;width:85%;margin-left:-100%;border-radius:0 0 20px 0} .navigation-menu .close{display:block;border-radius:0 20px 0 0}
.navigation-menu:hover{overflow-y:auto}
/* Navigation mobile show */
.navigation-mobile{background-color:#fefefe;box-shadow:0 -10px 20px 0 rgba(30,30,30,.05);bottom:0}
.navigation-mobile li{visibility:visible;opacity:1}
.navigation-mobile .top-link a{display:block;position:relative;right:auto;bottom:auto;width:auto;height:auto;background-color:transparent;box-shadow:none}
/* Navigation menu */
.nav-menu:checked + .mainWrapper .mainIner #large-ads,
.nav-menu:checked + .mainWrapper .mainIner main,
.nav-menu:checked + .mainWrapper .mainIner .sidebar,
.nav-menu:checked + .mainWrapper .mainIner .footbar{padding-left:20px}
.nav-menu:checked + .mainWrapper .asideIner .full-close.nav-close{background:rgba(0,0,0,.25);opacity:1;visibility:visible}
.nav-menu:checked + .mainWrapper .asideIner #nav-widget{width:100%;margin-left:0;z-index:50}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed{width:85%}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu,
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed,
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .close{margin-left:0}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu li > * .name{display:block}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed .link{display:none}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed ul{display:flex}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sosmed ul li{height:auto;opacity:1;visibility:visible;padding:0 7px 0 0}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sub-menu:checked + .link + ul{padding:10px 0 0}
.nav-menu:checked + .mainWrapper .asideIner .navigation-menu .sub-menu:checked + .link + ul li{height:38px;padding:10px 20px 10px 43px;opacity:1;visibility:visible}
.nav-menu:checked + .mainWrapper .mainIner.singleItem main,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .sidebar,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .footbar{padding-left:20px;padding-right:20px}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article,
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li{width:calc(50% - 7.5px);margin-right:15px}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(3n),
.nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(3n){margin-right:15px}
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(2n),
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(4n),
.nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(6n){margin-right:0}
.nav-menu:checked + .mainWrapper .mainIner .PopularPosts .item-popular{display:block}
.nav-menu:checked + .mainWrapper .mainIner .PopularPosts .item-popular article{width:100%;margin-right:0}
.drK .navigation-mobile, .drK .navigation-menu, .drK .navigation-menu .close{background-color:$(bg.sec.night.colors)}
.drK .navigation-mobile svg{fill:$(night.colors)}
.drK .navigation-mobile svg.line, .drK .navigation-mobile .top-link svg.line{fill:none;stroke:$(night.colors)}
.drK #nav-widget{background-color:transparent}
/* Blog article */
.multipleItem .Blog .blog-pager{margin:40px 0 0}
.multipleItem .Blog .blog-posts article{width:calc(50% - 7.5px);margin-right:15px}
.multipleItem .Blog .blog-posts article:nth-of-type(3n){margin-right:15px}
.multipleItem .Blog .blog-posts article:nth-of-type(2n),
.multipleItem .Blog .blog-posts article:nth-of-type(4n),
.multipleItem .Blog .blog-posts article:nth-of-type(6n){margin-right:0}
.Blog article.post .post-info .post-timestamp .updated:before{content:'Disunting: '}
.Blog article.post .post-share .share-popup, .Profile .team .all-member, .Blog .post-font .post-fontContainer{align-items:flex-end;z-index:60}
.Blog article.post .post-share ul, .Profile .team .all-member .all-memberBox, .Blog .post-font .post-fontContainer ul{width:100%;max-width:none;margin-left:20px;margin-right:20px}
.Blog article.post .post-share .share-check:checked + .share-popup ul, .Profile .team .all-team:checked + .all-member .all-memberBox, .Blog .post-font .post-fontContainer.active ul{margin:0 20px 20px}
.Blog blockquote.style-1{padding:20px 20px 20px 70px} .Blog blockquote.style-1:before{top:0;left:15px}
.Blog .author-posts, .iklan-atas + .widget, .iklan-bawah + .widget, .Blog .show-comment{margin:30px 0}
.Blog .author-posts .author-desc{font-size:11px;line-height:1.3em}
.Blog .related-posts{margin:60px 0 30px}
.Blog .related-posts li{width:calc(50% - 7.5px);margin-right:15px;padding:8px 8px 15px}
.Blog .related-posts li:nth-of-type(3n){margin-right:15px}
.Blog .related-posts li:nth-of-type(6n){margin-right:0}
.Blog .post-pagenav > *{padding:4px 12px}
.Blog .comments{margin:30px 0 0}
.Blog .comments ol > li, .Blog .related-posts .title{font-size:13px}
.Blog .breadcrumbs, .Blog article.post .post-info, .Blog article.post .post-share li > * span,
.Blog .comments .comment-header .datetime, .Blog .author-posts .author-link a{font-size:10px}
.Blog article.post .post-share, .Blog .blog-pager, .Blog .related-posts li .item-title, .Blog .post-pagenav,
.Blog .comments .comment-thread .thread-toggle, .Blog .comments ol > li > .comment-replies .comment-reply,
.Blog .comments ol > li > .comment-actions{font-size:11px}
.Blog .author-posts .author-name, .Blog .comments .comment-header .user{font-size:12px}
.FeaturedPost article .item-title, .sidebar .FeaturedPost article .item-title, .PopularPosts article .item-title{font-size:97%}
.carousel{padding-top:35%}
}
@media screen and (max-width:480px){
.multipleItem .Blog .blog-posts article, .nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article,
.Blog .related-posts li, .nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li{width:calc(50% - 5px);margin-right:10px}
.multipleItem .Blog .blog-posts article:nth-of-type(3n), .nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(3n),
.Blog .related-posts li:nth-of-type(3n), .nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(3n){margin-right:10px}
.multipleItem .Blog .blog-posts article:nth-of-type(6n), .nav-menu:checked + .mainWrapper .mainIner.multipleItem .Blog .blog-posts article:nth-of-type(6n),
.Blog .related-posts li:nth-of-type(6n), .nav-menu:checked + .mainWrapper .mainIner.singleItem .Blog .related-posts li:nth-of-type(6n){margin-right:0}
.multipleItem .Blog article, .Blog .related-posts li{padding:8px 8px 12px;margin-bottom:10px}
.multipleItem .Blog article .post-title{font-size:80%}
.multipleItem .Blog article .post-info .post-author, .FeaturedPost article:after{display:none}
.multipleItem .Blog article .post-label{font-size:10px}
.multipleItem .Blog article .post-info, .multipleItem .Blog article .post-info .post-author{font-size:9px}
.multipleItem .Blog article .post-info .post-comment > * svg{width:16px}
.FeaturedPost article{padding:8px}
.FeaturedPost article .item-thumbnail{width:100%;margin:0 0 15px}
.FeaturedPost article .item-thumbnail a{padding-top:50%}
.FeaturedPost article .item-content{padding:0 5px 8px;width:100%}
.button-info > *{flex-grow:1;justify-content:center}
.button-info > *:last-child{flex-grow:0;flex-shrink:0}
.Blog article.post .separator a{margin-left:0!important;margin-right:0!important;float:none!important}
}
/* Sample Ads (Silahkan hapus bagian ini jika iklan sudah di replace semua) */
.ads-here{position:relative;display:flex;align-items:stretch;flex-wrap:wrap;min-height:150px;padding:15px;border:1px solid rgba(0,0,0,.05);border-radius:3px;color:#989b9f;font-size:75%}
.ads-here:after{content:'';display:block;width:50px;height:12px;background-color:rgba(0,0,0,.05);border-radius:0 0 0 8px;position:absolute;top:0;right:0}
.ads-here .ads-img{width:30%;display:flex;flex-shrink:0;align-items:center;justify-content:center;font-style:normal;background-color:rgba(0,0,0,.05)}
.ads-here .ads-img:before{content:'Sample ads'}
.ads-here .ads-content{width:50%;padding:20px 0 0 15px}
.ads-here .ads-content:before, .ads-here .ads-content:after{content:'';display:block;width:100%;padding-top:30px;background-color:rgba(0,0,0,.05)}
.ads-here .ads-content:after{width:70%;margin-top:12px;padding-top:20px}
.ads-here .ads-button{width:20%;display:flex;flex-shrink:0;align-items:center;justify-content:center;}
.ads-here .ads-button:before{content:'';width:60px;height:60px;border-radius:50%;background-color:rgba(0,0,0,.05)}
.ads-here.in-article .ads-img{width:100%;min-height:100px;margin-bottom:15px}
.ads-here.in-article .ads-content{padding:0;width:60%} .ads-here.in-article .ads-button{width:40%;justify-content:flex-end;align-items:flex-end}
.ads-here.in-article .ads-content:before{padding-top:12px}
.ads-here.in-article .ads-content:after{padding-top:10px}
.ads-here.in-article .ads-button:before{width:50px;height:10px;border-radius:0}
.ads-here.text{padding:15px 0;border-left:0;border-right:0;border-radius:0}
.ads-here.text .ads-text{display:flex;flex-wrap:wrap;width:100%}
.ads-here.text .ads-text i{width:calc(50% - 10px);height:27px;margin:5px;border:1px solid rgba(0,0,0,.05);display:flex;align-items:center;position:relative;overflow:hidden;border-radius:15px}
.ads-here.text .ads-text i:before{content:'';height:8px;width:30%;margin:auto auto;background-color:rgba(0,0,0,.05)}
.ads-here.text .ads-text i:after{content:'';height:25px;width:30px;background-color:rgba(0,0,0,.05);position:absolute;right:0}
@media screen and (max-width:768px){ .ads-here .ads-content:before{padding-top:12px} .ads-here .ads-content:after{padding-top:10px} .ads-here .ads-button{align-items:flex-end;justify-content:flex-end} .ads-here .ads-button:before{height:10px;border-radius:0}}
@media screen and (max-width:640px){.ads-here{min-height:90px}.ads-here .ads-content{padding-top:10px} .ads-here.text .ads-text i{width:100%;margin:5px 0}}
/* dihapus */
.text-here{display:flex;align-items:center;height:100%;padding:30px}
.text-here .text-left{flex-grow:1}
.text-here .text-left i{display:block;width:70%;height:25px;background-color:rgba(0,0,0,.05)}
.text-here .text-left i.bot{height:17px;width:50%;margin-top:12px}
.text-here .text-left i.go{width:30%;max-width:100px;margin-top:20px;background-color:#99f}
.text-here .text-img{flex-shrink:0;width:30%;height:80%;margin:auto 0;background-color:rgba(0,0,0,.05)}
@media screen and (max-width:768px){.text-here .text-left i{height:12px}.text-here .text-left i.bot{height:8px;margin-top:8px}.text-here .text-left i.go{margin-top:12px}.text-here .text-img{height:100%}}
footer .credit .credit-content {box-shadow: 0 2px 10px 0 rgba(0,0,0,.07); text-align: center ! important; border-radius:10px; padding:15px ; font-size: 14px; background:white;}
header {position: sticky! important}footer .credit .credit-content {box-shadow: 0 2px 10px 0 rgba(0,0,0,.07); text-align: center ! important; border-radius:8px; padding:15px ; font-size: 14px; background:white;}
a{text-decoration:none! important}
.drK footer .credit .credit-content{background:#333333; color:white; box-shadow: 0px 2px 10px #1c1c1c; }
.header{margin-top: -60px ! important}
*{-webkit-tap-highlight-color:transparent}
.button{border-radius:20px ! important;}
#Profile00{background: transparent! important; box-shadow:none! important; border-radius:none! important; padding:none! important;}
#sidebar-widget .widget {box-shadow: 0px 2px 10px #ededed ; border-radius:8px; padding:15px ; background:white;}
.drK #sidebar-widget .widget {box-shadow: 0px 2px 10px #1c1c1c ; border-radius:8px; padding:15px ; background:#333333;}a:hover{color:blue ! important}
.drK a:hover{color: orange ! important}/* Hide Scroll */ .scrlH::-webkit-scrollbar{width:0;height:0} .scrlH::-webkit-scrollbar-track{background:transparent} .scrlH::-webkit-scrollbar-thumb{background:transparent;border:none}
/* Widget Scroll Menu */ .navS{box-shadow:0 0 25px rgba(0,0,0,.07);background:var(--contentB);overflow-y:hidden;overflow-x:scroll;scroll-behavior:smooth;scroll-snap-type:x mandatory; -ms-overflow-style:none;-webkit-overflow-scrolling:touch; display:flex;padding:0;border-radius:10px} .navS ul{display:flex;list-style:none;margin:0;padding:0;white-space:nowrap} .navS li{margin:0 15px;padding:10px 0;position:relative;scroll-snap-align:start} .navS li:first-child{margin-left:auto} .navS li:last-child{margin-right:auto} .navS .l{display:block;color:#161617;padding:8px 0;background:#f0f2f4;opacity:0.9;box-shadow: rgba(23,43,99,.3) 0 1px 2px;border-radius:8px;padding: 5px 7px;}.navS .l::before{content:attr(data-text)} .navS .l::after{content:'';height:1px;border-radius:2px 2px 0 0;background:#1c1c1c;position:absolute;bottom:0;left:0;right:0;opacity:0} .navS span.l{opacity:.7} .navS a.l:hover, .navS .l.a{color:var(--darkU)} @media screen and (max-width:896px){.navS .secIn{padding:0} .navS li{margin:0px;padding:8px 0;display:flex} .navS li::before{content:'';padding:10px} .navS ul::after{content:'';display:block;padding:10px;scroll-snap-align:start} .navS .l{position:relative} .navS .l::after{bottom:-8px} .navS a.l:hover::after, .navS .l.a::after{opacity:1}} @media screen and (max-width:500px){.navS{font-size:13px}} .drK .navS{background:#333333} .drK .navS .l{color:#ededed} .drK .navS a.l:hover, .drK .navS .l.a{color:orange} .drK .navS .l::after{background:orange}.drK .navS .l{background:#1c1c1c}.drK .navS .l::after{background:var(--linkC)}.drK .navS a.l:hover,.drK .navS .l.a{color:var(--linkC)}
/* Wave Animation */ .wvC{position:absolute;bottom:0;width:100%;z-index:-1} .wvS{position:relative} .wvS .waves{position:absolute;bottom:0;width:100%;height:60px;min-height:100px;max-height:150px} .wvH{position:relative;height:0;background:#C6DAFC;animation:waveHd 7s infinite} .plx > use{fill:#C6DAFC;animation:waveMove 25s cubic-bezier(.55,.5,.45,.5) infinite} .plx > use:nth-child(1){opacity:.7;animation-delay:-2s;animation-duration:7s} .plx > use:nth-child(2){opacity:.5;animation-delay:-3s;animation-duration:10s} .plx > use:nth-child(3){opacity:.3;animation-delay:-4s;animation-duration:13s} .plx > use:nth-child(4){opacity:1;animation-delay:-5s;animation-duration:20s} @media (max-width:896px){.wvH{animation:waveHm 7s infinite}} .drK .wvH{background:#343435} .drK .plx > use{fill:#343435} @keyframes waveMove{0%{transform: translate3d(-90px,0,0)}100%{transform: translate3d(85px,0,0)}} @keyframes waveHm{0%{height:0}35%,65%{height:200px}100%{height:0}} @keyframes waveHd{0%{height:0}35%,65%{height:100px}100%{height:0}}<!--[ CSS stylesheet ]-->
/* Variable color */
:root{
--headC: #08102b ;
--bodyC: #08102b ;
--bodyCa: #767676 ;
--bodyB: #fffdfc ;
--linkC: #3367D6 ;
--linkB: #3367D6 ;
--iconC: #08102b ;
--iconCa: #08102b ;
--iconCs: #767676 ;
--headerC: #08102b ;
--headerT: 16px ;
--headerW: 400 ; /* write 400(normal) or 700(bold) */
--headerB: #fffdfc ;
--headerL: 1px ;
--headerI: #08102b ;
--headerH: 60px ;
--headerHi: -60px ;
--headerHm: 60px ;
--notifH: 53px ;
--notifU: #e8f0fe ;
--notifC: #3c4043 ;
--notifL: #0b57cf ;
--contentB: #fffdfc ;
--contentL: #e6e6e6 ;
--contentW: 1280px ;
--sideW: 300px ;
--transB: rgba(0,0,0,.05);
--pageW: 780px ;
--pageW: 780px ;
--postT: 36px ;
--postF: 16px ;
--postTm: 28px ;
--postFm: 15px ;
--widgetT: 15px ;
--widgetTw: 400 ; /* write 400(normal) or 700(bold) */
--widgetTa: 25px ;
--widgetTac: #989b9f;
--navW: 230px ;
--navT: #08102b ;
--navI: #08102b ;
--navB: #fffdfc ;
--navL: 1px ;
--srchI: #08102b ;
--srchB: #fffdfc ;
--mobT: #08102b ;
--mobHv: #f1f1f0 ;
--mobB: #fffdfc ;
--mobL: 0px ;
--mobBr: 12px ;
--fotT: #08102b ;
--fotB: #fffdfc ;
--fotL: 1px ;
--fontH: 'Noto Sans', sans-serif ;
--fontB: 'Noto Sans', sans-serif ;
--fontBa: 'Noto Sans', sans-serif ;
--fontC: 'Fira Mono', monospace ;
--trans-1: all .1s ease ;
--trans-2: all .2s ease ;
--trans-4: all .4s ease ;
--synxBg: #f6f6f6 ;
--synxC: #2f3337 ;
--synxOrange: #b75501 ;
--synxBlue: #015692 ;
--synxGreen: #54790d ;
--synxRed: #f15a5a ;
--synxGray: #656e77 ;
--darkT: #fffdfc ;
--darkTa: #989b9f ;
--darkU: #0bcf84 ;
--darkB: #1e1e1e ;
--darkBa: #2d2d30 ;
--darkBs: #252526 ;
}
/* Hide Scroll */ .scrlH::-webkit-scrollbar{width:0;height:0} .scrlH::-webkit-scrollbar-track{background:transparent} .scrlH::-webkit-scrollbar-thumb{background:transparent;border:none}
/* Widget Scroll Menu */ .navS{box-shadow:0 0 25px rgba(0,0,0,.07);background:var(--contentB);overflow-y:hidden;overflow-x:scroll;scroll-behavior:smooth;scroll-snap-type:x mandatory; -ms-overflow-style:none;-webkit-overflow-scrolling:touch; display:flex;padding:0;border-radius:10px} .navS ul{display:flex;list-style:none;margin:0;padding:0;white-space:nowrap} .navS li{margin:0 15px;padding:10px 0;position:relative;scroll-snap-align:start} .navS li:first-child{margin-left:auto} .navS li:last-child{margin-right:auto} .navS .l{display:block;color:#161617;padding:8px 0;background:#f0f2f4;opacity:0.9;box-shadow: rgba(23,43,99,.3) 0 1px 2px;border-radius:8px;padding: 5px 7px;}.navS .l::before{content:attr(data-text)} .navS .l::after{content:'';height:1px;border-radius:2px 2px 0 0;background:#1c1c1c;position:absolute;bottom:0;left:0;right:0;opacity:0} .navS span.l{opacity:.7} .navS a.l:hover, .navS .l.a{color:var(--darkU)} @media screen and (max-width:896px){.navS .secIn{padding:0} .navS li{margin:0px;padding:8px 0;display:flex} .navS li::before{content:'';padding:10px} .navS ul::after{content:'';display:block;padding:10px;scroll-snap-align:start} .navS .l{position:relative} .navS .l::after{bottom:-8px} .navS a.l:hover::after, .navS .l.a::after{opacity:1}} @media screen and (max-width:500px){.navS{font-size:13px}} .drK .navS{background:#333333} .drK .navS .l{color:#ededed} .drK .navS a.l:hover, .drK .navS .l.a{color:orange} .drK .navS .l::after{background:orange}.drK .navS .l{background:#1c1c1c}.drK .navS .l::after{background:var(--linkC)}.drK .navS a.l:hover,.drK .navS .l.a{color:var(--linkC)}
/* Wave Animation */ .wvC{position:absolute;bottom:0;width:100%;z-index:-1} .wvS{position:relative} .wvS .waves{position:absolute;bottom:0;width:100%;height:60px;min-height:100px;max-height:150px} .wvH{position:relative;height:0;background:#C6DAFC;animation:waveHd 7s infinite} .plx > use{fill:#C6DAFC;animation:waveMove 25s cubic-bezier(.55,.5,.45,.5) infinite} .plx > use:nth-child(1){opacity:.7;animation-delay:-2s;animation-duration:7s} .plx > use:nth-child(2){opacity:.5;animation-delay:-3s;animation-duration:10s} .plx > use:nth-child(3){opacity:.3;animation-delay:-4s;animation-duration:13s} .plx > use:nth-child(4){opacity:1;animation-delay:-5s;animation-duration:20s} @media (max-width:896px){.wvH{animation:waveHm 7s infinite}} .drK .wvH{background:#343435} .drK .plx > use{fill:#343435} @keyframes waveMove{0%{transform: translate3d(-90px,0,0)}100%{transform: translate3d(85px,0,0)}} @keyframes waveHm{0%{height:0}35%,65%{height:200px}100%{height:0}} @keyframes waveHd{0%{height:0}35%,65%{height:100px}100%{height:0}}
/* Back to Top */ .Ttop{display:flex;align-items:center;justify-content:center;position:fixed;right:20px;bottom:70px;width:45px;height:45px;border-radius:50%;cursor:pointer;visibility:hidden;opacity:0;z-index:5;transform:scale(0);transition:transform .3s ease, opacity .3s ease,visibility .3s ease,margin-bottom 1s ease} .Ttop.vsbl{visibility:visible;opacity:1;transform:scale(1)}.Ttop:hover{opacity:.8} .Ttop svg{height:100% !important;width:100% !important;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);stroke-width:1.5;cursor:pointer} .Ttop svg .b{fill:#fff;stroke:#e6e6e6;opacity:.9} .Ttop svg .c{fill:none;stroke:#6200ee;stroke-dasharray:100 100;stroke-dashoffset:100;stroke-linecap:round} .Ttop svg .d{fill:none;stroke:#08102b} .drK .Ttop svg .b{fill:#2d2d30;stroke:#404045} .drK .Ttop svg .c{stroke:#8775f5} .drK .Ttop svg .d{stroke:#fffdfc}<!--[ CSS stylesheet ]-->
/* Variable color */
:root{
--headC: #08102b ;
--bodyC: #08102b ;
--bodyCa: #767676 ;
--bodyB: #fffdfc ;
--linkC: #3367D6 ;
--linkB: #3367D6 ;
--iconC: #08102b ;
--iconCa: #08102b ;
--iconCs: #767676 ;
--headerC: #08102b ;
--headerT: 16px ;
--headerW: 400 ; /* write 400(normal) or 700(bold) */
--headerB: #fffdfc ;
--headerL: 1px ;
--headerI: #08102b ;
--headerH: 60px ;
--headerHi: -60px ;
--headerHm: 60px ;
--notifH: 53px ;
--notifU: #e8f0fe ;
--notifC: #3c4043 ;
--notifL: #0b57cf ;
--contentB: #fffdfc ;
--contentL: #e6e6e6 ;
--contentW: 1280px ;
--sideW: 300px ;
--transB: rgba(0,0,0,.05);
--pageW: 780px ;
--pageW: 780px ;
--postT: 36px ;
--postF: 16px ;
--postTm: 28px ;
--postFm: 15px ;
--widgetT: 15px ;
--widgetTw: 400 ; /* write 400(normal) or 700(bold) */
--widgetTa: 25px ;
--widgetTac: #989b9f;
--navW: 230px ;
--navT: #08102b ;
--navI: #08102b ;
--navB: #fffdfc ;
--navL: 1px ;
--srchI: #08102b ;
--srchB: #fffdfc ;
--mobT: #08102b ;
--mobHv: #f1f1f0 ;
--mobB: #fffdfc ;
--mobL: 0px ;
--mobBr: 12px ;
--fotT: #08102b ;
--fotB: #fffdfc ;
--fotL: 1px ;
--fontH: 'Noto Sans', sans-serif ;
--fontB: 'Noto Sans', sans-serif ;
--fontBa: 'Noto Sans', sans-serif ;
--fontC: 'Fira Mono', monospace ;
--trans-1: all .1s ease ;
--trans-2: all .2s ease ;
--trans-4: all .4s ease ;
--synxBg: #f6f6f6 ;
--synxC: #2f3337 ;
--synxOrange: #b75501 ;
--synxBlue: #015692 ;
--synxGreen: #54790d ;
--synxRed: #f15a5a ;
--synxGray: #656e77 ;
--darkT: #fffdfc ;
--darkTa: #989b9f ;
--darkU: #0bcf84 ;
--darkB: #1e1e1e ;
--darkBa: #2d2d30 ;
--darkBs: #252526 ;
}
/* Hide Scroll */ .scrlH::-webkit-scrollbar{width:0;height:0} .scrlH::-webkit-scrollbar-track{background:transparent} .scrlH::-webkit-scrollbar-thumb{background:transparent;border:none}
/* Widget Scroll Menu */ .navS{box-shadow:0 0 25px rgba(0,0,0,.07);background:var(--contentB);overflow-y:hidden;overflow-x:scroll;scroll-behavior:smooth;scroll-snap-type:x mandatory; -ms-overflow-style:none;-webkit-overflow-scrolling:touch; display:flex;padding:0;border-radius:10px} .navS ul{display:flex;list-style:none;margin:0;padding:0;white-space:nowrap} .navS li{margin:0 15px;padding:10px 0;position:relative;scroll-snap-align:start} .navS li:first-child{margin-left:auto} .navS li:last-child{margin-right:auto} .navS .l{display:block;color:#161617;padding:8px 0;background:#f0f2f4;opacity:0.9;box-shadow: rgba(23,43,99,.3) 0 1px 2px;border-radius:8px;padding: 5px 7px;}.navS .l::before{content:attr(data-text)} .navS .l::after{content:'';height:1px;border-radius:2px 2px 0 0;background:#1c1c1c;position:absolute;bottom:0;left:0;right:0;opacity:0} .navS span.l{opacity:.7} .navS a.l:hover, .navS .l.a{color:var(--darkU)} @media screen and (max-width:896px){.navS .secIn{padding:0} .navS li{margin:0px;padding:8px 0;display:flex} .navS li::before{content:'';padding:10px} .navS ul::after{content:'';display:block;padding:10px;scroll-snap-align:start} .navS .l{position:relative} .navS .l::after{bottom:-8px} .navS a.l:hover::after, .navS .l.a::after{opacity:1}} @media screen and (max-width:500px){.navS{font-size:13px}} .drK .navS{background:#333333} .drK .navS .l{color:#ededed} .drK .navS a.l:hover, .drK .navS .l.a{color:orange} .drK .navS .l::after{background:orange}.drK .navS .l{background:#1c1c1c}.drK .navS .l::after{background:var(--linkC)}.drK .navS a.l:hover,.drK .navS .l.a{color:var(--linkC)}
/* Wave Animation */ .wvC{position:absolute;bottom:0;width:100%;z-index:-1} .wvS{position:relative} .wvS .waves{position:absolute;bottom:0;width:100%;height:60px;min-height:100px;max-height:150px} .wvH{position:relative;height:0;background:#C6DAFC;animation:waveHd 7s infinite} .plx > use{fill:#C6DAFC;animation:waveMove 25s cubic-bezier(.55,.5,.45,.5) infinite} .plx > use:nth-child(1){opacity:.7;animation-delay:-2s;animation-duration:7s} .plx > use:nth-child(2){opacity:.5;animation-delay:-3s;animation-duration:10s} .plx > use:nth-child(3){opacity:.3;animation-delay:-4s;animation-duration:13s} .plx > use:nth-child(4){opacity:1;animation-delay:-5s;animation-duration:20s} @media (max-width:896px){.wvH{animation:waveHm 7s infinite}} .drK .wvH{background:#343435} .drK .plx > use{fill:#343435} @keyframes waveMove{0%{transform: translate3d(-90px,0,0)}100%{transform: translate3d(85px,0,0)}} @keyframes waveHm{0%{height:0}35%,65%{height:200px}100%{height:0}} @keyframes waveHd{0%{height:0}35%,65%{height:100px}100%{height:0}}
/* Back to Top */ .Ttop{display:flex;align-items:center;justify-content:center;position:fixed;right:20px;bottom:70px;width:45px;height:45px;border-radius:50%;cursor:pointer;visibility:hidden;opacity:0;z-index:5;transform:scale(0);transition:transform .3s ease, opacity .3s ease,visibility .3s ease,margin-bottom 1s ease} .Ttop.vsbl{visibility:visible;opacity:1;transform:scale(1)}.Ttop:hover{opacity:.8} .Ttop svg{height:100% !important;width:100% !important;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);stroke-width:1.5;cursor:pointer} .Ttop svg .b{fill:#fff;stroke: #e6e6e6;opacity:.9} .Ttop svg .c{fill:none;stroke: skyblue;stroke-dasharray:100 100;stroke-dashoffset:100;stroke-linecap:round} .Ttop svg .d{fill:none;stroke:#08102b} .drK .Ttop svg .b{fill:#2d2d30;stroke:#404045} .drK .Ttop svg .c{stroke:#8775f5} .drK .Ttop svg .d{stroke:#fffdfc}
<!--[ Blog Topics CSS ]-->
/* blogTopc and ToC */
.topM a{color:inherit} .tpMn .a, .tpMn ul li >*{display:flex;align-items:center;padding:8px 5px;border-radius:8px;position:relative;width:calc(100% + 20px);left:-10px;right:-10px;transition:var(--trans-1)} .tpMn .a >*{margin:0 5px} .tpMn .n, .tpMn ul li >*{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 0 calc(100% - 64px)} .tpMn ul{margin-bottom:10px} .tpMn ul li >*{opacity:.8; padding:8px 10px} .tpMn ul li >*:hover{opacity:1} .tpMn .a:hover, .tpMn ul li a:hover{color:#204ecf;background:rgba(0,0,0,.05)} .tpMn li.br::after{content:'';display:block;border-bottom:1px solid var(--contentL);margin:12px 0} .tpMn details summary{list-style:none;outline:none;cursor:default} .tpMn details summary::-webkit-details-marker{display:none} .tpMn details svg{height:12px;width:12px ;} .tpMn details[open] svg.d{transform:rotate(180deg)} .tocI ol ol ol{display:none} .tocI ol{list-style:none;padding:0;margin:0; line-height:1.5em} .tocI ol{counter-reset:toc-count} .tocI ol ol, .tocI li:not(:last-child){margin-bottom:5px} .tocI li li:first-child{margin-top:5px} .tocI li{display:flex;flex-wrap:wrap; justify-content:flex-end} .tocI li::before{flex:0 0 23px; content:counters(toc-count,'.')'. ';counter-increment:toc-count} .tocI li a{flex:1 0 calc(100% - 23px)} .tocI li li::before{flex:0 0 28px; content:counters(toc-count,'.')} .tocI li li a{flex:1 0 calc(100% - 28px)} .tocI >ol >li >ol{flex:0 0 calc(100% - 23px)} .tocI >ol >li >ol ol{flex:0 0 calc(100% - 28px)} .tocI a{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden} .tocI a:hover{text-decoration:underline}
.topM a{color:inherit} .tpMn .a, .tpMn ul li >*{display:flex;align-items:center;padding:8px 5px;border-radius:8px;position:relative;width:calc(100% + 20px);left:-10px;right:-10px;transition:var(--trans-1)} .tpMn .a >*{margin:0 5px} .tpMn .n, .tpMn ul li >*{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 0 calc(100% - 64px)} .tpMn ul{margin-bottom:10px} .tpMn ul li >*{opacity:.8; padding:8px 10px} .tpMn ul li >*:hover{opacity:1} .tpMn .a:hover, .tpMn ul li a:hover{color:var(--linkC);background:rgba(0,0,0,.05)} .tpMn li.br::after{content:'';display:block;border-bottom:1px solid var(--contentL);margin:12px 0} .tpMn details summary{list-style:none;outline:none;cursor:default} .tpMn details summary::-webkit-details-marker{display:none} .tpMn details[open] svg.d{transform:rotate(180deg)} .tocI ol ol ol{display:none} .tocI ol{list-style:none;padding:0;margin:0; line-height:1.5em} .tocI ol{counter-reset:toc-count} .tocI ol ol, .tocI li:not(:last-child){margin-bottom:5px} .tocI li li:first-child{margin-top:5px} .tocI li{display:flex;flex-wrap:wrap; justify-content:flex-end} .tocI li::before{flex:0 0 23px; content:counters(toc-count,'.')'. ';counter-increment:toc-count} .tocI li a{flex:1 0 calc(100% - 23px)} .tocI li li::before{flex:0 0 28px; content:counters(toc-count,'.')} .tocI li li a{flex:1 0 calc(100% - 28px)} .tocI >ol >li >ol{flex:0 0 calc(100% - 23px)} .tocI >ol >li >ol ol{flex:0 0 calc(100% - 28px)} .tocI a{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden} .tocI a:hover{text-decoration:underline} .tpMn{box-shadow:0 0 15px rgba(0,0,0,.07); border-radius:10px} .drK .tpMn{background:#333333}
.topM{position:fixed;top:0;bottom:0;left:-320px;width:80%;max-width:320px;transition:var(--trans-1)} .topM, .topM >*:not(.fCls):not(li){z-index:999} .topM .section{padding:30px 20px 20px;overflow-y:scroll;overflow-x:hidden; width:100%;max-height:100%} .tpMn .a, .tpMn ul li >*{padding-top:10px;padding-bottom:10px} .tpBr{width:100%;height:100%;position:relative;--tw-bg-opacity: 1;background-color: rgb(255 255 255/var(--tw-bg-opacity));;box-shadow:0 5px 30px 0 rgba(0,0,0,.05);z-index:2} .tpBrs{width:100%;height:100%} .tpC{position:absolute;right:-45px;top:120px; transition:var(--trans-1);z-index:1} .tpC svg{width:18px;height:18px} .tpC svg.rad{width:20px;height:20px;position:absolute;left:-2px;top:-19px;fill:rgb(255 255 255/var(--tw-bg-opacity));--tw-bg-opacity: 1;transform:rotate(176deg);transition:inherit;z-index:1} .tpC svg.rad.in{top:auto;bottom:-19px;transform:rotate(-86deg)} .tpC label{display:flex;align-items:center;position:relative;justify-content:center;width:45px;height:40px;--tw-bg-opacity: 1;background-color: rgb(255 255 255/var(--tw-bg-opacity));transition:inherit;border-radius:0 20px 20px 0;box-shadow:0 5px 20px 0 rgba(0,0,0,.1)} .topI:checked ~ .topM{left:0;z-index:40} .topI:checked ~ .topM .tpC{right:-17.5px} .topI:checked ~ .topM .tpC svg.rad{visibility:hidden} .topI:checked ~ .topM .tpC label{border-radius:20px;width:40px;--tw-bg-opacity: 1} .topI:checked ~ .topM .tpC label svg{transform:rotate(180deg)} .topI:checked ~ .topM .fCls{opacity:1;visibility:visible;background:rgba(0,0,0,.25)}.topM{left:-280px;width:280px}}.topM li {list-style:none;margin-left:-35px}.topM ul {list-style: none;margin: 0;padding: 0}.drK .tpC svg.rad {fill: white; --tw-bg-opacity: 1}.drK .topM a, .drK footer a{color:inherit} .drK .blogPg .nPst, .drK .blogPg .current{background:var(--contentL);color:white} @media screen and (max-width:1100px){.drK .tpBr{background:#06011a} .drK .tpC label{background:#333333} .drK .tpC svg.rad{fill:white} .drK .topI:checked ~ .topM .tpC label{background:blue}}.wendy:before{content:'';display:block;width:10px;height:10px;background-color:#f09800;border:1px solid #fefefe;border-radius:50%;position:relative;top:12px;left:-2px;-webkit-animation:indicatornotif 1s ease infinite;-moz-animation:indicatornotif 1s ease infinite;animation:indicatornotif 1s ease infinite}
.drK #tpcmn svg{fill:white ! important;}
/* Topic Menu */
.tpMn {padding:15px ! important}
#tpcmns li{margin-left:15px;}
#tpcmn{margin-top:-10px ! important; }
#tpcmn span{font-size:16px; font-weight:bold; }
.tpMn {z-index:9999999999999999 ! important}#nav-widget{z-index:1 ! important}
#Addons .widget{margin-top:20px}/* Reading Progress Bar */.pRs{border:.1px solid #eceff1;top:0;left:0;z-index:999;height:6px;display:-webkit-box;display:-ms-flexbox;display:flex;background:#e9ecef}.pBar{top:0;left:0;z-index:2;border-radius:.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content;background:#9C27B0;transition:width .6s ease}.pSt{background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:50px 50px}.pAn{animation:AnPr 2s linear infinite}.pSt1{background-image:linear-gradient(45deg,rgba(204,204,204,.15) 25%,transparent 25%,transparent 50%,rgba(204,204,204,.15) 50%,rgba(204,204,204,.15) 75%,transparent 75%,transparent);background-size:50px 50px}.drK .pBar{background:#F57C00}.drK .pSt{background-image:linear-gradient(45deg,rgba(255,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(255,0,0,.15) 50%,rgba(255,0,0,.15) 75%,transparent 75%,transparent);background-size:50px 50px}.drK .pRs{border:1px solid #374C63;background:#263545}/* Cookies Consent Notice by Fineshop */
.ckWrap{position:fixed;right:0;left:0;bottom:-600px;z-index:50;width:100%;padding:20px;background:rgba(255, 255, 255, 0.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:30px 30px 0 0;box-shadow:0 -10px 25px -5px rgba(0,0,0,.1);align-items:center;justify-content:center;text-align:center;animation:ckUp 2.5s forwards;animation-delay:1s;-webkit-animation:ckUp 2.5s forwards;-webkit-animation-delay:1s}
.ckWrap.acptd{animation:ckDn 2.5s backwards;animation-delay:.3s;-webkit-animation:ckDn 2.5s backwards;-webkit-animation-delay:.3s}
.ckWrap.hidden{display:none}
.ckWrap .ckCont svg{width:50px;height:50px;fill:#08102b;stroke:#08102b;stroke-width:.8}
.ckCont h2{margin:0;color:#08102b;font-size:1.5rem;font-weight:800;font-family:inherit}
.ckCont p{margin:10px 0;line-height:1.7em;color:#08102b;font-size:0.9rem;font-weight:400;font-family:inherit}
.ckWrap .btn{display:inline-flex;align-items:center;margin:0;padding:10px 15px;outline:0;border:0;border-radius:2px;line-height:20px;color:#fefefe;background-color:#482dff;font-size:13px;font-family:inherit;text-decoration:none;white-space:nowrap;overflow:hidden;max-width:100%;cursor:pointer;transition:all 0.3s ease}
.ckWrap .btn:hover{opacity:.8;transform:scale(0.97)}
.ckWrap .btn.outl{color:#08102b;margin-left:8px;background-color:transparent;border:1px solid #767676}
.ckWrap .btn.outl:hover{border-color:#482dff}
@media screen and (min-width:768px){.ckWrap{max-width:450px;border-radius:10px;left:auto;right:30px;bottom:-500px;box-shadow:0 5px 35px rgba(0,0,0,.1);animation:ckdeskUp 2.5s forwards;animation-delay:1s;-webkit-animation:ckdeskUp 2.5s forwards;-webkit-animation-delay:1s}.ckWrap.acptd{animation:ckdeskDn 2.5s backwards;animation-delay:.3s;-webkit-animation:ckdeskDn 2.5s backwards;-webkit-animation-delay:0.3s}}
@-webkit-keyframes ckUp{100%{bottom:0}}
@keyframes ckUp{100%{bottom:0}}
@-webkit-keyframes ckdeskUp{100%{bottom:30px}}
@keyframes ckdeskUp{100%{bottom:30px}}
@-webkit-keyframes ckDn{0%{bottom:0}100%{bottom:-600px}}
@keyframes ckDn{0%{bottom:0}100%{bottom:-600px}}
@-webkit-keyframes ckdeskDn{0%{bottom:30px}100%{bottom:-600px}}
@keyframes ckdeskDn{0%{bottom:30px}100%{bottom:-600px}}
.drK .ckWrap{background:rgba(50, 50, 50, 0.8)}
.drK .ckWrap .ckCont svg{fill:#fefefe;stroke:#fefefe}
.drK .ckCont h2, .drK .ckCont p, .drK .btn.outl{color:#fefefe}]]></b:skin>
<b:defaultmarkups>
<b:defaultmarkup type='Common'>
<b:includable id='post-artikelAuthor'>
<div class='author-posts'>
<div class='authorImage'>
<div class='authorImg'>
<img class='post-thumb lazy' expr:alt='data:post.author.name' expr:data-src='resizeImage(data:post.author.authorPhoto.image,100,"1:1")' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
</div>
<!-- Link social media -->
<ul class='author-link'>
<!-- Blogger -->
<li>
<a aria-label='Social media' expr:href='data:post.author.profileUrl' rel='nofollow noreferrer noopener' role='button' target='_blank'>
<svg style='height:22px' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'><path d='M28,12H26V9.5A7.5,7.5,0,0,0,18.5,2h-9A7.5,7.5,0,0,0,2,9.5V19a1,1,0,0,0,2,0V9.5A5.51,5.51,0,0,1,9.5,4h9A5.51,5.51,0,0,1,24,9.5V12a2,2,0,0,0,2,2h2v8.5A5.51,5.51,0,0,1,22.5,28H9.5A5.51,5.51,0,0,1,4,22.5V22a1,1,0,0,0-2,0v.5A7.5,7.5,0,0,0,9.5,30h13A7.5,7.5,0,0,0,30,22.5V14A2,2,0,0,0,28,12Z'/><path d='M11.5,14h5a2.5,2.5,0,0,0,0-5h-5a2.5,2.5,0,0,0,0,5Zm0-3h5a.5.5,0,0,1,0,1h-5a.5.5,0,0,1,0-1Z'/><path d='M11.5,23h9a2.5,2.5,0,0,0,0-5h-9a2.5,2.5,0,0,0,0,5Zm0-3h9a.5.5,0,0,1,0,1h-9a.5.5,0,0,1,0-1Z'/></svg>
</a>
</li>
<!-- Facebook -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5h8a1,1,0,0,0,1-1V20a1,1,0,0,0-1-1H15V17h1a1,1,0,0,0,1-1V12.5A2.5,2.5,0,0,1,19.5,10H22v2H21a2,2,0,0,0-2,2v2a1,1,0,0,0,1,1h1.72l-.5,2H20a1,1,0,0,0-1,1v4a1,1,0,0,0,2,0V21h1a1,1,0,0,0,1-.76l1-4a1,1,0,0,0-.18-.86A1,1,0,0,0,23,15H21V14h2a1,1,0,0,0,1-1V9a1,1,0,0,0-1-1H19.5A4.51,4.51,0,0,0,15,12.5V15H14a1,1,0,0,0-1,1v4a1,1,0,0,0,1,1h1v6H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3V24a3,3,0,0,1-3,3H20a1,1,0,0,0,0,2h4a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Z'/></svg>
</a>
</li>
<!-- Twitter -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M28.77,8.11a.87.87,0,0,0-.23-.2A4.69,4.69,0,0,0,29,6.54a1,1,0,0,0-.44-1,1,1,0,0,0-1.1,0,6.42,6.42,0,0,1-2.28.92,6.21,6.21,0,0,0-7.08-1A6.07,6.07,0,0,0,15,12.2a1,1,0,0,0,2-.4A4.08,4.08,0,0,1,19,7.28a4.24,4.24,0,0,1,5.12,1,1,1,0,0,0,.88.28l.25,0a1,1,0,0,0,.34,1.62,1,1,0,0,0-.36.88,13.07,13.07,0,0,1-4.89,11.24A12.75,12.75,0,0,1,7.69,24.61a9.06,9.06,0,0,0,4.54-2.18,1,1,0,0,0,.15-1.09,1,1,0,0,0-.93-.57,4,4,0,0,1-3-1.39,3.63,3.63,0,0,0,1-.35A1,1,0,0,0,10,18a1,1,0,0,0-.76-.84,4.42,4.42,0,0,1-3-2.48c.24,0,.48.05.74.06a1,1,0,0,0,1-.62A1,1,0,0,0,7.67,13C6,11.48,5.59,9.85,5.83,8.7a13.88,13.88,0,0,0,7,4,1,1,0,1,0,.38-2A12.1,12.1,0,0,1,6.39,6.31a1,1,0,0,0-.75-.38,1,1,0,0,0-.78.33,5.34,5.34,0,0,0-.31,6l-.09,0a1,1,0,0,0-.52.81,5.84,5.84,0,0,0,1.95,4.47,1,1,0,0,0-.18,1,6.63,6.63,0,0,0,3.18,3.57A13.89,13.89,0,0,1,4,23a1,1,0,0,0-.5,1.86A16.84,16.84,0,0,0,12,27.35a15.16,15.16,0,0,0,9.6-3.57,15.12,15.12,0,0,0,5.69-12.42,4.62,4.62,0,0,0,1.62-2.25A1,1,0,0,0,28.77,8.11Z'/></svg>
</a>
</li>
<!-- Instagram -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M20.45,13.32a1,1,0,0,0-.57,1.3,4,4,0,1,1-2.31-2.3,1,1,0,1,0,.71-1.87,6,6,0,0,0-6.37,9.85,6,6,0,0,0,8.48,0,6,6,0,0,0,1.36-6.41A1,1,0,0,0,20.45,13.32Z'/><circle cx='23' cy='9' r='1'/><path d='M28,9a5,5,0,0,0-4.9-5h0A77.11,77.11,0,0,0,9,4,5,5,0,0,0,4,8.92,91.91,91.91,0,0,0,4,23a5,5,0,0,0,4.9,5h0c2.36.22,4.73.34,7.1.34s4.71-.11,7.05-.34A5,5,0,0,0,28,23.08,87.09,87.09,0,0,0,28,9ZM26,23a3,3,0,0,1-3,3h-.1A71.73,71.73,0,0,1,9,26a3,3,0,0,1-3-3.08A92.4,92.4,0,0,1,6,9,3,3,0,0,1,9.09,6q3.44-.31,6.9-.32T23,6a3,3,0,0,1,3,3.08A85.13,85.13,0,0,1,26,23Z'/></svg>
</a>
</li>
<!-- Linkedin -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M6.5,3A3.5,3.5,0,1,0,10,6.5,3.5,3.5,0,0,0,6.5,3Zm0,5A1.5,1.5,0,1,1,8,6.5,1.5,1.5,0,0,1,6.5,8Z'/><path d='M9,11H4a1,1,0,0,0,0,2H8V27H5V16a1,1,0,0,0-2,0V28a1,1,0,0,0,1,1H9a1,1,0,0,0,1-1V12A1,1,0,0,0,9,11Z'/><path d='M27.34,12.68A5.94,5.94,0,0,0,23,11H22a7.84,7.84,0,0,0-4,.89A1,1,0,0,0,17,11H12a1,1,0,0,0-1,1V28a1,1,0,0,0,1,1h5a1,1,0,0,0,1-1V19a2,2,0,0,1,4,0v9a1,1,0,0,0,1,1h5a1,1,0,0,0,1-1V17A5.9,5.9,0,0,0,27.34,12.68ZM27,27H24V19a4,4,0,0,0-8,0v8H13V13h3v1a1,1,0,0,0,.62.92,1,1,0,0,0,1.09-.21c.95-1,1.7-1.71,4.29-1.71h1a4,4,0,0,1,2.92,1.09A4,4,0,0,1,27,17Z'/></svg>
</a>
</li>
</ul>
</div>
<div class='authorInfo'>
<div class='author-name' expr:data-text='data:messages.postedBy'>
<span><data:post.author.name/></span>
</div>
<div class='author-desc'><b:eval expr='data:post.author.aboutMe snippet {length: 2000, links: false, linebreaks: false}'/></div>
</div>
</div>
</b:includable>
<b:includable id='post-artikelTOC'>
<input class='toc-menu hidden' id='offtoc-menu' type='checkbox'/>
</b:includable>
<b:includable id='post-artikelTerkait' var='post'>
<div class='related-posts'>
<div id='related-posts'>
<script>
var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>"<data:label.name/>"<b:if cond='data:label.isLast != "true"'>,</b:if></b:loop></b:if>];
var relatedPostConfig={
homePage: "<data:blog.homepageUrl/>",
widgetTitle: "<h3 class='title'><data:messages.youMayLikeThesePosts/></h3>",
numPosts: 6,
summaryLength: 20,
titleLength:"auto",
thumbnailSize: 275,
noImage: "data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=",
containerId: "related-posts",
newTabLink: false,
moreText: "Read more",
widgetStyle: 2,
callBack:function(){}
}
</script>
<script>/*<![CDATA[*/ var randomRelatedIndex,showRelatedPost;(function(n,m,k){var d={widgetTitle:"<h3 class='heading'>Related Posts</h3>",widgetStyle:1,homePage:"http://www.jagodesain.com",numPosts:7,summaryLength:320,titleLength:"auto",thumbnailSize:200,noImage:"data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=",containerId:"related-posts",newTabLink:false,moreText:"Read more",callBack:function(){}}; for(var f in relatedPostConfig){d[f]=(relatedPostConfig[f]=="undefined")?d[f]:relatedPostConfig[f]}var j=function(a){var b=m.createElement("script");b.defer="defer";b.rel="preload";b.src=a;k.appendChild(b)},o=function(b,a){return Math.floor(Math.random()*(a-b+1))+b},l=function(a){var p=a.length,c,b;if(p===0){return false}while(--p){c=Math.floor(Math.random()*(p+1));b=a[p];a[p]=a[c];a[c]=b}return a},e=(typeof labelArray=="object"&&labelArray.length>0)?"/-/"+l(labelArray)[0]:"",h=function(b){var c=b.feed.openSearch$totalResults.$t-d.numPosts,a=o(1,(c>0?c:1));j(d.homePage.replace(/\/$/,"")+"/feeds/posts/summary"+e+"?alt=json-in-script&orderby=updated&start-index="+a+"&max-results="+d.numPosts+"&callback=showRelatedPost")},g=function(z){var s=document.getElementById(d.containerId),x=l(z.feed.entry),A=d.widgetStyle,c=d.widgetTitle+'<ul class="related style-'+A+'">',b=d.newTabLink?' target="_blank"':"",y='<!-- <div class="clear"/> -->',v,t,w,r,u;if(!s){return}for(var q=0;q<d.numPosts;q++){if(q==x.length){break}t=x[q].title.$t;w=(d.titleLength!=="auto"&&d.titleLength<t.length)?t.substring(0,d.titleLength)+"…":t; r=("media$thumbnail"in x[q]&&d.thumbnailSize!==false)?x[q].media$thumbnail.url.replace(/.*?:\/\//g , "//").replace(/\/s[0-9]+(\-c)?/, "/s"+d.thumbnailSize):d.noImage;u=("summary"in x[q]&&d.summaryLength>0)?x[q].summary.$t.replace(/<br ?\/?>/g," ").replace(/<.*?>/g,"").replace(/[<>]/g,"").substring(0,d.summaryLength)+"…":"";for(var p=0,a=x[q].link.length;p<a;p++){v=(x[q].link[p].rel=="alternate")?x[q].link[p].href:"#"} if(A==2){c+='<li><div class="item-related"><div class="item-thumbnail"><a href="'+v+'"><img class="post-thumb lazy" alt="'+w+'" data-src="'+r+'" src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="></a></div><div class="item-title"><a href="'+v+'"><span>'+w+'</span></a></div></div></li>'} else{c+='<li><div class="item-related"><div class="item-thumbnail"><a href="'+v+'"><img class="post-thumb lazy" alt="'+w+'" data-src="'+r+'" src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="></a></div><div class="item-title"><a href="'+v+'"><span>'+w+'</span></a></div></div></li>'} }s.innerHTML=c+="</ul>";d.callBack()};randomRelatedIndex=h;showRelatedPost=g;j(d.homePage.replace(/\/$/,"")+"/feeds/posts/summary"+e+"?alt=json-in-script&orderby=updated&max-results=0&callback=randomRelatedIndex")})(window,document,document.getElementsByTagName("head")[0]); /*]]>*/</script>
</div>
</div>
</b:includable>
<b:includable id='post-iklanTerkait' var='post'>
<div class='related-posts' id='related-post'>
<div class='related-ads'/>
</div>
</b:includable>
<b:includable id='post-iklanAtas' var='post'>
<div id='iklanAtas'>
<div class='iklan-atas'/>
</div>
</b:includable>
<b:includable id='post-iklanBawah' var='post'>
<div id='iklanBawah'>
<div class='iklan-bawah'/>
</div>
</b:includable>
<b:includable id='post-commentDisqus'>
<div id='disqus_thread'>
<div class='show-comment'>
<a class='button outline' href='javascript:void(0)' id='disqusshow' onclick='load_Comments()'><span>Buka komentar</span></a>
</div>
</div>
<script>/*<![CDATA[*/ var disqus_shortname = "jagodesain"; !function(){var e=document.createElement("script");e.defer=!0,e.src="//"+disqus_shortname+".disqus.com/blogger_item.js",(document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]).appendChild(e)}(); function load_Comments(){var e=document.getElementById("disqusshow");e.style.display="none";var t="jagodesain";!function(){var e=document.createElement("script");e.defer=!0,e.src="https://"+t+".disqus.com/embed.js",(document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]).appendChild(e)}()};/*]]>*/</script>
</b:includable>
<b:includable id='post-commentFB'>
<script>/*<![CDATA[*/ $(window).bind("load resize", function(){var url = location.protocol+'//'+location.host+location.pathname; var containercm_width = $('#container-commentfb').width(); $('#container-commentfb').html('<div class="fb-comments" ' + 'data-href="'+url+'"' + ' width="' + containercm_width + '" data-num-posts="10"></div>'); FB.XFBML.parse( ); }); /*]]>*/</script>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div id='container-commentfb' style='width: 100%;'><fb:comments expr:href='data:post.url' num_posts='10' width='650'/></div>
</b:includable>
<b:includable id='postPagination-more'>
<script>/*<![CDATA[*/ defer(function() { !function(t,e){t.InfiniteScroll=function(n){function r(t,n){return n=n||e,n.querySelectorAll(t)}function o(t){return void 0!==t}function a(t){return"function"==typeof t}function i(t,e){t=t||{};for(var n in e)t[n]="object"==typeof e[n]?i(t[n],e[n]):e[n];return t}function s(t,e,n){return o(t)?o(e)?void(o(n)?g[t][n]=e:g[t].push(e)):g[t]:g}function d(t,e){o(e)?delete g[t][e]:g[t]=[]}function l(t,e){if(o(g[t]))for(var n in g[t])g[t][n](e)}function c(){return L.innerHTML=p.text.loading,v=!0,M?(y.classList.add(p.state.loading),l("loading",[p]),void u(M,function(t,n){y.className=x+" "+p.state.load,h=e.createElement("div"),h.innerHTML=t;var o=r("title",h),a=r(p.target.post,h),i=r(p.target.anchors+" "+p.target.anchor,h),s=r(p.target.post,H);if(o=o&&o[0]?o[0].innerHTML:"",a.length&&s.length){var d=s[s.length-1];e.title=o,d.insertAdjacentHTML("afterend",' '),h=e.createElement("div");for(var c=0,u=a.length;u>c;++c)h.appendChild(a[c]);d.insertAdjacentHTML("afterend",h.innerHTML),f(),M=i.length?i[0].href:!1,v=!1,q++,l("load",[p,t,n])}},function(t,e){y.classList.add(p.state.error),v=!1,f(1),l("error",[p,t,e])})):(y.classList.add(p.state.loaded),L.innerHTML=p.text.loaded,l("loaded",[p]))}function f(t){if(L.innerHTML="",T){h.innerHTML=p.text[t?"error":"load"];var e=h.firstChild;e.onclick=function(){return 2===p.type&&(T=!1),c(),!1},L.appendChild(e)}}var u="infinite-scroll-state-",p={target:{posts:".posts",post:".post",anchors:".anchors",anchor:".anchor"},text:{load:"%s",loading:"%s",loaded:"%s",error:"%s"},state:{load:u+"load",loading:u+"loading",loaded:u+"loaded",error:u+"error"}},g={load:[],loading:[],loaded:[],error:[]};p=i(p,n||{}),p.on=s,p.off=d;var h=null,u=function(e,n,r){if(t.XMLHttpRequest){var o=new XMLHttpRequest;o.onreadystatechange=function(){if(4===o.readyState){if(200!==o.status)return void(r&&a(r)&&r(o.responseText,o));n&&a(n)&&n(o.responseText,o)}},o.open("GET",e),o.send()}},T=1!==p.type,v=!1,H=r(p.target.posts)[0],L=r(p.target.anchors)[0],M=r(p.target.anchor,L),m=e.body,y=e.documentElement,x=y.className||"",E=H.offsetTop+H.offsetHeight,j=t.innerHeight,A=0,b=null,q=1;if(M.length){M=M[0].href,H.insertAdjacentHTML("afterbegin",' '),h=e.createElement("div"),f();var w=function(){E=H.offsetTop+H.offsetHeight,j=t.innerHeight,A=m.scrollTop||y.scrollTop,v||E>A+j||c()};w(),0!==p.type&&t.addEventListener("scroll",function(){T||(b&&t.clearTimeout(b),b=t.setTimeout(w,200))},!1)}return p}}(window,document);var infinite_scroll = new InfiniteScroll({ type: 0, target: {posts: '.blog-posts', post: '.hentry', anchors: '.blog-pager', anchor: '.older-link'}, text: {load: '<a class="js-load load-more" href="javascript:void(0)">Load more</a>', loading: '<a class="js-load wait"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="24px" viewBox="0 0 50 50" xml:space="preserve"><path d="M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"/></path></svg><span>Please wait...</span></a>', loaded: '<div class="js-load no-post">No more post</div>', error: '<a class="js-load error" href="javascript:void(0)">Sorry error!</a>'} }); });/*]]>*/</script>
</b:includable>
<b:includable id='postPage-analytics'>
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.defer=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ga('create', '<data:blog.analyticsAccountNumber/>', 'auto', 'blogger'); ga('blogger.send', 'pageview');</script>
</b:includable>
</b:defaultmarkup>
<!-- Default Featured Widget -->
<b:defaultmarkup type='FeaturedPost'>
<b:includable id='main' var='this'>
<b:if cond='data:title != ""'>
<div class='widget-title'>
<h2 class='title'><data:title/> </h2>
</div>
</b:if>
<b:include name='snippetedPosts'/>
</b:includable>
<b:includable id='blogThisShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='bylineByName' var='byline'/>
<b:includable id='bylineRegion' var='regionItems'/>
<b:includable id='commentsLink'>
<div class='comments-bubble'>
<span><data:post.numberOfComments/></span>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M10.0067501,0 C11.62449,0 13.2360653,0.399066203 14.6679897,1.15403251 C19.5432254,3.72637977 21.4181128,9.7854909 18.847518,14.6623794 C17.0941592,17.9879311 13.6420414,20 9.99530173,20 C9.28286212,20 8.56337738,19.9233581 7.8474152,19.7647888 C7.44408103,19.6749328 7.18957541,19.2749857 7.27852028,18.8715148 C7.36746515,18.4680439 7.76639611,18.2152138 8.1723722,18.302427 C11.8966084,19.1305114 15.7414927,17.3430824 17.523032,13.9637933 C19.7087862,9.81808572 18.1148236,4.66546271 13.9696404,2.47896754 C12.7525927,1.83676166 11.3823133,1.49759944 10.0058694,1.49759944 L10.0058694,1.49759944 C5.31028477,1.49759944 1.49710367,5.31119235 1.49710367,9.99867859 C1.49534238,11.3641369 1.82822517,12.7234286 2.45964569,13.9311985 L2.45964569,13.9311985 L2.65162571,14.3064793 C2.8867572,14.7469497 2.93871509,15.294014 2.78636398,15.7891028 C2.57589047,16.3440955 2.40064266,16.8841122 2.25621732,17.4214861 C2.8180671,17.2523455 3.50408744,17.0030392 3.99988905,16.8224464 L3.99988905,16.8224464 L4.20331742,16.7493283 C4.5881581,16.6057349 5.02055346,16.8092323 5.16145622,17.1986081 C5.30235899,17.587103 5.10069191,18.0170022 4.71232866,18.1570718 L4.71232866,18.1570718 L4.51154222,18.2301898 C3.77004141,18.4988768 2.7555415,18.867991 2.0704018,19.0212747 C2.01227941,19.0336079 1.9497538,19.0415364 1.89251206,19.0397745 C1.43281678,19.0397745 1.15277254,18.853896 0.998660135,18.6970885 C0.76176736,18.4565916 0.649045147,18.1191913 0.662254782,17.6945778 C0.664016066,17.6461261 0.670180562,17.5959124 0.681628912,17.5474607 C0.859518654,16.7898516 1.09112758,16.0340043 1.37117182,15.3019425 C1.39142659,15.2305863 1.3790976,15.101088 1.32185585,14.9927322 L1.32185585,14.9927322 L1.12899519,14.6183324 C0.390136315,13.2035414 -0.00174950235,11.6028719 5.87135273e-06,9.99779765 C5.87135273e-06,4.48486984 4.48424231,0 9.99530173,0 L9.99530173,0 Z M9.99565399,8.80949654 C10.6517325,8.80949654 11.1845211,9.34334669 11.1845211,9.99876668 C11.1845211,10.6541867 10.6517325,11.1880368 9.99565399,11.1880368 C9.33957549,11.1880368 8.8067869,10.6541867 8.8067869,9.99876668 C8.8067869,9.34334669 9.33957549,8.80949654 9.99565399,8.80949654 Z M14.3988654,8.80949654 C15.0549439,8.80949654 15.5877325,9.34334669 15.5877325,9.99876668 C15.5877325,10.6541867 15.0549439,11.1880368 14.3988654,11.1880368 C13.7427869,11.1880368 13.2099983,10.6541867 13.2099983,9.99876668 C13.2099983,9.34334669 13.7427869,8.80949654 14.3988654,8.80949654 Z M5.59235449,8.80984892 C6.248433,8.80984892 6.78122158,9.34281813 6.78122158,9.99911906 C6.78122158,10.654539 6.248433,11.1875083 5.59235449,11.1875083 C4.93627599,11.1875083 4.40348741,10.654539 4.40348741,9.99911906 C4.40348741,9.34281813 4.93627599,8.80984892 5.59235449,8.80984892 Z'/></g></svg>
</div>
</b:includable>
<b:includable id='commentsLinkIframe'><b:comment>Removed</b:comment></b:includable>
<b:includable id='emailPostIcon'><b:comment>Removed</b:comment></b:includable>
<b:includable id='facebookShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='footerBylines'><b:comment>Removed</b:comment></b:includable>
<b:includable id='googlePlusShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='headerByline'><b:comment>Removed</b:comment></b:includable>
<b:includable id='linkShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='otherSharingButton'><b:comment>Removed</b:comment></b:includable>
<b:includable id='platformShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postAuthor'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postCommentsLink'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postJumpLink' var='post'/>
<b:includable id='postLabels'>
<div class='item-label'>
<b:loop index='num' values='data:post.labels' var='label'>
<b:if cond='data:num == 0'>
<span><data:label.name/></span><b:if cond='data:label.isLast != "true"'/>
</b:if>
<b:if cond='data:num == 1'>
<span><data:label.name/></span><b:if cond='data:label.isLast != "true"'/>
</b:if>
</b:loop>
</div>
</b:includable>
<b:includable id='postLocation'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postReactions'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postShareButtons'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postTimestamp'>
<div class='item-timestamp'>
<time class='published' expr:datetime='data:post.date.iso8601'><data:post.date/></time>
</div>
</b:includable>
<b:includable id='sharingButton'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingButtonContent'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingButtons'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingButtonsMenu'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingPlatformIcon'><b:comment>Removed</b:comment></b:includable>
<b:includable id='snippetedPostByline'><b:comment>Removed</b:comment></b:includable>
<b:includable id='snippetedPostContent'>
<b:include cond='data:this.postDisplay.showFeaturedImage and data:post.featuredImage' name='snippetedPostThumbnail'/>
<div class='item-content'>
<b:include cond='data:this.postDisplay.showTitle' name='snippetedPostTitle'/>
<b:include cond='data:this.postDisplay.showSnippet' name='snippetedPostEntry'/>
<b:include name='snippetedPostHeader'/>
</div>
</b:includable>
<b:includable id='snippetedPostEntry'>
<b:comment>Dont show.</b:comment>
<div class='item-entry'>
<b:eval expr='snippet(data:post.body, {length: 90, links: true, linebreaks: false})'/>
</div>
</b:includable>
<b:includable id='snippetedPostHeader'>
<div class='item-header'>
<div class='item-info'>
<b:include cond='data:post.labels' name='postLabels'/>
<div class='item-published'>
<b:include name='postTimestamp'/>
</div>
</div>
<div class='item-comment'>
<b:include cond='data:post.allowComments and data:post.numberOfComments > 0' name='commentsLink'/>
</div>
</div>
</b:includable>
<b:includable id='snippetedPostThumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.url'>
<img class='post-thumb lazy' expr:alt='data:post.title' expr:data-src='resizeImage(data:post.featuredImage, 600, "18:9")' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
</a>
</div>
</b:includable>
<b:includable id='snippetedPostTitle'>
<b:if cond='data:post.title != ""'>
<h4 class='item-title'><a expr:href='data:post.url'><data:post.title/></a></h4>
</b:if>
</b:includable>
<b:includable id='snippetedPosts'>
<div class='item-featured' role='feed'>
<!-- Don't render the post that we're currently already looking at. -->
<b:loop values='data:posts filter (p => p.id != data:view.postId)' var='post'>
<article class='post'>
<b:class cond='!data:this.postDisplay.showFeaturedImage' name='no-thumbnail'/>
<b:include name='snippetedPostContent'/>
</article>
</b:loop>
</div>
</b:includable>
</b:defaultmarkup>
<!-- Default Popular Widget -->
<b:defaultmarkup type='PopularPosts'>
<b:includable id='main' var='this'>
<b:include name='widget-title'/>
<b:include name='snippetedPosts'/>
</b:includable>
<b:includable id='blogThisShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='bylineByName' var='byline'><b:comment>Removed</b:comment></b:includable>
<b:includable id='bylineRegion' var='regionItems'><b:comment>Removed</b:comment></b:includable>
<b:includable id='commentsLink'>
<div class='comments-bubble'>
<span><data:post.numberOfComments/></span>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M10.0067501,0 C11.62449,0 13.2360653,0.399066203 14.6679897,1.15403251 C19.5432254,3.72637977 21.4181128,9.7854909 18.847518,14.6623794 C17.0941592,17.9879311 13.6420414,20 9.99530173,20 C9.28286212,20 8.56337738,19.9233581 7.8474152,19.7647888 C7.44408103,19.6749328 7.18957541,19.2749857 7.27852028,18.8715148 C7.36746515,18.4680439 7.76639611,18.2152138 8.1723722,18.302427 C11.8966084,19.1305114 15.7414927,17.3430824 17.523032,13.9637933 C19.7087862,9.81808572 18.1148236,4.66546271 13.9696404,2.47896754 C12.7525927,1.83676166 11.3823133,1.49759944 10.0058694,1.49759944 L10.0058694,1.49759944 C5.31028477,1.49759944 1.49710367,5.31119235 1.49710367,9.99867859 C1.49534238,11.3641369 1.82822517,12.7234286 2.45964569,13.9311985 L2.45964569,13.9311985 L2.65162571,14.3064793 C2.8867572,14.7469497 2.93871509,15.294014 2.78636398,15.7891028 C2.57589047,16.3440955 2.40064266,16.8841122 2.25621732,17.4214861 C2.8180671,17.2523455 3.50408744,17.0030392 3.99988905,16.8224464 L3.99988905,16.8224464 L4.20331742,16.7493283 C4.5881581,16.6057349 5.02055346,16.8092323 5.16145622,17.1986081 C5.30235899,17.587103 5.10069191,18.0170022 4.71232866,18.1570718 L4.71232866,18.1570718 L4.51154222,18.2301898 C3.77004141,18.4988768 2.7555415,18.867991 2.0704018,19.0212747 C2.01227941,19.0336079 1.9497538,19.0415364 1.89251206,19.0397745 C1.43281678,19.0397745 1.15277254,18.853896 0.998660135,18.6970885 C0.76176736,18.4565916 0.649045147,18.1191913 0.662254782,17.6945778 C0.664016066,17.6461261 0.670180562,17.5959124 0.681628912,17.5474607 C0.859518654,16.7898516 1.09112758,16.0340043 1.37117182,15.3019425 C1.39142659,15.2305863 1.3790976,15.101088 1.32185585,14.9927322 L1.32185585,14.9927322 L1.12899519,14.6183324 C0.390136315,13.2035414 -0.00174950235,11.6028719 5.87135273e-06,9.99779765 C5.87135273e-06,4.48486984 4.48424231,0 9.99530173,0 L9.99530173,0 Z M9.99565399,8.80949654 C10.6517325,8.80949654 11.1845211,9.34334669 11.1845211,9.99876668 C11.1845211,10.6541867 10.6517325,11.1880368 9.99565399,11.1880368 C9.33957549,11.1880368 8.8067869,10.6541867 8.8067869,9.99876668 C8.8067869,9.34334669 9.33957549,8.80949654 9.99565399,8.80949654 Z M14.3988654,8.80949654 C15.0549439,8.80949654 15.5877325,9.34334669 15.5877325,9.99876668 C15.5877325,10.6541867 15.0549439,11.1880368 14.3988654,11.1880368 C13.7427869,11.1880368 13.2099983,10.6541867 13.2099983,9.99876668 C13.2099983,9.34334669 13.7427869,8.80949654 14.3988654,8.80949654 Z M5.59235449,8.80984892 C6.248433,8.80984892 6.78122158,9.34281813 6.78122158,9.99911906 C6.78122158,10.654539 6.248433,11.1875083 5.59235449,11.1875083 C4.93627599,11.1875083 4.40348741,10.654539 4.40348741,9.99911906 C4.40348741,9.34281813 4.93627599,8.80984892 5.59235449,8.80984892 Z'/></g></svg>
</div>
</b:includable>
<b:includable id='commentsLinkIframe'><b:comment>Removed</b:comment></b:includable>
<b:includable id='emailPostIcon'><b:comment>Removed</b:comment></b:includable>
<b:includable id='facebookShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='footerBylines'><b:comment>Removed</b:comment></b:includable>
<b:includable id='googlePlusShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='headerByline'><b:comment>Removed</b:comment></b:includable>
<b:includable id='linkShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='otherSharingButton'><b:comment>Removed</b:comment></b:includable>
<b:includable id='platformShare'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postAuthor'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postCommentsLink'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postJumpLink'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postLabels'>
<div class='item-label'>
<b:loop index='num' values='data:post.labels' var='label'>
<b:if cond='data:num == 0'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'/>
</b:if>
<b:if cond='data:num == 1'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'/>
</b:if>
</b:loop>
</div>
</b:includable>
<b:includable id='postLocation'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postReactions'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postShareButtons'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postTimestamp'>
<div class='item-timestamp'>
<time class='published' expr:datetime='data:post.date.iso8601'><data:post.date/></time>
</div>
</b:includable>
<b:includable id='sharingButton'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingButtonContent'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingButtons'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingButtonsMenu'><b:comment>Removed</b:comment></b:includable>
<b:includable id='sharingPlatformIcon'><b:comment>Removed</b:comment></b:includable>
<b:includable id='snippetedPostByline'><b:comment>Removed</b:comment></b:includable>
<b:includable id='snippetedPostContent'>
<b:include cond='data:this.postDisplay.showFeaturedImage and data:post.featuredImage' name='snippetedPostThumbnail'/>
<div class='item-content'>
<b:include cond='data:this.postDisplay.showTitle' name='snippetedPostTitle'/>
<b:include cond='data:this.postDisplay.showSnippet' name='snippetedPostEntry'/>
<b:include name='snippetedPostHeader'/>
</div>
</b:includable>
<b:includable id='snippetedPostEntry'>
<b:comment>Dont show.</b:comment>
<!--<div class='item-entry'>
<b:eval expr='snippet(data:post.body, {length: 90, links: true, linebreaks: false})'/>
</div>-->
</b:includable>
<b:includable id='snippetedPostHeader'>
<div class='item-header'>
<div class='item-info'>
<b:include cond='data:post.labels' name='postLabels'/>
<div class='item-published'>
<b:include name='postTimestamp'/>
</div>
</div>
<div class='item-comment'>
<b:include cond='data:post.allowComments' name='commentsLink'/>
<b:include name='postJumpLink'/>
</div>
</div>
</b:includable>
<b:includable id='snippetedPostThumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.url'>
<img class='post-thumb lazy' expr:alt='data:post.title' expr:data-src='resizeImage(data:post.featuredImage, 400, "26:9")' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
</a>
</div>
</b:includable>
<b:includable id='snippetedPostTitle'>
<b:if cond='data:post.title != ""'>
<h4 class='item-title'><a expr:href='data:post.url'><data:post.title/></a></h4>
</b:if>
</b:includable>
<b:includable id='snippetedPosts'>
<div class='item-popular' role='feed'>
<!-- Don't render the post that we're currently already looking at. -->
<b:loop values='data:posts filter (p => p.id != data:view.postId)' var='post'>
<article class='post'>
<b:class cond='!data:this.postDisplay.showFeaturedImage' name='no-thumbnail'/>
<b:include name='snippetedPostContent'/>
</article>
</b:loop>
</div>
</b:includable>
</b:defaultmarkup>
<!-- Default Label Widget -->
<b:defaultmarkup type='Label'>
<b:includable id='main' var='this'>
<b:include name='widget-title'/>
<b:include name='content'/>
</b:includable>
<b:includable id='cloud'>
<b:loop index='tags' values='data:labels' var='label'>
<b:if cond='data:tags <= 3'>
<span class='label-size'>
<b:class expr:name='"label-size-" + data:label.cssSize'/>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
</a>
</span>
</b:if>
<b:if cond='data:tags == 4'>
<div class='label-show'>
<input class='label-input hidden' id='offall-label' type='checkbox'/>
<div class='label-all'>
<b:loop index='alltags' values='data:labels' var='label'>
<b:if cond='data:alltags >= 4'>
<span class='label-size'>
<b:class expr:name='"label-size-" + data:label.cssSize'/>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
</a>
</span>
</b:if>
</b:loop>
</div>
<label class='label-more' expr:data-hide='data:messages.showLess' expr:data-show='data:messages.showMore' for='offall-label'>
<span><b:eval expr='"+" + (data:labels.length - 4) + " more"'/></span>
<svg viewBox='0 0 512 512'><path d='M256 294.1L383 167c9.4-9.4 24.6-9.4 33.9 0s9.3 24.6 0 34L273 345c-9.1 9.1-23.7 9.3-33.1.7L95 201.1c-4.7-4.7-7-10.9-7-17s2.3-12.3 7-17c9.4-9.4 24.6-9.4 33.9 0l127.1 127z'/></svg>
</label>
</div>
</b:if>
</b:loop>
</b:includable>
<b:includable id='content'>
<div class='widget-content'>
<b:class expr:name='data:this.display + "-label"'/>
<b:include cond='data:this.display == "list"' name='list'/>
<b:include cond='data:this.display == "cloud"' name='cloud'/>
</div>
</b:includable>
<b:includable id='list'>
<ul>
<b:loop index='tags' values='data:labels' var='label'>
<b:if cond='data:tags <= 3'>
<li>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
<svg class='label-icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(4.000000, 2.000000)'><path d='M11.5258621,0 L4.62931034,0 C1.78448276,0 0,1.9858782 0,5.17210944 L0,18.3230362 C0,19.2491977 0.733326703,20 1.63793103,20 C1.91180194,20 2.18135035,19.9300723 2.42241379,19.7969991 L8.03448276,16.6813769 L14.5689655,19.8146514 C14.7461483,19.8908228 14.9456376,19.8917645 15.1234989,19.8172691 C15.3013603,19.7427737 15.4430062,19.598951 15.5172414,19.4174757 C15.6267768,19.0830842 15.4940188,18.7157283 15.1982759,18.5348632 L8.70689655,15.4280671 C8.28279792,15.1893907 7.76892621,15.1893907 7.34482759,15.4280671 L1.72413793,18.5348632 C1.65968122,18.5709713 1.58169809,18.5709713 1.51724138,18.5348632 C1.45595472,18.494491 1.41993354,18.4240845 1.42241379,18.3495146 L1.42241379,5.17210944 C1.43103448,2.81553398 2.5862069,1.47396293 4.65517241,1.47396293 L11.5517241,1.47396293 C14.2068966,1.47396293 14.5948276,3.68049426 14.5948276,5.00441306 L14.5948276,5.60458959 L7.12931034,5.60458959 C6.93950091,5.61148655 6.76015756,5.69536443 6.63079621,5.83774183 C6.50143487,5.98011924 6.43267077,6.16931284 6.43965517,6.36363636 C6.44874481,6.74967865 6.75225353,7.06042014 7.12931034,7.06972639 L14.5689655,7.06972639 L14.5689655,14.7925861 C14.5689655,15.1971724 14.8893135,15.5251545 15.2844828,15.5251545 C15.6763098,15.5251836 15.9952792,15.2025475 16,14.8014122 L16,14.8014122 L16,5.00441306 C16,1.9152692 14.2931034,0 11.5258621,0 Z'/></g></svg>
</a>
</li>
</b:if>
<b:if cond='data:tags == 4'>
<li class='label-show'>
<input class='label-input hidden' id='offall-label' type='checkbox'/>
<div class='label-all'>
<ul>
<b:loop index='alltags' values='data:labels' var='label'>
<b:if cond='data:alltags >= 4'>
<li>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
<svg class='label-icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(4.000000, 2.000000)'><path d='M11.5258621,0 L4.62931034,0 C1.78448276,0 0,1.9858782 0,5.17210944 L0,18.3230362 C0,19.2491977 0.733326703,20 1.63793103,20 C1.91180194,20 2.18135035,19.9300723 2.42241379,19.7969991 L8.03448276,16.6813769 L14.5689655,19.8146514 C14.7461483,19.8908228 14.9456376,19.8917645 15.1234989,19.8172691 C15.3013603,19.7427737 15.4430062,19.598951 15.5172414,19.4174757 C15.6267768,19.0830842 15.4940188,18.7157283 15.1982759,18.5348632 L8.70689655,15.4280671 C8.28279792,15.1893907 7.76892621,15.1893907 7.34482759,15.4280671 L1.72413793,18.5348632 C1.65968122,18.5709713 1.58169809,18.5709713 1.51724138,18.5348632 C1.45595472,18.494491 1.41993354,18.4240845 1.42241379,18.3495146 L1.42241379,5.17210944 C1.43103448,2.81553398 2.5862069,1.47396293 4.65517241,1.47396293 L11.5517241,1.47396293 C14.2068966,1.47396293 14.5948276,3.68049426 14.5948276,5.00441306 L14.5948276,5.60458959 L7.12931034,5.60458959 C6.93950091,5.61148655 6.76015756,5.69536443 6.63079621,5.83774183 C6.50143487,5.98011924 6.43267077,6.16931284 6.43965517,6.36363636 C6.44874481,6.74967865 6.75225353,7.06042014 7.12931034,7.06972639 L14.5689655,7.06972639 L14.5689655,14.7925861 C14.5689655,15.1971724 14.8893135,15.5251545 15.2844828,15.5251545 C15.6763098,15.5251836 15.9952792,15.2025475 16,14.8014122 L16,14.8014122 L16,5.00441306 C16,1.9152692 14.2931034,0 11.5258621,0 Z'/></g></svg>
</a>
</li>
</b:if>
</b:loop>
</ul>
</div>
<label class='label-more' expr:data-hide='data:messages.showLess' expr:data-show='data:messages.showMore' for='offall-label'>
<span><b:eval expr='"+" + (data:labels.length - 4) + " more"'/></span>
<svg viewBox='0 0 512 512'><path d='M256 294.1L383 167c9.4-9.4 24.6-9.4 33.9 0s9.3 24.6 0 34L273 345c-9.1 9.1-23.7 9.3-33.1.7L95 201.1c-4.7-4.7-7-10.9-7-17s2.3-12.3 7-17c9.4-9.4 24.6-9.4 33.9 0l127.1 127z'/></svg>
</label>
</li>
</b:if>
</b:loop>
</ul>
</b:includable>
</b:defaultmarkup>
<!-- Default profile Widget -->
<b:defaultmarkup type='Profile'>
<b:includable id='main' var='this'>
<b:include name='widget-title'/>
<b:include name='content'/>
</b:includable>
<b:includable id='authorProfileImage'>
<img class='profile-img post-thumb lazy' expr:alt='data:display-name' expr:data-src='data:authorPhoto.image' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
</b:includable>
<b:includable id='content'>
<b:if cond='data:team'>
<div class='widget-content team'>
<b:include name='teamProfile'/>
</div>
<b:else/>
<div class='widget-content individual'>
<b:include name='userProfile'/>
</div>
</b:if>
</b:includable>
<b:includable id='defaultProfileImage'>
<div class='default-avatar post-thumb'>
<svg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'><path d='M16,17a8,8,0,1,1,8-8A8,8,0,0,1,16,17ZM16,3a6,6,0,1,0,6,6A6,6,0,0,0,16,3Z'/><path d='M23,31H9a5,5,0,0,1-5-5V22a1,1,0,0,1,.49-.86l5-3a1,1,0,0,1,1,1.72L6,22.57V26a3,3,0,0,0,3,3H23a3,3,0,0,0,3-3V22.57l-4.51-2.71a1,1,0,1,1,1-1.72l5,3A1,1,0,0,1,28,22v4A5,5,0,0,1,23,31Z'/></svg>
</div>
</b:includable>
<b:includable id='profileImage'>
<b:if cond='data:authorPhoto.image'>
<b:include name='authorProfileImage'/>
<b:else/>
<b:include name='defaultProfileImage'/>
</b:if>
</b:includable>
<b:includable id='teamProfile'>
<ul>
<b:loop index='team' values='data:authors' var='author'>
<b:if cond='data:team <= 0'>
<li>
<div class='team-member'>
<b:include data='author' name='teamProfileLink'/>
</div>
</li>
</b:if>
<b:if cond='data:team >= 1'>
<li>
<div class='more-member'>
<label class='profile-more' for='offall-member'>
<svg class='post-thumb' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M368.5 240H272v-96.5c0-8.8-7.2-16-16-16s-16 7.2-16 16V240h-96.5c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7H240v96.5c0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7 8.8 0 16-7.2 16-16V272h96.5c8.8 0 16-7.2 16-16s-7.2-16-16-16z'/></svg>
</label>
<span><b:eval expr='"+" + (data:authors.length - 1) + " more"'/></span>
</div>
<!-- Show all member/contributor in this blog -->
<input class='all-team hidden' id='offall-member' type='checkbox'/>
<div class='all-member'>
<div class='all-memberBox'>
<ul>
<b:loop values='data:authors' var='author'>
<li>
<div class='team-member'>
<b:include data='author' name='teamProfileMember'/>
</div>
</li>
</b:loop>
</ul>
<b:comment>Close authors pop-up</b:comment>
<div class='member-close'>
<label for='offall-member'>
<svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
</label>
</div>
</div>
<label class='full-close close-member' for='offall-member'/>
</div>
</li>
</b:if>
</b:loop>
</ul>
</b:includable>
<b:includable id='teamProfileLink'>
<a class='profile-link g-profile' expr:href='data:userUrl' expr:title='data:display-name' rel='nofollow noreferrer' target='_blank'>
<div class='profile-image'><b:include name='profileImage'/></div>
<div class='profile-name'><data:display-name/></div>
</a>
</b:includable>
<b:includable id='teamProfileMember'>
<div class='profile-link g-profile'>
<div class='profile-image'><b:include name='profileImage'/></div>
<div class='profile-name'><data:display-name/></div>
</div>
</b:includable>
<b:includable id='userGoogleProfile'><b:comment>Removed</b:comment></b:includable>
<b:includable id='userLocation'><b:comment>Removed</b:comment></b:includable>
<b:includable id='userProfile'>
<b:include name='userProfileImage'/>
<b:include name='userProfileInfo'/>
</b:includable>
<b:includable id='userProfileData'>
<b:include name='userProfileLink'/>
</b:includable>
<b:includable id='userProfileImage'>
<div class='profile-image'>
<div class='profile-g'>
<b:include name='profileImage'/>
</div>
<b:include name='userProfileMedia'/>
</div>
</b:includable>
<b:includable id='userProfileInfo'>
<div class='profile-info'>
<b:include name='userProfileData'/>
<b:include cond='data:aboutme != ""' name='userProfileText'/>
</div>
</b:includable>
<b:includable id='userProfileMedia'>
<!-- Link social media -->
<ul class='profile-media'>
<!-- Facebook -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5h8a1,1,0,0,0,1-1V20a1,1,0,0,0-1-1H15V17h1a1,1,0,0,0,1-1V12.5A2.5,2.5,0,0,1,19.5,10H22v2H21a2,2,0,0,0-2,2v2a1,1,0,0,0,1,1h1.72l-.5,2H20a1,1,0,0,0-1,1v4a1,1,0,0,0,2,0V21h1a1,1,0,0,0,1-.76l1-4a1,1,0,0,0-.18-.86A1,1,0,0,0,23,15H21V14h2a1,1,0,0,0,1-1V9a1,1,0,0,0-1-1H19.5A4.51,4.51,0,0,0,15,12.5V15H14a1,1,0,0,0-1,1v4a1,1,0,0,0,1,1h1v6H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3V24a3,3,0,0,1-3,3H20a1,1,0,0,0,0,2h4a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Z'/></svg>
</a>
</li>
<!-- Twitter -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M28.77,8.11a.87.87,0,0,0-.23-.2A4.69,4.69,0,0,0,29,6.54a1,1,0,0,0-.44-1,1,1,0,0,0-1.1,0,6.42,6.42,0,0,1-2.28.92,6.21,6.21,0,0,0-7.08-1A6.07,6.07,0,0,0,15,12.2a1,1,0,0,0,2-.4A4.08,4.08,0,0,1,19,7.28a4.24,4.24,0,0,1,5.12,1,1,1,0,0,0,.88.28l.25,0a1,1,0,0,0,.34,1.62,1,1,0,0,0-.36.88,13.07,13.07,0,0,1-4.89,11.24A12.75,12.75,0,0,1,7.69,24.61a9.06,9.06,0,0,0,4.54-2.18,1,1,0,0,0,.15-1.09,1,1,0,0,0-.93-.57,4,4,0,0,1-3-1.39,3.63,3.63,0,0,0,1-.35A1,1,0,0,0,10,18a1,1,0,0,0-.76-.84,4.42,4.42,0,0,1-3-2.48c.24,0,.48.05.74.06a1,1,0,0,0,1-.62A1,1,0,0,0,7.67,13C6,11.48,5.59,9.85,5.83,8.7a13.88,13.88,0,0,0,7,4,1,1,0,1,0,.38-2A12.1,12.1,0,0,1,6.39,6.31a1,1,0,0,0-.75-.38,1,1,0,0,0-.78.33,5.34,5.34,0,0,0-.31,6l-.09,0a1,1,0,0,0-.52.81,5.84,5.84,0,0,0,1.95,4.47,1,1,0,0,0-.18,1,6.63,6.63,0,0,0,3.18,3.57A13.89,13.89,0,0,1,4,23a1,1,0,0,0-.5,1.86A16.84,16.84,0,0,0,12,27.35a15.16,15.16,0,0,0,9.6-3.57,15.12,15.12,0,0,0,5.69-12.42,4.62,4.62,0,0,0,1.62-2.25A1,1,0,0,0,28.77,8.11Z'/></svg>
</a>
</li>
<!-- Instagram -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M20.45,13.32a1,1,0,0,0-.57,1.3,4,4,0,1,1-2.31-2.3,1,1,0,1,0,.71-1.87,6,6,0,0,0-6.37,9.85,6,6,0,0,0,8.48,0,6,6,0,0,0,1.36-6.41A1,1,0,0,0,20.45,13.32Z'/><circle cx='23' cy='9' r='1'/><path d='M28,9a5,5,0,0,0-4.9-5h0A77.11,77.11,0,0,0,9,4,5,5,0,0,0,4,8.92,91.91,91.91,0,0,0,4,23a5,5,0,0,0,4.9,5h0c2.36.22,4.73.34,7.1.34s4.71-.11,7.05-.34A5,5,0,0,0,28,23.08,87.09,87.09,0,0,0,28,9ZM26,23a3,3,0,0,1-3,3h-.1A71.73,71.73,0,0,1,9,26a3,3,0,0,1-3-3.08A92.4,92.4,0,0,1,6,9,3,3,0,0,1,9.09,6q3.44-.31,6.9-.32T23,6a3,3,0,0,1,3,3.08A85.13,85.13,0,0,1,26,23Z'/></svg>
</a>
</li>
<!-- Linkedin -->
<li>
<a aria-label='Social Media' href='#' rel='noreferrer noopener' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M6.5,3A3.5,3.5,0,1,0,10,6.5,3.5,3.5,0,0,0,6.5,3Zm0,5A1.5,1.5,0,1,1,8,6.5,1.5,1.5,0,0,1,6.5,8Z'/><path d='M9,11H4a1,1,0,0,0,0,2H8V27H5V16a1,1,0,0,0-2,0V28a1,1,0,0,0,1,1H9a1,1,0,0,0,1-1V12A1,1,0,0,0,9,11Z'/><path d='M27.34,12.68A5.94,5.94,0,0,0,23,11H22a7.84,7.84,0,0,0-4,.89A1,1,0,0,0,17,11H12a1,1,0,0,0-1,1V28a1,1,0,0,0,1,1h5a1,1,0,0,0,1-1V19a2,2,0,0,1,4,0v9a1,1,0,0,0,1,1h5a1,1,0,0,0,1-1V17A5.9,5.9,0,0,0,27.34,12.68ZM27,27H24V19a4,4,0,0,0-8,0v8H13V13h3v1a1,1,0,0,0,.62.92,1,1,0,0,0,1.09-.21c.95-1,1.7-1.71,4.29-1.71h1a4,4,0,0,1,2.92,1.09A4,4,0,0,1,27,17Z'/></svg>
</a>
</li>
</ul>
</b:includable>
<b:includable id='userProfileLink'>
<a class='profile-link' expr:href='data:userUrl' rel='author nofollow noreferrer' target='_blank'><data:displayname/></a>
</b:includable>
<b:includable id='userProfileText'>
<div class='profile-text'><b:eval expr='data:aboutme snippet {length: 60, links: false, linebreaks: false}'/></div>
</b:includable>
<b:includable id='viewProfileLink'><b:comment>Removed</b:comment></b:includable>
</b:defaultmarkup>
<!-- Default FollowByEmail Widget -->
<b:defaultmarkup type='FollowByEmail'>
<b:includable id='main'>
<b:include name='widget-title'/>
<b:include name='content'/>
</b:includable>
<b:includable id='content'>
<div class='follow-by-email-inner'>
<!-- Replace <data:messages.getEmailNotifications/> untuk mengubah kalimat pada widget -->
<label class='follow-by-email-text' for='email-input'><data:messages.getEmailNotifications/></label>
<form expr:action='"https://feedburner.google.com/fb/a/mailverify?uri=" + data:feedPath' method='get' target='_blank'>
<input autocomplete='on' class='follow-by-email-address' id='email-input' name='email' placeholder='e.g. youremail@gmail.com' type='email'/>
<input class='follow-by-email-submit' expr:value='data:messages.subscribe' id='email-submit' type='submit'/>
<label class='follow-by-email-label' for='email-submit'>
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 3.000000)'><path d='M14.1972579,8.17124146e-14 C17.3979916,0.00978563072 19.990286,2.62120148 20,5.84554455 L20,5.84554455 L20,7.30693069 L19.99354,7.4036631 C19.9466817,7.75161611 19.6506049,8.01980198 19.2923485,8.01980198 L19.2923485,8.01980198 L19.2835029,8.0019802 L19.1721336,7.99309967 C19.0257158,7.96959451 18.889286,7.90013647 18.7831177,7.79318503 C18.6504073,7.65949573 18.5758514,7.47817413 18.5758514,7.28910891 L18.5758514,7.28910891 L18.5758514,5.84554455 C18.5518871,3.41954659 16.6054921,1.45879454 14.1972579,1.43465347 L14.1972579,1.43465347 L5.80274215,1.43465347 C3.39450789,1.45879454 1.44811291,3.41954659 1.42414861,5.84554455 L1.42414861,5.84554455 L1.42414861,12.1544554 C1.44811291,14.5804534 3.39450789,16.5412055 5.80274215,16.5653465 L5.80274215,16.5653465 L14.1972579,16.5653465 C16.6054921,16.5412055 18.5518871,14.5804534 18.5758514,12.1544554 C18.6163388,11.7890822 18.922975,11.5127474 19.2879257,11.5127474 C19.6528764,11.5127474 19.9595126,11.7890822 20,12.1544554 C19.990286,15.3787985 17.3979916,17.9902144 14.1972579,18 L14.1972579,18 L5.80274215,18 C2.599996,17.995093 0.00487110525,15.3808258 -1.42108547e-14,12.1544554 L-1.42108547e-14,12.1544554 L-1.42108547e-14,5.84554455 C-1.42108547e-14,2.61713944 2.59797615,8.17124146e-14 5.80274215,8.17124146e-14 L5.80274215,8.17124146e-14 Z M4.29443312,5.38692655 C4.48070099,5.36682207 4.6671823,5.42289927 4.81203008,5.54257426 L4.81203008,5.54257426 L8.96948253,8.85742574 C9.48880627,9.2678976 10.2192875,9.2678976 10.7386112,8.85742574 L10.7386112,8.85742574 L14.8518355,5.54257426 L14.8606811,5.54257426 L14.9473987,5.48291804 C15.2462388,5.30808809 15.6344967,5.37260085 15.8602388,5.64950495 C15.9785304,5.79800076 16.0329385,5.98799536 16.0113373,6.17714498 C15.9897361,6.36629461 15.8939207,6.53887938 15.7452455,6.65643564 L15.7452455,6.65643564 L11.6320212,9.98019802 C10.5861526,10.8280382 9.09540423,10.8280382 8.0495356,9.98019802 L8.0495356,9.98019802 L3.92746572,6.65643564 L3.8513546,6.58355583 C3.61891283,6.32594359 3.59998262,5.92999594 3.821318,5.64950495 C3.93770999,5.50163353 4.10816526,5.40703103 4.29443312,5.38692655 Z'/></g></svg>
</label>
<input expr:value='data:feedPath' name='uri' type='hidden'/>
<input name='loc' type='hidden' value='en_US'/>
</form>
</div>
</b:includable>
</b:defaultmarkup>
</b:defaultmarkups>
<script>/*<![CDATA[*/
/* shinsenter/defer.js */
!function(e,o,t,n,i,d){function f(e,t){d?n(e,t||32):i.push(e,t)}function c(e,t,n,i){return t&&o.getElementById(t)||(i=o.createElement(e||"SCRIPT"),t&&(i.id=t),n&&(i.onload=n),o.head.appendChild(i)),i||{}}d=/p/.test(o.readyState),e.addEventListener("on"+t in e?t:"load",function(){for(d=1;i[0];)f(i.shift(),i.shift())}),f._=c,e.defer=f,e.deferscript=function(e,t,n,i){f(function(){c("",t,i).src=e},n)}}(this,document,"pageshow",setTimeout,[]); /*]]>*/</script>
<b:if cond='data:view.isSingleItem'>
<script>/*<![CDATA[*/ function medianTOC(){var a=1,b=0,c=""; document.getElementById("post-body").innerHTML=document.getElementById("post-body").innerHTML.replace(/<h([\d]).*?>(\n.*?|.*?)<\/h([\d]).*?>/gi,function(d,e,f,g){return e!=g?d:(e>a?c+=new Array(e-a+1).join("<ol class='point"+a+"'>"):e<a&&(c+=new Array(a-e+1).join("</ol></li>")),b+=1,c+='<li><a href="#'+f.replace(/[^a-z0-9]/gi," ").trim().replace(/\s/g,"")+'" title="'+f+'">'+f.replace(/[^a-z0-9]/gi," ")+"</a>",a=parseInt(e),"<h"+e+" id='"+f.replace(/[^a-z0-9]/gi," ").trim().replace(/\s/g,"")+"'>"+f+"</h"+g+">")}),a&&(c+=new Array(a+1).join("</ol>")),document.getElementById("post-tocContent").innerHTML+=c} /*]]>*/</script>
</b:if>
<!--<head/>--></head>
<body id='mainContent'>
<script>/*<![CDATA[*/ (localStorage.getItem('mode')) === 'darkmode' ? document.querySelector('#mainContent').classList.add('drK') : document.querySelector('#mainContent').classList.remove('drK') /*]]>*/</script>
<input class='nav-menu hidden' id='offnav-menu' type='checkbox'/>
<div class='mainWrapper'>
<div class='mainIner' id='mainIner'>
<b:class cond='data:view.isMultipleItems' name='multipleItem'/>
<b:class cond='data:view.isHomepage' name='home'/>
<b:class cond='data:view.isSingleItem' name='singleItem'/>
<b:class cond='data:view.isPage' name='page'/>
<b:class cond='data:view.isPost' name='post'/>
<b:class cond='data:view.isError' name='error-404'/>
<div class='blogTopc absolute z-max' id='blogTp'>
<div class='blogIn'>
<input class='topI hidden' id='offTop' type='checkbox'/>
<div class='topM'>
<div class='tpBr bg-white text-base dark:bg-neutral-900 text-neutral-900 dark:text-neutral-200'>
<div class='tpBrs'>
<div class='tpC'>
<svg class='rad' viewbox='0 0 160 160'><path d='M0-10,150,0l10,150S137.643,80.734,100.143,43.234,0-10,0-10Z' transform='translate(0 10)'/></svg>
<label class='bg-white dark:bg-neutral-700' data-text='Close' for='offTop'>
<!--[ Forward icon ]-->
<svg class='line' fill='none' viewbox='0 0 24 24'><g transform='translate(12.000000, 12.000000) rotate(-90.000000) translate(-12.000000, -12.000000) translate(5.000000, 8.500000)'><path d='M14,0 C14,0 9.856,7 7,7 C4.145,7 0,0 0,0'/></g></svg>
</label>
<svg class='rad in' viewbox='0 0 160 160'><path d='M0-10,150,0l10,150S137.643,80.734,100.143,43.234,0-10,0-10Z' transform='translate(0 10)'/></svg>
</div>
<b:section class='Reading Process bar' id='Blog Topic Menu' maxwidget='2' showaddelement='flase'>
<b:widget id='HTML8' locked='true' title='Topic Menu' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<!--[ you can only edit this widget from HTML theme ]-->]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='widget-content'>
<ul class='tpMn' id='tpcmn' itemscope='itemscope' itemtype='https://schema.org/SiteNavigationElement'>
<li class='drp'>
<details open=''>
<summary class='a'>
<span class='n'>Topics</span>
<svg class='line d' viewbox='0 0 24 24'><g transform='translate(5.000000, 8.500000)'><path d='M14,0 C14,0 9.856,7 7,7 C4.145,7 0,0 0,0'/></g></svg>
</summary>
<ul id='tpcmns'>
<li itemprop='name'><a href='#' itemprop='url'>Topics 01</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 02</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 03</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 04</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 06</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 07</a></li>
</ul>
</details>
</li>
<li class='drp br'>
<details>
<summary class='a'>
<span class='n'>News</span>
<svg class='line d' viewbox='0 0 24 24'><g transform='translate(5.000000, 8.500000)'><path d='M14,0 C14,0 9.856,7 7,7 C4.145,7 0,0 0,0'/></g></svg>
</summary>
<ul id='tpcmns'>
<li itemprop='name'><a href='#' itemprop='url'>Topics 7</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 8</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 9</a></li>
<li itemprop='name'><a href='#' itemprop='url'>Topics 10</a></li>
</ul>
</details>
</li>
<li>
<a class='a' href='#' itemprop='url'>
<span class='n' itemprop='name'>Sponsored</span>
</a>
</li>
<li>
<a class='a' href='#' itemprop='url'>
<span class='n extL' itemprop='name'>Donate</span>
</a>
</li>
<li>
<a class='a' href='#' itemprop='url'>
<span class='n' itemprop='name'>Credits</span>
</a>
</li>
</ul>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
</div>
<label class='fCls' for='offTop'/>
</div>
</div>
</div>
<!--[ Blog Topics End ]-->
<b:if cond='!data:view.isError'>
<!-- Header -->
<header class='header' id='header'>
<div class='navicon left'>
<label aria-label='Menu' class='nav' for='offnav-menu'><i/><i/><i/></label>
<b:if cond='data:view.isSingleItem'>
<a aria-label='Menu' class='nav home' expr:href='data:blog.homepageUrl' role='button'><i/><i/><i/></a>
</b:if>
</div>
<!-- Header Widget -->
<b:section id='header-widget' maxwidgets='1' showaddelement='false'>
<b:widget id='Header00' locked='true' title='Themes (Header)' type='Header' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='displayUrl'/>
<b:widget-setting name='displayHeight'>0</b:widget-setting>
<b:widget-setting name='sectionWidth'>-1</b:widget-setting>
<b:widget-setting name='useImage'>false</b:widget-setting>
<b:widget-setting name='shrinkToFit'>false</b:widget-setting>
<b:widget-setting name='imagePlacement'>BEHIND</b:widget-setting>
<b:widget-setting name='displayWidth'>0</b:widget-setting>
</b:widget-settings>
<b:includable id='main' var='this'>
<b:include cond='data:imagePlacement in {"REPLACE", "BEFORE_DESCRIPTION"}' name='image'/>
<b:include cond='data:imagePlacement not in {"REPLACE", "BEFORE_DESCRIPTION"}' name='title'/>
<b:include cond='data:imagePlacement != "REPLACE"' name='description'/>
<b:include cond='data:imagePlacement == "BEHIND"' name='behindImageStyle'/>
</b:includable>
<b:includable id='behindImageStyle'>
<b:if cond='data:sourceUrl'>
<b:include cond='data:this.image' data='{image: data:this.image, selector: "#header .widget"}' name='responsiveImageStyle'/>
</b:if>
</b:includable>
<b:includable id='description'>
<div class='description hidden'><data:this.description/></div>
</b:includable>
<b:includable id='image'>
<div class='header-inner'>
<a expr:href='data:blog.homepageUrl' expr:title='data:title'><img expr:alt='data:title' expr:src='resizeImage(data:sourceUrl, 300)' expr:title='data:title'/></a>
<b:include cond='data:this.imagePlacement == "REPLACE"' name='title'/>
</div>
</b:includable>
<b:includable id='title'>
<div class='header-inner'>
<b:class cond='data:this.imagePlacement == "REPLACE"' name='replaced'/>
<b:if cond='data:view.isSingleItem'>
<h2><a expr:data-text='data:title' expr:href='data:blog.homepageUrl' expr:title='data:title'><data:title/></a></h2>
<b:elseif cond='data:view.isHomepage'/>
<h1 expr:data-text='data:title'><data:title/></h1>
<b:else/>
<h1><a expr:data-text='data:title' expr:href='data:blog.homepageUrl' expr:title='data:title'><data:title/></a></h1>
</b:if>
</div>
</b:includable>
</b:widget>
</b:section>
<!-- Search Form -->
<div class='searchbar'>
<form class='search-form' expr:action='data:blog.homepageUrl + "search"' id='search-form' method='get'>
<input aria-label='Search' autocomplete='off' class='search-input' id='search-input' name='q' placeholder='e.g. best place in india' type='text'/>
<button aria-label='Search Button' class='search-button' role='button' type='submit'>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M19.7555474,18.6065254 L16.3181544,15.2458256 L16.3181544,15.2458256 L16.2375905,15.1233001 C16.0877892,14.9741632 15.8829641,14.8901502 15.6691675,14.8901502 C15.4553709,14.8901502 15.2505458,14.9741632 15.1007444,15.1233001 L15.1007444,15.1233001 C12.1794834,17.8033337 7.6781476,17.94901 4.58200492,15.4637171 C1.48586224,12.9784243 0.75566836,8.63336673 2.87568494,5.31016931 C4.99570152,1.9869719 9.30807195,0.716847023 12.9528494,2.34213643 C16.5976268,3.96742583 18.4438102,7.98379036 17.2670181,11.7275931 C17.182269,11.9980548 17.25154,12.2921761 17.4487374,12.4991642 C17.6459348,12.7061524 17.9410995,12.794561 18.223046,12.7310875 C18.5049924,12.667614 18.7308862,12.4619014 18.8156353,12.1914397 L18.8156353,12.1914397 C20.2223941,7.74864367 18.0977423,2.96755391 13.8161172,0.941057725 C9.53449216,-1.08543846 4.38083811,0.250823958 1.68905427,4.08541671 C-1.00272957,7.92000947 -0.424820906,13.1021457 3.0489311,16.2795011 C6.5226831,19.4568565 11.8497823,19.6758854 15.5841278,16.7948982 L18.6276529,19.7705177 C18.9419864,20.0764941 19.4501654,20.0764941 19.764499,19.7705177 C20.0785003,19.4602048 20.0785003,18.9605974 19.764499,18.6502845 L19.764499,18.6502845 L19.7555474,18.6065254 Z'/></g></svg>
</button>
<button aria-label='Search Close' class='navicon search' role='button' type='reset'>
<svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
</button>
<span class='full-close search'/>
</form>
</div>
<!-- Header Icon -->
<div class='navicon right'>
<span class='dark-switch' onclick='darkMode()'><i class='check'/></span>
<label aria-label='Search' class='navSearch' for='search-input'>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M19.7555474,18.6065254 L16.3181544,15.2458256 L16.3181544,15.2458256 L16.2375905,15.1233001 C16.0877892,14.9741632 15.8829641,14.8901502 15.6691675,14.8901502 C15.4553709,14.8901502 15.2505458,14.9741632 15.1007444,15.1233001 L15.1007444,15.1233001 C12.1794834,17.8033337 7.6781476,17.94901 4.58200492,15.4637171 C1.48586224,12.9784243 0.75566836,8.63336673 2.87568494,5.31016931 C4.99570152,1.9869719 9.30807195,0.716847023 12.9528494,2.34213643 C16.5976268,3.96742583 18.4438102,7.98379036 17.2670181,11.7275931 C17.182269,11.9980548 17.25154,12.2921761 17.4487374,12.4991642 C17.6459348,12.7061524 17.9410995,12.794561 18.223046,12.7310875 C18.5049924,12.667614 18.7308862,12.4619014 18.8156353,12.1914397 L18.8156353,12.1914397 C20.2223941,7.74864367 18.0977423,2.96755391 13.8161172,0.941057725 C9.53449216,-1.08543846 4.38083811,0.250823958 1.68905427,4.08541671 C-1.00272957,7.92000947 -0.424820906,13.1021457 3.0489311,16.2795011 C6.5226831,19.4568565 11.8497823,19.6758854 15.5841278,16.7948982 L18.6276529,19.7705177 C18.9419864,20.0764941 19.4501654,20.0764941 19.764499,19.7705177 C20.0785003,19.4602048 20.0785003,18.9605974 19.764499,18.6502845 L19.764499,18.6502845 L19.7555474,18.6065254 Z'/></g></svg>
</label>
</div>
</header>
<!-- Iklan Billboard -->
<b:section id='large-ads' maxwidgets='1' showaddelement='true'>
<b:widget id='LinkList001' locked='true' title='Scroll Menu' type='LinkList' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='text-9'>Highlight </b:widget-setting>
<b:widget-setting name='link-9'>https://</b:widget-setting>
<b:widget-setting name='text-8'>Motion </b:widget-setting>
<b:widget-setting name='link-7'>https://</b:widget-setting>
<b:widget-setting name='link-8'>https://</b:widget-setting>
<b:widget-setting name='link-5'>/search/label/Food</b:widget-setting>
<b:widget-setting name='link-6'>/search/label/Adventure</b:widget-setting>
<b:widget-setting name='link-3'>/search/label/Photography</b:widget-setting>
<b:widget-setting name='link-4'>/search/label/Nature</b:widget-setting>
<b:widget-setting name='text-1'>Travel</b:widget-setting>
<b:widget-setting name='text-0'>Art</b:widget-setting>
<b:widget-setting name='text-3'>Photography</b:widget-setting>
<b:widget-setting name='text-2'>Life Style</b:widget-setting>
<b:widget-setting name='text-5'>Food</b:widget-setting>
<b:widget-setting name='text-4'>Nature</b:widget-setting>
<b:widget-setting name='text-7'>Design </b:widget-setting>
<b:widget-setting name='text-6'>Adventure</b:widget-setting>
<b:widget-setting name='sorting'>NONE</b:widget-setting>
<b:widget-setting name='link-1'>/search/label/Travel</b:widget-setting>
<b:widget-setting name='link-2'>/search/label/Life%20Style</b:widget-setting>
<b:widget-setting name='link-0'>/search/label/Art</b:widget-setting>
</b:widget-settings>
<b:includable id='main'><![CDATA[ ]]>
<b:include name='content'/>
</b:includable>
<b:includable id='content'>
<!--[ Scroll Menu ]-->
<nav class='glass navS scrlH'>
<div class='secIn'>
<ul>
<b:loop index='s' values='data:links' var='link'>
<b:if cond='data:s <= 12'>
<li>
<b:tag class='l' expr:data-text='data:link.name' expr:name='data:link.target != "#" and data:link.target != data:blog.url.canonical ? "a" : "span"'>
<b:attr cond='data:link.target != "#" and data:link.target != data:blog.url.canonical' expr:value='data:link.target' name='href'/>
<b:attr cond='data:link.target != "#" and data:link.target != data:blog.url.canonical' expr:value='data:link.name' name='aria-label'/>
<b:class cond='data:link.target == data:blog.url.canonical' name='a'/>
</b:tag>
</li>
</b:if>
</b:loop>
</ul>
</div>
</nav>
</b:includable>
</b:widget>
</b:section>
<div class='mainContainer'>
<div class='mainbar'>
<main>
<b:section cond='data:view.isHomepage' id='main-ads' maxwidgets='3' showaddelement='true'>
<b:widget cond='!data:view.isPreview' id='HTML002' locked='true' title='Ads Area' type='HTML' version='2' visible='false'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<!-- replace all the code here with your ad code --><div class='ads-here'><i class='ads-img'></i><i class='ads-content'></i><i class='ads-button'></i></div>]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='ads-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
<b:widget cond='data:view.isHomepage' id='HTML003' locked='true' title='Slideshow' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'/>
</b:widget-settings>
<b:includable id='main'>
<div class='widget-content'>
<section aria-label='Gallery' class='carousel'>
<ol class='carousel-viewport'>
<li class='carousel-slide' id='carousel-slide1' tabindex='0'>
<div class='carousel-snapper'>
<!-- Tambahkan/ganti bagian ini dengan gambar Anda -->
<div class='text-here'>
<span class='text-left'>
<i/><i class='bot'/><i class='go'/>
</span>
<span class='text-img' style='margin-left:25px'/>
</div>
<!-- Sampai disini -->
</div>
<a aria-label='Previous' class='carousel-prev' href='#carousel-slide4' role='button'/>
<a aria-label='Next' class='carousel-next' href='#carousel-slide2' role='button'/>
</li>
<li class='carousel-slide' id='carousel-slide2' tabindex='0'>
<div class='carousel-snapper'>
<!-- Tambahkan/ganti gambar Anda disini -->
<div class='text-here'>
<span class='text-left'>
<i style='margin:auto;background-color:#fefefe'/>
<i class='bot' style='margin-left:auto;margin-right:auto;background-color:#fefefe'/>
<i class='go' style='margin-left:auto;margin-right:auto;width:30%;max-width:150px;background-color:#ebeced'/>
</span>
</div>
<!-- Sampai disini -->
</div>
<a aria-label='Previous' class='carousel-prev' href='#carousel-slide1' role='button'/>
<a aria-label='Next' class='carousel-next' href='#carousel-slide3' role='button'/>
</li>
<li class='carousel-slide' id='carousel-slide3' tabindex='0'>
<div class='carousel-snapper'>
<!-- Tambahkan/ganti gambar Anda disini -->
<div class='text-here'>
<span class='text-img' style='margin-right:25px;'/>
<span class='text-left'>
<i/><i class='bot'/><i class='go'/>
</span>
</div>
<!-- Sampai disini -->
</div>
<a aria-label='Previous' class='carousel-prev' href='#carousel-slide2' role='button'/>
<a aria-label='Next' class='carousel-next' href='#carousel-slide1' role='button'/>
</li>
</ol>
<!-- Tombol Navigasi -->
<aside class='carousel-navigation'>
<ol class='carousel-navigation-list'>
<li class='carousel-navigation-item'>
<a aria-label='Carousel Next' class='carousel-navigation-button' href='#carousel-slide1' role='button'/>
</li>
<li class='carousel-navigation-item'>
<a aria-label='Carousel Next' class='carousel-navigation-button' href='#carousel-slide2' role='button'/>
</li>
<li class='carousel-navigation-item'>
<a aria-label='Carousel Next' class='carousel-navigation-button' href='#carousel-slide3' role='button'/>
</li>
</ol>
</aside>
</section>
</div>
</b:includable>
</b:widget>
<b:widget cond='data:view.isHomepage' id='FeaturedPost00' locked='false' title='Trending' type='FeaturedPost' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='showSnippet'>true</b:widget-setting>
<b:widget-setting name='showPostTitle'>true</b:widget-setting>
<b:widget-setting name='postId'>1885516138479022329</b:widget-setting>
<b:widget-setting name='showFirstImage'>true</b:widget-setting>
<b:widget-setting name='useMostRecentPost'>false</b:widget-setting>
</b:widget-settings>
<b:includable id='main' var='this'>
<b:if cond='data:title != ""'>
<div class='widget-title'>
<h3 class='title'><data:title/></h3>
</div>
</b:if>
<b:include name='snippetedPosts'/>
</b:includable>
<b:includable id='blogThisShare'/>
<b:includable id='bylineByName' var='byline'/>
<b:includable id='bylineRegion' var='regionItems'/>
<b:includable id='commentsLink'>
<div class='comments-bubble'>
<span><data:post.numberOfComments/></span>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M10.0067501,0 C11.62449,0 13.2360653,0.399066203 14.6679897,1.15403251 C19.5432254,3.72637977 21.4181128,9.7854909 18.847518,14.6623794 C17.0941592,17.9879311 13.6420414,20 9.99530173,20 C9.28286212,20 8.56337738,19.9233581 7.8474152,19.7647888 C7.44408103,19.6749328 7.18957541,19.2749857 7.27852028,18.8715148 C7.36746515,18.4680439 7.76639611,18.2152138 8.1723722,18.302427 C11.8966084,19.1305114 15.7414927,17.3430824 17.523032,13.9637933 C19.7087862,9.81808572 18.1148236,4.66546271 13.9696404,2.47896754 C12.7525927,1.83676166 11.3823133,1.49759944 10.0058694,1.49759944 L10.0058694,1.49759944 C5.31028477,1.49759944 1.49710367,5.31119235 1.49710367,9.99867859 C1.49534238,11.3641369 1.82822517,12.7234286 2.45964569,13.9311985 L2.45964569,13.9311985 L2.65162571,14.3064793 C2.8867572,14.7469497 2.93871509,15.294014 2.78636398,15.7891028 C2.57589047,16.3440955 2.40064266,16.8841122 2.25621732,17.4214861 C2.8180671,17.2523455 3.50408744,17.0030392 3.99988905,16.8224464 L3.99988905,16.8224464 L4.20331742,16.7493283 C4.5881581,16.6057349 5.02055346,16.8092323 5.16145622,17.1986081 C5.30235899,17.587103 5.10069191,18.0170022 4.71232866,18.1570718 L4.71232866,18.1570718 L4.51154222,18.2301898 C3.77004141,18.4988768 2.7555415,18.867991 2.0704018,19.0212747 C2.01227941,19.0336079 1.9497538,19.0415364 1.89251206,19.0397745 C1.43281678,19.0397745 1.15277254,18.853896 0.998660135,18.6970885 C0.76176736,18.4565916 0.649045147,18.1191913 0.662254782,17.6945778 C0.664016066,17.6461261 0.670180562,17.5959124 0.681628912,17.5474607 C0.859518654,16.7898516 1.09112758,16.0340043 1.37117182,15.3019425 C1.39142659,15.2305863 1.3790976,15.101088 1.32185585,14.9927322 L1.32185585,14.9927322 L1.12899519,14.6183324 C0.390136315,13.2035414 -0.00174950235,11.6028719 5.87135273e-06,9.99779765 C5.87135273e-06,4.48486984 4.48424231,0 9.99530173,0 L9.99530173,0 Z M9.99565399,8.80949654 C10.6517325,8.80949654 11.1845211,9.34334669 11.1845211,9.99876668 C11.1845211,10.6541867 10.6517325,11.1880368 9.99565399,11.1880368 C9.33957549,11.1880368 8.8067869,10.6541867 8.8067869,9.99876668 C8.8067869,9.34334669 9.33957549,8.80949654 9.99565399,8.80949654 Z M14.3988654,8.80949654 C15.0549439,8.80949654 15.5877325,9.34334669 15.5877325,9.99876668 C15.5877325,10.6541867 15.0549439,11.1880368 14.3988654,11.1880368 C13.7427869,11.1880368 13.2099983,10.6541867 13.2099983,9.99876668 C13.2099983,9.34334669 13.7427869,8.80949654 14.3988654,8.80949654 Z M5.59235449,8.80984892 C6.248433,8.80984892 6.78122158,9.34281813 6.78122158,9.99911906 C6.78122158,10.654539 6.248433,11.1875083 5.59235449,11.1875083 C4.93627599,11.1875083 4.40348741,10.654539 4.40348741,9.99911906 C4.40348741,9.34281813 4.93627599,8.80984892 5.59235449,8.80984892 Z'/></g></svg>
</div>
</b:includable>
<b:includable id='commentsLinkIframe'/>
<b:includable id='emailPostIcon'/>
<b:includable id='facebookShare'/>
<b:includable id='footerBylines'/>
<b:includable id='googlePlusShare'/>
<b:includable id='headerByline'/>
<b:includable id='linkShare'/>
<b:includable id='otherSharingButton'/>
<b:includable id='platformShare'/>
<b:includable id='postAuthor'/>
<b:includable id='postCommentsLink'/>
<b:includable id='postJumpLink' var='post'/>
<b:includable id='postLabels'>
<div class='item-label'>
<b:loop index='num' values='data:post.labels' var='label'>
<b:if cond='data:num == 0'>
<span><data:label.name/></span><b:if cond='data:label.isLast != "true"'/>
</b:if>
<b:if cond='data:num == 1'>
<span><data:label.name/></span><b:if cond='data:label.isLast != "true"'/>
</b:if>
</b:loop>
</div>
</b:includable>
<b:includable id='postLocation'/>
<b:includable id='postReactions'/>
<b:includable id='postShareButtons'/>
<b:includable id='postTimestamp'>
<div class='item-timestamp'>
<time class='published' expr:datetime='data:post.date.iso8601'><data:post.date/></time>
</div>
</b:includable>
<b:includable id='sharingButton'/>
<b:includable id='sharingButtonContent'/>
<b:includable id='sharingButtons'/>
<b:includable id='sharingButtonsMenu'/>
<b:includable id='sharingPlatformIcon'/>
<b:includable id='snippetedPostByline'/>
<b:includable id='snippetedPostContent'>
<b:include cond='data:this.postDisplay.showFeaturedImage and data:post.featuredImage' name='snippetedPostThumbnail'/>
<div class='item-content'>
<b:include cond='data:this.postDisplay.showTitle' name='snippetedPostTitle'/>
<b:include cond='data:this.postDisplay.showSnippet' name='snippetedPostEntry'/>
<b:include name='snippetedPostHeader'/>
</div>
</b:includable>
<b:includable id='snippetedPostEntry'>
<b:comment>Dont show.</b:comment>
<div class='item-entry'>
<b:eval expr='snippet(data:post.body, {length: 90, links: true, linebreaks: false})'/>
</div>
</b:includable>
<b:includable id='snippetedPostHeader'>
<div class='item-header'>
<div class='item-info'>
<b:include cond='data:post.labels' name='postLabels'/>
<div class='item-published'>
<b:include name='postTimestamp'/>
</div>
</div>
<div class='item-comment'>
<b:include cond='data:post.allowComments and data:post.numberOfComments > 0' name='commentsLink'/>
</div>
</div>
</b:includable>
<b:includable id='snippetedPostThumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.url'>
<img class='post-thumb lazy' expr:alt='data:post.title' expr:data-src='resizeImage(data:post.featuredImage, 600, "18:9")' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
</a>
</div>
</b:includable>
<b:includable id='snippetedPostTitle'>
<b:if cond='data:post.title != ""'>
<h4 class='item-title'><a expr:href='data:post.url'><data:post.title/></a></h4>
</b:if>
</b:includable>
<b:includable id='snippetedPosts'>
<div class='item-featured' role='feed'>
<!-- Don't render the post that we're currently already looking at. -->
<b:loop values='data:posts filter (p => p.id != data:view.postId)' var='post'>
<article class='post'>
<b:class cond='!data:this.postDisplay.showFeaturedImage' name='no-thumbnail'/>
<b:include name='snippetedPostContent'/>
</article>
</b:loop>
</div>
</b:includable>
</b:widget>
</b:section>
<!-- Widget utama -->
<b:section id='main-widget' showaddelement='true'>
<b:widget id='Blog00' locked='true' title='Blog Posts' type='Blog' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='showDateHeader'>false</b:widget-setting>
<b:widget-setting name='commentLabel'>Komentar</b:widget-setting>
<b:widget-setting name='style.textcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='showShareButtons'>true</b:widget-setting>
<b:widget-setting name='authorLabel'>Author :</b:widget-setting>
<b:widget-setting name='showCommentLink'>true</b:widget-setting>
<b:widget-setting name='style.urlcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='showAuthor'>true</b:widget-setting>
<b:widget-setting name='style.linkcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='style.unittype'>TextAndImage</b:widget-setting>
<b:widget-setting name='style.bgcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='timestampLabel'>Pada</b:widget-setting>
<b:widget-setting name='reactionsLabel'/>
<b:widget-setting name='showAuthorProfile'>true</b:widget-setting>
<b:widget-setting name='style.layout'>1x1</b:widget-setting>
<b:widget-setting name='showLabels'>true</b:widget-setting>
<b:widget-setting name='showLocation'>false</b:widget-setting>
<b:widget-setting name='postLabelsLabel'/>
<b:widget-setting name='showTimestamp'>true</b:widget-setting>
<b:widget-setting name='postsPerAd'>1</b:widget-setting>
<b:widget-setting name='showBacklinks'>false</b:widget-setting>
<b:widget-setting name='style.bordercolor'>#ffffff</b:widget-setting>
<b:widget-setting name='showInlineAds'>false</b:widget-setting>
<b:widget-setting name='showReactions'>false</b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<b:include cond='data:view.isMultipleItems' name='titlePostWidget'/>
<b:include name='noContentPlaceholder'/>
<b:comment>Filter out the featured post, but only on the homepage.</b:comment>
<b:with value='data:widgets.FeaturedPost filter (w => w.sectionId == "main") map (w => w.postId)' var='featuredPostIds'>
<b:with value='data:view.isHomepage ? data:posts filter (post => post.id not in data:featuredPostIds) : data:posts' var='posts'>
<b:include name='super.main'/>
</b:with>
</b:with>
</b:includable>
<b:includable id='aboutPostAuthor'/>
<b:includable id='addComments'/>
<b:includable id='blogThisShare'/>
<b:includable id='breadcrumb' var='post'>
<div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
<div class='home-link' itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a expr:href='data:blog.homepageUrl.canonical' itemprop='item' title='Home'>
<span itemprop='name'>Home</span>
</a><meta content='1' itemprop='position'/>
</div>
<b:if cond='data:post.labels'>
<b:loop index='num' values='data:post.labels' var='label'>
<b:if cond='data:num == 0'>
<div itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a expr:href='data:label.url.canonical' expr:title='data:label.name' itemprop='item'><span itemprop='name'><data:label.name/></span></a><meta expr:content='data:num+2' itemprop='position'/>
</div>
</b:if>
<b:if cond='data:num == 1'>
<div itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a expr:href='data:label.url.canonical' expr:title='data:label.name' itemprop='item'><span itemprop='name'><data:label.name/></span></a><meta expr:content='data:num+2' itemprop='position'/>
</div>
</b:if>
</b:loop>
<b:elseif cond='data:view.isPost'/>
<div>Uncategorized</div>
</b:if>
<div class='title-link'>
<span><data:post.title/></span>
</div>
</div>
</b:includable>
<b:includable id='bylineByName' var='byline'>
<b:switch var='data:byline.name'>
<b:case value='share'/>
<b:include cond='data:post.shareUrl' name='postShareButtons'/>
<b:case value='comments'/>
<b:include cond='data:post.allowComments' name='postCommentsLink'/>
<b:case value='location'/>
<b:include cond='data:post.location' name='postLocation'/>
<b:case value='timestamp'/>
<b:include cond='not data:view.isPage' name='postTimestamp'/>
<b:case value='author'/>
<b:include name='postAuthor'/>
<b:case value='labels'/>
<b:include cond='data:post.labels' name='postLabels'/>
<b:case value='icons'/>
<b:include cond='data:post.emailPostUrl' name='emailPostIcon'/>
<b:case value='reactions'/>
<b:include cond='data:post.reactionsUrl' name='postReactions'/>
</b:switch>
</b:includable>
<b:includable id='bylineRegion' var='regionItems'>
<b:loop values='data:regionItems' var='byline'>
<b:include data='byline' name='bylineByName'/>
</b:loop>
</b:includable>
<b:includable id='commentAuthorAvatar'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='commentForm' var='post'/>
<b:includable id='commentFormIframeSrc' var='post'/>
<b:includable id='commentItem' var='comment'/>
<b:includable id='commentList' var='comments'/>
<b:includable id='commentPicker' var='post'/>
<b:includable id='commentShowhide'>
<input class='all-comment hidden' id='offall-comment' type='checkbox'/>
<div class='show-comment' id='showComments'>
<label class='button outline' for='offall-comment'><span><b:loop values='data:post' var='post'><b:if cond='data:post.numberOfComments > 0'>Open Comments (<data:post.numberOfComments/>)<b:else/><data:messages.postAComment/></b:if></b:loop></span></label>
</div>
</b:includable>
<b:includable id='commentblock' var='cb'>
<div class='avatar-image-container'>
<div>
<b:if cond='data:cb.level.authorAvatarSrc != "//resources.blogblog.com/img/blank.gif"'>
<img class='post-thumb lazy' expr:alt='data:cb.level.author' expr:data-src='resizeImage(data:cb.level.authorAvatarSrc, 100, "1:1")' expr:title='data:cb.level.author' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
</b:if>
</div>
</div>
<div class='comment-block' itemscope='itemscope' itemtype='https://schema.org/Comment'>
<div class='comment-header'>
<b:if cond='data:cb.level.author != "Anonymous"'>
<span class='user' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>
<span itemprop='name'><data:cb.level.author/></span>
<b:if cond='data:post.author.name == data:cb.level.author'>
<svg class='icon blog-author' viewBox='0 0 24 24'><path d='M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2M11,16.5L18,9.5L16.59,8.09L11,13.67L7.91,10.59L6.5,12L11,16.5Z'/></svg>
</b:if>
</span>
</b:if>
<span class='datetime secondary-text' itemprop='datePublished'>
<a expr:href='"#c" + data:cb.level.id' itemprop='url'>
<data:cb.level.timestamp/>
</a>
</span>
</div>
<div class='comment-content' itemprop='text'>
<!--<b:if cond='data:cb.level.authorUrl != data:post.author.profileUrl'>-->
<b:eval expr='data:cb.level.body snippet { links: false }'/>
<!--<b:else/>
<data:cb.level.body/>
</b:if>-->
</div>
</div>
<!--<b:if cond='data:cb.d and data:commentL2.size != "2"'>
<div class='comment-actions secondary-text'>
<a class='comment-reply reply-to' expr:data-comment-id='data:commentLevel1.id' expr:data-reply-to='data:commentLevel1.id' href='javascript:;' target='_self'>Balas</a>
<span expr:class='"item-control " + data:cb.level.adminClass'>
<a expr:href='data:cb.level.deleteUrl' expr:title='data:messages.deleteComment' rel='noopener external nofollow' target='_self'>Hapus</a>
</span>
</div>
</b:if>-->
</b:includable>
<b:includable id='comments' var='post'/>
<b:includable id='commentsLink'/>
<b:includable id='commentsLinkIframe'/>
<b:includable id='commentsTitle'>
<h3 class='title'>
<b:if cond='data:post.numberOfComments > 0'>
<b:message name='messages.numberOfComments'>
<b:param expr:value='data:post.numberOfComments' name='numComments'/>
</b:message>
<b:else/>
<data:messages.postAComment/>
</b:if>
</h3>
</b:includable>
<b:includable id='defaultAdUnit'/>
<b:includable id='emailPostIcon'/>
<b:includable id='facebookShare'/>
<b:includable id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='footerBylines'/>
<b:includable id='googlePlusShare'/>
<b:includable id='headerByline'/>
<b:includable id='homePageLink'/>
<b:includable id='iframeComments' var='post'/>
<b:includable id='inlineAd' var='post'/>
<b:includable id='linkShare'/>
<b:includable id='nextPageLink'/>
<b:includable id='otherSharingButton'/>
<b:includable id='platformShare'/>
<b:includable id='post' var='post'/>
<b:includable id='postAuthor'/>
<b:includable id='postBody' var='post'/>
<b:includable id='postBodySnippet' var='post'/>
<b:includable id='postCommentsAndAd' var='post'>
<!-- Table of Contents -->
<b:include cond='data:view.isSingleItem and !data:view.isPreview' data='post' name='post-artikelTOC'/>
<!-- Breadcrumbs -->
<b:include cond='data:view.isSingleItem' data='post' name='breadcrumb'/>
<b:if cond='data:view.isPost'>
<input class='font-check font-size1 hidden' id='offfont-check1' name='font-check' type='radio'/>
<input checked='checked' class='font-check font-size2 hidden' id='offfont-check2' name='font-check' type='radio'/>
<input class='font-check font-size3 hidden' id='offfont-check3' name='font-check' type='radio'/>
</b:if>
<!-- Artikel -->
<article class='hentry'>
<b:class cond='data:view.isMultipleItems and !data:post.featuredImage' name='noThumbnail'/>
<b:class cond='data:view.isSingleItem' name='post'/>
<!-- Gambar thumbnail -->
<b:if cond='data:view.isMultipleItems'>
<div class='post-thumbnail'>
<a expr:href='data:post.url' expr:title='data:post.title'>
<b:if cond='data:post.featuredImage'>
<img class='post-thumb lazy' expr:alt='data:post.title' expr:data-src='resizeImage(data:post.featuredImage, 400, "18:9")' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
<b:else/>
<span class='post-thumb'>No image</span>
</b:if>
</a>
</div>
</b:if>
<!-- Konten postingan -->
<div class='post-content'>
<div class='post-headline'>
<!-- Label -->
<b:if cond='data:view.isMultipleItems and data:post.labels'>
<div class='post-label'>
<b:loop index='num' values='data:post.labels' var='label'>
<b:if cond='data:num == 0'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'/>
</b:if>
<b:if cond='data:num == 1'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'/>
</b:if>
</b:loop>
</div>
</b:if>
<!-- Judul postingan -->
<b:if cond='data:post.title != ""'>
<b:if cond='data:post.link or (data:post.url and data:view.url != data:post.url)'>
<h2 class='post-title'>
<a expr:data-text='data:post.title' expr:href='data:post.link ?: data:post.url' rel='bookmark'><data:post.title/></a>
</h2>
<b:else/>
<h1 class='post-title'><data:post.title/></h1>
</b:if>
</b:if>
<!-- Snippet postingan -->
<b:if cond='data:view.isMultipleItems'>
<div class='post-snippet'>
<b:eval expr='snippet(data:post.snippets.long, {length: 90, links: false, linebreaks: false})'/>
</div>
</b:if>
<!-- Info postingan -->
<b:include cond='!data:view.isPage' name='postIndexInfo'/>
</div>
<!-- Pemanggil iklan atas postingan -->
<b:include cond='data:view.isPost and !data:view.isPreview' data='post' name='post-iklanAtas'/>
<!-- Isi postingan -->
<b:if cond='data:view.isSingleItem'>
<div class='post-entry' expr:id='"post-body-" + data:post.id'>
<div class='post-body' id='post-body'>
<data:post.body/>
<script>medianTOC();</script>
</div>
</div>
</b:if>
<!-- Pemanggil iklan bawah postingan -->
<b:include cond='data:view.isPost and !data:view.isPreview' data='post' name='post-iklanBawah'/>
<!-- Label bawah artikel -->
<b:include cond='data:view.isPost and !data:view.isPreview and data:this.allBylineItems.labels and !data:post.labels.empty' name='postLabels'/>
<!-- Tombol share -->
<b:include cond='data:view.isPost and !data:view.isPreview and data:post.shareUrl' name='postIndexShare'/>
<b:include data='post' name='postMetadataJSON'/>
</div>
</article>
<b:include cond='data:post.author.aboutMe and data:view.isPost' name='post-artikelAuthor'/>
<b:include cond='data:view.isPost and !data:view.isPreview' data='post' name='post-artikelTerkait'/>
<!--<b:include cond='data:view.isPost and !data:view.isPreview' data='post' name='post-iklanTerkait'/>-->
<b:include cond='data:view.isPost and !data:view.isPreview and data:post.allowComments' data='post' name='commentShowhide'/>
<b:include cond='data:view.isPost and !data:view.isPreview and data:post.allowComments' data='post' name='threadedComments-modifV2'/>
</b:includable>
<b:includable id='postCommentsLink'/>
<b:includable id='postFooter' var='post'/>
<b:includable id='postFooterAuthorProfile' var='post'/>
<b:includable id='postHeader' var='post'/>
<b:includable id='postIndexInfo'>
<div class='post-info'>
<div class='post-header'>
<!-- Nama penulis -->
<div class='post-author'>
<b:if cond='data:this.allBylineItems.author'>
<span class='post-authorName fn' expr:data-text='data:this.allBylineItems.author.label'>
<b:if cond='data:post.author.profileUrl'>
<meta expr:content='data:post.author.profileUrl' property='author'/>
<a expr:href='data:post.author.profileUrl' rel='author nofollow noreferrer' target='_blank'><data:post.author.name/></a>
<b:else/>
<data:post.author.name/>
</b:if>
</span>
</b:if>
</div>
<!-- Tanggal publish dan update -->
<div class='post-published'>
<b:if cond='data:this.allBylineItems.timestamp'>
<div class='post-timestamp'>
<span class='publish' expr:data-text='data:this.allBylineItems.timestamp.label'>
<time class='published' expr:datetime='data:post.date.iso8601'><data:post.date/></time>
</span>
<b:if cond='data:post.lastUpdated and !data:view.isMultipleItems'>
<span class='updated'><data:post.lastUpdated/></span>
</b:if>
</div>
</b:if>
</div>
</div>
<!-- Total komentar -->
<div class='post-comment'>
<b:if cond='data:post.allowComments and data:this.allBylineItems.comments and data:post.numberOfComments > 0'>
<div class='comments-bubble'>
<span><data:post.numberOfComments/></span>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M10.0067501,0 C11.62449,0 13.2360653,0.399066203 14.6679897,1.15403251 C19.5432254,3.72637977 21.4181128,9.7854909 18.847518,14.6623794 C17.0941592,17.9879311 13.6420414,20 9.99530173,20 C9.28286212,20 8.56337738,19.9233581 7.8474152,19.7647888 C7.44408103,19.6749328 7.18957541,19.2749857 7.27852028,18.8715148 C7.36746515,18.4680439 7.76639611,18.2152138 8.1723722,18.302427 C11.8966084,19.1305114 15.7414927,17.3430824 17.523032,13.9637933 C19.7087862,9.81808572 18.1148236,4.66546271 13.9696404,2.47896754 C12.7525927,1.83676166 11.3823133,1.49759944 10.0058694,1.49759944 L10.0058694,1.49759944 C5.31028477,1.49759944 1.49710367,5.31119235 1.49710367,9.99867859 C1.49534238,11.3641369 1.82822517,12.7234286 2.45964569,13.9311985 L2.45964569,13.9311985 L2.65162571,14.3064793 C2.8867572,14.7469497 2.93871509,15.294014 2.78636398,15.7891028 C2.57589047,16.3440955 2.40064266,16.8841122 2.25621732,17.4214861 C2.8180671,17.2523455 3.50408744,17.0030392 3.99988905,16.8224464 L3.99988905,16.8224464 L4.20331742,16.7493283 C4.5881581,16.6057349 5.02055346,16.8092323 5.16145622,17.1986081 C5.30235899,17.587103 5.10069191,18.0170022 4.71232866,18.1570718 L4.71232866,18.1570718 L4.51154222,18.2301898 C3.77004141,18.4988768 2.7555415,18.867991 2.0704018,19.0212747 C2.01227941,19.0336079 1.9497538,19.0415364 1.89251206,19.0397745 C1.43281678,19.0397745 1.15277254,18.853896 0.998660135,18.6970885 C0.76176736,18.4565916 0.649045147,18.1191913 0.662254782,17.6945778 C0.664016066,17.6461261 0.670180562,17.5959124 0.681628912,17.5474607 C0.859518654,16.7898516 1.09112758,16.0340043 1.37117182,15.3019425 C1.39142659,15.2305863 1.3790976,15.101088 1.32185585,14.9927322 L1.32185585,14.9927322 L1.12899519,14.6183324 C0.390136315,13.2035414 -0.00174950235,11.6028719 5.87135273e-06,9.99779765 C5.87135273e-06,4.48486984 4.48424231,0 9.99530173,0 L9.99530173,0 Z M9.99565399,8.80949654 C10.6517325,8.80949654 11.1845211,9.34334669 11.1845211,9.99876668 C11.1845211,10.6541867 10.6517325,11.1880368 9.99565399,11.1880368 C9.33957549,11.1880368 8.8067869,10.6541867 8.8067869,9.99876668 C8.8067869,9.34334669 9.33957549,8.80949654 9.99565399,8.80949654 Z M14.3988654,8.80949654 C15.0549439,8.80949654 15.5877325,9.34334669 15.5877325,9.99876668 C15.5877325,10.6541867 15.0549439,11.1880368 14.3988654,11.1880368 C13.7427869,11.1880368 13.2099983,10.6541867 13.2099983,9.99876668 C13.2099983,9.34334669 13.7427869,8.80949654 14.3988654,8.80949654 Z M5.59235449,8.80984892 C6.248433,8.80984892 6.78122158,9.34281813 6.78122158,9.99911906 C6.78122158,10.654539 6.248433,11.1875083 5.59235449,11.1875083 C4.93627599,11.1875083 4.40348741,10.654539 4.40348741,9.99911906 C4.40348741,9.34281813 4.93627599,8.80984892 5.59235449,8.80984892 Z'/></g></svg>
</div>
</b:if>
<b:if cond='data:view.isSingleItem'>
<div class='post-shareIcon'>
<label for='offshare-check'><svg class='line' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><circle cx='128' cy='256' r='48' style='fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px'/><circle cx='384' cy='112' r='48' style='fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px'/><circle cx='384' cy='400' r='48' style='fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px'/><line style='fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px' x1='169.83' x2='342.17' y1='279.53' y2='376.47'/><line style='fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px' x1='342.17' x2='169.83' y1='135.53' y2='232.47'/></svg></label>
</div>
<div class='post-font'>
<span onclick='changeFont()'><svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M16.928 4.8L22 19.41h-3.31l-1.104-3.483h-5.133l-1.124 3.482H8.26L13.334 4.8h3.594zM8.19 8.974l.952 2.741-1.077 3.102-1.162-3.673h-.13l-1.309 4.093h2.455l-.585 1.684h-2.34L4.19 19.41H2L5.623 8.974H8.19zm6.936-1.137h-.183l-1.832 5.73h3.827l-1.812-5.73z'/></svg></span>
<div class='post-fontContainer' id='post-font'>
<ul>
<li><label for='offfont-check1' onclick='changeFont()'/></li>
<li><label for='offfont-check2' onclick='changeFont()'/></li>
<li><label for='offfont-check3' onclick='changeFont()'/></li>
<!-- Close popup -->
<li class='close'>
<span onclick='changeFont()'>
<svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
</span>
</li>
</ul>
<span class='full-close' onclick='changeFont()'/>
</div>
</div>
</b:if>
</div>
</div>
</b:includable>
<b:includable id='postIndexShare'>
<div class='post-share' expr:data-share='data:messages.share'>
<!-- Bagikan ke Facebook -->
<div class='share-icon facebookThis'>
<a aria-label='Share button' expr:href='"https://www.facebook.com/sharer.php?u=" + data:blog.url.canonical' rel='nofollow noreferrer' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5h8a1,1,0,0,0,1-1V20a1,1,0,0,0-1-1H15V17h1a1,1,0,0,0,1-1V12.5A2.5,2.5,0,0,1,19.5,10H22v2H21a2,2,0,0,0-2,2v2a1,1,0,0,0,1,1h1.72l-.5,2H20a1,1,0,0,0-1,1v4a1,1,0,0,0,2,0V21h1a1,1,0,0,0,1-.76l1-4a1,1,0,0,0-.18-.86A1,1,0,0,0,23,15H21V14h2a1,1,0,0,0,1-1V9a1,1,0,0,0-1-1H19.5A4.51,4.51,0,0,0,15,12.5V15H14a1,1,0,0,0-1,1v4a1,1,0,0,0,1,1h1v6H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3V24a3,3,0,0,1-3,3H20a1,1,0,0,0,0,2h4a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Z'/></svg>
</a>
</div>
<!-- Bagikan ke Twitter -->
<div class='share-icon twitterThis'>
<a aria-label='Share button' expr:href='"https://twitter.com/share?url=" + data:blog.url.canonical' rel='nofollow noreferrer' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M28.77,8.11a.87.87,0,0,0-.23-.2A4.69,4.69,0,0,0,29,6.54a1,1,0,0,0-.44-1,1,1,0,0,0-1.1,0,6.42,6.42,0,0,1-2.28.92,6.21,6.21,0,0,0-7.08-1A6.07,6.07,0,0,0,15,12.2a1,1,0,0,0,2-.4A4.08,4.08,0,0,1,19,7.28a4.24,4.24,0,0,1,5.12,1,1,1,0,0,0,.88.28l.25,0a1,1,0,0,0,.34,1.62,1,1,0,0,0-.36.88,13.07,13.07,0,0,1-4.89,11.24A12.75,12.75,0,0,1,7.69,24.61a9.06,9.06,0,0,0,4.54-2.18,1,1,0,0,0,.15-1.09,1,1,0,0,0-.93-.57,4,4,0,0,1-3-1.39,3.63,3.63,0,0,0,1-.35A1,1,0,0,0,10,18a1,1,0,0,0-.76-.84,4.42,4.42,0,0,1-3-2.48c.24,0,.48.05.74.06a1,1,0,0,0,1-.62A1,1,0,0,0,7.67,13C6,11.48,5.59,9.85,5.83,8.7a13.88,13.88,0,0,0,7,4,1,1,0,1,0,.38-2A12.1,12.1,0,0,1,6.39,6.31a1,1,0,0,0-.75-.38,1,1,0,0,0-.78.33,5.34,5.34,0,0,0-.31,6l-.09,0a1,1,0,0,0-.52.81,5.84,5.84,0,0,0,1.95,4.47,1,1,0,0,0-.18,1,6.63,6.63,0,0,0,3.18,3.57A13.89,13.89,0,0,1,4,23a1,1,0,0,0-.5,1.86A16.84,16.84,0,0,0,12,27.35a15.16,15.16,0,0,0,9.6-3.57,15.12,15.12,0,0,0,5.69-12.42,4.62,4.62,0,0,0,1.62-2.25A1,1,0,0,0,28.77,8.11Z'/></svg>
</a>
</div>
<!-- Bagikan ke Whatsapp -->
<div class='share-icon whatsappThis'>
<a aria-label='Share button' expr:href='"https://api.whatsapp.com/send?text=" + data:blog.url.canonical' rel='nofollow noreferrer' role='button' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M16,3A13,13,0,0,0,4.53,22.13L3,27.74a1,1,0,0,0,.27,1A1,1,0,0,0,4,29a.84.84,0,0,0,.27,0l5.91-1.65a1,1,0,0,0-.53-1.93L5.42,26.56l1.15-4.3a1,1,0,0,0-.1-.76A11,11,0,1,1,16,27a11.23,11.23,0,0,1-1.84-.15,1,1,0,0,0-1.15.82,1,1,0,0,0,.82,1.15A13,13,0,1,0,16,3Z'/><path d='M15,11.21l-1.16-1.6a2.06,2.06,0,0,0-1.5-.84,2.08,2.08,0,0,0-1.62.6l-1.2,1.2a2.81,2.81,0,0,0-.8,2.08c0,1.77,1.36,4,4,6.6,3.09,3,5.23,4,6.69,4a2.7,2.7,0,0,0,2-.81l1.2-1.2a2,2,0,0,0-.24-3.11L20.8,17a2.09,2.09,0,0,0-1.83-.3l-1.49.47a.53.53,0,0,1-.26-.09,11.42,11.42,0,0,1-2.35-2.26.31.31,0,0,1,0-.11c.13-.44.35-1.15.5-1.64A2,2,0,0,0,15,11.21Zm1.29,7.63a2.33,2.33,0,0,0,1.75.2l1.54-.46,1.61,1.25L20,21c-.48.47-2.25.33-5.86-3.21-3-2.91-3.41-4.5-3.41-5.18A.89.89,0,0,1,11,12l1.28-1.19,1.18,1.65c-.16.49-.39,1.22-.51,1.65A2.12,2.12,0,0,0,13,15.51,11.24,11.24,0,0,0,16.33,18.84Z'/></svg>
</a>
</div>
<div class='share-icon shareThis'>
<label for='offshare-check'>
<svg viewBox='0 0 512 512'><circle cx='256' cy='256' r='48'/><circle cx='416' cy='256' r='48'/><circle cx='96' cy='256' r='48'/></svg>
</label>
</div>
<input class='share-check hidden' id='offshare-check' type='checkbox'/>
<div class='share-popup'>
<ul>
<li>
<!-- Bagikan ke Twitter -->
<a expr:href='"https://twitter.com/share?url=" + data:blog.url.canonical' rel='nofollow noreferrer' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M28.77,8.11a.87.87,0,0,0-.23-.2A4.69,4.69,0,0,0,29,6.54a1,1,0,0,0-.44-1,1,1,0,0,0-1.1,0,6.42,6.42,0,0,1-2.28.92,6.21,6.21,0,0,0-7.08-1A6.07,6.07,0,0,0,15,12.2a1,1,0,0,0,2-.4A4.08,4.08,0,0,1,19,7.28a4.24,4.24,0,0,1,5.12,1,1,1,0,0,0,.88.28l.25,0a1,1,0,0,0,.34,1.62,1,1,0,0,0-.36.88,13.07,13.07,0,0,1-4.89,11.24A12.75,12.75,0,0,1,7.69,24.61a9.06,9.06,0,0,0,4.54-2.18,1,1,0,0,0,.15-1.09,1,1,0,0,0-.93-.57,4,4,0,0,1-3-1.39,3.63,3.63,0,0,0,1-.35A1,1,0,0,0,10,18a1,1,0,0,0-.76-.84,4.42,4.42,0,0,1-3-2.48c.24,0,.48.05.74.06a1,1,0,0,0,1-.62A1,1,0,0,0,7.67,13C6,11.48,5.59,9.85,5.83,8.7a13.88,13.88,0,0,0,7,4,1,1,0,1,0,.38-2A12.1,12.1,0,0,1,6.39,6.31a1,1,0,0,0-.75-.38,1,1,0,0,0-.78.33,5.34,5.34,0,0,0-.31,6l-.09,0a1,1,0,0,0-.52.81,5.84,5.84,0,0,0,1.95,4.47,1,1,0,0,0-.18,1,6.63,6.63,0,0,0,3.18,3.57A13.89,13.89,0,0,1,4,23a1,1,0,0,0-.5,1.86A16.84,16.84,0,0,0,12,27.35a15.16,15.16,0,0,0,9.6-3.57,15.12,15.12,0,0,0,5.69-12.42,4.62,4.62,0,0,0,1.62-2.25A1,1,0,0,0,28.77,8.11Z'/></svg><span>Twitter</span>
</a>
</li>
<li>
<!-- Bagikan ke Telegram -->
<a expr:href='"https://t.me/share/url?url=" + data:blog.url.canonical' rel='nofollow noreferrer' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M28.59,4.29a2.23,2.23,0,0,0-2.27-.36L3.41,13.1a1.83,1.83,0,0,0,0,3.38l1.48.61a1,1,0,0,0,1.31-.53,1,1,0,0,0-.54-1.31L4.56,14.8l22.51-9a.22.22,0,0,1,.23,0,.24.24,0,0,1,.08.23L23.27,25.21a.4.4,0,0,1-.26.3.39.39,0,0,1-.39-.06l-8-6.24,7.83-7.91a1,1,0,0,0-1.22-1.56L9.75,16.54a1,1,0,1,0,1,1.72l4.83-2.85L13.23,17.8a2,2,0,0,0,.2,3.08l8,6.15a2.4,2.4,0,0,0,1.47.5,2.47,2.47,0,0,0,.83-.15,2.37,2.37,0,0,0,1.52-1.75L29.33,6.47A2.23,2.23,0,0,0,28.59,4.29Z'/></svg><span>Telegram</span>
</a>
</li>
<li>
<!-- Bagikan ke Pinterst -->
<a data-pin-config='beside' expr:href='"https://pinterest.com/pin/create/button/?url=" + data:blog.url.canonical + "&media=" + data:blog.postImageUrl' rel='nofollow noreferrer' target='_blank'>
<svg viewBox='0 0 56.693 56.693' xmlns='http://www.w3.org/2000/svg'><path d='M30.374,4.622c-13.586,0-20.437,9.74-20.437,17.864c0,4.918,1.862,9.293,5.855,10.922c0.655,0.27,1.242,0.01,1.432-0.715 c0.132-0.5,0.445-1.766,0.584-2.295c0.191-0.717,0.117-0.967-0.412-1.594c-1.151-1.357-1.888-3.115-1.888-5.607 c0-7.226,5.407-13.695,14.079-13.695c7.679,0,11.898,4.692,11.898,10.957c0,8.246-3.649,15.205-9.065,15.205 c-2.992,0-5.23-2.473-4.514-5.508c0.859-3.623,2.524-7.531,2.524-10.148c0-2.34-1.257-4.292-3.856-4.292 c-3.058,0-5.515,3.164-5.515,7.401c0,2.699,0.912,4.525,0.912,4.525s-3.129,13.26-3.678,15.582 c-1.092,4.625-0.164,10.293-0.085,10.865c0.046,0.34,0.482,0.422,0.68,0.166c0.281-0.369,3.925-4.865,5.162-9.359 c0.351-1.271,2.011-7.859,2.011-7.859c0.994,1.896,3.898,3.562,6.986,3.562c9.191,0,15.428-8.379,15.428-19.595 C48.476,12.521,41.292,4.622,30.374,4.622z'/></svg><span>Pinterest</span>
</a>
</li>
<li>
<!-- Bagikan ke Linkedin -->
<a expr:href='"https://www.linkedin.com/sharing/share-offsite/?url=" + data:blog.url.canonical' rel='nofollow noreferrer' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M6.5,3A3.5,3.5,0,1,0,10,6.5,3.5,3.5,0,0,0,6.5,3Zm0,5A1.5,1.5,0,1,1,8,6.5,1.5,1.5,0,0,1,6.5,8Z'/><path d='M9,11H4a1,1,0,0,0,0,2H8V27H5V16a1,1,0,0,0-2,0V28a1,1,0,0,0,1,1H9a1,1,0,0,0,1-1V12A1,1,0,0,0,9,11Z'/><path d='M27.34,12.68A5.94,5.94,0,0,0,23,11H22a7.84,7.84,0,0,0-4,.89A1,1,0,0,0,17,11H12a1,1,0,0,0-1,1V28a1,1,0,0,0,1,1h5a1,1,0,0,0,1-1V19a2,2,0,0,1,4,0v9a1,1,0,0,0,1,1h5a1,1,0,0,0,1-1V17A5.9,5.9,0,0,0,27.34,12.68ZM27,27H24V19a4,4,0,0,0-8,0v8H13V13h3v1a1,1,0,0,0,.62.92,1,1,0,0,0,1.09-.21c.95-1,1.7-1.71,4.29-1.71h1a4,4,0,0,1,2.92,1.09A4,4,0,0,1,27,17Z'/></svg><span>Linkedin</span>
</a>
</li>
<li>
<!-- Bagikan ke Tumblr -->
<a expr:href='"https://www.tumblr.com/share/link?url=" + data:blog.url.canonical' rel='nofollow noreferrer' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M23,15a1,1,0,0,0,1-1V9a1,1,0,0,0-1-1H19V4a1,1,0,0,0-1-1H14a1,1,0,0,0-1,1A4,4,0,0,1,9,8,1,1,0,0,0,8,9v5a1,1,0,0,0,1,1h4a1,1,0,0,0,0-2H10V9.92A6,6,0,0,0,14.92,5H17V9a1,1,0,0,0,1,1h4v3H18a1,1,0,0,0-1,1v7a3,3,0,0,0,3,3h2v3H18a4,4,0,0,1-4-4V18a1,1,0,0,0-2,0v5a6,6,0,0,0,6,6h5a1,1,0,0,0,1-1V23a1,1,0,0,0-1-1H20a1,1,0,0,1-1-1V15Z'/></svg><span>Tumblr</span>
</a>
</li>
<li>
<!-- Bagikan ke Line -->
<a expr:href='"https://timeline.line.me/social-plugin/share?url=" + data:blog.url.canonical' rel='nofollow noreferrer' target='_blank'>
<svg viewBox='0 0 32 32'><path d='M30,13.14a1,1,0,0,0-1,1,8.66,8.66,0,0,1-.18,1.67,1.36,1.36,0,0,0,0,.2A7.1,7.1,0,0,1,28,18.26a10.77,10.77,0,0,1-2.79,3.33,43.64,43.64,0,0,1-8.76,5.85l.17-.85A1.76,1.76,0,0,0,15,24.48c-6.44-.57-11.29-5-11.29-10.34C3.69,8.4,9.37,3.72,16.34,3.72A13.3,13.3,0,0,1,27.19,8.78,1,1,0,0,0,28.81,7.6,15.32,15.32,0,0,0,16.34,1.72C8.26,1.72,1.69,7.29,1.69,14.14c0,6.3,5.52,11.56,12.88,12.31L14,29.08a1,1,0,0,0,.37,1,1,1,0,0,0,.61.21,1,1,0,0,0,.45-.11,49.34,49.34,0,0,0,11-7.06,12.55,12.55,0,0,0,3.24-3.89,8.75,8.75,0,0,0,1.1-3.08s0-.08,0-.12A10.64,10.64,0,0,0,31,14.14,1,1,0,0,0,30,13.14Z'/><path d='M7,11a1,1,0,0,0-1,1v5a1,1,0,0,0,1,1h3a1,1,0,0,0,0-2H8V12A1,1,0,0,0,7,11Z'/><path d='M12,12v5a1,1,0,0,0,2,0V12a1,1,0,0,0-2,0Z'/><path d='M19,12v2.15l-2.22-2.77a1,1,0,0,0-1.11-.32A1,1,0,0,0,15,12v5a1,1,0,0,0,2,0V14.85l2.22,2.78A1,1,0,0,0,20,18a1,1,0,0,0,.33-.06A1,1,0,0,0,21,17V12a1,1,0,0,0-2,0Z'/><path d='M26,13a1,1,0,0,0,0-2H23a1,1,0,0,0-1,1v5a1,1,0,0,0,1,1h3a1,1,0,0,0,0-2H24v-.5h2a1,1,0,0,0,0-2H24V13Z'/></svg><span>Line</span>
</a>
</li>
<li>
<!-- Kirim lewat email -->
<a expr:href='"mailto:?subject=" + data:post.title + "&body=" + data:blog.url.canonical' target='_blank'>
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 3.000000)'><path d='M14.1972579,8.17124146e-14 C17.3979916,0.00978563072 19.990286,2.62120148 20,5.84554455 L20,5.84554455 L20,7.30693069 L19.99354,7.4036631 C19.9466817,7.75161611 19.6506049,8.01980198 19.2923485,8.01980198 L19.2923485,8.01980198 L19.2835029,8.0019802 L19.1721336,7.99309967 C19.0257158,7.96959451 18.889286,7.90013647 18.7831177,7.79318503 C18.6504073,7.65949573 18.5758514,7.47817413 18.5758514,7.28910891 L18.5758514,7.28910891 L18.5758514,5.84554455 C18.5518871,3.41954659 16.6054921,1.45879454 14.1972579,1.43465347 L14.1972579,1.43465347 L5.80274215,1.43465347 C3.39450789,1.45879454 1.44811291,3.41954659 1.42414861,5.84554455 L1.42414861,5.84554455 L1.42414861,12.1544554 C1.44811291,14.5804534 3.39450789,16.5412055 5.80274215,16.5653465 L5.80274215,16.5653465 L14.1972579,16.5653465 C16.6054921,16.5412055 18.5518871,14.5804534 18.5758514,12.1544554 C18.6163388,11.7890822 18.922975,11.5127474 19.2879257,11.5127474 C19.6528764,11.5127474 19.9595126,11.7890822 20,12.1544554 C19.990286,15.3787985 17.3979916,17.9902144 14.1972579,18 L14.1972579,18 L5.80274215,18 C2.599996,17.995093 0.00487110525,15.3808258 -1.42108547e-14,12.1544554 L-1.42108547e-14,12.1544554 L-1.42108547e-14,5.84554455 C-1.42108547e-14,2.61713944 2.59797615,8.17124146e-14 5.80274215,8.17124146e-14 L5.80274215,8.17124146e-14 Z M4.29443312,5.38692655 C4.48070099,5.36682207 4.6671823,5.42289927 4.81203008,5.54257426 L4.81203008,5.54257426 L8.96948253,8.85742574 C9.48880627,9.2678976 10.2192875,9.2678976 10.7386112,8.85742574 L10.7386112,8.85742574 L14.8518355,5.54257426 L14.8606811,5.54257426 L14.9473987,5.48291804 C15.2462388,5.30808809 15.6344967,5.37260085 15.8602388,5.64950495 C15.9785304,5.79800076 16.0329385,5.98799536 16.0113373,6.17714498 C15.9897361,6.36629461 15.8939207,6.53887938 15.7452455,6.65643564 L15.7452455,6.65643564 L11.6320212,9.98019802 C10.5861526,10.8280382 9.09540423,10.8280382 8.0495356,9.98019802 L8.0495356,9.98019802 L3.92746572,6.65643564 L3.8513546,6.58355583 C3.61891283,6.32594359 3.59998262,5.92999594 3.821318,5.64950495 C3.93770999,5.50163353 4.10816526,5.40703103 4.29443312,5.38692655 Z'/></g></svg><span>Email</span>
</a>
</li>
<li>
<!-- Salin link -->
<div onclick='copyFunction()'>
<svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><rect height='13' rx='2' ry='2' width='13' x='9' y='9'/><path d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/></svg><span>Copy link</span>
</div>
<input expr:value='data:blog.url' id='getlink' readonly='readonly' type='text'/>
<div class='share-notif' id='share-notif'/>
</li>
<li class='share-close'>
<label class='close' for='offshare-check'>
<svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
</label>
</li>
</ul>
<label class='full-close' for='offshare-check'/>
</div>
</div>
</b:includable>
<b:includable id='postInfo'/>
<b:includable id='postJumpLink' var='post'/>
<b:includable id='postLabels'>
<div class='post-labels byline'>
<!-- <span class='byline-label'><data:byline.label/></span> -->
<b:loop index='i' values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:loop>
</div>
</b:includable>
<b:includable id='postLocation'/>
<b:includable id='postMeta' var='post'>
<b:include data='post' name='postMetadataJSON'/>
</b:includable>
<b:includable id='postMetadataJSONImage'>
"image": {
"@type": "ImageObject",
<b:if cond='data:post.featuredImage.isResizable'>
"url": "<b:eval expr='resizeImage(data:post.featuredImage, 1200, "1200:630")'/>",
"height": 630,
"width": 1200
<b:else/>
"url": "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjutletAbLQVQq78jFP_oTEtlgOsvZuBh1I11tSZNDMEzKszbwUoNgA74Mc46KD4pPrWEHGnSWL4jbNlMwCNS_02bNsY_WbH5ifRaR7rScnIk8EzuS3DWwSlRY3P5nQPeBPOcr8ZIgBpiA/s320/median-img.png",
"height": 348,
"width": 1200
</b:if>
},
</b:includable>
<b:includable id='postMetadataJSONPublisher'>
"publisher": {
"@type": "Organization",
"name": "Jago Desain",
"logo": {
"@type": "ImageObject",
"url": "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEht3yEMTNai6c1DV6VZst0RsM9Alac6R0ftuwl8uQqILrw2kV5kGlysfAULwFj-5bgsoiRmEqD0xN-irLCtESYLYzuR9zC1G1a_IPW6hEqLDgyEksPuEsLC6mlOUpwoNiJz0RXOqRIqfQZ5/s1600/jagodesain-org.png",
"width": 206,
"height": 60
}
},
</b:includable>
<b:includable id='postPagination'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:view.url == data:blog.homepageUrl and !data:olderPageUrl'>
<div class='link no-post'><data:messages.morePosts/></div>
</b:if>
<b:include cond='data:newerPageUrl' name='postPagination.new'/>
<b:include cond='data:view.url != data:blog.homepageUrl' name='postPagination.home'/>
<b:include cond='data:olderPageUrl' name='postPagination.old'/>
</div>
</b:includable>
<b:includable id='postPagination.home'>
<a class='link home-link' expr:href='data:blog.homepageUrl'>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.500000, 2.003982)'><path d='M7.92173917,18.2568881 L3.92173915,18.2568881 C2.62561934,18.2521579 1.57473912,17.2051555 1.5652174,15.909062 L1.5652174,7.95254022 C1.56776138,7.51865617 1.76191292,7.1080734 2.09565218,6.83080108 L2.80000001,6.30906195 C3.05714116,6.03509289 3.08328826,5.61704285 2.86228858,5.31316828 C2.6412889,5.00929372 2.23552029,4.90536419 1.89565218,5.06558368 L1.89565218,5.06558368 L1.17391305,5.60471412 C0.445875565,6.16803633 0.0138352771,7.0321169 -7.10542736e-15,7.95254022 L-7.10542736e-15,15.9177576 C0.0047821894,18.0816904 1.75780637,19.8347146 3.92173915,19.8394968 L7.92173917,19.8394968 C8.35396202,19.8394968 8.70434787,19.4891109 8.70434787,19.0568881 C8.70434787,18.6246652 8.35396202,18.2742794 7.92173917,18.2742794 L7.92173917,18.2568881 Z'/><path d='M18.7913044,7.93514891 C18.7821625,7.02148476 18.3641697,6.15997273 17.652174,5.58732281 L11.6434783,0.796018441 C10.3230761,-0.26533948 8.44214141,-0.26533948 7.12173917,0.796018441 L5.21739133,2.17862714 C4.85960686,2.43555961 4.77785016,2.93388616 5.03478263,3.29167063 C5.29171511,3.6494551 5.79004165,3.7312118 6.14782612,3.47427932 L8.07826091,2.03080106 C8.83595413,1.40700621 9.92926336,1.40700621 10.6869566,2.03080106 L16.6956523,6.82210543 C17.0414821,7.0962427 17.245809,7.51128176 17.252174,7.95254022 L17.252174,15.9177576 C17.252174,17.2144262 16.2010165,18.2655837 14.9043479,18.2655837 L13.1217392,18.2655837 C12.9392451,18.2655837 12.7913044,18.1176431 12.7913044,17.935149 L12.7913044,14.3438446 C12.7913144,13.1994401 11.8661337,12.270372 10.7217392,12.2655837 L8.11304352,12.2655837 C7.56185446,12.2655837 7.03324068,12.4845427 6.64349116,12.8742922 C6.25374164,13.2640418 6.03478264,13.7926555 6.03478264,14.3438446 L6.03478264,15.7177576 C6.03478264,16.1499805 6.38516849,16.5003663 6.81739134,16.5003663 C7.24961419,16.5003663 7.60000004,16.1499805 7.60000004,15.7177576 L7.60000004,14.3438446 C7.59766759,14.208583 7.64977261,14.0780549 7.74461016,13.9815822 C7.83944772,13.8851095 7.96906617,13.830781 8.10434787,13.8308011 L10.7130435,13.8308011 C10.9915871,13.8308011 11.2173914,14.0566053 11.2173914,14.3351489 L11.2173914,14.3351489 L11.2173914,17.935149 C11.2221784,18.9834938 12.0733835,19.8308011 13.1217392,19.8308011 L14.8608696,19.8308011 C17.0267864,19.8308011 18.7826088,18.0749787 18.7826088,15.909062 L18.7913044,7.93514891 Z'/></g></svg>
</a>
</b:includable>
<b:includable id='postPagination.new'>
<a class='link newer-link' expr:href='data:newerPageUrl'>
<svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><!-- <line x1='20' x2='4' y1='12' y2='12'/> --><polyline points='10 18 4 12 10 6'/></svg>
<span><data:messages.newest/></span>
</a>
</b:includable>
<b:includable id='postPagination.old'>
<a class='link older-link' expr:href='data:olderPageUrl'>
<span><data:messages.oldest/></span>
<svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><!-- <line x1='4' x2='20' y1='12' y2='12'/> --><polyline points='14 6 20 12 14 18'/></svg>
</a>
</b:includable>
<b:includable id='postReactions'/>
<b:includable id='postShareButtons'/>
<b:includable id='postTimestamp'/>
<b:includable id='postTitle' var='post'/>
<b:includable id='previousPageLink'/>
<b:includable id='sharingButton'/>
<b:includable id='sharingButtonContent'/>
<b:includable id='sharingButtons'/>
<b:includable id='sharingButtonsMenu'/>
<b:includable id='sharingPlatformIcon'/>
<b:includable id='threadedCommentForm' var='post'/>
<b:includable id='threadedCommentJs' var='post'/>
<b:includable id='threadedComments' var='post'/>
<b:includable id='threadedComments-modifV2' var='post'>
<section class='comments threaded' expr:data-embed='data:post.embedCommentForm' expr:data-num-comments='data:post.numberOfComments' id='comments'>
<b:include name='commentsTitle'/>
<b:if cond='data:post.numberOfComments > 0'>
<div class='comments-content'>
<ol id='comment-holder'>
<b:loop values='data:post.comments where (c => not c.inReplyTo)' var='commentLevel1'>
<li class='comment' expr:id='"c" + data:commentLevel1.id'>
<b:class cond='data:post.adminClass' name='author-comment'/>
<b:class cond='not data:post.adminClass' name='user-comment'/>
<b:include data='{level: data:commentLevel1,d: true}' name='commentblock'/>
<!--<div class='comment-actions'>
<span class='reply-to' expr:data-reply-to='data:commentLevel1.id'>Balas</span>
</div>-->
<b:with value='data:post.comments where (c => c.inReplyTo == data:commentLevel1.id)' var='commentL2'>
<b:if cond='data:commentL2.size != "0"'>
<div class='comment-replies'>
<input class='thread-show hidden' expr:id='"off-" + data:commentLevel1.id' type='checkbox'/>
<div class='comment-thread inline-thread' expr:id='"c" + data:commentLevel1.id + "-rt"'>
<label class='thread-toggle thread-expanded' expr:for='"off-" + data:commentLevel1.id'>
<svg class='thread-arrow line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><polyline points='6 9 12 15 18 9'/></svg>
<span class='thread-count'>Balasan</span>
</label>
<ul class='thread-chrome thread-expanded'>
<b:loop values='data:commentL2' var='commentLevel2'>
<li class='comment' expr:id='"c" + data:commentLevel2.id'>
<b:class cond='data:post.adminClass' name='author-comment'/>
<b:class cond='not data:post.adminClass' name='user-comment'/>
<b:include data='{level: data:commentLevel2,d: true}' name='commentblock'/>
</li>
</b:loop>
</ul>
</div>
<b:if cond='data:post.allowNewComments'>
<div class='comment-reply'>
<a class='reply-to' expr:data-reply-to='data:commentLevel1.id' href='javascript:;' target='_self'><svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><polyline points='15 14 20 9 15 4'/><path d='M4 20v-7a4 4 0 0 1 4-4h12'/></svg>Balas</a>
</div>
</b:if>
</div>
</b:if>
</b:with>
<b:if cond='data:commentL2.size != "2" and data:post.allowNewComments'>
<div class='comment-actions secondary-text'>
<a class='comment-reply reply-to' expr:data-comment-id='data:commentLevel1.id' expr:data-reply-to='data:commentLevel1.id' href='javascript:;' target='_self'><svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><polyline points='15 14 20 9 15 4'/><path d='M4 20v-7a4 4 0 0 1 4-4h12'/></svg>Balas</a>
</div>
</b:if>
</li>
</b:loop>
</ol>
</div>
<b:if cond='data:post.allowNewComments'>
<div class='comment-add'>
<script>var comment = true;</script>
<div aria-label='Berkomentar' class='hidden' id='addcomment' role='button'><data:messages.postAComment/></div>
</div>
</b:if>
<b:else/>
<script>var comment = false;</script>
</b:if>
<div class='comment-form'>
<b:if cond='data:post.allowNewComments'>
<div id='threaded-comment-form'>
<b:if cond='data:this.messages.blogComment != ""'>
<p><data:this.messages.blogComment/></p>
</b:if>
<iframe class='blogger-iframe-colorize blogger-comment-from-post' expr:data-src='data:post.commentFormIframeSrc appendParams {skin: "contempo"}' expr:src='data:post.commentFormIframeSrc appendParams {skin: "contempo"}' height='296' id='comment-editor' name='comment-editor' width='100'/>
</div>
<b:else/>
<div class='comment-disable'>
<data:post.noNewCommentsText/>
</div>
</b:if>
</div>
<b:if cond='data:showCmtPopup'>
<div id='comment-popup'>
<iframe allowtransparency='allowtransparency' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'/>
</div>
</b:if>
</section>
<b:if cond='data:post.allowNewComments'>
<script>/*<![CDATA[*/ document.addEventListener("DOMContentLoaded", function() { var a=document, b = a.getElementById("comment-editor"), d = b.getAttribute("data-src"); if (b.setAttribute("src", d), 1 == comment) { var f = a.getElementsByClassName("reply-to"), c = a.getElementById("threaded-comment-form"), h = f.length, k = function(b, d, e, f) { b.addEventListener("click", function() { var c = b.getAttribute("data-reply-to"); a.getElementById("c" + c).appendChild(d); a.getElementById("threaded-comment-form").className = 'comment-replybox-single'; a.getElementById("addcomment").className = 'comment-reply button outline'; e.src = f + "&parentID=" + c }) }; for (i = 0; i < h; i++) k(f[i], c, b, d); var l = a.getElementsByClassName("comment-form")[0]; a.getElementById("addcomment").addEventListener("click", function() { l.appendChild(c); a.getElementById("threaded-comment-form").className = 'comment-replybox-thread'; a.getElementById("addcomment").className = 'comment-reply hidden'; b.src = d }) } }); /*]]>*/</script>
</b:if>
</b:includable>
<b:includable id='titlePostWidget'>
<div class='blog-title widget-title'>
<h3 class='heading'>
<b:if cond='data:view.isMultipleItems'>
<b:if cond='data:view.isHomepage'><data:messages.latestPosts/>
<b:else/>
<b:if cond='data:view.search.label'>
<data:messages.labels/>: <b><data:blog.pageName/></b>
<b:elseif cond='data:view.search.query'/>
<data:messages.search/>: <b><data:view.search.query/></b>
<b:else/>
<data:messages.posts/>
</b:if>
<b:if cond='data:view.isArchive'><data:messages.blogArchive/>: <b><data:blog.pageName/></b></b:if>
</b:if>
</b:if>
</h3>
<b:if cond='data:view.isHomepage'>
<a class='view-all' expr:href='data:blog.searchUrl'><data:messages.viewAll/></a>
</b:if>
</div>
</b:includable>
</b:widget>
<b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML4' locked='true' title='Post Middle Ads' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<!-- replace all the code here with your ad code --><div class='ads-here' style='min-height:100px'><i class='ads-img' style='width:100%'></i></div>]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='ads-content' id='iklan-tengah'>
<data:content/>
<script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("post-body"); var midAd3 = document.getElementById("HTML4"); var showAd3 = tgt.getElementsByTagName("p"); if (showAd3.length > 0) {insertAfter(midAd3,showAd3[20]);}; /*]]>*/</script>
</div>
</b:includable>
</b:widget>
<b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML2' locked='true' title='Ad Top Post' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<!-- replace all the code here with your ad code <div class='ads-here text' style='min-height:80px'><div class='ads-text'><i></i><i></i><i></i><i></i></div></div> --->]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='ads-content' id='iklan-atas'>
<data:content/>
<script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("iklanAtas"); var adpic = document.getElementById("HTML2"); var pic01 = tgt.getElementsByClassName("iklan-atas"); if (pic01.length > 0) {insertAfter(adpic,pic01[0]);}; /*]]>*/</script>
</div>
</b:includable>
</b:widget>
<b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML3' locked='true' title='Ads Under Post' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<div class='ads-here' style='min-height:100px'><i class='ads-img' style='width:100%'></i></div>]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='ads-content' id='iklan-bawah'>
<data:content/>
<script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("iklanBawah"); var adpic = document.getElementById("HTML3"); var pic01 = tgt.getElementsByClassName("iklan-bawah"); if (pic01.length > 0) {insertAfter(adpic,pic01[0]);}; /*]]>*/</script>
</div>
</b:includable>
</b:widget>
</b:section>
<!-- Widget slot tambahan -->
<b:section cond='data:view.isMultipleItems' id='add-widget' maxwidgets='3' showaddelement='true'>
<b:widget cond='!data:view.isPreview' id='HTML005' locked='true' title='Ads HTML' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<!-- replace all the code here with your ad code --><div class='ads-here'><i class='ads-img'></i><i class='ads-content'></i><i class='ads-button'></i></div>]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='ads-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
</main>
</div>
<aside class='sidebar'>
<b:section id='sidebar-widget' showaddelement='true'>
<b:widget cond='data:view.isHomepage or data:view.isPost' id='PopularPosts00' locked='false' title='Popular Posts' type='PopularPosts' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='numItemsToShow'>10</b:widget-setting>
<b:widget-setting name='showThumbnails'>true</b:widget-setting>
<b:widget-setting name='showSnippets'>true</b:widget-setting>
<b:widget-setting name='timeRange'>LAST_WEEK</b:widget-setting>
</b:widget-settings>
<b:includable id='main' var='this'>
<b:include name='widget-title'/>
<b:include name='snippetedPosts'/>
</b:includable>
<b:includable id='blogThisShare'/>
<b:includable id='bylineByName' var='byline'/>
<b:includable id='bylineRegion' var='regionItems'/>
<b:includable id='commentsLink'>
<div class='comments-bubble'>
<span><data:post.numberOfComments/></span>
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M10.0067501,0 C11.62449,0 13.2360653,0.399066203 14.6679897,1.15403251 C19.5432254,3.72637977 21.4181128,9.7854909 18.847518,14.6623794 C17.0941592,17.9879311 13.6420414,20 9.99530173,20 C9.28286212,20 8.56337738,19.9233581 7.8474152,19.7647888 C7.44408103,19.6749328 7.18957541,19.2749857 7.27852028,18.8715148 C7.36746515,18.4680439 7.76639611,18.2152138 8.1723722,18.302427 C11.8966084,19.1305114 15.7414927,17.3430824 17.523032,13.9637933 C19.7087862,9.81808572 18.1148236,4.66546271 13.9696404,2.47896754 C12.7525927,1.83676166 11.3823133,1.49759944 10.0058694,1.49759944 L10.0058694,1.49759944 C5.31028477,1.49759944 1.49710367,5.31119235 1.49710367,9.99867859 C1.49534238,11.3641369 1.82822517,12.7234286 2.45964569,13.9311985 L2.45964569,13.9311985 L2.65162571,14.3064793 C2.8867572,14.7469497 2.93871509,15.294014 2.78636398,15.7891028 C2.57589047,16.3440955 2.40064266,16.8841122 2.25621732,17.4214861 C2.8180671,17.2523455 3.50408744,17.0030392 3.99988905,16.8224464 L3.99988905,16.8224464 L4.20331742,16.7493283 C4.5881581,16.6057349 5.02055346,16.8092323 5.16145622,17.1986081 C5.30235899,17.587103 5.10069191,18.0170022 4.71232866,18.1570718 L4.71232866,18.1570718 L4.51154222,18.2301898 C3.77004141,18.4988768 2.7555415,18.867991 2.0704018,19.0212747 C2.01227941,19.0336079 1.9497538,19.0415364 1.89251206,19.0397745 C1.43281678,19.0397745 1.15277254,18.853896 0.998660135,18.6970885 C0.76176736,18.4565916 0.649045147,18.1191913 0.662254782,17.6945778 C0.664016066,17.6461261 0.670180562,17.5959124 0.681628912,17.5474607 C0.859518654,16.7898516 1.09112758,16.0340043 1.37117182,15.3019425 C1.39142659,15.2305863 1.3790976,15.101088 1.32185585,14.9927322 L1.32185585,14.9927322 L1.12899519,14.6183324 C0.390136315,13.2035414 -0.00174950235,11.6028719 5.87135273e-06,9.99779765 C5.87135273e-06,4.48486984 4.48424231,0 9.99530173,0 L9.99530173,0 Z M9.99565399,8.80949654 C10.6517325,8.80949654 11.1845211,9.34334669 11.1845211,9.99876668 C11.1845211,10.6541867 10.6517325,11.1880368 9.99565399,11.1880368 C9.33957549,11.1880368 8.8067869,10.6541867 8.8067869,9.99876668 C8.8067869,9.34334669 9.33957549,8.80949654 9.99565399,8.80949654 Z M14.3988654,8.80949654 C15.0549439,8.80949654 15.5877325,9.34334669 15.5877325,9.99876668 C15.5877325,10.6541867 15.0549439,11.1880368 14.3988654,11.1880368 C13.7427869,11.1880368 13.2099983,10.6541867 13.2099983,9.99876668 C13.2099983,9.34334669 13.7427869,8.80949654 14.3988654,8.80949654 Z M5.59235449,8.80984892 C6.248433,8.80984892 6.78122158,9.34281813 6.78122158,9.99911906 C6.78122158,10.654539 6.248433,11.1875083 5.59235449,11.1875083 C4.93627599,11.1875083 4.40348741,10.654539 4.40348741,9.99911906 C4.40348741,9.34281813 4.93627599,8.80984892 5.59235449,8.80984892 Z'/></g></svg>
</div>
</b:includable>
<b:includable id='commentsLinkIframe'/>
<b:includable id='emailPostIcon'/>
<b:includable id='facebookShare'/>
<b:includable id='footerBylines'/>
<b:includable id='googlePlusShare'/>
<b:includable id='headerByline'/>
<b:includable id='linkShare'/>
<b:includable id='otherSharingButton'/>
<b:includable id='platformShare'/>
<b:includable id='postAuthor'/>
<b:includable id='postCommentsLink'/>
<b:includable id='postJumpLink'><b:comment>Removed</b:comment></b:includable>
<b:includable id='postLabels'>
<div class='item-label'>
<b:loop index='num' values='data:post.labels' var='label'>
<b:if cond='data:num == 0'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'/>
</b:if>
<b:if cond='data:num == 1'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'/>
</b:if>
</b:loop>
</div>
</b:includable>
<b:includable id='postLocation'/>
<b:includable id='postReactions'/>
<b:includable id='postShareButtons'/>
<b:includable id='postTimestamp'>
<div class='item-timestamp'>
<time class='published' expr:datetime='data:post.date.iso8601'><data:post.date/></time>
</div>
</b:includable>
<b:includable id='sharingButton'/>
<b:includable id='sharingButtonContent'/>
<b:includable id='sharingButtons'/>
<b:includable id='sharingButtonsMenu'/>
<b:includable id='sharingPlatformIcon'/>
<b:includable id='snippetedPostByline'/>
<b:includable id='snippetedPostContent'>
<b:include cond='data:this.postDisplay.showFeaturedImage and data:post.featuredImage' name='snippetedPostThumbnail'/>
<div class='item-content'>
<b:include cond='data:this.postDisplay.showTitle' name='snippetedPostTitle'/>
<b:include cond='data:this.postDisplay.showSnippet' name='snippetedPostEntry'/>
<b:include name='snippetedPostHeader'/>
</div>
</b:includable>
<b:includable id='snippetedPostEntry'>
<b:comment>Dont show.</b:comment>
<!--<div class='item-entry'>
<b:eval expr='snippet(data:post.body, {length: 90, links: true, linebreaks: false})'/>
</div>-->
</b:includable>
<b:includable id='snippetedPostHeader'>
<div class='item-header'>
<div class='item-info'>
<b:include cond='data:post.labels' name='postLabels'/>
<div class='item-published'>
<b:include name='postTimestamp'/>
</div>
</div>
<div class='item-comment'>
<b:include cond='data:post.allowComments' name='commentsLink'/>
<b:include name='postJumpLink'/>
</div>
</div>
</b:includable>
<b:includable id='snippetedPostThumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.url'>
<img class='post-thumb lazy' expr:alt='data:post.title' expr:data-src='resizeImage(data:post.featuredImage, 400, "26:9")' src='data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='/>
</a>
</div>
</b:includable>
<b:includable id='snippetedPostTitle'>
<b:if cond='data:post.title != ""'>
<h4 class='item-title'><a expr:href='data:post.url'><data:post.title/></a></h4>
</b:if>
</b:includable>
<b:includable id='snippetedPosts'>
<div class='item-popular' role='feed'>
<!-- Don't render the post that we're currently already looking at. -->
<b:loop values='data:posts filter (p => p.id != data:view.postId)' var='post'>
<article class='post'>
<b:class cond='!data:this.postDisplay.showFeaturedImage' name='no-thumbnail'/>
<b:include name='snippetedPostContent'/>
</article>
</b:loop>
</div>
</b:includable>
</b:widget>
<b:widget cond='!data:view.isSingleItem' id='Label00' locked='false' title='Label' type='Label' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='sorting'>ALPHA</b:widget-setting>
<b:widget-setting name='display'>CLOUD</b:widget-setting>
<b:widget-setting name='selectedLabelsList'/>
<b:widget-setting name='showType'>ALL</b:widget-setting>
<b:widget-setting name='showFreqNumbers'>true</b:widget-setting>
</b:widget-settings>
<b:includable id='main' var='this'>
<b:include name='widget-title'/>
<b:include name='content'/>
</b:includable>
<b:includable id='cloud'>
<b:loop index='tags' values='data:labels' var='label'>
<b:if cond='data:tags <= 3'>
<span class='label-size'>
<b:class expr:name='"label-size-" + data:label.cssSize'/>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
</a>
</span>
</b:if>
<b:if cond='data:tags == 4'>
<div class='label-show'>
<input class='label-input hidden' id='offall-label' type='checkbox'/>
<div class='label-all'>
<b:loop index='alltags' values='data:labels' var='label'>
<b:if cond='data:alltags >= 4'>
<span class='label-size'>
<b:class expr:name='"label-size-" + data:label.cssSize'/>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
</a>
</span>
</b:if>
</b:loop>
</div>
<label class='label-more' expr:data-hide='data:messages.showLess' expr:data-show='data:messages.showMore' for='offall-label'>
<span><b:eval expr='"+" + (data:labels.length - 4) + " more"'/></span>
<svg viewBox='0 0 512 512'><path d='M256 294.1L383 167c9.4-9.4 24.6-9.4 33.9 0s9.3 24.6 0 34L273 345c-9.1 9.1-23.7 9.3-33.1.7L95 201.1c-4.7-4.7-7-10.9-7-17s2.3-12.3 7-17c9.4-9.4 24.6-9.4 33.9 0l127.1 127z'/></svg>
</label>
</div>
</b:if>
</b:loop>
</b:includable>
<b:includable id='content'>
<div class='widget-content'>
<b:class expr:name='data:this.display + "-label"'/>
<b:include cond='data:this.display == "list"' name='list'/>
<b:include cond='data:this.display == "cloud"' name='cloud'/>
</div>
</b:includable>
<b:includable id='list'>
<ul>
<b:loop index='tags' values='data:labels' var='label'>
<b:if cond='data:tags <= 3'>
<li>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
<svg class='label-icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(4.000000, 2.000000)'><path d='M11.5258621,0 L4.62931034,0 C1.78448276,0 0,1.9858782 0,5.17210944 L0,18.3230362 C0,19.2491977 0.733326703,20 1.63793103,20 C1.91180194,20 2.18135035,19.9300723 2.42241379,19.7969991 L8.03448276,16.6813769 L14.5689655,19.8146514 C14.7461483,19.8908228 14.9456376,19.8917645 15.1234989,19.8172691 C15.3013603,19.7427737 15.4430062,19.598951 15.5172414,19.4174757 C15.6267768,19.0830842 15.4940188,18.7157283 15.1982759,18.5348632 L8.70689655,15.4280671 C8.28279792,15.1893907 7.76892621,15.1893907 7.34482759,15.4280671 L1.72413793,18.5348632 C1.65968122,18.5709713 1.58169809,18.5709713 1.51724138,18.5348632 C1.45595472,18.494491 1.41993354,18.4240845 1.42241379,18.3495146 L1.42241379,5.17210944 C1.43103448,2.81553398 2.5862069,1.47396293 4.65517241,1.47396293 L11.5517241,1.47396293 C14.2068966,1.47396293 14.5948276,3.68049426 14.5948276,5.00441306 L14.5948276,5.60458959 L7.12931034,5.60458959 C6.93950091,5.61148655 6.76015756,5.69536443 6.63079621,5.83774183 C6.50143487,5.98011924 6.43267077,6.16931284 6.43965517,6.36363636 C6.44874481,6.74967865 6.75225353,7.06042014 7.12931034,7.06972639 L14.5689655,7.06972639 L14.5689655,14.7925861 C14.5689655,15.1971724 14.8893135,15.5251545 15.2844828,15.5251545 C15.6763098,15.5251836 15.9952792,15.2025475 16,14.8014122 L16,14.8014122 L16,5.00441306 C16,1.9152692 14.2931034,0 11.5258621,0 Z'/></g></svg>
</a>
</li>
</b:if>
<b:if cond='data:tags == 4'>
<li class='label-show'>
<input class='label-input hidden' id='offall-label' type='checkbox'/>
<div class='label-all'>
<ul>
<b:loop index='alltags' values='data:labels' var='label'>
<b:if cond='data:alltags >= 4'>
<li>
<a class='label-name' expr:href='data:label.url'>
<span class='label-title'><data:label.name/></span>
<b:if cond='data:this.showFreqNumbers'>
<span class='label-count'><data:label.count/></span>
</b:if>
<svg class='label-icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(4.000000, 2.000000)'><path d='M11.5258621,0 L4.62931034,0 C1.78448276,0 0,1.9858782 0,5.17210944 L0,18.3230362 C0,19.2491977 0.733326703,20 1.63793103,20 C1.91180194,20 2.18135035,19.9300723 2.42241379,19.7969991 L8.03448276,16.6813769 L14.5689655,19.8146514 C14.7461483,19.8908228 14.9456376,19.8917645 15.1234989,19.8172691 C15.3013603,19.7427737 15.4430062,19.598951 15.5172414,19.4174757 C15.6267768,19.0830842 15.4940188,18.7157283 15.1982759,18.5348632 L8.70689655,15.4280671 C8.28279792,15.1893907 7.76892621,15.1893907 7.34482759,15.4280671 L1.72413793,18.5348632 C1.65968122,18.5709713 1.58169809,18.5709713 1.51724138,18.5348632 C1.45595472,18.494491 1.41993354,18.4240845 1.42241379,18.3495146 L1.42241379,5.17210944 C1.43103448,2.81553398 2.5862069,1.47396293 4.65517241,1.47396293 L11.5517241,1.47396293 C14.2068966,1.47396293 14.5948276,3.68049426 14.5948276,5.00441306 L14.5948276,5.60458959 L7.12931034,5.60458959 C6.93950091,5.61148655 6.76015756,5.69536443 6.63079621,5.83774183 C6.50143487,5.98011924 6.43267077,6.16931284 6.43965517,6.36363636 C6.44874481,6.74967865 6.75225353,7.06042014 7.12931034,7.06972639 L14.5689655,7.06972639 L14.5689655,14.7925861 C14.5689655,15.1971724 14.8893135,15.5251545 15.2844828,15.5251545 C15.6763098,15.5251836 15.9952792,15.2025475 16,14.8014122 L16,14.8014122 L16,5.00441306 C16,1.9152692 14.2931034,0 11.5258621,0 Z'/></g></svg>
</a>
</li>
</b:if>
</b:loop>
</ul>
</div>
<label class='label-more' expr:data-hide='data:messages.showLess' expr:data-show='data:messages.showMore' for='offall-label'>
<span><b:eval expr='"+" + (data:labels.length - 4) + " more"'/></span>
<svg viewBox='0 0 512 512'><path d='M256 294.1L383 167c9.4-9.4 24.6-9.4 33.9 0s9.3 24.6 0 34L273 345c-9.1 9.1-23.7 9.3-33.1.7L95 201.1c-4.7-4.7-7-10.9-7-17s2.3-12.3 7-17c9.4-9.4 24.6-9.4 33.9 0l127.1 127z'/></svg>
</label>
</li>
</b:if>
</b:loop>
</ul>
</b:includable>
</b:widget>
</b:section>
<b:section cond='data:blog.isMobileRequest == "false"' id='sidebar-sticky' showaddelement='true'>
<b:widget cond='!data:view.isPreview' id='HTML004' locked='true' title='Ads Sidebar' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<!-- replace all the code here with your ad code --><div class='ads-here in-article'><i class='ads-img'></i><i class='ads-content'></i><i class='ads-button'></i></div>]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='ads-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
</aside>
</div>
<footer class='footbar'>
<div class='credit'>
<p class='credit-content'>© <span id='copyrightYear'><script>var d = new Date(); var n = d.getFullYear(); document.getElementById('copyrightYear').innerHTML = n;</script></span> ‧ <a expr:href='data:blog.homepageUrl'><data:blog.title/></a>. All Rights Reserved <span class='creator'/><a class='creator' href='https://protemplates.in/'>Pro Templates</a></p>
</div>
</footer>
<b:else/>
<!-- Page Error -->
<section class='error-container'>
<div class='error-content'>
<h3><span>404</span>Uh oh! That's an error.</h3>
<p>The page you've requested can't be found. Why don't you browse around?</p>
<a class='button' expr:href='data:blog.homepageUrl'>Back to home</a>
</div>
</section>
</b:if>
</div>
<b:if cond='!data:view.isError'>
<div class='asideIner'>
<b:class cond='data:view.isSingleItem' name='singleItem'/>
<b:section id='nav-widget' showaddelement='false'>
<b:widget id='HTML00' locked='true' title='Menu Navigasi' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<!-- This widget can only be edited on the EDIT HTML template menu -->]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<!-- Ini adalah kode Menu Navigasi: Anda bisa mengedit/menambahkan/menghapus menu dibagian ini -->
<ul class='navigation-menu' itemscope='itemscope' itemtype='https://schema.org/SiteNavigationElement'>
<!-- Homepage link -->
<li class='home'>
<a class='link' expr:href='data:blog.homepageUrl' itemprop='url'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.500000, 2.003982)'><path class='svg-c' d='M7.92173917,18.2568881 L3.92173915,18.2568881 C2.62561934,18.2521579 1.57473912,17.2051555 1.5652174,15.909062 L1.5652174,7.95254022 C1.56776138,7.51865617 1.76191292,7.1080734 2.09565218,6.83080108 L2.80000001,6.30906195 C3.05714116,6.03509289 3.08328826,5.61704285 2.86228858,5.31316828 C2.6412889,5.00929372 2.23552029,4.90536419 1.89565218,5.06558368 L1.89565218,5.06558368 L1.17391305,5.60471412 C0.445875565,6.16803633 0.0138352771,7.0321169 -7.10542736e-15,7.95254022 L-7.10542736e-15,15.9177576 C0.0047821894,18.0816904 1.75780637,19.8347146 3.92173915,19.8394968 L7.92173917,19.8394968 C8.35396202,19.8394968 8.70434787,19.4891109 8.70434787,19.0568881 C8.70434787,18.6246652 8.35396202,18.2742794 7.92173917,18.2742794 L7.92173917,18.2568881 Z'/><path d='M18.7913044,7.93514891 C18.7821625,7.02148476 18.3641697,6.15997273 17.652174,5.58732281 L11.6434783,0.796018441 C10.3230761,-0.26533948 8.44214141,-0.26533948 7.12173917,0.796018441 L5.21739133,2.17862714 C4.85960686,2.43555961 4.77785016,2.93388616 5.03478263,3.29167063 C5.29171511,3.6494551 5.79004165,3.7312118 6.14782612,3.47427932 L8.07826091,2.03080106 C8.83595413,1.40700621 9.92926336,1.40700621 10.6869566,2.03080106 L16.6956523,6.82210543 C17.0414821,7.0962427 17.245809,7.51128176 17.252174,7.95254022 L17.252174,15.9177576 C17.252174,17.2144262 16.2010165,18.2655837 14.9043479,18.2655837 L13.1217392,18.2655837 C12.9392451,18.2655837 12.7913044,18.1176431 12.7913044,17.935149 L12.7913044,14.3438446 C12.7913144,13.1994401 11.8661337,12.270372 10.7217392,12.2655837 L8.11304352,12.2655837 C7.56185446,12.2655837 7.03324068,12.4845427 6.64349116,12.8742922 C6.25374164,13.2640418 6.03478264,13.7926555 6.03478264,14.3438446 L6.03478264,15.7177576 C6.03478264,16.1499805 6.38516849,16.5003663 6.81739134,16.5003663 C7.24961419,16.5003663 7.60000004,16.1499805 7.60000004,15.7177576 L7.60000004,14.3438446 C7.59766759,14.208583 7.64977261,14.0780549 7.74461016,13.9815822 C7.83944772,13.8851095 7.96906617,13.830781 8.10434787,13.8308011 L10.7130435,13.8308011 C10.9915871,13.8308011 11.2173914,14.0566053 11.2173914,14.3351489 L11.2173914,14.3351489 L11.2173914,17.935149 C11.2221784,18.9834938 12.0733835,19.8308011 13.1217392,19.8308011 L14.8608696,19.8308011 C17.0267864,19.8308011 18.7826088,18.0749787 18.7826088,15.909062 L18.7913044,7.93514891 Z'/></g></svg>
<!-- Teks link -->
<span class='name' itemprop='name'><data:messages.home/></span>
</a>
</li>
<!-- Category/dropdown menu -->
<li class='submenu break'>
<input class='sub-menu hidden' id='offsub-menu1' name='dropdown-menu' type='checkbox'/>
<label class='link' for='offsub-menu1'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M19.2351648,10.6772248 C19.6575716,10.6772248 20,10.334646 20,9.91205367 L20,8.89182545 C20,4.84609283 18.1978022,2.87599695 14.5054945,2.87599695 L11.7802198,2.87599695 C11.3365661,2.87810205 10.9172736,2.67324132 10.6461538,2.32190748 L9.76703297,1.15216305 C9.19910638,0.423105508 8.32609921,-0.0022260158 7.4021978,0 L5.48571429,0 C1.84615385,0 0,2.10203071 0,6.25330418 L0,13.7554997 C0,17.6077407 2.39120879,20 6.25054945,20 L13.7406593,20 C17.5912088,20 19.9912088,17.6077407 19.9912088,13.7554997 C19.9491205,13.3621883 19.6173632,13.0639212 19.221978,13.0639212 C18.8265928,13.0639212 18.4948355,13.3621883 18.4527473,13.7554997 C18.4527473,16.7897991 16.7824176,18.4696577 13.7406593,18.4696577 L6.24175824,18.4696577 C3.2,18.4696577 1.52967033,16.7985942 1.52967033,13.7554997 L1.52967033,13.0255088 L13.8373626,13.0255088 C14.2597694,13.0255088 14.6021978,12.68293 14.6021978,12.2603376 C14.6021978,11.8377452 14.2597694,11.4951664 13.8373626,11.4951664 L1.52967033,11.4951664 L1.52967033,6.21812389 C1.52967033,2.91117723 2.70769231,1.49517082 5.47692308,1.49517082 L7.41098901,1.49517082 C7.854606,1.50172958 8.27146542,1.70863441 8.54505495,2.05805535 L9.42417582,3.21900471 C9.98216939,3.95874311 10.8538928,4.39479629 11.7802198,4.39754422 L14.4967033,4.39754422 C17.3538462,4.39754422 18.4615385,5.6728295 18.4615385,8.89182545 L18.4615385,9.91205367 C18.461525,10.1165228 18.5433112,10.3124919 18.6886527,10.4562448 C18.8339941,10.5999978 19.030799,10.6795751 19.2351648,10.6772248 Z'/></g></svg>
<!-- Teks link -->
<span class='name' itemprop='name'>Category</span>
<!-- Arrow Icon -->
<svg class='icon name' viewBox='0 0 512 512'><path d='M256 294.1L383 167c9.4-9.4 24.6-9.4 33.9 0s9.3 24.6 0 34L273 345c-9.1 9.1-23.7 9.3-33.1.7L95 201.1c-4.7-4.7-7-10.9-7-17s2.3-12.3 7-17c9.4-9.4 24.6-9.4 33.9 0l127.1 127z'/></svg>
</label>
<ul class='sub-first'>
<li itemprop='name'><a expr:href='data:blog.homepageUrl + "search/label/Blogger"' itemprop='url'>Blogger</a></li>
<li itemprop='name'><a expr:href='data:blog.homepageUrl + "search/label/PLACES%20IN%20CHINA"' itemprop='url'>Wordpress</a></li>
<li itemprop='name'><a expr:href='data:blog.homepageUrl + "search/label/PLACES%20IN%20ENGLAND"' itemprop='url'>World</a></li>
<li itemprop='name'><a expr:href='data:blog.homepageUrl + "search/label/List"' itemprop='url'>List</a></li>
<li itemprop='name'><a expr:href='data:blog.homepageUrl + "search/label/Preview"' itemprop='url'>Preview</a></li>
<li itemprop='name'><a expr:href='data:blog.homepageUrl + "search/label/Tutorial"' itemprop='url'>Tutorial</a></li>
</ul>
</li>
<!-- About me link -->
<li>
<a class='link' href='javascript:void(0)' itemprop='url'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(4.000000, 2.000000)'><path d='M5.88450545,12.7673223 C7.32107647,12.6441193 8.76545208,12.6441193 10.2020231,12.7673223 C10.9876051,12.819974 11.7678606,12.9347129 12.5355802,13.1104786 C14.1961639,13.4448359 15.2799133,14.1047518 15.7343888,15.0726283 C16.0974922,15.8767717 16.08789,16.80158 15.7081691,17.5979063 C15.2449536,18.5657829 14.1612043,19.2256987 12.4744008,19.568855 C11.7092951,19.7410988 10.9319902,19.8528915 10.1495836,19.9032123 C9.2843321,20 8.5501793,20 7.86846599,20 L7.59752865,20 C7.21132744,19.9581349 6.91855939,19.6299512 6.91855939,19.2388971 C6.91855939,18.8478429 7.21132744,18.5196592 7.59752865,18.4777941 L7.59752865,18.4777941 L8.19552997,18.4776566 C8.7948969,18.470645 9.39795098,18.4425986 10.0010051,18.3898053 C10.7124372,18.3432116 11.4194216,18.2432131 12.1160643,18.0906435 C13.3134326,17.8266771 14.0650652,17.4483254 14.3010429,16.9467893 C14.484604,16.5631348 14.484604,16.1161987 14.3010429,15.7325442 C14.0650652,15.2222093 13.3134326,14.8262598 12.1422841,14.5886901 C11.4348379,14.4289038 10.7159053,14.3259265 9.99226515,14.2807293 C8.64034215,14.1575279 7.28012802,14.1575279 5.92820502,14.2807293 C5.21388459,14.3273105 4.50399397,14.4273069 3.80440586,14.5798912 C2.6070376,14.8438575 1.86414489,15.2222093 1.61942729,15.7237453 C1.53272302,15.9142245 1.48799947,16.1213408 1.48832858,16.3308679 C1.48783807,16.5432444 1.53254045,16.7532629 1.61942729,16.9467893 C2.03541113,17.5187562 2.66831687,17.8915039 3.36741014,17.9762581 L3.36741014,17.9762581 L3.46883074,18.003768 C3.69882672,18.0836728 3.87936538,18.2709306 3.94969781,18.5098707 C4.03007773,18.7829451 3.95322349,19.0783682 3.75020277,19.2767179 C3.54718205,19.4750675 3.25156561,19.5435453 2.98285392,19.4544696 C1.85607336,19.2695203 0.86780853,18.5933528 0.282220408,17.6067052 C-0.0940734694,16.8075691 -0.0940734694,15.8805633 0.282220408,15.0814272 C0.745435864,14.087154 1.82918523,13.4448359 3.49850886,13.1016797 C4.28445329,12.9305221 5.08200812,12.8187582 5.88450545,12.7673223 Z M5.96471469,0.407206951 C7.95471011,-0.421671419 10.2447427,0.0383955276 11.7663081,1.57274551 C13.2878734,3.1070955 13.7410933,5.41333076 12.9145002,7.41538679 C12.0879072,9.41744281 10.1444105,10.7207439 7.99082479,10.717191 C5.05464341,10.7123299 2.67695692,8.31466134 2.67695692,5.35866706 L2.67695692,5.35866706 L2.68189526,5.12722783 C2.77053718,3.05238043 4.04579053,1.20648252 5.96471469,0.407206951 Z M7.99082479,1.53114502 C6.98099466,1.52881803 6.01172919,1.93104061 5.29685022,2.6490918 C4.58197126,3.367143 4.18021208,4.34202145 4.18021208,5.35866706 C4.17668538,6.91110569 5.10286315,8.31266199 6.52650415,8.90922336 C7.95014515,9.50578474 9.59058472,9.17974169 10.6822224,8.08325997 C11.77386,6.98677826 12.1014841,5.3360245 11.512191,3.90141287 C10.9228979,2.46680125 9.53286415,1.53114502 7.99082479,1.53114502 Z'/></g></svg>
<!-- Teks link -->
<span class='name' itemprop='name'>About</span>
</a>
</li>
<!-- Contact link -->
<li class='break'>
<a class='link' expr:href='data:blog.homepageUrl + "p/contact.html"' itemprop='url'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 3.000000)'><path d='M14.1972579,8.17124146e-14 C17.3979916,0.00978563072 19.990286,2.62120148 20,5.84554455 L20,5.84554455 L20,7.30693069 L19.99354,7.4036631 C19.9466817,7.75161611 19.6506049,8.01980198 19.2923485,8.01980198 L19.2923485,8.01980198 L19.2835029,8.0019802 L19.1721336,7.99309967 C19.0257158,7.96959451 18.889286,7.90013647 18.7831177,7.79318503 C18.6504073,7.65949573 18.5758514,7.47817413 18.5758514,7.28910891 L18.5758514,7.28910891 L18.5758514,5.84554455 C18.5518871,3.41954659 16.6054921,1.45879454 14.1972579,1.43465347 L14.1972579,1.43465347 L5.80274215,1.43465347 C3.39450789,1.45879454 1.44811291,3.41954659 1.42414861,5.84554455 L1.42414861,5.84554455 L1.42414861,12.1544554 C1.44811291,14.5804534 3.39450789,16.5412055 5.80274215,16.5653465 L5.80274215,16.5653465 L14.1972579,16.5653465 C16.6054921,16.5412055 18.5518871,14.5804534 18.5758514,12.1544554 C18.6163388,11.7890822 18.922975,11.5127474 19.2879257,11.5127474 C19.6528764,11.5127474 19.9595126,11.7890822 20,12.1544554 C19.990286,15.3787985 17.3979916,17.9902144 14.1972579,18 L14.1972579,18 L5.80274215,18 C2.599996,17.995093 0.00487110525,15.3808258 -1.42108547e-14,12.1544554 L-1.42108547e-14,12.1544554 L-1.42108547e-14,5.84554455 C-1.42108547e-14,2.61713944 2.59797615,8.17124146e-14 5.80274215,8.17124146e-14 L5.80274215,8.17124146e-14 Z M4.29443312,5.38692655 C4.48070099,5.36682207 4.6671823,5.42289927 4.81203008,5.54257426 L4.81203008,5.54257426 L8.96948253,8.85742574 C9.48880627,9.2678976 10.2192875,9.2678976 10.7386112,8.85742574 L10.7386112,8.85742574 L14.8518355,5.54257426 L14.8606811,5.54257426 L14.9473987,5.48291804 C15.2462388,5.30808809 15.6344967,5.37260085 15.8602388,5.64950495 C15.9785304,5.79800076 16.0329385,5.98799536 16.0113373,6.17714498 C15.9897361,6.36629461 15.8939207,6.53887938 15.7452455,6.65643564 L15.7452455,6.65643564 L11.6320212,9.98019802 C10.5861526,10.8280382 9.09540423,10.8280382 8.0495356,9.98019802 L8.0495356,9.98019802 L3.92746572,6.65643564 L3.8513546,6.58355583 C3.61891283,6.32594359 3.59998262,5.92999594 3.821318,5.64950495 C3.93770999,5.50163353 4.10816526,5.40703103 4.29443312,5.38692655 Z'/></g></svg>
<!-- Teks link -->
<span class='name' itemprop='name'>Contact Us</span>
</a>
</li>
<li class='break'>
<a class='link' expr:href='data:blog.homepageUrl + "p/documentation.html"' itemprop='url'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M13.7467018,-4.61852778e-14 C17.5901495,-4.61852778e-14 20,2.39226033 20,6.25329815 L20,6.25329815 L20,8.57519789 L19.9930149,8.67902713 C19.9423479,9.05250791 19.622205,9.34036939 19.2348285,9.34036939 L19.2348285,9.34036939 L19.2260334,9.34036939 L19.1052038,9.33069252 C18.9464135,9.30504163 18.7987699,9.22918985 18.6848781,9.1126494 C18.5425134,8.96697383 18.46492,8.77003645 18.469657,8.56640281 L18.469657,8.56640281 L18.469657,6.25329815 C18.469657,3.21020229 16.7897977,1.53034301 13.7467018,1.53034301 L13.7467018,1.53034301 L6.25329815,1.53034301 C3.20140721,1.53034301 1.53034301,3.21020229 1.53034301,6.25329815 L1.53034301,6.25329815 L1.53034301,13.7554969 C1.53034301,16.7985928 3.21020229,18.469657 6.25329815,18.469657 L6.25329815,18.469657 L13.7467018,18.469657 C16.7985928,18.469657 18.469657,16.7897977 18.469657,13.7554969 C18.469657,13.3329044 18.812236,12.9903255 19.2348285,12.9903255 C19.657421,12.9903255 20,13.3329044 20,13.7554969 C20,17.6077397 17.6077397,20 13.7554969,20 L13.7554969,20 L6.25329815,20 C2.39226033,20 1.0658141e-14,17.6077397 1.0658141e-14,13.7554969 L1.0658141e-14,13.7554969 L1.0658141e-14,6.25329815 C1.0658141e-14,2.39226033 2.39226033,-4.61852778e-14 6.25329815,-4.61852778e-14 L6.25329815,-4.61852778e-14 Z M5.75197889,7.55496922 C5.95495612,7.56184761 6.14687208,7.64913852 6.28544665,7.79761127 C6.42402122,7.94608402 6.49788492,8.14355704 6.49076517,8.34652595 L6.49076517,8.34652595 L6.49076517,14.7405453 C6.47619301,15.1631378 6.121801,15.4939037 5.69920844,15.4793316 C5.27661589,15.4647594 4.94585001,15.1103674 4.96042216,14.6877748 L4.96042216,14.6877748 L4.96042216,8.28496042 L4.97405581,8.16530218 C5.0047359,8.00845634 5.08458828,7.8642268 5.20358863,7.75448204 C5.35233906,7.61730108 5.54985383,7.54544217 5.75197889,7.55496922 Z M10.0351803,4.55584872 C10.4577729,4.55584872 10.8003518,4.89842768 10.8003518,5.32102023 L10.8003518,5.32102023 L10.8003518,14.6965699 C10.8003518,15.1191625 10.4577729,15.4617414 10.0351803,15.4617414 C9.61258775,15.4617414 9.2700088,15.1191625 9.2700088,14.6965699 L9.2700088,14.6965699 L9.2700088,5.32102023 C9.2700088,4.89842768 9.61258775,4.55584872 10.0351803,4.55584872 Z M14.2744063,10.9322779 C14.6969989,10.9322779 15.0395778,11.2748569 15.0395778,11.6974494 L15.0395778,11.6974494 L15.0395778,14.6877748 C15.0395778,15.1103674 14.6969989,15.4529463 14.2744063,15.4529463 C13.8518138,15.4529463 13.5092348,15.1103674 13.5092348,14.6877748 L13.5092348,14.6877748 L13.5092348,11.6974494 C13.5092348,11.2748569 13.8518138,10.9322779 14.2744063,10.9322779 Z'/></g></svg>
<!-- Teks link -->
<span class='name new' itemprop='name'>Documentation</span>
</a>
</li>
<!-- Sitemap link -->
<li>
<a class='link' expr:href='data:blog.homepageUrl + "p/sitemap.html"' itemprop='url'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(3.000000, 2.000000)'><path d='M12.8534107,-1.95399252e-14 C16.0667634,-1.95399252e-14 17.9912917,1.95143488 18,5.20971302 L18,5.20971302 L18,14.790287 C18,18.0485651 16.08418,20 12.862119,20 L12.862119,20 L10.0058055,20 C9.63949884,19.9590452 9.36223544,19.6452022 9.36223544,19.2715232 C9.36223544,18.8978441 9.63949884,18.5840011 10.0058055,18.5430464 L10.0058055,18.5430464 L12.8534107,18.5430464 C15.3091437,18.5430464 16.5457184,17.2803532 16.5457184,14.790287 L16.5457184,14.790287 L16.5457184,5.20971302 C16.5457184,2.7196468 15.3091437,1.45695364 12.8534107,1.45695364 L12.8534107,1.45695364 L5.13788099,1.45695364 C2.68214804,1.45695364 1.43686502,2.7196468 1.43686502,5.20971302 L1.43686502,5.20971302 L1.43686502,14.790287 C1.43686502,17.2803532 2.68214804,18.5430464 5.13788099,18.5430464 C5.50418766,18.5840011 5.78145107,18.8978441 5.78145107,19.2715232 C5.78145107,19.6452022 5.50418766,19.9590452 5.13788099,20 C1.9245283,20 -3.55271368e-15,18.0485651 -3.55271368e-15,14.790287 L-3.55271368e-15,14.790287 L-3.55271368e-15,5.20971302 C-3.55271368e-15,1.94260486 1.9245283,-1.95399252e-14 5.13788099,-1.95399252e-14 L5.13788099,-1.95399252e-14 Z M12.5921626,13.5099338 C12.9865372,13.5099338 13.3062409,13.8341073 13.3062409,14.2339956 C13.3062409,14.6338839 12.9865372,14.9580574 12.5921626,14.9580574 L12.5921626,14.9580574 L5.38171263,14.9580574 C4.98733803,14.9580574 4.66763425,14.6338839 4.66763425,14.2339956 C4.66763425,13.8341073 4.98733803,13.5099338 5.38171263,13.5099338 L5.38171263,13.5099338 Z M12.5921626,9.27152318 C12.8677202,9.24071456 13.1363773,9.37243477 13.283685,9.61057053 C13.4309927,9.84870629 13.4309927,10.1512937 13.283685,10.3894295 C13.1363773,10.6275652 12.8677202,10.7592854 12.5921626,10.7284768 L12.5921626,10.7284768 L5.38171263,10.7284768 C5.01540595,10.687522 4.73814255,10.373679 4.73814255,10 C4.73814255,9.62632096 5.01540595,9.31247796 5.38171263,9.27152318 L5.38171263,9.27152318 Z M8.13352685,5.0419426 C8.49983352,5.08289739 8.77709693,5.39674039 8.77709693,5.77041943 C8.77709693,6.14409846 8.49983352,6.45794146 8.13352685,6.49889625 L8.13352685,6.49889625 L5.3904209,6.49889625 C5.02411423,6.45794146 4.74685082,6.14409846 4.74685082,5.77041943 C4.74685082,5.39674039 5.02411423,5.08289739 5.3904209,5.0419426 L5.3904209,5.0419426 Z'/></g></svg>
<!-- Teks link -->
<span class='name' itemprop='name'>Sitemap</span>
</a>
</li>
<li>
<a class='link' href='javascript:void(0)' itemprop='url'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M18.5593769,6.79017287 C18.9610428,6.79500189 19.2840764,7.12128333 19.2840764,7.52209253 L19.2840764,7.52209253 L19.2840764,13.9947315 C19.2840764,17.6984213 16.9685732,20 13.2566978,20 L13.2566978,20 L10.3048731,20 C9.89829739,20 9.56733821,19.6737307 9.56249802,19.2680803 C9.56727055,18.8609709 9.89686386,18.5321044 10.3048731,18.5273424 L10.3048731,18.5273424 L13.2566978,18.5273424 C16.1820091,18.5273424 17.7993263,16.9224101 17.8258397,13.9947315 L17.8258397,13.9947315 L17.8258397,7.52209253 C17.8258397,7.11786446 18.1542555,6.79017287 18.5593769,6.79017287 Z M12.5231605,0.776086015 C12.9297074,0.780915527 13.2566978,1.11114487 13.2566978,1.51682398 C13.2566978,1.71247872 13.1782169,1.89999431 13.0387346,2.0375122 C12.8992522,2.1750301 12.7103957,2.25110093 12.5143227,2.24874365 L12.5143227,2.24874365 L6.01854081,2.24874365 C3.09322949,2.24874365 1.47591236,3.86249422 1.47591236,6.79017287 L1.47591236,6.79017287 L1.47591236,13.9947315 C1.47591236,16.9224101 3.09322949,18.5273424 6.01854081,18.5273424 C6.42655005,18.5321044 6.75614336,18.8609709 6.76091588,19.2680803 C6.7560757,19.6737307 6.42511652,20 6.01854081,20 C2.30666542,20 3.55271368e-15,17.6984213 3.55271368e-15,13.9947315 L3.55271368e-15,13.9947315 L3.55271368e-15,6.79017287 C3.55271368e-15,3.07766471 2.30666542,0.776086015 6.01854081,0.776086015 L6.01854081,0.776086015 Z M13.6405699,7.47415709 C13.8986602,7.29834112 14.2463981,7.30338911 14.5010412,7.49883643 C14.7875146,7.71871466 14.8707838,8.11403406 14.697259,8.43037837 L14.697259,8.43037837 L11.8691634,12.0723401 C11.745354,12.2248371 11.5687763,12.3255161 11.3742467,12.354526 C11.1806403,12.3741653 10.9870465,12.3171652 10.835141,12.1957964 L10.835141,12.1957964 L8.12193686,10.0705839 L5.68270446,13.2363569 C5.56639108,13.3942512 5.39148033,13.4990132 5.19712938,13.52719 C5.00277843,13.5553667 4.80522024,13.5046048 4.64868203,13.3862681 C4.32921663,13.1363618 4.27016334,12.6767618 4.51611505,12.354526 L4.51611505,12.354526 L7.40607518,8.59792625 C7.52663161,8.44217824 7.70434594,8.34069843 7.89999886,8.31588215 C8.09565177,8.29106586 8.2931598,8.34495309 8.4489354,8.46565161 L8.4489354,8.46565161 L11.1621396,10.5908641 L13.5483452,7.54854746 Z M16.401155,0.199963635 C17.3717893,-0.204098898 18.4908164,0.015529541 19.2357623,0.756304368 C19.9807081,1.49707919 20.2046334,2.61288381 19.8029872,3.5827487 C19.4013411,4.55261359 18.4533477,5.1852406 17.4016253,5.1852406 C15.9700611,5.1852406 14.8081818,4.02987504 14.8032974,2.60147601 L14.8032974,2.60147601 L14.8091938,2.41743042 C14.8751213,1.44242571 15.4876169,0.580257785 16.401155,0.199963635 Z M17.4016253,1.48155075 C16.7817407,1.48155075 16.2792249,1.98295837 16.2792249,2.60147601 C16.2792249,3.21999366 16.7817407,3.72140128 17.4016253,3.72140128 C18.02151,3.72140128 18.5240257,3.21999366 18.5240257,2.60147601 C18.5240257,1.98295837 18.02151,1.48155075 17.4016253,1.48155075 Z'/></g></svg>
<!-- Teks link -->
<span class='name' itemprop='name'>Disclaimer</span>
</a>
</li>
<li>
<a class='link' href='javascript:void(0)' itemprop='url'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.500000, 2.000000)'><path d='M5.89312969,1.63401017 C7.18608714,0.193148877 9.2031953,-0.355361447 11.0471682,0.232477327 C12.8911411,0.820316102 14.2193651,2.4352824 14.4409959,4.35897817 L14.4409959,4.35897817 L14.5894358,4.3619408 C16.0320293,4.41953302 17.6812199,5.3259023 18.1482924,7.87506592 L18.1482924,7.87506592 L18.9038078,13.7469324 C19.1937149,15.7862633 18.8159572,17.3597126 17.9374509,18.4057487 C17.0589446,19.4517848 15.6181943,19.9616175 13.5449195,19.9616175 L13.5449195,19.9616175 L5.54172718,19.9616175 C3.9039713,20.1671179 2.27213858,19.5386369 1.19475678,18.2874336 C0.117374985,17.0362303 -0.262494372,15.3284472 0.182838817,13.7381422 L0.182838817,13.7381422 L0.204676893,13.6359698 C0.308595333,13.2721161 0.667848274,13.0320392 1.05256004,13.087666 C1.47224561,13.1483498 1.7633029,13.5379658 1.7026547,13.9578977 C1.42810152,15.1086213 1.66869663,16.3219324 2.36153441,17.2806006 C3.21278531,18.0879587 4.36270211,18.5022992 5.53294211,18.4233291 L5.53294211,18.4233291 L13.5449195,18.4233291 C15.1350158,18.4233291 16.2331487,18.0893008 16.8041778,17.3948735 C17.3752069,16.7004462 17.6036185,15.5401372 17.3752069,13.9578977 L17.3752069,13.9578977 L16.6284765,8.14756272 C16.3649247,6.74112762 15.5479138,5.86210568 14.4409959,5.86210568 L14.4409959,5.86210568 L4.6368657,5.86210568 C3.58265815,5.86210568 2.76564731,6.74112762 2.44059998,8.20909425 L2.44059998,8.20909425 L2.22975847,9.5012565 C2.13292635,9.8960748 1.74718016,10.1485239 1.34686024,10.0790635 C0.946540322,10.0096031 0.668265259,9.64193825 0.70994259,9.23754992 L0.70994259,9.23754992 L0.929569162,7.91901701 C1.50938331,5.23800011 3.22247058,4.35897817 4.6368657,4.35897817 L4.6368657,4.35897817 L12.8772547,4.35897817 C12.7565915,3.58000694 12.3719875,2.86620985 11.7879069,2.33722772 C10.3999955,1.09522364 8.26884501,1.21325324 7.0264028,2.6009343 L7.0264028,2.6009343 L7.0264028,2.68883649 L6.94026918,2.76845555 C6.75776787,2.91311984 6.51757868,2.96919924 6.28659927,2.9161396 C6.01712329,2.85423668 5.80112265,2.65318792 5.71996271,2.38872644 C5.63880277,2.12426495 5.70481365,1.83656874 5.89312969,1.63401017 Z M12.4383364,8.32344582 L12.5522074,8.34094754 C12.6668264,8.36747635 12.7765308,8.41197721 12.8772547,8.47280083 C12.9670814,8.54373125 13.0468748,8.62652847 13.1144514,8.71892697 C13.1525621,8.76156168 13.179702,8.81285597 13.1935169,8.8683607 C13.2202671,8.92070354 13.2380828,8.9771531 13.2462273,9.03537487 C13.2552916,9.09362541 13.2552916,9.15292872 13.2462273,9.21117926 C13.2491968,9.32648631 13.2251268,9.44088581 13.1759468,9.54520759 C13.1319069,9.65850998 13.0592634,9.7584534 12.9651053,9.83528483 C12.8029063,10.0009051 12.5818739,10.0956889 12.3501509,10.0989914 C12.2328864,10.0943227 12.117165,10.0705711 12.0075335,10.0286697 C11.8243521,9.91975422 11.6869768,9.74793427 11.6209907,9.54520759 C11.5745152,9.44025592 11.5534459,9.32581224 11.5594953,9.21117926 C11.5505699,9.15291804 11.5505699,9.09363609 11.5594953,9.03537487 L11.5594953,9.03537487 L11.5594953,8.8683607 L11.6473459,8.71892697 C11.6723518,8.66774342 11.7083499,8.62271947 11.7527666,8.58707368 L11.7527666,8.58707368 L11.8845426,8.47280083 C11.9335151,8.43953301 11.9866916,8.41292917 12.0426737,8.39368886 C12.0955144,8.36823465 12.1517224,8.35047434 12.2095899,8.34094754 C12.3222888,8.31469495 12.4395084,8.31469495 12.5522074,8.34094754 Z M6.82468123,8.33223604 L6.93855218,8.34973776 C6.99673979,8.35788702 7.05315624,8.3757132 7.10546837,8.40247908 C7.15943802,8.42003352 7.20996526,8.44679893 7.25481444,8.48159105 C7.30744517,8.51195767 7.3548955,8.55053369 7.39537545,8.5958639 C7.43979222,8.63150969 7.47579025,8.67653363 7.5007962,8.72771719 C7.53492947,8.77451018 7.5643561,8.82456481 7.58864683,8.87715092 L7.58864683,8.87715092 L7.64135721,9.04416509 C7.64612665,9.10266939 7.64612665,9.16146517 7.64135721,9.21996948 C7.64135721,9.70543989 7.24803654,10.0989914 6.76285092,10.0989914 C6.53725854,10.0911464 6.32334044,9.99671537 6.16546664,9.83528483 C6.08233341,9.75247348 6.01661735,9.65384152 5.97219526,9.54520759 C5.93018882,9.43892388 5.90930048,9.32546346 5.91069982,9.21117926 C5.90163554,9.15292872 5.90163554,9.09362541 5.91069982,9.03537487 C5.9188443,8.9771531 5.93666002,8.92070354 5.9634102,8.8683607 C5.98095434,8.81435937 6.00770405,8.76380247 6.04247576,8.71892697 C6.06748172,8.66774342 6.10347974,8.62271947 6.14789652,8.58707368 C6.18635827,8.54557661 6.23076843,8.51002763 6.27967246,8.48159105 C6.32452163,8.44679893 6.37504888,8.42003352 6.42901853,8.40247908 C6.48133066,8.3757132 6.53774711,8.35788702 6.59593472,8.34973776 C6.70863363,8.32348517 6.82585326,8.32348517 6.93855218,8.34973776 Z'/></g></svg>
<!-- Teks link -->
<span class='name' itemprop='name'>Privacy</span>
</a>
</li>
<li class='close'>
<label class='link' for='offnav-menu'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
<!-- Teks Icon -->
<span class='name' itemprop='name'>Menu</span>
</label>
</li>
<!-- Link Sosial Media -->
<li class='sosmed'>
<label class='link' for='offnav-menu'>
<!-- Link Icon -->
<svg class='icon' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M13.7554969,-4.61852778e-14 C17.5901495,-4.61852778e-14 20,2.39226033 20,6.25329815 L20,6.25329815 L20,8.82145998 C20,9.02359667 19.9191181,9.21732894 19.775362,9.35943259 C19.631606,9.50153624 19.4369515,9.58018684 19.2348285,9.57783641 L19.2348285,9.57783641 L19.2348285,9.56024626 C18.8122359,9.56024626 18.469657,9.21766731 18.469657,8.79507476 L18.469657,8.79507476 L18.469657,6.25329815 C18.469657,3.20140721 16.7985928,1.53034301 13.7554969,1.53034301 L13.7554969,1.53034301 L6.25329815,1.53034301 C3.21020229,1.53034301 1.53034301,3.21020229 1.53034301,6.25329815 L1.53034301,6.25329815 L1.53034301,13.7554969 C1.53034301,16.7897977 3.21020229,18.469657 6.25329815,18.469657 L6.25329815,18.469657 L13.7554969,18.469657 C16.7985928,18.469657 18.469657,16.7897977 18.469657,13.7554969 C18.469657,13.3329044 18.812236,12.9903255 19.2348285,12.9903255 C19.657421,12.9903255 20,13.3329044 20,13.7554969 C20,17.6077397 17.6077397,20 13.7554969,20 L13.7554969,20 L6.25329815,20 C2.39226033,20 -1.77635684e-14,17.6077397 -1.77635684e-14,13.7554969 L-1.77635684e-14,13.7554969 L-1.77635684e-14,6.25329815 C-1.77635684e-14,2.39226033 2.39226033,-4.61852778e-14 6.25329815,-4.61852778e-14 L6.25329815,-4.61852778e-14 Z M10.0703606,11.644679 C10.2741412,11.6491963 10.4674733,11.7357687 10.6065507,11.8847802 C10.7456281,12.0337917 10.8186774,12.232628 10.8091469,12.4362357 L10.8091469,12.4362357 L10.8091469,13.4036939 L10.7955242,13.5238147 C10.7649048,13.6813039 10.685283,13.826302 10.5665048,13.9371617 C10.4180321,14.0757363 10.2205591,14.1496 10.0175901,14.1424802 C9.59703523,14.1234633 9.2688063,13.7717894 9.27880387,13.3509235 L9.27880387,13.3509235 L9.27880387,12.3834653 C9.28568227,12.180488 9.37297317,11.9885721 9.52144592,11.8499975 C9.66991867,11.7114229 9.86739169,11.6375592 10.0703606,11.644679 Z M10.0351803,5.84872469 C10.1203259,5.84870167 10.2039709,5.86303427 10.2828907,5.89036543 C10.5977648,5.98519473 10.826737,6.27720335 10.826737,6.62269129 L10.826,9.014 L13.4300792,9.01495163 C13.5177801,9.01392578 13.6040633,9.02814945 13.685387,9.05617989 C13.8039309,9.09234507 13.9138048,9.15791752 14.0032321,9.24838466 C14.1453357,9.39214068 14.2239863,9.58679518 14.2216871,9.78891821 C14.2216871,10.2047356 13.8897621,10.5445307 13.4740545,10.5540897 L6.65787159,10.5540897 C6.58627001,10.552462 6.5171219,10.5411482 6.45166777,10.5214177 C6.11715106,10.43812 5.87028403,10.1381217 5.86626366,9.78012313 C5.86396444,9.57800011 5.94261504,9.38334561 6.08471869,9.23958959 C6.22682234,9.09583357 6.42055461,9.01493796 6.62269129,9.01495163 L6.62269129,9.01495163 L9.26121372,9.01495163 L9.26121372,6.61389622 C9.27067438,6.19186946 9.61307298,5.85336175 10.0351803,5.84872469 Z'/></g></svg>
</label>
<ul class='sosmed-link'>
<!-- Facebook link -->
<li>
<a aria-label='Social media' href='javascript:void(0)' rel='nofollow noreferrer noopener' role='button' target='_blank' title='Facebook'>
<svg viewBox='0 0 32 32'><path d='M24,3H8A5,5,0,0,0,3,8V24a5,5,0,0,0,5,5h8a1,1,0,0,0,1-1V20a1,1,0,0,0-1-1H15V17h1a1,1,0,0,0,1-1V12.5A2.5,2.5,0,0,1,19.5,10H22v2H21a2,2,0,0,0-2,2v2a1,1,0,0,0,1,1h1.72l-.5,2H20a1,1,0,0,0-1,1v4a1,1,0,0,0,2,0V21h1a1,1,0,0,0,1-.76l1-4a1,1,0,0,0-.18-.86A1,1,0,0,0,23,15H21V14h2a1,1,0,0,0,1-1V9a1,1,0,0,0-1-1H19.5A4.51,4.51,0,0,0,15,12.5V15H14a1,1,0,0,0-1,1v4a1,1,0,0,0,1,1h1v6H8a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5H24a3,3,0,0,1,3,3V24a3,3,0,0,1-3,3H20a1,1,0,0,0,0,2h4a5,5,0,0,0,5-5V8A5,5,0,0,0,24,3Z'/></svg>
</a>
</li>
<!-- Instagram -->
<li>
<a aria-label='Social media' href='javascript:void(0)' rel='nofollow noreferrer noopener' role='button' target='_blank' title='Instagram'>
<svg viewBox='0 0 32 32'><path class='svg-c' d='M20.45,13.32a1,1,0,0,0-.57,1.3,4,4,0,1,1-2.31-2.3,1,1,0,1,0,.71-1.87,6,6,0,0,0-6.37,9.85,6,6,0,0,0,8.48,0,6,6,0,0,0,1.36-6.41A1,1,0,0,0,20.45,13.32Z'/><circle class='svg-c' cx='23' cy='9' r='1'/><path d='M28,9a5,5,0,0,0-4.9-5h0A77.11,77.11,0,0,0,9,4,5,5,0,0,0,4,8.92,91.91,91.91,0,0,0,4,23a5,5,0,0,0,4.9,5h0c2.36.22,4.73.34,7.1.34s4.71-.11,7.05-.34A5,5,0,0,0,28,23.08,87.09,87.09,0,0,0,28,9ZM26,23a3,3,0,0,1-3,3h-.1A71.73,71.73,0,0,1,9,26a3,3,0,0,1-3-3.08A92.4,92.4,0,0,1,6,9,3,3,0,0,1,9.09,6q3.44-.31,6.9-.32T23,6a3,3,0,0,1,3,3.08A85.13,85.13,0,0,1,26,23Z'/></svg>
</a>
</li>
<!-- Twitter -->
<li>
<a aria-label='Social media' href='javascript:void(0)' rel='nofollow noreferrer noopener' role='button' target='_blank' title='Twitter'>
<svg viewBox='0 0 32 32'><path d='M28.77,8.11a.87.87,0,0,0-.23-.2A4.69,4.69,0,0,0,29,6.54a1,1,0,0,0-.44-1,1,1,0,0,0-1.1,0,6.42,6.42,0,0,1-2.28.92,6.21,6.21,0,0,0-7.08-1A6.07,6.07,0,0,0,15,12.2a1,1,0,0,0,2-.4A4.08,4.08,0,0,1,19,7.28a4.24,4.24,0,0,1,5.12,1,1,1,0,0,0,.88.28l.25,0a1,1,0,0,0,.34,1.62,1,1,0,0,0-.36.88,13.07,13.07,0,0,1-4.89,11.24A12.75,12.75,0,0,1,7.69,24.61a9.06,9.06,0,0,0,4.54-2.18,1,1,0,0,0,.15-1.09,1,1,0,0,0-.93-.57,4,4,0,0,1-3-1.39,3.63,3.63,0,0,0,1-.35A1,1,0,0,0,10,18a1,1,0,0,0-.76-.84,4.42,4.42,0,0,1-3-2.48c.24,0,.48.05.74.06a1,1,0,0,0,1-.62A1,1,0,0,0,7.67,13C6,11.48,5.59,9.85,5.83,8.7a13.88,13.88,0,0,0,7,4,1,1,0,1,0,.38-2A12.1,12.1,0,0,1,6.39,6.31a1,1,0,0,0-.75-.38,1,1,0,0,0-.78.33,5.34,5.34,0,0,0-.31,6l-.09,0a1,1,0,0,0-.52.81,5.84,5.84,0,0,0,1.95,4.47,1,1,0,0,0-.18,1,6.63,6.63,0,0,0,3.18,3.57A13.89,13.89,0,0,1,4,23a1,1,0,0,0-.5,1.86A16.84,16.84,0,0,0,12,27.35a15.16,15.16,0,0,0,9.6-3.57,15.12,15.12,0,0,0,5.69-12.42,4.62,4.62,0,0,0,1.62-2.25A1,1,0,0,0,28.77,8.11Z'/></svg>
</a>
</li>
<!-- Youtube -->
<li>
<a aria-label='Social media' href='javascript:void(0)' rel='nofollow noreferrer noopener' role='button' target='_blank' title='Youtube'>
<svg viewBox='0 0 32 32'><path d='M30,12a5.71,5.71,0,0,0-5.31-5.7C18.92,6,13.06,6,7.33,6.28,4.51,6.28,2,9,2,12a43.69,43.69,0,0,0,0,8.72,5.32,5.32,0,0,0,5.28,5.33h0q4.35.24,8.72.24t8.67-.23A5.34,5.34,0,0,0,30,20.8,31.67,31.67,0,0,0,30,12Zm-2,8.63a.49.49,0,0,0,0,.12,3.36,3.36,0,0,1-3.39,3.34,166,166,0,0,1-17.28,0A3.36,3.36,0,0,1,4,20.65a42,42,0,0,1,0-8.47.45.45,0,0,0,0-.11A3.78,3.78,0,0,1,7.38,8.28c2.86-.13,5.74-.19,8.62-.19s5.76.06,8.62.19h.05c1.71,0,3.33,1.84,3.33,3.79a.76.76,0,0,0,0,.15A30.11,30.11,0,0,1,28,20.61Z'/><path class='svg-c' d='M20.79,15.51l-7.14-3.68a1,1,0,1,0-.92,1.78l5.43,2.79-4,2.07V16.4a1,1,0,0,0-2,0v3.72a1,1,0,0,0,1,1,1,1,0,0,0,.46-.11l7.14-3.72a1,1,0,0,0,.54-.89A1,1,0,0,0,20.79,15.51Z'/></svg>
</a>
</li>
<!-- Blogger -->
<li>
<a aria-label='Social media' expr:href='"https://www.blogger.com/follow.g?blogID=" + data:blog.blogId' expr:title='data:messages.subscribeToThisBlog' rel='nofollow noreferrer noopener' role='button' target='_blank'>
<svg style='height:20px' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'><path d='M28,12H26V9.5A7.5,7.5,0,0,0,18.5,2h-9A7.5,7.5,0,0,0,2,9.5V19a1,1,0,0,0,2,0V9.5A5.51,5.51,0,0,1,9.5,4h9A5.51,5.51,0,0,1,24,9.5V12a2,2,0,0,0,2,2h2v8.5A5.51,5.51,0,0,1,22.5,28H9.5A5.51,5.51,0,0,1,4,22.5V22a1,1,0,0,0-2,0v.5A7.5,7.5,0,0,0,9.5,30h13A7.5,7.5,0,0,0,30,22.5V14A2,2,0,0,0,28,12Z'/><path class='svg-c' d='M11.5,14h5a2.5,2.5,0,0,0,0-5h-5a2.5,2.5,0,0,0,0,5Zm0-3h5a.5.5,0,0,1,0,1h-5a.5.5,0,0,1,0-1Z'/><path class='svg-c' d='M11.5,23h9a2.5,2.5,0,0,0,0-5h-9a2.5,2.5,0,0,0,0,5Zm0-3h9a.5.5,0,0,1,0,1h-9a.5.5,0,0,1,0-1Z'/></svg>
</a>
</li>
</ul>
</li>
</ul>
<!-- Navigation Mobile -->
<ul class='navigation-mobile'>
<!-- Homepage link -->
<li class='home-link'>
<a aria-label='Home' class='link' expr:href='data:blog.homepageUrl' expr:title='data:messages.home' role='button'>
<!-- Link Icon -->
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.500000, 2.003982)'><path class='svg-c' d='M7.92173917,18.2568881 L3.92173915,18.2568881 C2.62561934,18.2521579 1.57473912,17.2051555 1.5652174,15.909062 L1.5652174,7.95254022 C1.56776138,7.51865617 1.76191292,7.1080734 2.09565218,6.83080108 L2.80000001,6.30906195 C3.05714116,6.03509289 3.08328826,5.61704285 2.86228858,5.31316828 C2.6412889,5.00929372 2.23552029,4.90536419 1.89565218,5.06558368 L1.89565218,5.06558368 L1.17391305,5.60471412 C0.445875565,6.16803633 0.0138352771,7.0321169 -7.10542736e-15,7.95254022 L-7.10542736e-15,15.9177576 C0.0047821894,18.0816904 1.75780637,19.8347146 3.92173915,19.8394968 L7.92173917,19.8394968 C8.35396202,19.8394968 8.70434787,19.4891109 8.70434787,19.0568881 C8.70434787,18.6246652 8.35396202,18.2742794 7.92173917,18.2742794 L7.92173917,18.2568881 Z'/><path d='M18.7913044,7.93514891 C18.7821625,7.02148476 18.3641697,6.15997273 17.652174,5.58732281 L11.6434783,0.796018441 C10.3230761,-0.26533948 8.44214141,-0.26533948 7.12173917,0.796018441 L5.21739133,2.17862714 C4.85960686,2.43555961 4.77785016,2.93388616 5.03478263,3.29167063 C5.29171511,3.6494551 5.79004165,3.7312118 6.14782612,3.47427932 L8.07826091,2.03080106 C8.83595413,1.40700621 9.92926336,1.40700621 10.6869566,2.03080106 L16.6956523,6.82210543 C17.0414821,7.0962427 17.245809,7.51128176 17.252174,7.95254022 L17.252174,15.9177576 C17.252174,17.2144262 16.2010165,18.2655837 14.9043479,18.2655837 L13.1217392,18.2655837 C12.9392451,18.2655837 12.7913044,18.1176431 12.7913044,17.935149 L12.7913044,14.3438446 C12.7913144,13.1994401 11.8661337,12.270372 10.7217392,12.2655837 L8.11304352,12.2655837 C7.56185446,12.2655837 7.03324068,12.4845427 6.64349116,12.8742922 C6.25374164,13.2640418 6.03478264,13.7926555 6.03478264,14.3438446 L6.03478264,15.7177576 C6.03478264,16.1499805 6.38516849,16.5003663 6.81739134,16.5003663 C7.24961419,16.5003663 7.60000004,16.1499805 7.60000004,15.7177576 L7.60000004,14.3438446 C7.59766759,14.208583 7.64977261,14.0780549 7.74461016,13.9815822 C7.83944772,13.8851095 7.96906617,13.830781 8.10434787,13.8308011 L10.7130435,13.8308011 C10.9915871,13.8308011 11.2173914,14.0566053 11.2173914,14.3351489 L11.2173914,14.3351489 L11.2173914,17.935149 C11.2221784,18.9834938 12.0733835,19.8308011 13.1217392,19.8308011 L14.8608696,19.8308011 C17.0267864,19.8308011 18.7826088,18.0749787 18.7826088,15.909062 L18.7913044,7.93514891 Z'/></g></svg>
</a>
</li>
<!-- Search icon -->
<li class='search-link'>
<label class='link' for='search-input'>
<!-- Link Icon -->
<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M19.7555474,18.6065254 L16.3181544,15.2458256 L16.3181544,15.2458256 L16.2375905,15.1233001 C16.0877892,14.9741632 15.8829641,14.8901502 15.6691675,14.8901502 C15.4553709,14.8901502 15.2505458,14.9741632 15.1007444,15.1233001 L15.1007444,15.1233001 C12.1794834,17.8033337 7.6781476,17.94901 4.58200492,15.4637171 C1.48586224,12.9784243 0.75566836,8.63336673 2.87568494,5.31016931 C4.99570152,1.9869719 9.30807195,0.716847023 12.9528494,2.34213643 C16.5976268,3.96742583 18.4438102,7.98379036 17.2670181,11.7275931 C17.182269,11.9980548 17.25154,12.2921761 17.4487374,12.4991642 C17.6459348,12.7061524 17.9410995,12.794561 18.223046,12.7310875 C18.5049924,12.667614 18.7308862,12.4619014 18.8156353,12.1914397 L18.8156353,12.1914397 C20.2223941,7.74864367 18.0977423,2.96755391 13.8161172,0.941057725 C9.53449216,-1.08543846 4.38083811,0.250823958 1.68905427,4.08541671 C-1.00272957,7.92000947 -0.424820906,13.1021457 3.0489311,16.2795011 C6.5226831,19.4568565 11.8497823,19.6758854 15.5841278,16.7948982 L18.6276529,19.7705177 C18.9419864,20.0764941 19.4501654,20.0764941 19.764499,19.7705177 C20.0785003,19.4602048 20.0785003,18.9605974 19.764499,18.6502845 L19.764499,18.6502845 L19.7555474,18.6065254 Z'/></g></svg>
</label>
</li>
<!-- Navigation icon -->
<li class='tag-link'>
<label class='link' for='offnav-menu'>
<svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(2.000000, 2.000000)'><path d='M14.2855094,9.76996262e-15 L17.5521036,9.76996262e-15 C18.9036211,9.76996262e-15 20,1.10589743 20,2.47018211 L20,5.76410278 C20,7.12735391 18.9036211,8.23428489 17.5521036,8.23428489 L14.2855094,8.23428489 C12.9329672,8.23428489 11.8365883,7.12735391 11.8365883,5.76410278 L11.8365883,2.47018211 C11.8365883,1.10589743 12.9329672,9.76996262e-15 14.2855094,9.76996262e-15 Z'/><path class='svg-c' d='M2.44892104,9.76996262e-15 L5.71449064,9.76996262e-15 C7.06703281,9.76996262e-15 8.16341169,1.10589743 8.16341169,2.47018211 L8.16341169,5.76410278 C8.16341169,7.12735391 7.06703281,8.23428489 5.71449064,8.23428489 L2.44892104,8.23428489 C1.09637888,8.23428489 3.55271368e-15,7.12735391 3.55271368e-15,5.76410278 L3.55271368e-15,2.47018211 C3.55271368e-15,1.10589743 1.09637888,9.76996262e-15 2.44892104,9.76996262e-15 Z'/><path d='M2.44892104,11.7657151 L5.71449064,11.7657151 C7.06703281,11.7657151 8.16341169,12.8716125 8.16341169,14.2369308 L8.16341169,17.5298179 C8.16341169,18.8941026 7.06703281,20 5.71449064,20 L2.44892104,20 C1.09637888,20 3.55271368e-15,18.8941026 3.55271368e-15,17.5298179 L3.55271368e-15,14.2369308 C3.55271368e-15,12.8716125 1.09637888,11.7657151 2.44892104,11.7657151 Z'/><path d='M14.2855094,11.7657151 L17.5521036,11.7657151 C18.9036211,11.7657151 20,12.8716125 20,14.2369308 L20,17.5298179 C20,18.8941026 18.9036211,20 17.5521036,20 L14.2855094,20 C12.9329672,20 11.8365883,18.8941026 11.8365883,17.5298179 L11.8365883,14.2369308 C11.8365883,12.8716125 12.9329672,11.7657151 14.2855094,11.7657151 Z'/></g></svg>
</label>
</li>
<!-- Dark mode icon -->
<li class='dark-link'>
<div class='link' onclick='darkMode()'>
<!-- Link Icon -->
<svg class='line svg-1' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z'/></svg>
<svg class='line svg-2' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><circle cx='12' cy='12' r='5'/><line x1='12' x2='12' y1='1' y2='3'/><line x1='12' x2='12' y1='21' y2='23'/><line x1='4.22' x2='5.64' y1='4.22' y2='5.64'/><line x1='18.36' x2='19.78' y1='18.36' y2='19.78'/><line x1='1' x2='3' y1='12' y2='12'/><line x1='21' x2='23' y1='12' y2='12'/><line x1='4.22' x2='5.64' y1='19.78' y2='18.36'/><line x1='18.36' x2='19.78' y1='5.64' y2='4.22'/></svg>
</div>
</li>
<!-- Back top icon -->
<!-- <li class='top-link'>
<a href='#mainContent' role='button' title='Back to top'>
<svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><polyline class='svg-c' points='17 11 12 6 7 11'/><polyline points='17 18 12 13 7 18'/></svg>
<svg class='line' style='transform:rotate(180deg);webkit-transform:rotate(180deg)' viewBox='0 0 24 24'><path d='M3 17v3a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-3'/><polyline points='8 12 12 16 16 12'/><line x1='12' x2='12' y1='2' y2='16'/></svg>
</a>
</li>-->
</ul>
<label class='full-close nav-close' for='offnav-menu'/>
</b:includable>
</b:widget>
</b:section>
</div>
</b:if>
</div>
<!--[ Back to Top (STW) ]-->
<div class='Ttop'>
<svg onclick='window.scrollTo({top: 0})' viewBox='0 0 34 34'><circle class='b' cx='17' cy='17' r='15.92'/><circle class='c' cx='17' cy='17' r='15.92'/><path class='line d' d='M15.07,21.06,19.16,17l-4.09-4.06'/></svg>
</div>
<!--[ Waves Animation ]-->
<div class='wvC'><div class='wvS'><svg class='waves' preserveAspectRatio='none' shape-rendering='auto' viewBox='0 24 150 28'><defs><path d='M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z' id='wave-bg'/></defs><g class='plx'><use x='48' xlink:href='#wave-bg' y='0'/><use x='48' xlink:href='#wave-bg' y='3'/><use x='48' xlink:href='#wave-bg' y='5'/><use x='48' xlink:href='#wave-bg' y='7'/></g></svg></div><div class='wvH'/></div>
<b:if cond='!data:view.isError'>
<script>/*<![CDATA[*/
function darkMode(){localStorage.setItem("mode","darkmode"===localStorage.getItem("mode")?"light":"darkmode"),"darkmode"===localStorage.getItem("mode")?document.querySelector("#mainContent").classList.add("drK"):document.querySelector("#mainContent").classList.remove("drK")};
defer(function() {
window.lazySizesConfig=window.lazySizesConfig||{},lazySizesConfig.loadMode=1,lazySizesConfig.preloadAfterLoad=!1,function(e){var t=function(c,D,d){"use strict";var k,H;if(function(){var e,t={lazyClass:"lazy",loadedClass:"lazyloaded",loadingClass:"lazyloading",preloadClass:"lazypreload",errorClass:"lazyerror",autosizesClass:"lazyautosizes",srcAttr:"data-src",srcsetAttr:"data-srcset",sizesAttr:"data-sizes",minSize:40,customMedia:{},init:!0,expFactor:1.5,hFac:.8,loadMode:2,loadHidden:!0,ricTimeout:0,throttleDelay:125};H=c.lazySizesConfig||c.lazysizesConfig||{};for(e in t)e in H||(H[e]=t[e])}(),!D||!D.getElementsByClassName)return{init:function(){},cfg:H,noSupport:!0};var O=D.documentElement,i=c.HTMLPictureElement,P="addEventListener",$="getAttribute",q=c[P].bind(c),I=c.setTimeout,U=c.requestAnimationFrame||I,s=c.requestIdleCallback,j=/^picture$/i,a=["load","error","lazyincluded","_lazyloaded"],n={},G=Array.prototype.forEach,J=function(e,t){return n[t]||(n[t]=new RegExp("(\\s|^)"+t+"(\\s|$)")),n[t].test(e[$]("class")||"")&&n[t]},K=function(e,t){J(e,t)||e.setAttribute("class",(e[$]("class")||"").trim()+" "+t)},Q=function(e,t){var n;(n=J(e,t))&&e.setAttribute("class",(e[$]("class")||"").replace(n," "))},V=function(t,n,e){var i=e?P:"removeEventListener";e&&V(t,n),a.forEach(function(e){t[i](e,n)})},X=function(e,t,n,i,a){var o=D.createEvent("Event");return n||(n={}),n.instance=k,o.initEvent(t,!i,!a),o.detail=n,e.dispatchEvent(o),o},Y=function(e,t){var n;!i&&(n=c.picturefill||H.pf)?(t&&t.src&&!e[$]("srcset")&&e.setAttribute("srcset",t.src),n({reevaluate:!0,elements:[e]})):t&&t.src&&(e.src=t.src)},Z=function(e,t){return(getComputedStyle(e,null)||{})[t]},r=function(e,t,n){for(n=n||e.offsetWidth;n<H.minSize&&t&&!e._lazysizesWidth;)n=t.offsetWidth,t=t.parentNode;return n},ee=function(){var n,i,t=[],a=[],o=t,r=function(){var e=o;for(o=t.length?a:t,n=!0,i=!1;e.length;)e.shift()();n=!1},e=function(e,t){n&&!t?e.apply(this,arguments):(o.push(e),i||(i=!0,(D.hidden?I:U)(r)))};return e._lsFlush=r,e}(),te=function(n,e){return e?function(){ee(n)}:function(){var e=this,t=arguments;ee(function(){n.apply(e,t)})}},ne=function(e){var n,i=0,a=H.throttleDelay,o=H.ricTimeout,t=function(){n=!1,i=d.now(),e()},r=s&&o>49?function(){s(t,{timeout:o}),o!==H.ricTimeout&&(o=H.ricTimeout)}:te(function(){I(t)},!0);return function(e){var t;(e=!0===e)&&(o=33),n||(n=!0,t=a-(d.now()-i),t<0&&(t=0),e||t<9?r():I(r,t))}},ie=function(e){var t,n,i=99,a=function(){t=null,e()},o=function(){var e=d.now()-n;e<i?I(o,i-e):(s||a)(a)};return function(){n=d.now(),t||(t=I(o,i))}},e=function(){var z,m,u,y,e,h,v,g,p,C,b,A,o=/^img$/i,f=/^iframe$/i,E="onscroll"in c&&!/(gle|ing)bot/.test(navigator.userAgent),_=0,w=0,M=0,N=-1,S=function(e){M--,(!e||M<0||!e.target)&&(M=0)},x=function(e){return null==A&&(A="hidden"==Z(D.body,"visibility")),A||!("hidden"==Z(e.parentNode,"visibility")&&"hidden"==Z(e,"visibility"))},W=function(e,t){var n,i=e,a=x(e);for(g-=t,b+=t,p-=t,C+=t;a&&(i=i.offsetParent)&&i!=D.body&&i!=O;)(a=(Z(i,"opacity")||1)>0)&&"visible"!=Z(i,"overflow")&&(n=i.getBoundingClientRect(),a=C>n.left&&p<n.right&&b>n.top-1&&g<n.bottom+1);return a},t=function(){var e,t,n,i,a,o,r,s,l,c,d,u,f=k.elements;if((y=H.loadMode)&&M<8&&(e=f.length)){for(t=0,N++;t<e;t++)if(f[t]&&!f[t]._lazyRace)if(!E||k.prematureUnveil&&k.prematureUnveil(f[t]))R(f[t]);else if((s=f[t][$]("data-expand"))&&(o=1*s)||(o=w),c||(c=!H.expand||H.expand<1?O.clientHeight>500&&O.clientWidth>500?500:370:H.expand,k._defEx=c,d=c*H.expFactor,u=H.hFac,A=null,w<d&&M<1&&N>2&&y>2&&!D.hidden?(w=d,N=0):w=y>1&&N>1&&M<6?c:_),l!==o&&(h=innerWidth+o*u,v=innerHeight+o,r=-1*o,l=o),n=f[t].getBoundingClientRect(),(b=n.bottom)>=r&&(g=n.top)<=v&&(C=n.right)>=r*u&&(p=n.left)<=h&&(b||C||p||g)&&(H.loadHidden||x(f[t]))&&(m&&M<3&&!s&&(y<3||N<4)||W(f[t],o))){if(R(f[t]),a=!0,M>9)break}else!a&&m&&!i&&M<4&&N<4&&y>2&&(z[0]||H.preloadAfterLoad)&&(z[0]||!s&&(b||C||p||g||"auto"!=f[t][$](H.sizesAttr)))&&(i=z[0]||f[t]);i&&!a&&R(i)}},n=ne(t),L=function(e){var t=e.target;if(t._lazyCache)return void delete t._lazyCache;S(e),K(t,H.loadedClass),Q(t,H.loadingClass),V(t,B),X(t,"lazyloaded")},i=te(L),B=function(e){i({target:e.target})},T=function(t,n){try{t.contentWindow.location.replace(n)}catch(e){t.src=n}},F=function(e){var t,n=e[$](H.srcsetAttr);(t=H.customMedia[e[$]("data-media")||e[$]("media")])&&e.setAttribute("media",t),n&&e.setAttribute("srcset",n)},r=te(function(t,e,n,i,a){var o,r,s,l,c,d;(c=X(t,"lazybeforeunveil",e)).defaultPrevented||(i&&(n?K(t,H.autosizesClass):t.setAttribute("sizes",i)),r=t[$](H.srcsetAttr),o=t[$](H.srcAttr),a&&(s=t.parentNode,l=s&&j.test(s.nodeName||"")),d=e.firesLoad||"src"in t&&(r||o||l),c={target:t},K(t,H.loadingClass),d&&(clearTimeout(u),u=I(S,2500),V(t,B,!0)),l&&G.call(s.getElementsByTagName("source"),F),r?t.setAttribute("srcset",r):o&&!l&&(f.test(t.nodeName)?T(t,o):t.src=o),a&&(r||l)&&Y(t,{src:o})),t._lazyRace&&delete t._lazyRace,Q(t,H.lazyClass),ee(function(){var e=t.complete&&t.naturalWidth>1;d&&!e||(e&&K(t,"ls-is-cached"),L(c),t._lazyCache=!0,I(function(){"_lazyCache"in t&&delete t._lazyCache},9)),"lazy"==t.loading&&M--},!0)}),R=function(e){if(!e._lazyRace){var t,n=o.test(e.nodeName),i=n&&(e[$](H.sizesAttr)||e[$]("sizes")),a="auto"==i;(!a&&m||!n||!e[$]("src")&&!e.srcset||e.complete||J(e,H.errorClass)||!J(e,H.lazyClass))&&(t=X(e,"lazyunveilread").detail,a&&ae.updateElem(e,!0,e.offsetWidth),e._lazyRace=!0,M++,r(e,t,a,i,n))}},a=ie(function(){H.loadMode=3,n()}),s=function(){3==H.loadMode&&(H.loadMode=2),a()},l=function(){if(!m){if(d.now()-e<999)return void I(l,999);m=!0,H.loadMode=3,n(),q("scroll",s,!0)}};return{_:function(){e=d.now(),k.elements=D.getElementsByClassName(H.lazyClass),z=D.getElementsByClassName(H.lazyClass+" "+H.preloadClass),q("scroll",n,!0),q("resize",n,!0),q("pageshow",function(e){if(e.persisted){var t=D.querySelectorAll("."+H.loadingClass);t.length&&t.forEach&&U(function(){t.forEach(function(e){e.complete&&R(e)})})}}),c.MutationObserver?new MutationObserver(n).observe(O,{childList:!0,subtree:!0,attributes:!0}):(O[P]("DOMNodeInserted",n,!0),O[P]("DOMAttrModified",n,!0),setInterval(n,999)),q("hashchange",n,!0),["focus","mouseover","click","load","transitionend","animationend"].forEach(function(e){D[P](e,n,!0)}),/d$|^c/.test(D.readyState)?l():(q("load",l),D[P]("DOMContentLoaded",n),I(l,2e4)),k.elements.length?(t(),ee._lsFlush()):n()},checkElems:n,unveil:R,_aLSL:s}}(),ae=function(){var n,o=te(function(e,t,n,i){var a,o,r;if(e._lazysizesWidth=i,i+="px",e.setAttribute("sizes",i),j.test(t.nodeName||""))for(a=t.getElementsByTagName("source"),o=0,r=a.length;o<r;o++)a[o].setAttribute("sizes",i);n.detail.dataAttr||Y(e,n.detail)}),i=function(e,t,n){var i,a=e.parentNode;a&&(n=r(e,a,n),i=X(e,"lazybeforesizes",{width:n,dataAttr:!!t}),i.defaultPrevented||(n=i.detail.width)&&n!==e._lazysizesWidth&&o(e,a,i,n))},e=function(){var e,t=n.length;if(t)for(e=0;e<t;e++)i(n[e])},t=ie(e);return{_:function(){n=D.getElementsByClassName(H.autosizesClass),q("resize",t)},checkElems:t,updateElem:i}}(),t=function(){!t.i&&D.getElementsByClassName&&(t.i=!0,ae._(),e._())};return I(function(){H.init&&t()}),k={cfg:H,autoSizer:ae,loader:e,init:t,uP:Y,aC:K,rC:Q,hC:J,fire:X,gW:r,rAF:ee}}(e,e.document,Date);e.lazySizes=t,"object"==typeof module&&module.exports&&(module.exports=t)}("undefined"!=typeof window?window:{}); });
( function() {var youtube = document.querySelectorAll(".lazy-youtube"); for (var i = 0; i < youtube.length; i++) {var source = "https://img.youtube.com/vi/"+ youtube[i].dataset.embed +"/sddefault.jpg"; var image = new Image(); image.setAttribute("class", "lazy"); image.setAttribute("data-src",source); image.setAttribute("src","data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="); image.setAttribute("alt","Youtube video"); image.addEventListener( "load", function() {youtube[ i ].appendChild( image );}( i ) ); youtube[i].addEventListener( "click", function() {var iframe = document.createElement( "iframe" ); iframe.setAttribute( "frameborder", "0" ); iframe.setAttribute( "allowfullscreen", "" ); iframe.setAttribute( "src", "https://www.youtube.com/embed/"+ this.dataset.embed +"?rel=0&showinfo=0&autoplay=1" ); this.innerHTML = ""; this.appendChild( iframe ); }); }; })();
function changeFont(){var x=document.getElementById('post-font');if(x.classList)x.classList.toggle('active');else{var z=x.className.split(' ');0<=(t=z.indexOf('active'))?z.splice(t,1):z.push('active'),x.className=z.join(' ')}};
function copyFunction(){document.getElementById("getlink").select(),document.execCommand("copy"),document.getElementById("share-notif").innerHTML="<span>Link copied!</span>" }; var uri = window.location.toString();if (uri.indexOf("?m=1","?m=1") > 0) {var clean_uri = uri.substring(0, uri.indexOf("?m=1"));window.history.replaceState({}, document.title, clean_uri);}
/*]]>*/
</script>
<script>/*<![CDATA[*//* Back to Top (STW) */ var prPt=document.querySelector(".Ttop circle.c"),ptLh=prPt.getTotalLength();prPt.style.transition=prPt.style.WebkitTransition="none",prPt.style.strokeDasharray=ptLh+" "+ptLh,prPt.style.strokeDashoffset=ptLh,prPt.getBoundingClientRect();var updateProgress=function(){var t=document.documentElement.scrollTop,e=document.documentElement.scrollHeight-window.innerHeight;prPt.style.strokeDashoffset=ptLh-t*ptLh/e};updateProgress(),window.addEventListener("scroll",updateProgress);var offset=0;window.onscroll=function(){document.documentElement.scrollTop>offset?document.querySelector(".Ttop").classList.add("vsbl"):document.querySelector(".Ttop").classList.remove("vsbl")};
/*]]>*/</script>
<b:include cond='data:view.isMultipleItems' name='postPagination-more'/>
<!--<b:include name='postPage-analytics'/>-->
<!-- <script>/*<![CDATA[*/ (function() { var ad = document.createElement('script'); ad.async = true; ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'; var sc = document.getElementsByTagName('head')[0]; sc.parentNode.insertBefore(ad, sc); })(); /*]]>*/</script> -->
</b:if>
<!--</body>--></body>
</html>
![BUzzSpot premium [ blogger ]](http://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu70ry7pxDDhvSCknNSidWE9y01mP1zY_jseRrcdhzCAj-Z_lu980yBjWyl0DSK5mbmY7-tcqeJeY0DLYVgVIaUkqkVLs2LhuYP7w3AbtYZEke1ocKdNDkKYXp2ObOvM6yGyvIOesU_kt9wOXK7PHM1O12y2o3lixIcd5WKOYsi5xn0_djRpqxnSqdS0MN/s275/buzzspot.webp)
Posting Komentar