@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');


body{
	
font-family: 'Poppins', sans-serif;
	font-size:16px;
	line-height: 1.42857143;
	color: #000;
  /*letter-spacing: -.02em;*/
}
.poppins{
    
font-family: 'Poppins', sans-serif;
}
.poppins1{
   
font-family: 'Poppins', sans-serif;
}

.poppins2{
font-family: 'Poppins', sans-serif;
}





@media (min-width: 240px) {
.xsem50{font-size:5em;}.xsem35{font-size:3.5em;}.xsem30{font-size:3em;}.xsem28{font-size:2.8em;}.xsem26{font-size:2.6em;}.xsem25{font-size:2.5em;}.xsem24{font-size:2.4em;}.xsem22{font-size:2.2em;}.xsem20{font-size:2em;}.xsem18{font-size:1.8em;}.xsem16{font-size:1.6em;}.xsem15{font-size:1.5em;}.xsem14{font-size:1.4em;}.xsem13{font-size:1.3em;}.xsem12{font-size:1.2em;}.xsem11{font-size:1.1em;}.xsem10{font-size:1em;}.xsem9{font-size:0.9em;}.xsem8{font-size:0.8em;}
.bizbox li{background: url("../images/list-arrow-2.png") no-repeat scroll left top;margin: 0 0 4px -12%;padding: 0 0 0 20px; list-style:none;}
.marketers li{background: url("../images/green-arrow.png") no-repeat scroll left top;margin: 0 0 6px -15%;padding: 0 0 0 36px; list-style:none;}
.formulalist li{background: url("../images/orange-arrow.png") no-repeat scroll 0 5px; margin: 0 0 6px -12%;padding: 0 0 0 36px; list-style:none;}
.arrowdown{width:40px; height:70px; background:url(../images/grey-arrow-down.png) center center no-repeat; margin:auto;}.text-center1{text-align:left;}
.strip7 h1{background: url("../images/rewarded-icon1.png") no-repeat scroll 98% 55%;padding: 12px 0;}
.cell-right li{list-style:none; padding: 0 0 0  30px; background: url("../images/question-mark-icon.png") no-repeat 0 4px; margin-left:-12%; line-height:24px; background-size:20px 20px;}
.monlarge{margin-top:5%;}
.mobilespace{margin-top:5%;}
.cleardesktop{clear:none;}
.clearsmall{clear:both;}
.bubble {position: relative;height: auto;padding:1% 0 5% 0;background: #9c1c12;}
.bubble:after {content: "";position: absolute;top: 0px;down: -30px;border-style: solid;border-width: 100px 0 100px 30px;border-color: transparent #9c1c12;
display: block;width: 0;z-index: 1; visibility:hidden;}
.brush{background:url(../images/brush.png) no-repeat;
background-size:cover;}
}
@media (min-width: 768px) {
.smem70{font-size:7em;}.smem35{font-size:3.5em;}.smem30{font-size:3em;}.smem28{font-size:2.8em;}.smem26{font-size:2.6em;}.smem25{font-size:2.5em;}.smem24{font-size:2.4em;}.smem22{font-size:2.2em;}.smem20{font-size:2em;}.smem18{font-size:1.8em;}.smem17{font-size:1.7em;}.smem16{font-size:1.6em;}.smem15{font-size:1.5em;}.smem14{font-size:1.4em;}.smem13{font-size:1.3em;}.smem12{font-size:1.2em;}.smem11{font-size:1.1em;}.smem12{font-size:1.2em;}.smem10{font-size:1em;}.smem9{font-size:0.9em;}.smem8{font-size:0.8em;}
.bizbox li{background: url("../images/list-arrow-2.png") no-repeat scroll left top;margin: 0 0 4px -25%;padding: 0 0 0 20px; list-style:none;}
.marketers li{background: url("../images/green-arrow.png") no-repeat scroll left top;margin: 0 0 6px -22%;padding: 0 0 0 36px; list-style:none;}
.formulalist li{background: url("../images/orange-arrow.png") no-repeat scroll 0 5px;margin: 0 0 6px -8%;padding: 0 0 0 36px; list-style:none;}
.arrowright{width:35px; height:70px; background:url(../images/grey-arrow.png) center center no-repeat; margin:auto;}
.strip7 h1{background: url("../images/rewarded-icon.png") no-repeat scroll 82% 55%;padding: 18px 0;}
.cell-right li{list-style:none; padding: 0 0 0  33px; background: url("../images/question-mark-icon.png") no-repeat 0 4px; margin-left:-5%; line-height:36px;}
.monlarge{margin-top:8%}
.cleardesktop{clear:none;}
.clearsmall{clear:both;}
.bubble {position: relative;height: 300px;padding: 3% 0 0 0;background: #9c1c12;}
.bubble:after {content: "";position: absolute;top: 0px;right: -30px;border-style: solid;border-width: 150px 0 150px 30px;border-color: transparent #9c1c12;
display: block;width: 0;z-index: 1; visibility:visible;}
.brush{background:url(../images/brush_small.png) no-repeat;
background-size:cover;}
.mobilespace{margin-top:0%;}
}
@media (min-width: 992px) {
.mdem70{font-size:7em;}.mdem60{font-size:6em;}.mdem45{font-size:4.5em;}.mdem35{font-size:3.5em;}.mdem32{font-size:3.2em;}.mdem30{font-size:3em;}.mdem28{font-size:2.8em;}.mdem26{font-size:2.6em;}.mdem25{font-size:2.5em;}.mdem24{font-size:2.4em;}.mdem23{font-size:2.3em;}.mdem22{font-size:2.2em;}.mdem20{font-size:2.0em;}.mdem18{font-size:1.8em;}.mdem17{font-size:1.7em;}.mdem16{font-size:1.6em;}.mdem14{font-size:1.4em;}.mdem13{font-size:1.3em;}.mdem12{font-size:1.2em;}.mdem11{font-size:1.1em;}.mdem10{font-size:1.0em;}.mdem9{font-size:0.9em;}.smem8{font-size:0.8em;}.mdem15{font-size:1.5em;} .ok{font-size: 40px;}  .mdem8{font-size:0.8em;}
.bizbox li{background: url("../images/list-arrow-1.png") no-repeat scroll left top;margin: 0 0 6px -16%;padding: 0 0 0 30px; list-style:none;}
.marketers li{background: url("../images/green-arrow.png") no-repeat scroll left top;margin: 0 0 6px -5%;padding: 0 0 0 36px; list-style:none;}
.formulalist li{background: url("../images/orange-arrow.png") no-repeat scroll left center;margin: 0 0 6px -8%;padding: 0 0 0 36px; list-style:none;}
.arrowright{width:40px; height:70px; background:url(../images/grey-arrow.png) center center no-repeat;}
.strip7 h1{background: url("../images/rewarded-icon.png") no-repeat scroll 82% 55%;padding: 14px 0;}
.cell-right li{list-style:none; padding: 0 0 0  36px; background: url("../images/question-mark-icon.png") no-repeat 0 4px; margin-left:-5%; line-height:36px;}
.monlarge{margin-top:8%}
.cleardesktop{clear:both!important;}
.clearsmall{clear:none;}
.bubble {position: relative;height: 300px;padding: 3% 0 0 0;background: #9c1c12; visibility:visible;}
.bubble:after {content: "";position: absolute;top: 0px;right: -30px;border-style: solid;border-width: 150px 0 150px 30px;border-color: transparent #9c1c12;
display: block;width: 0;z-index: 1;}
.brush{background:url(../images/brush.png) no-repeat;
background-size:cover;}
.mobilespace{margin-top:0%;}
}
@media (min-width: 1200px) {
.em70{font-size:7em;}.em45{font-size:4.5em;}.em32{font-size:3.2em;}.em35{font-size:3.5em;}.em33{font-size:3.3em;}.em30{font-size:3em;}.em28{font-size:2.8em;}.em26{font-size:2.6em;}.em25{font-size:2.5em;}.em24{font-size:2.4em;}.em23{font-size:2.3em;}.em22{font-size:2.2em;}.em20{font-size:2em;}.em18{font-size:1.8em;}.em16{font-size:1.6em;}.em14{font-size:1.4em;}.em13{font-size:1.3em;}.em12{font-size:1.2em;}.em11{font-size:1.1em;}.em10{font-size:1em;}.em9{font-size:0.9em;}.em8{font-size:0.8em;}
.bizbox li{background: url("../images/list-arrow-1.png") no-repeat scroll left top;margin: 0 0 6px -16%;padding: 0 0 0 30px; list-style:none;}
.marketers li{background: url("../images/green-arrow.png") no-repeat scroll left top;margin: 0 0 6px -12%;padding: 0 0 0 36px; list-style:none;}
.formulalist li{background: url("../images/orange-arrow.png") no-repeat scroll left center;margin: 0 0 6px -8%;padding: 0 0 0 36px; list-style:none;}
.arrowright{width:40px; height:70px; background:url(../images/grey-arrow.png) center center no-repeat;}
.strip7 h1{background: url("../images/rewarded-icon.png") no-repeat scroll 82% 55%;padding: 14px 0;}
.cell-right li{list-style:none; padding: 0 0 0  36px; background: url("../images/question-mark-icon.png") no-repeat 0 4px; margin-left:-5%; line-height:36px;}
.monlarge{margin-top:8%}
.cleardesktop{clear:both!important;}
.clearsmall{clear:none;}
.bubble {position: relative;height: 300px;padding: 3% 0 0 0;background: #9c1c12;}
.bubble:after {content: "";position: absolute;top: 0px;right: -30px;border-style: solid;border-width: 150px 0 150px 30px;border-color: transparent #9c1c12;
display: block;width: 0;z-index: 1; visibility:visible;}
.brush{background:url(../images/brush.png) no-repeat;
background-size:cover;}
.mobilespace{margin-top:0%;}
}
.logo{position:relative; bottom:-15px;}
.header_strip{background:#fb4100; height:8px;}
.divider{background: url("../images/divider.png") no-repeat 50% 50%;color: #505050;min-height: 300px;text-align: center;}

a,a:hover, img, a:hover, a:active, a:focus{text-decoration: none ;outline:none;}
object, embed {outline: 0;}
b{inherit: bold;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
.getresblock{background:#fcc145; padding:2% 2% 4%;}
table {border-collapse: collapse;border-spacing: 0;}
header{
	background: #0d0d0d;
	padding: 0px;
}
.brand-section{
	background:url(../images/banner.png);
	color: #131313;
	padding: 1% 0 6% 0;
	background-size:cover;
}


.sectionte {
    background: url(../images/live-sec-bg.png) no-repeat center center;
    padding: 2% 0 2%;
    background-size:cover;
}

.bg1 {
    background: url(../images/top-5.png) no-repeat center center;
    padding: 2% 0 6%;
    background-size:cover;
}


.million{
    background-color: #3b5997; /* layer fill content */
    -moz-box-shadow: inset 0 4px 0 #203562; /* inner shadow */
    -webkit-box-shadow: inset 0 4px 0 #203562; /* inner shadow */
    box-shadow: inset 0 4px 0 #203562; /* inner shadow */
    padding: 0 0 1% 0;
}

/*About Us Section */
.about-head-strip{
    background-color: #9f923e;
    -moz-box-shadow: inset 0 4px 0 #7b7029;
    -webkit-box-shadow: inset 0 4px 0 #7b7029;
    box-shadow: inset 0 4px 0 #7b7029;
	padding: 0 0 1% 0;
}
/*product information*/

.info-product-heading{
    background-color: #e74b3b; /* layer fill content */
    -moz-box-shadow: inset 0 4px 0 #b62c1e; /* inner shadow */
    -webkit-box-shadow: inset 0 4px 0 #b62c1e; /* inner shadow */
    box-shadow: inset 0 4px 0 #b62c1e; /* inner shadow */
    padding: 0 0 1% 0;
}

.product-from-head{
    background:#e7e7e7;
    padding: 1.5%;
    margin: 0 0 40px;
}
.facebook-strip-head {
    background-color: #31353d; /* layer fill content */
    -moz-box-shadow: inset 0 4px 0 #22252c; /* inner shadow */
    -webkit-box-shadow: inset 0 4px 0 #22252c; /* inner shadow */
    box-shadow: inset 0 4px 0 #22252c; /* inner shadow */
    padding: 1% 0;

}

/*discover section*/
.discover-head-strip{
    background-color: #3397db; /* layer fill content */
    -moz-box-shadow: inset 0 4px 0 #2477af; /* inner shadow */
    -webkit-box-shadow: inset 0 4px 0 #2477af; /* inner shadow */
    box-shadow: inset 0 4px 0 #2477af; /* inner shadow */
    padding: 0 0 1% 0;
}

/*testimonial section*/

.testimonial-head-strip {

    background-color: #63b15b; /* layer fill content */
    -moz-box-shadow: inset 0 4px 0 #4a8a43; /* inner shadow */
    -webkit-box-shadow: inset 0 4px 0 #4a8a43; /* inner shadow */
    box-shadow: inset 0 4px 0 #4a8a43; /* inner shadow */
    padding:0 0 1% 0;
}

/*license Agreement section css*/
.license-head-strip {
    background-color: #1ab373;
    -moz-box-shadow: inset 2px 4px 0 #148b5a; /* inner shadow */
    -webkit-box-shadow: inset 2px 4px 0 #148b5a; /* inner shadow */
    box-shadow: inset 2px 4px 0 #148b5a; /* inner shadow */
    padding: 0 0 1% 0;
}

/*limited-offer-section-css*/
.limited-offer-head-strip {
    background-color: #626262; /* layer fill content */
    -moz-box-shadow: inset 2px 4px 0 #3d3d3d; /* inner shadow */
    -webkit-box-shadow: inset 2px 4px 0 #3d3d3d; /* inner shadow */
    box-shadow: inset 2px 4px 0 #3d3d3d; /* inner shadow */
	padding: 0 0 1% 0;
}
.limited-offer-head-strip h1{
    background: url("../images/limited.png") no-repeat 27% 50%;
	padding: 10px 0 10px 0px;
}

 .col-xs-20, .col-sm-20, .col-md-20, .col-lg-20 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
.col-xs-20 {
  float: left;
}
.col-xs-20 {
  width: 20%;
}

@media (min-width: 768px) {
  .col-sm-20 {
    float: left;
  }
  .col-sm-20 {
    width: 20%;
  }
  
}
@media (min-width: 992px) {
  .col-md-20 {
    float: left;
  }
  .col-md-20 {
    width: 20%;
  }
  
}
@media (min-width: 1200px) {
  .col-lg-20 {
    float: left;
  }
  .col-lg-20 {
    width: 20%;
  }
  
}
/*--------------------------
MEDIA Queary
----------------------------*/

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    .divider{
        background: url("../images/divider-arrow.png") no-repeat;
        height: 60px;
        margin:-40px 0 0;
        min-height: 60px;

    }
    .limited-offer-head-strip h1 {
        background: url("../images/limited.png") no-repeat scroll 8% 50% rgba(0, 0, 0, 0);
    }

}
/* Landscape phones and down */
@media (max-width: 534px) {
}


/* Landscape phones and down */
@media (max-width: 480px) {

}

@media (min-width: 320px) and  (max-width: 479px) {
    .limited-offer-head-strip h1 {
        background: url("../images/limited.png") no-repeat scroll 6px 50% rgba(0, 0, 0, 0);
        padding: 10px 0 10px 0px;
		background-size:30px 30px;
    }
	/*.col-apple-6
	{
		width:50%;
	}*/
}


.sourcesans{font-family:source sans pro;}

.lato{font-family:lato;}

.lh110{line-height:110%;}.lh120{line-height:120%;}.lh130{line-height:130%;}.lh140{line-height:140%;}.lh150{line-height:150%;}.lh160{line-height:160%;}.lh170{line-height:170%;}.lh180{line-height:180%;}.lh190{line-height:190%;}.lh200{line-height:200%;} .lh80{line-height:80%;}

.yellowtext{
	color: #ffcb54;
}
.orangetext
{
	color:#f93d08;
}
.whitetext{
	color: #fff !important;
}

.orangetext1
{
	color:#f3b32d;
}



.green
{color:#6dc520!important;}

.prpl{color:#182a4a;}
.dblue {
color: #3934c5;}
.blue{color:#7690ef;}
.inherit{font-family:inherit;}
.serif{font-family:serif;}
.bluetext{color:#2b3a4d;}
.offwhitetext{color:#e2e2e2;}
.lightgreen{color:#96ff3a;}

.focus-text{
	background: #000000;
    padding: 6px;
    border-radius: 6px;    
	}

.header{padding:1%;}
.banner{
	width:100%;
	height:auto;
	padding:1% 0 7% 0;
	background:#042747;
}
.w200{font-weight:200;}
.w300{font-weight:300;}.w400{font-weight:400;}.w600{font-weight:600;}.w500{font-weight:500;}
.w700{font-weight:700;}.w800{font-weight:800;}
.line{border-bottom:#999 solid 1px; margin:6px 0;}
.responsive-video {position: relative;padding-bottom: 60.2%;overflow: hidden;}
.responsive-video iframe,.responsive-video object,.responsive-video embed {position: absolute;top: 0;left:15%;width: 80%;height: 100%;}
.italic{font-style:italic;}
.margin_top1{margin-top:1%;} .margin_top2{margin-top:2%;} .margin_top3{margin-top:3%;}
.margin_top4{margin-top: 4%;} .margin_top5{margin-top:5%;} .margin_top6{margin-top:6%;}
.margin_top7{margin-top:7%;} .margin_top8{margin-top:8%;} .margin_top9{margin-top:9%;}
.margin_top10{margin-top: 10%;} .margin_top11{margin-top:11%;} .margin_top12{margin-top:12%;}
.margin_top20{margin-top: 20%;} 
.margin_top30{margin-top: 30%;} 
.margin_top40{margin-top: 40%;} 
.margin_top90{margin-top: 90px;} .margin_top110{margin-top: 110px;}
.margin_top4{margin-top:4%;}
.margin_strip{margin-top:8%;}
.margin_top2{margin-top:2%;}
.margin_top-4{margin-top:-4%;}
.margin_top-5{margin-top:-5%;}
.margin_top-1{margin-top:-1%;}
.margin_top-2{margin-top:-2%;}
.underline{border-bottom:3px solid #fff;}
.underline1{border-bottom:2px solid #e14b40;}
.instant_button a{background:#0a0a0a; padding:1% 1% 2% 1%; display:block; border-radius:6px; -webkit-border-radius:6px; border-bottom:#b96100 7px groove;color:#FFFFFF;}
.instant_button a:hover{text-decoration:none;}
.grunge-bg{background:url(../images/grunge-bg.png) no-repeat;}
.clear{clear:both;}
.marketers{border:2px #333333 outset; min-height:340px;}

.strip2{width:100%; height:auto; background:#3b5997; padding:0 0 1% 0; border-top:#203562 solid 4px;}
.strip3{width:100%; height:auto; background:#e74b3b; padding:0 0 1% 0; border-top:#b62c1e solid 4px;}
.strip4{width:100%; height:auto; background:#31353d; padding:0 0 1% 0; border-top:#22252c solid 4px;}
.strip5{width:100%; height:auto; background:#FFA300; padding:0 0 1% 0; border-top:#DA7D07 solid 4px;}
.strip6{width:100%; height:auto; background:#63b15b; padding:0 0 1% 0; border-top:#4a8a43 solid 4px;}
.strip7{width:100%; height:auto; background:#6615BD; padding:0 0 1% 0; border-top:#7040EB solid 4px;}
.strip8{width:100%; height:auto; background:#1ab373; padding:0 0 1% 0; border-top:#148b5a solid 4px;}
.strip9{width:100%; height:auto; background:#626262; padding:0 0 1% 0; border-top:#3d3d3d solid 4px;}
.strip_footer{width:100%; height:auto; background:#000000; padding:2% 0; font-size:14px; font-weight:600}
.strip_footer a{color:#ffffff;}
.green{color:#74a81a;}
.green1{color:#479404;}
.table-hover tr:hover{background:#cccccc;}
.equalsto{padding-top:9%;}
.red{color:#f13646;}
.bgstrip{background-color:#e7e7e7; margin-bottom:4%; padding:1% 1%;}
.modulebox_title{background:#2267B3; padding:0 0 2% 0;}
.bonusbox_title{background:#C72727; padding:0 0 2% 0;}
.modulebox{background:#f7f4f2; box-shadow:#999999 0px 0px 2px 1px; padding:0px;}
.livedemo a{
	width:80%;
	background:#ffae00;
	display:block;
	margin:auto;
	padding-top: 1%;
	padding-right: 0;
	padding-bottom: 2%;
	padding-left: 0;
}
.livedemo a:hover{text-decoration:none;}
.testibox{border-radius: 3px / 3px 3px 3px 3px;background-color: #f3f9ec;border: 2px dashed #81c679;padding: 2%;}
.quote{background: url("../images/blockquote.png") no-repeat;
display: block;float: left;height: 36px;margin: 0 20px 0 0;width: 46px;}
.moneyborder{border:1px solid #7fb9d6; position:relative;z-index:10; border-radius:20px; padding:3%;}
.moneyborder:before {content:"";display:block;position:absolute;z-index:-1;top:10px;left:10px;right:10px;bottom:10px;border:1px solid #c0151c;border-radius:10px;}
.cando,.cantdo{list-style:none outside; margin-left:-8%;}
.cando li{background:url(../images/green-arrow2.png) no-repeat; padding:0 0 0 25px; line-height:200%; background-position:center left;}
.cantdo li{background:url(../images/cross-btn.png) no-repeat; padding:0 0 0 25px; line-height:200%; background-position:center left;}
.borderedbox{border:2px dashed #213c4d;}
.price-info {background: url("../images/price-info-bg.png") no-repeat; background-size:cover;}
.color_theme{color:#042747;}


.upper_transform
{text-transform:capitalize;}

ul.nolist{list-style:none;}

.testipic img{
border:2px solid #999999;
border-radius:15px;
-webkit-border-radius:15px;
}
.topheader
{
background-color:#f5f5f5;
width:100%;
height:auto;
}
.clear{clear:both;}
.color_theme{
	color: #ff9a0a;
}




.sticky-footer{
	background-color: rgba(00, 00, 00, 0.85);
	box-shadow: 0 2px 3px 3px #292f3d;
	position: fixed;
	width: 100%;
	z-index: 9999;
	bottom: 0;
	padding: 0;
}

.sticky-footer .res-counter{
	/*height: 50px;*/
    text-align: left;
	color: #fff;

}
.sticky-footer .res-counter h1{
    font-size: 20px;
    font-weight: bold;
    display: inline-block;
    float: left;
    padding: 27px 0;
}
.centered{
    display: inline-block;
    /*float: left;*/
}


.banner-box{height:auto; background:#fff; -webkit-box-shadow: 0 0 3px 2px #999;box-shadow: 0 0 3px 2px #999;}


.affiliates{ padding:3% 0;}
.owner{background:url(../images/texture1.jpg) repeat #e5e5e5; width:100%; padding:1% 0 10% 0}
.affiliatebox{background:#fafafa; margin-bottom:5%; padding:1% 0 3% 0;}
.contactbox{background:#0a0a0a; width:100%; padding:1% 0 2% 0}
.greybox{background:#1d2530; width:100%; padding:1% 0 2% 0}
.affiliatesline{width:100%; background:#5537ea; padding:0 0 1% 0;}
.skypebox{background:#fff; border-radius:5px; -webkit-border-radius:5px; padding:0 2%;}










/*Aweber*/
.aweberbox{background:#202020; border-radius:5px; -webkit-border-radius:5px; padding:46px 0;}
#af-form-1102835355 .af-body .af-textWrap{width:90%;display:block; margin:auto;}
#af-form-1102835355 .af-body input.text, #af-form-1102835355 .af-body textarea{background-color:#f7f7f7; border:0;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:14px;font-family:Verdana, sans-serif; border-radius:3px; -webkit-border-radius:3px; margin:10px 0;}
#af-form-1102835355 .af-body input.text:focus, #af-form-1102835355 .af-body textarea:focus{background-color:#FFFAD6;}
#af-form-1102835355 .af-body label.previewLabel{display:block;float:none;text-align:left;width:auto;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:12px;font-family:Verdana, sans-serif;}
#af-form-1102835355 .af-body{padding-bottom:15px;padding-top:15px;background-repeat:no-repeat;background-position:inherit;background-image:none;color:#000000;font-size:11px;font-family:Verdana, sans-serif;}
#af-form-1102835355 .af-quirksMode{padding-right:15px;padding-left:15px;}
#af-form-1102835355 .af-standards .af-element{padding-right:15px;padding-left:15px;}


#af-form-1102835355 .buttonContainer input.submit{
	width:90% !important;
	background-color: #0a0a0a;
    -moz-box-shadow:  0 6px 1px #a45100;
    -webkit-box-shadow: 0 6px 1px #a45100;
    box-shadow:  0 6px 1px #a45100;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;
    color: #fff;
    text-align: center;
    border: 1px solid #0a0a0a;
    padding: 4% 1%;
	outline:none !important;}

#af-form-1102835355 .buttonContainer input.submit:active
	{
	box-shadow:0px 3px 1px #a45100;
	transform:translateY(4px);
	}

#af-form-1102835355 .buttonContainer input.submit{width:auto;}
#af-form-1102835355 .buttonContainer{text-align:center;}
#af-form-1102835355 button,#af-form-1102835355 input,#af-form-1102835355 submit,#af-form-1102835355 textarea,#af-form-1102835355 select,#af-form-1102835355 label,#af-form-1102835355 optgroup,#af-form-1102835355 option{float:none;position:static;margin:0;}
#af-form-1102835355 div{margin:0;}
#af-form-1102835355 form,#af-form-1102835355 textarea,.af-form-wrapper,.af-form-close-button,#af-form-1102835355 img{float:none;color:inherit;position:static;background-color:none;border:none;margin:0;padding:0;}
/*#af-form-1102835355 input,#af-form-1102835355 button,#af-form-1102835355 textarea,#af-form-1102835355 select{font-size:100%;}*/
#af-form-1102835355 select,#af-form-1102835355 label,#af-form-1102835355 optgroup,#af-form-1102835355 option{padding:0;}
#af-form-1102835355,#af-form-1102835355 .quirksMode{width:100%;max-width:418px;}
#af-form-1102835355.af-quirksMode{overflow-x:hidden;}

#af-form-1102835355{display:block;}
#af-form-1102835355{overflow:hidden;}
.af-body .af-textWrap{text-align:left;}
.af-body input.image{border:none!important;}
.af-body input.submit,.af-body input.image,.af-form .af-element input.button{float:none!important;}
.af-body input.text{width:100%;float:none;padding:11px 6px 11px 32px!important;}
.af-clear{clear:both;}
.af-element label{text-align:left;display:block;float:left;}
.af-element{padding:5px 0;}
.af-form-wrapper{text-indent:0;}
.af-form{text-align:left;margin:auto;}
.af-quirksMode .af-element{padding-left:0!important;padding-right:0!important;}
.lbl-right .af-element label{text-align:right;}
.name{background:url(../images/name.png) no-repeat 5px 10px;}
.email{background:url(../images/email.png) no-repeat 5px 10px;}
.cbid{background:url(../images/cbid.png) no-repeat 5px 10px;}
.padding0{padding:0!important;} .margin0{margin:0;}


/*Navbar Css*/

.navbar
{border-radius:0px; margin:auto;
padding:15px 0px 4px 0px;
border:0px;
}

.fira-sans {
    font-family: "Fira Sans",sans-serif;
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {  
	color:#ffffff; 
    background-color:#3886f2;
	font-weight: 600;
}
@media (min-width:240px)
	{
.nav.navbar-nav.navbar-right li a:hover{
color:#fff;
background: #ed6e24;
-webkit-box-shadow:0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
box-shadow:0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
/*-ms-transform: scale(1.1,1.1);  IE 9 */
    /*-webkit-transform: scale(1.1,1.1);  Safari */
    /* transform: scale(1.1,1.1); Standard syntax 
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;*/
}
	}
	
@media (min-width:1200px)
	{
		
		.nav.navbar-nav.navbar-right li a:hover{
background-color: #e13d3f;
    color: #fff;
}
	}
	
	
.nav.navbar-nav.navbar-right li a:active{color:#fff; background-color:#999da0;}
										
.navbar .navbar-brand {color:#000;}
.navbar .navbar-brand:hover{color:#09F; 
background: #feffff; }

.navbar-header .navbar-toggle{background-color:#000000;}
.navbar-header .navbar-toggle:hover{background-color:#31476c;}
.navbar-header .navbar-toggle:focus{background-color:#31476c;}
.navbar-header .navbar-toggle:hover .icon-bar{background-color:#fff;}
.navbar-header .navbar-toggle:focus .icon-bar{background-color:#fff;}
.navbar-header .navbar-toggle .icon-bar{background-color:#FFF;}

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: #000;
}



.navbar-default .navbar-toggle {
    border-color: #000000;
}
.navbar-toggle:focus {
    outline: 0;
}
.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 14px;
    margin-right: 15px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 0px;
}

@media (min-width:240px)
	{
		.nav-margin{margin-top:0%;}
		.nav.navbar-nav.navbar-right li a{color:#000000; font-size:16px; margin:2px 2px;}
		.nav>li>a {
					position: relative;
					display: block;
					padding: 9px 13px;
				  }
	}
@media (min-width:768px)
	{
		.nav-margin{margin-top:0%;}
		.nav.navbar-nav.navbar-right li a{color:#000000; font-size:10px; margin:2px 2px;}
		.nav>li>a {
					position: relative;
					display: block;
					padding: 6px 5px;
				  }
	}
@media (min-width:992px)
	{
		.nav-margin{margin-top:1%;}
		.nav.navbar-nav.navbar-right li a{color:#000000; font-size:12px; margin:2px 2px;}
		.nav>li>a {
					position: relative;
					display: block;
					padding: 9px 10px;
				  }
	}
@media (min-width:1200px)
	{
		.nav-margin{margin-top:1%;}
		.nav.navbar-nav.navbar-right li a{color:#000000; font-size: 21px;
margin: 9px 8px;
font-weight: 500;
border-radius: 5px;
.nav>li>a {
					position: relative;
					display: block;
					padding: 9px 11px;
				  }
	}}
/*End NavBar Css*/

.montser{font-family:Montserrat;}

.fb-section
{
	background: url(../images/bg5.png) no-repeat #fff;
    padding: 0% 0 5%;
    background-size: cover;
    background-position: bottom;
}
.fb-section3
{
	background: url(../images/.png) no-repeat #fff;padding: 2% 0 0%;
    background-size: top;
    background-position: contain;
}
.fb-section1
{
	background: url(../images/bg11.png) no-repeat #fff;padding: 2% 0 6%;
    background-size: cover;
    background-position: bottom;
}

.fb2{
	background: url(../images/bg2.jpg) no-repeat #fff;padding: 2% 0 6%;
    background-size: cover;
    background-position: bottom;
}
/* ==================== */
 .fb-section03{
    background: url(../images.jpg) no-repeat #fff;padding: 0% 0 3% 0%;
    background-size: cover;
    background-position: bottom;
} 


/* =================== */



.video-forum{background:#314357; padding:3% 0;}
.strip{background:#479404; padding:1.5% 0;}
.quick-point{background:#ffffff; padding:0% 0 4%;}
.offwhitesection{background:url(../images/bg31.png) repeat #e5e5e5; padding:3% 0 5%;}
.jv-contest{background:url(../images/texture2.jpg) repeat #e5e5e5; padding:3% 0 5%;}

ul li{list-style-type:none;}

.swipes{background: #ccc;
    padding: 2%;
    border-radius: 8px;
   
  }

.jv_btn {
    background: linear-gradient(to left, #159bd7, #0278c1);
-moz-box-shadow: 0 6px 1px #ff0000;
-webkit-box-shadow: 0 6px 1px #ff0000;
box-shadow: 0 6px 1px #073e99;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
-ms-border-radius: 6px;
-o-border-radius: 6px;
border-radius: 6px;
color: #fff;
text-align: center;
border: 3px solid #0e47a6;
padding: 4% 1%;
}

.jv_btn:active, .jv_btn1:active{
	box-shadow:0px 3px 1px transparent;
	transform:translateY(4px);
	}
.jv_btn:hover{-ms-transform: scale(1.1,1.1); /* IE 9 */
    -webkit-transform: scale(1.1,1.1); /* Safari */
    transform: scale(1.1,1.1); /* Standard syntax */
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;}	
.jv_btn1 {
    background: linear-gradient(to left, #050d27, #050d27, #070f24);
    -moz-box-shadow: 0 6px 1px 
    -webkit-box-shadow: 0 6px 1px #1659a0;
    box-shadow: 0 6px 1px #f68810;
    -webkit-border-radius: 15px 0 15px 0px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    color: #fff;
    text-align: center;
    border: 2px solid #fff;
    padding: 4% 1%;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.jv_btn1:hover{-ms-transform: scale(1.1,1.1); /* IE 9 */
    -webkit-transform: scale(1.1,1.1); /* Safari */
    transform: scale(1.1,1.1); /* Standard syntax */
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;}


.jv_btn2 {
	background-color:#fff;
    -moz-box-shadow: 0 6px 1px #9e3c06;
    -webkit-box-shadow: 0 6px 1px #1659a0;
    box-shadow: 0 6px 1px #3cf;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
   
    color: #0f5198;
    text-align: center;
    border: 1px solid #3cf;

    padding: 4% 1%;	
    -webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;
}

.jv_btn2:hover{-ms-transform: scale(1.1,1.1); /* IE 9 */
    -webkit-transform: scale(1.1,1.1); /* Safari */
    transform: scale(1.1,1.1); /* Standard syntax */
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;}




.product{background: #d76537;
background: -moz-radial-gradient(center, ellipse cover, #d76537 0%, #ca3438 100%);
background: -webkit-radial-gradient(center, ellipse cover, #d76537 0%,#ca3438 100%);
background: radial-gradient(ellipse at center, #d76537 0%,#ca3438 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d76537', endColorstr='#ca3438',GradientType=1 );
background: #63656d;
padding:3% 0 5%; background-size:cover;}

.heading-txt{    
	background: #202020;    
    padding: 1%;
    -webkit-box-shadow:0 8px 16px 0 rgba(0,0,0,0.4), 0 6px 20px 0 rgba(0,0,0,0.19);
	box-shadow:0 8px 16px 0 rgba(0,0,0,0.4), 0 6px 20px 0 rgba(0,0,0,0.19);
}


.whitesection{padding:0% 0;}
.title-marquee {
    color: #0a7aa7;
    line-height: 0.9;
    width: 40px;
}

.benefit3 {
    background-color: #EB3F3F;
    width: 100%;
    padding: 1%;
}

.prelaunch_box {
    background: #ccc;;
    
    padding: 2%;
}


.topmargin2{margin-top:2%;}
.shadow{box-shadow:0 8px 16px 0 rgba(0,0,0,0.4), 0 6px 20px 0 rgba(0,0,0,0.19);}
.radius8{border-radius: 12px;}
.width100{width:100% !important; outline:none;}
input[type="email"],input[type="password"], input[type="text"] 
{
    padding: 10px;
    color: #000 !important;
    background: #fff;    
    outline: none;
    box-shadow: none;
    border: 2px solid #274193;
	margin:8px 0;
    font-family: 'Roboto Condensed', sans-serif;
	
	
}



.vertical-center{display: table-cell;
    vertical-align: middle;
    position: relative;
    max-height: 100%;
    height: 250px;}
	

@media (min-width:240px)
{
.circle1{
background: #e22328;
background: -moz-linear-gradient(top, #e22328 0%, #ff0000 100%);
background: -webkit-linear-gradient(top, #e22328 0%,#ff0000 100%);
background: linear-gradient(to bottom, #e22328 0%,#ff0000 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e22328', endColorstr='#ff0000',GradientType=0 );
    background: #ffffff;
    height:220px; 
    width:220px; 
    margin:auto;
    border: 2px dashed #ffffff;
    
    }
}

@media (min-width:768px)
{
.circle1{
    height:160px; 
    width:160px;    
    }
}

@media (min-width:992px)
{
.circle1{
    height:200px; 
    width:200px;
    }
}

@media (min-width:1200px)
{
.circle1{
    height:250px; 
    width:250px;
    }
}

.inner1 {
    margin-left: auto;
    margin-right: auto; 
   
}



@media (min-width:240px)
{
.circle{
background: #e22328;
background: -moz-linear-gradient(top, #e22328 0%, #ff0000 100%);
background: -webkit-linear-gradient(top, #e22328 0%,#ff0000 100%);
background: linear-gradient(to bottom, #e22328 0%,#ff0000 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e22328', endColorstr='#ff0000',GradientType=0 );
    background: #ffffff;
	height:220px; 
	width:220px; 
	margin:auto;
	border: 2px dashed #ffffff;
  
	border-radius:50%;
	}
}

@media (min-width:768px)
{
.circle{
	height:160px; 
	width:160px; 	
	}
}

@media (min-width:992px)
{
.circle{
	height:200px; 
	width:200px;
	}
}

@media (min-width:1200px)
{
.circle{
	height:230px; 
	width:230px;
	}
}

	
.outer {
    display: table;    
    height: 100%;
    width: 100%;
}

.middle {
    display: table-cell;
    vertical-align: middle;
}

.inner {
    margin-left: auto;
    margin-right: auto; 
    width: 230px;
}

.red1 {
    color: #f91909;
}
	
 .prodbg{   background: url(../images/bg.jpg) no-repeat #fff;padding: 2% 0 2%;
    background-size: cover;
    background-position: bottom;
}
.points{background:#1d1c1c url(../images/points.jpg) repeat; padding:3% 0; background-attachment:fixed; background-size:cover;}

.lovepoints{background:#f4f4fd url(../images/iconbg1.jpg) repeat; padding:0% 0; background-attachment:fixed; background-size:cover;}
.ok li{
    background: url(../images/unname1.png) no-repeat scroll left 4px;
    margin: 0 0 10px 0%;
    padding: 0 0 15px 55px;
	background-size:34px;
    list-style: none;
	}
.ok1 li{
    background: url(../images/icon2.png) no-repeat scroll left 12px;
    background-repeat: no-repeat;
    padding: 5px 0 16px 60px;
    }
	.ok2 li{
    background: url(../images/icon3.png) no-repeat scroll left 0px;
    background-repeat: no-repeat;
    padding: 5px 0 22px 60px;
    
    }

.strip1{width:100%; background:#e22328; padding:1.5% 0;}


.fbgrr {
    background: #000000 url(../images/.png) no-repeat;
    background-size: cover;
    padding: 2% 0 2%;
}
.fbg {
    background: #00000000 url(../images/fbg.png) no-repeat;
    background-size: cover;
    background-position: bottom;
    padding: 2% 0 2%;
}
.fbg3 {
    background: #00000000 url(../images/fbg.png) no-repeat;
    background-size: cover;
    background-position: bottom;
    padding: 4% 4% 4% 0%;

}
.fbg1 {
    background: #00000000 url(../images/fbg.png) no-repeat;
    background-size: cover;
    background-position: center;
    padding: 2% 0 2%;
}

.fbg0 {
    background: #00000000 url(../images/fbg.png) no-repeat;
    background-size: cover;
    background-position: center;
    padding: 0% 0 0%;
}
.fbg5{
    background: #000000 url(../images/) no-repeat;
    background-size: cover;
    background-position: bottom;
    padding: 2% 0 2%;
    /* margin-top: 25px; */
}


.fbg4 {
  background: #00000000 url(../images/stt.png) no-repeat;
  background-size: cover;
  background-position:top;
  padding: 2% 0 2%;
  width: 600px;
}


.blck_bg {
 
    background: url(../images/introbg.jpg) #363c43 no-repeat;
    background-size: cover;
    background-position: center;
    padding: 0% 0 3%;
}

.offercompare{background:#ffffff; padding:3% 0;}
.offercompare li{
    background: url(../images/tick.png) no-repeat scroll left 4px;
    margin: 0 0 4px 0%;
    padding: 0 0 0 60px;
    list-style: none;
	}
.blacktext{color:#000000;}
.black{color:#030303;}

.featurebox {
    border: 2px solid #f7f7f7;
    border-radius: 4px;
    color: rgb(0, 0, 0);
    float: left;
    width: 100%;
    box-shadow: 0 0 30px 3px #999;
}

.feoffer {
    background:#ffffff;
    padding: 5% 2%;
    min-height: 90px;
    background-position: initial;
	
}


.featurepoints {
  background: #ffffff;
  border-bottom: 1px solid #000000;
  padding: 20px 6px;
  float: left;
  width: 100%;
}


.upsellfeaturebox {
    border: 2px solid #f7f7f7;
    border-radius: 4px;
    color: #7c7c7c;
    float: left;
    width: 100%;
    -webkit-border-radius: 4px;
    box-shadow: 0 0 30px 3px #999;
}

.upselloffer {
  background:#ffffff;
  padding: 8% 4%;
  min-height: 90px;
  background-position: initial;

}

.upsellfeaturepoints {
  background: #ffffff;
  border-bottom: 1px solid #000000;
  padding: 10px 6px;
  float: left;
  width: 100%;
  min-height: 50px;
}


.jvtool{padding: 3% 0;}


.popup:hover {
    transform: scale(1.1);
}
.popup {
    transition: all .3s ease-in-out;
}

.blink {
    position: relative;
    -webkit-animation-name: example;
    -webkit-animation-duration: 4s;
    -webkit-animation-iteration-count: infinite;
    animation-name: example;
    animation-duration: 1s;
    animation-iteration-count: infinite;    
}
/* Chrome, Safari, Opera */
@-webkit-keyframes example {
    0%   {color:#009; }
    25%  {color:yellow;}
    50%  {color:#009;}
    75%  {color:yellow;}
    100% {color:#009; }
}

/* Standard syntax */
@keyframes example {
    0%   {color:#009; }
    25%  {color:yellow;}
    50%  {color:#009;}
    75%  {color:yellow;}
    100% {color:#009; }
}


#snow{
	background: #171628;	
	background-image: url('../images/snow1.png'), url('../images//snow2.png'), url('../images//s3.png');
	height: 100%;
	/*left: 0;
	position: absolute;
	top: 0;*/
	width: 100%;
	z-index:1;
	-webkit-animation: snow 10s linear infinite;
	-moz-animation: snow 10s linear infinite;
	-ms-animation: snow 10s linear infinite;
	animation: snow 10s linear infinite;
}
@keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-moz-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 400px 1000px, 200px 400px, 100px 300px;}
}
@-webkit-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-ms-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}	




.feupbg {
    background: url(../images/1.jpg) no-repeat;
    background-size: cover ;
    background-position: top;
    padding: 2% 0 0%;
  
}

@keyframes bounce {
  0% {
    transform: translate3d(0px, 0px, 0);
  }
  50% {
    transform: translate3d(0px, -10px, 0);
  }
  100% {
    transform: translate3d(0px, 0px, 0);
  }
}
.rocket {
    animation: bounce 0.6s infinite;
}

.feupbg1 {
    background: url(../images/feupbg.png) no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 3% 0;
}



.whitesection1 {
    background: url(../images/explorebg.png) repeat #f5f6fb;
    padding: 0% 0 5%;
    background-attachment: fixed;
    background-position: bottom;
}

.offercompare li {
    background: url(../images/icon.png) no-repeat scroll left 4px;
    margin: 0 0 4px 0%;
    padding: 11px 0 0 60px;
    list-style: none;
}

.grey{color:#333333;}


.whitesection2 {
    background: url(../images/bg1.jpg);   
    padding-top: 80px;
    padding-bottom: 0px;
    outline: none;
    background-color: rgba(1, 0, 6, 0.97)! important;
    color: rgb(255, 255, 255);
	background-size:cover;
}

.blue1 {
    color: #1c82e4;
}

.deCapitalize {
    text-transform: capitalize;
}


.blue2 {
    color: #183159;
}

.san {font-family: Montserrat, Helvetica, sans-serif;}

.exactlybg1 {
  background: #fd5c2f;
border-left: 15px solid #a13b1e;
border-right: 15px solid #a13b1e;
    padding: 20px;
}

.col-md-60 {
    width: 60%;
}
.col-md-40 {
    width: 40%;
} 

.Economica{font-family: 'Economica', sans-serif;}

.Roboto{font-family: 'Roboto Condensed', sans-serif;}

.Heebo{font-family: 'Heebo', sans-serif;}




.b2 {
    color: #05b1e1;
}


.datebox-outer {
   background: linear-gradient(to left, #01c7b6, #0084c2, #0072c4);
padding: 7px;
border-radius: 20px;
}

.datebox {
    background: #fff;
    padding: 5px 5px 5px 5px;
    border-radius:15px;
}

@media (min-width: 240px){
.form-bg {
    background: #fff;
    padding: 13px;
    border-radius: 25px;
    border: 3px solid #274193;
    margin-bottom: 40px;
}}

@media (min-width: 1200px){
.form-bg {
    background: #fff;
    padding: 25px!important;
    border-radius: 25px;
    border: 3px solid #274193;
    position: relative!important;
   width: 1100px! important;
    margin-top: 1px!important;
	color: #000 !important;
}}

.lobster {
    font-family: 'Lobster Two', cursive;
}

.Archivo {
    font-family: 'Archivo Narrow', sans-serif;
}

.roboto{font-family: 'Roboto', sans-serif;}

.flla{font-family: 'Fjalla One', sans-serif;}


.psn{font-family: 'Passion One', cursive;}


.lale{font-family: 'Lalezar', cursive;}

.sansita{font-family: 'Sansita Swashed', cursive;}

.nunito{font-family: 'Nunito', sans-serif;}

.dosis{font-family: 'Dosis', sans-serif;}


.org1 {
    color: #000000;
}

.asst{font-family: 'Assistant', sans-serif;}


.highlihgt-heading {
    position: relative;
    background: #ffffff;
    padding: 12px;
    width: 100%;
    border-radius: 5px;
    display: inline-block;
    box-shadow: -1.04px 4.891px 6px 0px rgb(19 22 38 / 20%);
	    min-width: 100%;
    height: 100%;
    z-index: 9;
    padding: 0px;
    width: 100%;
    margin: 0px;
    transform: rotate(
0deg
);
}

.b1 {
    color: #2d447c;
}


.top5-shape {
    background: url(../images/tp.png) no-repeat top center;
    background-size: cover;
    padding: 20px 60px;
}

.top1 {
    background: url(../images/top1.png) no-repeat top center;
    background-size: cover;
    padding: 101px 0px;
	
}
.top2 {
  background: url(../images/top33.jpg) no-repeat top;
    background-color: rgb(255, 255, 255);
    background-size: cover;
    padding: 10px 60px;
	}

.top3 {
    background: url(../images/top33.jpg) no-repeat top center;
    background-size: cover;
    padding: 20px 60px;
    
}
.section17a {
    background: url(../images/top3.jpg) no-repeat top center;
    background-size: cover;
    padding: 20px 60px;
	
}
.reason-text {
    background: url(../images/reasontext-shape.png) no-repeat top center;
    background-size: cover;
    padding: 24px 80px;
    margin-left: -78px;
}

.reason-sec {
    background: url(../images/fbg.jpg) no-repeat top center;
    background-size: cover;
    padding: 30px 0px 30px 0px;
}

.niche {
    text-align: center;
    padding: 34px 20px;
    background: #fff;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 15px #d9d3ffcc;
    margin-bottom: 30px;
    
}

.niche1 {
    text-align: center;
    padding: 20px 20px;
    background: #fff;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 15px #d9d3ffcc;
    margin-bottom: 30px;
    
}
.border1 hr{
  width: 300px; 
  border:4px solid black; 
  border-radius: 5px;
}
.border1 hr:hover{
  width: 400px; 
  transition: 0.9s;
}
.updown{
  animation: animate 5s linear infinite;
}
@keyframes animate{
  0%,100%
  {
    transform: translateY(20px);
  }
   50%
  {
    transform: translateY(50px);
  }
}


.org2{
  color: #ffffff;
}

 .org3 {
    color: #01c7b6;
}
.green11 {
  background-color: #f95639;
background-image: linear-gradient( 140deg, rgb(249, 85, 57) 0%, rgb(254, 149, 42) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}          
.orange{
	 background-color: #f95639;
	 -webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.sectionte {
    background: url(../images/live-sec-bg.png) no-repeat center center;
    padding: 2% 0 6%;
    background-size: cover;
}
.jv-announce {
  background-size: cover;
    padding: 0 6% 3% 6%;
    border-radius: 20px;
    background-color: rgb(13, 56, 105) ; 
}

.calender-shape {
    background-color: rgba(136, 200, 247, 0.66);
    padding: 14px 8px 15px 8px;
}
.monster {font-family: 'Montserrat', sans-serif;}

.title-bg2 {
    background-color: rgb(233, 67, 63);
    display: inline-block;
    padding: 5px 8px;
    border-radius: 50px;
    text-transform: uppercase;
}


.title-bg3 {
    background-color: rgb(49, 241, 65);
    display: inline-block;
    padding: 2.4% 6%;
    border-radius: 50px;
    text-transform: uppercase;
}

.affiliate-link-btn a {
    border-radius: 50px;
    background-color: #ffffff;
    color: #0b0a1f;
    display: block;
    text-align: center;
    padding: 2% 7.7%;
    margin-top: 30px;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
    display: table;
}
.affiliate-link-btn a:hover {
  text-decoration: none;
  opacity: 0.7;
}
.jv-announce {
  background-size: cover;
    padding: 0 6% 3% 6%;
    border-radius: 20px;
   background-color: rgb(13, 56, 105);
}

.calender-shape {
    background-color: rgb(14, 117, 171);
    padding: 14px 8px 25px 8px;
}


.mtminus {
    margin-top: -7px;
}
.purple{
	color:#8a3ffb;
}
.section7 {

  /* background: #162a51; */
  background: linear-gradient(to left, #0f1f89, #1278e0, #0f1f89);
    background-size: auto;
  background-size: cover;
  padding: 2% 0 2% 0;
  position: relative;
  z-index: 1;
}
.margin_top1{margin-top:1%;} .margin_top2{margin-top:2%;} .margin_top3{margin-top:3%;}
.margin_top4{margin-top: 4%;} .margin_top5{margin-top:5%;} .margin_top6{margin-top:6%;}
.margin_top7{margin-top:7%;} .margin_top8{margin-top:8%;} .margin_top9{margin-top:9%;}
.margin_top10{margin-top: 10%;} .margin_top11{margin-top:11%;} .margin_top12{margin-top:12%;}.margin_top16{margin-top:16%;}
.margin_top-10{margin-top:-10%;} 
.pre-launch-text {
    background: url(../images/pre-contest.png) no-repeat center center;
    padding: 30px;
    background-size: contain;
    outline: none;
    border: 0;
}
.yellow{
	color: #29d3ad
}
.blue {
  color: #5399fa;
}
/* 
.section-04 {
    display: block;
    background: url(../images/kh1.png) no-repeat;
    background-size: contain;
    min-height: 500px;
    padding-top: 50px;
} */


.db2 {
    color: #ff3d68;
}
@media (min-width: 768px){
.section45 {
    padding: 0% 0 6% 0;
    background:  url(../images/intro-banner.png) no-repeat center center;
}
.section46 {
    background: url("") no-repeat center center;
    background-size: cover;
    float: left;
    padding: 15px 5px 5px;
}
.linksbg {
    background: transparent url(../images/linksbg.png) no-repeat top center;
    background-size: cover;
    padding: 0% 0 10% 0;
    position: relative;
}
.formbox:before {
    content: '';
    background: url(../images/form-shape.png) no-repeat top left;
    background-size: contain;
    position: absolute;
    top: -75px;
    left: -25px;
    padding: 203px 330px;
    z-index: -1;
}}
.formbox:before{
	content:'';
	background: url(../images/form-shape.png) no-repeat top left;
	background-size:contain;
	position:absolute;
	top:-75px;
	left:-25px;
	padding: 0px;
	z-index:-1;
}
.ml15 {
    margin-left: 15px;
}
.mt2 {
    margin-top: 2%;
}
.mt3 {
    margin-top: 3%;
}
.mt5 {
    margin-top: 5%;
}
.formbox {
    border-radius: 12px;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 2px 24px 0px rgb(89 86 225 / 40%);
    width: 100%;
    padding: 30px 50px;
    border-top: 6px solid #59146f;
}

.fbg {
    background: #f7f6f6 url(../images/fbg.png) no-repeat;
    background-size: cover;
    background-position: top;
    padding: 3% 0 3%;
}
.margin_top6 {
    margin-top: 6%;
}
.top{
	top: 70px;
}

 @media(min-width:1200px){
.iconbox1 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
box-shadow: 0px 0px 20px 0px rgba(253, 145, 152, 0.35);
  padding: 20px ! important;
  height: 160px ! important;
}
.iconbox4 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
box-shadow: 0px 0px 20px 0px rgba(253, 145, 152, 0.35);
  padding: 20px ! important;
  height: 224px ! important;
}}

@media(min-width:240px){
.iconbox1 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
box-shadow: 0px 0px 20px 0px rgba(253, 145, 152, 0.35);
  padding: 40px;
 
}
.iconbox4 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
box-shadow: 0px 0px 20px 0px rgb(209, 201, 238);
  padding: 40px;
 
}}


@media(min-width:1200px){
.iconbox2 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 0px 20px 0px rgba(218, 189, 99, 0.35);
  padding: 20px ! important;
  height: 160px ! important;
}}

@media(min-width:240px){
.iconbox2 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 0px 20px 0px rgba(218, 189, 99, 0.35);
  padding: 40px;
}}

@media(min-width:1200px){
.iconbox3 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 0px 20px 0px rgba(77, 193, 214, 0.35);
  padding: 20px ! important;
  height: 224px ! important;
}}

@media(min-width:240px){
.iconbox3 {
  border-radius: 15px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 0px 20px 0px rgba(77, 193, 214, 0.35);
  padding: 40px;
 
}} 

.icon-top {
  margin-top: 9px;
}
.d1{
    color: #2fbeff;
}

.d2{
    color: #f4d146;
}

.box{
    position: relative;
}
.box .square{
    position: absolute;
    backdrop-filter:blur(5px);
    box-shadow: 0 25px 45px rgba(0,0,0,0.1);
    border: 1px solid rgba(255,255,255,0.5);
    border-right: 1px solid rgba(255,255,255,0.2);
    border-bottom: 1px solid rgba(255,255,255,0.2);
    background: rgba(255,255,255,0.1);
    border-radius: 10px;
    animation: animate 10s linear infinite;
    animation-delay: calc(-1s * var(--i))
}
@keyframes animate{
    0%, 100%{
        transform: translateY(-30px);
    }
    50%{
        transform: translateY(30px);
    }
}
.box .square:nth-child(1){
    top: -50px;
    right: -60px;
    width: 100px;
    height: 100px;
}
.box .square:nth-child(2){
    top: 80px;
    left: -100px;
    width: 120px;
    height: 120px;
    z-index: 2;
}

.box .square:nth-child(4){
    bottom: 0px;
    left: 360px;
    width: 100px;
    height:100px;
    z-index: 2;
}
.box .square:nth-child(5){
    bottom: -23px;
    left: -29px;
    width: 80px;
    height: 80px;
}
.containerr{
    position: relative;
    width: 400px;
    min-height: 400px;
    background: rgba(255,255,255,0.1);
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    backdrop-filter:blur(5px);
    box-shadow: 0 25px 45px rgba(0,0,0,0.1);
    border: 1px solid rgba(255,255,255,0.5);
    border-right: 1px solid rgba(255,255,255,0.2);
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.form{
    position: relative;
    width: 100%;
    height: 100%;
    padding: 40px;
}
.form h2{
    position: relative;
    margin: 0;
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 40px;
    font-family: 'Roboto Condensed', sans-serif;
}
.form h2::before{
   content: '';
    position: absolute;
    left: 0;
    bottom: -16px;
    width: 91px;
    height: 4px;
    background: #fff;
}
.form .inputBox{
    width: 100%;
    margin-top: 20px;
}
.form .inputBox input{
    width: 100%;
    background: rgba(255,255,255,0.2);
    border:none;
    outline: none;
    padding: 10px 20px;
    border-radius: 35px;
    border: 1px solid rgba(255,255,255,0.5);
    border-right: 1px solid rgba(255,255,255,0.2);
    border-bottom: 1px solid rgba(255,255,255,0.2);
    font-size: 18px;
    letter-spacing: 1px;
    color: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    font-family: 'Roboto Condensed', sans-serif;
}
.form .inputBox input::placeholder{
    color: #fff;
}
.form .inputBox input[type="submit"]{
    background: #fff;
    color: #666;
    max-width: 220px;
    cursor: pointer;
    margin-bottom: 20px;
    font-weight: 600;
}
.forgot{
    margin-top: 5px;
    color: #fff;
}
.forgot a{
    font-weight: 600;
    color: #fff;
}

.services{
    background: url(../images/1.jpg);
    color: #3d3935;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: center center;
    font-family: 'Montserrat', sans-serif;
}

#container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 70vh;
}
.boxx {
    width: 100%;
    max-width: 1170px;
    padding: 15px;
}
.boxx h1 {
    margin: 30px 0;
    color: #ddd;
    font-size: 41px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
}
.cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    text-align: center;
}
.card {
    width: 24%;
    padding: 30px 20px;
    border-radius: 3px;
    transition: transform .3s;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(30px);
    border-radius: 16px;
}
.card-content {
    color: #fff;
}
.card-content h2 {
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
}
.card-content p {
    font-size: 25px;
    line-height: 1.9;
}
.icons {
    background: #ddd;
    display: inline-block;
    border-radius: 50%;
    height: 80px;
    width: 80px;
    margin-bottom: 20px;
}
.icons i {
    text-align: center;
    line-height: 75px;
    padding: 0px 25px;
    font-size: 35px;
    color: #295291;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #container {
        height: auto;
    }
    .boxx {
        padding: 20px;
    }
    .card {
        width: 100%;
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 767px) {
    .boxx h1 {
        font-size: 1.5rem
    }
    .cards {
        justify-content: center;
    }
    .card {
        margin-bottom: 20px;
        width: 100%;
    }
}

/* 
section{
    display: ;
    justify-content: center;
    align-items: center;
    min-height: 100Vh;
    background: linear-gradient(to bottom,#1c2655, #354384);
}
section .color{
    position: absolute;
    filter: blur(150px);
} */

.whitesectioncd{
    background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);
  font-family: "Josefin Slab";
  height: 100vh;
}


.containercd {
  display: flex;
  flex-wrap: wrap;
  max-width: 600px;
  margin: 1vw auto;
  position: relative;
  text-align: center;
  width: 94vw;
}

.productt {
  flex: auto;
  font-size: 1.5rem;
  margin: 0 1vw calc(1vw + 50px) 1vw;
  min-width: calc(33% - 2vw);
  position: relative;
}

.productt:before {
  content: "";
  float: left;
  padding-top: 100%;
}

.content {
  background: white;
  border-radius: 30%;
  height: 84%;
  margin: 8%;
  position: absolute;
  width: 84%;
  vertical-align: middle;
  z-index: 5000;
}

.productt:hover .effect-1,
.productt:hover .effect-2 {
  display: block;
}

.effect-1,
.effect-2 {
  border-radius: 30%;
  display: none;
  mix-blend-mode: multiply;
  height: 84%;
  opacity: 1;
  position: absolute;
  width: 84%;
  z-index: 3000;
}

.effect-1 {
  animation: rotate 1.8s linear infinite;
  background: cyan;
}

.effect-2 {
  animation: rotate 1.2s linear reverse infinite;
  background: #e7a9ff;
}

@keyframes rotate {
  0% {
    top: 0;
    left: 8%;
  }
  25% {
    top: 8%;
    left: 0%;
  }
  50% {
    top: 16%;
    left: 8%;
  }
  75% {
    top: 8%;
    left: 16%;
  }
  100% {
    top: 0;
    left: 8%;
  }
}

.title {
  position: relative;
  top: calc(100% + 16px);
}

.title span {
  display: block;
  font-family: Helvetica, Arial, Sans-Serif;
  font-size: 0.6rem;
  letter-spacing: 0.1rem;
  margin-top: 8px;
  text-transform: uppercase;
}

.exercise {
  background-image: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
  border-radius: 5px;
  height: 50%;
  margin: 25%;
  width: 50%;
}

.sleep {
  background-image: linear-gradient(to top, #fff1eb 0%, #ace0f9 100%);
  border-radius: 50%;
  height: 50%;
  margin: 25%;
  width: 50%;
}

.meditation {
  background-image: linear-gradient(
    to top,
    #f3e7e9 0%,
    #e3eeff 99%,
    #e3eeff 100%
  );
  border-radius: 5px;
  height: 40%;
  margin: 30%;
  transform: rotate(45deg);
  width: 40%;
}

.twitter {
  background-image: linear-gradient(
    to top,
    #1e3c72 0%,
    #1e3c72 1%,
    #2a5298 100%
  );
  border-radius: 14px;
  bottom: 20px;
  color: #fff;
  font-weight: 400;
  letter-spacing: 0.1rem;
  line-height: 28px;
  padding: 0 12px;
  position: fixed;
  right: 20px;
  z-index: 5000;
}

.twitter i {
  margin-right: 6px;
  position: relative;
  top: 2px;
}

.twitter a {
  color: #fff;
  font-family: Helvetica, Arial, Sans-Serif;
  font-size: 0.7rem;
  text-decoration: none;
}

.gradient-text {
    background-color: #ffffff;
    background-image:  linear-gradient( 84deg, #eb8d00, #ffcc0e, #ff8600);

    background-size: 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.rubik {font-family: 'Rubik', sans-serif;}

.rt1{
    color: #601662;
}

.f1{
    color: #5f9717;
}
.margin_top28{
    margin-top: 28%;
}


.f2{
    color: #f68a11;
}

.f5{
    color:  #ffffff;
    font-size: 45px;
}

.f05{
  color:  #ffffff;
}



.f3{
    color: #2814a0;
}


.margin_top22{
    margin-top: 22%;
}
.margin_top18{
    margin-top: 18%;
}

/* ==================== */
.calh1 {
    border: 1px solid #040d4eda;
    padding: 2px;
    border-radius: 0px 0px 0px 0px;
    /* background-color: #29d3ae21; */
    
}

/* .ol{
    text-decoration: underline;
  text-decoration-color: rgb(15 23 90);
  
} */



.t1-bg2 {
    background: linear-gradient(135deg, #121372 0%,#0056f7 100%);
    display: inline-block;
    padding: 1.2% 6%;
    border-radius: 0px;
    text-transform: uppercase;
    margin-top: 5px;
}

.t2-bg3 {
    background: linear-gradient(135deg, #121372 0%,#0056f7 100%);
    display: inline-block;
    padding: 1.2% 6%;
    border-radius: 0px;
    text-transform: uppercase;
    margin-top: 5px;
}

.strong u{
    color: rgb(243, 179, 45);
}


.main-banner-area .banner-main-img {
    display: none;
}

.main-banner-area.main-banner-area-one .banner-img {
    position: relative;
    z-index: 1;
    top: 0;
}

.t01{
    border: 2px solid #56a11c;
padding: 41px 21px 7px 76px;
border-radius: 10px;
background-color: #d6f1c1;
  }

  .banner__thumb {
    width: 600px;
    height: 555px;
    margin-left: auto;
    margin-bottom: -20px;
    position: relative;
    z-index: 1;
}


.banner__airound {
    position: absolute;
    top: 4px;
    left: 1px;
    max-width: 370px;
    animation: cir360 15s linear infinite;
    z-index: -1;
}

.banner__thumb .thumb {
    animation: none;
}
.banner__thumb .thumb {
    position: relative;
    animation: bns1 5s linear infinite;
}


.about-section {
    padding: 160px 0 172px;
}
.about-section .about_wrapper {
    position: relative;
}

.about-section .about_wrapper .about-image1 {
    position: absolute;
    left: -30px;
    top: -30px;
}

.about-section .about_wrapper .about-image2 {
    position: absolute;
    right: -22px;
    top: 322px;
}

.kk{
    top: 322px;
}

.ml{
    color:#0f175a;
}



/* '''''''''''''''''''''''''''''''' */

  
  .listar-map-button {
    width: 100%;
    position: absolute;
    display: table;
    right: 0;
    top: 0;
    height: 200px;
    line-height: 164px;
    white-space: nowrap;
    font-size: 0;
  }
  
  .listar-map-button {
    right: auto;
    /***
      box-shadow: 0 0 65px rgba(0,0,0,.07) inset, 0 0 35px rgba(0,0,0,.05) inset;**/
  }
  
  .listar-map-button-text span {
    background-color: #fff;
    color: #252525;
    text-shadow: none;
  }
  
  .listar-page-header-content .listar-map-button-text span {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: 15px;
    height: 44px;
    line-height: 1.6;
    padding: 10px 25px;
    box-shadow: 0 0 300px rgba(0, 0, 0, 0.65), 0 0 30px rgba(0, 0, 0, 0.06);
    border-radius: 50px;
    background-color: rgba(35, 40, 45, 0.9);
    color: #fff;
    text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
  }
  
  header .footer-wave {
    max-width: 102%;
    width: 100%;
    height: 187.8px;
    left: 0;
    z-index: 1;
    bottom: -67px;
    background: url(https://1.bp.blogspot.com/-NYl6L8pz8B4/XoIVXwfhlNI/AAAAAAAAU3k/nxJKiLT706Mb7jUFiM5vdCsOSNnFAh0yQCLcBGAsYHQ/s1600/hero-wave.png)
      repeat-x;
    animation: wave 10s cubic-bezier(0.44, 0.66, 0.67, 0.37) infinite;
  }
  
  @keyframes wave {
    0% {
      background-position: 0;
    }
    100% {
      background-position: 1440px;
    }
  }
  
  .listar-feature-item-wrapper {
    margin-bottom: 120px;
    padding-left: 27px;
    padding-right: 27px;
  }
  
  .listar-feature-item {
    height: calc(100% - 20px);
  }
  
  .listar-feature-item.listar-feature-has-link
    ~ .listar-feature-fix-bottom-padding.listar-fix-feature-arrow-button-height {
    position: relative;
    display: block;
    width: 100%;
    height: 30px;
  }
  
  .listar-feature-item a {
    position: absolute;
    top: 0px;
    left: 13px;
    width: calc(100% - 28px);
    height: calc(100% + 4px);
    border-radius: 1000px;
    z-index: 10;
  }
  
  .listar-feature-with-image .listar-feature-item a:before {
    content: "";
    position: absolute;
    top: -74px;
    left: 50%;
    margin-left: -74px;
    width: 148px;
    height: 148px;
    border-radius: 1000px;
    z-index: 10;
  }
  
  .listar-feature-item a:after {
    content: "";
    position: absolute;
    bottom: -7px;
    left: 50%;
    margin-left: -25px;
    width: 50px;
    height: 50px;
    border-radius: 1000px;
    z-index: 10;
    animation: ripple 0.7s linear infinite;
    box-shadow: 5px 5px 10px rgba(163, 177, 198, 0.6),
      -5px -5px 10px rgba(255, 255, 255, 0.5);
  }
  
  
  @keyframes ripple {
    0% {
          box-shadow: 0 0 0 0 rgba(163, 177, 198, 0.3), 0 0 0 1em rgba(163, 177, 198, 0.3), 0 0 0 3em rgba(163, 177, 198, 0.03), 0 0 0 5em rgba(163, 177, 198, 0.01);
    }
    100% {
      box-shadow: 0 0 0 1em rgba(163, 177, 198, 0.3), 0 0 0 3em rgba(163, 177, 198, 0.03), 0 0 0 5em rgba(163, 177, 198, 0.03), 0 0 0 8em rgba(163, 177, 198, 0.01);
    }
  }
  
  
  
  .listar-feature-item .listar-feature-item-inner {
    padding: 50px 30px;
    border-radius: 6px;
    z-index: 5;
    position: relative;
    height: 100%;
  }
  
  .listar-feature-item .listar-feature-item-inner {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  
  .listar-feature-item .listar-feature-item-inner:before {
    border: 0;
    box-shadow: 120px 0px 150px rgba(80, 80, 80, 0.15),
      10px 0px 10px rgba(80, 80, 80, 0.02);
    border-radius: 1000px;
    background: rgba(255, 255, 255, 0);
    background: -moz-linear-gradient(
      left,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0) 40%,
      rgba(255, 255, 255, 1) 100%
    );
    background: -webkit-gradient(
      left top,
      right top,
      color-stop(0%, rgba(255, 255, 255, 0)),
      color-stop(40%, rgba(255, 255, 255, 0)),
      color-stop(100%, rgba(255, 255, 255, 1))
    );
    background: -webkit-linear-gradient(
      left,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0) 40%,
      rgba(255, 255, 255, 1) 100%
    );
    background: -o-linear-gradient(
      left,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0) 40%,
      rgba(255, 255, 255, 1) 100%
    );
    background: -ms-linear-gradient(
      left,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0) 40%,
      rgba(255, 255, 255, 1) 100%
    );
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0) 40%,
      rgba(255, 255, 255, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#ffffff',GradientType=1);
  }
  
  .listar-feature-item .listar-feature-item-inner:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  
  /* .listar-feature-right-border {
    position: absolute;
    width: 100%;
    height: 100%;
    top: -12px;
    left: 50%;
    overflow: hidden;
  } */
  
  .listar-feature-items {
    text-align: center;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  
  /* .listar-feature-right-border:before,
  .listar-hovering-features
    .listar-feature-item
    a:hover
    ~ .listar-feature-item-inner
    .listar-feature-right-border:before {
    border: 11px solid #2f53bf;
  } */
  
  .listar-feature-right-border:before,
  .listar-hovering-features
    .listar-feature-item
    a:hover
    ~ .listar-feature-item-inner
    .listar-feature-right-border:before,
  .listar-hovering-features-grey
    .listar-feature-item
    a:hover
    ~ .listar-feature-item-inner
    .listar-feature-right-border:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 4px solid #258bd5;
    border-radius: 800px;
    left: 0%;
    box-shadow: 15px 20px 30px rgba(80, 80, 80, 0.12), 5px 0px 40px rgba(80, 80, 80, 0.1);
    background: #fff;
  }
  
  .listar-feature-item .listar-feature-block-content-wrapper {
    position: relative;
    display: block;
    text-decoration: none;
    margin: -30px;
    padding: 30px;
    height: calc(100% + 100px);
  }
  
  .listar-features-design-2 .listar-feature-item-wrapper {
    margin-bottom: 120px;
    padding-left: 27px;
    padding-right: 27px;
  }
  
  .listar-feature-item.listar-feature-has-link .listar-feature-item-inner:after {
    content: "";
    background-color: #fff;
    z-index: 6;
    position: absolute;
    background-repeat: no-repeat;
    background-position: center center;
  }
  
  .listar-feature-icon-wrapper {
    width: 148px;
    height: 148px;
    line-height: 148px;
    border-radius: 500px;
    position: relative;
    background-color: #fff;
    box-shadow: 8px 8px 30px rgba(0, 0, 0, 0.06);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 50%;
    vertical-align: middle;
    margin-left: -74px;
    top: 15px;
    margin-top: -74px;
  }
  
  .listar-feature-icon-inner {
    width: 120px;
    height: 120px;
    line-height: 120px;
    border-radius: 500px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.14);
    background: #fff;
  }
  
  .listar-feature-icon-inner div {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    display: inline-block;
    position: relative;
    width: 120px;
    height: 120px;
    line-height: 120px;
    text-align: left;
  }
  
  .listar-feature-icon-inner img {
    position: relative;
    margin: 0 auto;
    vertical-align: middle;
    display: inline-block;
    width: auto;
    left: 50%;
    -webkit-transform: translate(-50%);
    -moz-transform: translate(-50%);
    -ms-transform: translate(-50%);
    -o-transform: translate(-50%);
    transform: translate(-50%);
    height: 55px;
  }
  
  .listar-feature-item img,
  .listar-feature-item i {
    position: relative;
    display: inline-block;
    border-bottom: 0;
    font-size: 40px;
    top: 0;
    padding: 0;
    color: #258bd5;
  }
  
  .listar-feature-with-image .listar-feature-content-wrapper {
    top: 0;
  }
  .listar-feature-content-wrapper {
    position: relative;
    margin-top: -15.5px;
  }
  
  .listar-feature-item .listar-feature-item-title {
    padding-top: 0;
    margin: 0 0 30px;
    text-align: center;
    line-height: 1.5;
  }
  
  .listar-feature-item
    .listar-feature-item-title.listar-feature-counter-added
    > span {
    margin-left: 25px;
    border-radius: 0 50px 50px 0;
    color: rgb(2, 2, 2);
  }
  
  .listar-feature-item .listar-feature-item-title > span {
    box-shadow: 15px 20px 30px rgba(80, 80, 80, 0.12),
      5px 0px 40px rgba(80, 80, 80, 0.1);
    padding: 10px 20px;
    display: inline-block;
    position: relative;
    background-color: #fff;
  }
  
  .listar-feature-item .listar-feature-item-title > span span {
    box-shadow: 15px 15px 30px rgba(80, 80, 80, 0.2),
      5px 0px 80px rgba(80, 80, 80, 0.15);
    padding: 10px 0;
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 30px;
    white-space: nowrap;
    position: absolute;
    top: -3px;
    left: -40px;
    border-radius: 50px;
    background-color: #fff;
  }
  
  .listar-feature-item .listar-feature-item-title span {
    display: inline-block;
    font-size: 14px;
    line-height: normal;
    font-weight: 400;
    text-shadow: none;
    border-radius: 50px;
    color: #252525;
    font-size: 18px;
  }
  
  .listar-feature-item-excerpt {
    padding: 0 20px;
  }
  
  .listar-feature-item-excerpt {
    color: #252525;
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }
  
  /* .pset {
    
    background: url(../images/launch005.png)top no-repeat;
    padding: 2% 0 0%;
    background-size: cover;
 

    
  } */
  
  .listar-map-button-text span {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: 15px;
    height: 44px;
    line-height: 1.6;
    padding: 10px 25px;
    box-shadow: 0 0 31px rgba(0, 0, 0, 0.65), 0 0 4px rgba(0, 0, 0, 0.06);
    border-radius: 50px;
    background-color: rgba(35, 40, 45, 0.9);
    color: #fff;
    text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
  }
  
  .listar-map-button-text span {
    background-color: #fff;
    color: #252525;
    text-shadow: none;
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
  }
  
  .listar-map-button-text span:after {
    border: 12px solid #fff;
  }
  
  .listar-map-button-text span:after {
    content: "";
    position: absolute;
    top: -14px;
    left: -14px;
    width: calc(100% + 28px);
    height: calc(100% + 28px);
    border-radius: 36px;
  }
  
  .listar-map-button:hover .listar-map-button-text span {
    padding: 10px 43px 10px 51px;
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
  }
  
  .listar-feature-with-image .listar-feature-item a:before {
    content: "";
    position: absolute;
    top: -74px;
    left: 50%;
    margin-left: -74px;
    width: 148px;
    height: 148px;
    border-radius: 1000px;
    z-index: 10;
  }
  
  .listar-feature-item.listar-feature-has-link .listar-feature-item-inner:after {
    margin-left: -25px;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    box-shadow: 10px 10px 40px rgba(80, 80, 80, 0.15),
      15px 15px 30px rgba(80, 80, 80, 0.05), 0 0 120px rgba(80, 80, 80, 0.6);
    bottom: -30px;
    background-image: url("https://image.flaticon.com/icons/svg/2316/2316674.svg");
    background-size: 40%;
    color: #555;
    line-height: 52px;
  }
  
  @media(min-width:1200px){
    .iconbox07 {
      border-radius: 15px;
    background-color: rgb(233 255 253);
    box-shadow: 0px 0px 20px 0px rgb(78 203 0 / 35%);
    padding: 20px ! important;
    height: 224px ! important;
    background-image: url(../images/);
    }
    .iconbox07 {
      border-radius: 15px;
    background-color: rgb(255 221 0 / 0%);
    box-shadow: 0px 0px 10px 0px rgb(255 185 79);
    padding: 20px ! important;
    height: 224px ! important;
    }}


    .iconbox03 {
      border-radius: 15px;
      background-color: rgb(243 255 228);
      box-shadow: 0px 0px 20px 0px rgb(115 251 182);
      padding: 20px ! important;
      height: 224px ! important;
      
    }}

    
    @media(min-width:1200px){
      .iconbox007 {
        border-radius: 15px;
      background-color: rgb(233 255 253);
      box-shadow: 0px 0px 20px 0px rgb(78 203 0 / 35%);
      padding: 20px ! important;
      height: 224px ! important;
      background-image: url(../images/);
      }
      .iconbox007 {
        border-radius: 15px;
      background-color: rgb(233 255 253);
      box-shadow: 0px 0px 20px 0px rgb(78 203 0 / 35%);
      padding: 20px ! important;
      height: 224px ! important;
      }}


      .tp-hero .thumb-icon span.hero-icon-2 {
        position: absolute;
        top: 47%;
        right: 80px;
    }




    /*----------------------------------------*/
/*  04. hero CSS START
/*----------------------------------------*/
.tp-hero__bg {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding-top: 190px;
  padding-bottom: 30px;
}
.tp-hero__bg-2 {
  padding-top: 170px;
}
.tp-hero__title {
  font-weight: 600;
  font-size: 64px;
  color: var(--tp-common-white);
  line-height: 1.2;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero__title {
    font-size: 60px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__title {
    font-size: 55px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero__title {
    font-size: 50px;
  }
}
@media (max-width: 767px) {
  .tp-hero__title {
    font-size: 38px;
  }
}
.tp-hero__title-lg {
  font-weight: 600;
  font-size: 70px;
  color: var(--tp-common-white);
  line-height: 1.2;
}
.tp-hero__title-lg.theme-color {
  color: var(--tp-theme-1);
}
.tp-hero__title-lg span {
  color: var(--tp-theme-2);
  position: relative;
}
.tp-hero__title-lg span::before {
  position: absolute;
  bottom: 9px;
  left: 0;
  content: "";
  height: 5px;
  width: 100%;
  background-color: var(--tp-theme-2);
  display: inline-block;
  animation: section-animation 4s infinite;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero__title-lg {
    font-size: 60px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__title-lg {
    font-size: 55px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero__title-lg {
    font-size: 50px;
  }
}
@media (max-width: 767px) {
  .tp-hero__title-lg {
    font-size: 37px;
  }
}
.tp-hero__thumb-icon span {
  height: 80px;
  width: 80px;
  line-height: 80px;
  text-align: center;
  background-color: var(--tp-common-white);
  box-shadow: 0px 21px 89px rgba(4, 22, 49, 0.24);
  border-radius: 50%;
  display: inline-block;
}
.tp-hero__thumb-icon span.hero-icon-1 {
  position: absolute;
  top: 25%;
  left: 314px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__thumb-icon span.hero-icon-1 {
    left: 225px;
  }
}
.tp-hero__thumb-icon span.hero-icon-2 {
  position: absolute;
  top: 38%;
  right: 202px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__thumb-icon span.hero-icon-2 {
    right: 160px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero__thumb-icon span.hero-icon-2 {
    right: 70px;
  }
}
.tp-hero__contact a {
  font-weight: 400;
  font-size: 16px;
}
.tp-hero__contact a b {
  color: var(--tp-theme-1);
  transition: 0.3s;
}
.tp-hero__contact a b:hover {
  color: var(--tp-common-sky);
}
.tp-hero__img-1 {
  position: absolute;
  top: 16%;
  left: -28%;
  animation: tpupdown 1s infinite alternate;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__img-1 {
    left: 0;
  }
}
.tp-hero__img-2 {
  position: absolute;
  top: 25%;
  right: -24%;
  animation: tpleftright 1s infinite alternate;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero__img-2 {
    right: -30%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__img-2 {
    top: 60%;
    right: 0px;
  }
}
.tp-hero__wrapper-3 {
  margin-right: -80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__wrapper-3 {
    margin-right: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .tp-hero__wrapper-3 {
    margin-right: 0;
    width: 100%;
  }
}
.tp-hero__content-box p {
  padding-bottom: 25px;
}
.tp-hero__social {
  flex-direction: column;
  display: flex;
  position: absolute;
  bottom: 19%;
  right: 5%;
  overflow: hidden;
  padding-left: 120px;
}
.tp-hero__social a {
  height: 40px;
  width: 40px;
  border: 1px solid #EAB6CC;
  display: inline-block;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  color: var(--tp-theme-1);
  margin-top: 7px;
}
.tp-hero__social a:hover .social-icon {
  left: -70px;
  opacity: 1;
  visibility: visible;
}
.tp-hero__social a:hover .social-icon.facebook {
  left: -81px;
}
.tp-hero__social a:hover .social-icon.instagram {
  left: -88px;
}
.tp-hero__social a:hover .social-icon.dribbble {
  left: -80px;
}
.tp-hero__social .social-icon {
  position: absolute;
  top: -1px;
  left: -35px;
  padding: 12px 20px;
  background-color: var(--tp-common-white);
  border-radius: 30px;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
}
.tp-hero__social .social-icon span {
  display: flex;
  flex-direction: row;
  line-height: 0;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
  text-transform: capitalize;
}
.tp-hero__social .social-icon span i {
  margin-right: 10px;
}
.tp-hero__thumb-3 {
  height: 490px;
  width: 490px;
  position: relative;
  animation: tpupdown 1s infinite alternate;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero__thumb-3 {
    height: 450px;
    width: 450px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero__thumb-3 {
    margin-top: 80px;
    height: 100%;
    width: 100%;
  }
}
@media (max-width: 767px) {
  .tp-hero__thumb-3 {
    margin-top: 60px;
    height: 100%;
    width: 100%;
  }
}
.tp-hero__thumb-3 img {
  border-radius: 50%;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .tp-hero__thumb-3 img {
    width: 100%;
  }
}
.tp-hero__thumb-3::after {
  position: absolute;
  width: 100%;
  height: 100%;
  content: "";
  top: 0;
  left: 0;
  border: 1px dashed var(--tp-theme-2);
  border-radius: 50%;
  transform: scale(1.1);
}
.tp-hero__thumb-shape-1 {
  position: absolute;
  top: 25px;
  right: 10px;
  z-index: -1;
}
.tp-hero__thumb-shape-2 {
  position: absolute;
  bottom: 25px;
  left: 10px;
  z-index: -1;
}
@media (max-width: 767px) {
  .tp-hero__content-box p {
    font-size: 16px;
  }
}
.tp-hero__shape-3-1 {
  position: absolute;
  top: 35%;
  left: 0%;
  z-index: -1;
}
.tp-hero__shape-3-2 {
  position: absolute;
  top: 35%;
  right: 0%;
  z-index: -1;
}

.tp-header-bg {
  position: absolute;
  top: -100px;
  z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .tp-header-bg {
    top: 0px;
  }
}

.scroll-dots {
  position: absolute;
  left: 0;
  bottom: 14%;
  animation: tpupdown 0.6s infinite alternate;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .scroll-dots {
    bottom: 22%;
  }
}
.scroll-dots .circle-1, .scroll-dots .circle-2, .scroll-dots .circle-3 {
  border-radius: 50%;
  display: inline-block;
  margin-bottom: 8px;
}
.scroll-dots .circle-1 {
  height: 15px;
  width: 15px;
  background-color: rgba(255, 255, 255, 0.1);
}
.scroll-dots .circle-2 {
  height: 9px;
  width: 9px;
  background-color: rgba(255, 255, 255, 0.4);
}
.scroll-dots .circle-3 {
  height: 5px;
  width: 5px;
  background-color: white;
}
.scroll-dots .rotate-text {
  transform: rotate(90deg);
  margin-bottom: 100px;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.55em;
  text-transform: uppercase;
  color: #7C7EB1;
}
.scroll-dots .scroll-mouse {
  color: var(--tp-common-white);
  font-size: 35px;
  transform: rotate(180deg);
}
 

/* ============================ */


/* .half-bg-top-gray {
	height: 120px;
	width: 100%;
	background: #edf5ff;
	position: absolute;
	left: 0;
	top: 0;
} */

.box09 {
  width: 90%;
  margin: auto;
  max-width: 2000px;
  border-radius: 20px;
  box-shadow: 0 20px 50px rgb(0 0 0 / 10%);
}





.services-style-four-box {
	position: relative;
	z-index: 1;
	background: #014499;
	padding: 120px 30px;
	padding-bottom: 90px;
}

.services-style-four-box .single-item:nth-child(2) {
	margin-top: 50px;
}

@media only screen and (min-width: 1024px) {
	.services-style-four-box {
		width: 90%;
		margin: auto;
		max-width: 2000px;
		border-radius: 20px;
		box-shadow: 0 20px 50px rgb(0 0 0 / 10%);
	}

}

.services-style-four-box .shape-right-top {
	height: 100%;
	width: 50%;
	top: 50px;
}

.services-style-four img {
	width: 120px;
	margin-right: 30px;
	max-width: 120px;
	min-width: 120px;
}

.services-style-four {
	padding: 50px 37px;
	border-radius: 10px;
	background: var(--color-primary);
	display: flex;
	margin-bottom: 30px;
}

.services-style-four p {
	opacity: 0.8;
	margin: 0;
}


.shape-right-top {
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	background-size: contain;
	background-position: right top;
	background-repeat: no-repeat;
	z-index: -1;
}

.services-style-four {
  padding: 50px 37px;
  border-radius: 10px;
  background: var(--color-primary);
  display: flex;
  margin-bottom: 30px;
}

.services-style-four-box {
  width: 90%;
  margin: auto;
  max-width: 2000px;
  border-radius: 20px;
  box-shadow: 0 20px 50px rgb(0 0 0 / 10%);
}


.services-style-four-box {
	position: relative;
	z-index: 1;
	background: #ffffff;
	padding: 0px 30px;
	padding-bottom: 90px;
}

.services-style-four-box .single-item:nth-child(2) {
	margin-top: 50px;
}

@media only screen and (min-width: 1024px) {
	.services-style-four-box {
		width: 90%;
		margin: auto;
		max-width: 2000px;
		border-radius: 20px;
		box-shadow: 0 20px 50px rgb(0 0 0 / 10%);
	}

}

.services-style-four-box .shape-right-top {
	height: 100%;
	width: 50%;
	top: 50px;
}


.services-style-four img {
	width: 120px;
	margin-right: 30px;
	max-width: 120px;
	min-width: 120px;
}

.services-style-four {
	padding: 50px 37px;
	border-radius: 10px;
	background: #e1e1e14f;
	display: flex;
	margin-bottom: 30px;
  box-shadow: 0px 0px 10px 0px rgb(255 255 255);
}

.site-heading {
  margin-bottom: 0px;
  overflow: hidden;
  margin-top: 20px;
}

.services-style-four p {
	opacity: 0.8;
	margin: 0;
}

@media only screen and (min-width: 992px) {
	.process-style-four.info {
		padding-left: 80px;
	}
}

.info{
  color: white;
}

.process-style-four-area {
	overflow: hidden;
}

.process-style-four .thumb {
	position: relative;
	z-index: 1;
}

.process-style-four .thumb::after {
	position: absolute;
	left: -200px;
	bottom: 0;
	content: "";
	height: 400px;
	width: 400px;
	border: 100px solid #edf5ff;
	z-index: -1;
	border-radius: 50%;
}

.process-style-four>h4 {
	text-transform: capitalize;
	font-weight: 900;
	color: var(--color-primary);
}

.process-style-four h2 {
	font-weight: 900;
	margin-bottom: 30px;
}

.single-process {
	display: flex;
	background: var(--white);
	padding: 40px;
	box-shadow: 0 20px 50px rgb(0 0 0 / 10%);
	margin-top: 30px;
	border-radius: 20px;
}

.single-process .number {
	font-weight: 900;
	font-size: 17px;
	color: var(--color-heading);
	margin-right: 15px;
}

.single-process h4 {
	font-weight: 900;
}

.single-process p {
	margin: 0;
}

.single-process:nth-child(2n) {
	background: var(--bg-gradient);
	margin-left: 50px;
	margin-right: -50px;
}

.single-process:nth-child(2n) h4,
.single-process:nth-child(2n) a,
.single-process:nth-child(2n) .number {
	color: #ffffff;
}

.single-process:nth-child(2n) p {
	color: var(--white);
	opacity: 0.9;
}

.team-style-two-box .single-item {
	margin-bottom: 30px;
}

.team-style-two {
	position: relative;
}

.team-style-two .thumb {
	position: relative;
	z-index: 1;
}

.team-style-two .thumb img {
	border-radius: 50%;
	padding: 30px;
}

.team-style-two .thumb .shape {
	position: absolute;
	left: 50%;
	bottom: 25px;
	height: 90%;
	width: 90%;
	background-size: contain;
	background-repeat: no-repeat;
	z-index: -1;
	transform: translateX(-50%);
}

.team-style-two h4 {
	font-weight: 700;
	margin-bottom: 3px;
}

.team-style-two span {
	font-weight: 400;
	color: #959595;
}

/* ================================ */
.frame {
  height: 300px;
  width: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background-color: #a8ecffad;
}
.ellipse {
  position: absolute;
  height: 300px;
  width: 300px;
  border: 3px solid white;
  transition-property: all;
  transition-duration: 1s;
}
#box {
  position: absolute;
  height: 220px;
  width: 250px;
  color: white;
  text-align: center;
}
.btn {
  text-decoration: none;
  border: 5px solid white;
  background-color: white;
  border-radius: 5px;
  color: black;
}
#ellipse-1 {
  border-radius: 38% 62% 63% 37% / 41% 44% 56% 59%;
  animation-name: ellipse-1;
  animation-duration: 4s;
  animation-iteration-count: infinite;
}
#ellipse-2 {
  border-radius: 38% 62% 63% 37% / 41% 44% 56% 59%;
  transform: rotate(30deg);
  animation-name: ellipse-2;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}
#ellipse-3 {
  border-radius: 38% 62% 63% 37% / 41% 44% 56% 59%;
  transform: rotate(70deg);
  animation-name: ellipse-3;
  animation-duration: 8s;
  animation-iteration-count: infinite;
}
@keyframes ellipse-1 {
  0% {
    transform: rotate(360deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes ellipse-2 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes ellipse-3 {
  0% {
    transform: rotate(360deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.btn:hover {
  background-color: rgb(225, 225, 225);
  border-color: rgb(225, 225, 225);
}
.frame:hover .ellipse {
  background-color: white;
    border-color: #fffcfc;
    opacity: 0.5;
}

/* ================================================== */

h1 {
  text-align: center;
  margin: 50px auto 15px;
  color: #fff;
  
}

.main {
  width: 100%;
  min-height: 380px;
  text-align: center;
  position: relative;
  cursor: pointer;
}

.service {
  background: #fff;
  padding: 30px;
  border-radius: 10px;
  position: absolute;
  bottom: 0;
  z-index: 1;
  box-shadow: 0 0 20px -2px #030380;
  transition: transform .8s;
}

/* Mengatur posisi logo service */

.service-logo {
 width: 130px;
     height: 130px;
     border-radius: 50%;
     margin: -104px auto -157px;
     background: #fff;
     border: 18px solid #626262;
     display: flex;
     justify-content: center;
     align-items: center;
}

/* Membuat border title */
.service h4 {
  height: 35px;
  width: 80%;
  margin: 50px auto;
  background: #fff;
  position: relative;
}

.service h4::after,
.service h4::before {
  content: '';
  width: 40px;
  height: 30px;
 position: absolute;
 z-index: -1;
}

.service h4::after {
  background: linear-gradient(to right, #fff, #007bff);
  right: -5px;
  top: -5px;
}

.service h4::before {
  background: linear-gradient(to right, #007bff, #fff);
  left: -5px;
  bottom: -5px;
}


/* membuat shadow untuk service */
.main::after {
  content: '';
  height: 200px;
  width: 80%;
  background: #fff;
  position: absolute;
  border-radius: 10px;
  bottom: 0;
  left: 10%;
  z-index: -1;
  box-shadow: 0 0 20px -15px #030380;
  transition: transform .8s;
}
.main::before {
  content: '';
  height: 200px;
  width: 64%;
  background: #fff;
  position: absolute;
  border-radius: 10px;
  bottom: 0;
  left: 18%;
  z-index: -2;
}

.main:hover .service {
  transform: translateY(-50px);
}

.main:hover::after {
  transform: translateY(-25px);
}

.service-logo img {
  transition: transform 1s;
}

.main:hover .service-logo img {
  transform: rotate(360deg);
}

/* ================================================== */

.iconbox03 {
  border-radius: 15px;
  background-color: rgb(0 0 0);
  box-shadow: 0px 0px 20px 0px rgb(255 255 255);
  padding: 20px ! important;
  height: 224px ! important;
}


/* =============================== */

.big-box2 {
  width: 240px;
  height: 200px;
  border: 2px solid black;
  border-radius: 10px;
  position: absolute;
  right: 30px;
  margin-top: -47px;
}

.big-box6 {
  width: 240px;
  height: 230px;
  border: 2px solid black;
  border-radius: 10px;
  position: ;
  left: 70px;
}

.rocket-animation {
  position: absolute;
  right: 50px;
  top: -50px;
  animation: UpDown 2s linear infinite;
} 

/* =================== Roket Animation ============================= */
img.vert-move {
  -webkit-animation: mover 2s infinite  alternate;
  animation: mover 2s infinite  alternate;
}
img.vert-move {
  -webkit-animation: mover 2s infinite  alternate;
  animation: mover 1s infinite  alternate;
}
@-webkit-keyframes mover {
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
@keyframes mover {
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}

/* =========================================== */
.animate-pulse {
  animation: pulse 5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@import url('https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed');

/* .wrapper
{ 
  padding: 33px;     
}  */

@keyframes shadow-pulse
{
  0% {
    box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
  }
  100% {
    box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
  }
}

@keyframes shadow-pulse-big
{
  0% {
    box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1);
  }
  100% {
    box-shadow: 0 0 0 70px rgba(0, 0, 0, 0);
  }
}

.example-1
{
  float: left;
  margin: 40px;
  width: 130px;
  height: 130px;
  font: 13px/130px 'Barlow Semi Condensed', sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #fff;
  text-align: center;
  /* background: rgba(30, 144, 255, 0.6);
  border-radius: 50%; */
  animation: shadow-pulse 1s infinite;
}

/* =========================================== */

.tp-about{
  &__left-big-1{
      position: absolute;
      top: 10%;
      left: 0;
      z-index: -1;
  }
  &__img-wrapper{
      @media #{$md}{
          margin-left: 100px;
          margin-bottom: 70px;
      }
  }
  &__right-top-shape{
      position: absolute;
      top: 0%;
      right: 0;
      z-index: -1;
  }
  &__right-bottom-shape{
      position: absolute;
      bottom: -15%;
      right: 0;
  }
  &__img-1{
      position: absolute;
      top: 0;
      left: 0;
  }
  &__img-2{
      padding-top: 120px;
      padding-right: 50px;
      @media #{$xs}{
          padding-top: 0;
          padding-right: 0;
          margin-bottom: 40px;
      }
  }
  &__feature-box{
      @media #{$xs}{
          flex-wrap: wrap;
      }
  }
  &__shape-1{
      position: absolute;
      top: 35px;
      right: 120px;
      animation: animationglob 10s cubic-bezier(1, 0.99, 0.03, 0.01) infinite;
      @media #{$lg}{
          right: 40px;
      }
  }
  &__shape-2{
      position: absolute;
      top: 30px;
      left: 30px;
      z-index: 9;
      &::after{
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border: 1px dashed rgba(255, 255, 255, 0.6);
          content: '';
          border-radius: 50%;
          transform: scale(1.2);
      }
  }
  &__shape-3{
      position: absolute;
      bottom: 40px;
      left: 75px;
      z-index:9;
      animation: tptranslateY2 2s forwards infinite alternate;
      @media #{$lg}{
          left: 0;
      }
  }
  &__shape-4{
      position: absolute;
      top: 120px;
      left: -20px;
      z-index: 9;
      animation: tpupdown 0.8s infinite alternate;
  }
  &__right-wrapper{
      padding-left: 23px;
      @media #{$lg,$xs}{
          padding-left: 0;
      }
  }
  &__feature-icon{
      background: var(--tp-theme-1);
      border-radius: 5px 13px 5px 5px;
      display: inline-block;
      width: 40px;
      height: 40px;
      line-height: 38px;
      text-align: center;
      margin-right: 12px;
      &.yellow-bg-color{
          background-color: var(--tp-theme-2);
      }
  }
  &__feature-text{
      font-weight: 500;
      font-size: 16px;
      line-height: 54px;
      color: var(--tp-common-black);
  }
  &__feature-list{
      margin-right: 45px;
      @media #{$lg}{
          margin-right: 20px;
      }
      @media #{$xs}{
          margin-right: 0px;
          margin-bottom: 60px;
      }
      @media #{$sm}{
          margin-right: 30px;
          margin-bottom: 0px;
      }
      & ul{
          & li{
              font-weight: 400;
              font-size: 15px;
              line-height: 20px;
              color: #464859; 
              list-style-type: none;
              position: relative;
              padding-left: 30px;
              margin-bottom: 15px;
              @media #{$lg}{
                  font-size: 13px;
              }
              &:last-child{
                  margin-bottom: 0;
              }
              & span{
                  position: absolute;
                  top: 2px;
                  left: 0;
                  height: 18px;
                  width: 18px;
                  line-height: 20px;
                  text-align: center;
                  border-radius: 50%;
                  background-color: var(--tp-theme-1);
                  color: var(--tp-common-white);
                  display: inline-block;
                  font-size: 9px;
                  &.yellow-bg-color{
                      background-color: var(--tp-theme-2);
                  }
                  & i{
                      margin-left: 2px;
                  }
              }
          }
      }
  }
  &__feature-box{
      padding-bottom: 35px;
  }
  &__feature-mpbs{
      position: relative;
      &::after{
          position: absolute;
          top: -27px;
          left: 0;
          width: 4px;
          height: 83px;
          background-color: var(--tp-theme-2);
          content: "";
      }
      & span{
          font-weight: 700;
          font-size: 59px;
          letter-spacing: 0.01em; 
          color: var(--tp-theme-1);
          font-family: var(--tp-ff-mulish);
          padding-left: 25px;
          & em{
              font-weight: 300;
              font-size: 26px;
              font-style: normal;
              transform: translateY(-40px);
              display: inline-block;
          }
          & i{
              font-weight: 500;
              font-size: 25px;
              letter-spacing: 0.03em;
              color: var(--tp-common-black);
              font-style: normal;
          }
      }
  }
  &__title-box{
      & .tp-section-title{
          padding-bottom: 30px;
      }
  }
  &__text{
      & p{
          position: relative;
          padding-left: 15px;
          padding-bottom: 10px;
          @media #{$xs}{
              padding-left: 0;
              &::after{
                  display: none;
              }
          }
          &::after{
              position: absolute;
              top: 7px;
              left: 0;
              width: 2px;
              height: 43px;
              background-color: var(--tp-theme-2);
              content: "";
          }
      }
  }
  &__feature-list-wrap{
      margin-bottom: 50px;
      @media #{$xs}{
          flex-wrap: wrap;
      }
      @media #{$sm}{
          display: flex;
          align-items: center;
      }
  }
  &__author-avata{
      position: relative;
      margin-right: 32px;
      &::after{
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border: 1px solid var(--tp-theme-1);
          content: '';
          border-radius: 50%;
          transform: scale(1.3);
      }
  }
  &__author-signature{
      margin-right: 25px;
  }
  &__signature-date{
      & span{
          font-weight: 400;
          font-size: 16px;
          color: #535353; 
      }
  }
}
.tp-about-2{
  &__bg {
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
  }
  &__title-shape{
      position: absolute;
      top: 23%;
      left: 18%;
      & svg{
          animation: section-animation 4s infinite;
      }
      @media #{$md}{
          left: 13%;
      }
  }
  &__icon{
      margin-right: 30px;
      animation: animationglob 30s cubic-bezier(1, 0.99, 0.03, 0.01) infinite;
  }
  &__feature-list{
      background-color: #F5F7FA;
      padding: 25px 30px;
      border-radius: 11px;
      & ul{
          & li{
              font-weight: 400;
              font-size: 15px;
              line-height: 20px;
              color: #445658;
              list-style-type: none;
              position: relative;
              padding-left: 18px;
              margin-bottom: 10px;
              @media #{$xs}{
                  font-size: 14px;
              }
              &:last-child{
                  margin-bottom: 0;
              }
              &::after{
                  position: absolute;
                  content: '';
                  top: 6px;
                  left: 0;
                  width: 6px;
                  height: 6px;
                  background-color: var(--tp-theme-1);
                  content: '';
              }
          }
      }
  }
  &__info{
      & span{
          position: absolute;
          top: 12px;
          right: 0;
      }
  }
  &__feature-wrap{
      margin-bottom: 40px;
  }
  &__main-img{
      filter: drop-shadow(0px 4px 12px rgba(0, 0, 0, 0.15));
      @media #{$md}{
          text-align: center;
          margin-bottom: 100px;
      }
  }
  &__sub-img-1{
      position: absolute;
      bottom: -20px;
      right: 65px;
      @media #{$lg}{
          right: 20px;
      }
      filter: drop-shadow(0px 4px 12px rgba(0, 0, 0, 0.15));
      & a{
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%,-50%);
          height: 70px;
          width: 70px;
          background-color: var(--tp-theme-1);
          text-align: center;
          line-height: 73px;
          color: var(--tp-common-white);
          border-radius: 50%;
          animation: pulse 2s infinite;
          & i{
              margin-left: 3px;
          }
          &::after{
              position: absolute;
              content: '';
              top: 3px;
              right: 3px;
              width: 100%;
              height: 100%;
              border: 1px solid var(--tp-common-white);
              border-radius: 50%;
          }
      }
  }
  &__shape-1{
      position: absolute;
      top: -22px;
      left: -22px;
      z-index: -1;
      animation: tptranslateX2 2s forwards infinite alternate;
      @media #{$md}{
          left: 120px;
      }
  }
  &__shape-2{
      position: absolute;
      top: 40px;
      right: 75px;
      z-index: -1;
      animation: animationglob 30s cubic-bezier(1, 0.99, 0.03, 0.01) infinite;
  }
  &__left-author-info{
      position: absolute;
      top: 20px;
      left: 45px;
  }
  &__left-author-info{
      & span{
          font-weight: 400;
          font-size: 14px;
          color: var(--tp-theme-1);
          font-family: var(--tp-ff-mulish);
          & em{
              font-weight: 400;
              font-size: 17px;
              color: var(--tp-common-black);
              font-family: var(--tp-ff-mulish);
              font-style: normal; 
          }
      }
  }
  &__exprience{
      background-color: var(--tp-theme-1);
      display: inline-block;
      padding: 30px 17px;
      text-align: center;
      position: absolute;
      bottom: 95px;
      left: -25px;
      @media #{$md}{
          left: 100px;
      }
      & span{
          display: block;
      }
      & .child-one{
          font-style: italic;
          font-weight: 800;
          font-size: 47px;
          text-transform: lowercase;
          text-shadow: 0px 4px 34px rgba(161, 134, 177, 0.25);
          color: var(--tp-common-white);
          font-family: var(--tp-ff-mulish);
          margin-bottom: 22px;
      }
      & .child-two{
          font-weight: 400;
          font-size: 14px;
          text-transform: lowercase;
          text-shadow: 0px 4px 34px rgba(161, 134, 177, 0.25);
          color: var(--tp-common-white);
      }
      & .child-three{
          height: 25px;
          width: 44px;
          background-color: var(--tp-theme-1);
          display: inline-block;
          position: absolute;
          bottom: -25px;
          left: 0;
          clip-path: polygon(100% 0, 0 0, 100% 100%);
      }
  }
  &__bg-shape{
      position: absolute;
      bottom: -70px;
      right: 40px;
      transform: rotate(10deg);
      z-index: -1;
  }
}
.tp-about-2{
  &__left-wrap{
      @media #{$xl}{
          margin-left: 20px;
      }
      @media #{$lg}{
          margin-left: 30px;
      }
      @media #{$xs}{
          margin-bottom: 100px;
      }
      @media #{$sm}{
          margin-left: 50px;
      }
  }
  &__avata{
      flex: 0 0 auto;
      padding-right: 20px;
  }
  &__author-box{
      @media #{$lg}{
          flex-wrap: wrap;
      }
  }
  &__btn{
      flex: 0 0 auto;
      @media #{$xs}{
          margin-bottom: 0;
      }
      
  }
  &__btn-box{
      flex-wrap: wrap;
  }
}
.tp-about-3{
  &__bg-shape{
      position: absolute;
      top: 0;
      left: 0;
      width: 745px;
      height: 640px;
      background-color: #FCF1EC;
      @media #{$xxl}{
          width: 635px;
      }
      @media #{$xl}{
          width: 490px;
      }
  }
  &__customize{
     & .tp-about__shape-1 {
          position: absolute;
          top: 20px;
          right: 70px;
      }
      & .tp-about__img-1{
          & img{
              border: 11px solid var(--tp-common-white);
              filter: drop-shadow(0px 4px 9px rgba(0, 0, 0, 0.07));
              border-radius: 0px 32px 0px 0px;
          }
      }
      & .tp-about__img-2{
          & img{
              border: 7px solid var(--tp-common-white);
              border-radius: 0px 0px 0px 34px;
          }
      }
  }
}

.tp-about-3{
  &__right-customize{
      & .tp-about__feature-list ul li span.yellow-bg-color{
          background-color: var(--tp-theme-2);
      }
      & .tp-about__feature-mpbs span{
          background-color: rgba(185, 190, 208, 0.18);
          padding: 5px 15px;
          margin-left: 15px;
      }
  }
}


.tp-section-subtitle{
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--tp-theme-2);
  display: inline-block;
  font-family: var(--tp-ff-mulish);
  margin-bottom: 15px;
  &.section-subtitle-border{
      position: relative;
      &::after{
          position: absolute;
          bottom: 0px;
          left: 0;
          width: 100%;
          height: 2px;
          content: '';
          background-color:rgba(255, 179, 2, 0.38) ;

      }
  }
}
.tp-section-title{
  font-weight: 700;
  font-size: 44px;
  text-transform: capitalize;
  color: var(--tp-common-black);
  line-height: 1.3; 
  display: inline-block;
  display: inline-block;
  @media #{$lg}{
      font-size: 40px;
  }
  @media #{$xs}{
      font-size: 35px;
  }
  & span{
      color: var(--tp-theme-2);
      & .tp-title-shape{
          position: absolute;
          bottom: -20px;
          left: 0;
          & svg{
              animation: section-animation 4s infinite;
          }
      }
      & .tp-title-shape-space{
          position: absolute;
          bottom: -20px;
          left: 8px;
      }
  } 
}

/* ======================== */

.clr-grad-4 {
  background: linear-gradient(86deg, #f970fe 1.21%, #c53cc3 21.78%, #2452ae 71.65%, #1f6ad1 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


/* ============================================== */
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Open Sans",sans-serif;
}

/* body{
  background: #786fa6;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
} */

.newsletter {
  background: linear-gradient(125deg, #fffefe, #ffffff);
    width: 390px;
    padding: 5px;
    text-align: center;
    box-shadow: 0 0 20px #00000060;
   
    border-radius: 30px;
    border: dotted;
}

.newsletter h1{
  /* text-transform: uppercase; */
  color: #fff;
  font-size: 48px;
  line-height: 40px;
}

.newsletter h1 span{
  display: block;
  font-size: 38px;
}

.newsletter p{
  color: #000134;
    font-size: 55px;
    margin: -5px 0px 15px 16px;
}


.txtb{
  width: 100%;
  height: 70px;
  background: #f1f1f199;
  border-radius: 40px;
  position: relative;
  margin-top: 40px;
}

.txtb input{
  width: 100%;
  height: 70px;
  border-radius: 40px;
  border: 0;
  background: none;
  padding: 0 30px;
  outline: none;
  font-size: 15px;
  padding-right: 80px;
}

.txtb button{
  background: #574b90;
  border: 0;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  right: 10px;
  top: 10px;
  outline: none;
  cursor: pointer;
  color: #fff;
  transition: 0.3s linear;
}

.txtb button:hover{
  opacity: .5;
}

/* ============================================== */

/* * {
    padding: 0;
    margin: 0;
    font-family: roboto, verdana;
    
}
*:focus {
    outline: none;
}
body {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #333;
    background-repeat: no-repeat;
    height: 100vh;
}*/
.outer {
  border: 1px solid gray; 
  height: ;
  background: linear-gradient(45deg, pink, lightblue);
  padding: 20px 10px;
  box-shadow: 10px 10px 10px #555;
  animation:;
}
.outer h1, h4 {
  text-align: center;
  color: #333;
  font-family: Monaco;
  
}
.outer h1 {
  background: linear-gradient(30deg, blue, red);
  -webkit-background-clip:text;
  color: transparent;
  font-weight: 800;
  font-family: inherit;
}
.inner {
  padding: 0;
  margin-bottom: 10px;
  font-size: 1.5rem;
  font-family: Comic Sans;
}
.inner p {
  text-align: center;
  
}

.inner i {
  color: black;
  opacity: .6;
  line-height: 1.5rem;
  padding: 9.5px;
  background: transparent;
  position: relative;
  top: 2px;
  border: 1px solid transparent;
  box-shadow: 5px 5px 20px gray;
}
.in {
  margin-top: 10px;
  padding: 10px 7px;
  border: 1px solid gray;
  border-right: none;
  width: 12em;
  font-size: 1.2rem;    
  background: transparent;
  box-shadow: ;
  display: inline-block;
}
.in:focus {
  border: 1px solid pink;
  border-right: none;
  box-shadow: 5px 5px 20px hotpink;
}
.btn {
  padding: 5px 5px;
  margin: 15px 15px 0px 15px;
  width: 10em;
  background: linear-gradient(40deg, lightblue, pink);
  border: 1px solid gray;
  border-radius: 5px;
  font-size: 1.2rem;
  transition: .5s 0s ease-out;
  box-shadow: 5px 5px 20px gray;
}
.btn:hover {
  background: linear-gradient(30deg, blue, red);
  color: white;
  font-size: 1.7rem;
}
.outer p:nth-child(3) {
  font-size:.8rem;
  margin-top: 10px;
}


/* ====================================================== */

/*==================== GOOGLE FONTS ====================*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap');

/*==================== VARIABLES CSS ====================*/
:root {
    /*========== Colors ==========*/
    --text-color: #000000;
    --bg-color: #282828;

    /*========== Font and typography ==========*/
    --body-font: 'Poppins', sans-serif;
    --normal-font-size: .938rem;

}

@media screen and (min-width: 968px) {
    :root {
        --normal-font-size: 1rem;
    }
}

/*==================== BASE ====================*/
*,
*:after,
*:before {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

/* body {
    font-size: var(--normal-font-size);
    background-color: var(--bg-color);
    color: var(--text-color);
    font-weight: 400;
    font-family: var(--body-font);
    transition: all 0.2s ease;
} */

/*==================== REUSABLE CSS CLASSES ====================*/
/* .container {
    max-width: 1140px;
    width: 100%;
    margin: 0 auto;
    padding: 3rem 0;
    min-height: 100vh;
    display: grid;
    place-items: center;
} */

/*==================== SERVICE CARD ====================*/

.card__container {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
    width: 100%;
    max-width: 90%;
    margin: 40px auto;
}
.card__bx {
    --bg-clr: #282828;
    --txt-clr: #ffffff;
    --btn-txt-clr: #333333;
    --transition: all 0.5s;

    font-family: 'Poppins', sans-serif;
    height: 400px;
    width: 300px;
    overflow: hidden;
    border-radius: 20px;
    border-top-left-radius: 70px;
    position: relative;
    overflow: hidden;
    background: var(--clr);
    transition: var(--transition);
}
.card__1 {
    --clr: #ff3131;
}
.card__2 {
    --clr: #ff1f6b;
}
.card__3 {
    --clr: #98ff21;
}
.card__bx .card__data {
    position: absolute;
    inset: 10px;
    border-radius: 10px;
    background: var(--bg-clr);
}
.card__bx .card__data .card__icon {
    position: absolute;
    top: 0;
    left: 0;
    border-bottom-right-radius: 50%;
    height: 140px;
    width: 140px;
    background: var(--clr);
}
.card__bx .card__data .card__icon::before {
    content: '';
    position: absolute;
    bottom: -30px;
    left: 0;
    height: 30px;
    width: 30px;
    border-top-left-radius: 30px;
    background: transparent;
    box-shadow: -5px -5px 0 5px var(--clr);
}
.card__bx .card__data .card__icon::after {
    content: '';
    position: absolute;
    right: -30px;
    top: 0;
    height: 30px;
    width: 30px;
    border-top-left-radius: 30px;
    background: transparent;
    box-shadow: -5px -5px 0 5px var(--clr);
}
.card__bx .card__data .card__icon .card__icon-bx {
    position: absolute;
    inset: 10px;
    border-radius: 10px;
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 60px;
    background: var(--bg-clr);
    color: var(--clr);
}
.card__bx:hover .card__data .card__icon .card__icon-bx {
    background: var(--clr);
    color: var(--txt-clr);
    transition: var(--transition);
}
.card__bx .card__data .card__content {
  position: absolute;
  top: 130px;
  padding: 32px;
  text-align: center;
  display: flex
;
  justify-content: center;
  flex-direction: column;
  gap: -4px;
  color: var(--txt-clr);
}
.card__bx .card__data .card__content h3 {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: ;
}
.card__bx .card__data .card__content p {
    font-size: 14px;
    opacity: 0.75;
}
.card__bx .card__data .card__content a {
  display: inline-flex
  ;
      align-self: center;
      padding: 1px 26px;
      text-decoration: none;
      text-transform: uppercase;
      font-size: 16px;
      font-weight: 600;
      border-radius: 30px;
      border: 2px solid var(--clr);
      color: var(--btn-txt-clr);
      background: var(--clr);
      transition: var(--transition);
}
.card__bx .card__data .card__content a:hover {
    background: transparent;
    color: var(--clr);
}

/* ============================================================== */
h1{
  margin:10px 0;
  font-size:25px;
  color:#333;
}
.service-box{
  padding:20px;
  margin-bottom:20px;
  border: 5px solid #d3d3d3;
}
.service-box .service-icon{
  text-align: center;
    background: #FF7E20;
    border-radius: 10px;
    font-size: 80px;
    color: #fff;
    width: 60%;
    height: 85px;
    margin: 0 auto;
    line-height: 157px;
    transform: rotate(0deg);
    transition: all 0.99s ease 0s;
    
}
.service-box .service-icon i{
  transform:rotate(0deg);
  transition: transform 1s linear 0s;
}

.service-box .service-detail h3{
  text-align:center;
  font-weight:bold;
}
.service-box .service-detail p{
  text-align:center;
  display: block;
  font-size:14px;
}
.service-box:hover  .service-icon{
  transform:rotate(360deg);
}
.service-box:hover  .service-icon i{
  transform:rotate(-360deg);
}

/* =================================================== */

.bestAI {
  background: linear-gradient(59deg, #e180ff, #5c6cff);
    -webkit-background-clip: text;
    color: transparent;
    font-weight: 800;
    font-family: inherit;
}