@font-face {
	font-family: 'Tenderness';
	src: url('../fonts/tenderness.otf');
	/* src: local('Calligraphic421BT'), url('../font/Calligraphic421BT.woff') format('woff'), url('../font/Calligraphic421BT.ttf') format('truetype'); */
} 
html {	scroll-behavior: smooth;}        
.font-special {	font-family: 'Tenderness' ,serif;}
.red{color:red;}
.green{color:darkgreen;}
.orange{color:#FFA700;}
.kuning{color:yellow;}
.purechat-poweredby-container{display:none;}
.caretz{margin-left:5px;margin-top:5px;float:right;color:black;}
.ratakiri {text-align:left}
.ratakanan {text-align:right}
.tengah, .aligncenter{margin-left:auto;margin-right:auto;float:none;}
.tinggi-depan{height:250px;}
.tinggi-gambar{height:150px;}
.tinggi-proses{height:120px !important;width:100% !important;}
.bo{font-weight:bold;}
.tinggi {height:400px;}
.font-special:hover {text-decoration:none !important;}
.tinggi_lain {height:150px;}
.judul_berita{position:relative;width:100%;text-align:center;top:0px;color:white;background-color: rgba(0, 0, 0, .9);padding:5px;height:40px;line-height:14px;}
.font-special{color:#5B9024;}
.gambar{margin-top:15px;margin-bottom:15px;}
.bulet {-webkit-border-radius: 50%;border-radius: 50%;}
.bigfonty{font-size:30px;line-height:1.1;}
#iview {height:300px;width:100%;}
#iview .iviewSlider {width:1350px; height: 300px;} 
#iview {display: block; margin: auto;}
#iview .iviewSlider { display: block; overflow: hidden;-webkit-border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px; }
#page { margin-bottom: 1px;position:relative; background: #fff; margin-top:5px;margin-bottom:2px;margin-left:auto;margin-right:auto;width:100%;} /* Headings */
.login-atas:hover { color:yellow;text-shadow: 0 0 10px #071330;}
 .img_hidden { display:none;width:16px;}
 #footer {width: 100%;}
 .bulet{ height:300px;width:300px;-webkit-border-radius: 50%;border-radius: 50%;}
 .center_title_page{ width:80%; top:90px; }
 .iview-controlNav {	left: 38%;	}
 #footer {height: 180px; display: block; clear: both; margin-right: auto; margin-left: auto;margin-top:20px;} 
:focus { /* remember to define focus styles! */outline: 0;}

/* Shadow */
.menu-background{
background: #4d68a2; /* Old browsers */
background: -moz-linear-gradient(top, #4d68a2 0%, #3c5a99 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d68a2), color-stop(100%,#3c5a99)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #4d68a2 0%,#3c5a99 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #4d68a2 0%,#3c5a99 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #4d68a2 0%,#3c5a99 100%); /* IE10+ */
background: linear-gradient(to bottom, #4d68a2 0%,#3c5a99 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d68a2', endColorstr='#3c5a99',GradientType=0 ); /* IE6-9 */
}
.background1{
background: #B3DF26; /* Old browsers */
}


.footer{
background: #fff; /* Old browsers */
}

/* responsive */
img.lebar-slide{width:100%;}


@media (min-width: 1100px) { 
.navbar-collapse.collapse {
    width: 80%;
    margin-left: auto;
}

}

@media (max-width: 768px) { 
.ratakiri {text-align:center}
.ratakanan {text-align:center}
img.lebar-slide{width:1370px !important;max-width:1370px !important ;margin-left:-300px;height:auto;}
.tinggi, .tinggi-depan, .tinggi-gambar, tinggi-proses{height:auto;}



}


@media (max-width: 481px) { 
img.lebar-slide{width:1370px !important;max-width:1370px !important ;margin-left:-440px;height:auto;}
}

/* =Global ----------------------------------------------- */
.border {border-bottom: 1px solid #b6b6b6;  display: block; float: left; width: 100%;}
.page-title {color: #666; font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; margin: 0 0 2.6em; text-transform: uppercase;}
.page-title a {font-size: 14px; font-weight: bold; letter-spacing: 0; text-transform: none; COLOR: #666;} /* Images */
.center_title_page{width: 99%; height:35px;margin-bottom:5px; float: left; text-align: left; display: block;margin-top:10px;margin-left:20px;}
.halaman {font-family: "Arial Narrow", Arial; text-align: left;float:left;}
.halaman a {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #666; text-decoration: none;/* no underline */ color: #323371; /*backgroud */ background: #D6D6DB;/* Show a solid color for older browsers */ background: -moz-linear-gradient(#D6D6DB, #9FA4B1); background: -o-linear-gradient(#D6D6DB, #9FA4B1); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#D6D6DB), to(#9FA4B1));/* older webkit syntax */ background: -webkit-linear-gradient(#D6D6DB, #9FA4B1);color: #323371; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; box-shadow: 3px 3px 2px grey;  -webkit-transition-duration: 200ms; -webkit-transition-property: padding; -webkit-transition-timing-function: ease; -moz-transition-duration: 200ms; -moz-transition-property: padding; -moz-transition-timing-function: ease; -o-transition-duration: 200ms; -o-transition-property: padding; -o-transition-timing-function: ease;float:left;}
.halaman a:hover, div.halaman a:active {padding: 4px 5px; box-shadow: 3px 3px 2px grey; -moz-box-shadow: 3px 3px 2px grey; -webkit-box-shadow: 3px 3px 2px grey;float:left;}
.halaman .c {padding: 4px 5px; margin: 1px 2px 2px; border: 1px solid #666; text-decoration: none;/* no underline */ color: #323371; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; box-shadow: 3px 3px 2px grey; font-weight: bold; background: #a7c7dc; /* Old browsers */
background: -moz-linear-gradient(top, #a7c7dc 0%, #85b2d3 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a7c7dc), color-stop(100%,#85b2d3)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #a7c7dc 0%,#85b2d3 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #a7c7dc 0%,#85b2d3 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #a7c7dc 0%,#85b2d3 100%); /* IE10+ */
background: linear-gradient(to bottom, #a7c7dc 0%,#85b2d3 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a7c7dc', endColorstr='#85b2d3',GradientType=0 ); /* IE6-9 */
float:left;}
.halaman d img {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #ff8e32; text-decoration: none;/* no underline */ color: #dd0077; -moz-border-radius: 4px; box-shadow: 3px 3px 2px grey; font-weight: bold;}
.halaman span.current {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #000099; font-weight: bold; background: #000099; color: #FFF;}
.halaman span.disabled {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #EEE; color: #DDD;} /*CSS Klien*/
.halaman .btn {padding:3px 5px;}
/* ============== */
.pattern {background: transparent url("./../../../images/4588928pattern.png") repeat scroll 0% 0%;padding: 0px;margin: 0px;height: 100%;width: 100%;}
.pattern2 {background: transparent url("./../../../images/4588928pattern.png") repeat scroll 0% 0%;padding: 0px;margin: 0px;height: 100%;width: 100%;}
.mask {background: transparent url("./../../../images/2409363mask.png") repeat scroll 0% 0%;padding: 0px;margin: 0px;height: 100%;width: 100%;}
#underconstruction { width:100%;min-height:200px;margin-bottom:10px; text-align:center;}
.contact { width:100%;}
.contact .text{float:left; width:80%;}
.contact img{float:left; width:16px;margin-right:10px;margin-left:10px;}
.warna{color:#42530E;}
.hitam{color:#000000;}
.blueg{color:#323B60;}
#ind {background-image: url('./../../../images/indonesia.png'); background-repeat: no-repeat; background-position: center; border:1px solid black;float:right;height:20px;width:24px;cursor:pointer;}
#english {background-image: url('./../../../images/english.png'); background-repeat: no-repeat; background-position: center; border:1px solid black;float:right;height:20px;width:24px;cursor:pointer;margin-left:5px;margin-right:10px;}
#loading { position: fixed; top: 330px; left: 20%; height: 20px; width: 50px; background: url(./../../../images/loading.gif) no-repeat;}

.bayang-putih{text-shadow: 1px 0 0 #FFF, -1px 0 0 #FFF, 0 1px 0 #FFF, 0 -1px 0 #FFF, 1px 1px #FFF, -1px -1px 0 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF;}

#access{-webkit-transition: background 0.5s ease-in-out;-moz-transition: background 0.5s ease-in-out;-ms-transition: background 0.5s ease-in-out;
-o-transition: background 0.5s ease-in-out;transition: background 0.5s ease-in-out;}
.pad0{padding:0px !important;}
.bigfontz {font-size:28px;}
.bigfont {font-size:30px;}
.bot20{margin-bottom:20px;}
.m0{margin-left:0px !important;margin-right:0px !important;}
.bordertest {border:1px solid grey;}
.p0{padding-left:0px  !important;padding-right:0px  !important;}
.orangeg{color:#FF4500;}

/* Pulse Shrink */
@-webkit-keyframes hvr-pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

@keyframes hvr-pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

.hvr-pulse-shrink {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
}
.hvr-pulse-shrink:hover, .hvr-pulse-shrink:focus, .hvr-pulse-shrink:active {
  -webkit-animation-name: hvr-pulse-shrink;
  animation-name: hvr-pulse-shrink;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

        /* Desain Kotak Kartu Utama */
        .support-card1 {
            background-color: #ffffff;
            border-radius: 20px; /* Sudut melengkung halus */
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); /* Efek bayangan lembut */
            padding: 30px 40px;           
            width: 100%;
			display: inline-block; 
        }
        /* Judul Sales Support */
        .card-title {
            color: #1a2e5a; /* Warna biru gelap pekat */
            font-weight: bold;
            font-size: 22px;
            margin-top: 0;
            margin-bottom: 20px;
        }
        /* Pengaturan Layout Tabel Informasi */
        .info-table {
            width: 100%;
            border-collapse: collapse;
        }
        .info-table td {
            padding: 4px 0;
            vertical-align: top;
            font-size: 20px;
            color: #333333;
        }
        /* Kolom Label (mail, call, phone/wa) */
        .label-col {
            color: #4a4a4a;
        }
           /* Kolom Titik Dua (:) */
        .separator-col {
            width: 20px;
            text-align: center;
            color: #4a4a4a;
        }
        /* Kolom Isi Konten */
        .value-col {
            font-weight: normal;
        }
        /* Desain Link Email */
        .value-col a {
            color: #1a2e5a;
            text-decoration: underline;
        }		
		/* Desain Kotak Utama Biru Navy Melengkung */
        .address-card {
            background-color: #2b3964; /* Warna biru sesuai gambar */
            border-radius: 25px;       /* Sudut melengkung halus */
            padding: 30px 40px;        /* Jarak bagian dalam */           
            width: 100%;            /* Responsif di layar HP */
            box-sizing: border-box;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); /* Efek bayangan tipis */
        }
        /* Desain Judul Bagian (Head Office & workshop) */
        .section-title1 {
            color: #ffffff;
            font-size: 18px;
            font-weight: bold;
            margin-top: 0;
            margin-bottom: 8px;
        }
        /* Desain Teks Alamat */
        .address-text {
            color: #ffffff;
            line-height: 1.1;         /* Mengatur jarak spasi antar baris teks */
            font-weight: normal;
            margin-bottom: 25px;       /* Jarak pemisah antar bagian */
        }
        /* Menghilangkan margin bawah pada elemen teks terakhir */
        .address-text:last-child {
            margin-bottom: 0;
        }

		.huruf_khusus{			
			font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
		}        
          /* Dekorasi garis navy di atas judul */
        .top-line {
            width: 350px;
            height: 4px;
            background-color: #1a2e5a;
            margin: 0 auto 20px auto;
        }
		.top-line-prod {
            width: 450px;
            height: 4px;
            background-color: #1a2e5a;
            margin: 0 auto 10px auto;
        }

        /* Judul Utama */
        .section-title {
            color: #1a2e5a;
            font-weight: bold;
            font-size: 52px;
            margin-bottom: 50px;
        }
        .section-title0 {
            color: #1a2e5a;
            font-size: 48px;
            margin-bottom: 50px;
			text-align:center;
        }

        /* Desain Umum Kartu Layanan */
        .custom-card {
            border-radius: 20px;
            padding: 30px 20px;
            margin-bottom: 30px; /* Jarak bawah saat kartu menumpuk di layar HP */
            min-height: 300px;  /* Menjaga tinggi kartu tetap seragam */
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
            transition: transform 0.3s ease;
        }
        
        .custom-card:hover {
            transform: translateY(-5px);
        }

        /* VARIASI 1: Kartu Tema Biru Tua (Warna kustom sesuai gambar) */
        .card-navy {
            background-color: #2b3964;
            color: #ffffff;
            border: none;
        }
        .card-navy .card-heading {
            color: #ffffff;
        }
        .card-navy .card-icon {
            color: #ffffff;
        }
        .card-navy .card-desc {
            color: #e0e0e0;
        }
		.pad-card {
            padding: 0px 15px;;
        }

        /* VARIASI 2: Kartu Tema Putih Bersih */
        .card-white {
            background-color: #ffffff;
            color: #333333;
            border: 1px solid #f0f0f0;
        }
        .card-white .card-heading {
            color: #2b3964;
        }
        .card-white .card-icon {
            color: #2b3964;
        }
        .card-white .card-desc {
            color: #666666;
        }

        /* Komponen di dalam kartu */
        .card-icon {
            font-size: 36px;
            margin-bottom: 5px;
            text-align: left;
        }
        .card-heading {
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 12px;
            text-align: left;
        }
        .card-desc {
            font-size: 13px;
            line-height: 1.6;
            text-align: justify;
        }
		        /* Dekorasi Garis Navy di Atas Judul */

        /* Judul Utama */
        .section-title {
            text-align: center;
        }

        /* Gaya Kotak/Kartu Utama */
        .product-card {
            border-radius: 15px;
            padding: 25px 20px;
            margin-bottom: 30px;
            min-height: 220px; /* Menjaga tinggi kartu tetap seragam */
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
            transition: transform 0.3s ease;
            position: relative;

        }
        
        .product-card:hover {
            transform: translateY(-5px);
        }

        /* Angka Penunjuk di Pojok Kanan Atas Kartu */
        .card-number {
            position: absolute;
            top: 15px;
            right: 20px;
            font-size: 14px;
            font-weight: bold;
        }

        /* VARIASI 1: Kartu Tema Biru Tua (Navy) */
        .card-navy1 {
            background-color: #2b3964;
            color: #ffffff;
            border: none;
        }
        .card-navy1 .card-icon { color: #ffffff; }
        .card-navy1 .card-number { color: #ffffff; }
        .card-navy1 .card-desc { color: #ffffff; }

        /* VARIASI 2: Kartu Tema Putih Bersih */
        .card-white1 {
            background-color: #ffffff;
            color: #333333;
            border: 1px solid #f0f0f0;
        }
        .card-white1 .card-icon { color: #2b3964; }
        .card-white1 .card-number { color: #666666; }
        .card-white1 .card-desc { color: #2b3964; }


        /* Teks Deskripsi Produk */
        .card-desc1 {
            font-size: 22px;
            font-weight: 400;
            line-height: 1.4;
            text-align: left;
        }

        /* Mengatur agar Baris Kedua (3 Kartu) Berada di Tengah pada Layar Desktop */
        @media (min-width: 992px) {
            .row-centered {
                text-align: center;
            }

            .row-centered .col-centered {
                display: inline-block;
				margin-top:40px;
                float: none;
                /* Reset alignment teks di dalam kartu kembali ke kiri */
                text-align: left; 
				vertical-align: top; 
            }
        }
		        @media (max-width: 834px) {
					.bghp-black{
						background-color: #000000 !important;
					}
					.tinggi-bg{
							background-color: #000000 !important;
					}
				}
				   /* produk1*/
				   
				 .product-card-text {
							background-color: #2b3a55; /* Warna biru gelap sesuai gambar */
							color: #ffffff;
							border-radius: 20px;
							padding: 10px 10px;
							min-height: 430px;
						}
						.product-title-box {
							background-color: #b2c4db; /* Warna header box abu-abu kebiruan */
							color: #2b3a55;
							padding: 15px;
							border-radius: 15px;
							margin-bottom: 30px;
							font-weight: bold;
							font-size: 24px;
						}
						.product-image-box img {
							border: 1px solid #ddd;
							padding: 5px;
							background: #fff;
							max-width: 100%;
							height: auto;
						}
					   .product-image-caption {
							margin-top: 15px;
							font-weight: bold;
							color: #1a2c4c;
							letter-spacing: 0.5px;
						}
						.list-description {
							font-size: 15px;
							line-height: 1.6;
							margin-bottom: 25px;
							margin-left: 10px;
							margin-right: 10px;
							padding-left: 20px;
						}
						.list-description li {
							margin-bottom: 20px;
							list-style-type: disc;
						}
						
						  /* Styling Teks Deskripsi */
						.zanessa-text {
							font-size: 20px;
							line-height: 1.6;
							margin-bottom: 25px;
							margin-left: 10px;
							margin-right: 10px;
							text-align: justify;
						}
						.zanessa-text:last-child {
							margin-bottom: 0;
						}
						
						.zanessa-desc-box {
							background-color: #ffffff;
							color: #333333;
							border: 1px solid #e0e0e0;
							border-radius: 30px;
							padding: 35px 30px;
							box-shadow: 0 4px 15px rgba(0,0,0,0.05);
						}
						.zanessa-title1 {
							font-size: 14px;
							font-weight: bold;
							color: #1a2c4c;
							margin-top: 0;
							margin-bottom: 5px;
						}
						.zanessa-text1 {
							font-size: 14px;
							line-height: 1.6;
							color: #555555;
							text-align: justify;
							margin-bottom: 15px;
						}
						.zanessa-list1 {
							padding-left: 20px;
							font-size: 14px;
							line-height: 1.8;
							color: #444444;
						}
						.zanessa-list1 li {
							list-style-type: disc;
						}
						
						.flex-row-center {
							display: flex;
							flex-wrap: wrap;
							align-items: center; /* Mengetengahkan isi kolom secara vertikal (atas-bawah) */						
						}
						    .product-item {
								margin-bottom: 40px;
							}
							.product-img {
								max-width: 70px;
								width: 100%;
								height: auto;
								display: block;
								margin: 0 auto;
								margin-right:10px;
							}
							product-img2 {
								max-width: 100px;
								width: 100%;
								height: auto;
								display: block;
								margin: 0 auto;
								margin-right:10px;
							}
							.product-title {
								font-weight: bold;
								color: #000000;
								display: inline;
							}
							.product-text {
								color: #333333;
								line-height: 1.5;
								font-size:16px;
								text-align: justify;
							}
							/* Penyesuaian jarak teks di samping gambar */
							@media (min-width: 768px) {
								.product-desc {
									padding-left: 10px;
								}
							}
							     .bodong {
									padding-top: 60px;
									padding-bottom: 60px;
									font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
									background-color: #ffffff;
								}
							    .filter-item {
									margin-bottom: 30px;
									padding-right:15px;
									padding-left:15px;
								}
								.img-container {
									height: 250px; /* Menjaga tinggi area gambar seragam */
									display: flex;
									align-items: flex-end; /* Gambar menempel di bawah sesuai layout asli */
									justify-content: center;
									margin-bottom: 25px;
								}
								.filter-img {
									max-width: 100%;
									width: auto;
									height: auto;
									display: block;
								}
								.filter-title {
									font-size: 24px;
									color: #1a4a83; /* Warna biru khas judul */
									margin-top: 0;
									margin-bottom: 15px;
									font-weight: normal;
								}
								.filter-text {
									color: #333333;
									font-size: 18px;
									line-height: 1.6;
									text-align: left;
								}
									/* Jarak antar bagian agar halaman bisa di-scroll */
								.hero-section {
									text-align: center;
								}													
								.hero-fixed-top {
									position: fixed;
									top: 20%;
									right: 20px;
									z-index: 1030; /* Memastikan menu berada di lapisan paling depan */
									width:50px;
								}
								.lge{
									margin-top:10px;			
								}
/* container	 */				
						
@media (min-width: 768px) {.container {  width: 750px;}}
@media (min-width: 992px) {.container {  width: 970px;}}
@media (min-width: 1200px) {.container {  width: 1170px;}}
@media (min-width: 1600px) {.container {  width: 1300px;}}