/*scroll*/

::-webkit-scrollbar {width:6px;}

::-webkit-scrollbar {height:2px;}

::-webkit-scrollbar-track { background: #e8e8e8;}

::-webkit-scrollbar-thumb:hover {background: #0e2b3e;}

::-webkit-scrollbar-thumb {

  background-image: -webkit-linear-gradient(45deg, #48B6FF, #15415E);

  background-image: -o-linear-gradient(45deg, #48B6FF, #15415E);

  background-image: linear-gradient(45deg, #48B6FF, #15415E);}



  .alert{

    display: none;

  }



  /*loader*/

  #loading {

    display: block;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 100;

    width: 100vw;

    height: 100vh;

    background-color: black;

    /*background-image: url("images/logo-enamor.png");*/

    background-repeat: no-repeat;

    background-position: center;

  }



/*#loading img{

	width: 400px;

	position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    }*/



    /* This only changes this particular animation duration */

    .animate__animated.animate__bounce {

      --animate-duration: 4s;

    }

    /*scrollup*/

    #scrollTop{

     color: #000;

     background-color: #000;

     position: fixed; 

     cursor: pointer;

     border-radius: 10px;

     bottom: 10px; 

     right: 20px; 

     padding: 5px;

     z-index: 11300;

     visibility: hidden;

     opacity: 0;

   }

   #scrollTop span{

     font-size: 21px;

     font-weight: bold;

     transition: 1s;

   }



   #scrollTop span:hover{

     font-size: 26px;

   }



   #liveChat{

    width: 80px;

    height: 80px;

    color: #15415E;

    background-color: #ffffff;

    position: fixed; 

    cursor: pointer;

    border-radius: 50%;

    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !important;

    bottom: 20px; 

    right: 20px; 

    padding: 10px;

    z-index: 11300;

  /*visibility: hidden;

  opacity: 0;*/

}

#liveChat span{

  font-size: 22px;

  font-weight: bold;

  transition: 1s;

}



#liveChat span:hover{

  font-size: 26px;

}



#liveChat-form{

  width: 30%;

  height: 350px;

  color: #15415E;

  background-color: #ffffff;

  position: fixed; 

  cursor: pointer;

  border-radius: 10px;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !important;

  bottom: 80px; 

  right: 20px; 

  z-index: 11301;

  visibility: hidden;

  opacity: 0; 

}

.liveChat-header{

  height: 70px;

}

.liveChat-header-body{

  background-color: #15415E;

  /*position: absolute;*/

  border-radius: 10px 10px 0 0;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

  width: 100%;

  color: white;

  /*top: 0;*/

  padding: 10px;

}

.liveChat-body{

  height: 200px;

  padding: 10px;

  overflow-y: scroll;

  overflow-x: hidden;

}



.liveChat-body .liveChat-card-right{

  width: auto;

  max-width: 80%;

  background-color: #48b6ff;

  border-radius: 10px;

  float: right;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

}



.liveChat-body .liveChat-card-left{

  width: auto;

  max-width: 80%;

  background-color: white;

  border-radius: 10px;

  float: left;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

}



.liveChat-body .cardbody{

  -webkit-box-flex: 1;

  -ms-flex: 1 1 auto;

  flex: 1 1 auto;

  padding: .7rem;

}





.liveChat-footer{

  position: absolute;

  width: 100%;

  padding: 10px;

  bottom: 0;

  border-radius: 0 0 10px 10px;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

}

.liveChat-footer span{

  font-size: 24px;

  margin-top: 8px;

}



.liveChat-footer .icon-send{

  padding-left: 10px;

}



.liveChat-footer input{

  border-radius: 10px;

}



#body-content{

	display: none;

}

/*loader*/



/*modal*/

.modal-side-content{

  padding-top: 70%;

  /*padding-bottom: 100%;*/

  text-align: center;

}

.modal-side-content h4{

	color: #ffffff;

	font-family: 'Roboto Medium';

  font-size: 27px;

}

.title-border:after{

  content: '';

  display: block;

  width: 70px;

  margin-top: 10px;

  height: 2.5px;

  background: #48B6FF;

}

.modal-side-content img{

  height: 80px;

  margin-bottom: 30px;

}

.modal-side-content p{

	font-size: 15px;

	color: #ffffff;

	font-family: 'Karla Regular';

}

.modal-form{

	padding: 50px 10px;
  background: #000;

}

.modal-form .head-modal{

	padding-bottom: 30px;

}

.modal-form .head-modal h4{

	color: #15415E;

	font-family: 'Roboto Medium';	

}



.modal-side-content h4{

  padding-bottom: 10px;

}

.modal-side-content p{

  padding-bottom: 30px;

}



.input-modal{

	padding-bottom: 10px;

}

.input-modal label{

	font-family: 'Karla Medium';

}

.input-modal input{

  height: 42px;

  font-size: 14px;

  border: 1px solid #e6e6e6;

  border-radius: 8px;

}



.input-modal input::placeholder{

  color: #cccccc;

}





.close{

	font-size: 20px;

  color: #fff;

  cursor: pointer;

  padding-top: 5px;

}

/*modal*/



/*navbar*/

.navbar-brand img{

	width: 150px;

}

.navbar-collapse .nav-space li{

  font-family: "Karla Regular";

  font-size: 20px;

  font-weight: 200;

  padding-left: 20px;

}



.navbar-style .active .nav-link{

	font-family: "Karla Medium";

	color: #e2b820 !important;

}

.navbar-style .nav-link::after {

  content: '';

  display: block;

  width: 0;

  height: 2.5px;

  background: #FFD214;

  transition: width .3s;

}

.navbar-style .active .nav-link::after {

  content: '';

  display: block;

  width: 30px;

  height: 2.5px;

  background: #e2b820;

}



.navbar-style .nav-link:hover::after {

  width: 100%;

}

.navbar-style .nav-link{

  color: #9e9e9e !important;


}

.navbar-style .nav-text-sign{

	font-family: "Karla Regular";

	color: white;

	font-size: 18px;

  font-weight: 500;	

  padding-right: 30px;

}



.navbar-style-scroll .active .nav-link{

  font-family: "Karla Medium";

  color: #FFD214 !important;

}

.navbar-style-scroll .nav-link::after {

  content: '';

  display: block;

  width: 0;

  height: 2.5px;

  background: #e2b820;

  transition: width .3s;

}

.navbar-style-scroll .active .nav-link::after {

  content: '';

  display: block;

  width: 30px;

  height: 2.5px;

  background: #e2b820;

}



.navbar-style-scroll .nav-link:hover::after {

  width: 100%;

}

.navbar-style-scroll .nav-link{

  color: #FFD214 !important;

}

.navbar-style-scroll .nav-text-sign{

  font-family: "Karla Regular";

  color: #FFD214;

  font-size: 18px;

  font-weight: 500; 

  padding-right: 30px;

}



#navbar {

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !important;

  position: fixed;

  z-index: 1030;

  width: 100%;	

  display: block;

  transition: top 0.5s;

}

.modal-side-content-login{

  padding-top: 40% !important;

}

.nav-menu-mobile ul li{

  background-color: #021D54;

  font-family: 'Karla Regular';

  font-size: 15px;

  border-bottom: 1px solid #fff;

  padding: 15px;

}

.margin-nav{

  padding-top: 80px;

}

.nav-menu-mobile ul li:hover{

  color: #15415E;

  background-color: #fff;

}



.nav-menu-mobile ul .active{

  color: #15415E;

  background-color: #fff;

}



.navbar-custom{

  margin-top: 0;

  background: #fff;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

}



.dropdown {

  position: relative;

  display: inline-block;

}



.dropdown-content {

  visibility: hidden;

  opacity: 0;

  position: absolute;

  background-color: #ffffff;

  border-top: 3px solid #8D5A38;

  min-width: 165px;

  margin-top: 15px;

  right: 0;

  margin-right: 2rem;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

  z-index: 1;

  transition: all 0.2s ease;

}



.dropdown-content a {

  color: black;

  padding: 12px 16px;

  text-decoration: none;

  display: block;



}



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



.dropdown:hover .dropdown-content {visibility: visible; opacity: 1;}



#search_1 {

 {

  color: #000;

}

}

#search_input_box {

  position: fixed;

  left: 50%;

  -webkit-transform: translateX(-50%);

  -moz-transform: translateX(-50%);

  -ms-transform: translateX(-50%);

  -o-transform: translateX(-50%);

  transform: translateX(-50%);

  width: 100%;

  max-width: 1110px;

  z-index: 999;

  text-align: center;

  background: #fff;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

  ::placeholder {

    color: #000;

  }



  @media (max-width: 768px) {

    margin-top: 15px;

  }



}

#search_input_box .form-control {

  background: #fff;

  border: 0;

  color: #000;

  font-weight: 400;

  font-size: 15px;

  padding: 0;

}

#search_input_box .btn {

  width: 0;

  height: 0;

  padding: 0;

  border: 0;

}

#search_input_box .ti-close {

  color: #000;

  font-weight: 600;

  cursor: pointer;

  padding: 10px;

  padding-right: 0;

}

.search-inner {

  padding: 5px 5px;

}

.form-control:focus {

  box-shadow: none;

}

.active_color {

  color: $btn_hover !important;

}



#side-drawer {

  height: 100vh;

  width: 276px;  /*Ideal width for sidebar accdg to https://forums.envato.com/t/standard-sidebar-width/75633*/

  top: 0;

  left: -436px;

  z-index: 1032;  /*z-index of standard bootstrap navbar is 1030 + 1 offset due to side-drawer-void*/

  transition: left 0.25s ease;

}



#side-drawer-void {

  height: 100%;

  width: 100%;

  top: 0;

  z-index: 1031;  /*z-index of standard bootstrap navbar is 1030*/

  background: rgba(0,0,0,.6);

}



/*section highlight*/

.sec-highlight{

  padding-top: 80px;

  margin-bottom: 10px;

}

.sec-highlight img{

  width: 100%;

  height: 89vh;

  object-fit: cover;

}

.img-highlight{

  position: absolute;

  top: 180px;

  /* bottom: 0; */

  right: -20px;

  color: white;

}

.img-highlight img{

  height: 400px;

}

.title-highlight {

	position: absolute;

	top: 220px;

	bottom: 0;

	color: white;

	padding-left: 20px;

	padding-right: 20px;

}



.padd-text-high{

  padding-bottom: 20px;

}



.title-highlight h2{

  color: white;

  font-size: 2.4rem;

  font-family: 'Roboto Medium';

  line-height: inherit;

}



.title-highlight h4{

  color: #15415E;

  font-family: 'Roboto Medium';

  font-size: 30px;

}



.title-highlight .b-text-high{

  color: #15415E;

}



.title-highlight p{

	font-size: 16px;

  font-family: 'Karla Regular';

  line-height: 25px;

  padding-bottom: 20px;

}

/*section highlight*/



/*section about product*/

.sec-about-product{

	margin-bottom: 0px;

  padding-top: 0px;

  background-image: url('../assets/images/yt4.png');

  background-size: 100%;

  background-repeat: no-repeat;


}

.iframe-yt{

  width: 480px;

  height: 345px;

  border-radius: 0px 50px;

  box-shadow: #FFD700  -18px 18px 1px 1px; 

  margin-left: 18px;

}

.img-about-product{

  height: 380px;

}



.padd-title-about{

  padding-top: 10px;

  padding-bottom: 30px;

}



.title-about-product{

  padding-right: 20px;

}



.title-about-product p{

	font-size: 17px;

  font-family: 'Karla Regular';

  line-height: 28px;

}

/*section about product*/



/*section desc product*/

.con-desc-product{

	background: url('images/Produk.png') center;

	background-repeat: no-repeat;

	background-size: contain;

}

.sec-desc-product{

  padding-top: 100px;

  margin-bottom: 100px;

}

.title-desc-product{

  padding-bottom: 60px;

}

.con-desc-product img{

  width: 45px;

}



.decs-ul-left ul li h4{

	font-family: 'Roboto Medium';

  font-size: 20px;

}



.decs-ul-left ul li p{

	font-size: 15px;

  margin-right: 60px;

  font-family: 'Karla Regular';

  line-height: 18px;

}



.decs-ul-left{

	text-align: right;

}

.decs-ul-left li{

  text-align: right;

  list-style-type: none;

}



.decs-ul-right ul li h4{

	font-family: 'Roboto Medium';

  font-size: 20px;

}



.decs-ul-right ul li p{

	font-size: 15px;

  margin-left: 60px;

  font-family: 'Karla Regular';

  line-height: 18px;

}



.decs-ul-right{

	list-style-type: none;

}



.icon-desc img{

	margin-top: 1rem;

}



.sec-product-mobile{

  padding-bottom: 50px;

  padding-top: 80px;

}



.product-mobile-list li p{

  margin-left: 70px;

}

.desc-text-product{

  /*padding-left: 60px;*/

}

.desc-text-product p{

  margin-top: 20px;

  font-size: 17px;

  font-family: 'Karla Regular';

}

.subdesc-text-product p{

  margin-top: 20px;

  font-size: 17px;

  font-family: 'Karla Regular';

}

/*section desc product*/



/*section banner*/

.sec-banner{

	margin-bottom: 100px;

}



.carousel-wrap {

	width: 100%;

	margin: auto;

	position: relative;

}



body .owl-nav{

	position: initial;

}



body .owl-nav div{

	position: absolute;

	top: 45%;

	border:1px solid transparent;

	width: 40px;

	height: 40px;

	border-radius: 50%;

}



body .owl-prev{

	left: 30px;

	display: flex;

	font-size: 20px !important;

  color: black !important;

  background: rgb(51, 51, 51, 0.3) !important;

  border-radius: 50% !important;

}



body .owl-next{

	right: 30px;

	display: flex;

	font-size: 20px !important;

  color: black !important;

  background: rgb(51, 51, 51, 0.3) !important;

  border-radius: 50% !important;

}

/*section banner*/



/*section footer*/

.footer{

	background-color: #000;

}

.sec-footer{

	padding-top: 100px;

}



.footer-top{

  padding-bottom: 60px;

}

.footer-sosmed img{

  width: 40px;

  margin-right: 1rem;

}

.footer-payment img{

  width: 40px;

  margin-right: 1rem;

  background-color: grey;

}



.brand-footer img{

	width: 200px;

}

.brand-footer p{

	color: #ffffff;

	font-family: 'Karla Regular';

	line-height: 28px;

	padding-top: 10px;

	padding-right: 30px;

}

.list-footer h5{

	color: #ffffff;

	font-size: 20px;

	font-family: 'Karla Bold';

	padding-bottom: 10px;

}



.list-footer li{

	color: #ffffff;

	font-size: 16px;

	font-family: 'Karla Regular';

	padding-bottom: 20px;

}

.text-footer{

	color: #ffc107;

	font-size: 16px;

	font-family: 'Karla Regular';

}

.footer-bottom{

  background-color: #000;

  padding: 20px 10px;

}

/*section footer*/



/*business plan*/

/*section highlight*/

.title-highlight-plan a:hover{

  color: #48B6FF;

}

.sec-highlight-plan{

	position: relative;

	height: 89vh;

	background: url('../assets/images/Background1-plan.png');

	background-repeat: no-repeat;

	background-size: cover;

}

.title-highlight-plan{

	position: absolute;

  width: 100%;

  text-align: center;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

.title-highlight-plan h4{

	color: white;

  font-family: 'Roboto Bold';

  font-size: 44px;

  padding-bottom: 20px;



}



.title-highlight-plan span{

  color: white;

  font-size: 20px;

  font-family: 'Karla Medium';

  align-content: center;

}



.title-highlight-plan .active{

	color: #15415E;

}

/*section highlight*/



/*section sponsor bonus*/

.sec-sponsor{

  margin-bottom: 200px;

}

.title-sponsor{

  padding-top: 100px;

  padding-bottom: 50px;

}

.desc-sponsor p{

  font-family: 'Karla Regular';

  padding-bottom: 70px;

}

/*section sponsor bonus*/



/*section pasangan bonus*/

.sec-pasangan{

  margin-bottom: 200px;

}

.sec-pasangan p{

  font-family: 'Karla Regular';

}

/*.sec-pasangan img{

  object-fit: contain;

  height: 400px;

  text-align: center;

  }*/

  .title-pasangan{

    padding-top: 60px;

    padding-bottom: 30px;

  }

  .desc-pasangan p{

    font-family: 'Karla Regular';

    padding-bottom: 70px;

  }

  /*section pasangan bonus*/



  /*section pass up*/

  .sec-passup{

    margin-bottom: 200px;

  }

  .sec-passup img{

    margin-top: 40px;

  }

  .sec-passup .container{

    padding-top: 50px;

    padding-bottom: 50px;

  }

  .sec-passup img{

    object-fit: contain;

    width: 100%;

    height: 400px;

    text-align: center;

  }

  .title-passup{

    padding-top: 60px;

    padding-bottom: 30px;

  }

  .desc-passup p{

    font-family: 'Karla Regular';

    padding-bottom: 70px;

    line-height: 28px;

    font-size: 17px;

  }

  /*section pass up*/



  /*section rank*/

  .sec-rank{

    padding-bottom: 100px;

  }

  .sec-rank h5{

    font-family: 'Karla Medium';

    font-size: 26px;

  }

  .sec-rank p{

    font-family: 'Karla Regular';

    font-size: 20px;

  }

  .sec-rank .content-rank .body-content-rank{

    padding: 20px 60px;

  }

  .sec-rank small{

    font-size: 16px;

  }

  .title-rank{

    padding-bottom: 30px;

  }

  .desc-rank p{

    font-family: 'Karla Regular';

    padding-bottom: 70px;

  }

  /*section rank*/



  /*section reward*/

  .sec-reward{

    /*margin-bottom: 100px;*/

  }

  .sec-reward img{

    object-fit: contain;

    width: 100%;

    height: 260px;

    text-align: center;

  }

  .title-reward{

    padding-top: 30px;

    padding-bottom: 30px;

  }

  .desc-reward p{

    font-family: 'Karla Regular';

    padding-bottom: 70px;

  }

  /*section reward*/



  /*section product-list*/

  .sec-product-list{

    padding-bottom: 100px;

  }

  .sec-product-list .mar-product-list{

    margin-top: 70px;

  }

  .img-product-list img{

    width: 100%;

    height: 120px;

    object-fit: contain;

    text-align: center;

  }

  .text-product-list{

    text-align: center;

    line-height: 20px;

    font-size: 18px;

    margin-top: 20px;

    font-family: 'Karla Regular';

  }



  .text-product-list h6{

    font-family: 'Karla Medium';

  }



  /*section product-list*/



  /*section price*/

  .sec-price{

    margin-bottom: 200px;

    margin-top: 100px;

  }

  .card-price{

    border: 1px solid rgba(0,0,0,.180);

    border-radius: 10px;

    /*transition: border .7s;*/

  }

  .card-price.active{

    border: 3px solid #054cbd;

  }

  .card-price.active button::before{

    font-family: "themify";

    content: "\e64d";

    display: inline-block;

    margin-right: 5px;

  }

  .card-price:hover{

    border: 3px solid #054cbd;

  }



  .card-price img{

    width: 120px;

    padding-top: 20px;

    margin: auto;

  }

  .card-price h5{

    font-size: 20px;

    font-family: 'Karla Medium';

  }

  .card-price p{

    font-size: 18px;

    font-family: 'Karla Regular';

  }

  .card-price .high-price{

    font-family: 'Karla Medium';

    font-size: 22px;

  }

  .title-price{

    padding-bottom: 30px;

  }

  .thumb-price{

    position: relative;

  }

  .thumb-price:hover{

    border-radius: 10px;

    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

  }

  .thumb-price .thumb-body-price{

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

  }



  .thumb-body-price .judul-price{

    color: white;

    font-size: 35px;

    font-family: 'Karla Medium';

    padding-top: 50px;

  }

  .thumb-price .desc-price{

    padding-top: 100px;

    font-family: 'Karla Regular';

    font-size: 20px;

  }

  .container-price{

    float: left;

    position: relative;

    left: 50%;

  }



  .body-price{

    float: left;

    text-align: left;

    position: relative;

    left: -50%;

  }



  .thumb-price .desc-price label{

    padding-top: 30px;

    padding-bottom: 30px;

    font-size: 35px;

    font-family: 'Karla Medium';

  }

  /*section price*/



  /*business plan*/



  /*generall*/

  .text-title-small{

    color: #17a2b8;

    font-family: 'Roboto Regular';

    font-size: 30px;

  }



  .text-title{

    color: #FFD700;

    font-family: 'Roboto Bold';

    font-size: 2rem;

  }

  /*generall*/



  /*section sertifikat*/

  .sec-sertifikat{

    background: url('../assets/images/bfit1.png');

    background-size: 100%;

    background-repeat: repeat;

    padding-top: 50px;

    padding-bottom: 50px;

    /*margin-bottom: 50px;*/

  }

  .content-sertifikat{

    padding-top: 20px;

  }

  .content-sertifikat .card-sertifikat{

    top: 0;

    transition: all 3s cubic-bezier(0.815, 0.005, 0.18, 1.005);

  }

  .content-sertifikat .card-sertifikat:hover{

  /*background-image: -webkit-linear-gradient(45deg, #008ae6, #48B6FF);

  background-image: -o-linear-gradient(45deg, #008ae6, #48B6FF);

  background-image: linear-gradient(45deg, #008ae6, #48B6FF);

  color: white !important;*/

  top: -10px;

}



.card-sertifikat .card-body{

  padding: 20px 20px !important;
  background: linear-gradient(90deg, #DEA50D 0%, #FFD214 100%);
  /*background-color: #DEA50D; 
  */


}

.card-sertifikat{

  width: 90%;

  /*box-shadow: #d9d9d9 1px 2px 7px 2px;*/

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !important;

  border-radius: 8px;

  border: none;

}

.card-sertifikat h4{

  padding-top: 20px;

  padding-bottom: 20px;

  text-align: center;

  color: #ffffff;

}

.card-sertifikat p{

  font-family: 'Karla Regular';

  line-height: 24px;

}

/*.content-sertifikat .coloum-sertifikat{

  padding: 40px;

  }*/



  .content-sertifikat .margin-sertifikat{

    margin-top: 40px;

  }

  /*section sertifikat*/



  /*section calculation*/

  .sec-calculation{

    /*background: url('../assets/images/Background2.jpg');*/

    background-size: 100%;

    margin-bottom: 100px;

  }

  .con-calculation{

    padding-top: 70px;

    padding-bottom: 30px;

  }



  .title-calculation{

    padding-bottom: 60px;

  }

  .content-calculation{

    cursor: pointer;

    padding: 0px 40px;

  }

  .content-calculation p{

    color: #282828;

    font-size: 16px;

    height: 150px;

    font-family: 'Karla Regular';

    overflow: hidden;

    height: 200px;

  }



  .content-calculation h5{

    padding-top: 10px;

    color: #282828;

    font-size: 20px;

    font-family: 'Karla Medium';

  }



  /*section calculation*/



  /*section info*/

  .sec-info{

    padding-top: 100px;

    margin-bottom: 100px;

    }.sec-info .title-info{

      padding-bottom: 30px;

    }

    .owl-carousel-info .owl-item{

      cursor: pointer;

      padding: 10px;

    }

    .owl-carousel-info .owl-item img{

      height: 200px;

      object-fit: cover;

      border-radius: 5px 5px 0px 0px;

    }



    .card-info::after{

      content: '';

      display: block;

      width: 0px;

      margin-top: 10px;

      height: 3.5px;

      transition: width .7s;

      background: #48B6FF;

  /*background-image: -webkit-linear-gradient(45deg, #48B6FF, #15415E);

  background-image: -o-linear-gradient(45deg, #48B6FF, #15415E);

  background-image: linear-gradient(45deg, #48B6FF, #15415E);*/

}



.card-info:hover::after {

  width: 100%;

}





/* [1] The container */

.img-hover {

  overflow: hidden; /* [1.2] Hide the overflowing of child elements */

}



/* [2] Transition property for smooth transformation of images */

.img-hover img {

  transition: transform .5s ease;

}



/* [3] Finally, transforming the image when container gets hovered */

.img-hover:hover img {

  transform: scale(1.5);

}



.owl-carousel-info .owl-item h5{

  font-family: 'Karla Medium';

  font-size: 18px;

  line-height: 24px;

}

.owl-carousel-info .owl-item p{

  font-family: 'Karla Light';

  /*font-size: 14px;*/

}

.owl-carousel-info .card-body{

  padding: 5px;

}

.owl-carousel-info .owl-item a{

  margin-top: 10px;

  float: right;

  color: #48B6FF;

  font-family: 'Karla Regular';

}

.owl-carousel-info .card{

  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%);

  border: none;

  border-radius: 5px;

}

.owl-banner .owl-stage-outer{

  z-index: -1;

}

.owl-banner .owl-controls{

  z-index: 999;

  margin-top: -50px;

}

.owl-banner .owl-controls .owl-dots .owl-dot.active span{

  background: #15415E !important;

}

.owl-theme .owl-dots .owl-dot span{

  width: 12px;

  height: 12px;

}

.owl-theme .owl-dots .owl-dot.active span{

  background: #48B6FF !important;

  width: 12px;

  height: 12px;

}



.owl-carousel-testi .owl-dots .owl-dot.active span{

  background: #15415E !important;

  /*width: 12px;

  height: 12px;*/

}

.owl-carousel-testi .owl-controls{

  margin-top: 50px;

}

/*section info*/



/*section variant product*/

.sec-variant-produk{

  background: url('../assets/images/bfit1.png');

  background-size: 100%;

  background-repeat: no-repeat;

  padding-top: 100px;

  /*margin-top: 10px;*/

  /*margin-bottom: 100px;*/

}

.sec-3{

  background: url('../assets/images/sec-3a.png');

  background-size: 100%;

  background-repeat: no-repeat;

  /*padding-top: 100px;
  */
  /*margin-top: 10px;*/

  /*margin-bottom: 100px;*/

}


.title-variant-produk{

  padding-bottom: 40px;

  padding-top: 60px;

}

.footer-variant-produk{

  text-align: center;

  padding: 10px 0px;

}

.footer-variant-produk button{

  padding: 10px 20px;

}

.content-variant-produk h5{

  font-family: 'Karla Medium';

  font-size: 20px;

  padding-bottom: 10px;

}



.content-variant-produk .card{

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !important;

  border-radius: 10px;

  cursor: pointer;

  top: 0;

  transition: top 1.2s;

}





.content-variant-produk .card:hover {

  top: -10px;

}



.content-variant-produk .card-body{

  /*padding-top: 40px;

  padding-bottom: 40px;*/

}

.content-variant-produk .card-desc{

  height: 140px;

}



.content-variant-produk p{

  font-family: 'Karla Regular';

  /*padding-bottom: 10px;*/

}

.content-variant-produk h4{

  font-family: 'Roboto Medium';

  font-size: 22px;

  color: #d91616;

}

/*section variant product*/



/*section fact*/

.sec-facts{

  padding-top: 100px;

  padding-bottom: 100px;

  margin-bottom: 100px;

}

.sec-facts .img-about-product{

  /*height: 450px;*/

}

.sec-facts .img-fact{

  width: 100%;

  height: 250px;

  object-fit: contain;

  object-position: left;

}

.padd-facts{

  padding-bottom: 40px;

  padding-top: 20px;

}

.content-facts h5{

  font-family: 'Karla Medium';

}

.content-facts p{

  font-family: 'Karla Regular';

}

.title-facts p{

  font-size: 17px;

  font-family: 'Karla Regular';

  line-height: 28px;

}

/*section fact*/



/*section petunjuk*/

.sec-petunjuk{

  text-align: center;

  padding-top: 100px;

  margin-bottom: 100px;

}



.sec-petunjuk .img-petunjuk img{

  width: 10rem;

}

.sec-petunjuk .text-petunjuk{

  margin-top: 10px;

}

.sec-petunjuk .text-petunjuk h6{

  font-family: 'Karla Medium';

  font-size: 20px;



}

.sec-petunjuk .text-petunjuk p{

  font-family: 'Karla Regular';

}

.mar-petunjuk .step1{

  width: 7rem;

  position: absolute; 

  right: -50px; 

  top: 90px;

  z-index: 2;

  transition: transform .7s;

}



.mar-petunjuk .step1:hover{

  transform: rotate(20deg);

}



.mar-petunjuk .step2{

  width: 7rem;

  position: absolute;

  right: -80px; 

  bottom: 60px;

  z-index: 2;

  transition: transform .7s;

}

.mar-petunjuk .step2:hover{

  transform: rotate(20deg);

}



/*section petunjuk*/



/*section contact*/

.sec-contact{

  padding-top: 100px;

  margin-bottom: 100px;

}



.sec-contact .title-contact{

  padding-bottom: 40px;

}

.form-contact{

  padding-right: 20px; 

}

.form-contact input{

  background-color: #e6e6e6;

  color: #404040;

  font-family: 'Karla Regular';

  height: 50px;

  margin-bottom: 20px;

  font-size: 18px;

  padding-left: 30px;

}



.form-contact input::placeholder{

  color: #404040;

  font-family: 'Karla Regular';

}



.form-contact textarea{

  background-color: #e6e6e6;

  color: #404040;

  font-family: 'Karla Regular';

  height: 50px;

  margin-bottom: 20px;

  font-size: 18px;

  padding-left: 30px;

  padding-top: 20px;

}



.content-contact p{

  font-family: 'Karla Regular';

  font-size: 18px;

}

.content-contact h6{

  font-family: 'Karla Regular';

  padding-bottom: 10px;

}

/*section contact*/



/*section contact*/

.sec-location{

  padding-top: 100px;

  margin-bottom: 200px;

}



.sec-location .title-location{

  padding-bottom: 40px;

}

/*section location*/



/*section questions*/

.sec-questions{

  padding-top: 100px;

  margin-bottom: 100px;

}



.sec-questions .title-questions{

  padding-bottom: 40px;

}

.sec-questions .card{

  width: 80%; 

  margin: auto;

  border-radius: 15px;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);

}

.sec-questions .card-header{

  background-color: transparent !important; 

  border: none !important;

}



/*section questions*/



/*section modal product*/

.modal-product .img-side img{

  width: 100%;

  height: 450px;

  object-fit: cover;

  border-radius: 4px 0px 0px 4px;

}

.modal-product .content-side{

  padding-top: 20px;

  padding-bottom: 20px;

}

.modal-product .content-side .card-desc p{

  margin-bottom: .4rem;

}

.modal-product .content-side h5{

  font-size: 24px;

  font-family: 'Karla Regular';

}

.modal-product .content-product h5{

  font-size: 1rem;

  font-family: 'Karla Regular'; 

}

.modal-product .content-product p{

  font-size: 12px;

  font-family: 'Karla Regular'; 

}

/*section modal product*/



/*section register*/

.sec-register{

  position: relative;

  /*height: 89vh;*/

  /*background: url('../assets/images/Background1-plan.png');*/

  /*background-repeat: no-repeat;

  background-size: cover;*/

}

.sec-register .container{

  padding: 30px 0px;

}

.sec-register .content-menu-regis{

  width: 100%;

  background-color: black;

  background: url('../assets/images/register.png');

  /*background-repeat: no-repeat;*/

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !important;

  border-radius: .25rem;

  margin-bottom: 10px;

  padding: 20px 20px 0px;

}

.sec-register .content-regis{

  width: 100%;

  background-color: black;

  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !important;

  border-radius: .25rem;

  padding: 40px 20px;

}

.content-regis .title-regis{

  font-family: 'Karla Medium';

  font-size: 22px;

  padding-bottom: 20px;

}

.sec-register .content-regis .tab-padd{

  padding: 0px 60px;
  background-image: url(../assets/images/bgpaket1.png);
  background-repeat: no-repeat;

}

.menu-regis{

  display: flex;

  width: 100%;

  position: relative;

}

.menu-regis .nav-tabs{

  display: table-row;

  width: 100%;

  border-bottom: none !important;

}

.menu-regis .nav-tabs .nav-item{

  display: table-cell;

  text-align: center;

  position: relative;

}

.menu-regis .nav-tabs:before{

  top: 16px;

  bottom: 0;

  position: absolute;

  content: " ";

  width: 100%;

  height: 1px;

  background-color: #ecf3fa;

}

/*.menu-regis .nav-tabs .active{

  background-color: #f4f4f4 !important;

  color: #212529 !important;

  }*/



  .menu-regis .nav-tabs .enabled{

    font-size: 14px;

    display: inline-table;

    background-color: #ffc107;

    color: white;

    padding: 7px 30px;

    border:none;

    border-radius: .25rem;

  }



  .menu-regis .nav-tabs .disabled{

    font-size: 14px;

    display: inline-table;

    background-color: #f4f4f4;

    color: #212529;

    padding: 7px 30px;

    border:none;

    border-radius: .25rem;

    cursor: auto;

  }



  .menu-regis .nav-tabs .nav-item p{

    margin-top: 20px;

    font-family: 'Karla Regular';

    font-size: 16px;

  }

  .content-regis .label-form{

    padding-bottom: 20px;

  }

  .content-regis .label-form h6{

    font-family: 'Karla Medium';

    font-size: 16px; 

  }

  .content-regis .label-form:after{

    content: '';

    display: block;

    width: 30px;

    height: 2.5px;

    background: #48B6FF;

  }

  .content-regis .decs-invoice{

    font-family: 'Karla Regular';

    line-height: 30px;

    font-size: 16px;

  }

  /*section register*/



  .card-img-top{

    border-top-left-radius: 50px;

    border-top-right-radius: 50px;

  }



  button.btn.btn-white.btn-block.sign-in {

    color: #021D54;
    margin-left: 20px

  }



  img.img-fluid.footer-logo {

    right: 1vh;

    position: relative;

    text-align: left;

    display: block;

  }



  a.forget {

   float: right;

   display: block;

   text-align: right;

   margin-top: 1rem;

 }



 @media (min-width:320px) and (max-width:480px) {

  /* section.sec-about-product.view-about.bg-about-aero {

    color: #6D6D6D;

    float:left;

    text-align: left;

    display: block;

  }

  .row.track-aero {

    padding: 0 !important;

    } */



  /* .bg-about-aero {

    background-image : none !important;

    padding: 0;

    background-size: 100%;

    position: relative;

    bottom: 20vw;

    } */



  /* h4.Conthrax.uppercase.run-aero {

    color: #0A35AF;

    display: block;

    } */

  /* h3.Conthrax.uppercase {

    color: white;

    display: block;

    text-align: center;

    margin: 5vh;

    } */

    /* discard */

  }