@font-face {
    font-family: CircularStd;
    src: url(../fonts/CircularStd-Book.ttf);
    font-display: swap;
}
@font-face {
    font-family: AvertaStdBlackItalic;
    src: url(../fonts/AvertaStd-BlackItalic.ttf);
    font-display: swap;
}

body {
    font-family: CircularStd;
}

p,
li,
a {
    font-size: 16px;
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h5,
p,
ul,
li {
    margin: 0;
    color: #141A46;
}

.btn,
.btn:focus {
    border: 0;
    outline: 0;
    box-shadow: unset;
}

.form-control:focus {
    box-shadow: unset;
}

a {
    text-decoration: none;
}

h1 {
    font-size: 36px;
    font-family: CircularStd;
    font-weight: bold;
}

h1 span {
    color: #03AF80;
}

h2 {
    font-size: 30px;
    font-family: CircularStd;
    font-weight: bold;
}

h2 span {
    color: #03AF80;
}

h3 {
    font-size: 20px;
    font-family: CircularStd;
    font-weight: 600;
}

h3 span {
    color: #03AF80;
}

h4 {
    font-size: 18px;
    font-family: CircularStd;
    font-weight: 600;
}

h4 span {
    color: #03AF80;
}

.Topbar {
    /* background-image: url(../images/toolbarbg.webp); */
    /* background-image: url(../images/toolbarbg2.png); */
    /* background-image: url(../images/toolbarbg3.png); */
    background-color: #1c0f24;
    /* background-image: url(../images/toolbarbg6.png); */
    background-image: url(../images/toolbarbg7.svg);
    /* background-repeat: no-repeat;
    background-size: 100%; */
    padding: 12px 6px;
}
.cybersale {
    /* color:#50d5e6; */
    color:#FFCC40;
}
.cyberbtn {
    background:linear-gradient(50deg, #CF62FF , #039BAF);
    color: white;
    border-radius: 10px;
    padding: 4px 8px 4px 8px;
    font-weight: bold;
}
.christmasbtn {
    background:#FFCC40;
    color: black;
    border-radius: 10px;
    font-weight: 700;
    line-height: clamp(1rem, 0.929rem + 0.36vw, 1.25rem);
    /* font-size: clamp(0.625rem, 0.518rem + 0.54vw, 1rem); */
    font-size: 16px;
    /* padding: clamp(0.25rem, 0.143rem + 0.54vw, 0.625rem) clamp(0.25rem, 0.107rem + 0.71vw, 0.75rem); */
}
.christmasbtn:hover {
    color: white;
}
.pinkclr{
    color: #FF3464;
}
.gradient-text {
    font-size: 20px;
    background: linear-gradient(to right, #ff96ca , #75ecfe);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
.arrow-right {
    transform: rotate(268deg);
    height: 20px;
    width: 20px;
}

@media only screen and (max-width: 759px) {
    .Topbar h5,
    h4,
    .btn {
        font-size: 10px;
    }
    .animatio-btn {
        font-size: 12px;
    }
    .animatio-btn {
        width: 118px !important;
    }
    /* .lottie-wrapper span, .cyberbtn, .christmasbtn {
        font-size: 11px !important;
        top: 27px !important;
        left: 22px !important;
    } */
    .Topbarp {
        font-size: 13px !important;
    }
    .lottie-wrapper{
        width: 120px !important ;
    }
}

@media only screen and (min-width: 992px) {
    .w-lg-75 {
        width: 75%;
    }
}

@media screen and (max-width: 991px){
    .promoBox{
        height: 30px;
    }

    .save-text {
        font-size: 16px;
    }
    .nav_heading {
        font-size: 14px !important;
    }

    .nav_login, .fs-14922 li{
        font-size: 14px !important;
    }

}
@media screen and (max-width: 1200px){
    .nav_heading {
        font-size: 25px !important;
    }

    .hms{
        margin-left: 10px;
    }

}

@media screen and (max-width: 767px){
    .promoBox{
        height: 30px;
    }

    .save-text {
        font-size: 15px;
    }

    .save-text::before {
        display: none;
    }

    .save-text::after {
        display: none;
    }
    .christmasbtn {
        font-size: 13px;
    }
}
@media screen and (max-width: 620px){
    .boxPara{
        margin-top: 1.2rem !important;
         margin-bottom: 1rem !important;
    }

    .save-text {
        font-size: 14px;
        margin: 0px 26px;
    }
    .lottie-wrapper span{

    }
}
@media(max-width:992px){
    .features_list{
     display: grid !important;
     place-content: center;
    }
}
.lottie-wrapper {
    position: relative;
}

.limit-popup {
    /* background-image: url("assets/images/dottedbg.png"); */
    background-image: url(../images/dottedbg.png);
    background-repeat: no-repeat;
    background-size: cover;
}
.redcross {
    background-image: url(../images/redcross.svg) !important;
}
/* .lottie-wrapper span {
    position: absolute;
    top: 21px;
    left: 27px;
    font-size: 14px;
    color: #000;
    font-weight: bold;
} */

.cus_fixed-top{
    position: sticky;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
}
.mb-100 {
    margin-bottom: 160px;
}

.add {
    height: 90px;
    width: 970px;
    background-color: #898CA2;
}

.py-60 {
    padding-top: 60px;
    padding-bottom: 60px;
}

.my-60 {
    margin-top: 60px;
    margin-bottom: 60px;
}

.left {
    left: 20px;
}

.right {
    right: 20px;
}

.myLabel {
    color: #141A46;
    font-size: 16px;
    font-weight: 600;
}

.btr-4 {
    border-radius: 4px 4px 0 0;
}

.bbr-4 {
    border-radius: 0 0 4px 4px;
}

.fw-medium {
    font-weight: 500;
}

.successBox {
    padding: 10px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.0980392157);
    border-radius: 8px;
    border: 1px solid #03AF80;
    background-color: #E5F7F2;
}

.successBox .success {
    color: #03AF80;
}

.successBox .danger {
    color: #FF6268;
}

.dangerBox {
    padding: 10px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.0980392157);
    border-radius: 8px;
    border: 1px solid #FF6268;
    background-color: #F1E2E3;
}

.textGreen {
    color: #03AF80;
}

.textGreen:hover {
    color: #03AF80;
}

.text-justify {
    text-align: justify;
}

.textPrimary {
    color: #141A46;
}

.textPrimary:hover {
    color: #141A46;
}

#wLimitModal .headerBg {
    background-color: #F2F3F5;
}

#wLimitModal .headerBg .btnClose {
    position: absolute;
    top: 20px;
    right: 20px;
}

#wLimitModal h2 {
    color: #FF6268;
}

#wLimitModal .closeBtn {
    background-color: #141A46;
    color: #FFFFFF;
}

/* ===============================
User Profile Pro Style Start here
================================= */
.myProfile::after {
    border: 0;
    margin-left: 0;
}

.myProfileMenu {
    background-color: #FFFFFF;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1607843137);
    border-radius: 4px;
    border: none;
    margin-top: 2px;
}

.myProfileMenu .myMenuDrop {
    border-bottom: 1px solid #F2F3F5;
    padding: 0;
}

.myProfileMenu .myMenuDrop:is(:hover, :focus, :active) {
    background-color: #FFFFFF !important;
    color: #03AF80;
    padding: 0;
}

.myProfileMenu .myMenuDrop:is(:hover, :focus, :active) .settings {
    content: url(../images/settinghover.svg);
}

.myProfileMenu .myMenuDrop:is(:hover, :focus, :active) .billing {
    content: url(../images/billinghover.svg);
}

.myProfileMenu .myMenuDrop:is(:hover, :focus, :active) .logout {
    content: url(../images/logout.svg);
}

.shareArticle .pasteBtn {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.shareArticle .myinput {
    background-color: #F4F4F4;
    border: none;
}

.shareArticle .myinput::-moz-placeholder {
    color: #141A46;
}

.shareArticle .myinput:-ms-input-placeholder {
    color: #141A46;
}

.shareArticle .myinput::placeholder {
    color: #141A46;
}

/*================================
NavBar Style Start Here
================================== */
#mainNav, #secondryNav {
    background-color: #FFFFFF;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.04);
}

#mainNav .burger, #secondryNav .burger {
    cursor: pointer;
}

/* #mainNav .burger:hover, #secondryNav .burger:hover {
  content: url(../images/darrow.svg);
  transform: rotate(180deg);
} */
#mainNav .sidenav-toggled, #secondryNav .sidenav-toggled {
    transition: all 1s ease;
}

#mainNav .navbar-toggler, #secondryNav .navbar-toggler {
    border: 0;
}

#mainNav .navbar-toggler:focus, #secondryNav .navbar-toggler:focus {
    box-shadow: unset;
}

#mainNav .navbar-sidenav .nav-item .nav-link, #secondryNav .navbar-sidenav .nav-item .nav-link {
    color: #141A46;
    font-size: 16px;
    font-weight: 700;
}

/* Webkit-based browsers (Chrome, Safari, Edge on macOS and Windows) */
  /* width */
  ::-webkit-scrollbar {
    width: 10px;
  }
  /* Track */
  ::-webkit-scrollbar-track {
    background: white;
    /* box-shadow: inset 0 0 6px rgba(0, 0, 0, .5); */
  }
  /* thumb */
  ::-webkit-scrollbar-thumb {
    background: gray;
  }
/* Firefox (macOS and Windows)  */
.scroll-wrapper {
  scrollbar-width: thin; /* Makes the scrollbar thinner */
  scrollbar-color: #C1BEBE #E8E8E8; /* thumb color and track color */
}
#mainNav .navbar-sidenav .nav-item .active, #secondryNav .navbar-sidenav .nav-item .active {
    background-color: #141A46;
    color: #FFFFFF;
    border-radius: 10px;
}
#mainNav .navbar-sidenav .nav-item .activedrop, #secondryNav .navbar-sidenav .nav-item .active {
    font-weight: bold;
}

#mainNav .navbar-sidenav .nav-item .active img, #secondryNav .navbar-sidenav .nav-item .active img {
    filter: invert(82%) sepia(100%) saturate(1%) hue-rotate(97deg) brightness(104%) contrast(102%);
}

#mainNav .gopro, #secondryNav .gopro {
    background-color: #03AF80;
    border-radius: 6px;
    font-size: 18px;
    font-weight: 500;
    padding: 0px 10px;
}

#mainNav .gopro a, #secondryNav .gopro a {
    color: #FFFFFF;
}

/* #mainNav .gopro a:hover, #secondryNav .gopro a:hover {
    color: #FFFFFF;
} */
/* #mainNav .gopro a:hover, #secondryNav .gopro a:hover {
    color: black;
} */
#mainNav .gopro:hover, #secondryNav .gopro:hover {
    background-color: #141A46;
    color: white;
    /* border: solid 1px #057152; */
}
.btn-primaryGreen:hover {
    background-color: #141A46;
    color: white;
    /* border: solid 1px #057152; */
}
/* .btn-primaryGreen:hover img, .gopro:hover img {
    filter: brightness(0) saturate(100%) invert(6%) sepia(67%) saturate(2913%) hue-rotate(227deg) brightness(103%) contrast(96%);
} */

.apihover:hover {
    color: #03AF80 !important;
}

#mainNav .login, #secondryNav .login {
    background-color: #03AF80;
    border-radius: 6px;
    font-size: 18px;
    font-weight: 500;
    padding: 0px 10px;
}

#mainNav .login:hover, #secondryNav .login:hover {
    background-color: #141A46;
}

#mainNav .login a, #secondryNav .login a {
    color: #FFFFFF;
}

#mainNav .login a:hover, #secondryNav .login a:hover {
    color: #FFFFFF;
}

html {
    position: relative;
}

body {
    overflow-x: hidden;
}

/* body.fixed-nav {
    padding-top: 52px;
} */

.content-wrapper {
    min-height: calc(100vh - 52px);
    /* padding-top: 14px; */
    box-shadow: -2px 0px 2px 0px rgba(0, 0, 0, 0.04);
}

#mainNav .navbar-collapse {
    overflow: auto;
    max-height: 80vh;
}

#mainNav .navbar-collapse .navbar-nav .nav-item .nav-link {
    cursor: pointer;
}

#mainNav.fixed-top .sidenav-toggler {
    display: none;
}

.content-wrapper {
    /* overflow-x: hidden; */
    background: white;
}

body.sidenav-toggled .navbar-sidenav .nav-link-text {
    display: none;
}

body.sidenav-toggled .navbar-sidenav .nav-item,
body.sidenav-toggled .navbar-sidenav .nav-link {
    width: 55px !important;
}

body.sidenav-toggled .navbar-sidenav .nav-item:after,
body.sidenav-toggled .navbar-sidenav .nav-link:after {
    display: none;
}

.card-body-icon {
    position: absolute;
    z-index: 0;
    top: -25px;
    right: -25px;
    font-size: 5rem;
    transform: rotate(15deg);
}

body.sidenav-toggled .content-wrapper {
    margin-left: 66px;
}

#mainNav .navbar-collapse .navbar-sidenav {
    position: absolute;
    top: 0;
    left: 0;
    flex-direction: column;
    margin-top: 65px;
    /* background-color: #FFFFFF; */
    height: 90vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.apidrop li {
    border-left: 1px solid lightgray;
    padding-bottom: 5px;
}
.apidrop li a {
    margin-left: 8px;
}
/* #mainNav .navbar-collapse .navbar-sidenav~.bottomNav {
    height: 100vh;
    position: absolute;
    top: calc(100vh - 260px);
} */

#mainNav .navbar-collapse .navbar-sidenav>.nav-item {
    width: 230px;
    padding: 0;
}

#mainNav .navbar-collapse .navbar-sidenav>.nav-item>.nav-link {
    /* margin: 1em; */
        margin: 4px 1rem;
}

.content-wrapper {
    transition: all 0.1s ease-in-out;
}

@media (min-width: 992px) {
    #mainNav .navbar-collapse {
        overflow: visible;
        max-height: none;
    }

    #mainNav .navbar-collapse .navbar-sidenav {
        position: absolute;
        top: 0;
        left: 0;
        flex-direction: column;
    }

    #mainNav .navbar-collapse .navbar-sidenav~.bottomNav {
        position: absolute;
        top: calc(100vh - 260px);
    }

    #mainNav .navbar-collapse .navbar-sidenav>.nav-item {
        width: 230px;
        padding: 0;
    }

    #mainNav .navbar-collapse .navbar-sidenav>.nav-item>.nav-link {
        /* margin: 1em; */
            margin: 4px 1rem
    }

    .content-wrapper {
        margin-left: 230px;
        transition: all 0.1s ease-in-out;
    }
}

@media (min-width: 576px) {
    .card-columns {
        -moz-column-count: 1;
        column-count: 1;
    }
}

@media (min-width: 768px) {
    .card-columns {
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media (min-width: 1200px) {
    .card-columns {
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media (max-width: 992px) {

    body.sidenav-toggled .navbar-sidenav .nav-item,
    body.sidenav-toggled .navbar-sidenav .nav-link {
        display: none;
    }

    body.sidenav-toggled .content-wrapper {
        margin-left: 0;
    }
}

/*================================
Sign Pgaes Style Start Here
================================== */
#signPgae .logButtons {
    background-color: #F2F3F5;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 500;
    color: #141A46;
}

#signPgae .devider {
    position: relative;
    color: #141A46;
    font-weight: 500;
}

#signPgae .devider:before {
    content: "";
    background: #141A46;
    width: 46%;
    height: 1px;
    display: block;
    position: absolute;
    top: 50%;
    right: 54%;
    z-index: 0;
}

#signPgae .devider:after {
    content: "";
    background: #141A46;
    width: 46%;
    height: 1px;
    left: 54%;
    display: block;
    position: absolute;
    top: 50%;
}

#signPgae .myLabel {
    color: #141A46;
    font-weight: 500;
}

#signPgae .myInput {
    background-color: #F2F3F5;
    border-radius: 10px;
    border: 1px solid #F2F3F5;
    padding: 12px;
}

#signPgae .myInput::-moz-placeholder {
    color: #898CA2;
    font-size: 14px;
    font-weight: 500;
}

#signPgae .myInput:-ms-input-placeholder {
    color: #898CA2;
    font-size: 14px;
    font-weight: 500;
}

#signPgae .myInput::placeholder {
    color: #898CA2;
    font-size: 14px;
    font-weight: 500;
}

#signPgae .myInput:focus, #signPgae .myInput:hover, #signPgae .myInput:active {
    box-shadow: unset;
}

#signPgae .form-control.is-invalid, #signPgae .was-validated .form-control:invalid {
    border-color: #dc3545;
    box-shadow: unset;
}

#signPgae .loginBnt {
    background-color: #03AF80;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 500;
    color: #FFFFFF;
}

#signPgae .createLink {
    color: #141A46;
    font-weight: 500;
}

#signPgae .createLink a {
    color: #03AF80;
    font-weight: 500;
    text-decoration: underline;
}

#signPgae .forgetPass {
    color: #898CA2;
    cursor: pointer;
    text-decoration: underline;
}

#signPgae .guestLink {
    color: #898CA2;
    font-weight: 500;
}

#signPgae .login {
    min-height: 100vh;
}

#signPgae .bg-image {
    background-image: url("../images/logsign2.svg");
    background-size: 126% 135%;
    background-position: center center;
}

#signPgae .bg-forget {
    background-image: url("../images/forgotpass.webp");
}

#signPgae .bg-email {
    background-image: url("../images/checkmail.webp");
}

#signPgae .bg-passReset {
    background-image: url("../images/passreset.webp");
}

#signPgae .bg-newPass {
    background-image: url("../images/newpass.webp");
}

#signPgae .resendEmail {
    color: #898CA2;
    font-weight: 500;
}

#signPgae .resendEmail a {
    color: #03AF80;
    font-weight: 500;
}

#signPgae .backlogin {
    color: #03AF80;
    font-weight: 500;
}

.signpopUp .logButtons {
    background-color: #F2F3F5;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 500;
    color: #141A46;
}

.signpopUp .devider {
    position: relative;
    color: #141A46;
    font-weight: 500;
}

.signpopUp .devider:before {
    content: "";
    background: #141A46;
    width:44%;
    height: 1px;
    display: block;
    position: absolute;
    top: 50%;
    right: 56%;
    z-index: 0;
}

.signpopUp .devider:after {
    content: "";
    background: #141A46;
    width: 44%;
    height: 1px;
    left: 56%;
    display: block;
    position: absolute;
    top: 50%;
}

.signpopUp .myLabel {
    color: #141A46;
    font-weight: 500;
}

.signpopUp .myInput {
    background-color: #F2F3F5;
    border-radius: 10px;
    border: 1px solid #F2F3F5;
    padding: 12px;
}

.signpopUp .myInput::-moz-placeholder {
    color: #898CA2;
    font-size: 14px;
    font-weight: 500;
}

.signpopUp .myInput:-ms-input-placeholder {
    color: #898CA2;
    font-size: 14px;
    font-weight: 500;
}

.signpopUp .myInput::placeholder {
    color: #898CA2;
    font-size: 14px;
    font-weight: 500;
}

.signpopUp .myInput:focus, .signpopUp .myInput:hover, .signpopUp .myInput:active {
    box-shadow: unset;
}

.signpopUp .form-control.is-invalid, .signpopUp .was-validated .form-control:invalid {
    border-color: #dc3545;
    box-shadow: unset;
}

.signpopUp .loginBnt {
    background-color: #03AF80;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 500;
    color: #FFFFFF;
}

.signpopUp .createLink {
    color: #141A46;
    font-weight: 500;
}

.signpopUp .createLink a {
    color: #03AF80;
    font-weight: 500;
    text-decoration: underline;
}

/*================================
Pricing Plan Style Start Here
================================== */
.pricePlan {
    background-image: url(../images/bg.webp);
    background-repeat: no-repeat;
    background-size: 100% 35%;
}

.pricePlan .nav-pills .nav-link {
    color: #898CA2;
    font-weight: bold;
    padding: 8px 80px;
    border-radius: 0;
}

.pricePlan .nav-pills .active {
    color: #141A46 !important;
    background-color: transparent !important;
    border-bottom: 1px solid #03AF80;
    border-radius: 0;
}

.pricePlan .nav-pills .active img {
    filter: brightness(0) saturate(100%) invert(6%) sepia(67%) saturate(2913%) hue-rotate(227deg) brightness(103%) contrast(96%);
}

.pricePlan .radioBoxes {
    border-radius: 12px;
}

.pricePlan .radioBoxes .myRadio {
    width: 23px;
    height: 23px;
    position: absolute;
    top: 40px;
}

.pricePlan .radioBoxes .myRadio:checked {
    z-index: 99;
}

.pricePlan .radioBoxes .myRadio:checked:before {
    content: url(../images/radiocheck.svg);
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 0 !important;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel {
    border: 2px solid #03AF80;
    background: #141A46 !important;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel h4 {
    color: #FFFFFF;
    margin-top: 65px;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel p {
    color: #E2E2E2;
    cursor: auto;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel .durPrice {
    color: #03AF80;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel .durPrice span {
    color: #E2E2E2;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel .planBtn {
    background-color: #03AF80;
    color: #FFFFFF;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel .textBox {
    background-color: #12294C;
}

.pricePlan .radioBoxes .myRadio:checked+.radioLabel li {
    color: #FFFFFF;
}

/* .pricePlan .radioBoxes .myRadio:checked+.radioLabel .linethrough {
    color: #FFFFFF !important;
} */

.pricePlan .radioBoxes .radioLabel {
    border-radius: 12px;
    border: 0.5px solid #b8bac7;
    cursor: pointer;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1019607843);
}

.pricePlan .radioBoxes .radioLabel p, .pricePlan .radioBoxes .radioLabel h4, .pricePlan .radioBoxes .radioLabel li {
    cursor: auto;
}

.pricePlan .durPrice {
    color: #03AF80;
    font-size: 18px;
    font-weight: bold;
}

.pricePlan .durPrice span {
    font-size: 16px;
    font-weight: normal;
    color: #898CA2;
}

.pricePlan .ps-100 {
    padding-left: 90px !important;
}

.pricePlan .planBtn {
    background-color: #DBDCE2;
    color: #141A46;
    font-weight: 500;
    border-radius: 12px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.pricePlan .planBtn:hover {
    background-color: #03AF80;
    color: #FFFFFF;
}

.pricePlan .textBox {
    /* background-color: #FAFAFB; */
    background-color: #eeeeee;
    border-radius: 8px;
}

.pricePlan .textBox .infoText {
    font-size: 14px;
    font-weight: 500;
}

.pricePlan .textBox .infoNum {
    font-size: 14px;
    font-weight: 500;
    color: #03AF80;
}

.pricePlan .benifit {
    list-style: none;
}

.pricePlan .benifit li::before {
    content: url(../images/checked.svg);
    position: relative;
    padding-right: 10px;
}
.pricePlan .benifit .nonchecked::before {
    content: url(../images/nonchecked.svg) !important;
}
.pricePlan .benifit .nonchecked {
    text-decoration: line-through;
    font-weight: bold;
}

.pricePlan .mothlyBenifit {
    list-style: none;
}

.pricePlan .mothlyBenifit li::before {
    content: url(../images/checked.svg);
    position: relative;
    padding-right: 10px;
}

.pricePlan .mothlyBenifit li:first-child::before {
    content: url(../images/cross.svg);
}

.pricePlan .paymentMehod .paymentBox {
    cursor: pointer;
}

.pricePlan .paymentMehod .american:hover {
    content: url(../images/hoverexpress.svg);
}

.pricePlan .paymentMehod .discover:hover {
    content: url(../images/hoverdiscover.svg);
}

.pricePlan .paymentMehod .master:hover {
    content: url(../images/hovermaster.svg);
}

.pricePlan .paymentMehod .visa:hover {
    content: url(../images/hovervisa.svg);
}

/*================================
Billing Information Style Start Here
================================== */
.billingInfo {
    background-image: url(../images/bg.webp);
    background-repeat: no-repeat;
    background-size: 100% 92%;
    /* ==============================
  Detail Box Style Start Here
  ================================ */
}

.billingInfo .cardBox {
    background-color: #FFFFFF;
    border-radius: 16px;
    border: 1px solid #B8BAC7;
}

.billingInfo .cardBox .px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
}

.billingInfo .cardBox .cardText {
    color: #898CA2;
    font-size: 16px;
    font-weight: normal;
}

.billingInfo .cardBox .myInputs {
    background-color: #F2F3F5;
    border: 1px solid #D4D5D9;
    border-radius: 10px;
    padding: 10px;
    font-size: 16px;
}

.billingInfo .cardBox .myInputs:focus {
    background-color: #F2F3F5;
    border: 1px solid #D4D5D9;
    border-radius: 10px;
}

.billingInfo .cardBox .myInputs::-moz-placeholder {
    color: #898CA2;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.billingInfo .cardBox .myInputs:-ms-input-placeholder {
    color: #898CA2;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.billingInfo .cardBox .myInputs::placeholder {
    color: #898CA2;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.billingInfo .cardBox .myInputs .imgPos {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.billingInfo .cardBox .nameInputs::-moz-placeholder, .billingInfo .cardBox .cardInputs::-moz-placeholder {
    text-align: left;
}

.billingInfo .cardBox .nameInputs:-ms-input-placeholder, .billingInfo .cardBox .cardInputs:-ms-input-placeholder {
    text-align: left;
}

.billingInfo .cardBox .nameInputs::placeholder,
.billingInfo .cardBox .cardInputs::placeholder {
    text-align: left;
}

.billingInfo .cardBox .form-switch .form-check-input {
    width: 35px;
    height: 20px;
    background-color: #B8BAC7;
    box-shadow: unset;
    border: 2px solid #B8BAC7;
    background-image: url(../images/swichtchecked.svg);
}

.billingInfo .cardBox .form-switch .form-check-input:focus {
    background-image: url(../images/swichtunchecked.svg);
}

.billingInfo .cardBox .form-switch .form-check-input:checked {
    background-color: #03AF80;
    border: 2px solid #03AF80;
    background-image: url(../images/swichtchecked.svg);
}

.billingInfo .cardBox .updateBtn {
    background-color: #03AF80;
    color: #FFFFFF;
    padding: 12px 30px;
    border-radius: 10px;
}

.billingInfo .imgPos {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.billingInfo .detailBox {
    background-color: #FFFFFF;
    border: 1px solid #B8BAC7;
    border-radius: 16px;
}

.billingInfo .detailBox .dtailText {
    color: #141A46;
    font-size: 16px;
    font-weight: 400;
}

.billingInfo .detailBox .detailHd {
    border-bottom: 1px solid #DBDCE2;
}

.billingInfo .detailBox .discountText {
    color: #FF6268;
}

.billingInfo .detailBox .borderBot {
    border-bottom: 1px solid #DBDCE2;
}

.billingInfo .detailBox .total {
    color: #141A46;
    font-size: 20px;
    font-weight: bold;
}

.billingInfo .detailBox .totalAmount {
    color: #03AF80;
    font-size: 20px;
    font-weight: bold;
}

.billingInfo .detailBox .subscribeBtn {
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 500;
    background-color: #03AF80;
    border-radius: 10px;
}

.billingInfo .detailBox .subscribeBtn:focus, .billingInfo .detailBox .subscribeBtn:hover {
    color: #FFFFFF !important;
    background-color: #03AF80 !important;
}

.billingInfo .detailBox .subscribeText {
    color: #898CA2;
    font-size: 14px;
}

.billingInfo .detailBox .subscribeText a {
    color: #141A46;
}

.paymentMehod .paymentBox {
    cursor: pointer;
}

.paymentMehod .american:hover {
    content: url(../images/hoverexpress.svg);
}

.paymentMehod .discover:hover {
    content: url(../images/hoverdiscover.svg);
}

.paymentMehod .master:hover {
    content: url(../images/hovermaster.svg);
}

.paymentMehod .visa:hover {
    content: url(../images/hovervisa.svg);
}

.modal {
    background-color: rgba(0, 0, 0, 0.5);
}

.modal .btn-close {
    background: url(../images/mcross.svg) no-repeat;
    opacity: 1;
}

.modal .btn-close:focus {
    box-shadow: unset;
}

.modal textarea {
    resize: none;
    background-color: #F2F3F5;
    border: none;
    border-radius: 10px;
}

.modal textarea::-moz-placeholder {
    color: #898CA2;
}

.modal textarea:-ms-input-placeholder {
    color: #898CA2;
}

.modal textarea::placeholder {
    color: #898CA2;
}

.modal .gotoDashBoard {
    color: #FFFFFF;
    background-color: #03AF80;
    font-size: 20px;
    font-weight: 500;
    padding: 16px 60px;
    border-radius: 10px;
}

.modal .gotoDashBoard:hover {
    color: #FFFFFF;
}

/*================================
Settings Style Start Here
================================== */
.settings {
    background-image: url(../images/bg.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.settings .nav-pills .nav-link {
    color: #898CA2;
    font-weight: bold;
    padding: 8px 80px;
    border-radius: 0;
}

.settings .nav-pills .active {
    color: #141A46 !important;
    background-color: transparent !important;
    border-bottom: 1px solid #03AF80;
    border-radius: 0;
}

.settings .nav-pills .active img {
    /* filter: brightness(0) saturate(100%) invert(6%) sepia(67%) saturate(2913%) hue-rotate(227deg) brightness(103%) contrast(96%); */
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7498%) hue-rotate(187deg) brightness(106%) contrast(101%);
}

.settings .profileBox {
    background-color: #FFFFFF;
    border-radius: 38px;
}

.settings .profileBox .mailText {
    color: #B8BAC7;
    font-size: 14px;
}

.settings .proDetailBox {
    border-radius: 10px;
    background-color: #FFFFFF;
}

.settings .proDetailBox .myInputs {
    background-color: #F2F3F5;
    color: #898CA2;
    font-size: 14px;
    font-weight: 500;
    border-radius: 10px;
    border: none;
    padding: 12px;
}

.settings .proDetailBox .myInputs::-moz-placeholder {
    color: #898CA2;
    margin-top: 8px !important;
}

.settings .proDetailBox .myInputs:-ms-input-placeholder {
    color: #898CA2;
    margin-top: 8px !important;
}

.settings .proDetailBox .myInputs::placeholder {
    color: #898CA2;
    margin-top: 8px !important;
}

.settings .proDetailBox .imgPos {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.settings .proDetailBox .updateBtn {
    background-color: #03AF80;
    color: #FFFFFF;
    font-weight: 500;
    padding: 6px 30px;
}

.select {
    display: block;
    color: #141A46 !important;
    position: relative;
    cursor: context-menu;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}

.select :after {
    content: url(../images/arrowdown.svg);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
}

.select img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 20px;
}

.select .country {
    padding-left: 50px;
}

.list {
    display: none;
    height: 200px;
    margin: 0px auto;
    list-style: none;
    background: #FFFFFF;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.062745098);
    border: 1px solid #EBEBEB;
    overflow-y: scroll;
}

.list li {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #141A46;
    padding: 4px;
    padding-left: 65px;
    position: relative;
    cursor: context-menu;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.list li:hover {
    color: #141A46;
    background-color: #F2F3F5;
}

.list li img {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
}

.arrow-top:after {
    content: " ";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -10px;
    border-top: none;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid #FFFFFF;
}

/*================================
Biil Pay Style Start Here
================================== */
.billPay {
    background-image: url(../images/bg.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.billPay .nav-pills .nav-link {
    color: #898CA2;
    font-weight: bold;
    padding: 8px 0px;
    border-radius: 0;
}

.billPay .nav-pills .active {
    color: #141A46 !important;
    background-color: transparent !important;
    border-bottom: 1px solid #03AF80;
    border-radius: 0;
}

.billPay .nav-pills .active img {
    /* filter: brightness(0) saturate(100%) invert(6%) sepia(67%) saturate(2913%) hue-rotate(227deg) brightness(103%) contrast(96%); */
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7498%) hue-rotate(187deg) brightness(106%) contrast(101%);
}

.billPay .searchInput {
    background-color: #FFFFFF;
    border-radius: 10px;
    border: 0;
    font-size: 14px;
    color: #898CA2;
    padding: 12px;
}

.billPay .upgradeBox {
    background-color: #FFFFFF;
    border-radius: 10px;
}

.billPay .upgradeBox .dateText {
    font-size: 14px;
    color: #898CA2;
}

.billPay .upgradeBox .upgradeBtn {
    background-color: #03AF80;
    color: #FFFFFF;
    border-radius: 6px;
    padding: 12px 0;
    font-weight: 500;
}

.billPay .cardBox {
    background-color: #FFFFFF;
    border-radius: 16px;
    border: 1px solid #B8BAC7;
}

.billPay .cardBox .px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
}

.billPay .cardBox .cardText {
    color: #898CA2;
    font-size: 16px;
    font-weight: normal;
}

.billPay .cardBox .myInputs {
    background-color: #F2F3F5;
    border: 1px solid #D4D5D9;
    border-radius: 10px;
    padding: 10px;
    font-size: 16px;
}

.billPay .cardBox .myInputs:focus {
    background-color: #F2F3F5;
    border: 1px solid #D4D5D9;
    border-radius: 10px;
}

.billPay .cardBox .myInputs::-moz-placeholder {
    color: #898CA2;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.billPay .cardBox .myInputs:-ms-input-placeholder {
    color: #898CA2;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.billPay .cardBox .myInputs::placeholder {
    color: #898CA2;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.billPay .cardBox .myInputs .imgPos {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.billPay .cardBox .nameInputs::-moz-placeholder, .billPay .cardBox .cardInputs::-moz-placeholder {
    text-align: left;
}

.billPay .cardBox .nameInputs:-ms-input-placeholder, .billPay .cardBox .cardInputs:-ms-input-placeholder {
    text-align: left;
}

.billPay .cardBox .nameInputs::placeholder,
.billPay .cardBox .cardInputs::placeholder {
    text-align: left;
}

.billPay .cardBox .form-switch .form-check-input {
    width: 35px;
    height: 20px;
    background-color: #B8BAC7;
    box-shadow: unset;
    border: 2px solid #B8BAC7;
    background-image: url(../images/swichtchecked.svg);
}

.billPay .cardBox .form-switch .form-check-input:focus {
    background-image: url(../images/swichtunchecked.svg);
}

.billPay .cardBox .form-switch .form-check-input:checked {
    background-color: #03AF80;
    border: 2px solid #03AF80;
    background-image: url(../images/swichtchecked.svg);
}

.billPay .cardBox .updateBtn {
    background-color: #03AF80;
    color: #FFFFFF;
    padding: 12px 30px;
    border-radius: 10px;
}

.billPay .infoBox {
    background-color: #FFFFFF;
    border-radius: 16px;
}

.billPay .infoBox .borderless {
    width: 100%;
    overflow-x: auto;
}

.billPay .infoBox .borderless th,
.billPay .infoBox .borderless td {
    border: none;
    font-size: 14px;
    font-weight: 500;
    padding: 5px;
    color: #141A46;
    vertical-align: middle;
    white-space: nowrap;
    padding: 10px 20px 10px 0;
}

.billPay .infoBox .borderless th {
    font-size: 16px;
    color: #898CA2;
    border-bottom: 1px solid #EBECED;
    font-weight: bold;
}

.billPay .infoBox .borderless .myDropdown::after {
    border: 0;
    margin-left: 0;
}

.billPay .infoBox .borderless .myMenu {
    background-color: #FFFFFF;
    box-shadow: 0px 0px 40px rgba(20, 26, 70, 0.2);
    border-radius: 4px;
    border: none;
    margin-top: 2px;
}

.billPay .infoBox .borderless .myMenu .myMenuDrop:is(:hover, :active) {
    background-color: #E7EAF2 !important;
    color: #000000;
}

.billPay .prevBtn {
    font-weight: 500;
    padding: 8px 32px;
    background-color: #898CA2;
    color: #FFFFFF;
}

.billPay .prevBtn:is(:hover, :focus) {
    background-color: #898CA2 !important;
    color: #FFFFFF !important;
}

.billPay .nextBtn {
    font-weight: 500;
    padding: 8px 32px;
    background-color: #03AF80;
    color: #FFFFFF;
}

.billPay .nextBtn:is(:hover, :focus) {
    background-color: #03AF80 !important;
    color: #FFFFFF !important;
}

.billPay .pageNum {
    color: #03AF80;
}

.billPay .imgPos {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.pyt-38{
    padding-top: 38px !important;
    padding-bottom: 1.5rem !important;
    padding-right: 10px;
    padding-left: 10px;
}

/*================================
Contact Us Style Start Here
================================== */
.contactus {
    background-image: url(../images/contactbg.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.contactus .contactBox {
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1019607843);
    border-radius: 12px;
    background-color: #FFFFFF;
}

.contactus .contactBox .myInputs {
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #141A46;
    resize: none;
    background-color: transparent;
}

.contactus .contactBox .myInputs::-moz-placeholder {
    color: #898CA2;
}

.contactus .contactBox .myInputs:-ms-input-placeholder {
    color: #898CA2;
}

.contactus .contactBox .myInputs::placeholder {
    color: #898CA2;
}

.contactus .contactBox .lastLabel {
    color: #03AF80;
}

.contactus .contactBox .lastInput {
    border-bottom: 1px solid #03AF80;
}

.contactus .contactBox .lastInput::-moz-placeholder {
    color: #141A46;
}

.contactus .contactBox .lastInput:-ms-input-placeholder {
    color: #141A46;
}

.contactus .contactBox .lastInput::placeholder {
    color: #141A46;
}

.contactus .contactBox .sendBtn {
    background-color: #141A46;
    color: #FFFFFF;
}

.contactus .contactBox .sendBtn:hover {
    background-color: #03AF80;
}

/*================================
User Review Style Start Here
================================== */
.userReviews .backHome {
    color: #03AF80;
    font-size: 14px;
    font-weight: 500;
}

.userReviews .reviewHeader {
    background-image: url(../images/reviewbg.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 150px;
    border-radius: 12px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.userReviews .featurRe {
    font-size: 14px;
    padding: 10px 16px;
    border-radius: 10px;
    background-color: #EDF8F5;
    color: #03AF80;
}

.userReviews .reviewBox {
    background-color: #FFFFFF;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1019607843);
    border-radius: 12px;
}

.userReviews .reviewBox .imgBox {
    position: absolute;
    top: 0%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.userReviews .reviewBox .imgPos {
    position: absolute;
    bottom: 0%;
    right: 12%;
}

.userReviews .reviewBox .ratingNum {
    color: #898CA2;
    font-size: 14px;
}

.userReviews .moreBtn {
    background-color: #03AF80;
    color: #FFFFFF;
    border-radius: 10px;
    padding: 12px 24px;
}

/*================================
Footer Style Start Here
================================== */
#footer {
    background-color: #141A46;
}

#footer .detailes p {
    color: #E2E2E2;
}

#footer .detailes ul {
    padding-left: 0;
    margin-top: 13px;
}

#footer .detailes ul li {
    list-style: none;
    margin: 10px 0;
}

#footer .detailes ul li a {
    display: block;
    color: #E2E2E2;
}

#footer .detailes ul li a:hover {
    color: #03AF80;
}

.copyright {
    border-top: 1px solid #31365D;
    background-color: #141A46;
}

.copyright p {
    color: #E2E2E2;
}

.copyright .socialIcon:hover {
    filter: brightness(0) saturate(100%) invert(60%) sepia(85%) saturate(3518%) hue-rotate(128deg) brightness(89%) contrast(98%);
}

/*================================
Media Quries Style Start Here
================================== */
@media screen and (max-width: 1400px) {
    .reviewHeader {
        padding: 90px !important;
    }
}

@media screen and (max-width: 992px) {
    h1 {
        font-size: 30px;
    }

    h2 {
        font-size: 24px;
    }

    .py-60 {
        padding-top: 36px;
        padding-bottom: 36px;
    }

    .my-60 {
        margin-top: 36px;
        margin-bottom: 36px;
    }

    .bordert-10 {
        border-radius: 10px 10px 0 0;
    }

    .borderb-10 {
        border-radius: 0 0 10px 10px;
    }

    #signPgae .logsignBox {
        display: none !important;
    }

    .toolFeatures .featureBox {
        background-image: url(../images/whybg.webp) !important;
    }
}

@media screen and (min-width: 992px) {
    .borderR {
        border-right: 1px solid #CBD0E5;
    }

    .btrl-10 {
        border-top-left-radius: 10px;
    }

    .btrr-10 {
        border-top-right-radius: 10px;
    }

    .bbrl-10 {
        border-bottom-left-radius: 10px;
    }

    .bbrr-10 {
        border-bottom-right-radius: 10px;
    }

    .freez-popup {
        left: 100%;
    }

    .radioBoxes .myRadio:checked+.radioLabel {
        transform: scaleY(1.08);
    }


 .userBox {
        background-image: url(../images/newuserflow.webp) ;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;

        padding-bottom: 15%;
        padding-top: 45px;
    }

}

@media screen and (max-width: 768px) {
    .settings .nav-pills .nav-link {
        padding: 8px 9px;
    }

    .billPay .nav-pills .nav-link {
        padding: 8px 9px;
    }

    .pricePlan .nav-pills .nav-link {
        padding: 8px 4px;
    }

    .modal .gotoDashBoard {
        padding: 16px 30px;
    }

    .in-footer-sticky{
        z-index: 1 !important;
    }
}

@media screen and (max-width: 576px) {
    .nextBtn {
        padding: 8px 16px;
    }

    .prevBtn {
        padding: 8px 16px;
    }

    .pageNum {
        font-size: 14px;
    }

    .pricePlan .ps-100 {
        padding-left: 24px !important;
    }

    .reviewHeader {
        padding: 16px !important;
    }
}

@media screen and (min-width: 576px) {
    .freeBox {
        width: 50%;
    }
}

@media screen and (max-width: 360px) {
    .billPay .prevBtn {
        padding: 8px 16px;
    }

    .billPay .nextBtn {
        padding: 8px 16px;
    }

    .mainBox .inputArea .dropdownItem {
        font-size: 10px !important;
    }
}

/*================================
Paraphraser Page MainBox Style Start Here
================================== */
.mainBox {
    background-image: url(../images/bg.webp);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.mainBox .aiInput {
    background-color: #DEDFE6;
    padding: 10px 20px;
    border-radius: 10px;
}

.mainBox .aiInput .inputBox {
    background-color: #F4F5F7;
    box-shadow: 2px 0px 6px rgba(0, 0, 0, 0.0392156863), 0px 0px 10px rgba(0, 0, 0, 0.0980392157);
    border: 0.5px solid #141A46;
    border-radius: 5px;
    width: 100%;
}

.mainBox .aiInput .inputBox::-moz-placeholder {
    color: #84879E;
}

.mainBox .aiInput .inputBox:-ms-input-placeholder {
    color: #84879E;
}

.mainBox .aiInput .inputBox::placeholder {
    color: #84879E;
}

.mainBox .aiInput .imgPos {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.mainBox .inputArea {
    /* width: 100%; */
}

.mainBox .inputArea .myDropdown, .myDropdown {
    background-color: #F4F5F7;
    border-radius: 10px;
}

.mainBox .inputArea .myDropdown:hover,
.mainBox .inputArea .myDropdown .active,
.myDropdown:hover,.myDropdown:active {
    background-color: #141A46 !important;
    color: #FFFFFF;
}

.mainBox .inputArea .myDropdown:hover img,
.mainBox .inputArea .myDropdown .active img,
.myDropdown:hover img {
    filter: invert(96%) sepia(9%) saturate(80%) hue-rotate(230deg) brightness(121%) contrast(100%);
}

.mainBox .inputArea .myDropdown::after {
    border: 0;
    margin-left: 0;
}

.myDropdown::after {
    border: 0 !important;
}

.mainBox .inputArea .langBox {
    background-color: #F4F5F7;
}

.mainBox .inputArea .myMenu , .myMenu {
    background-color: #FFFFFF;
    box-shadow: 0px 0px 40px rgba(20, 26, 70, 0.2);
    border-radius: 4px;
    border: none;
    margin-top: 2px;
}

.mainBox .inputArea .myMenu .myMenuDrop:is(:hover, :active) {
    background-color: #E7EAF2 !important;
    color: #000000;
}

.mainBox .inputArea .dropdownItem {
    font-size: 12px;
    font-weight: 500;
    color: #141A46;
}

.mainBox .inputArea .headerArea {
    background-color: #DEDFE6;
}

.mainBox .inputArea .headerArea .paraText {
    color: #141A46;
    font-weight: bold;
}

.btnColor {
    background-color: #F4F5F7;
    border-radius: 10px;
}

.btnColor:hover {
    background-color: #141A46;
}

.mainBox .inputArea .footerArea .btnColor:hover img {
    filter: invert(96%) sepia(9%) saturate(80%) hue-rotate(230deg) brightness(121%) contrast(100%);
}

.mainBox .inputArea .footerArea .gdrive:hover img {
    filter: invert(96%) sepia(9%) saturate(12%) hue-rotate(300deg) brightness(370%) contrast(100%);
}

.mainBox .inputArea .footerArea .dropbox:hover img {
    filter: invert(96%) sepia(9%) saturate(80%) hue-rotate(230deg) brightness(255%) contrast(100%);
}

.mainBox .inputArea .footerArea .color-tooltip>.tooltip-inner {
    background-color: #141A46;
    color: #FFFFFF;
}

.mainBox .inputArea .headerArea .color-tooltip.bs-tooltip-top>.tooltip-arrow::before,
.mainBox .inputArea .headerArea .color-tooltip.bs-tooltip-auto[data-popper-placement^=top]>.tooltip-arrow::before {
    border-top-color: #141A46;
}

.mainBox .inputArea .bodyArea textarea {
    resize: none;
}

.mainBox .inputArea .bodyArea .wCounter, .wCounter {
    color: #898CA2;
    font-size: 12px;
    font-weight: 500;
}

.eraser {
    color: #898CA2;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
}

.eraser:hover {
    color: #141A46;
}

.eraser:hover img {
    filter: brightness(0) saturate(100%) invert(9%) sepia(22%) saturate(5767%) hue-rotate(221deg) brightness(99%) contrast(99%);
}

.mainBox .inputArea .bodyArea .outputBox {
    height: 224px;
    background-color: #FFFFFF;
}

.mainBox .inputArea .bodyArea .border-r-11 {
    border-radius: 10px;
}

.mainBox .inputArea .bodyArea .border-r-top-11 {
    border-radius: 0px 10px 0px 0px !important;
}

.mainBox .inputArea .bodyArea .freez-popup {
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2509803922);
    max-width: calc(100% - 0px);
    right: 0;
    z-index: 1;
    background-color: #fff;
    top: 4px;
    position: relative;
}

.mainBox .inputArea .bodyArea .freez-popup .left-8 {
    left: -8px;
}

.mainBox .inputArea .bodyArea .freez-popup textarea::-moz-placeholder {
    font-size: 14px;
    font-weight: 500;
    color: #B4B4B4;
}

.mainBox .inputArea .bodyArea .freez-popup textarea:-ms-input-placeholder {
    font-size: 14px;
    font-weight: 500;
    color: #B4B4B4;
}

.mainBox .inputArea .bodyArea .freez-popup textarea::placeholder {
    font-size: 14px;
    font-weight: 500;
    color: #B4B4B4;
}

.mainBox .inputArea .bodyArea .freez-popup .freez-header {
    border-bottom: 1px solid #d9dfef;
}

.mainBox .inputArea .bodyArea .freez-popup .freez-header .text-crossRed {
    color: #FF6268 !important;
    font-size: 12px;
    font-weight: 500;
}

.mainBox .inputArea .bodyArea .freez-popup .freez-body span {
    color: #141A46;
    font-size: 14px;
    font-weight: 600;
    width: 151px;
    text-align: start;
}

.mainBox .inputArea .bodyArea .freez-popup .freez-body span .selected-words {
    display: flex;
    justify-content: space-between;
}

.mainBox .inputArea .bodyArea .freez-popup .freez-footer {
    border-top: 1px solid #d9dfef;
}

.mainBox .inputArea .bodyArea .freez-popup .borderend {
    border-right: 1px solid rgba(3, 175, 128, 0.1);
}

.mainBox .inputArea .bodyArea .freez-popup .bg-lite-blue {
    background-color: rgba(3, 175, 128, 0.0784313725);
}

.mainBox .inputArea .bodyArea .freez-popup .suggestion {
    padding: 4px 14px;
    background-color: rgba(3, 175, 128, 0.1019607843);
    border-radius: 5px;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 10px;
    margin-right: 10px;
    color: #03AF80;
    cursor: pointer;
}

.mainBox .inputArea .bodyArea .freez-popup .h-150-scroll {
    height: 150px;
    overflow-y: scroll;
}

.mainBox .inputArea .bodyArea .freez-popup .goproBox {
    background-color: #03AF80;
    border-radius: 10px;
    padding: 34px 16px;
}

.mainBox .inputArea .bodyArea .freez-popup .goproBox .goPro {
    font-size: 14px;
    padding: 10px;
    border-radius: 10px;
    color: #03AF80;
}

.mainBox .inputArea .footerArea {
    background-color: #DEDFE6;
    height: 60px;
}

.mainBox .inputArea .headerArea input[type=radio] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    outline: none;
    border: 1px solid #9A9A9D;
    margin-right: 10px;
    cursor: pointer;
}

.mainBox .inputArea .headerArea input[type=radio]:checked {
    border-color: #141A46;
}

.mainBox .inputArea .headerArea input[type=radio]:checked:before {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    margin: 10% auto;
    border-radius: 50%;
    background: #141A46;
}

.mainBox .inputArea .headerArea .myLabel {
    color: #000000;
    font-size: 14;
    font-weight: 500;
    cursor: pointer;
}

.mainBox .inputArea .footerArea .sumrizeBtn {
    background-color: #F4F5F7;
    color: #141A46;
    border-radius: 8px;
    font-size: 14px;
    font-weight: bold;
}

.mainBox .inputArea .footerArea .sumrizeBtn:hover {
    background-color: #141A46;
    color: #FFFFFF;
}

.mainBox .articleArea {
    width: 100%;
}

.mainBox .btnGreen {
    color: #FFFFFF;
    background-color: #03AF80;
    font-size: 20px;
    font-weight: 500;
}

/*================================
Work Style Start Here
================================== */
.workSec .workBox {
    background-color: #F4F5F7;
    border-radius: 30px;
    padding: 20px;
}

.workSec .workBox .imgBox {
    padding: 17px 20px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.0980392157);
    background-color: #FFFFFF;
    border-radius: 50%;
    display: inline-block;
}

.workSec .workBox .reproduce {
    background-color: #141A46;
    border-radius: 30px;
}

.workSec .workBox .reproduce p {
    color: #FFFFFF;
}

/*================================
AiWork Style Start Here
================================== */
.aiWorkSec {
    counter-reset: num-sections;
}

.aiWorkSec .step {
    background-color: #F4F5F7;
    border-radius: 16px;
    position: relative;
    counter-increment: num-sections;
}

.aiWorkSec .step:first-child {
    background-color: #141A46;
}

.aiWorkSec .step:first-child::before {
    color: #FFFFFF;
}

.aiWorkSec .step::before {
    content: "0"counter(num-sections);
    position: absolute;
    top: 0;
    right: 16px;
    color: rgba(20, 26, 70, 0.1);
    font-size: 32px;
}

/*================================
key Features Style Start Here
================================== */
.keyFeatures .keyHeading {
    position: relative;
}

.keyFeatures .keyHeading::before {
    content: "";
    width: 58px;
    height: 5px;
    background-color: #03AF80;
    position: absolute;
    top: -16px;
    left: 0;
    border-radius: 4px;
}

/*================================
Who Can Use Style Start Here
================================== */
.toolFeatures .featureBox {
    background: url(../images/whybg.webp) no-repeat center / 100% 100%, url(../images/hand.webp) no-repeat right center / 50%;
    background-blend-mode: soft-light;
    border-radius: 25px;
}

/*================================
Bolg Style Start Here
================================== */
.blogSec .blogBox {
    border-radius: 12px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1019607843);
}

.blogSec .blogBox .wordLimit {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.blogSec .blogBox .footerBox {
    border-top: 1px solid #F4F5F7;
}

.blogSec .blogBox .footerBox .time {
    color: #898CA2;
    font-size: 14px;
}

.blogSec .blogBox .footerBox .readMore {
    color: #03AF80;
}

.blogSec .blogBox:hover {
    transition: all 0.3s ease-in-out;
    transform: translateY(-10px);
}

/*================================
Faqs Style Start Here
================================== */
.faqsbg {
    background-image: url(../images/faqsbg.svg);
    width: 100%;
    height: 100%;
}

.faqs .accordion-item {
    box-shadow: 0px 0px 10px rgba(3, 175, 128, 0.0705882353);
    border: 0.5px solid #141A46;
    background-color: #FFFFFF;
    border-radius: 16px;
}

.faqs .accordion-item .accordion-button {
    border-radius: 16px;
    background-color: #FFFFFF;
    box-shadow: unset;
}

.faqs .accordion-item .accordion-button:focus {
    box-shadow: unset;
}

.faqs .accordion-item .accordion-button::after {
    background-image: url(../images/open.svg);
}

.faqs .accordion-item .accordion-body {
    border-radius: 16px;
    background-color: #FFFFFF;
    border: 0;
}

.faqs .accordion-item:last-of-type .accordion-button.collapsed {
    border-radius: 16px !important;
}

.faqs .accordion-button:not(.collapsed)::after {
    background-image: url("../images/closed.svg");
    background-size: 18px;
    height: 3px;
    width: 18px;
}

.faqs .accordion-button:not(.collapsed) {
    background-color: #EDF8F5;
    border-radius: 16px 16px 0 0;
}

.faqs .accordion-body:not(.collapsed) {
    background-color: #EDF8F5;
    border-radius: 0 0 16px 16px;
}

/*================================
User Review Style Start Here
================================== */
.userReview {
    background-color: #F4F5F7;
}

.userReview .reviewBox .imgPos {
    position: absolute;
    bottom: 4%;
    right: 22%;
}

.userReview .owl-dots {
    padding-top: 20px;
}

.userReview .owl-dots .active span {
    background: #03AF80 !important;
}

.userReview .owl-dots span {
    width: 6px !important;
    height: 6px !important;
    background: #B8BAC7 !important;
}

/*# sourceMappingURL=style.css.map */


/* usages limit popup styles */

.popupModals .modal-header {
    background-color: #FFFAE7;
}

.popupModals .btnClose {
    background: transparent url(/assets/images/modalcross.svg) no-repeat !important;
    opacity: 1;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 111;
}

.popupModals .btnClose:is(:hover, :active) {
    box-shadow: unset;
}

.popupModals .textSuccess {
    color: #03AF80;
}

.popupModals .btnSuccess {
    background-color: #03AF80;
    color: #FFFFFF;
}
.btnSuccess:hover {
    background-color: #141A46 !important;
}

.popupModals .bgPink {
    background-color: #F4F5F7;
}


.btnProg {
    background-color: #FFB743;
    color: #000000;
}

.btnProg:is(:hover, :focus, :active) {
    background-color: #FFB743;
    color: #000000;
}
/* sticky bar css starts here */
.bg-gray {
    background-color: #DEDFE6;
}
.footer-wrapper {
    border-radius: 0px 0px 8px 8px;
    position: relative;
}
.main-footer-wrapper {
    position: sticky;
    bottom: 0;
}


.myDropdown {
    background-color: #F4F5F7 !important;
    border-radius: 10px;
}

.counter-bar{
   position: sticky;

    bottom:47px;
}

.position-sticky{
    bottom: -4px;
    z-index: 2;
}


@media only screen and (min-width: 992px)
{
    .action-btns {
        position: absolute;
        right: 12px;
        top: 6px;
    }

    .position-lg-relative {
        position: relative;
    }
    .desktop-btn-position {
        position: absolute;
        bottom: 0;
        /* width: 170px; */
        transform: translate(-50%, -7px);
        left: 50%;
    }


}
@media only screen and (max-width: 992px)
{

.counter-bar{
   position: sticky;
   bottom:0px !important;
}

}


.bottom-line{
    width: 73%;
    height: 4px;
    border-radius: 20px;
    position: absolute;
    background-color: #4590F2;
    bottom: -1px;
    left: 50%;
    transform: translate(-50%, 0px);

}

.ph3{
    font-size: 20px;
    font-family: CircularStd;
    font-weight: 600;
}


.fw-medium{
    font-weight: 500 !important;
}
.fw-semibold{
    font-weight: 600 !important;
}
.txt-18{
    font-size: 18px;
}
.txt-24{
    font-size: 24px;
}
.txt-32{
    font-size: 32px;
}
.darkergrey-clr{
    color: #373738;
}
.lightpurple-clr{
    color: #03AF80;
}
.orderSummary-items{
    background: #FFFFFF;
    border: 1px solid #EAEAEA;
    box-shadow: 0px 0px 45px 0px #00000017;
    border-radius: 16px;
}
.orderItem1,.orderItem2{
    padding: 34px;
}

.standard-plan{
    border-bottom: 1px solid #E6E6E6;
}
.orderTotal{
    background: #F2F5FF;
    color: #03AF80;
    border-radius: 16px;
    font-size: 24px;
    font-weight: 600;
}
.visa-btn{
    background: #E9EFFF;
    border: 1.3px solid #03AF80;
    padding: 14px;
    border-radius: 7px;
}
.paypal-btn{
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    padding: 14px;
    border-radius: 7px;
}
.greenList li::marker{
    content: url(../images/order-summary/tick.svg);
}

.card-fields .form-control{
   padding: 14px !important;
   border: 1px solid #D9D9D9 !important;
   border-radius: 7px !important;
   font-size: 14px;
}
.card-fields ::placeholder{
    color: #505050 !important;
}
.clearfix::after {
    display: block;
    clear: both;
    content: "";
}
.query{
    position: absolute;
    right: 12px;
    top: 17px;
}
.p-icon{
    position: absolute;
    right: 25px;
    top: 24px;
}
.text-start{
    text-align: left;
}
.upgrade-btn{
    background-color: #03AF80 !important;
    color: #FFFFFF !important;
    padding: 14px;
    font-size: 20px;
    font-weight: 600;
    border-radius: 12px;
}
#coupon-code{
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}
.applyBtn{
    background: #373738;
    color: #FFFFFF !important;
    border-radius: 7px;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    padding: 14px 44px;
}
.form-select{
    padding: 14px !important;
    border: 1px solid #D9D9D9 !important;
    background-color: #FFFFFF !important;
    border-radius: 7px;
    font-weight: 500 !important;
    font-size: 14px !important;
}

@media(min-width:992px){
    .border-lg-end{
        border-right: 1px solid #E6E6E6;
    }
}
@media(max-width:992px){
    .rephraser_crumb{
      margin-top: 80px !important;
    }
}
@media(max-width:420px){
    .orderTotal{
        font-size: 20px !important;
    }
    .applyBtn{
        padding: 14px !important;
    }
}
@media(max-width:992px){
    .orderItem2{
        padding-top: 0 !important;
    }
}
@media(max-width:576px){
    .apiPlan-tab::before{
     display: none;
    }
}
/* skeleton start */
.actionTextLoader {
    white-space: nowrap;
}
.skeleton {
    --bg: #e1e1e1;
    --glare-bg: linear-gradient(90deg, transparent, hsla(0, 0%, 100%, 0.4), transparent);
    position: relative;
    background-color: var(--bg);
    overflow: hidden;
  }

  .skeleton::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: var(--glare-bg);
    transform: translateX(-100%);
    animation: skeleton-glare 1.75s infinite ease-out;
    z-index: 1;
  }

  @keyframes skeleton-glare {
    to {
      transform: translateX(100%);
    }
  }
.card__text {
    font-size: 1rem;
    height: 1em;
    border-radius: 20px;
  }
.card__body > .card__text {
    margin: 0.5em 0;
}

.card__body > .card__text:first-child {
    margin-top: 0.25rem;
}

.card__body > .card__text:last-child {
    margin-bottom: 0.25rem;
    width: 66%;
}
/* skeleton End */

/* Default button styling */
.response-btn {
    background-color: #f0f0f0; /* Default background color */
    color: #000; /* Default text color */
    border: 1px solid #ccc; /* Default border */
    padding: 10px 20px;
    cursor: pointer;
}

/* Hover effect */
.response-btn:hover {
    background-color: #03AF80; /* Change background color on hover */
    color: #fff; /* Change text color on hover */
}

/* Active (clicked) state */
.response-btn.active {
    background-color: #03AF80; /* Change background color when active */
    color: #fff; /* Change text color when active */
}


.zoom-in-out {
    animation: zoom-in-out 0.5s;
}

@keyframes zoom-in-out {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2); /* Zoom in */
    }
    100% {
        transform: scale(1); /* Zoom out */
    }
}

.linethrough {
    text-decoration: line-through;
    color: red !important;
}

.richtext {
    color: #03AF80 !important ;
}

.statuspadding {
    padding: 8px 16px 8px 16px;
    font-size: 14px;
}

.pt-20 {
    padding-top:20px;
}
.pt-14 {
    padding-top:14px;
}

/* API Page SCSS Start Here */

.mt-20 {
    margin-top: 20px;
}
.mt-30 {
    margin-top: 30px;
}
.pt-30 {
    padding-top: 30px;
}
.mb-40 {
    margin-bottom: 40px;
}
.py-80 {
    padding-top: 80px;
    padding-bottom: 80px;
}
.py-60 {
    padding-top: 60px;
    padding-bottom: 60px;
}
.mb-60 {
    margin-bottom: 60px;
}
.p-21 {
    padding-left: 19px !important;
    padding-right: 19px !important;
}
.rounded-12 {
    border-radius: 12px;
}

.features_list {
    padding-left: 1rem !important;
    margin-bottom: 0 !important;
    position: relative;
}

.features_list li {
    color: darkGrey;
    padding-top: 19px;
    position: relative;
}

.features_list li.green_tick::before {
    content: url(../images/api-page/greentick.svg);
    position: absolute;
    left: -26px;
}

.calc_br_btm {
    border-bottom: 15px solid #E2F6F1;
    border-bottom-left-radius: 60px;
    border-bottom-right-radius: 60px;
}

.range-calculator {
    border: 1.5px solid #03AF80;
    background: #F9FDFD;
    border-radius: 18px;
    padding: 25px 25px 30px;
    display: flex;
    flex-direction: column;
    position: relative;
}

.range-calculator .badgeBox {
    display: inline-block;
    background: linear-gradient(to right, #EF126D, #FE620B);
    padding: 2px 8px;
    border-radius: 23px;
    background-size: 300% 300%;
    animation: badge-bg-animation 1s ease infinite;
    }
    @keyframes badge-bg-animation {
        0% {
            background-position: 0% 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        }
    }

.range-calculator .apiPlan-tab {
    border: 1px solid #141A46;
    padding: 5px;
    border-radius: 30px;
    position: relative;
}

.range-calculator .apiPlan-tab::before {
    content: url(../images/api-page/arrow.svg);
    position: absolute;
    left: -28%;
    top: 20%;
}

.nav-pills .nav-link {
    color: #898CA2 !important;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: #141A46 !important;
    padding: 8px 16px !important;
    border-radius: 23px;
    color: #FFFFFF !important;
    font-weight: 500;
    font-size: 14px;
}

.slider {
    width: 100%;
    background: #E8ECF0;
    -webkit-appearance: none;
    appearance: none;
    height: 8px;
    outline: none;
    transition: opacity .15s ease-in-out;
    border-radius: 5px;
}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    background-color: #FFFFFF;
    border: 3px solid #03AF80;
    border-radius: 50%;
    cursor: pointer;
}

.slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    background-color: #FFFFFF;
    border: 3px solid #03AF80;
    border-radius: 50%;
    cursor: pointer;
}

.words_output {
    color: #141A46;
    text-align: center;
    font-size: 21px;
    font-weight: bold;
    margin-top: 12px;
}

.calc_btn {
    background: #03AF80 !important;
    border-radius: 16px;
    padding: 16px;
    color: white !important;
    font-size: 20px;
    margin-top: 30px;
    width: 100%;
    max-width: 330px;
}

.apiTools {
    padding: 20px;
    border-radius: 20px;
    transition: 0.6s all ease;
}

.apiTools:hover {
    background: white;
}

.apiTools:hover .trend-down {
    filter: brightness(0) saturate(100%) invert(71%) sepia(69%) saturate(6307%) hue-rotate(133deg) brightness(94%) contrast(98%);
}

.lightBox {
    background: #F8F8FA;
    border: 1px solid #D3D4DD;
    border-radius: 20px;
    padding: 25px;
    height: 100%;
}

.userReview .owl-carousel .owl-nav,
.userReview .owl-carousel .owl-dots {
    display: block !important;
}

.bypass_box {
    background: #E2EFEE;
    border: 1px solid #03AF80;
    border-radius: 20px;
    padding: 8px 12px;
    width: fit-content;
    margin-bottom: 23px;
}


/* guage style here */
.greenText {
    color: #03AF80;
}
    .text-18{
    font-size: 18px !important;
}

.humanizeChecker-container{
  background-color: #ffffff;
  border-radius: 10px;
  padding: 30px;
  margin-top: 20px;
}
.humanizeChecker-container .humanizeChecker-detector {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 32px;
    margin-top: 30px;
}

/* Graph CSS */
.humanizeChecker-container .abcclass {
background: linear-gradient(
  91.42deg,
  #26a661 -12.37%,
  #da8a11 32.53%,
  #f50101 95.83%
) !important;
}
.humanizeChecker-container .gauge {
position: relative;
width: 146px;
height: 73px;
border-radius: 50%/100% 100% 0 0;
background-color: var(#1db235, #ef4639);
overflow: hidden;
}
.humanizeChecker-container .gauge:before {
content: "";
display: block;
padding-top: 50%;
}
.humanizeChecker-container .gauge .chart {
overflow: hidden;
}
.humanizeChecker-container .gauge .mask {
position: absolute;
left: 20%;
right: 20%;
bottom: 0;
top: 40%;
background-color: #ffffff;
border-radius: 50%/100% 100% 0 0;
}
.humanizeChecker-container .gauge .gauge-percentage {
position: absolute;
top: -1px;
left: -1px;
bottom: 0;
right: -1px;
background-color: #e9ecef;
transform: rotate(90deg);
transform-origin: bottom center;
transition: transform 1.5s ease-in-out;
}
.humanizeChecker-container .gauge .value {
position: absolute;
bottom: 0%;
left: 0;
width: 100%;
text-align: center;
}

.humanizeChecker-container .gauge .min {
position: absolute;
bottom: 0;
left: 5%;
}

.humanizeChecker-container .gauge .max {
position: absolute;
bottom: 0;
right: 5%;
}

/* Undetectable-ai-action Section Start Here  */
.undetectable-container{
margin-top: 40px;
}
.undetectable-container .plagiarized_container{
background-color: #F5F5F5;
border-radius: 30px;
padding: 20px;
height: 100%;
}
.undetectable-container .plagremover_container{
background-color: #f0faf8;
border-radius: 30px;
padding: 20px;
height: 100%;
}
.plagiarized_container p,.plagremover_container p{
color: #a1a3b5;
font-size: 14px;
margin-bottom: 0;
}

/* Hide sub-dropdown initially */
.sub-dropdown-menu {
    display: none;
    min-width: 130px;
    z-index: 1000;
    background-color: white;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    border-radius: 0.375rem;
    /* previously: start-100 and ms-2 (right-side) */
    right: 100%;
    top: 0;
    margin-right: 0.5rem;
}

.sub-dropdown-menu li a:hover {
    color: #03AF80;
    background-color: white;
}


/* Show when toggled */
.dropdown-submenu.show .sub-dropdown-menu {
    display: block;
}

.past-btn {
    border: 1px solid rgba(0, 0, 0, .161);
    background-color: #fff;
    border-radius: 16px;
    /* font-family: Outfit; */
    font-size: 12px;
    font-weight: 500;
    line-height: 17.64px;
    text-align: center;
    color: #1a1a1a;
    display: flex;
    justify-content: center;
    flex-direction: column;
    white-space: nowrap;
    padding: 5px 25px;
}
.sample-btn {
    padding: 5px 15px;
    border: 1px solid rgba(51, 103, 227, .4);
    background: rgba(51, 103, 227, .039);
    border-radius: 16px;
    /* font-family: Outfit; */
    font-size: 12px;
    font-weight: 500;
    line-height: 17.64px;
    text-align: center;
    color: #1a1a1a;
    display: flex;
    justify-content: center;
    flex-direction: column;
    white-space: nowrap;
}