a.selectmenupilih {
	font-weight:bold;border-bottom:2px #48bcb9 solid;
}

.colortosca{
	color:#49c1bf;
}
.colorgray{
	color:#f8f8ff;
}
.colorputih{
	color:#f4f4ff;
}
.colororen{
	color:#f46041;
}
.pilihpolisnya{
border-bottom:#FF0000 2px solid;padding-bottom:10px;font-weight:bold
}
img.wprevtop{
	width:100%;
	margin-top:-8px;
}

@media only screen and (min-width: 1025px) {
	.mobile-only {
		display:none !important;
	}
	
	#tempke1{
		clear:both;display:block;margin-top:50px;
	}
	#tempke2{
		top:-120px;z-index:99;position:relative;bottom:0px;
	}
	#tempke3{
		margin-top:-100px;
	}
} 
@media only screen and (max-width: 1026px) {
	.desktop-only {
		display:none !important;
	}
	#tempke1{
		clear:both;display:block;margin-top:70px;
	}
	#tempke2{
		top:0px;z-index:99;position:relative;bottom:0px;
	}
	#tempke3{
		margin-top:20px;
	}
} 

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
#detaildtaaview ol li,
#detaildtaaview ul li{
	margin-left:15px;
	padding:5px 0px;
}

.form-content{
    border: 1px solid #F4F4F4;
    margin-bottom: 2%;
}
.form-content input, .form-content select{
	background:#F4F4F4;
	color:#000000;
}
.form-control{
    border-radius:0.1rem;
	border:1px solid #49bdba;
}
.btnSubmit{
    border:none;
    border-radius:0.5rem;
    padding: 8px 15px;
    cursor: pointer;
    background: #0062cc;
    color: #fff;
}

h4.wpjudulproduk{
	text-align:center;float:none;width:100%;color:#444444;
}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-color: #fff;
   opacity: 0.5;
}
.preloader .loading {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
}

ul.warp_beli_online{
	list-style:decimal;
    margin: 0;
    padding: 0;
	display:block;
	float:left;
	clear:both;
	text-align:left;
	margin-left:15px;
}
ul.warp_beli_online li{
	margin-bottom:10px;
}

ol.warp_beli_online{
	list-style:lower-alpha;
    margin: 0;
    padding: 0;
	display:block;
	float:left;
	clear:both;
	text-align:left;
	margin-left:15px;
}
ol.warp_beli_online li{
	margin-bottom:10px;
}
.stepper-wrapper {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
  width:100%;
  z-index:0;
  position:relative;
}
.stepper-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  @media (max-width: 768px) {
    font-size: 12px;
  }
}

.stepper-item::before {
	position: absolute;
	content: "";
	border-bottom: 3px solid #444444;
	width: 100%;
	top: 14px;
	left: -50%;
	z-index: 2;
}

.stepper-item::after {
	position: absolute;
	content: "";
	border-bottom: 2px solid #444444;
	width: 100%;
	top: 14px;
	left: 50%;
	z-index: 2;
}

.stepper-item .step-counter {
	position: relative;
	z-index: 5;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #444444;
	margin-bottom: 6px;
}

.stepper-item.active {
  font-weight: bold;
}

.stepper-item.completed .step-counter {
	background-color: #FF494B;
	border:7px #444444 solid;
}

.stepper-item.completed::after {
	position: absolute;
	content: "";
	border-bottom: 2px solid #444444;
	width: 100%;
	top: 14px;
	left: 50%;
	z-index: 3;
}

.stepper-item:first-child::before {
	content: none;
}
.stepper-item:last-child::after {
	content: none;
}

.form-content input, .form-content select, .form-content textarea{
	background:#F4F4F4;
	color:#000000;
}

.btn-danger-pilih .active {
    color: #fff;
	background-color:#c9302c;
	border-color:#ac2925;
}
.btn-danger-pilih{
	background:#FFFFFF;
	color:#c9302c;
}

.e-range {
	display: block;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 100%;
	margin: 0;
	height: 30px;
	overflow: hidden;
	cursor: pointer;
}
.e-range:focus {
	outline: none;
}

.e-range::-webkit-slider-runnable-track {
	width: 100%;
	height: 30px;
	background: linear-gradient(to bottom, #0199ff, #0199ff) 100% 50%/100% 3px no-repeat transparent;
}


label.withform {
    color:#000000;
}

.bs-wizard > .bs-wizard-step .bs-wizard-info{
	font-size:large;
}


.wpstar{
	color:#bf1c2f;
}
.e-range::-ms-track {
  width: 100%;
  height: 30px;
  border: 0;
  color: transparent;
  background: transparent;
}

.e-range::-ms-fill-lower {
  background: linear-gradient(to bottom, #0199ff, #0199ff) 100% 50%/100% 3px no-repeat transparent;
}

.e-range::-ms-fill-upper {
  background: linear-gradient(to bottom, #cfcfcf, #cfcfcf) 100% 50%/100% 3px no-repeat transparent;
}

.e-range::-ms-thumb {
  appearance: none;
  height: 13px;
  width: 13px;
  background: #c9302c;
  border-radius: 100%;
  border: 0;
  -ms-transition: background-color 150ms;
  transition: background-color 150ms;
  top: 0;
  margin: 0;
  box-shadow: none;
}

.e-range:hover::-webkit-slider-thumb,
.e-range:focus::-webkit-slider-thumb {
  background-color: #c9302c;
}
.e-range:hover::-moz-range-thumb,
.e-range:focus::-moz-range-thumb {
  background-color: #c9302c;
}
.e-range:hover::-ms-thumb,
.e-range:focus::-ms-thumb {
  background-color: #c9302c;
}
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 100; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal-content {
  background-color: #fefefe;
  margin: 40px auto; 
  padding: 20px;
  border: 1px solid #888;
  max-width:90%;
}


.boxdetnya{
	border:1px #CCCCCC solid;border-radius:25px;margin-top:20px;background:#FFFFFF;
}
.boxdetnya div{
	padding:10px;
}
.boxdetnya img{
	width:100%;border-top-left-radius:25px;border-top-right-radius:25px;
}

img.huii{
	float:left;margin-right:15px;width:61px;height:59px
}

ul.menulisticon{
	list-style:none;
	padding-left:0px;
}
ul.menulisticon li{
	background-repeat:no-repeat;
	background-position:left;
	padding:19px;	
	display:block;
	padding-left:50px;
	border-bottom: 2px #E6E6E6 solid;
}
.cl46cfbe{
	color:#46cfbe;
}
.cl9b1926{
	color:#9b1926;
}
.cl646b78{
	color:#646b78;
}
svg{
	color:#CCCCCC;
}
@font-face {
  font-family: "Montserrat-Regular", sans-serif;
  src: url('../font/Montserrat/Montserrat-Regular.ttf');
}
.Montserrat-Regular{
	font-family: "Montserrat-Regular", sans-serif;
}

@font-face {
  font-family: "Montserrat-Bold", sans-serif;
  src: url('../font/Montserrat/Montserrat-Bold.ttf');
}
.Montserrat-Bold{
	font-family: "Montserrat-Bold", sans-serif;
}


*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Montserrat-Regular", sans-serif;
}

nav{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  height: 70px;
  background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  z-index: 99;
  color:#000000;
}
nav .navbar{
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: auto;
  padding: 0 200px;
}
.navbar .logo a{
  font-size: 18px;
  color: #000000;
  text-decoration: none;
  font-weight: 600;
}
nav .navbar .nav-links{
  line-height: 70px;
  height: 100%;
}
nav .navbar .links{
  display: flex;
}
nav .navbar .links li.menumarun2 a:hover,
nav .navbar .links li.menumarun1 a{
	padding:15px 15px;
	line-height:normal;
	height:auto;
	border:2px #8d141d solid;
	border-radius:5px;
	background:#FFFFFF;
	color:#8d141d;
	font-weight:800;
	font-size:14px;
	cursor: progress;

}
nav .navbar .links li.menumarun1 a:hover,
nav .navbar .links li.menumarun2 a{
	padding:10px 15px;
	line-height:normal;
	height:auto;
	border:2px #FFFFFF solid;
	border-radius:5px;
	background:#8d141d;
	color:#FFFFFF;
	font-weight:800;
	font-size:14px;	
}

nav .navbar .links li{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  padding: 0 14px;
  color:#000000;
}

nav .navbar .links li a{
  height: 100%;
  text-decoration: none;
  white-space: nowrap;
  color: #000000;
  font-size: 14px;
  font-weight: 500;
}
nav .navbar .links li a:hover,
nav .navbar .links li a.aktiv{
	color:#8d141d;
}
.links li:hover .htmlcss-arrow,
.links li:hover .js-arrow{
  transform: rotate(180deg);
  }

nav .navbar .links li .arrow{
  height: 100%;
  width: 18px;
  line-height: 70px;
  text-align: center;
  display: inline-block;
  color: #000000;
  transition: all 0.3s ease;
}

nav .navbar .links li .sub-menu{
  position: absolute;
  top: 70px;
  left: 0;
  background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  border:1px #CCCCCC solid;
  display: none;
  z-index: 2;
  color:#000000;
}

nav .navbar .links li:hover .htmlCss-sub-menu,
nav .navbar .links li:hover .js-sub-menu{
  display: block;
}
.navbar .links li .sub-menu li{
  padding: 0px 10px;
}



.navbar .links li .sub-menu li,
.navbar .links li .sub-menu li span{
	padding:0px 0px;
	line-height:normal;
	border-bottom:1px #CCCCCC solid;
}

.navbar .links li .sub-menu li.more,
.navbar .links li .sub-menu li.more span{
	margin:0px;
	padding-top:0px ;
	padding-bottom:0px;
}
.navbar .links li .sub-menu a{
	color:#000000;
	font-size: 15px;
	font-weight: 500;
	background-repeat: no-repeat;
	background-position: left center;
	width:100%;

}
.navbar .links li .sub-menu li:hover{	
	background:#8d141d;
	color:#FFFFFF;
	height:auto
}
.navbar .links li .sub-menu li a{
	padding:15px;
}
.navbar .links li .sub-menu li a:hover{
	 color:#FFFFFF;
	 height:100%;
}
.navbar .links li .sub-menu li span{
	font-size:10px;
	font-weight:normal;
	color:#999999;
}



.navbar .links li .sub-menu .more-sub-menu{
  position: absolute;
  top: 0;
  left: 100%;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  border:1px #CCCCCC solid;
  z-index: 1;
  display: none;
  background:#FFFFFF;
  color:#000000;
}
.links li .sub-menu .more:hover .more-sub-menu{
  display: block;

}

.navbar .nav-links .sidebar-logo{
  display: none;
}
.navbar .bx-menu{
  display: none;
}

@media (max-width:920px) {
  nav .navbar{
    max-width: 100%;
    padding: 0px;
  }

  nav .navbar .logo a{
    font-size: 27px;
  }
  
	
}
@media (max-width:800px){

	.navbar .bx-menu{
		display: block;
	}

	nav .navbar .nav-links{
		position: fixed;
		top: 0;
		left: -100%;
		display: block;
		max-width: 100%;
		width: 100%;
		background:  #FFFFFF;
		padding: 20px;
		box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
		transition: all 0.5s ease;
		z-index: 1000;
		line-height:40px;
	}
	
	nav .navbar .links li{
		position: relative;
		display: grid;
		align-items: center;
		justify-content: space-between;
		list-style: none;
		padding: 0 14px;
		color:#000000;
		width:100%;
	}
	
	nav .navbar .links li a{
		height: 100%;
		text-decoration: none;
		white-space: nowrap;
		color: #000000;
		font-size: 14px;
		font-weight: 500;
	}
	
	nav .navbar .links li .sub-menu{

		top: 0;
		position:relative;
		display:none;
		float:left;
		left:0;
		clear:both;
		width:100%;
	}
	
	.navbar .links li .sub-menu li.more{
		padding:0px;
		margin:0px;
		line-height:20px;
		height:auto;
	}
	.navbar .nav-links .sidebar-logo{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.sidebar-logo .logo-name{
		font-size: 25px;
		color: #fff;
	}
	.sidebar-logo  i,
	.navbar .bx-menu{
		font-size: 25px;
	}
	nav .navbar .links{
		display: block;
		margin-top: 20px;
	}
	nav .navbar .links li .arrow{
		line-height:normal;
		display:none;
		background:yellow;
	}

}
@media (max-width:370px){
  nav .navbar .nav-links{
  max-width: 100%;
} 
}



body {
  background: #fff;
  color: #2f3138;
  font-family: "Montserrat-Regular", sans-serif;
}

a {
  color: #f82249;
  transition: 0.5s;
}

a:hover,
a:active,
a:focus {
  color: #f8234a;
  outline: none;
  text-decoration: none;
}

ul,ol,
p{
font-size:13px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Montserrat-Bold", sans-serif;
  font-weight: 400;
  margin: 0 0 20px 0;
  padding: 0;
  color: #0e1b4d;
}

.main-page {
  margin-top: 70px;
}

.wow {
  visibility: hidden;
}

/* Prelaoder */

#preloader {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  overflow: visible;
  background: #fff url("../img/preloader.svg") no-repeat center center;
}

.back-to-top {
  position: fixed;
  display: none;
  background: #f82249;
  color: #fff;
  width: 40px;
  height: 40px;
  text-align: center;
  border-radius: 50px;
  right: 15px;
  bottom: 15px;
  transition: background 0.5s ease-in-out;
}

.back-to-top i {
  font-size: 24px;
  padding-top: 6px;
}

.back-to-top:focus {
  background: #e0072f;
  color: #fff;
  outline: none;
}

.back-to-top:hover {
  background: #e0072f;
  color: #fff;
}

#wrap-bendera{
  position: absolute;
  bottom: 170px;
  left: 0;
  top: 0px;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;

}
.wrap-isi-bendera{
	padding:40px;background:#FFFFFF;color:#000000;border-radius:5px;opacity: 1.0;list-style:none;font-size:28px;
}

.wrap-isi-bendera li {
	color:#000000;
	clear:both;
}

.wrap-isi-bendera li span{
	width:60px;display:block;float:left;margin-right:15px;
}
.wrap-isi-bendera li span a{
	color:#000000;
}

.select-posisi-img-center{
	float: left; width: auto; height: 100%;position: relative;display: flex;align-items: center;justify-content: center;
}

.select-posisi-center{
	text-align:center;
}
.select-posisi-justify{
	text-align:justify;
}
.select-posisi-left{
	text-align:left;
}

.section-header {
  margin-bottom: 20px;
  position: relative;
}

span.bottom-post{
	width:auto;
	border-bottom:5px #0B70B6 solid;
	padding:5px 50px;
}

.wrapproduk{
	display:block;
	clear:both;
	width:84.5%;
	padding-top:15px;
	padding-bottom:0px;
	margin-bottom:0px;
}
.wabox{
	display:block;
	float:left;
	height:220px;
	clear:both;
	margin-bottom:10px;
}

.section-header h2 {
  font-size: 36px;
  text-align: center;
  font-weight: 700;
  margin-bottom: 10px;
}
.section-header h3 {
	font-size: 33px;
}

.section-header p {
  text-align: center;
  padding: 0;
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  color: #626262;
}

.section-with-bg {
  background-color: #f6f7fd;
}


.section-brown-bg {
  background-color: #C48F33;
}

.section-brown-bg p{
	color:#000000;
}

.section-setting-bg {
    background: url(../img/background-showroom.png) center center no-repeat;
    overflow: hidden;
    position: relative;
	background-position:bottom;
	width:100%;
	background-color:#D2D3D5;
}

.section-setting-bg p{
	color:#000000;
}

.section-klaim-bg {
	padding: 60px;
	background: url(../img/background-klaim.jpg) center center no-repeat;
	background-size: cover;
	overflow: hidden;
	position: relative;
}


#header {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	transition: all 0.5s;
	z-index: 997;
	height: 70px;
	padding: 15px 0;
	background: rgba(255, 255, 255, 0.5);
}

#header.header-scrolled,
#header.header-fixed {
  background: #F9F9F9;
  height: 70px;
  padding: 15px 0;
  color:#000000;
  opacity: 1.0;
  filter: alpha(opacity=100);
}


#header.header-scrolled .nav-menu a,
#header.header-fixed .nav-menu a {
	color:#000000
}

#header.header-scrolled .nav-menu .menu-active a,
#header.header-fixed .nav-menu a:hover,
#header.header-fixed .nav-menu a span.memred  {
  color: #C38F32;
}


#header #logo h1 {
  font-size: 36px;
  margin: 0;
  padding: 6px 0;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
}

#header #logo h1 span {
  color: #f82249;
  
}

#header #logo h1 a,
#header #logo h1 a:hover {
  color: #fff;
}

#header #logo img {
  padding: 0;
  margin: 0;
  max-height: 100%;
}



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

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

.nav-menu li {
  position: relative;
  white-space: nowrap;
}

.nav-menu > li {
  float: left;
  margin-left: 8px;
}

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

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

.nav-menu ul li {
  min-width: 180px;
}

/* Nav Menu Arrows */

.sf-arrows .sf-with-ul {
  padding-right: 30px;
}

.sf-arrows .sf-with-ul:after {
  content: "\f107";
  position: absolute;
  right: 15px;
  font-style: normal;
  font-weight: normal;
}

.sf-arrows ul .sf-with-ul:after {
  content: "\f105";
}

/* Nav Meu Container */

#nav-menu-container {
  float: right;
  margin: 0;
}

/* Nav Meu Styling */

.nav-menu a {
  padding:5px 20px;
  text-decoration: none;
  display: inline-block;
  color:#FFFFFF;
  font-weight: 600;
  font-size: 18px;
  outline: none;
}


.nav-menu .menu-active a,
.nav-menu a:hover {
  color: #C38F32;
}



.nav-menu > li > a:before {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  bottom: 0;
  left: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out 0s;
}

.nav-menu > li > a.menu span{
	color:#666666;
}
.nav-menu li a.menu:hover span,
.nav-menu li.menu-active a.menu span{
	color:#56B2DB;
}

.nav-menu > li{
	width:auto;
	margin:0px auto 0 auto;
	display:block;
}

.nav-menu li a.menu,
.nav-menu li.menu-active a.menu,
.nav-menu li a.menu:hover{	
	display:block;
	z-index:100;
}
.nav-menu li a.bendera_en{
	padding-left:2px;
	padding-right:0px;
}
.nav-menu li a.st_non_aktiv{
	opacity: 0.3;
	filter: alpha(opacity=30);
}
.nav-menu li a.bendera_en:hover,
.nav-menu li a.st_aktiv,
.nav-menu li a.bendera_id:hover{
	opacity: 1.0;

	filter: alpha(opacity=100);
}
.nav-menu li a.bendera_id{
	padding-left:0px;
	padding-right:2px;
}
.nav-menu li.buy-tickets a {
  color: #fff;
  background: #f82249;
  padding: 7px 22px;
  border-radius: 50px;
  border: 2px solid #f82249;
  transition: all ease-in-out 0.3s;
  font-weight: 500;
  margin-left: 8px;
  margin-top: 2px;
  line-height: 1;
  font-size: 13px;
}

.nav-menu li.buy-tickets a:hover {
  background: none;
}

.nav-menu li.buy-tickets:hover a:before,
.nav-menu li.buy-tickets.menu-active a:before {
  visibility: hidden;
}

.nav-menu ul {
  margin: 4px 0 0 0;
  padding: 10px;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  background: #fff;
  border-radius: 3px;
  
}

.nav-menu ul li {
  transition: 0.3s;
}

.nav-menu ul li a {
  padding: 10px;
  color: #060c22;
  transition: 0.3s;
  display: block;
  font-size: 13px;
  text-transform: none;
  border-radius: 3px;
  
}


.nav-menu ul li a.nomer1{
	display:block;
	background:url(../img/menu/home.png) no-repeat;
	width:164px;
	height:126px;
}

.nav-menu ul li:hover > a {
  background: #f82249;
  color: #fff;
  
}

.nav-menu ul ul {
  margin: 0;
}
#mobile-nav-toggle {
  position: fixed;
  right: 0;
  top: 0;
  z-index: 999;
  margin: 15px 15px 0 0;
  border: 0;
  background: none;
  font-size: 24px;
  display: none;
  transition: all 0.4s;
  outline: none;
  cursor: pointer;
}

#mobile-nav-toggle i {
  color: #C48F33;
}


#mobile-nav {
  position: fixed;
  top: 0;
  padding-top: 18px;
  bottom: 0;
  z-index: 998;
  background: rgba(6, 12, 34, 0.9);
  left: -260px;
  width: 260px;
  overflow-y: auto;
  transition: 0.4s;
}

#mobile-nav ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

#mobile-nav ul li {
  position: relative;
}

#mobile-nav ul li a {
  color: #fff;
  font-size: 17px;
  overflow: hidden;
  padding: 10px 22px 10px 15px;
  position: relative;
  text-decoration: none;
  width: 100%;
  display: block;
  outline: none;
}

#mobile-nav ul li a:hover {
  color: #f82249;
}

#mobile-nav ul li li {
  padding-left: 30px;
}

#mobile-nav ul .menu-has-children i {
  position: absolute;
  right: 0;
  z-index: 99;
  padding: 15px;
  cursor: pointer;
  color: #fff;
}

#mobile-nav ul .menu-has-children i.fa-chevron-up {
  color: #f82249;
}

#mobile-nav ul .menu-item-active {
  color: #f82249;
}

#mobile-body-overly {
  width: 100%;
  height: 100%;
  z-index: 997;
  top: 0;
  left: 0;
  position: fixed;
  background: rgba(6, 12, 34, 0.8);
  display: none;
}

body.mobile-nav-active {
  overflow: hidden;
}

body.mobile-nav-active #mobile-nav {
  left: 0;
}

body.mobile-nav-active #mobile-nav-toggle {
  color: #fff;
}


#intro {
  width: 100%;
  height: 100%;
  background-size: cover;
  overflow: hidden;
  position: relative;
}



#intro .intro-container {
  position: absolute;
  bottom: 0;
  left: 10%;
  top: 30%;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 0px;
  max-height:700px;
  width:35%;
  text-align:left;
  padding-left:0px;
}

#intro h1 {
  color: #FFFFFA;
  font-size: 36px;
  text-align:left;
  float:left;
  display:block;
  width:100%;
  padding-right:20%;
}
#intro p.texban {
	color: #FFFFFA;
	font-size: 17px;
	text-align:left;
	font-weight:normal;
	font-weight:600;
}
#intro h4 {
  color: #FFFFFA;
  font-size: 28px;
  font-weight: normal;

}

#intro h1 span {
  color: #f82249;
}

#intro p {
  color: #ebebeb;
  font-weight: 700;
  font-size: 20px;
}


#intro .about-btn {
  font-weight: 500;
  font-size: 20px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 12px 32px;
  transition: 0.5s;
  line-height: 1;
  margin: 10px;
  color: #fff;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  border: 1px solid #C48F33;
  background:#C48F33;
}
#intro .btn-bottom .scroll-btn:hover,
#intro .about-btn:hover {
  background: #EDB24B;
  color: #fff;
}

#intro .btn-bottom .scroll-btn{
	border: 1px solid #C48F33;
	background:#C48F33;
	border-radius: 20px;
	color: #fff;
	font-size:14px;
	padding:5px 20px;
}

@-webkit-keyframes pulsate-btn {
  0% {
    -webkit-transform: scale(0.6, 0.6);
    transform: scale(0.6, 0.6);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 0;
  }
}

@keyframes pulsate-btn {
  0% {
    -webkit-transform: scale(0.6, 0.6);
    transform: scale(0.6, 0.6);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 0;
  }
}


#produk,
#prosedur,
#product,
#profile,
#testimon,
#service,
#contactus,
#klaim ,
#tempke1,
#tempke2,
#tempke3,
#tempke4,
#tempke5,
#tempke6,
#tempke7,
#tempke8{
  padding: 20px 0 20px 0;
}

.bggradasi{
	background:url(../image/e-payroll-banner-klien-kami.jpg) no-repeat;
	height:auto;
	width:auto;
	background-color:#422B55;
}

#about-details {
  padding: 60px 0;
}

#about-details .details h2 {
  color: #112363;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 10px;
}

#about-details .details .social {
  margin-bottom: 15px;
}

#about-details .details .social a {
  background: #e9edfb;
  color: #112363;
  line-height: 1;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  padding-top: 9px;
}

#about-details .details .social a:hover {
  background: #f82249;
  color: #fff;
}

#about-details .details .social a i {
  font-size: 18px;
}

#about-details .details p {
  color: #112363;
  font-size: 15px;
  margin-bottom: 10px;
}

#contact {
  padding: 60px;
  background: url(../img/background-hubkami.jpg) center center no-repeat;
  background-size: cover;
  overflow: hidden;
  position: relative;
}

#klaim .container .section-header h2,
#klaim .container .section-header p,
#contactus .container .section-header h2,
#contactus .container .section-header p{
	position:relative;
	color:#FFFFFF
}
#klaim .container,
#contactus .container{
	position:relative;
}
#klaim .contact-address,
#klaim .contact-phone,
#klaim .contact-email,
#contactus .contact-address,
#contactus .contact-phone,
#contactus .contact-email {
  margin-bottom: 20px;
}

#klaim .form #sendmessage,
#contactus .form #sendmessage {
  color: #f82249;
  border: 1px solid #CCCCCC;
  display: none;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

#klaim .form #errormessage,
#contactus .form #errormessage {
  color: red;
  display: none;
  border: 1px solid red;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}
#klaim .form #sendmessage.show,
#klaim .form #errormessage.show,
#klaim .form .show,
#contactus .form #sendmessage.show,
#contactus .form #errormessage.show,
#contactus .form .show {
  display: block;
}

#klaim .form .validation ,
#contactus .form .validation {
  color: red;
  display: none;
  margin: 0 0 20px;
  font-weight: 400;
  font-size: 50px;
}
#klaim .form select{
	padding:0px;
}

#klaim .form input,
#klaim .form textarea,
#klaim .form select,
#contactus .form input,
#contactus .form textarea {
  padding: 5px 14px;
  border-radius: 5;
  box-shadow: none;
  font-size: 20px;
  border:1px #CCCCCC solid; 
}

#klaim .form input[type="submit"],
#contactus .form input[type="submit"]{
	background:url(../img/icon/send-icon.png) no-repeat;
	border: 0;
	width:192px;
	height:74px;
	cursor: pointer;
	font-size:30px;
	color:#3E3E3E;
	padding:0px 10px;
	text-align:left;
}

.section-header .lala{
	width:40%;margin:0px auto;padding-bottom:20px
}
.lili{
	width:50%;margin:40px auto 50px auto;}


#footer {
	background:#FFFFFF;
	height:auto;
	width:auto;
	padding: 0 0 0px 0;
	color: #999999;
	font-size: 14px;
}

#footer .footer-top {
  background:none;
  height:auto;
  padding: 30px 0 20px 0;
}


#footer .copyright {
  text-align: center;
  padding-top: 30px;
}

#footer .credits {
  text-align: center;
  font-size: 13px;
  color: #ddd;
}


.btn-red{
	background:url(../img/icon/btn-left.png) left repeat-y;
	height:50%;
	width:auto;
	margin-top:20px;
}

.btn-red-right{
	background:url(../img/icon/btn-right.png) right no-repeat;
	height:50%;
	width:50%;
	margin-top:20px;
}

.btn-red a{
	color:#FFFFFF;
	padding:0px 20px;
	line-height:60px;
	font-size:xx-large;
}

img.select-posisi-img{
	width:auto;
	margin-top:20px;
	margin-bottom:0px;
	padding-bottom:0px;
	cursor:pointer;
}

img.select-posisi-img:hover{
	opacity: 0.6;
}

.text-font-them{
	font-size:16px;
}

.text-font-des{
	font-size:24px;
	line-height:normal;
}
.not-bottom{
	margin-bottom:0px;
}
.not-top{
	margin-top:0px;
}


.wrap-box{
	 display:block;
	 width:100%;
	 height:auto;
	 border:20px solid #FAFAFA ;
	 border-radius:5px;
	 padding:20px;	
}

#mainMenuProduk {
	width:100%;
	text-align:center;
	font-size:26px;
	display:block;
	padding-bottom:20px;
}
#mainMenuProduk li.notline{
	border-right:none;
}
#mainMenuProduk li {
	 display:inline-block;
	*display:inline; /*IE7*/
	*zoom:1; /*IE7*/
	color:#3C3B40;
	border-right:2px solid #3C3B40;
	padding-left:27px;
	padding-right:27px;
	margin-bottom:10px;
}

#mainMenuProduk a {
	color:#3C3B40;
}
#mainMenuProduk a.select,
#mainMenuProduk a:hover {
	color:#F01B21;
	border-bottom:5px solid #F01B21;
	padding-top:3px;
	width:100%;
}
	
/*--------------------------------------------------------------
# Responsive Media Queries
--------------------------------------------------------------*/

@media (min-width: 767px) {

  #contact input {
    min-width: 400px;
  }

}

@media (min-width: 768px) {
  #contact .contact-address,
  #contact .contact-phone,
  #contact .contact-email {
    padding: 20px 0;
  }

  #contact .contact-phone {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
  }

}

@media (min-width: 991px) {
  #schedule .sub-heading {
    width: 75%;
  }

}

@media (min-width: 1024px) {
	#intro {
		background-attachment: fixed;
	}
	
	#product {
		background-attachment: fixed;
	}
	
	#contact {
		background-attachment: fixed;
	}
	#header.header-scrolled,
	#header.header-fixed,
	#header{
		background:#FFFFFF;
	}
	
	#header #logo img{
		margin-top:0px;
	}

}

@media (max-width: 1199px) {
  #header .container {
    max-width: 100%;
  }

  .nav-menu a {
    padding: 8px 4px;
  }

}

@media (max-width: 991px) {

#mainMenuProduk{
	float:left;
	font-size:18px;
	margin-left:-25px;
	margin-bottom:0px;
}

#mainMenuProduk li{
	padding:0px 3px;
}

  #header {
	background:#F9F9F9;
    height: 70px;
   
    transition: all 0.5s;
  }


  #nav-menu-container {
    display: none;
  }

  #mobile-nav-toggle {
    display: inline;
  }

  #intro .intro-container {
    top: 70px; display: none;
	
  }

  #intro h1 {
    font-size: 34px;
  }

  #intro p {
    font-size: 16px;
  }

  #schedule .nav-tabs a {
    padding: 8px 60px;
  }
  
  

}

@media (max-width: 768px) {

  .back-to-top {
    bottom: 15px;
  }

  #showroom #showroom-list a {
    font-size: 18px;
  }

  #showroom #showroom-list i {
    top: 13px;
  }
}


@media (max-width: 460px) {

#produk,
#prosedur,
#product,
#profile,
#testimon,
#service,
#contactus,
#klaim {
  padding: 30px 0 30px 0;
}

img.select-posisi-img{
	max-height:30px;
	margin-top:20px;
	margin-bottom:0px;
	padding-bottom:0px;
	cursor:pointer;

}

.wrap-isi-bendera{
	font-size:19px;
}
  #contact button {
    margin-top: 10px;
  }
.padding-bottom{
	margin-bottom:0px;
}
#contact .form input, #contact .form textarea {
	background:red;
	width:100%;
}

.section-header h3{
	font-size:35px;
	font-family: "Montserrat-Bold", sans-serif;
}

span.subh3{
	font-size:20px;
	line-height:normal;
}

.text-font-des{
	font-size:19px;
}
.wrap-box{
	border:none;
	padding:0px;
}

#klaim .form input, #klaim .form textarea, #klaim .form select, #contactus .form input, #contactus .form textarea{
	font-size:16px;
}
h4{
	font-size:1rem;
}
h1{
	font-size:2rem;
}

#img4 {
	width: 57vw;
	height: 77vh;
	object-fit: cover;
	object-position: 0 0;
}
}

.color-blue{
	color:#2AACE8;
}
span.subh3{
	 color:#5D5D5F;
	 font-size:24px;
}
.section-header p.color-red,
.color-red{
	color:#BE2829;
}
.color-red-1{
	color:#BE1D2D;
}
.section-header p.color-brown,
.color-brown{
	color:#C48F33;
}
.section-header p.color-white,
.color-white{
	color:#FFFFFF;
}
.section-header p.color-white2,
.color-white2{
	color:#F8F8F8;
}
.section-header p.color-black,
.color-black{
	color:#434446;
}


.segitiga {
	border-top: solid 8px #FEFFFF;
	border-right: solid 12px transparent;
	border-left: solid 12px transparent;
	height: 0;
	width: 0;
	margin:20px auto 0 auto;
}
.with-margin {
	margin:5px auto 0 auto;
}


.color-black{
	color:#414143;
}

.color-tosca{
	color:#00A79D;
}

.wrabhead{
	text-align:center;
	font-weight:500;
}

.textul{
	margin-top:0px;
}

.sparator-gray-sedo-top{
	background:url(../img/top.png) repeat-x ;
	height:10px;
}

.sparator-gray2-sedo-top{
	background:#DFDFDD;
	height:10px;
}
.sparator-blue-sedo-top{
	background:#0C6FB3;
	height:10px;
}

.sparator-gray-sedo-bottom{
	background:url(../img/bottom.png) repeat-x ;
	height:50px;
}

.sparator-gray-brown{
	background:url(../img/sparator-brow.png) repeat-x ;
	height:12px;
}

.sparator-gray-gray{
	background:url(../img/sparator-gray.png) repeat-x ;
	height:11px;
}

.sparator-gray-white{
	height:10px;
	background:#FFFFFF;
}

.nonpaddingtop{
	margin-top:-50px;
}

.nonpaddingbottom{
	margin-bottom:-50px;
}

.nonpaddingbottommin{
	margin-bottom:0px;
}

#footer .footer-top .footer-links{
	margin-bottom:0px;
}

* {box-sizing: border-box;}

.mySlides {display: none;}
img {vertical-align: middle;}


/* Slideshow container */
.slideshow-container {
  max-width: 100%;
  position: relative;
  margin: auto;
  margin-top:70px; 
}


/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 0px;
  width: 100%;
  text-align: center;
}


/* The dots/bullets/indicators */
.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.fades{
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fades {
  from {opacity: .4} 
  to {opacity: 1}
}


@keyframes fades {
  from {opacity: .4} 
  to {opacity: 1}
}
/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}

}

.custom-select{
	height:auto;
	color:#666666;
}

.wrap-detail{
	background:blue;
}
ol.breadcrumb{
	background:#F1F1F1;
	font-size:16px;
	font-style:normal;
}

	

#carousel img {
    display: block;
    opacity: .5;
    cursor: pointer;
}
#carousel .flex-active-slide img {
    opacity: 1;
    cursor: default;
}

#listdata{
	width:100%;
	font-size:18px;
	display:block;
	padding-bottom:20px;
	list-style:circle;
	padding-left:15px;
}
#listdata li a{
	color:#333333;
}

#listdata li a:hover{
	color:#CC3300;
}

#listdata li span{
	width:96.5%;
	display:inline;
	float:right
}

/*tambahan buat banner*/
.slick-slider
{
    position: relative;

    display: block;

    -moz-box-sizing: border-box;
         box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}
.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}
.slick-slide
{
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.container .w3-display-middle .btn-arrow.btn-hidden,
.slick-arrow.slick-hidden {
    display: none;
}

.slider-for{
	width:100%;
	height: auto;
	margin: 20px auto 1px;
	overflow: hidden;
}
.slider-for .item{
	width: 100%;
	height: 100%;
}
.slider-nav .item img{
	width: 100%;
	height: auto;
	padding:0px 50px;
}

.slider-nav{
	width: 100%;
	height: 100%;
	margin: auto;
	padding:30px 0px;
}
.slider-nav .slick-track{
	height: 100%;
}
.container .w3-display-middle .btn-arrow,
.slick-arrow{
	position: absolute;
    top: 35%;
    z-index: 50;
}
.container .w3-display-middle .btn-prev,
.slick-prev{
	left: 0;
	width:47px;
	height:53px;
	border:none;
	text-indent: -9999em;
 	 outline: 0;
	 
}
.container .w3-display-middle .btn-next,
.slick-next{
	right: 0;
	width:47px;
	height:53px;
	border:none;
	text-indent: -9999em;
  	outline: 0;
}

.slick-current {
	opacity:1.0;
}

slick-active{
	opacity:0.4;
}


/*form styles*/
#msform {
    text-align: center;
    position: relative;
    margin-top: 30px;
	width:100%;
}

#msform fieldset {
    background: white;
    border: 0 none;
    border-radius: 0px;
    padding: 20px 30px;
    box-sizing: border-box;
    width: 80%;
    margin: 0 10%;
    position: relative;
}

/*Hide all except first fieldset*/
#msform fieldset:not(:first-of-type) {
    display: none;
}

/*inputs*/
#msform input, #msform textarea {
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 0px;
    margin-bottom: 10px;
    width: 100%;
    box-sizing: border-box;
    color: #2C3E50;
    font-size: 13px;
}

#msform input:focus, #msform textarea:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 1px solid red;
    outline-width: 0;
    transition: All 0.5s ease-in;
    -webkit-transition: All 0.5s ease-in;
    -moz-transition: All 0.5s ease-in;
    -o-transition: All 0.5s ease-in;
}

/*buttons*/
#msform .action-button {
    width: 100px;
    background: red;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 25px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px;
}

#msform .action-button:hover, #msform .action-button:focus {
    box-shadow: 0 0 0 2px white, 0 0 0 3px red;
}

#msform .action-button-previous {
    width: 100px;
    background: #C5C5F1;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 25px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px;
}

#msform .action-button-previous:hover, #msform .action-button-previous:focus {
    box-shadow: 0 0 0 2px white, 0 0 0 3px #C5C5F1;
}

/*headings*/
.fs-title {
    font-size: 18px;
    text-transform: uppercase;
    color: #2C3E50;
    margin-bottom: 10px;
    letter-spacing: 2px;
    font-weight: bold;
}

.fs-subtitle {
    font-weight: normal;
    font-size: 13px;
    color: #666;
    margin-bottom: 20px;
}

/*progressbar*/
#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    /*CSS counters to number the steps*/
    counter-reset: step;
}

#progressbar li {
    list-style-type: none;
    text-transform: uppercase;
    font-size: 9px;
    width: 33.33%;
    float: left;
    position: relative;
    letter-spacing: 1px;
}

#progressbar li:before {
    content: counter(step);
    counter-increment: step;
    width: 24px;
    height: 24px;
    line-height: 26px;
    display: block;
    font-size: 12px;
    color: #333;
    background: #CCCCCC;
    border-radius: 25px;
    margin: 0 auto 10px auto;
}

/*progressbar connectors*/
#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #999999;
    position: absolute;
    left: -50%;
    top: 9px;
    z-index: -1; /*put it behind the numbers*/
}

#progressbar li:first-child:after {
    /*connector not needed before the first step*/
    content: none;
}

/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbar li.active:before, #progressbar li.active:after {
    background: red;
    color: white;

}



/* Not relevant to this form */
.dme_link {
    margin-top: 30px;
    text-align: center;
}
.dme_link a {
    background: #FFF;
    font-weight: bold;
    color: red;
    border: 0 none;
    border-radius: 25px;
    cursor: pointer;
    padding: 5px 25px;
    font-size: 12px;
}

.dme_link a:hover, .dme_link a:focus {
    background: #C5C5F1;
    text-decoration: none;
}


input[type=text], select, textarea{
  width: 100%;
  padding: 5px;
  border: 1px solid #bf1e2e;
  border-radius: 4px;
  box-sizing: border-box;
  resize: vertical;
  
}

label {
  padding: 5px 12px 0px 0;
  display: inline-block;
  font-size:16px;
  font-weight:600
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
  
}

.container-two {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px 30px;
  font-family: "Montserrat-Regular", sans-serif;
}

.container-two h3,
.container-two h4 {
  font-family: "Montserrat-Bold", sans-serif;	
}
.container-two span {
  padding: 5px 12px 0px 0;
  display: inline-block;
  font-size:16px;

}

.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
}

.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
}

.col-33 {
  float: left;
  width: 33.33%;
  margin-top: 6px;
}

.col-50 {
  float: left;
  width: 50%;
  margin-top: 6px;
}

.col-100 {
  float: left;
  width: 100%;
  margin-top: 6px;
}

.col-20 {
  float: left;
  width: 20%;
  margin-top: 6px;
}

.col-16 {
  float: left;
  width: 16%;
  margin-top: 6px;
}


.row:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (max-width: 600px) {
  .col-25, .col-75, input[type=submit] {
    width: 100%;
    margin-top: 0;
  }
} 



/* Next & previous buttons */
#testimon .container .w3-display-middle{position:absolute;/*top:50%;left:50%;*/transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);display:block;background:red;}
.container .w3-display-middle .w3-display-leftv{
position:absolute;top:50%;left:0%;transform:translate(0%,-50%);-ms-transform:translate(-0%,-50%);}
.container .w3-display-middle .w3-display-right{
position:absolute;top:50%;right:0%;transform:translate(0%,-50%);-ms-transform:translate(0%,-50%);}


#regForm {
  margin: 10px auto;
  width: 100%;
  min-width: 300px;
}

/* Style the input fields */
#regForm select,
#regForm textarea{
	width: 99.6%;
}
#regForm input {
	width: 99%;
	padding: 5px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	resize: vertical;
	font-size: 16px;
}

/* Mark input boxes that gets an error on validation: */
#regForm textarea.invalid,
#regForm select.invalid,
#regForm input.invalid {
  background-color: #ffdddd;
}

/* Hide all steps by default: */
#regForm .tab {
  display: none;
  margin:0px;
  padding:0px;
  width:100%;
}
#regForm label{
    padding: 5px 12px 0px 0;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
}

/* Make circles that indicate the steps of the form: */
#regForm .step {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbbbbb;
  border: none;
  border-radius: 50%;
  display: inline-block;
  opacity: 0.5;
}

/* Mark the active step: */
#regForm .step.active {
  opacity: 1;
}

/* Mark the steps that are finished and valid: */
#regForm .step.finish {
  background-color: #4CAF50;
}

.classbuy{
	margin:0px;
}
ul.wraptanyakes,
ol.wraptanyakes{
	padding:0px;
	margin-left:15px;
	margin-top: 0px;
}
ul.wraptanyakes li,
ol.wraptanyakes li{
	margin-bottom:10px;
}
.textfooter{
	display:block;
	clear:both;
	float:left;
	width:100%;
	font-size:17px;
	font-weight:550;
}

.wht1110{
max-width:1110px;width:100%;clear:both;height:100%;display: table;margin-left:auto;margin-right:auto;font-family: "Montserrat-Regular", sans-serif;
	font-size:large;
}

.wht850{
max-width:850px;width:100%;clear:both;height:100%;display: table;margin-left:auto;margin-right:auto;font-size:16px;
}

#dtldata{
padding: 10px 0;

}

ul.laymenuleft{
	list-style:none;
	margin:0px;
	float:left;
	padding:0px;
	width:100%;
	color:#FFFFFF;
	font-family: "Montserrat-Regular", sans-serif;
}
ul.laymenuleft li{
	background:#0099FF;
	padding:10px;
	border-bottom:#FFFFFF 1px solid;
}
ul.laymenuleft li.select{
	background:#5777AB;
	font-weight:bold;
}

ul.laymenuleft li a{
	color:#FFFFFF;
	width:100%;
	display:block;
}
ul.laymenuleft li a:hover{
	color:#02255D;
	width:100%;
}
ul.laymenuleft li.postop{
	background:#02255D;
	font-weight:bold;
}
table.wrapvisimisi{
	width:100%;
	border:1px #FFFFFF solid;
	color:#FFFFFF;
	margin-bottom:15px;
}
table.wrapvisimisi tr th{
	background:#233158;
	border-right:1px #FFFFFF solid;
	font-weight:bold;
	text-align:center;
	padding:10px;
	font-size:18px;
}
table.wrapvisimisi tr td{
	background:#418DCB;
	border-right:1px #FFFFFF solid;
	padding:10px;
	font-size:16px;
}


.h3textblue{
	color:#02255D;
	font-size:26px;
	font-weight:bold;
}
.pageblue{
	color:#02255D;
	padding:5px 0px;
	margin:5px 0px;
	line-height:25px;
}

ol.olvisimisi{
	width: 100%;
}
ol.olvisimisi li{
	width:100%;
	padding:5px 0px;
}
ol.olvisimisi li.alfabed_b{
	list-style:upper-alpha;
}
ol.olvisimisi li.alfabed_k{
	list-style:lower-alpha;
}
ol.olvisimisi li.romawi_k{
	list-style:lower-roman;
}
ol.olvisimisi li.romawi_h{
	list-style:upper-roman;
}
ol.olvisimisi li.bulet{
	list-style:circle;
}
.stblue{
	color:#233158;
}

.kliklaporan{
	background:url(../images/profil/button-lap-keu.png) no-repeat;
	width:260px;
	height:40px;
	border:none;
	text-align:center;
	font-size:24px;
	color:#FFFFFF;
	font-weight:bold;
	clear:both;
	padding-right:40px;
	display:block;
	margin-bottom:10px;
}
.wraplaporan{
	clear:both;
	display:block;
	width:100%;
}
ul.wpdetailap{
	width:100%;
	margin-top:0px;
}
ul.wpdetailap li{
	width:100%;
	padding:5px 0px;
	list-style:circle;
	margin-left:35px;
}
ul.wpdetailap li a{
	color:#41A0DA;
	text-decoration:none;
}
ul.wpdetailap li.nostrip{
	width:100%;
	padding:5px 0px;
	list-style:none;
	font-weight:bold;
	color:#7E027A;
	margin-left:0px;
}
ul.wpdetailap li.jdlnostrip{
	width:100%;
	padding:5px 0px;
	list-style:none;
	font-weight:bold;
	color:#B50900;
	text-transform:uppercase;
	margin-left:0px;
}

ul.wpdetailapthn{
	width:100%;
	list-style:none;
	margin:0px;
	padding:0px;
}
ul.wpdetailapthn li{
	width:72px;
	clear:none;
	display:block;
	float:left;
	margin-bottom:20px;
	text-align:center;
	margin-right:50px;
}
ul.wpdetailapthn li.listaward {
	width:42%;
}
ul.wpdetailapthn li.listaward img{
	height:150px;

}
ul.wpdetailapthn li a{
	color:#000000;
}
ul.wpdetailapthn li a img{
	max-height: 100px;
	max-width: 100px;
}

table.wrapsusuan{
	width:100%;
	border:none;
	margin-bottom:15px;
}
table.wrapsusuan tr td{
	padding:10px;
	padding-left:0px;
	font-size:16px;
}

.txtfrom{
	background:red;
}

ul.wrpberita{
	list-style:none;
	margin:0px;
	padding:0px;
}
ul.wrpberita li{
	border-bottom:1px #333333 dotted;
	padding:10px 0px;
}
ul.wrpberita li a{
	color:#000000
}
ul.wrpberita li span{
	font-size:14px;
}



a#buttoncliktop{
	border:2px #FFFFFF solid;
	border-radius :30px;
	color:#FFFFFF;
	padding:15px 35px;
	font-size:24px;
	font-weight:normal;
}
.wrapklikbahasa{
	margin-left:15px;
	color:#999999;
	font-size:14px;
}
.wrapklikbahasa a{
	color:#999999;
	font-weight:550;
	margin:10px 5px 0px 5px;
}


a.klik{
	color:black;
	
}

.wrapklikbahasa a:hover{
	color:#CC6666;
}


.bgnyablue{
background:#009FE3;border-color:#009FE3;
}
.watakotaktoprekom strong{
text-align:center;color:#FFFFFF;width:100%;display:block;font-size:1.5rem;line-height:30px;
}
.warakotak{
border-radius:10px;position:relative;z-index:0;margin-top:-2px;background:#f4f4ff;box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);margin-bottom:20px;
}

ul.waraulli{
margin-left:0px;padding-left:18px;list-style:disc;margin-top:30px;display:block;height:212px;
}
.modalDialogSukses,
.modalDialogSukses2,
.modalDialogForm {
	display: none; 
	position: fixed; 
	z-index: 1; 
	padding-top: 10px; 
	left: 0;
	top: 0;
	width: 100%; 
	height: 100%; 
	overflow: auto; 
	background-color: rgb(0,0,0); 
	background-color: rgba(0,0,0,0.4); 
	font-size:13px;
}
.modalDialogSukses > div,
.modalDialogForm > div {
	width: 550px;
	position: relative;
	margin: 10% auto;
	padding: 5px 20px 13px 20px;
	border-radius: 10px;
	background: #fff;
	font-size:13px;
}
.modalDialogSukses table,
.modalDialogForm table{
	display:block;
	margin-top:10px;
	margin-bottom:10px;
}
.modalDialogForm table tr td{
	padding:5px;
	font-size:x-large;
}
.modalDialogSukses p,
.modalDialogForm p{
	color:#000000;
	font-size:x-large;
}
.modalDialog {
	display: none; 
	position: fixed; 
	z-index: 1;
	padding-top: 100px;
	left: 0;
	top: 0;
	width: 100%; 
	height: 100%; 
	overflow: auto;
	background-color: rgb(0,0,0); 
	background-color: rgba(0,0,0,0.4); 
	font-size:13px;
}
.modalDialog > div {
	width: 400px;
	position: relative;
	margin: 10% auto;
	padding: 5px 20px 13px 20px;
	border-radius: 10px;
	background: #fff;
	background: #0099CC;
	font-size:13px;
}
.modalDialog p{
	color:#009900;
	font-size:x-large;
}
.close2,
.close3,
.close {
	background: #CC3333;
	color: #FFFFFF;
	line-height: 25px;
	position: absolute;
	right: -12px;
	text-align: center;
	top: -15px;
	width: 25px;
	height:25px;
	text-decoration: none;
	font-weight: bold;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 1px 1px 3px #CC3333;
	-webkit-box-shadow: 1px 1px 3px #CC3333;
	box-shadow: 1px 1px 3px #CC3333;
	opacity:1;
}

.close:hover {
  background: #bf1e2e;
}

.color-red{
	color:#CC3333;
}
#contactForm2 select,
#contactForm2 input[type=text]{
	width:97%;
}
.warpjnsproduk{
width:100%;
display:inline-block;
clear:both;
height:auto;
margin-bottom:10px;
text-align:justify;
}
table.wrabklien tr td{
	padding:10px;
}
table.wrabklien tr td img{
	opacity: 0.5;
}

table.wrabklien tr img:hover {
  opacity: 1.0;
}


/*kkkk*/

.kotakmarun{
text-align:center;background:#921620;padding:20px 0px;color:#FFFFFF;border-radius:10px;
}


.kotakartikel img{
	border-radius:5px;
	border-bottom-left-radius:0px;
	border-bottom-right-radius:0px;
}

.kotakartikel .boxs{
	background:#FFFFFF;text-align:left;padding:10px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}
.kotakartikel .boxs .startikel{
	font-size:small;
	color:#999999;
}
.kotakartikel .boxs .startikel2{
	font-size:small;
	color:#999999;
	width:100%;
	margin-bottom:5px;
}
.kotakartikel .boxs .startikelleng a{
	font-size:small;
	color:#8d141d;
	width:100%;
	display:inline-block;
	margin-bottom:5px;
}

.kotakevenet{
	text-align:center;padding:20px 0px;color:#FFFFFF;border-radius:10px;border:1px solid #FFFFFF;padding-top:0px;padding-bottom:0px;
}

.kotakevenet img{
padding-top:0px;margin-top:0px;border-top-left-radius:10px;border-top-right-radius:10px;
}

.kotakevenet .boxs{
	background:#FFFFFF;text-align:left;padding:10px;border-bottom-left-radius:10px;border-bottom-right-radius:10px;border:1px solid #FFFFFF;
}
.kotakevenet .boxs .startikel2{
	font-size:small;
	color:#999999;
	width:100%;
	margin-bottom:5px;
}

.kotakevenet .boxs .wibiner{
	background:#8d141d;padding:5px 10px;border:1px solid #8d141d;border-radius:15px;margin-top:5px;display:inline-block;width:auto;margin-bottom:5px;color:#FFFFFF;
}

.kotakevenet .boxs .webtgl{
	color:#a9afbb;padding-bottom:0px;margin-bottom:0px;
}
.kotakevenet .boxs .webjdl{
	font-size:medium; color:#000000;padding-top:5px;margin-top:5px;padding-bottom:5px;margin-bottom:5px;display:inline-block
}
.kotakevenet .boxs .webjdl a{
	font-size:medium; color:#000000;padding-top:0px;padding-bottom:0px;display:inline-block;height:50px;
}

.kotakevenet .boxs .weblok{
	color:#2e333c;padding-bottom:0px;margin-bottom:0px;font-size:medium;background:url(../image/icon/log.png) no-repeat;padding-left:23px;
}

.wrapdevdetel{
	margin-top:15px;
}
.wrapdevdetel .wibinerout{
	background:#bf1e2e;padding:5px 10px;border:1px solid #46cfbe;border-radius:15px;margin-top:5px;display:inline-block;width:auto;margin-bottom:5px;color:#FFFFFF;font-size:small;
}

.topnav {
	overflow: hidden;
	float: right;
	margin: 0;
	font-size: large;
	font-family: "Montserrat-Regular", sans-serif;	
}

.topnav a {
  float: right;
  display: block;
  color:#000000;
  text-align: center;
  padding: 5px 16px;
  text-decoration: none;

}


.topnav .icon {
  display: none;
}

.dropdown {
  float: right;
  overflow: hidden;
    color:#000000;
}

.dropdown .dropbtn {
	font-size: large;
  border: none;
  outline: none;
    color:#000000;
  padding: 5px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.dropdown-content {
  display: none;
  position: fixed;
  min-width: 160px;

  box-shadow: 0 4px 2px -2px gray;
  z-index: 10;
  background:#FFFFFF;
  padding: 5px 5px;
  border-bottom-right-radius:0.5em;

  border-bottom-left-radius:0.5em;
}

.dropdown-content a {
	float: none;
	color: black;
	padding: 5px 10px 5px 10px;
	text-decoration: none;
	display: block;
	text-align: left;
	border-radius: 0.4em;
	margin-top: 2px;
}


.topnav a:hover, .dropdown:hover .dropbtn { 
  color: #000000;
}

.dropdown-content a:hover {
  color: #333333;
}

.dropdown:hover .dropdown-content {
  display: block;
}




#custCarousel .carousel-indicators {
    position: static;
    margin-top: 20px
}

#custCarousel .carousel-indicators>li {
    width: 100px
}

#custCarousel .carousel-indicators li img {
    display: block;
    opacity: 0.5
}

#custCarousel .carousel-indicators li.active img {
    opacity: 1
}

.wrapisiartikel{
	text-align:justify;
}

.wrapisiartikel p{

padding:0px;
margin:0px;
margin-bottom:10px;
}

ul.wrapulli{
    margin-top:5px;margin-left:0px;padding-left:15px;margin-bottom:5px;

}
ul.wrapulli li{
	padding-bottom:10px;
}

ul.wrapullimenu{
    margin-top:5px;margin-left:0px;padding-left:15px;margin-bottom:5px;
	list-style:none;
}
ul.wrapullimenu li{
	list-style:none;
	border-bottom:1px #CCCCCC solid;padding:15px 0px;
}
ul.wrapullimenu li a{
	color:#000000;
}
ul.wrapullimenu li a:hover{
	color:#CCCCCC;
}

ol.wrapolli{
   margin-top:5px;margin-left:0px;padding-left:15px;margin-bottom:5px;list-style:lower-alpha;text-align:justify;

}
ol.wrapolli li{
	padding-bottom:10px;
}

ol.wrapulli{
   margin-top:5px;margin-left:0px;padding-left:15px;margin-bottom:5px;list-style:decimal;text-align:justify;

}
ol.wrapulli li{
	padding-bottom:10px;
}

table.wrapisitable{
	border-top:1px #000000 solid;
	border-right:1px #000000 solid;
	
}
table.wrapisitable tr td{
	border-left:1px #000000 solid;
	border-bottom:1px #000000 solid;
padding:5px;
}


.navbar-nav li:hover > ul.dropdown-menu {
    display: block;
}
.dropdown-submenu {
    position:relative;
}
.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top:-6px;
}

/* rotate caret on hover */
.dropdown-menu > li > a:hover:after {
    text-decoration: underline;
    transform: rotate(-90deg);
} 

/*tambahan baru ================================================================================*/

input.sendmailbottom[type="text"]{
	background:#FFFFFF;
	border:1px solid #FFFFFF;
	border-radius:25px;
	padding:5px;
	padding-left:10px;
	width:250px;
}



select.pilidatanyaaa{
float:left;width:25%;margin-left:10px;border:2px #46cfbe solid;border-radius:20px;color:#46cfbe;padding:5px;
}

select.pilidatanyaaa::selection ,
select.pilidatanyaaa:focus {
	outline: 0px #46cfbe solid;
}
input[type="text"]::selection ,
input[type="text"]:focus,
input.sendmailbottom[type="text"]::selection ,
input.sendmailbottom[type="text"]:focus {
	outline: 1px solid #FFFFFF;
}
input.hhdj[type="button"],
input.hhdj[type="submit"]{
	float:left;background:url(../image/icon/detstarged-button.png) no-repeat;margin-left:-30px;width:150px;
}
img.wprev{
	width:100%;
	height:201px;
}
h3.wpboxproduk{

	font-size:large;
	padding:15px 0px 5px 0px;
	text-align:center;
	margin:0px;
}
ul.wpboxprodukisi{
	margin-left:0px;padding-left:0px;margin-top:15px;display:block;height:auto;font-size:medium;
	padding-bottom:10px;
	margin-bottom:0px;
}
ul.wpboxprodukisi li{
 	margin: 0;
    padding: 0px 0 8px 33px;
    list-style: none;
    background-image: url(../image/icon/check.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 23px;
	text-align:left;
	font-size:small;
}
ul.wpboxprodukisitosca{
	margin-left:0px;padding-left:0px;margin-top:10px;display:block;height:auto;font-size:13px;
}
ul.wpboxprodukisitosca li{
	margin: 0;
	padding: 5px 0 5px 35px;
	list-style: none;
	background-image: url(../image/icon/icncettosca.png);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 25px;
}
h1.wph1{
	font-size:x-large;
	padding:10px 0px;
	padding-bottom:0px;
	margin:0px;
	line-height:normal;
}

h3.wph3{
	color:#FFFFFF;
	font-size:larger;
	padding-top:20px;
	margin:0px;
	padding-bottom:10px;
	text-align:left;
}
ul.wplistfooter{
	padding:0px;
	list-style:none;
	font-size:small;
	padding-bottom:0px;
	margin-bottom:0px;
	text-align:left;
}


ul.wplistfooter li{
	padding-bottom:3px;
}
ul.wpsosmed {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
ul.wpsosmed li.aaab {
	width:auto
}
ul.wpsosmed li {
  float: left;
  width:50%;
  padding:0px;
  margin:0px;
  display:block;
}

ul.wpsosmed li a {
  display: inline-block;
  text-decoration: none;
  padding:0px;color:#333333;font-size:small;text-align:left;
  margin-top:0px;
}

ul.wpsosmed li img{
	margin-top:10px;
	margin-bottom:15px;
}
ul.wpsosmed li a:hover {
	color:#bf1e2e;
}

span.clsbox-Service{
	color:#3696E0;
	display:block;
	text-align:center;
}
span.clsbox-System{
	color:#9958BC;
	display:block;
	text-align:center;
}

.ukuranbesar{
	font-size:36px;
	font-weight:bold;
}
.ukurankecil{
	vertical-align:top;
	font-size:x-large;
}

.warakotak .watakotaktoprekom{
	width:109px;
	height:111px;
	position:absolute;
	top:0px;
	right:0px;
	
	background:url(../image/icon/best-seller.png) no-repeat;
}


a.buttonnya{
	border-radius :7px;
	padding:10px 25px 10px 25px;
	font-size:small;font-family: 'Montserrat-Regular', sans-serif;;
	border:2px #bf1e2e solid;
}

a.bggreen{
	background:#FFFFFF;
}

a.bggreen:hover{
	background:blue;
	color:#FFFFFF;
}


a.buttonnya:hover{
	color:#FFFFFF;
	background:#46cfbe;
}
.bgcolorungu{
	background:#9958BC;
}

.bgcolorbiru{
	background:#3696E0;
}
.colorungu{
	color:#9958BC;
}

.colorbiru{
	color:#3696E0;
}

.kotakharga{
	border-radius :20px;
	border:1px #CCCCCC solid;
	display:block;
	clear:both;
	margin-top:22px;
	padding:25px 15px 0px 15px;
}
.kotakharga .rpharganya{
	display:inline-table;
	width:100%;
	height:auto;
}
.kotakharga .rpharganya .aa{
	width:65%;
	float:left;
	display:block;
	clear:none;
	position:relative;
	padding:0px;
	height:auto;
}
.kotakharga .rpharganya .bb{
	width:30%;
	float:right;
	display:block;
	clear:none;
	text-align:right;
}

.kotakharga .rpharganya .aa .ukurankecil-bottom{
	font-size:medium;
	position:absolute;
	right:0px;
	bottom:10px;
}

.bg2img{
	float:left;
}
.bg2isi{
	float:left;
	width:80%;margin-left:10px;
	text-align:justify;
}

table.wpfiturisi{
	width:40%;
	text-align:center;
}
table.wpfiturisi tr td{
	padding:10px 15px;
	text-align:center;
}

table.detailfitur{
	width:100%;
	display:block;
	float:left;
	margin-top:0px;
}
table.detailfitur tr td{
	padding: 10px 11px;
}


h1.wph1-sph{
	color:#000000;
	font-size:x-large;
	padding:0px;
	margin:0px;
	border-bottom:5px #41BEB3 solid;
	width:auto;
	display:inline-block;
}


.boxisidetail{
padding-left:30px;width:100%;display:block;float:left;clear:none;background:#F5F6FB;margin-top:10px;padding-right:30px;padding-bottom:20px;
}

.pjdlnya{
font-size:18px;
margin-top:5px;
}
.boxisidetail p{
	width:100%;
	text-align:justify;
}
.boder-clm{
	border:1px #CCCCCC solid;
	border-radius:5px;
	width:370px;
	display:block;
	float:left;
	clear:none;
	margin-left:30px;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
	margin-bottom:20px;
}
.boder-clm div{
	width:100%;
	padding:0px 15px;
	margin-top:10px;
}
.boder-clm div p{
	display:block;
	float:left;
	height:45px;
	width:100%;
	clear:both;
}

.boder-clm div p.no-paddong{
	height:40px;
}


.bgw-yellow{
	color:#E29E21;
}
.bgwbg-yellow{
	background:linear-gradient(#FFFFFF, #E29E21 120%);
}
.bgw-red{
	color:#E4563E;
}
.bgwbg-red{
	background:linear-gradient(#FFFFFF, #E4563E 120%);
}
.bgw-blue{
	color:#3696E0;
}
.bgwbg-blue{
	background:linear-gradient(#FFFFFF, #3696E0 120%);
}
.boder-clm .bggambar{
	border-top-left-radius:10px;border-top-right-radius:10px;width:100%;height:152px;padding:0px;margin:0px;
}
.boder-clm .bggambar .bggambarbayang{
	border-top-left-radius:10px;border-top-right-radius:10px;width:100%;height:209px;opacity: 0.6;padding:0px;margin:0px;
}

ul.wrapmenuartikel{
	list-style-type: none;
	margin: 0;
	padding: 10px 0px 0px 0px;
	margin-left:30px;
	font-size:large;
}

ul.wrapmenuartikel li{
	display: inline;
	padding-right:30px;
	color:#666666;
}

ul.wrapmenuartikel li a{
	color:#999999;
}
ul.wrapmenuartikel li a:hover{
	color:#666666;
}


#wrapper {
  width: 100%;
  max-width: 850px;
  position: relative;
  float:right;
  right:0px;
}

#carousel {
  overflow: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

#carousel::-webkit-scrollbar {
  height: 0;
}

#prev,
#next {
  display: flex;
  justify-content: center;
  align-content: center;
  background: white;
  border: none;
  padding: 8px;
  border-radius: 50%;
  outline: 0;
  cursor: pointer;
  position: absolute;
}

#prev {
  top: 50%;
  left: 0;
  transform: translate(50%, -50%);
  display: none;
}

#next {
  top: 50%;
  right: 0;
  transform: translate(-50%, -50%);
}

#content {
  display: grid;
  grid-gap: 16px;
  grid-auto-flow: column;
  margin: auto;
  box-sizing: border-box;
}

.item {
padding:0px 30px 0px 0px;
}

.container p{
	font-family: "Montserrat-Regular", sans-serif;
}

#wrapper-home {
  width: 95%;
  position: relative;
  right: 30px;
  float:right;
}

#carousel-home {
  overflow: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

#carousel-home::-webkit-scrollbar {
  height: 0;
}

#prev-home,
#next-home {
  display: flex;
  justify-content: center;
  align-content: center;
  background: #EC0000;
  border: none;
  padding: 5px;
  border-radius: 50%;
  outline: 0;
  cursor: pointer;
  position: absolute;
}

#prev-home {
  top: 50%;
  left: -50px;
  transform: translate(50%, -50%);
  display: none;
}

#next-home {
  top: 50%;
  right: -50px;
  transform: translate(-50%, -50%);
}

#content-home {
  display: grid;
  grid-gap: 16px;
  grid-auto-flow: column;
  margin: auto;
  box-sizing: border-box;
}

.item-home{
	width:154px;
	height:60px;	
	margin-right:20px;
	margin-left:20px;
	background:red;
}

img.foto-home{
width:auto;margin-top:0px;
}


#wrapper-testimoni {
  width: 100%;
  max-width: 980px;
  position: relative;
  left: 0%;
}

#carousel-testimoni {
  overflow: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

#carousel-testimoni::-webkit-scrollbar {
  height: 0;
}

#prev-testimoni,
#next-testimoni {
  display: flex;
  justify-content: center;
  align-content: center;
  background: white;
  border: none;
  padding: 8px;
  border-radius: 50%;
  outline: 0;
  cursor: pointer;
  position: absolute;
}

#prev-testimoni {
  top: 50%;
  left: 0;
  transform: translate(50%, -50%);
  display: none;
}

#next-testimoni {
  top: 50%;
  right: 0;
  transform: translate(-50%, -50%);
}

#content-testimoni {
  display: grid;
  grid-gap: 16px;
  grid-auto-flow: column;
  margin: auto;
  box-sizing: border-box;
}

.item-testimoni{
	background-image:url(../image/box.png);
	background-repeat:no-repeat;
	width:300px;
	height:282px;	
}
.item-testimoni .isikotaknya{
	text-align:center;
	width:93%;
	margin-top:15px;
}
.item-testimoni .isikotaknya span{
	margin-bottom:6px;
	display:block;
	color:#3696E0;
}

.item-testimoni .isikotaknya span.subnama{
	font-size:medium;
	color:#000000;
}
img.foto-testimoni{
width:80px;margin-top:23px;
}

.divcenrnya{
	margin:0 auto;display:inline-block;
}
.divcenrnya .divagen{
	display:block;
	width:300px;
	clear:none;
	margin:0 20px;
	float:left;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
	border:1px #CCCCCC;
	border-radius:5px;
	padding:15px;
	font-family: "Montserrat-Regular", sans-serif;
	font-size:large;
	margin-bottom:30px;
}
.divcenrnya .divagen span{
	margin-top:6px;
	margin-bottom:6px;
	display:block;
	color:#3696E0;
}
.divcenrnya .divagen p{
	text-align:justify
}

.divbgfitur{
	background-image: url('../image/produk/fitur/Fitur-01.png');background-position: center top; background-size: auto;width: 100%;background-repeat:no-repeat;padding:45px 0px 165px 0px;
}

.divbgfitur div {
width:55%;margin:0 auto;display:inline-block;
}
.divbgfitur div .iconkotak{
width:100px;height:100px;display:block;clear:none;float:left;margin:20px 11px;
}

.boxallin{
padding:0 10px;
}


.items-partner {
  display:block;
  width:100%;
  max-width:300px;
  clear:both;
  margin-top:300px;
}

.items-partner .item-partner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 350px;
  height: auto;
/*  border-radius: 50%;*/
  overflow: hidden;
  transition: all 300ms ease-in-out;
  z-index: -1;
  opacity: 0;
}

.item-partner {
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
	border:1px #CCCCCC;
	border-radius:5px;
	background:#FFFFFF;
}

.item-partner.active {
  opacity: 1;
  z-index: 99;
}

.item-partner.prev {
  z-index: 2;
  opacity: 0.25;
  transform: translate(-125%, -50%);
  background:#CCCCCC;
}

.item-partner.next {
  z-index: 2;
  opacity: 0.25;
  transform: translate(25%, -50%);
  background:#CCCCCC;
}

.items-partner .button-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70%;
  max-width: 80%;
  z-index: 100;
}
.items-partner .isikotaknya{
	text-align:center;
	width:100%;
	margin-top:0px;
	color:#000000;
	padding:10px;
	height:auto;
}
.items-partner .isikotaknya span{
	margin-bottom:6px;
	display:block;
	color:#3696E0;
}


.items-partner .isikotaknya span.subnama{
	font-size:medium;
	color:#000000;
}

.button-container .button-back {
  background:url(../image/icon/back-to.png) no-repeat;
  width:50px;
  height:50px;
   cursor: pointer;
  position: relative;
  opacity: 0.75;
}
.button-container .button-next {
  background:url(../image/icon/next-page.png) no-repeat;
  width:50px;
  height:50px;
   cursor: pointer;
  position: relative;
  opacity: 0.75;
}


.button-container .button-back:hover {
  opacity: 1;
}

.button-container .button-back:nth-child(1) {
  float: left;
}

.button-container .button-next:nth-child(2) {
  float: right;
}


@media (max-width: 1366px){#testiCarou .testi-desktop{display:none;width:100%;margin:0 auto;}}
@media (max-width: 1024px){#testiCarou .testi-mobile{display:block}#testiCarou .testi-desktop{display:none;width:100%;margin:0 auto}}
@media (min-width: 1024px){#testiCarou .testi-mobile{display:none}#testiCarou .testi-desktop{display:block}}
@media (max-width: 768px){#testiCarou .carousel-inner .panel .quote-img{bottom:25px;top:unset}}
@media (max-width: 600px){#testiCarou .testi-mobile .carousel-control .fa-arrow-left{right:45% !important}#testiCarou .testi-mobile .carousel-control .fa-arrow-right{left:45% !important}
.boder-clm div p{
	height:auto;
}
.boder-clm div p.no-paddong{
	height:auto;
}

.divcenrnya .divagen{

	width:250px;
}
.divbgfitur{
	padding:0px;
	background:none;
	height:auto;
}
.divbgfitur div{
	width:100%;
}
.divbgfitur div .iconkotak{
	margin:20px 8px;
}
.section-header .lala{
	width:100%
}

#wrapper-testimoni{
	width:300px;
	overflow:hidden;
}
.items-partner .item-partner {
	width:300px;
	overflow:hidden;
}
.item-partner.next{
 transform: translate(-40%, -50%);
}
.item-testimoni .isikotaknya{
	text-align:center;
	width:90%;
	margin-top:15px;
}
.item-testimoni .isikotaknya p{
    font-size: medium;
}
.imgpro {
    width: 300px;
}
.boder-clm {
    margin-left: 10px;
    width: 95%;
}
.section-header {
    margin-top: 20px;
margin-bottom:0px;
}
#wrapper-home{
	width: 90%;
	overflow: hidden;
	position: absolute;
	z-index: 0;
	top: 10px;
}
#product{
padding-top:60px;
}

h4 {
    font-size: medium;
}
a.buttonnya {
    border-radius: 15px;
    padding: 8px;

}
.wabox{
	display:block;
	float:left;
	height:auto;
	clear:both;
	margin-bottom:20px;

}
h3.wpboxproduk{
	font-size:large;
}

#prev-home, #next-home{
	padding:2px;
	z-index:100;
	position:absolute;
	display: flex;
	background:none;
	float:none
}
#prev-home{
	left:-33px;
}
#next-home{
	right:-33px;
}
img.foto-home{
	margin-top:0px;
	margin-left:0px;
}
.boder-clm div{
	height:85px;
}

}
@media (max-width: 375px){#testiCarou .testi-mobile .carousel-control .fa-arrow-left{right:50% !important}#testiCarou .testi-mobile .carousel-control .fa-arrow-right{left:45% !important}
.container p{
	font-size:small;
}
.section-header .lala{
	width:100%
}
.divbgfitur{
	padding:0px;
	background:none;
}
.divbgfitur div{
	width:100%;
}
.imgpro{
	width:300px;
}
.boder-clm{
	margin-left:10px;
	width:95%;
}

.divcenrnya .divagen{
	width:90%;
}
#intro h1{
	padding-right:0px;

}
.boder-clm div{
	height:auto
}
}
@media (max-width: 320px){
#testiCarou .testi-mobile .carousel-control .fa-arrow-left{right:70% !important}#testiCarou .testi-mobile .carousel-control .fa-arrow-right{left:40% !important}
.divbgfitur{
	padding:0px;
	background:none;
}
.divbgfitur div{
	width:100%;
}
.imgpro{
	width:300px;
}
.boder-clm{
	margin-left:10px;
	width:95%;
}
#wrapper-testimoni{
	max-width:300px;
}
#wrapper-home{
	max-width:300px;
}
.divcenrnya .divagen{
	width:90%;
}
#intro h1{
	padding-right:0px;
}
.boder-clm div{
	height:auto
}
}
.fixed{position:fixed;top:0;left:0;width:100%}

#testiCarou .carousel-inner{margin:0 auto;width:90%}#testiCarou .carousel-control{width:7%}#testiCarou .carousel-control.left,#testiCarou .carousel-control.right{background-image:none}#testiCarou .fa-arrow-left,#testiCarou .carousel-control .fa-arrow-right{position:relative;top:43%;display:inline-block;background-color:#676767;border:none;color:white;text-align:center;text-decoration:none;font-size:16px;height:50px;width:50px;margin:0 auto;line-height:50px;border-radius:100%}

#testiCarou .panel-wrap{padding-top:10px;padding-bottom:10px;}

#testiCarou .carousel-inner .panel{margin:0 auto;max-width:100%;transition:0.6s ease;border-radius:11px;box-shadow:0 9px 18px 0 rgba(0,0,0,0.1);width:400px;border:none}

#testiCarou .carousel-inner .item.active{ background:none;}

#testiCarou .carousel-inner .panel .panel-body{color:#646464;font-size:14.5px;padding:0px;position:relative;border-radius:11px}

#testiCarou .carousel-inner .panel .quote{padding-left:30px;padding-right:30px;height:295px;line-height:270px;position:relative;background:green}
#testiCarou .carousel-inner .panel .quote p{display:inline-block;vertical-align:middle;line-height:normal}
#testiCarou .carousel-inner .panel .quote-img{text-align:right;position:absolute;top:120px;right:20px}
#testiCarou .carousel-inner .panel .avatar{height:90px;width:90px;position:absolute;top:0;left:50%;transform:translate(-50%, -50%);border-radius:100%;margin:0 auto;overflow:hidden;border:2px solid #fff}
#testiCarou .carousel-inner .panel .profil{background-color:#d8d8d8;width:100%;text-align:center;padding-top:50px;padding-right:5px;padding-left:5px;padding-bottom:15px;position:relative;bottom:0;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-left-radius:11px;border-bottom-right-radius:11px;height:150px}
#testiCarou .carousel-inner .panel .profil img{display:inline-block;position:relative;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);height:90px;object-fit:cover;max-width:100%;width:100%}

.carousel-inner .divimg{display:inline-block;max-width:100%;width:100%;margin:0px ;height:60px;max-height:100%;line-height:60px;}
.carousel-inner .divimg img{text-align:center;margin:0px auto}
img.wpimgnya{
	width:10%;
}
img.fullimg{width:8%;

}
#testiCarou .carousel-inner .panel .profil .profil-name{color:#178f8c;font-size:17px;font-weight:700;margin-bottom:5px}#testiCarou .carousel-inner .panel .profil .company{font-weight:100}#testiCarou .carousel-inner .panel:hover{transform:scale(1.05)}#testiCarou .carousel-inner .item.left.active,#testiCarou .carousel-inner .item.prev{transform:translateX(-33%)}#testiCarou .carousel-inner .item.right.active,#testiCarou .carousel-inner .item.next{transform:translateX(33%)}



hr.new1 {
  border-top: 1px solid #EEEEEE;
}
.wrapdevdetel img{
	margin-top:15px;
	max-width:100%;
}

.wrapdevdetel ul.wrapdataundangan{
	padding-left:0px;
	list-style:none;	
}

.wrapdevdetel ul.wrapdataundangan li{
	margin-bottom:0px;
	line-height:normal;
	padding: 5px 0 5px 30px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px;
}
.wrapdevdetel ul.wrapdataundangan li.listgl{
	background-size: 17px;
	background-image:url(../image/icon/tgl.png);
	padding: 5px 0 5px 22px;
}
.wrapdevdetel ul.wrapdataundangan li.lisjam{
	background-size: 17px;
	background-image:url(../image/icon/jam.png);
	padding: 5px 0 5px 22px;
}
.wrapdevdetel ul.wrapdataundangan li.lislog{
	background-size: 17px;
	background-image:url(../image/icon/lokasi.png);
	padding: 5px 0 5px 22px;
}
.wrapdevdetel ul.wrapdataundangan li.lisdlr{
	background-size: 17px;
	background-image:url(../image/icon/dolar.png);
	padding: 5px 0 5px 22px;
}
.wrapdevdetel ul.wrapdataundangan li.nolist{
	margin-bottom:0px;
	font-weight:bold;
	padding-left:0px;
	margin-left:0px;
	border-bottom:2px #999999 solid;
}

::-ms-input-placeholder { 
  color: #CCCCCC; font-size:small;
}

::placeholder {
  color: #CCCCCC;
  font-size:small;
}
#menu {
	background: none;
	color: #000000;
	height: 45px;
	padding-left: 18px;
	border-radius: 10px;
}
#menu ul, #menu li {
	margin: 0 auto;
	padding: 0;
	list-style: none;
}
#menu ul {
	width: 100%;
}
#menu li {
	float: right;
	display: inline;
	position: relative;
	padding:0px 20px;
}
#menu a {
	display: block;
	line-height: 45px;
	padding: 0 14px;
	text-decoration: none;
	color: #000000;
	font-size: 16px;
}

#menu a.dropdown-arrow:after {
	content: "\25BE";
	margin-left: 5px;
}
#menu li a:hover {
	color: #0099CC;
	background: #F2F2F2;
}
#menu input {
	display: none;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 45px;
	opacity: 0;
	cursor: pointer;
}
#menu label {
	display: none;
	line-height: 45px;
	text-align: center;
	position: absolute;
	right: 35px;
	width:45px;
}
#menu label:before {
	font-size: 1.6em;
	content: "\2261"; 
	margin-left: 20px;
}
#menu ul.sub-menus{
	height: auto;
	overflow: visible ;
	width: 275px;
	background: #FFFFFF;
	position: absolute;
	z-index: 99;
	display: none;
}
#menu ul.sub-menus li {
	display: block;
	width: 100%;
	padding-left:0px;
}
#menu ul.sub-menus a {
	color: #000000;
	font-size: small;
}
#menu ul.menutop li a {
	padding: 5px 0 5px 0;
	line-height:normal;
	font-size:small;
}
#menu ul.menutop li a.btntopnya{
	background:#8d141d;color:#FFFFFF;border:1px #8d141d solid; border-radius:5px;padding:3px 10px;font-size:small
}
#menu ul.menutop li a.btntopnya2{
	border:1px #8d141d solid; border-radius:5px;padding:3px 10px;font-size:small
}
#menu ul.sub-menus li a,
#menu ul.sub-menus li a.dropdown-arrow {
	line-height:normal;
	padding: 5px 0 5px 25px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 22px;

}
#menu li:hover ul.sub-menus {
	display: block
}

#menu ul.sub-menus li:hover ul.sub-menus2 {
	display: block
}
#menu ul.sub-menus2{
	height: auto;
	overflow: hidden;
	width: 275px;
	background: #FFFFFF;
	position: absolute;
	z-index: 99;
	display: none;
}
#menu ul.sub-menus2 li {
	display: block;
	width: 100%;
	padding-left:0px;
}
#menu ul.sub-menus2 a {
	color: #000000;
	font-size: small;
}

#menu ul.sub-menus2 li{
	display: block;
	width: 100%;
	padding-left:25px;
}

@media screen and (max-width: 800px){
	#header .pull-left{margin-left:15px;width:auto}
	#header .container{ padding-left:0px;padding-right:0px;}
	#menu {position:relative;height:40px;border-radius:0px;width:100%;padding-left:0px;}
	#menu ul {background:#FFFFFF;position:absolute;top:100%;right:0;left:0;z-index:3;height:auto;display:none;width:100%;}
	#menu ul.sub-menus {width:100%;position:static;background:#FFFFFF;}
	#menu ul.sub-menus a {padding-left:30px;}
	#menu li {display:block;float:none;width:auto;}
	#menu input, #menu label {position:absolute;top:-10px;right:10px;display:block;}
	#menu input {z-index:4}
	#menu input:checked + label {color:#000000}
	#menu input:checked + label:before {content:"\00d7"}
	#menu input:checked ~ ul {display:block}
}
@media screen and (max-width: 600px) {
  .topnav a, .dropdown .dropbtn {
    display: none;
  }
  
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {

img.nonimg{
	display:none;
}

  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
  
  
}

table.menu-fitur-select{
	font-size:medium;
	bottom: 0;
	right: 0;

}
table.menu-fitur-select tr td{
	width:auto;
	vertical-align:middle;
	padding:10px;
	text-align:center
}
a.over-menu-fitur{
	color:#545454;
}

table.menu-fitur-select tr td:hover{
	background:#F0F0F0;
	width:auto;
	vertical-align:middle;
	padding:10px;
	text-align:center
}
ul#warpmobileapp{
		width:100%;
		margin-left:0px;
		padding-left:0px;
}
ul#warpmobileapp li{
	list-style:outside;
	display:block;
	font-weight:bold;
	color:#B3272A;
}
ul#warpmobileapp li.isinya{
	padding-bottom:7px;
	list-style:none;
	width:90%;
	padding-left:0px;
	font-weight:normal;
	color:#000000;
}


@media only screen and (max-width: 480px) {

.container p{
	font-size:small;
}
img.huii{
	width:15%;
	height:15%;
}
.boxdetnya{
	font-size:1.2em;
	line-height:20px;
}

.boxdetnya div{
	padding:5px;
}
ul.wpboxprodukisi{
	font-size:small;
}

ul.wpboxprodukisi li{
	padding-bottom:5px;
	font-size:1.1em;
	margin-bottom:5px;
}
ul.wpboxprodukisitosca li{
	padding:0px 0px 5px 30px;
	background-position: top left;
}
ul.wplistfooter li{
	 font-size:13px;
}

input.sendmailbottom[type="text"]{
	width:100%;
	border:1px solid #FFFFFF;
}
input.sendmailbottom[type="text"]:focus {
	border:1px solid #FFFFFF;
	background:red;
}

input.hhdj[type="button"],
input.hhdj[type="submit"]{
	background:url(../image/icon/detstarged-button.png) no-repeat;text-align:center;float:none;margin-top:5px;clear:both; display:inline-table;
}
img.wprev{
	width:100%;
	max-height:201px;
}
img.wprevtop{
	width:100%;
	margin-top:12px;
}
img.wprev2{
	width:100%;
}
img.nonimg{
	display:none;
}

#produk, #prosedur, #product, #profile, #testimon, #service, #contactus, #klaim, #tempke1, #tempke2, #tempke3, #tempke4, #tempke5, #tempke6, #tempke7, #tempke8{
	padding:0px;
}
.kotakmarun{
	margin-bottom:10px;
}
.kotakevenet .boxs .weblok {
	font-size: 14px;
}
.kotakevenet .boxs .webtgl{
	font-size: 14px;
}
  img {
    width: 50%;
  }
.section-header h2 {
  font-size: 26px;
}
.section-header h3 {
	font-size: 23px;
}
.kotakartikel .boxs {
	margin-top:10px;
}
.kotakartikel .boxs .startikel {
	font-size: 11px;
}

h1.wph1{
	padding-top:0px;
	margin-top:0px;
	font-size:large;
}
.webjdl {
	font-size: 18px;
}

.section-header p {
  font-size: 12px;
}
.section-header .lala{width:100%;}

.lili{width:100%; font-size: 26px;}
}

 
.wpgb{
	width:100%;padding: 10px 15px 15px 15px;border-top-left-radius:10px;border-top-right-radius:10px;border-bottom:1px #f8f8ff solid;background:#f8f8ff;border-left-color:#f8f8ff;border-right-color:#f8f8ff;
}
.wpgbcolor{
	background:#49c1bf;
}

.wrappers h2,
.wrapper h2{
	font-family:sans-serif;
	color:#fff;
}

.wrapper .carousel{
	width:100%;
	margin:0px auto;
}
.wrappers .slick-slide,
.wrapper .slick-slide{
	margin:10px;
}
.wrappers .slick-slide img,
.wrapper .slick-slide img{
	width:100%;
}
.wrappers .slick-dots li button:before ,
.wrapper .slick-dots li button:before {
	font-size:20px;
	color:white;
}

.wrappers,
.wrapper{
	width: 90%;
	padding-top: 20px;
	text-align:center;
	margin: 0px auto;
}
.wrappers .sliderfors{
	width:90%;
	margin:0px auto;
}	
.wrappers .slick-slide{
	margin:10px;
}
.wrappers .slick-slide img{
	width:100%;
}	
.wrapper .slick-active  .wpgbcolor {
	background:none;
}
.wrapper .slick-active  .wpgb {
	background:#49c1bf;
}

.wrapper .slick-active .wpgb .wptexe {
	color: #FFFFFF;

}
.wrappers .slick-slide .slick-active img {
	background:none;
}
.wrappers .slick-active {
	border-radius:10px;	
}
.wrapper .slick-active + .slick-active  .wpgbcolor ,
.wrapper .slick-active + .slick-active .warakotak .wpgb ,
.wrappers .slick-active + .slick-active {
  	background: none;
}
.wrapper .slick-active + .slick-active + .slick-active .wpgbcolor ,
.wrapper .slick-active + .slick-active + .slick-active .warakotak .wpgb ,
.wrappers .slick-active + .slick-active + .slick-active {
	background:none;	
}

.vehicle-detail-banner .car-slider-desc {
    max-width: 180px;
    margin: 0 auto;
}
.banner-slider .slider.slider-for {
    max-width: 67%;
    padding-right: 10px;
}
.banner-slider .slider.slider-nav {
    max-width: 33%;
}
.banner-slider .slider.slider-for,
.banner-slider .slider.slider-nav {
    width: 100%;
    float: right;
}
.banner-slider .slider.slider-nav {
    height: auto;
    overflow: hidden;
}
.slider-banner-image {
    height:500px;
	border: 1px #f8f8ff solid;
    border-radius: 25px;
    margin-top: 20px;
    background: #60c9c4;
}
.slider-banner-image p{
	font-size:medium;
}
.slider-banner-image img{
	border-top-left-radius: 25px;
    border-top-right-radius: 25px;
	padding:0px;
	margin:0px;
}
.slider-banner-image img.huii{
	float: left;
	margin-right: 20px;
	width: 50px;
	height: 50px;
	margin-bottom:10px;
	margin-left: 10px;
}
.banner-slider .slider.slider-nav {
    padding: 20px 0 0;
}
.slider-nav .slick-slide.thumbnail-image .thumbImg{
    max-width: 178px;
    height: 110px;
    margin: 0 auto;
    border: 1px solid #bf1e2e;
}
.slider-banner-image img,
.slider-nav .slick-slide.thumbnail-image .thumbImg img {
    height: 100%;
    width:100%;
    object-fit: cover;
}
.slick-vertical .slick-slide:active,
.slick-vertical .slick-slide:focus,
.slick-arrow:hover,
.slick-arrow:focus {
    outline: 0;
	font-weight:bold;
}
.slider-nav .slick-slide.slick-current.thumbnail-image .thumbImg {
    border: 2px solid #bf1e2e;
}
.slider-nav .slick-slide.slick-current span {
    color: #333333;
	filter: sepia(90%) hue-rotate(300deg) brightness(60%) saturate(400%);
}
.slider-nav .slick-slide {
    text-align: left;
	border-bottom: 2px #bf1e2e solid;
	color:#FF0000;
	padding-top:10px;
	padding-bottom:10px;

}
.slider-nav .slick-slide span {
	font-size: medium;
    display: block;
    padding: 10px 0 10px 0px;
    padding: 8px;
    padding-right: 40px;
    background-repeat: no-repeat;
    color: #2f3138;
}
.slick-arrow {
    width: 100%;
    background-color: transparent;
    border: 0;
    background-position: center;
    background-repeat: no-repeat;
    font-size: 0;
    height: 18px;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 99;
}
.slick-prev {
   top: 0;
}
.slick-next {
   bottom: 0;
   background-color: none;
}

/*End USE CSS for Slider*/

@media screen and (max-width : 991px) {
	.banner-slider .slider.slider-for,
	.banner-slider .slider.slider-nav {
	    max-width: 100%;
	    float: none;
	}
	.banner-slider .slider.slider-for {
		padding-right: 0;
	}
	.banner-slider .slider.slider-nav {
		height: auto;
	}
	.slider-banner-image {
	    height: 500px;
	} 
	.slider.slider-nav.thumb-image {
        padding: 10px 30px 0;
	}
	.slider-nav .slick-slide span {
		padding: 5px 0;
	}
	.slick-arrow {
		padding: 0;
	    width: 30px;
	    height: 30px;
	    top: 50%;
	    bottom: 0;
	    -webkit-transform: translateY(-50%) rotate(-90deg);
	    -moz-transform: translateY(-50%) rotate(-90deg);
	    -ms-transform: translateY(-50%) rotate(-90deg);
	    transform: translateY(-50%) rotate(-90deg);
	}
	.slick-prev {
	    left: 0;
	    right: unset;
	}
	.slick-next {
	    left: unset;
	    right: 0;
   		background-color: transparent;
	}
	.vehicle-detail-banner .car-slider-desc {
    	max-width: 340px;
	}
	.bid-tag {
    	padding: 10px 0 15px;
	}
	.slider.slider-nav.thumb-image {
	   white-space: nowrap;
	}
	.thumbnail-image.slick-slide {
		padding: 0px 5px;
		min-width: 75px;
		display: inline-block;
		float: none;
	}
}

@media screen and (max-width : 767px) {
	.slider-banner-image {
	    height: 400px;
	}
	.slider.slider-nav.thumb-image {
    	padding: 0px 20px 0;
    	margin: 10px 0px 0;
	}
	.slider-nav .slick-slide.thumbnail-image .thumbImg {
		max-width: 140px;
		height: 80px;
	}
	.slick-prev.slick-arrow {
    	background-position: center 10px;
	}
	.slick-next.slick-arrow {
    	background-position: center 10px, center;
	}
	.slider-nav .slick-slide span {
	    font-size: 12px;
	    white-space: normal;
	}
}

@media screen and (max-width: 580px) {
	.slider-banner-image {
	    height:340px;
	}
	
	.slider-banner-image p{
		font-size:small;
	}
}

@media screen and (max-width : 480px) {
	.slider-banner-image {
	    height:280px;
	}
	#yass{
		display:none;
	}
}

.slick-slide {
  margin: 0px 10px;
}

.slick-slide img {
  width: 80%;
}

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.slick-track {
	position: relative;
	top: 0;
	left: 0;
	display: block;
}
.slick-track:before,
.slick-track:after {
	display: table;
	content: "";
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
	visibility: hidden;
}
.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}
[dir="rtl"] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
}
.slick-arrow.slick-hidden {
  display: none;
}

.datatable{
	color:#999999;
	font-size:small;
}
.datatable tr td{
	padding:2px 15px; 
}
.namatb{	
	border:1px #ccc solid;
	border-radius:10px;
	font-size:small;
	display: block;
    width: 100%;
}
.namatb tr td{
	padding:4px 10px; 
}
.foninsian{
	background:none;font-size:medium;padding:2px;
}

.object {
  animation: MoveUpDown 10s linear infinite;
  position: absolute;
  left: 40px;
  bottom: 60px;
  z-index:-1;
}

@keyframes MoveUpDown {
  0%, 100% {
    bottom: 60px;
  }
  50% {
    bottom: 200px;
  }
}

.object2 {
  animation: MoveUpDown2 10s linear infinite;
  position: absolute;
  right: 40px;
  bottom: 80px;
  z-index:-1;
}

@keyframes MoveUpDown2 {
  0%, 100% {
    bottom: 80px;
  }
  50% {
    bottom: 230px;
  }
}


@media only screen and (max-width: 480px){
	
.object2 {
  right: 0px;
}

	
@keyframes MoveUpDown2 {
  0%, 100% {
    bottom: 80px;
  }
  50% {
    bottom: 180px;
  }
}

}
.bg {
    background-size: cover;
    background-repeat: no-repeat;
    background-position:top right;
	height:521px;
    opacity: 1;
}
.bg, .bg-wrap, .nav-bg {
    position: absolute;
    z-index: -2;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}