SHARE
TWEET

Flex

a guest Jul 16th, 2019 96 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <!DOCTYPE html>
  3. <HTML expr:dir='data:blog.languageDirection' itemscope='' itemtype='http://schema.org/NewsArticle' lang='id'>
  4. <b:attr cond='data:blog.isMobileRequest == &quot;true&quot;' name='amp' value='amp'/>
  5. <b:class cond='data:blog.pageType == &quot;static_page&quot;' name='static_page'/>
  6. &lt;head&gt;
  7. <meta charset='utf-8'/>
  8. <meta content='width=device-width,minimum-scale=1,initial-scale=1' name='viewport'/>
  9. <meta content='IE=9; IE=8; IE=7; IE=EDGE; chrome=1' http-equiv='X-UA-Compatible'/>
  10. <b:if cond='data:blog.pageType == &quot;index&quot;'>
  11.     <title><data:blog.pageTitle/></title>
  12. <b:else/>
  13.     <b:if cond='data:blog.pageType == &quot;error_page&quot;'>
  14.         <title>404: Page Not Found | <data:blog.title/></title>
  15.     <b:else/>
  16.         <title><data:blog.pageName/></title>
  17.     </b:if>
  18. </b:if>
  19. <!-- Chrome, Firefox OS and Opera -->
  20. <meta content='#EAEAEA' name='theme-color'/>
  21. <!-- Windows Phone -->
  22. <meta content='#EAEAEA' name='msapplication-navbutton-color'/>
  23. <link href='#' rel='manifest'/>
  24. <meta content='blogger' name='generator'/>
  25. <link expr:href='data:blog.homepageUrl + &quot;favicon.ico&quot;' rel='icon' type='image/x-icon'/>
  26. <link href='https://1.bp.blogspot.com/-Ktsa62xtoU4/WxaE7LVZdGI/AAAAAAAAx_E/YBYYOwwYKd820im1gnaNRaAgcwl0Bf6_gCLcBGAs/s32/amp.png' rel='icon' sizes='32x32'/>
  27. <link href='https://1.bp.blogspot.com/-Ktsa62xtoU4/WxaE7LVZdGI/AAAAAAAAx_E/YBYYOwwYKd820im1gnaNRaAgcwl0Bf6_gCLcBGAs/s192/amp.png' rel='icon' sizes='192x192'/>
  28. <link href='https://1.bp.blogspot.com/-Ktsa62xtoU4/WxaE7LVZdGI/AAAAAAAAx_E/YBYYOwwYKd820im1gnaNRaAgcwl0Bf6_gCLcBGAs/s180/amp.png' rel='apple-touch-icon-precomposed'/>
  29. <meta content='https://1.bp.blogspot.com/-Ktsa62xtoU4/WxaE7LVZdGI/AAAAAAAAx_E/YBYYOwwYKd820im1gnaNRaAgcwl0Bf6_gCLcBGAs/s144/amp.png' name='msapplication-TileImage'/>
  30. <b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
  31. <link expr:href='data:blog.url' rel='canonical'/>
  32. <link expr:href='data:blog.url + &quot;?m=1&quot;' rel='amphtml'/>
  33. </b:if>
  34. <b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
  35. <link expr:href='data:blog.url' rel='canonical'/>
  36. </b:if>
  37. <link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
  38. <link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
  39. <link expr:href='&quot;//www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
  40. <link href='//www.blogger.com/openid-server.g' rel='openid.server'/>
  41. <link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
  42. <link expr:href='data:blog.url' hreflang='x-default' rel='alternate'/>
  43. <link href='https://plus.google.com/xxxxxxxxxxxxxx' rel='me'/>
  44. <link href='https://plus.google.com/xxxxxxxxxxxxxx' rel='publisher'/>
  45. <b:if cond='data:blog.pageType == &quot;item&quot;'>
  46. <meta expr:content='data:blog.pageName' property='og:title'/>
  47. <meta expr:content='data:blog.canonicalUrl' property='og:url'/>
  48. <meta content='article' property='og:type'/>
  49. <b:if cond='data:blog.metaDescription'>
  50. <meta expr:content='data:blog.metaDescription' name='description'/>
  51. <meta expr:content='data:blog.metaDescription' property='og:description'/>
  52. <b:else/>
  53. <meta expr:content='&quot;Silahkan kunjungi postingan &quot; + data:blog.pageName + &quot; untuk membaca artikel selengkapnya.&quot;' name='description'/>
  54. <meta expr:content='&quot;Silahkan kunjungi postingan &quot; + data:blog.pageName + &quot; untuk membaca artikel selengkapnya.&quot;' property='og:description'/>
  55. </b:if>
  56. </b:if>
  57. <meta expr:content='data:blog.title' property='og:site_name'/>
  58. <b:if cond='data:blog.url == data:blog.homepageUrl'>
  59. <meta expr:content='data:blog.title' property='og:title'/>
  60. <meta content='website' property='og:type'/>
  61. <b:if cond='data:blog.metaDescription'>
  62. <meta expr:content='data:blog.metaDescription' name='description'/>
  63. <meta expr:content='data:blog.metaDescription' property='og:description'/>
  64. <b:else/>
  65. <meta expr:content='&quot;Silahkan kunjungi &quot; + data:blog.pageTitle + &quot; untuk membaca postingan-postingan menarik.&quot;' property='og:description'/>
  66. </b:if>
  67. </b:if>
  68. <b:if cond='data:blog.postImageUrl'>
  69. <meta expr:content='data:blog.postImageUrl' property='og:image'/>
  70. <meta content='530' property='og:image:width'/>
  71. <meta content='280' property='og:image:height'/>
  72. <meta expr:content='data:blog.pageName' property='og:image:alt'/>
  73. <b:else/>
  74. <b:if cond='data:blog.postImageThumbnailUrl'>
  75. <meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
  76. <meta content='530' property='og:image:width'/>
  77. <meta content='280' property='og:image:height'/>
  78. <meta expr:content='data:blog.pageName' property='og:image:alt'/>
  79. <b:else/>
  80. <meta content='https://1.bp.blogspot.com/-Ktsa62xtoU4/WxaE7LVZdGI/AAAAAAAAx_E/YBYYOwwYKd820im1gnaNRaAgcwl0Bf6_gCLcBGAs/s300/amp.png' property='og:image'/>
  81. <meta expr:content='data:blog.title' property='og:image:alt'/>
  82. <meta content='158' property='og:image:width'/>
  83. <meta content='158' property='og:image:height'/>
  84. </b:if>
  85. </b:if>
  86. <meta content='xxxxxxxxxxxxxx' property='fb:app_id'/>
  87. <meta content='xxxxxxxxxxxxxx' property='fb:admins'/>
  88. <meta content='xxxxxxxxxxxxxx' property='fb:profile_id'/>
  89. <meta content='xxxxxxxxxxxxxx' property='fb:pages'/>
  90. <meta content='xxxxxxxxxxxxxx' name='Author'/>
  91. <meta content='https://www.facebook.com/xxxxxxxxxxxxxx' property='article:author'/>
  92. <meta content='https://www.facebook.com/xxxxxxxxxxxxxx' property='article:publisher'/>
  93. <meta expr:content='data:blog.title' name='twitter:site'/>
  94. <meta content='summary_large_image' name='twitter:card'/>
  95. <meta content='@xxxxxxxxxxxxxx' name='twitter:creator'/>
  96.  
  97. <meta content='xxxxxxxxxxxxxx' name='alexaVerifyID'/>
  98. <meta content='xxxxxxxxxxxxxx' name='google-site-verification'/>
  99. <meta content='xxxxxxxxxxxxxx' name='msvalidate.01'/>
  100. <meta content='xxxxxxxxxxxxxx' name='yandex-verification'/>
  101.  
  102. <link href='//1.bp.blogspot.com' rel='dns-prefetch'/><link href='//2.bp.blogspot.com' rel='dns-prefetch'/><link href='//3.bp.blogspot.com' rel='dns-prefetch'/><link href='//4.bp.blogspot.com' rel='dns-prefetch'/><link href='//www.blogger.com' rel='dns-prefetch'/><link href='//fonts.googleapis.com' rel='dns-prefetch'/><link href='//resources.blogblog.com' rel='dns-prefetch'/><link href='//www.facebook.com' rel='dns-prefetch'/><link href='//plus.google.com' rel='dns-prefetch'/><link href='//twitter.com' rel='dns-prefetch'/><link href='//www.youtube.com' rel='dns-prefetch'/><link href='//feedburner.google.com' rel='dns-prefetch'/><link href='//feeds.feedburner.com' rel='dns-prefetch'/><link href='//github.com' rel='dns-prefetch'/><link href='//platform.twitter.com' rel='dns-prefetch'/><link href='//apis.google.com' rel='dns-prefetch'/><link href='//connect.facebook.net' rel='dns-prefetch'/><link href='//www.google-analytics.com' rel='dns-prefetch'/><link href='//pagead2.googlesyndication.com' rel='dns-prefetch'/><link href='//googleads.g.doubleclick.net' rel='dns-prefetch'/><link href='//www.gstatic.com' rel='dns-prefetch'/><link href='//www.googletagservices.com' rel='dns-prefetch'/><link href='//static.xx.fbcdn.net' rel='dns-prefetch'/><link href='//tpc.googlesyndication.com' rel='dns-prefetch'/><link href='//syndication.twitter.com' rel='dns-prefetch'/><link href='//fonts.gstatic.com' rel='dns-prefetch'/><link href='https://cdn.ampproject.org' rel='dns-prefetch'/><link href='https://3p.ampproject.net' rel='dns-prefetch'/><link href='https://cdn.rawgit.com' rel='dns-prefetch'/><link href='https://lh3.googleusercontent.com' rel='dns-prefetch'/><link href='https://tpc.googlesyndication.com' rel='dns-prefetch'/><link href='https://i.ytimg.com' rel='dns-prefetch'/><link href='https://i3.ytimg.com' rel='dns-prefetch'/><link href='https://img.youtube.com' rel='dns-prefetch'/><link href='https://www.googletagmanager.com' rel='dns-prefetch'/><link href='https://www.instagram.com' rel='dns-prefetch'/>
  103.  
  104. &lt;!-- /*<b:skin><![CDATA[
  105. #header-wrapper{width:100%;}
  106. #main-wrapper{width:60%;float:left;}
  107. #sidebar-wrapper{width:40%;float:right;}
  108. ul,li{list-style: none;}
  109. ]]></b:skin>
  110.  
  111. <style amp-custom='amp-custom'>
  112. /*<![CDATA[*/
  113. #main-wrapper,#sidebar-right,#sidebar-wrapper,.deleted-comment{word-wrap:break-word}
  114. #navbar-iframe{height:0;visibility:hidden;display:none}
  115. body{background:#EAEAEA;margin:0;font-family:-apple-system,BlinkMacSystemFont,"Roboto","Segoe UI","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;color:#555;}
  116. a{text-decoration:none;transition:all 400ms ease-in-out;color:#000}
  117. :active,:focus{outline:0}
  118. a img{border-width:0}
  119. *{-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
  120. i.klik-url{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}
  121. ::selection{background:#11589D;color:#fff}
  122. .header-wrapper{margin:0 20px 0 0;padding:0;height:60px;display:inline-block;float:left;}
  123. #header{max-width:100%;width:300px;margin:10px 0 0;padding:0;}
  124. #header h1,#header p{margin:0;padding:0;}
  125. #header h1 span,#header p span,#header p a span,#header h1 a span,#header .description{position:fixed;top:-3000px;left:-3000px;font-size:0;opacity:0}
  126.  
  127. .head-wrapper{position:fixed;top:0;left:0;right:0;z-index:998;height:60px;}
  128. .content-wrapper{width:100%;max-width:1100px;margin:0 auto;padding:0;position:relative}
  129. .head-wrapper .content-wrapper{margin:0 auto;padding:0 10px;position:relative;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05);}
  130. .outer-wrapper{margin:80px 0 0;padding:0;position:relative}
  131. #main-wrapper{width:calc(100% - 300px);float:left;margin:0 auto;padding:0;}
  132.  
  133. .post{background:#fff;margin:0 20px 0 0;padding:0 20px 20px;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05);}
  134. .post h1.post-title{font-size:48px;font-weight:300;line-height:1.1;margin:20px 0;}
  135. .post h1.post-title a{color:#333;}
  136. .post-body {font-size:16px;font-weight:400;color:#555;line-height:1.5;counter-reset:blockquote;}
  137. .post-body h1,.post-body h2,.post-body h3,.post-body h4,.post-body h5,.post-body h6{font-weight:700;line-height:1.2;color:#333;;margin:10px 0}
  138. .post-body h1{font-size:38px}
  139. .post-body h2{font-size:32px}
  140. .post-body h3{font-size:28px}
  141. .post-body h4,.post-body h5,.post-body h6{font-size:22px}
  142. .post-body a{font-weight:500;color:#000;display:inline-block}
  143. .post-body a:hover{color:#777}
  144. .post-body i{font-style:italic}
  145. .post-body .separator a{margin:0}
  146. .post-body amp-youtube{margin:0 -20px}
  147. .dailynodisplay{display:none}
  148. .post-body amp-img.emojika{vertical-align:-12%}
  149. .thumb-post{position:relative;margin:0 -20px 10px}
  150. .post-body blockquote,.post-body blockquote.kata-kata{font-size:18px;font-family:Georgia;color:#000;border-left:3px solid #11589D;padding:10px;margin:0 -20px;background:rgba(17,88,157,.1);line-height:1.3}
  151. .post-body blockquote.kata-kata{counter-increment:blockquote;padding-left:40px;position:relative;}
  152. .post-body blockquote.kata-kata:before{content:counter(blockquote)'.';position:absolute;left:0;top:0;color:#000;font-size:18px;z-index:2;width:40px;height:40px;line-height:40px;text-align:center;}
  153. .post-body blockquote cite{color:#11589D;font-size:14px;font-style:italic;display:block;margin-top:5px;}
  154. .post-body blockquote cite:before{content:"\2014 \2009";color:#000;}
  155.  
  156. .post-body pre,.post-body pre code{color:#11589D}
  157. .post-body pre{border-left:3px solid #11589D;background:rgba(17,88,157,.1);padding:8px 10px;overflow:auto;max-width:calc(100% + 40px);text-align:left;margin:0 -20px;-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}
  158. .post-body code,.post-body pre,.post-body pre code{font-family:Consolas,Monaco,'Andale Mono',monospace;white-space:initial;word-spacing:normal;word-break:normal;font-size:14px;line-height:1.3em}
  159. .post-body code{color:#11589D}
  160.  
  161. .post-body .table-responsive{min-height:.01%;overflow-x:auto}
  162. .post-body .table{width:100%;border-collapse:collapse;border-spacing:0}
  163. .post-body .table td,.post-body .table th{background-color:#F3F5EF;border:1px solid #bbb;color:#333;font-size:95%;padding:5px;vertical-align:top}
  164. .post-body .table tr:nth-child(even) td{background-color:#F0F0E5}
  165. .post-body .table th{background-color:#EAE2CF;color:#333;font-size:110%}
  166. .post-body .table tr.even:hover td,.post-body .table tr:hover td{color:#222;background-color:#FFFBEF}
  167. .tg-bf{font-weight:700}
  168. .tg-it{font-style:italic}
  169. .tg-left{text-align:left}
  170. .tg-right{text-align:right}
  171. .tg-center{text-align:center}
  172.  
  173. /* AMP Sidebar */
  174. .btn-sidebaramp{display:inline-block;background-image:url("data:image/svg+xml;charset=utf8,%3csvg viewBox='0 0 25 25' width='25' height='25' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%23333' d='M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");background-repeat:no-repeat;background-size:35px 35px;background-position:center center;background-color:transparent;width:48px;height:60px;border:none;position:absolute;top:0;right:0;cursor:pointer}
  175. amp-sidebar{width:300px;padding:0;background:#fff}
  176. svg.amp-close-image{position:absolute;top:15px;left:16px;cursor:pointer;}
  177. amp-sidebar ul{margin-top:20px;padding:0;list-style:none;}
  178. amp-sidebar li{margin:0;list-style:none;padding:10px 20px}
  179. amp-sidebar li:first-child{padding-top:0;}
  180. amp-sidebar li a{color:#333;font-weight:500;font-size:16px;display:block}
  181. amp-sidebar li a:hover{color:#777}
  182. amp-sidebar button{margin-left:20px}
  183. #side-bar h6 {border:none;background-color:#fff;font-size:16px;font-weight:500;color:#333;padding:0;margin:0 0 10px 20px}
  184. amp-sidebar ul li.drop ul{margin-top:10px}
  185. amp-sidebar ul li.drop ul li,amp-sidebar ul li.drop ul li:first-child{padding:10px 20px 0 40px}
  186. amp-sidebar li.drop{margin:0;list-style:none;padding:0}
  187. amp-sidebar li.drop section{margin:0;list-style:none;padding:10px 0 0}
  188. amp-sidebar li.drop li{border:0}
  189. amp-sidebar li.drop li:last-child{padding:10px 20px 10px 40px;margin-bottom:-2px}
  190. #side-bar h6 svg{width:20px;height:20px;vertical-align:middle;float:right;margin-right:20px}
  191. #side-bar h6 svg path{fill:#333}
  192. section:not([expanded]) .show-less,section[expanded] .show-more{display:none}
  193. .logo_sidebar{width:60%;height:auto;margin:50px auto 0}
  194. .follow_sidebar{line-height:normal;letter-spacing:normal;text-transform:uppercase;font-weight:700;color:#333;font-size:.94rem;padding-top:1.5rem;display:block;text-align: center;}
  195. .ampstart-social-follow{margin:.5rem 0 1rem;-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:initial;display:block;text-align: center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;list-style:none;padding-left:0}
  196. .ampstart-social-follow li{display:inline-block;margin-right:0;padding:0}
  197. .p1{padding:.5rem}
  198. .inline-block{display:inline-block}
  199. svg:not(:root){overflow:hidden}
  200. .ampstart-icon,.ampstart-sidebar .ampstart-icon{fill:#333}
  201.  
  202. /* homepage */
  203. .home_page #main-wrapper{width:calc(100% - 320px);padding:0 0 60px;position:relative}
  204. .home_page .post-outer{margin:0 0 20px;padding:0;}
  205. .home_page .home-relative{position:relative;}
  206. .home_page .post{margin:0;padding:0;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  207. .home_page .post .posts-thumb{width:30%;height:100%;float:left;position:relative;margin-right:10px;transition:all .3s ease-in-out}
  208. .home_page .post .posts-thumb amp-img{width:100%;height:100%}
  209. .home_page .post h2.post-title{font-size:18px;font-weight:700;margin:0;padding:10px;line-height:1.1;border-bottom:1px solid #ddd}
  210. .home_page .post h2.post-title a{color:#333;}
  211. .home_page .post:hover h2.post-title a{color:#000;}
  212. .home_page .post h2.post-title a:hover{color:#777;}
  213. .home_page .post .post-body .snippets{font-size:16px;margin:-5px 0 0;padding:10px;line-height:1.2;background-color:#fff;}
  214. .home_page .post .post-body h3{margin:0;}
  215. .home_page .post .posts-thumb .ribbon span{display:none}
  216.  
  217. .homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb{position:relative;margin-right:0;float:none;width:100%;height:auto;overflow:hidden;background:#fff;}
  218. .homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb amp-img {width:100%;height:auto;z-index:1}
  219. .homepage .blog-posts>.post-outer:nth-child(1) .post h2{padding:10px;margin:0;line-height:1}
  220. .homepage .blog-posts>.post-outer:nth-child(1) .post h2 a{font-size:40px;font-weight:300}
  221. .homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb .ribbon span{color:#333;padding:10px 90px 10px 35px;font-size:22px;font-weight:900;z-index:2;transform:rotate(-30deg);-webkit-transform:rotate(-30deg);display:block;background:#9BC90D;box-shadow:0 3px 10px -5px rgba(0,0,0,1);position:absolute;top:15px;left:-40px}
  222.  
  223. /* Sidebar */
  224. aside{width:300px;float:right;padding:0;margin:0 auto;position:-webkit-sticky;position:sticky;top:80px}
  225. #sidebar-wrapper{width:300px;float:right;padding:0;margin:0}
  226. .sidebar h2{background-color:#fff;font-size:16px;margin:0;padding:10px;color:#333;text-transform:uppercase;}
  227. .footer,.sidebar{color:#333;line-height:1.3em;font-size:16px;font-weight:400;}
  228. .sidebar .widget{margin:0 auto 20px;padding:0;}
  229. .sidebar .widget-content{margin:0 auto;padding:0}
  230.  
  231. /* Menu Page */
  232. .page{display:inline-block;height:60px;line-height:60px;float:right;margin-right:38px;}
  233. .PageList ul{margin:0;padding:0;list-style:none;text-align:center;font-size:0;}
  234. .PageList ul li{margin:0;padding:0;list-style:none;height:60px;line-height:60px;float:left;}
  235. .PageList ul li a,.PageList ul li .search-open{display:inline-block;margin:0;padding:0 8px;font-size:14px;font-weight:400;color:#333;}
  236. .PageList ul li a:hover{color:#777}
  237. .PageList ul li .search-open svg{vertical-align:middle;cursor:pointer}
  238.  
  239. /* Search Box */
  240. .search-close{position:absolute;top:20px;right:20px;z-index:999;cursor:pointer}
  241. #search_box{position:fixed;top:100px;left:0;right:0;z-index:999;}
  242. .search_box .content-wrapper{background:#262626;padding:10px;-webkit-animation:slide-down .3s ease-out;-moz-animation:slide-down .3s ease-out}
  243. .BlogSearch h2.title{display:none}
  244. .BlogSearch .gsc-search-box{width:100%}
  245. .BlogSearch input.gsc-input{width:calc(100% - 10px);padding-right:4px\9;padding-left:4px\9;margin-bottom:0;-webkit-border-radius:3px;-moz-border-radius:3px;height:34px;padding:6px 12px;font-size:95%;line-height:1.428571429;color:#555;vertical-align:middle;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}
  246. .BlogSearch input.gsc-input:focus{border-color:#11589D;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(17,88,157,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(17,88,157,.6)}
  247. .BlogSearch input.gsc-input:-moz-placeholder{color:#999}
  248. .BlogSearch input.gsc-input::-moz-placeholder{color:#999;opacity:1}
  249. .BlogSearch input.gsc-input:-ms-input-placeholder{color:#999}
  250. .BlogSearch input.gsc-input::-webkit-input-placeholder{color:#999}
  251. .BlogSearch td.gsc-search-button{width:60px;}
  252. .BlogSearch input.gsc-search-button{background-color:#11589D;border:0;-webkit-border-radius:3px;-moz-border-radius:3px;width:100%;height:34px;padding:6px 0;text-align:center;font:700 95% Roboto;line-height:1.428571429;color:#fff;vertical-align:middle;background-image:none;border-radius:4px;cursor:pointer;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
  253.  
  254. /* Breadcrumb */
  255. .breadcrumbs{line-height:1.2em;width:auto;overflow:hidden;margin:0;padding:10px 0;border-bottom:1px solid #ddd;font-size:80%;color:#555;font-weight:400;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;white-space:nowrap}
  256. .breadcrumbs a{display:inline-block;text-decoration:none;transition:all .3s ease-in-out;color:#555;font-weight:400}
  257. .breadcrumbs a:hover{color:#777}
  258. .breadcrumbs,.breadcrumbs a,.credit{font-weight:400}
  259. .breadcrumbs svg{width:16px;height:16px;vertical-align:-4px}
  260. .breadcrumbs svg path{fill:#555}
  261.  
  262. /* Posts Navigator */
  263. #blog-pager-newer-link,#blog-pager-older-link{font-size:100%}
  264. .blog-pager-older-link,.home-link, .blog-pager-newer-link{padding:0}
  265. .halaman-kanan,.halaman-kiri,.pager-title-left{transition:all .3s ease-in-out}
  266. .halaman{margin:20px 20px 20px 0;padding:10px 0;height:auto;background-color:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05);}
  267. .halaman-kanan,.halaman-kiri{color:#141924;background:0 0;width:50%;position:relative;margin:0}
  268. .halaman-kiri{height:auto;float:left;padding:0 10px 0 32px;text-align:left;}
  269. .halaman-kanan{height:auto;float:right;padding:0 32px 0 10px;text-align:right;}
  270. .halaman-kanan a:hover,.halaman-kanan:hover .pager-title-left,.halaman-kiri a:hover,.halaman-kiri:hover .pager-title-left{color:#e8554e}
  271. .current-pageleft,.current-pageright,.halaman-kanan a,.halaman-kiri a{font-size:16px;font-weight:500;background:0 0;color:#555;text-decoration:none;line-height:1.3em}
  272. #blog-pager,.isihalaman-kanan,.isihalaman-kiri{margin:0}
  273. .panahkanan,.panahkiri{position:absolute;top:50%;margin-top:-16px;color:#777;width:32px;height:32px}
  274. .panahkiri{left:0}
  275. .panahkanan{right:0}
  276.  
  277. /* Blog Pager */
  278. .home_page a.blog-pager-newer-link,.home_page a.blog-pager-older-link,.home_page .home-box,.home_page .last-box,.home_page a.home-link{box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  279. .home_page #blog-pager-newer-link svg,.home_page #blog-pager-older-link svg,.home_page .home-box svg,.home_page .last-box svg{width:44px;height:44px}
  280. .home_page #blog-pager-home-link svg{width:30px;height:30px;vertical-align:-10px}
  281. .home_page .home-box svg path,.home_page .last-box svg path{fill:#666}
  282. .home_page #blog-pager-newer-link{float:left;font-size:200%;font-weight:500}
  283. .home_page #blog-pager-older-link{float:right;font-size:200%;font-weight:500}
  284. .home_page #blog-pager,.home_page .blog-pager{clear:both;text-align:center;}
  285. .home_page #blog-pager-newer-link a,.home_page #blog-pager-older-link a,.home_page a.home-link{color:#333;transition:all .4s ease-in-out}
  286. .home_page #blog-pager-newer-link a:hover,.home_page #blog-pager-older-link a:hover,.home_page a.home-link:hover{color:red}
  287. .home_page a.blog-pager-newer-link,.home_page a.blog-pager-older-link,.home_page #blog-pager-home-link a.home-link{background:#fff;color:#666;padding:0;width:43px;height:43px;text-align:center;transition:all 400ms ease-in-out;position:absolute;bottom:20px;line-height:43px;border:1px solid transparent}
  288. .home_page a.blog-pager-older-link{border-radius:3px;right:0;z-index:2}
  289. .home_page a.blog-pager-newer-link{border-radius:3px;left:0;z-index:2}
  290. .home_page #blog-pager-home-link a.home-link{font-size:100%;font-weight:600;border-radius:3px;left:50%;margin-left:-22px}
  291. .home_page #blog-pager-newer-link a:hover,.home_page #blog-pager-older-link a:hover,.home_page .home-box:hover,.home_page .last-box:hover,.home_page #blog-pager-home-link a.home-link:hover{color:#333}
  292. .home_page .home-box,.home_page .last-box{background:#fff;color:#666;padding:0;border-radius:3px;position:absolute;bottom:20px;width:43px;height:43px;z-index:1;font-size:200%;font-weight:600;text-align:center;cursor:not-allowed;}
  293. .home_page .home-box{left:0;}
  294. .home_page .last-box{right:0;}
  295.  
  296. /* Related Posts */
  297. .related-post h4{margin:0 10px 10px 0;font-size:24px;font-weight:500;padding:0;color:#333}
  298. .related-post{width:100%;margin:0;padding:0;font-size:16px;text-align:left;}
  299. .related-wrapper{overflow:hidden;}
  300.  
  301. /* Social Share */
  302. .share-box{position:relative;margin-top:20px}
  303. .share-box.atas{margin-top:-6px;margin-bottom:10px;height:52px;overflow:hidden;}
  304. .share-box.atas amp-addthis iframe{margin-top:0;margin-left:-8px;}
  305. .displayinlineblock{display:inline-block;}.floatleft{float:left;}.borderradius3{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
  306.  
  307. .clear{clear:both}
  308.  
  309. /* Credit Footer */
  310. .credit{line-height:1.5em}
  311. .credit-wrapper{background:#fff;margin:0;padding:10px;font-size:90%;color:#555;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05);}
  312. .credit-wrapper a:link,.credit-wrapper a:visited{color:#555;text-decoration:none}
  313. .credit-wrapper a:hover{color:#777;text-decoration:none}
  314. .credit-left{float:left}
  315. .credit-right{float:right}
  316.  
  317. .updated{border-bottom:0}
  318. abbr[title]{text-decoration:none}
  319. .post .jump-link,.quickedit{display:none}
  320.  
  321. /* Populer Posts */
  322. .PopularPosts .widget-content ul{width:100%;margin:0;padding:0;list-style-type:none;counter-reset:popcount}
  323. .PopularPosts .widget-content ul li{margin:0 0 10px;padding:0;height:170px;overflow:hidden;position:relative;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  324. .PopularPosts .widget-content ul li:last-child{margin:0;}
  325. .PopularPosts .widget-content ul li a{color:#fff;text-decoration:none;font-size:18px;font-weight:500}
  326. .PopularPosts .widget-content ul li:hover .item-title a{bottom:0}
  327. .PopularPosts .widget-content ul li:hover img{-webkit-transform: scale(1.3);-ms-transform: scale(1.3);-o-transform: scale(1.3);transform: scale(1.3);}
  328. .PopularPosts .widget-content ul li img{width:100%;height:170px;padding-right:0;transition:all .6s ease-in-out;}
  329. .PopularPosts .item-thumbnail{float:none;margin:0 0 -4px}
  330. .PopularPosts .item-title a{padding:10px;position:absolute;bottom:-100px;left:0;right:0;text-align:left;background:rgba(0,0,0,.5);transition:all .3s ease-in-out}
  331. .PopularPosts .item-title a:hover{color:yellow}
  332. .PopularPosts .item-snippet{display:none}
  333.  
  334. /* Featured Post */
  335. #FeaturedPost1 h3{margin:0;padding:10px;line-height:1.1em;font-size:18px;font-weight:700;border-bottom:1px solid #ddd}
  336. #FeaturedPost1 h3 a{line-height:1.1em;color:#333}
  337. #FeaturedPost1 .post-summary h3 a:hover{color:#777}
  338. #FeaturedPost1 p{margin:0;padding:10px;color:#555}
  339. #FeaturedPost1{background-color:#fff;margin:0 0 20px;display:block;padding:0;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05);}
  340.  
  341. /* Widget Label */
  342. #Label1 .widget-content{margin:0;padding:0 10px 5px 5px;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  343. .label-size{margin:0;padding:0}
  344. .label-size a,.label-size span{text-decoration:none;float:left;height:18px;line-height:18px;position:relative;margin-bottom:5px;margin-left:5px;padding:6px 10px;background:#333;border-radius:3px;color:#fff;font-weight:500;font-size:16px;text-align:center;display:inline-table;}
  345. .label-size a:hover,.label-size span:hover{background:#888;}
  346.  
  347. /* Subscribe Box */
  348. .follow-by-email-inner table{width:100%;}
  349. .follow-by-email-inner td{display:block;margin:0 -3px}
  350. .follow-by-email-inner .follow-by-email-address{width:100%;font-family:Roboto,sans-serif;font-weight:400;height:auto;margin:0 auto 5px;padding:10px;color:#333;position:relative;z-index:1;background:#fff;border:1px solid #ccc;border-radius: 4px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
  351. .follow-by-email-inner .follow-by-email-address:focus,.follow-by-email-inner .follow-by-email-submit:focus{outline:0}
  352. .follow-by-email-inner .follow-by-email-submit{display:block;width:100%;height:30px;font-family:Roboto,sans-serif;font-weight:500;font-size:16px;text-transform: uppercase;float:left;color:#FFF;padding:0 20px;cursor:pointer;background-color:#11589D;border:none;border-radius:2px;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
  353.  
  354. /* Button */
  355. @font-face{font-family:"Product Sans";src:url("https://cdn.rawgit.com/KompiAjaib/font/master/product-sans-regular.ttf") format("ttf");font-weight:normal;font-style:normal;}
  356. a.btn-download,a.btn-play,a.btn-google,a.btn-apple,a.btn-play:hover,a.btn-download:hover,a.btn-google:hover,a.btn-apple:hover{color:#fff}
  357. .btn{display:inline-block;padding:10px 16px;margin:5px;font-size:18px;line-height:1.3333333;border-radius:6px;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid transparent;font-weight:500;text-decoration:none}
  358. .btn:active:focus,.btn:focus{outline:0}
  359. .btn:focus,.btn:hover{color:#333;text-decoration:none;outline:0}
  360. .btn:active{outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}
  361. .btn-play{color:#fff;background-color:#D32F2F;border-color:#C62828;padding:10px 16px 10px 40px;position:relative;font-family: 'Product Sans', Arial, sans-serif;font-weight:600}
  362. .btn-play:focus{color:#fff;background-color:#C62828;border-color:#B71C1C}
  363. .btn-play:active,.btn-play:hover{color:#fff;background-color:#C62828;border-color:#B71C1C}
  364. .btn-play:before{content:"";color:#fff;background-image:url(https://1.bp.blogspot.com/-DpJGZ47Olck/WSkXyTDP1kI/AAAAAAAArQQ/UwIxH4hYRIkbgZkN0_mUrkK12HveGFsXACLcB/s1600/play.png);background-size:cover;background-repeat:no-repeat;width:30px;height:40px;position:absolute;left:0;top:50%;margin-top:-20px}
  365. .btn-download{color:#fff;background-color:#337ab7;border-color:#2e6da4;font-family: 'Product Sans', Arial, sans-serif;font-weight:600}
  366. .btn-download:focus{color:#fff;background-color:#286090;border-color:#122b40}
  367. .btn-download:active,.btn-download:hover{color:#fff;background-color:#286090;border-color:#204d74}
  368. .btn-google,.btn-apple{color:#fff;background-color:#111;border-color:#000;position:relative;font-family: 'Product Sans', Arial, sans-serif;font-weight:600}
  369. .btn-google{padding:15px 16px 5px 40px;}
  370. .btn-apple{padding:15px 22px 5px 50px;}
  371. .btn-google:focus,.btn-apple:focus{color:#fff;background-color:#555;border-color:#000}
  372. .btn-google:active,.btn-google:hover,.btn-apple:active,.btn-apple:hover{color:#fff;background-color:#555;border-color:#000;}
  373. .btn-apple:before,.btn-google:before{background-size:cover;background-repeat:no-repeat;width:30px;height:30px;margin-top:-15px;position:absolute}
  374. .btn-google:before{content:"";background-image:url(https://4.bp.blogspot.com/-52U3eP2JDM4/WSkIT1vbUxI/AAAAAAAArQA/iF1BeARv2To-2FGQU7V6UbNPivuv_lccACLcB/s30/nexus2cee_ic_launcher_play_store_new-1.png);left:6px;top:50%}
  375. .btn-google:after{content:"GET IT ON";position:absolute;top:5px;left:40px;font-size:10px;font-weight:400}
  376. .btn-apple:before{content:"";background-image:url(https://2.bp.blogspot.com/-pfguXOXm3fg/WfbA_JMxnOI/AAAAAAAAtoA/wkc55zw6kZ4cG-S-9K2HVie6RxXRhuvdACLcBGAs/s30/apple.png);left:10px;top:50%}
  377. .btn-apple:after{content:"Download on the";position:absolute;top:5px;left:50px;font-size:11px;font-weight:400}
  378. kbd{color:#333;display:inline-block;-moz-border-radius:3px;-moz-box-shadow:0 1px 0 rgba(0,0,0,.2),0 0 0 2px #fff inset;-webkit-border-radius:3px;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.2),0 0 0 2px #fff inset;background-color:#f7f7f7;border:1px solid #ccc;border-radius:3px;box-shadow:0 1px 0 rgba(0,0,0,.2),0 0 0 2px #fff inset;font-family:Arial,Helvetica,sans-serif;font-size:11px;line-height:1.4;margin:0 .1em;padding:.1em .6em;text-shadow:0 1px 0 #fff;vertical-align:3px}
  379.  
  380. /* Label and Search Pages Status */
  381. .status-msg-wrap{font-size:14px;font-weight:400;width:100%;height:auto;color:#555;margin:0;position:relative;padding:0;}
  382. .status-msg-border{border:1px solid #fff;opacity:0;width:100%;position:relative;height:20px}
  383. .status-msg-bg{background-color:transparent;opacity:.8;width:100%;position:relative;z-index:1}
  384. .status-msg-body{text-align:center;margin:0;padding:6px 10px 10px;width:100%;word-wrap:break-word;z-index:4;line-height:1.3;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  385. .status-msg-hidden{visibility:hidden;padding:.3em 0}
  386. .status-msg-wrap a{color:#fff;font-weight:500;text-decoration:none;background:#333;border-radius:2px;margin:0 6px 0 -6px;padding:3px 5px;width:130px;max-width:130px;display:inline-block;line-height:1.3}
  387. .status-msg-body b{font-size:20px;color:#333;display:block;margin-bottom:6px}
  388. .status-msg-body:after{content:"";display:block;clear:both}
  389. .status-msg-body a:last-child{margin-right:0}
  390.  
  391. /* Static Page */
  392. .static_page #sidebar-wrapper,.static_page #comments,.static_page .disqus,.static_page .leaderboard{display:none}
  393. .static_page .post h2{text-align:center;margin:0;padding:10px 0;border-bottom:1px solid #ddd}
  394. .static_page .post h2 a{font-size:24px;font-weight:700;color:#333;}
  395. .static_page .outer-wrapper{margin:80px 0 0;padding:0;position:relative}
  396. .static_page #main-wrapper{width:100%;padding:0}
  397. .static_page .post{margin:0 0 20px;}
  398. .static_page .post-body{margin:20px 0;padding:0;}
  399. .static_page a.home-link{visibility:hidden}
  400. .static_page .fb-comments{display:none;visibility:hidden}
  401.  
  402. /* Contact Page */
  403. .contact-box{margin-top:10px}
  404. .contact-box svg{width:24px;height:24px;vertical-align:-6px;margin-right:5px}
  405. .contact-box svg path{fill:#efefef}
  406. .contact-box .bbm svg{width:20px;height:20px;vertical-align:-5px;margin-right:5px}
  407. .contact-box .bbm{margin-top:6px}
  408. .post-body .contact-me a{color:#efefef;font-weight:400}
  409. .post-body .contact-me a[href^="http://"]:after,.post-body .contact-me a[href^="https://"]:after,.post-body .contact-me a[href^="mailto:"]:after{content:"";background:url("data:image/svg+xml;charset=utf8,%3csvg viewBox='0 0 24 24' width='16' height='16' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%23efefef' d='M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e") no-repeat;background-size:16px 16px;width:16px;height:16px;display:inline-block;margin-left:3px;vertical-align:-2px}
  410. .contact-me{display:block}
  411. .contact-me span{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}
  412. .contact-me amp-accordion h5 span{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
  413. .contact-box .map,.contact-box .bbm{position:relative;padding-left:29px}
  414. .contact-box .bbm .barcode-bbm{margin:10px 0;width:300px}
  415. .contact-box .bbm span span{font-weight:300}
  416. .contact-box .map svg{position:absolute;top:0;left:0}
  417. .contact-box .bbm svg{position:absolute;top:4px;left:0}
  418. .contact-box amp-accordion section:not([expanded]) .show-less,.contact-box amp-accordion section[expanded] .show-more{display:none}
  419. .contact-box amp-accordion h5{background:none;border:none;color:#efefef;font-weight:500;font-size:14px;margin:0;padding:0;text-align:left;}
  420.  
  421. /* Post Image Style */
  422. .img-center{text-align:center;margin:0 auto;}
  423. .img-left{clear:left;float:left;margin-bottom:1em;margin-right:1em;text-align:center;}
  424. .img-right{clear:right;float:right;margin-bottom:1em;margin-left:1em;text-align:center;}
  425. .img-width-100,.img-width-200,.img-width-300,.img-width-400,.img-width-500,.img-width-600{width:100%;text-align:center;clear:both}
  426. .img-width-100{max-width:100px;}
  427. .img-width-200{max-width:200px;}
  428. .img-width-300{max-width:300px;}
  429. .img-width-400{max-width:400px;}
  430. .img-width-500{max-width:500px;}
  431. .img-width-600{max-width:600px;}
  432.  
  433. /* CSS Untuk Iklan */
  434. .leaderboard{width:100%;height:auto;text-align:center;margin:0 0 20px;padding:0}
  435. .post-body .inline_wrapper{width:100%;height:auto;text-align:center;margin:0 0 10px;padding:0}
  436. .post-body .inline_wrapper span{color:#efefef;font-size:10px;margin:0 auto 5px;display:block}
  437. .iklan-bawahpost,.iklan-ataspost{width:100%;height:auto;text-align:center;padding:0;margin:20px auto;}
  438. .iklan-ataspost{margin:10px 0 20px;padding-top:10px;border-top:1px solid #ddd;}
  439. .iklan-bawahpost amp-fx-flying-carpet{width:100%;width:calc(100% + 20px);height:auto;margin:0 -10px;}
  440. .iklan-ataskomen{padding:0;margin:20px 20px 20px 0}
  441.  
  442. /* Disclaimer Box */
  443. .disclaimer_box{margin-right:20px;padding:2px;background:linear-gradient(60deg,#f79533,#f37055,#ef4e7b,#a166ab,#5073b8,#1098ad,#07b39b,#6fba82);border-radius:6px;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  444. .disclaimer_box .content{background:#fff;color:#555;padding:8px 12px;font-size:95%;border-radius:4px;box-shadow:0 0 0 3px rgba(255,255,255,.3)}
  445. .disclaimer_box .content p{margin:0;padding:0}
  446.  
  447. /* Follow Button & Comment Button */
  448. .follow-button,.buka-komen,.tutup-komen{font-family:Roboto,sans-serif;background-color:#fff;color:#333;font-size:16px;line-height:1.3em;padding:10px;display:block;min-width:54px;text-align:center;font-weight:500;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-transition:all 218ms;-moz-transition:all 218ms;-o-transition:all 218ms;transition:all 218ms;-webkit-user-select:none;-moz-user-select:none;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  449. .follow-button{margin:10px 0 0;}
  450. .buka-komen{margin:20px 20px 20px 0;cursor:pointer;}
  451. .tutup-komen{margin:20px 20px 0 0;cursor:pointer;border-bottom:1px solid #ddd;-webkit-border-radius:2px 2px 0 0;-moz-border-radius:2px 2px 0 0;border-radius:2px 2px 0 0;}
  452.  
  453. /* Comments */
  454. #komen{margin:0 20px 20px 0;padding:0 20px;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05),0 3px 3px rgba(0,0,0,.05)}
  455. .fb-comments{margin:0 -8px;padding:0;}
  456. #komen.disqus{margin:0 20px 20px 0;padding:0 12px 20px;}
  457.  
  458. /* Scroll To Top */
  459. .scrollToTop{color:#333;font-size:1.4em;box-shadow:0 1px 1.5px 0 rgba(0,0,0,.12),0 1px 1px 0 rgba(0,0,0,.24);width:50px;height:50px;border-radius:100px;border:none;outline:0;background:#fff;z-index:997;bottom:10px;right:10px;position:fixed;opacity:0;visibility:hidden;cursor:pointer}
  460. #marker{position:absolute;top:100px;width:0;height:0}
  461. .scrollToTop svg{width:34px;height:34px;vertical-align:middle;}
  462. #totop:before{content:"";display:block;height:20px;margin-top:-20px;visibility:hidden}
  463.  
  464. .skip-navigation{background-color:#fff;color:#000;display:block;height:0;left:0;line-height:50px;overflow:hidden;padding-top:0;position:fixed;text-align:center;top:0;width:100%;z-index:900}
  465. .mb20{margin-bottom:20px}
  466.  
  467. .mobile-up,amp-youtube#test-off img,amp-instagram#test-off2 amp-img{display:none;visibility:hidden}
  468. amp-lightbox#open-lightbox{z-index:998}
  469. .lightbox-search{background:rgba(255,255,255,.8);width:100%;height:100%;position:fixed;top:0;left:0;z-index:998}
  470.  
  471. .spoiler input[type=checkbox]:checked~label:before,.spoiler input[type=checkbox]~label:before{content:"";height:0;width:0;border-style:solid;left:8px;position:absolute}
  472. .spoiler .spoiler_title{display:inline;float:left;margin:3px 10px 0 0;padding:4px 0;font-size:16px;line-height:1}
  473. .spoiler label{cursor:pointer;background:#26272a;margin:0;padding:4px 18px 4px 22px;outline:0;border-radius:3px;color:#efefef;transition:all .3s ease-in-out;display:inline;font-size:12px;font-family:arial,san-serif;line-height:1;position:relative}
  474. .spoiler input[type=checkbox]~label:before{border-width:4px 4px 4px 7px;border-color:transparent transparent transparent #fff;top:7px}
  475. .spoiler input[type=checkbox]:checked~label:before{border-width:7px 4px 4px;border-color:#fff transparent transparent;top:8px}
  476. .spoiler input{position:absolute;left:-999em;opacity:0}
  477. .spoiler .content_box{width:100%;border:1px solid #ddd;background:#efefef;height:auto;padding:6px 10px;margin:8px 0 0;overflow:hidden;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
  478. .spoiler .content_box .content{display:none}
  479. .spoiler .content p{padding:0;margin:0}
  480. .spoiler .content p img{margin:4px 0 0;max-width:100%;height:auto}
  481. .spoiler input[type=checkbox]:checked~.content_box .content{display:block;-webkit-animation:slide-down .3s ease-out;-moz-animation:slide-down .3s ease-out}
  482. @-webkit-keyframes slide-down{0%{opacity:0;-webkit-transform:translateY(-100%)}
  483. 100%{opacity:1;-webkit-transform:translateY(0)}
  484. }
  485. @-moz-keyframes slide-down{0%{opacity:0;-moz-transform:translateY(-100%)}
  486. 100%{opacity:1;-moz-transform:translateY(0)}
  487. }
  488. #close-comment::before,#open-comment::before,:target::before{content:"";display:block;height:60px;margin-top:-60px;visibility:hidden}
  489.  
  490. /* External link icon */
  491. .post-body a[href^="http://"]:after,.post-body a[href^="https://"]:after{content:'';background:url("data:image/svg+xml;charset=utf8,%3csvg viewBox='0 0 24 24' width='16' height='16' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%23000' d='M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e") no-repeat;background-size:16px 16px;width:16px;height:16px;margin-left:3px;vertical-align:-2px;display:inline-block;transition:all 400ms ease-in-out;}
  492. .post-body a[href^="http://"]:hover:after,.post-body a[href^="https://"]:hover:after{background:url("data:image/svg+xml;charset=utf8,%3csvg viewBox='0 0 24 24' width='16' height='16' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%23777' d='M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e") no-repeat;}
  493. .post-body a[href^="http://www.myinfo.web.id/"]:after,.post-body a[href^="http://www.myinfo.web.id/"]:hover:after,.post-body a[href^="https://www.myinfo.web.id/"]:after,.post-body a[href^="https://www.myinfo.web.id/"]:hover:after{display:none}
  494.  
  495. /* Responsive */
  496. @media screen and (max-width:1024px){.home_page .content-wrapper,.content-wrapper{padding:0 10px}
  497. .search_box .content-wrapper{padding:10px}
  498. }
  499. @media screen and (max-width:960px){.home_page .post .post-body .snippets{font-size:90%}.home_page .post h2.post-title{font-size:16px}.home_page .post .posts-thumb{margin-right:10px}
  500. }
  501. @media screen and (max-width:800px){.homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb,.homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb amp-img{height:300px}
  502. }
  503. @media screen and (max-width:768px){.home_page .post h2.post-title{font-size:22px}
  504. .share-box.atas{height:98px;}.post h1.post-title{font-size:30px}
  505. }
  506. @media screen and (max-width:640px){.content-wrapper{padding:0;overflow:hidden}
  507. #main-wrapper,#sidebar-wrapper,.home_page #main-wrapper,aside{width:100%;float:none;margin:0 auto}
  508. .home_page #main-wrapper{padding:0 0 75px}
  509. .homepage .post .posts-thumb,.homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb{position:relative;margin-right:0;float:none;width:100%;height:auto;max-height:unset;overflow:hidden;background:#fff;}
  510. .homepage .post .posts-thumb amp-img,.homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb amp-img {width:100%;height:auto;max-height:unset;z-index:1}
  511. .homepage .post h2,.homepage .blog-posts>.post-outer:nth-child(1) .post h2{padding:10px;margin:0;line-height:1}
  512. .homepage .post h2 a,.homepage .blog-posts>.post-outer:nth-child(1) .post h2 a{font-size:20px;font-weight:700}
  513. .home_page .content-wrapper{padding:0 10px}
  514. .home_page .post .post-body .snippets{font-size:16px}
  515. .homepage .blog-posts>.post-outer:nth-child(1) .post .posts-thumb .ribbon span{display:none}
  516. .PopularPosts .widget-content ul li{height:auto}
  517. .post{margin:0;padding:0 10px 10px}
  518. .img-width-500.img-left,.img-width-500.img-right,.img-width-600.img-left,.img-width-600.img-right{clear:both;float:none;margin:1em auto;text-align:center}
  519. .post-body amp-youtube,.post-body blockquote,.post-body pre{margin:0 -10px}
  520. .post-body pre{max-width:calc(100% + 20px)}
  521. .post-body .table-responsive{width:100%;margin-bottom:15px;overflow-y:hidden;-ms-overflow-style:-ms-autohiding-scrollbar}
  522. .post-body .table-responsive>.table{margin-bottom:0}
  523. .post-body .table-responsive>.table>tbody>tr>td,.post-body .table-responsive>.table>tbody>tr>th,.post-body .table-responsive>.table>tfoot>tr>td,.post-body .table-responsive>.table>tfoot>tr>th,.post-body .table-responsive>.table>thead>tr>td,.post-body .table-responsive>.table>thead>tr>th{white-space:nowrap}
  524. .scrollToTop{bottom:90px}
  525. .desktop-up,amp-sidebar ul,amp-sidebar ul li amp-accordion{display:none;visibility:hidden}
  526. .mobile-up,amp-sidebar[side][open] ul,amp-sidebar[side][open] ul li amp-accordion{display:block;visibility:visible}
  527. .halaman,.iklan-ataskomen,.buka-komen{margin:20px 0}
  528. .disclaimer_box{margin:0 10px}
  529. .tutup-komen{margin:20px 0 0}
  530. .PageList ul li .search-open{margin:0 20px 0 0}
  531. .PageList ul li .search-open svg{width:30px;height:30px}
  532. #header{width:120px;margin:17px 0 0;}
  533. .PageList ul li,.btn-sidebaramp,.head-wrapper,.header-wrapper,.page{height:50px}
  534. .PageList ul li,.page{line-height:50px}
  535. .outer-wrapper{margin:50px 0 0}
  536. .home_page .post-outer,.leaderboard{margin:0 0 10px}
  537. #komen{margin:0 0 20px;padding:0 10px;}
  538. #komen.disqus{margin:0 0 20px;padding:0 2px;}
  539. .buka-komen,.tutup-komen{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0}
  540. .search_box .content-wrapper{padding:10px}
  541. }
  542. @media screen and (max-width:414px){
  543. .btn-sidebaramp{top:0;right:15px;background-size:45px 45px;}
  544. .credit-left,.credit-right{float:none;text-align:center;width:100%}
  545. .img-width-100.img-left,.img-width-100.img-right,.img-width-200.img-left,.img-width-200.img-right,.img-width-300.img-left,.img-width-300.img-right,.img-width-400.img-left,.img-width-400.img-right{clear:both;float:none;margin:1em auto;text-align:center;}
  546. }
  547.  
  548. @media print{header,#blog-pager,#comments,#footer-wrapper,#header-wrapper,#related-post,#sidebar-wrapper,.blog-pager,.breadcrumbs,.postmeta,h3.date-header,.PageList,.search_box,.BlogSearch,.main_menu,.leaderboard,.share-box{display:none}
  549. body{background:#fff}
  550. #main-wrapper{width:100%;border:none}
  551. .outer-wrapper{border:none}
  552. .content-wrapper{max-width:100%;height:100%;overflow:hidden;border:none}
  553. .post-body{margin:0;padding:0}
  554. .credit-wrapper{background:#fff;color:#666;margin:0;padding:0}
  555. .credit-wrapper a:link, .credit-wrapper a:visited{background:#fff;color:#666;margin:0;padding:0}
  556. }
  557.  
  558. /* Error Page */
  559. #error-page{background:#efefef;position:fixed ;position:absolute;text-align:center;top:0;right:0;bottom:0;left:0;z-index:99999;width:100%}
  560. #error-page .error-404 {text-align: center; transition: all 0.8s ease 0s;color: #b0130d; font-size:800%; font-weight: 700;margin-bottom:0px;margin-top:0;line-height:1em}
  561. #error-page .large-heading1 {color: #000;font-size:400%;margin-top:1%;margin-bottom:0px;position:relative;font-weight:700}
  562. #error-page .large-heading2 {color: #000;font-size:250%;}
  563. #error-page .light-heading1 {color: #000;font-size:150%;}
  564. #error-page .light-heading2 {color: #000;font-size:100%;line-height:1.8em;}
  565. #error-page #search{text-align:center}
  566. #error-page #search ul{list-style:none}
  567. #error-page #search input{padding:6px 10px;margin:15px 0 0 -1px}
  568. #error-page .light-heading2 span{background:#ddd;border:1px solid #aaa;border-radius:3px;padding:2px 5px}
  569. /*]]>*/
  570. </style>
  571.  
  572. <style amp-boilerplate='amp-boilerplate'>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate='amp-boilerplate'>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
  573. <script async='async' src='https://cdn.ampproject.org/v0.js'/>
  574. <script async='async' custom-element='amp-analytics' src='https://cdn.ampproject.org/v0/amp-analytics-0.1.js'/>
  575. <b:if cond='data:blog.pageType != &quot;error_page&quot;'>
  576. <script async='async' custom-element='amp-form' src='https://cdn.ampproject.org/v0/amp-form-0.1.js'/>
  577. <script async='async' custom-element='amp-accordion' src='https://cdn.ampproject.org/v0/amp-accordion-0.1.js'/>
  578. <script async='async' custom-element='amp-sidebar' src='https://cdn.ampproject.org/v0/amp-sidebar-0.1.js'/>
  579. <script async='async' custom-element='amp-iframe' src='https://cdn.ampproject.org/v0/amp-iframe-0.1.js'/>
  580. <script async='async' custom-element='amp-lightbox' src='https://cdn.ampproject.org/v0/amp-lightbox-0.1.js'/>
  581. </b:if>
  582. <b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;error_page&quot;'>
  583. <script async='async' custom-element='amp-position-observer' src='https://cdn.ampproject.org/v0/amp-position-observer-0.1.js'/>
  584. <script async='async' custom-element='amp-animation' src='https://cdn.ampproject.org/v0/amp-animation-0.1.js'/>
  585. </b:if>
  586. <b:if cond='data:blog.pageType == &quot;item&quot;'>
  587. <!--<script async='async' custom-element='amp-social-share' src='https://cdn.ampproject.org/v0/amp-social-share-0.1.js'/>-->
  588. <script async='async' custom-element='amp-facebook-comments' src='https://cdn.ampproject.org/v0/amp-facebook-comments-0.1.js'/>
  589. <script async='async' custom-element='amp-youtube' src='https://cdn.ampproject.org/v0/amp-youtube-0.1.js'/>
  590. <script async='async' custom-element='amp-carousel' src='https://cdn.ampproject.org/v0/amp-carousel-0.1.js'/>
  591. <script async='async' custom-element='amp-image-lightbox' src='https://cdn.ampproject.org/v0/amp-image-lightbox-0.1.js'/>
  592. <script async='async' custom-element='amp-instagram' src='https://cdn.ampproject.org/v0/amp-instagram-0.1.js'/>
  593. <script async='async' custom-element='amp-twitter' src='https://cdn.ampproject.org/v0/amp-twitter-0.1.js'/>
  594. <script async='async' custom-element='amp-facebook' src='https://cdn.ampproject.org/v0/amp-facebook-0.1.js'/>
  595. <script async='async' custom-element='amp-dailymotion' src='https://cdn.ampproject.org/v0/amp-dailymotion-0.1.js'/>
  596. <script async='async' custom-element='amp-addthis' src='https://cdn.ampproject.org/v0/amp-addthis-0.1.js'/>
  597. <script async='async' custom-element='amp-audio' src='https://cdn.ampproject.org/v0/amp-audio-0.1.js'/>
  598. <script async='async' custom-element='amp-video' src='https://cdn.ampproject.org/v0/amp-video-0.1.js'/>
  599. </b:if>
  600. <b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;true&quot;'>
  601. <script async='async' custom-element='amp-fx-flying-carpet' src='https://cdn.ampproject.org/v0/amp-fx-flying-carpet-0.1.js'/>
  602. </b:if>
  603. <b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;true&quot; and not data:blog.searchQuery'>
  604. <script async='async' custom-element='amp-ad' src='https://cdn.ampproject.org/v0/amp-ad-0.1.js'/>
  605. <script async='async' custom-element='amp-sticky-ad' src='https://cdn.ampproject.org/v0/amp-sticky-ad-1.0.js'/>
  606. <script async='async' custom-element='amp-auto-ads' src='https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js'/>
  607. </b:if>
  608. <b:if cond='data:blog.url == data:blog.homepageUrl'>
  609. <script type='application/ld+json'>
  610. {
  611.   &quot;@context&quot;: &quot;http://schema.org&quot;,
  612.   &quot;@type&quot;: &quot;WebSite&quot;,
  613.   &quot;url&quot;: &quot;https://www.myinfo.web.id/&quot;,
  614.   &quot;potentialAction&quot;: {
  615.     &quot;@type&quot;: &quot;SearchAction&quot;,
  616.     &quot;target&quot;: &quot;https://www.myinfo.web.id/search?q={q}&quot;,
  617.     &quot;query-input&quot;: &quot;required name=q&quot;
  618.   }
  619. }
  620. </script>
  621. </b:if>
  622. &lt;/head&gt;&lt;!--<head/>--&gt;
  623. <body>
  624. <b:if cond='data:blog.pageType == &quot;error_page&quot;'>
  625. <div id='error-page'>
  626. <div class='large-heading1'>OOPS!</div>
  627. <div class='error-404'>404</div>
  628. <div class='large-heading2'>LAMAN TIDAK DITEMUKAN</div><br/>
  629. <div class='light-heading1'>Mungkin halaman telah dihapus. Kami mohon maaf atas ketidaknyamanan ini.</div><br/>
  630.   <div class='light-heading2'>Silahkan Klik <a expr:href='data:blog.homepageUrl' title='Homepage'><span><b>DI SINI</b></span></a> untuk kembali ke homepage <b><data:blog.title/></b>.
  631. </div>
  632. </div>
  633. </b:if>
  634. <b:if cond='data:blog.pageType != &quot;error_page&quot;'>
  635. <b:class cond='data:blog.pageType == &quot;index&quot;' name='home_page'/>
  636. <b:class cond='data:blog.url == data:blog.homepageUrl' name='homepage'/>
  637. <b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;true&quot; and not data:blog.searchQuery'>
  638. <!-- iklan amp-auto-ad, silahkan sesuaikan data-ad-client -->
  639. <amp-auto-ads data-ad-client='ca-pub-xxxxxxxxxxxxxxxx' type='adsense'/>
  640. </b:if>
  641. <a aria-label='Skip' class='skip-navigation' href='#main' role='button' tabindex='0'>
  642. Skip to main content
  643. </a>
  644. <amp-sidebar id='side-bar' layout='nodisplay' side='right'>
  645. <svg aria-label='Close Sidebar' class='amp-close-image' height='20' on='tap:side-bar.close' role='button' tabindex='0' viewBox='0 0 24 24' width='20'>
  646. <path d='M19,3H16.3H7.7H5A2,2 0 0,0 3,5V7.7V16.4V19A2,2 0 0,0 5,21H7.7H16.4H19A2,2 0 0,0 21,19V16.3V7.7V5A2,2 0 0,0 19,3M15.6,17L12,13.4L8.4,17L7,15.6L10.6,12L7,8.4L8.4,7L12,10.6L15.6,7L17,8.4L13.4,12L17,15.6L15.6,17Z' fill='#333'/>
  647. </svg>
  648. <div class='logo_sidebar'>
  649.   <amp-img expr:alt='data:blog.title' height='37' layout='responsive' noloading='' src='https://2.bp.blogspot.com/-doSVWhcusdQ/WxZEir8tcCI/AAAAAAAAx-0/q3IwdxHOzYQKeWsOl3JBrggCti3EFDShACLcBGAs/s1600-rw/kompi-flexible-2.png' width='300'><amp-img expr:alt='data:blog.title' fallback='' height='37' layout='responsive' noloading='' src='https://2.bp.blogspot.com/-doSVWhcusdQ/WxZEir8tcCI/AAAAAAAAx-0/q3IwdxHOzYQKeWsOl3JBrggCti3EFDShACLcBGAs/s1600/kompi-flexible-2.png' width='300'/></amp-img>
  650.   </div>
  651. <nav>
  652.     <ul>
  653.       <li class='mobile-up'><a href='#' title='About'>About</a></li>
  654.       <li class='mobile-up'><a href='#' title='Contact'>Contact</a></li>
  655.       <li class='mobile-up'><a href='#' title='Sitemap'>Sitemap</a></li>
  656.       <li class='mobile-up'><a href='#' title='Privacy'>Privacy</a></li>
  657.       <li class='mobile-up'><a href='#' title='Disclaimer'>Disclaimer</a></li>
  658.       <li><a href='#' title='Review'>Review</a></li>
  659.       <li><a href='#' title='Pasang Iklan'>Pasang Iklan</a></li>
  660.       <li><a href='https://cdn.rawgit.com/KompiAjaib/list-emoji/master/list_emojis.html' rel='nofollow noopener' target='_blank' title='Twemoji List'>Twemoji List</a></li>
  661.       <!-- <li class='drop'><amp-accordion>
  662.         <section>
  663.         <h6>
  664.         <span class='show-more'>Otomotif</span>
  665.         <span class='show-less'>Otomotif</span>
  666.         <svg viewBox='0 0 24 24'><path d='M7,10L12,15L17,10H7Z' fill='#000000'/></svg>
  667.         </h6>
  668.         <ul id='dropdown2'>
  669.             <li><a href='/search/label/Otomotif?max-results=16' rel='nofollow' title='Berita Otomotif'>Berita Otomotif</a></li>
  670.             <li><a href='/search/label/Honda?max-results=16' rel='nofollow' title='Honda'>Honda</a></li>
  671.             <li><a href='/search/label/Yamaha?max-results=16' rel='nofollow' title='Yamaha'>Yamaha</a></li>
  672.             <li><a href='/search/label/Suzuki?max-results=16' rel='nofollow' title='Suzuki'>Suzuki</a></li>
  673.         </ul>
  674.         </section>
  675.       </amp-accordion>
  676.       </li> -->
  677.     </ul>
  678.   </nav>
  679.     <h3 class='follow_sidebar'>follow us</h3>
  680. <ul class='ampstart-social-follow list-reset flex justify-around items-center img-center flex-wrap m0 mb4'>
  681.     <li>
  682.         <a aria-label='Link to AMP HTML Facebook' class='inline-block p1' href='https://www.facebook.com/xxxxxxxxxxxx/' rel='nofollow noopener' target='_blank'><svg height='23.6' viewbox='0 0 56 55' width='24' xmlns='http://www.w3.org/2000/svg'><title>Facebook</title><path class='ampstart-icon ampstart-icon-fb' d='M47.5 43c0 1.2-.9 2.1-2.1 2.1h-10V30h5.1l.8-5.9h-5.9v-3.7c0-1.7.5-2.9 3-2.9h3.1v-5.3c-.6 0-2.4-.2-4.6-.2-4.5 0-7.5 2.7-7.5 7.8v4.3h-5.1V30h5.1v15.1H10.7c-1.2 0-2.2-.9-2.2-2.1V8.3c0-1.2 1-2.2 2.2-2.2h34.7c1.2 0 2.1 1 2.1 2.2V43'/></svg></a>
  683.     </li>
  684.     <li>
  685.         <a aria-label='Link to AMP HTML Instagram' class='inline-block p1' href='https://www.instagram.com/xxxxxxxxxxxx/' rel='nofollow noopener' target='_blank'><svg height='24' viewbox='0 0 54 54' width='24' xmlns='http://www.w3.org/2000/svg'><title>instagram</title><path class='ampstart-icon ampstart-icon-instagram' d='M27.2 6.1c-5.1 0-5.8 0-7.8.1s-3.4.4-4.6.9c-1.2.5-2.3 1.1-3.3 2.2-1.1 1-1.7 2.1-2.2 3.3-.5 1.2-.8 2.6-.9 4.6-.1 2-.1 2.7-.1 7.8s0 5.8.1 7.8.4 3.4.9 4.6c.5 1.2 1.1 2.3 2.2 3.3 1 1.1 2.1 1.7 3.3 2.2 1.2.5 2.6.8 4.6.9 2 .1 2.7.1 7.8.1s5.8 0 7.8-.1 3.4-.4 4.6-.9c1.2-.5 2.3-1.1 3.3-2.2 1.1-1 1.7-2.1 2.2-3.3.5-1.2.8-2.6.9-4.6.1-2 .1-2.7.1-7.8s0-5.8-.1-7.8-.4-3.4-.9-4.6c-.5-1.2-1.1-2.3-2.2-3.3-1-1.1-2.1-1.7-3.3-2.2-1.2-.5-2.6-.8-4.6-.9-2-.1-2.7-.1-7.8-.1zm0 3.4c5 0 5.6 0 7.6.1 1.9.1 2.9.4 3.5.7.9.3 1.6.7 2.2 1.4.7.6 1.1 1.3 1.4 2.2.3.6.6 1.6.7 3.5.1 2 .1 2.6.1 7.6s0 5.6-.1 7.6c-.1 1.9-.4 2.9-.7 3.5-.3.9-.7 1.6-1.4 2.2-.7.7-1.3 1.1-2.2 1.4-.6.3-1.7.6-3.5.7-2 .1-2.6.1-7.6.1-5.1 0-5.7 0-7.7-.1-1.8-.1-2.9-.4-3.5-.7-.9-.3-1.5-.7-2.2-1.4-.7-.7-1.1-1.3-1.4-2.2-.3-.6-.6-1.7-.7-3.5 0-2-.1-2.6-.1-7.6 0-5.1.1-5.7.1-7.7.1-1.8.4-2.8.7-3.5.3-.9.7-1.5 1.4-2.2.7-.6 1.3-1.1 2.2-1.4.6-.3 1.6-.6 3.5-.7h7.7zm0 5.8c-5.4 0-9.7 4.3-9.7 9.7 0 5.4 4.3 9.7 9.7 9.7 5.4 0 9.7-4.3 9.7-9.7 0-5.4-4.3-9.7-9.7-9.7zm0 16c-3.5 0-6.3-2.8-6.3-6.3s2.8-6.3 6.3-6.3 6.3 2.8 6.3 6.3-2.8 6.3-6.3 6.3zm12.4-16.4c0 1.3-1.1 2.3-2.3 2.3-1.3 0-2.3-1-2.3-2.3 0-1.2 1-2.3 2.3-2.3 1.2 0 2.3 1.1 2.3 2.3z'/></svg></a>
  686.     </li>
  687.     <li>
  688.         <a aria-label='Link to AMP HTML Twitter' class='inline-block p1' href='https://twitter.com/xxxxxxxxxxxx' rel='nofollow noopener' target='_blank'><svg height='22.2' viewbox='0 0 53 49' width='24' xmlns='http://www.w3.org/2000/svg'><title>Twitter</title><path class='ampstart-icon ampstart-icon-twitter' d='M45 6.9c-1.6 1-3.3 1.6-5.2 2-1.5-1.6-3.6-2.6-5.9-2.6-4.5 0-8.2 3.7-8.2 8.3 0 .6.1 1.3.2 1.9-6.8-.4-12.8-3.7-16.8-8.7C8.4 9 8 10.5 8 12c0 2.8 1.4 5.4 3.6 6.9-1.3-.1-2.6-.5-3.7-1.1v.1c0 4 2.8 7.4 6.6 8.1-.7.2-1.5.3-2.2.3-.5 0-1 0-1.5-.1 1 3.3 4 5.7 7.6 5.7-2.8 2.2-6.3 3.6-10.2 3.6-.6 0-1.3-.1-1.9-.1 3.6 2.3 7.9 3.7 12.5 3.7 15.1 0 23.3-12.6 23.3-23.6 0-.3 0-.7-.1-1 1.6-1.2 3-2.7 4.1-4.3-1.4.6-3 1.1-4.7 1.3 1.7-1 3-2.7 3.6-4.6'/></svg></a>
  689.     </li>
  690. </ul>
  691.   </amp-sidebar>
  692. <div id='totop'/>
  693. <div class='head-wrapper'>
  694. <div class='content-wrapper'>
  695. <button aria-label='Open Sidebar' class='btn-sidebaramp' on='tap:side-bar.toggle'/>
  696. <header class='header-wrapper'>
  697.       <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
  698.         <b:widget id='Header1' locked='true' title='Kompi Flexible AMP (Header)' type='Header' version='1'>
  699.           <b:widget-settings>
  700.             <b:widget-setting name='displayUrl'/>
  701.             <b:widget-setting name='displayHeight'>0</b:widget-setting>
  702.             <b:widget-setting name='sectionWidth'>-1</b:widget-setting>
  703.             <b:widget-setting name='useImage'>false</b:widget-setting>
  704.             <b:widget-setting name='shrinkToFit'>false</b:widget-setting>
  705.             <b:widget-setting name='imagePlacement'>BEHIND</b:widget-setting>
  706.             <b:widget-setting name='displayWidth'>0</b:widget-setting>
  707.           </b:widget-settings>
  708.           <b:includable id='main'>
  709.     <div id='header-inner'>
  710.       <div class='titlewrapper'>
  711.         <b:if cond='data:blog.pageType != &quot;item&quot;'>
  712.         <h1 class='title'>
  713. <b:include name='title'/>
  714.         </h1>
  715. <b:else/>
  716.         <p class='title'>
  717.           <b:include name='title'/>
  718.         </p>
  719. </b:if>
  720.       </div><b:include name='description'/>
  721.     </div>
  722. </b:includable>
  723.           <b:includable id='description'>
  724.   <div class='descriptionwrapper'>
  725.     <p class='description'><span><data:description/></span></p>
  726.   </div>
  727. </b:includable>
  728.           <b:includable id='title'>
  729.     <a expr:href='data:blog.homepageUrl' expr:title='data:title'><amp-img expr:alt='data:title' expr:title='data:title' height='37' layout='responsive' noloading='' src='https://2.bp.blogspot.com/-doSVWhcusdQ/WxZEir8tcCI/AAAAAAAAx-0/q3IwdxHOzYQKeWsOl3JBrggCti3EFDShACLcBGAs/s1600-rw/kompi-flexible-2.png' width='300'><amp-img expr:alt='data:title' expr:title='data:title' fallback='' height='37' layout='responsive' noloading='' src='https://2.bp.blogspot.com/-doSVWhcusdQ/WxZEir8tcCI/AAAAAAAAx-0/q3IwdxHOzYQKeWsOl3JBrggCti3EFDShACLcBGAs/s1600/kompi-flexible-2.png' width='300'/></amp-img><span><data:title/></span></a>
  730. </b:includable>
  731.         </b:widget>
  732.       </b:section>
  733.       </header>
  734. <b:section class='page' id='page' maxwidgets='1' showaddelement='no'>
  735.   <b:widget id='PageList1' locked='true' title='Laman' type='PageList' version='1'>
  736.     <b:widget-settings>
  737.       <b:widget-setting name='pageListJson'><![CDATA[{'home': {'href': 'https://kompiflexibleamp.blogspot.com/', 'title': 'Home', 'position': 0}, '2676092630683912769': {'href': 'https://kompiflexibleamp.blogspot.com/p/about-kompi-dark.html', 'title': 'About', 'position': 1}, '520839599697352945': {'href': 'https://kompiflexibleamp.blogspot.com/p/contact.html', 'title': 'Contact', 'position': 2}, '1310654927597135694': {'href': 'https://kompiflexibleamp.blogspot.com/p/sitemap.html', 'title': 'Sitemap', 'position': 3}}]]></b:widget-setting>
  738.       <b:widget-setting name='homeTitle'>Home</b:widget-setting>
  739.     </b:widget-settings>
  740.     <b:includable id='main'>
  741. <div class='widget-content'>
  742. <ul>
  743. <b:loop values='data:links' var='link'>
  744. <b:if cond='data:link.isCurrentPage'>
  745. <li class='selected desktop-up'><a expr:href='data:link.href' expr:title='data:link.title'><data:link.title/></a></li>
  746. <b:else/>
  747. <li class='desktop-up'><a expr:href='data:link.href' expr:title='data:link.title'><data:link.title/></a></li>
  748. </b:if>
  749. </b:loop>
  750. <li><span aria-label='Open Searchbox' class='search-open' id='search-open' on='tap:lightbox-search.toggleVisibility,open-lightbox,search.show' role='button' tabindex='0'><svg height='24' viewBox='0 0 24 24' width='24'><path d='M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z' fill='#333'/></svg></span></li>
  751. </ul>
  752. </div>
  753. </b:includable>
  754.   </b:widget>
  755. </b:section>
  756. <div class='clear'/>
  757.   </div>
  758. </div>
  759. <div hidden='' id='search'>
  760. <amp-lightbox id='open-lightbox' layout='nodisplay'>
  761. <div aria-label='Close Searchbox' class='lightbox-search' hidden='' id='lightbox-search' on='tap:lightbox-search.toggleVisibility,open-lightbox.close,open-lightbox,search.hide' role='button' tabindex='0'/>
  762. <span aria-label='Open Searchbox' class='search-close' on='tap:lightbox-search.toggleVisibility,open-lightbox.close,open-lightbox,search.hide' role='button' tabindex='0'><svg height='34' viewBox='0 0 24 24' width='34'><path d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z' fill='#333'/></svg></span>
  763. </amp-lightbox>
  764. <b:section class='search_box' id='search_box' maxwidgets='1' showaddelement='no'>
  765.   <b:widget id='BlogSearch1' locked='true' title='Search This Blog' type='BlogSearch' version='1'>
  766.     <b:includable id='main'>
  767. <div class='content-wrapper'>
  768.     <!-- only display title if it's non-empty -->
  769.     <b:if cond='data:title != &quot;&quot;'>
  770.       <h2 class='title'><data:title/></h2>
  771.     </b:if>
  772.     <div class='widget-content'>
  773.       <div expr:id='data:widget.instanceId + &quot;_form&quot;'>
  774.         <form class='gsc-search-box' expr:action='data:blog.searchUrl'>
  775.         <!-- <form action='https://cdn.rawgit.com/KompiAjaib/kompi-html/master/search-bloggue.html' class='gsc-search-box'> -->
  776.           <b:attr cond='not data:view.isPreview' name='target' value='_top'/>
  777.           <table cellpadding='0' cellspacing='0' class='gsc-search-box'>
  778.             <tbody>
  779.               <tr>
  780.                 <td class='gsc-input'>
  781.                   <!-- <input name='cx' type='hidden' value='partner-pub-xxxxxxxxxxxx:xxxxxxxxxxxx'/>
  782.                   <input name='cof' type='hidden' value='FORID:10'/>
  783.                   <input name='ie' type='hidden' value='UTF-8'/> -->
  784.                   <input autocomplete='off' class='gsc-input' expr:value='data:view.isSearch ? data:view.search.query.escaped : &quot;&quot;' name='q' placeholder='Search' required='' size='10' title='search' type='text'/>
  785.                 <input name='max-results' type='hidden' value='16'/>
  786.                 </td>
  787.                 <td class='gsc-search-button'>
  788.                   <input class='gsc-search-button' expr:value='data:messages.search' title='search' type='submit'/>
  789.                 </td>
  790.               </tr>
  791.             </tbody>
  792.           </table>
  793.         </form>
  794.       </div>
  795.     </div>
  796. </div>
  797.   </b:includable>
  798.   </b:widget>
  799. </b:section>
  800. <div class='clear'/>
  801.   </div>
  802. <div class='clear'/>
  803. <div class='content-wrapper'>
  804. <div class='outer-wrapper'>
  805. <div class='leaderboard'>
  806.      <b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;error_page&quot; and not data:blog.searchQuery'>
  807. <!-- iklan di bawah header, silahkan sesuaikan data
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top