/* global css style */
@font-face {
  font-family: "swansea";
  src: url('../fonts/swansea-font/Swansea-q3pd.ttf') format('opentype');
  font-weight: 300;
}
@font-face {
  font-family: "swansea";
  src: url('../fonts/swansea-font/SwanseaBoldItalic-p3Dv.ttf') format('opentype');
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: "swansea";
  src: url('../fonts/swansea-font/Swansea-q3pd.ttf') format('opentype');
  font-weight: normal;
  font-display: swap;
}
@font-face {
  font-family: "swansea";
  src: url('../fonts/swansea-font/SwanseaItalic-AwqD.ttf') format('opentype');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "swansea";
  src: url('../fonts/swansea-font/SwanseaBold-D0ox.ttf') format('opentype');
  font-weight: bold;
  font-display: swap;
}
@font-face {
  font-family: "swansea";
  src: url('../fonts/swansea-font/SwanseaBold-D0ox.ttf') format('opentype');
  font-weight: 800;
  font-display: swap;
}


@font-face {
  font-family: "Cinzel";
  src: url('../fonts/Cinzel/Cinzel-Regular.ttf') format('truetype');
  font-weight: normal;
}
@font-face {
  font-family: "Cinzel";
  src: url('../fonts/Cinzel/Cinzel-Bold.ttf') format('truetype');
  font-weight: bold;
  font-display: swap;
}

body{
  font-family: 'swansea';
  color: #121b50;
}

h1,h2,h3,h4,h5,h6{
  font-family: "cinzel";
  font-weight: bold;
}

.fs-12{
  font-size: 12px;
}

.fs-14{
  font-size: 14px;
}

.fs-16{
  font-size: 16px;
}

.fs-18{
  font-size: 18px;
}

.fs-25{
  font-size: 25px;
}
.fs-32{
  font-size: 32px;
}

.fw-bold{
  font-weight: bold;
}
.fs-italic{
  font-style: italic;
}
.lh-1{
  line-height: 1;
}
.lh-1-5{
  line-height: 1.5;
}
.z-index-1{
  z-index: 1;
}

.text--dark-blue-1{
  color: #121b50;
}
.text-indent-2em{
  text-indent: 2em;
}
.link--blue,
.link--blue:hover{
  color: #121b50 !important;
}
.btn-gold{
  background: linear-gradient(-90deg, rgb(229, 174, 0) 0%, rgb(249, 228, 67) 32%, rgb(242, 218, 70) 68%, rgb(229, 174, 0) 100%);
  padding-top: 10px;
  font-size: 14px;
}

.btn-gold:focus{
  box-shadow: 0 0 0 0.2rem rgb(229 174 0 / 25%);
}

.img-valuemax-text-sm{
  height: 28px;
}

header{
  background: #fff8e2;
  min-height: 40px;
}

header .contact-lang-header{
  display: flex;
  align-items: center;
  height: 100%;
  justify-content: flex-end;
}

header .contact-lang-header .contact-list {
  display: flex;
  flex-wrap: wrap;
}

header .contact-lang-header .contact-list .contact-item{
  display: flex;
  align-items: flex-end;
  font-size: 12px;
  color: #A1474E;
  margin-right: 10px;
}

header .contact-lang-header .contact-list .contact-item span{
margin-top: 5px;
}

header .img-contacts-icon{
  max-width: 20px;
  max-height: 20px;
  margin-right: 4px;
}

header .lang-wrapper{
  display: flex;
  align-items: center;
}

header .lang-wrapper .btn-lang{
  background: #f0b650;
  color: #A1474E;
  min-width: 80px;
  text-align: center;
  border-radius: 50px;
  font-size: 12px;
  text-decoration: none;
  padding-top: 3px;
  margin-right: 10px;
  transition: background-color .3s;
}
header .lang-wrapper .btn-lang:not(.active):hover{
  background: #f5ce85;
}
header .lang-wrapper .btn-lang.active{
  background: #f8d799;
}

.legality-header{
  max-width: 135px;
}
.legality-header .legality-header-text{
  font-size: 9px;
  margin: 0;
  line-height: 10px;
}
.legality-header .img-ojk-header{
  max-width: 70px;
}

.navbar-expand-lg .navbar-nav .nav-link{
  color: #161e49;
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 14px;
}
.navbar-expand-lg .img-nav-brand{
  max-width: 160px;
}
.navbar-toggler{
  border: 1px solid #f0b650;
}
.navbar-collapse .dropdown-menu{
  padding: 0;
  top: 170%;
  border: none;
}
.navbar-collapse .dropdown-menu .dropdown-item{
  padding-top: 10px;
  color: #161e49;
  font-size: 14px;
}
.navbar-collapse .dropdown-menu .dropdown-item:hover,
.navbar-collapse .dropdown-menu .dropdown-item:focus{
  color: #f0b650;
  background: white;
}
.navbar-collapse .dropdown-menu .dropdown-item:first-of-type{
  border-radius: .25rem .25rem 0 0;
}
.navbar-collapse .dropdown-menu .dropdown-item:last-of-type{
  border-radius: 0 0 .25rem .25rem;
}
.navbar-collapse .dropdown-menu .dropdown-item:not(:last-of-type){
  border-bottom: 1px solid #e4eaff;
}

.navbar-collapse .dropdown-menu .dropdown-item:active{
  background: #f0b650;
  color: white;
}

.navbar-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(240,182,80, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

/* Breadcrumb */
.breadcrumb{
  background: transparent;
  padding: 10px 0;
  font-size: 12px;
  z-index: 1;
  position: relative;
}
.breadcrumb-item+.breadcrumb-item::before{
  content: ">";
}
.breadcrumb-item.active{
  color: #121b50;
}
.breadcrumb-item a{
  color: #8f8f8f;
}
/* END - Breadcrumb */

.img-ribbon-right {
  position: absolute;
  right: 0%;
  top: 0;
  z-index: 0;
  max-width: 350px;
  width: 90%;
}
.img-ribbon-left {
  position: absolute;
  left: 0%;
  bottom: 0;
  z-index: 0;
  max-width: 350px;
  width: 90%;
}

input.form-control,
textarea.form-control{
  border: 1px solid #c48e31;
  padding-top: 10px;
  font-size: 14px;
}
input.form-control::placeholder,
textarea.form-control::placeholder{
  font-style: italic;
}

input.form-control:focus{
  box-shadow: 0 0 0 0.2rem rgb(196 142 49 / 25%) !important;
  border-color: #c48e31;
}
textarea.form-control:focus{
  box-shadow: 0 0 0 0.2rem rgb(196 142 49 / 25%) !important;
}


/* Floating button */
.float-button-group{
  position: fixed;
  bottom: 160px;
  right: 8px;
  z-index: 1;
}
.float-button-group .float-button-wrapper{
  position: relative;
  height: 70px;
  display:flex;
  align-items: center;
}
.float-button-group .float-button{
  width: 65px;
  height: 65px;
  position: absolute;
  right: 0;
  background: #efaa82;
  border-radius: 100px;
  -webkit-box-shadow: 2px 10px 18px -5px rgba(0,0,0,0.28);
  -moz-box-shadow: 2px 10px 18px -5px rgba(0,0,0,0.28);
  box-shadow: 2px 10px 18px -5px rgba(0,0,0,0.28);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  transition: right .3s;
}
.float-button-group .float-button-wrapper .img-float-button{
  width: 30px;
  height: 30px;
}
.float-button-group .float-button-apply{
  margin-bottom: 30px;
}
.float-button-group .float-button-apply:hover .float-button{
  right: 85px;
}
.float-button-group .float-button-message:hover .float-button{
  right: 170px;
}
.float-button-group.en .float-button-apply:hover .float-button{
  right: 115px;
}
.float-button-group.en .float-button-message:hover .float-button{
  right: 125px;
}
.float-button-group .float-button-wrapper .float-button-content{
  text-align: end;
  background: white;
  padding: 9px 15px 5px 15px;
  border: 1px solid #efaa82;
  border-radius: 50px;
  overflow: hidden;
  white-space: nowrap;
  right: 10px;
  position: relative;
  margin-right: 0;
  margin-left: auto;
  opacity: 0;
  transition: opacity .3s, width .3s;
  width: 0;

}
.float-button-group .float-button-apply:hover .float-button-content{
  width: 110px;
  opacity: 1;
}
.float-button-group .float-button-message:hover .float-button-content{
  width: 190px;
  opacity: 1;
}
.float-button-group.en .float-button-apply:hover .float-button-content{
  width: 130px;
  opacity: 1;
}
.float-button-group.en .float-button-message:hover .float-button-content{
  width: 140px;
  opacity: 1;
}
.float-button-group .float-button-content a{
  color: #121b50;
} 

/* END - Floating button */

/* Banner pengajuan */

.banner-pengajuan{
  background: url(../img/bg-banner-pengajuan.jpg);
  background-size: cover;
  border-radius: 10px;
  margin-top: 40px;
  position: relative;
}

.banner-pengajuan .img-pengajuan{
  position: absolute;
  bottom: 0;
  left: 15px;
  max-width: 170px;
  border-bottom-left-radius: 10px;
}

.banner-pengajuan .banner-pengajuan-content{
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding: 20px 20px 20px 0;
}

.banner-pengajuan .banner-pengajuan-content .btn-gold{
  min-width: 250px;
  position: relative;
}
.banner-pengajuan .banner-pengajuan-content .btn-gold:after{
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 8px;
  border-color: transparent transparent transparent #1f2c61;
  position: absolute;
  content: "";
  top: 50%;
  transform: translateY(-50%);
  right: 20px;
}

/* END - Banner pengajuan */

.numbering-blue-list{
  counter-reset: numbering-blue;
}
.numbering-blue-list li{
  counter-increment: numbering-blue;
  position: relative;
  list-style: none;
}
.numbering-blue-list li::before{
  content: counter(numbering-blue);
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  position: absolute;
  top: 0;
  left: -30px;
  background: #121b50;
  width: 23px;
  height: 22px;
  border-radius: 22px;
  text-align: center;
  padding-top: 4px;
}

footer{
  background: linear-gradient(-90deg, rgb(231, 204, 143) 0%, rgb(192, 167, 111) 100%);
  padding-top: 20px;
  border-top: 2px solid #c48e31;
}

footer .img-company-logo{
  width: 260px;
  margin-bottom: 5px;
}
footer .footer-item{
  display: flex;
  align-items: flex-start;
  margin-top: 10px;
}
footer .footer-item .footer-item-link{
  font-size: 12px;
  color: #121b50;
}
footer .legality-text-footer{
  width: 90px;
  font-size: 12px;
  font-weight: bold;
}
footer .img-ojk-footer{
  width: 110px
}

footer .social-media-list{
  display: flex;
  justify-content: flex-end;
  z-index: 11;
}

footer .social-media-list .img-socmed{
  width: 31px;
  height: 31px;
  min-width: 31px;
  min-height: 31px;
  margin-left: 20px;
}

footer .copyright-section{
  margin-top: 20px;
  text-align: center;
  background: #f0b650;
  padding: 9px 0 5px 0;
  font-size: 12px;
}

footer .legality-footer{
  display: flex;
  align-items: center;
  margin-top: 40px;
}

#chat-widget-container{
  z-index: 10 !important;
}
.not-found-container{
  background-color: #f8f3e6;
  text-align: center;
  min-height: calc(100vh - 300px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.pulse-container {
  width: 100px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
}

.pulse-bubble {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #f0b650;
}

.pulse-bubble-1 {
    animation: pulse .4s ease 0s infinite alternate;
}
.pulse-bubble-2 {
    animation: pulse .4s ease .2s infinite alternate;
}
.pulse-bubble-3 {
    animation: pulse .4s ease .4s infinite alternate;
}

@keyframes pulse {
  from {
    opacity: 1;
    transform: scale(1);
  }
  to {
    opacity: .25;
    transform: scale(.75);
  }
}
@media (max-width: 991px){
  .pulse-container {
    top: 50%;
  }
}

@media(max-width: 991px){
  .navbar-collapse .dropdown-menu{
    padding: 4px 15px;
  }
  footer .social-media-list{
    justify-content: flex-start;
  }
  footer .social-media-list .img-socmed{
    margin-right: 20px;
    margin-left: 0px;
  }
}

@media(max-width: 768px){
  header .contact-lang-header{
    padding-top: 10px;
    justify-content: center;
    flex-wrap: wrap;
  }
  header .contact-lang-header .contact-list {
    margin-top: 10px;
  }
  .lang-wrapper{
    margin-top: 10px;
  }
  .breadcrumb{
    padding: 50px 0 10px 0;
  }
  .banner-pengajuan .banner-pengajuan-content{
    flex-direction: column;
  }
}

@media(max-width: 576px){
  .banner-pengajuan .banner-pengajuan-content{
    padding: 20px;
  }
  .banner-pengajuan .img-pengajuan{ 
    bottom: 0;
    top: 23px;
  }
  footer .legality-footer{
    margin-top: 5px;
    margin-bottom: 20px;
  }
}