Kakikoki K1 ~ Template Blogger Selected

CLICK COPY AND PASTE THIS CODE TO YOUR BLOGGER EDIT HTML PAGE, GOOD LUCK !

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  <head>
  
   <meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
<b:include data='blog' name='all-head-content'/>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
</b:if>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title> 
<b:else/>
<title><data:blog.pageName/> ~ <data:blog.title/></title>
</b:if>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='Aneka resep masakan dan minuman nusantara meliputi jawa, sumatera, kalimantan, sulawesi' name='description'/>
<meta content='resep masakan jawa, aneka resep, contoh resep masakan, resep memasak, resep membuat masakan jawa, resep minuman, resep kuliner, kuliner, tips memasak, trik memasak, memasak,belajar memasak, koleksi resep, contoh resep memasak, contoh makanan, cara membuat, cara membuat masakan jawa, resep minuman, belajar jadi koki, chef indonesia, resep masakan nusantara, jajan pasar, kue, roti, sate, rendang, cara membuat rendang,cara membuat bronies, resep mie, resep sayur, cara bikin kue, cara membuat, resep membuat roti' name='keywords'/>
</b:if>

<b:if cond='data:blog.pageType == "item"'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='article' property='og:type'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='Blog Logo URL Here' property='og:image'/>
</b:if>
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' name='og:description'/>
</b:if>
<meta content='Facebook App ID here' property='fb:app_id'/> 
<meta content='sotokebo@gmail.com' property='fb:admins'/>

<b:if cond='data:blog.pageType == "item"'>
    <b:if cond='data:blog.postImageThumbnailUrl'>
      <b:if cond='data:blog.metaDescription'>
        <meta content='summary' name='twitter:card'/>
        <meta content='@templatezy' name='twitter:site'/>
        <meta content='@templatezy' name='twitter:creator'/>
        <meta expr:content='data:blog.pageName' name='twitter:title'/>
        <meta expr:content='data:blog.metaDescription' name='twitter:description'/>
        <meta expr:content='data:blog.postImageThumbnailUrl' name='twitter:image:src'/>
        <meta expr:content='data:blog.homepageUrl' name='twitter:domain'/>
      </b:if>
    </b:if>
</b:if>

/*-----------------------------------------------

/////////////////////////////////////////////////////////
//                                                     //
//  Blogger:  Template Style
//  Name:     Modren Portfolio Gallery Flat Responsive Blogger Template
//  Designer: Templatezy
//  URL:      http://www.templatezy.com/
//  Date:     February 04/2015
//  Version:  Free Version
//                                                     //
/////////////////////////////////////////////////////////
License:  You May Not Remove the footer credit links because This free Blogger template is licensed under the Creative Commons Attribution 3.0 License, which permits both personal and commercial use.

-----------------------------------------------*/

/*==///////////////////////////////////////////
//           Reset All Css property          //     
/////////////////////////////////////////==*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, figure {    margin: 0;    padding: 0;}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {     display:block;}
table {    border-collapse: separate;    border-spacing: 0;}
caption, th, td {    text-align: left;    font-weight: normal;}
blockquote:before, blockquote:after,
q:before, q:after {    content: "";}
blockquote, q {    quotes: "" "";}
sup{    vertical-align: super;    font-size:smaller;}
code{    font-family: 'Courier New', Courier, monospace;    font-size:12px;    color:#272727;}
::selection {  background: #333;  color: #fff;  }
::-moz-selection {  background: #333;  color: #fff;  }

a img{
vertical-align:middle;
border: none;
}

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

#navbar-iframe-container{display:none !important;}

ol, ul { padding: 10px 0 20px;  margin: 0 0 0 35px;  text-align: left;  }
ol li { list-style-type: decimal;  padding:0 0 5px;  }
ul li { list-style-type: square;  padding: 0 0 5px;  }
ul ul, ol ol { padding: 0; }
h1, h2, h3, h4, h5, h6 { font-family: 'arial', San-serif; font-weight: normal; }
.post-body h1 { line-height: 48px; font-size: 42px; margin: 10px 0; }
.post-body h2 { font-size: 36px; line-height: 44px; padding-bottom: 5px; margin: 10px 0; }
.post-body h3 { font-size: 32px; line-height: 40px; padding-bottom: 5px; margin: 10px 0; }
.post-body h4 { font-size: 28px; line-height: 36px; margin: 10px 0;  }
.post-body h5 { font-size: 24px; line-height: 30px; margin: 10px 0;  }
.post-body h6 { font-size: 18px; line-height: 24px; margin: 10px 0;  }

/*==///////////////////////////////////////////
//           Links Css                      //     
/////////////////////////////////////////==*/

a{ color: #555; outline:none; text-decoration: none; }
a:hover { 
text-decoration: underline;
color: #111;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
 }

body {
background: #f9f9f9;
color: #333;
padding: 0;
font-family: 'Open Sans', sans-serif;
font-size: 15px;
line-height: 25px;
border-top: 3.5px solid #C9C9C9;
}

.clr { clear:both; float:none; }

/*==///////////////////////////////////////////
//           Wrappers Style                 //     
/////////////////////////////////////////==*/

.ct-wrapper { padding: 0px 0px; position: relative; max-width: 1200px; margin: 0 auto; }
.outer-wrapper { margin: 25px 0; position: relative; }
.header-wrapper { display: inline-block; float: left; width: 100%; }
.main-wrapper { width:auto; margin-right: 100px; }
#content { position: relative; width: 100%; float: left; }
.sidebar-wrapper { width:0px; float: left; }

/**** Layout Styling CSS *****/
body#layout .header-wrapper { margin-top: 40px; }
body#layout .outer-wrapper, body#layout .sidebar-wrapper, body#layout .ct-wrapper { margin: 0; padding: 0; }
body#layout #About { width: 100%; }

/*==///////////////////////////////////////////
//          Header Style Layout             //     
/////////////////////////////////////////==*/
#header { display: inline-block; text-align: center; width: 100%; }
#header-inner{ margin: 40px 20px 30px; padding: 0; }
#header h1 { color: #2980B9; font-family: "pacifico",cursive; font-size: 50px; font-style: normal; line-height:150%; text-shadow: 1px 1px #000000;
 text-shadow: 
      4px 4px 0px #d5d5d5, 
      7px 7px 0px rgba(0, 0, 0, 0.2);
 animation:blur .75s ease-out infinite;

}
@keyframes blur{
  from{
      text-shadow:0px 0px 10px #fff,
      0px 0px 10px #fff, 
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #7B96B8,
      0px 0px 150px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px -10px 100px #7B96B8,
      0px -10px 100px #7B96B8;}
}

#header h1 a, #header h1 a:hover {  color: #626262; text-decoration:none }

#header p.description{ color: #333; font-size: 12px; font-style: italic; text-shadow: 1px 1px #FFFFFF; margin: 0; padding: 0; text-transform:capitalize; }
#header img{   border:0 none; background:none; width:auto; height:auto; margin:0 auto;max-height:120px;  }

/*==///////////////////////////////////////////
//           Main Menu Css                  //     
/////////////////////////////////////////==*/

.sticky { position: fixed; top: 0px; border-bottom: 1px solid #ddd; z-index: 99999; }

.social {
    float: right !important;
    margin: 0;
    padding: 0;
}
.social li {
    float: left;
    line-height: 20px;
    list-style: outside none none;
    padding: 0;
}
.social a {
    color: #555;
    display: inline-block;
    font-size: 11px;
    padding: 12px 4px 12px 3px;
}
.social i {
    font-size: 18px;
    left: 0;
    position: relative;
    text-align: center;
    top: 1px;
    width: 25px;
}

/*==///////////////////////////////////////////
//           Blogp Posts Feature Css         //     
/////////////////////////////////////////==*/

.featured-area {
webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
margin: 0;
position: relative;
width: 100%;
height: 100%;

}

.featured-area,
.hentry img {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
overflow:hidden;
}

.post-body .overlay {
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
position: absolute;
box-sizing: border-box;
-moz-box-sizing: border-box;
width: 100%;
height: 100%;
top: 0;
left: -100%;
background: #FFF;
background: rgba(255, 255, 255, 0.9);
padding: 20px;
color: #555;
z-index: 10;
opacity: 0;
text-align: center;
}

.featured-area:hover .overlay {
    left: 0;
    opacity: 1;
}

.entry-cntnt .entry-header {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
padding: 10px 20px;
}
.overlay .entry-header .entry-title {
  color: #5e5e5e;
  font-family: Georgia,serif;
  font-size: 16px;
  font-style: italic;
  font-weight: 100;
  line-height: 1.8;
}

.entry-cntnt .overlay .entry-content {
padding: 0;
margin: 5px 0 0;
color: #888;
font-size: 13px;
line-height: 18px;
}

.entry-likes, .entry-category {
  bottom: 18px;
  color: #aaa;
  font-family: Georgia,serif;
  font-size: 15px;
  font-style: italic;
  font-weight: normal;
  height: 18px;
  left: 25px;
  overflow: hidden;
  position: absolute;
  text-align: center;
  width: 85%;
}
.entry-likes {
width: 20%;
}
.entry-category i {
margin-right: 5px;
}

.entry-likes {
display:none;
right: 6px;
left: auto;
text-align: right;
}

.hentry .permalink {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 20;
}

.hentry .overlay i {
display: block;
width: 44px;
margin: 0 auto;
font-size: 40px;
line-height: 64px;
color: #aaa;
}

.header-wrap {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 -1px 0 #e0e0e0;
-moz-box-shadow: 0 -1px 0 #e0e0e0;
-ms-box-shadow: 0 -1px 0 #e0e0e0;
-o-box-shadow: 0 -1px 0 #e0e0e0;
box-shadow: 0 -1px 0 #e0e0e0;
background: #F4F4F4;
padding: 10px 20px;
margin-bottom: 25px;
}

.post-outer:first-child { margin: 0; }
.post-outer { margin: 30px 0 0; }
.post {
  background: none repeat scroll 0 0 transparent;
  padding: 25px 5%;
}
.post-title { font-size: 28px; line-height: normal; margin: 0; padding: 0 0 10px; text-decoration: none; text-transform: capitalize; }
.post-title a{ color:#333; }
.post-title a:hover{ color: #2980B9; }
.post-body { color: #666; text-transform: auto; word-wrap:break-word;  }

.featured-image {margin: 0 0 10px; overflow: hidden; position: relative; }
.featured-image img {width: 100%; }

.post-header { 
padding: 5px 10px;
margin: 10px -10px 0 -10px;
opacity: .8;
filter: progid:dximagetransform.microsoft.alpha(opacity=80);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
border-bottom: 1px solid #EBEBEB;
}

.post-header a { color: #888; }
.post-header a:hover{ color: #2980B9; }

.post-header > span {
margin-right: 7px;
font-size: 12px;
position: relative;
}

.post-header > span:after {
content: "|";
padding-left: 7px;
}

.post-header > span:last-child:after{
content:"";
}

/*==///////////////////////////////////////////
//           Page Navigation Hack Style     //     
/////////////////////////////////////////==*/

#blog-pager { display: inline-block; margin: 1px 0; overflow: visible; padding: 25px 3%; width: 94%; }
#blog-pager-newer-link { padding: 20px 5%; position: relative; text-align: left; width: 40%; }
#blog-pager-newer-link:before { content: "\00AB"; font-size: 30px; left: 0; position: absolute; top: 35%; }
#blog-pager-older-link { padding: 20px 5%; position: relative; text-align: right; width: 40%; }
#blog-pager-older-link:before { content: "\00BB"; font-size: 30px; position: absolute; right: 0; top: 35%; }
#blog-pager-newer-link .newer-text, #blog-pager-older-link .older-text { display: block; color: #999; }

/*==///////////////////////////////////////////
//           Blockquotes Styles             //     
/////////////////////////////////////////==*/
blockquote {
border-color: #CDCDCD;
border-style: solid;
color: #888888;
font-size: 17px;
line-height: 1.7;
margin: 10px 0 20px;
padding: 15px 25px;
border-width: 0;
border-left-width: 4px;
}

/*==///////////////////////////////////////////
//           SideBar Stying Css              //     
/////////////////////////////////////////==*/

.sidebar { margin: 0; padding: 0; display: block; }
.sidebar h2 {
  display: inherit;
  font-size: 20px;
  margin-bottom: 10px;
  padding-bottom: 5px;
  position: relative;
  text-align: center;
  text-transform: capitalize;
}
.sidebar .widget { background: #fff; padding: 25px 20px; clear: both; font-size: 13px; line-height: 23px; margin-bottom: 30px; }
.sidebar ul { margin: 0; padding: 0; list-style: none; }

.sidebar li { 
border-bottom: 1px solid #F1f4f9;
line-height: normal;
list-style: none !important;
margin: 8px 0;
overflow: hidden;
padding: 0 0 10px 0px !important;
}

/*==///////////////////////////////////////////
//           Templatezy Footer Styling       //     
/////////////////////////////////////////==*/

.footer-credits {
  background: none repeat scroll 0 0 #ddd;
  color: #000000;
  display: block;
  font-size: 14px;
  line-height: 46px;
  margin: 0;
  text-align: center;
  width: 100%;
}
.footer-credits a { color: #000; }
.footer-credits a:hover { color: #999; }

/*==///////////////////////////////////////////
//           Blogspot Default Serach Box     //     
/////////////////////////////////////////==*/

#searchform fieldset { background: #F1F4F9; border: 1px solid #F1F4F9; color: #888888; width: 98%; }
#searchform fieldset:hover { background: #fff; }
#s { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG3Tfjz6lLjQ7sAzsYKaLiWMhNkB1npJGs1tOgXiL0QK1zrEIQNFWVdGJ-aD88rpEhCvcSOK05_Dnnb9GX5Cc-vB_9NNDDnqloL4O2WfUjiJvhmzXhMCHd3eCfbSwGCZTBzcNgb13FRXss/s1600/sprites.png") no-repeat scroll right -60px rgba(0, 0, 0, 0); border: 0 none; color: #888888; float: left; margin: 8px 5%; padding: 0 10% 0 0; width: 80%; }

/*==///////////////////////////////////////////
//           Lables Styling Css             //     
/////////////////////////////////////////==*/

.cloud-label-widget-content { display: inline-block; text-align: left; }
.cloud-label-widget-content .label-size { display: inline-block; float: left; font-size: 10px; font-family: Verdana,Arial,Tahoma,sans-serif; font-weight: bold; line-height: normal; margin: 5px 5px 0 0; opacity: 1; text-transform: uppercase; }
.cloud-label-widget-content .label-size a { color: #000 !important; float: left; padding: 5px; }
.cloud-label-widget-content .label-size:hover a { color: #555 !important; }
.cloud-label-widget-content .label-size .label-count { color: #555; padding: 5px 0; float: left; }

.sidebar .PopularPosts ul {
padding: 0;
}
.sidebar .PopularPosts ul li:first-child{
width: 100%;
max-height: 100%;

}
.sidebar .PopularPosts ul li:nth-child(even){
margin-right: 2%;
}
.sidebar .PopularPosts ul li {
box-sizing: border-box;
position: relative;
padding: 0px !important;
width: 49%;
max-height: 120px;

overflow:hidden;
float: left;
margin-bottom: 2%;
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
-ms-transition: all 0.5s ease 0s;
-o-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
.sidebar .PopularPosts ul li:hover {
opacity: 1;
}
.sidebar .PopularPosts .item-thumbnail {
margin: 0;
width: 100%;
}
.sidebar .PopularPosts ul li img {
box-sizing: border-box;
width: 100%;
height: 100%;
object-fit: cover;
padding:0;
}
.sidebar .PopularPosts .item-content:hover .item-title a,
.sidebar .PopularPosts .item-thumbnail-only:hover .item-title a {
visibility: visible;

}
.sidebar .PopularPosts .item-title a {
color: #fff;
background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.93) 100%, rgba(0, 0, 0, 0.85) 100%);
text-decoration: none;
position: absolute;
text-align: center;
font: 13px 'Oswald', sans-serif;
left: 0;
right: 0;
bottom: 0%;
padding: 100px 10px 10px;

}
.sidebar .PopularPosts .item-snippet {
display: none;
}

/*==///////////////////////////////////////////
//           Bloger Contact Form Css         //     
/////////////////////////////////////////==*/

.contact-form-email, .contact-form-name, .contact-form-email-message, .contact-form-email:hover, .contact-form-name:hover, .contact-form-email-message:hover, .contact-form-email:focus, .contact-form-name:focus, .contact-form-email-message:focus { background: #F8F8F8; border: 1px solid #D2DADD; box-shadow: 0 1px 1px #F3F4F6 inset; max-width: 300px; color: #999; }
.contact-form-button-submit { background: #000; border: medium none; float: right; height: auto; margin: 10px 0 0; max-width: 300px; padding: 5px 10px; width: 100%; cursor: pointer; }
.contact-form-button-submit:hover { background: #2980B9; border: none; }

/*==///////////////////////////////////////////
//           Profile Css style              //     
/////////////////////////////////////////==*/

.Profile img { border:1px solid #cecece; background:#fff; float:left; margin:5px 10px 5px 0; padding: 5px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
.profile-data { color:#999999; font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif; font-variant:small-caps; margin:0; text-transform:capitalize;}
.profile-datablock { margin:0.5em 0;}
.profile-textblock { line-height:1.6em; margin:0.5em 0;}
a.profile-link { clear:both; display:block; font:80% monospace; padding:10px 0; text-align:center; text-transform:capitalize;}

/*==///////////////////////////////////////////
//           Meet The Author Css            //     
/////////////////////////////////////////==*/

#About { background: #FFFFFF; display: inline-block; padding: 25px 3%; width: 94%; }
#About .widget-content { position: relative; width: 100%; }
#About .widget-content .main-wrap { width: auto; margin-right: 370px; }
#About .widget-content .main-wrap .info { float: left; position: relative; width: 90%; padding: 10px 5%; }
#About .widget-content .side-wrap { width: 340px; float: right; text-align: center; }
#About .widget-content .main-wrap .info h5 { border-bottom: 1px solid #F1F4F9; color: #000000; font-size: 16px; font-weight: bold; margin: 0 0 10px; padding: 0 0 5px; text-transform: capitalize; } 
#About .widget-content .main-wrap .info p { color: #555; font-style: italic; } 
#About .widget-content .side-wrap .author-img { border: 1px solid #CECECE; height: 150px; vertical-align: bottom; width: 150px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
ul.author-social { display: inline-block; margin: 10px 0 0; padding: 0; }
ul.author-social li { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG3Tfjz6lLjQ7sAzsYKaLiWMhNkB1npJGs1tOgXiL0QK1zrEIQNFWVdGJ-aD88rpEhCvcSOK05_Dnnb9GX5Cc-vB_9NNDDnqloL4O2WfUjiJvhmzXhMCHd3eCfbSwGCZTBzcNgb13FRXss/s1600/sprites.png") no-repeat; display: inline-block; font-weight: bold; font-size: 12px; line-height: 16px; list-style: none; padding: 0 20px; }
ul.author-social li.facebook { background-position: 0 -80px; }
ul.author-social li.twitter { background-position: 0 -100px; }
ul.author-social li.googleplus { background-position: 0 -120px; }
ul.author-social li.rss { background-position: 0 -176px; }
ul.author-social li a { color: #000; }
ul.author-social li a:hover { color: #666; }

/*==///////////////////////////////////////////
//          Ads Wrappers                    //     
/////////////////////////////////////////==*/

#ads-wrapperss {
  background: none repeat scroll 0 0 #fbfbfb;
  float: none;
  padding-bottom: 28px;
  width: 100%;
}

#ads-wrapper {
  width: 728px;
  margin: auto;
}

/*==///////////////////////////////////////////
//           Related Posts Widgets          //     
/////////////////////////////////////////==*/

#related-posts h2 {
    background: none repeat scroll 0 0 #ddd;
    color: #555;
    font-family: lato;
    font-size: 25px;
    font-weight: 500;
    height: 35px;
    line-height: 40px;
    margin: auto 5px;
    padding-left: 10px;
    padding-top: 1px;
    width: 94.6%;
}
.bordering {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #ebebeb;
    box-shadow: none;
    float: left;
    overflow: hidden;
    padding: 5px;
}
#related-posts img {
    background: none repeat scroll 0 0 #fff;
    border-bottom: 1px solid #ebebeb;
    border-radius: 0;
    border-top: 2px solid #ebebeb;
    box-shadow: none;
    margin-top: 3px;
    overflow: hidden;
    padding: 0;
}
#related-posts a {
    border: 0 none !important;
}
#related-posts a {
    color: #555;
    text-align: center;
}
#related-posts {
    border-top: 1px solid #ebebeb;
    float: left;
    margin: auto 0;
    padding-bottom: 20px;
    padding-top: 25px;
    width: 109%;
}
#related-posts img {
    height: 80px !important;
    width: 75px !important;
}

/*==///////////////////////////////////////////
//          Comments Styling                //     
/////////////////////////////////////////==*/

#comments { margin-top: 30px; }
.comments h4 { font-size: 20px; margin: 0 0 18px; text-transform: capitalize; }
.comments li {
list-style: none;
}
.comments .comments-content .comment-thread ol { overflow: hidden; margin: 0; }
.comments .comments-content .comment:first-child { padding-top: 0; }
.comments .comments-content .comment { margin-bottom: 0; padding-bottom: 0; }
.comments .avatar-image-container { max-height: 60px; width: 60px; }
.comments .avatar-image-container img {
max-width: 60px;
width: 100%;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.comments .comment-block { background: #fff; margin-left: 72px; padding: 14px 0 0 20px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
.comment-replies .comment-block {
padding-bottom: 14px;
}
.comments .comments-content .comment-header a { color: #333; text-transform: capitalize; }
.comments .comments-content .user { display: block; font-style: italic; font-weight: bold; }
.comments .comments-content .datetime { margin-left: 0; }
.comments .comments-content .datetime a { font-size: 12px; text-transform: uppercase; }
.comments .comments-content .comment-header, .comments .comments-content .comment-content { margin: 0 20px 0 0; }
.comments .comment-block .comment-actions { display: block; text-align: right; }
.comments .comment .comment-actions a { border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius:2px; background: #555; color: #FFFFFF; display: inline-block; font-size: 12px; line-height: normal; margin-left: 1px; padding: 5px 8px; }
.comments .comment .comment-actions a:hover { text-decoration: none; }
.comments .thread-toggle { display: none; }
.comments .comments-content .inline-thread { border-left: 1px solid #F4F4F4; margin: 0 0 20px 35px !important; padding: 0 0 0 20px; }
.comments .continue { display: none; }

.comment-thread ol { counter-reset: countcomments; }
.comment-thread li:before { color: #2980B9; content: counter(countcomments, decimal); counter-increment: countcomments; float: right; font-size: 22px; padding: 15px 20px 10px; position: relative; z-index: 10; }
.comment-thread ol ol { counter-reset: contrebasse; }
.comment-thread li li:before { content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin); counter-increment: contrebasse; float: right; font-size: 18px; }

/*==///////////////////////////////////////////
//      Responsive Layout Style Start       //     
/////////////////////////////////////////==*/

@media all and (max-width: 1200px) {   
.ct-wrapper{ max-width: 900px;}
.ct-wrapper{ padding-left:10px; }
.PopularPosts .item-thumbnail {margin: 0;width: auto;}
.popular-post{width:auto;}
}

@media all and (max-width: 910px) {   
.ct-wrapper{ max-width: 630px;}
.PopularPosts .item-thumbnail {margin: 0;width: auto;}
.popular-post{width:auto;}

}

@media screen and (max-width: 960px) {
.main-wrapper { margin-right:0; width:100%; }
.sidebar-wrapper{ float: left; width: auto; margin-top: 30px; }
#About .widget-content .main-wrap { margin-right: 0; }
#About .widget-content .main-wrap .info { float: none; text-align: center; width: 90%; padding: 10px 5%; }
#About .widget-content .side-wrap { width: 100%; float: none; text-align: center; }
.sticky { position: static; }
.PopularPosts .item-thumbnail {margin: 0;width: auto;}
.popular-post{width:auto;}

}

@media screen and (max-width: 820px){
.button-menu-mobile {display: block!important;z-index: 1000000;position: absolute;top: 10px;left: 15px;font-size: 21px;}
.social{width:auto!important;}
#comment-editor { margin:10px; }
.hentry{width:30.66%!important;}
.PopularPosts .item-thumbnail {margin: 0;width: auto;}
.popular-post{width:auto;}
}

@media screen and (max-width: 520px){
#header img { }
.post.hentry{width:45.33%!important;}
.featured-image{height:165px;}
.entry-cntnt .entry-header{padding-top:20px;}
.overlay .entry-header .entry-title{font-size:15px;}
.entry-content{display:none;}
.PopularPosts .item-thumbnail {margin: 0;width: auto;}

.popular-post{width:auto;}
#pop-up {display:none;}
#pop-up,body.overlay:after{display:none;}

}

@media screen and (max-width: 420px){
.comments .comments-content .datetime{    display:block;    float:none;    }
.comments .comments-content .comment-header {    height:70px;    }
}
@media screen and (max-width: 320px){
.post.hentry {width: 100%!important;}
.social a{padding:10px 10px 10px 0;}
.ct-wrapper{ padding:0; }
.post-body img{  max-width: 230px; }
.comments .comments-content .comment-replies {    margin-left: 0;    }
.PopularPosts .item-thumbnail {margin: 0;width: auto;}
.popular-post{width:auto;}
}

/*==///////////////////////////////////////////
//           Heading Date Style             //     
/////////////////////////////////////////==*/
h2.date-header,span.blog-admin{display:none!important;}

#related-posts { float:center; width:100%; margin:0; padding-top:10px; }
#related-posts .judul { background:none; color:#333; font:16px Oswald; display:none;}
#related-posts .seocips_img { padding:0; margin:2px; width:100px !important; height:auto; position:relative; overflow:auto;border:4px double #ddd; }
#related-posts .seocips_img { height:300px; }
#related-posts .seocips_img:hover { opacity:.7; filter:alpha(opacity=70); -moz-opacity:.7; -khtml-opacity:.7; }

.popular-posts .item-thumbnail{float:left;} 
.popular-posts ul{padding-left:0px;} 
.popular-posts ul li {list-style-image: none;list-style-type: none;display:inline;} 
.popular-posts ul li img {padding:0px;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;border: 2px solid #CCC;} 
.popular-posts ul li img:hover {border:2px solid #ccc;-moz-transform: scale(1.3) rotate(-360deg) ;-webkit-transform: scale(1.3) rotate(-360deg) ;-o-transform: scale(1.3) rotate(-360deg) ;-ms-transform: scale(1.2) rotate(-360deg) ;transform: scale(1.3) rotate(-360deg);}

/* share button ala Bungfrangki.com */
#share-this{overflow:hidden;margin:10px 18px;line-height:1.4em}#share-this a{float:left;display:block;color:#fff;padding:10px 14px;text-align:center;margin:0 3px 3px;font-size:12px}#share-this a.this-fb{background:#395796;}#share-this a.this-tw{background:#4cb0ea;}#share-this a.this-gp{background:#de3425;width:44px;padding:0;text-align:center;height:41px;overflow:hidden;}#share-this a.this-gp i{margin:5px 0 0;text-align:center;padding:0}#share-this a.this-fb:hover,#share-this a.this-tw:hover,#share-this a.this-gp:hover {opacity:.9}#share-this i {margin-right:12px}
.this-fb i,.this-tw i,.this-gp i{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgknKSfuT2kqOKdNKjYaiZycbovZYxh_Q41FDsKD6xEomgt42T_3em-DAF96cvMD_C8u5WN5nBc1wBwDkRnlsCyVYsiJn6dbkrj4bmPQI0CDAc3ULE3qnUEquUAGdOcDRZPwrvgqSQb8P8/s1600/sosmed22.png) no-repeat;width:22px; height:18px; display:inline-block;vertical-align:text-top;margin-top:-6px;text-align:center}.gp-del{display:none}
.this-fb i{background-position:0 -100px;margin-top:-4px}.this-tw i{background-position:0 -150px}.this-gp i{background-position:0 -200px}.notpay {font-size:13px;line-height: 22px;border:2px #df3f2a solid;padding:3px 15px;text-align:center;margin:0 0 25px;}.pay {font-size:13px;line-height: 22px;border:2px #5973b0 solid;padding:3px 15px;text-align:center;margin:0 0 25px;}
@media screen and (max-width:414px){#share-this{margin:10px 15px}.gp-del{display:block}#share-this a{min-width:100%;padding:0;text-align:center !important;height:45px;line-height:45px;margin:0 auto 3px !important}#share-this a.this-gp i, #share-this i{display:none}#share-this a.this-gp{height:auto;margin:0 auto;padding:0}}

/* TabView */
div.TabView div.Tabs
{
height: 24px;
overflow: hidden;
}
div.TabView div.Tabs a
{
float: left;
display: block; background: #cccccc;
width: 90px; /* Lebar Menu Utama Atas */ text-align: center;
height: 24px; /* Tinggi Menu Utama Atas */
padding-top: 3px;
vertical-align: middle;
border: 1px solid #cccccc; /* Warna border Menu Atas */
border-bottom-width: 0;
text-decoration: none;
font-family: "Times New Roman", Serif; /* Font Menu Utama Atas */
font-weight: 900;
color: #000; /* Warna Font Menu Utama Atas */
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #ffe6ff; /* Warna background Menu Utama Atas */
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #cccccc; /* Warna border Kotak Utama */
overflow: hidden;
background-color: #ffe6ff; /* Warna background Kotak Utama */
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<style type='text/css'>
/* Page Navigation widget by http://www.bloggerspice.com */
#blog-pager{background:#fff;clear:both;width:auto;padding:22px;line-height:normal;position:relative;display:block;text-align:left;overflow:visible;margin:20px 0 5px 0}
.showpage a,.showpageNum a,.showpagePoint,.showpageOf{position:relative;background:#fff;display:inline-block;font-family:'Arial', Helvetica,font-size:15px;color:rgba(0,0,0,.8);padding:5px 8px;margin:0 4px 0 0;border: 1px solid #F1F1F1;transition:all .3s}
.showpageOf{float:right;background:#FB9543;color:#fff;}
.showpageNum a:before{content:' ';position:absolute;top:0;bottom:0;left:0;right:0;box-shadow:inset 0 -2px 2px rgba(0,0,0,0.02);transition:box-shadow 0.5s}
.showpage a:hover,.showpageNum a:hover,.showpagePoint:hover{background:#FB9543;color:#FFFFFF;position:relative; border: 1px solid #FB9543;}
.showpagePoint{background:#FB9543;color:#fff;}
@media screen and (max-width:640px) {
#blog-pager {padding:12px;}
.showpage a,.showpageNum a,.showpagePoint,.showpageOf{margin:0 2px 2px 0;box-shadow:0 1px 2px 1px rgba(0,0,0,0.1);}}
@media screen and (max-width:320px) {
.showpage a,.showpageNum a,.showpagePoint,.showpageOf{padding:3px 6px}}
</style>
</b:if>
</b:if>

]]></b:skin>

<style>
.showpageOf {
display: none;
}
.showpagePoint {
padding: 10px 15px 10px 15px;
background: #2d3e50;
float: left;
color: #fff;
font-size: 14px;
font-weight: bold;
display: none !important;
}
.showpageNum a {
padding: 10px 15px 10px 15px;
background: #fb4248;
float: left;
color: #fff;
font-size: 14px;
text-decoration: none;
display: none !important;
}
.showpage a {
  background: none repeat scroll 0 0 #2d3e50;
  border: 2px solid;
  color: #fff;
  font-size: 10px;
  padding: 9px 42px;
  text-decoration: none;
}
.showpage a:hover {
    background: none repeat scroll 0 0 #2d3e50;
}
.showpageNum a:hover {
background: #2d3e50;
}
.showpageArea {
    float: left;
    padding: 15px 0;
    width: 100%;
}

#blog-pager-older-link a, #blog-pager-newer-link a, a.home-link, .showpageNum a, .showpage a {
    background: none repeat scroll 0 0 #c4c4c4;
    color: #fff;
    text-decoration: none;

}

</style>

<b:if cond='data:blog.pageType != "index"'>
<style>
@media all and (max-width: 820px) {
.hentry{width:520px !important;}
}

@media all and (max-width: 620px) {
.hentry{width:420px !important;}
.ct-wrapper { max-width: 520px;}
}

@media all and (max-width: 520px) {
.post.hentry{width:340px !important;}
.ct-wrapper { max-width: 400px;}
}

</style></b:if>

/*--------Media Queries--------------*/
@media all and (max-width: 4000px) {

nav#nav-mobile {
    display: block;
}
}

/*--------Hide Large Menu--------------*/
@media all and (max-width: 959px) {    
nav#nav-main {
    display: none;
}
}

/*--------Show Responsive Menu--------------*/
@media all and (max-width: 959px) {

#nav-trigger {
    display: block;
}

#nav-trigger {
    float: right;
    margin-top: 10px;
    text-align: center;
}
}

</style>

<style>

#searchboxer {
    background: none repeat scroll 0 0 #f9f9f9;
    float: left;
    margin: auto;
    width: 100%;
}
.searchboxer-inner {
    margin: auto;
    padding-bottom: 8px;
    padding-top: 8px;
}
form.search-form {
    text-align: center;
    width: 100%;
}
input#s {
    background: none repeat scroll 0 0 #ffffff;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-radius: 2px 0 0 2px;
    border-top: 1px solid #ddd;
    box-shadow: none;
    color: #adadad;
    float: none;
    font-family: open sans;
    font-size: 15px;
    font-weight: 500;
    height: 42px;
    margin: auto -4px;
    outline: medium none;
    padding-left: 30px;
    padding-right: 10px;
    width: 45%;
}
input#buttonsinput {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh01BULvcXxveFcm8DK0ciB6EcItzXgW5s-Pw1m5cdkwwjcKvjUAjvW7rNNesjgUeLqiuU6VhfnBC0Xtgpk4wABnSNYNCi7xOWUCK-16WArYfwAoynOTScWXrOGayniMqAjfL_m1Nd5zIw/s1600/image.png?1420493483983") no-repeat scroll center center rgba(0, 0, 0, 0);
    border: 1px solid #ddd;
    border-radius: 0 2px 2px 0;
    box-shadow: none;
    color: #ffffff;
    float: none;
    font-family: Roboto Slab;
    font-size: 11px;
    font-weight: 500;
    height: 44px;
    margin: auto;
    outline: medium none;
    padding-left: 20px;
    padding-right: 31px;
    text-transform: uppercase;
    width: 6%;
}
input#buttonsinput {
    background-color: #fff;
}
input#buttonsinput:hover {
    cursor: pointer;
}
form.search-form {
    text-align: center;
}

</style>

<b:if cond='data:blog.pageType == "index"'>
<style type='text/css'>
.post-body img {
    height: 180px;
    max-width: 100%;
}
.sidebar-wrapper{display:none;}
.post {
    float: left;
    margin-bottom: 20px;
    margin-right: 10px;
    margin-top: 0;
    padding: 0;
    width: 190px;
}
  .post-title{display:none;}

.entry-cntnt {
  border-radius: 5px;
  box-shadow: 0 1px 0 #e0e0e0;
  height: auto;
  padding: 0 0 30px;
  position: relative;
  text-align: center;
}

.main-wrapper{margin:0;}
</style>

<style>
.entry-cntnt .overlay .entry-content {
display:none;
}
</style>
</b:if>

<b:if cond='data:blog.pageType == "static_page"'>
<style type='text/css'>
#blog-pager { display: none; }
</style>
</b:if>

//Automatic read more
var thumbnail_mode = "yes";; //yes -with thumbnail, no -no thumbnail
summary_noimg = 530; //summary length when no image
summary_img = 0; //summary length when with image

function rm(a,b) {
    var p = document.getElementById(a);
 var q = document.getElementById(b);
    var imgtag = "";
    var img = p.getElementsByTagName("img");
    var summ = summary_noimg;
    if (thumbnail_mode == "yes") {
        if (img.length >= 1) {
            imgtag = '<img src="' + img[0].src + '" height="210" width="280"/>';
            summ = summary_img
        }
    }
    
 var summary = imgtag;
    q.innerHTML = summary;
 p.parentNode.removeChild(p);

}

/*]]>*/</script>

</head>

<nav id='nav-main'>
    <ul>
<li><a expr:href='data:blog.homepageUrl'>HOME</a></li>
<li><a href='https://kakikoki.blogspot.co.id/search/label/makanan'>MAKANAN</a></li>
<li><a href='https://kakikoki.blogspot.co.id/search/label/minuman' rel='nofollow'>MINUMAN</a></li>
<li><a href='http://kakikoki.blogspot.com/p/kategori.html'>KATEGORI</a></li>
</ul>
</nav>
<div id='nav-trigger'>
    <span><i class='fa fa-align-justify fa-3x'/></span>
  </div>
<nav id='nav-mobile'/>

<div id='searchboxer'>
<div class='searchboxer-inner'>
<form action='/search' class='search-form' method='get'>
<input id='s' name='q' onblur='if (this.value == '') {this.value = 'Search the site';}' onfocus='if (this.value == 'Search the site') {this.value = '';}' type='text' value='Search the site'/>
<input id='buttonsinput' style='vertical-align: top;' type='submit' value=''/>
  </form>
</div>
</div>

          <div class='clr'/>
        <div class='ct-wrapper'>
           <div class='outer-wrapper'>
             <div class='main-wrapper'>

<b:section class='content' id='content' maxwidgets='1' showaddelement='no'>
                      <b:widget id='PopularPosts1' locked='false' title='      Popular Resep' type='PopularPosts' version='1' visible='true'>
                        <b:includable id='main'>
  <b:if cond='data:title'><h2>
<data:title/></h2>
</b:if>
  <div class='widget-content popular-posts'>
    <ul>      <b:loop values='data:posts' var='post'>
<li>
        <b:if cond='data:showThumbnails == "false"'>
          <b:if cond='data:showSnippets == "false"'>
            
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            
            <div class='item-title'>
<a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'>
<data:post.snippet/></div>
</b:if>
        <b:else/>
          <b:if cond='data:showSnippets == "false"'>
            
            <div class='item-thumbnail-only'>
             
                <div class='item-thumbnail'>
   <a expr:href='data:post.href' expr:title='data:post.title'>
    <b:if cond='data:post.thumbnail'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
       <b:else/>
        <img alt='' border='0' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrG9AEQgP-o9l5h6hO2zjNHR0kYYS6vTQ146hquofJLFBnyRmQx7vcK2GWOTBkitAItCeh60jF6AMdckKLzqafekVtkTPsnyTWRArcex-3b4EkhTsPpLpvQzflIVtqi_v8O1dZFT5F168/s72-c/default.png'/>
       </b:if>
                  </a>
                </div>
</div>
<b:else/>
            
            <div class='item-content'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
</b:if>
              <div class='item-title'>
<a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'>
<data:post.snippet/></div>
</div>
<div style='clear: both;'/>
          </b:if>
        </b:if>
      </li>
</b:loop>
    </ul>
<b:include name='quickedit'/>
  </div>
</b:includable>
                      </b:widget>
                      <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog' version='1' visible='true'>
                        <b:includable id='main' var='top'>
  <b:if cond='data:mobile == "false"'>

<div class='blog-posts hfeed'>

<b:include data='top' name='status-message'/>

<data:defaultAdStart/>
      <b:loop values='data:posts' var='post'>
        
        <b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == "item"'>

<b:include name='nextprev'/>

</b:if>
        <b:if cond='data:blog.pageType == "static_page"'>
          <b:include data='post' name='comment_picker'/>
        </b:if>
        <b:if cond='data:blog.pageType == "item"'>
          <b:include data='post' name='comment_picker'/>
        </b:if>
    
  </b:loop>
      <data:adEnd/>
    </div>

<b:if cond='data:blog.pageType == "index"'>
<b:include name='nextprev'/>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<b:include name='nextprev'/>
<b:else/>
<b:if cond='data:blog.homepageUrl != data:blog.url'>

<b:include name='nextprev'/>
</b:if>
</b:if>
</b:if>

<b:if cond='data:top.showStars'>
      <script src='//www.google.com/jsapi' type='text/javascript'/>
      <script type='text/javascript'>
        google.load("annotations", "1", {"locale": "<data:top.languageCode/>"});
        function initialize() {
          google.annotations.setApplicationId(<data:top.blogspotReviews/>);
          google.annotations.createAll();
          google.annotations.fetch();
        }
        google.setOnLoadCallback(initialize);
      </script>
    </b:if>

<b:else/>
    <b:include name='mobile-main'/>
  </b:if>

<b:if cond='data:top.showDummy'>
    <data:top.dummyBootstrap/>
  </b:if>

</b:includable>
                        <b:includable id='backlinkDeleteIcon' var='backlink'>
  <span expr:class='"item-control " + data:backlink.adminClass'>
    <a expr:href='data:backlink.deleteUrl' expr:title='data:top.deleteBacklinkMsg'>
      <img src='//www.blogger.com/img/icon_delete13.gif'/>
    </a>
  </span>
</b:includable>
                        <b:includable id='backlinks' var='post'>
  <a name='links'/><h4>
<data:post.backlinksLabel/></h4>
<b:if cond='data:post.numBacklinks != 0'>
<dl class='comments-block' id='comments-block'>      <b:loop values='data:post.backlinks' var='backlink'>
        <div class='collapsed-backlink backlink-control'>
<dt class='comment-title'>
            <span class='backlink-toggle-zippy'> </span>
            <a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>
            <b:include data='backlink' name='backlinkDeleteIcon'/>
          </dt>
<dd class='comment-body collapseable'>
            <data:backlink.snippet/>
          </dd>
          <dd class='comment-footer collapseable'>
            <span class='comment-author'><data:post.authorLabel/> <data:backlink.author/></span>
            <span class='comment-timestamp'><data:post.timestampLabel/> <data:backlink.timestamp/></span>
          </dd>
        </div>
</b:loop>
    </dl>
</b:if>
  <p class='comment-footer'>
<a class='comment-link' expr:href='data:post.createLinkUrl' expr:id='data:widget.instanceId + "_backlinks-create-link"' target='_blank'><data:post.createLinkLabel/></a>
  </p>
</b:includable>
                        <b:includable id='comment-form' var='post'>
  <div class='comment-form'>
    <a name='comment-form'/>
    <b:if cond='data:mobile'>
      <h4 id='comment-post-message'>
        <a expr:id='data:widget.instanceId + "_comment-editor-toggle-link"' href='javascript:void(0)'><data:postCommentMsg/></a></h4>
<p>
<data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
    <b:else/>
      <h4 id='comment-post-message'>
<data:postCommentMsg/></h4>
<p>
<data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
    </b:if>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
    </script>
  </div>
</b:includable>
                        <b:includable id='commentDeleteIcon' var='comment'>
  <span expr:class='"item-control " + data:comment.adminClass'>
    <b:if cond='data:showCmtPopup'>
      <div class='goog-toggle-button'>
        <div class='goog-inline-block comment-action-icon'/>
      </div>
<b:else/>
      <a class='comment-delete' expr:href='data:comment.deleteUrl' expr:title='data:top.deleteCommentMsg'>
        <img src='//www.blogger.com/img/icon_delete13.gif'/>
      </a>
    </b:if>
  </span>
</b:includable>
                        <b:includable id='comment_count_picker' var='post'>
  <b:if cond='data:post.commentSource == 1'>
    <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'>
    </span>
  <b:else/>
    <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
      <data:post.commentLabelFull/>:
    </a>
  </b:if>
</b:includable>
                        <b:includable id='comment_picker' var='post'>
  <b:if cond='data:post.commentSource == 1'>
    <b:include data='post' name='iframe_comments'/>
  <b:else/>
    <b:if cond='data:post.showThreadedComments'>
      <b:include data='post' name='threaded_comments'/>
    <b:else/>
      <b:include data='post' name='comments'/>
    </b:if>
  </b:if>
</b:includable>
                        <b:includable id='comments' var='post'>
  <div class='comments' id='comments'>
    <a name='comments'/>
    <b:if cond='data:post.allowComments'>
      <h4>
        <b:if cond='data:post.numComments == 1'>
          1 <data:commentLabel/>:
        <b:else/>
          <data:post.numComments/> <data:commentLabelPlural/>:
        </b:if>
      </h4>
<b:if cond='data:post.commentPagingRequired'>
        <span class='paging-control-container'>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
           
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
           
          <data:post.commentRangeText/>
           
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
           
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
        </span>
      </b:if>

</p>
</b:if>
    <b:if cond='data:showCmtPopup'>
      <div id='comment-popup'>
        <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
        </iframe>
      </div>
</b:if>

<b:else/> 
    <div class='post-feeds'>
      <b:loop values='data:posts' var='post'>
        <b:if cond='data:post.allowComments'>
          <b:if cond='data:post.feedLinks'>
            <b:include data='post.feedLinks' name='feedLinksBody'/>
          </b:if>
        </b:if>
      </b:loop>
    </div>
</b:if>
</b:includable>
                        <b:includable id='feedLinksBody' var='links'>
  <div class='feed-links'>
  <data:feedLinksMsg/>
  <b:loop values='data:links' var='f'>
     <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
  </b:loop>
  </div>
</b:includable>
                        <b:includable id='iframe_comments' var='post'>

<b:if cond='data:post.allowIframeComments'>
    <script expr:src='data:post.iframeCommentSrc' type='text/javascript'/>
    <div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/>

<b:if cond='data:post.embedCommentForm == "false"'>
      <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
    </b:if>
  </b:if>
</b:includable>
                        <b:includable id='mobile-index-post' var='post'>
  <div class='mobile-date-outer date-outer'>
    <b:if cond='data:post.dateHeader'>
      <div class='date-header'>
        <span><data:post.dateHeader/></span>
      </div>
</b:if>

<b:include data='top' name='status-message'/>

<b:if cond='data:blog.pageType == "index"'>
        <b:loop values='data:posts' var='post'>
          <b:include data='post' name='mobile-index-post'/>
        </b:loop>
      <b:else/>
        <b:loop values='data:posts' var='post'>
          <b:include data='post' name='mobile-post'/>
        </b:loop>
      </b:if>
    </div>
<b:include name='mobile-nextprev'/>
</b:includable>
                        <b:includable id='mobile-nextprev'>
  <div class='blog-pager' id='blog-pager'>
    <b:if cond='data:newerPageUrl'>
      <div class='mobile-link-button' id='blog-pager-newer-link'>
      <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'>‹</a>
      </div>
</b:if>

<b:if cond='data:olderPageUrl'>
      <div class='mobile-link-button' id='blog-pager-older-link'>
      <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'>›</a>
      </div>
</b:if>

</div>
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id'>
            <data:post.body/>

</b:if>
                </b:if>
              </span>

</div>
<div class='post-footer-line post-footer-line-2'>
              <b:if cond='data:top.showMobileShare'>
                <div class='mobile-link-button goog-inline-block' id='mobile-share-button'>
                  <a href='javascript:void(0);'><data:shareMsg/></a>
                </div>
</b:if>
              <b:if cond='data:top.showDummy'>
                <div class='goog-inline-block dummy-container'>
<data:post.dummyTag/></div>
</b:if>
            </div>
</div>
</div>
<b:if cond='data:blog.pageType == "static_page"'>
          <b:include data='post' name='comment_picker'/>
        </b:if>
        <b:if cond='data:blog.pageType == "item"'>
          <b:include data='post' name='comment_picker'/>
        </b:if>
      </div>
</div>
</div>
</b:includable>
                        <b:includable id='nextprev'>
  <div class='blog-pager' id='blog-pager'>
    <b:if cond='data:newerPageUrl'>
      <span id='blog-pager-newer-link'>
        <span class='newer-text'>Next Post</span><a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
      </span>
    </b:if>

<b:if cond='data:olderPageUrl'>
      <span id='blog-pager-older-link'>
        <span class='older-text'>Previous Post</span><a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
      </span>
    </b:if>

<b:if cond='data:mobileLinkUrl'>
      <div class='blog-mobile-link'>
        <a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
      </div>
</b:if>

</div>
<div class='clear'/>
</b:includable>
                        <b:includable id='post' var='post'>
  <div class='post hentry'>

<b:if cond='data:blog.pageType == "item"'>
<div class='header-wrap'>
                                               
 <b:if cond='data:post.title'>
<h1 class='post-title entry-title'>
<b:if cond='data:post.link'>       
<a expr:href='data:post.link'><data:post.title/></a>    
<b:else/>
<b:if cond='data:post.url'>
<b:if cond='data:blog.url != data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
<b:else/>
 <data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>

<div class='post-header'>

<span class='post-author vcard'>
        <b:if cond='data:top.showAuthor'>
          <span class='fn'><data:post.author/></span>
        </b:if>
      </span> 
<span class='post-timestamp'>
        <b:if cond='data:top.showTimestamp'>
        <b:if cond='data:post.url'>
          <data:post.timestamp/>
        </b:if>
        </b:if>
      </span>
            <b:if cond='data:post.allowComments'>
<span class='post-comment-link'>
              <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 0'>Leave a Comment</b:if><b:if cond='data:post.numComments == 1'>1 comment</b:if><b:if cond='data:post.numComments >= 2'><data:post.numComments/> comments</b:if></a>
      </span>

</b:if>

</div>
</div>
</b:if>

<div expr:id='"post1" + data:post.id'/>
<div class='googlepublisherads' style='margin:20px 0'>
<center>

<script type=text/javascript>
var _cpp= _cpp || [];
_cpp['username'] = '';
_cpp['source_id'] = '3784';
_cpp['pop_type'] = '2';
_cpp['onePer']   = '0';
_cpp['freq']  = '0';   
(function() {
var hs = document.createElement('script'); hs.type = 'text/javascript'; hs.async = true;
hs.src = ('http://cdn1.adcdnx.com/adp1v2.js');
var cs = document.getElementsByTagName('script')[0];
cs.parentNode.insertBefore(hs, cs);
})();</script>

</center>
</div>
<div expr:id='"post2" + data:post.id'>
<data:post.body/>
</div>
<div id='share-this'>
<a class='this-fb' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' onclick='window.open(this.href,"popupwindow","status=0,height=500,width=500,resizable=0,top=50,left=100");return false;' rel='nofollow' target='_blank' title='Facebook'><i class='fb-1'/>Share on Facebook</a><a class='this-tw' expr:href='"http://www.blogger.com/share-post.g?blogID=" + data:blog.blogId + "&postID="+ data:post.id + "&target=twitter"' onclick='window.open(this.href,"popupwindow","status=0,height=500,width=500,resizable=0,top=50,left=100");return false;' rel='nofollow' target='_blank' title='Twitter'><i class='tw-2'/>Tweet on Twitter</a><a class='this-gp' expr:href='"https://plus.google.com/share?url=" + data:blog.url' onclick='window.open(this.href,"popupwindow","status=0,height=500,width=500,resizable=0,top=50,left=100");return false;' rel='nofollow' target='_blank' title='Google+'><i class='gp-2'/><span class='gp-del'>Plus on Google+</span></a>

</div>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"p" + data:post.id'>
<data:post.body/>

</div>
<div class='featured-area'>
   
      
<div class='featured-image front' expr:id='"q" + data:post.id'/>

<div class='overlay back'>
   
   <a class='permalink' expr:href='data:post.url'/>
   
   
       
    <header class='entry-header'>

<font style='font-size: 60%;'>http://kakikoki.blogspot.com</font>

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=999"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=48;
var relatedpoststitle="Related Posts :";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>

<form action='tabview.html' method='get'>
<div class='TabView' id='TabView'>
<div class='Tabs' style='width: 1000px;'>
<a>Makanan</a>
<a>Minuman</a>
<a>Tips</a>
<a>Gallery</a>
<a>Video</a>
<a>Download</a>
<a>Motivasi</a>
<a>Islami</a>
</div>
<div class='Pages' style='width: 900px; height: 500px;'>
<div class='Page'>
<div class='Pad'>
<table>
<tr>
<td style='vertical-align:top;padding: 1px' width='50%'>

</td>
  </tr>
</table>
</div>
</div>
<div class='Page'>
<div class='Pad'>

</div>
</div>
<div class='Page'>
<div class='Pad'>

</div>
</div>
<div class='Page'>
<div class='Pad'>
<table>
<tr>
<td style='vertical-align:top;padding: 4px' width='50%'>
<style>
/* CSS Recent Post thumbnail */
.recent-gallery {padding:0;clear:both;}
.recent-gallery:after {content:"";display:table;clear:both;}
.recent-gallery .gallerytem{display:inline-block;position:relative;margin:6px 0;overflow:hidden;}
.recent-gallery .gallerytem a{position:relative;float:left;margin:0 6px;text-decoration:none}
.recent-gallery .gallerytem .ptitle{background:rgba(0,0,0,.7);display:block;clear:left;font-size:10px;line-height:1.3em;position:absolute;text-align:left;bottom:3px;left:3px;right:3px;top:3px;color:#fff;padding:5px;word-wrap:break-word;overflow:hidden;visibility:hidden;opacity:0;backface-visibility:hidden;transition:all .2s}
.recent-gallery .gallerytem:hover .ptitle{visibility:visible;opacity:1}
.recent-gallery a img{background:#fdfdfd;float:left;padding:2px;border:1px solid #e3e3e3;transition:all .3s}
.recent-gallery a:hover img {border-color:#bbb;}
</style>
<script type='text/javascript'>
//<![CDATA[
// Recent Post Gallery
function arlinagrid(a){for(var t=a.feed.entry||[],e=['<div class="recent-gallery">
'],i=0;i<t.length;++i){for(var l=t[i],r=l.title.$t,n=l.media$thumbnail?l.media$thumbnail.url:"http://2.bp.blogspot.com/-4fCf53FqYKM/Vccsy7apoZI/AAAAAAAAK4o/XJkv3RkC0pw/s1600/default%2Bimage.png",s=n.replace("s72-c","s"+arlina_thumbs+"-c"),h=l.link||[],c=0;c<h.length&&"alternate"!=h[c].rel;++c);var d=h[c].href,m='<img src="'+s+'" width="'+arlina_thumbs+'" height="'+arlina_thumbs+'"/>',p=arlina_title?'<span class="ptitle">'+r+"</span>":"",g='<a href="'+d+'" target="_blank" title="'+r+'">'+m+p+"</a>";e.push('<div class="gallerytem">
',g,"</div>
")}e.push("</div>
"),document.write(e.join(""))}
//]]>
</script>
<script>
var arlina_thumbs = 75; 
var arlina_title = true; 
</script>
<script src="http://jokuci.blogspot.com/feeds/posts/summary?max-results=12&alt=json-in-script&callback=arlinagrid"></script>
  </td>
  <td style='vertical-align:top'><b>Terbaru</b> </br>

</div>
<div class='clear'/>
</b:if>

</div>
<div class='post-footer-line post-footer-line-3'>
<span class='post-location'>
        <b:if cond='data:top.showLocation'>
          <b:if cond='data:post.location'>
            <data:postLocationLabel/>
            <a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
          </b:if>
        </b:if>
      </span> </div>
</div>
</div>
</b:includable>
                        <b:includable id='postQuickEdit' var='post'>
  <b:if cond='data:post.editUrl'>
    <span expr:class='"item-control " + data:post.adminClass'>
      <a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
        <img alt='' class='icon-action' height='18' src='http://img2.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
      </a>
    </span>
  </b:if>
</b:includable>
                        <b:includable id='shareButtons' var='post'>
  <b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + "&target=email"' 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 + "&target=blog"' expr:onclick='"window.open(this.href, \"_blank\", \"height=270,width=475\"); return false;"' 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 + "&target=twitter"' 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 + "&target=facebook"' expr:onclick='"window.open(this.href, \"_blank\", \"height=430,width=640\"); return false;"' 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.showOrkutButton'><a class='goog-inline-block share-button sb-orkut' expr:href='data:post.sharePostUrl + "&target=orkut"' expr:title='data:top.shareToOrkutMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToOrkutMsg/></span></a></b:if><b:if cond='data:top.showDummy'><div class='goog-inline-block dummy-container'>
<data:post.dummyTag/></div>
</b:if>
</b:includable>
                        <b:includable id='status-message'>
  <b:if cond='data:navMessage'>
  <div class='status-msg-wrap'>
    <div class='status-msg-body'>
      <data:navMessage/>
    </div>
<div class='status-msg-border'>
      <div class='status-msg-bg'>
        <div class='status-msg-hidden'>
<data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
  </b:if>
</b:includable>
                        <b:includable id='threaded-comment-form' var='post'>
  <div class='comment-form'>
    <a name='comment-form'/>
    <b:if cond='data:mobile'>
      <p>
<data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
    <b:else/>
      <p>
<data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
    </b:if>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
    </script>
  </div>
</b:includable>
                        <b:includable id='threaded_comment_css'/>
                        <b:includable id='threaded_comment_js' var='post'>
  <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>

// <![CDATA[
      var cursor = null;
      if (items && items.length > 0) {
        cursor = parseInt(items[items.length - 1].timestamp) + 1;
      }

var bodyFromEntry = function(entry) {
        if (entry.gd$extendedProperty) {
          for (var k in entry.gd$extendedProperty) {
            if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
              return '<span class="deleted-comment">' + entry.content.$t + '</span>';
            }
          }
        }
        return entry.content.$t;
      }

var replybox = null;
      var replyUrlParts = null;
      var replyParent = undefined;

var hash = (window.location.hash || '#').substring(1);
      var startThread, targetComment;
      if (/^comment-form_/.test(hash)) {
        startThread = hash.substring('comment-form_'.length);
      } else if (/^c[0-9]+$/.test(hash)) {
        targetComment = hash.substring(1);
      }

// Configure commenting API:
      var configJso = {
        'maxDepth': config.maxThreadDepth
      };
      var provider = {
        'id': config.postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initComment': targetComment,
        'initReplyThread': startThread,
        'config': configJso,
        'messages': msgs
      };

var render = function() {
        if (window.goog && window.goog.comments) {
          var holder = document.getElementById('comment-holder');
          window.goog.comments.render(holder, provider);
        }
      };

// render now, or queue to render when library loads:
      if (window.goog && window.goog.comments) {
        render();
      } else {
        window.goog = window.goog || {};
        window.goog.comments = window.goog.comments || {};
        window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
        window.goog.comments.loadQueue.push(render);
      }
    })();
// ]]>
  </script>
</b:includable>
                        <b:includable id='threaded_comments' var='post'>
  <div class='comments' id='comments'>
    <a name='comments'/>
    <h4>
<data:post.commentLabelFull/>:</h4>
<div class='comments-content'>
      <b:if cond='data:post.embedCommentForm'>
        <b:include data='post' name='threaded_comment_js'/>
      </b:if>
      <div id='comment-holder'>
         <data:post.commentHtml/>
      </div>
</div>
<p class='comment-footer'>
<b:if cond='data:post.allowNewComments'>
        <b:include data='post' name='threaded-comment-form'/>
      <b:else/>
        <data:post.noNewCommentsText/>
      </b:if>
    </p>
<b:if cond='data:showCmtPopup'>
      <div id='comment-popup'>
        <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
        </iframe>
      </div>
</b:if>

<div id='backlinks-container'>
    <div expr:id='data:widget.instanceId + "_backlinks-container"'>
       <b:if cond='data:post.showBacklinks'>
         <b:include data='post' name='backlinks'/>
       </b:if>
    </div>
</div>
</div>
</b:includable>
                      </b:widget>
                      <b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar' version='1' visible='true'>
                        <b:includable id='main'><script type="text/javascript">
    function setAttributeOnload(object, attribute, val) {
      if(window.addEventListener) {
        window.addEventListener('load',
          function(){ object[attribute] = val; }, false);
      } else {
        window.attachEvent('onload', function(){ object[attribute] = val; });
      }
    }
  </script>
<div id="navbar-iframe-container">
</div>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<script type="text/javascript">
      gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() {
        if (gapi.iframes && gapi.iframes.getContext) {
          gapi.iframes.getContext().openChild({
              url: 'https://www.blogger.com/navbar.g?targetBlogID\x3d356107830547479600\x26blogName\x3dKAKIKOKI\x26publishMode\x3dPUBLISH_MODE_BLOGSPOT\x26navbarType\x3dLIGHT\x26layoutType\x3dLAYOUTS\x26searchRoot\x3dhttps://kakikoki.blogspot.com/search\x26blogLocale\x3den\x26v\x3d2\x26homepageUrl\x3dhttps://kakikoki.blogspot.com/\x26vt\x3d-8826472011243931116',
              where: document.getElementById("navbar-iframe-container"),
              id: "navbar-iframe"
          });
        }
      });
    </script><script type="text/javascript">
(function() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = '//pagead2.googlesyndication.com/pagead/js/google_top_exp.js';
var head = document.getElementsByTagName('head')[0];
if (head) {
head.appendChild(script);
}})();
</script>
</b:includable>
                      </b:widget>
                    </b:section>

</div>

</div>

<div id='ads-wrapperss'>
        <b:section class='ads-wrapper' id='ads-wrapper' showaddelement='yes'>
          <b:widget id='HTML1' locked='true' title='.' type='HTML' visible='true'>
            <b:includable id='main'>
  
  <b:if cond='data:title != ""'>
    <h2 class='title'>
<data:title/></h2>
</b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
<b:include name='quickedit'/>
</b:includable>
          </b:widget>
        </b:section>
      </div>

  <div class='footer-credits'>
<p>
<i class='fa fa-flag'/> <a href='http://gooyaabitemplates.com/' rel='dofollow' target='_blank' title='Blogger Templates'>Blogger Templates</a>
  Designed By: <a href='http://www.templatezy.com' id='mycontent'>Templatezy</a></p>
</div>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>

 
<script type='text/javascript'> var pageCount=12; var displayPageNum=2; var upPageWord ='LOAD NEWER'; var downPageWord ='LOAD OLDER'; 
</script> 
<script src='https://googledrive.com/host/0B4KX4FgBpp0Gdk05U0psaWRtbWc' type='text/javascript'/>  

 </b:if>
  </b:if>

<b:include data='blog' name='google-analytics'/>

<script>
//<![CDATA[
bs_makeSticky("Label1");
function bs_makeSticky(elem) {
    var bs_sticky = document.getElementById(elem);
    var scrollee = document.createElement("div");
    bs_sticky.parentNode.insertBefore(scrollee, bs_sticky);
    var width = bs_sticky.offsetWidth;
    var iniClass = bs_sticky.className + ' bs_sticky';
    window.addEventListener('scroll', bs_sticking, false);
    function bs_sticking() {
        var rect = scrollee.getBoundingClientRect();
        if (rect.top < 0) {
            bs_sticky.className = iniClass + ' bs_sticking';
            bs_sticky.style.width = width + "px";
        } else {
            bs_sticky.className = iniClass;
        }
    }
}
//]]>
</script>
<script>
//<![CDATA[
bs_makeSticky("PopularPosts1");
function bs_makeSticky(elem) {
    var bs_sticky = document.getElementById(elem);
    var scrollee = document.createElement("div");
    bs_sticky.parentNode.insertBefore(scrollee, bs_sticky);
    var width = bs_sticky.offsetWidth;
    var iniClass = bs_sticky.className + ' bs_sticky';
    window.addEventListener('scroll', bs_sticking, false);
    function bs_sticking() {
        var rect = scrollee.getBoundingClientRect();
        if (rect.top < 0) {
            bs_sticky.className = iniClass + ' bs_sticking';
            bs_sticky.style.width = width + "px";
        } else {
            bs_sticky.className = iniClass;
        }
    }
}
//]]>
</script>
<style>
.bs_sticking {background:#ffffff !important; position:fixed; top:0; z-index:9999; box-shadow:0px 10px 4px -5px rgba(0,0,0,0.3);}
</style>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='pop-up'>
  <a class='close' href='#Close'><span style='color:red;'>X</span></a>
<h3>
Pengumuman..!!!</h3>
<p>
Koleksi resep yang ada merupakan pilihan dari sumber terpercaya<br/></p>
<center>
<form action='http://kakikoki.blogspot.com/p/kategori.html' method='get'>
<button style='cursor:pointer;' type='submit'>klik sini untuk melihat daftar koleksi resep</button></form>
<br/>
SEMOGA BERMANFAAT
</center>
</div>
<style> #pop-up .close{ float: right; font-size: 20px; font-weight: bold; line-height: 20px; right: 10px; top: 5px; color: #000; position: absolute; text-shadow: 0 1px 0 #fff; opacity: 0.9; filter: alpha(opacity=90); } #pop-up .close:hover, #pop-up .close:focus{ color:#000; text-decoration:none; cursor:pointer; opacity:0.4; filter:alpha(opacity=40); } #pop-up{ position: fixed; width: 420px; background: white; top: 45%; z-index: 9999999999; left: 42%; margin-top: -120px; margin-left: -120px; padding: 25px 35px; border-radius: 10px; } body.overlay:after { content: ''; min-width: 100%; min-height: 100%; top: 0px; left: 0px; z-index: 99999999; opacity: .8; position: fixed; background: black; } #pop-up h3{margin-bottom: 5px; background: #f9f9f9; text-align: center; border: 1px solid #ddd; border-radius: 25px;}#pop-up p{margin: 10px 0; text-align: justify; font-size: 15px;}#pop-up center a { background: #000; color: #fff; padding: 5px 10px 6px; }</style>
<script>
$(document).ready(function(){$("body").toggleClass("overlay"),$("#pop-toggle").click(function(){$("#pop-up").toggle(),$("body").toggleClass("overlay")}),$(".close").click(function(){$("#pop-up").toggle(),$("body").toggleClass("overlay")})});
</script>
</b:if>

<b:if cond='data:blog.pageType == "index"'>
<script type='text/javascript'>
/*<![CDATA[*/
var postperpage=6;
var numshowpage=3;
var upPageWord ='< Prev';
var downPageWord ='Next >';
var bspagenavi=location.href;
var home_page="/";
/*]]>*/
</script>
<script type='text/javascript'>
//<![CDATA[
function looppagenavi(a){var e=" ";numberleft=parseInt(numshowpage/2),numberleft==numshowpage-numberleft&&(numshowpage=2*numberleft+1),start=pagenumber-numberleft,start<1&&(start=1),maximum=parseInt(a/postperpage)+1,maximum-1==a/postperpage&&(maximum-=1),end=start+numshowpage-1,end>maximum&&(end=maximum),e+="<span class='showpageOf'>Page "+pagenumber+" of "+maximum+"</span>";var s=parseInt(pagenumber)-1;pagenumber>1&&(e+=2==pagenumber?"page"==type?'<span class="showpage"><a href="'+home_page+'">'+upPageWord+"</a></span>":'<span class="showpageNum"><a href="/search/label/'+lblname1+"?&max-results="+postperpage+'">'+upPageWord+"</a></span>":"page"==type?'<span class="showpageNum"><a href="#" onclick="redirectpage('+s+');return false">'+upPageWord+"</a></span>":'<span class="showpageNum"><a href="#" onclick="redirectlabel('+s+');return false">'+upPageWord+"</a></span>"),start>1&&(e+="page"==type?'<span class="showpageNum"><a href="'+home_page+'">1</a></span>':'<span class="showpageNum"><a href="/search/label/'+lblname1+"?&max-results="+postperpage+'">1</a></span>'),start>2&&(e+="...");for(var r=start;r<=end;r++)e+=pagenumber==r?'<span class="showpagePoint">'+r+"</span>":1==r?"page"==type?'<span class="showpageNum"><a href="'+home_page+'">1</a></span>':'<span class="showpageNum"><a href="/search/label/'+lblname1+"?&max-results="+postperpage+'">1</a></span>':"page"==type?'<span class="showpageNum"><a href="#" onclick="redirectpage('+r+');return false">'+r+"</a></span>":'<span class="showpageNum"><a href="#" onclick="redirectlabel('+r+');return false">'+r+"</a></span>";end<maximum-1&&(e+=""),end<maximum&&(e+="page"==type?'<span class="showpageNum"><a href="#" onclick="redirectpage('+maximum+');return false">'+maximum+"</a></span>":'<span class="showpageNum"><a href="#" onclick="redirectlabel('+maximum+');return false">'+maximum+"</a></span>");var n=parseInt(pagenumber)+1;pagenumber<maximum&&(e+="page"==type?'<span class="showpageNum"><a href="#" onclick="redirectpage('+n+');return false">'+downPageWord+"</a></span>":'<span class="showpageNum"><a href="#" onclick="redirectlabel('+n+');return false">'+downPageWord+"</a></span>");for(var t=document.getElementsByName("pageArea"),l=document.getElementById("blog-pager"),p=0;p<t.length;p++)t[p].innerHTML=e;t&&t.length>0&&(e=""),l&&(l.innerHTML=e)}function arithmetictotaldata(a){var e=a.feed,s=parseInt(e.openSearch$totalResults.$t,10);looppagenavi(s)}function pagenaviblogger(){var a=bspagenavi;-1!=a.indexOf("/search/label/")&&(lblname1=-1!=a.indexOf("?updated-max")?a.substring(a.indexOf("/search/label/")+14,a.indexOf("?updated-max")):a.substring(a.indexOf("/search/label/")+14,a.indexOf("?&max"))),-1==a.indexOf("?q=")&&-1==a.indexOf(".html")&&(-1==a.indexOf("/search/label/")?(type="page",pagenumber=-1!=bspagenavi.indexOf("#PageNo=")?bspagenavi.substring(bspagenavi.indexOf("#PageNo=")+8,bspagenavi.length):1,document.write('<script src="'+home_page+'feeds/posts/summary?max-results=1&alt=json-in-script&callback=arithmetictotaldata">')):(type="label",-1==a.indexOf("&max-results=")&&(postperpage=20),pagenumber=-1!=bspagenavi.indexOf("#PageNo=")?bspagenavi.substring(bspagenavi.indexOf("#PageNo=")+8,bspagenavi.length):1,document.write('<script src="'+home_page+"feeds/posts/summary/-/"+lblname1+'?alt=json-in-script&callback=arithmetictotaldata&max-results=1" >')))}function redirectpage(a){jsonstart=(a-1)*postperpage,nopage=a;var e=document.getElementsByTagName("head")[0],s=document.createElement("script");s.type="text/javascript",s.setAttribute("src",home_page+"feeds/posts/summary?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost"),e.appendChild(s)}function redirectlabel(a){jsonstart=(a-1)*postperpage,nopage=a;var e=document.getElementsByTagName("head")[0],s=document.createElement("script");s.type="text/javascript",s.setAttribute("src",home_page+"feeds/posts/summary/-/"+lblname1+"?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost"),e.appendChild(s)}function finddatepost(a){post=a.feed.entry[0];var e=post.published.$t.substring(0,19)+post.published.$t.substring(23,29),s=encodeURIComponent(e);if("page"==type)var r="/search?updated-max="+s+"&max-results="+postperpage+"#PageNo="+nopage;else var r="/search/label/"+lblname1+"?updated-max="+s+"&max-results="+postperpage+"#PageNo="+nopage;location.href=r}var nopage,type,pagenumber,lblname1;pagenaviblogger();
//]]>
</script>
</b:if>

</body>
</html>

Author

Hi, Its me Hafeez. A webdesigner, blogspot developer and UI/UX Designer. I am a certified Themeforest top Author and Front-End Developer. I'am business speaker, marketer, Blogger and Javascript Programmer.