<data:blog.pageTitle/> <data:blog.pageName/> - <data:blog.title/> All Posts - <data:blog.title/> Page Not Found - <data:blog.title/> <data:blog.pageName/> Variable definitions end ========================*/ /** * Eric Meyer's Reset CSS v2.0 http://meyerweb.com/eric/tools/css/reset/ * http://cssreset.com */ 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,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;/*font-size:100%;*/font:inherit;vertical-align:baseline;} /* HTML5 display-role reset for older browsers */ article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;display:block;}*{margin:0;padding:0;}html{display:block;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;} /* Blogger CSS Reset */ .section,.widget{margin:0 0 0 0;padding:0 0 0 0;} .navbar,.blog-feeds,.feed-links,#backlinks-container,a.home-link,.blog-mobile-link{display:none;} .post-body .separator > a, .post-body .separator > span {margin-left: 0 !important;} .quickedit,.thread-toggle,.edit-post,.item-control{display:none;} /* disable font boosting on mobile browsers */ body * { max-height: 9999999em; /* Chrome for Android */ -moz-text-size-adjust: none; /* Firefox Mobile */ } /* FRAMEWORK */ strong,b{font-weight:bold;} cite,em,i{font-style:italic;} a:link{color:$(link.color);text-decoration:none;outline:none;} a:visited{color:$(link.color);text-decoration:none;} a:hover{color:$(link.hover.color);text-decoration:none;} a img{border:none;border-width:0;outline:none;} abbr,acronym{border-bottom:1px dotted;cursor:help;} sup,sub{vertical-align:baseline;position:relative;top:-.4em;font-size:86%;} sub{top:.4em;}small{font-size:86%;} kbd{font-size:80%;border:1px solid #777;padding:2px 5px;border-bottom-width:2px;border-radius:3px;} mark{background-color:#ffce00;color:black;} p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:1.5em 0;} hr{height:1px;border:none;background-color:#666;} h1{font-size:1.8rem} h2{font-size:1.6rem} h3{font-size:1.4rem} h4{font-size:1.2rem} h5{font-size:1rem} h6{font-size:0.9rem} /* heading */ h1,h2,h3,h4,h5,h6 { margin: 0 0 0.6em; letter-spacing: -0.2px; } /* list */ ol,ul,dl{margin: .5em 0em .5em 3em} li{margin: .5em 0} dt{font-weight: 500} dd{margin: 0 0 .5em 2em} /* form */ input,button,select,textarea{font:inherit;font-size:100%;line-height:normal;vertical-align:baseline;} textarea{display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} /* code & blockquote */ pre,code{font-family:"Courier New",Courier,Monospace;color:inherit;} pre{white-space:pre;word-wrap:normal;overflow:auto;} blockquote{background:#f7f7f7;margin-left:2em;margin-right:2em;padding:1em 1em;font-style:italic;font-size:105%;} blockquote:before { content: "\f10d"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; padding-right:4px; color:#666; } /* table */ table[border="1"] td, table[border="1"] th { vertical-align: top; text-align: left; font-size: 13px; padding: 3px 5px; border: 1px solid #f7f7f7; } table[border="1"] th { background: #eee; } table, img { max-width: 100%; height: auto; } iframe { max-width: 100%; } td.tr-caption { color: #777; } .clear { clear: both; } .clear:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } /* TRANSISI */ a:link, .label-count, #cssmenu ul ul li, #cssmenu > ul > li.has-sub > a:before, #cssmenu ul ul li.has-sub > a:before, .button:before, .button.menu-opened:after { transition:all 0.2s; -moz-transition:all 0.2s; -webkit-transition:all 0.2s; } .related-post-style-3 .related-post-item, .lihat-detail { transition: opacity 0.2s linear; } .post-outer, .gambar-produk, .detail-produk, .deskripsi-produk, .tombol-beli, .judul-produk, .img-thumbnail, .img-thumbnail img, .label-info-th a, #share, .jasa-pengiriman img, #footer-wrapper .footer-right, #footer-wrapper .footer-left { transition: all .2s linear; -o-transition: all .2s linear; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; } #searchfs input[type="search"], h1,h2,h3,h4,h5,h6 { transition: font-size .2s linear; -o-transition: font-size .2s linear; -moz-transition: font-size .2s linear; -webkit-transition: font-size .2s linear; } body { background: $(body.background); margin: 0 0 0 0; padding: 0 0 0 0; color: $(body.text.color); font: $(body.font); text-align: left; } /* HEADER */ #header-container { background: $(header.background.color); color: #fff; -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 999; } #header-wrapper { box-sizing: border-box; max-width: 960px; margin: 0 auto; padding: 0 30px; position: relative; } .header { max-width: 400px; float: left; margin-right: 28px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .header h1.title, .header p.title { font: $(header.font); color: $(header.title.color); margin: 0; text-transform: uppercase; padding: 9px 0; } .header .description { color: $(header.title.color); margin: -10px 0 4px 0; padding: 0; font-size: 0.7em; display: none; } .header a, .header a:hover { color: $(header.title.color); } .header img { display:block; width: auto; margin: 11px 0; max-height: 24px; } /* WRAPPER */ #wrapper { background: #fff; max-width: 960px; margin: 0 auto; padding: 80px 30px 30px; overflow: hidden; box-sizing: border-box; } .above-post-widget h2 { font-size: 18px; } .above-post-widget .widget { margin-bottom: 30px; } .above-post-widget .Image { background: #f7f7f7; } /* Image Widget */ .above-post-widget .Image { text-align: center; } .above-post-widget .Image h2 { font-size: 18px; background: $(header.background.color); color: $(header.title.color); margin: 0 0; padding: 10px; font-weight: 500; text-transform: uppercase; } .above-post-widget .Image span.caption { padding: 15px 10px 20px 10px; display: block; font-size: 18px; line-height: 1.8; } .above-post-widget .Image img { width: auto; max-width: 100%; } /* POST WRAPPER */ #post-wrapper { background: transparent; width: 100%; max-width: 960px; margin: 0 0 10px; } .breadcrumbs-outer, .judul-produk-lainnya, .judul-review { position: relative; text-align: center; margin-bottom: 20px; margin: 0 0 30px 0; } .breadcrumbs-outer:before, .judul-produk-lainnya:before, .judul-review:before { z-index: 1; content: ""; width: 100%; height: 2px; position: absolute; top: 50%; left: 0; margin-top: -1px; } .breadcrumbs, .judul-produk-lainnya h3, .judul-review h3 { display: inline-block; margin: 0; text-transform: uppercase; font-size: 16px; background: #fff; z-index: 1; position: relative; padding: 4px 16px; font-weight: 500; border: 2px solid $(subjudul.border); border-radius: 15px; line-height: normal; } .breadcrumbs a { color: $(subjudul.color); } .breadcrumbs a:hover { text-decoration: underline; } .post { position: relative; } .post-info { margin-bottom: 20px; font-size: 15px; color: #999; } .post-body { line-height: 1.6em; text-align: left; } h2.post-title, h1.post-title { font: $(post.title.font); } h1.post-title { font-size: 28px; margin-bottom: 20px; text-transform: uppercase; font-weight: 500; } h2.post-title { margin-bottom: 5px; } h2.post-title a, h1.post-title a, h2.post-title, h1.post-title { color: $(post.title.color); } h2.post-title a:hover, h1.post-title a:hover { color: $(post.title.hover.color); } .img-thumbnail { position: relative; max-width: 300px; height: 0; padding-bottom: 125%; width: 100%; overflow: hidden; } .img-thumbnail img { max-width: 300px; width: 100%; display: block; } .lihat-detail { position: absolute; bottom: 0; background: $(link.color); opacity: 0; color: #fff; padding: 5px 10px; right: 0; left: 0; text-align: center; text-transform: uppercase; font-size: 12px; font-weight: 500; line-height: normal; } .img-thumbnail:hover .lihat-detail, .related-post-style-3 .related-post-item-thumbnail:hover .lihat-detail { opacity: 1; } /* CUSTOM WIDGET */ .widget ul { line-height:1.4em; } /* Label */ .label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5 { font-size: 100%; opacity: 10 } .cloud-label-widget-content{ text-align: left; font-weight: 500; } .label-size { transition: all 0.25s; -moz-transition: all 0.25s; -webkit-transition: all 0.25s; line-height :1.2; display: block; float: left; margin: 0 3px 3px 0; color: $(link.color); font-size: 12px; text-transform: uppercase; border: 2px solid $(widget.link.color); border-radius: 3px; } .label-size a, .label-size span{ display: inline-block; color: $(widget.link.color); padding: 6px 8px; } .label-size:hover { border: 2px solid $(widget.hover.color); } .label-size:hover a, .label-size:hover .label-count { color: $(widget.hover.color); } .label-count { margin-left: -16px; } /* Feed */ .Feed { } .Feed ul { } .Feed ul li { display: block; padding: 8px 0; margin: 0; } .Feed .item-date, .Feed .item-author { color: #999; } .Feed .item-title { font-weight: 500; } /* Popular Posts */ .PopularPosts ul, .PopularPosts ul li, .PopularPosts ul li img, .PopularPosts ul li a, .PopularPosts ul li a img { margin:0 0; padding:0 0; list-style:none; border:none; outline:none; } .PopularPosts ul { margin: 0; } .PopularPosts ul li img { display: block; width: 80px; height: 80px; } .PopularPosts ul li { margin: 0 10px 10px 0; display: inline-block; vertical-align: top; } .PopularPosts ul li .item-title a { font-weight: 500; display: block; padding: 5px 3px; } .PopularPosts ul li > a { padding: 2px 6px; margin: -3px 0; display: block; border: 2px solid $(widget.link.color); border-radius: 3px; font-size: 12px; text-transform: uppercase; } .PopularPosts ul li > a:hover { border: 2px solid $(widget.hover.color); } .PopularPosts ul li .item-title a:hover, .PopularPosts ul li a:hover { } .PopularPosts .item-content { position: relative; width: 80px; margin-right: 10px; } .PopularPosts .item-title { line-height: 1.3; font-size: 13px; text-align: center; overflow: hidden; } .PopularPosts .item-thumbnail { float: none; margin: 0 0; } .PopularPosts .item-thumbnail:hover { opacity: 0.9; } .PopularPosts .item-snippet { display: none; } /* Profile */ .Profile .widget-content { text-align: center; background: #373737; padding: 30px; } .Profile .profile-img { border-radius: 50%; float: none; } .Profile .profile-name-link { font-size: .9em; opacity: .87; overflow: hidden; } .Profile .profile-link { border-style: solid; border-width: 2px; cursor: pointer; font-size: 13px; font-weight: 500; padding: 6px 22px; display: inline-block; line-height: normal; border-radius: 3px; } .profile-textblock { margin: .8em 0; font-size: 14px; } .profile-img { float: left; display:inline; opacity:10; margin:0 6px 3px 0; } .profile-data { margin: 0; } .profile-datablock { margin: .5em 0; } .profile-name-link { background: no-repeat left top; box-sizing: border-box; display: inline-block; max-width: 100%; min-height: 20px; padding-left: 20px; } /* Archive */ #ArchiveList .toggle { cursor: pointer; font-family: Arial, sans-serif; } #ArchiveList .toggle-open { _font-size: 1.7em; line-height: .6em; } #ArchiveList { text-align: left; } #ArchiveList a.post-count-link, #ArchiveList a.post-count-link:link, #ArchiveList a.post-count-link:visited { text-decoration: none; } #ArchiveList a.toggle, #ArchiveList a.toggle:link, #ArchiveList a.toggle:visited, #ArchiveList a.toggle:hover { color: inherit; text-decoration: none; } .BlogArchive #ArchiveList ul li { background: none; list-style: none; list-style-image: none; list-style-position: outside; border-width: 0; padding-left: 15px; text-indent: -15px; margin: .25em 0; background-image: none; } .BlogArchive #ArchiveList ul ul li { padding-left: 1.2em; } .BlogArchive #ArchiveList ul { margin: 0; padding: 0; list-style: none; list-style-image: none; border-width: 0; } .BlogArchive #ArchiveList ul.posts li { padding-left: 1.3em; } #ArchiveList .collapsed ul { display: none; } /* Back to top */ #back-to-top { background:$(backtp.background.color); color:$(backtp.color); padding:8px 10px; font-size:24px; border-radius: 22px; box-shadow: 0 1px 2px 0 rgba(0,0,0,.15), 0 1px 1px 0 rgba(0,0,0,.30); } .back-to-top { position: fixed !important; position: absolute; bottom: 25px; right: 20px; z-index: 998; } /* Share button */ .share-this-pleaseeeee { display: inline-block; margin: 0 0 10px; text-transform: uppercase; font-size: 14px; z-index: 1; position: relative; } #share-container { margin: 10px auto 0; overflow: hidden; border-top: 2px dotted #ddd; padding-top: 10px; } #share { } #share a { width: 36px; height: 36px; display: inline-block; color: #fff; opacity: 0.8; transition: opacity 0.15s linear; margin: 0 5px 5px 0; border-radius: 18px; line-height: 16px; text-align: center; } #share a:hover { opacity: 1; } #share i { position: relative; top: 50%; transform: translateY(-50%); } .facebook { background: #3b5998; } .twitter { background: #55acee; } .googleplus { background: #dd4b39; } .linkedin { background: #0077b5; } .pinterest { background: #cb2027; } .whatsapp { background: #25d366; } /* Status Msg */ .status-msg-wrap { font-size: 110%; width: 90%; margin: 0 auto 15px; position: relative; } .status-msg-border { border: none; filter: alpha(opacity=40); -moz-opacity: .4; opacity: .4; width: 100%; position: relative; } .status-msg-bg { background-color: transparent; opacity: .8; filter: alpha(opacity=30); -moz-opacity: .8; width: 100%; position: relative; z-index: 1; } .status-msg-body { text-align: center; padding: .3em 0; width: 100%; position: absolute; z-index: 4; } .status-msg-hidden { visibility: hidden; padding: .3em 0; } .status-msg-wrap a { padding-left: .4em; } /* PAGE NAVIGATION */ #blog-pager { text-align: center; overflow: hidden; margin: 0 0 30px 0; } #blog-pager-newer-link a { float:left; display:block; } #blog-pager-older-link a { float:right; display:block; } #blog-pager-newer-link a, #blog-pager-older-link a { font-weight: 500; } #blog-pager-older-link a:hover, #blog-pager-newer-link a:hover, a.home-link:hover { } #blog-pager .pages { border: none; } /* FOOTER WIDGET */ /* SEARCH FORM */ .search-icon { position: absolute; top: 11px; right: 30px; font-size: 19px; } .search-icon a { color: $(search.icon.color); } #searchfs { position: fixed; z-index:9999; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; -webkit-transform: translate(0px, -100%) scale(0, 0); -moz-transform: translate(0px, -100%) scale(0, 0); -o-transform: translate(0px, -100%) scale(0, 0); -ms-transform: translate(0px, -100%) scale(0, 0); transform: translate(0px, -100%) scale(0, 0); opacity: 0; } #searchfs.open { -webkit-transform: translate(0px, 0px) scale(1, 1); -moz-transform: translate(0px, 0px) scale(1, 1); -o-transform: translate(0px, 0px) scale(1, 1); -ms-transform: translate(0px, 0px) scale(1, 1); transform: translate(0px, 0px) scale(1, 1); opacity: 1; z-index: 9999; } #searchfs input[type="search"] { position: absolute; top: 50%; left: 0; margin-top: -51px; width: 70%; margin-left: 15%; color: rgb(255, 255, 255); background: transparent; border-top: 1px solid rgba(255, 255, 255, .8); border-bottom: 2px solid rgba(255, 255, 255, .5); border-left: 0px solid transparent; border-right: 0px solid transparent; font-size: 40px; text-align: center; outline: none; padding: 10px; } #searchfs .close { position: fixed; top: 20px; right: 30px; color: #fff; background-color: transparent; opacity: 0.8; font-size: 40px; border: none; outline: none; } #searchfs .close:hover { cursor: pointer; } /* NAV MENU */ #cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a, #cssmenu #head-mobile { border: 0; list-style: none; line-height: 1; display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #cssmenu { float: left; } #cssmenu ul { margin: 0; display: block; } #cssmenu:after,#cssmenu > ul:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0 } #cssmenu #head-mobile { display: none } #cssmenu > ul > li { float: left; margin: 0; } #cssmenu > ul > li > a { padding: 17px; font: $(navmenu.font); letter-spacing: 0.8px; text-decoration: none; text-transform: uppercase; color: $(navmenu.font.color); } #cssmenu > ul > li:hover > a, #cssmenu ul li.active a { color: $(navmenu.font.hover.color); } #cssmenu > ul > li:hover, #cssmenu ul li.active:hover, #cssmenu ul li.active, #cssmenu ul li.has-sub.active:hover { background: rgba(64,64,64,0.05); -webkit-transition: background .2s ease; -ms-transition: background .2s ease; transition: background .2s ease; } #cssmenu > ul > li.has-sub > a { padding-right: 25px } #cssmenu > ul > li.has-sub > a:after { position: absolute; top: 22px; right: 11px; width: 8px; height: 2px; display: block; background: $(navmenu.font.color); content:'' } #cssmenu > ul > li.has-sub > a:before { position: absolute; top: 19px; right: 14px; display: block; width: 2px; height: 8px; background: $(navmenu.font.color); content:''; } #cssmenu > ul > li.has-sub:hover > a:before { top: 23px; height: 0 } #cssmenu ul ul { position: absolute; left: -9999px; z-index: 1; -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); } #cssmenu ul ul li { height: 0; background :#f7f7f7; margin: 0; } #cssmenu ul ul li:hover { background: #efefef; } #cssmenu li:hover > ul { left: auto } #cssmenu li:hover > ul > li { height: 33px } #cssmenu ul ul ul{ margin-left: 100%; top: 0 } #cssmenu ul ul li a { border-bottom: 1px solid rgba(150,150,150,0.15); padding: 10px 25px 10px 15px; max-width: 100%; min-width: 150px; font-size: 12px; text-decoration: none; color: #888; font-weight: 400; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } #cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a { border-bottom: 0 } #cssmenu ul ul li.has-sub > a:after { position: absolute; top: 16px; right: 11px; width: 8px; height: 2px; display: block; background: #888; content:'' } #cssmenu ul ul li.has-sub > a:before { position: absolute; top: 13px; right: 14px; display: block; width: 2px; height: 8px; background: #888; content:''; } #cssmenu ul ul > li.has-sub:hover > a:before { top: 17px; height: 0 } #cssmenu ul ul li.has-sub:hover,#cssmenu ul li.has-sub ul li.has-sub ul li:hover { background: #efefef; } #cssmenu ul ul ul li.active a { border-left:1px solid #333 } #cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active> a{ border-top: 1px solid #333 } @media screen and (min-width:801px){ #cssmenu ul { display: block !important; } } @media screen and (max-width:800px){ #cssmenu { float: none; } #cssmenu ul { background: #f7f7f7; width: 100%; display: none } #cssmenu ul ul { -webkit-box-shadow: none; box-shadow: none; display:none; } #cssmenu ul li { width: 100%; border-top: 1px solid #efefef; background: #f7f7f7; } #cssmenu ul ul li, #cssmenu li:hover > ul > li { height: auto } #cssmenu ul li a, #cssmenu ul ul li a { width: 100%; border-bottom: 0; color: #888 !important; } #cssmenu > ul > li { float: none } #cssmenu ul ul li a { padding-left: 25px } #cssmenu ul ul ul li a { padding-left: 35px } #cssmenu ul ul, #cssmenu ul ul ul{ position: relative; left: 0; width: 100%; margin: 0; text-align: left } #cssmenu > ul > li.has-sub > a:after,#cssmenu > ul > li.has-sub > a:before, #cssmenu ul ul > li.has-sub > a:after, #cssmenu ul ul > li.has-sub > a:before{ display: none } #cssmenu #head-mobile { display: block; padding: 23px; color: #fff; font-size: 12px; font-weight: 500 } .button { width: 20px; height: 46px; position: absolute; right: 0; top: 0; cursor: pointer; z-index: 2; } .button:after { position: absolute; top: 21px; right: 0px; display: block; height: 4px; width: 20px; border-top: 3px solid $(search.icon.color); border-bottom: 3px solid $(search.icon.color); content:'' } .button:before { position: absolute; top: 14px; right: 0px; display: block; height: 3px; width: 20px; background: $(search.icon.color); content:'' } .button.menu-opened:after { top: 21px; border: 0; height: 3px; width: 20px; background: $(navmenu.font.color); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg) } .button.menu-opened:before { top: 21px; background: $(navmenu.font.color); width: 20px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg) } #cssmenu .submenu-button { position: absolute; z-index: 99; right: 0; top: 0; display: block; border-left: 1px solid #efefef; height: 38px; width: 38px; cursor: pointer } #cssmenu .submenu-button.submenu-opened { background: rgba(64,64,64,0.05); } #cssmenu ul ul .submenu-button { height: 32px; width: 32px } #cssmenu .submenu-button:after { position: absolute; top: 19px; right: 16px; width: 8px; height: 2px; display: block; background: #888; content:'' } #cssmenu ul ul .submenu-button:after { top: 15px; right: 13px } #cssmenu .submenu-button.submenu-opened:after { background: #888 } #cssmenu .submenu-button:before { position: absolute; top: 16px; right: 19px; display: block; width: 2px; height: 8px; background: #888; content:'' } #cssmenu ul ul .submenu-button:before{ top: 12px; right: 16px } #cssmenu .submenu-button.submenu-opened:before{ display: none } #cssmenu ul ul ul li.active a{ border-left: none } #cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active > a{ border-top: none } } /* RELATED POSTS */ .related-post { margin: 30px auto 0; overflow: hidden; } .related-post h3:before { content: "Produk Lainnya" } .related-post ul { } /* Style 3 */ .related-post-style-3, .related-post-style-3 li { margin: 0; padding: 0; list-style: none; word-wrap: break-word; overflow: hidden; } .related-post-style-3 .related-post-item { float: left; width: 23.5%; height: auto; margin-right: 2%; margin-bottom: 10px; } .related-post-style-3 .related-post-item:nth-of-type(4n+0) { margin-right: 0; } .related-post-style-3 .related-post-item:nth-of-type(4n+1) { clear: both; } .related-post-style-3 .related-post-item-thumbnail { position: relative; display: block; height: 0; padding-bottom: 125%; overflow: hidden; } .related-post-style-3 .related-post-item-tooltip { font-size: 15px; padding: 10px; background: #f7f7f7; text-align: center; } .related-post-item-tooltip .related-post-item-title { display: block; color: $(body.text.color); font-weight: 500; } @media only screen and (max-width:480px){ .related-post-style-3 .related-post-item { width: 48%; margin-right: 4%; margin-bottom: 4%; } .related-post-style-3 .related-post-item:nth-of-type(2n+0) { margin-right: 0; } .related-post-style-3 .related-post-item:nth-of-type(2n+1) { clear: both; } } .artikel-terbaru ul li, .list-label-widget-content ul li, .LinkList ul li, .PageList ul li { margin: 10px 0 !important; border-bottom: 1px dotted $(footer.color); padding-bottom: 5px; } .artikel-terbaru ul li:before, .list-label-widget-content ul li:before, .LinkList ul li:before, .PageList ul li:before { content: "\f14b"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; margin-right: 6px; } .artikel-terbaru ul li:before { content: "\f14b"; } .list-label-widget-content ul li:before { content: "\f07b"; } .LinkList ul li:before { content: "\f14c"; } .PageList ul li:before { content: "\f249"; } .contact-form-success-message, .contact-form-error-message { background: #f9edbe; border: 0 solid #f0c36d; font-size: 14px; text-align: center; max-width: 500px; border-radius: 3px; } .contact-form-success-message-with-border, .contact-form-error-message-with-border { background: #f9edbe; border: 1px solid #f0c36d; font-size: 14px; text-align: center; max-width: 600px; border-radius: 3px; box-sizing: border-box; padding: 5px 10px; } .contact-form-cross { height: 11px; margin: 0 5px; vertical-align: -8.5%; width: 11px; } .contact-form-email, .contact-form-name { color: inherit; height: 40px; margin-top: 5px; max-width: 300px; width: 100%; padding: 0 15px; border-radius: 3px; border: 1px solid #cacaca; box-sizing: border-box; } .contact-form-email-message { color: inherit; margin-top: 5px; vertical-align: top; max-width: 600px; width: 100%; border-radius: 3px; border: 1px solid #cacaca; padding: 15px; } .contact-form-email:hover, .contact-form-name:hover, .contact-form-email-message:hover { outline: none; border: 1px solid $(link.color); } .contact-form-email:focus, .contact-form-name:focus, .contact-form-email-message:focus { outline: none; border: 1px solid $(link.color); } .contact-form-name, .contact-form-email, .contact-form-email-message { background: #f7f7f7; } .contact-form-button { display: block; font-size: 14px; line-height: 24px; padding: 5px 20px; margin: 30px 0; text-align: center; border: none; background: $(link.color); color: #fff; border-radius: 3px; font-weight: 500; } .contact-form-button:hover, .contact-form-button.hover { cursor: pointer; outline: none; opacity: .85; } .contact-form-button.focus, .contact-form-button.right.focus, .contact-form-button.mid.focus, .contact-form-button.left.focus { outline: none; } .contact-form-button-submit:focus, .contact-form-button-submit.focus { outline: none; opacity: .85; } .swajib { font-weight: bold; color: #e85e5e; } .ctitles { font-weight: 500; display: block; margin: 30px 0 0; } /* COMMENT FORM */ .comments { clear:both; margin-top:30px; margin-bottom:0; } .comments h3 { } #comments-block { margin: 15px 0; } .comment-body { padding: 15px 0; margin: 0 0; } .comment-body p { margin: 0; } .comment-form { overflow:hidden; margin-top: 20px; } .comment-footer { margin: 0 0 30px; } #comments-block .avatar-image-container { display: none; } h4#comment-post-message { display:none; margin:0 0 0 0; } .comments .comments-content{ font-size:14px; margin-bottom: 30px } .comments .comments-content .comment-thread ol{ text-align:left; margin: 0 0; padding:0; list-style: none; } .comment .avatar-image-container { float: left; max-height: 36px; overflow: hidden; width: 36px; } .comments .avatar-image-container img { max-width: 34px; border-radius: 17px; } .comments .comment-block{ position:relative; background:#f7f7f7; padding:20px; margin-left:45px; border:2px solid #efefef; border-radius: 10px; } .comments .comments-content .comment-replies{ margin:10px 0; margin-left:45px } .comments .comments-content .comment-thread:empty{ display:none } .comments .comment-replybox-single { margin-left:45px } .comments .comment-replybox-thread { } iframe#comment-editor { min-height: 220px; } .comments .comments-content .comment{ margin-bottom:6px; padding:0 } .comments .comments-content .comment:first-child { padding:0; margin:0 } .comments .comments-content .comment:last-child { padding:0; margin:0 } .comments .comment-thread.inline-thread .comment, .comments .comment-thread.inline-thread .comment:last-child { margin:0px 0px 5px 12% } .comment .comment-thread.inline-thread .comment:nth-child(6) { margin:0px 0px 5px 10%; } .comment .comment-thread.inline-thread .comment:nth-child(5) { margin:0px 0px 5px 8%; } .comment .comment-thread.inline-thread .comment:nth-child(4) { margin:0px 0px 5px 6%; } .comment .comment-thread.inline-thread .comment:nth-child(3) { margin:0px 0px 5px 4%; } .comment .comment-thread.inline-thread .comment:nth-child(2) { margin:0px 0px 5px 2%; } .comment .comment-thread.inline-thread .comment:nth-child(1) { margin:0px 0px 5px 0; } .comments .comments-content .comment-thread{ margin:0; padding:0 } .comments .comments-content .inline-thread{ background:#fff; margin:0 } .comments .comments-content .icon.blog-author { display:inline; height: 18px; margin: 0 0 -4px 6px; width: 18px; } .comments .comments-content .icon.blog-author:after { content:"\f058"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; padding-right:4px; color:$(link.color); } .comments .comments-content .comment-header { font-size:14px; margin: 0 0 15px; } .comments .comments-content .comment-content { margin: 0 0 15px; line-height: 1.6; } .comments .comments-content .datetime { margin-left: 6px; display: none; } .comments .comments-content .datetime a { color:#bbbbbb; } .comments .comments-content .user { font-weight: 500; font-style: normal; } .comments .comment .comment-actions a { display: inline-block; font-weight: 500; font-size: 13px; line-height: 15px; margin: 4px 8px 0 0; } .comments .continue a { display: inline-block; font-weight: 500; padding: .5em; } .comments .comment .comment-actions a:hover, .comments .continue a:hover{ text-decoration:underline; } .pesan-komentar { padding: 0 8px; font-weight: 500; } .pesan-komentar p { margin: 5px 0; } .comments .comments-content .loadmore { max-height: 0; opacity: 0; overflow: hidden; } .comments .comments-content .loadmore a { display: block; padding: 10px 16px; text-align: center; } .deleted-comment { font-style: italic; opacity: .5; } /* FOOTER WIDGET */ #widget-footer-container { background: $(widget.background.color); padding: 0 30px; overflow: hidden; line-height: 1.6em; } #widget-footer-wrapper { margin: 0 auto; max-width: 900px; color: $(widget.color); } #widget-footer-wrapper .widget { margin: 30px 0; } #widget-footer-wrapper .widget a { color: $(widget.link.color); } #widget-footer-wrapper .widget a:hover { color: $(widget.hover.color); } #widget-footer-wrapper .widget ul, #widget-footer-wrapper .widget ol { list-style: none; margin: 0 0; } #widget-footer-wrapper .widget ul li, #widget-footer-wrapper .widget ol li { font-weight: 500; margin: 0.3em 0; } #widget-footer-wrapper h2 { font-size: 16px; font-weight: 500; text-transform: uppercase; margin-bottom: 20px; } #widget-footer1 { width: 34%; float: left; padding-right: 20px; box-sizing: border-box; } #widget-footer2 { width: 32%; float: left; } #widget-footer3 { width: 34%; float: right; padding-left: 20px; box-sizing: border-box; } /* FOOTER */ #footer-container { background: $(footer.background.color); padding: 20px 30px; overflow: hidden; color: $(footer.color); font-size: 13px; text-align: center; } #footer-wrapper { max-width: 900px; margin: 0 auto; overflow: hidden; } #footer-wrapper .footer-right { float: right; } #footer-wrapper .footer-left { float: left; } #footer-wrapper a { color: $(footer.link.color); } #footer-wrapper a:hover { color: $(footer.hover.color); } /* Online Shop CSS */ .daftar-produk, .judul-jasa-pengiriman { position: relative; text-align: center; margin-bottom: 20px; } .daftar-produk, .judul-jasa-pengiriman, .breadcrumbs-outer, .judul-produk-lainnya, .judul-review { color: $(subjudul.color); } .daftar-produk { margin-bottom: 30px; } .judul-jasa-pengiriman { margin: 0 0 30px 0; } .daftar-produk:before, .judul-jasa-pengiriman:before { z-index: 1; content: ""; width: 100%; height: 2px; position: absolute; top: 50%; left: 0; margin-top: -1px; } .daftar-produk:before, .judul-jasa-pengiriman:before, .breadcrumbs-outer:before, .judul-produk-lainnya:before, .judul-review:before { background: $(subjudul.border); } .daftar-produk h2, .judul-jasa-pengiriman h4 { display: inline-block; margin: 0; text-transform: uppercase; font-size: 16px; background: #fff; z-index: 1; position: relative; padding: 4px 16px; font-weight: 500; border: 2px solid $(subjudul.border); border-radius: 15px; } .harga-produk { font: $(harga.font); color: $(harga.color); } .status-produk { position: absolute; top: 4px; left: 0; } .promo, .produk-terlaris, .stok-habis { position: relative; padding: 0 8px; margin-bottom: 4px; color: #fff; font-size: 12px; text-transform: uppercase; font-weight: 500; height: 24px; line-height: 24px; } .promo { color: $(promo.color); background: $(promo.background); } .produk-terlaris { color: $(terlaris.color); background: $(terlaris.background); } .stok-habis { color: $(stokhabis.color); background: $(stokhabis.background); } .promo:after { border-left: 8px solid $(promo.background); } .produk-terlaris:after { border-left: 8px solid $(terlaris.background); } .stok-habis:after { border-left: 8px solid $(stokhabis.background); } .stok-habis:after, .produk-terlaris:after, .promo:after, .ini-artikel:after { content: ""; border-top: 12px solid transparent; border-right: 8px solid transparent; border-bottom: 12px solid transparent; position: absolute; top: 0; right: -16px; } .tombol-beli { margin: 20px 0; } .beli-lewat-chat { overflow: hidden; padding-top: 10px; } .beli-lewat-chat h3 { font-size: 15px; font-weight: 500; text-transform: uppercase; margin-bottom: 5px; } .beli-lewat-chat a, .chat-wa, .chat-sms, .chat-phone { display: inline-block; margin: 5px 5px 5px 0; padding: 4px 15px; border-radius: 18px; font-weight: 500; background: $(link.hover.color); color: #fff; } .beli-lewat-chat a:hover, .chat-wa:hover, .chat-sms:hover { background: $(link.color); } .beli-lewat-chat a i, .chat-wa i, .chat-sms i, .chat-phone i { margin-right: 3px; } .chat-sms i { font-size: 15px; } #jasa-pengiriman-widget { font-size: 18px; } .jasa-pengiriman { text-align: center; } .jasa-pengiriman span { background-image: url(https://4.bp.blogspot.com/-n48Smor3gDM/WtoQMCimDFI/AAAAAAAAGaU/rqDENl6nV4cyt6gltr23VhAKror_vhTfgCLcBGAs/s1600/logo-pengiriman.png); display: inline-block; margin: 2px 3px; border: 2px solid #eaeaea; border-radius: 3px; } .jdant { width: 135px; height: 60px; background-position: -205px -10px; } .jne { width: 122px; height: 60px; background-position: -205px -90px; } .posindonesia { width: 85px; height: 60px; background-position: -140px -170px; } .sicepat { width: 145px; height: 60px; background-position: -10px -90px; } .tiki { width: 175px; height: 60px; background-position: -10px -10px; } .wahana { width: 110px; height: 60px; background: url('css_sprites.png') -10px -170px; } /* MEDIA QUERY */ @media only screen and (max-width:1080px){ #wrapper { margin: 0 auto; } #header-wrapper { padding-left: 30px; padding-right: 30px; } .sticky-mobile { margin-right: 30px; } .search-icon { right: 30px; } } @media only screen and (max-width:800px){ #header-wrapper { padding-left: 0px; padding-right: 0px; position: relative; } #wrapper { padding: 70px 20px 20px; } #widget-footer-container { padding: 0 20px; } #widget-footer1 { width: 100%; float: none; padding-right: 0; } #widget-footer2 { width: 100%; float: none; } #widget-footer3 { width: 100%; float: none; padding-left: 0px; } #footer-container { padding: 20px 20px; } #cssmenu > ul > li > a { padding: 12px 20px; } .button { margin-right: 20px; } .header { max-width: 100%; position: absolute; top: 0; left: 20px; z-index: 1; } .search-icon { right: 55px; } .jasa-pengiriman img { height: 50px; } } @media only screen and (max-width:640px){ #cssmenu > ul > li > a { padding: 12px 20px; } .button { margin-right: 20px; } .header { left: 20px; } #post-wrapper { float:none; width:100%; max-width:100% } .search-icon { right: 60px; } } @media only screen and (max-width:480px){ #wrapper { padding: 65px 15px 15px; } .header { max-width: 70%; left: 15px; } #widget-footer-container { padding: 0 15px; } .button { margin-right: 15px; } .search-icon { right: 55px; } .post-body a > img { width: 100%; } h1{font-size:170% } h2{font-size:150% } h3{font-size:130% } h4{font-size:120% } h5{font-size:110% } h6{font-size:100% } .comments .comments-content .comment-replies{ margin-left:20px !important; } .comments .comment-block { padding: 15px !important; } .comment .comment-thread.inline-thread .comment { margin: 0 0 0 0 !important; } iframe#comment-editor { min-height: 270px; } h1.post-title { font-size: 22px; } #searchfs input[type="search"] { font-size: 26px; } #footer-wrapper .footer-right, #footer-wrapper .footer-left { float: none; margin: 5px 0; } .jasa-pengiriman img { height: 40px; } } ]]> >"; position: absolute; bottom: 18px; z-index: 999; right: 80px; color: #999; font-size: 12px; } body#layout #wrapper, body#layout #header-wrapper, body#layout #footer-container, body#layout #widget-footer-container { margin: 0 0; padding: 0 20px; } body#layout #footer-container { padding-bottom: 20px; } body#layout #widget-footer1 { width: 32%; float: left; padding-right: 2%; box-sizing: border-box; } body#layout #widget-footer2 { width: 32%; float: left; } body#layout #widget-footer3 { width: 32%; float: right; padding-left: 2%; box-sizing: border-box; } body#layout #cssmenu { display: block; padding: 20px; margin: 8px 0; width: 500px; font-size: 14px; color: #fff; background: #bbbbbb; font-weight: bold; float: right; } body#layout #cssmenu:after { content: "Menu navigasi harus diedit melalui Edit HTML"; color: #fff; position: absolute; top: 30px; left: 20px; visibility: visible; } body#layout #searchfs, body#layout .section h4 { display: none; } body#layout div.section { background: transparent; margin: 0px 0px 15px 0px; padding: 0px; border: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body#layout .above-post-widget:before { content: "Widget di Atas Post (Hanya Homepage)"; } body#layout .Blog:before { content: "Posting Blog"; margin-bottom: 8px; } body#layout .bellow-header-widget:before { content: "Widget di Bawah Header/Menu Navigasi"; } body#layout #widget-footer-container:before { content: "Widget di Atas Footer"; } body#layout .above-post-widget:before, body#layout .Blog:before, body#layout .bellow-header-widget:before, body#layout #widget-footer-container:before { padding: 5px 10px; display: block; font-size: 14px; color: #fff; background: #bbbbbb; box-shadow: rgba(0,0,0,0.12) 0 0 2px 0, rgba(0,0,0,0.24) 0 2px 2px 0; font-weight: bold; } body#layout .add_widget, body#layout .widget-content { padding: 12px; } body#layout .add_widget a { margin-left: 0px; font-size: 14px; } body#layout div.layout-title { font-size: 14px; } body#layout div.layout-widget-description { font-size: 12px; } body#layout .editlink { color: #FFFFFF !important; background: #bbbbbb; border-radius: 15px; padding: 4px 6px; } body#layout #footer-wrapper { position: relative; background: #fff; height: 40px; border: 1px solid #ddd; } body#layout #footer-wrapper:after { content:"Footer"; color:#999; position:absolute; top:12px; } ]]> <!----></head>

Daftar Produk
<div class='hilangkan'>
</div>

 

Beranda /
/ /
Beranda / Tanpa Kategori /
Beranda / Arsip Produk
Beranda /
Beranda / Daftar Produk Beranda /

()

Ditulis Pada

Beli Sekarang :