----- FONT ----- */
 /*@import url('https://fonts.googleapis.com/css?family=Anton|Open+Sans:400,600');*/

/* ----- UNIVERSAL USE CSS ----- */
* {
  box-sizing: border-box;
}

body {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  line-height: 20px;
  word-wrap: break-word;
}

img {
  width: 100%;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

a, button, .btn {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

p, h1, h2, h3, h4, h5, h6, h7 {
  margin: 0;
}

input {
  font-size: 16px !important;
}

textarea {
  resize: vetical;
}

input, textarea {
  font-weight: normal;
  border-radius: 0 !important;
}

.form-control .btn {
  border-radius: 0;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

::selection {
  background: dodgerblue;
  /* WebKit/Blink Browsers */
  color: #ffffff;
}

::-moz-selection {
  background: dodgerblue;
  /* Gecko Browsers */
  color: #ffffff;
}

.section {
  padding: 50px 0;
}

.error-msg {
  color: red;
}

/* ----- END UNIVERSAL CSS ----- */
/*==========================

========== NAVBAR ==========

==========================*/
.navbar-default {
  margin-bottom: 0;
  background-color: #fff;
  /*background-color: #E2E3FF;*/
  border: 0;
  border-top: 3px solid #0000FF;
}

.navbar-brand {
  padding: 5px 15px;
  height: auto;
}

.navbar-brand img {
  width: auto;
  height: 60px;
}

/* ========== TOP INFO ========== */
.top-info {
  padding-top: 10px;
  padding-right: 15px;
  margin-bottom: 5px;
}

.top-info span {
  position: relative;
  display: inline-block;
  padding: 3px 6px;
  font-family: "Anton", sans-serif;
  color: #0000FF;
  line-height: 1.42857143;
  vertical-align: middle;
}

.top-info .btn-primary {
  padding: 3px 6px;
}

.btn-primary {
  font-family: "Anton", sans-serif;
  color: #fff;
  letter-spacing: 1px;
  background-color: #0000FF;
  border: 0;
  border-radius: 0;
}

.btn-primary:hover, .btn-primary:active, .btn-primary:focus, .btn-primary:active:focus, .btn-primary:active:hover {
  background-color: #444;
  border: 0;
}

/* ========== TOP INFO END ========== */
.navbar-default .navbar-nav > li > a {
  padding-top: 0px;
  padding-bottom: 9px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:active, .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:active:focus, .navbar-default .navbar-nav > li > a:active:hover {
  color: #0000FF;
  background-color: transparent;
}

.navbar-default .navbar-nav > .open > a {
  padding-top: 0px;
  padding-bottom: 9px;
  color: #0000FF;
  background-color: transparent;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:active, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:active:focus, .navbar-default .navbar-nav > .open > a:active:hover {
  color: #0000FF;
  background-color: transparent;
}

.navbar-default .navbar-nav .dropdown-menu {
  text-align: right;
}

.dropdown-menu > li > a {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:active, .dropdown-menu > li > a:focus, .dropdown-menu > li > a:active:focus, .dropdown-menu > li > a:active:hover {
  color: #0000FF;
  background-color: transparent;
  outline: none;
}

/*==============================

========== NAVBAR END ==========

==============================*/
/*========================

========== MAIN ==========

========================*/
/* ========== MAIN BANNER ========== */
.main-swiper {
  height: 100%;
}

.main-banner-bg {
  position: relative;
  display: block;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
}

.main-banner-bg:hover, .main-banner-bg:active, .main-banner-bg:focus, .main-banner-bg:active:focus, .main-banner-bg:active:hover {
  color: #fff;
  text-decoration: none;
}

.main-banner-bg h2 {
  font-family: "Anton", sans-serif;
}

.main-banner-bg .container {
  position: relative;
  height: 100%;
}

.mask {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
}

.banner-text {
  position: absolute;
  top: 50%;
  width: 100%;
  letter-spacing: 1px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.banner-text h2 {
  font-size: 36px;
}

.banner-text.left {
  left: 50px;
}

.banner-text.center {
  left: 50%;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.banner-text.right {
  right: 50px;
  text-align: right;
}

.main-swiper .banner-text {
  width: 33.333333%;
}

/* ========== WELCOME ========== */
#welcome {
  /*background-color: #0000FF;*/
  background-image: url("../images/footer-bg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /*color: whitesmoke;*/
}

/* ========== MAIN PRODUCT ========== */
#main-product-list {
  /*background-color: #f9f9f9;*/
}

.product-swiper {
  padding-bottom: 25px;
  padding-left: 30px;
  padding-right: 30px;
}

.product-swiper .product-swiper-pagination {
  bottom: 0;
}

.product-swiper .product-swiper-pagination .swiper-pagination-bullet {
  background: #aaa;
  opacity: 1;
}

.product-swiper .product-swiper-pagination .swiper-pagination-bullet-active {
  background-color: #0000FF;
}

.product-container {
  position: relative;
  margin-bottom: 30px;
  min-height: 335px;
  background-color: #fff;
  overflow: hidden;
}

.product-image img {
  width: auto;
}

.product-info, .other-type-info-container {
  position: absolute;
  top: 0;
  right: 0;
  padding: 15px;
  background-color: rgba(255, 255, 255, 0.85);
}

.product-info h2, .other-type-info-container h2 {
  margin-bottom: 20px;
  font-family: "Anton", sans-serif;
  font-size: 24px;
  color: #0000FF;
}

.little {
  display: block;
  font-size: 12px;
}

.little a {
  color: #0000FF;
}

.info-container .info-head {
  margin-bottom: 5px;
  font-family: "Anton", sans-serif;
  font-size: 18px;
}

.info-container p {
  margin-bottom: 15px;
}

.btn-black {
  color: #fff;
  background-color: #444;
  border: 1px solid #444;
  border-radius: 0;
}

.btn-black:hover, .btn-black:active, .btn-black:focus, .btn-black:active:focus, .btn-black:active:hover {
  background-color: transparent;
  color: #0000FF;
  /*color: #444;*/
}

/* ========== PROJEK KAMI ========== */
.produk-thumb-text {
  line-height: 1.5;
  /* [START] programmer additional */
  max-height:205px;
  display: -webkit-box;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* [END] programmer additional */
}

/* ========== PROJEK KAMI ========== */
#projek-kami {
  background-color: #f9f9f9;
}


/* ========== KLIEN KAMI ========== */
#klien-kami {
  background-color: #fff;
}


/* ========== MAIN WHY ========== */
#main-why {
  background-color: #f9f9f9;
}

.section-header, .content-header {
  font-family: "Anton", sans-serif;
  font-size: 36px;
  margin-bottom: 30px;
}

.reason-container {
  margin-bottom: 30px;
}

.reason-img {
  display: inline-block;
  margin-bottom: 15px;
  width: auto;
  border-radius: 100%;
}

.reason-text h3 {
  font-size: 18px;
  margin-bottom: 5px;
}

/* ========== MAIN BERITA ========== */
#main-berita {
  /*background-color: #f9f9f9;*/
}

.berita-container {
  margin-bottom: 30px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.berita-container a {
  display: block;
  overflow: hidden;
}

.berita-container a:hover img, .berita-container a:active img, .berita-container a:focus img, .berita-container a:active:focus img, .berita-container a:active:hover img {
  -webkit-transform: scale(1.05, 1.05);
  -moz-transform: scale(1.05, 1.05);
  -ms-transform: scale(1.05, 1.05);
  -o-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
}

.berita-container:hover, .berita-container:active, .berita-container:focus, .berita-container:active:focus, .berita-container:active:hover {
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
}

.tanggal-post {
  display: block;
  margin-bottom: 5px;
}

.berita-info {
  padding: 10px;
  min-height: 235px;
  color: #000;
  text-decoration: none;
  border: 1px solid #ddd;
  border-top: 0;
}

.berita-info:hover, .berita-info:active, .berita-info:focus, .berita-info:active:focus, .berita-info:active:hover {
  color: #000;
  text-decoration: none;
}

.berita-info .section-header, .berita-info .content-header {
  font-size: 24px;
  margin-bottom: 15px;
  max-height:52px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.berita-info span {
  display: block;
  padding-top: 10px;
  font-size: 14px;
  color: #0000FF;
}

.berita-thumb-text {
  line-height: 1.5;
  /* [START] programmer additional */
  max-height:80px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* [END] programmer additional */
}
/* ========== MAIN GALERI ========== */
#main-galeri {
  display: block;
}

#main-galeri div {
  max-height: 250px;
  overflow: hidden;
}

.main-galeri-header {
  position: relative;
}

.main-galeri-header .section-header, .main-galeri-header .content-header {
  margin-bottom: 15px;
}

.main-galeri-header h2 {
  font-family: "Anton", sans-serif;
  color: #fff;
}

.btn-border {
  color: #fff;
  background-color: transparent;
  border: 1px solid #fff;
  border-radius: 0;
}

.btn-border:hover, .btn-border:active, .btn-border:focus, .btn-border:active:focus, .btn-border:active:hover {
  color: #fff;
  /*background-color: #0000FF;*/
  /*border-color: #0000FF;*/
  background-color: #444;
  border-color: #444;
}

.estimasi-popup-overlay {
visibility:hidden;
}

.estimasi-popup-content {
visibility:hidden;
}

.estimasi-popup-overlay.active{
visibility:visible;
}

.estimasi-popup-content.active {
visibility:visible;
}
/*============================

========== MAIN END ==========

============================*/
/*===================================

========== SEWA-MOTOR.HTML ==========

============================ =======*/
.sort-bar {
  padding-bottom: 20px;
  border-bottom: 3px solid #0000FF;
}

.sort-control {
  display: inline-block;
  margin-left: 5px !important;
  width: auto !important;
}

.sort-control .dropdown-menu li {
  text-align: left;
}

.sort-control .dropdown-menu li a {
  padding: 5px 15px;
}

.sort-control .btn {
  border-radius: 0;
}

.sort-label {
  display: inline-block;
}

.sewa-motor-container {
  padding: 20px;
  padding-bottom: 0;
  margin-bottom: 30px;
  background-color: #ddd;
}

.pagination li a {
  color: #0000FF;
}

.pagination li a:hover, .pagination li a:active, .pagination li a:focus, .pagination li a:active:focus, .pagination li a:active:hover {
  color: #fff;
  background-color: #0000FF;
  border-color: #0000FF;
}

.pagination li.active a {
  color: #fff;
  background-color: #0000FF;
  border-color: #0000FF;
}

.pagination li.active a:hover, .pagination li.active a:active, .pagination li.active a:focus, .pagination li.active a:active:focus, .pagination li.active a:active:hover {
  color: #fff;
  background-color: #444;
  border-color: #444;
}

/*=======================================

========== SEWA-MOTOR.HTML END ==========

======================================= */
/*==================================

========== TUR-MOBIL.HTML ==========

================================== */
#sewa-mobil p, #detail-petualangan p, #detail-berita p {
  margin-bottom: 15px;
}

#sewa-mobil .product-container, #detail-petualangan .product-container, #detail-berita .product-container {
  min-height: auto;
  box-shadow: 0 0 12px #888;
}

#sewa-mobil .section-header, #detail-petualangan .section-header, #detail-berita .section-header, #sewa-mobil .content-header, #detail-petualangan .content-header, #detail-berita .content-header {
  font-size: 24px;
  margin-bottom: 15px;
}

.other-type-info-container {
  top: auto;
  left: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.75);
}

.other-type-info-container h3 {
  font-family: "Anton", sans-serif;
  font-size: 18px;
  color: #fff;
}

.mobil-price-container {
  padding: 10px;
  margin-bottom: 30px;
  /*text-align: center;*/
  box-shadow: 0 0 8px #999;
}

.mobil-price-container span {
  display: block;
  /*margin-bottom: 10px;*/
  /*line-height: 1;*/
  line-height: 1.42857143;
}

.price-container {
  margin-bottom: 20px;
}

.price-container .header {
  display: block;
  font-family: "Anton", sans-serif;
  font-size: 24px;
}

.price {
  display: block;
  font-family: "Anton", sans-serif;
  font-size: 36px;
}

.gal-header {
  position: relative;
  z-index: 1;
  color: #fff;
  text-align: center;
  background-color: #000;
}

.gal-header .bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-image: url("../images/banner/page-galeri.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: .6;
}

.gal-header .bg.mini {
  background-image: url("../images/banner/mini-galeri.jpg");
}

#galeri-mobil {
  dsiplay: block;
  background-color: #f9f9f9;
}

/*=======================================

========== TUR-MOBIL.HTML END ==========

======================================= */
/*==============================

========== PAKET.HTML ==========

============================== */
#paket-galeri .section-header, #paket-galeri .content-header {
  margin: 0;
}

.paket-container {
  padding-top: 20px;
}

.paket-container .section-header, .paket-container .content-header {
  color: #fff;
  margin-bottom: 5px;
}

a.product-container {
  display: block;
  min-height: auto;
}

a.product-container:hover img, a.product-container:active img, a.product-container:focus img, a.product-container:active:focus img, a.product-container:active:hover img {
  -webkit-transform: scale(1.1, 1.1);
  -moz-transform: scale(1.1, 1.1);
  -ms-transform: scale(1.1, 1.1);
  -o-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
}

.tipe-paket {
  color: #fff;
}

/*==================================*/
/* FAQ                              */
/*==================================*/

.panel {
  box-shadow: none;
}

.panel-body {
  padding: 20px 20px !important;
}

.panel-default {
  border-color: transparent;
}

.panel-default>.panel-heading {
  background-color: transparent !important;
  padding: 20px 30px 20px 15px;
  line-height: 1.5;
  border-bottom: solid 1px #ddd;
}

.panel-group .panel-heading+.panel-collapse>.list-group,
.panel-group .panel-heading+.panel-collapse>.panel-body {
  border-top: none !important;
  border-bottom: solid 1px #ddd;
}

.panel-group .panel {
  border-radius: 0;
  border: none;
}

.panel-default > .panel-heading {
  position: relative;
  display: block;
  font-size: 24px;
  color: #2d2d2d;
}

.panel-default > .panel-heading.no-triv {
  background-color: #00aeef;
}

.panel-default > .panel-heading:before {
  position: absolute;
  bottom: 15px;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background-color: #fff;
}

.panel-default > .panel-heading:after {
  content: "\f106";
  position: absolute;
  right: 10px;
  top: 20%;
  font-family: fontAwesome;
  color: #2d2d2d;
}

.panel-default > .panel-heading.no-triv:after {
  content: "";
}

.panel-default > .panel-heading.collapsed
{ position: relative;
}

.panel-default > .panel-heading.collapsed:after {
  content: "\f107";
  position: absolute;
  right: 10px;
  top: 20%;
  font-family: fontAwesome;
  color: #2d2d2d;
}

.panel-default > .panel-heading:hover,
.panel-default > .panel-heading:active,
.panel-default > .panel-heading:focus {
  text-decoration: none;
}

.panel-body {
  padding: 10px 5px;
  border: none;
  border-radius: 0;
  border-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.panel-body:befoe,
.panel-body:after {
  display: table;
  content: "";
}

.panel-body:after {
  clear: both;
}

.faq-menu>a {
  font-family: "Anton", sans-serif;
  font-size: 24px;
  color: #555;
}

li.faq-menu.active>a, .faq-menu>a:hover {
  color: #0000FF !important;
}


/*==================================

========== PAKET.HTML END ==========

================================== */
/*=====================================

========== PAKET-DETAIL.HTML ==========

===================================== */
.breadcrumb {
  background-color: transparent;
}

.breadcrumb a {
  color: #fff;
  font-weight: 600;
  letter-spacing: 0;
}

.breadcrumb a:hover, .breadcrumb a:active, .breadcrumb a:focus, .breadcrumb a:active:focus, .breadcrumb a:active:hover {
  text-decoration: none;
}

#detail-petualangan table span, #detail-berita table span {
  display: inline-block;
}

#kelengkapan-paket {
  background-color: #f9f9f9;
}

#kelengkapan-paket .section-header, #kelengkapan-paket .content-header {
  font-size: 24px;
}

#kelengkapan-paket ul {
  padding-left: 20px;
}

#kelengkapan-paket ul li {
  padding: 5px;
}

.paket-swiper .swiper-pagination-bullet {
  background: #aaa;
  opacity: 1;
}

.paket-swiper .swiper-pagination-bullet-active {
  background-color: #0000FF;
}

/*=========================================

========== PAKET-DETAIL.HTML END ==========

========================================= */
/*======================================

========== DETAIL-BERITA.HTML ==========

====================================== */
#detail-berita .section-header, #detail-berita .content-header {
  margin-bottom: 5px;
}

#detail-berita .tanggal-post {
  margin-bottom: 20px;
}

#detail-berita .sort-bar {
  padding-bottom: 10px;
  margin-bottom: 20px;
}

/*==========================================

========== DETAIL-BERITA.HTML END ==========

========================================== */
/*===============================

========== GALERI.HTML ==========

=============================== */
#galeri-page .sort-bar {
  margin-bottom: 20px;
}

#galeri-page .nav-tabs {
  border: 0;
}

#galeri-page .nav-tabs > li {
  display: inline-block;
  float: none;
}

#galeri-page .nav-tabs > li > a {
  margin-bottom: 15px;
  color: #000;
  border-color: #000;
  border-radius: 0;
}

#galeri-page .nav-tabs > li.active > a {
  color: #fff;
  background-color: #0000FF;
  border-color: #0000FF;
}

.filtr-item a {
  display: block;
  margin-bottom: 30px;
}

#lightcase-content img {
  width: auto;
}

/*===================================

========== GALERI.HTML END ==========

=================================== */
/*=====================================

========== TENTANG-KAMI.HTML ==========

===================================== */
#tentang-kami .nav-tabs {
  border: 0;
}

#tentang-kami .nav-tabs > li {
  margin-bottom: 3px;
}

#tentang-kami .nav-tabs > li > a {
  font-family: "Anton", sans-serif;
  font-size: 16px;
  color: #000;
  background-color: #ddd;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
}

#tentang-kami .nav-tabs > li > a:hover, #tentang-kami .nav-tabs > li > a:active, #tentang-kami .nav-tabs > li > a:focus, #tentang-kami .nav-tabs > li > a:active:focus, #tentang-kami .nav-tabs > li > a:active:hover {
  outline: none;
  box-shadow: 0 0 0;
}

#tentang-kami .nav-tabs > li.active > a {
  border: 0;
  border-bottom: 3px solid #0000FF;
  box-shadow: 0 0 0;
}

#tentang-kami .nav-tabs > li.active > a:hover, #tentang-kami .nav-tabs > li.active > a:active, #tentang-kami .nav-tabs > li.active > a:focus, #tentang-kami .nav-tabs > li.active > a:active:focus, #tentang-kami .nav-tabs > li.active > a:active:hover {
  outline: none;
  box-shadow: 0 0 0;
}

.content-header {
  font-size: 24px;
  margin-bottom: 15px;
}

.about-content p {
  margin-bottom: 15px;
  line-height: 24px;
}

.about-content ol {
  padding-left: 17px;
  margin-bottom: 15px;
}

.about-content ol li {
  margin: 10px 0;
  padding-left: 10px;
}

.about-content ol li:first-child {
  margin-top: 0px;
}

.member-kami .matchHeight-item:hover img, .member-kami .matchHeight-item:active img, .member-kami .matchHeight-item:focus img, .member-kami .matchHeight-item:active:focus img, .member-kami .matchHeight-item:active:hover img {
  -webkit-transform: scale(1.1, 1.1);
  -moz-transform: scale(1.1, 1.1);
  -ms-transform: scale(1.1, 1.1);
  -o-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
}

.img-container {
  margin-bottom: 15px;
  overflow: hidden;
}

.name-container span {
  display: block;
}

.name-container .name {
  margin-bottom: 5px;
  font-family: "Anton", sans-serif;
  font-size: 24px;
}

.name-container .positon {
  padding-bottom: 10px;
  border-bottom: 1px solid #aaa;
}

.name-container .tag-line {
  padding-top: 10px;
}

/*=========================================

========== TENTANG-KAMI.HTML END ==========

======================================== */
/*====================================

========== KONTAK-KAMI.HTML ==========

=================================== */
#kontak-kami label, #pemesanan label {
  width: 100%;
}

.form-control:active, .form-control:focus, .form-control:active:focus {
  border: 1px solid #0000FF;
  box-shadow: 0 0 5px #0000FF;
  outline: none;
}

.bootstrap-select.form-control:active, .bootstrap-select.form-control:focus, .bootstrap-select.form-control:active:focus, .bootstrap-select.open.form-control {
  border: 0;
}

.bootstrap-select.form-control .btn:active, .bootstrap-select.form-control .btn:focus, .bootstrap-select.form-control .btn:active:focus {
  box-shadow: 0 0 0 !important;
  border: 1px solid #0000FF !important;
  outline: none !important;
}

#map-location {
  position: relative;
}

#map-location .content-header {
  position: absolute;
  top: 20px;
  z-index: 2;
  width: 100%;
  text-align: center;
}

#map-location .content-header span {
  display: inline-block;
  padding: 10px 20px;
  background-color: #ddd;
}

#map-location .btn-container {
  position: absolute;
  bottom: 20px;
  z-index: 2;
  width: 100%;
  text-align: center;
}

#map-canvas {
  height: 450px;
}

/*========================================

========== KONTAK-KAMI.HTML END ==========

======================================= */

/*=====CONTACT======*/
.contact .title {
  /*font-size: 30px;*/
  margin-bottom: 30px;
}

.contact p {
  font-size: 16px;
}

.contact form {
  margin-top: 20px;
}

.contact .form-control {
  font-size: 16px;
  height: 45px;
  border-radius: 3px!important;
}

.contact .form-control > .btn {
  font-size: 16px;
  height: 45px;
  border-radius: 3px!important;
}

.contact textarea.form-control {
  height: auto;
}

.contact .form-group {
  margin-bottom: 30px;
}

.contact .btn-standard {
  font-size: 16px;
  padding: 10px 15px;
}

.contact-follow .box-out {
  border: 1px solid #0d65d3;
  padding: 30px;
  border-radius: 3px;
  position: relative;
}

.contact-follow .box-out:before{
  border: 1px dashed #0d65d3;
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: -10px;
  right: -10px;
  z-index: -1;
  content: '';
}

.contact-follow .title {
  font-size: 24px;
  margin-bottom: 10px
}

.contact-follow .li-pad {
  padding: 0;
  list-style: none;
  margin: 0;
}

.contact-follow .li-pad li {
  position: relative;
  margin-left: 25px;
}

.contact-follow li {
  padding: 10px 0;
}

.contact-follow svg {
  position: absolute;
  left: -25px;
  top: 12px;
}

.contact-follow .follow {
  margin-top: 20px;
}

.icon-contact svg {
  position: static;
  color: #0d65d3;
  font-size: 30px;
  margin-bottom: 15px;
}

.icon-contact p {
  color: #0d65d3;
  font-weight: 600;
}

.icon-contact .box-out {
  background-color: transparent;
  padding: 20px;
  text-align: center;
}

/*=====CONTACT END======*/

/*======TITLE=======*/
.title {
  font-weight: 700;
  font-size: 34px;
  position: relative;
  color: #333;
  font-family: 'Raleway', sans-serif;
  margin-bottom: 50px;
}

.title-white.title {
  color: #fff;
}

.left-title:after,
.center-title:after {
  position: absolute;
  bottom: -25px;
  left: 0;
  width: 80px;
  height: 3px;
  content: '';
  background-color: #0d65d3;
}

.center-title {
  text-align: center;
}

.center-title:after {
  left: 50%;
  transform: translateX(-50%);
}
/*=====TITLE END======*/

/*==================================

========== PEMESANAN.HTML ==========

================================= */
#pemesanan .sort-bar {
  margin-bottom: 20px;
}

#pemesanan .section-header, #pemesanan .content-header {
  margin-bottom: 0;
}

#pemesanan .label-name {
  display: block;
  font-size: 14px;
  margin-bottom: 8px;
}

#pemesanan .input-group-addon {
  border-radius: 0;
}

#pemesanan .dropdown-toggle {
  border-radius: 0;
}

#pemesanan .input-group input[type="number"] {
  text-align: right;
}

.disabled {
  pointer-events: none;
  cursor: default;
}

.disabled .form-control, .disabled .dropdown-toggle {
  background-color: #ddd;
}

.datepicker table tr td.active:active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .open > .dropdown-toggle.datepicker table tr td.active, .open > .dropdown-toggle.datepicker table tr td.active.highlighted {
  background-color: #0000FF;
  border-color: #444;
}

.datepicker table tr td.active:active:hover, .datepicker table tr td.active:active:active, .datepicker table tr td.active:active:focus, .datepicker table tr td.active:active:active:focus, .datepicker table tr td.active:active:active:hover, .datepicker table tr td.active.highlighted:active:hover, .datepicker table tr td.active.highlighted:active:active, .datepicker table tr td.active.highlighted:active:focus, .datepicker table tr td.active.highlighted:active:active:focus, .datepicker table tr td.active.highlighted:active:active:hover, .datepicker table tr td.active.active:hover, .datepicker table tr td.active.active:active, .datepicker table tr td.active.active:focus, .datepicker table tr td.active.active:active:focus, .datepicker table tr td.active.active:active:hover, .datepicker table tr td.active.highlighted.active:hover, .datepicker table tr td.active.highlighted.active:active, .datepicker table tr td.active.highlighted.active:focus, .datepicker table tr td.active.highlighted.active:active:focus, .datepicker table tr td.active.highlighted.active:active:hover, .open > .dropdown-toggle.datepicker table tr td.active:hover, .open > .dropdown-toggle.datepicker table tr td.active:active, .open > .dropdown-toggle.datepicker table tr td.active:focus, .open > .dropdown-toggle.datepicker table tr td.active:active:focus, .open > .dropdown-toggle.datepicker table tr td.active:active:hover, .open > .dropdown-toggle.datepicker table tr td.active.highlighted:hover, .open > .dropdown-toggle.datepicker table tr td.active.highlighted:active, .open > .dropdown-toggle.datepicker table tr td.active.highlighted:focus, .open > .dropdown-toggle.datepicker table tr td.active.highlighted:active:focus, .open > .dropdown-toggle.datepicker table tr td.active.highlighted:active:hover {
  background-color: #444;
}

/*======================================

========== PEMESANAN.HTML END ==========

===================================== */
/*==========================

========== FOOTER ==========

==========================*/
#footer {
  background-image: url("../images/footer-bg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#footer h2 {
  font-family: "Anton", sans-serif;
  font-size: 24px;
  color: #000;
}

.foot-info-head {
  margin-bottom: 15px;
}

.foot-info-head img {
  display: block;
  width: auto;
  height: 90px;
}

.foot-nav {
  margin-bottom: 30px;
}

.foot-info-content {
  margin-bottom: 20px;
}

.foot-info-content h3 {
  font-family: "Anton", sans-serif;
  font-size: 18px;
}

.tagline {
  font-size: 16px;
}

.info {
  position: relative;
  display: block;
  padding: 2.5px 0;
  padding-left: 25px;
}

.info a {
  color: #000;
}

.info a:hover {
  color: #000;
  text-decoration: none;
}

.info:before {
  position: absolute;
  left: 0;
  color: #0000FF;
}

.phone:before {
  content: "\f095";
  font-family: fontAwesome;
}

.map:before {
  content: "\f041";
  font-family: fontAwesome;
}

.e-mail:before {
  content: "\f0e0";
  font-family: fontAwesome;
}

.whatsapp:before {
  content: "\f232";
  font-family: fontAwesome;
}

.time:before {
  content: "\f017";
  font-family: fontAwesome;
}

.foot-nav h2 {
  margin-bottom: 15px;
}

.foot-nav li a {
  display: block;
  padding: 2.5px 5px;
  color: #000;
}

.foot-nav li a:hover {
  color: #0000FF;
  text-decoration: none;
}

/*==============================

========== FOOTER END ==========

==============================*/
/*=============================

========== COPYRIGHT ==========

=============================*/
#copyright {
  padding: 2px 0;
  font-size: 85%;
  text-align: center;
  color: #fff;
  background-color: #333;
}

#copyright a {
  color: #0000FF;
}

/*=================================

========== COPYRIGHT END ==========

=================================*/
/*=================================

========== SCROLL to TOP ==========

=================================*/
/*=====================================

========== SCROLL to TOP END ==========

==================================== */
/*==============================

========== BOTTOM BTN ==========

============================= */
.bottom-btn-container {
  position: fixed;
  z-index: 999;
  bottom: 21px;
  width: 48px;
  height: 48px;
  font-size: 21px;
  color: #fff;
  text-align: center;
  line-height: 48px;
  border-radius: 100%;
  background-color: #444;
  -webkit-box-shadow: 0 4px 5px -1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 4px 5px -1px rgba(0, 0, 0, 0.5);
  box-shadow: 0 4px 5px -1px rgba(0, 0, 0, 0.5);
}

.bottom-btn-container:hover, .bottom-btn-container:active, .bottom-btn-container:focus, .bottom-btn-container:active:focus, .bottom-btn-container:active:hover {
  color: #fff;
}

.bottom-btn-container.pemesanan {
  right: 80px;
}

.bottom-btn-container.telephone {
  right: 140px;
}

/*==================================

========== BOTTOM BTN END ==========

================================= */
/*=====================================

========== REPLACEMENT CLASS ==========

==================================== */
.stretch-l {
  padding-left: 0;
}

.stretch-r {
  padding-right: 0;
}

.margin-min-5 {
  margin: 0 -5px;
}

.margin-top-15 {
  margin-top: 15px;
}

.margin-top-30 {
  margin-top: 30px;
}

.margin-bottom-2 {
  margin-bottom: 2px;
}

.margin-bottom-15 {
  margin-bottom: 15px;
}

.margin-bottom-30 {
  margin-bottom: 30px;
}

.padding-l-0 {
  padding-left: 0;
}

.padding-r-0 {
  padding-right: 0;
}

.padding-bottom-0 {
  padding-bottom: 0;
}

.padding-lr-1 {
  padding: 0 1px;
}

.padding-lr-5 {
  padding: 0 5px;
}

.padding-bottom-2 {
  padding-bottom: 2px;
}

.font-32 {
  font-size: 32px !important;
}

/* ========== ADDITIONALS ========== */

.fa.fa-instagram {
  color: transparent;
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  background: -webkit-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  background-clip: text;
  -webkit-background-clip: text;
}

.director,.director--right {
  position:relative;
  padding-top:50px;
  overflow:hidden
}

.director__image-container {
  position:relative;
  width:100%;
  display:inline-block;
  max-width:400px
}

.director__image-container:before {
  content:"";
  display:block;
  /*padding-top:133%*/
  padding-top:100%
}

.director__image {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  /*height:100%;*/
  object-fit:cover
}

.director::before,.director--right::before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:36%;
  height:65%;
  border:1px solid #e5e5e5
}

.director .title--small,.director--right .title--small,.director__sub-title,.director__list-item {
  margin-bottom:8px
}

.director__sub-title {
  font-size:20px;
  font-weight:500;
  text-transform:uppercase;
  color:#707070
}

.director__image-wrapper::before {
  content:"";
  position:absolute;
  top: 30px;
  right:100px;
  /*bottom:0;*/
  width:50%;
  height:69%;
  background-color:#f6f6f6
}

.director__image-container {
  bottom:-6px
}

.director__list {
  padding-left:20px
}

.director__desc-wrapper {
  padding-top:70px
}

@media (max-width: 991px) {
.director::before,.director--right::before {
  width:40%
}

.director__image-wrapper::before {
  right:25px
}
}

@media(max-width: 767px) {
.director,.director--right {
  padding-top:40px
}

.director::before,.director--right::before {
  width:65%;height:40%
}

.director__image-wrapper::before {
  width:100%;right:0
}

.director__desc-wrapper {
  padding:40px 0
}
}

@media(max-width: 575px) {
.director,.director--right {
  overflow:hidden
}

.director::before,.director--right::before {
  top:unset;
  left:unset;
  right:-1px;
  width:82%;
  height:25%
}
}

.director--right::before {
  left:unset;
  right:0
}

.director--right .director__image-wrapper {
  text-align:right
}

.director--right .director__image-wrapper::before {
  right:unset;
  left:60px;
  bottom:0
}
/*=========================================

========== REPLACEMENT CLASS END ==========

======================================== */

/*# sourceMappingURL=style.css.map