body.front-end{
	overflow-x: hidden;
	scroll-behavior: smooth;
  font-family: 'Open Sans' !important;
}
body.front-end .mobil-mall--swiper-container .mobil-mall--swiper-pagination{
	margin: 1.5rem auto;
	display: flex;
	overflow-x: scroll;
}
body.front-end .navbar-nav li .active{
  
color: #3DB9CC !important;
}


body.front-end .text-title-download {
font-family: 'Open Sans' !important;
font-style: normal;
font-weight: 700 !important;
font-size: 18px !important;
line-height: 28px;
color: #FFFFFF !important;
text-align: left;
}
body.front-end .navbar-nav li a .active{
  
color: #3DB9CC !important;
}

body.front-end .navbar-nav li.active{
  
color: #3DB9CC !important;
}
body.front-end .navbar-nav li a .active{
  
color: #3DB9CC !important;
}

/* font bold and bolditalic */
@font-face {
  font-family: 'Open Sans';
  src: url('font/OpenSans/OpenSans-Bold.ttf');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Open Sans';
  src: url('font/OpenSans/OpenSans-BoldItalic.ttf');
  font-weight: 700;
  font-style: italic;
}

/* font bold and bolditalic */
@font-face {
  font-family: 'Open Sans';
  src: url('font/OpenSans/OpenSans-Bold.ttf');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Open Sans';
  src: url('font/OpenSans/OpenSans-BoldItalic.ttf');
  font-weight: 700;
  font-style: italic;
}
/* font extrabold and extrabolditalic */
@font-face {
  font-family: 'Open Sans';
  src: url('font/OpenSans/OpenSans-ExtraBold.ttf');
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: 'Open Sans';
  src: url('font/OpenSans/OpenSans-ExtraBoldItalic.ttf');
  font-weight: 800;
  font-style: italic;
}

  /* font regular and regularitalic */
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-Regular.ttf');
    font-weight: 400;
    font-style: normal;
  }
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-Italic.ttf');
    font-weight: 400;
    font-style: italic;
  }

  /* font light and lightitalic */
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-Light.ttf');
    font-weight: 300;
    font-style: normal;
  }
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-LightItalic.ttf');
    font-weight: 300;
    font-style: italic;
  }

  /* font medium and mediumitalic */
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-Medium.ttf');
    font-weight: 500;
    font-style: normal;
  }
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-MediumItalic.ttf');
    font-weight: 500;
    font-style: italic;
  }
  
  /* font medium and mediumitalic */
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-Medium.ttf');
    font-weight: 500;
    font-style: normal;
  }
  @font-face {
    font-family: 'Open Sans';
    src: url('font/OpenSans/OpenSans-MediumItalic.ttf');
    font-weight: 500;
    font-style: italic;
  }

    /* font semibold and semibolditalic */
    @font-face {
      font-family: 'Open Sans';
      src: url('font/OpenSans/OpenSans-SemiBold.ttf');
      font-weight: 600;
      font-style: normal;
    }
    @font-face {
      font-family: 'Open Sans';
      src: url('font/OpenSans/OpenSans-SemiBoldItalic.ttf');
      font-weight: 600;
      font-style: italic;
    }

@media (min-width: 1024px) and (max-width: 1439px) {
  .desktop-menu--list {
    margin-left: 2rem;
  }
}
@media (min-width: 768px) and ( max-width: 1439px)  {

  .is-mobile {
    display: none;
  }
  body.front-end .promo-carousel--section .swiper-slide-share-button{
    	align-items: center;
	background: transparent;
	padding: 0 !important;
	width: 95px;
	height: 33.93px;
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.25));
	border-radius: 5px !important;
	box-sizing: border-box;
	color: #fff;
	display: flex;
	flex-direction: row;
	font-size: 14px;
	margin: auto;
  bottom: 7vh;
  left: 65vw;
  position: fixed;
  }
  body.front-end .simulation--page-content .simulation--card .simulation--title{
   display: none;
  }
  .swiperDesktop .swiper-slide {
		width: 31% !important;
		margin-left: .1rem;
		
	}
  .swiperDesktop-two .swiper-slide {
		width: 30% !important;
		margin-left: .1rem;
		
	}
  body.front-end .card-syarat {
	
		background-size: cover;
		border-radius: 5px;
		color: #fff;
		font-size: 1.25rem !important;
		width: 100%;
    height: 10rem ;
	}
  /* .is-desktop.sdk--card {
    display: flex !important;
  } */

  .col-desktop-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}
.col-desktop-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}
.body.front-end .style-responsive-logo {
  margin: 0 3rem 0 1rem;
}
  body.front-end .va-payment--card {
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 1rem;
  }
  body.front-end .va-search {
    background: #FFFFFF;
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
border-radius: 3px 30px 3px 3px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 1rem;
  }
  body.front-end .va-payment--card img{
    height: 40px;
    width: 40px;
  }
  body.front-end .fine--card {
    background: #F1F5F8;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
		border-radius: 10px;
    align-items: flex-start;
    margin: 1rem;
  }
  .wrap-padding-card-pengkinian {
    width: 100%;
    margin: 0;
    position: relative;
  }
  .m-4.desktop-m-5 {
    margin-right: 5rem !important;
    margin-left: 7rem !important;
  }
  .space-strategi{
    padding: 32px 192px 0px 80px;
  }
  .m-3.desktop-m-5.visi-misi{
    margin-right: 0rem !important;
    margin-left: 0rem !important;
    border-radius: 8px;
    margin-top: -65px !important;
  }
  .m-3.desktop-m-5.visi-misi-tab-two{
    margin-right: 3rem !important;
    margin-left: 3rem !important;
    margin-top: 4rem !important;
    padding-top: 3rem;
  }
  .m-2.desktop-m-3 {
    margin-left: 3rem !important;
    margin-right: 3rem !important;
  }
  .m-2.desktop-m-5 {
    margin-left: 7rem !important;
    margin-right: 5rem !important;
  }

  /* TOP TOOLBAR */

  #header {
    background-color: transparent;
  }
  #header.active {
    background: #fff;
    border-radius: 0 0 35px 35px;
  }
  .desktop-menu--list {
    display: flex;
    /* margin-left: 2.5rem; */
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: stretch;
    justify-content: space-evenly;
  }
  .desktop--seacrh-bar {
    position: relative; margin: 0 1rem;
  }
  .desktop--seacrh-bar img {
    position: absolute;
    width: 30px;
    top: 4px;
    left: 4px;
  }
  .desktop--seacrh-bar input {
    padding: .5rem 2.5rem;
    border-radius: 25px;
    background: transparent;
    border: 1px white solid !important;
  }
  .desktop--seacrh-bar ::placeholder {
    color: white;
  }
  #header #switchLang .btn {
    transition: none !important;
  }
  #header .desktop-menu--list button,
  #header .desktop-menu--list a {
    color: white;
    font-weight: 700 !important;
    font-size: 13px !important;
    line-height: 18px;
    color: #072342 ;
  }
  
  #header .desktop-menu--list .dropdown-toggle::after {
    display: none;
  }

  
  #header.active .hover-ongoing:hover .login-ongoing {
    display: block;
    color: #000;
    font-weight: 600 !important;
    }
  #header.active .desktop-menu--list a:focus,
  #header.active .desktop-menu--list a:active {
    color:#007F9F;
  }

  #header.active .desktop--seacrh-bar input {
    background: #F1F5F8;
    border: 1px #E5E5E5 solid !important;
  }
  #header.active .desktop--seacrh-bar .search-bar-blue{
    display: block;
  }
  #header.active .desktop--seacrh-bar .search-bar-white{
    display: none;
  }
  #header .desktop--seacrh-bar .search-bar-blue{
    display: none;
  }
  #header .desktop--seacrh-bar .search-bar-white{
    display: block;
    width: 19px;
    top: 9px;
    left: 9px;
  }
  #header.active .desktop--seacrh-bar ::placeholder {
    color: #9E9494;
  }

  #header #switchLang button.btn {
    padding: 8px 12px !important;
    margin: 0 !important;
    font-size: 12px !important;
    border: 1px white solid !important;
    color: white;
  }
  #header.active #switchLang button.btn {
    padding: 8px 12px !important;
    margin: 0 !important;
    font-size: 12px !important;
    border: 1px #F1F5F8 solid !important;
    color: #9E9494;
    background: #F1F5F8;
  }
  #header #switchLang button#idn.btn {
    border-radius: 25px 0 0 25px !important;
  }
  #header #switchLang button#en.btn {
    border-radius: 0 25px 25px 0 !important;
  }
  #header #switchLang button.btn.active {
    padding: 8px 12px;
    margin: 0 !important;
    font-size: 12px !important;
    border: 1px white solid;
    background: white;
    color: #007F9F;
    font-weight: 600;
  }
  #header.active #switchLang button.btn.active {
    border: 1px #007F9F solid !important;
  }


  body.front-end header#header-desktop{
    background: transparent !important;
    -webkit-transition: .5s ease-in-out;
    box-shadow: 4px 4px 4px rgb(0 0 0 / 25%);
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    width: 100%;
    z-index: 9999;
  }

  body.front-end header#header-desktop nav{
    align-items: center;
    display: flex;
    justify-content: space-between;
  }

  body.front-end header#header-desktop nav .logo img {
    height: 100% !important;
    width: 200px;
    max-height: unset !important;
  }

  body.front-end header#header-desktop nav button{
    background: none;
    border: none;
    cursor: pointer;
    margin: 0 .5rem;
    padding: 0;
  }

  .dropdown-menu.show {
    width: 250px;
    padding: 1rem .5rem;
    margin-top: 1.25rem !important;
    box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.25) !important;
    border: none !important;
  }
  .dropdown-menu.show .dropdown-item--wrapper {
    line-height: 1rem;
    padding-bottom: 1.25rem;
  }
  .dropdown-menu.show .dropdown-item--wrapper a.dropdown-item {
    color: #007F9F !important;
    padding: 0px !important;
  }
  .dropdown-menu.show .dropdown-item--wrapper span {
    font-size: .5rem;
    color: #8e8e8e;
    font-weight: 400 !important;
    line-height: .6rem;
  }
  .dropdown-menu.show:before{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 7px;
    right: auto;
    top: -10px;
    bottom: auto;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 15px solid #FFF;
    
  }

  /* RIGHT MENU */
  .desktop-right-menu--container {
    align-items: center;
    background-color: #0D4685;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.5rem 1rem 0.5rem 0;
    position: absolute;
    right: 0;
    top: 18vh;
    border-radius: 15px 0 0 15px;
    z-index: 10;
    width: 7rem;
  }
  .desktop-right-menu--container button img {
    width: 25px;
    height: 25px;
    margin-bottom: 8px;
  }
  .desktop-right-menu--container button img.icon-without-title {
    width: 52px;
    height: 52px;
  }
  .desktop-right-menu--container button span {
    font-size: 10px;
    line-height: 1rem;
  }
  body.front-end .desktop-right-menu--navigation button {
    align-items: inherit;
    background: none;
    border: none;
    display: flex;
    color: #fff;
    flex-direction: column;
    font-size: .6rem !important;
    font-weight: 400;
    justify-content: center;
    /* margin: 0 0; */
    padding: 0.2rem 0;
  }
  hr.menu-divider {
    border: .5px #ffffff4a solid;
    /* margin: .5rem 0; */
    /* width: 100%; */
    margin: 0;
    width: calc(100% - 1rem);
  }

  /* FOOTER */
  body.front-end footer#desktop-footer--wrapper {
    padding: 20px 5rem 3rem 5rem !important;
  }
  body.front-end hr.footer--hr {
    margin: 0 auto 2rem auto !important;
    width: 100% !important;
    opacity: unset !important;
    border-width: 0.8px;
  }
  .green {
    color: #05A5B3;
  }
  .orange {
    color: #F57B32;
  }

  .desktop-footer--content .partition-1 {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    width: 100%;
  }

  .desktop-footer--content .partition-1 .addresses {
    align-items: stretch;
    justify-content: flex-start;
    margin-top: 1.25rem;
    width: 100%;
  }
  .desktop-footer--content .partition-1 .addresses .addresses--content {
    justify-content: flex-start;
    text-align: left;
  }
  .desktop-footer--content .partition-1 .addresses .addresses--content p {
    margin-bottom: 12px !important;
    font-family: 'Open Sans' !important;
    font-style: normal;
    font-weight: 700 !important;
    font-size: 18px !important;
    line-height: 28px;
    color: #FFFFFF !important;
  }
  .desktop-footer--content .partition-1 .addresses .addresses--content span {
    font-size: 12px !important;
    color: #ffffff;
    font-family: 'Open Sans';
    font-weight: 600 !important;
    line-height: 1.3rem;
  }
  .desktop-footer-socmed--wrapper {
    display: flex;
    flex-direction: row;
    padding-right: 2rem;
  }
  .desktop-footer-socmed--wrapper a {
  }
  #desktop-footer--wrapper.is-desktop .partition-2 .desktop--ojk {
    align-items: center;
    display: flex !important;
    justify-content: center;
  }
  #desktop-footer--wrapper.is-desktop .partition-2 .desktop--copyright {
    color: #ffffff;
    margin: 0 2rem;
  }
  #desktop-footer--wrapper .partition-2 p {
    margin-bottom: 0 !important;
    font-size: 12px;
    margin-right: 1rem;
  }
  #desktop-footer--wrapper.is-desktop .partition-2 {
    display: flex !important;
    justify-content: space-between;
    margin-top: -12px;
    margin-bottom: 20px;
    color: #ffffff;
  }
  body.front-end footer {
    padding: 0 !important;
  }

  .about--section {
    display: none !important;
  }






.more-information {
  display: flex;
  flex-direction: column;
  padding-right: 0rem;
  align-items: baseline;
}
.more-information--cards {
}


  .more-information {
    flex-direction: row;
    justify-content: space-between;
    padding-right: 0rem;
    align-items: baseline;
  }
  .more-information--cards {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
  }
  .more-information--cards .with-cover {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  body.front-end .with-cover .article--thumbnail {
    box-shadow: none !important;
    margin: 0rem 0rem !important;
  }
  .more-information--cards .no-cover {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    margin-left: 16px;
  }
  .if-desktop {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .more-information--cards .no-cover .no-cover--card {
    flex: 0 0 46%;
    max-width: 45%;
    /* margin: 0 1rem; */
    padding-right: 1rem;
  }

  body.front-end .mobil-mall-content--section {
    display: flex;
    flex-direction: column !important;
    padding-bottom: 2.5rem;
  }
  body.front-end .mobil-mall-content--section .showroom-tabs {
    margin: 56px 192px 0rem 80px;
  }

  body.front-end .mobil-mall-content--section .nav-tabs .nav-link img {
    /* width: 3rem; */
    height: 50px;
  }
  body.front-end .nav-tabs,
  body.front-end .mobil-mall-content--section .tab-content {
    width: 70%;
  }
  body.front-end .mobil-mall-content--section .desktop-title {
    margin-right: 3rem;
    margin-bottom: 0 !important;
    padding-top: 0;
  }

  body.front-end .fina--section {
    margin: 0 0rem !important;
  }
  body.front-end .fina--section h2 {
    text-align: left;
    font-weight: 700;
		font-size: 28px !important;
		line-height: 36px;
  }


/* LAYANAN */

  body.front-end .info--header {
    background-size: cover;
    padding: 10rem 5rem 2rem 5rem;
    text-align: left;
  }
  body.front-end .assurance--header {
    padding: 10rem 192px 5rem 80px !important;
    background-size: contain;
    background-position: top right;
  }
  body.front-end .assurance--header.angsuran {
    background: url('../static/info/angsuran-header-bg.png'),
		linear-gradient(180deg, rgba(13, 70, 133, 0.8) 6.39%, rgba(126, 208, 221, 0.8) 100%) !important;
    background-repeat: no-repeat !important;
    background-size: inherit;
    background-position: right bottom !important;
  }
  body.front-end .assurance--header.stnk {
    background:
    url('../static/info/stnk-header-bg.png'),
    linear-gradient(180deg, rgba(13, 70, 133, 0.8) 6.39%, rgba(126, 208, 221, 0.8) 100%) !important;
    
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: right bottom !important;
    padding: 2rem 4rem 2rem 5rem
  }
  body.front-end .service-info--wrapper .assurance--header.payment {
    background:
    url('../static/info/pelunasan-header-bg.png'),
		linear-gradient(180deg, rgba(13, 70, 133, 0.8) 6.39%, rgba(126, 208, 221, 0.8) 100%) !important;
    min-height: unset !important;
    background-position: right !important;
		background-size: inherit !important;
    background-repeat: no-repeat !important;
  }
  body.front-end .service-info--wrapper .assurance--header.BPKB {
    background:
    url('../static/info/bpkb-header-bg.png'),
		linear-gradient(131.89deg, rgba(241, 245, 248, 0.5) 8.07%, rgba(59, 183, 180, 0) 70.97%),
		linear-gradient(53.18deg, #007F9F 12.87%, #05A5B3 42.54%, #3BB7B4 73.76%);
    background-repeat: no-repeat;
    background-size: inherit;
    background-position: right bottom;
  }
  body.front-end .assurance--header.form {
		background:
    url('../static/info/kelengkapan-header-bg.png'),
		linear-gradient(131.89deg, rgba(241, 245, 248, 0.5) 8.07%, rgba(59, 183, 180, 0) 70.97%),
		linear-gradient(53.18deg, #007F9F 12.87%, #05A5B3 42.54%, #3BB7B4 73.76%);
    background-position: right;
		background-size: inherit;
    background-repeat: no-repeat;
  }
  body.front-end .assurance--header .assurance-about {
    max-width: 55%;
    padding: 0;
  }
  body.front-end .assurance--header .assurance-about h2 {
    font-size: 42px !important;
line-height: 36px;
font-family: 'Open Sans';
  }
  body.front-end .stnk--breadcrumb {
    padding: 6rem 1rem 1rem 5rem;
  }

  body.front-end .assurance--tabs .nav-tabs .nav-link {
    font-size: 16px !important;
		line-height: 20px;
  }
  body.front-end .visi--tabs {
    max-width: 100%;
    margin-top: 0rem !important;
    margin-left: 3rem;
    margin-right: 3rem;
  }
  body.front-end .visi--tabs .nav-tabs .nav-link {
    font-size: 22px !important;
  }
  body.front-end .service-info--wrapper .desktop-content-width {
    max-width: 100%;
    margin-top: 0px;
  }
  body.front-end .service-info--wrapper .assurance-type--card {
    display: flex !important;
    padding-left: 0;
    padding-right: 0 !important;
  }
  body.front-end .assurance-type--card img.odd-card,
	body.front-end .assurance-type--card img.even-card {
		border-radius: 45px 5px 0px 0px;
	}
  body.front-end .bottom-tabs {
		justify-content: flex-start;
	}
  body.front-end .bottom-tabs p {
		text-align: left;
	}
  body.front-end .bottom-tabs a.mail {
		padding: .75rem 4rem;
    margin-right: 1rem;
    cursor: pointer;
	}

  body.front-end .is-guide {
    background-size: cover;
    margin-bottom: 32px;
  }

  body.front-end .announcement {
		padding: 0rem 0rem !important;
	}
  body.front-end .announcement p {
		font-size: 1rem !important;
    line-height: 1.4rem !important;
	}
  body.front-end .announcement button.orange-button {
    margin-top: 1rem;
    width: 40%;
  }
  body.front-end .announcement-stnk {
		padding: 1rem 1rem !important;
    margin-bottom: 56px;
	}
  body.front-end .announcement-stnk p {
		font-size: 16px !important;
    line-height: 32px !important;
	}
  body.front-end .announcement-stnk button.orange-button {
    margin-top: 1rem;
    width: 30%;
  }
  #documentStnk.with-checkmark {
    border: 1px solid #05A5B3;
    padding: 1.25rem 1.25rem 1.25rem 2.5rem !important;
    margin-bottom: 32px;
    margin-top: 32px;
  }
  ol.autodebet-step {
    padding-right: 1rem !important;
  }

  body.front-end .fine--card {
    flex-direction: column;
  }
  body.front-end .fine--card img {
    margin-left: 1rem;
    margin-bottom: 1rem;
  }

  body.front-end .info--content {
    padding: 5rem;
    background: #F1F5F8;
  }

}
@media (min-width: 1440px)  {
  .is-mobile {
    display: none;
  }
  body.front-end .highlight-style {
    padding-right: 0rem;
}
  body.front-end .promo-carousel--section .swiper-slide-share-button{
    align-items: center;
    background: transparent;
    padding: 0 !important;
    width: 95px;
    height: 33.93px;
    border: 1px solid #FFFFFF;
    box-sizing: border-box;
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.25));
    border-radius: 5px !important;
    box-sizing: border-box;
    color: #fff;
    display: flex;
    flex-direction: row;
    font-size: 14px;
    margin: auto;
    bottom: 7vh;
    left: 65%;
    position: fixed;
  }
  body.front-end .simulation--page-content .simulation--card .simulation--title{
   display: none;
  }
  .swiperDesktop .swiper-slide {
		width: 32% !important;
		margin-left: .1rem;
		
	}
  .swiperDesktop-two .swiper-slide {
		width: 30% !important;
		margin-left: .1rem;
		
	}
  body.front-end .card-syarat {
	
		background-size: cover;
		border-radius: 5px;
		color: #fff;
		font-size: 1.25rem !important;
		width: 100%;
    height: 10rem ;
	}
  /* .is-desktop.sdk--card {
    display: flex !important;
  } */

  .col-desktop-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}
.col-desktop-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}
.body.front-end .style-responsive-logo {
  margin: 0 3rem 0 1rem;
}
  body.front-end .va-payment--card {
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 1rem;
  }
  body.front-end .va-search {
    background: #FFFFFF;
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
border-radius: 3px 30px 3px 3px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 1rem;
  }
  body.front-end .va-payment--card img{
    height: 40px;
    width: 40px;
  }
  body.front-end .fine--card {
    background: #F1F5F8;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
		border-radius: 10px;
    align-items: flex-start;
    margin: 1rem;
  }
  .wrap-padding-card-pengkinian {
    width: 100%;
    margin: 0;
    position: relative;
  }
  .m-4.desktop-m-5 {
    margin-right: 5rem !important;
    margin-left: 5rem !important;
  }
  .space-strategi{
    padding: 32px 192px 0px 80px;
  }
  .m-3.desktop-m-5.visi-misi{
    margin-right: 0rem !important;
    margin-left: 0rem !important;
    border-radius: 8px;
    margin-top: -65px !important;
  }
  .m-3.desktop-m-5.visi-misi-tab-two{
    margin-right: 3rem !important;
    margin-left: 3rem !important;
    margin-top: 4rem !important;
    padding-top: 3rem;
  }
  .m-2.desktop-m-3 {
    margin-left: 3rem !important;
    margin-right: 3rem !important;
  }
  .m-2.desktop-m-5 {
    margin-left: 5rem !important;
    margin-right: 5rem !important;
  }

  /* TOP TOOLBAR */

  #header {
    background-color: transparent;
  }
  #header.active {
    background: #fff;
    border-radius: 0 0 35px 35px;
  }
  .desktop-menu--list {
    display: flex;
    /* margin-left: 2.5rem; */
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-evenly;
    margin-left: 2rem;
    align-items: stretch;
    flex: 1;
  }
  .desktop--seacrh-bar {
    position: relative; margin: 0 1rem;
  }
  .desktop--seacrh-bar img {
    position: absolute;
    width: 30px;
    top: 4px;
    left: 4px;
  }
  .desktop--seacrh-bar input {
    padding: .5rem 2.5rem;
    border-radius: 25px;
    background: transparent;
    border: 1px white solid !important;
  }
  .desktop--seacrh-bar ::placeholder {
    color: white;
  }
  #header #switchLang .btn {
    transition: none !important;
  }
  #header .desktop-menu--list button,
  #header .desktop-menu--list a {
    color: white;
    font-weight: 700 !important;
    font-size: 13px !important;
    line-height: 18px;
    color: #072342 ;
  }
  
  #header .desktop-menu--list .dropdown-toggle::after {
    display: none;
  }

  
  #header.active .hover-ongoing:hover .login-ongoing {
    display: block;
    color: #000;
    font-weight: 600 !important;
    }
  #header.active .desktop-menu--list a:focus,
  #header.active .desktop-menu--list a:active {
    color:#007F9F;
  }

  #header.active .desktop--seacrh-bar input {
    background: #F1F5F8;
    border: 1px #E5E5E5 solid !important;
  }
  #header.active .desktop--seacrh-bar .search-bar-blue{
    display: block;
  }
  #header.active .desktop--seacrh-bar .search-bar-white{
    display: none;
  }
  #header .desktop--seacrh-bar .search-bar-blue{
    display: none;
  }
  #header .desktop--seacrh-bar .search-bar-white{
    display: block;
    width: 19px;
    top: 9px;
    left: 9px;
  }
  #header.active .desktop--seacrh-bar ::placeholder {
    color: #9E9494;
  }

  #header #switchLang button.btn {
    padding: 8px 12px !important;
    margin: 0 !important;
    font-size: 12px !important;
    border: 1px white solid !important;
    color: white;
  }
  #header.active #switchLang button.btn {
    padding: 8px 12px !important;
    margin: 0 !important;
    font-size: 12px !important;
    border: 1px #F1F5F8 solid !important;
    color: #9E9494;
    background: #F1F5F8;
  }
  #header #switchLang button#idn.btn {
    border-radius: 25px 0 0 25px !important;
  }
  #header #switchLang button#en.btn {
    border-radius: 0 25px 25px 0 !important;
  }
  #header #switchLang button.btn.active {
    padding: 8px 12px;
    margin: 0 !important;
    font-size: 12px !important;
    border: 1px white solid;
    background: white;
    color: #007F9F;
    font-weight: 600;
  }
  #header.active #switchLang button.btn.active {
    border: 1px #007F9F solid !important;
  }


  body.front-end header#header-desktop{
    background: transparent !important;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    box-shadow: 4px 4px 4px 4px rgb(0 0 0 / 25%);
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    width: 100%;
    z-index: 9999;
  }

  body.front-end header#header-desktop nav{
    align-items: center;
    display: flex;
    justify-content: space-between;
  }

  body.front-end header#header-desktop nav .logo img {
    height: 100% !important;
    width: 200px;
    max-height: unset !important;
  }

  body.front-end header#header-desktop nav button{
    background: none;
    border: none;
    cursor: pointer;
    margin: 0 .5rem;
    padding: 0;
  }

  .dropdown-menu.show {
    width: 250px;
    padding: 1rem .5rem;
    margin-top: 1.25rem !important;
    box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.25) !important;
    border: none !important;
  }
  .dropdown-menu.show .dropdown-item--wrapper {
    line-height: 1rem;
    padding-bottom: 1.25rem;
  }
  .dropdown-menu.show .dropdown-item--wrapper a.dropdown-item {
    color: #007F9F !important;
    padding: 0px !important;
  }
  .dropdown-menu.show .dropdown-item--wrapper span {
    font-size: .5rem;
    color: #8e8e8e;
    font-weight: 400 !important;
    line-height: .6rem;
  }
  .dropdown-menu.show:before{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 7px;
    right: auto;
    top: -10px;
    bottom: auto;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 15px solid #FFF;
    
  }

  /* RIGHT MENU */
  .desktop-right-menu--container {
    align-items: center;
    background-color: #0D4685;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.5rem 1rem 0.5rem 0;
    position: absolute;
    right: 0;
    top: 18vh;
    border-radius: 15px 0 0 15px;
    z-index: 10;
    width: 7rem;
  }

  .desktop-right-menu--container button img {
    width: 25px;
    height: 25px;
    margin-bottom: 8px;
  }
  .desktop-right-menu--container button img.icon-without-title {
    width: 52px;
    height: 52px;
  }
  .desktop-right-menu--container button span {
    font-size: 10px;
    line-height: 1rem;
  }
  body.front-end .desktop-right-menu--navigation button {
    align-items: inherit;
    background: none;
    border: none;
    display: flex;
    color: #fff;
    flex-direction: column;
    font-size: .6rem !important;
    font-weight: 400;
    justify-content: center;
    /* margin-left: 1rem; */
    padding: 0.2rem 0;
  }
  hr.menu-divider {
    border: .5px #ffffff4a solid;
    margin: 0;
    margin-left: auto;
    width: calc(100% - 1rem);
  }

  /* FOOTER */
  body.front-end footer#desktop-footer--wrapper {
    padding: 20px 5rem 3rem 5rem !important;
  }
  body.front-end hr.footer--hr {
    margin: 0 auto 2rem auto !important;
    width: 100% !important;
    opacity: unset !important;
    border-width: 0.8px;
  }
  .green {
    color: #05A5B3;
  }
  .orange {
    color: #F57B32;
  }

  .desktop-footer--content .partition-1 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .desktop-footer--content .partition-1 img {
    margin: 0rem 0;
    max-height: 2.5rem;
  }
  .desktop-footer--content .partition-1 .addresses {
    align-items: stretch;
    justify-content: flex-start;
    margin-top: 1.25rem;
    width: 100%;
  }
  .desktop-footer--content .partition-1 .addresses .addresses--content {
    justify-content: flex-start;
    text-align: left;
  }
  .desktop-footer--content .partition-1 .addresses .addresses--content p {
    margin-bottom: 12px !important;
    font-family: 'Open Sans' !important;
    font-style: normal;
    font-weight: 700 !important;
    font-size: 18px !important;
    line-height: 28px;
    color: #FFFFFF !important;
  }
  .desktop-footer--content .partition-1 .addresses .addresses--content span {
    font-size: 12px !important;
    color: #ffffff;
    font-family: 'Open Sans';
    font-weight: 600 !important;
    line-height: 1.3rem;
  }
  .desktop-footer-socmed--wrapper {
    display: flex;
    flex-direction: row;
    padding-right: 2rem;
  }
  .desktop-footer-socmed--wrapper a {
    
  }
  #desktop-footer--wrapper.is-desktop .partition-2 .desktop--ojk {
    align-items: center;
    display: flex !important;
    justify-content: center;
  }
  #desktop-footer--wrapper.is-desktop .partition-2 .desktop--copyright {
    color: #ffffff;
    margin: 0 2rem;
  }
  #desktop-footer--wrapper .partition-2 p {
    margin-bottom: 0 !important;
    font-size: 12px;
    margin-right: 1rem;
  }
  #desktop-footer--wrapper.is-desktop .partition-2 {
    display: flex !important;
    justify-content: space-between;
    margin-top: -12px;
    margin-bottom: 20px;
    color: #ffffff;
  }
  body.front-end footer {
    padding: 0 !important;
  }

  .about--section {
    display: none !important;
  }






.more-information {
  display: flex;
  flex-direction: column;
  padding-right: 0rem;
  align-items: baseline;
}
.more-information--cards {
}


  .more-information {
    flex-direction: row;
    justify-content: space-between;
    padding-right: 0rem;
    align-items: baseline;
  }
  .more-information--cards {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
  }
  .more-information--cards .with-cover {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  body.front-end .with-cover .article--thumbnail {
    box-shadow: none !important;
    margin: 0rem .5rem !important;
  }
  .more-information--cards .no-cover {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    margin-left: 16px;
  }
  .if-desktop {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .more-information--cards .no-cover .no-cover--card {
    flex: 0 0 46%;
    max-width: 45%;
    margin: 0 1rem;
  }

  body.front-end .mobil-mall-content--section {
    display: flex;
    flex-direction: column !important;
    padding-bottom: 2.5rem;
  }
  body.front-end .mobil-mall-content--section .showroom-tabs {
    margin: 0rem 192px 0rem 80px;
  }

  body.front-end .mobil-mall-content--section .nav-tabs .nav-link img {
    /* width: 3rem; */
    height: 50px;
  }
  body.front-end .nav-tabs,
  body.front-end .mobil-mall-content--section .tab-content {
    width: 70%;
  }
  body.front-end .mobil-mall-content--section .desktop-title {
    margin-right: 3rem;
    margin-bottom: 0 !important;
    padding-top: 0;
  }

  body.front-end .fina--section {
    margin: 0 0rem !important;
  }
  body.front-end .fina--section h2 {
    text-align: left;
    font-weight: 700;
		font-size: 28px !important;
		line-height: 36px;

  }


/* LAYANAN */

  body.front-end .info--header {
    background-size: cover;
    padding: 10rem 5rem 2rem 5rem;
    text-align: left;
  }
  body.front-end .assurance--header {
    padding: 10rem 192px 5rem 80px !important;
    background-size: contain;
    background-position: top right;
  }
  body.front-end .assurance--header.angsuran {
    background: url('../static/info/angsuran-header-bg.png'),
		linear-gradient(180deg, rgba(13, 70, 133, 0.8) 6.39%, rgba(126, 208, 221, 0.8) 100%) !important;
    background-repeat: no-repeat !important;
    background-size: inherit;
    background-position: right bottom !important;
  }
  body.front-end .assurance--header.stnk {
    background:
    url('../static/info/stnk-header-bg.png'),
		linear-gradient(180deg, rgba(13, 70, 133, 0.8) 6.39%, rgba(126, 208, 221, 0.8) 100%) !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: right bottom !important;
    padding: 2rem 4rem 2rem 5rem
  }
  body.front-end .service-info--wrapper .assurance--header.payment {
    background:
    url('../static/info/pelunasan-header-bg.png'),
		linear-gradient(180deg, rgba(13, 70, 133, 0.8) 6.39%, rgba(126, 208, 221, 0.8) 100%) !important;
    min-height: unset !important;
    background-position: right !important;
		background-size: inherit !important;
    background-repeat: no-repeat !important;
  }
  body.front-end .service-info--wrapper .assurance--header.BPKB {
    background:
    url('../static/info/bpkb-header-bg.png'),
		linear-gradient(131.89deg, rgba(241, 245, 248, 0.5) 8.07%, rgba(59, 183, 180, 0) 70.97%),
		linear-gradient(53.18deg, #007F9F 12.87%, #05A5B3 42.54%, #3BB7B4 73.76%);
    background-repeat: no-repeat;
    background-size: inherit;
    background-position: right bottom;
  }
  body.front-end .assurance--header.form {
		background:
    url('../static/info/kelengkapan-header-bg.png'),
		linear-gradient(131.89deg, rgba(241, 245, 248, 0.5) 8.07%, rgba(59, 183, 180, 0) 70.97%),
		linear-gradient(53.18deg, #007F9F 12.87%, #05A5B3 42.54%, #3BB7B4 73.76%);
    background-position: right;
		background-size: inherit;
    background-repeat: no-repeat;
  }
  body.front-end .assurance--header .assurance-about {
    max-width: 55%;
    padding: 0;
  }
  body.front-end .assurance--header .assurance-about h2 {
    font-size: 26px !important;
    line-height: 36px;
    font-family: 'Open Sans';
  }
  body.front-end .stnk--breadcrumb {
    padding: 6rem 1rem 1rem 5rem;
  }

  body.front-end .assurance--tabs .nav-tabs .nav-link {
    font-size: 16px !important;
		line-height: 20px;
  }
  body.front-end .visi--tabs {
    max-width: 100%;
    margin-top: 0rem !important;
    margin-left: 3rem;
    margin-right: 3rem;
  }
  body.front-end .visi--tabs .nav-tabs .nav-link {
    font-size: 22px !important;
  }
  body.front-end .service-info--wrapper .desktop-content-width {
    max-width: 100%;
    margin-top: 0px;
  }
  body.front-end .service-info--wrapper .assurance-type--card {
    display: flex !important;
    padding-left: 0;
    padding-right: 0 !important;
  }
  body.front-end .assurance-type--card img.odd-card,
	body.front-end .assurance-type--card img.even-card {
		border-radius: 45px 5px 0px 0px;
	}
  body.front-end .bottom-tabs {
		justify-content: flex-start;
	}
  body.front-end .bottom-tabs p {
		text-align: left;
	}
  body.front-end .bottom-tabs a.mail {
		padding: .75rem 4rem;
    margin-right: 1rem;
    cursor: pointer;
	}

  body.front-end .is-guide {
    background-size: cover;
    margin-bottom: 32px;
  }

  body.front-end .announcement {
		padding: 0rem 0rem !important;
	}
  body.front-end .announcement p {
		font-size: 1rem !important;
    line-height: 1.4rem !important;
	}
  body.front-end .announcement button.orange-button {
    margin-top: 1rem;
    width: 40%;
  }

  body.front-end .announcement-stnk {
		padding: 1rem 1rem !important;
    margin-bottom: 56px;
	}
  body.front-end .announcement-stnk p {
		font-size: 16px !important;
    line-height: 32px !important;
	}
  body.front-end .announcement-stnk button.orange-button {
    margin-top: 1rem;
    width: 30%;
  }
  #documentStnk.with-checkmark {
    border: 1px solid #05A5B3;
    padding: 1.25rem 1.25rem 1.25rem 2.5rem !important;
    margin-bottom: 32px;
    margin-top: 32px;
  }
  ol.autodebet-step {
    padding-right: 1rem !important;
  }

  body.front-end .fine--card {
    flex-direction: column;
  }
  body.front-end .fine--card img {
    margin-left: 1rem;
    margin-bottom: 1rem;
  }

  body.front-end .info--content {
    padding: 5rem;
    background: #F1F5F8;
  }

}
@media (min-width: 1025px) and (max-width: 1256px){
  .desktop-menu--list {
    margin-left: .60rem;
  }
  #header .desktop-menu--list a {
    color: white;
    font-weight: 700 !important;
    font-size: 12px !important;
    line-height: 18px;
    color: #072342 ;
}
  body.front-end header#header-desktop nav .logo img {
    height: 100% !important;
    width: 125px !important;
    max-height: unset !important;
  }
  body.front-end .text-welcome-user {
    font-size: 11px;
    -webkit-line-clamp: 1;
    max-height: calc(1em * 1.5 * 2);
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    width: 59px;
    margin-top: 16px;
}
  body.front-end .space-desktop-right {
    padding: 1rem 20rem 1rem 4rem !important;
}
body.front-end .highlight-style {
  padding-right: 0rem;
  display: flex;
  justify-content: space-evenly;
}
  body.front-end .card-syarat {
	
		background-size: cover;
		border-radius: 5px;
		color: #fff;
		font-size: 1.25rem !important;
		width: 100%;
    height: 10rem ;
	}
  body.front-end .promo-carousel--section .swiper-slide-share-button{
    align-items: center;
    background: transparent;
    padding: 0 !important;
    width: 95px;
    height: 33.93px;
    border: 1px solid #FFFFFF;
    box-sizing: border-box;
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.25));
    border-radius: 5px !important;
    box-sizing: border-box;
    color: #fff;
    display: flex;
    flex-direction: row;
    font-size: 14px;
    margin: auto;
    bottom: 7vh;
    left: 65vw;
    position: fixed;
  }
  body.front-end .desktop-simulation--section {
    background: linear-gradient( 
      180deg, #BEE8EE 0%, #D4E3F4 51.18%);
          border-top-right-radius: 50px;
          color: #ffffff;
          /* margin-top: -16rem; */
          position: absolute;
          bottom: 0;
          padding: 5px 2rem 1rem 2rem;
          background-repeat: no-repeat;
          background-size: cover;
          width: 21rem;
          z-index: 10;
  }
  body.front-end header nav {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 1rem 1rem ;
  }
  body.front-end .logo-style {
    margin: 0rem ;
    }
  body.front-end .search-small {
    width: 16% !important;
  }
  body.front-end .style-font-small {
    font-size: 11px  !important;
  }
}
@media (max-width: 767px) {
  .desktop-footer--content .partition-1 .addresses {
    align-items: stretch;
    justify-content: flex-start;
    margin-top: 0;
    width: 100%;
  }
  body.front-end .fina--section h2 {
    text-align: center;
    font-weight: 700;
		font-size: 20px !important;
		line-height: 30px;
  }
  body.front-end .va-payment--card img{
    height: 40px;
    width: 40px;
  }
  .space-strategi{
    padding: 32px 16px 0px 16px;
  }
  #header-desktop.is-desktop,
  .is-desktop#desktop-footer--wrapper,
  .desktop-about--section {
    display: none !important;
  }
  /* LANDING */


  .hidden {
    display: none !important;
  }
  .is-mobile {
    display: block;
  }
  .is-desktop {
    display: none !important;
  }

}
@media ( min-width: 768px) and (max-width: 1024px ) {
  body.front-end footer#desktop-footer--wrapper {
    padding: 20px 6rem 3rem 2rem !important;
  }
  body.front-end header#header-desktop nav {
    display: none;
  }
  body.front-end .mobil-mall-content--section .showroom-tabs {
    margin: 56px 32px 0rem 32px;
}
  body.front-end .visi--tabs {
    max-width: 100%;
    margin-top: 0rem !important;
    margin-left: 3rem;
    margin-right: 3rem;
  }
  
  .swiperDesktop .swiper-slide {
		width: 45% !important;
		margin-left: .1rem;
		
	}
  body.front-end .space-strategi {
    padding: 32px 1rem 2rem 1rem;
  }
  
  .swiperPromoHomepage .swiper-slide {
    margin-left: 0rem;
    margin-right: 6px !important;
		
	}
  .m-3.desktop-m-5.visi-misi-tab-two{
    margin-right: 3rem !important;
    margin-left: 3rem !important;
    margin-top: 2rem !important;
  }
  body.front-end .space-desktop-right {
    padding: 3rem 1rem 1rem 1rem !important;
}
  body.front-end .service-info--wrapper .desktop-content-width {
    max-width: 100%;
  }

}

.nopadding {
  padding: 0 !important;
  /* margin: 0 !important; */
}

.modal-content.penghargaan {
  position: relative;
}
.modal-content.penghargaan .close {
  position: absolute;
  z-index: 1;
  top: 1.5rem;
  right: 1.5rem;
}
.modal-content.penghargaan .modal-header {
  padding: 0.75rem;
}