AJAX RELATED POST WIDGET

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML expr:dir='data:blog.languageDirection'>
<head>
<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if>
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
<meta expr:content='data:blog.metaDescription' name='description'/>
<link href='//netdna.bootstrapcdn.com/font-awesome/3.2.0/css/font-awesome.min.css' rel='stylesheet'/>

<b:skin><![CDATA[/*
-----------------------------------------------

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

/* Variable definitions
====================
<Variable name="textcolor" description="Text Color" type="color" default="#333" value="#333333"/>
<Variable name="linkcolor" description="Link Color" type="color" default="#09ABF7" value="#09ABF7"/>
<Variable name="visitedlinkcolor" description="Visited Link Color" type="color" default="#999" value="#999999"/>
<Variable name="hoverlinkcolor" description="Hover Link Color" type="color" default="#141414" value="#141414"/>
<Variable name="sidebartextcolor" description="Sidebar Text Color" type="color" default="#666" value="#666666"/>
<Variable name="bodyfont" description="Text Font" type="font" default="normal normal 12px Verdana, Geneva, sans-serif" value="normal normal 12px Verdana, Geneva, sans-serif"/>
<Variable name="headerfont" description="Heading Font" type="font" default="normal normal 12px Georgia, Times, 'Times New Roman', serif" value="normal normal 12px Georgia, Times, 'Times New Roman', serif"/>
<Variable name="startSide" description="Side where text starts in blog language" type="automatic" default="left" value="left"/>
<Variable name="endSide" description="Side where text ends in blog language" type="automatic" default="right" value="right"/>
<Group description="Main Color" selector="#outer-wrapper">
<Variable name="main.content.color" description="Content Area Color" type="color" default="#FAFAFA" value="#FAFAFA"/>
<Variable name="main.head.color" description="Header Color" type="color" default="#202020" value="#202020"/>
<Variable name="main.foot.color" description="Footer Color" type="color" default="#202020" value="#202020"/>
<Variable name="main.headco.color" description="Head Foot Border Color" type="color" default="#09ABF7" value="#09ABF7"/>
</Group>
<Group description="Header Area" selector="#header">
<Variable name="head.title.font" description="Title Font" type="font" default="normal normal 35px Georgia, Times, 'Times New Roman', serif" value="normal normal 35px Georgia, Times, 'Times New Roman', serif"/>
<Variable name="head.desc.font" description="Description Font" type="font" default="normal normal 100% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 100% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif"/>
<Variable name="head.title.color" description="Title Color" type="color" default="#09ABF7" value="#09ABF7"/>
<Variable name="head.desc.color" description="Description Color" type="color" default="#F8F8F8" value="#F8F8F8"/>
</Group>
<Group description="Menu Color" selector="#nav">
<Variable name="menu.text.color" description="Text Color" type="color" default="#FFFFFF" value="#FFFFFF"/>
<Variable name="menu.bor.color" description="Top Border Color" type="color" default="#000" value="#000000"/>
<Variable name="menu.sub.color" description="Sub Menu Color" type="color" default="#202020" value="#202020"/>
<Variable name="menu.subsub.color" description="Sub Sub Menu Color" type="color" default="#3C3C3C" value="#3C3C3C"/>
</Group>
<Group description="Post and Sidebar Area" selector="#content-wrapper .widget">
<Variable name="poside.back.color" description="Background Color" type="color" default="#FFFFFF" value="#FFFFFF"/>
<Variable name="poside.border.color" description="Border Color" type="color" default="#D5D5D5" value="#D5D5D5"/>
<Variable name="poside.head.color" description="Date FeatDesc and Button" type="color" default="#09ABF7" value="#09ABF7"/>
<Variable name="poside.texthe.color" description="Text Header Color" type="color" default="#333333" value="#333333"/>
</Group>
<Group description="Footer Area" selector="#footer-wrapper">
<Variable name="foot.border.color" description="Border Color" type="color" default="#000000" value="#000000"/>
<Variable name="foot.text.color" description="Text Color" type="color" default="#BBBBBB" value="#BBBBBB"/>
<Variable name="foot.head.color" description="Header Text Color" type="color" default="#09ABF7" value="#09ABF7"/>
</Group>
<Group description="Button and Featured" selector="#outer-wrapper">
<Variable name="oth.butacv.color" description="Button and Feat Color" type="color" default="#FFF" value="#FFFFFF"/>
</Group>

*/

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

header, nav, section, aside, article, footer {display:block;}

/* Use this with templates/template-twocol.html */

body {
background:$(main.content.color);
margin:0;
padding:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size
/* */:/**/

small;
font-size:/**/

small;
text-align:center;
}

a:link {
color:$linkcolor;
text-decoration:none;
}

a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}

a:hover {
color:$hoverlinkcolor;
text-decoration:underline;
}

a img {
border-width:0;
}

/* Header
-----------------------------------------------
*/

#header-wrapper {
margin:0 auto 0;
color:$(menu.text.color);
width:300px;
height:100%;
overflow:hidden;
}

#header {
color:$(head.title.color);
margin:0;
}

#header h1,
#header p {
margin:5px 5px 0;
padding:0;
text-transform:uppercase;
font:$(head.title.font);
}

#header a {
color:$(head.title.color);
text-decoration:none;
}

#header a:hover {
color:$(head.title.color);
}

#header .description {
margin:0 5px 5px;
padding:0;
text-transform:capitalize;
line-height:1.4em;
font:$(head.desc.font);
color:$(head.desc.color);
}

#header img {
margin-$startSide:0;
margin-$endSide:auto;
max-width:100%;
max-height:100%;
}

.scdown #header h1,
.scdown #header p {
margin-top:2px;
}

/* Headings
----------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6,
.post-summary strong,
ul.rcentpost .inner > strong,
.PopularPosts .item-title,
#search-result strong,
#related_posts .jdlunya strong,
.featpost .titlex,
.xitem1 {
font:$headerfont;
text-transform:none;
margin:0;
}

h1 {
font-size:200%;
}

h2 {
font-size:170%;
}

h3 {
font-size:150%;
}

h4 {
font-size:130%;
}

h5 {
font-size:120%;
}

h6 {
font-size:110%;
}

/* Navigation
----------------------------------------------- */

#mobilenav,
.index #blog-pager,
.archive #blog-pager,
.scdown .descriptionwrapper,
.index .post-footer,
.archive .post-footer,
.post-more-link,
.post-summary p,
.rcentpost p,
.rcbytag.s .comnum,
.rcbytag.h .a0 .comnum,
.rcbytag.v .a0 .comnum,
#sidebar-tengah .widget-content:before,
#topfeaturedmanual .widget > h2,
#topfeaturedmanual .widget .caption,
#topfeaturedmanual .Image,
#Blog1 > .status-msg-wrap {
display:none;
}

#nav,
#header-wrapper {
float:$startSide;
}

.sf-menu,
.sf-menu * {
margin:0;
padding:0;
list-style:none;
}

#nav,
#topsomenu .isi,
.sf-menu li,
a.thumbimgx,
.index #main,
.archive #main,
.index .post,
.archive .post,
#main-wrapper,
#main-atas .sidebar .widget,
#main-atas .widget-content,
.rcentpost li,
#view a,
.sf-menu a.home,
#searchnya button,
.rcentpost .comnum,
.rcentpost .date,
#sidebar-tengah .list-tabwrap,
#sidebar-tengah,
#sidebar-wrapper .widget-content,
#sidebar-wrapper .widget,
.footer .widget > h2,
.featuredpost,
.post-body blockquote,
.item .post,
.static_page .post,
#related_posts,
#comments,
#related_posts li,
.error-custom,
.error_page .blog-posts.hfeed {
position:relative;
}

.sf-menu ul {
position:absolute;
display:none;
top:100%;
left:0;
z-index:99;
}

.sf-menu > li {
float:$startSide;
margin:0 1px;
}

.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
display:block;
}

.sf-menu a {
display:block;
position:relative;
}

.sf-menu ul ul {
top:0;
left:100%;
}

.sf-menu {
float:$startSide;
}

.sf-menu ul {
min-width:12em;
*width:12em;
}

.sf-menu a {
padding:0 10px;
height:78px;
line-height:78px;
text-decoration:none;
zoom:1;
}

.scdown .sf-menu > li > a {
height:48px;
line-height:48px;
}

.sf-menu a.home {
padding:0 10px 0 30px;
border-top:2px solid $(main.headco.color);
}

.sf-menu a {
color:$(menu.text.color);
font-size:11px;
}

.sf-menu li {
white-space:nowrap;
*white-space:normal;
-moz-transition:background-color .2s;
-webkit-transition:background-color .2s;
transition:background-color .2s;
position:relative;
}

.sf-menu ul li {
background-color:$(menu.sub.color);
margin:1px 0;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}

.sf-menu ul a {
font-weight:normal;
height:30px;
line-height:30px;
}

.sf-menu ul a:hover {
padding-left:12px;
}

.sf-menu ul ul li {
background:$(menu.subsub.color);
margin:0 0 1px 2px;
}

.sf-menu > li > a {
border-top:2px solid $(main.head.color);
}

.sf-menu li:hover > a,
.sf-menu li.sfHover,
.sf-menu > li > a.current {
-moz-transition:none;
-webkit-transition:none;
transition:none;
}

.sf-menu > li:hover > a,
.sf-menu > li > a.current {
border-top:2px solid $(main.headco.color);
}

.sf-arrows .sf-with-ul {
padding-right:2em;
*padding-right:1em;
}

.sf-arrows .sf-with-ul:after,
.jcarousel-prev:before,
.jcarousel-next:before,
.nav-arrows a:before {
content:'';
position:absolute;
top:50%;
right:0.75em;
margin-top:-1px;
height:0;
width:0;
border:4px solid transparent;
border-top-color:$(menu.text.color);
}

.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
border-top-color:$(menu.text.color);
}

.sf-arrows ul .sf-with-ul:after {
margin-top:-4px;
margin-right:-3px;
border-color:transparent;
border-left-color:$(menu.text.color);
}

.sf-arrows ul li > .sf-with-ul:focus:after,
.sf-arrows ul li:hover > .sf-with-ul:after,
.sf-arrows ul .sfHover > .sf-with-ul:after {
border-left-color:$(menu.text.color);
}

.sf-menu li > i {
position:absolute;
top:5px;
right:3px;
width:27px;
height:22px;
cursor:pointer;
display:none;
background-color:$(main.headco.color);
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
outline:0;
}

.sf-menu li > i:after {
content:'+';
color:$(menu.text.color);
font-size:19px;
position:absolute;
left:5px;
top:-2px;
}

.sf-menu li > i.active:after {
content:'-';
font-size:36px;
top:-14px;
}

/* Social Icon */

#socialicon {
float:$startSide;
width:230px;
padding:5px 0;
}

#socialicon ul,
#socialicon li {
padding:0;
margin:0;
list-style:none;
}

#socialicon li {
float:$startSide;
margin:0 2px;
}

#socialicon a {
display:block;
text-indent:-9999px;
width:24px;
height:24px;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEichJB2YZ3eWMgZFdpHcc0aLSyW_L8lObnxAUKGxqD1M9kJKWPHzUMcabl_v4CFjpoUOLhi-Th5_NOnHtnwB_S120sfEbExI3F5TCFEYqapbhpdog0N8VH6irs3P8yKD5KJSXgVk4LqGpY/s1600/soicon.png);
background-position:-1px 0;
background-repeat:no-repeat;
position:relative;
}

#socialicon a:active {
top:1px;
}

#socialicon .fbx {
background-position:-1px 0;
}

#socialicon .twix {
background-position:-27px 0;
}

#socialicon .goex {
background-position:-53px 0;
}

#socialicon .linx {
background-position:-131px;
}

#socialicon .pinx {
background-position:-79px 0;
}

#socialicon .drix {
background-position:-157px;
}

#socialicon .vmex {
background-position:-183px 0;
}

#socialicon .rssx {
background-position:-105px;
}

#topmenu {
overflow:hidden;
padding:0 5px;
color:$(menu.text.color);
font-size:90%;
}

#topmenu .tgltop {
float:$startSide;
height:26px;
line-height:26px;
padding:4px 6px;
}

#topbutton {
position:absolute;
right:15px;
top:35px;
outline:0;
margin-top:-70px;
width:26px;
height:23px;
background-color:$(main.headco.color);
cursor:pointer;
}

#topbutton:before {
border-width:6px 13px;
border-style:solid;
top:100%;
border-color:$(main.headco.color) $(main.headco.color) transparent $(main.headco.color);
}

#topbutton:after {
content:'';
position:absolute;
top:50%;
height:0;
left:6px;
width:0;
border:7px solid transparent;
border-top-color:$(menu.text.color);
}

#topbutton.active:after {
border-color:transparent;
border-bottom-color:$(menu.text.color);
margin-top:-7px;
}

#areahead.scdown {
-moz-box-shadow:0 2px 8px rgba(0,0,0,0.53);
-webkit-box-shadow:0 2px 8px rgba(0,0,0,0.53);
box-shadow:0 2px 8px rgba(0,0,0,0.53);
}

/* Search Box and Result */

#searchnya {
float:$endSide;
}

#searchnya input {
width:120px;
margin:6px 0 0;
background-color:$(menu.text.color);
color:$(main.head.color);
}

#searchnya input,
#searchnya button {
border:0;
-moz-border-radius:1px;
-webkit-border-radius:1px;
border-radius:1px;
display:inline-block;
outline:0;
font-size:10px;
padding:5px 10px;
}

#searchnya button {
background-color:transparent;
margin-right:5px;
cursor:pointer;
color:$(menu.text.color);
text-indent:-9999px;
}

#search-result {
padding:8px 10px;
margin:10px 0;
width:280px;
height:auto;
position:absolute;
top:27px;
right:10px;
z-index:99;
display:none;
color:$(menu.text.color);
}

#search-result * {
margin:0 0 0 0;
padding:0 0 0 0;
}

#search-result h4,
#search-result strong {
display:block;
margin:0 30px 10px 0;
font-size:12px;
}

#search-result ol {
list-style:none;
overflow:hidden;
max-height:450px;
}

#search-result ol:hover {
overflow:auto;
}

#search-result ol a:hover {
text-decoration:underline;
}

#search-result .close {
text-decoration:none;
display:block;
position:absolute;
top:4px;
font-size:18px;
right:10px;
line-height:normal;
color:$(menu.text.color);
}

#search-result li {
padding:5px 0;
}

#search-result strong {
margin:0 0 3px 0;
display:block;
}

#search-result img {
float:$startSide;
display:block;
margin:0 5px 0 0;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}

#search-result p {
font-size:90%;
}

#search-result {
background-color:$(main.head.color);
border:1px solid $(menu.bor.color);
}

.sf-menu a.home:before,
#searchnya button:before,
#view a:before,
.post-footer a.timestamp-link:before,
.post-footer .post-author.vcard .fn:before,
.post-footer .comment-link:before,
.post-footer .post-labels > span:before,
.rcentpost .date:before,
.rcentpost .comnum:before,
#mobilenav:before,
.post-body blockquote:before,
.comments .comments-content .icon.blog-author:before,
#mobilenav:before {
position:absolute;
font-family:FontAwesome;
font-weight:normal;
font-style:normal;
text-decoration:inherit;
-webkit-font-smoothing:antialiased;
}

.sf-menu a.home:before,
#searchnya button:before,
#view a:before {
text-indent:0;
}

.sf-menu a.home:before {
width:30px;
height:30px;
}

.sf-menu a.home:before {
content:"\f015";
top:0;
font-size:18px;
left:6px;
}

#searchnya button:before {
content:"\f002";
top:2px;
left:1px;
color:$(menu.text.color);
font-size:19px;
display:block;
}

/* Layout Setting
----------------------------------------------- */

body#layout .list-tabwrap,
body#layout #topfeatured,
body#layout #mainmidtengah,
body#layout #mainmidtengah2,
body#layout #footer-wrapper {
overflow:hidden;
}

body#layout .sidebarmd-widget {
float:$startSide;
width:33.3%;
}

body#layout ul.navtab {
display:none;
}

body#layout #topfeatured .add_widget,
body#layout #topfeatured .widget,
body#layout #topfeatured .dropregion {
width:18%;
float:$startSide;
}

body#layout #main-atas .half {
width:50%;
float:$startSide;
}

body#layout #topfeatured .widget.Image .widget-content {
height:3em;
}

body#layout #topfeatured .widget.Image {
padding:0;
}

body#layout #footer-wrapper .grid {
float:$startSide;
width:25%;
}

body#layout #topfeatured .Image {
display:block;
}

body#layout #header-wrapper {
width:50%;
}

/* Main Color
----------------------------------------------- */

#areahead {
border-top:1px solid $(menu.bor.color);
height:80px;
margin-top:35px;
background-color:$(main.head.color);
z-index:8;
}

#topsomenu {
background-color:$(main.head.color);
height:35px;
z-index:9;
}

#areacontent {
background-color:$(main.content.color);
padding-top:140px;
}

#areahead,
#topsomenu {
width:100%;
position:fixed;
}

#areahead .isi {
height:100%;
}

#areafooter,
#credit {
background-color:$(main.foot.color);
}

#areafooter {
border-top:3px solid $(main.headco.color);
}

/* Outer-Wrapper
----------------------------------------------- */

#outer-wrapper {
background-color:$(main.content.color);
margin:0 auto;
padding:0;
text-align:$startSide;
font:$bodyfont;
}

#outer-wrapper .isi {
width:100%;
max-width:1100px;
margin:0 auto;
}

#main-atas {
width:68%;
float:$startSide;
word-wrap:break-word;
/* fix for long text breaking sidebar float in IE */

overflow:hidden;
/* fix for long non-text content breaking IE sidebar float */;
}

#sidebar-wrapper {
width:32%;
float:$endSide;
word-wrap:break-word;
/* fix for long text breaking sidebar float in IE */

overflow:hidden;
/* fix for long non-text content breaking IE sidebar float */;
}

#sidebar-wrapper .innerwrap,
#main-atas .innerwrap {
padding:10px;
}

/* Content Area
-----------------------------------------------
*/

.index #main,
.archive #main {
padding:12px 8px;
}

.index #main,
.archive #main,
.index #main:before,
.archive #main:before,
.menu-xitem,
#main-atas .widget-content,
#main-atas .widget-content:before,
#main-atas .sidebar .widget > h2,
a.thumbxtag,
#sidebar-wrapper .widget-content,
#sidebar-tengah .list-tabwrap,
#sidebar-wrapper .sidebar .widget > h2,
#sidebar-wrapper .widget-content:before,
#sidebar-tengah .list-tabwrap:before,
.navtab,
.item .post,
.static_page .post,
.breadcrumbs,
.item .post:before,
.static_page .post:before,
#related_posts,
#related_posts:before,
#comments,
#comments:before,
.blog-posts.hfeed .inline-ad,
.error-custom,
.error-custom:before {
background-color:$(poside.back.color);
border:1px solid $(poside.border.color);
}

.loadpager,
.datex,
.morepostag,
.rcbytag.s .date,
.rcbytag.v .a0 .date,
.rcbytag.h .a0 .date,
#related_posts .date {
position:absolute;
}

.loadpager,
.morepostag {
bottom:0;
right:0;
}

.loadpager a,
.morepostag a {
text-indent:-9999px;
display:block;
width:0;
height:0;
border-width:22px 22px;
border-style:solid;
border-color:transparent $(poside.head.color) $(poside.head.color) transparent;
}

.loadpager a:before,
.morepostag a:before {
content:"+";
position:absolute;
text-indent:0;
color:$(oth.butacv.color);
right:3px;
bottom:2px;
font-size:23px;
}

.index #main-wrapper,
.archive #main-wrapper,
#main-atas .sidebar .widget,
#sidebar-wrapper .widget,
#sidebar-tengah {
z-index:0;
margin-bottom:25px;
}

.index #main:before,
.archive #main:before,
#main-atas .widget-content:before,
#sidebar-tengah .list-tabwrap:before,
#sidebar-wrapper .widget-content:before,
.item .post:before,
.static_page .post:before,
#related_posts:before,
#comments:before,
.error-custom:before {
content:"";
position:absolute;
left:5px;
height:30px;
right:5px;
bottom:-9px;
z-index:-1;
}

.menu-xitem,
#main-atas .sidebar .widget > h2,
#sidebar-wrapper .sidebar .widget > h2,
#related_posts h4,
#comments > h4 {
border-bottom:0;
position:relative;
height:35px;
}

.xitem1 {
line-height:34px;
font-size:160%;
}

#view {
float:$startSide;
height:35px;
text-align:center;
padding:0 8px 0 5px;
}

#view a {
display:block;
height:17px;
text-indent:-9999px;
width:20px;
color:$(poside.border.color);
outline:0;
text-decoration:none;
}

#view a.active {
color:$(poside.head.color);
}

#view a:before {
top:2px;
left:3px;
font-size:14px;
}

#view a.list:before {
content:"\f00b";
}

#view a.grid:before {
content:"\f00a";
}

.menu-xitem:after,
#main-atas .sidebar .widget > h2:after,
#sidebar-wrapper .sidebar .widget > h2:after,
#related_posts h4:after,
#comments > h4:after {
content:"";
position:absolute;
height:1px;
width:87px;
bottom:-1px;
right:0;
z-index:1;
background-color:$(poside.head.color);
}

#main-atas .widget-content,
#sidebar-wrapper .widget-content {
padding:10px 12px;
}

#main-atas .sidebar .widget > h2,
#sidebar-wrapper .sidebar .widget > h2,
#related_posts h4,
#comments > h4 {
padding:0 12px;
line-height:35px;
font-size:160%;
color:$(poside.texthe.color);
}

#main-atas .sidebar .widget > h2 a,
#sidebar-wrapper .sidebar .widget > h2 a {
text-decoration:none;
}

#main-atas .half {
width:50%;
float:$startSide;
}

.half:first-child .widget {
margin-right:8px;
}

.half:last-child .widget {
margin-left:8px;
}

#mainmidtengah,
#mainmidtengah2,
.rcentpost li,
.rcbytag.h,
.jcarousel-clip-horizontal {
overflow:hidden;
}

/* Posts
-----------------------------------------------
*/

.index .post-outer,
.archive .post-outer {
width:33.3%;
float:$startSide;
}

.index .post,
.archive .post {
padding:0 5px;
}

.index .post h2.post-title,
.archive .post h2.post-title {
position:absolute;
left:-9999px;
}

a.thumbimgx {
display:block;
height:160px;
overflow:hidden;
padding:5px;
border:1px solid $(poside.border.color);
}

a.thumbimgx img {
width:100%;
height:100%;
}

.post-body {
line-height:1.6em;
}

.datex,
.rcbytag.s .date,
.rcbytag.v .a0 .date,
.rcbytag.h .a0 .date,
#related_posts .date {
top:0;
left:20px;
background-color:$(poside.head.color);
color:$(oth.butacv.color);
padding:5px 3px;
text-align:center;
font-size:9px;
}

.datex span,
.datex strong,
.rcbytag.s .date strong,
.rcbytag.s .date span,
.rcbytag.v .a0 .date strong,
.rcbytag.v .a0 .date span,
.rcbytag.h .a0 .date strong,
.rcbytag.h .a0 .date span,
#related_posts .date strong,
#related_posts .date span {
display:block;
}

.datex strong,
.rcbytag.s .date strong,
.rcbytag.h .a0 .date strong,
.rcbytag.v .a0 .date strong,
#related_posts .date strong {
font-size:18px;
}

.datex:before,
.datex:after,
.rcbytag.s .date:before,
.rcbytag.s .date:after,
.rcbytag.v .a0 .date:before,
.rcbytag.h .a0 .date:before,
.rcbytag.v .a0 .date:after,
.rcbytag.h .a0 .date:after,
#topbutton:before,
#related_posts .date:before,
#related_posts .date:after {
position:absolute;
content:"";
width:0;
height:0;
}

.datex:before,
.datex:after,
.rcbytag.s .date:before,
.rcbytag.s .date:after,
.rcbytag.v .a0 .date:before,
.rcbytag.h .a0 .date:before,
.rcbytag.v .a0 .date:after,
.rcbytag.h .a0 .date:after,
#related_posts .date:before,
#related_posts .date:after {
border-width:5px 10px;
border-style:solid;
top:100%;
}

.datex:before,
.rcbytag.s .date:before,
.rcbytag.v .a0 .date:before,
.rcbytag.h .a0 .date:before,
#related_posts .date:before {
border-color:$(poside.head.color) transparent transparent $(poside.head.color);
left:0;
}

.datex:after,
.rcbytag.s .date:after,
.rcbytag.v .a0 .date:after,
.rcbytag.h .a0 .date:after,
#related_posts .date:after {
border-color:$(poside.head.color) $(poside.head.color) transparent transparent;
right:0;
}

.post:hover .datex,
.rcbytag.s li:hover .date,
.rcbytag.v .a0:hover .date,
.rcbytag.h .a0:hover .date {
padding-top:8px;
}

.post-summary strong {
display:block;
margin:5px 0 15px;
line-height:1.4em;
font-size:120%;
overflow:hidden;
height:40px;
}

.post-summary strong a {
text-decoration:none;
}

.index .post-outer.list,
.archive .post-outer.list {
width:auto;
float:none;
}

.list .post {
padding:0 0 15px;
}

.list a.thumbimgx {
width:200px;
float:$startSide;
margin:0 10px 0 0;
}

.list .post-summary strong {
height:auto;
overflow:visible;
font-size:170%;
}

.list .post-summary p,
.list .post-more-link,
.list .post-footer {
display:block;
}

.post-more-link {
text-align:$endSide;
margin:0 5px 10px 0;
}

ul.rcentpost .inner > strong a,
.post-summary strong a {
text-decoration:none;
color:$hoverlinkcolor;
}

.post-footer-line.post-footer-line-1 > div {
display:inline-block;
font-size:10px;
}

.post-more-link a {
display:inline-block;
padding:4px 7px;
text-decoration:none;
color:$(oth.butacv.color);
background-color:$(poside.head.color);
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}

.post-footer-line.post-footer-line-1 > div.post-share-buttons {
margin:10px 0 0;
padding:0 6px;
display:block;
}

.post-footer .goog-inline-block.dummy-container {
overflow:hidden;
width:36px;
}

.post-footer {
padding:5px;
border:1px solid $(poside.border.color);
}

.post-footer a {
color:$linkcolor;
text-decoration:none;
}

.post-footer a.timestamp-link,
.post-footer .post-author.vcard .fn,
.post-footer .comment-link,
.post-footer .post-labels > span {
position:relative;
padding:0 8px 0 20px;
line-height:20px;
height:20px;
display:inline-block;
color:$linkcolor;
margin-right:5px;
}

.post-footer a.timestamp-link:before,
.post-footer .post-author.vcard .fn:before,
.post-footer .comment-link:before,
.post-footer .post-labels > span:before {
font-size:14px;
left:4px;
}

.post-footer a.timestamp-link:before {
content:"\f017";
}

.post-footer .post-author.vcard .fn:before {
content:"\f007";
}

.post-footer .comment-link:before {
content:"\f0e6";
font-size:15px;
left:3px;
}

.post-footer .post-labels > span:before {
content:"\f02c";
left:2px;
}

.item .post,
.static_page .post,
.error-custom {
padding:5px 10px;
margin-bottom:25px;
}

.item #main-wrapper,
.static_page #main-wrapper {
z-index:0;
}

.breadcrumbs {
padding:5px;
margin-bottom:8px;
font-size:90%;
}

.item .post h1.post-title,
.static_page .post h2.post-title,
.error-custom h2 {
font-size:200%;
margin-bottom:10px;
padding:0 0 5px;
border-bottom:1px solid $(poside.border.color);
}

.item .post h1.post-title a,
.static_page .post h2.post-title a {
text-decoration:none;
}

.post-body h1,
.post-body h2,
.post-body h3,
.post-body h4,
.post-body h5,
.post-body h6 {
margin-bottom:10px;
}

.post-body h1 {
font-size:180%;
}

.post-body h2 {
font-size:160%;
}

.post-body h3 {
font-size:140%;
}

.post-body h4 {
font-size:130%;
}

.post-body h5 {
font-size:120%;
}

.post-body h6 {
font-size:110%;
}

.post-body .left {
float:$startSide;
margin:0 10px 5px 0;
}

.post-body .right {
float:$endSide;
margin:0 0 5px 10px;
}

.post-body .center {
margin:10px 0 15px 0;
display:block;
text-align:center;
}

.post-body blockquote {
padding-left:40px;
margin:20px;
font-size:110%;
line-height:1.6em;
}

.post-body blockquote:before {
content:"\f10d";
left:0;
top:5px;
font-size:30px;
}

.item .post-body,
.static_page .post-body,
.error-custom {
line-height:1.6em;
}

.item .post-body img,
.static_page .post-body img {
padding:3px;
border:1px solid $(poside.border.color);
}

.post-body iframe {
max-width:100%;
}

.error-custom {
padding-bottom:150px;
}
.index .blog-posts.hfeed, .archive .blog-posts.hfeed {
overflow: hidden;
}
.error_page .blog-posts.hfeed {
z-index:0;
}
.post-footer span.blog-admin, .post-footer span.pid-1748668997 {
display: block;
text-align: right;
}
.index #blog-pager, .archive #blog-pager {
padding: 5px 0;
text-align: left;
}
.showpagePoint, .showpageNum a {
display: inline-block;
padding: 8px 10px;
text-decoration: none;
background-color: $(poside.head.color);
margin-right: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
color: $(poside.back.color);
position:relative;
}
.showpagePoint, .showpageNum a:hover {
text-decoration: none;
background-color: $(main.foot.color);
}
.showpageNum a:active {
top:1px;
}

/* Comments
----------------------------------------------- */

#comments .comments-content,
.comment-form {
padding:0 15px;
}

.comment-form {
max-width:100%;
}

.comments.threaded_commentsnya .comment-form {
border:0;
background-color:transparent;
padding:0;
}

.comments p.comment-footer {
margin:0;
padding:10px;
}

.comments p.comment-footer a,
.comments .comment-form {
display:block;
margin-top:-18px;
}

.comments.threaded_commentsnya p.comment-footer {
display:none;
}

.boxcommentnya {
margin-bottom:17px;
padding:0 15px;
}

.comments .avatar-image-container {
max-height:42px;
width:42px;
padding:3px;
border:1px solid $(poside.border.color);
}

.comments .inline-thread .avatar-image-container {
width:36px;
height:36px;
}

.comments .avatar-image-container img {
max-width:100%;
width:100%;
height:100%;
}

.comments .comment-block {
margin-left:59px;
}

.comments .inline-thread .comment-block {
margin-left:53px;
}

.comments .comments-content .comment-replies {
margin-left:53px;
}

.comments .comments-content .inline-thread {
border:1px solid $(poside.border.color);
border-left:2px solid $(poside.head.color);
}

.comments .continue a,
.comments .inline-thread #form-wrapper {
border:1px solid $(poside.border.color);
-moz-box-shadow:inset 0 3px 13px $(poside.border.color);
-webkit-box-shadow:inset 0 3px 13px $(poside.border.color);
box-shadow:inset 0 3px 13px $(poside.border.color);
}

.comments .inline-thread #form-wrapper {
padding:10px 15px;
margin-bottom:15px;
}

.comments .comments-content .datetime {
margin-left:6px;
font-size:80%;
float:$endSide;
}

.comments .comments-content .comment-content {
line-height:1.5em;
}

.comments .comments-content .icon.blog-author:before {
content:"\f007";
top:0;
left:1px;
font-size:17px;
color:$linkcolor;
}

#comments-block.avatar-comment-indent {
margin-left:55px;
}

#comments-block .avatar-image-container {
left:-55px;
width:40px;
height:40px;
top:0;
}

#comments-block .avatar-image-container img {
border:0;
}

.commentarea {
border:1px solid $(poside.border.color);
border-left:2px solid $(poside.head.color);
margin-bottom:15px;
padding:5px 10px;
position:relative;
}

.commentarea .datecm {
float:$endSide;
font-size:90%;
}

#comments-block.avatar-comment-indent dd.comment-footer {
text-align:$endSide;
}

#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
}

#googlePlusComment,
.cmt_iframe_holder {
width:100% !important;
}

#comments-block .comment-author {
margin:.5em 0;
}

#comments-block .comment-body {
margin:.25em 0 0;
}

#comments-block .comment-footer {
margin:0;
line-height:1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}

#comments-block .comment-body p {
margin:0 0 .75em;
}

.deleted-comment {
font-style:italic;
color:gray;
}

#blog-pager-newer-link {
float:$startSide;
}

#blog-pager-older-link {
float:$endSide;
}

.pager-isi {
overflow:hidden;
}

.pager-isi a,
.pager-isi .linkgrey {
width:50%;
display:block;
float:$startSide;
padding:10px 0;
font-size:120%;
text-decoration:none;
}

.pager-isi h5,
.pager-isi h6 {
margin:0;
font-weight:normal;
}

.pager-isi h6 {
font-size:130%;
}

.pager-isi h5 {
font-size:100%;
}

a.blog-pager-newer-link {
text-align:$startSide;
position:relative;
}

a.blog-pager-newer-link h6,
a.blog-pager-newer-link h5 {
padding-left:20px;
}

a.blog-pager-older-link {
text-align:$endSide;
position:relative;
}

a.blog-pager-older-link h6,
a.blog-pager-older-link h5 {
padding-right:20px;
}

.pager-isi .linkgrey.left {
text-align:$startSide;
}

.pager-isi .linkgrey.right {
text-align:$endSide;
}

a.blog-pager-newer-link:after,
a.blog-pager-older-link:after {
content:"";
width:0;
height:0;
border-width:8px 6px;
border-style:solid;
position:absolute;
top:50%;
margin-top:-8px;
}

a.blog-pager-newer-link:after {
border-color:transparent $linkcolor transparent transparent;
left:0;
}

a.blog-pager-older-link:after {
border-color:transparent transparent transparent $linkcolor;
right:0;
}

.feed-links {
display:none;
}

.blog-posts.hfeed .inline-ad {
margin-top:15px;
text-align:center;
padding:10px 2px;
overflow:hidden;
}

/* Sidebar Content
----------------------------------------------- */

.sidebar {
color:$sidebartextcolor;
line-height:1.5em;
}

.sidebar ul,
.footer ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}

.sidebar li,
.footer li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:10px;
line-height:1.5em;
}

#sidebar-tengah .widget > h2 {
display:none;
}

#sidebar-tengah .widget-content {
border:0;
background-color:transparent;
}

#sidebar-tengah .widget {
margin-bottom:0;
}

.navtab,
.navtab li {
padding:0;
margin:0;
list-style:none;
}

.navtab li {
float:$startSide;
width:33.3%;
text-align:center;
line-height:35px;
}

.navtab {
overflow:hidden;
border-bottom:0;
}

.navtab a {
display:block;
text-decoration:none;
color:$sidebartextcolor;
height:35px;
border-bottom:1px solid $(poside.border.color);
}

.navtab a.current {
color:$(poside.head.color);
border-bottom:1px solid $(poside.head.color);
}

#sidebar-tengah .list-tabwrap {
border-top:0;
}

/* Profile
----------------------------------------------- */

.profile-img {
width:70px;
height:70px;
padding:3px;
border:1px solid $(poside.border.color);
margin:0 5px 5px 0;
}

.profile-link {
float:$endSide;
font-style:italic;
}

dd.profile-data {
font-style:italic;
}

/* Footer
----------------------------------------------- */

#footer-wrapper .row {
overflow:hidden;
}

.row .grid {
float:$startSide;
width:25%;
}

.footer {
padding:0 10px;
}

.footer .widget {
margin:15px 0;
}

#credit {
text-align:center;
padding:10px 0;
border-top:1px solid $(menu.bor.color);
font-size:90%;
}

.footer .widget > h2 {
margin:0 0 10px;
padding:8px 0;
font-size:130%;
font-weight:normal;
color:$(foot.head.color);
}

#footer-wrapper,
#credit {
color:$(foot.text.color);
}

.footer li {
padding-left:8px;
}

.footer .widget > h2:after,
.footer .widget > h2:before {
content:"";
position:absolute;
top:100%;
height:1px;
}

.footer .widget > h2:after {
background-color:$(foot.border.color);
left:0;
width:100%;
}

.footer .widget > h2:before {
right:0;
width:50px;
background-color:$(foot.head.color);
z-index:1;
}

/* Effect
----------------------------------------------- */

a.thumbimgx img,
a.thumbxtag img,
a.kmtimg img,
.PopularPosts .item-thumbnail img {
-webkit-transition:all 0.7s ease;
-moz-transition:all 0.7s ease;
-ms-transition:all 0.7s ease;
-o-transition:all 0.7s ease;
transition:all 0.7s ease;
}

a img:hover {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity:0.7;
opacity:0.7;
}

#areahead.scdown {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter:alpha(opacity=90);
-moz-opacity:0.9;
-khtml-opacity:0.9;
opacity:0.9;
}

#Header1 img:hover,
.featpost li > a img:hover {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity:1;
opacity:1;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"] {
border:1px solid $(poside.border.color);
padding:5px 8px;
outline:0;
display:inline-block;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}

input[type="submit"],
input[type="button"],
button {
border:0;
padding:6px 8px;
outline:0;
color:$(oth.butacv.color);
background-color:$(poside.head.color);
display:inline-block;
cursor:pointer;
position:relative;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}

input[type="submit"]:active,
input[type="button"]:active,
button:active {
top:1px;
}

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

.FollowByEmail .follow-by-email-inner {
padding:15px 0;
}

.FollowByEmail .follow-by-email-inner .follow-by-email-address {
padding:1px 0;
text-indent:8px;
border:1px solid $(poside.border.color);
}

.FollowByEmail .follow-by-email-inner .follow-by-email-submit {
background-color:$(poside.head.color);
}

.PopularPosts .item-thumbnail {
width:55px;
height:55px;
}

.PopularPosts .item-thumbnail,
a.kmtimg img {
padding:3px;
border:1px solid $(poside.border.color);
}

.footer .PopularPosts .item-thumbnail,
.footer a.kmtimg img,
.footer .FollowByEmail .follow-by-email-inner .follow-by-email-address,
.footer .profile-img {
border:1px solid $(foot.border.color);
}

.PopularPosts .item-thumbnail img {
width:100%;
height:100%;
}

.PopularPosts .item-title {
font-size:120%;
}

.rcomnetxx,
.rcomnetxx li {
padding:0;
list-style:none;
margin:0;
}

.rcomnetxx li {
overflow:hidden;
padding-bottom:8px;
}

a.kmtimg img {
float:$startSide;
margin:0 5px 5px 0;
}

.rcomnetxx .date {
font-size:80%;
}

.rcomnetxx p {
margin:5px 0 0;
}

/* Widget
----------------------------------------------- */

.rcentpost,
.rcentpost li {
list-style:none;
padding:0;
margin:0;
}

a.thumbxtag {
padding:3px;
float:$startSide;
width:65px;
height:65px;
margin:0 5px 5px 0;
}

a.thumbxtag img {
width:100%;
height:100%;
}

.rcbytag.s a.thumbxtag,
.rcbytag.v .a0 a.thumbxtag,
.rcbytag.h .a0 a.thumbxtag {
display:block;
padding:5px;
float:none;
width:auto;
height:160px;
margin:0 0 10px;
}

.rcbytag.s a.thumbxtag {
height:140px;
}

.rcbytag.v .a0 p,
.rcbytag.h .a0 p {
display:block;
}

.rcbytag.h li {
width:50%;
float:$endSide;
}

.rcbytag.h li.a0 {
float:$startSide;
}

.rcbytag.h .inner {
padding:0 5px;
}

.rcbytag.h li.a0 .inner {
padding-left:0;
}

.rcbytag.s ul {
width:1100px;
}

.rcbytag.s li {
width:200px;
float:$startSide;
}

.rcbytag.s .inner {
padding:0 5px;
}

.morepostag a:before {
bottom:6px;
}

.rcbytag.s .date strong,
.rcbytag.h .a0 .date strong,
.rcbytag.v .a0 .date strong,
#related_posts .date strong {
line-height:22px;
font-weight:bold;
padding:0;
}

.rcbytag.s .date span,
.rcbytag.h .a0 .date span,
.rcbytag.v .a0 .date span,
#related_posts .date span {
line-height:12px;
padding:0;
}

ul.rcentpost .inner > strong {
font-size:120%;
}

.rcbytag.h .a0 .inner > strong,
.rcbytag.v .a0 .inner > strong {
font-size:140%;
}

.rcentpost .date,
.rcentpost .comnum {
padding-left:16px;
margin-right:5px;
}

.rcentpost .date:before,
.rcentpost .comnum:before {
left:3px;
top:-3px;
font-size:11px;
}

.rcentpost .date:before {
content:"\f133";
}

.rcentpost .comnum:before {
content:"\f075";
}

.info {
font-size:10px;
}

.info strong,
.info span {
padding:0 3px 0 1px;
font-weight:normal;
}

.jcarousel-prev,
.jcarousel-next {
width:30px;
height:30px;
position:absolute;
top:-43px;
cursor:pointer;
background-color:$(poside.head.color);
}

.jcarousel-prev-disabled,
.jcarousel-next-disabled {
background-color:$(poside.border.color);
cursor:initial;
}

.jcarousel-prev {
right:30px;
}

.jcarousel-next {
right:-5px;
}

.jcarousel-prev:before,
.jcarousel-next:before {
border:5px solid transparent;
margin-top:-4px;
}

.jcarousel-prev:before {
border-color:transparent;
border-right-color:$(oth.butacv.color);
right:13px;
}

.jcarousel-next:before {
border-color:transparent;
border-left-color:$(oth.butacv.color);
right:7px;
}

.rcentpost .comnum a {
text-decoration:none;
color:$sidebartextcolor;
}

.Label li {
float:$startSide;
background-color:$(poside.head.color);
color:$(oth.butacv.color);
padding:5px 8px;
margin:0 2px 2px 0;
}

.Label li a {
color:$(oth.butacv.color);
}

.footer .Label li {
padding:4px 4px;
font-size:90%;
}

/* Featured Post
----------------------------------------------- */

#botfeaturedauto h2 {
display:none;
}

.featuredpost {
width:98%;
max-width:650px;
margin:0 auto;
height:400px;
z-index:0;
}

.featpost {
margin:10px auto;
position:relative;
overflow:hidden;
width:100%;
height:320px;
list-style-type:none;
padding:0;
}

.featpost li {
margin:0;
padding:0;
display:none;
width:100%;
}

.featpost li > a {
outline:none;
}

.featpost li > a img {
border:none;
}

.featpost li > a.feathumb {
display:block;
height:100%;
}

.featpost img {
max-width:100%;
width:100%;
display:block;
height:100%;
}

.sb-description {
padding:10px;
bottom:10px;
left:10px;
right:10px;
z-index:5;
position:absolute;
background:$(poside.head.color);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter:alpha(opacity=0);
opacity:0;
color:$(oth.butacv.color);
-webkit-transition:all 200ms;
-moz-transition:all 200ms;
-o-transition:all 200ms;
-ms-transition:all 200ms;
transition:all 200ms;
}

.featpost li.sb-current .sb-description {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter:alpha(opacity=80);
opacity:0.8;
}

.featpost li.sb-current .sb-description:hover {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter:alpha(opacity=90);
opacity:0.9;
}

.sb-perspective {
position:relative;
}

.sb-perspective > div {
position:absolute;
-webkit-transform-style:preserve-3d;
-moz-transform-style:preserve-3d;
-o-transform-style:preserve-3d;
-ms-transform-style:preserve-3d;
transform-style:preserve-3d;
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
-o-backface-visibility:hidden;
-ms-backface-visibility:hidden;
backface-visibility:hidden;
}

.sb-side {
margin:0;
display:block;
position:absolute;
-moz-backface-visibility:hidden;
-webkit-transform-style:preserve-3d;
-moz-transform-style:preserve-3d;
-o-transform-style:preserve-3d;
-ms-transform-style:preserve-3d;
transform-style:preserve-3d;
}

.shadow {
width:100%;
height:168px;
position:relative;
margin-top:-110px;
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQDt1leqQrotuE6OXkpdAMMbBuumWk4YrD9Xo9WyqnId1qstCVMj1I4Mej4uJtsXu53wh84ucqugpCd3VLgZvCKV3Y_ijO65DwV7NYNVSEsjnULmKeQqRzry91BLB55p11lVrBHJoZ5ETk/s736/shadow.png) no-repeat bottom center;
background-size:100% 100%;
z-index:-1;
display:none;
}

.nav-dots {
text-align:center;
position:absolute;
bottom:-5px;
height:30px;
width:100%;
left:0;
display:none;
}

.nav-dots span {
display:inline-block;
width:16px;
height:16px;
border-radius:50%;
margin:3px;
background:$(poside.head.color);
cursor:pointer;
box-shadow:0 1px 1px rgba(255,255,255,0.6),inset 0 1px 1px rgba(0,0,0,0.1);
}

.nav-dots span.nav-dot-current {
box-shadow:0 1px 1px rgba(255,255,255,0.6),inset 0 1px 1px rgba(0,0,0,0.1),inset 0 0 0 3px $(poside.head.color),inset 0 0 0 8px $(oth.butacv.color);
}

.nav-arrows {
display:none;
}

.nav-arrows a {
width:42px;
height:42px;
background:$(poside.head.color);
position:absolute;
top:50%;
left:-52px;
text-indent:-9000px;
cursor:pointer;
margin-top:-62px;
opacity:0.9;
border-radius:50%;
box-shadow:0 1px 1px rgba(255,255,255,0.8);
}

.nav-arrows a:first-child {
left:auto;
right:-52px;
background-position:top right;
}

.featpost .titlex {
font-size:170%;
}

.featpost .titlex a {
color:$(oth.butacv.color);
text-decoration:none;
}

.sb-description p {
margin:10px 0 0;
}

.nav-arrows a:before {
border:8px solid transparent;
margin-top:-7px;
}

.nav-arrows a:before {
border-color:transparent;
border-right-color:$(oth.butacv.color);
right:18px;
}

.nav-arrows a:first-child:before {
border-color:transparent;
border-left-color:$(oth.butacv.color);
right:8px;
}

#topfeaturedmanual .widget {
width:650px;
margin:0 auto;
}

#topfeaturedmanual .Image:first-child {
display:block;
}

/* Related Post
----------------------------------------------- */

#related_posts {
line-height:1.4em;
margin-bottom:25px;
}

#related_posts ul,
#related_posts li {
list-style:none;
padding:0;
margin:0;
}

#related_posts ul {
width:1200px;
overflow:hidden;
padding:10px 0;
}

#related_posts li {
width:175px;
float:$startSide;
height:150px;
overflow:hidden;
}

#related_posts .inner {
padding:0 5px;
}

#related_posts h4,
#comments > h4 {
border-bottom:1px solid $(poside.border.color);
}

#related_posts .gmbrrltd {
display:block;
overflow:hidden;
height:140px;
padding:4px;
border:1px solid $(poside.border.color);
}

#related_posts .gmbrrltd,
#related_posts .date {
-webkit-transition:margin-top 0.7s ease;
-moz-transition:margin-top 0.7s ease;
-ms-transition:margin-top 0.7s ease;
-o-transition:margin-top 0.7s ease;
transition:margin-top 0.7s ease;
}

#related_posts .gmbrrltd img {
width:100%;
height:100%;
}

#related_posts .inner strong {
font-size:120%;
line-height:1.3em;
display:block;
overflow:hidden;
max-height:54px;
padding:0 4px;
}

#related_posts p {
margin:10px 0 0;
padding:0 4px;
}

#related_posts a {
text-decoration:none;
}

#related_posts li:hover .gmbrrltd,
#related_posts li:hover .date {
margin-top:-150px;
}

#related_posts .jcarousel-container {
padding:10px 0;
}

#related_posts .jcarousel-prev,
#related_posts .jcarousel-next {
top:-34px;
}

#related_posts .jcarousel-prev {
right:40px;
}

#related_posts .jcarousel-next {
right:5px;
}

#related_posts .loadingxx {
width:100%;
}

/* Other
----------------------------------------------- */

.loadingxx {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8FvF_kKfdtDZAGe5uu4b9PhGwyVS1Fh1SqRLDU1RTZ-p5qSZRElZRM5-08BAEG4qGKpOLsefZ_a5egqcL39lmC7SOeVuqxKgabEVflTd_Il_NPFF92zVp5hua_bxPTaIXKIFIMk-JIr4/s1600/progress_ani.gif);
background-repeat:no-repeat;
background-position:50% 50%;
height:150px;
}

#top {
position:fixed;
right:10px;
bottom:10px;
cursor:pointer;
width:40px;
height:40px;
background-color:$(poside.head.color);
text-indent:-9999px;
display:none;
}

#top span {
position:absolute;
top:50%;
left:50%;
margin-left:-8px;
margin-top:-12px;
height:0;
width:0;
border:8px solid transparent;
border-bottom-color:$(oth.butacv.color);
}

/* Responsive
----------------------------------------------- */

@media only screen and (max-width:1024px) {
.rcbytag.s a.thumbxtag,
#related_posts .gmbrrltd {
height:160px;
}
#related_posts li {
height:170px;
width:221px;
}
#related_posts li:hover .gmbrrltd {
margin-top:-170px;
}
#related_posts .inner strong {
max-height:60px;
font-size:130%;
}
}

@media only screen and (max-width:979px) {
#outer-wrapper .isi {
width:768px;
}
#main-atas {
width:60%;
}
#sidebar-wrapper {
width:40%;
}
.index .post-outer,
.archive .post-outer,
.row .grid {
width:50%;
}
#main-atas .half,
.rcbytag.h li,
.rcbytag.h li.a0 {
float:none;
width:auto;
}
.half:first-child .widget {
margin-right:0;
}
.half:last-child .widget {
margin-left:0;
}
#mobilenav {
display:block;
position:absolute;
right:10px;
top:-61px;
text-indent:-9999px;
width:40px;
height:40px;
background-color:$(main.headco.color);
color:$(menu.text.color);
text-decoration:none;
}
#mobilenav.active {
color:$(main.head.color);
}
.scdown #mobilenav {
top:-46px;
right:50px;
}
#nav {
width:100%;
height:100%;
}
#menunav,
.sf-menu a.home:before,
.sf-menu ul,
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
display:none;
}
#menunav {
position:absolute;
top:0;
padding:0 8px;
left:10px;
right:10px;
background-color:$(main.head.color);
border-bottom:2px solid $(main.headco.color);
}
.sf-menu > li,
#menunav {
float:none;
}
.sf-menu a,
.scdown .sf-menu > li > a {
height:30px;
line-height:30px;
}
.sf-menu > li:hover > a,
.sf-menu > li > a.current,
.sf-menu > li > a {
border-top:0;
}
.sf-menu ul,
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
position:static;
}
.sf-menu a.home {
padding:0 10px;
}
#mobilenav:before {
content:"\f0c9";
top:5px;
text-indent:0;
left:7px;
font-size:30px;
}
}

@media only screen and (max-width:767px) {
#outer-wrapper .isi {
width:480px;
}
#main-atas,
#sidebar-wrapper,
.row .grid {
width:100%;
float:none;
}
.post-body iframe {
max-height:450px;
}
#header img {
margin-left:auto;
}
.nav-arrows a {
top:auto;
left:15px;
margin-top:0;
bottom:5px;
}
.nav-arrows a:first-child {
right:15px;
}
.featuredpost {
height:380px;
}
.featpost {
height:300px;
}
}

@media only screen and (max-width:479px) {
#outer-wrapper .isi {
width:320px;
}
.index .post-outer,
.archive .post-outer {
width:100%;
float:none;
}
.separator a {
float:none !important;
margin:0 auto 15px !important;
}
table.tr-caption-container {
float:none !important;
margin:0 auto 10px !important;
padding:0;
}
.post-body .left,
.post-body .right {
float:none;
display:block;
text-align:center;
margin:10px 0 15px;
}
.post-body iframe {
max-height:300px;
}
.featuredpost {
height:360px;
}
.featpost {
height:280px;
}
#header-wrapper {
width:220px;
}
.sb-description p {
display:none;
}
#topsomenu {
height:70px;
}
#areahead {
margin-top:70px;
}
#areacontent {
padding-top:175px;
}
#searchnya,
#socialicon li,
#socialicon {
float:none;
}
#socialicon {
width:auto;
text-align:center;
}
#socialicon li {
display:inline-block;
}
#topbutton {
top:70px;
margin-top:-105px;
}
#searchnya input {
margin-top:5px;
width:220px;
}
#searchnya {
text-align:center;
}
#search-result {
top:100%;
text-align:$startSide;
}
#topbutton {
margin-top:-105px;
}
#header h1,
#header p {
margin-top:0;
}
}

@media only screen and (max-width:319px) {
#outer-wrapper .isi {
width:100%;
}
}
]]></b:skin>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script class='jshilang' type='text/javascript'>
// Lightweight `auto read-more` hack for Blogger using `Textarea` by Taufik Nurrohman modif by MKR
// URL: https://plus.google.com/108949996304093815163/about
//<![CDATA[
var configSummary = {
thumbnailSize: "s200-p", // Define the post thumbnail size
summaryLength: 300, // Define the summary length
BackupImage: 'http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s72-c/grey.gif' // Backup image if post don't have image
};
//]]>
</script>
</b:if></b:if>
<script class='jshilang' type='text/javascript'>
//<![CDATA[
// Lightweight `auto read-more` hack for Blogger using `Textarea` by Taufik Nurrohman modif by MKR
// URL: https://plus.google.com/108949996304093815163/about
function createPostSummary(s,r,k){var u,h,j,q,m,p,t=document,n=configSummary,g=t.getElementById(s).value,e=t.getElementById(r),o=k,c=jQuery("#"+s),i=c.parents(".post"),l=i.find(".post-title.entry-title a").text();e.innerHTML=g;j=e.getElementsByTagName("img");h=e.getElementsByTagName("iframe");if(j.length===0&&h.length===0){q=n.BackupImage}else{if(j.length===0&&h.length>0){m=h[0].src;if(m.indexOf("youtube.com")!=-1||m.indexOf("youtu.be")!=-1){p=m.match(/(\?v=|\&v=|\/\d\/|\/embed\/|\/v\/|\.be\/)([a-zA-Z0-9\-\_]+)/);q="http://img.youtube.com/vi/"+p[2]+"/0.jpg"}else{q=n.BackupImage}}else{var q=j[0].src.replace(/\/s[0-9]+(\-c)?\//,"/"+n.thumbnailSize+"/")}}u=g.replace(/<(.*?)>/g,"").replace(/[\n\r]+/g," ");e.innerHTML='<a class="thumbimgx" title="'+l+'" href="'+o+'"><img class="post-thumbnail" src="'+q+'" alt="'+l+'"></a><strong><a class="titlex" href="'+o+'">'+l+"</a></strong><p>"+u.substring(0,n.summaryLength)+"…</p>"};

// JQuery easing 1.3
jQuery.easing.jswing=jQuery.easing.swing;jQuery.extend(jQuery.easing,{def:"easeOutQuad",swing:function(e,f,a,h,g){return jQuery.easing[jQuery.easing.def](e,f,a,h,g)},easeInQuad:function(e,f,a,h,g){return h*(f/=g)*f+a},easeOutQuad:function(e,f,a,h,g){return -h*(f/=g)*(f-2)+a},easeInOutQuad:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f+a}return -h/2*((--f)*(f-2)-1)+a},easeInCubic:function(e,f,a,h,g){return h*(f/=g)*f*f+a},easeOutCubic:function(e,f,a,h,g){return h*((f=f/g-1)*f*f+1)+a},easeInOutCubic:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f+a}return h/2*((f-=2)*f*f+2)+a},easeInQuart:function(e,f,a,h,g){return h*(f/=g)*f*f*f+a},easeOutQuart:function(e,f,a,h,g){return -h*((f=f/g-1)*f*f*f-1)+a},easeInOutQuart:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f+a}return -h/2*((f-=2)*f*f*f-2)+a},easeInQuint:function(e,f,a,h,g){return h*(f/=g)*f*f*f*f+a},easeOutQuint:function(e,f,a,h,g){return h*((f=f/g-1)*f*f*f*f+1)+a},easeInOutQuint:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f*f+a}return h/2*((f-=2)*f*f*f*f+2)+a},easeInSine:function(e,f,a,h,g){return -h*Math.cos(f/g*(Math.PI/2))+h+a},easeOutSine:function(e,f,a,h,g){return h*Math.sin(f/g*(Math.PI/2))+a},easeInOutSine:function(e,f,a,h,g){return -h/2*(Math.cos(Math.PI*f/g)-1)+a},easeInExpo:function(e,f,a,h,g){return(f==0)?a:h*Math.pow(2,10*(f/g-1))+a},easeOutExpo:function(e,f,a,h,g){return(f==g)?a+h:h*(-Math.pow(2,-10*f/g)+1)+a},easeInOutExpo:function(e,f,a,h,g){if(f==0){return a}if(f==g){return a+h}if((f/=g/2)<1){return h/2*Math.pow(2,10*(f-1))+a}return h/2*(-Math.pow(2,-10*--f)+2)+a},easeInCirc:function(e,f,a,h,g){return -h*(Math.sqrt(1-(f/=g)*f)-1)+a},easeOutCirc:function(e,f,a,h,g){return h*Math.sqrt(1-(f=f/g-1)*f)+a},easeInOutCirc:function(e,f,a,h,g){if((f/=g/2)<1){return -h/2*(Math.sqrt(1-f*f)-1)+a}return h/2*(Math.sqrt(1-(f-=2)*f)+1)+a},easeInElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return -(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e},easeOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return g*Math.pow(2,-10*h)*Math.sin((h*k-i)*(2*Math.PI)/j)+l+e},easeInOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k/2)==2){return e+l}if(!j){j=k*(0.3*1.5)}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}if(h<1){return -0.5*(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e}return g*Math.pow(2,-10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j)*0.5+l+e},easeInBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*(f/=h)*f*((g+1)*f-g)+a},easeOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*((f=f/h-1)*f*((g+1)*f+g)+1)+a},easeInOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}if((f/=h/2)<1){return i/2*(f*f*(((g*=(1.525))+1)*f-g))+a}return i/2*((f-=2)*f*(((g*=(1.525))+1)*f+g)+2)+a},easeInBounce:function(e,f,a,h,g){return h-jQuery.easing.easeOutBounce(e,g-f,0,h,g)+a},easeOutBounce:function(e,f,a,h,g){if((f/=g)<(1/2.75)){return h*(7.5625*f*f)+a}else{if(f<(2/2.75)){return h*(7.5625*(f-=(1.5/2.75))*f+0.75)+a}else{if(f<(2.5/2.75)){return h*(7.5625*(f-=(2.25/2.75))*f+0.9375)+a}else{return h*(7.5625*(f-=(2.625/2.75))*f+0.984375)+a}}}},easeInOutBounce:function(e,f,a,h,g){if(f<g/2){return jQuery.easing.easeInBounce(e,f*2,0,h,g)*0.5+a}return jQuery.easing.easeOutBounce(e,f*2-g,0,h,g)*0.5+h*0.5+a}});

//jCarousel - Riding carousels with jQuery by Jan Sorgalla http://sorgalla.com/jcarousel/
(function(g){var q={vertical:!1,rtl:!1,start:1,offset:1,size:null,scroll:3,visible:null,animation:"normal",easing:"swing",auto:0,wrap:null,initCallback:null,setupCallback:null,reloadCallback:null,itemLoadCallback:null,itemFirstInCallback:null,itemFirstOutCallback:null,itemLastInCallback:null,itemLastOutCallback:null,itemVisibleInCallback:null,itemVisibleOutCallback:null,animationStepCallback:null,buttonNextHTML:"<div></div>",buttonPrevHTML:"<div></div>",buttonNextEvent:"click",buttonPrevEvent:"click", buttonNextCallback:null,buttonPrevCallback:null,itemFallbackDimension:null},m=!1;g(window).bind("load.jcarousel",function(){m=!0});g.jcarousel=function(a,c){this.options=g.extend({},q,c||{});this.autoStopped=this.locked=!1;this.buttonPrevState=this.buttonNextState=this.buttonPrev=this.buttonNext=this.list=this.clip=this.container=null;if(!c||c.rtl===void 0)this.options.rtl=(g(a).attr("dir")||g("html").attr("dir")||"").toLowerCase()=="rtl";this.wh=!this.options.vertical?"width":"height";this.lt=!this.options.vertical? this.options.rtl?"right":"left":"top";for(var b="",d=a.className.split(" "),f=0;f<d.length;f++)if(d[f].indexOf("jcarousel-skin")!=-1){g(a).removeClass(d[f]);b=d[f];break}a.nodeName.toUpperCase()=="UL"||a.nodeName.toUpperCase()=="OL"?(this.list=g(a),this.clip=this.list.parents(".jcarousel-clip"),this.container=this.list.parents(".jcarousel-container")):(this.container=g(a),this.list=this.container.find("ul,ol").eq(0),this.clip=this.container.find(".jcarousel-clip"));if(this.clip.size()===0)this.clip= this.list.wrap("<div></div>").parent();if(this.container.size()===0)this.container=this.clip.wrap("<div></div>").parent();b!==""&&this.container.parent()[0].className.indexOf("jcarousel-skin")==-1&&this.container.wrap('<div class=" '+b+'"></div>');this.buttonPrev=g(".jcarousel-prev",this.container);if(this.buttonPrev.size()===0&&this.options.buttonPrevHTML!==null)this.buttonPrev=g(this.options.buttonPrevHTML).appendTo(this.container);this.buttonPrev.addClass(this.className("jcarousel-prev"));this.buttonNext= g(".jcarousel-next",this.container);if(this.buttonNext.size()===0&&this.options.buttonNextHTML!==null)this.buttonNext=g(this.options.buttonNextHTML).appendTo(this.container);this.buttonNext.addClass(this.className("jcarousel-next"));this.clip.addClass(this.className("jcarousel-clip")).css({position:"relative"});this.list.addClass(this.className("jcarousel-list")).css({overflow:"hidden",position:"relative",top:0,margin:0,padding:0}).css(this.options.rtl?"right":"left",0);this.container.addClass(this.className("jcarousel-container")).css({position:"relative"}); !this.options.vertical&&this.options.rtl&&this.container.addClass("jcarousel-direction-rtl").attr("dir","rtl");var j=this.options.visible!==null?Math.ceil(this.clipping()/this.options.visible):null,b=this.list.children("li"),e=this;if(b.size()>0){var h=0,i=this.options.offset;b.each(function(){e.format(this,i++);h+=e.dimension(this,j)});this.list.css(this.wh,h+100+"px");if(!c||c.size===void 0)this.options.size=b.size()}this.container.css("display","block");this.buttonNext.css("display","block");this.buttonPrev.css("display", "block");this.funcNext=function(){e.next()};this.funcPrev=function(){e.prev()};this.funcResize=function(){e.resizeTimer&&clearTimeout(e.resizeTimer);e.resizeTimer=setTimeout(function(){e.reload()},100)};this.options.initCallback!==null&&this.options.initCallback(this,"init");!m&&g.browser.safari?(this.buttons(!1,!1),g(window).bind("load.jcarousel",function(){e.setup()})):this.setup()};var f=g.jcarousel;f.fn=f.prototype={jcarousel:"0.2.8"};f.fn.extend=f.extend=g.extend;f.fn.extend({setup:function(){this.prevLast= this.prevFirst=this.last=this.first=null;this.animating=!1;this.tail=this.resizeTimer=this.timer=null;this.inTail=!1;if(!this.locked){this.list.css(this.lt,this.pos(this.options.offset)+"px");var a=this.pos(this.options.start,!0);this.prevFirst=this.prevLast=null;this.animate(a,!1);g(window).unbind("resize.jcarousel",this.funcResize).bind("resize.jcarousel",this.funcResize);this.options.setupCallback!==null&&this.options.setupCallback(this)}},reset:function(){this.list.empty();this.list.css(this.lt, "0px");this.list.css(this.wh,"10px");this.options.initCallback!==null&&this.options.initCallback(this,"reset");this.setup()},reload:function(){this.tail!==null&&this.inTail&&this.list.css(this.lt,f.intval(this.list.css(this.lt))+this.tail);this.tail=null;this.inTail=!1;this.options.reloadCallback!==null&&this.options.reloadCallback(this);if(this.options.visible!==null){var a=this,c=Math.ceil(this.clipping()/this.options.visible),b=0,d=0;this.list.children("li").each(function(f){b+=a.dimension(this, c);f+1<a.first&&(d=b)});this.list.css(this.wh,b+"px");this.list.css(this.lt,-d+"px")}this.scroll(this.first,!1)},lock:function(){this.locked=!0;this.buttons()},unlock:function(){this.locked=!1;this.buttons()},size:function(a){if(a!==void 0)this.options.size=a,this.locked||this.buttons();return this.options.size},has:function(a,c){if(c===void 0||!c)c=a;if(this.options.size!==null&&c>this.options.size)c=this.options.size;for(var b=a;b<=c;b++){var d=this.get(b);if(!d.length||d.hasClass("jcarousel-item-placeholder"))return!1}return!0}, get:function(a){return g(">.jcarousel-item-"+a,this.list)},add:function(a,c){var b=this.get(a),d=0,p=g(c);if(b.length===0)for(var j,e=f.intval(a),b=this.create(a);;){if(j=this.get(--e),e<=0||j.length){e<=0?this.list.prepend(b):j.after(b);break}}else d=this.dimension(b);p.get(0).nodeName.toUpperCase()=="LI"?(b.replaceWith(p),b=p):b.empty().append(c);this.format(b.removeClass(this.className("jcarousel-item-placeholder")),a);p=this.options.visible!==null?Math.ceil(this.clipping()/this.options.visible): null;d=this.dimension(b,p)-d;a>0&&a<this.first&&this.list.css(this.lt,f.intval(this.list.css(this.lt))-d+"px");this.list.css(this.wh,f.intval(this.list.css(this.wh))+d+"px");return b},remove:function(a){var c=this.get(a);if(c.length&&!(a>=this.first&&a<=this.last)){var b=this.dimension(c);a<this.first&&this.list.css(this.lt,f.intval(this.list.css(this.lt))+b+"px");c.remove();this.list.css(this.wh,f.intval(this.list.css(this.wh))-b+"px")}},next:function(){this.tail!==null&&!this.inTail?this.scrollTail(!1): this.scroll((this.options.wrap=="both"||this.options.wrap=="last")&&this.options.size!==null&&this.last==this.options.size?1:this.first+this.options.scroll)},prev:function(){this.tail!==null&&this.inTail?this.scrollTail(!0):this.scroll((this.options.wrap=="both"||this.options.wrap=="first")&&this.options.size!==null&&this.first==1?this.options.size:this.first-this.options.scroll)},scrollTail:function(a){if(!this.locked&&!this.animating&&this.tail){this.pauseAuto();var c=f.intval(this.list.css(this.lt)), c=!a?c-this.tail:c+this.tail;this.inTail=!a;this.prevFirst=this.first;this.prevLast=this.last;this.animate(c)}},scroll:function(a,c){!this.locked&&!this.animating&&(this.pauseAuto(),this.animate(this.pos(a),c))},pos:function(a,c){var b=f.intval(this.list.css(this.lt));if(this.locked||this.animating)return b;this.options.wrap!="circular"&&(a=a<1?1:this.options.size&&a>this.options.size?this.options.size:a);for(var d=this.first>a,g=this.options.wrap!="circular"&&this.first<=1?1:this.first,j=d?this.get(g): this.get(this.last),e=d?g:g-1,h=null,i=0,k=!1,l=0;d?--e>=a:++e<a;){h=this.get(e);k=!h.length;if(h.length===0&&(h=this.create(e).addClass(this.className("jcarousel-item-placeholder")),j[d?"before":"after"](h),this.first!==null&&this.options.wrap=="circular"&&this.options.size!==null&&(e<=0||e>this.options.size)))j=this.get(this.index(e)),j.length&&(h=this.add(e,j.clone(!0)));j=h;l=this.dimension(h);k&&(i+=l);if(this.first!==null&&(this.options.wrap=="circular"||e>=1&&(this.options.size===null||e<= this.options.size)))b=d?b+l:b-l}for(var g=this.clipping(),m=[],o=0,n=0,j=this.get(a-1),e=a;++o;){h=this.get(e);k=!h.length;if(h.length===0){h=this.create(e).addClass(this.className("jcarousel-item-placeholder"));if(j.length===0)this.list.prepend(h);else j[d?"before":"after"](h);if(this.first!==null&&this.options.wrap=="circular"&&this.options.size!==null&&(e<=0||e>this.options.size))j=this.get(this.index(e)),j.length&&(h=this.add(e,j.clone(!0)))}j=h;l=this.dimension(h);if(l===0)throw Error("jCarousel: No width/height set for items. This will cause an infinite loop. Aborting..."); this.options.wrap!="circular"&&this.options.size!==null&&e>this.options.size?m.push(h):k&&(i+=l);n+=l;if(n>=g)break;e++}for(h=0;h<m.length;h++)m[h].remove();i>0&&(this.list.css(this.wh,this.dimension(this.list)+i+"px"),d&&(b-=i,this.list.css(this.lt,f.intval(this.list.css(this.lt))-i+"px")));i=a+o-1;if(this.options.wrap!="circular"&&this.options.size&&i>this.options.size)i=this.options.size;if(e>i){o=0;e=i;for(n=0;++o;){h=this.get(e--);if(!h.length)break;n+=this.dimension(h);if(n>=g)break}}e=i-o+ 1;this.options.wrap!="circular"&&e<1&&(e=1);if(this.inTail&&d)b+=this.tail,this.inTail=!1;this.tail=null;if(this.options.wrap!="circular"&&i==this.options.size&&i-o+1>=1&&(d=f.intval(this.get(i).css(!this.options.vertical?"marginRight":"marginBottom")),n-d>g))this.tail=n-g-d;if(c&&a===this.options.size&&this.tail)b-=this.tail,this.inTail=!0;for(;a-- >e;)b+=this.dimension(this.get(a));this.prevFirst=this.first;this.prevLast=this.last;this.first=e;this.last=i;return b},animate:function(a,c){if(!this.locked&& !this.animating){this.animating=!0;var b=this,d=function(){b.animating=!1;a===0&&b.list.css(b.lt,0);!b.autoStopped&&(b.options.wrap=="circular"||b.options.wrap=="both"||b.options.wrap=="last"||b.options.size===null||b.last<b.options.size||b.last==b.options.size&&b.tail!==null&&!b.inTail)&&b.startAuto();b.buttons();b.notify("onAfterAnimation");if(b.options.wrap=="circular"&&b.options.size!==null)for(var c=b.prevFirst;c<=b.prevLast;c++)c!==null&&!(c>=b.first&&c<=b.last)&&(c<1||c>b.options.size)&&b.remove(c)}; this.notify("onBeforeAnimation");if(!this.options.animation||c===!1)this.list.css(this.lt,a+"px"),d();else{var f=!this.options.vertical?this.options.rtl?{right:a}:{left:a}:{top:a},d={duration:this.options.animation,easing:this.options.easing,complete:d};if(g.isFunction(this.options.animationStepCallback))d.step=this.options.animationStepCallback;this.list.animate(f,d)}}},startAuto:function(a){if(a!==void 0)this.options.auto=a;if(this.options.auto===0)return this.stopAuto();if(this.timer===null){this.autoStopped= !1;var c=this;this.timer=window.setTimeout(function(){c.next()},this.options.auto*1E3)}},stopAuto:function(){this.pauseAuto();this.autoStopped=!0},pauseAuto:function(){if(this.timer!==null)window.clearTimeout(this.timer),this.timer=null},buttons:function(a,c){if(a==null&&(a=!this.locked&&this.options.size!==0&&(this.options.wrap&&this.options.wrap!="first"||this.options.size===null||this.last<this.options.size),!this.locked&&(!this.options.wrap||this.options.wrap=="first")&&this.options.size!==null&& this.last>=this.options.size))a=this.tail!==null&&!this.inTail;if(c==null&&(c=!this.locked&&this.options.size!==0&&(this.options.wrap&&this.options.wrap!="last"||this.first>1),!this.locked&&(!this.options.wrap||this.options.wrap=="last")&&this.options.size!==null&&this.first==1))c=this.tail!==null&&this.inTail;var b=this;this.buttonNext.size()>0?(this.buttonNext.unbind(this.options.buttonNextEvent+".jcarousel",this.funcNext),a&&this.buttonNext.bind(this.options.buttonNextEvent+".jcarousel",this.funcNext), this.buttonNext[a?"removeClass":"addClass"](this.className("jcarousel-next-disabled")).attr("disabled",a?!1:!0),this.options.buttonNextCallback!==null&&this.buttonNext.data("jcarouselstate")!=a&&this.buttonNext.each(function(){b.options.buttonNextCallback(b,this,a)}).data("jcarouselstate",a)):this.options.buttonNextCallback!==null&&this.buttonNextState!=a&&this.options.buttonNextCallback(b,null,a);this.buttonPrev.size()>0?(this.buttonPrev.unbind(this.options.buttonPrevEvent+".jcarousel",this.funcPrev), c&&this.buttonPrev.bind(this.options.buttonPrevEvent+".jcarousel",this.funcPrev),this.buttonPrev[c?"removeClass":"addClass"](this.className("jcarousel-prev-disabled")).attr("disabled",c?!1:!0),this.options.buttonPrevCallback!==null&&this.buttonPrev.data("jcarouselstate")!=c&&this.buttonPrev.each(function(){b.options.buttonPrevCallback(b,this,c)}).data("jcarouselstate",c)):this.options.buttonPrevCallback!==null&&this.buttonPrevState!=c&&this.options.buttonPrevCallback(b,null,c);this.buttonNextState= a;this.buttonPrevState=c},notify:function(a){var c=this.prevFirst===null?"init":this.prevFirst<this.first?"next":"prev";this.callback("itemLoadCallback",a,c);this.prevFirst!==this.first&&(this.callback("itemFirstInCallback",a,c,this.first),this.callback("itemFirstOutCallback",a,c,this.prevFirst));this.prevLast!==this.last&&(this.callback("itemLastInCallback",a,c,this.last),this.callback("itemLastOutCallback",a,c,this.prevLast));this.callback("itemVisibleInCallback",a,c,this.first,this.last,this.prevFirst, this.prevLast);this.callback("itemVisibleOutCallback",a,c,this.prevFirst,this.prevLast,this.first,this.last)},callback:function(a,c,b,d,f,j,e){if(!(this.options[a]==null||typeof this.options[a]!="object"&&c!="onAfterAnimation")){var h=typeof this.options[a]=="object"?this.options[a][c]:this.options[a];if(g.isFunction(h)){var i=this;if(d===void 0)h(i,b,c);else if(f===void 0)this.get(d).each(function(){h(i,this,d,b,c)});else for(var a=function(a){i.get(a).each(function(){h(i,this,a,b,c)})},k=d;k<=f;k++)k!== null&&!(k>=j&&k<=e)&&a(k)}}},create:function(a){return this.format("<li></li>",a)},format:function(a,c){for(var a=g(a),b=a.get(0).className.split(" "),d=0;d<b.length;d++)b[d].indexOf("jcarousel-")!=-1&&a.removeClass(b[d]);a.addClass(this.className("jcarousel-item")).addClass(this.className("jcarousel-item-"+c)).css({"float":this.options.rtl?"right":"left","list-style":"none"}).attr("jcarouselindex",c);return a},className:function(a){return a+" "+a+(!this.options.vertical?"-horizontal":"-vertical")}, dimension:function(a,c){var b=g(a);if(c==null)return!this.options.vertical?b.outerWidth(!0)||f.intval(this.options.itemFallbackDimension):b.outerHeight(!0)||f.intval(this.options.itemFallbackDimension);else{var d=!this.options.vertical?c-f.intval(b.css("marginLeft"))-f.intval(b.css("marginRight")):c-f.intval(b.css("marginTop"))-f.intval(b.css("marginBottom"));g(b).css(this.wh,d+"px");return this.dimension(b)}},clipping:function(){return!this.options.vertical?this.clip[0].offsetWidth-f.intval(this.clip.css("borderLeftWidth"))- f.intval(this.clip.css("borderRightWidth")):this.clip[0].offsetHeight-f.intval(this.clip.css("borderTopWidth"))-f.intval(this.clip.css("borderBottomWidth"))},index:function(a,c){if(c==null)c=this.options.size;return Math.round(((a-1)/c-Math.floor((a-1)/c))*c)+1}});f.extend({defaults:function(a){return g.extend(q,a||{})},intval:function(a){a=parseInt(a,10);return isNaN(a)?0:a},windowLoaded:function(){m=!0}});g.fn.jcarousel=function(a){if(typeof a=="string"){var c=g(this).data("jcarousel"),b=Array.prototype.slice.call(arguments, 1);return c[a].apply(c,b)}else return this.each(function(){var b=g(this).data("jcarousel");b?(a&&g.extend(b.options,a),b.reload()):g(this).data("jcarousel",new f(this,a))})}})(jQuery)

//Date Format by MKR
function datenya(a){a(".datex .time").each(function(){var d=a(this).attr("title");var b=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];if(d!=""){var g=d.substring(0,10),h=g.substring(0,4),f=g.substring(5,7),e=g.substring(8,10),c=b[parseInt(f,10)-1]}a(this).html("<strong>"+e+"</strong><span>"+c+"</span><span>"+h+"</span>")})};

//Ajax Related Post by MKR
function relatedPostsWidget(a){(function(e){var f={blogURL:"",maxPosts:5,maxTags:5,maxPostsPerTag:5,containerSelector:"#related_posts",tags:null,loadingText:"",loadingClass:"loadingxx",relevantTip:"",MonthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],rlt_summary:100,ShowDate:true,relatedTitle:"Related Posts",readMoretext:"[...]",rlpBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",rlt_thumb:200,recentTitle:"Recent Posts",postScoreClass:"",onLoad:false};f=e.extend({},f,a);var k=0,b=null,g=null;if(!f.containerSelector){document.write('<div id="related_posts"></div>');f.containerSelector="#related_posts"}var c=function(x,r){k++;if(x.feed.entry){for(var w=0;w<x.feed.entry.length;w++){var m=x.feed.entry[w];var o,p,C,q,B,n,t,A,v,y,z="";for(var u=0,s=m.link.length;u<s;u++){if(m.link[u].rel=="alternate"){z=m.link[u].href;break}}o=("content" in m)?m.content.$t:("summary" in m)?m.summary.$t:"";var l=/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;q=e("<div></div>").append(o.replace(l,""));B=q.find("img");if("media$thumbnail" in m){p=m.media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+f.rlt_thumb+"-c")}else{if(B.length!=0){p=B[0].src}else{p=f.rlpBlank}}o=o.replace(/<\S[^>]*>/g,"");if(o.length>f.rlt_summary){o=o.substring(0,f.rlt_summary)}C=m.title.$t;y=m.published.$t.substring(0,10);n=y.substring(0,4);t=y.substring(5,7);A=y.substring(8,10);v=f.MonthNames[parseInt(t,10)-1];if(location.href.toLowerCase()!=z.toLowerCase()){i(z,C,p,o,n,A,v)}}}if(k>=f.tags.length){g.attr("class","");e("#related-posts-loadingtext",b).remove();if(f.maxPosts>0){e("li:gt("+(f.maxPosts-1)+")",g).remove()}}};var i=function(q,u,w,m,y,v,x){var r=e("li",g);for(var p=0,l=r.length;p<l;p++){var t=e("a",r.eq(p));var s=j(t);if(t.attr("href")==q){h(t,++s);for(var o=p-1;o>=0;o--){var n=e("a",r.eq(o));if(j(n)>s){if(p-o>1){r.eq(o).after(r.eq(p))}return}}if(p>0){r.eq(0).before(r.eq(p))}return}}g.append('<li><div class="inner"><a class="jdlunya" href="'+q+'" title="'+(f.relevantTip?f.relevantTip.replace("\d",1):"")+'"><span class="gmbrrltd"><img alt="'+u+'" src="'+w+'"/></span><strong>'+u+"</strong></a><p>"+m+'<a title="'+u+'" href="'+q+'">'+f.readMoretext+"</a>"+(f.ShowDate===true?'<span class="date"><strong>'+v+"</strong><span>"+x+"</span><span>"+y+"</span></span>":"")+"</p></div></li>")};var j=function(l){var m=parseInt(l.attr("score"));return m>0?m:1};var h=function(l,m){l.attr("score",m);if(f.relevantTip){l.attr("title",f.relevantTip.replace("\d",m))}if(f.postScoreClass){l.attr("class",f.postScoreClass+m)}};var d=function(){if(f.containerSelector!="#related_posts"){var l=e(f.containerSelector);if(l.length!=1){return}b=e('<div id="related_posts"></div>').appendTo(l)}else{b=e(f.containerSelector)}if(!f.tags){f.tags=[];e('a[rel="tag"]:lt('+f.maxTags+")").each(function(){var o=e.trim(e(this).text().replace(/\n/g,""));if(e.inArray(o,f.tags)==-1){f.tags[f.tags.length]=o}})}if(f.tags.length==0&&!f.recentTitle){return}if(f.tags.length==0){e("<h4><span>"+f.recentTitle+"</span></h4>").appendTo(b)}else{if(f.relatedTitle){e("<h4><span>"+f.relatedTitle+"</span></h4>").appendTo(b)}}if(f.loadingText){e('<div id="related-posts-loadingtext">'+f.loadingText+"</div>").appendTo(b)}g=e("<ul "+(f.loadingClass?'class="'+f.loadingClass+'"':"")+"></ul>").appendTo(b);if(f.tags.length==0){e.get((f.blogURL===""?window.location.protocol+"//"+window.location.host:f.blogURL)+"/feeds/posts/default?max-results="+f.maxPostsPerTag+"&orderby=published&alt=json-in-script",c,"jsonp")}else{for(var n=0,m=f.tags.length;n<m;n++){e.get((f.blogURL===""?window.location.protocol+"//"+window.location.host:f.blogURL)+"/feeds/posts/default/-/"+f.tags[n]+"?max-results="+f.maxPostsPerTag+"&orderby=published&alt=json-in-script",c,"jsonp")}}};d();e(window).bind("load",function(){setTimeout(function(){var l;var m;var n=e(f.containerSelector);if(e(window).width()<479){l=1;m=n.width()/l}else{if(e(window).width()<980){l=2;m=n.width()/l}else{if(e(window).width()<1030){l=3;m=n.width()/l}else{l=4;m=n.width()/l}}}e("ul",n).jcarousel({easing:"easeInOutQuint",animation:800,auto:4,wrap:"last",scroll:l,setupCallback:function(o){o.reload()},reloadCallback:function(p){var o=Math.floor(p.clipping()/m);p.options.scroll=o;p.options.visible=o}})},3000)})})(jQuery)};

//]]>
</script>

</head>

<body expr:class='data:blog.pageType' itemscope='' itemtype='http://schema.org/WebPage'>
<div expr:class='data:blog.languageDirection' id='outer-wrapper'>

<script class='jshilang' type='text/javascript'>
//<![CDATA[
menunav (jQuery);
scrollbut();
jQuery(window).resize(scrollbut);
searchxx({
summaryLength:100,
scrthumbSize:50
});
//]]>
</script>

<div id='areacontent'>
<div class='isi'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='topfeatured'>
<b:section class='sidebar' id='topfeaturedmanual' preferred='yes'/>
<script class='jshilang' type='text/javascript'>
manualfeaturedPost(jQuery);
</script>
</div>
<div id='bottomfeatured'>
<b:section class='sidebar' id='botfeaturedauto' preferred='yes'/>
</div>
</b:if>
<div id='content-wrapper'>
<div id='main-atas'>
<div class='innerwrap'>
<div id='main-wrapper'>
<b:if cond='data:blog.pageType != "error_page"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div class='menu-xitem'>
<div>
<nav id='view'>
<a class='grid' href='#' title='grid mode'>Grid</a>
<a class='list' href='#' title='list mode'>List</a>
</nav>
<div class='xitem1'><span class='textlast'><b:if cond='data:blog.url == data:blog.homepageUrl'>
Latest Post
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<data:blog.pageName/>
<b:else/>
<b:if cond='data:blog.searchQuery'>
<data:blog.searchQuery/>
<b:else/>
<b:if cond='data:blog.searchLabel'>
<data:blog.searchLabel/>
</b:if>
</b:if>
</b:if>
</b:if></span>
</div>
</div>
</div>
</b:if>
</b:if></b:if>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>
<b:includable id='main' var='top'>
<div class='blog-posts hfeed'>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
</b:loop>
</div>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script class='jshilang' type='text/javascript'>
//<![CDATA[
datenya(jQuery);
viewMode();
loadMorePost({
thumbnailSize:"s200-p",
summaryLength:300
});
//]]>
</script>
</b:if>

<b:if cond='data:blog.pageType != "error_page"'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script class='jshilang' type='text/javascript'>
//<![CDATA[
datenya(jQuery);
viewMode({
viewmodedefault:'list',
cookielist:'list1',
cookiegrid:'grid1'
});
loadMorePost({
viewmodedefault:'list',
cookielist:'list1',
cookiegrid:'grid1',
thumbnailSize:"s200-p",
summaryLength:300
});
//]]>
</script>
</b:if></b:if></b:if></b:if>

</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'> </b:includable>
<b:includable id='backlinks' var='post'/>
<b:includable id='comment-form' var='post'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='comment_count_picker' var='post'/>
<b:includable id='comment_picker' var='post'/>
<b:includable id='comments' var='post'/>
<b:includable id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='iframe_comments' var='post'/>
<b:includable id='mobile-index-post' var='post'/>
<b:includable id='mobile-main' var='top'/>
<b:includable id='mobile-nextprev'/>
<b:includable id='mobile-post' var='post'/>
<b:includable id='nextprev'/>
<b:includable id='post' var='post'>
<article class='post hentry' expr:id='data:post.id' itemscope='' itemtype='http://schema.org/BlogPosting'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title' itemprop='name headline'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' itemprop='url'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' itemprop='url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
<b:else/>
<h1 class='post-title entry-title' itemprop='name headline'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' itemprop='url'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' itemprop='url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='description articleBody'>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<textarea expr:id='"postData-" + data:post.id' style='display:none'><data:post.body/></textarea>
<div class='post-summary' expr:id='"summaryContainer-" + data:post.id'>
<b:if cond='data:post.thumbnailUrl'>
<a class='thumbimgx' expr:href='data:post.url' expr:title='data:post.title'><img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' height='72' itemprop='image' width='72'/></a>
<b:else/>
<a class='thumbimgx' expr:href='data:post.url' expr:title='data:post.title'><img class='post-thumbnail' expr:alt='data:post.title' height='72' itemprop='image' src='http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif' width='72'/></a>
</b:if>
<strong><a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a></strong>
<b:if cond='data:post.snippet'>
<p><data:post.snippet/></p>
</b:if>
</div>
<div class='post-more-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.jumpText + " " + data:post.title'>
<data:post.jumpText/>
</a>
</div>
<script>createPostSummary("postData-<data:post.id/>","summaryContainer-<data:post.id/>","<data:post.url/>");</script>
</b:if>
</b:if>
<div style='clear:both'/>
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<div class='post-timestamp'>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published updated' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
</b:if>
</div>
<div class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn'>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<data:post.author/>
</a>
</span>
<b:else/>
<span class='fn'><data:post.author/></span>
</b:if>
</b:if>
</div>
<div class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>
</b:if>
</b:if>
</div>
<div class='post-labels'>
<b:if cond='data:post.labels'>
<span>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</span>
</b:if>
</div>
<div class='post-location'>
<b:if cond='data:top.showLocation'>
<b:if cond='data:post.location'>
<a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
</b:if>
</b:if>
</div>
<div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>
<span class='post-icons'>
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
</span>
</div>
<div id='related_posts'/>
<script class='jshilang' type='text/javascript'>
relatedPostsWidget();
</script>
<div class='post-footer-line post-footer-line-2'/>
<div class='post-footer-line post-footer-line-3'/>
</div>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<span class='datex'>
<span class='time published update' expr:title='data:post.timestampISO8601'><data:post.timestamp/></span>
</span>
</b:if> </b:if>
</article>
</b:includable>
<b:includable id='postQuickEdit' var='post'/>
<b:includable id='shareButtons' var='post'/>
<b:includable id='status-message'/>
<b:includable id='threaded-comment-form' var='post'/>
<b:includable id='threaded_comment_js' var='post'/>
<b:includable id='threaded_comments' var='post'/>
</b:widget>
</b:section>
</div>

</div></div>


<div class='clear'> </div>

</div> 
</div></div>

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

</div> 


</body>

</HTML>

Search This Blog

OnLineJavaCodes

AJAX RELATED POST WIDGET

Comments

Post a Comment

Popular posts from this blog

SHORT POST SUMMERY JAVA CODE WITH IMAGE IN BLOG

RANDOM POST WIDGET