body,html{
overflow-x: hidden !important;
padding: 0;
margin: 0;
background: var(--whiteColor);
font-family: 'Inter', sans-serif;
position: relative;
}
h1,h2,h3,h4,h5,h6{
font-family: 'Montserrat', sans-serif !important;
}
/*--------------------------------------------------------------
# Button common css
--------------------------------------------------------------*/
.btn-common{
background: var(--btngradian);
border: 1px solid var(--btngradian);
color: var(--whiteColor);
border-radius: var(--reducesix);
box-shadow: none !important;
outline: none !important;
}
/*--------------------------------------------------------------
# back to top
--------------------------------------------------------------*/
#js-top {
position: fixed;
bottom: -200px;
right: 20px;
padding:10px;
z-index:1000000;
outline:none;
box-shadow:none;
border-radius:5px;
background:#198900;
border:1px solid rgba(0,0,0,0);
z-index:100000;
transition: all 0.4s ease;
}
#js-top i{
color:var(--whiteColor);
z-index:100000;
font-size: 26px;
}
#js-top:hover span{
color:#ffff;
}
#js-top:hover {
background:var(--btngradian);
border:1px solid rgba(0,0,0,0);
}
/*--------------------------------------------------------------
# All section gapping
--------------------------------------------------------------*/
.card-section,.contact-section,.unlock,.transform,.bill-subscription,.footer{
margin-top: 120px;
}
.engagevideo{
margin-top: 80px;
}
.subscription,.workflow{
padding-top: 130px;
}
/*--------------------------------------------------------------
# Hero css
--------------------------------------------------------------*/
.hero{
background-image: url(../img/section/hero-banner.webp);
}
.hero-left-content {
position: relative;
z-index: 5;
}
.hero-left-content h1{
font-weight: var(--fontWightSeven);
font-size: 78px;
line-height: 92px;
color: var(--alltextcolor);
word-wrap: break-word;
}
.hero-left-content p{
font-size: 24px;
font-weight: var(--fontWightFour);
line-height: 36px;
letter-spacing: 0em;
color: var(--pcolor);
width: 70%;
}
.hero-left-content .btn-wthfree{
height: 70px;
width: 234px;
font-size: 18px;
font-weight: var(--fontWightSeven);
border: 0px solid rgba(0,0,0,0);
transition: all 0.3s ease;
box-shadow: inset 0px 0px 1px 5px #176FE9 !important;
}
.hero-left-content .btn-wthfree:hover{
box-shadow: inset 0px 0px 1px 100px #084ba9 !important;
border: 1px solid rgba(0,0,0,0);
background: transparent;
color: #ffffff;
}
.vactor-arrow{
width: fit-content;
right: 0;
left: auto;
margin-right: -110px;
top: -90px;
position: absolute;
}
.vactor-circle{
float: right;
margin-right: 100px;
margin-top: 50px;
}
.hero-vector-mobile{
float: left !important;
margin-top: 50px !important;
margin-left: 300px !important;
}
.vactor-circle img{
border-radius: 300px;
box-shadow: 15px 28px 23px -9px rgba(0,0,0,1);
}
.vectoprblue{
width: fit-content;
top: -20px;
}
.vectoprblue img{
box-shadow: 36px 50px 65px -9px rgba(0,0,0,1);
border-radius: 300px;
}
/*--------------------------------------------------------------
#Card section css
--------------------------------------------------------------*/
.card-section .card .icon-img{
width: 99px;
height: 99px;
position: relative;
border-radius: var(--reducethirtyfive);
}
.card-section .card .icon-img img{
width: 52px;
height: 52px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.card-section .card{
padding: 40px 30px;
transition: var(--trasitionTimeeight);
border-radius: var(--reducefifty);
border: 2px solid var(--bodercolorCard)
}
.card-section .card:hover{
box-shadow: 0px 20px 80px 0px #176FE929;
border: 2px solid rgba(0,0,0,0);
}
.card-section .card .card-body{
padding: 0px;
height: 170px;
}
.card-section .card .card-title{
font-size: 30px;
font-weight: var(--fontWightSeven);
line-height: 36px;
letter-spacing: 0em;
text-align: left;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.card-section .card .card-body p{
font-size: 20px;
font-weight: var(--fontWightFour);
line-height: 30px;
letter-spacing: 0em;
text-align: left;
color: var(--cardpcolor);
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
/*--------------------------------------------------------------
# Unlock section css
--------------------------------------------------------------*/
.titlebox h1{
font-size: 60px;
font-weight: var(--fontWightSeven);
line-height: 92px;
letter-spacing: 0em;
color: var(--alltextcolor);
}
.titlebox p{
font-size: 24px;
font-weight: var(--fontWightFour);
line-height: 35px;
letter-spacing: 0em;
text-align: center;
}
.unlock .media{
border: none;
box-shadow: 0px 20px 20px 0px #0000000D;
border-radius: var(--reducefifty);
padding: 25px 20px;
}
.unlock .media .flex-grow-1{
font-size: 18px;
font-weight:var(--fontWightFour);
line-height: 28px;
letter-spacing: 0em;
color: var(--pcolor);
}
.unlock .media i{
color: #198900;
font-size: 24px;
}
.unlock .imgcard {
background: transparent !important;
border: none;
padding: 0px;
box-shadow: none !important;
}
.unlock .imgcard img {
box-shadow: 0px 20px 20px 0px #0000000D;
background: transparent;
border-radius: 400px;
width: 90%;
margin: 0 auto;
}
/*--------------------------------------------------------------
# subscription section css
--------------------------------------------------------------*/
.subscription .thumbnail{
position: relative;
border-radius: var(--reducefifty);
padding:60px 20px 60px 20px;
z-index: 100;
background: #176FE9;
}
.subscription .main-img-plane{
position: relative;
width: fit-content;
width:100%;
height:100%;
display:flex;
justify-content:center;
align-items:center;
}
.subscription .main-img-plane .planeimage{
z-index: 99;
position: relative;
width: 90%;
}
.subscription .main-img-plane .planeoverlay{
position: absolute;
width: 70%;
z-index: 0;
height: 100%;
top: 0px;
}
.subscription .transEli{
position: absolute;
right: 50px;
top: 20px;
z-index: -1;
}
.subscription .thumbnail h3{
font-size: 60px;
font-weight: var(--fontWightSeven);
line-height: 72px;
letter-spacing: 0em;
text-align:;
color: var(--whiteColor);
}
.subscription .thumbnail p{
font-size: 24px;
font-weight: var(--fontWightFour);
line-height: 35px;
letter-spacing: 0em;
text-align:;
color: var(--whiteColor);
}
.subscription .thumbnail .media{
font-size: 20px;
margin-top: 15px;
margin-bottom: 15px;
color: var(--whiteColor);
}
.subscription .thumbnail .media i{
border-radius: 1000px;
}
/*--------------------------------------------------------------
# bill-subscriptionkflow section css
--------------------------------------------------------------*/
.bill-subscription .sub-thum .thumbnail{
border: 1px solid rgba(0,0,0,0);
height: 760px;
border-radius: 20px;
padding-top: 30px;
padding-bottom: 30px;
padding-left: 10px;
transition: all 0.3s ease;
padding-right: 10px;
position: relative;
box-shadow: 0px 20px 70px 0px #176FE91F;
}
.bill-subscription .sub-thum .thumbnail:hover{
border: 1px solid var(--btngradian);
}
.bill-subscription .sub-thum .img-sub{
width: 99px;
height: 99px;
margin: 0 auto;
display: block;
margin-top: -75px;
position: relative;
border-radius: 100px;
}
.bill-subscription .sub-thum .img-sub img{
width: 50px;
height: 50px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.bill-subscription .sub-thum .thumbnail h1{
font-size:35px;
font-weight: var(--fontWightSeven);
line-height: 52px;
letter-spacing: 0em;
text-align: center;
margin-top: 20px;
}
.bill-subscription .sub-thum .thumbnail h2{
font-size: 35px;
font-weight: 700;
line-height: 52px;
letter-spacing: 0em;
text-align: center;
color:var(--btngradian);
}
.bill-subscription .sub-thum .thumbnail h2 span{
color: #30486A;
font-size: 18px;
font-weight: 600;
line-height: 35px;
letter-spacing: 0em;
text-align: left;
}
.bill-subscription .sub-thum .thumbnail .media{
font-size: 20px;
margin-top: 32px;
margin-bottom: 15px;
color: #30486A;
}
.bill-subscription .sub-thum .thumbnail .media i{
color: #198900;
}
.bill-subscription .btnStarted,.engagevideo .sub-thum-section .thumbnail .btnStarted{
box-shadow: none;
border: 1px solid var(--btngradian);
color: #30486A;
font-size: 20px;
background: #fff;
padding: 10px 0px;
margin-top: 20px;
outline: none !important;
box-shadow: none !important;
border-radius: 5px;
position: absolute;
bottom: 40px;
left: 0;
right: 0;
margin: 0 auto;
width: 170px;
}
.bill-subscription .sub-thum .thumbnail:hover .btnStarted,.engagevideo .sub-thum-section .thumbnail .btnStarted:hover{
background: var(--btngradian);
color: #fff;
}
/*--------------------------------------------------------------
# engageideo section css
--------------------------------------------------------------*/
.engagevideo .sub-thum-section .thumbnail{
border-radius: 20px;
transition: all 0.3s ease;
padding:40px 40px 10px 40px;
position: relative;
box-shadow: 0px 20px 70px 0px #176FE91F;
}
.engagevideo .sub-thum-section .thumbnail .btnStarted{
position: relative !important;
margin-top: 50px;
}
.engagevideo .sub-thum-section .thumbnail h1{
font-size: 40px;
font-weight: var(--fontWightSeven);
line-height: 52px;
letter-spacing: 0em;
text-align: left;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
}
.engagevideo .sub-thum-section .thumbnail h2{
font-size: 40px;
font-weight: var(--fontWightSeven);
line-height: 52px;
letter-spacing: 0em;
color: var(--btngradian);
}
.engagevideo .sub-thum-section .thumbnail p{
font-size: 20px;
font-weight: var(--fontWightFour);
line-height: 32px;
letter-spacing: 0em;
text-align: left;
}
/*--------------------------------------------------------------
# Workflow section css
--------------------------------------------------------------*/
.workflow{
}
.workflow .thumbnail{
background: var(--workflowbg);
position: relative;
border-radius: var(--borderworkflow);
padding: 10px 70px;
padding-bottom: 200px !important;
}
.workflow .thumbnail h1{
font-size: 60px;
font-weight: var(--fontWightSeven);
line-height: 92px;
letter-spacing: 0em;
color: var(--alltextcolor);
}
.workflow .content-flow h5{
display: flex;
flex-wrap: nowrap;
flex-direction: row;
font-size: 40px;
font-weight: var(--fontWightSeven);
line-height: 40px;
letter-spacing: 0em;
color: var(--alltextcolor);
}
.workflow .content-flow h5 span{
font-size: 50px;
font-weight: var(--fontWightSeven);
background: none !important;
color:#198900;
padding: 0px;
line-height: 32px;
letter-spacing: 0em;
text-align: left;
margin-top: 4px;
}
.workflow .content-flow p{
font-size: 20px;
font-weight: var(--fontWightFour);
line-height: 32px;
letter-spacing: 0em;
color: var(--pcolor);
padding-top: 10px;
}
.workflow .flowimg{
background:var(--whiteColor);
display: flex;
align-items: center;
justify-content: center;
margin-top: -40px;
border-radius: 30px;
height: 264px;
width: 264px;
overflow: hidden;
}
.workflow .flowimg img{
width: auto;
height: auto;
}
.vectorborder{
margin-top: -155px;
margin-left: 28px;
width: 57%;
}
.vecttorbodersecond{
margin-top: -107px;
}
.vectorwhte{
}
.vectorwhte img{
position: absolute;
top: 50%;
transform: translateY(-50%);
box-shadow: 36px 50px 65px -9px rgba(0,0,0,1);
border-radius: 300px;
}
.vectorelostra{
margin-top: -165px;
}
.workflow .thumbnail .media{
height: 170px;
}
.mobile-vector1 {
bottom: 450px !important;
right: 50px !important;
}
.vectorwhte img{
left: -95px;
}
/*--------------------------------------------------------------
# Transform section css
--------------------------------------------------------------*/
.transform .thumbnail{
position: relative;
border-radius: var(--reducefifty);
padding-top: 60px;
padding-bottom: 60px;
z-index: 100;
background: #176FE9;
}
.transform .transEli{
position: absolute;
right: 50px;
top: 20px;
z-index: -1;
}
.transform .thumbnail h2{
font-size: 60px;
font-weight: var(--fontWightSeven);
line-height: 72px;
letter-spacing: 0em;
text-align: center;
color: var(--whiteColor);
}
.transform .thumbnail p{
font-size: 24px;
font-weight: var(--fontWightFour);
line-height: 35px;
letter-spacing: 0em;
text-align: center;
color: var(--whiteColor);
}
.btn-letconnect{
background: var(--whiteColor);
font-size: 24px;
border-radius: var(--reducetw);
color: var(--letsconnectbtn);
height: 87px;
width: 241px;
font-weight: var(--fontWightSix);
border: 1px solid var(--whiteColor);
}
.btn-letconnect:hover{
border: 1px solid var(--whiteColor);
background: transparent;
color: var(--whiteColor);
}
/*--------------------------------------------------------------
# Footer section css
--------------------------------------------------------------*/
.footer .social-icon{
margin-top: 10px !important;
}
.footer .social-icon li{
list-style-type: none;
width: 25px;
height: 25px;
margin-left: 45px;
transition: var(--trasitionTime);
}
.footer .social-icon li a{
padding: 15px 28px;
border-radius: 100px;
position: relative;
border: 1px solid
#176FE9;
color: var(--socialcolor);
display: flex;
color:
#176FE9;
justify-content: center;
text-decoration: none;
transition: var(--trasitionTime);
}
.footer .social-icon li a i{
font-size: 24px;
}
.footer .social-icon li:hover a{
background: #198900;
color: var(--whiteColor);
}
/*--------------------------------------------------------------
# Responsive css
--------------------------------------------------------------*/
@media only screen and (max-width: 5092px) {
.hero{
padding-top: 250px;
background-repeat: no-repeat;
background-size: 30%;
background-position: 60% 100%;
position: relative;
padding-bottom: 0px;
}
}
@media only screen and (max-width: 4292px) {
.hero{
background-size: 38%;
}
}
@media only screen and (max-width: 3792px) {
.hero{
background-size: 45%;
}
}
@media only screen and (max-width: 3192px) {
.hero{
background-size: 50%;
background-position: 65% 100%;
}
}
@media only screen and (max-width: 2892px) {
.hero{
background-size: 57%;
}
}
@media only screen and (max-width: 2592px){
.hero {
background-position: 75% 100%;
background-size: 68%;
}
}
@media only screen and (max-width: 2180px) {
.hero{
padding-top: 250px;
background-repeat: no-repeat;
background-size:80%;
background-position: 100% 100%;
position: relative;
padding-bottom: 0px;
}
}
@media only screen and (max-width: 1699px) {
.hero {
background-size: 85%;
padding-bottom: 50px;
background-position: 100% 70%;
}
}
@media only screen and (max-width: 1399px) {
.hero .epilandfg{
width: 30%;
left:0px;
}
.hero .hero-vector-mobile{
margin-left: 150px !important;
}
.hero {
background-size: 90%;
padding-bottom: 0px;
}
.hero-left-content h1{
font-size: 60px;
}
.hero-left-content p {
font-size: 20px;
}
.hero-left-content .btn-wthfree {
height: 63px;
width: 231px;
font-size: 17px;
}
.card-section .card .icon-img {
width: 80px;
height: 80px;
}
.card-section .card .icon-img img {
width: 40px;
height: 40px;
}
.card-section .card .card-title {
font-size: 26px;
}
.card-section .card .card-body p {
font-size: 18px;
}
.contact-section .thumbnail h1 {
font-size: 35px;
line-height: 55px;
}
.contact-section .thumbnail p{
font-size: 20px;
}
.btn-letconnect {
font-size: 22px;
height: 70px;
width: 230px;
}
.titlebox h1 {
font-size: 55px;
}
.pricing-section h2 {
font-size: 55px;
line-height: 50px;
}
.pricing-section p, .pricing-section i {
font-size: 22px;
}
.workflow .content-flow h5{
font-size: 32px;
}
.workflow .content-flow h5 span {
font-size: 41px;
}
.transform .thumbnail h2 {
font-size: 55px;
line-height: 66px;
}
.workflow .thumbnail h1{
font-size: 50px;
line-height: 56px;
}
.workflow .content-flow p{
font-size: 18px;
}
}
@media only screen and (max-width: 1199px) {
.hero{
padding-top: 150px;
}
.hero .hero-green-boll{
bottom: auto;
right: auto;
right: -68px;
top: auto;
}
.hero-left-content h1{
font-size: 55px;
line-height: 70px;
}
}
@media only screen and (max-width: 1199px) {
.pricing-section .dolarimg img {
width: 200px;
height: 200px;
}
.pricing-section .dolarimg {
background: #fff;
width: 280px;
height: 280px;
}
.transform .contractiojoin{
width: 85%;
}
.workflow .flowimg{
width: 200px;
height: 200px;
}
.workflow .flowimg img {
width: 60%;
}
.vectorborder {
margin-top: -113px;
}
}
@media only screen and (max-width: 991px) {
.vectorwhte img {
top: 52%;
}
.workflow .thumbnail{
padding-bottom: 60px !important;
}
.bill-subscription .sub-thum .thumbnail{
height: auto;
padding-bottom: 105px;
}
.hero .epilandfg{
width: 15%;
left:0px;
}
.hero-left-content p {
width: 55%;
}
.hero {
background-size: 100%;
background-position: 100% 100%;
padding-bottom: 0px;
}
.hero-vector-mobile{
float: left !important;
}
.titlebox-mobile{
margin-bottom: -55px;
}
.mobile-vector1 {
bottom: 50px !important;
right: 50px !important;
}
.vectorwhte img{
left: -45px;
}
.unlock .imgcard img {
width: 50%;
margin: 0 auto;
}
.unlock .imgcard{
margin-top: 20px;
margin-bottom: 20px;
}
.hero::after{
content: "";
position: absolute;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
top: 0px;z-index: -1;
left: 0px;
}
.vectorborder{
display: none;
}
.workflow .thumbnail .flowimg.position-absolute{
position: relative !important;
}
.workflow .break21{
display: flex;
flex-direction: column-reverse;
}
.workflow .flowimg{
margin: 0 auto;
margin-top: 20px !important;
}
.workflow .thumbnail .media {
height: auto;
}
.workflow .thumbnail {
padding: 10px 40px;
}
}
@media only screen and (max-width: 768px) {
.hero .hero-green-boll {
bottom: 210px;
right: auto;
right: 11px !important;
}
.hero {
background-position: 100% 100%;
padding-bottom: 10px;
background-size: 92%;
}
.hero .hero-vector-mobile {
margin-left: 40px !important;
}
.vactor-arrow {
margin-right: 0px;
}
.contact-section .thumbnail {
height: auto;
padding: 35px !important;
}
.footer .social-icon{
float: left !important;
margin-top: 24px !important;
}
.footer .social-icon li{
margin-left: 0px;
margin-right: 40px;
}
.footer{
padding-bottom: 30px;
}
.unlock .imgcard img {
width: 55%;
}
.titlebox-mobile{
margin-bottom: -65px;
}
.pricing-section{
position: relative;
}
.vecto-mobile{
margin-top: 30px !important;
position: absolute;
z-index: 1;
right: -40px;
}
.hero {
background-position: 100% 100%;
padding-bottom: 85px;
background-size: 100%;
}
.hero {
padding-top: 130px;
}
.hero-left-content h1{
font-size: 45px;
line-height: 70px;
}
.hero-left-content p, .card-section .card .card-body p ,.contact-section .thumbnail p,.pricing-section p, .pricing-section i,.transform .thumbnail p ,.unlock .media .flex-grow-1,.subscription .thumbnail .media ,.engagevideo .sub-thum-section .thumbnail p, .bill-subscription .sub-thum .thumbnail .media,.workflow .content-flow p{
font-size: 18px;
}
.card-section .card .card-title,.bill-subscription .sub-thum .thumbnail h1, .engagevideo .sub-thum-section .thumbnail h1 ,.engagevideo .sub-thum-section .thumbnail h2, .workflow .content-flow h5 span {
font-size: 25px;
line-height: 32px !important;
}
.subscription .thumbnail h3,.workflow .thumbnail h1,.transform .thumbnail h2,.titlebox h1{
font-size: 40px;
line-height: 48px;
}
.contact-section .thumbnail h1,.workflow .content-flow h5 , .bill-subscription .sub-thum .thumbnail h2{
font-size: 30px;
line-height: 42px;
}
.btn-letconnect {
font-size: 18px;
height: 55px;
width: 200px;
}
.bill-subscription .btnStarted, .engagevideo .sub-thum-section .thumbnail .btnStarted{
width: 160px;
padding: 8px 0px;
font-size: 18px;
}
.subscription .thumbnail p {
font-size: 20px;
}
.pricing-section h2 {
font-size: 45px;
line-height: 40px;
}
.card-section,.contact-section,.unlock,.transform,.bill-subscription,.footer{
margin-top: 40px;
}
.engagevideo{
margin-top: 0px !important;
}
.subscription,.workflow{
padding-top: 60px;
}
}
@media only screen and (max-width: 576px) {
.bill-subscription .sub-thum .thumbnail .media {
margin-top: 15px;
margin-bottom: 15px;
}
.card-section .card .card-body{
height: auto;
}
.workflow .content-flow p {
line-height: 25px;
}
.mobilemediaj{
margin-top: -20px;
}
.bill-subscription .sub-thum .img-sub {
width: 80px;
height: 80px;}
.bill-subscription .sub-thum .img-sub img {
width: 40px;
height: 40px;
}
.bill-subscription .btnStarted, .engagevideo .sub-thum-section .thumbnail .btnStarted {
font-size: 15px;
padding: 8px 0px;
bottom: 40px;
width: 150px;
}
.navbar-brand img{
margin-top: -10px;
}
.subscription .main-img-plane{
margin-bottom: 50px;
}
.titlebox-mobile{
margin-bottom: -65px;
}
.pricing-section{
position: relative;
}
.vecto-mobile{
margin-top: 30px !important;
position: absolute;
z-index: 1;
right: -40px;
}
.card-section .card .icon-img {
width: 70px;
height: 70px;
}
.card-section .card .icon-img img {
width: 30px;
height: 30px;
}
.hero {
background-position: 100% 100%;
padding-bottom: 85px;
background-size: 100%;
}
.hero {
padding-top: 130px;
}
.footer .social-icon li a {
padding: 9px 20px;
}
.footer .social-icon li a i{
font-size: 20px;
}
.titlebox h1 {
margin-top: -30px;
}
.card-section,.contact-section,.unlock,.transform,.bill-subscription,.footer{
margin-top: 40px;
}
.engagevideo{
margin-top: 0px !important;
}
.subscription,.workflow{
padding-top: 60px;
}
.workflow .thumbnail h1 {
font-size: 30px;
line-height: 5px;
}
.workflow .flowimg img {
width: 50%;
}
.workflow .flowimg {
width: 150px;
height: 150px;
}
.hero-left-content h1{
font-size: 38px;
line-height: 50px;
}
.hero-left-content p, .card-section .card .card-body p ,.contact-section .thumbnail p,.pricing-section p, .pricing-section i,.transform .thumbnail p ,.unlock .media .flex-grow-1,.subscription .thumbnail .media ,.engagevideo .sub-thum-section .thumbnail p, .bill-subscription .sub-thum .thumbnail .media,.workflow .content-flow p{
font-size: 16px;
line-height: 28px;
}
.card-section .card .card-title,.bill-subscription .sub-thum .thumbnail h1, .engagevideo .sub-thum-section .thumbnail h1 ,.engagevideo .sub-thum-section .thumbnail h2, .workflow .content-flow h5 span {
font-size: 22px;
line-height: 28px !important;
}
.subscription .thumbnail h3,.workflow .thumbnail h1,.transform .thumbnail h2,.titlebox h1{
font-size: 32px;
line-height: 36px;
}
.contact-section .thumbnail h1,.workflow .content-flow h5 , .bill-subscription .sub-thum .thumbnail h2{
font-size: 22px;
line-height: 36px;
}
.btn-letconnect {
font-size: 18px;
height: 55px;
width: 200px;
}
.bill-subscription .btnStarted, .engagevideo .sub-thum-section .thumbnail .btnStarted{
width: 160px;
padding: 8px 0px;
font-size: 18px;
}
.subscription .thumbnail p ,.unlock .media i{
font-size: 18px;
line-height: 30px;
}
.titlebox p {
font-size: 20px;
line-height: 28px;
}
.pricing-section h2 {
font-size: 45px;
line-height: 40px;
}
}
@media only screen and (max-width: 536px) {
.subscription .thumbnail h3 {
word-break: break-word;
}
.hero-left-content p {
width: 95% !important;
}
.hero-left-content .btn-wthfree {
height: 50px;
width: 188px;
font-size: 14px;
}
}
@media only screen and (max-width: 472px) {
.workflow .thumbnail {
padding: 10px 20px;
}
.hero .hero-green-boll {
bottom: 53px;
}
.hero .hero-green-boll img{
width: 30px;
}
.mobile-vector1 {
bottom: 20px !important;
right: 20px !important;
}
.pricing-section .thumbnail{
padding-left: 25px !important;
padding-right: 25px !important;
}
}