/*
Theme Name: Mbanyumili
Theme URI: https://polopalsu.com/mbanyumili
Author: Polo Palsu
Author URI: https://polopalsu.com
Description: mbanyumili, very cool & light wordpress theme with static editable front page
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mbanyumili
Tags: Front page available, responsive
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* Start: reset  */
.clearfix:before, .clearfix:after {content: ""; display:table;}
.clearfix:after {clear:both;}
.clearfix {display:block;position:relative;clear:both !important;}

.clear,span.clear,div.clear,p.clear{clear:both;margin:0px auto;padding:0px;}

*{
    box-sizing:border-box;
}

a,a:hover,abbr,acronym{text-decoration:none;}
li {margin-bottom:5px;font-size:14px;}
blockquote{padding: 10px;font-size: 25px;text-align: center;margin: 0;}
p#slogan {text-align:center;}

/* End: reset  */

/* Main */

html{width:100%;}
body{max-width:100%;background:#FFFFFF;margin:0;padding:0;font-family: sans-serif;}
/* article p{
    font-family: sans-serif;
} */
article h1,article h3 {
    font-family: "Roboto Condensed";
}

article h2{
    font-family:Bernard MT Condensed;
}

/* Structure */
.wrap-all, #optimized-body{background:#F1F1F1;}

p, span.page-numbers {padding:10px 5px;}
.contentnya p {padding:10px;}

/* Text meant only for screen readers. */

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}

/* img */
img {border: 0; height: auto; max-width: 100%; vertical-align: middle;opacity:1;}
.gbr-garam{
    padding: 15px 0;
}


/* Alignment */
.alignleft {
    display: inline;
    float: left;
}

.alignright {
    display: inline;
    float: right;
}

.aligncenter {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

blockquote.alignleft,
.wp-caption.alignleft,
img.alignleft {
    margin: 0.4em 1.6em 1.6em 0;
}

blockquote.alignright,
.wp-caption.alignright,
img.alignright {
    margin: 0.4em 0 1.6em 1.6em;
}

blockquote.aligncenter,
.wp-caption.aligncenter,
img.aligncenter {
    clear: both;
    margin-top: 0.4em;
    margin-bottom: 1.6em;
}

blockquote.alignnone,
.wp-caption.alignnone,
img.alignnone {
    clear: both;
    margin: 0.4em 1.6em 1.6em 0;
}

.wp-caption.alignleft,
.wp-caption.alignright,
.wp-caption.aligncenter {
    margin-bottom: 1.2em;
}

/* CSS New */
.bag-atas{
    background: linear-gradient(#1b6bb1,#5fa8e7);
}

/* css bareng-bareng */
.wrap-content,.kolom-dua,.kolom-tiga,div.widget-footer-container,.bungkus-bag-tengah-atas,.info-kontak,.nama-menu,.wrap-content-nduwur,.wrap-konten-bag-atas,.wrap-title-arch{
    max-width:1100px;
    margin:0 auto;
    float:none;
    overflow: hidden;
}
.wrap-title-arch{max-width: 1100px;}
.kolom-arch{width: 100%;}
.wrap-the-arch{padding: 0;}
.wrap-konten-bag-atas{overflow: visible;}
.wrap-content-nduwur{
    max-width: 1200px;
}

.wrap-content-kontaknya{
    max-width:1100px;
    margin:0 auto;
    padding: 0;
}

.info-kontak{
    line-height:35px;
    float: none;
    overflow: hidden;
    padding:0 0 0 10px;
}

.kontak-kiri{
    width: 100%;
}
.kontak-kiri{
    float: left;
}

.konten-kiri{
    float: none;
    overflow: hidden;
    max-width:100%
}

.emailnya,.kontaknya{
    max-width: 50%;
    float:left;
}

.emailnya{
    border-right:1px dotted #fff;
    padding: 0 10px 0 5px;
}

.kontaknya{
    padding-left:10px;
}

span.sym{
    font-size:20px;
}

.emailnya-apa,.nomor-kontak{
    float:left;
    color:#fff;
	font-size:12px;
}

.emailnya-apa img,.nomor-kontak img{
    width:20px;
}

/* Header bagian tengah atas */
.bag-tengah-atas{
    background:url(img/bg.jpg) top center no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
     background-size: cover;
     height: 100%;
     overflow: hidden;
     position: relative;

}
.bungkus-bag-tengah-atas{
    float: none;
    overflow: hidden;
}
.wrap-konten-bag-tengah-atas{
    padding: 20px 0;
}

.nama-web{
    text-align: center;
}

.nama-web{
    font-size: 35px;
    text-transform: uppercase;
    font-weight: bold;
}
.nama-web a{
    color: #002080;
}

article.home .nama-perusahaan h2{
    font-family: Bernard MT Condensed;
    font-size: 30px;
	text-align:center;
    color: #002080;
    margin: 0;
    padding: 0;
	font-weight:normal;
}

/* foto text */
.top-opening{
}

.foto-text{
    position:relative;
    word-wrap: break-word;
    float:none;
    overflow:hidden;
    padding:0 15px;
    background: #fff;
}

/* custom font  */
@font-face {
    font-family: Bernard MT Condensed;
    src: url(fonts/BERNHC.TTF);
    font-weight: normal;
    }

@font-face {
    font-family: Britannic Bold;
    src: url(fonts/BRITANIC.TTF);
    font-weight: normal;
    }

/* Header Bawah Bawah */

.bag-bawah{
    /*border-bottom: 2px solid #E98402;*/
	background:#fff;
}

.nama-menu{
    float:none;
    overflow:hidden;
    padding: 0 20px;
}

.navigasi{
    width:100%;
    margin:0;
    padding:0;
}
.title-desc{width: 50%;}
.navigasi,.title-desc{
    float:left;
}

.wrap-konten-bag-bawah-kiri{
    padding: 10px 0;
	float:none;
	overflow:hidden;
}
.logo-perusahaan {
    max-width:100%;
}
.logo-perusahaan img{max-width:200px;}
/*.wrap-name-moto{max-width:84%;float:left;padding: 3px 0 0 10px;}
.nama-perusahaanya{font-size: 35px;font-weight: bold;color: #F09A0F;padding: 18px 0 0 0;}
.motonya{color: #1457A0;font-size: 16px;}*/

/* ==========  START: CSS Tambahan  ============== */
.sangkar-top-luar{
    margin:0;
    padding:0;
}

.sangkar-top-dalam{
    position:relative;
}

.wrap-nav{
    width:100%;
}

/* Konten */
.wrap-top-content{
}

.bungkus-konten,.kolom-sidebar{
    margin:20px 0 0 0;
}

.kolom-atas{
    float:none;
}

.foto-produk img{
    border-radius:10px 10px 0 0;
}

.title-desc-produk{
    padding: 0 10px;
}

.foto-produk img{
    max-width: 100%;
}

article.home h2{
    font-size: 28px;
    margin:40px 0;
    padding:0 10px;
    color:#002080;
}
/* Order Button */
article.single .order-button-list {margin: 20px 0;display: block;position: relative;text-align: center;}
article.single .order-button-list p.kontak-panitia{font-size: 20px;text-align: center;line-height: 1.5;}
.wa {background-color: #1AA32F;}
.sms {background-color: #4744F5;}
.telp {background-color: #000066;}
.tele{background-color:#1A8EC8;}
.fa{border: none;border-radius: 25px;color: white;padding: 10px 15px;text-align: center;text-decoration: none;display: inline-block;font-weight: normal;margin: 5px;cursor: pointer;-webkit-box-shadow: 0 8px 6px -6px black;-moz-box-shadow: 0 8px 6px -6px black;box-shadow: 0 8px 6px -6px black;display: inline-block;font: normal normal normal 14px/1 FontAwesome;    font-size: inherit;text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.wa-size, .fa {font-size: 16px;}
article.single .order-button-list ul li {list-style: none;display: inline;}
article.single div.pesan-now {background: #ffe066;padding: 20px;border: 3px dashed blue;}
/* ==========  END: CSS Tambahan  ============== */
/* Header */
.header{width:100%;margin:0 auto;padding:0; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.27);-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.27);box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.27);}

/* Nav Logo Container*/
.top-identity {background:#fff; float:none; overflow:hidden;}

.nav-logo {background:#FFFFFF; float:none; overflow:hidden;}

/* Logo */
.sangkar-logo {max-width:20%;float:left; margin: 0 0 0 15px;padding:5px; text-align:left;}
.sangkar-logo img{width:10px; height:auto; min-width:179.2px;}

/* nav header */

#nav-check {
  display: none;
}

/*.menu*/
.batas-konten-menu{
    /* pembagian harus 100% dengan batas konten kiri */
    max-width:50%;
    float:right;
}
.bungkus-konten-menu{
    max-width:100%;
}
.tempat-menu{
    /* Misal nanti ada padding */
}

.primary-menu {margin:0 auto; padding:5px 0;max-width:100%;position:relative;}
ul.primary-menu li.menu-item{position:relative;}

.nav-links ul{
    text-align:center;
    margin: 0;
    padding: 0;
}
.nav-links ul li{
    display:inline;
}
.nav-links ul li a{
    color:#fff;
    font-size:12px;
    padding:5px 10px;
    line-height:20px;
    cursor:pointer;
    display:inline-block;
    text-transform: uppercase
}
.nav-links ul li a:hover,.nav-links ul li a:active{background:linear-gradient(#1545ac,#3567d4);}
/* Sub Menu */
.nav-links ul li ul,.nav-links ul li ul li {margin:0;}
.nav-links ul li ul li{display:block;text-align:left;}
.nav-links ul li ul li a{color:#000;display:block;position:relative;padding:10px;background:#EBEBEB;}
.nav-links ul li ul li a:hover{background:#b0b0b0;}
.sub-menu {
    display:none;
    z-index:999999;
    position:absolute;
	left:0;
	width:200px;
	margin:0;
	padding:0;
}

.nav-links ul li:hover .sub-menu{display:block;}


/* Nav Mobile */
label.hamburger {text-decoration: none;
    color:#fff;
    padding: 10px;
    font-size:16px;
    font-weight:bold;
    display:none;
    margin:5px 10px;
    }
.itu{font-weight:bold;}


/* Search Form */
/* Search Form */
.batas-konten-search{
    max-width:50%;
    float:right;
    padding: 0 0 0 10px;
}

.tempat-search{
    max-width:100%;
}
.isine-search{
    /* seandainya nanti ada margin atau padding atau line-height */
    color:#f05305;
    position: relative;
}
label.searchput{

}
input#kotak-search{
    display:none;
}


div.hd-search {
    position:relative;
    display: block;
    padding: 10px 0;
}

.label-search, div.hd-search label{
    display:none;
    visibility:hidden;

}

div.hd-search #searchsubmit {
    background-color:#345db7;
    color:#fff;
    padding: 5px 14px;
    border:none;
    vertical-align:top;
    width:100%;
	border-radius:5px;
    cursor: pointer;
}

div.hd-search #s {
    vertical-align:top;
    padding:3px;
    background:#F9F9F9;
    width:100%;
    color:#CCCCCC;
}

.wrap-search {max-width:100%; margin:0; padding:0;float: none;overflow: hidden;padding: 19px 0;}
.kotak-search {float:left;padding-right: 5px;}
.klik-cari {float: left;padding-left: 5px;}

form{
    margin: 0;
}

/* Post Info */
p.post-info {font-size:12px; margin: 0 0 15px; padding: 2px 10px;}
p.post-info a {color:#000;}

/* title and desc */
.title-and-desc,.title-opening {
    width: 100%;
    padding: 0 5px 20px 5px;
    margin: 40px 0;
}

/* Article Home */
article.home h3{color:#000; text-align:left; padding:15px 5px 5px 0; font-weight:normal;font-size:25px;margin: 0 0 10px 0;}
article.single h1.home-headline{font-size:40px;color:#000;text-align:left;font-weight:bold;margin: 40px 0 20px 0;text-transform:uppercase;}
article.home .title-opening h1,article.home .title-jual h1{
    font-size:30px;
}
article.home p.utk-desc{text-align: left;}


.tempat-separo{
    width: 50%;
    float: left;
    padding: 0 10px;
}
article.home p{padding:10px 0; margin:10px 0; text-align:justify;font-size: 14px;line-height:1.5;}
article.home p.produk-info{
    margin: 3px 0 5px;
    text-align:center;
}
.bagi-papat{
    max-width:25%;
    float: left;
    position: relative;
}

/* Article Single */
article.single h1, article.single h1 a, article.single h3, article.single h3 a, article.single h2, article.single h2 a{color:#000; font-size:30px; margin:20px 0 10px 0;padding:5px;font-weight:normal;}
article.single h1 a:hover, article.arsip h3 a:hover, article.single h3 a:hover, article.single h2 a:hover {color:#000;}
article.single h2 {font-size:25px;}
article.single h3 {font-size:20px; margin-top: 10px;}
article.single h2,article.single h3, article.single h4, article.single h5, article.single h6{background:none; color:#000;font-weight:bold;}
article.single p {margin:0;line-height:1.5;}
article.single {border-bottom:1px dotted #663300;margin-bottom:25px; font-size:15px;}
article.single:last-of-type{border-bottom:none;}
.info-post{margin: 30px 0;}
article.single p.post-info{padding: 0 10px;line-height:2.5;}
article.single p.post-info a{background:#67c0ff;padding: 5px; border-radius: 5px;}
article.single p.post-info a:hover{background: #a9d9fb;}

/* Post Thumbnail */
div.post-thumbnail{
    margin:20px 10px;
}

/* Table */

table{border-collapse:collapse;padding:0 10px;width:100%;color:#000;font-size:14px;}
thead th{border-bottom:2px solid #bbb;padding-bottom:.5em}
thead{border-bottom:1px solid #000;border-top:1px solid #000;text-align:center;font-size:16px;}
th{padding:.4em;text-align:left}
tbody{text-align:left;}
tr{border-bottom:1px solid #000;}
tr:last-child{
    border-bottom: none;
}
thead:first-child{
    border-top: none;
    font-size: 18px;
}

td{padding:.4em;}
th:first-child,td:first-child{padding-left:10px;}
th:last-child,td:last-child{padding-right:5px;}

/* Footer */
.site-footer{background:#002d91; margin:20px 0 0 0; padding:0;}

/* Archive */
article.arsip h3, article.arsip h3 a, h2, h3.comment-reply-title, .titlenya h2{color:#663300;}
article.arsip h3, h3.comment-reply-title  {margin:10px; font-weight:normal;}
h2, .titlenya h2 {text-align:left;}
.kolom-dua h2,.kolom-tiga h2{
    text-align: center;
    color: #000;
    font-family: Roboto Condensed;
    font-size:27px;
    margin: 40px 0;
}

/* Comment */
h3.comment-reply-title, #comments-title {margin-top:40px;margin-bottom:5px;}
p.comment-notes{padding:0 10px;margin:0;}
.comment-metadata{margin:5px 0;}
#comments-title {margin-left:10px;}
div.comment-metadata a, div.reply a, .logged-in-as, .logged-in-as a {font-size:14px; color:#846222;}

/* Kolom Kanan */
.kolom-konten {width:75%; float:left;overflow:hidden;}
.wrap-the-content{padding: 0 15px 0 0;}
div.widget_text.list-item{padding: 0 0 15px 0;}
div.widget_text.list-item h4 {margin: 15px 0 0 0;text-align: center;}
div.widget_text.list-item p{text-align: center;margin:20px 0 10px 0;}
div.widget_text.list-item p a{color: #fff;background: #F05305;border-radius: 10px;padding: 10px;font-weight: bold;}
div.widget_text.list-item p a:hover{background: #002060;color:#F09A0F;}
div.list-item{padding:15px;margin-bottom: 20px;background: #fff}

/* Kolom sidebar */
.kolom-sidebar {width:25%; float:left;}

/* Sidebar */
div.kolom-sidebar h4 {margin:5px 0 10px 0;}
div.kolom-sidebar h4, div.kolom-sidebar ul li, div.kolom-sidebar ul li a {color: #002060;}
div.kolom-sidebar ul {margin:0 0 0 5px;padding:0;}
div.kolom-sidebar ul li {list-style:circle; margin-left:5px;font-size:12px;}

/* Widgets */
.textwidget p{margin:0;padding:0;color:#FFFFCC;font-size:13px;}
.textwidget a{color:#FFFFCC;}.textwidget a:hover{color:#F1F1F1;}

/* Footer Widgets Area */
.footer-widget-area{
    max-width:25%;
    width:25%;
    float:left;
    padding-right:40px;
    box-sizing: border-box;
}
div.footer-widget-area h4{color:#ECC47A; margin-bottom:5px;}
div.footer-widget-area ul {margin:0;padding:0;}
div.footer-widget-area ul li {margin:0;padding:0; font-size:15px; color:#FFFFCC;list-style:none;}
div.footer-widget-area ul li a, div.copyright p {color:#fff;font-size:14px;}
div.copyright a{color:#FFF;}

/* widget-footer-container */
.konten-footer{
    background: linear-gradient(#5fa8e7,#1b6bb1);
}

div.widget-footer-container {margin:0 0 10px;;padding:10px 0 20px;}

/* copyright */
div.copyright{text-align: center;
    margin-top: 25px;
    float: left;
    width: 100%;
    padding: 0 10px;}
div.copyright p
div.copyright a {color:#CCCCFF;}
div.copyright a:hover {color:#00CCCC;}

/* article-blog */
article.blog h3, article.blog h3 a {font-size:120%; margin:10px 5px 0 0;}
article.blog p {margin: 0 10px 0 0;}
article.blog {margin-bottom: 15px;}
article.blog p.post-info {margin-bottom:15px;}

/* Aside Styles */
article.post-aside,
article.post-link {
    font-size: 125%;
    background-color:#FFF5CB;
    padding:20px;
    border-radius: 5px;
    box-shadow: 3px 3px 3px rgba(0,0,0, .1);
    margin:20px 0;
}

.mini-meta {
    font-size:68%;
    margin:0;
    color:#777;
}

/* Link Post Format Styles */
article.post-link {
    padding:0;
    background-color:#E0EBFF;
}

article.post-link a {
    display:block;
    padding:20px;
}

/* Post Format Gallery */
article.post-gallery {
    background-color:#222;
    color:#FFF;
    padding:20px;
}

article.post-gallery img{
    border:none !important;
}

article.post-gallery h2 {
    text-align:center;
}
/*article.single img.size-thumbnail{float:left;}*/

/* caption */
figcaption.wp-caption-text {color:#FFFFCC;background: #846222;text-align: center;margin: 0px;font-size: 14px;padding: 5px;}

/* Slider */
.bungkus-banner{
    padding: 20px 0;
	/*background:url(img/banner-website.jpeg);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:top center;*/
}

.bungkus-banner-jual{
    background:#666666;
    border-bottom: 5px solid #E98402;
    height: auto;
    width: 100%;
    margin: 0;
    padding: 40px 0;
}

.banner{
    position: relative;
    overflow: hidden;
    width:100%;
	text-align: left;
}

/*.banner img{
    width:1100px;
    height: 300px;
}*/
/*img new-post*/
.imgnew-post{max-width:80%;height:auto;margin:0 auto;}

.sangkar-background{
    border-bottom: 5px solid #EFC62C;
}
span.highlight{padding:3px 5px;background:#eee;color:#444;}
/* Slider */
.bungkus-slider{border-bottom: 4px solid #E98402;
}

.container{
    position: relative;
    overflow: hidden;
    width:100%;
    height: 375px;
}
.container .slider{
    position: absolute;
    top:0;
    left:0;
    width:500%;
    height: 100%;
    animation: animate 10s linear infinite;
}
.container .slider:hover{
    -webkit-animation-play-state:paused;
    -moz-animation-play-state:paused;
    -o-animation-play-state:paused;
    animation-play-state:paused;
    cursor: pointer;
}
@keyframes animate{
    0%{
        left: 0;
    }
    20%{
        left: 0;
    }
    25%{
        left: -100%;
    }
    45%{
        left: -100%;
    }
    50%{
        left: -200%;
    }
    70%{
        left: -200%;
    }
    75%{
        left: -300%;
    }
    95%{
        left: -300%;
    }
    100%{
        left: -400%;
    }

}
.container .slider .slide{
    position:relative;
    width: 20%;
    height: 100%;
    float:left;
}

.slide1 img,.slide2 img,.slide3 img,.slide4 img{
	width: 100%;
	height: auto;
	object-fit: cover;
	-o-object-fit: cover;
	object-position: center;
}
.img-post{max-width:100%;clear:both;margin:10px auto;text-align:center;}
/* Floating Whatsapp */
.wa-animate{position:fixed;right:10px;bottom:5%;}
span.the-wa-text,span.whatsapp-logo,input#wa-text,label.text-for-wa{float:left;}
input#wa-text{display:none;}
label.text-for-wa{cursor:pointer;padding:5px 15px;font-size:14px;color:#fff;line-height:1.75;background:rgba(32, 150, 23, 1);border-radius:20px;text-align:center;}
span.whatsapp-logo{max-width:25px;margin-left:5px;}
.bungkus-title-wa{background:rgba(32, 150, 23, 1);border-radius:10px 10px 0 0;padding:20px 0;}
.description-wa-company,.description-wa-company p.centerkan{text-align:center;}
.description-wa-company{padding:0 10px;}
.description-wa-company p.centerkan{font-size:14px;color:#fff;margin:5px 0;}
.image-wa-company{max-width:100%;text-align:center;}
.image-wa-company img,.img-profile img{max-width:15%;}
.bungkus-list-admin{background:#209617;float:none;overflow:hidden;border-radius:0 0 10px 10px;padding:5px;}
.list-content-admin{padding:10px;border-bottom:1px solid #CDCDCD;}
.img-profile img{border:none;max-width:70%;}
.img-profile,.detail-status-admin,.wa-admin-status,.status-sign{float:left;}
.img-profile,.img-profile-dua,.img-profile-tiga{max-width:25%;}
.detail-status-admin{max-width:75%;}
.detail-status-admin p.admin-name{font-size:16px;font-weight:bold;}
.detail-status-admin p.admin-company-role, .admin-status p.onoff {font-size: 12px;}
.detail-status-admin p.admin-company-role,.admin-status p.onoff,.detail-status-admin p.admin-name{margin:0;padding: 0;line-height: 1.5;}
.admin-status{float:none;overflow:hidden;position:relative;}
.wa-admin-status{margin-right:5px;}
.status-sign{width:8px;height:8px;background:#52E348;border-radius:50%;margin-top:5px;}
a.lets-contact:hover{cursor:pointer;background:#EBEBEB;}
a.lets-contact{display:block;color:#000;}
.wrap-wa{position:fixed;bottom:0;right:20px;}
.the-wa-box{max-width:300px;position:fixed;right:10px;bottom:-100%;overflow-y:auto;transition:bottom 250ms ease-in-out}
#wa-text:checked + .the-wa-box{bottom:14%;}
/* Jika Ada tinggal di hapus saja & copy-paste ke a.lets-contact{display:block;color:#000;} untuk merubah display nya
a.lets-contact-dua,a.lets-contact-tiga{display:none;visibility:hidden;}*/
.animated.delay-3s {
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp;
}
-webkit-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}
.to-top{position: fixed;bottom: 30px;left: 20px;text-align: center;background:rgba(36, 45, 56, 0.75);}
.to-top a{color:#fff;font-size: 12px;padding: 10px;display: block;}
/* Form WA */
p.frm span.fLabel{margin:0px;padding:0px;text-align:left;font-size:14px;font-family:sans-serif;text-align:center;line-height:1.4;color:#222;}input.f_{border:1px solid #777;font-size:12px;color:#444;padding:5px 14px;border-radius:5px;text-align:center;background:#fff;}#btn_submit,#btn_submit_dua,#btn_submit_tiga{background:#209617; color:#f1f1f1;    cursor:pointer;}#txtNama,#txtPhone,#txtJmlOrder,#txtAlamat,#txtPesan,#txtNamaDua,#txtPhoneDua,#txtJmlOrderDua,#txtAlamatDua,#txtPesanDua,#txtNamaTiga,#txtPhoneTiga,#txtJmlOrderTiga,#txtAlamatTiga,#txtPesanTiga{margin:5px 0;}#txtJmlOrder,#txtPesan,#txtJmlOrderDua,#txtPesanDua,#txtJmlOrderTiga,#txtPesanTiga{padding:5px 12px;border-radius:5px;max-width:80%;}.form_submit{text-align:center;background: #fff;padding: 10px 0;border-radius: 10px;}p.frm{margin:5px 0px;padding:0px;}

/* Additional CSS */
.img-placeholder {margin: 30px 0;text-align: center;box-shadow:0px 3px 5px 0px rgba(0,0,0,0.75)}
.img-placeholder img {max-width: 100%;height: auto;border-radius: 8px;}
.img-placeholder figcaption {margin:0px;padding:5px;font-style: italic;color: #777;font-size: 0.9em;}
.cta-top-box {background-color: #eaf5ff;border: 2px dashed #3498db;padding: 25px;border-radius: 10px;text-align: center;margin: 30px 0;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);}
.cta-top-box p {font-size: 1.1em;margin-bottom: 15px;color: #2c3e50;text-align: center;}
.cta-box{background-color: #2c3e50;color: #fff;padding: 30px;margin-top: 40px;border-radius: 8px;text-align: center;}
article.single .cta-box h2 {color: #fff;border-bottom: 2px solid #3498db;padding-bottom:20px;text-align:center;}
.cta-box p {color: #ecf0f1;}
.cta-box ul {list-style-type: none;padding: 0;margin: 15px 0;}
.cta-box li {margin-bottom: 10px;font-size: 1.1em;}
.cta-box a.whatsapp_button,.cta-top-box a.whatsapp_button,.cta-box a.cta-button,.cta-top-box a.cta-button{display: inline-block;background-color: #209617;color: #fff;padding: 12px 25px;border-radius: 25px;font-size: 1em;transition: background-color 0.3s;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);}.cta-box a{color:#FFD764;text-decoration:none;}
.cta-box a.whatsapp_button,.cta-top-box a.whatsapp_button,.cta-box a.cta-button,.cta-top-box a.cta-button{text-decoration:none;margin:20px 0 0 0;}
.cta-box a.whatsapp_button:hover,.cta-top-box a.whatsapp_button:hover,.whatsapp-button:hover,.cta-top-box a:hover,.cta-box a:hover{background-color: #128C7E;transform: translateY(-2px);}
/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

@media (max-width:768px){

    article.home p.utk-desc {
        margin: 0;
		line-height: 1.3;
		padding: 5px 0 0 0;
    }


    /* Konten */

    .wrap-top-content{
            background-size: cover;
    }

    .title-desc,div.copyright{
        float:none;
        text-align:center;
        max-width:100%;
        margin:0;
        padding:0;
    }
    .title-desc{
        width:100%;
    }

    .logo-perusahaan{
        max-width: 40px;
    }
	.wrap-search{padding: 10px 0 20px 0;}
	.batas-konten-search{max-width: 100%;float: none;padding: 0;}
	nav{padding:0;}
}
@media screen and (max-width:375px){
	.wrap-name-moto .nama-perusahaanya{text-align:left;font-size:20px;}label.hamburger{line-height:35px;}
}

/* END: MEDIA Tambahan */

@media screen and (max-width:900px) {
	article.single h1.home-headline{margin: 20px 0 10px 0;font-size:30px;}
    .kolom-konten, .kolom-sidebar{width:100%;float:none;}
    .wrap-the-content{padding: 0;}
    .bungkus-banner{padding: 10px 0;}
    .banner img{width: auto;height: auto;}
    .bungkus-konten{margin: 10px 0 0 0;}
    label.hamburger{display: block;text-align:center;line-height:5px;}
    label.hamburger:hover{background:#0070C0;}
    div.hd-search{margin-top: 0;}
    .wrap-search{background: none;}
	.wrap-konten-bag-bawah-kiri{padding: 10px 0 0 0;}
	.wrap-search{float:none;}
	.navigasi{float:none;text-align:center;width:100%;margin:0;padding:0;}

  .nav-links,.to-top {
    display:none;
  }
    textarea#comment{width: 100%;}
    .pendaftaran{float:left;}

  .nav-links ul li a {
    display: block;
    width: 100%;
    text-align:center;
  }

  .logo-perusahaan{max-width:100%;}
    .logo-perusahaan img{max-width: 150px;}
	.logo-perusahaan,.logo-perusahaan img{text-align:center;}
    #nav-check:checked + .nav-links{display:block;position:relative;}.sub-menu{display:block;position:relative;}
	.nav-links ul li ul li a{color:#fff;background: linear-gradient(#1b6bb1,#5fa8e7);}
	/*.nav-links ul li:hover .sub-menu {left:0;display:block;position:relative;} .nav-links ul li ul li {display:block;}*/
	.sub-menu{left:0;width:100%;background:none;}

  /* PR Remove Hover Effect atau Lanjutkan Belajar Walker */
	
    .footer-widget-area {max-width:100%;float:none;width:100%;text-align:center; border-bottom:1px solid #ECC47A;padding-bottom:15px;}
    .nav-container,.opening,{float:none;max-width:100%;text-align:center;}
    .kontak{display:none; visibility:hidden;}
    .kotak-search{width:100%;float:none;}
    .klik-cari  {display:none;}
    .wrap-search {text-align:center;}
	/*.pendaftaran{width:30%;}*/
	.wrap-nav{float:left;}.pendaftaran{float:none;}

}
@media screen and (max-width:1070px) {
    .kolom-sidebar{margin-top:35px; border-top:1px solid #663300;padding-top:20px;}
    .tempat-separo{
        margin: 30px 0;
    }
}