@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) {
   img {
       image-rendering: -webkit-optimize-contrast !important;
   }
}
@media not all and (min-resolution:.001dpcm) {
   @supports (-webkit-appearance:none) and (stroke-color:transparent) {
       img {
           image-rendering: unset !important;
       }
   }
}


html, body {
   overflow-x: hidden;
   width: 100% !important;
   max-width: 100% !important;
}
body {
   position: relative;
   margin: 0;
   color: #000;
   background: #f5f5f5;
   overflow-x: hidden;
   font: 14px/24px "Helvetica Neue", Helvetica, Arial, sans-serif;
   -webkit-font-smoothing: antialiased;
   -webkit-text-size-adjust: none;
}
.btn-default {
   background: #21409A;
   color: #fff;
}

#pops-modal {
   overflow-y: auto;
   padding: 10px 0;
}
.ui-dialog-titlebar-close {
   background: #d32e2e !important;
   margin-top: -10px;
   border: none !important;
   width: 24px;
   color: transparent !important;
   height: 24px;
   float: right;
   margin-right: -10px;
   position: relative;
   border-radius: 100%;
   text-align: center;
   display: inline-block;
   box-shadow: 0 0 6px #602424;
   cursor: pointer;
}
.ui-button, .ui-button:hover {
   color: transparent;
   background: #d32e2e;
   text-decoration: none;
   border: none;
}
.ui-widget-overlay {
   opacity: 0.8;
}
.ui-button .ui-icon:hover {
   background-image: none;
}
.ui-button .ui-icon {
   background-image: none;
}
.ui-dialog-titlebar-close:after {
   position: absolute;
   content: 'x';
   top: 0px;
   left: 0;
   font-weight: 700;
   right: 0;
   bottom: 0;
   color: #fff;
}
@keyframes gradient {
   0% {
       background-position: 0% 50%;
   }
   50% {
       background-position: 100% 50%;
   }
   100% {
       background-position: 0% 50%;
   }
}
#header {
   display: flex;
   justify-content: space-between;
}
#header .content{
   margin: 10px auto;
}
#header .comm-widget a {
   color: #fff;
   font-size: 14px;
   margin-left: 10px;
   opacity:0.8;
}
#content {
   padding: 0px 0;
   margin: 0 60px;
}
#contact {
   /* margin: 0 60px; */
}
.main {
   overflow: hidden;
   position: relative;
   padding: 50px 0 0px;
   background: linear-gradient(-45deg, #21409A, #193482, #3158c7, #2648ad);
   background-size: 400% 400%;
   animation: gradient 10s ease infinite;
}
.main .content {
    justify-content: space-around;
   align-items: flex-end;
   display: flex;
}


.hero h1 {
   margin-bottom: 20px;
   font-size: 46px;
   font-weight: 900 !important;
}
.hero h2 {
      font-size: 28px;
      margin-bottom: 90px;
}
.teaser {
   padding: 60px 200px;
}

.teaser h3 {
   font-size: 36px;
}
.teaser p {
   font-size: 16px;
   margin: 10px 0;
}
 #ri-grid p {
       color: rgba(255,255,255,1);
}
.tslide p{
   color: rgba(255,255,255,1);
   font-size: 20px;
   margin-left: 0px;
   font-weight: 500;
   text-shadow: 2px 3px 2px rgba(0,0,0,0.2);
}
a {
   color: #000;
}
a:hover {

   text-decoration: underline;
}
#faq {
   float: left;
   width: 100%;
   margin-top: 40px;
   clear: both;
}
#faq .row {
   padding-bottom: 60px;
   padding-top: 0px;
   display: flex;
   align-items: flex-end;
   justify-content: center;
}
.container .content {
   margin-bottom: 0px;
}
#feature {
   padding-top: 100px;
}
.content {
   clear: both;
   width: 1300px;
   margin: 0px auto;
   /* padding-bottom: 0px; */
   /* position: relative; */
}
.slider-container {
   padding-top: 60px;
   margin-top: 100px;
   display: inline-block;
   clear: both;
   background: #fdf3fc;
   padding-bottom: 80px;
}

.main h1, .main h2 {
       margin-top: 0px;
       width: 75%;
      padding-right: 20px;
   color: rgba(255,255,255,0.9);
   font-weight: 500;
}
h1,h2, h3,h4,h5 {font-family: 'Roboto', sans-serif;letter-spacing: -0.4px;}
h1 {
   margin-bottom: 20px;
   margin-top: 30px;
}
.ex-header h3 {
   margin-top: 30px;
   margin-bottom: 20px;
}
h3 {
   font-size:36px;
   margin-bottom: 10px;
   margin-top: 10px;
}
#service h3 {
   font-size: 32px;
   margin-bottom:10px;
}
#service p {
   font-size: 16px;

}
#service li {
   font-size: 14px;
     color: #555;
}
#cms p {
   font-size: 16px;
   text-align: justify
}
@media (min-width: 1500px) {
   .container {
       /* width: 1300px; */
   }
   #footer .flexbox {
       /* min-width: 1340px; */
   }
}
@media (min-width: 1200px) {
   #footer .flexbox {
       /* max-width: 1240px; */
       text-align: center;
   }
}

.container {
   position: relative;
   margin: 0 auto;
   width: 100%;
   padding: 0 60px;
}
.container.white {
   background:#fff;
   display: block;
}
#others .heading {
   margin: 0px 0 40px;
}
#others .content {
   margin-bottom: 0px;
}
.slider-container .heading {
   margin-bottom: 80px;
}
#paket .heading {
   margin: 0px 0 -60px;
}
.heading {
   margin: 0px 0 20px;
   display: flex;
   justify-content: center;
   align-items: center;
}
.heading img {
   margin-top: 28px;
   width: 100px !important;
   height: 100px !important;
}
.heading h3 {
   font-size: 34px;
   margin-top: 30px;
   font-weight: 700;
   margin-bottom: 20px;
   letter-spacing: -1px;
}
.heading h3.title {
   margin-left: 40px;
   text-align: center;
}
.media {
}
.description {
   padding: 30px 0;
}
.description .title {
   font-size: 44px;
   font-weight: 800;
   color: #ba0000;
   line-height: 1.1;
   margin-top: 15px;
   margin-bottom: 20px;
   text-transform: uppercase;
}
.description .title span{
   color: #333;
   display: block;
}
.description .note {
   font-size: 18px;
   width: 70%;
   line-height: 1.6;
   color: #888;
   margin-top: 10px;
   margin-bottom: 25px;
}
.ex-right .description .count {
   font-size: 28px;
   font-weight: 700;
   color: #fac747;
   float: none;
   display: inline-block;
   padding-right: 10px;
}
.ex-right .description .note {
   font-size: 16px;
   width: 100%;
   color: #888;
   margin-top: -10px;
   margin-bottom: 15px;
}
.ex-right .description h5 {
   font-size: 28px;
   font-weight: 700;
   color: #555;
   display: inline-block;
   font-style: italic;
   text-transform: uppercase;
   padding-right: 20px;
}
.description .count {
   font-size: 28px;
   font-weight: 700;
   color: #fac747;
   float: left;
   padding-right: 10px;
}
.description h5 {
   font-size: 25px;
   font-weight: 700;
   color: #444;
   font-style: italic;
   text-transform: uppercase;
   padding-right: 20px;
}
.description .list p {
   font-size: 18px;
   font-weight:400;
   color: #555;
   margin: 5px 0 10px;
   padding-left: 40px;
}
.description .list {
   padding-left: 0px;
}
.fitur {
   display: flex;
   margin-top: 60px;
   margin-bottom: 100px;
   justify-content: center;
}
.ex-left {
   margin-left: 5%;
}
.ex-right {
   margin-right: 5%;
}
.ex-right .ex-5 .description{
   margin-right: -5%;
}
.ex-right .media{
   margin-left: 5%;
}
.extrio {
   display: flex;
   margin: 0 auto;
   padding: 100px 3%;
   width: 100%;
   border-bottom: 1px dashed #ddd;
}
.extrio h4 {
   font-size: 24px;
   font-weight: 700;
   color: #555;
   text-transform: uppercase;
}
.extrio .list p {
   font-size: 18px;
   font-weight:400;
   color: #444;
   margin: 5px 0 10px;
   padding-left: 0px;
}
.extrio .list {
   padding-left: 0px;
}
.extrio .trio {
   display: flex;
}
.extrio .trio .descy{
   padding: 0 20px;
}
.extrio .trio .media{
   width: 160px;
}
.extrio .trio .media img{
   width: 100%;
   height: auto;
   max-width: 140px;
   max-height: 140px;
}
.headoff {
   text-align: center;
   padding-top: 40px;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   margin-bottom: 20px;
}
.headoff img {
   margin-top: 0px;
   margin-right: 30px;
}
.headoff h2 {
   font-size: 50px;
   padding-bottom: 50px;
   border-bottom: 1px dashed #ddd;
   font-weight: 900;
   color: #ba0000;
   margin-bottom: 0px;
   font-family: 'Roboto', sans-serif;
   background: linear-gradient(to right, #940303, #f5951b);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}
.extrio .title {
   font-size: 44px;
   font-weight: 900;
   color: #ba0000;
   margin-bottom: 0px;
   font-family: 'Roboto', sans-serif;
   background: linear-gradient(to right, #940303, #f5951b);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}
.description h4 {
   font-size: 28px;
   font-weight: 700;
   color: #555;
   text-transform: uppercase;
   padding-right: 20px;
}
.description.sale {
   padding-left: 0px;
}
.description.sale p {
   font-size: 18px;
   font-weight:400;
   color: #888;
   margin: 5px 0 10px;
   padding-left: 0px;
}
.description.sale .list {
   padding-left: 0px;
}
.header-phone-numbers {
   text-align: right;
   text-shadow: 1px 1px 5px rgba(0,0,0,0.1);
}
.header-phone-numbers .intro-text {
   color: #ffae00;
}
.header-phone-numbers .intro-text, .header-phone-numbers .select-city-phone-numbers {
   display: inline-block;
   font-size: 0.875em;
   line-height: 1;
   vertical-align: middle;
   letter-spacing: -0.025em;
}
.header-phone-numbers .select-city-phone-numbers {
   max-width: 100%;
   color: #fff;
   background-color: rgba(255,255,255,0.1);
   border: 1px solid rgba(255,255,255,0.3);
   padding-right: 12px;
   text-indent: 0px;
   padding: 2px 4px;
   background-repeat: no-repeat;
}
.header-phone-numbers .select-city-phone-numbers:focus {
   border-color: #f3bc23;
   outline: none;
}
.header-phone-numbers .select-city-phone-numbers::-ms-expand {
   opacity: 0;
}
.header-phone-numbers .select-city-phone-numbers option {
   background-color: #fff;
   color: #000;
}
.header-phone-numbers .phone-number {
   font-weight: 800;
   color: #fff;
   font-size: 1.75em;
   line-height: 1;
   letter-spacing: -0.01em;
   display: block;
}
.sub {
   font-size:20px;
   line-height: 1.4;
}
.showcase {
   display: flex;
   justify-content: space-between;
   text-align: center;
}
.showcase .ikonpart img{
   height: 200px;
   width: auto;
   display: inline-block;
}
.showcase h4 {
   font-size:20px;
   color: #555;
   font-weight:500;
}
.showcase p {
   font-size: 15px;
}
.blog {
   display: flex;
   justify-content: space-between;
}
.blog .head-title {
   font-size: 26px;
   margin: 10px 0;
   color: white;
}
.banner {
   position: relative;
   text-align: center;
}
.banner .desc {
   position: absolute;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}
.banner h2 {
   font-size: 70px;
   width: 400px;
}
.banner .gohere a {
   margin-top: 20px;
   background: #da6905;
   padding: 12px 60px;
   color: rgba(255,255,255,0.8);
   font-size: 16px;
   text-transform: uppercase;
   display: inline-block;
   border-radius: 8px;
}
.banner .gohere a:hover {
   background: #c35e03;
}
.product .head-name {
   font-size: 16px;
   margin: 15px 0 0;
   color: #555;
}
.product p {
   font-size: 16px;
   margin: 10px 0 0;
   color: #555;
   font-style: italic;
}
p {
   font-size: 16px;
   line-height: 1.4;
   color: #000;
   opacity: 0.75;
}

.xi {
   transition: all 0.4s;
   border-radius: 20px;
   font-size: 14px;
   font-weight: 400;
   padding:2px 25px 2px;
}
.daftar > a {
   margin-left: 20px;
}
.carter a {
   top: 5px;
}
.xi-white {
   color: #333;
   background: rgba(255,255,255,1);
   border: 2px solid rgba(255,255,255,1);
}
.xi-default {
   color: #fff;
   border: 2px solid rgba(255,255,255,0.9);
}
.xi:hover {
   opacity: 0.9;
   text-decoration: none;
}
.card {
   border-radius: 10px;
   overflow: hidden;
}
.card img{
   height: auto !important;
}
.faq {
  display: flex;
   margin-top: 30px;
  margin-bottom: 50px;
}
.faq .hero {
   font-size: 60px;
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 20px;
font-family: 'Spline Sans', sans-serif;
}
.faq .heading p {
 padding-right: 40px;

}
.faq .desc {
  width: 100%;
   max-width: 672px;
}

.faq .head h4 {
  font-size: 32px;
}

.latest-review {
   display: grid;
   grid-template-columns: 1fr 1fr;
   grid-gap:3em;
}
.latest-review .col{
   background: #fff;
   width: 100%;
}
.latest-review .category {
   padding:30px;
   color: #999;
}
.latest-review .head-name {
   padding:0 30px 30px;
   font-weight: normal;
   font-size: 26px;
}
.more-review {
   display: grid;
   grid-template-columns: 1fr 1fr;
   grid-gap:2em;
}
.more-review .col{
   display: flex;
   width: 100%;
   margin-top: 4em;
   grid-gap:2em;
}
.more-review .media {
   width: 55%;
   max-width: 110px;
   min-width: 110px;
}
.more-review .media img {
   max-width: 100px;
   min-width: 100px;
}
.more-review .type {
   color: #ba0000;
   font-size: 28px;
   font-weight: 600;
   font-family: 'Barlow Semi Condensed', sans-serif;
}
.more-review .head-title {
   font-size: 18px;
   line-height:1.3;
   padding: 10px 0;
   color: #444;
   font-family: 'Roboto', sans-serif;
   font-weight: normal;
}
.more-review .date {
   color: #888;
   font-size: 14px;
}
:root{
   --width: 100%;
   --height: 100%;
   --border-width: 200px;
   --border-height: 200px;
}
.gallery{
   position:relative;
   height:750px;
   right: 20px;
   left: 0px;
   width:auto;
}
.gallery:after{
   content:'';
}
.gallery img{
   width:var(--width);
   height:var(--height);
}
.clipped-border{
   padding: 2px;
   width:var(--border-width);
   height:var(--border-height);
   max-height:250px;
   max-width:250px;
   height: var(--height);
   width:var(--width);
   transition:transform 0.2s;
   position:absolute;
   cursor:pointer;
}
.clipped-border:nth-child(1){
   top:245px;
   left:30px;
}
.clipped-border:nth-child(2){
   top:460px;
   left:165px;
}
.clipped-border:nth-child(3){
   top:20px;
   left:150px;
}
.clipped-border:nth-child(4){
   top:235px;
   left:285px;
}
.clipped-border:nth-child(5){
   top:10px;
   left:400px;
}
.clipped {
   border-radius: 100%;
   border: 4px solid #f9c462;
}
.clipped-border:hover{
   transform:scale(1.2);
   transition:transform 0.2s;
   z-index:10;
}
.text-intro h1 {
   text-shadow: -2px -3px 0px rgba(255,255,255,0.95);
}
.text-intro ul {
   list-style: none;
   margin: 20px 0 0 0;
   padding: 20px 0;
   border-top: 1px solid rgba(255,255,255, 0.3);
}
.text-intro ul li {
   list-style: bullet;
   padding: 8px 0;
   font-style: italic;
   font-size: 14px;
}




.scrollup {
    width: 50px;
    height: 50px;
    opacity: 0.9;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    display: none;
}


.social-icons {
   padding: 0;
   list-style: none;
   margin: 1em 0;
}
.social-icons li {
   display: inline-block;
   margin: 0.15em;
   position: relative;
   font-size: 1.9em;
}
.social-icons i {
   color: rgb(220 19 106 / 80%);
   position: absolute;
   top: 0.4em;
   left: 0.5em;
   transition: all 265ms ease-out;
}
.social-icons a {
   display: inline-block;
}
.social-icons a:before {
   transform: scale(1);
   -ms-transform: scale(1);
   -webkit-transform: scale(1);
   content: " ";
   width: 52px;
   height: 52px;
   border-radius: 100%;
   display: block;
   background: #fff;
   border: 2px solid rgba(255,255,255,0.8);
   transition: all 265ms ease-out;
}
.social-icons a:hover:before {
   transform: scale(0);
   transition: all 265ms ease-in;
}
.social-icons a:hover i {
   transform: scale(2);
   -ms-transform: scale(2);
   -webkit-transform: scale(2);
   color: #fff;
   transition: all 265ms ease-in;
}
.powered {
   clear: both;
   border-top: 1px solid rgba(255,255,255,0.1);
   padding: 40px 0px 20px;
   width: 100%;
   font-size: 14px;
   display: inline-block;
}
.powered a {
   color: rgba(255,255,255,0.8);
}
.cards {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr 1fr;
   grid-template-rows: 1fr 1fr;
   grid-gap: 2em;
   grid-template-areas: "a a b c" "a a d d";
}
.card {
   width: 100%;
   position: relative;
   transition: all 0.25s ease;
   cursor: pointer;
   font-family: 'Barlow Semi Condensed', sans-serif;
   font-weight: 300;
}
.card:last-child {
   margin-bottom: 0;
}
.card:before {
   height: 0;
   content: "";
   display: block;
   padding-bottom: 47.36%;
}
.card:after {
   position: absolute;
   bottom: 0px;
   left: 0;
   width: 100%;
   height: 23%;
   content: "";
   background: rgba(0,0,0,0.9);
}
.card:nth-child(1) {
   grid-area: a;
}
.card:nth-child(2) {
   grid-area: b;
}
.card:nth-child(3) {
   grid-area: c;
}
.card:nth-child(4) {
   grid-area: d;
}
.card-content {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
.card img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-size: cover;
}
.card-label {
   position: absolute;
   top: .45rem;
   left: .45rem;
   background: #089f8a;
   text-transform: uppercase;
   font-weight: 300;
   font-size: 0.7em;
   color: white;
   padding: 0.5em;
}
.card-title {
   position: absolute;
   left: 1.1em;
   bottom: 1.1em;
   color: #d6dbeb;
   z-index: 5;
   font-size: 1em;
}
#news-slider .card-title {
   font-size: 20px;
   font-weight: 700;
   width: 90%;
}
#news-slider .date {
   font-size: 12px;
   font-weight: normal;
   margin-top: 10px;
}
.card.form {
   position: relative;
}
.card.form:before {
   background: linear-gradient( 60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82 );
}
.card.form:after {
   position: absolute;
   top: .5em;
   left: .5em;
   width: calc(100% - 2em);
   height: calc(100% - 2em);
   content: "";
   background: #252833;
}
.form-title {
   position: absolute;
   top: 25%;
   left: 1rem;
   font-size: 2vw;
   font-weight: 900;
   z-index: 5;
   text-transform: uppercase;
   background: linear-gradient( 60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82 );
   -webkit-text-fill-color: transparent;
   -webkit-background-clip: text;
}
.form-title:before {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 100%;
   height: 100%;
   content: "View More";
   opacity: 0.5;
   filter: blur(10px);
   transition: all .25s ease;
   z-index: 2;
   background: linear-gradient( 60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82 );
   -webkit-text-fill-color: transparent;
   -webkit-background-clip: text;
   transform: translateX(-50%) translateY(-50%);
}
.card:nth-child(2) .card-label {
   background: #ef4e7b;
}
.card:nth-child(3) .card-label {
   background: #1098ad;
}
.card:nth-child(4) .card-label {
   background: #a166ab;
}
.card:hover .form-title:before {
   filter: blur(3px);
   opacity: 0.7;
}
ul.tabs{
   clear: both;
   margin: 40px 0px 0 0;
   padding: 0px;
   list-style: none;
   text-align: center;
   border-bottom: 1px solid #eee;
}
ul.tabs li{
   background: none;
   color: #888;
   font-size: 20px;
   display: inline-block;
   padding: 10px 15px;
   cursor: pointer;
}
ul.tabs li.current{
   padding-bottom: 20px;
   border-bottom: 4px solid orange;
   color: #000;
}
.tab-content{
   display: none;
   padding: 0px;
   text-align: center;
}
.tab-content.current{
   display: inherit;
}
.quote-day .col {
   width: 100%;
   display: flex;
   margin-bottom: 20px;
   flex-direction: row;
   justify-content: center;
}
.quote-day .quote {
   color: #222;
   font-family: 'Cormorant Garamond';
   font-style: italic;
   line-height: 1.5;
   font-weight: 800;
   font-display: swap;
   font-size: 23px;
}
.quote-day .col .media {
   width: 20%;
   padding-right: 20px;
   padding-bottom: 20px;
}
.quote-day .col .media img {
   border-radius: 10px;
   overflow: hidden;
}
.quote-day .col .desc {
   padding-right: 10px;
   margin: 0;
   width: 80%;
   line-height: 1.4;
}
.quote-day .col h4 {
   padding-bottom: 10px;
   margin: 0;
   font-weight: 700;
   font-size: 20px;
   color: #333;
}
.quote-day .col .quote {
   padding-bottom: 20px;
   margin: 0;
}
.quote-day .col .media img {
   width: 300px;
   height: 300px;
}
.quote-day .col .tags {
   color: #888;
   font-size: 13px;
}
.quote-day .col .tags a {
   color: #10a997;
}
.quote-day .quote {
   padding: 0 10px;
}
.quote-day .quote span {
   font-size: 28px;
   padding: 0 5px;
   font-family: 'Cormorant Garamond';
   color: #888;
}
.owl-nav {
   position: absolute;
   right: 0;
   font-size: 35px;
}
.owl-nav .owl-prev span {
   padding: 0 10px !important;
}
.owl-nav .owl-next span {
   padding: 0 10px !important;
}
.slide-container {
   margin-top: -40px;
   padding: 40px 0 20px;
   display: block;
   width: 100%;
   background: #222;
}

#launch {
   display: flex;
   align-items: center;
   justify-content: center;
   align-items: center;
   margin-top: 100px;
   margin-bottom: -100px;
   position: relative;
   overflow: hidden;
   text-align: center;
}
.action {
   padding: 90px 0 10px;
   font-size: 33px;
   font-weight: 800;
   font-family: 'Roboto', sans-serif;
   width: 650px;
   height:700px;
}
.action::before {
   top: 35%;
   left: 47%;
   margin-right: -50%;
   transform: translate(-47%, -50%) ;
   -webkit-transform: translate(-47%, -50%) ;
   -moz-transform: translate(-47%, -50%) ;
   text-align: center;
   position: absolute;
   content: '';
   width: 460px;
   height: 460px;
   border-radius: 100%;
   background: linear-gradient(70deg, #fabd47, #fcf2d8);
   background-size: 100% 100%;
   animation: gradient 8s ease infinite;
}
.action .heading {
   display: block;
}
.call {
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   position: relative;
}
.call h5 {
   font-size: 44px;
   font-weight: 900;
   color: #ba0000;
   margin-bottom: 0px;
   font-family: 'Roboto', sans-serif;
   background: linear-gradient(to right, #7927b2, #fb3182);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}
.call .media img {
   width: 250px;
   height: 250px;
   margin-right: 40px;
}
.action a{
   background: #ba0000;
   padding: 20px 40px;
   border-radius: 10px;
   color: #fff;
   font-size: 18px;
   transition: all 0.4s;
   font-weight: 400;
   border: 2px solid #ba0000;
}
.action a:hover{
   background: #e400b7;
   border: 2px solid #e400b7;
}
.rocket {
   right: 20%;
   position: absolute;
   z-index: 99;
   -webkit-animation: jump 2s ease-in-out infinite;
   animation: jump 2s ease-in-out infinite;
}
@-webkit-keyframes jump {
   0% {
       bottom: 175px;
   }
   50% {
       bottom: 155px;
       right: 19.5%;
   }
   100% {
       bottom: 175px;
   }
}
@keyframes jump {
   0% {
       bottom: 175px;
   }
   50% {
       bottom: 155px;
       right: 19.5%;
   }
   100% {
       bottom: 175px;
   }
}
.rocket-flame {
   height: 184px;
   width: 190px;
   background: url(../../img/icons/rocket-flame.png) no-repeat scroll 0 0;
   background-size: 100% auto;
   opacity: .6;
   z-index: 15;
   position: absolute;
   left: -44px;
   bottom: -40px;
   -webkit-animation: an-flame-main .5s steps(2, start) infinite;
   -moz-animation: an-flame-main .5s steps(2, start) infinite;
   -o-animation: an-flame-main .5s steps(2, start) infinite;
   animation: an-flame-main .5s steps(2, start) infinite;
}
@-webkit-keyframes an-flame-main {
   to {
       background-position-y: 100%;
   }
}
@-moz-keyframes an-flame-main {
   to {
       background-position-y: 100%;
   }
}
@-o-keyframes an-flame-main {
   to {
       background-position-y: 100%;
   }
}
@keyframes an-flame-main {
   to {
       background-position-y: 100%;
   }
}
.stars {
   color: rgba(255,255,255,0.6);
   z-index: -1;
   width: 100%;
   height: 100%;
   transform: rotate(-45deg);
}
.star {
   --star-color: var(--primary-color);
   --star-tail-length: 6em;
   --star-tail-height: 2px;
   --star-width: calc(var(--star-tail-length) / 6);
   --fall-duration: 9s;
   --tail-fade-duration: var(--fall-duration);
   position: absolute;
   top: var(--top-offset);
   left: 0;
   width: var(--star-tail-length);
   height: var(--star-tail-height);
   color: var(--star-color);
   background: linear-gradient(45deg, currentColor, transparent);
   border-radius: 50%;
   filter: drop-shadow(0 0 6px currentColor);
   transform: translate3d(104em, 0, 0);
   animation: fall var(--fall-duration) var(--fall-delay) linear infinite, tail-fade var(--tail-fade-duration) var(--fall-delay) ease-out infinite;
}
@media screen and (max-width: 750px) {
   .star {
       animation: fall var(--fall-duration) var(--fall-delay) linear infinite;
   }
}
.star:nth-child(1) {
   --star-tail-length: 6.21em;
   --top-offset: 44.74vh;
   --fall-duration: 10.829s;
   --fall-delay: 8.071s;
}
.star:nth-child(2) {
   --star-tail-length: 7.47em;
   --top-offset: 23.16vh;
   --fall-duration: 6.559s;
   --fall-delay: 0.778s;
}
.star:nth-child(3) {
   --star-tail-length: 7.4em;
   --top-offset: 41.76vh;
   --fall-duration: 7.095s;
   --fall-delay: 4.877s;
}
.star:nth-child(4) {
   --star-tail-length: 6.56em;
   --top-offset: 31.15vh;
   --fall-duration: 10.85s;
   --fall-delay: 4.007s;
}
.star:nth-child(5) {
   --star-tail-length: 5.47em;
   --top-offset: 2.68vh;
   --fall-duration: 6.352s;
   --fall-delay: 5.552s;
}
.star:nth-child(6) {
   --star-tail-length: 5.71em;
   --top-offset: 36.95vh;
   --fall-duration: 11.075s;
   --fall-delay: 5.34s;
}
.star:nth-child(7) {
   --star-tail-length: 5.09em;
   --top-offset: 25.91vh;
   --fall-duration: 6.16s;
   --fall-delay: 2.951s;
}
.star:nth-child(8) {
   --star-tail-length: 7.1em;
   --top-offset: 68.71vh;
   --fall-duration: 11.757s;
   --fall-delay: 6.985s;
}
.star:nth-child(9) {
   --star-tail-length: 5.58em;
   --top-offset: 43.34vh;
   --fall-duration: 11.25s;
   --fall-delay: 6.654s;
}
.star:nth-child(10) {
   --star-tail-length: 6.53em;
   --top-offset: 28.97vh;
   --fall-duration: 10.24s;
   --fall-delay: 0.981s;
}
.star:nth-child(11) {
   --star-tail-length: 5.72em;
   --top-offset: 78.19vh;
   --fall-duration: 6.762s;
   --fall-delay: 2.86s;
}
.star:nth-child(12) {
   --star-tail-length: 7.31em;
   --top-offset: 8.24vh;
   --fall-duration: 8.962s;
   --fall-delay: 5.424s;
}
.star:nth-child(13) {
   --star-tail-length: 5.52em;
   --top-offset: 6.67vh;
   --fall-duration: 7.712s;
   --fall-delay: 6.628s;
}
.star:nth-child(14) {
   --star-tail-length: 7.49em;
   --top-offset: 65.16vh;
   --fall-duration: 11.228s;
   --fall-delay: 6.86s;
}
.star:nth-child(15) {
   --star-tail-length: 5.83em;
   --top-offset: 46.15vh;
   --fall-duration: 11.859s;
   --fall-delay: 8.484s;
}
.star:nth-child(16) {
   --star-tail-length: 6.25em;
   --top-offset: 58.03vh;
   --fall-duration: 9.265s;
   --fall-delay: 0.975s;
}
.star:nth-child(17) {
   --star-tail-length: 7.34em;
   --top-offset: 98.57vh;
   --fall-duration: 8.216s;
   --fall-delay: 0.308s;
}
.star:nth-child(18) {
   --star-tail-length: 7.01em;
   --top-offset: 51.85vh;
   --fall-duration: 6.932s;
   --fall-delay: 8.854s;
}
.star:nth-child(19) {
   --star-tail-length: 7.28em;
   --top-offset: 37.92vh;
   --fall-duration: 10.915s;
   --fall-delay: 0.405s;
}
.star:nth-child(20) {
   --star-tail-length: 7.28em;
   --top-offset: 56.09vh;
   --fall-duration: 10.809s;
   --fall-delay: 8.105s;
}
.star:nth-child(21) {
   --star-tail-length: 6.16em;
   --top-offset: 43.29vh;
   --fall-duration: 11.227s;
   --fall-delay: 2.226s;
}
.star:nth-child(22) {
   --star-tail-length: 5.43em;
   --top-offset: 53vh;
   --fall-duration: 11.227s;
   --fall-delay: 6.452s;
}
.star:nth-child(23) {
   --star-tail-length: 6.42em;
   --top-offset: 51.85vh;
   --fall-duration: 6.417s;
   --fall-delay: 9.05s;
}
.star:nth-child(24) {
   --star-tail-length: 6.54em;
   --top-offset: 80.65vh;
   --fall-duration: 11.813s;
   --fall-delay: 4.876s;
}
.star:nth-child(25) {
   --star-tail-length: 5.4em;
   --top-offset: 27.18vh;
   --fall-duration: 8.798s;
   --fall-delay: 3.438s;
}
.star:nth-child(26) {
   --star-tail-length: 5.05em;
   --top-offset: 0.31vh;
   --fall-duration: 10.819s;
   --fall-delay: 2.871s;
}
.star:nth-child(27) {
   --star-tail-length: 6.88em;
   --top-offset: 47.93vh;
   --fall-duration: 10s;
   --fall-delay: 9.622s;
}
.star:nth-child(28) {
   --star-tail-length: 5.86em;
   --top-offset: 76.21vh;
   --fall-duration: 9.124s;
   --fall-delay: 9.141s;
}
.star:nth-child(29) {
   --star-tail-length: 6.36em;
   --top-offset: 88.98vh;
   --fall-duration: 6.134s;
   --fall-delay: 1.541s;
}
.star:nth-child(30) {
   --star-tail-length: 7.3em;
   --top-offset: 83.84vh;
   --fall-duration: 11.232s;
   --fall-delay: 6.188s;
}
.star:nth-child(31) {
   --star-tail-length: 5.31em;
   --top-offset: 79.58vh;
   --fall-duration: 8.634s;
   --fall-delay: 9.703s;
}
.star:nth-child(32) {
   --star-tail-length: 6.62em;
   --top-offset: 78.52vh;
   --fall-duration: 8.587s;
   --fall-delay: 8.777s;
}
.star:nth-child(33) {
   --star-tail-length: 5.08em;
   --top-offset: 43.86vh;
   --fall-duration: 10.594s;
   --fall-delay: 9.816s;
}
.star:nth-child(34) {
   --star-tail-length: 6.55em;
   --top-offset: 90.72vh;
   --fall-duration: 8.947s;
   --fall-delay: 4.109s;
}
.star:nth-child(35) {
   --star-tail-length: 7.11em;
   --top-offset: 83.2vh;
   --fall-duration: 6.965s;
   --fall-delay: 3.171s;
}
.star:nth-child(36) {
   --star-tail-length: 6.91em;
   --top-offset: 29.69vh;
   --fall-duration: 6.436s;
   --fall-delay: 3.202s;
}
.star:nth-child(37) {
   --star-tail-length: 5.37em;
   --top-offset: 89.06vh;
   --fall-duration: 9.926s;
   --fall-delay: 4.297s;
}
.star:nth-child(38) {
   --star-tail-length: 5.94em;
   --top-offset: 10.51vh;
   --fall-duration: 11.175s;
   --fall-delay: 1.888s;
}
.star:nth-child(39) {
   --star-tail-length: 6.42em;
   --top-offset: 50.3vh;
   --fall-duration: 10.111s;
   --fall-delay: 8.89s;
}
.star:nth-child(40) {
   --star-tail-length: 5.13em;
   --top-offset: 7.27vh;
   --fall-duration: 6.323s;
   --fall-delay: 7.443s;
}
.star:nth-child(41) {
   --star-tail-length: 6.3em;
   --top-offset: 96.51vh;
   --fall-duration: 10.335s;
   --fall-delay: 4.701s;
}
.star:nth-child(42) {
   --star-tail-length: 6.24em;
   --top-offset: 24.26vh;
   --fall-duration: 8.505s;
   --fall-delay: 7.057s;
}
.star:nth-child(43) {
   --star-tail-length: 6.84em;
   --top-offset: 27.75vh;
   --fall-duration: 11.575s;
   --fall-delay: 8.454s;
}
.star:nth-child(44) {
   --star-tail-length: 7.02em;
   --top-offset: 91.75vh;
   --fall-duration: 10.718s;
   --fall-delay: 0.426s;
}
.star:nth-child(45) {
   --star-tail-length: 5.73em;
   --top-offset: 58.45vh;
   --fall-duration: 9.707s;
   --fall-delay: 1.132s;
}
.star:nth-child(46) {
   --star-tail-length: 5.12em;
   --top-offset: 87.77vh;
   --fall-duration: 9.101s;
   --fall-delay: 5.422s;
}
.star:nth-child(47) {
   --star-tail-length: 7.2em;
   --top-offset: 81.95vh;
   --fall-duration: 6.829s;
   --fall-delay: 2.876s;
}
.star:nth-child(48) {
   --star-tail-length: 5.42em;
   --top-offset: 87.82vh;
   --fall-duration: 7.273s;
   --fall-delay: 4.556s;
}
.star:nth-child(49) {
   --star-tail-length: 6.84em;
   --top-offset: 96.44vh;
   --fall-duration: 8.592s;
   --fall-delay: 2.96s;
}
.star:nth-child(50) {
   --star-tail-length: 6.12em;
   --top-offset: 74.81vh;
   --fall-duration: 11.288s;
   --fall-delay: 4.917s;
}
.star::before, .star::after {
   position: absolute;
   content: "";
   top: 0;
   left: calc(var(--star-width) / -2);
   width: var(--star-width);
   height: 100%;
   background: linear-gradient(45deg, transparent, currentColor, transparent);
   border-radius: inherit;
   animation: blink 2s linear infinite;
}
.star::before {
   transform: rotate(45deg);
}
.star::after {
   transform: rotate(-45deg);
}
@keyframes fall {
   to {
       transform: translate3d(-30em, 0, 0);
   }
}
@keyframes tail-fade {
   0%, 50% {
       width: var(--star-tail-length);
       opacity: 1;
   }
   70%, 80% {
       width: 0;
       opacity: 0.4;
   }
   100% {
       width: 0;
       opacity: 0;
   }
}
@keyframes blink {
   50% {
       opacity: 0.6;
   }
}
.cube {
   position: absolute;
   z-index: 0;
   top: 80vh;
   left: 45vw;
   width: 10px;
   height: 10px;
   border: solid 1px orange;
   transform-origin: top left;
   transform: scale(0) rotate(0deg) translate(-50%, -50%);
   -webkit-animation: cube 5s ease-in forwards infinite;
   animation: cube 5s ease-in forwards infinite;
}
.cube:nth-child(2n) {
   border-color: #fff;
}
.cube:nth-child(2) {
   -webkit-animation-delay: 2s;
   animation-delay: 2s;
   left: 25vw;
   top: 40vh;
}
.cube:nth-child(3) {
   -webkit-animation-delay: 4s;
   animation-delay: 4s;
   left: 75vw;
   top: 50vh;
}
.cube:nth-child(4) {
   -webkit-animation-delay: 6s;
   animation-delay: 6s;
   left: 90vw;
   top: 10vh;
}
.cube:nth-child(5) {
   -webkit-animation-delay: 8s;
   animation-delay: 8s;
   left: 10vw;
   top: 85vh;
}
.cube:nth-child(6) {
   -webkit-animation-delay: 10s;
   animation-delay: 10s;
   left: 50vw;
   top: 10vh;
}
@-webkit-keyframes cube {
   from {
       transform: scale(0) rotate(0deg) translate(-50%, -50%);
       opacity: 1;
   }
   to {
       transform: scale(20) rotate(960deg) translate(-50%, -50%);
       opacity: 0;
   }
}
@keyframes cube {
   from {
       transform: scale(0) rotate(0deg) translate(-50%, -50%);
       opacity: 0.7;
   }
   to {
       transform: scale(20) rotate(960deg) translate(-50%, -50%);
       opacity: 0;
   }
}
.contact .icon {
   padding: 10px 0;
   opacity: 0.9;
}
.contact .icon a {
   color: #fff;
   font-size: 20px;
}
.contact .icon i {
   font-size: 40px;
   margin-right: 10px;
   vertical-align: middle;
}
.pricing-section{
   position: relative;
   background: #fffefb;
   padding: 80px 0px 80px 0px;
}
.tabs-box .tab{
   position:relative;
   display:none;
   transition: all 900ms ease;
   -moz-transition: all 900ms ease;
   -webkit-transition: all 900ms ease;
   -ms-transition: all 900ms ease;
   -o-transition: all 900ms ease;
}
.tabs-box .tab.active-tab{
   display:block;
}
.tabs-box .tab{
   transform:scale(0.9,0.9) translateY(0px);
}
.tabs-box .tab.active-tab{
   transform:scale(1) translateY(0px);
}
.pricing-section .tab-btn-box .tab-btns {
   position: relative;
   display: block;
}
.pricing-section .tab-btn-box .tab-btns:before {
   position: absolute;
   left: 0;
   right: 0;
   margin: 0 auto;
   height: 40px;
   width: 90px;
   content: "";
   border-radius: 30px;
   background: #fff;
   border: 1px solid #d10da5;
}
.pricing-section .tab-btn-box .tab-btns li{
   position: relative;
   display: inline-block;
   padding-right: 80px;
   min-width: 120px;
   text-align: right;
   font-size: 18px;
   line-height: 40px;
   color: #d10da5;
   cursor: pointer;
   transition: all 500ms ease;
}
.pricing-section .tab-btn-box .tab-btns li:last-child{
   padding-right: 47px;
   padding-left: 57px;
   text-align: left;
}
.pricing-section .tab-btn-box .tab-btns li.active-btn:before {
   right: 15px;
   background: #d10da5;
}
.pricing-section .tab-btn-box .tab-btns li:before {
   position: absolute;
   top: 5px;
   height: 30px;
   width: 30px;
   background-color: #d10da5;
   border-radius: 30px;
   content: "";
   right: -37px;
   -webkit-box-shadow: 0 4px 20px rgba(44,44,56,.30);
   box-shadow: 0 4px 20px rgba(44,44,56,.30);
   -webkit-transition: all 300ms ease;
   -o-transition: all 300ms ease;
   transition: all 300ms ease;
}
.sliding {
   padding: 60px 10px;
   background-color: none;
}
.pricing-section .tab-btn-box .tab-btns li:last-child:before{
   display: none;
}
.pricing-section .tabs-content{
   position: relative;
   margin-bottom: 0px;
}
.pricing-section .tabs-content h6{
   font-size: 28px;
   margin: 0;
   font-weight: 700;
   padding: 0;
   color: #ba0000;
   display: block;
   line-height: 1;
   font-family: 'Barlow Semi Condensed', sans-serif;
}
.pricing-section .tabs-content p{
   font-size: 16x;
   margin: 10px 0;
   display: block;
   padding: 0;
}
.pricing-block-one .pricing-table{
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   width:65%;
   padding: 0px 20px 60px;
   margin: 0px auto;
   transition: all 500ms ease;
   border-bottom: 1px dashed #fac747;
}
.pricing-table .currency {
   font-size: 40px;
   color: #62118e;
}
.pricing-table .lefty {
   display: flex;
   flex-direction: column;
   justify-content: center;
   border-radius: 100%;
   align-items: center;
   width: 300px;
   height: 300px;
   position: relative;
}
.pricing-table .lefty:before {
   content: '';
   background: transparent;
   width: 300px;
   height: 300px;
   border: 3px dashed #fac747;
   border-radius: 100%;
   margin-left: 0;
   z-index: -1;
   position: absolute;
   animation-name: spin2;
   animation-duration: 25000ms;
   animation-iteration-count: infinite;
   animation-timing-function: linear;
}
.pricing-table .lefty:after {
   content: '';
   background: transparent;
   width: 280px;
   height: 280px;
   border-radius: 100%;
   margin-left: 0;
   border: 3px dashed rgba(0,0,0,0.1);
   z-index: -1;
   position: absolute;
   animation-name: spin;
   animation-duration: 25000ms;
   animation-iteration-count: infinite;
   animation-timing-function: linear;
}
@keyframes spin {
   from {
       transform:rotate(0deg);
   }
   to {
       transform:rotate(360deg);
   }
}
@keyframes spin2 {
   from {
       transform:rotate(0deg);
   }
   to {
       transform:rotate(-360deg);
   }
}
.pricing-table .monthy {
   font-size: 28px;
   font-weight: 700;
   color: #62118e;
}
.pricing-block-one .pricing-table .price {
   font-size: 50px;
   color: #ba0000;
}
.pricing-block-one:hover .pricing-table{
   border-color: #521b6a;
}
.pricing-block-one .pricing-table .table-header .title{
   position: relative;
   font-size: 24px;
   line-height: 32px;
   color: #62118e;
   text-transform: uppercase;
   padding: 34.5px 15px;
}
.pricing-block-one .pricing-table .table-header .price{
   position: relative;
   display: block;
   font-size: 48px;
   line-height: 55px;
   font-weight: 700;
   color: #521b6a;
   background: #f1edff;
   padding: 12px 15px 12px 15px;
   transition: all 500ms ease;
}
.pricing-block-one:hover .pricing-table .table-header .price{
   background: #521b6a;
   color: #fff;
}
.pricing-block-one .pricing-table .table-header .price:before{
   position: absolute;
   content: "Rp.";
   font-size: 24px;
   line-height: 30px;
   color: #222;
   left: 35px;
   top: 18px;
   transition: all 500ms ease;
}
.pricing-block-one:hover .pricing-table .table-header .price span, .pricing-block-one:hover .pricing-table .table-header .price:before{
   color: #fff;
}
.pricing-block-one .pricing-table .table-header .price span{
   font-size: 18px;
   color: #777777;
   transition: all 500ms ease;
}
.pricing-section .pricing-column{
   padding: 0px 40px;
   margin-bottom: 60px;
}
.pricing-section .tabs-box{
   margin: 0px -40px;
}
.pricing-block-one .pricing-table .table-content{
   position: relative;
   padding: 37px 15px 20px 40px;
   text-align: left;
   min-height: 231px;
}
.pricing-block-one .pricing-table .table-content li{
   position: relative;
   display: block;
   font-size: 16px;
   margin-bottom: 18px;
   padding: 0px 0px 0px 35px;
}
.pricing-block-one .pricing-table .table-content li:before{
   position: absolute;
   content: "\f26b";
   font-family: 'Material-Design-Iconic-Font';
   font-size: 34px;
   font-weight: 700;
   color: #fac747;
   left: -5px;
   top: -2px;
}
.pricing-block-one .pricing-table .table-content li:last-child{
   margin-bottom: 0px;
}
.pricing-block-one .pricing-table .table-footer{
   position: relative;
   padding: 21px 15px 70px 110px;
   text-align: left;
}
.pricing-block-one .pricing-table .table-footer .theme-btn-two{
   padding: 10px 40px;
}
.pricing-section .sec-title{
   margin-bottom: 50px;
}
.pricing-section .sec-title h3{
   font-size: 50px;
}
.pricing-section .tabs-content .tab .pricing-column .pricing-block-one .pricing-table .image{
   position: absolute;
   width: 165px;
   height: 175px;
   left: -50px;
   bottom: -50px;
   background-repeat: no-repeat;
   -webkit-animation: zoom-fade 5s infinite linear;
   animation: zoom-fade 5s infinite linear;
}
.pricing-section .tabs-content .tab .pricing-column:nth-child(2) .pricing-block-one .pricing-table .image{
   width: 140px;
   -webkit-animation: zoom-fade 3s infinite linear;
   animation: zoom-fade 3s infinite linear;
}
.pricing-section .tabs-content .tab .pricing-column:last-child .pricing-block-one .pricing-table .image{
   -webkit-animation: zoom-fade 4s infinite linear;
   animation: zoom-fade 4s infinite linear;
}
.centred{
   text-align: center;
}
.sec-title{
   position: relative;
   display: block;
}
.sec-title.center{
   text-align: center;
}
.sec-title h2{
   position: relative;
   display: block;
   font-size: 36px;
   font-weight: bold !important;
   line-height: 48px;
   color: #333;
   margin-top: 30px;
   padding-bottom: 31px;
   margin-bottom: 31px;
}
.sec-title h2:before{
   position: absolute;
   content: '';
   background: #cccccc;
   width: 130px;
   height: 2px;
   left: 0px;
   bottom: 0px;
}
.sec-title.center h2:before, .sec-title.center h2:after{
   left: 50%;
   transform: translateX(-50%);
}
.sec-title h2:after{
   position: absolute;
   content: '';
   background: #777777;
   width: 45px;
   height: 4px;
   left: 0px;
   bottom: 0px;
   transition: all 500ms ease;
   -webkit-mask-image: linear-gradient(-75deg, rgba(244,55,55,0.6) 50%, #f43737 50%, rgba(0,0,0,1) 70%);
   -webkit-mask-size: 200%;
   animation: shine 2s infinite;
}
.sec-title p{
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   color: #333;
   margin: 0px;
}
.sec-title.center h2, .sec-title.center p{
   text-align: center;
}


.ex-row {
   --gap: 20px;
   display: inline-flex;
   flex-wrap: wrap;
   margin: calc(-1 * var(--gap)) 0 0 calc(-1 * var(--gap));
   width: calc(100% + var(--gap));
}
.ex-row .ex-list__item {
   margin: 20px 0 0 20px;
   width: calc(100% / 4 - 20px);
   background: #fff;
   border-radius: 6px;
   position: relative;
   border: 1px solid #ddd;
   box-shadow: 0 0 20px rgba(0,0,0,0.03);
}