dimaslanjaka

materi AMP template

Apr 11th, 2017
126
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
XML 171.67 KB | None | 0 0
  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <!DOCTYPE html>
  3. <HTML amp='amp' lang='en'>
  4. &lt;head&gt;
  5. <meta charset='utf-8'/>
  6. <meta content='width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui' name='viewport'/>
  7. <meta content='IE=edge,chrome=1' http-equiv='X-UA-Compatible'/>
  8. <b:include data='blog' name='all-head-content'/>
  9. <!-- Title Tag Blogger dioptimalkan -->
  10. <b:if cond='data:blog.pageType in {&quot;index&quot;} and data:blog.homepageUrl == data:blog.url'>
  11.     <title><data:blog.pageTitle/></title>
  12. <b:else/>
  13. <b:if cond='data:blog.pageType in {&quot;item&quot;,&quot;static_page&quot;}'>
  14.     <title><data:blog.pageName/> | <data:blog.title/></title>
  15. <b:else/>
  16. <b:if cond='data:blog.pageType in {&quot;index&quot;} and data:blog.pageName == &quot;&quot;'>
  17.     <title>All Posts | <data:blog.title/></title>
  18. <b:else/>
  19. <b:if cond='data:blog.pageType in {&quot;error_page&quot;}'>
  20.     <title>404 | <data:blog.title/></title>
  21. <b:else/>
  22.     <title><data:blog.pageName/></title>
  23. </b:if>
  24. </b:if>
  25. </b:if>
  26. </b:if>
  27.  
  28. <!-- Meta otomatis halaman depan, statis, dan postingan -->
  29. <b:if cond='data:blog.pageType in {&quot;index&quot;} and data:blog.homepageUrl == data:blog.url'>
  30.     <meta expr:content='data:blog.title' name='keywords'/>
  31. </b:if>    
  32. <b:if cond='data:blog.pageType in {&quot;item&quot;,&quot;static_page&quot;}'>
  33.     <meta expr:content='data:blog.pageName' name='keywords'/>
  34. </b:if>
  35.  
  36. <!-- Noindex label, dan arsip -->
  37. <b:if cond='data:blog.pageType in {&quot;archive&quot;} or data:blog.searchLabel or data:blog.searchQuery'>
  38.     <meta content='noindex,nofollow' name='robots'/>
  39. </b:if>
  40.  
  41. <!-- Facebook Tag -->
  42. <b:if cond='data:blog.pageType == &quot;item&quot;'>
  43.     <meta expr:content='data:blog.pageName' property='og:title'/>
  44.     <meta content='article' property='og:type'/>
  45. <b:else/>
  46.     <meta expr:content='data:blog.pageTitle' property='og:title'/>
  47.     <meta content='website' property='og:type'/>
  48. </b:if>
  49. <meta expr:content='data:blog.canonicalUrl' property='og:url'/>
  50. <!-- Large image, original size -->
  51. <b:if cond='data:blog.postImageUrl'>
  52.     <meta expr:content='data:blog.postImageUrl' property='og:image'/>
  53. <b:else/>
  54.     <!-- Thumbnail image -->
  55.     <b:if cond='data:blog.postImageThumbnailUrl'>
  56.         <meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
  57.     <b:else/>
  58.         <!-- Default, no image -->
  59.         <meta content='http://1.bp.blogspot.com/-7vDs5hMaDho/U268E2ecF4I/AAAAAAAADY8/RBHVTTuJrxc/s1600/no-image.png' property='og:image'/>
  60.     </b:if>
  61. </b:if>
  62. <b:if cond='data:blog.metaDescription'>
  63.     <meta expr:content='data:blog.metaDescription' property='og:description'/>
  64. </b:if>
  65. <meta expr:content='data:blog.title' property='og:site_name'/>
  66. <!-- Chrome, Firefox OS, Opera and Vivaldi -->
  67.   <meta content='#37474F' name='theme-color'/>
  68. <!-- Windows Phone -->
  69.   <meta content='#37474F' name='msapplication-navbutton-color'/>
  70. <!-- iOS Safari -->
  71.  
  72. &lt;!-- /*<b:skin><![CDATA[/*
  73. Name       :    Materi AMP
  74. Discripsi  :    Template paling SEO sepanjang masa.
  75. Designer   :    Blanoid
  76. Blog       :    https://templateampblogger.blogspot.co.id
  77. */
  78. Thanks to  :    materispot.blogspot.co.id
  79.  
  80. */
  81. #wrapper,#header-wrapper {width:970px;margin:0 auto;padding:0}
  82. #main-wrapper {width:650px;float:left}
  83. #sidebar-wrapper {float:right;width:300px}ul,ol{list-style:none}
  84. ]]></b:skin>
  85. <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>
  86.  
  87. <!-- Tampilan Desktop Homepage -->
  88. <b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;item&quot; and data:blog.isMobileRequest == &quot;false&quot;'>
  89. <style amp-custom='amp-custom'>
  90. /*Reset Css*/
  91. e,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}
  92. article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
  93. body{line-height:1}
  94. ol,ul{list-style:none}
  95. blockquote,q{quotes:none}
  96. blockquote:before,blockquote:after,q:before,q:after{content:&#39;&#39;;content:none}
  97. table{border-collapse:collapse;border-spacing:0}
  98. .post-feeds,.feed-links{display:none}
  99. .section,.widget{margin:0;padding:0}
  100. strong,b{font-weight:700}
  101. cite,em,i{font-style:italic}
  102. a{color:#F44336;outline:none;text-decoration:none}
  103. a:hover{color:#D32F2F;text-decoration:none}
  104. a img{border:none;border-width:0;outline:none}
  105. abbr,acronym{border-bottom:1px dotted;cursor:help}
  106. sup,sub{font-size:.8em;position:relative;top:-.4em;vertical-align:baseline}
  107. sub{top:.4em}
  108. small{font-size:.8em}
  109. kbd{border:1px solid #757575;border-bottom-width:2px;border-radius:3px;font-size:80%;padding:2px 5px}
  110. mark{background-color:#ffce00;color:#000}
  111. p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:10px 0}
  112. hr{background-color:#666;border:none;height:1px}
  113. .clear{clear:both}
  114. body{background:#f9f9f9;color:#212121;font-family:&#39;Roboto&#39;,sans-serif;margin:0;padding:0;text-align:left;-moz-font-smoothing:antialiased;-moz-tap-highlight-color:transparent;-ms-font-smoothing:antialiased;-ms-tap-highlight-color:transparent;-o-font-smoothing:antialiased;-o-tap-highlight-color:transparent;-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
  115. .header,nav,#wrapper,footer{max-width:858px}
  116. #header-wrapper{background:#263238;margin:0 auto;width:100%}
  117. #header-wrapper a img{display:block}
  118. .header{color:#fff;font-family:&#39;Product Sans&#39;,sans-serif;margin:0 auto;overflow:hidden;padding:30px 0 25px}
  119. .header .widget{padding:0 20px}
  120. .header img{height:auto;max-width:250px}
  121. .header h1.title,.header h6.title{font-size:2em;font-weight:400;height:1em;margin:0;padding:0}
  122. .header h1.title a,.header h6.title a,.header h1.title a:hover,.header h6.title a:hover{color:#FFF}
  123. .header .description{display:none}
  124. .header a{color:#FAFAFA}
  125. .header a:hover{color:#FAFAFA}
  126. /* MENU NAVIGATION */
  127. .navi{clear:both;text-transform:uppercase;font:bold normal 12px Roboto,Arial,sans-serif;width:100%;padding:0;margin:0 auto;z-index:999}
  128. .navi ul{background:#455A64;margin:0 auto;padding:0;padding-left:18px;}
  129. .navi li{display:inline-block;margin:0 auto}
  130. .navi li a{display:block;color:#fff;padding:0 11px;line-height:34px}
  131. .navi li a:hover{background-color:#37474f}
  132. .menu{margin:30px auto 0;padding:0;position:relative}
  133. .menu ul{margin:0 auto;padding:0;text-align:center;max-width:970px;margin:0 auto}
  134. .menu ul li{display:inline-block;margin:12px 0 7px}
  135. .menu ul li a{display:block;color:#4588f3;padding:0 5px;font-size:15px}
  136. .menu ul li a:hover{color:#a7b2c3}
  137. .menu-color{background-color:#37474f}
  138.  
  139.  
  140. #wrapper{margin:0 auto;padding:0}
  141. #content-wrapper{margin:20px auto 0;overflow:hidden;padding:0 20px;position:relative;word-wrap:break-word}
  142. .nocard{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;padding:0px 35px 5px}
  143. #post-wrapper{float:left;margin:0 -320px 0 0;width:100%}
  144. .post-container{background:#FFF;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);margin:0 320px 20px 0;max-width:100%;padding:15px 15px 0}
  145. .breadcrumbs{border-bottom:1px solid #E6E6E6;color:#9E9E9E;font-size:.7em;font-weight:700;margin:0 0 15px;overflow:hidden;padding:0 0 15px 0;text-transform:uppercase}
  146. .breadcrumbs a{color:#9E9E9E}
  147. .post-label-block{font-size:.8em;line-height:1.2em;margin-top:15px;overflow:hidden}
  148. .post-label-block .date-block{color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px}
  149. .label{float:right}
  150. .post-label-block .label-block{background:#eee;border-radius:3px;color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px;text-transform:lowercase}
  151. .post-label-block abbr{border-bottom:none}
  152. .post{border-bottom:1px solid #E6E6E6;margin:0 0 15px;overflow:hidden;padding:0 0 10px}
  153. .post-snippet{color:#757575;font-size:.9em;line-height:1.2em;max-height:2.4em;overflow:hidden}
  154. .author-info{color:#9E9E9E;font-weight:700}
  155. .author-info a{color:#9E9E9E}
  156. .post-body{font-size:1em;line-height:1.6}
  157. .post-body h1,.post-body h2,.post-body h3,.post-body h4,.post-body h5,.post-body h6{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;line-height:normal;margin:20px 0 10px}
  158. .post-body h1{font-size:1.5em}
  159. .post-body h2{font-size:1.4em}
  160. .post-body h3{font-size:1.3em}
  161. .post-body h4{font-size:1.2em}
  162. .post-body h5{font-size:1.1em}
  163. .post-body h6{font-size:1em}
  164. .post-body ol{margin:0 0 0 20px ;padding:0;list-style:decimal outside}
  165. .post-body ol ol{list-style:lower-latin outside}
  166. .post-body ol ol ol{list-style:lower-roman outside}
  167. .post-body ul{margin:0 0 0 20px ;padding:0;list-style:circle outside}
  168. .post-body ul ul{list-style:disc outside}
  169. .post-body ul ul ul{list-style:square outside}
  170. .post-body li{margin:.5em 0}
  171. .post-body dl{margin:0;padding:0}
  172. .post-body dt{color:#757575;font-size:.9em}
  173. .post-body dd{margin:0 0 .5em 1em}
  174. .post-body input,.post-body button,.post-body select,.post-body textarea{font:inherit;font-size:100%;line-height:normal;vertical-align:baseline}
  175. .post-body textarea{box-sizing:border-box;display:block}
  176. .post-body code{background-color:#e8eaf6;border:1px solid #dbdbdb;border-radius:3px;color:#727272;font-family:monospace;padding:1px 5px}
  177. .post-body pre{background-color:#424242;border-radius:3px;color:#fafafa;font-family:monospace;margin-bottom:10px;overflow-x:scroll;padding:20px}
  178. .post-body blockquote{background:#eee;border-radius:3px;color:#757575;font-size:.9em;margin-bottom:10px;padding:10px 15px}
  179. .post-body img{border:0;height:auto;max-width:100%}
  180. .post-body table{max-width:100%}
  181. h1.post-title{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.5em;line-height:1.2em;margin:10px 0 20px}
  182. h2.post-title{color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1.2em;margin-bottom:10px;max-height:2.4em;overflow:hidden}
  183. h2.post-title a{color:#424242}
  184. .img-thumbnail{float:right;height:70px;margin:0 0 0 15px;width:70px}
  185. .img-thumbnail img{height:70px;width:70px}
  186. #blog-pager{clear:both;font-size:.7em;font-weight:700;margin:0;padding:3px;text-align:center;text-transform:uppercase}
  187. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{border-radius:2px;color:#757575;margin-bottom:15px;padding:8px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;width:80px}
  188. #blog-pager-newer-link a{display:block;float:left}
  189. #blog-pager-older-link a{display:block;float:right}
  190. a.home-link{display:inline-block}
  191. #blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover{background-color:#EEFF41;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);color:#827717}
  192. .post-body th{font-weight:700}
  193. .post-body table{background:#fafafa;color:#546e7a;font-size:.9em;margin:0}
  194. .post-body td,.post-body th{border:1px solid #eee;padding:8px;text-align:left;vertical-align:top}
  195. .post-body th{background:#f5f5f5}
  196. .post-body table.tr-caption-container td{background:#EEFF41;border:none;border-radius:3px;color:#827717;overflow:hidden;padding:0}
  197. .post-body img{height:auto;max-width:100%}
  198. .post-body img,.post-body table.tr-caption-container{height:auto;max-width:100%}
  199. .post-body .separator img{height:auto;max-width:100%}
  200. .post-body td.tr-caption{color:#FFF;padding:0 8px 8px}
  201. .post-body iframe,.post-body object,.post-body embed{max-width:100%}
  202. .single-post{margin-top:20px}
  203. .status-msg-wrap{background:#EEFF41;border:none;border-radius:3px;background-color:#EEFF41;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;margin:0 0 20px;overflow:hidden;padding:10px 15px;width:auto}
  204. .status-msg-body{background-color:#EEFF41;padding:0;position:static;text-align:left}
  205. .status-msg-body a{font-size:.7em;padding:0;text-decoration:none;text-transform:uppercase}
  206. .status-msg-border{display:none}
  207. .status-msg-bg{display:none}
  208. #sidebar-wrapper{float:right;margin:0 0 25px;width:300px}
  209. .sidebar-container{margin:0}
  210. .widgeticon{margin:5px 5px -5px 0}
  211. .sidebar h6,.sidebar h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNCA4aDRWNEg0djR6bTYgMTJoNHYtNGgtNHY0em0tNiAwaDR2LTRINHY0em0wLTZoNHYtNEg0djR6bTYgMGg0di00aC00djR6bTYtMTB2NGg0VjRoLTR6bS02IDRoNFY0aC00djR6bTYgNmg0di00aC00djR6bTAgNmg0di00aC00djR6IiBmaWxsPSIjNzU3NTc1Ii8+PC9zdmc+);background-position:left top;background-repeat:no-repeat;background-size:19px 19px;color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1em;overflow:hidden;padding:0 0 15px 30px}
  212. .FollowByEmail h6,.FollowByEmail h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0yMCA0aC0xNmMtMS4xIDAtMS45OS45LTEuOTkgMmwtLjAxIDEyYzAgMS4xLjkgMiAyIDJoMTZjMS4xIDAgMi0uOSAyLTJ2LTEyYzAtMS4xLS45LTItMi0yem0wIDRsLTggNS04LTV2LTJsOCA1IDgtNXYyeiIgZmlsbD0iI0NEREMzOSIvPgogICAgPHBhdGggZD0iTTAgMGgyNHYyNGgtMjR6IiBmaWxsPSJub25lIi8+Cjwvc3ZnPgo=);color:#CDDC39}
  213. .BlogArchive h6,.BlogArchive h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTAgNEg0Yy0xLjEgMC0xLjk5LjktMS45OSAyTDIgMThjMCAxLjEuOSAyIDIgMmgxNmMxLjEgMCAyLS45IDItMlY4YzAtMS4xLS45LTItMi0yaC04bC0yLTJ6IiBmaWxsPSIjNjczQUI3Ii8+PC9zdmc+);color:#673AB7}
  214. .BlogSearch h6,.BlogSearch h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0xNS41IDE0aC0uNzlsLS4yOC0uMjdjLjk4LTEuMTQgMS41Ny0yLjYyIDEuNTctNC4yMyAwLTMuNTktMi45MS02LjUtNi41LTYuNXMtNi41IDIuOTEtNi41IDYuNSAyLjkxIDYuNSA2LjUgNi41YzEuNjEgMCAzLjA5LS41OSA0LjIzLTEuNTdsLjI3LjI4di43OWw1IDQuOTkgMS40OS0xLjQ5LTQuOTktNXptLTYgMGMtMi40OSAwLTQuNS0yLjAxLTQuNS00LjVzMi4wMS00LjUgNC41LTQuNSA0LjUgMi4wMSA0LjUgNC41LTIuMDEgNC41LTQuNSA0LjV6IiBmaWxsPSIjNzk1NTQ4Ii8+CiAgICA8cGF0aCBkPSJNMCAwaDI0djI0aC0yNHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+Cg==);color:#795548}
  215. .Image h6,.Image h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEgMTlWNWMwLTEuMS0uOS0yLTItMkg1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yek04LjUgMTMuNWwyLjUgMy4wMUwxNC41IDEybDQuNSA2SDVsMy41LTQuNXoiIGZpbGw9IiM5QzI3QjAiLz48L3N2Zz4=);color:#9C27B0}
  216. .FeaturedPost h6,.FeaturedPost h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTcgM0g3Yy0xLjEgMC0xLjk5LjktMS45OSAyTDUgMjFsNy0zIDcgM1Y1YzAtMS4xLS45LTItMi0yeiIgZmlsbD0iI0ZGQzEwNyIvPjwvc3ZnPg==);color:#FFC107}
  217. .Label h6,.Label h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEuNDEgMTEuNThsLTktOUMxMi4wNSAyLjIyIDExLjU1IDIgMTEgMkg0Yy0xLjEgMC0yIC45LTIgMnY3YzAgLjU1LjIyIDEuMDUuNTkgMS40Mmw5IDljLjM2LjM2Ljg2LjU4IDEuNDEuNTguNTUgMCAxLjA1LS4yMiAxLjQxLS41OWw3LTdjLjM3LS4zNi41OS0uODYuNTktMS40MSAwLS41NS0uMjMtMS4wNi0uNTktMS40MnpNNS41IDdDNC42NyA3IDQgNi4zMyA0IDUuNVM0LjY3IDQgNS41IDQgNyA0LjY3IDcgNS41IDYuMzMgNyA1LjUgN3oiIGZpbGw9IiMwMEJDRDQiLz48L3N2Zz4=);color:#00BCD4}
  218. .LinkList h6,.LinkList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMy45IDEyYzAtMS43MSAxLjM5LTMuMSAzLjEtMy4xaDRWN0g3Yy0yLjc2IDAtNSAyLjI0LTUgNXMyLjI0IDUgNSA1aDR2LTEuOUg3Yy0xLjcxIDAtMy4xLTEuMzktMy4xLTMuMXpNOCAxM2g4di0ySDh2MnptOS02aC00djEuOWg0YzEuNzEgMCAzLjEgMS4zOSAzLjEgMy4xcy0xLjM5IDMuMS0zLjEgMy4xaC00VjE3aDRjMi43NiAwIDUtMi4yNCA1LTVzLTIuMjQtNS01LTV6IiBmaWxsPSIjMDA5Njg4Ii8+PC9zdmc+);color:#009688}
  219. .PageList h6,.PageList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNiAyYy0xLjEgMC0xLjk5LjktMS45OSAyTDQgMjBjMCAxLjEuODkgMiAxLjk5IDJIMThjMS4xIDAgMi0uOSAyLTJWOGwtNi02SDZ6bTcgN1YzLjVMMTguNSA5SDEzeiIgZmlsbD0iI0U5MUU2MyIvPjwvc3ZnPg==);color:#E91E63}
  220. .Poll h6,.Poll h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTkgM0g1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6TTkgMTdIN3YtN2gydjd6bTQgMGgtMlY3aDJ2MTB6bTQgMGgtMnYtNGgydjR6IiBmaWxsPSIjNjA3RDhCIi8+PC9zdmc+);color:#607D8B}
  221. .PopularPosts h6,.PopularPosts h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTMuNS42N3MuNzQgMi42NS43NCA0LjhjMCAyLjA2LTEuMzUgMy43My0zLjQxIDMuNzMtMi4wNyAwLTMuNjMtMS42Ny0zLjYzLTMuNzNsLjAzLS4zNkM1LjIxIDcuNTEgNCAxMC42MiA0IDE0YzAgNC40MiAzLjU4IDggOCA4czgtMy41OCA4LThDMjAgOC42MSAxNy40MSAzLjggMTMuNS42N3pNMTEuNzEgMTljLTEuNzggMC0zLjIyLTEuNC0zLjIyLTMuMTQgMC0xLjYyIDEuMDUtMi43NiAyLjgxLTMuMTIgMS43Ny0uMzYgMy42LTEuMjEgNC42Mi0yLjU4LjM5IDEuMjkuNTkgMi42NS41OSA0LjA0IDAgMi42NS0yLjE1IDQuOC00LjggNC44eiIgZmlsbD0iI0Y0NDMzNiIvPjwvc3ZnPg==);color:#F44336}
  222. .Profile h6,.Profile h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMCAzYzEuNjYgMCAzIDEuMzQgMyAzcy0xLjM0IDMtMyAzLTMtMS4zNC0zLTMgMS4zNC0zIDMtM3ptMCAxNC4yYy0yLjUgMC00LjcxLTEuMjgtNi0zLjIyLjAzLTEuOTkgNC0zLjA4IDYtMy4wOCAxLjk5IDAgNS45NyAxLjA5IDYgMy4wOC0xLjI5IDEuOTQtMy41IDMuMjItNiAzLjIyeiIgZmlsbD0iIzAzQTlGNCIvPjwvc3ZnPg==);color:#03A9F4}
  223. .Stats h6,.Stats h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTYgNmwyLjI5IDIuMjktNC44OCA0Ljg4LTQtNEwyIDE2LjU5IDMuNDEgMThsNi02IDQgNCA2LjMtNi4yOUwyMiAxMlY2eiIgZmlsbD0iI0ZGOTgwMCIvPjwvc3ZnPg==);color:#FF9800}
  224. .Subscribe h6,.Subscribe h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTEuNSAyMmMxLjEgMCAyLS45IDItMmgtNGMwIDEuMS45IDIgMiAyem02LjUtNnYtNS41YzAtMy4wNy0yLjEzLTUuNjQtNS02LjMyVjMuNWMwLS44My0uNjctMS41LTEuNS0xLjVTMTAgMi42NyAxMCAzLjV2LjY4Yy0yLjg3LjY4LTUgMy4yNS01IDYuMzJWMTZsLTIgMnYxaDE3di0xbC0yLTJ6IiBmaWxsPSIjNENBRjUwIi8+PC9zdmc+);color:#4CAF50}
  225. .Text h6,.Text h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNy41IDE4QzQuNDYgMTggMiAxNS41NCAyIDEyLjVTNC40NiA3IDcuNSA3SDE4YzIuMjEgMCA0IDEuNzkgNCA0cy0xLjc5IDQtNCA0SDkuNUM4LjEyIDE1IDcgMTMuODggNyAxMi41UzguMTIgMTAgOS41IDEwSDE3djEuNUg5LjVjLS41NSAwLTEgLjQ1LTEgMXMuNDUgMSAxIDFIMThjMS4zOCAwIDIuNS0xLjEyIDIuNS0yLjVTMTkuMzggOC41IDE4IDguNUg3LjVjLTIuMjEgMC00IDEuNzktNCA0czEuNzkgNCA0IDRIMTdWMThINy41eiIgZmlsbD0iIzNGNTFCNSIvPjwvc3ZnPg==);color:#3F51B5}
  226. .Translate h6,.Translate h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRoLTI0eiIgZmlsbD0ibm9uZSIvPgogICAgPHBhdGggZD0iTTEyLjg3IDE1LjA3bC0yLjU0LTIuNTEuMDMtLjAzYzEuNzQtMS45NCAyLjk4LTQuMTcgMy43MS02LjUzaDIuOTN2LTJoLTd2LTJoLTJ2MmgtN3YxLjk5aDExLjE3Yy0uNjcgMS45My0xLjczIDMuNzYtMy4xNyA1LjM2LS45My0xLjAzLTEuNy0yLjE2LTIuMzEtMy4zNWgtMmMuNzMgMS42MyAxLjczIDMuMTcgMi45OCA0LjU2bC01LjA5IDUuMDIgMS40MiAxLjQyIDUtNSAzLjExIDMuMTEuNzYtMi4wNHptNS42My01LjA3aC0ybC00LjUgMTJoMmwxLjEyLTNoNC43NWwxLjEzIDNoMmwtNC41LTEyem0tMi42MiA3bDEuNjItNC4zMyAxLjYyIDQuMzNoLTMuMjR6IiBmaWxsPSIjNENBRjUwIi8+Cjwvc3ZnPgo=);color:#4CAF50}
  227. .sidebar .widget{background:#FFF;border:none;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);font-size:1em;line-height:1.6;margin:0 0 20px;overflow:hidden;padding:15px;position:relative}
  228. .widget-content{font-size:.9em}
  229. .widget-item-control{border-radius:50%;line-height:1em;padding:8px 8px 6px;position:absolute;right:10px;top:10px;vertical-align:middle}
  230. .widget-item-control:hover{background:#eee}
  231. .widget-content img{height:auto;max-width:100%}
  232. .widget-content select{background:#EEE url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij48cGF0aCBkPSJNMzMuMTcgMTcuMTdMMjQgMjYuMzRsLTkuMTctOS4xN0wxMiAyMGwxMiAxMiAxMi0xMnoiIGZpbGw9IiMyMTIxMjEiLz48L3N2Zz4=) no-repeat center right 5px;background-size:20px 20px;border:none;border-radius:3px;padding:10px;width:100%;-moz-appearance:none;-webkit-appearance:none}
  233. .quickedit img{height:14px;width:14px}
  234. .sidebar ul,.sidebar ol{list-style-type:none;margin:0 -15px -15px;padding:0}
  235. .sidebar li ul,.sidebar li ol{font-size:0.9em;margin:10px -15px 0 0}
  236. .sidebar li{border-top:1px solid #E6E6E6;margin:0;padding:10px 15px}
  237. .sidebar li li{border-top:none;margin:0;padding:5px 15px}
  238. .sidebar li a{color:#757575}
  239.  
  240. */label*/
  241. .label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:.8em;line-height:1.5;opacity:10}
  242. .cloud-label-widget-content{font-size:.8em;font-weight:700;text-align:left;text-transform:uppercase}
  243. .label-size{background:#EEFF41;border-radius:3px;color:#827717;display:inline-block;margin:8px 4px 0 0;padding:4px 8px}
  244. .label-size a,.label-size span{color:#827717}
  245. .label-count{white-space:nowrap}
  246. .Image .widget-content{margin:0 -15px -20px -15px}
  247. .Image .caption{display:block;padding:5px 15px 15px}
  248.  
  249. / *PopularPosts*/
  250. .PopularPosts h6{color:#e51c23}
  251. .PopularPosts .item-thumbnail{border-radius:50%;display:inline;float:left;margin:5px 10px 5px 0;overflow:hidden}
  252. .PopularPosts .item-thumbnail a img{display:block;height:40px;margin:0;padding:0;width:40px}
  253. .PopularPosts .widget-content ul{margin:0}
  254. .PopularPosts .widget-content ul li{border-bottom:1px solid #E6E6E6;border-top:none;padding:5px 0}
  255. .PopularPosts .widget-content ul li:last-child{border-bottom:none}
  256. .PopularPosts .item-title{color:#212121;font-size:1em;font-weight:400;line-height:1.4;max-height:2.7em;overflow:hidden;padding-top:.3em}
  257. .PopularPosts .item-title a{color:#212121}
  258. .PopularPosts .item-snippet{color:#757575;font-size:.9em;height:1.4em;line-height:1.4;overflow:hidden}
  259. .Profile .profile-img{border-radius:50%;float:left;margin:0 15px 10px 0;overflow:hidden}
  260. .Profile .profile-name-link{background-repeat:no-repeat;padding-left:20px}
  261. .Feed h6{color:#5677fc}
  262. .Feed .widget-content ul li{border-bottom:1px solid #E6E6E6;font-weight:400;padding:10px 0}
  263. .Feed .widget-content ul li a{color:#212121}
  264. .Feed .widget-content ul li:last-child{border-bottom:none}
  265.  
  266. /*FOOTER*/
  267. #footer-wrapper{background:#263238;padding:0}
  268. #footer-wrapper a{color:#FFF}
  269. #footer-wrapper a:hover{color:#F5F5F5}
  270. footer{color:#bcbcbc;font-size:.8em;line-height:1.6;margin:15px auto 0}
  271. #footer{padding:20px 25px}
  272.  
  273. /*keep-in-touch*/
  274. #keep-in-touch{border-bottom:1px solid #37474F;margin-bottom:10px;padding-bottom:10px}
  275. #keep-in-touch span{font-weight:700;margin-right:10px;text-transform:uppercase;vertical-align:middle}
  276. #keep-in-touch svg{vertical-align:middle}
  277. footer h3{display:inline;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;font-weight:700}
  278. #fab{background:#EEFF41;border-radius:50%;bottom:25px;box-shadow:0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26);padding:15px 16px 11px;position:fixed;right:25px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;z-index:99999}
  279. #fab:hover{box-shadow:0 0 4px rgba(0,0,0,.14),0 8px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26)}
  280. .banner-home-top{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  281. .banner-home-bottom{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  282. .banner-post-top{margin:0 0 15px}
  283. .banner-post-bottom{margin:25px 0 15px}
  284. .banner-sidebar{margin-bottom:20px}
  285.  
  286. @media all and (max-width : 768px) {
  287. .header,nav,#wrapper,footer{max-width:538px}
  288. navi ul{text-align:center}#content-wrapper,.banner728-top,.banner728-bottom{padding:0 10px}#post-wrapper,#sidebar-wrapper{width:100%;max-width:100%;float:none;margin:12px 0 12px 0}.post-container{margin:0 0 0 0}#nav ul#menu{text-align:center}
  289. #post-wrapper,#sidebar-wrapper{float:none;max-width:100%;width:100%}
  290. .post-container{margin:0 0 20px}
  291. #nav-wrapper{overflow:hidden}
  292. }
  293.  
  294. @media only screen and (max-width:468px) {
  295. .label{display:block;float:inherit;margin:5px 0 0}
  296. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{width:75px}
  297. }
  298.  
  299. /* Search Form Desktop */
  300. .search-wrapper{height:30px;float:right;display:inline;margin-top:-40px}
  301. #search-form,#searchform,.search-button{line-height:30px}
  302. #searchform{position:relative;z-index:5;overflow:hidden}
  303. #searchform:hover,#search-form:focus{border-color:#3b7dc1;z-index:5;overflow:hidden}
  304. #search-form{color:gray;width:100;padding: 0 10px 0 70px;height:30px;line-height:30px;font-size:14px;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
  305. .search-button{background-image:url(&quot;data:image/svg+xml;charset=utf8,%3csvg%20viewBox=&#39;0%200%2024%2024&#39;%20width=&#39;24&#39;%20height=&#39;24&#39;%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%20xmlns:xlink=&#39;http://www.w3.org/1999/xlink&#39;%3e%3cg%3e%3cpath%20style=&#39;fill:white&#39;%20d=&#39;M9.5,3A6.5,6.5%200%200,1%2016,9.5C16,11.11%2015.41,12.59%2014.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41%2011.11,16%209.5,16A6.5,6.5%200%200,1%203,9.5A6.5,6.5%200%200,1%209.5,3M9.5,5C7,5%205,7%205,9.5C5,12%207,14%209.5,14C12,14%2014,12%2014,9.5C14,7%2012,5%209.5,5Z&#39;%3e%3c/path%3e%3c/g%3e%3c/svg%3e&quot;);background-color:#455a64;background-repeat:no-repeat;background-size:20px 20px;background-position:8px 5px;width:34px;height:30px;overflow:hidden;float:right;top:0;right:0;position:absolute;z-index:0}
  306. #search-form:hover,.search-button:hover{border:none;border-color:#3b7dc1;outline:0;color:#555}
  307. </style>
  308. </b:if>
  309. <!-- Tampilan Desktop Homepage End -->
  310.  
  311. <!-- Tampilan Mobile Homepage -->
  312. <b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;item&quot; and data:blog.isMobileRequest == &quot;true&quot;'>
  313. <style amp-custom='amp-custom'>
  314. /*Reset Css*/
  315. e,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}
  316. article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
  317. body{line-height:1}
  318. ol,ul{list-style:none}
  319. blockquote,q{quotes:none}
  320. blockquote:before,blockquote:after,q:before,q:after{content:&#39;&#39;;content:none}
  321. table{border-collapse:collapse;border-spacing:0}
  322. .post-feeds,.feed-links{display:none}
  323. .section,.widget{margin:0;padding:0}
  324. strong,b{font-weight:700}
  325. cite,em,i{font-style:italic}
  326. a{color:#F44336;outline:none;text-decoration:none}
  327. a:hover{color:#D32F2F;text-decoration:none}
  328. a img{border:none;border-width:0;outline:none}
  329. abbr,acronym{border-bottom:1px dotted;cursor:help}
  330. sup,sub{font-size:.8em;position:relative;top:-.4em;vertical-align:baseline}
  331. sub{top:.4em}
  332. small{font-size:.8em}
  333. kbd{border:1px solid #757575;border-bottom-width:2px;border-radius:3px;font-size:80%;padding:2px 5px}
  334. mark{background-color:#ffce00;color:#000}
  335. p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:10px 0}
  336. hr{background-color:#666;border:none;height:1px}
  337. .clear{clear:both}
  338. body{background:#f9f9f9;color:#212121;font-family:&#39;Roboto&#39;,sans-serif;margin:0;padding:0;text-align:left;-moz-font-smoothing:antialiased;-moz-tap-highlight-color:transparent;-ms-font-smoothing:antialiased;-ms-tap-highlight-color:transparent;-o-font-smoothing:antialiased;-o-tap-highlight-color:transparent;-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
  339. .header,nav,#wrapper,footer{max-width:858px}
  340. #header-wrapper{background:#263238;margin:0 auto;width:100%}
  341. #header-wrapper a img{display:block}
  342. .header{color:#fff;font-family:&#39;Product Sans&#39;,sans-serif;margin:0 auto;overflow:hidden;padding:30px 0 25px}
  343. .header .widget{padding:0 20px}
  344. .header img{height:auto;max-width:250px}
  345. .header h1.title,.header h6.title{font-size:2em;font-weight:400;height:1em;margin:0;padding:0}
  346. .header h1.title a,.header h6.title a,.header h1.title a:hover,.header h6.title a:hover{color:#FFF}
  347. .header .description{display:none}
  348. .header a{color:#FAFAFA}
  349. .header a:hover{color:#FAFAFA}
  350. /* MENU NAVIGATION */
  351. .navi{clear:both;text-transform:uppercase;font:bold normal 12px Roboto,Arial,sans-serif;width:100%;padding:0;margin:0 auto;z-index:999}
  352. .navi ul{background:#455A64;margin:0 auto;padding:0;padding-left:18px;}
  353. .navi li{display:inline-block;margin:0 auto}
  354. .navi li a{display:block;color:#fff;padding:0 11px;line-height:34px}
  355. .navi li a:hover{background-color:#37474f}
  356. .menu{margin:30px auto 0;padding:0;position:relative}
  357. .menu ul{margin:0 auto;padding:0;text-align:center;max-width:970px;margin:0 auto}
  358. .menu ul li{display:inline-block;margin:12px 0 7px}
  359. .menu ul li a{display:block;color:#4588f3;padding:0 5px;font-size:15px}
  360. .menu ul li a:hover{color:#a7b2c3}
  361. .menu-color{background-color:#37474f}
  362.  
  363.  
  364. #wrapper{margin:0 auto;padding:0}
  365. #content-wrapper{margin:20px auto 0;overflow:hidden;padding:0 20px;position:relative;word-wrap:break-word}
  366. .nocard{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;padding:0px 35px 5px}
  367. #post-wrapper{float:left;margin:0 -320px 0 0;width:100%}
  368. .post-container{background:#FFF;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);margin:0 320px 20px 0;max-width:100%;padding:15px 15px 0}
  369. .breadcrumbs{border-bottom:1px solid #E6E6E6;color:#9E9E9E;font-size:.7em;font-weight:700;margin:0 0 15px;overflow:hidden;padding:0 0 15px 0;text-transform:uppercase}
  370. .breadcrumbs a{color:#9E9E9E}
  371. .post-label-block{font-size:.8em;line-height:1.2em;margin-top:15px;overflow:hidden}
  372. .post-label-block .date-block{color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px}
  373. .label{float:right}
  374. .post-label-block .label-block{background:#eee;border-radius:3px;color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px;text-transform:lowercase}
  375. .post-label-block abbr{border-bottom:none}
  376. .post{border-bottom:1px solid #E6E6E6;margin:0 0 15px;overflow:hidden;padding:0 0 10px}
  377. .post-snippet{color:#757575;font-size:.9em;line-height:1.2em;max-height:2.4em;overflow:hidden}
  378. .author-info{color:#9E9E9E;font-weight:700}
  379. .author-info a{color:#9E9E9E}
  380. .post-body{font-size:1em;line-height:1.6}
  381. .post-body h1,.post-body h2,.post-body h3,.post-body h4,.post-body h5,.post-body h6{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;line-height:normal;margin:20px 0 10px}
  382. .post-body h1{font-size:1.5em}
  383. .post-body h2{font-size:1.4em}
  384. .post-body h3{font-size:1.3em}
  385. .post-body h4{font-size:1.2em}
  386. .post-body h5{font-size:1.1em}
  387. .post-body h6{font-size:1em}
  388. .post-body ol{margin:0 0 0 20px ;padding:0;list-style:decimal outside}
  389. .post-body ol ol{list-style:lower-latin outside}
  390. .post-body ol ol ol{list-style:lower-roman outside}
  391. .post-body ul{margin:0 0 0 20px ;padding:0;list-style:circle outside}
  392. .post-body ul ul{list-style:disc outside}
  393. .post-body ul ul ul{list-style:square outside}
  394. .post-body li{margin:.5em 0}
  395. .post-body dl{margin:0;padding:0}
  396. .post-body dt{color:#757575;font-size:.9em}
  397. .post-body dd{margin:0 0 .5em 1em}
  398. .post-body input,.post-body button,.post-body select,.post-body textarea{font:inherit;font-size:100%;line-height:normal;vertical-align:baseline}
  399. .post-body textarea{box-sizing:border-box;display:block}
  400. .post-body code{background-color:#e8eaf6;border:1px solid #dbdbdb;border-radius:3px;color:#727272;font-family:monospace;padding:1px 5px}
  401. .post-body pre{background-color:#424242;border-radius:3px;color:#fafafa;font-family:monospace;margin-bottom:10px;overflow-x:scroll;padding:20px}
  402. .post-body blockquote{background:#eee;border-radius:3px;color:#757575;font-size:.9em;margin-bottom:10px;padding:10px 15px}
  403. .post-body img{border:0;height:auto;max-width:100%}
  404. .post-body table{max-width:100%}
  405. h1.post-title{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.5em;line-height:1.2em;margin:10px 0 20px}
  406. h2.post-title{color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1.2em;margin-bottom:10px;max-height:2.4em;overflow:hidden}
  407. h2.post-title a{color:#424242}
  408. .img-thumbnail{float:right;height:70px;margin:0 0 0 15px;width:70px}
  409. .img-thumbnail img{height:70px;width:70px}
  410. #blog-pager{clear:both;font-size:.7em;font-weight:700;margin:0;padding:3px;text-align:center;text-transform:uppercase}
  411. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{border-radius:2px;color:#757575;margin-bottom:15px;padding:8px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;width:80px}
  412. #blog-pager-newer-link a{display:block;float:left}
  413. #blog-pager-older-link a{display:block;float:right}
  414. a.home-link{display:inline-block}
  415. #blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover{background-color:#EEFF41;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);color:#827717}
  416. .post-body th{font-weight:700}
  417. .post-body table{background:#fafafa;color:#546e7a;font-size:.9em;margin:0}
  418. .post-body td,.post-body th{border:1px solid #eee;padding:8px;text-align:left;vertical-align:top}
  419. .post-body th{background:#f5f5f5}
  420. .post-body table.tr-caption-container td{background:#EEFF41;border:none;border-radius:3px;color:#827717;overflow:hidden;padding:0}
  421. .post-body img{height:auto;max-width:100%}
  422. .post-body img,.post-body table.tr-caption-container{height:auto;max-width:100%}
  423. .post-body .separator img{height:auto;max-width:100%}
  424. .post-body td.tr-caption{color:#FFF;padding:0 8px 8px}
  425. .post-body iframe,.post-body object,.post-body embed{max-width:100%}
  426. .single-post{margin-top:20px}
  427. .status-msg-wrap{background:#EEFF41;border:none;border-radius:3px;background-color:#EEFF41;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;margin:0 0 20px;overflow:hidden;padding:10px 15px;width:auto}
  428. .status-msg-body{background-color:#EEFF41;padding:0;position:static;text-align:left}
  429. .status-msg-body a{font-size:.7em;padding:0;text-decoration:none;text-transform:uppercase}
  430. .status-msg-border{display:none}
  431. .status-msg-bg{display:none}
  432. #sidebar-wrapper{float:right;margin:0 0 25px;width:300px}
  433. .sidebar-container{margin:0}
  434. .widgeticon{margin:5px 5px -5px 0}
  435. .sidebar h6,.sidebar h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNCA4aDRWNEg0djR6bTYgMTJoNHYtNGgtNHY0em0tNiAwaDR2LTRINHY0em0wLTZoNHYtNEg0djR6bTYgMGg0di00aC00djR6bTYtMTB2NGg0VjRoLTR6bS02IDRoNFY0aC00djR6bTYgNmg0di00aC00djR6bTAgNmg0di00aC00djR6IiBmaWxsPSIjNzU3NTc1Ii8+PC9zdmc+);background-position:left top;background-repeat:no-repeat;background-size:19px 19px;color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1em;overflow:hidden;padding:0 0 15px 30px}
  436. .FollowByEmail h6,.FollowByEmail h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0yMCA0aC0xNmMtMS4xIDAtMS45OS45LTEuOTkgMmwtLjAxIDEyYzAgMS4xLjkgMiAyIDJoMTZjMS4xIDAgMi0uOSAyLTJ2LTEyYzAtMS4xLS45LTItMi0yem0wIDRsLTggNS04LTV2LTJsOCA1IDgtNXYyeiIgZmlsbD0iI0NEREMzOSIvPgogICAgPHBhdGggZD0iTTAgMGgyNHYyNGgtMjR6IiBmaWxsPSJub25lIi8+Cjwvc3ZnPgo=);color:#CDDC39}
  437. .BlogArchive h6,.BlogArchive h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTAgNEg0Yy0xLjEgMC0xLjk5LjktMS45OSAyTDIgMThjMCAxLjEuOSAyIDIgMmgxNmMxLjEgMCAyLS45IDItMlY4YzAtMS4xLS45LTItMi0yaC04bC0yLTJ6IiBmaWxsPSIjNjczQUI3Ii8+PC9zdmc+);color:#673AB7}
  438. .BlogSearch h6,.BlogSearch h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0xNS41IDE0aC0uNzlsLS4yOC0uMjdjLjk4LTEuMTQgMS41Ny0yLjYyIDEuNTctNC4yMyAwLTMuNTktMi45MS02LjUtNi41LTYuNXMtNi41IDIuOTEtNi41IDYuNSAyLjkxIDYuNSA2LjUgNi41YzEuNjEgMCAzLjA5LS41OSA0LjIzLTEuNTdsLjI3LjI4di43OWw1IDQuOTkgMS40OS0xLjQ5LTQuOTktNXptLTYgMGMtMi40OSAwLTQuNS0yLjAxLTQuNS00LjVzMi4wMS00LjUgNC41LTQuNSA0LjUgMi4wMSA0LjUgNC41LTIuMDEgNC41LTQuNSA0LjV6IiBmaWxsPSIjNzk1NTQ4Ii8+CiAgICA8cGF0aCBkPSJNMCAwaDI0djI0aC0yNHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+Cg==);color:#795548}
  439. .Image h6,.Image h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEgMTlWNWMwLTEuMS0uOS0yLTItMkg1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yek04LjUgMTMuNWwyLjUgMy4wMUwxNC41IDEybDQuNSA2SDVsMy41LTQuNXoiIGZpbGw9IiM5QzI3QjAiLz48L3N2Zz4=);color:#9C27B0}
  440. .FeaturedPost h6,.FeaturedPost h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTcgM0g3Yy0xLjEgMC0xLjk5LjktMS45OSAyTDUgMjFsNy0zIDcgM1Y1YzAtMS4xLS45LTItMi0yeiIgZmlsbD0iI0ZGQzEwNyIvPjwvc3ZnPg==);color:#FFC107}
  441. .Label h6,.Label h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEuNDEgMTEuNThsLTktOUMxMi4wNSAyLjIyIDExLjU1IDIgMTEgMkg0Yy0xLjEgMC0yIC45LTIgMnY3YzAgLjU1LjIyIDEuMDUuNTkgMS40Mmw5IDljLjM2LjM2Ljg2LjU4IDEuNDEuNTguNTUgMCAxLjA1LS4yMiAxLjQxLS41OWw3LTdjLjM3LS4zNi41OS0uODYuNTktMS40MSAwLS41NS0uMjMtMS4wNi0uNTktMS40MnpNNS41IDdDNC42NyA3IDQgNi4zMyA0IDUuNVM0LjY3IDQgNS41IDQgNyA0LjY3IDcgNS41IDYuMzMgNyA1LjUgN3oiIGZpbGw9IiMwMEJDRDQiLz48L3N2Zz4=);color:#00BCD4}
  442. .LinkList h6,.LinkList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMy45IDEyYzAtMS43MSAxLjM5LTMuMSAzLjEtMy4xaDRWN0g3Yy0yLjc2IDAtNSAyLjI0LTUgNXMyLjI0IDUgNSA1aDR2LTEuOUg3Yy0xLjcxIDAtMy4xLTEuMzktMy4xLTMuMXpNOCAxM2g4di0ySDh2MnptOS02aC00djEuOWg0YzEuNzEgMCAzLjEgMS4zOSAzLjEgMy4xcy0xLjM5IDMuMS0zLjEgMy4xaC00VjE3aDRjMi43NiAwIDUtMi4yNCA1LTVzLTIuMjQtNS01LTV6IiBmaWxsPSIjMDA5Njg4Ii8+PC9zdmc+);color:#009688}
  443. .PageList h6,.PageList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNiAyYy0xLjEgMC0xLjk5LjktMS45OSAyTDQgMjBjMCAxLjEuODkgMiAxLjk5IDJIMThjMS4xIDAgMi0uOSAyLTJWOGwtNi02SDZ6bTcgN1YzLjVMMTguNSA5SDEzeiIgZmlsbD0iI0U5MUU2MyIvPjwvc3ZnPg==);color:#E91E63}
  444. .Poll h6,.Poll h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTkgM0g1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6TTkgMTdIN3YtN2gydjd6bTQgMGgtMlY3aDJ2MTB6bTQgMGgtMnYtNGgydjR6IiBmaWxsPSIjNjA3RDhCIi8+PC9zdmc+);color:#607D8B}
  445. .PopularPosts h6,.PopularPosts h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTMuNS42N3MuNzQgMi42NS43NCA0LjhjMCAyLjA2LTEuMzUgMy43My0zLjQxIDMuNzMtMi4wNyAwLTMuNjMtMS42Ny0zLjYzLTMuNzNsLjAzLS4zNkM1LjIxIDcuNTEgNCAxMC42MiA0IDE0YzAgNC40MiAzLjU4IDggOCA4czgtMy41OCA4LThDMjAgOC42MSAxNy40MSAzLjggMTMuNS42N3pNMTEuNzEgMTljLTEuNzggMC0zLjIyLTEuNC0zLjIyLTMuMTQgMC0xLjYyIDEuMDUtMi43NiAyLjgxLTMuMTIgMS43Ny0uMzYgMy42LTEuMjEgNC42Mi0yLjU4LjM5IDEuMjkuNTkgMi42NS41OSA0LjA0IDAgMi42NS0yLjE1IDQuOC00LjggNC44eiIgZmlsbD0iI0Y0NDMzNiIvPjwvc3ZnPg==);color:#F44336}
  446. .Profile h6,.Profile h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMCAzYzEuNjYgMCAzIDEuMzQgMyAzcy0xLjM0IDMtMyAzLTMtMS4zNC0zLTMgMS4zNC0zIDMtM3ptMCAxNC4yYy0yLjUgMC00LjcxLTEuMjgtNi0zLjIyLjAzLTEuOTkgNC0zLjA4IDYtMy4wOCAxLjk5IDAgNS45NyAxLjA5IDYgMy4wOC0xLjI5IDEuOTQtMy41IDMuMjItNiAzLjIyeiIgZmlsbD0iIzAzQTlGNCIvPjwvc3ZnPg==);color:#03A9F4}
  447. .Stats h6,.Stats h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTYgNmwyLjI5IDIuMjktNC44OCA0Ljg4LTQtNEwyIDE2LjU5IDMuNDEgMThsNi02IDQgNCA2LjMtNi4yOUwyMiAxMlY2eiIgZmlsbD0iI0ZGOTgwMCIvPjwvc3ZnPg==);color:#FF9800}
  448. .Subscribe h6,.Subscribe h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTEuNSAyMmMxLjEgMCAyLS45IDItMmgtNGMwIDEuMS45IDIgMiAyem02LjUtNnYtNS41YzAtMy4wNy0yLjEzLTUuNjQtNS02LjMyVjMuNWMwLS44My0uNjctMS41LTEuNS0xLjVTMTAgMi42NyAxMCAzLjV2LjY4Yy0yLjg3LjY4LTUgMy4yNS01IDYuMzJWMTZsLTIgMnYxaDE3di0xbC0yLTJ6IiBmaWxsPSIjNENBRjUwIi8+PC9zdmc+);color:#4CAF50}
  449. .Text h6,.Text h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNy41IDE4QzQuNDYgMTggMiAxNS41NCAyIDEyLjVTNC40NiA3IDcuNSA3SDE4YzIuMjEgMCA0IDEuNzkgNCA0cy0xLjc5IDQtNCA0SDkuNUM4LjEyIDE1IDcgMTMuODggNyAxMi41UzguMTIgMTAgOS41IDEwSDE3djEuNUg5LjVjLS41NSAwLTEgLjQ1LTEgMXMuNDUgMSAxIDFIMThjMS4zOCAwIDIuNS0xLjEyIDIuNS0yLjVTMTkuMzggOC41IDE4IDguNUg3LjVjLTIuMjEgMC00IDEuNzktNCA0czEuNzkgNCA0IDRIMTdWMThINy41eiIgZmlsbD0iIzNGNTFCNSIvPjwvc3ZnPg==);color:#3F51B5}
  450. .Translate h6,.Translate h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRoLTI0eiIgZmlsbD0ibm9uZSIvPgogICAgPHBhdGggZD0iTTEyLjg3IDE1LjA3bC0yLjU0LTIuNTEuMDMtLjAzYzEuNzQtMS45NCAyLjk4LTQuMTcgMy43MS02LjUzaDIuOTN2LTJoLTd2LTJoLTJ2MmgtN3YxLjk5aDExLjE3Yy0uNjcgMS45My0xLjczIDMuNzYtMy4xNyA1LjM2LS45My0xLjAzLTEuNy0yLjE2LTIuMzEtMy4zNWgtMmMuNzMgMS42MyAxLjczIDMuMTcgMi45OCA0LjU2bC01LjA5IDUuMDIgMS40MiAxLjQyIDUtNSAzLjExIDMuMTEuNzYtMi4wNHptNS42My01LjA3aC0ybC00LjUgMTJoMmwxLjEyLTNoNC43NWwxLjEzIDNoMmwtNC41LTEyem0tMi42MiA3bDEuNjItNC4zMyAxLjYyIDQuMzNoLTMuMjR6IiBmaWxsPSIjNENBRjUwIi8+Cjwvc3ZnPgo=);color:#4CAF50}
  451. .sidebar .widget{background:#FFF;border:none;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);font-size:1em;line-height:1.6;margin:0 0 20px;overflow:hidden;padding:15px;position:relative}
  452. .widget-content{font-size:.9em}
  453. .widget-item-control{border-radius:50%;line-height:1em;padding:8px 8px 6px;position:absolute;right:10px;top:10px;vertical-align:middle}
  454. .widget-item-control:hover{background:#eee}
  455. .widget-content img{height:auto;max-width:100%}
  456. .widget-content select{background:#EEE url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij48cGF0aCBkPSJNMzMuMTcgMTcuMTdMMjQgMjYuMzRsLTkuMTctOS4xN0wxMiAyMGwxMiAxMiAxMi0xMnoiIGZpbGw9IiMyMTIxMjEiLz48L3N2Zz4=) no-repeat center right 5px;background-size:20px 20px;border:none;border-radius:3px;padding:10px;width:100%;-moz-appearance:none;-webkit-appearance:none}
  457. .quickedit img{height:14px;width:14px}
  458. .sidebar ul,.sidebar ol{list-style-type:none;margin:0 -15px -15px;padding:0}
  459. .sidebar li ul,.sidebar li ol{font-size:0.9em;margin:10px -15px 0 0}
  460. .sidebar li{border-top:1px solid #E6E6E6;margin:0;padding:10px 15px}
  461. .sidebar li li{border-top:none;margin:0;padding:5px 15px}
  462. .sidebar li a{color:#757575}
  463.  
  464. */label*/
  465. .label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:.8em;line-height:1.5;opacity:10}
  466. .cloud-label-widget-content{font-size:.8em;font-weight:700;text-align:left;text-transform:uppercase}
  467. .label-size{background:#EEFF41;border-radius:3px;color:#827717;display:inline-block;margin:8px 4px 0 0;padding:4px 8px}
  468. .label-size a,.label-size span{color:#827717}
  469. .label-count{white-space:nowrap}
  470. .Image .widget-content{margin:0 -15px -20px -15px}
  471. .Image .caption{display:block;padding:5px 15px 15px}
  472.  
  473. / *PopularPosts*/
  474. .PopularPosts h6{color:#e51c23}
  475. .PopularPosts .item-thumbnail{border-radius:50%;display:inline;float:left;margin:5px 10px 5px 0;overflow:hidden}
  476. .PopularPosts .item-thumbnail a img{display:block;height:40px;margin:0;padding:0;width:40px}
  477. .PopularPosts .widget-content ul{margin:0}
  478. .PopularPosts .widget-content ul li{border-bottom:1px solid #E6E6E6;border-top:none;padding:5px 0}
  479. .PopularPosts .widget-content ul li:last-child{border-bottom:none}
  480. .PopularPosts .item-title{color:#212121;font-size:1em;font-weight:400;line-height:1.4;max-height:2.7em;overflow:hidden;padding-top:.3em}
  481. .PopularPosts .item-title a{color:#212121}
  482. .PopularPosts .item-snippet{color:#757575;font-size:.9em;height:1.4em;line-height:1.4;overflow:hidden}
  483. .Profile .profile-img{border-radius:50%;float:left;margin:0 15px 10px 0;overflow:hidden}
  484. .Profile .profile-name-link{background-repeat:no-repeat;padding-left:20px}
  485. .Feed h6{color:#5677fc}
  486. .Feed .widget-content ul li{border-bottom:1px solid #E6E6E6;font-weight:400;padding:10px 0}
  487. .Feed .widget-content ul li a{color:#212121}
  488. .Feed .widget-content ul li:last-child{border-bottom:none}
  489.  
  490. /*FOOTER*/
  491. #footer-wrapper{background:#263238;padding:0}
  492. #footer-wrapper a{color:#FFF}
  493. #footer-wrapper a:hover{color:#F5F5F5}
  494. footer{color:#bcbcbc;font-size:.8em;line-height:1.6;margin:15px auto 0}
  495. #footer{padding:20px 25px}
  496.  
  497. /*keep-in-touch*/
  498. #keep-in-touch{border-bottom:1px solid #37474F;margin-bottom:10px;padding-bottom:10px}
  499. #keep-in-touch span{font-weight:700;margin-right:10px;text-transform:uppercase;vertical-align:middle}
  500. #keep-in-touch svg{vertical-align:middle}
  501. footer h3{display:inline;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;font-weight:700}
  502. #fab{background:#EEFF41;border-radius:50%;bottom:25px;box-shadow:0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26);padding:15px 16px 11px;position:fixed;right:25px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;z-index:99999}
  503. #fab:hover{box-shadow:0 0 4px rgba(0,0,0,.14),0 8px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26)}
  504. .banner-home-top{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  505. .banner-home-bottom{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  506. .banner-post-top{margin:0 0 15px}
  507. .banner-post-bottom{margin:25px 0 15px}
  508. .banner-sidebar{margin-bottom:20px}
  509.  
  510. @media all and (max-width : 768px) {
  511. .header,nav,#wrapper,footer{max-width:538px}
  512. navi ul{text-align:center}#content-wrapper,.banner728-top,.banner728-bottom{padding:0 10px}#post-wrapper,#sidebar-wrapper{width:100%;max-width:100%;float:none;margin:12px 0 12px 0}.post-container{margin:0 0 0 0}#nav ul#menu{text-align:center}
  513. #post-wrapper,#sidebar-wrapper{float:none;max-width:100%;width:100%}
  514. .post-container{margin:0 0 20px}
  515. #nav-wrapper{overflow:hidden}
  516. }
  517.  
  518. @media only screen and (max-width:468px) {
  519. .label{display:block;float:inherit;margin:5px 0 0}
  520. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{width:75px}
  521. }
  522. /* Search Form Desktop */
  523. .search-wrapper{width:91%;height:18px;padding:0;margin:auto;position:relative}
  524. #search-form,#searchform,.search-button{border:none;line-height:30px}
  525. #searchform{position:relative;z-index:5;overflow:hidden}
  526. #searchform:hover,#search-form:focus{border-color:#3b7dc1;z-index:5;overflow:hidden}
  527. #search-form{color:gray;width:100%;padding:0 10px 0 10px;height:30px;line-height:30px;font-size:14px;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
  528. .search-button{background-image:url(&quot;data:image/svg+xml;charset=utf8,%3csvg%20viewBox=&#39;0%200%2024%2024&#39;%20width=&#39;24&#39;%20height=&#39;24&#39;%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%20xmlns:xlink=&#39;http://www.w3.org/1999/xlink&#39;%3e%3cg%3e%3cpath%20style=&#39;fill:white&#39;%20d=&#39;M9.5,3A6.5,6.5%200%200,1%2016,9.5C16,11.11%2015.41,12.59%2014.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41%2011.11,16%209.5,16A6.5,6.5%200%200,1%203,9.5A6.5,6.5%200%200,1%209.5,3M9.5,5C7,5%205,7%205,9.5C5,12%207,14%209.5,14C12,14%2014,12%2014,9.5C14,7%2012,5%209.5,5Z&#39;%3e%3c/path%3e%3c/g%3e%3c/svg%3e&quot;);background-color:#455a64;background-repeat:no-repeat;background-size:20px 20px;background-position:8px 5px;width:34px;height:30px;overflow:hidden;float:right;top:0;right:0;position:absolute;z-index:0}
  529. #search-form:hover,.search-button:hover{border:none;border-color:#3b7dc1;outline:0;color:#555}
  530. .permalink-blog{border:1px solid #EEE; padding:10px; background:#FFF; font-size:13px; margin-top:15px;}
  531. .permalink-blog a{background:none}
  532. </style>
  533. </b:if>
  534. <!-- Tampilan Mobile Homepage End -->
  535.  
  536. <!-- Tampilan Postingan Desktop -->
  537. <b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;false&quot;'>
  538. <style amp-custom='amp-custom'>
  539. /*Reset Css*/
  540. e,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}
  541. article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
  542. body{line-height:1}
  543. ol,ul{list-style:none}
  544. blockquote,q{quotes:none}
  545. blockquote:before,blockquote:after,q:before,q:after{content:&#39;&#39;;content:none}
  546. table{border-collapse:collapse;border-spacing:0}
  547. .post-feeds,.feed-links{display:none}
  548. .section,.widget{margin:0;padding:0}
  549. strong,b{font-weight:700}
  550. cite,em,i{font-style:italic}
  551. a{color:#F44336;outline:none;text-decoration:none}
  552. a:hover{color:#D32F2F;text-decoration:none}
  553. a img{border:none;border-width:0;outline:none}
  554. abbr,acronym{border-bottom:1px dotted;cursor:help}
  555. sup,sub{font-size:.8em;position:relative;top:-.4em;vertical-align:baseline}
  556. sub{top:.4em}
  557. small{font-size:.8em}
  558. kbd{border:1px solid #757575;border-bottom-width:2px;border-radius:3px;font-size:80%;padding:2px 5px}
  559. mark{background-color:#ffce00;color:#000}
  560. p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:10px 0}
  561. hr{background-color:#666;border:none;height:1px}
  562. .clear{clear:both}
  563. body{background:#f9f9f9;color:#212121;font-family:&#39;Roboto&#39;,sans-serif;margin:0;padding:0;text-align:left;-moz-font-smoothing:antialiased;-moz-tap-highlight-color:transparent;-ms-font-smoothing:antialiased;-ms-tap-highlight-color:transparent;-o-font-smoothing:antialiased;-o-tap-highlight-color:transparent;-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
  564. .header,nav,#wrapper,footer{max-width:858px}
  565. #header-wrapper{background:#263238;margin:0 auto;width:100%}
  566. #header-wrapper a img{display:block}
  567. .header{color:#fff;font-family:&#39;Product Sans&#39;,sans-serif;margin:0 auto;overflow:hidden;padding:30px 0 25px}
  568. .header .widget{padding:0 20px}
  569. .header img{height:auto;max-width:250px}
  570. .header h1.title,.header h6.title{font-size:2em;font-weight:400;height:1em;margin:0;padding:0}
  571. .header h1.title a,.header h6.title a,.header h1.title a:hover,.header h6.title a:hover{color:#FFF}
  572. .header .description{display:none}
  573. .header a{color:#FAFAFA}
  574. .header a:hover{color:#FAFAFA}
  575. /* MENU NAVIGATION */
  576. .navi{clear:both;text-transform:uppercase;font:bold normal 12px Roboto,Arial,sans-serif;width:100%;padding:0;margin:0 auto;z-index:999}
  577. .navi ul{background:#455A64;margin:0 auto;padding:0;padding-left:18px;}
  578. .navi li{display:inline-block;margin:0 auto}
  579. .navi li a{display:block;color:#fff;padding:0 11px;line-height:34px}
  580. .navi li a:hover{background-color:#37474f}
  581. .menu{margin:30px auto 0;padding:0;position:relative}
  582. .menu ul{margin:0 auto;padding:0;text-align:center;max-width:970px;margin:0 auto}
  583. .menu ul li{display:inline-block;margin:12px 0 7px}
  584. .menu ul li a{display:block;color:#4588f3;padding:0 5px;font-size:15px}
  585. .menu ul li a:hover{color:#a7b2c3}
  586. .menu-color{background-color:#37474f}
  587.  
  588.  
  589. #wrapper{margin:0 auto;padding:0}
  590. #content-wrapper{margin:20px auto 0;overflow:hidden;padding:0 20px;position:relative;word-wrap:break-word}
  591. .nocard{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;padding:0px 35px 5px}
  592. #post-wrapper{float:left;margin:0 -320px 0 0;width:100%}
  593. .post-container{background:#FFF;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);margin:0 320px 20px 0;max-width:100%;padding:15px 15px 0}
  594. .breadcrumbs{border-bottom:1px solid #E6E6E6;color:#9E9E9E;font-size:.7em;font-weight:700;margin:0 0 15px;overflow:hidden;padding:0 0 15px 0;text-transform:uppercase}
  595. .breadcrumbs a{color:#9E9E9E}
  596. .post-label-block{font-size:.8em;line-height:1.2em;margin-top:15px;overflow:hidden}
  597. .post-label-block .date-block{color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px}
  598. .label{float:right}
  599. .post-label-block .label-block{background:#eee;border-radius:3px;color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px;text-transform:lowercase}
  600. .post-label-block abbr{border-bottom:none}
  601. .post{border-bottom:1px solid #E6E6E6;margin:0 0 15px;overflow:hidden;padding:0 0 10px}
  602. .post-snippet{color:#757575;font-size:.9em;line-height:1.2em;max-height:2.4em;overflow:hidden}
  603. .author-info{color:#9E9E9E;font-weight:700}
  604. .author-info a{color:#9E9E9E}
  605. .post-body{font-size:1em;line-height:1.6}
  606. .post-body h1,.post-body h2,.post-body h3,.post-body h4,.post-body h5,.post-body h6{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;line-height:normal;margin:20px 0 10px}
  607. .post-body h1{font-size:1.5em}
  608. .post-body h2{font-size:1.4em}
  609. .post-body h3{font-size:1.3em}
  610. .post-body h4{font-size:1.2em}
  611. .post-body h5{font-size:1.1em}
  612. .post-body h6{font-size:1em}
  613. .post-body ol{margin:0 0 0 20px ;padding:0;list-style:decimal outside}
  614. .post-body ol ol{list-style:lower-latin outside}
  615. .post-body ol ol ol{list-style:lower-roman outside}
  616. .post-body ul{margin:0 0 0 20px ;padding:0;list-style:circle outside}
  617. .post-body ul ul{list-style:disc outside}
  618. .post-body ul ul ul{list-style:square outside}
  619. .post-body li{margin:.5em 0}
  620. .post-body dl{margin:0;padding:0}
  621. .post-body dt{color:#757575;font-size:.9em}
  622. .post-body dd{margin:0 0 .5em 1em}
  623. .post-body input,.post-body button,.post-body select,.post-body textarea{font:inherit;font-size:100%;line-height:normal;vertical-align:baseline}
  624. .post-body textarea{box-sizing:border-box;display:block}
  625. .post-body code{background-color:#e8eaf6;border:1px solid #dbdbdb;border-radius:3px;color:#727272;font-family:monospace;padding:1px 5px}
  626. .post-body pre{background-color:#424242;border-radius:3px;color:#fafafa;font-family:monospace;margin-bottom:10px;overflow-x:scroll;padding:20px}
  627. .post-body blockquote{background:#eee;border-radius:3px;color:#757575;font-size:.9em;margin-bottom:10px;padding:10px 15px}
  628. .post-body img{border:0;height:auto;max-width:100%}
  629. .post-body table{max-width:100%}
  630. h1.post-title{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.5em;line-height:1.2em;margin:10px 0 20px}
  631. h2.post-title{color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1.2em;margin-bottom:10px;max-height:2.4em;overflow:hidden}
  632. h2.post-title a{color:#424242}
  633. .img-thumbnail{float:right;height:70px;margin:0 0 0 15px;width:70px}
  634. .img-thumbnail img{height:70px;width:70px}
  635. #blog-pager{clear:both;font-size:.7em;font-weight:700;margin:0;padding:3px;text-align:center;text-transform:uppercase}
  636. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{border-radius:2px;color:#757575;margin-bottom:15px;padding:8px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;width:80px}
  637. #blog-pager-newer-link a{display:block;float:left}
  638. #blog-pager-older-link a{display:block;float:right}
  639. a.home-link{display:inline-block}
  640. #blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover{background-color:#EEFF41;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);color:#827717}
  641. .post-body th{font-weight:700}
  642. .post-body table{background:#fafafa;color:#546e7a;font-size:.9em;margin:0}
  643. .post-body td,.post-body th{border:1px solid #eee;padding:8px;text-align:left;vertical-align:top}
  644. .post-body th{background:#f5f5f5}
  645. .post-body table.tr-caption-container td{background:#EEFF41;border:none;border-radius:3px;color:#827717;overflow:hidden;padding:0}
  646. .post-body img{height:auto;max-width:100%}
  647. .post-body img,.post-body table.tr-caption-container{height:auto;max-width:100%}
  648. .post-body .separator img{height:auto;max-width:100%}
  649. .post-body td.tr-caption{color:#FFF;padding:0 8px 8px}
  650. .post-body iframe,.post-body object,.post-body embed{max-width:100%}
  651. .single-post{margin-top:20px}
  652. .status-msg-wrap{background:#EEFF41;border:none;border-radius:3px;background-color:#EEFF41;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;margin:0 0 20px;overflow:hidden;padding:10px 15px;width:auto}
  653. .status-msg-body{background-color:#EEFF41;padding:0;position:static;text-align:left}
  654. .status-msg-body a{font-size:.7em;padding:0;text-decoration:none;text-transform:uppercase}
  655. .status-msg-border{display:none}
  656. .status-msg-bg{display:none}
  657. #sidebar-wrapper{float:right;margin:0 0 25px;width:300px}
  658. .sidebar-container{margin:0}
  659. .widgeticon{margin:5px 5px -5px 0}
  660. .sidebar h6,.sidebar h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNCA4aDRWNEg0djR6bTYgMTJoNHYtNGgtNHY0em0tNiAwaDR2LTRINHY0em0wLTZoNHYtNEg0djR6bTYgMGg0di00aC00djR6bTYtMTB2NGg0VjRoLTR6bS02IDRoNFY0aC00djR6bTYgNmg0di00aC00djR6bTAgNmg0di00aC00djR6IiBmaWxsPSIjNzU3NTc1Ii8+PC9zdmc+);background-position:left top;background-repeat:no-repeat;background-size:19px 19px;color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1em;overflow:hidden;padding:0 0 15px 30px}
  661. .FollowByEmail h6,.FollowByEmail h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0yMCA0aC0xNmMtMS4xIDAtMS45OS45LTEuOTkgMmwtLjAxIDEyYzAgMS4xLjkgMiAyIDJoMTZjMS4xIDAgMi0uOSAyLTJ2LTEyYzAtMS4xLS45LTItMi0yem0wIDRsLTggNS04LTV2LTJsOCA1IDgtNXYyeiIgZmlsbD0iI0NEREMzOSIvPgogICAgPHBhdGggZD0iTTAgMGgyNHYyNGgtMjR6IiBmaWxsPSJub25lIi8+Cjwvc3ZnPgo=);color:#CDDC39}
  662. .BlogArchive h6,.BlogArchive h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTAgNEg0Yy0xLjEgMC0xLjk5LjktMS45OSAyTDIgMThjMCAxLjEuOSAyIDIgMmgxNmMxLjEgMCAyLS45IDItMlY4YzAtMS4xLS45LTItMi0yaC04bC0yLTJ6IiBmaWxsPSIjNjczQUI3Ii8+PC9zdmc+);color:#673AB7}
  663. .BlogSearch h6,.BlogSearch h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0xNS41IDE0aC0uNzlsLS4yOC0uMjdjLjk4LTEuMTQgMS41Ny0yLjYyIDEuNTctNC4yMyAwLTMuNTktMi45MS02LjUtNi41LTYuNXMtNi41IDIuOTEtNi41IDYuNSAyLjkxIDYuNSA2LjUgNi41YzEuNjEgMCAzLjA5LS41OSA0LjIzLTEuNTdsLjI3LjI4di43OWw1IDQuOTkgMS40OS0xLjQ5LTQuOTktNXptLTYgMGMtMi40OSAwLTQuNS0yLjAxLTQuNS00LjVzMi4wMS00LjUgNC41LTQuNSA0LjUgMi4wMSA0LjUgNC41LTIuMDEgNC41LTQuNSA0LjV6IiBmaWxsPSIjNzk1NTQ4Ii8+CiAgICA8cGF0aCBkPSJNMCAwaDI0djI0aC0yNHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+Cg==);color:#795548}
  664. .Image h6,.Image h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEgMTlWNWMwLTEuMS0uOS0yLTItMkg1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yek04LjUgMTMuNWwyLjUgMy4wMUwxNC41IDEybDQuNSA2SDVsMy41LTQuNXoiIGZpbGw9IiM5QzI3QjAiLz48L3N2Zz4=);color:#9C27B0}
  665. .FeaturedPost h6,.FeaturedPost h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTcgM0g3Yy0xLjEgMC0xLjk5LjktMS45OSAyTDUgMjFsNy0zIDcgM1Y1YzAtMS4xLS45LTItMi0yeiIgZmlsbD0iI0ZGQzEwNyIvPjwvc3ZnPg==);color:#FFC107}
  666. .Label h6,.Label h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEuNDEgMTEuNThsLTktOUMxMi4wNSAyLjIyIDExLjU1IDIgMTEgMkg0Yy0xLjEgMC0yIC45LTIgMnY3YzAgLjU1LjIyIDEuMDUuNTkgMS40Mmw5IDljLjM2LjM2Ljg2LjU4IDEuNDEuNTguNTUgMCAxLjA1LS4yMiAxLjQxLS41OWw3LTdjLjM3LS4zNi41OS0uODYuNTktMS40MSAwLS41NS0uMjMtMS4wNi0uNTktMS40MnpNNS41IDdDNC42NyA3IDQgNi4zMyA0IDUuNVM0LjY3IDQgNS41IDQgNyA0LjY3IDcgNS41IDYuMzMgNyA1LjUgN3oiIGZpbGw9IiMwMEJDRDQiLz48L3N2Zz4=);color:#00BCD4}
  667. .LinkList h6,.LinkList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMy45IDEyYzAtMS43MSAxLjM5LTMuMSAzLjEtMy4xaDRWN0g3Yy0yLjc2IDAtNSAyLjI0LTUgNXMyLjI0IDUgNSA1aDR2LTEuOUg3Yy0xLjcxIDAtMy4xLTEuMzktMy4xLTMuMXpNOCAxM2g4di0ySDh2MnptOS02aC00djEuOWg0YzEuNzEgMCAzLjEgMS4zOSAzLjEgMy4xcy0xLjM5IDMuMS0zLjEgMy4xaC00VjE3aDRjMi43NiAwIDUtMi4yNCA1LTVzLTIuMjQtNS01LTV6IiBmaWxsPSIjMDA5Njg4Ii8+PC9zdmc+);color:#009688}
  668. .PageList h6,.PageList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNiAyYy0xLjEgMC0xLjk5LjktMS45OSAyTDQgMjBjMCAxLjEuODkgMiAxLjk5IDJIMThjMS4xIDAgMi0uOSAyLTJWOGwtNi02SDZ6bTcgN1YzLjVMMTguNSA5SDEzeiIgZmlsbD0iI0U5MUU2MyIvPjwvc3ZnPg==);color:#E91E63}
  669. .Poll h6,.Poll h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTkgM0g1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6TTkgMTdIN3YtN2gydjd6bTQgMGgtMlY3aDJ2MTB6bTQgMGgtMnYtNGgydjR6IiBmaWxsPSIjNjA3RDhCIi8+PC9zdmc+);color:#607D8B}
  670. .PopularPosts h6,.PopularPosts h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTMuNS42N3MuNzQgMi42NS43NCA0LjhjMCAyLjA2LTEuMzUgMy43My0zLjQxIDMuNzMtMi4wNyAwLTMuNjMtMS42Ny0zLjYzLTMuNzNsLjAzLS4zNkM1LjIxIDcuNTEgNCAxMC42MiA0IDE0YzAgNC40MiAzLjU4IDggOCA4czgtMy41OCA4LThDMjAgOC42MSAxNy40MSAzLjggMTMuNS42N3pNMTEuNzEgMTljLTEuNzggMC0zLjIyLTEuNC0zLjIyLTMuMTQgMC0xLjYyIDEuMDUtMi43NiAyLjgxLTMuMTIgMS43Ny0uMzYgMy42LTEuMjEgNC42Mi0yLjU4LjM5IDEuMjkuNTkgMi42NS41OSA0LjA0IDAgMi42NS0yLjE1IDQuOC00LjggNC44eiIgZmlsbD0iI0Y0NDMzNiIvPjwvc3ZnPg==);color:#F44336}
  671. .Profile h6,.Profile h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMCAzYzEuNjYgMCAzIDEuMzQgMyAzcy0xLjM0IDMtMyAzLTMtMS4zNC0zLTMgMS4zNC0zIDMtM3ptMCAxNC4yYy0yLjUgMC00LjcxLTEuMjgtNi0zLjIyLjAzLTEuOTkgNC0zLjA4IDYtMy4wOCAxLjk5IDAgNS45NyAxLjA5IDYgMy4wOC0xLjI5IDEuOTQtMy41IDMuMjItNiAzLjIyeiIgZmlsbD0iIzAzQTlGNCIvPjwvc3ZnPg==);color:#03A9F4}
  672. .Stats h6,.Stats h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTYgNmwyLjI5IDIuMjktNC44OCA0Ljg4LTQtNEwyIDE2LjU5IDMuNDEgMThsNi02IDQgNCA2LjMtNi4yOUwyMiAxMlY2eiIgZmlsbD0iI0ZGOTgwMCIvPjwvc3ZnPg==);color:#FF9800}
  673. .Subscribe h6,.Subscribe h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTEuNSAyMmMxLjEgMCAyLS45IDItMmgtNGMwIDEuMS45IDIgMiAyem02LjUtNnYtNS41YzAtMy4wNy0yLjEzLTUuNjQtNS02LjMyVjMuNWMwLS44My0uNjctMS41LTEuNS0xLjVTMTAgMi42NyAxMCAzLjV2LjY4Yy0yLjg3LjY4LTUgMy4yNS01IDYuMzJWMTZsLTIgMnYxaDE3di0xbC0yLTJ6IiBmaWxsPSIjNENBRjUwIi8+PC9zdmc+);color:#4CAF50}
  674. .Text h6,.Text h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNy41IDE4QzQuNDYgMTggMiAxNS41NCAyIDEyLjVTNC40NiA3IDcuNSA3SDE4YzIuMjEgMCA0IDEuNzkgNCA0cy0xLjc5IDQtNCA0SDkuNUM4LjEyIDE1IDcgMTMuODggNyAxMi41UzguMTIgMTAgOS41IDEwSDE3djEuNUg5LjVjLS41NSAwLTEgLjQ1LTEgMXMuNDUgMSAxIDFIMThjMS4zOCAwIDIuNS0xLjEyIDIuNS0yLjVTMTkuMzggOC41IDE4IDguNUg3LjVjLTIuMjEgMC00IDEuNzktNCA0czEuNzkgNCA0IDRIMTdWMThINy41eiIgZmlsbD0iIzNGNTFCNSIvPjwvc3ZnPg==);color:#3F51B5}
  675. .Translate h6,.Translate h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRoLTI0eiIgZmlsbD0ibm9uZSIvPgogICAgPHBhdGggZD0iTTEyLjg3IDE1LjA3bC0yLjU0LTIuNTEuMDMtLjAzYzEuNzQtMS45NCAyLjk4LTQuMTcgMy43MS02LjUzaDIuOTN2LTJoLTd2LTJoLTJ2MmgtN3YxLjk5aDExLjE3Yy0uNjcgMS45My0xLjczIDMuNzYtMy4xNyA1LjM2LS45My0xLjAzLTEuNy0yLjE2LTIuMzEtMy4zNWgtMmMuNzMgMS42MyAxLjczIDMuMTcgMi45OCA0LjU2bC01LjA5IDUuMDIgMS40MiAxLjQyIDUtNSAzLjExIDMuMTEuNzYtMi4wNHptNS42My01LjA3aC0ybC00LjUgMTJoMmwxLjEyLTNoNC43NWwxLjEzIDNoMmwtNC41LTEyem0tMi42MiA3bDEuNjItNC4zMyAxLjYyIDQuMzNoLTMuMjR6IiBmaWxsPSIjNENBRjUwIi8+Cjwvc3ZnPgo=);color:#4CAF50}
  676. .sidebar .widget{background:#FFF;border:none;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);font-size:1em;line-height:1.6;margin:0 0 20px;overflow:hidden;padding:15px;position:relative}
  677. .widget-content{font-size:.9em}
  678. .widget-item-control{border-radius:50%;line-height:1em;padding:8px 8px 6px;position:absolute;right:10px;top:10px;vertical-align:middle}
  679. .widget-item-control:hover{background:#eee}
  680. .widget-content img{height:auto;max-width:100%}
  681. .widget-content select{background:#EEE url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij48cGF0aCBkPSJNMzMuMTcgMTcuMTdMMjQgMjYuMzRsLTkuMTctOS4xN0wxMiAyMGwxMiAxMiAxMi0xMnoiIGZpbGw9IiMyMTIxMjEiLz48L3N2Zz4=) no-repeat center right 5px;background-size:20px 20px;border:none;border-radius:3px;padding:10px;width:100%;-moz-appearance:none;-webkit-appearance:none}
  682. .quickedit img{height:14px;width:14px}
  683. .sidebar ul,.sidebar ol{list-style-type:none;margin:0 -15px -15px;padding:0}
  684. .sidebar li ul,.sidebar li ol{font-size:0.9em;margin:10px -15px 0 0}
  685. .sidebar li{border-top:1px solid #E6E6E6;margin:0;padding:10px 15px}
  686. .sidebar li li{border-top:none;margin:0;padding:5px 15px}
  687. .sidebar li a{color:#757575}
  688.  
  689. */label*/
  690. .label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:.8em;line-height:1.5;opacity:10}
  691. .cloud-label-widget-content{font-size:.8em;font-weight:700;text-align:left;text-transform:uppercase}
  692. .label-size{background:#EEFF41;border-radius:3px;color:#827717;display:inline-block;margin:8px 4px 0 0;padding:4px 8px}
  693. .label-size a,.label-size span{color:#827717}
  694. .label-count{white-space:nowrap}
  695. .Image .widget-content{margin:0 -15px -20px -15px}
  696. .Image .caption{display:block;padding:5px 15px 15px}
  697.  
  698. / *PopularPosts*/
  699. .PopularPosts h6{color:#e51c23}
  700. .PopularPosts .item-thumbnail{border-radius:50%;display:inline;float:left;margin:5px 10px 5px 0;overflow:hidden}
  701. .PopularPosts .item-thumbnail a img{display:block;height:40px;margin:0;padding:0;width:40px}
  702. .PopularPosts .widget-content ul{margin:0}
  703. .PopularPosts .widget-content ul li{border-bottom:1px solid #E6E6E6;border-top:none;padding:5px 0}
  704. .PopularPosts .widget-content ul li:last-child{border-bottom:none}
  705. .PopularPosts .item-title{color:#212121;font-size:1em;font-weight:400;line-height:1.4;max-height:2.7em;overflow:hidden;padding-top:.3em}
  706. .PopularPosts .item-title a{color:#212121}
  707. .PopularPosts .item-snippet{color:#757575;font-size:.9em;height:1.4em;line-height:1.4;overflow:hidden}
  708. .Profile .profile-img{border-radius:50%;float:left;margin:0 15px 10px 0;overflow:hidden}
  709. .Profile .profile-name-link{background-repeat:no-repeat;padding-left:20px}
  710. .Feed h6{color:#5677fc}
  711. .Feed .widget-content ul li{border-bottom:1px solid #E6E6E6;font-weight:400;padding:10px 0}
  712. .Feed .widget-content ul li a{color:#212121}
  713. .Feed .widget-content ul li:last-child{border-bottom:none}
  714.  
  715. /*FOOTER*/
  716. #footer-wrapper{background:#263238;padding:0}
  717. #footer-wrapper a{color:#FFF}
  718. #footer-wrapper a:hover{color:#F5F5F5}
  719. footer{color:#bcbcbc;font-size:.8em;line-height:1.6;margin:15px auto 0}
  720. #footer{padding:20px 25px}
  721.  
  722. /*keep-in-touch*/
  723. #keep-in-touch{border-bottom:1px solid #37474F;margin-bottom:10px;padding-bottom:10px}
  724. #keep-in-touch span{font-weight:700;margin-right:10px;text-transform:uppercase;vertical-align:middle}
  725. #keep-in-touch svg{vertical-align:middle}
  726. footer h3{display:inline;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;font-weight:700}
  727. #fab{background:#EEFF41;border-radius:50%;bottom:25px;box-shadow:0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26);padding:15px 16px 11px;position:fixed;right:25px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;z-index:99999}
  728. #fab:hover{box-shadow:0 0 4px rgba(0,0,0,.14),0 8px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26)}
  729. .banner-home-top{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  730. .banner-home-bottom{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  731. .banner-post-top{margin:0 0 15px}
  732. .banner-post-bottom{margin:25px 0 15px}
  733. .banner-sidebar{margin-bottom:20px}
  734.  
  735. @media all and (max-width : 768px) {
  736. .header,nav,#wrapper,footer{max-width:538px}
  737. navi ul{text-align:center}#content-wrapper,.banner728-top,.banner728-bottom{padding:0 10px}#post-wrapper,#sidebar-wrapper{width:100%;max-width:100%;float:none;margin:12px 0 12px 0}.post-container{margin:0 0 0 0}#nav ul#menu{text-align:center}
  738. #post-wrapper,#sidebar-wrapper{float:none;max-width:100%;width:100%}
  739. .post-container{margin:0 0 20px}
  740. #nav-wrapper{overflow:hidden}
  741. }
  742.  
  743. @media only screen and (max-width:468px) {
  744. .label{display:block;float:inherit;margin:5px 0 0}
  745. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{width:75px}
  746. }
  747.  
  748. /* Komentar */
  749. .disqus-comments {margin-top:0}
  750. section[expanded] .show-more,section:not([expanded]) .show-less{display:none;}
  751. .disqus-comments h4{margin-bottom:10px;font-size:14px;padding:8px 10px;text-align:center;color:#333;background:#eee;border:none;clear:both}
  752. .disqus-comments amp-iframe{margin-left:-8px;margin-right:-8px}
  753.  
  754. /* Custom Sosial Share */
  755. amp-social-share[type=&quot;twitter&quot;] {
  756.   background-size:15px 15px;
  757. }
  758.  
  759. amp-social-share[type=&quot;gplus&quot;], amp-social-share[type=&quot;facebook&quot;], amp-social-share[type=&quot;linkedin&quot;], amp-social-share[type=&quot;pinterest&quot;] {
  760.   background-size:20px 20px;
  761. }
  762.  
  763. /* Tambahan Customize */
  764. .share-buzz {margin-top:-13px}
  765. .share-buzz h4{overflow:hidden;font-size:11px;background:#37474F;color:#fff;padding:7.5px;margin-right:3px}
  766. .note-buzz{margin-top:16px;margin-top:16px;margin-bottom:16px;padding:8px 15px;border-radius:2px;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);background-color:rgb(0,108,172);color:#eee}
  767.  
  768. .img-center{text-align:center;padding-top:15px;padding-bottom:15px;margin:0 auto}
  769. .img-left{clear:left;float:left;margin-bottom:1em;margin-right:1em;text-align:center;}
  770. .img-right{clear:right;float:right;margin-bottom:1em;margin-left:1em;text-align:center;}
  771. .img-width-300,.img-width-400,.img-width-500,.img-width-600{width:100%;text-align:center;clear:both}
  772. .img-width-300{max-width:300px;}
  773. .img-width-400{max-width:400px;}
  774. .img-width-500{max-width:500px;}
  775. .img-width-600{max-width:600px;}
  776. @media screen and (max-width:640px){
  777. .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;}
  778. }
  779. @media screen and (max-width:414px){
  780. .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;}
  781. }
  782.  
  783. /* Search Form Desktop */
  784. .search-wrapper{height:30px;float:right;display:inline;margin-top:-40px}
  785. #search-form,#searchform,.search-button{line-height:30px}
  786. #searchform{position:relative;z-index:5;overflow:hidden}
  787. #searchform:hover,#search-form:focus{border-color:#3b7dc1;z-index:5;overflow:hidden}
  788. #search-form{color:gray;width:100;padding: 0 10px 0 70px;height:30px;line-height:30px;font-size:14px;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
  789. .search-button{background-image:url(&quot;data:image/svg+xml;charset=utf8,%3csvg%20viewBox=&#39;0%200%2024%2024&#39;%20width=&#39;24&#39;%20height=&#39;24&#39;%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%20xmlns:xlink=&#39;http://www.w3.org/1999/xlink&#39;%3e%3cg%3e%3cpath%20style=&#39;fill:white&#39;%20d=&#39;M9.5,3A6.5,6.5%200%200,1%2016,9.5C16,11.11%2015.41,12.59%2014.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41%2011.11,16%209.5,16A6.5,6.5%200%200,1%203,9.5A6.5,6.5%200%200,1%209.5,3M9.5,5C7,5%205,7%205,9.5C5,12%207,14%209.5,14C12,14%2014,12%2014,9.5C14,7%2012,5%209.5,5Z&#39;%3e%3c/path%3e%3c/g%3e%3c/svg%3e&quot;);background-color:#455a64;background-repeat:no-repeat;background-size:20px 20px;background-position:8px 5px;width:34px;height:30px;overflow:hidden;float:right;top:0;right:0;position:absolute;z-index:0}
  790. #search-form:hover,.search-button:hover{border:none;border-color:#3b7dc1;outline:0;color:#555}</style>
  791. </b:if>
  792. <!-- Tampilan Postingan Desktop End -->
  793.  
  794. <!-- Tampilan Postingan Mobile -->
  795. <b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;true&quot;'>
  796. <style amp-custom='amp-custom'>
  797. /*Reset Css*/
  798. e,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}
  799. article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
  800. body{line-height:1}
  801. ol,ul{list-style:none}
  802. blockquote,q{quotes:none}
  803. blockquote:before,blockquote:after,q:before,q:after{content:&#39;&#39;;content:none}
  804. table{border-collapse:collapse;border-spacing:0}
  805. .post-feeds,.feed-links{display:none}
  806. .section,.widget{margin:0;padding:0}
  807. strong,b{font-weight:700}
  808. cite,em,i{font-style:italic}
  809. a{color:#F44336;outline:none;text-decoration:none}
  810. a:hover{color:#D32F2F;text-decoration:none}
  811. a img{border:none;border-width:0;outline:none}
  812. abbr,acronym{border-bottom:1px dotted;cursor:help}
  813. sup,sub{font-size:.8em;position:relative;top:-.4em;vertical-align:baseline}
  814. sub{top:.4em}
  815. small{font-size:.8em}
  816. kbd{border:1px solid #757575;border-bottom-width:2px;border-radius:3px;font-size:80%;padding:2px 5px}
  817. mark{background-color:#ffce00;color:#000}
  818. p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:10px 0}
  819. hr{background-color:#666;border:none;height:1px}
  820. .clear{clear:both}
  821. body{background:#f9f9f9;color:#212121;font-family:&#39;Roboto&#39;,sans-serif;margin:0;padding:0;text-align:left;-moz-font-smoothing:antialiased;-moz-tap-highlight-color:transparent;-ms-font-smoothing:antialiased;-ms-tap-highlight-color:transparent;-o-font-smoothing:antialiased;-o-tap-highlight-color:transparent;-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
  822. .header,nav,#wrapper,footer{max-width:858px}
  823. #header-wrapper{background:#263238;margin:0 auto;width:100%}
  824. #header-wrapper a img{display:block}
  825. .header{color:#fff;font-family:&#39;Product Sans&#39;,sans-serif;margin:0 auto;overflow:hidden;padding:30px 0 25px}
  826. .header .widget{padding:0 20px}
  827. .header img{height:auto;max-width:250px}
  828. .header h1.title,.header h6.title{font-size:2em;font-weight:400;height:1em;margin:0;padding:0}
  829. .header h1.title a,.header h6.title a,.header h1.title a:hover,.header h6.title a:hover{color:#FFF}
  830. .header .description{display:none}
  831. .header a{color:#FAFAFA}
  832. .header a:hover{color:#FAFAFA}
  833. /* MENU NAVIGATION */
  834. .navi{clear:both;text-transform:uppercase;font:bold normal 12px Roboto,Arial,sans-serif;width:100%;padding:0;margin:0 auto;z-index:999}
  835. .navi ul{background:#455A64;margin:0 auto;padding:0;padding-left:18px;}
  836. .navi li{display:inline-block;margin:0 auto}
  837. .navi li a{display:block;color:#fff;padding:0 11px;line-height:34px}
  838. .navi li a:hover{background-color:#37474f}
  839. .menu{margin:30px auto 0;padding:0;position:relative}
  840. .menu ul{margin:0 auto;padding:0;text-align:center;max-width:970px;margin:0 auto}
  841. .menu ul li{display:inline-block;margin:12px 0 7px}
  842. .menu ul li a{display:block;color:#4588f3;padding:0 5px;font-size:15px}
  843. .menu ul li a:hover{color:#a7b2c3}
  844. .menu-color{background-color:#37474f}
  845.  
  846.  
  847. #wrapper{margin:0 auto;padding:0}
  848. #content-wrapper{margin:20px auto 0;overflow:hidden;padding:0 20px;position:relative;word-wrap:break-word}
  849. .nocard{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;padding:0px 35px 5px}
  850. #post-wrapper{float:left;margin:0 -320px 0 0;width:100%}
  851. .post-container{background:#FFF;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);margin:0 320px 20px 0;max-width:100%;padding:15px 15px 0}
  852. .breadcrumbs{border-bottom:1px solid #E6E6E6;color:#9E9E9E;font-size:.7em;font-weight:700;margin:0 0 15px;overflow:hidden;padding:0 0 15px 0;text-transform:uppercase}
  853. .breadcrumbs a{color:#9E9E9E}
  854. .post-label-block{font-size:.8em;line-height:1.2em;margin-top:15px;overflow:hidden}
  855. .post-label-block .date-block{color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px}
  856. .label{float:right}
  857. .post-label-block .label-block{background:#eee;border-radius:3px;color:#9e9e9e;display:inline-block;margin:0 0 2px;padding:4px 8px;text-transform:lowercase}
  858. .post-label-block abbr{border-bottom:none}
  859. .post{border-bottom:1px solid #E6E6E6;margin:0 0 15px;overflow:hidden;padding:0 0 10px}
  860. .post-snippet{color:#757575;font-size:.9em;line-height:1.2em;max-height:2.4em;overflow:hidden}
  861. .author-info{color:#9E9E9E;font-weight:700}
  862. .author-info a{color:#9E9E9E}
  863. .post-body{font-size:1em;line-height:1.6}
  864. .post-body h1,.post-body h2,.post-body h3,.post-body h4,.post-body h5,.post-body h6{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;line-height:normal;margin:20px 0 10px}
  865. .post-body h1{font-size:1.5em}
  866. .post-body h2{font-size:1.4em}
  867. .post-body h3{font-size:1.3em}
  868. .post-body h4{font-size:1.2em}
  869. .post-body h5{font-size:1.1em}
  870. .post-body h6{font-size:1em}
  871. .post-body ol{margin:0 0 0 20px ;padding:0;list-style:decimal outside}
  872. .post-body ol ol{list-style:lower-latin outside}
  873. .post-body ol ol ol{list-style:lower-roman outside}
  874. .post-body ul{margin:0 0 0 20px ;padding:0;list-style:circle outside}
  875. .post-body ul ul{list-style:disc outside}
  876. .post-body ul ul ul{list-style:square outside}
  877. .post-body li{margin:.5em 0}
  878. .post-body dl{margin:0;padding:0}
  879. .post-body dt{color:#757575;font-size:.9em}
  880. .post-body dd{margin:0 0 .5em 1em}
  881. .post-body input,.post-body button,.post-body select,.post-body textarea{font:inherit;font-size:100%;line-height:normal;vertical-align:baseline}
  882. .post-body textarea{box-sizing:border-box;display:block}
  883. .post-body code{background-color:#e8eaf6;border:1px solid #dbdbdb;border-radius:3px;color:#727272;font-family:monospace;padding:1px 5px}
  884. .post-body pre{background-color:#424242;border-radius:3px;color:#fafafa;font-family:monospace;margin-bottom:10px;overflow-x:scroll;padding:20px}
  885. .post-body blockquote{background:#eee;border-radius:3px;color:#757575;font-size:.9em;margin-bottom:10px;padding:10px 15px}
  886. .post-body img{border:0;height:auto;max-width:100%}
  887. .post-body table{max-width:100%}
  888. h1.post-title{color:#757575;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.5em;line-height:1.2em;margin:0px 0 10px}
  889. h2.post-title{color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1.2em;margin-bottom:10px;max-height:2.4em;overflow:hidden}
  890. h2.post-title a{color:#424242}
  891. .img-thumbnail{float:right;height:70px;margin:0 0 0 15px;width:70px}
  892. .img-thumbnail img{height:70px;width:70px}
  893. #blog-pager{clear:both;font-size:.7em;font-weight:700;margin:0;padding:3px;text-align:center;text-transform:uppercase}
  894. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{border-radius:2px;color:#757575;margin-bottom:15px;padding:8px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;width:80px}
  895. #blog-pager-newer-link a{display:block;float:left}
  896. #blog-pager-older-link a{display:block;float:right}
  897. a.home-link{display:inline-block}
  898. #blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover{background-color:#EEFF41;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);color:#827717}
  899. .post-body th{font-weight:700}
  900. .post-body table{background:#fafafa;color:#546e7a;font-size:.9em;margin:0}
  901. .post-body td,.post-body th{border:1px solid #eee;padding:8px;text-align:left;vertical-align:top}
  902. .post-body th{background:#f5f5f5}
  903. .post-body table.tr-caption-container td{background:#EEFF41;border:none;border-radius:3px;color:#827717;overflow:hidden;padding:0}
  904. .post-body img{height:auto;max-width:100%}
  905. .post-body img,.post-body table.tr-caption-container{height:auto;max-width:100%}
  906. .post-body .separator img{height:auto;max-width:100%}
  907. .post-body td.tr-caption{color:#FFF;padding:0 8px 8px}
  908. .post-body iframe,.post-body object,.post-body embed{max-width:100%}
  909. .single-post{margin-top:20px}
  910. .status-msg-wrap{background:#EEFF41;border:none;border-radius:3px;background-color:#EEFF41;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;margin:0 0 20px;overflow:hidden;padding:10px 15px;width:auto}
  911. .status-msg-body{background-color:#EEFF41;padding:0;position:static;text-align:left}
  912. .status-msg-body a{font-size:.7em;padding:0;text-decoration:none;text-transform:uppercase}
  913. .status-msg-border{display:none}
  914. .status-msg-bg{display:none}
  915. #sidebar-wrapper{float:right;margin:0 0 25px;width:300px}
  916. .sidebar-container{margin:0}
  917. .widgeticon{margin:5px 5px -5px 0}
  918. .sidebar h6,.sidebar h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNCA4aDRWNEg0djR6bTYgMTJoNHYtNGgtNHY0em0tNiAwaDR2LTRINHY0em0wLTZoNHYtNEg0djR6bTYgMGg0di00aC00djR6bTYtMTB2NGg0VjRoLTR6bS02IDRoNFY0aC00djR6bTYgNmg0di00aC00djR6bTAgNmg0di00aC00djR6IiBmaWxsPSIjNzU3NTc1Ii8+PC9zdmc+);background-position:left top;background-repeat:no-repeat;background-size:19px 19px;color:#212121;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1.2em;line-height:1em;overflow:hidden;padding:0 0 15px 30px}
  919. .FollowByEmail h6,.FollowByEmail h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0yMCA0aC0xNmMtMS4xIDAtMS45OS45LTEuOTkgMmwtLjAxIDEyYzAgMS4xLjkgMiAyIDJoMTZjMS4xIDAgMi0uOSAyLTJ2LTEyYzAtMS4xLS45LTItMi0yem0wIDRsLTggNS04LTV2LTJsOCA1IDgtNXYyeiIgZmlsbD0iI0NEREMzOSIvPgogICAgPHBhdGggZD0iTTAgMGgyNHYyNGgtMjR6IiBmaWxsPSJub25lIi8+Cjwvc3ZnPgo=);color:#CDDC39}
  920. .BlogArchive h6,.BlogArchive h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTAgNEg0Yy0xLjEgMC0xLjk5LjktMS45OSAyTDIgMThjMCAxLjEuOSAyIDIgMmgxNmMxLjEgMCAyLS45IDItMlY4YzAtMS4xLS45LTItMi0yaC04bC0yLTJ6IiBmaWxsPSIjNjczQUI3Ii8+PC9zdmc+);color:#673AB7}
  921. .BlogSearch h6,.BlogSearch h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0xNS41IDE0aC0uNzlsLS4yOC0uMjdjLjk4LTEuMTQgMS41Ny0yLjYyIDEuNTctNC4yMyAwLTMuNTktMi45MS02LjUtNi41LTYuNXMtNi41IDIuOTEtNi41IDYuNSAyLjkxIDYuNSA2LjUgNi41YzEuNjEgMCAzLjA5LS41OSA0LjIzLTEuNTdsLjI3LjI4di43OWw1IDQuOTkgMS40OS0xLjQ5LTQuOTktNXptLTYgMGMtMi40OSAwLTQuNS0yLjAxLTQuNS00LjVzMi4wMS00LjUgNC41LTQuNSA0LjUgMi4wMSA0LjUgNC41LTIuMDEgNC41LTQuNSA0LjV6IiBmaWxsPSIjNzk1NTQ4Ii8+CiAgICA8cGF0aCBkPSJNMCAwaDI0djI0aC0yNHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+Cg==);color:#795548}
  922. .Image h6,.Image h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEgMTlWNWMwLTEuMS0uOS0yLTItMkg1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yek04LjUgMTMuNWwyLjUgMy4wMUwxNC41IDEybDQuNSA2SDVsMy41LTQuNXoiIGZpbGw9IiM5QzI3QjAiLz48L3N2Zz4=);color:#9C27B0}
  923. .FeaturedPost h6,.FeaturedPost h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTcgM0g3Yy0xLjEgMC0xLjk5LjktMS45OSAyTDUgMjFsNy0zIDcgM1Y1YzAtMS4xLS45LTItMi0yeiIgZmlsbD0iI0ZGQzEwNyIvPjwvc3ZnPg==);color:#FFC107}
  924. .Label h6,.Label h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjEuNDEgMTEuNThsLTktOUMxMi4wNSAyLjIyIDExLjU1IDIgMTEgMkg0Yy0xLjEgMC0yIC45LTIgMnY3YzAgLjU1LjIyIDEuMDUuNTkgMS40Mmw5IDljLjM2LjM2Ljg2LjU4IDEuNDEuNTguNTUgMCAxLjA1LS4yMiAxLjQxLS41OWw3LTdjLjM3LS4zNi41OS0uODYuNTktMS40MSAwLS41NS0uMjMtMS4wNi0uNTktMS40MnpNNS41IDdDNC42NyA3IDQgNi4zMyA0IDUuNVM0LjY3IDQgNS41IDQgNyA0LjY3IDcgNS41IDYuMzMgNyA1LjUgN3oiIGZpbGw9IiMwMEJDRDQiLz48L3N2Zz4=);color:#00BCD4}
  925. .LinkList h6,.LinkList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMy45IDEyYzAtMS43MSAxLjM5LTMuMSAzLjEtMy4xaDRWN0g3Yy0yLjc2IDAtNSAyLjI0LTUgNXMyLjI0IDUgNSA1aDR2LTEuOUg3Yy0xLjcxIDAtMy4xLTEuMzktMy4xLTMuMXpNOCAxM2g4di0ySDh2MnptOS02aC00djEuOWg0YzEuNzEgMCAzLjEgMS4zOSAzLjEgMy4xcy0xLjM5IDMuMS0zLjEgMy4xaC00VjE3aDRjMi43NiAwIDUtMi4yNCA1LTVzLTIuMjQtNS01LTV6IiBmaWxsPSIjMDA5Njg4Ii8+PC9zdmc+);color:#009688}
  926. .PageList h6,.PageList h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNiAyYy0xLjEgMC0xLjk5LjktMS45OSAyTDQgMjBjMCAxLjEuODkgMiAxLjk5IDJIMThjMS4xIDAgMi0uOSAyLTJWOGwtNi02SDZ6bTcgN1YzLjVMMTguNSA5SDEzeiIgZmlsbD0iI0U5MUU2MyIvPjwvc3ZnPg==);color:#E91E63}
  927. .Poll h6,.Poll h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTkgM0g1Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6TTkgMTdIN3YtN2gydjd6bTQgMGgtMlY3aDJ2MTB6bTQgMGgtMnYtNGgydjR6IiBmaWxsPSIjNjA3RDhCIi8+PC9zdmc+);color:#607D8B}
  928. .PopularPosts h6,.PopularPosts h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTMuNS42N3MuNzQgMi42NS43NCA0LjhjMCAyLjA2LTEuMzUgMy43My0zLjQxIDMuNzMtMi4wNyAwLTMuNjMtMS42Ny0zLjYzLTMuNzNsLjAzLS4zNkM1LjIxIDcuNTEgNCAxMC42MiA0IDE0YzAgNC40MiAzLjU4IDggOCA4czgtMy41OCA4LThDMjAgOC42MSAxNy40MSAzLjggMTMuNS42N3pNMTEuNzEgMTljLTEuNzggMC0zLjIyLTEuNC0zLjIyLTMuMTQgMC0xLjYyIDEuMDUtMi43NiAyLjgxLTMuMTIgMS43Ny0uMzYgMy42LTEuMjEgNC42Mi0yLjU4LjM5IDEuMjkuNTkgMi42NS41OSA0LjA0IDAgMi42NS0yLjE1IDQuOC00LjggNC44eiIgZmlsbD0iI0Y0NDMzNiIvPjwvc3ZnPg==);color:#F44336}
  929. .Profile h6,.Profile h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMCAzYzEuNjYgMCAzIDEuMzQgMyAzcy0xLjM0IDMtMyAzLTMtMS4zNC0zLTMgMS4zNC0zIDMtM3ptMCAxNC4yYy0yLjUgMC00LjcxLTEuMjgtNi0zLjIyLjAzLTEuOTkgNC0zLjA4IDYtMy4wOCAxLjk5IDAgNS45NyAxLjA5IDYgMy4wOC0xLjI5IDEuOTQtMy41IDMuMjItNiAzLjIyeiIgZmlsbD0iIzAzQTlGNCIvPjwvc3ZnPg==);color:#03A9F4}
  930. .Stats h6,.Stats h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTYgNmwyLjI5IDIuMjktNC44OCA0Ljg4LTQtNEwyIDE2LjU5IDMuNDEgMThsNi02IDQgNCA2LjMtNi4yOUwyMiAxMlY2eiIgZmlsbD0iI0ZGOTgwMCIvPjwvc3ZnPg==);color:#FF9800}
  931. .Subscribe h6,.Subscribe h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTEuNSAyMmMxLjEgMCAyLS45IDItMmgtNGMwIDEuMS45IDIgMiAyem02LjUtNnYtNS41YzAtMy4wNy0yLjEzLTUuNjQtNS02LjMyVjMuNWMwLS44My0uNjctMS41LTEuNS0xLjVTMTAgMi42NyAxMCAzLjV2LjY4Yy0yLjg3LjY4LTUgMy4yNS01IDYuMzJWMTZsLTIgMnYxaDE3di0xbC0yLTJ6IiBmaWxsPSIjNENBRjUwIi8+PC9zdmc+);color:#4CAF50}
  932. .Text h6,.Text h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNy41IDE4QzQuNDYgMTggMiAxNS41NCAyIDEyLjVTNC40NiA3IDcuNSA3SDE4YzIuMjEgMCA0IDEuNzkgNCA0cy0xLjc5IDQtNCA0SDkuNUM4LjEyIDE1IDcgMTMuODggNyAxMi41UzguMTIgMTAgOS41IDEwSDE3djEuNUg5LjVjLS41NSAwLTEgLjQ1LTEgMXMuNDUgMSAxIDFIMThjMS4zOCAwIDIuNS0xLjEyIDIuNS0yLjVTMTkuMzggOC41IDE4IDguNUg3LjVjLTIuMjEgMC00IDEuNzktNCA0czEuNzkgNCA0IDRIMTdWMThINy41eiIgZmlsbD0iIzNGNTFCNSIvPjwvc3ZnPg==);color:#3F51B5}
  933. .Translate h6,.Translate h2{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRoLTI0eiIgZmlsbD0ibm9uZSIvPgogICAgPHBhdGggZD0iTTEyLjg3IDE1LjA3bC0yLjU0LTIuNTEuMDMtLjAzYzEuNzQtMS45NCAyLjk4LTQuMTcgMy43MS02LjUzaDIuOTN2LTJoLTd2LTJoLTJ2MmgtN3YxLjk5aDExLjE3Yy0uNjcgMS45My0xLjczIDMuNzYtMy4xNyA1LjM2LS45My0xLjAzLTEuNy0yLjE2LTIuMzEtMy4zNWgtMmMuNzMgMS42MyAxLjczIDMuMTcgMi45OCA0LjU2bC01LjA5IDUuMDIgMS40MiAxLjQyIDUtNSAzLjExIDMuMTEuNzYtMi4wNHptNS42My01LjA3aC0ybC00LjUgMTJoMmwxLjEyLTNoNC43NWwxLjEzIDNoMmwtNC41LTEyem0tMi42MiA3bDEuNjItNC4zMyAxLjYyIDQuMzNoLTMuMjR6IiBmaWxsPSIjNENBRjUwIi8+Cjwvc3ZnPgo=);color:#4CAF50}
  934. .sidebar .widget{background:#FFF;border:none;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);font-size:1em;line-height:1.6;margin:0 0 20px;overflow:hidden;padding:15px;position:relative}
  935. .widget-content{font-size:.9em}
  936. .widget-item-control{border-radius:50%;line-height:1em;padding:8px 8px 6px;position:absolute;right:10px;top:10px;vertical-align:middle}
  937. .widget-item-control:hover{background:#eee}
  938. .widget-content img{height:auto;max-width:100%}
  939. .widget-content select{background:#EEE url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij48cGF0aCBkPSJNMzMuMTcgMTcuMTdMMjQgMjYuMzRsLTkuMTctOS4xN0wxMiAyMGwxMiAxMiAxMi0xMnoiIGZpbGw9IiMyMTIxMjEiLz48L3N2Zz4=) no-repeat center right 5px;background-size:20px 20px;border:none;border-radius:3px;padding:10px;width:100%;-moz-appearance:none;-webkit-appearance:none}
  940. .quickedit img{height:14px;width:14px}
  941. .sidebar ul,.sidebar ol{list-style-type:none;margin:0 -15px -15px;padding:0}
  942. .sidebar li ul,.sidebar li ol{font-size:0.9em;margin:10px -15px 0 0}
  943. .sidebar li{border-top:1px solid #E6E6E6;margin:0;padding:10px 15px}
  944. .sidebar li li{border-top:none;margin:0;padding:5px 15px}
  945. .sidebar li a{color:#757575}
  946.  
  947. */label*/
  948. .label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:.8em;line-height:1.5;opacity:10}
  949. .cloud-label-widget-content{font-size:.8em;font-weight:700;text-align:left;text-transform:uppercase}
  950. .label-size{background:#EEFF41;border-radius:3px;color:#827717;display:inline-block;margin:8px 4px 0 0;padding:4px 8px}
  951. .label-size a,.label-size span{color:#827717}
  952. .label-count{white-space:nowrap}
  953. .Image .widget-content{margin:0 -15px -20px -15px}
  954. .Image .caption{display:block;padding:5px 15px 15px}
  955.  
  956. / *PopularPosts*/
  957. .PopularPosts h6{color:#e51c23}
  958. .PopularPosts .item-thumbnail{border-radius:50%;display:inline;float:left;margin:5px 10px 5px 0;overflow:hidden}
  959. .PopularPosts .item-thumbnail a img{display:block;height:40px;margin:0;padding:0;width:40px}
  960. .PopularPosts .widget-content ul{margin:0}
  961. .PopularPosts .widget-content ul li{border-bottom:1px solid #E6E6E6;border-top:none;padding:5px 0}
  962. .PopularPosts .widget-content ul li:last-child{border-bottom:none}
  963. .PopularPosts .item-title{color:#212121;font-size:1em;font-weight:400;line-height:1.4;max-height:2.7em;overflow:hidden;padding-top:.3em}
  964. .PopularPosts .item-title a{color:#212121}
  965. .PopularPosts .item-snippet{color:#757575;font-size:.9em;height:1.4em;line-height:1.4;overflow:hidden}
  966. .Profile .profile-img{border-radius:50%;float:left;margin:0 15px 10px 0;overflow:hidden}
  967. .Profile .profile-name-link{background-repeat:no-repeat;padding-left:20px}
  968. .Feed h6{color:#5677fc}
  969. .Feed .widget-content ul li{border-bottom:1px solid #E6E6E6;font-weight:400;padding:10px 0}
  970. .Feed .widget-content ul li a{color:#212121}
  971. .Feed .widget-content ul li:last-child{border-bottom:none}
  972.  
  973. /*FOOTER*/
  974. #footer-wrapper{background:#263238;padding:0}
  975. #footer-wrapper a{color:#FFF}
  976. #footer-wrapper a:hover{color:#F5F5F5}
  977. footer{color:#bcbcbc;font-size:.8em;line-height:1.6;margin:15px auto 0}
  978. #footer{padding:20px 25px}
  979.  
  980. /*keep-in-touch*/
  981. #keep-in-touch{border-bottom:1px solid #37474F;margin-bottom:10px;padding-bottom:10px}
  982. #keep-in-touch span{font-weight:700;margin-right:10px;text-transform:uppercase;vertical-align:middle}
  983. #keep-in-touch svg{vertical-align:middle}
  984. footer h3{display:inline;font-family:&#39;Product Sans&#39;,sans-serif;font-size:1em;font-weight:700}
  985. #fab{background:#EEFF41;border-radius:50%;bottom:25px;box-shadow:0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26);padding:15px 16px 11px;position:fixed;right:25px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;z-index:99999}
  986. #fab:hover{box-shadow:0 0 4px rgba(0,0,0,.14),0 8px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26)}
  987. .banner-home-top{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  988. .banner-home-bottom{border-bottom:1px solid #E6E6E6;margin:0 0 15px;padding-bottom:15px}
  989. .banner-post-top{margin:0 0 15px}
  990. .banner-post-bottom{margin:25px 0 15px}
  991. .banner-sidebar{margin-bottom:20px}
  992.  
  993. @media all and (max-width : 768px) {
  994. .header,nav,#wrapper,footer{max-width:538px}
  995. navi ul{text-align:center}#content-wrapper,.banner728-top,.banner728-bottom{padding:0 10px}#post-wrapper,#sidebar-wrapper{width:100%;max-width:100%;float:none;margin:12px 0 12px 0}.post-container{margin:0 0 0 0}#nav ul#menu{text-align:center}
  996. #post-wrapper,#sidebar-wrapper{float:none;max-width:100%;width:100%}
  997. .post-container{margin:0 0 20px}
  998. #nav-wrapper{overflow:hidden}
  999. }
  1000.  
  1001. @media only screen and (max-width:468px) {
  1002. .label{display:block;float:inherit;margin:5px 0 0}
  1003. #blog-pager-newer-link a,#blog-pager-older-link a,a.home-link{width:75px}
  1004. }
  1005.  
  1006. /* Komentar */
  1007. .disqus-comments {margin-top:0}
  1008. section[expanded] .show-more,section:not([expanded]) .show-less{display:none;}
  1009. .disqus-comments h4{margin-bottom:10px;font-size:14px;padding:8px 10px;text-align:center;color:#333;background:#eee;border:none;clear:both}
  1010. .disqus-comments amp-iframe{margin-left:-8px;margin-right:-8px}
  1011.  
  1012. /* Custom Sosial Share */
  1013. amp-social-share[type=&quot;twitter&quot;] {
  1014.   background-size:15px 15px;
  1015. }
  1016.  
  1017. amp-social-share[type=&quot;gplus&quot;], amp-social-share[type=&quot;facebook&quot;], amp-social-share[type=&quot;linkedin&quot;], amp-social-share[type=&quot;pinterest&quot;] {
  1018.   background-size:20px 20px;
  1019. }
  1020.  
  1021. /* Tambahan Customize */
  1022. .share-buzz {margin-top:-13px}
  1023. .share-buzz h4{overflow:hidden;font-size:11px;background:#37474F;color:#fff;padding:7.5px;margin-right:3px}
  1024. .note-buzz{margin-top:16px;margin-top:16px;margin-bottom:16px;padding:8px 15px;border-radius:2px;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);background-color:rgb(0,108,172);color:#eee}
  1025.  
  1026. .img-center{text-align:center;padding-top:15px;padding-bottom:15px;margin:0 auto}
  1027. .img-left{clear:left;float:left;margin-bottom:1em;margin-right:1em;text-align:center;}
  1028. .img-right{clear:right;float:right;margin-bottom:1em;margin-left:1em;text-align:center;}
  1029. .img-width-300,.img-width-400,.img-width-500,.img-width-600{width:100%;text-align:center;clear:both}
  1030. .img-width-300{max-width:300px;}
  1031. .img-width-400{max-width:400px;}
  1032. .img-width-500{max-width:500px;}
  1033. .img-width-600{max-width:600px;}
  1034. @media screen and (max-width:640px){
  1035. .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;}
  1036. }
  1037. @media screen and (max-width:414px){
  1038. .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;}
  1039. }
  1040.  
  1041. /* Search Form Desktop */
  1042. .search-wrapper{width:91%;height:18px;padding:0;margin:auto;position:relative}
  1043. #search-form,#searchform,.search-button{border:none;line-height:30px}
  1044. #searchform{position:relative;z-index:5;overflow:hidden}
  1045. #searchform:hover,#search-form:focus{border-color:#3b7dc1;z-index:5;overflow:hidden}
  1046. #search-form{color:gray;width:100%;padding:0 10px 0 10px;height:30px;line-height:30px;font-size:14px;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
  1047. .search-button{background-image:url(&quot;data:image/svg+xml;charset=utf8,%3csvg%20viewBox=&#39;0%200%2024%2024&#39;%20width=&#39;24&#39;%20height=&#39;24&#39;%20xmlns=&#39;http://www.w3.org/2000/svg&#39;%20xmlns:xlink=&#39;http://www.w3.org/1999/xlink&#39;%3e%3cg%3e%3cpath%20style=&#39;fill:white&#39;%20d=&#39;M9.5,3A6.5,6.5%200%200,1%2016,9.5C16,11.11%2015.41,12.59%2014.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41%2011.11,16%209.5,16A6.5,6.5%200%200,1%203,9.5A6.5,6.5%200%200,1%209.5,3M9.5,5C7,5%205,7%205,9.5C5,12%207,14%209.5,14C12,14%2014,12%2014,9.5C14,7%2012,5%209.5,5Z&#39;%3e%3c/path%3e%3c/g%3e%3c/svg%3e&quot;);background-color:#455a64;background-repeat:no-repeat;background-size:20px 20px;background-position:8px 5px;width:34px;height:30px;overflow:hidden;float:right;top:0;right:0;position:absolute;z-index:0}
  1048. #search-form:hover,.search-button:hover{border:none;border-color:#3b7dc1;outline:0;color:#555}
  1049. .permalink-blog{border:1px solid #EEE; padding:10px; background:#FFF; font-size:13px; margin-top:15px;}
  1050. .permalink-blog a{background:none}
  1051. </style>
  1052. </b:if>
  1053. <!-- Tampilan Postingan Mobile End -->
  1054.  
  1055. <script async='async' src='https://cdn.ampproject.org/v0.js'/>
  1056. <script async='async' custom-element='amp-form' src='https://cdn.ampproject.org/v0/amp-form-0.1.js'/>
  1057. <script async='async' custom-element='amp-iframe' src='https://cdn.ampproject.org/v0/amp-iframe-0.1.js'/>
  1058. <script async='async' custom-element='amp-ad' src='https://cdn.ampproject.org/v0/amp-ad-0.1.js'/>
  1059. <script async='async' custom-element='amp-accordion' src='https://cdn.ampproject.org/v0/amp-accordion-0.1.js'/>
  1060. <script async='async' custom-element='amp-analytics' src='https://cdn.ampproject.org/v0/amp-analytics-0.1.js'/>
  1061.     <script async='async' custom-element='amp-social-share' src='https://cdn.ampproject.org/v0/amp-social-share-0.1.js'/>
  1062.     <script async='async' custom-element='amp-carousel' src='https://cdn.ampproject.org/v0/amp-carousel-0.1.js'/>
  1063.     <script async='async' custom-element='amp-youtube' src='https://cdn.ampproject.org/v0/amp-youtube-0.1.js'/>
  1064. <b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
  1065.     <script async='async' custom-element='amp-sidebar' src='https://cdn.ampproject.org/v0/amp-sidebar-0.1.js'/>
  1066. </b:if>
  1067.   <link href='https://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'/>
  1068.   <link href='https://fonts.googleapis.com/css?family=Product+Sans:400,700' rel='stylesheet' type='text/css'/>
  1069. <b:include data='blog' name='google-analytics'/>
  1070. &lt;/head&gt;&lt;!--<head/>--&gt;
  1071.  
  1072. <body itemscope='itemscope' itemtype='http://schema.org/WebPage'>
  1073. <amp-analytics id='analytics1' type='googleanalytics'>
  1074. <script type='application/json'>
  1075. {
  1076.   &quot;vars&quot;: {
  1077.     &quot;account&quot;: &quot;UA-58221769-3&quot;
  1078.   },
  1079.   &quot;triggers&quot;: {
  1080.     &quot;trackPageview&quot;: {
  1081.       &quot;on&quot;: &quot;visible&quot;,
  1082.       &quot;request&quot;: &quot;pageview&quot;
  1083.     }
  1084.   }
  1085. }
  1086. </script>
  1087. </amp-analytics>
  1088.  
  1089.   <!-- header wrapper start -->
  1090.   <header id='header-wrapper'>  
  1091.     <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
  1092.         <b:widget id='Header1' locked='true' title='Materi AMP (Header)' type='Header' version='1' visible='true'>
  1093.           <b:includable id='main'>
  1094.           <b:if cond='data:useImage'>
  1095.             <b:if cond='data:imagePlacement == &quot;BEHIND&quot;'>
  1096.               <b:if cond='data:mobile'>
  1097.                 <div id='header-inner'>
  1098.                   <div class='titlewrapper' style='background: transparent'>
  1099.                     <h1 class='title' style='background: transparent; border-width: 0px'>
  1100.                       <b:include name='title'/>
  1101.                     </h1>
  1102.                   </div>
  1103.                   <b:include name='description'/>
  1104.                 </div>
  1105.               <b:else/>
  1106.                 <div expr:style='&quot;background-image: url(\&quot;&quot; + data:sourceUrl + &quot;\&quot;); &quot; + &quot;background-position: &quot; + data:backgroundPositionStyleStr + &quot;; &quot; + data:widthStyleStr + &quot;min-height: &quot; + data:height + &quot;_height: &quot; + data:height + &quot;background-repeat: no-repeat; &quot;' id='header-inner'>
  1107.                   <div class='titlewrapper' style='background: transparent'>
  1108.                     <h1 class='title' style='background: transparent; border-width: 0px'>
  1109.                       <b:include name='title'/>
  1110.                     </h1>
  1111.                   </div>
  1112.                   <b:include name='description'/>
  1113.                 </div>
  1114.               </b:if>
  1115.             <b:else/>
  1116.               <div id='header-inner'>
  1117.                 <b:if cond='data:blog.pageType != &quot;item&quot;'>
  1118.                   <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
  1119.                     <h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'>
  1120.                       <b:include name='title'/>
  1121.                     </h1>
  1122.                   </b:if>
  1123.                 </b:if>
  1124.                 <a expr:href='data:blog.homepageUrl' style='display: block'>
  1125.                   <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
  1126.                 </a>
  1127.                 <b:if cond='data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'>
  1128.                   <b:include name='description'/>
  1129.                   <b:if cond='data:blog.pageType != &quot;item&quot;'>
  1130.                     <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
  1131.                       <h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'>
  1132.                         <b:include name='title'/>
  1133.                       </h1>
  1134.                     </b:if>
  1135.                   </b:if>
  1136.                 </b:if>
  1137.               </div>
  1138.             </b:if>
  1139.           <b:else/>
  1140.             <div id='header-inner'>
  1141.               <div class='titlewrapper'>  
  1142.                 <b:if cond='data:blog.pageType != &quot;item&quot;'>
  1143.                   <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  1144.                     <h6 class='title'>
  1145.                       <b:include name='title'/>
  1146.                     </h6>
  1147.                   <b:else/>
  1148.                     <h1 class='title'>
  1149.                       <b:include name='title'/>
  1150.                     </h1>
  1151.                   </b:if>
  1152.                 <b:else/>
  1153.                   <h6 class='title'>
  1154.                     <b:include name='title'/>
  1155.                   </h6>
  1156.                 </b:if>
  1157.                 <b:include name='description'/>
  1158.               </div>
  1159.             </div>
  1160.           </b:if>
  1161.         </b:includable>
  1162.           <b:includable id='description'>
  1163.           <div class='descriptionwrapper'>
  1164.             <p class='description'><span><data:description/></span></p>
  1165.           </div>
  1166.         </b:includable>
  1167.           <b:includable id='title'>
  1168.           <b:if cond='data:blog.url == data:blog.homepageUrl'>
  1169.             <data:title/>
  1170.           <b:else/>
  1171.             <a expr:href='data:blog.homepageUrl'><data:title/></a>
  1172.           </b:if>
  1173.         </b:includable>
  1174.         </b:widget>
  1175.       </b:section>
  1176.     <div class='clear'/>
  1177. <b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
  1178. </b:if>
  1179.   </header>
  1180.   <!-- header wrapper end -->
  1181.  
  1182.   <!-- desktop navigation menu start -->
  1183. <div class='mobile-hide'>
  1184. <nav class='navi' itemprop='mainEntity' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement'><ul>
  1185. <li><a class='sidebaramp' href='/'>Home</a></li>
  1186. <li><a class='sidebaramp' href='/p/contact.html'>contact</a></li>
  1187. </ul> <div class='mobile-hide'>
  1188. <div class='banner468-header'>
  1189. <div class='search-wrapper'>
  1190.             <div itemprop='mainEntity' itemscope='itemscope' itemtype='http://schema.org/WebSite'>
  1191. <form action='/search' id='searchform' itemprop='potentialAction' itemscope='itemscope' itemtype='http://schema.org/SearchAction' method='get' name='search' target='_blank'>
  1192. <input id='search-form' itemprop='query-input' name='q' placeholder='Search...' required='' type='text' value=''/>
  1193. <span class='search-button'/>
  1194. <input name='max-results' type='hidden' value='8'/>
  1195. </form>
  1196. </div>
  1197.   </div>  </div>    </div>
  1198. </nav>
  1199.     </div>
  1200.   <div class='clear'/>
  1201.   <!-- secondary navigation menu end -->
  1202.  
  1203.  
  1204.   <!-- wrapper start -->
  1205.   <div id='wrapper'>
  1206.  
  1207.     <!-- content wrapper start -->
  1208.     <div id='content-wrapper'>
  1209.  
  1210.       <!-- post wrapper start -->
  1211.       <b:if cond='data:blog.url == data:blog.homepageUrl'>
  1212.         <div class='nocard'>New Posts</div>
  1213.       </b:if>
  1214.       <div id='post-wrapper'>
  1215.         <b:section class='post-container' id='main' showaddelement='no'>
  1216.           <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog' version='1' visible='true'>
  1217.             <b:includable id='main' var='top'>
  1218.               <b:include data='posts' name='breadcrumb'/>
  1219.               <b:if cond='data:blog.url == data:blog.homepageUrl'>
  1220.               <!--
  1221.              <div class='banner-home-top'>
  1222.              [Your Ad Code Here]
  1223.              </div>
  1224.              -->
  1225.               </b:if>
  1226.               <b:if cond='data:mobile == &quot;false&quot;'>
  1227.  
  1228.                 <!-- posts -->
  1229.                 <div class='blog-posts hfeed'>
  1230.                   <b:include data='top' name='status-message'/>
  1231.                   <data:defaultAdStart/>
  1232.                   <b:loop values='data:posts' var='post'>
  1233.                     <b:if cond='data:post.isDateStart'>
  1234.                       <b:if cond='data:post.isFirstPost == &quot;false&quot;'>
  1235.                         &lt;/div&gt;&lt;/div&gt;
  1236.                       </b:if>
  1237.                     </b:if>
  1238.                     <b:if cond='data:post.isDateStart'>
  1239.                       &lt;div class=&quot;date-outer&quot;&gt;
  1240.                     </b:if>
  1241.                     <b:if cond='data:post.isDateStart'>
  1242.                       &lt;div class=&quot;date-posts&quot;&gt;
  1243.                     </b:if>
  1244.                     <div class='post-outer'>
  1245.                       <b:include data='post' name='post'/>
  1246.                       <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  1247.                         <b:include data='post' name='disqus-comments'/>
  1248.                       </b:if>
  1249.                       <b:if cond='data:blog.pageType == &quot;item&quot;'>
  1250.                         <b:include data='post' name='disqus-comments'/>
  1251.                       </b:if>
  1252.                     </div>
  1253.                     <b:if cond='data:post.includeAd'>
  1254.                       <b:if cond='data:post.isFirstPost'>
  1255.                         <data:defaultAdEnd/>
  1256.                       <b:else/>
  1257.                         <data:adEnd/>
  1258.                       </b:if>
  1259.                       <div class='inline-ad'>
  1260.                         <data:adCode/>
  1261.                       </div>
  1262.                       <data:adStart/>
  1263.                     </b:if>
  1264.                   </b:loop>
  1265.                   <b:if cond='data:numPosts != 0'>
  1266.                     &lt;/div&gt;&lt;/div&gt;
  1267.                   </b:if>
  1268.                   <data:adEnd/>
  1269.                 </div>
  1270.                 <!-- posts end -->
  1271.  
  1272.                 <b:if cond='data:blog.url == data:blog.homepageUrl'>
  1273.                 <!--
  1274.                <div class='banner-home-bottom'>
  1275.                [Your Ad Code Here]
  1276.                </div>
  1277.                -->
  1278.                 </b:if>
  1279.  
  1280.                 <!-- navigation -->
  1281.                 <b:include name='nextprev'/>
  1282.               <b:else/>
  1283.                 <b:include name='mobile-main'/>
  1284.               </b:if>
  1285.             </b:includable>
  1286.             <b:includable id='backlinkDeleteIcon' var='backlink'>
  1287.               <span expr:class='&quot;item-control &quot; + data:backlink.adminClass'>
  1288.                 <a expr:href='data:backlink.deleteUrl' expr:title='data:top.deleteBacklinkMsg'>
  1289.                   <img src='//www.blogger.com/img/icon_delete13.gif'/>
  1290.                 </a>
  1291.               </span>
  1292.             </b:includable>
  1293.             <b:includable id='backlinks' var='post'>
  1294.               <a id='links'/><h4><data:post.backlinksLabel/></h4>
  1295.               <b:if cond='data:post.numBacklinks != 0'>
  1296.                 <dl class='comments-block' id='comments-block'>
  1297.                   <b:loop values='data:post.backlinks' var='backlink'>
  1298.                     <div class='collapsed-backlink backlink-control'>
  1299.                       <dt class='comment-title'>
  1300.                         <span class='backlink-toggle-zippy'>&#160;</span>
  1301.                         <a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>
  1302.                         <b:include data='backlink' name='backlinkDeleteIcon'/>
  1303.                       </dt>
  1304.                       <dd class='comment-body collapseable'>
  1305.                         <data:backlink.snippet/>
  1306.                       </dd>
  1307.                       <dd class='comment-footer collapseable'>
  1308.                         <span class='comment-author'><data:post.authorLabel/> <data:backlink.author/></span>
  1309.                         <span class='comment-timestamp'><data:post.timestampLabel/> <data:backlink.timestamp/></span>
  1310.                       </dd>
  1311.                     </div>
  1312.                   </b:loop>
  1313.                 </dl>
  1314.               </b:if>
  1315.               <span class='comment-footer'>
  1316.                 <a class='comment-link' expr:href='data:post.createLinkUrl' expr:id='data:widget.instanceId + &quot;_backlinks-create-link&quot;' target='_blank'><data:post.createLinkLabel/></a>
  1317.               </span>
  1318.             </b:includable>
  1319.             <b:includable id='breadcrumb' var='posts'>
  1320.               <b:if cond='data:blog.homepageUrl != data:blog.url'>
  1321.                 <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  1322.                   <div class='breadcrumbs'>
  1323.                     <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> / <span><data:blog.pageName/></span>
  1324.                   </div>
  1325.                 <b:else/>
  1326.                   <b:if cond='data:blog.pageType == &quot;item&quot;'>
  1327.                     <b:loop values='data:posts' var='post'>
  1328.                       <b:if cond='data:post.labels'>
  1329.                         <div class='breadcrumbs'>
  1330.                           <span itemscope='' itemtype='https://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'>Home</span></a></span> / <b:loop values='data:post.labels' var='label'><span itemscope='' itemtype='https://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url + &quot;?&amp;max-results=5&quot;' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span><b:if cond='data:label.isLast != &quot;true&quot;'> / </b:if> </b:loop> / <span><data:post.title/></span>
  1331.                         </div>
  1332.                       <b:else/>
  1333.                         <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> / <span>Uncategories</span> / <span><data:post.title/></span></div>
  1334.                       </b:if>
  1335.                     </b:loop>
  1336.                   <b:else/>
  1337.                     <b:if cond='data:blog.pageType == &quot;archive&quot;'>
  1338.                       <div class='breadcrumbs'>
  1339.                         <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> / <span>Archive for <data:blog.pageName/></span>
  1340.                       </div>
  1341.                     <b:else/>
  1342.                       <b:if cond='data:blog.searchQuery'>
  1343.                         <div class='breadcrumbs'>
  1344.                           <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> / <span><data:blog.pageName/></span>
  1345.                         </div>
  1346.                       <b:else/>
  1347.                         <b:if cond='data:blog.pageType == &quot;index&quot;'>
  1348.                           <div class='breadcrumbs'>
  1349.                             <b:if cond='data:blog.pageName == &quot;&quot;'>
  1350.                               <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> / <span>All post</span>    
  1351.                             <b:else/>
  1352.                               <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> / <span><data:blog.pageName/></span>
  1353.                             </b:if>
  1354.                           </div>
  1355.                         </b:if>
  1356.                       </b:if>
  1357.                     </b:if>
  1358.                   </b:if>
  1359.                 </b:if>
  1360.               </b:if>
  1361.             </b:includable>
  1362.             <b:includable id='comment-form' var='post'>
  1363.               <div class='comment-form'>
  1364.                 <a id='comment-form'/>
  1365.                 <b:if cond='data:mobile'>
  1366.                   <h4 id='comment-post-message'>
  1367.                     <a expr:id='data:widget.instanceId + &quot;_comment-editor-toggle-link&quot;' href='javascript:void(0)'><data:postCommentMsg/></a>
  1368.                   </h4>
  1369.                   <div><p><data:blogCommentMessage/></p></div>
  1370.                   <data:blogTeamBlogMessage/>
  1371.                   <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
  1372.                   <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display:block' width='100%'/>
  1373.                 <b:else/>
  1374.                   <h4 id='comment-post-message'><data:postCommentMsg/></h4>
  1375.                   <div><p><data:blogCommentMessage/></p></div>
  1376.                   <data:blogTeamBlogMessage/>
  1377.                   <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
  1378.                   <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
  1379.                 </b:if>
  1380.                 <data:post.friendConnectJs/>
  1381.                 <data:post.cmtfpIframe/>
  1382.                 <script type='text/javascript'>
  1383.                   BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
  1384.                 </script>
  1385.               </div>
  1386.             </b:includable>
  1387.             <b:includable id='commentDeleteIcon' var='comment'>
  1388.               <span expr:class='&quot;item-control &quot; + data:comment.adminClass'>
  1389.                 <b:if cond='data:showCmtPopup'>
  1390.                   <div class='goog-toggle-button'>
  1391.                     <div class='goog-inline-block comment-action-icon'/>
  1392.                   </div>
  1393.                 <b:else/>
  1394.                   <a class='comment-delete' expr:href='data:comment.deleteUrl' expr:title='data:top.deleteCommentMsg'>
  1395.                     <img src='//www.blogger.com/img/icon_delete13.gif'/>
  1396.                   </a>
  1397.                 </b:if>
  1398.               </span>
  1399.             </b:includable>
  1400.             <b:includable id='comment_count_picker' var='post'>
  1401.               <b:if cond='data:post.commentSource == 1'>
  1402.                 <span class='cmt_count_iframe_holder' expr:data-count='data:post.numComments' expr:data-onclick='data:post.addCommentOnclick' expr:data-post-url='data:post.url' expr:data-url='data:post.canonicalUrl'/>
  1403.               <b:else/>
  1404.                 <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
  1405.                   <data:post.commentLabelFull/>:
  1406.                 </a>
  1407.               </b:if>
  1408.             </b:includable>
  1409.             <b:includable id='comment_picker' var='post'>
  1410.               <b:if cond='data:post.commentSource == 1'>
  1411.                 <b:include data='post' name='iframe_comments'/>
  1412.               <b:else/>
  1413.                 <b:if cond='data:post.showThreadedComments'>
  1414.                   <b:include data='post' name='threaded_comments'/>
  1415.                 <b:else/>
  1416.                   <b:include data='post' name='comments'/>
  1417.                 </b:if>
  1418.               </b:if>
  1419.             </b:includable>
  1420.             <b:includable id='comments' var='post'>
  1421.               <div class='comments' id='comments'>
  1422.                 <a id='comments'/>
  1423.                 <b:if cond='data:post.allowComments'>
  1424.                   <h3>
  1425.                     <b:if cond='data:post.numComments == 0'> 0 Response to <data:post.title/></b:if> <b:if cond='data:post.numComments == 1'> 1 Response to <data:post.title/></b:if> <b:if cond='data:post.numComments &gt; 1'> <data:post.numComments/> Responses to <data:post.title/></b:if>
  1426.                   </h3>
  1427.                   <b:if cond='data:post.commentPagingRequired'>
  1428.                     <span class='paging-control-container'>
  1429.                       <b:if cond='data:post.hasOlderLinks'>
  1430.                         <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
  1431.                         &#160;
  1432.                         <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
  1433.                         &#160;
  1434.                       </b:if>
  1435.                       <data:post.commentRangeText/>
  1436.                       <b:if cond='data:post.hasNewerLinks'>
  1437.                         &#160;
  1438.                         <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
  1439.                         &#160;
  1440.                         <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
  1441.                       </b:if>
  1442.                     </span>
  1443.                   </b:if>
  1444.                   <div expr:id='data:widget.instanceId + &quot;_comments-block-wrapper&quot;'>
  1445.                     <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
  1446.                       <b:loop values='data:post.comments' var='comment'>
  1447.                         <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
  1448.                           <b:if cond='data:comment.favicon'>
  1449.                             <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
  1450.                           </b:if>
  1451.                           <a expr:name='data:comment.anchorName'/>
  1452.                           <b:if cond='data:blog.enabledCommentProfileImages'>
  1453.                             <data:comment.authorAvatarImage/>
  1454.                           </b:if>
  1455.                           <b:if cond='data:comment.authorUrl'>
  1456.                             <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
  1457.                           <b:else/>
  1458.                             <data:comment.author/>
  1459.                           </b:if>
  1460.                           <data:commentPostedByMsg/>
  1461.                         </dt>
  1462.                         <dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
  1463.                           <b:if cond='data:comment.isDeleted'>
  1464.                             <span class='deleted-comment'><data:comment.body/></span>
  1465.                           <b:else/>
  1466.                             <p><data:comment.body/></p>
  1467.                           </b:if>
  1468.                         </dd>
  1469.                         <dd class='comment-footer'>
  1470.                           <span class='comment-timestamp'>
  1471.                             <a expr:href='data:comment.url' title='comment permalink'>
  1472.                               <data:comment.timestamp/>
  1473.                             </a>
  1474.                             <b:include data='comment' name='commentDeleteIcon'/>
  1475.                           </span>
  1476.                         </dd>
  1477.                       </b:loop>
  1478.                     </dl>
  1479.                   </div>
  1480.                   <b:if cond='data:post.commentPagingRequired'>
  1481.                     <span class='paging-control-container'>
  1482.                       <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'>
  1483.                         <data:post.oldestLinkText/>
  1484.                       </a>
  1485.                       <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'>
  1486.                         <data:post.olderLinkText/>
  1487.                       </a>
  1488.                       &#160;
  1489.                       <data:post.commentRangeText/>
  1490.                       &#160;
  1491.                       <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'>
  1492.                         <data:post.newerLinkText/>
  1493.                       </a>
  1494.                       <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'>
  1495.                         <data:post.newestLinkText/>
  1496.                       </a>
  1497.                     </span>
  1498.                   </b:if>
  1499.                   <span class='comment-footer'>
  1500.                     <b:if cond='data:post.embedCommentForm'>
  1501.                       <b:if cond='data:post.allowNewComments'>
  1502.                         <b:include data='post' name='comment-form'/>
  1503.                       <b:else/>
  1504.                         <data:post.noNewCommentsText/>
  1505.                       </b:if>
  1506.                     <b:else/>
  1507.                       <b:if cond='data:post.allowComments'>
  1508.                         <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
  1509.                       </b:if>
  1510.                     </b:if>
  1511.                   </span>
  1512.                 </b:if>
  1513.                 <b:if cond='data:showCmtPopup'>
  1514.                   <div id='comment-popup'>
  1515.                     <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'/>
  1516.                   </div>
  1517.                 </b:if>
  1518.                 <div id='backlinks-container'>
  1519.                   <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
  1520.                     <b:if cond='data:post.showBacklinks'>
  1521.                       <b:include data='post' name='backlinks'/>
  1522.                     </b:if>
  1523.                   </div>
  1524.                 </div>
  1525.               </div>
  1526.             </b:includable>
  1527.             <b:includable id='disqus-comments' var='post'>
  1528. <div class='disqus-comments' id='disqus_comments'>
  1529.     <amp-accordion>
  1530.         <section>
  1531.             <h4>
  1532.                 <span class='show-more'>Tambahkan Komentar</span>
  1533.                 <span class='show-less'>Sembunyikan</span>
  1534.             </h4>
  1535. <amp-iframe expr:src='&quot;https://cdn.rawgit.com/Iwan27/DroidBuzz/master/amp_disqus_buzz.html?shortname=droidbuzz-1&amp;fontBodyFamily=sans-serif&amp;fontLinkColor=e8554e&amp;canonicalurl=&quot; + data:blog.canonicalUrl + &quot;&amp;url=&quot; + data:blog.url + &quot;&amp;homepageurl=&quot; + data:blog.homepageUrl + &quot;&amp;canonicalhomepageurl=&quot; + data:blog.canonicalHomepageUrl' frameborder='0' height='333' layout='responsive' resizable='resizable' sandbox='allow-forms allow-scripts allow-same-origin allow-modals allow-popups' width='556'>
  1536. <div aria-label='Disqus Comments' overflow='' role='button' tabindex='0'/>
  1537. </amp-iframe>
  1538.         </section>
  1539.     </amp-accordion>
  1540. </div>
  1541. </b:includable>
  1542.             <b:includable id='feedLinks'>
  1543.               <b:if cond='data:blog.pageType != &quot;item&quot;'>
  1544.                 <b:if cond='data:feedLinks'>
  1545.                   <div class='blog-feeds'>
  1546.                     <b:include data='feedLinks' name='feedLinksBody'/>
  1547.                   </div>
  1548.                 </b:if>
  1549.               <b:else/>
  1550.                 <div class='post-feeds'>
  1551.                   <b:loop values='data:posts' var='post'>
  1552.                     <b:if cond='data:post.allowComments'>
  1553.                       <b:if cond='data:post.feedLinks'>
  1554.                         <b:include data='post.feedLinks' name='feedLinksBody'/>
  1555.                       </b:if>
  1556.                     </b:if>
  1557.                   </b:loop>
  1558.                 </div>
  1559.               </b:if>
  1560.             </b:includable>
  1561.             <b:includable id='feedLinksBody' var='links'>
  1562.               <div class='feed-links'>
  1563.                 <data:feedLinksMsg/>
  1564.                 <b:loop values='data:links' var='f'>
  1565.                   <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank' title='Feed'><data:f.name/> (<data:f.feedType/>)</a>
  1566.                 </b:loop>
  1567.               </div>
  1568.             </b:includable>
  1569.             <b:includable id='iframe_comments' var='post'>
  1570.               <b:if cond='data:post.allowIframeComments'>
  1571.                 <script expr:src='data:post.iframeCommentSrc' type='text/javascript'/>
  1572.                 <div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/>
  1573.                 <b:if cond='data:post.embedCommentForm == &quot;false&quot;'>
  1574.                   <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
  1575.                 </b:if>
  1576.               </b:if>
  1577.             </b:includable>
  1578.             <b:includable id='mobile-index-post' var='post'>
  1579.               <div class='mobile-date-outer date-outer'>
  1580.                 <div class='mobile-post-outer'>
  1581.                   <b:if cond='data:post.thumbnailUrl'>
  1582.                     <div class='mobile-index-thumbnail'>
  1583.                       <div class='Image'>
  1584.                         <img expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' expr:title='data:post.title'/>
  1585.                       </div>
  1586.                     </div>
  1587.                   <b:else/>
  1588.                     <div class='mobile-index-thumbnail'>
  1589.                       <div class='Image'>
  1590.                         <amp-img expr:alt='data:post.title' expr:title='data:post.title' src='https://1.bp.blogspot.com/-S-48Qj2e4MA/WARPpv1FhFI/AAAAAAAAWW8/h29qLNbeMoEhqDMptC88vF3jYItloympgCLcB/s1600/thumbnail.jpg'/>
  1591.                       </div>
  1592.                     </div>
  1593.                   </b:if>
  1594.                   <a expr:href='data:post.url'>
  1595.                     <h3 class='mobile-index-title entry-title' itemprop='name'><data:post.title/></h3>
  1596.                   </a>
  1597.                   <div class='mobile-index-contents'>
  1598.                     <div class='post-body'>
  1599.                       <b:if cond='data:post.snippet'>
  1600.                         <data:post.snippet/>
  1601.                       </b:if>
  1602.                     </div>
  1603.                   </div>
  1604.                   <div class='clear'/>
  1605.                 </div>
  1606.               </div>
  1607.             </b:includable>
  1608.             <b:includable id='mobile-main' var='top'>
  1609.               <div class='blog-posts hfeed'>
  1610.                 <b:include data='top' name='status-message'/>
  1611.                 <b:if cond='data:blog.pageType == &quot;index&quot;'>
  1612.                   <b:loop values='data:posts' var='post'>
  1613.                     <b:include data='post' name='mobile-index-post'/>
  1614.                   </b:loop>
  1615.                 <b:else/>
  1616.                   <b:loop values='data:posts' var='post'>
  1617.                     <b:include data='post' name='mobile-post'/>
  1618.                   </b:loop>
  1619.                 </b:if>
  1620.               </div>
  1621.               <b:include name='mobile-nextprev'/>
  1622.             </b:includable>
  1623.             <b:includable id='mobile-nextprev'>
  1624.               <div class='blog-pager' id='blog-pager'>
  1625.                 <b:if cond='data:newerPageUrl'>
  1626.                   <div class='mobile-link-button' id='blog-pager-newer-link'>
  1627.                     <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'>&amp;lsaquo;</a>
  1628.                   </div>
  1629.                 </b:if>
  1630.                 <b:if cond='data:olderPageUrl'>
  1631.                   <div class='mobile-link-button' id='blog-pager-older-link'>
  1632.                     <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>&amp;rsaquo;</a>
  1633.                   </div>
  1634.                 </b:if>
  1635.                 <div class='mobile-link-button' id='blog-pager-home-link'>
  1636.                   <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
  1637.                 </div>
  1638.                 <div class='mobile-desktop-link'>
  1639.                   <a class='home-link' expr:href='data:desktopLinkUrl'><data:desktopLinkMsg/></a>
  1640.                 </div>
  1641.               </div>
  1642.               <div class='clear'/>
  1643.             </b:includable>
  1644.             <b:includable id='mobile-post' var='post'>
  1645.               <div class='date-outer'>
  1646.                 <div class='date-posts'>
  1647.                   <div class='post-outer'>
  1648.                     <div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>
  1649.                       <b:if cond='data:post.thumbnailUrl'>
  1650.                         <meta expr:content='data:post.thumbnailUrl' itemprop='image_url'/>
  1651.                       </b:if>
  1652.                       <meta expr:content='data:blog.blogId' itemprop='blogId'/>
  1653.                       <meta expr:content='data:post.id' itemprop='postId'/>
  1654.                       <a expr:name='data:post.id'/>
  1655.                       <b:if cond='data:post.title'>
  1656.                         <h3 class='post-title entry-title' itemprop='name'>
  1657.                           <b:if cond='data:post.link'>
  1658.                             <a expr:href='data:post.link'><data:post.title/></a>
  1659.                           <b:else/>
  1660.                             <b:if cond='data:post.url'>
  1661.                               <b:if cond='data:blog.url != data:post.url'>
  1662.                                 <a expr:href='data:post.url'><data:post.title/></a>
  1663.                               <b:else/>
  1664.                                 <data:post.title/>
  1665.                               </b:if>
  1666.                             <b:else/>
  1667.                               <data:post.title/>
  1668.                             </b:if>
  1669.                           </b:if>
  1670.                         </h3>
  1671.                       </b:if>
  1672.                       <div class='post-header'>
  1673.                         <div class='post-header-line-1'/>
  1674.                       </div>
  1675.                       <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>  
  1676.                         <data:post.body/>
  1677.                         <div class='clear'/>
  1678.                       </div>
  1679.                       <div class='post-footer'>
  1680.                         <div class='post-footer-line post-footer-line-1'>
  1681.                           <span class='post-author vcard'>
  1682.                             <b:if cond='data:top.showAuthor'>
  1683.                               <b:if cond='data:post.authorProfileUrl'>
  1684.                                 <span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>
  1685.                                   <meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
  1686.                                   <a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
  1687.                                     <span itemprop='name'><data:post.author/></span>
  1688.                                   </a>
  1689.                                 </span>
  1690.                               <b:else/>
  1691.                                 <span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>
  1692.                                   <span itemprop='name'><data:post.author/></span>
  1693.                                 </span>
  1694.                               </b:if>
  1695.                             </b:if>
  1696.                           </span>
  1697.                           <span class='post-timestamp'>
  1698.                             <b:if cond='data:top.showTimestamp'>
  1699.                               <data:top.timestampLabel/>
  1700.                               <b:if cond='data:post.url'>
  1701.                                 <meta expr:content='data:post.canonicalUrl' itemprop='url'/>
  1702.                                 <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></a>
  1703.                               </b:if>
  1704.                             </b:if>
  1705.                           </span>
  1706.                           <span class='post-comment-link'>
  1707.                             <b:if cond='data:blog.pageType != &quot;item&quot;'>
  1708.                               <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
  1709.                                 <b:if cond='data:post.allowComments'>
  1710.                                   <b:include data='post' name='comment_count_picker'/>
  1711.                                 </b:if>
  1712.                               </b:if>
  1713.                             </b:if>
  1714.                           </span>
  1715.                         </div>
  1716.                         <div class='post-footer-line post-footer-line-2'>
  1717.                           <b:if cond='data:top.showMobileShare'>
  1718.                             <div class='mobile-link-button goog-inline-block' id='mobile-share-button'>
  1719.                               <a href='javascript:void(0);'><data:shareMsg/></a>
  1720.                             </div>
  1721.                           </b:if>
  1722.                           <b:if cond='data:top.showDummy'>
  1723.                             <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
  1724.                           </b:if>
  1725.                         </div>
  1726.                       </div>
  1727.                     </div>
  1728.                     <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  1729.                       <b:include data='post' name='comment_picker'/>
  1730.                     </b:if>
  1731.                     <b:if cond='data:blog.pageType == &quot;item&quot;'>
  1732.                       <b:include data='post' name='comment_picker'/>
  1733.                     </b:if>
  1734.                   </div>
  1735.                 </div>
  1736.               </div>
  1737.             </b:includable>
  1738.             <b:includable id='nextprev'>
  1739.               <div class='blog-pager' id='blog-pager'>
  1740.                 <b:if cond='data:newerPageUrl'>
  1741.                   <span id='blog-pager-newer-link'>
  1742.                     <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
  1743.                   </span>
  1744.                 </b:if>
  1745.                 <b:if cond='data:olderPageUrl'>
  1746.                   <span id='blog-pager-older-link'>
  1747.                     <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
  1748.                   </span>
  1749.                 </b:if>
  1750.                 <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
  1751.                 <b:if cond='data:mobileLinkUrl'>
  1752.                   <div class='blog-mobile-link'>
  1753.                     <a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
  1754.                   </div>
  1755.                 </b:if>
  1756.               </div>
  1757.               <div class='clear'/>
  1758.             </b:includable>
  1759.             <b:includable id='post' var='post'>
  1760.               <article class='post hentry'>
  1761.               <b:switch var='data:blog.pageType'>
  1762.                 <b:case value='static_page'/>
  1763.                   <b:if cond='data:post.title'>
  1764.                     <h1 class='post-title entry-title'>
  1765.                       <b:if cond='data:post.link'>
  1766.                         <a expr:href='data:post.link'><data:post.title/></a>
  1767.                       <b:else/>
  1768.                         <b:if cond='data:post.url'>
  1769.                           <b:if cond='data:blog.url != data:post.url'>
  1770.                             <a expr:href='data:post.url'><data:post.title/></a>
  1771.                           <b:else/>
  1772.                             <data:post.title/>
  1773.                           </b:if>
  1774.                         <b:else/>
  1775.                           <data:post.title/>
  1776.                         </b:if>
  1777.                       </b:if>
  1778.                     </h1>
  1779.                   </b:if>
  1780.                   <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'>
  1781.                     <data:post.body/>
  1782.                     <div class='clear'/>
  1783.                   </div>
  1784.                 <b:case value='item'/>
  1785.                   <div itemprop='blogPost' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>
  1786.                     <b:if cond='data:post.firstImageUrl'>
  1787.                       <meta expr:content='data:post.firstImageUrl' itemprop='image'/>
  1788.                     </b:if>
  1789.                     <b:if cond='data:post.title'>
  1790.                       <h1 class='post-title entry-title' itemprop='name headline'>
  1791.                         <b:if cond='data:post.link'>
  1792.                           <a expr:href='data:post.link'><data:post.title/></a>
  1793.                         <b:else/>
  1794.                           <b:if cond='data:post.url'>
  1795.                             <b:if cond='data:blog.url != data:post.url'>
  1796.                               <a expr:href='data:post.url'><data:post.title/></a>
  1797.                             <b:else/>
  1798.                               <data:post.title/>
  1799.                             </b:if>
  1800.                           <b:else/>
  1801.                             <data:post.title/>
  1802.                           </b:if>
  1803.                         </b:if>
  1804.                       </h1>
  1805.                     </b:if>
  1806. <!-- Gambar Diatas Posting Start -->
  1807.  
  1808.  
  1809. <b:if cond='data:post.firstImageUrl'>
  1810.     <div itemType='https://schema.org/WebPage' itemprop='mainEntityOfPage' itemscope='itemscope'/>
  1811.     <div itemprop='image' itemscope='itemscope' itemtype='https://schema.org/ImageObject'>
  1812.         <meta expr:content='data:post.snippet' property='twitter:description'/>
  1813.         <meta expr:content='data:post.firstImageUrl' itemprop='url'/>
  1814.         <meta content='auto' itemprop='width'/>
  1815.         <meta content='auto' itemprop='height'/>
  1816.     </div>
  1817.     <div itemprop='publisher' itemscope='itemscope' itemtype='https://schema.org/Organization'>
  1818.         <div itemprop='logo' itemscope='itemscope' itemtype='https://schema.org/ImageObject'>
  1819.             <meta expr:content='data:post.thumbnailUrl' itemprop='url'/>
  1820.             <meta content='auto' itemprop='width'/>
  1821.             <meta content='auto' itemprop='height'/>
  1822.         </div>
  1823.         <meta expr:content='data:blog.title' itemprop='name'/>
  1824.     </div>
  1825.     <b:else/>
  1826. </b:if>
  1827. <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
  1828.     <b:if cond='data:blog.pageType != &quot;item&quot;'>
  1829.         <b:if cond='data:post.firstImageUrl'>
  1830.             <a expr:href='data:post.url'>
  1831.                 <amp-img alt='thumbnail' expr:src='resizeImage(data:post.firstImageUrl,556)' height='343' layout='responsive' width='556'/>
  1832.             </a>
  1833.             <b:else/>
  1834.             <a expr:href='data:post.url'>
  1835.                 <amp-img alt='thumbnail' height='333' layout='responsive' src='https://2.bp.blogspot.com/-ex3V86fj4dQ/UrCQQa4cLsI/AAAAAAAAFdA/j2FCTmGOrog/s556/no-thumbnail.png' width='556'/>
  1836.             </a>
  1837.         </b:if>
  1838.     </b:if>
  1839. </b:if>
  1840.  
  1841. <b:if cond='data:blog.pageType == &quot;item&quot;'>
  1842.     <div class='image-wrapper'>
  1843.         <div class='post-firstimage'>
  1844.             <b:if cond='data:blog.postImageUrl'>
  1845.                 <div class='firstimage'>
  1846.                     <amp-img expr:alt='data:post.title' expr:src='resizeImage(data:post.firstImageUrl,556)' expr:title='data:post.title' height='333' layout='responsive' width='556'/>
  1847.                 </div>
  1848.                 <b:else/>
  1849.                 <div class='firstimage'>
  1850.                     <amp-img expr:alt='data:post.title' height='333' layout='responsive' src='https://2.bp.blogspot.com/-ex3V86fj4dQ/UrCQQa4cLsI/AAAAAAAAFdA/j2FCTmGOrog/s556/no-thumbnail.png' width='556'/>
  1851.                 </div>
  1852.             </b:if>
  1853.         </div>
  1854.     </div>
  1855. </b:if>
  1856.  
  1857. <!-- Gambar Diatas Posting End -->
  1858.                     <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='description articleBody'>
  1859.                       <!--
  1860.                      <div class='banner-post-top'>
  1861.                      [Your Ad Code Here]
  1862.                      </div>
  1863.                      -->
  1864.                       <data:post.body/>
  1865.                       <!--
  1866.                      <div class='banner-post-bottom'>
  1867.                      [Your Ad Code Here]
  1868.                      </div>
  1869.                      -->
  1870.                       <div class='post-label-block'>
  1871.                         <b:if cond='data:top.showAuthor'>
  1872.                           <b:if cond='data:post.authorProfileUrl'>
  1873.                             <span class='author-info'>
  1874.                               <span class='vcard'>
  1875.                                 <span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>
  1876.                                   <meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
  1877.                                   <a class='g-profile profile-block' expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
  1878.                                     <svg class='vertical-align:text-top;margin-right:5px' height='14' viewBox='0 0 18 18' width='14'><path d='M9 1C4.58 1 1 4.58 1 9s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8zm0 2.75c1.24 0 2.25 1.01 2.25 2.25S10.24 8.25 9 8.25 6.75 7.24 6.75 6 7.76 3.75 9 3.75zM9 14.5c-1.86 0-3.49-.92-4.49-2.33C4.62 10.72 7.53 10 9 10c1.47 0 4.38.72 4.49 2.17-1 1.41-2.63 2.33-4.49 2.33z' fill='#9E9E9E'/></svg><span itemprop='name'><data:post.author/></span>
  1879.                                   </a>
  1880.                                 </span>
  1881.                               </span>
  1882.                             </span>
  1883.                           </b:if>
  1884.                         </b:if>
  1885.                         <b:if cond='data:post.dateHeader'>
  1886.                           <span class='date-block'><abbr class='updated published' expr:title='data:post.timestampISO8601' itemprop='datePublished;'><data:post.dateHeader/></abbr></span>
  1887.                         <b:else/>
  1888.                           <b:if cond='data:top.showTimestamp'>
  1889.                             <span class='date-block'><abbr class='updated published' expr:title='data:post.timestampISO8601' itemprop='datePublished;'><data:post.timestamp/></abbr></span>
  1890.                           </b:if>
  1891.                         </b:if>
  1892.                         <b:if cond='data:post.labels'>
  1893.                           <span class='label'>
  1894.                             <b:loop values='data:post.labels' var='label'>
  1895.                               <a class='label-block' expr:href='data:label.url' expr:title='data:label.name' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'/>
  1896.                             </b:loop>
  1897.                           </span>
  1898.                         </b:if>
  1899.  
  1900. <div class='share-buzz'>
  1901.     <h4>SHARE</h4>
  1902.     <b:include data='post' name='share-tool'/>
  1903. </div>
  1904. <div class='clear'/>
  1905.  
  1906. <!-- Author Info dan Sosial Media Start -->
  1907. <!-- Author Info dan Sosial Media End -->
  1908.  <div class='clear'/>
  1909.  
  1910. <amp-iframe expr:src='&quot;https://cdn.rawgit.com/kangismet/ki-html/master/random-posts2.html?url=&quot; + data:blog.homepageUrl' frameborder='0' height='320' layout='responsive' resizable='resizable' sandbox='allow-scripts allow-same-origin allow-modals allow-popups' width='600'>
  1911. <div aria-label='Related Posts' overflow='' role='button' tabindex='0'>Related Posts</div>
  1912. </amp-iframe>
  1913. <div class='clear'/>
  1914.  
  1915.                       </div>
  1916.                       <div class='clear'/>
  1917.                     </div>
  1918.                   </div>
  1919.                 <b:default/>
  1920.                   <b:if cond='data:post.thumbnailUrl'>
  1921.                     <a expr:href='data:post.url' expr:title='data:post.title'>
  1922. <div class='img-thumbnail'><amp-img expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' expr:title='data:post.title' height='70' width='70'/></div></a>
  1923.                   <b:else/>
  1924.                     <b:if cond='data:post.firstImageUrl'>
  1925.                       <a expr:href='data:post.url' expr:title='data:post.title'>
  1926. <div class='img-thumbnail'>
  1927. <amp-img expr:alt='data:post.title' expr:src='data:post.firstImageUrl' expr:title='data:post.title' height='70' width='70'/></div></a>
  1928.                     <b:else/>
  1929.                       <a expr:href='data:post.url' expr:title='data:post.title'>
  1930. <div class='img-thumbnail'>
  1931. <amp-img expr:alt='data:post.title' expr:title='data:post.title' height='70' src='https://1.bp.blogspot.com/-S-48Qj2e4MA/WARPpv1FhFI/AAAAAAAAWW8/h29qLNbeMoEhqDMptC88vF3jYItloympgCLcB/s1600/thumbnail.jpg' width='70'/></div></a>
  1932.                     </b:if>
  1933.                   </b:if>
  1934.                   <div class='post-box' itemprop='blogPost' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>
  1935.                     <b:if cond='data:post.firstImageUrl'>
  1936.                       <meta expr:content='data:post.firstImageUrl' itemprop='image'/>
  1937.                     </b:if>
  1938.                     <b:if cond='data:post.title'>
  1939.                       <h2 class='post-title entry-title' itemprop='name headline'>
  1940.                         <b:if cond='data:post.link'>
  1941.                           <a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
  1942.                         <b:else/>
  1943.                           <b:if cond='data:post.url'>
  1944.                             <b:if cond='data:blog.url != data:post.url'>
  1945.                               <a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
  1946.                             <b:else/>
  1947.                               <data:post.title/>
  1948.                             </b:if>
  1949.                           <b:else/>
  1950.                             <data:post.title/>
  1951.                           </b:if>
  1952.                         </b:if>
  1953.                       </h2>
  1954.                     </b:if>
  1955.                     <div class='post-snippet' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody description'>
  1956.                       <div expr:id='&quot;summary&quot; + data:post.id'>
  1957.                         <data:post.snippet/>
  1958.                       </div>   
  1959.                     </div>
  1960.                     <div class='post-label-block'>
  1961.                       <b:if cond='data:top.showAuthor'>
  1962.                         <b:if cond='data:post.authorProfileUrl'>
  1963.                           <span class='author-info'>
  1964.                             <span class='vcard'>
  1965.                               <span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>
  1966.                                 <meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
  1967.                                 <a class='g-profile profile-block' expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
  1968.                                   <svg class='vertical-align:text-top;margin-right:5px' height='14' viewBox='0 0 18 18' width='14'><path d='M9 1C4.58 1 1 4.58 1 9s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8zm0 2.75c1.24 0 2.25 1.01 2.25 2.25S10.24 8.25 9 8.25 6.75 7.24 6.75 6 7.76 3.75 9 3.75zM9 14.5c-1.86 0-3.49-.92-4.49-2.33C4.62 10.72 7.53 10 9 10c1.47 0 4.38.72 4.49 2.17-1 1.41-2.63 2.33-4.49 2.33z' fill='#9E9E9E'/></svg><span itemprop='name'><data:post.author/></span>
  1969.                                 </a>
  1970.                               </span>
  1971.                             </span>
  1972.                           </span>
  1973.                         </b:if>
  1974.                       </b:if>
  1975.                       <b:if cond='data:post.dateHeader'>
  1976.                         <span class='date-block'><abbr class='updated published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.dateHeader/></abbr></span>
  1977.                       <b:else/>
  1978.                         <b:if cond='data:top.showTimestamp'>
  1979.                           <span class='date-block'><abbr class='updated published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></span>
  1980.                         </b:if>
  1981.                       </b:if>
  1982.                       <b:if cond='data:post.labels'>
  1983.                         <span class='label'>
  1984.                           <b:loop values='data:post.labels' var='label'>
  1985.                             <a class='label-block' expr:href='data:label.url' expr:title='data:label.name' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'/>
  1986.                           </b:loop>
  1987.                         </span>
  1988.                       </b:if>
  1989.                     </div>
  1990.                   </div>  
  1991.                 </b:switch>
  1992.               </article>
  1993.  
  1994.             </b:includable>
  1995.             <b:includable id='postQuickEdit' var='post'>
  1996.               <b:if cond='data:post.editUrl'>
  1997.                 <span expr:class='&quot;item-control &quot; + data:post.adminClass'>
  1998.                   <a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
  1999.                     <img alt='' class='icon-action' height='18' src='https://img2.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
  2000.                   </a>
  2001.                 </span>
  2002.               </b:if>
  2003.             </b:includable>
  2004.             <b:includable id='share-tool' var='post'>
  2005. <div>
  2006.     <amp-social-share height='28' type='twitter' width='28'/>
  2007.     <amp-social-share height='28' type='gplus' width='28'/>
  2008.     <amp-social-share data-param-app_id='145634995501895' height='28' type='facebook' width='28'/>
  2009.     <amp-social-share height='28' type='pinterest' width='28'/>
  2010.     <amp-social-share height='28' type='linkedin' width='28'/>
  2011. <b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;true&quot;'>
  2012. </b:if>
  2013. </div>
  2014. <div class='clear'/>
  2015. </b:includable>
  2016.             <b:includable id='shareButtons' var='post'>
  2017.   <b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'><span class='share-button-link-text'><data:top.emailThisMsg/></span></a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + &quot;&amp;target=blog&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=270,width=475\&quot;); return false;&quot;' expr:title='data:top.blogThisMsg' target='_blank'><span class='share-button-link-text'><data:top.blogThisMsg/></span></a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' expr:title='data:top.shareToTwitterMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a></b:if><b:if cond='data:top.showPinterestButton'><a class='goog-inline-block share-button sb-pinterest' expr:href='data:post.sharePostUrl + &quot;&amp;target=pinterest&quot;' expr:title='data:top.shareToPinterestMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToPinterestMsg/></span></a></b:if><b:if cond='data:top.showPlusOne'><div class='goog-inline-block google-plus-share-container'><data:post.googlePlusShareTag/></div></b:if>
  2018. </b:includable>
  2019.             <b:includable id='status-message'>
  2020.               <b:if cond='data:navMessage'>
  2021.                 <div class='status-msg-wrap'>
  2022.                   <div class='status-msg-body'>
  2023.                     <data:navMessage/>
  2024.                   </div>
  2025.                   <div class='status-msg-border'>
  2026.                     <div class='status-msg-bg'>
  2027.                       <div class='status-msg-hidden'>
  2028.                         <data:navMessage/>
  2029.                       </div>
  2030.                     </div>
  2031.                   </div>
  2032.                 </div>
  2033.                 <div class='clear'/>
  2034.               </b:if>
  2035.             </b:includable>
  2036.             <b:includable id='threaded-comment-form' var='post'>
  2037.               <div class='comment-form'>
  2038.                 <a id='comment-form'/>
  2039.                 <b:if cond='data:mobile'>
  2040.                   <div><p><data:blogCommentMessage/></p></div>
  2041.                   <data:blogTeamBlogMessage/>
  2042.                   <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
  2043.                   <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display:block' width='100%'/>
  2044.                 <b:else/>
  2045.                   <div><p><data:blogCommentMessage/></p></div>
  2046.                   <data:blogTeamBlogMessage/>
  2047.                   <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
  2048.                   <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
  2049.                 </b:if>
  2050.                 <data:post.friendConnectJs/>
  2051.                 <data:post.cmtfpIframe/>
  2052.                 <script type='text/javascript'>
  2053.                   BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
  2054.                 </script>
  2055.               </div>
  2056.             </b:includable>
  2057.             <b:includable id='threaded_comment_js' var='post'>
  2058.               <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
  2059.               <script type='text/javascript'>
  2060.                 (function() {
  2061.                 var items = <data:post.commentJso/>;
  2062.                 var msgs = <data:post.commentMsgs/>;
  2063.                 var config = <data:post.commentConfig/>;
  2064.  
  2065.                 // <![CDATA[
  2066.                var cursor = null;
  2067.                if (items && items.length > 0) {
  2068.                cursor = parseInt(items[items.length - 1].timestamp) + 1;
  2069.                }
  2070.  
  2071.                var bodyFromEntry = function(entry) {
  2072.                if (entry.gd$extendedProperty) {
  2073.                for (var k in entry.gd$extendedProperty) {
  2074.                if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
  2075.                return '<span class="deleted-comment">' + entry.content.$t + '</span>';
  2076.                }
  2077.                }
  2078.                }
  2079.                return entry.content.$t;
  2080.                }
  2081.  
  2082.                var parse = function(data) {
  2083.                cursor = null;
  2084.                var comments = [];
  2085.                if (data && data.feed && data.feed.entry) {
  2086.                for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
  2087.                var comment = {};
  2088.                // comment ID, parsed out of the original id format
  2089.                var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
  2090.                comment.id = id ? id[2] : null;
  2091.                comment.body = bodyFromEntry(entry);
  2092.                comment.timestamp = Date.parse(entry.published.$t) + '';
  2093.                if (entry.author && entry.author.constructor === Array) {
  2094.                var auth = entry.author[0];
  2095.                if (auth) {
  2096.                comment.author = {
  2097.                name: (auth.name ? auth.name.$t : undefined),
  2098.                profileUrl: (auth.uri ? auth.uri.$t : undefined),
  2099.                avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
  2100.                };
  2101.                }
  2102.                }
  2103.                if (entry.link) {
  2104.                if (entry.link[2]) {
  2105.                comment.link = comment.permalink = entry.link[2].href;
  2106.                }
  2107.                if (entry.link[3]) {
  2108.                var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
  2109.                if (pid && pid[1]) {
  2110.                comment.parentId = pid[1];
  2111.                }
  2112.                }
  2113.                }
  2114.                comment.deleteclass = 'item-control blog-admin';
  2115.                if (entry.gd$extendedProperty) {
  2116.                for (var k in entry.gd$extendedProperty) {
  2117.                if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
  2118.                comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
  2119.                } else if (entry.gd$extendedProperty[k].name == 'blogger.displayTime') {
  2120.                comment.displayTime = entry.gd$extendedProperty[k].value;
  2121.                }
  2122.                }
  2123.                }
  2124.                comments.push(comment);
  2125.                }
  2126.                }
  2127.                return comments;
  2128.                };
  2129.  
  2130.                var paginator = function(callback) {
  2131.                if (hasMore()) {
  2132.                var url = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=80';
  2133.                if (cursor) {
  2134.                url += '&published-min=' + new Date(cursor).toISOString();
  2135.                }
  2136.                window.bloggercomments = function(data) {
  2137.                var parsed = parse(data);
  2138.                cursor = parsed.length < 50 ? null
  2139.                : parseInt(parsed[parsed.length - 1].timestamp) + 1
  2140.                callback(parsed);
  2141.                window.bloggercomments = null;
  2142.                }
  2143.                url += '&callback=bloggercomments';
  2144.                var script = document.createElement('script');
  2145.                script.type = 'text/javascript';
  2146.                script.src = url;
  2147.                document.getElementsByTagName('head')[0].appendChild(script);
  2148.                }
  2149.                };
  2150.  
  2151.                var hasMore = function() {
  2152.                return !!cursor;
  2153.                };
  2154.  
  2155.                var getMeta = function(key, comment) {
  2156.                if ('iswriter' == key) {
  2157.                var matches = !!comment.author
  2158.                && comment.author.name == config.authorName
  2159.                && comment.author.profileUrl == config.authorUrl;
  2160.                return matches ? 'true' : '';
  2161.                } else if ('deletelink' == key) {
  2162.                return config.baseUri + '/delete-comment.g?blogID='
  2163.                + config.blogId + '&postID=' + comment.id;
  2164.                } else if ('deleteclass' == key) {
  2165.                return comment.deleteclass;
  2166.                }
  2167.                return '';
  2168.                };
  2169.  
  2170.                var replybox = null;
  2171.                var replyUrlParts = null;
  2172.                var replyParent = undefined;
  2173.  
  2174.                var onReply = function(commentId, domId) {
  2175.                if (replybox == null) {
  2176.                // lazily cache replybox, and adjust to suit this style:
  2177.                replybox = document.getElementById('comment-editor');
  2178.                if (replybox != null) {
  2179.                replybox.height = '250px';
  2180.                replybox.style.display = 'block';
  2181.                replyUrlParts = replybox.src.split('#');
  2182.                }
  2183.                }
  2184.                if (replybox && (commentId !== replyParent)) {
  2185.                document.getElementById(domId).insertBefore(replybox.parentNode, null);
  2186.                replybox.src = replyUrlParts[0]
  2187.                + (commentId ? '&parentID=' + commentId : '')
  2188.                + '#' + replyUrlParts[1];
  2189.                replyParent = commentId;
  2190.                }
  2191.                };
  2192.  
  2193.                var hash = (window.location.hash || '#').substring(1);
  2194.                var startThread, targetComment;
  2195.                if (/^comment-form_/.test(hash)) {
  2196.                startThread = hash.substring('comment-form_'.length);
  2197.                } else if (/^c[0-9]+$/.test(hash)) {
  2198.                targetComment = hash.substring(1);
  2199.                }
  2200.  
  2201.                // Configure commenting API:
  2202.                var configJso = {
  2203.                'maxDepth': config.maxThreadDepth
  2204.                };
  2205.  
  2206.                var provider = {
  2207.                'id': config.postId,
  2208.                'data': items,
  2209.                'loadNext': paginator,
  2210.                'hasMore': hasMore,
  2211.                'getMeta': getMeta,
  2212.                'onReply': onReply,
  2213.                'rendered': true,
  2214.                'initComment': targetComment,
  2215.                'initReplyThread': startThread,
  2216.                'config': configJso,
  2217.                'messages': msgs
  2218.                };
  2219.  
  2220.                var render = function() {
  2221.                if (window.goog && window.goog.comments) {
  2222.                var holder = document.getElementById('comment-holder');
  2223.                window.goog.comments.render(holder, provider);
  2224.                }
  2225.                };
  2226.  
  2227.                // render now, or queue to render when library loads:
  2228.                if (window.goog && window.goog.comments) {
  2229.                render();
  2230.                } else {
  2231.                window.goog = window.goog || {};
  2232.                window.goog.comments = window.goog.comments || {};
  2233.                window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
  2234.                window.goog.comments.loadQueue.push(render);
  2235.                }
  2236.                })();
  2237.                // ]]>
  2238.               </script>
  2239.             </b:includable>
  2240.             <b:includable id='threaded_comments' var='post'>
  2241.               <div class='comments' id='comments'>
  2242.                 <a id='comments'/>
  2243.                 <h3><b:if cond='data:post.numComments == 0'> 0 Response to <data:post.title/></b:if> <b:if cond='data:post.numComments == 1'> 1 Response to <data:post.title/></b:if><b:if cond='data:post.numComments &gt; 1'> <data:post.numComments/> Responses to <data:post.title/></b:if></h3>
  2244.                 <div class='comments-content'>
  2245.                   <b:if cond='data:post.embedCommentForm'>
  2246.                     <b:include data='post' name='threaded_comment_js'/>
  2247.                   </b:if>
  2248.                   <div id='comment-holder'>
  2249.                     <data:post.commentHtml/>
  2250.                   </div>
  2251.                 </div>
  2252.                 <p class='comment-footer'>
  2253.                   <b:if cond='data:post.allowNewComments'>
  2254.                     <b:include data='post' name='threaded-comment-form'/>
  2255.                   <b:else/>
  2256.                     <data:post.noNewCommentsText/>
  2257.                   </b:if>
  2258.                 </p>
  2259.                 <b:if cond='data:showCmtPopup'>
  2260.                   <div id='comment-popup'>
  2261.                     <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'/>
  2262.                   </div>
  2263.                 </b:if>
  2264.                 <div id='backlinks-container'>
  2265.                   <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
  2266.                     <b:if cond='data:post.showBacklinks'>
  2267.                       <b:include data='post' name='backlinks'/>
  2268.                     </b:if>
  2269.                   </div>
  2270.                 </div>
  2271.               </div>
  2272.             </b:includable>
  2273.           </b:widget>
  2274.         </b:section>
  2275.       </div>
  2276.       <!-- post wrapper end -->
  2277.  
  2278.       <!-- sidebar wrapper start -->
  2279.       <aside id='sidebar-wrapper'>
  2280.         <div class='sidebar-container'>
  2281.           <!--
  2282.          <div class='banner-sidebar'>
  2283.          [Your Ad Code Here]
  2284.          </div>
  2285.          -->
  2286.           <b:section class='sidebar' id='sidebar' preferred='yes'>
  2287.             <b:widget id='PopularPosts1' locked='false' mobile='yes' title='Entri Populer' type='PopularPosts' version='1' visible='true'>
  2288.               <b:includable id='main'>
  2289.   <b:if cond='data:title != &quot;&quot;'><h2><data:title/></h2></b:if>
  2290.   <div class='widget-content popular-posts'>
  2291.     <ul>
  2292.       <b:loop values='data:posts' var='post'>
  2293.       <li>
  2294.         <b:if cond='!data:showThumbnails'>
  2295.           <b:if cond='!data:showSnippets'>
  2296.             <!-- (1) No snippet/thumbnail -->
  2297.             <a expr:href='data:post.href'><data:post.title/></a>
  2298.           <b:else/>
  2299.             <!-- (2) Show only snippets -->
  2300.             <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
  2301.             <div class='item-snippet'><data:post.snippet/></div>
  2302.           </b:if>
  2303.         <b:else/>
  2304.           <!-- (3) Show only thumbnails or (4) Snippets and thumbnails. -->
  2305.           <div expr:class='data:showSnippets ? &quot;item-content&quot; : &quot;item-thumbnail-only&quot;'>
  2306.             <b:if cond='data:post.featuredImage.isResizable or data:post.thumbnail'>
  2307.               <div class='item-thumbnail'>
  2308.                 <a expr:href='data:post.href' target='_blank'>
  2309.                   <b:with value='data:post.featuredImage.isResizable? resizeImage(data:post.featuredImage, 160) : data:post.thumbnail' var='image'>
  2310.                     <amp-img expr:alt='data:post.title' expr:src='data:image' expr:title='data:post.title' height='100' width='160'/>
  2311.                   </b:with>
  2312.                 </a>
  2313.               </div>
  2314.               <b:else/>
  2315.               <div class='item-thumbnail'>
  2316.                 <a expr:href='data:post.href' target='_blank'>
  2317.               <amp-img expr:alt='data:post.title' expr:title='data:post.title' height='200' src='//2.bp.blogspot.com/-ex3V86fj4dQ/UrCQQa4cLsI/AAAAAAAAFdA/j2FCTmGOrog/s160/no-thumbnail.png' width='160'/>
  2318.                 </a>
  2319.               </div>
  2320.             </b:if>
  2321.             <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
  2322.             <b:if cond='data:showSnippets'>
  2323.               <div class='item-snippet'><data:post.snippet/></div>
  2324.             </b:if>
  2325.           </div>
  2326.           <div class='clear'/>
  2327.         </b:if>
  2328.       </li>
  2329.       </b:loop>
  2330.     </ul>
  2331.   </div>
  2332. </b:includable>
  2333.             </b:widget>
  2334.             <b:widget id='Label1' locked='false' title='Label' type='Label' version='1' visible='true'>
  2335.               <b:includable id='main'>
  2336.   <b:if cond='data:title != &quot;&quot;'>
  2337.     <h2><data:title/></h2>
  2338.   </b:if>
  2339.   <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
  2340.     <b:if cond='data:display == &quot;list&quot;'>
  2341.       <ul>
  2342.         <b:loop values='data:labels' var='label'>
  2343.           <li>
  2344.             <b:if cond='data:blog.url == data:label.url'>
  2345.               <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
  2346.             <b:else/>
  2347.               <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
  2348.             </b:if>
  2349.             <b:if cond='data:showFreqNumbers'>
  2350.               <span dir='ltr'>(<data:label.count/>)</span>
  2351.             </b:if>
  2352.           </li>
  2353.         </b:loop>
  2354.       </ul>
  2355.     <b:else/>
  2356.       <b:loop values='data:labels' var='label'>
  2357.         <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
  2358.           <b:if cond='data:blog.url == data:label.url'>
  2359.             <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
  2360.           <b:else/>
  2361.             <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
  2362.           </b:if>
  2363.           <b:if cond='data:showFreqNumbers'>
  2364.             <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
  2365.           </b:if>
  2366.         </span>
  2367.       </b:loop>
  2368.     </b:if>
  2369.   </div>
  2370. </b:includable>
  2371.             </b:widget>
  2372.           </b:section>
  2373.           <!--
  2374.          <div class='banner-sidebar'>
  2375.          [Your Ad Code Here]
  2376.          </div>
  2377.          -->
  2378.         </div>
  2379.       </aside>
  2380.       <!-- sidebar wrapper end -->
  2381.  
  2382.     </div>
  2383.     <div class='clear'/>
  2384.     <!-- content wrapper end -->
  2385.  
  2386.   </div>
  2387.   <!-- wrapper end -->
  2388.  
  2389.   <!-- footer wrapper start -->
  2390.   <div id='footer-wrapper'>
  2391.     <footer>
  2392.       <div id='footer'>
  2393.       <div id='keep-in-touch'>
  2394.         <span>Keep in touch</span>
  2395.         <a href='https://facebook.com/' title='facebook'><svg height='24' version='1.1' viewBox='0 0 24 24' width='24'><path d='M19,4V7H17A1,1 0 0,0 16,8V10H19V13H16V20H13V13H11V10H13V7.5C13,5.56 14.57,4 16.5,4M20,2H4A2,2 0 0,0 2,4V20A2,2 0 0,0 4,22H20A2,2 0 0,0 22,20V4C22,2.89 21.1,2 20,2Z' fill='#fff'/></svg></a>
  2396.         <a href='https://twitter.com/' title='twitter'><svg height='24' version='1.1' viewBox='0 0 24 24' width='24'><path d='M17.71,9.33C17.64,13.95 14.69,17.11 10.28,17.31C8.46,17.39 7.15,16.81 6,16.08C7.34,16.29 9,15.76 9.9,15C8.58,14.86 7.81,14.19 7.44,13.12C7.82,13.18 8.22,13.16 8.58,13.09C7.39,12.69 6.54,11.95 6.5,10.41C6.83,10.57 7.18,10.71 7.64,10.74C6.75,10.23 6.1,8.38 6.85,7.16C8.17,8.61 9.76,9.79 12.37,9.95C11.71,7.15 15.42,5.63 16.97,7.5C17.63,7.38 18.16,7.14 18.68,6.86C18.47,7.5 18.06,7.97 17.56,8.33C18.1,8.26 18.59,8.13 19,7.92C18.75,8.45 18.19,8.93 17.71,9.33M20,2H4A2,2 0 0,0 2,4V20A2,2 0 0,0 4,22H20A2,2 0 0,0 22,20V4C22,2.89 21.1,2 20,2Z' fill='#fff'/></svg></a>
  2397.         <a href='https://instagram.com/' title='instagram'><svg height='24' version='1.1' viewBox='0 0 24 24' width='24'><path d='M20,6.5A0.5,0.5 0 0,1 19.5,7H17.5A0.5,0.5 0 0,1 17,6.5V4.5A0.5,0.5 0 0,1 17.5,4H19.5A0.5,0.5 0 0,1 20,4.5M4.5,20A0.5,0.5 0 0,1 4,19.5V11H6.09C6.03,11.32 6,11.66 6,12A6,6 0 0,0 12,18A6,6 0 0,0 18,12C18,11.66 17.96,11.32 17.91,11H20V19.5A0.5,0.5 0 0,1 19.5,20M12,8A4,4 0 0,1 16,12A4,4 0 0,1 12,16A4,4 0 0,1 8,12A4,4 0 0,1 12,8M20,2H4C2.89,2 2,2.89 2,4V20A2,2 0 0,0 4,22H20A2,2 0 0,0 22,20V4C22,2.89 21.1,2 20,2Z' fill='#fff'/></svg></a>
  2398.         <a href='https://plus.google.com/' title='google'><svg height='24' version='1.1' viewBox='0 0 24 24' width='24'><path d='M20,2A2,2 0 0,1 22,4V20A2,2 0 0,1 20,22H4A2,2 0 0,1 2,20V4C2,2.89 2.9,2 4,2H20M20,12H18V10H17V12H15V13H17V15H18V13H20V12M9,11.29V13H11.86C11.71,13.71 11,15.14 9,15.14C7.29,15.14 5.93,13.71 5.93,12C5.93,10.29 7.29,8.86 9,8.86C10,8.86 10.64,9.29 11,9.64L12.36,8.36C11.5,7.5 10.36,7 9,7C6.21,7 4,9.21 4,12C4,14.79 6.21,17 9,17C11.86,17 13.79,15 13.79,12.14C13.79,11.79 13.79,11.57 13.71,11.29H9Z' fill='#fff'/></svg></a>
  2399.       </div>
  2400. <!-- Mau menghapus link di bawah ini? silahkan Transfer Rp. 50.000,- Hubungi 082-313-168-344 (SMS Only). Kalau menghapus tanpa izin, berarti anda maling, blognya tidak akan barokah :) -->
  2401.       &#169; <h3><data:blog.title/></h3> <!-- DON'T EDIT -->
  2402.       <a href='#top' title='Back To Top'>
  2403.         <div id='fab'>
  2404.           <svg height='24' viewBox='0 0 48 48' width='24'><path d='M24 16L12 28l2.83 2.83L24 21.66l9.17 9.17L36 28z' fill='#827717'/></svg>
  2405.         </div>
  2406.       </a>
  2407.       </div>
  2408.     </footer>
  2409.   </div>
  2410.   <!-- footer wrapper end -->
  2411. &lt;!--</body>--&gt;&lt;/body&gt;
  2412. </HTML>
Add Comment
Please, Sign In to add comment