.header-main{position: relative!important;}
#header-top-bar{background: #204b6a;}
.inner-banner {height: 650px; padding-top: 80px; position: relative; background-image: url("../images/sitejet-builder-banner.jpg"); background-position: top center; background-size: 100%; background-repeat: no-repeat;color: #fff;}
.inner-banner h1 {font-family: Lato, sans-serif; font-size: 60px; font-weight: 900; margin-bottom: 15px; color: #fff; line-height: 1.2;padding: 0% 18% 0% 0%;}
.inner-banner p {font-family: 'Poppins-Regular';font-size: 24px;line-height: 30px;margin-bottom: 20px;padding: 0% 15% 0% 0%;}
.inner-banner ul{padding:0px 0px 10px 0px;margin:0px 0px 0px 20px;}
.inner-banner ul li{font-family: 'Poppins-Light';font-size: 18px;list-style-type: disc;padding: 3px 0px;}
.inner-banner h2 {font-family: 'Poppins-SemiBold'; font-size: 30px; margin-bottom: 10px; color: #ffde26; line-height: 1.2;padding: 0% 4% 0% 0%;}
.inner-banner a {background-color:#64ba04;color: #fff;padding: 15px 30px;text-decoration: none;transition: all .3s ease-in-out;border-radius: .25rem;font-family: Lato, sans-serif;font-weight:700;font-size: 16px;top: 42px;position: relative;left: 10px}
.inner-banner a:hover {background-color: #fff;color: #0178e5;}
.container-sm{width:1140px; padding-right:15px; padding-left:15px; margin-right:auto; margin-left:auto } .ml-auto, .mx-auto{margin-left: auto !important;margin-right: auto !important;}
.inner-banner .amt{width: 20%; margin-bottom: 20px;float: left;}
.inner-banner .amt p{color:#fff; font-size: 16px;  font-family:Lato,sans-serif;font-weight:400;margin-bottom: 0px;}
.inner-banner .amt h3{font-size:50px;color:#fff; font-family: 'Poppins-SemiBold';}
.inner-banner .amt h3 sup{font-size:26px; font-family: 'Poppins-Regular';top: -22px;right: 1px;}
.inner-banner .amt h3 span{font-size:16px; font-family: 'Poppins-Regular';}

/*-- plans--*/
.pb-90 {padding-bottom: 90px;}
.price-section {margin-top: -100px; background: #fff;-webkit-box-shadow: 0 0 5px 2px rgba(51, 51, 51, 0.1);
box-shadow: 0 0 5px 2px rgba(51, 51, 51, 0.1);border-radius: 4px;}
.price-section .pr-1{padding-right: .25rem !important;}
.price-section .pl-1{padding-left: .25rem !important;}

.plans{padding:0px;position: relative;}
.banner-btn-group .btn:not(:last-child) {margin-right: 25px}          
.plans h2{font-size:26px;padding: 0px 30px;color:#000; font-family: 'Poppins-Regular';margin:20px auto 30px auto;width: 100%;text-align: center;}

/*-webkit-box-shadow: 0 0 90px rgba(0,0,0,.05);
box-shadow: 0 0 90px rgba(0,0,0,.05);-webkit-box-shadow: 0 0 30px rgba(24,104,222,.1);
box-shadow: 0 0 30px rgba(24,104,222,.1);*/
.plan-wrap{position: relative;padding: 60px 20px 20px 20px;}
.planbg{background: #ffffff;
background: -moz-linear-gradient(left,  #ffffff 0%, #f9f9f9 100%);
background: -webkit-linear-gradient(left,  #ffffff 0%,#f9f9f9 100%); 
background: linear-gradient(to right,  #ffffff 0%,#f9f9f9 100%);
filter:progid:DXImageTransform.Microsoft.gradient startColorstr='#ffffff', endColorstr='#f9f9f9',GradientType=1;}
/*.gx-lg-0 {--bs-gutter-x: 0;}*/
/*.planbg:last-child{background: no-repeat;}*/
.pl-1 {padding-left: 0px;}
.pr-1 {padding-right: 0px;}
.plan-head{padding-bottom: 25px; border-bottom: 1px solid rgba(16,69,219,.12);}
.plan-head h3{font-size:26px;color:#000; font-family: 'Poppins-Regular';}
.plan-head h3 span{font-family: 'Poppins-SemiBold';}
.plan-head p{color:#000; font-size: 16px;  font-family:Lato,sans-serif;font-weight:400; margin-top: 15px;margin-bottom: 0px;}
.popular-tag{font-family: 'Poppins-Regular';font-size:25px;background:#fb7820; color: #fff;text-transform: uppercase;padding: 5px 10px 5px 30px;width: 97%;margin: 0 auto;position: absolute;z-index: 2;left: -4px;}

.plan-price{padding: 20px 0px; border-bottom: 1px solid rgba(16,69,219,.12);display: -webkit-box;
-webkit-box-pack: justify;-webkit-box-align: center;}
/* .renewal{padding: 4px 0px 7px 0px; border-bottom: 1px solid rgba(16,69,219,.12); font-size:16px; font-family:Lato,sans-serif;font-weight:700; color: #0a6cc4;} */
/*@property --angle {
  syntax: '<angle>';
  initial-value: 90deg;
  inherits: true;
}

 @property --gradX {
  syntax: '<percentage>';
  initial-value: 50%;
  inherits: true;
}

@property --gradY {
  syntax: '<percentage>';
  initial-value: 0%;
  inherits: true;
}
:root {
	--d: 2500ms;
	--angle: 90deg;
	--gradX: 100%;
	--gradY: 50%;
	--c1: #1095ff;
	--c2: #9fc5e9;
} 
.renewal{padding: 4px 0px 7px 0px; border: 1px solid; font-size:16px; font-family:Lato,sans-serif;font-weight:700; color: #1095ff;border-radius: 4px;text-align: center;box-shadow: 0 2px 3px 3px #e6e3e3;
  border-image: conic-gradient(from var(--angle), var(--c2), var(--c1) 0.1turn, var(--c1) 0.15turn, var(--c2) 0.25turn) 30;
	animation: borderRotate var(--d) linear infinite forwards;}

  .renewal  :nth-child(2) {
    border-image: radial-gradient(ellipse at var(--gradX) var(--gradY), var(--c1), var(--c1) 10%, var(--c2) 40%) 30;
    animation: borderRadial var(--d) linear infinite forwards;
  }

  @keyframes borderRotate {
    100% {
      --angle: 420deg;
    }
  }
  
  @keyframes borderRadial {
    20% {
      --gradX: 100%;
      --gradY: 50%;
    }
    40% {
      --gradX: 100%;
      --gradY: 100%;
    }
    60% {
      --gradX: 50%;
      --gradY: 100%;
    }
    80% {
      --gradX: 0%;
      --gradY: 50%;
    }
    100% {
      --gradX: 50%;
      --gradY: 0%;
    }
  }*/

.renewal{padding: 4px 0px 7px 0px; border: 1px solid; font-size:16px; font-family:Lato,sans-serif;font-weight:700; color: #00a20a;border-radius: 4px;text-align: center;box-shadow: 0 2px 3px 3px #e6e3e3;}

.plan-amt{width: 50%;}
.plan-amt p{color:#434959; font-size: 16px;  font-family:Lato,sans-serif;font-weight:400;margin-bottom: 0px;}
.plan-amt h3{font-size:40px;color:#3d3d3d; font-family: 'Poppins-SemiBold';}
.plan-amt h3 sup{font-size:22px; font-family: 'Poppins-Regular';top: -14px;right: 1px;}
.plan-amt h3 span{font-size:16px; font-family: 'Poppins-Regular';}
.plan-discount{width: 50%;text-align: right;}
.plan-discount p{text-decoration: line-through; font-size:15px; font-family:Lato,sans-serif;margin-bottom: 5px;margin-right: 10px;}
.plan-discount span{color:#1f76c5;background:#e7f3fd;padding:5px 10px; font-size:14px; font-family:Lato,sans-serif;font-weight:900;text-transform: uppercase;}
.feature{padding: 20px 0 20px 0;}
.feature ul {padding:0px;margin-bottom: 0px;}
.feature ul li{list-style-type: none;font-family:Lato,sans-serif;font-size: 16px; font-weight:400;margin-bottom: 10px;color: #3d3d3d;}
.feature ul li svg{top: 2px;position:relative;margin-right: 10px;}
.feature ul li:last-child{margin-bottom:0px;}
.btn-wrap{margin: 20px 0px 40px 0px; font-family:Lato,sans-serif;font-size: 14px; font-weight:900;}
.btn-wrap .blk-btn{color: #fff;background: #3d3d3d;padding:10px 25px;border-radius: 4px;text-decoration: none;text-transform: uppercase;transition: all .3s ease-in-out;margin-right: 5px;}
.btn-wrap .blk-btn:hover, .btn-wrap .orng-btn:hover{background:#1766ae;color: #fff;}
.btn-wrap .orng-btn{color: #fff;background: #fb7820;padding:10px 20px;border-radius: 4px;text-decoration: none;text-transform: uppercase;transition: all .3s ease-in-out;width: 100%;
display: inline-block;text-align: center;}

.sitejet { position: relative; padding: 80px 0px 60px 0px;}
.sitejet p {color: #565559;font-family: 'Poppins-Regular';font-size: 20px;text-align: center;margin: 0px auto 70px auto;width: 100%;}
.sitejet section {width: 100%;  text-align: left;}
.sitejet section h2 { color: #1e1e1e;  font-family: 'Poppins-Regular'; font-size: 30px;  margin-bottom: 20px;}
.sitejet section h3 {  color: #f60; border-radius: 6px;  font-family: 'Poppins-Medium'; font-size: 20px;  margin-bottom: 20px; line-height: 28px;padding: 0% 8% 0% 0%;}
.sitejet section p {color: #2b2b2b;font-family: 'Poppins-Regular';font-size: 16px;  margin-bottom: 30px;text-align: left;padding: 0px;}
.mtb { margin-top: 100px; margin-bottom: 100px;}
.mb {margin-bottom: 0px;}

.get{padding: 60px 0px 60px 0px;position: relative;}
.get h2 {color: #1e1e1e;font-family: 'Poppins-Regular';font-size: 34px;text-align: center;width: 100%;margin-bottom: 30px;}
.get section{border-radius: 6px;box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);height: 220px;margin-bottom: 30px;background: #fff;padding: 20px;font-family: 'Poppins-Regular';}/*border-bottom: 2px solid #fb7820; */
.get section h3{font-size: 22px; padding: 10px 0px;text-align: center;border-bottom: 1px solid #d5d5d5;}
.get section h4{font-size:50px;color:#3d3d3d; font-family: 'Poppins-SemiBold';text-align: center;}
.get section h4 sup{font-family: 'Poppins-Regular';font-size:26px; top:-18px;right: 1px;}
.get section h4 span{font-family: 'Poppins-Regular';font-size:16px; }
.get section a{font-family: 'Poppins-Medium';color: #fff;background: #fb7820;padding:8px 20px;border-radius: 4px;text-decoration:none;text-transform: uppercase;transition: all .3s ease-in-out;width: 100%; display: inline-block;text-align:center;}
.get section a:hover{background:#1766ae;color: #fff;}

.bghover {z-index: 1;position: relative;}


@media only screen and (min-width:320px)and (max-width:479px){
  .inner-banner {padding-top: 30px;height: 300px;background: #204b6a;}
  .inner-banner h1{font-size: 32px;}
  .inner-banner p{font-size: 16px;line-height: 24px;margin-bottom: 15px;}
  .inner-banner ul{padding: 0px 0px 10px 0px;}
  .inner-banner ul li{font-size: 16px;}
  .inner-banner h2{font-size: 20px;}
  .inner-banner .amt{width: 38%;}
  .inner-banner .amt h3{font-size:40px;}
  .inner-banner .amt h3 sup{font-size: 16px;top: -16px;}
  .inner-banner a{font-size: 14px;padding: 12px 20px;top: 32px;}
  .banner{padding-top: 120px;}
  .banner .banner-content h1 {font-size: 60px;}  
  .banner .banner-content p {font-size: 16px;margin-bottom: 16px;}
  .plans{padding:40px 0 0px 0;}
  .plans h3{font-size:22px;}
  .plans h1{font-size:32px;}
  .plans p{font-size:14px;margin-bottom: 5px;margin-top:0px}
  .plan-amt h3 sup{top: -5px;font-size: 16px;}
  .plans section {margin-left: 40px;}
  .plans section p{padding: 18px 0px;}

  .plan-wrap{padding: 30px 20px 20px 20px;}
  .planbg{background:none;}
  .plan-head{padding-bottom: 15px;}
  .price-section{width: 100%;}
  .popular-tag{top: -20px;left: 0;width: 100%;font-size: 18px;}
 
  .sitejet{padding: 30px 0px;}
  .sitejet p{font-size: 16px;padding: 0% 5%;margin: 0px auto 30px auto;}
  .sitejet section h2{font-size: 22px;margin-top: 20px;margin-bottom: 10px;}
  .sitejet section h3{font-size: 16px;margin-bottom: 10px;line-height: 20px;}
  .sitejet section p{font-size: 14px;text-align: justify;}
  .mtb {margin: 20px 0px;}

  .get{padding: 30px 0px 0px 0px;}
  .get h2{font-size:18px;padding: 0% 3%;margin-bottom: 10px;}
  .get p{font-size: 14px!important;padding: 0% 5%;margin: 0 auto 30px auto;}
  .get section{height: 190px;}
  .get section h3{font-size:16px;padding-top: 0px;}
  .get section p{font-size: 14px !important;margin: 12px auto 20px auto;}
}
@media only screen and (min-width:480px) and (max-width:767px){
  .inner-banner {padding-top: 20px;height: 550px;background: #204b6a;}
  .inner-banner h1{font-size: 32px;}
  .inner-banner p{font-size: 16px;line-height: 24px;margin-bottom: 15px;}
  .inner-banner ul{padding: 0px 0px 10px 0px;}
  .inner-banner ul li{font-size: 16px;}
  .inner-banner h2{font-size: 20px;}
  .inner-banner .amt{width: 38%;}
  .inner-banner .amt h3{font-size:40px;}
  .inner-banner .amt h3 sup{font-size: 16px;top: -12px;}
  .inner-banner a{font-size: 14px;padding: 12px 20px;}
  .banner{padding-top: 120px;}
  .banner .banner-content h1 {font-size: 60px;}  
  .banner .banner-content p {font-size: 16px;margin-bottom: 16px;}
  .plans h3{font-size:22px;}
  .plans h1{font-size:32px;}
  .plans p{font-size:14px;margin-bottom: 5px;margin-top:0px}
  .plan-amt h3 sup{top: -5px;font-size: 16px;}
  .plans section {margin-left: 40px;}
  .plans section p{padding: 18px 0px;}

  .plan-wrap{padding:30px 20px 20px 20px;}
  .plan-head{padding-bottom:15px;}
  .price-section{width: 100%;}
  .popular-tag{top: -30px;left: 0;right: 0;}

  .sitejet{padding: 30px 0px;}
  .sitejet p{font-size: 16px;padding: 0% 5%;margin: 0px auto 30px auto;}
  .sitejet section h2{font-size: 22px;margin-top: 20px;margin-bottom: 10px;}
  .sitejet section h3{font-size: 16px;margin-bottom: 10px;line-height: 20px;}
  .sitejet section p{font-size: 14px;text-align: justify;}
  .mtb {margin: 20px 0px;}

  .get{padding: 30px 0px 0px 0px;}
  .get span{font-size: 14px}
  .get h2{font-size:18px;padding: 0% 3%;margin-bottom: 10px;}
  .get p{font-size: 14px!important;padding: 0% 5%;margin: 0 auto 30px auto;}
  .get section{height: 190px;}
  .get section h3{font-size:16px;padding-top: 0px;}
  .get section p{font-size: 14px !important;margin: 12px auto 20px auto;}
  .get section::before{padding: 5px;width: 50px;height: 40px;font-size: 18px;}
}
@media only screen and (min-width:768px) and (max-width:1024px){
  .inner-banner {padding-top: 30px;height: 240px;background: #204b6a;}
  .inner-banner h1{font-size: 30px;padding: 0% 5% 0% 0%;}
  .inner-banner p{font-size: 16px;line-height: 24px;margin-bottom: 15px;}
  .inner-banner ul{padding: 0px 0px 10px 0px;}
  .inner-banner ul li{font-size: 16px;}
  .inner-banner h2{font-size: 20px;}
  .inner-banner .amt h3{font-size: 40px;}
  .inner-banner .amt h3 sup{font-size: 16px;top: -12px;}
  .inner-banner a{font-size: 14px;padding: 12px 20px;top: 32px;}
  .banner{padding-top: 120px;}
  .banner .banner-content h1 {font-size: 60px;}  
  .banner .banner-content p {font-size: 16px;margin-bottom: 16px;}
  .plans{padding:40px 0;}
  .plans h3{font-size:22px;margin-bottom: 0px;}
  .plans h1{font-size:32px;}
  .plans p{font-size:14px;margin-bottom: 5px;margin-top:0px}
  .plan-amt h3 sup{top: -5px;font-size: 16px;}
  .plans section {margin-left: 40px;}
  .plans section p{padding: 18px 0px;}

  .plan-wrap{padding:30px 20px 20px 20px;}
  .plan-head{padding-bottom:15px;}
  .price-section{width: 100%;}
  .popular-tag{font-size: 16px;padding: 0px 10px 0px 30px;}

  .sitejet{padding: 30px 0px;}
  .sitejet p{font-size: 16px;margin: 0px auto 30px auto;}
  .sitejet section h2{font-size: 22px;margin-top: 20px;margin-bottom: 10px;}
  .sitejet section h3{font-size: 16px;margin-bottom: 10px;line-height: 20px;}
  .sitejet section p{font-size: 14px;text-align: justify;}
  .mtb {margin: 20px 0px;}
  .text-right{text-align: left !important;}

  .get{padding: 30px 0px 0px 0px;}
  .get span{font-size: 14px}
  .get h2{font-size:18px;padding: 0% 3%;margin-bottom: 10px;}
  .get p{font-size: 14px!important;padding: 0% 5%;margin: 0 auto 30px auto;}
  .get section{height: 190px;}
  .get section h3{font-size:16px;padding-top: 0px;}
  .get section p{font-size: 14px !important;margin: 12px auto 20px auto;}
  .get section::before{padding: 5px;width: 50px;height: 40px;font-size: 18px;}
}
@media only screen and (min-width:1024px) and (max-width:1280px) {
  .banner{padding-top: 140px;}
  .banner .banner-content h1 {font-size: 50px;}  
  .banner .banner-content p {font-size: 20px;margin-bottom: 16px;}
  .mrlft{margin-left: 120px}
} 
@media only screen and (min-width: 1200px) and (max-width: 1440px){
    .inner-banner {padding-top: 20px;height: 450px;}
    .inner-banner h1{font-size: 35px;}
    .inner-banner p{font-size: 16px;line-height: 24px;margin-bottom: 15px;}
    .inner-banner ul{padding: 0px 0px 10px 0px;}
    .inner-banner ul li{font-size: 16px;}
    .inner-banner h2{font-size: 25px;}
    .inner-banner .amt h3{font-size: 30px;}
    .inner-banner .amt h3 sup{font-size: 16px;top: -12px;}
    .inner-banner a{font-size: 14px;padding: 12px 20px;top: 20px;}
}
@media (min-width: 1080px) {
  .inner-banner {
      padding-top: 60px;
      height: 350px;
  }
  .inner-banner h1 {
      font-size: 32px;
  }
  .inner-banner p {
      font-size: 16px;
      line-height: 24px;
      margin-bottom: 15px;
  }
  .inner-banner ul {
      padding: 0px 0px 10px 0px;
  }
  .inner-banner ul li {
      font-size: 16px;
  }
  .inner-banner h2 {
      font-size: 20px;
  }
  .inner-banner .amt {
      width:20%;
  }
  .inner-banner .amt h3 {
      font-size: 30px;
  }
  .inner-banner .amt h3 sup {
      font-size: 16px;
      top: -12px;
  }
  .inner-banner a {
      padding: 12px 20px;
      top: 20px;
      left: 0px;
  }
}

@media (min-width:1920px) {
  .inner-banner {
      padding-top: 80px;
      height: 500px;
  }
  .inner-banner h1 {
      font-size: 49px;
  }
  .inner-banner p {
      font-size: 24px;
      line-height: 32px;
      margin-top: 20px;
  }
  .inner-banner ul {
      padding:0px 0px 20px 0px;
  }
  .inner-banner ul li {
      font-size: 18px;
  }
  .inner-banner h2 {
      font-size: 28px;
  }
  .inner-banner .amt {
      width: 18%;
  }
  .inner-banner .amt h3 {
      font-size: 50px;
  }
  .inner-banner .amt h3 sup {
      font-size: 26px;
      top: -22px;
  }
  .inner-banner a {
      padding: 15px 30px;
      top: 42px;
      left: 10px;
  }

}