/*------------------------------------------------------------------
0. Setup Flexbox
1. Header Top
  1.1 Header Menumain
  1.2 Header Language
  1.3 Header User
2. Section Benefit
3. Partner Home
4. Download App Item
5. Price Table
  5.1. Price Table Item
-------------------------------------------------------------------*/
/*------------------------------------------------------------------
[0. Header Top]
*/
.thumb{
  position: relative;
  display: block;
}
.thumb img{
  max-height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.jcarousel img{
  width: 120px;
}
/*------------------------------------------------------------------
[1. Header Top]
[1.1 Header Top - Header Menumain]
*/
.box-header-top .block-header-top{
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  align-items: center;
}
.box-header-top .block-header-top--menumain{

}
.box-header-top .block-header-top--menumain .navbar-collapse{
  padding-left: 5px;
  padding-right: 5px;
}
/*------------------------------------------------------------------
[1.2 Header Top - Header Language]
*/
.box-header-top .block-header-top--language{
  width: 50px;
  position: relative;
  margin: 5px 0px;
  line-height: 27px;
  border-left: 1px solid rgba(255,255,255,.8);
}
.box-header-top .block-header-top--language .current-language{color: #212121;}
.box-header-top .block-header-top--language .current-language:hover,
.box-header-top .block-header-top--language .current-language:focus{
  text-decoration: none;
}
.box-header-top .block-header-top--language .current-language::after{
  content: '\f107';
  font-family:"FontAwesome";
  font-weight: normal;
  padding-left: 5px;
  -webkit-transition: 300ms ease-in-out;
  -o-transition: 300ms ease-in-out;
  transition: 300ms ease-in-out;
}
.box-header-top .block-header-top--language .current-language.active::after{
  content: '\f106';
  font-family:"FontAwesome";
  font-weight: normal;
}
.box-header-top .block-header-top--language .option-select{
  position: absolute;
  right: 0px;
  top: 100%;
  width: 130px;
  background: #fff;
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid #eee;
  -webkit-box-shadow: 0 5px 9px rgba(0,0,0,0.1);
  box-shadow: 0 5px 9px rgba(0,0,0,0.1);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 100ms ease-in-out;
  -o-transition: 100ms ease-in-out;
  transition: 100ms ease-in-out;
  -webkit-transform: translateY(40px);
  -ms-transform: translateY(40px);
  transform: translateY(40px);
}
.box-header-top .block-header-top--language .option-select.open{
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(5px);
  -ms-transform: translateY(5px);
  transform: translateY(5px);
}
.box-header-top .block-header-top--language .option-select ul{
  list-style: none;
  padding-left: 0px;
  margin-bottom: 0px;
}
.box-header-top .block-header-top--language .option-select ul li+li{
  border-top: 1px solid rgba(238,238,238,0.5);
}
.box-header-top .block-header-top--language .option-select ul li a{
  padding: 8px 12px;
  display: block;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  color: #000;
  background: #fff;
  -webkit-transition: all 150ms ease-in-out;
  -o-transition: all 150ms ease-in-out;
  transition: all 150ms ease-in-out;
}
.box-header-top .block-header-top--language .option-select ul li a img{
  margin-right: 0.5rem;
  vertical-align: -6px;
}
.box-header-top .block-header-top--language .option-select ul li a:hover{
  color: #F44336;
  background-color: rgba(238,238,238,0.2);
  text-decoration: none;
}
/*------------------------------------------------------------------
[1.3 Header Top - Header User]
*/
.box-header-top .block-header-top--user{

}
.box-header-top .block-header-top--user ul{
	list-style: none;
	padding-left: 0px;
	margin: 5px 0px;
	text-align: right;
}
.box-header-top .block-header-top--user ul li{
	display: inline-block;
	font-size: 0.875rem;
  font-weight: 500;
}
.box-header-top .block-header-top--user ul li:not(:last-child){margin-right: 0.5rem;}
.box-header-top .block-header-top--user ul li a{
  display: block;
  padding: 4px 12px;
	background: #FFF;
	color: #E12A3B;
  border: 1px solid #E12A3B;
	font-size: 12px;
  font-weight: 400 !important;
	position: relative;
  border-radius: 14px;
	z-index: 2;
  transition: all 0.25s ease;
}
.box-header-top .block-header-top--user ul li a:hover{
  text-decoration: none;
  background: #E12A3B;
  color: #fff;
}
.box-header-top .block-header-top--user ul li a.sign-up{
  background: #E12A3B;
	color: #FFF;
  border: 1px solid #E12A3B;
}
.box-header-top .block-header-top--user ul li a.sign-up:hover{
  filter: brightness(110%);
}
/*------------------------------------------------------------------
[2. Section Benefit]
*/
.section-benefit-wrapper{

}
.section-benefit-wrapper .section-benefit-heading{
  text-align: center;
  font-size: 31px;
  font-weight: 400;
  display: block;
  backface-visibility: hidden;
  font-family: "Roboto Slab", sans-serif;
}
.section-benefit-wrapper .section-benefit-content ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
.section-benefit-wrapper .section-benefit-content ul li.active{
  color: #525252;
  border-color: #525252;
  position: relative;
}
.section-benefit-wrapper .section-benefit-content ul li.active.animation:before{
  content: "";
  width: 3px;
  height: 50px;
  position: absolute;
  background: #E12A3B;
  left: -3px;
  top: 0;
  animation: slideDown 7s linear infinite;
}
@keyframes slideDown {
  0% {
    height: 0;
  }

  100% {
    height: 100%;
  }
}
.section-benefit-wrapper .section-benefit-content ul li{
  border-left: 3px solid #9D9D9D;
  padding-left: 30px;
  color: #9D9D9D;
  margin-bottom: 30px;
  cursor: pointer;
}
.section-benefit-wrapper .section-benefit-content ul li h3{
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
  color: inherit;
}
.section-benefit-wrapper .section-benefit-content ul li p{
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 0;
  line-height: 22px;
}
.section-benefit-wrapper .section-benefit-content .tab-content .tab-pane .thumb {
  padding-bottom: 70%;
}
.section-benefit-wrapper .section-benefit-content .tab-content .tab-pane img {
  max-width: 100%;
  margin: auto;
}
/*------------------------------------------------------------------
[2.1 Benefit Shrink Item]
*/
.benefit-shrink-mobile{
  overflow-y: hidden;
  overflow-x: auto;
  padding-bottom: 20px;
}
.benefit-shrink-item{

}
.benefit-shrink-item .thumb{
  padding-bottom: 77%;
  z-index: 2;
}
.benefit-shrink-item .thumb img{
  max-width: 100%;
  margin: auto;
  display: block;
}
.benefit-shrink-item .benefit-shrink-content{
  padding: 20px;
  height: auto;
  border-radius: 15px;
  background: linear-gradient(127.82deg, #525252 40.08%, rgba(255, 255, 255, 0) 90.95%);
  position: relative;
  margin-top: 10px;
}
.benefit-shrink-item .benefit-shrink-content::before{
  content: "";
  width: 99.1%;
  height: 99.3%;
  position: absolute;
  left: 1px;
  border-radius: 15px;
  top: 1px;
  background: #f6f6f6;
  z-index: 1;
}
.benefit-shrink-item .benefit-shrink-content h3,
.benefit-shrink-item .benefit-shrink-content p{
  position: relative;
  z-index: 2;
}
.benefit-shrink-item .benefit-shrink-content h3{
  font-size: 16px;
  font-weight: 500;
  color: #444;
  margin-bottom: 10px;
  margin-top: 0px;
}
.benefit-shrink-item .benefit-shrink-content p{
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  color: #444;
  text-align: justify;
  margin: 0;
}
/*------------------------------------------------------------------
[3. Partner Home]
*/
.box-partner-home-wrapper{
  margin-top: 0px;
}
/*------------------------------------------------------------------
[4. Download App Item]
*/
.download-app-item{

}
.download-app-item .service-name{
  font-size: 18px;
  font-weight: 400;
}
.download-app-item .service-text{
  width: 25%;
  margin: auto;
}
.download-app-item .service-name::after{
  margin-top: 5px;
  margin-bottom: 15px;
}
.download-app-item .row{
  margin-left: -5px;
  margin-right: -5px;
}
.download-app-item .col{
  padding-left: 5px;
  padding-right: 5px;
}
.download-app-item img{
  width: 100%;
  object-fit: cover;
  display: block;
  margin: 0px auto 10px;
}
/*------------------------------------------------------------------
[5. Price Table]
*/
.box-price-table-wrapper{

}
.box-price-table-wrapper .price-table-heading{
  margin-bottom: 50px;
  text-align: center;
}
.box-price-table-wrapper .price-table-heading ul{
  list-style: none;
  padding: 0px;
  margin: 0px;
  display: inline-flex;
  justify-content: center;
  border: 5px solid #ffffff;
  box-shadow: 0px 10px 20px rgba(224, 42, 59, 0.15);
  border-radius: 5px;
  background: #fff;
}
.box-price-table-wrapper .price-table-heading ul>li{}
.box-price-table-wrapper .price-table-heading ul>li>a{
  display: block;
  color: #333;
  padding: 7px 25px;
  cursor: pointer;
  font-weight: 500;
  font-size: 14px;
  border: none;
  background: #fff;
  border-radius: 5px;
  text-transform: capitalize;
  text-decoration: none !important;
  transition: all 0.3s ease-in-out;
}
.box-price-table-wrapper .price-table-heading ul>li.active>a{
  border-color: #E12A3B;
  background-color: #E12A3B;
  color: #fff;
}
/*------------------------------------------------------------------
[5.1 Price Table Item]
*/
.price-table-item{
  --bg-header-background-price-table: #f8a235;
  --bg-header-background-price-table-rgb: 249, 163, 53;
}
.price-table-item .price-table-header{
  min-height: 110px;
}
.price-table-item.table-pro .price-table-header,
.price-table-item.table-pro .price-table-footer{
  --bg-header-background-price-table: #0f7fcb;
  --bg-header-background-price-table-rgb: 15, 127, 203;
}
.price-table-item.table-feature .price-table-header,
.price-table-item.table-feature .price-table-footer{
  --bg-header-background-price-table: #E12A3B;
  --bg-header-background-price-table-rgb: 224, 42, 59;
}
.price-table-header .-header-title{
  position: relative;
  padding: 15px 0px;
  border-radius: 5px 0px 0px 5px;
  background: linear-gradient(to right, var(--bg-header-background-price-table) 5%, rgba(var(--bg-header-background-price-table-rgb), 0.6) 15%, var(--bg-header-background-price-table) 35%);
}
.price-table-header .-header-title::after{
  content: '';
  width: 0;
  height: 0;
  border-top: 25px solid transparent;
  border-bottom: 25px solid transparent;
  border-left: 25px solid var(--bg-header-background-price-table);
  display: block;
  background: #fff;
  position: absolute;
  top: 0px;
  right: 0px;
}
.price-table-header .-header-title h3{
  color: #fff;
  font-size: 18px;
  text-transform: uppercase;
  text-align: center;
  font-weight: 500;
  margin: 0;
}
.price-table-header .-header-price{
  border-bottom: 1px solid #e8e9e8;
  padding: 10px 0;
  font-size: 21px;
  text-align: center;
}
.price-table-content .-heading-group{
  font-weight: 500;
  font-size: 14px;
  height: 30px;
  line-height: 2;
}
.price-table-content ul{
  list-style: none;
  padding: 0px;
  margin: 0px;
}
.price-table-content ul>li{
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 400;
  color: #161111;
  min-height: 32px;
  position: relative;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.price-table-content ul>li.mh-60{
  min-height: 52px;
}
.price-table-content ul>li:nth-child(odd){
  background: #f9fbfa;
}
.price-table-content ul>li>*{
  margin: 0px;
}
.price-table-item.table-feature .price-table-header .-header-title{border-radius: 5px;}
.price-table-item.table-feature .price-table-header .-header-title::after{
  display: none;
}
.price-table-item.table-feature .price-table-header .-header-price{border: none;}
.price-table-item.table-feature .price-table-header ~ .price-table-content ul>li{
  text-align: left;
  padding-left: 0px;
  justify-content: flex-start;
}
.price-table-item.table-feature .price-table-header ~ .price-table-content ul>li::before{
  content: '+';
  width: 30px;
  align-self: flex-start;
  text-align: center;
  font-weight: 600;
}
.price-table-footer{}
.price-table-footer .-footer-choose{
  padding: 15px 0px;
  text-align: center;
}
.price-table-footer .-footer-choose .btn{
  font-size: 12px;
  font-weight: 500;
  padding: 6px 20px;
  border-radius: 5px;
}
.price-table-footer .-footer-choose .btn-choose-plan{
  background: var(--bg-header-background-price-table);
  color: #fff;
  transition: all 0.25s ease;
}
.price-table-footer .-footer-choose .btn-choose-plan:hover{
  filter: brightness(110%);
}
