@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800;900&display=swap);@-webkit-keyframes criss-cross-left {
    0% {
        left: -20px
    }

    50% {
        left: 50%;
        width: 20px;
        height: 20px
    }

    to {
        left: 50%;
        width: 375px;
        height: 375px
    }
}

@keyframes criss-cross-left {
    0% {
        left: -20px
    }

    50% {
        left: 50%;
        width: 20px;
        height: 20px
    }

    to {
        left: 50%;
        width: 375px;
        height: 375px
    }
}

@-webkit-keyframes criss-cross-right {
    0% {
        right: -20px
    }

    50% {
        right: 50%;
        width: 20px;
        height: 20px
    }

    to {
        right: 50%;
        width: 375px;
        height: 375px
    }
}

@keyframes criss-cross-right {
    0% {
        right: -20px
    }

    50% {
        right: 50%;
        width: 20px;
        height: 20px
    }

    to {
        right: 50%;
        width: 375px;
        height: 375px
    }
}

@keyframes drip {
    0% {
        background-position: 0
    }

    to {
        background-position: -8976px
    }
}

@keyframes star {
    0% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        opacity: .9
    }

    to {
        -webkit-transform: scale(.9);
        transform: scale(.9);
        opacity: 1
    }
}

*,body {
    font-family: 'Poppins',sans-serif
}

body {
    overflow-x: hidden;
    padding-right: 0!important
}

.modal-open {
    overflow: hidden scroll
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    margin-bottom: 0;
    font-weight: 700;
    line-height: 1.2;
    font-family: 'Poppins',sans-serif
}

a {
    -webkit-transition: all .3s;
    transition: all .3s
}

a,a:hover {
    text-decoration: none
}

a:focus,a:hover {
    text-decoration: none;
    outline: 0
}

:focus {
    outline: 0
}

img {
    max-width: 100%;
    height: auto
}

p,ul {
    margin-bottom: 0
}

ul {
    list-style: none;
    padding: 0
}

.heading {
    text-align: center
}

.heading h3 {
    font-size: 42px;
    font-weight: 600;
    color: #0a0a13
}

.heading h3 span {
    color: #df1a22;
    font-weight: 700
}

.menu-right .default-btn span {
    display: flex;
    position: relative;
    z-index: 1;
    align-items: center;
    color: #fff;
}

.default-btn {
    background-color: transparent;
    color: #878787;
    font-size: 18px;
    font-weight: 500;
    border: 2px solid #fff;
    border-radius: 50px;
    padding: 8px 37px;
    position: relative;
    overflow: hidden;
    transition: all .4s ease-in-out
}

.default-btn .btn-icon {
    background-color: #e2020c;
    color: #fff;
    padding: 2px 9px;
    border-radius: 45px;
    font-size: 16px;
    margin-left: 14px
}

.default-btn:after,.default-btn:before {
    position: absolute;
    top: 50%;
    content: "";
    width: 20px;
    height: 15px;
    border-radius: 50%;
    background-image: -webkit-linear-gradient(90deg,rgb(219 26 33) 0,rgb(159 18 22) 100%)
}

.default-btn:before {
    left: -20px;
    transform: translate(-50%,-50%)
}

.default-btn:after {
    right: -20px;
    transform: translate(50%,-50%)
}

.default-btn:hover {
    -webkit-transform: scale(1.1);
    -khtml-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    color: #fff
}

.default-btn:hover:after,.default-btn:hover:before {
    -webkit-animation: criss-cross-left .8s both;
    animation: criss-cross-left .8s both;
    -webkit-animation-direction: alternate;
    animation-direction: alternate
}

.default-btn:hover:after {
    -webkit-animation: criss-cross-right .8s both;
    animation: criss-cross-right .8s both
}

.default-btn:hover .btn-icon {
    color: #000;
    background-color: #fff
}

header {
    padding: 20px 30px 0;
    position: absolute;
    width: 100%;
    z-index: 33;
    margin: 0
}

header .container-fluid {
    padding: 0;
    border: 1px solid #3c3c3c;
    margin: 0;
    left: 0
}

header nav {
    display: flex
}

.brand-logo,ul.navbar li a {
    text-decoration: none;
    display: flex;
    position: relative
}

.brand-logo,header nav {
    align-items: center
}

.brand-logo .logo-name {
    padding: 0 15px;
    width: 45%;
}

.brand-logo .icon {
    padding: 7px 11px 7px 12px;
    /* border-right: 1px solid #3c3c3c; */
    width: 17% !important;
    height: auto !important;
    background: transparent !important;
    margin-bottom: 0px;
}

.doubleMenu {
    flex-grow: 1;
    padding-left: 5%
}

.menu-right,ul.navbar {
    display: flex;
    align-items: center
}

ul.navbar {
    list-style: none;
    padding: 0;
    justify-content: flex-start
}

ul.navbar li {
    display: block;
    position: static;
    padding: 0 20px
}

ul.navbar li a {
    color: #b6b6b6;
    font-size: 16px;
    transition: .4s;
    text-transform: capitalize;
    flex-direction: column;
    height: auto;
    font-weight: 600
}

.megamenu-li a::after {
    width: 10px;
    position: absolute;
    right: 0;
    bottom: 16px
}

ul.navbar li a span {
    color: #828282;
    line-height: 10px;
    font-weight: 400
}

ul.navbar li a.active,ul.navbar li a:hover {
    color: #e31b23
}

ul.navbar li.nav-space {
    width: 0
}

.menu-right {
    padding-left: 9%
}

.menu-right .default-btn {
    border: 0;
    padding: 2px 20px;
    margin-right: 20px
}

.menu-right .default-btn .btn-icon {
    padding: 2px 9px 2px 6px;
    font-size: 16px;
    width: 35px;
    height: 35px
}

.navicon {
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    left: 0;
    z-index: 999
}

.navicon .nav-toggle {
    position: absolute;
    display: none;
    left: 0;
    right: 0;
    top: 0;
    margin: 0 auto;
    width: 136px
}

.btn-icon i {
    margin-top: 7px;
    margin-left: 4px;
}

.nav-toggle span {
    top: 19px
}

.nav-toggle span,.nav-toggle span:after,.nav-toggle span:before {
    content: "";
    position: relative;
    display: block;
    width: 30px;
    height: 2px;
    background-color: #ea0122;
    cursor: pointer;
    margin: 0 auto;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.nav-toggle span:before {
    top: -8px
}

.nav-toggle span:after {
    bottom: -8px
}

.nav-toggle.active span:before {
    top: 0
}

.nav-toggle.active span {
    background-color: transparent!important
}

.nav-toggle.active span:after {
    top: 10px;
    -ms-transform: translatey(-10px) rotate(-45deg);
    -webkit-transform: translatey(-10px) rotate(-45deg);
    transform: translatey(-10px) rotate(-45deg);
    background-color: #fff
}

.nav-toggle.active span:before {
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    background-color: #fff
}

.detailHeader {
    position: fixed;
    background-color: #000;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 99;
    display: flex;
    align-items: center;
    visibility: hidden;
    opacity: 0;
    transition: all .4s ease-in-out!important;
    transform: translateY(-100%)
}

.detailHeader ul.menuBlock li a {
    color: #fff;
    font-size: 20px;
    line-height: 40px;
    font-weight: 500
}

.det-packages .boxpackages:hover .packtitles .fright-pricing h4,.det-packages .boxpackages:hover .packtitles .fright-pricing h4 span.cutprice,.detailHeader .inner-menu-bottom .innerMenu li a:hover,.detailHeader ul.menuBlock li a:hover {
    color: #cf0420
}

.detailHeader .inner-menu-bottom .innerMenu li a {
    color: #fff;
    line-height: 40px;
    font-size: 19px;
    font-weight: 400;
    text-decoration: none;
    position: relative
}

.inner-menu-bottom .innerMenu,.menu-tab-content {
    display: flex;
    justify-content: center;
    align-items: center
}

.inner-menu-bottom .innerMenu {
    margin-top: 50px
}

.menu-tab-content {
    height: 100%;
    text-align: center
}

.detailHeader .innerMenu li {
    padding: 0 25px;
    text-align: center!important
}

.detailHeader.active {
    visibility: visible;
    opacity: .9;
    -webkit-transition: opacity 1s;
    transition: opacity 1s;
    transform: translateY(0)
}

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999
}

.preloader .preloader-after,.preloader .preloader-before {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right,#000,#000,#000);
    top: 0
}

.preloader .preloader-block {
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    bottom: auto;
    width: 100%;
    height: 100%
}

.preloader .preloader-block .percent {
    position: absolute;
    top: 6%;
    left: 4%;
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
    font-weight: 500;
    font-size: 28px;
    color: #9c9c9c;
    z-index: 1;
    border-radius: 50px;
    border: 2px solid #9c9c9c;
    width: 70px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center
}

.preloader .preloader-bar {
    position: absolute;
    z-index: 2;
    top: calc(10% - 1px);
    right: 0;
    width: 100%;
    height: 2px
}

.preloader .preloader-bar .preloader-progress {
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    bottom: auto;
    height: 100%;
    width: 0;
    transition: width 3.2s;
    transition-timing-function: cubic-bezier(.1,.5,1.3,.1)
}

.preloader.hidden-main {
    opacity: 0;
    visibility: hidden
}

.preloader .preloader-after,.preloader .preloader-before {
    transition: .9s ease-in-out
}

.hidden .preloader-after {
    transform: translate(0,100%)
}

.hidden .preloader-before {
    transform: translate(0,-100%)
}

.loader-width .preloader-progress {
    width: 100%!important
}

.side-bar {
    position: absolute;
    width: 90px;
    height: 95vh;
    z-index: 9999;
    margin: 0 30px;
    border: 1px solid #3c3c3c;
    top: 20px;
    left: 0
}

.social-icons {
    position: absolute;
    bottom: 40px;
    left: 37%
}

.social-icons ul li {
    margin-bottom: 20px
}

.social-icons ul li svg {
    fill: #ffffff;
    width: 20px;
    height: 20px
}

.social-icons ul li a:hover svg {
    fill: #ea0122
}

section.main-banner {
    position: relative;
    background-color: #0a0a13
}

.content-wrapper,.ser-button1 .default-btn span {
    display: flex;
    position: relative;
    z-index: 1;
    align-items: center
}

.content-wrapper {
    justify-content: center;
    height: 100vh
}

.porfolio-wrapper {
    display: flex;
    justify-content: left
}

.main-heading h2 {
    color: #fff;
    font-size: 67px;
    line-height: 70px
}

.main-heading h2 span {
    color: #ea0122
}

span.head-span {
    font-weight: 500;
    color: #fff!important
}

.main-heading p {
    font-size: 18px;
    color: #d0cfcf;
    line-height: 30px;
    padding-top: 28px;
    padding-right: 50px;
}

.banner-button {
    margin-top: 22px
}

.banner-button .default-btn {
    border: 1px solid #fff;
    font-size: 16px
}

.banner-button button span {
    display: flex;
    z-index: 1;
    position: relative;
    justify-content: center
}

.banner-right {
    position: absolute;
    bottom: 34px;
    right: -4px;
    width: 34%;
    display: flex;
    align-items: flex-end
}

.ban-arrow {
    position: absolute;
    z-index: 9;
    bottom: 10%;
    right: 27%;
    scroll-behavior: smooth
}

section.creative-agency,section.portfolio {
    padding: 90px 0;
    border-bottom: 1px solid #dcdcdc
}

.creative-heading {
    padding-left: 13%
}

.creative-heading h2 {
    font-size: 60px
}

.about-heading h2 span,.creative-heading h2 span,.testi-heading h2 i,.web-design .nav-tabs .nav-link.active .service-text h3 {
    color: #ea0122
}

.creative-heading h3 {
    font-size: 36px;
    font-weight: 500;
    padding-top: 10px;
    color: #ea0122
}

.services-wrapper {
    padding: 0 6% 2% 20%
}

.ser-button1 {
    display: flex;
    align-items: center;
    margin-top: 15px
}

.ser-button1 .default-btn span {
    color: #ea0122
}

.ser-button1 .default-btn .btn-icon {
    padding: 2px 10px 3px 6px;
    background-color: #ea0122;
    color: #fff;
    margin-right: 12px;
    margin-left: 0
}

.ser-button1 .default-btn {
    padding: 8px 0;
    font-size: 16px
}

.content-wrap h3 {
    font-size: 48px;
    padding-bottom: 15px
}

.content-wrap p {
    padding: 20px 53px 15px 0;
    font-size: 15px
}

.default-btn:after,.ser-button1 .default-btn:before {
    display: none
}

.hover-effect a img,.serv-images img {
    border-radius: 29px;
    transition: all .4s ease-in-out
}

.video-box img {
    object-fit: cover;
    height: 100%;
    object-position: center
}

.serv-images {
    width: 37%
}

.img2 {
    position: relative;
    top: 45px
}

.serv-images video,.video-set {
    height: 100%;
    border-radius: 29px;
    width: 100%;
    transition: all .4s ease-in-out
}

.serv-images video {
    object-fit: cover
}

.serv-images img:hover,.serv-images video:hover,.video-set:hover {
    color: #d8d5cb;
    -webkit-transform: scale(1.1);
    -khtml-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    box-shadow: 0 0 30px 0 #a9a9a9
}

.video-set {
    background: #232336;
    position: relative
}

.video-set video {
    height: 60%;
    object-fit: cover;
    position: absolute;
    top: 0;
    margin: auto 0;
    bottom: 0
}

.serv-images .video-set video:hover {
    -webkit-transform: none;
    -khtml-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    box-shadow: none
}

.video-box {
    height: 487px
}

.img1 {
    margin-right: 50px
}

.left-content-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5% 0
}

.images-wrapper {
    display: flex;
    justify-content: flex-end
}

.right-content-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5% 0;
    flex-direction: row-reverse
}

.right-content-wrap .images-wrapper {
    justify-content: flex-start
}

.right-content-wrap .content-wrap p {
    padding: 20px 0 15px
}

.right-content-wrap .ser-button1 .default-btn .btn-icon {
    padding: 2px 2px 2px 16px
}

.img3 {
    margin-right: 50px
}

.animation-wrap {
    padding-bottom: 0
}

section.portfolio {
    padding: 80px 0 80px;
    border-bottom: none;
}
.port-content h2,.testi-heading h2 {
    text-align: center;
    font-size: 48px;
    padding-bottom: 15px
}
.combo-list-style strong {
    margin-top: 30px !important;
    display: block;
    line-height: 30px;
    text-transform: capitalize;
    font-size: 18px;
    font-weight: 700;
}
.port-content p {
    text-align: center;
    font-size: 16px;
    padding: 0 20px 30px
}

.portfolio-box-wrap .nav-tabs .nav-item.show .nav-link,.portfolio-box-wrap .nav-tabs .nav-link.active {
    color: #fff;
    background-color: #ea0122;
    border-color: transparent
}

.portfolio-box-wrap .sub-tabs .nav-item .nav-link:hover,.portfolio-box-wrap .sub-tabs .nav-link.active {
    color: #ea0122;
    background-color: transparent;
    border-bottom: 1px solid #ea0122;
    border-radius: 0
}

.portfolio-box-wrap .sub-tabs .nav-item.show .nav-link {
    border: 1px solid transparent
}

.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover {
    border-color: transparent
}

.portfolio-box-wrap .sub-tabs .nav-item .nav-link,.portfolio-box-wrap .sub-tabs .nav-link {
    background-color: transparent!important
}

.portfolio-box-wrap ul li a {
    color: #000;
    font-size: 18px;
    position: relative;
    padding: 6px 30px;
    font-weight: 500;
    text-align: center
}

.portfolio-box-wrap .nav-tabs .nav-link {
    border-radius: 8px;
    background-color: #e9e9e9
}

.nav-tabs .nav-items:hover,.portfolio-box-wrap .nav-tabs .nav-items:focus {
    background-color: #ea0122;
    color: #fff
}

.portfolio-box-wrap .nav-tabs .nav-item {
    margin: 0 3px
}

.parent-tabs {
    margin: 20px 0
}

.sub-tabs {
    margin-bottom: 60px;
    padding: 0 50px
}

.sub-tabs .nav-item a {
    font-size: 16px;
    padding: 5px 20px;
    font-weight: 600;
}

.portfolio-box.col {
    margin-bottom: 30px
}

.portfolio-box a video {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.portfolio-responsive-slider {
    padding: 0 6%
}

.portfolio-box.col a img {
    width: 100%;
    height: 245px
}

.no-child {
    margin-top: 60px
}

section.portfolio .portfolio-box a:before {
    content: "+";
    width: 93%;
    position: absolute;
    bottom: 0;
    left: 15px;
    color: #fff;
    top: 0;
    font-size: 58px;
    z-index: 99;
    align-items: center;
    display: grid;
    margin: auto;
    text-align: center;
    font-weight: 400;
    text-transform: uppercase;
    background-color: rgba(0,0,0,.73);
    transition: all .2s ease-in-out;
    opacity: 0
}

.testi-wrapper:hover .testi-img,section.portfolio .portfolio-box a:hover:before {
    opacity: 1
}

section.portfolio .ser-button1 {
    justify-content: center
}

section.portfolio .ser-button1 .default-btn .btn-icon {
    padding: 3px 9px 3px 6px;
}

section.testimonial {
    padding: 60px 0 80px;
    border-bottom: 1px solid #dcdcdd
}

.testi-heading p {
    text-align: center;
    font-size: 16px;
    padding-bottom: 30px
}

.testi-wrapper {
    padding: 24px;
    border: 1px solid transparent;
    transition: all .2s linear;
    background-color: #fff;
    height: 100%
}

.client-detail,.testi-img {
    display: flex;
    justify-content: center
}

.testi-img {
    opacity: .2
}

.client-review p {
    font-size: 15px;
    text-align: center;
    line-height: 26px;
    padding-top: 13px;
    min-height: 190px
}

.client-detail {
    margin-top: 23px;
    align-items: center
}

.client-name {
    margin-left: 12px
}

.client-name h4 {
    font-size: 14px
}

.client-name h5 {
    font-size: 14px;
    font-weight: 500
}

.testi-wrapper:hover {
    background-color: #f7f7f7;
    border-color: #cf0420
}

.testi-wrapper img {
    width: auto!important
}

.testi-slider.owl-carousel .owl-nav {
    position: absolute;
    left: 0;
    right: 0;
    top: 32.8%;
    justify-content: space-between;
    z-index: -1;
    display: flex
}

.testi-slider.owl-carousel .owl-nav button.owl-prev {
    margin-left: -211px;
    transform: rotate(-90deg) translateY(50px)
}

.testi-slider.owl-carousel .owl-nav button.owl-next {
    margin-right: -211px;
    transform: rotate(-90deg) translateY(-50px)
}

.testi-slider.owl-carousel .owl-theme .owl-nav [class*=owl-]:hover {
    outline: 0
}

.owl-theme .owl-dots .owl-dot span {
    background: #cf0420;
    outline: 0
}

.testi-slider.owl-carousel .owl-dots {
    margin-top: 25px
}

.testi-slider.owl-carousel .owl-nav button {
    border-radius: 0!important;
    transition: all .7s cubic-bezier(.46,.03,.52,.96);
    opacity: 0;
    font-size: 30px;
    background-color: #cf0420;
    color: #fff;
    width: 32.5%;
    height: 61px
}

.testi-slider.owl-carousel:hover .owl-nav button {
    transform: rotate(-90deg) translateY(0);
    opacity: 1
}

.owl-theme .owl-nav [class*=owl-]:hover {
    background: #cf0420;
    outline: 0;
    box-shadow: none
}

section.clientssection {
    padding: 30px 0 10px
}

.partnerslider .slick-slide img {
    display: block;
    width: 200px;
    height: 90px
}

.cr-wrapper,footer {
    position: relative
}

footer .bannerImg,footer .video-overlay {
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0
}

footer .video-overlay {
    width: 100%;
    height: 100%;
    background-color: #0202027a;
    background-repeat: no-repeat;
    z-index: -1
}

footer .bannerImg {
    background-image: url(/assets/images/video/webp/footer-vid.webp);
    right: 0;
    bottom: 0;
    align-items: center
}

footer .bannerImg>* {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.cr-wrapper {
    font-size: 210px;
    text-align: center;
    font-weight: 400;
    z-index: 1
}

.cr-wrapper a,.footer-address ul li a:hover,.footer-bottom-privacy ul li a:hover,.footer-btn a:hover .btn-icon,.footer-menu ul li a:hover {
    color: #fff
}

.footer-top-wrap {
    padding: 105px 0
}

.footer-btn a {
    margin-top: 45px;
    background-image: none;
    border: 2px solid #a81318;
    color: #a81318;
    padding: 8px 27px
}

.footer-btn a span {
    display: flex;
    position: relative;
    z-index: 1;
    align-items: center
}

.footer-btn a .btn-icon {
    background-color: transparent;
    color: #a81318;
    padding: 0 4px;
    border-radius: 0;
    font-size: 16px;
    margin-left: 0
}

.footer-address ul li a,.footer-menu ul li a {
    color: #ffffffcc;
    font-size: 16px;
    font-weight: 400;
}

.footer-menu ul li {
    padding-bottom: 10px;
    text-align: left
}

.footer-address ul li {
    display: flex;
    flex-direction: column;
    padding-bottom: 20px
}

.footer-address ul li span {
    color: #a3a3a3;
    font-size: 16px;
    font-weight: 400
}

.footer-address ul li a {
    font-weight: 600
}

.footer-bottom-wrap {
    padding: 25px 0;
    border-top: 1px solid #4e4e4e;
    z-index: 1111;
    text-align: center;
    position: relative
}

.footer-bottom-text p {
    text-align: right
}

.footer-bottom-privacy ul,.footer-bottom-social ul {
    display: flex
}

.footer-bottom-privacy ul li {
    padding: 0 20px;
    border-left: 1px solid #8c8c8c
}

.footer-bottom-privacy ul li a,.footer-bottom-text p {
    color: #d3cece;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
    text-align: center;
}

.footer-bottom-social ul li {
    padding: 0 10px
}

.footer-bottom-social ul li a {
    color: #fff;
    font-size: 16px;
    font-weight: 400
}

.footer-bottom-social ul li a:hover {
    color: #a81318
}

.footer-address,.footer-menu {
    display: flex;
    justify-content: center
}

.footer-menu ul li a i {
    margin-right: 10px
}

.det-packages .boxpackages:hover .bets_seller_list ul h5,.det-packages .boxpackages:hover .bets_seller_list ul li:before,.det-packages .boxpackages:hover .botarea-pack .liovechats-bx a h5,.det-packages .boxpackages:hover .botarea-pack .liovechats-bx a span,.det-packages .boxpackages:hover .botarea-pack .liovechats-bx a span:before,.det-packages .boxpackages:hover .packheads h3,.det-packages .boxpackages:hover .packtitles .fleft h3,.footer-menu ul li:hover a {
    color: #fff
}

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

.banner-right .preview {
    position: absolute;
    top: .5em;
    left: .5em;
    width: 225px
}

.banner-right .preview img {
    width: 100%;
    height: auto
}

.banner-right .container,.stage {
    box-sizing: border-box;
    max-width: 620px;
    width: 750px;
    height: 950px
}

.banner-right .container {
    position: absolute;
    perspective: 1000px
}

.banner-right .slice,.banner-right .stage {
    position: absolute;
    height: 100%;
    transform-style: preserve-3d;
    transform-origin: 0
}

.banner-right .stage {
    width: 100%
}

.banner-right .slice {
    background-color: #0a0a13;
    -webkit-transition: background-image .9s linear;
    -o-transition: background-image .9s linear;
    transition: background-image .9s linear;
    background-size: cover!important;
    background-repeat: no-repeat!important
}

.web-content h2 {
    font-size: 63px
}

.web-inner-img1,.web-inner-img2 {
    background-image: url(/assets/images/website/banner-full.webp);
    position: absolute;
    top: 21%;
    right: 22.5%;
    width: 370px;
    height: 600px;
    border-radius: 20px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: top;
    transition: background-position-y 4s linear;
    z-index: 2
}

.web-inner-img1:hover,.web-inner-img2:hover {
    background-position-y: bottom;
    box-shadow: 0 0 30px 0 #363636
}

.web-inner-img2 {
    background-image: url(/assets/images/website/banner-full02.webp);
    top: 15%;
    right: 2%;
    height: 800px;
    transition: background-position-y 30s linear
}

.web-design {
    padding: 80px 0;
    position: relative
}

.web-design .main-heading h2 {
    color: #000;
    font-size: 54px;
    line-height: 60px
}

.web-service-box a {
    transition: all ease-in-out .3s;
    height: 100%
}

.web-service-box a.active {
    box-shadow: 0 0 16px 0 #d2d2d2
}

.web-design .web-service-box .service-text-wrap {
    text-align: left;
    color: #000
}

.web-design .service-tab-wrap {
    border: 0;
    padding: 50px 0 25px
}

.web-design .service-text {
    padding: 15px 0 8px
}

.web-design .de-serv-img {
    height: 55px
}

.web-design .inner-tab-content {
    position: absolute;
    right: 13%;
    top: 35%
}

.web-design .inner-service-image-box {
    display: flex
}

.custom-box a img:hover {
    color: #d8d5cb;
    -webkit-transform: scale(1.1);
    -khtml-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    box-shadow: 0 0 30px 0 #a9a9a9
}

.web-design .web-serv-img02 {
    padding: 11% 0 0 5%
}

.nav-tabs .nav-link.active,.web-design .nav-tabs .nav-item.show .nav-link {
    color: transparent;
    background-color: transparent;
    border-color: transparent
}

.web-design .nav-tabs .nav-link.active .de-serv-img img {
    filter: invert(19%) sepia(93%) saturate(5322%) hue-rotate(341deg) brightness(83%) contrast(125%)
}

.web-service-box.box-1 {
    border-bottom: 1px solid #e6e6e6
}

.web-service-box.box-1,.web-service-box.box-3 {
    border-right: 1px solid #e6e6e6
}

.web-service-box.box-2 {
    border-bottom: 1px solid #e6e6e6
}

.web-service-box a.nav-link {
    padding-top: 20px
}

.web-serv-btn {
    margin-top: 0;
    margin-left: 14px
}

.maincta {
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 37px 0;
    background-image: linear-gradient(#242424,#181818)
}

.maincta h3 {
    color: #fff;
    font-size: 31px;
    font-weight: 400;
    line-height: 45px;
    margin: 0 0 8px
}

.maincta p {
    color: #c4c4c4;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 0
}

.padright0 {
    padding-right: 0
}

.maincta .btn-radius-top {
    float: right;
    margin-top: 20px;
    display: inline-block
}

.maincta .btn-radius-top a i {
    margin-right: 2px
}

.maincta .btn-radius-top a:first-child {
    margin-right: 8px;
    background: 0 0;
    color: #fff;
    transition: all .3s ease-out
}

.maincta .btn-radius-top a {
    border: 2px solid #fff;
    color: #6f1f73;
    border-radius: 50px;
    padding: 8px 30px;
    font-size: 17px;
    margin: 0;
    text-transform: uppercase;
    font-weight: 600;
    background: #fff;
    transition: all .3s ease-out
}

.maincta .callsdivs {
    color: #fff;
    font-weight: 400;
    display: block;
    text-align: right;
    float: left;
    width: 100%;
    text-shadow: 0 0 1px #313131;
    font-size: 21px;
    padding: 30px 0 0
}

.maincta .callsdivs a {
    padding: 0 20px 0 0;
    font-size: 17px;
    font-weight: 600;
    transition: all .5s ease-in-out;
    display: inline-block;
    color: #fff
}

.maincta .callsdivs a span {
    font-size: 16px;
    font-weight: 400;
    margin-right: 6px;
    color: #fff
}

.maincta .callsdivs a:hover {
    color: #ff004a;
    transform: rotateX(360deg)
}

.maincta h3 span {
    color: #fff;
    font-size: 37px
}

.maincta .callsdivs a i {
    margin-right: 10px;
    font-size: 15px
}

.maincta .btn-radius-top a:hover {
    color: #e2020c;
    background-color: #fff
}

.maincta .callsdivs a:first-child {
    border-right: 1px solid #8a8a8a
}

.det-packages {
    padding: 80px 0;
    width: 100%
}

.det-packages .sechead h3 {
    color: #111;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
    text-align: center
}

.det-packages .sechead p {
    font-size: 16px;
    color: #505050;
    line-height: 25px;
    margin-top: 21px;
    margin-bottom: 30px;
    text-align: center
}

.det-packages .boxpackages:hover {
    transform: scale(1.1);
    border: 1px solid #ff0042;
    background-color: #cf0420
}

.det-packages .boxpackages:hover .botarea-pack a.btn-orders,.det-packages .boxpackages:hover .packtitles .fright-pricing,.det-packages .boxpackages:hover .pkg-top-btn {
    background-color: #fff
}

.det-packages .boxpackages:hover .bets_seller_list ul li {
    color: #e6e6e6d4
}

.det-packages .boxpackages:hover .packheads p {
    color: #e9e9e9
}

.det-packages .boxpackages {
    background: #fff;
    border-radius: 15px;
    padding: 20px 16px 30px;
    width: 100%;
    box-shadow: -2px 10px 40px -10px #00000059;
    position: relative;
    border: 1px solid transparent;
    transition: all .3s ease-out;
    margin: 0 0 50px;
    overflow: hidden
}

.det-packages .boxpackages .packheads h3 {
    font-size: 19px;
    color: #111;
    font-weight: 600;
    margin: 0 0 10px
}

.det-packages .boxpackages .packheads p {
    font-size: 13px;
    color: #ababab;
    min-height: 37px
}

.det-packages .boxpackages .packheads {
    border-bottom: 2px solid #d1d7e3
}

.boxpackages .packdetails .packtitles .fleft h3 {
    font-size: 38px;
    color: #cf0420;
    font-weight: 600;
    margin: 0;
    padding: 10px 0
}

.pkg-top-btn a {
    color: #cf0420;
    font-weight: 500
}

.pkg-top-btn {
    border: 1px solid #ccc;
    border-radius: 40px;
    font-size: 14px;
    text-align: center;
    width: 80%;
    padding: 5px
}

.boxpackages .packdetails .packtitles .fleft h3 sup {
    font-size: 19px;
    font-weight: 600;
    top: -17px
}

.packtitles .fright {
    position: absolute;
    padding: 4px 10px 0;
    top: 21%;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    left: 112px
}

.packdetails .packtitles .fright h4 {
    font-size: 5px;
    color: #fff;
    font-weight: 400;
    margin: 0
}

.boxpackages .packdetails .packtitles .fleft h3 sub {
    text-decoration: line-through;
    display: inline-block;
    font-size: 15px;
    color: #c1c1c1;
    font-weight: 400;
    right: 25px;
    bottom: 1px
}

.packdetails .bets_seller_list ul li {
    position: relative;
    font-size: 14px;
    color: #9c9c9c;
    padding: 5px 0 5px 25px
}

.packdetails .bets_seller_list ul li:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00c";
    display: inline-block;
    position: absolute;
    left: 0;
    top: 7px;
    color: #cf0420
}

.packdetails .bets_seller_list ul {
    display: block;
    width: 100%;
    padding: 14px 0;
    margin: 0;
    height: 250px
}

.boxpackages .packdetails .bets_seller_list h3 {
    font-size: 14px;
    color: #cf0420;
    font-weight: 700
}

.packdetails .botarea-pack {
    padding: 15px 0 0;
    display: flex;
    justify-content: space-between;
    border-top: 2px solid #d1d7e3
}

.packdetails .botarea-pack a.btn-orders {
    border: 1px solid #cf0420;
    border-radius: 30px;
    padding: 8px 18px;
    color: #cf0420;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    display: inline-block;
    transition: all .3s ease-out;
    margin: 0
}

.packdetails .botarea-pack .liovechats-bx {
    margin-top: -4px;
    padding-right: 14px
}

.packdetails .botarea-pack .liovechats-bx a span {
    font-size: 10px;
    color: #242424;
    position: relative
}

.packdetails .botarea-pack .liovechats-bx a span:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f4ad";
    position: absolute;
    right: -25px;
    top: -4px;
    color: #cf0420;
    font-size: 16px
}

.packdetails .botarea-pack .liovechats-bx a h5 {
    font-weight: 700;
    color: #111;
    font-size: 16px;
    margin: 0
}

.view-details-container a {
    text-transform: uppercase;
    font-size: 13px;
    color: #a09e9e;
    font-weight: 600
}

.logo-design-inner,.mobile-app-inner-img1 {
    position: absolute;
    top: 23%;
    right: 8%;
    animation-name: star;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-direction: alternate
}

.mobile-app-inner-img1 img {
    width: 590px
}

.logo-design-inner {
    right: -10%
}

.logo-design-inner img {
    width: 300px;
    margin: -20px
}

.animation-banner-img img {
    width: 390px
}

.portfolio-banner-img img {
    width: 731px
}

.portfolio-banner-img {
    position: absolute;
    top: 32%;
    right: 0
}

.about-banner-img,.clinet-view-wraper::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0
}

.about-heading h2 {
    font-size: 45px
}

.about-banner-img img,.image-set img {
    width: 100%;
    height: 100%
}

.abut-h2 {
    font-size: 30px
}

.about-p {
    padding-top: 10px!important
}

.clinet-view-wraper {
    width: 100%;
    height: 290px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 11%;
    border-radius: 29px;
    transition: all .4s ease-in-out
}

.clinet-view-wraper::after {
    content: "";
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    left: 0;
    border-radius: 29px
}

.about-img1::after {
    background-image: url(/assets/images/about/clinet-view01.webp)
}

.about-img2::after {
    background-image: url(/assets/images/about/clinet-view02.webp)
}

.about-img3::after {
    background-image: url(/assets/images/about/clinet-view03.webp)
}

.clinet-view-heading {
    text-align: center;
    z-index: 1
}

.clinet-view-heading h4 {
    font-size: 30px;
    color: #fff;
    font-weight: 700
}

.clinet-view-heading p {
    font-size: 18px;
    color: #fff;
    margin-top: 4%;
    line-height: 31px;
    font-weight: 300
}

.slick-initialized .slick-slide {
    display: flex;
    justify-content: center
}

.image-set img {
    object-fit: cover
}

.logo-design-tab {
    height: 370px;
    background: #020407;
    border-radius: 29px;
    display: flex;
    object-fit: cover;
    align-items: center;
    transition: all .4s ease-in-out
}

.animation-logo1 {
    background: #1d1639
}

.animation-logo2 {
    background-color: #0036eb!important
}

.logo-design-tab:hover {
    color: #d8d5cb;
    -webkit-transform: scale(1.1);
    -khtml-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    box-shadow: 0 0 30px 0 #a9a9a9
}

.bg-color {
    background-color: #5d36ed
}

.floatbutton,.floatbutton.active {
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -o-transition: .4s;
    transition: .4s
}

.floatbutton.active {
    right: 0;
    z-index: 9
}

.floatbutton {
    position: fixed;
    left: -420px;
    top: 25%;
    font-size: 0;
    width: 420px;
    z-index: 9999;
    opacity: 0
}

.floatbutton.show-form {
    opacity: 1
}

.floatbutton .clickbutton {
    width: 50px;
    z-index: 99;
    cursor: pointer;
    box-shadow: -20px 0 35px #0000001f;
    border-radius: 40px 0 0 40px;
    background: #fff;
    display: inline-block;
    padding-top: 0;
    vertical-align: top;
    margin-top: 125px;
    height: 0
}

.floatbutton .clickbutton .crossplus:after,.floatbutton .clickbutton .crossplus:before {
    content: "";
    display: none;
    position: absolute;
    right: 0;
    z-index: 99;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto
}

.floatbutton .clickbutton .crossplus:before {
    width: 20px;
    height: 2px;
    background: #fbb334
}

.floatbutton .clickbutton .crossplus:after {
    width: 2px;
    height: 20px;
    background: #fab334
}

.floatbutton .clickbutton .crossplus {
    position: relative;
    display: block
}

.floatbutton .clickbutton .crossplus,.floatbutton .clickbutton .crossplus.rotate {
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
    transform: rotate(-90deg)
}

.floatbutton .clickbutton .crossplus i {
    font-size: 18px;
    color: #0089ff;
    margin: 17px 0 0 15px
}

.floatbutton .clickbutton .crossplus p {
    font-size: 20px;
    width: 250px;
    top: 424px;
    position: relative;
    margin-top: 190px;
    background: #fff;
    height: 60px;
    background: #ffff;
    border-radius: 0 0 20px 20px;
    padding-top: 15px;
    text-align: center;
    font-weight: 600;
    color: #ea0122;
    box-shadow: 0 0 40px #00000026!important;
    border: 2px solid #ea0122
}

.banner-form {
    background: #fff;
    padding: 30px;
    position: relative;
    z-index: 9;
    border-radius: 5px 0 0 5px;
    margin: 0;
    width: 370px;
    display: inline-block;
    box-shadow: 0 0 30px #0000001f
}

.ban-form input,.ban-form textarea {
    width: 100%;
    border: 1px solid #e5e5e5;
    background: #fff;
    padding: 10px 15px;
    color: gray;
    font-size: 14px;
    border-radius: 3px;
    height: 50px;
    font-weight: 400;
    outline: 0!important;
    margin: 0 0 15px
}

.banner-form .intl-tel-input {
    width: 100%
}

.banner-form h3 {
    color: #333;
    font-size: 24px;
    margin-bottom: 20px;
    font-weight: 400
}

.banner-form h3 strong {
    font: 24px/24px "gilroy-bold",sans-serif;
    font-weight: 500
}

.ban-form button{
    color: #fff;
    font-weight: 600;
    background: #0089ff;
    border-radius: 3px;
    text-align: center;
    padding: 10px 15px;
    margin: 20px 0 0;
    border: transparent;
    font-size: 18px;
}

.ban-form textarea {
    height: 80px;
    margin: 15px 0 0
}

.btns_wrap {
    position: fixed;
    left: 0
}

.btns_wrap a:hover {
    text-decoration: none!important;
    left: 0
}

.btns_wrap .call_wrap {
    width: 280px;
    position: absolute;
    left: -220px;
    background: #fff;
    top: 54px;
    border-radius: 0 50px 50px 0;
    overflow: hidden;
    box-shadow: 0 0 40px #00000026!important;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    border: 2px solid #ea0122;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btns_wrap .call_wrap span,.btns_wrap .chat_wrap span {
    color: #333;
    font-size: 18px;
    vertical-align: middle;
    background: #fff;
    padding: 15px 20px 15px 10px
}

.floatbutton.current {
    left: -53px
}

.btns_wrap .chat_wrap {
    display: block;
    position: absolute;
    left: -220px;
    width: 280px;
    background: #fff;
    top: -12px;
    overflow: hidden;
    box-shadow: 0 0 40px #00000026!important;
    border: 2px solid #ea0122;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    border-radius: 0 50px 50px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btns_wrap .call_wrap span.icoo,.btns_wrap .chat_wrap span.icoo {
    color: #ea0122;
    background: #fff;
    font-size: 18px;
    padding: 15px 25px;
    border-left: 1px solid #ded9d9;
    vertical-align: middle;
    display: inline-block;
    margin-top: -5px
}

.btns_wrap .chat_wrap span {
    padding: 15px 15px 15px 62px
}

.about-us-content {
    padding-bottom: 20px!important;
    border-bottom: 0!important
}

.clinet-icons {
    padding: 8% 0;
    border-bottom: 1px solid #dcdcdc
}

.clinet-icons-heading h2 {
    text-align: center;
    color: #211e1e;
    font-size: 48px;
    margin-bottom: 5%
}

.clinet-view-wraper:hover {
    color: #d8d5cb;
    -webkit-transform: scale(1.1);
    -khtml-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    box-shadow: 0 0 30px 0 #a9a9a9;
    border-radius: 29px;
    transition: all .4s ease-in-out
}

.clinet-icons-wraper {
    border: 1px solid #ccc;
    width: 234px;
    height: 232px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 0
}

.clinet-icons-wraper:nth-child(n+6) {
    border-top: 0
}

.clinet-icons-wraper:last-child,.clinet-icons-wraper:nth-child(5) {
    border-right: 1px solid #ccc
}

.clinet-icons-set {
    display: grid;
    grid-template-columns: auto auto auto auto auto
}

.clinet-icons-wraper:hover {
    box-shadow: 0 0 59px 0 rgba(0,0,0,.21)
}

.maincta .btn-radius-top a+a:hover {
    color: #fff;
    background-image: linear-gradient(to right,#fd0043,#bb0f3e,#7a1632,#3e1320,#000)
}

.content-wrapper.pricing-inner-pg,.inner-about-us {
    background-image: url(/assets/images/about-us-bann.webp);
    background-size: cover;
    background-position: 100%;
    background-repeat: no-repeat
}

.content-wrapper.pricing-inner-pg {
    background-image: url(/assets/images/pricing-bg.webp)
}

.contact-data:hover a,.contact-data:hover p,.megamenu a.dropdown-item:hover h6,.megamenu a.dropdown-item:hover p,.pricing-inner-pg .main-heading h2 span {
    color: #fff
}

.packages-tabs .nav-tabs li a {
    background-color: initial!important;
    padding: 10px 17px;
    border-radius: 25px;
    font-weight: 500;
    font-family: 'Poppins',sans-serif;
    font-size: 16px;
    color: #000
}

.packages-tabs .nav-tabs {
    border: 0;
    display: flex;
    justify-content: space-around
}

.nav-tabs+.tab-content {
    padding: 50px 0
}

.packages-tabs .nav-tabs .nav-link:hover {
    border-color: #b92b31
}

.packages-tabs .nav-tabs li {
    margin-right: 0
}

.packages-tabs .nav-tabs li a.active {
    background-color: #cf0420!important;
    color: #fff
}

.content-wrapper.inner-contact-us {
    /* background-image: url(/assets/images/contact-bann.webp); */
    background-size: cover;
    background-position: 100%;
    background-repeat: no-repeat
}

.about-heading.contact-us-area {
    padding-bottom: 60px
}

.contact-details h2 {
    font-size: 48px;
    padding-bottom: 10px
}

.contact-data a {
    color: #000;
    font-weight: 700;
    font-size: 24px;
    display: grid
}

.contact-data {
    padding: 20px 10px;
    border-bottom: 1px solid #e0e0e0
}

.contact-data a span {
    font-size: 17px;
    font-weight: 400
}

.contact-data a span svg {
    margin-right: 8px
}

.contact-data p {
    font-size: 18px;
    font-weight: 500
}

.contact-data ul.social {
    display: flex
}

.contact-data:hover {
    background-color: #ea0122
}

.contact-data:hover a svg {
    fill: #fff
}

.inner-contact-form form .form-group label:first-child {
    font-size: 14px;
    color: #b3b3b3;
    position: absolute;
    top: 12px;
    left: 20px;
    transition: .15s all linear
}

.inner-contact-form form .form-control {
    padding: 25px 10px;
    font-size: 18px;
    line-height: 2;
    background-color: #ededed
}

.inner-contact-form form .form-group {
    margin-bottom: 30px;
    position: relative
}

ul.social li {
    margin-right: 10px;
    padding-top: 6px
}

.contact-button {
    margin: 0;
    text-align: right
}

.contact-button .default-btn {
    border: 1px solid #fff;
    font-size: 16px;
    background-color: #e90122;
    color: #fff
}

.contact-button .default-btn:after,.contact-button .default-btn:before {
    position: absolute;
    top: 50%;
    content: "";
    width: 20px;
    height: 15px;
    border-radius: 50%;
    background-image: -webkit-linear-gradient(90deg,rgb(33 37 41) 0,rgb(33 37 41) 100%)
}

.megamenu {
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    top: 70px;
    border: 0;
    border-radius: 0;
    background-color: rgb(74 74 74/48%);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    opacity: 1;
    padding: 10px
}

.megamenu a.dropdown-item {
    padding: 0;
    width: 90%;
    margin: 0 auto 10px;
    transition: all .25s ease-in-out;
    border-radius: 8px;
    border: 1px solid #d54464;
    background-color: #fff
}

.mega-links-box {
    padding: 15px 0
}

.mega-links-box img {
    margin: 0 auto;
    display: table;
    padding-top: 0;
    padding-bottom: 0
}

.megamenu h6 {
    margin-left: 0;
    text-align: center;
    font-size: 15px;
    padding-top: 10px;
    padding-bottom: 10px
}

.megamenu p {
    color: #000;
    text-align: center;
    font-size: 13px;
    padding-bottom: 0;
    line-height: 19px;
    text-transform: capitalize
}

.megamenu a.dropdown-item:hover {
    box-shadow: 4px 4px 8px #000;
    background-image: linear-gradient(to right,#fd0043,#bb0f3e,#7a1632,#3e1320,#000);
    transform: scale(1.05)
}

.megamenu a.dropdown-item:hover img {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(1deg) brightness(107%) contrast(102%)
}

.get-started-popup {
    background-image: url(/assets/images/modal-bg.webp);
    background-size: cover;
    width: 750px;
    height: 456px;
    padding: 0 10% 0 0
}

.get-started-popup button.close {
    position: absolute;
    top: -13px;
    right: -15px;
    background-color: #da0a2c;
    color: #fff;
    font-weight: 400;
    border-radius: 50px;
    height: 30px;
    width: 30px;
    opacity: 1;
    border: 1px solid #fff
}

.heading-h1 {
    font-size: 80px;
    font-weight: 600;
    color: #000;
    margin-bottom: 0
}

.popup-headig {
    text-align: right;
    position: relative;
    padding-right: 14%;
    margin-top: 10%
}

.heading-h2 {
    font-size: 100px;
    font-weight: 700;
    color: #da0a2c;
    letter-spacing: -1px
}

h2.heading-h3 {
    position: absolute;
    transform: rotate(-90deg);
    font-weight: 400;
    font-size: 96px;
    top: 23%;
    right: -4%;
    color: #da0a2c
}

.long-h1 {
    font-size: 45px;
    font-weight: 400;
    color: #000;
    margin: 0 0 3%;
    text-align: right;
    line-height: 35px
}

.long-heading span,.megamenu h6 {
    color: #000;
    font-weight: 700
}

#regForm .tab {
    display: none;
    margin: 0;
    position: relative
}

.banner_form_area input {
    background-color: #fff;
    width: 100%;
    height: 53px;
    padding: 0 20px 0 50px;
    font-weight: 500;
    font-size: 12px;
    border: 1px solid #acacac;
    border-radius: 5px
}

.banner_form_btn {
    display: flex;
    justify-content: space-between;
    margin-left: 10px;
    position: relative;
    z-index: 3
}

.sbt_set {
    border-radius: 5px;
    background-color: #da0a2c;
    width: auto;
    height: 46px;
    border: 0;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    margin: 0 2px;
    cursor: pointer;
    padding: 0 20px
}

.sbt_set:hover {
    background-image: none;
    box-shadow: 0 2px 5px -1px #fff
}

.sbt_set:focus {
    outline: 0;
    border: 0
}

.popup-form {
    height: 46px
}

img.image1 {
    left: -60px;
    top: -50px;
    width: 190px
}

img.image2 {
    top: -110px;
    width: 125px;
    left: 105px
}

.modal-images {
    display: grid;
    grid-template-columns: auto auto auto auto;
    width: 100%
}

img.image3 {
    width: 165px;
    left: 165px
}

.modal-images img {
    position: absolute;
    box-shadow: 0 0 15px 0 #00000029
}

img.image4 {
    position: absolute;
    left: 250px;
    top: -100px;
    width: 70px
}

.main-modal-form .modal-dialog {
    max-width: 750px
}

.packtitles {
    display: flex;
    align-items: center;
    position: relative
}

.packtitles .fright-pricing {
    position: absolute;
    right: -20px;
    background-color: #7f7f7f;
    text-align: center;
    padding: 6px 12px;
    transition: all .3s ease-out
}

.packtitles .fright-pricing:before {
    position: absolute;
    z-index: 9;
    background-color: transparent;
    left: -18px;
    content: "";
    width: 0;
    height: 0;
    border-top: 25px solid transparent;
    border-bottom: 22px solid transparent;
    border-left: 18px solid #7f7f7f;
    transform: rotate(180deg);
    top: 0;
    transition: all .3s ease-out
}

.det-packages .boxpackages:hover .packtitles .fright-pricing:before {
    border-left: 18px solid #fff
}

.packtitles .fright-pricing h4 {
    font-size: 12px;
    color: #fff;
    margin: 0;
    font-weight: 500;
    transition: all .3s ease-out
}

.packtitles .fright-pricing h4 span.cutprice {
    text-decoration: line-through;
    display: block;
    font-size: 18px;
    color: #fff;
    transition: all .3s ease-out
}

.packagestabs .packages-tabs .nav-tabs {
    justify-content: center;
}

.packagestabs .packages-tabs .nav-tabs li {
    margin: 0 10px;
}

.banner-button .default-btn:hover span {
    color: #fff !IMPORTANT;
    z-index: 999;
    position: relative;
}
.banner-button .default-btn span{
    color: #fff !IMPORTANT;
}
.content-wrap .about-p {
    padding: 20px 0px 15px 0;
}
.ban-arrow{
    display: none;
}

/* Combo-Package-Css */
.top-packages {
    position: relative;
    margin-top: 30px;
    background-color: #0c1623!important;
    padding-bottom: 20px;
}
.top-packages * {
    color: #fff;
}
.top-packages .bg-secondary {
    padding: 30px;
    background-color: transparent !important;
}
.top-packages h2 {
    margin: 100px 0 10px;
    font-size: 46px;
    padding-left: 0;
    font-weight: 700;
}
.combo-list-style ul {
    display: grid;
    grid-template-columns: 50% 50%;
    margin-top: 25px;
    padding-left: 0px;
}
.combo-list-style ul li {
    border-bottom: 1px dashed rgb(255 255 255 / 15%);
    padding: 10px 0;
    margin-right: 35px;
    display: inline-flex;
    align-items: center;
    font-size: 14px;
}
.final .ult-cut-prc:before {
    content: "";
    background-color: #e92227;
    position: absolute;
    left: 0px;
    right: 0;
    top: 50%;
    width: 135px;
    height: 2px;
    margin: auto;
}
.final .ult-cut-prc {
    font-size: 40px !important;
    color: #fff !important;
    position: relative;
    margin: 0;
}
.final h1 {
    color: #fff;
    font-size: 72px;
    padding-right: 11px;
    font-weight: 700;
    line-height: 40px;
    margin: 20px 0px 0px 0px;
}
.final {
    text-align: center;
    margin-bottom: 30px;
}
.final .btn-default {
    padding: 12px 25px 12px 25px !important;
    width: 80%;
    color: #fff !important;
    background: #dd161d;
    border: none;
    font-weight: 500;
    margin: 30px auto 0;
    display: block;
    font-weight: 700;
}
.top-packages::before {
    position: absolute;
    display: block;
    content: "";
    background: url(../images/limiteds.webp);
    width: 150px;
    height: 150px;
    left: 0px;
    top: 0px;
    z-index: 999;
}
.combo-slider.owl-carousel .owl-item img {
    width: auto;
}
.combo-sec{
    padding-bottom: 90px;
}
.combo-slider .package-box:hover {
    background-image: linear-gradient(#0c1623, #0c1623);
}
.combo-slider .package-box{
    background-image: linear-gradient(#0c1623, #0c1623);
}
/* Combo-Package-Css */


.final figure {
    text-align: right !important;
}

.package-box figure {
    text-align: center;
}

/*==============================
WHO THE PACKAGE IS FOR
==============================*/

.audience-section{
    padding:120px 0;
    background:#fff;
    position:relative;
    overflow:hidden;
}

.audience-section::before{
    content:"";
    position:absolute;
    width:450px;
    height:450px;
    border-radius:50%;
    background:radial-gradient(circle,#ffefef 0%,transparent 70%);
    top:-220px;
    right:-180px;
    z-index:0;
}

.container{
    width:min(1180px,90%);
    margin:auto;
    position:relative;
    z-index:2;
}

/*==============================
Heading
==============================*/

.section-title{
    text-align:center;
    margin-bottom:80px;
}

.section-title span{

    display:inline-block;
    color:#e30613;
    text-transform:uppercase;
    letter-spacing:3px;
    font-size:13px;
    font-weight:700;
    margin-bottom:18px;
}

.section-title h2{

font-size: 42px;

line-height:1.15;

font-weight:700;

color:#111;

margin-bottom:25px;
}

.section-title p{

    max-width:700px;
    margin:auto;
    color:#666;
    font-size:17px;
    line-height:1.8;
}

/*==============================
List
==============================*/

.audience-list{

    display:flex;
    flex-direction:column;
    gap:22px;
}

/*==============================
Item
==============================*/

.audience-item{

    display:grid;
    grid-template-columns:110px 1fr 70px;

    align-items:center;

    gap:35px;

    padding:38px 40px;

    background:#fff;

    border-radius:20px;

    border:1px solid #ececec;

    transition:.45s cubic-bezier(.2,.8,.2,1);

    position:relative;

    overflow:hidden;
}

/* Left Animated Line */

.audience-item::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:0;

    height:100%;

    background:#e30613;

    transition:.4s;
}

/* Soft Hover Shadow */

.audience-item:hover{

    transform:translateY(-8px);

    box-shadow:
    0 20px 60px rgba(0,0,0,.08);

    border-color:transparent;
}

.audience-item:hover::before{

    width:6px;
}

/*==============================
Number
==============================*/

.number{

    font-size:60px;

    font-weight:800;

    color:#d6d6d6;

    transition:.35s;

    line-height:1;
}

.audience-item:hover .number{

    color:#e30613;

    transform:scale(1.05);
}

/*==============================
Content
==============================*/

.content h3{

    font-size:26px;

    margin-bottom:12px;

    color:#111;

    transition:.3s;
}

.content p{

    color:#777;

    line-height:1.8;

    font-size:16px;

    max-width:700px;
}

.audience-item:hover h3{

    color:#e30613;
}

/*==============================
Arrow
==============================*/

.arrow{

    width:55px;
    height:55px;

    border-radius:50%;

    border:1px solid #ddd;

    display:flex;
    justify-content:center;
    align-items:center;

    font-size:26px;

    color:#999;

    transition:.35s;
}

.audience-item:hover .arrow{

    background:#e30613;

    color:#fff;

    border-color:#e30613;

    transform:translateX(8px) rotate(-45deg);
}

/*==============================
Background Glow
==============================*/

.audience-item::after{

    content:"";

    position:absolute;

    width:260px;
    height:260px;

    border-radius:50%;

    background:rgba(227,6,19,.05);

    right:-180px;
    top:-120px;

    transition:.5s;
}

.audience-item:hover::after{

    transform:scale(1.4);
}

/*==============================
Responsive
==============================*/

@media(max-width:992px){

.section-title h2{

    font-size:40px;
}

.audience-item{

    grid-template-columns:80px 1fr;

}

.arrow{

    display:none;
}

.number{

    font-size:48px;
}

}

@media(max-width:768px){

.audience-section{

    padding:80px 0;
}

.section-title{

    margin-bottom:50px;
}

.section-title h2{

    font-size:32px;
}

.section-title p{

    font-size:15px;
}

.audience-item{

    display:block;

    padding:28px;

}

.number{

    margin-bottom:18px;
}

.content h3{

    font-size:22px;
}

.content p{

    font-size:15px;
}

}

@media(max-width:480px){

.section-title h2{

    font-size:28px;
}

.number{

    font-size:42px;
}

.content h3{

    font-size:20px;
}

}


/* section2 */
/*====================================
WHY PRODIGY SECTION
====================================*/


.why-prodigy{

padding:120px 0;

background: #111111;

overflow:hidden;
}


.why-prodigy .container{

    width:min(1200px,90%);
    margin:auto;

}


/*====================================
TOP AREA
====================================*/


.why-top{

text-align:center;

margin:auto;

margin-bottom:80px;
}


.why-top span{

    color:#e30613;

    font-size:13px;

    font-weight:700;

    letter-spacing:3px;

}


.why-top h2{

margin-top:20px;

font-size: 42px;

line-height: 54px;

color: #ffffff;

font-weight:700;
}


.why-top p{

margin-top:25px;

color: #ffffff;

font-size: 16px;

line-height:1.8;
}



/*====================================
MAIN WRAPPER
====================================*/


.benefit-wrapper{

    display:grid;

    grid-template-columns:380px 1fr;

    gap:35px;

    align-items:start;

}



/*====================================
MAIN FEATURE CARD
====================================*/


.main-benefit{


    background:#111;

    color:white;

    padding:45px;

    border-radius:30px;

    min-height:430px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    position:sticky;

    top:100px;

    overflow:hidden;

}



.main-benefit::before{

    content:"";

    position:absolute;

    width:300px;

    height:300px;

    background:#e30613;

    filter:blur(100px);

    opacity:.5;

    right:-120px;

    bottom:-120px;

}



.icon{

width:70px;

height:70px;

background:#e30613;

color:white;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:35px;

font-weight:700;

margin-bottom:30px;
}



.main-benefit h3{

    font-size:32px;

    line-height:1.2;

    margin-bottom:18px;

}


.main-benefit p{

    color:#cfcfcf;

    line-height:1.8;

}



/*====================================
SMALL BENEFITS
====================================*/


.benefits{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;

}



.benefit-card{

padding:35px;

background: #00000024;

border:1px solid #ececec;

border-radius:24px;

transition:.4s;

position:relative;

overflow:hidden;
}



.benefit-card::after{

    content:"";

    position:absolute;

    width:100px;

    height:100px;

    background:#ffe8ea;

    border-radius:50%;

    right:-40px;

    top:-40px;

    transition:.4s;

}



.benefit-card:hover{

transform:translateY(-8px);

box-shadow:
    0 25px 70px rgba(0,0,0,.08);

border-color:transparent;

background: #e2061324;

border: 1px solid #fff;
}



.benefit-card:hover::after{

    transform:scale(2);

}



.benefit-card h3{

    font-size:42px;

    color:#e30613;

    margin-bottom:20px;

    position:relative;

    z-index:2;

}



.benefit-card h4{

font-size:22px;

color: #ffffff;

margin-bottom:12px;

position:relative;

z-index:2;
}



.benefit-card p{

color: #b5b5b5;

line-height:1.7;

position:relative;

z-index:2;
}



/*====================================
RESPONSIVE
====================================*/


@media(max-width:1000px){


.benefit-wrapper{

    grid-template-columns:1fr;

}



.main-benefit{

    position:relative;

    top:0;

    min-height:auto;

}


}



@media(max-width:700px){


.why-prodigy{

    padding:80px 0;

}


.why-top h2{

    font-size:34px;

}



.benefits{

    grid-template-columns:1fr;

}



.main-benefit{

    padding:35px;

}



.benefit-card{

    padding:28px;

}


}


/* process */
.process-section{

padding:120px 0;
background:#111;
color:white;
overflow:hidden;

}


.process-container{

width:min(1200px,90%);
margin:auto;

}



.process-heading{

text-align:center;
max-width:750px;
margin:auto;
margin-bottom:80px;

}


.process-heading span{

color:#e30613;
font-size:13px;
font-weight:700;
letter-spacing:3px;

}


.process-heading h2{

font-size:52px;
line-height:1.15;
margin:20px 0;

}


.process-heading p{

color:#aaa;
font-size:17px;
line-height:1.8;

}



/* Layout */


.process-layout{

display:grid;
grid-template-columns:1.2fr .8fr;
gap:60px;

}



/* Timeline */


.timeline{

position:relative;

}


.timeline::before{

content:"";

position:absolute;

left:35px;

top:20px;

height: calc(70% - 40px);

width:1px;

background:#333;
}



.process-item{

display:flex;

gap:35px;

margin-bottom:45px;

position:relative;

}



.step{

width:72px;
height:72px;

flex-shrink:0;

border-radius:50%;

background:#191919;

border:1px solid #333;

display:flex;
align-items:center;
justify-content:center;

font-size:22px;

font-weight:700;

color:#e30613;

transition:.4s;

}


.process-item:hover .step{

background:#e30613;

color:white;

transform:scale(1.1);

}



.process-item h3{

font-size:24px;
margin-bottom:12px;

}


.process-item p{

color:#aaa;
line-height:1.7;

}



/* Requirements */


.requirements{

background:#181818;

border:1px solid #292929;

padding: 40px 30px 40px 40px;

border-radius:30px;

position:sticky;

top:100px;
}



.require-icon{

width:65px;
height:65px;

border-radius:50%;

background:#e30613;

display:flex;

align-items:center;
justify-content:center;

font-size:32px;

margin-bottom:25px;

}


.requirements h3{

font-size: 28px;

margin-bottom:10px;
}


.requirements p{

color:#aaa;

}



.requirements ul{

list-style:none;

margin-top:30px;

}



.requirements li{

padding:12px 0;

border-bottom:1px solid #292929;

color:#ddd;

}

.requirements li {
    list-style: auto;
}

.requirements li::before{

content:"";

color:#e30613;

margin-right:12px;

font-weight:bold;

}


.requirements small{

display:block;

color: #ffffff;

line-height:1.6;

margin-top:25px;

font-weight: 500;

font-size: 14px;
}




@media(max-width:1000px){

.process-layout{

grid-template-columns:1fr;

}


.requirements{

position:relative;
top:0;

}

}



@media(max-width:700px){


.process-section{

padding:80px 0;

}


.process-heading h2{

font-size:34px;

}


.process-item{

gap:20px;

}


.step{

width:55px;
height:55px;

font-size:18px;

}


.process-item h3{

font-size:20px;

}


.requirements{

padding:28px;

}

}

/* upgrade */
.upgrade-section{

padding:120px 0;
background:#f7f7f7;
overflow:hidden;

}


.upgrade-container{

width:min(1200px,90%);
margin:auto;

}



.upgrade-heading{

text-align:center;
max-width:800px;
margin:auto;
margin-bottom:60px;

}


.upgrade-heading span{

color:#e30613;
font-size:13px;
letter-spacing:3px;
font-weight:700;

}


.upgrade-heading h2{

font-size:52px;
line-height:1.15;
color:#111;
margin:20px 0;

}


.upgrade-heading p{

color:#666;
font-size:17px;
line-height:1.8;

}



/* Starter Box */


.starter-box{

background:#111;
color:#fff;

padding:35px 45px;

border-radius:30px;

display:flex;

align-items:center;

gap:30px;

max-width:650px;

margin:0 auto 70px;

}


.price{

font-size:60px;
font-weight:800;
color:#e30613;

}


.starter-box h3{

font-size:28px;
margin-bottom:8px;

}


.starter-box p{

color:#aaa;

}



/* Grid */


.upgrade-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}



.upgrade-card{

background:#fff;

padding:35px;

border-radius:24px;

border:1px solid #e8e8e8;

transition:.4s;

position:relative;

overflow:hidden;

}



.upgrade-card:hover{

transform:translateY(-10px);

box-shadow:
0 25px 60px rgba(0,0,0,.08);

border-color:transparent;

}



.upgrade-icon{

width:45px;
height:45px;

border-radius:50%;

background:#ffe5e7;

color:#e30613;

display:flex;

align-items:center;
justify-content:center;

font-weight:700;

margin-bottom:25px;

}



.upgrade-card h3{

font-size:21px;
color:#111;
margin-bottom:12px;

}


.upgrade-card p{

color:#777;
line-height:1.7;

}



/* CTA */


.upgrade-cta{

text-align:center;
margin-top:60px;
opacity: 1;

}


.upgrade-cta a{

display:inline-flex;

padding:18px 40px;

background:#e30613;

color:white;

border-radius:50px;

font-weight:600;

text-decoration:none;

transition:.3s;

}


.upgrade-cta a:hover{

background:#111;

transform:translateY(-5px);

}




@media(max-width:1000px){

.upgrade-grid{

grid-template-columns:repeat(2,1fr);

}

}


@media(max-width:700px){


.upgrade-section{

padding:80px 0;

}


.upgrade-heading h2{

font-size:34px;

}


.starter-box{

flex-direction:column;

text-align:center;

padding:35px;

}


.upgrade-grid{

grid-template-columns:1fr;

}


.price{

font-size:48px;

}

}

/* faq */

.faq-section{

    padding:120px 0;
    background:#111;

}


.faq-container{

    width:min(950px,90%);
    margin:auto;

}


.faq-heading{

    text-align:center;
    margin-bottom:70px;

}


.faq-heading span{

    color:#e30613;
    font-size:13px;
    letter-spacing:3px;
    font-weight:700;

}


.faq-heading h2{

    color:#fff;
    font-size:52px;
    margin:20px 0;

}


.faq-heading p{

    color:#999;
    font-size:17px;

}



/* FAQ ITEM */

.faq-item{

    border-bottom:1px solid #292929;

}


.faq-question{

    width:100%;

    padding:30px 10px;

    background:none;

    border:none;

    color:white;

    display:flex;

    justify-content:space-between;

    align-items:center;

    cursor:pointer;

    font-size:20px;

    font-weight:600;

    text-align:left;

}



.faq-question i{

    width:35px;
    height:35px;

    border-radius:50%;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#1d1d1d;

    color:#e30613;

    font-size:24px;

    font-style:normal;

    transition:.3s;

}




.faq-answer{

    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;

}



.faq-answer p{

    color:#aaa;

    line-height:1.8;

    padding:0 60px 30px 10px;

}




.faq-item.active .faq-question i{

    transform:rotate(45deg);

    background:#e30613;

    color:#fff;

}




.faq-item.active{

    background:linear-gradient(
        90deg,
        rgba(227,6,19,.08),
        transparent
    );

}




@media(max-width:700px){


.faq-section{

    padding:80px 0;

}


.faq-heading h2{

    font-size:34px;

}


.faq-question{

    font-size:17px;

}


.faq-answer p{

    padding-right:10px;

}


}

/* cta */


.final-cta{

padding:120px 20px;
background:#111;

}


.cta-box{

max-width:900px;
margin:auto;

text-align:center;

color:white;

}


.cta-box span{

color:#e30613;

letter-spacing:3px;

font-size:13px;

font-weight:700;

}


.cta-box h2{

font-size:55px;

line-height:1.15;

margin:25px 0;

}



.cta-box p{

color:#aaa;

font-size:18px;

margin-bottom:40px;

}



.cta-box a{

display:inline-block;

background:#e30613;

color:white;

padding:18px 45px;

border-radius:50px;

text-decoration:none;

font-weight:600;

transition:.3s;

}


.cta-box a:hover{

background:white;

color:#111;

transform:translateY(-5px);

}


.cta-box small{

display:block;

margin-top:25px;

color:#777;

}



@media(max-width:700px){


.cta-box h2{

font-size:34px;

}

}

.faq-question:focus {
    outline: none;
}


.about-section{
    padding:100px 0;
    background: #afafaf0d;
    overflow:hidden;
}

.about-container{
    width:90%;
    max-width:1200px;
    margin:auto;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

.about-image img{
    width:100%;
    display:block;
    border-radius: 40px;
    box-shadow:0 20px 50px rgba(0,0,0,.35);
}

.section-tag{
    display:inline-block;
    color:#5fa8ff;
    font-size:14px;
    letter-spacing:2px;
    text-transform:uppercase;
    font-weight:600;
    margin-bottom:18px;
}

.about-content h2{
    color: #000000;
    font-size:48px;
    line-height:1.2;
    margin-bottom:25px;
    font-weight:700;
}

.about-content p{
    color: #000000;
    font-size:17px;
    line-height:1.9;
    margin-bottom:18px;
}

.about-btn{
    display:inline-block;
    margin-top:15px;
    padding:15px 35px;
    background: #e2020c;
    color:#fff;
    text-decoration:none;
    border-radius:50px;
    font-weight:600;
    transition:.35s;
}

.about-btn:hover{
    background: #000000;
    transform:translateY(-4px);
    color: #fff;
}

/* Responsive */

@media(max-width:991px){

.about-container{

grid-template-columns:1fr;
gap:50px;

}

.about-image{

order:2;

}

.about-content{

order:1;

}

.about-content h2{

font-size:38px;

}

}

@media(max-width:576px){

.about-section{

padding:70px 0;

}

.about-content h2{

font-size:30px;

}

.about-content p{

font-size:16px;

}

.about-btn{

width:100%;
text-align:center;

}

}



/*==============================
      OUR PURPOSE
==============================*/

.purpose-section{
    padding:110px 8%;
    /* background: linear-gradient(180deg, #e2020c0f 0%, #ffffff 100%); */
    overflow:hidden;
    background: #0f1724;
}

.purpose-container{
    max-width:1300px;
    margin:auto;
    display:grid;
    grid-template-columns:1fr 1.15fr;
    gap:70px;
    align-items:center;
}

/* LEFT */

.purpose-tag{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background: #ffffff;
    color: #e2020c;
    padding:10px 22px;
    border-radius:50px;
    font-weight:600;
    font-size:.9rem;
    margin-bottom:25px;
}

.purpose-tag::before{
    content:"";
    width:10px;
    height:10px;
    border-radius:50%;
    background: #e2020c;
}

.purpose-left h2{
    font-size:3rem;
    line-height:1.15;
    color: #ffffff;
    margin-bottom:25px;
    font-weight:700;
}

.purpose-left h2 span{
    display:block;
    color: #e2020c;
}

.purpose-left p{
    font-size:1.05rem;
    color: #ffffff !important;
    line-height:1.9;
    margin-bottom:18px;
}

.purpose-intro{
    color:#444 !important;
    font-weight:500;
}

.purpose-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:18px;
    padding:16px 38px;
    background: #e2020c;
    color:#fff;
    text-decoration:none;
    border-radius:50px;
    font-weight:600;
    transition:.35s;
    box-shadow: 0 15px 35px rgb(253 13 13 / 11%);
}

.purpose-btn:hover{
    transform:translateY(-5px);
    background: #ffffff;
}

/* RIGHT */

.purpose-right{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:24px;
}

.purpose-card{
    background:#fff;
    padding:35px 28px;
    border-radius:22px;
    transition:.35s;
    box-shadow:0 15px 45px rgba(0,0,0,.06);
    border:1px solid rgba(0,0,0,.05);
    position:relative;
    overflow:hidden;
}

.purpose-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:4px;
    background: #e2020c;
    transform:scaleX(0);
    transition:.4s;
}

.purpose-card:hover::before{
    transform:scaleX(1);
}

.purpose-card:hover{
    transform:translateY(-10px);
    box-shadow:0 25px 60px rgba(0,0,0,.12);
}

.purpose-icon{
    width:65px;
    height:65px;
    border-radius:18px;
    background: #e2020c14;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin-bottom:20px;
}

.purpose-card h4{
    font-size:1.15rem;
    margin-bottom:12px;
    color:#111;
}

.purpose-card p{
    color:#666;
    line-height:1.7;
    font-size:.96rem;
}

/* Bottom Statement */

.purpose-bottom{
    max-width:950px;
    margin:70px auto 0;
    text-align:center;
}

.purpose-bottom p{
    font-size:1.1rem;
    color:#555;
    line-height:2;
    padding:35px;
    background:#fff;
    border-radius:22px;
    box-shadow:0 15px 45px rgba(0,0,0,.05);
}

/*==============================
      RESPONSIVE
==============================*/

@media(max-width:1100px){

.purpose-container{
grid-template-columns:1fr;
gap:50px;
}

.purpose-left{
text-align:center;
}

}

@media(max-width:768px){

.purpose-section{
padding:80px 22px;
}

.purpose-left h2{
font-size:2.2rem;
}

.purpose-right{
grid-template-columns:1fr;
}

.purpose-card{
padding:30px 25px;
}

.purpose-bottom p{
padding:25px;
font-size:1rem;
}

}

@media(max-width:480px){

.purpose-left h2{
font-size:1.9rem;
}

.purpose-btn{
width:100%;
}

}


/*=========================
      OUR APPROACH
==========================*/

.approach-section{
    padding:110px 8%;
    background:#f7faff;
}

.container{
    max-width:1300px;
    margin:auto;
}

.approach-header{
    text-align:center;
    max-width:820px;
    margin:auto auto 70px;
}

.section-tag{
    display:inline-block;
    padding:10px 24px;
    background: #e2020c14;
    color: #e2020c;
    border-radius:50px;
    font-weight:600;
    margin-bottom:20px;
}

.approach-header h2{
    font-size:3rem;
    color:#111;
    margin-bottom:20px;
    line-height:1.2;
}

.approach-header h2 span{
    color: #e2020c;
}

.approach-header p{
    color:#666;
    line-height:1.8;
    font-size:1.05rem;
}

/* Layout */

.approach-wrapper{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:45px;
    align-items:start;
}

/* Left */

.approach-box{
    background:#fff;
    padding:35px;
    border-radius:22px;
    margin-bottom:25px;
    box-shadow:0 15px 45px rgba(0,0,0,.06);
    transition:.35s;
    position:relative;
}

.approach-box:hover{
    transform:translateY(-8px);
}

.step-number{
    width:60px;
    height:60px;
    background: #e2020c;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:16px;
    font-weight:700;
    margin-bottom:25px;
}

.approach-box h3{
    margin-bottom:18px;
    color:#111;
}

.approach-box p{
    color:#666;
    line-height:1.8;
}

.approach-box ul{
    padding-left:18px;
}

.approach-box li{
    margin:12px 0;
    color:#555;
}

/* Right */

.values-card{
    background: #212121;
    color:#fff;
    padding:45px;
    border-radius:28px;
    position:sticky;
    top:30px;
    box-shadow: 0 25px 60px rgb(0 0 0 / 24%);
}

.value-label{
    display:inline-block;
    background:rgba(255,255,255,.18);
    padding:8px 18px;
    border-radius:40px;
    margin-bottom:20px;
    font-size:.9rem;
}

.values-card h3{
    font-size:2rem;
    margin-bottom:35px;
}

.value-item{
    display:flex;
    gap:18px;
    margin-bottom:28px;
}

.value-icon{
    width:58px;
    height:58px;
    background:rgba(255,255,255,.15);
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:15px;
    font-size:24px;
    flex-shrink:0;
}

.value-item h4{
    margin-bottom:8px;
}

.value-item p{
    color:rgba(255,255,255,.85);
    line-height:1.7;
    font-size:.95rem;
}

/* Responsive */

@media(max-width:1100px){

.approach-wrapper{
grid-template-columns:1fr;
}

.values-card{
position:relative;
top:0;
}

}

@media(max-width:768px){

.approach-section{
padding:80px 22px;
}

.approach-header h2{
font-size:2.2rem;
}

.values-card{
padding:35px 25px;
}

.value-item{
flex-direction:column;
gap:15px;
}

}

@media(max-width:480px){

.approach-header h2{
font-size:1.8rem;
}

.approach-box{
padding:25px;
}

.values-card h3{
font-size:1.6rem;
}

}



.pw-why-section{
    padding:90px 20px;
    background:#f8fbff;
    overflow:hidden;
}

.pw-container{
    max-width:1200px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:70px;
}

.pw-content{
    flex:1;
}

.pw-subtitle{
    display:inline-block;
    color: #e2020c;
    font-size:15px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:1px;
    margin-bottom:18px;
}

.pw-content h2{
    font-size:48px;
    line-height:1.2;
    font-weight:800;
    color:#111827;
    margin-bottom:25px;
}

.pw-content p{
    font-size:17px;
    line-height:1.9;
    color:#5b6472;
    margin-bottom:20px;
}

.pw-btn{
    display:inline-flex;
    align-items:center;
    gap:12px;
    margin-top:18px;
    background: #e2020c;
    color:#fff;
    text-decoration:none;
    padding:16px 34px;
    border-radius:50px;
    font-weight:700;
    transition:.35s;
    box-shadow: 0 15px 35px rgb(253 13 13 / 12%);
}

.pw-btn span{
    transition:.35s;
}

.pw-btn:hover{
    background: #ffffff;
    transform:translateY(-3px);
    color: #000;
    box-shadow: 0px 0px 5px #0000002b;
}

.pw-btn:hover span{
    transform:translateX(6px);
}

.pw-card{
    flex:0 0 380px;
    background:#fff;
    border-radius:24px;
    padding:40px;
    box-shadow:0 25px 60px rgba(0,0,0,.08);
    border:1px solid #eef2f7;
}

.pw-icon{
    width:75px;
    height:75px;
    border-radius:20px;
    background:#eef5ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    margin-bottom:25px;
}

.pw-card h3{
    font-size:26px;
    margin-bottom:22px;
    color:#111827;
}

.pw-card ul{
    margin:0;
    padding:0;
    list-style:none;
}

.pw-card li{
    padding:12px 0;
    border-bottom:1px solid #edf1f6;
    color:#5b6472;
    font-size:16px;
}

.pw-card li:last-child{
    border-bottom:none;
}

@media (max-width:991px){

    .pw-container{
        flex-direction:column;
        gap:45px;
    }

    .pw-card{
        width:100%;
        flex:unset;
    }

    .pw-content h2{
        font-size:38px;
    }
}

@media (max-width:767px){

    .pw-why-section{
        padding:70px 20px;
    }

    .pw-content h2{
        font-size:30px;
    }

    .pw-content p{
        font-size:16px;
    }

    .pw-btn{
        width:100%;
        justify-content:center;
    }

    .pw-card{
        padding:30px;
    }

    .pw-card h3{
        font-size:22px;
    }
}



.pwci-section{

padding:100px 20px;
background:#f8fbff;

}

.pwci-container{

max-width:1200px;
margin:auto;

}

.pwci-heading{

max-width:750px;
margin:auto;
text-align:center;
margin-bottom:60px;

}

.pwci-tag{

display:inline-block;

padding:10px 22px;

border-radius:50px;

background: #e801220f;

color: #e80122;

font-size:14px;

font-weight:700;

letter-spacing:1px;

margin-bottom:20px;
}

.pwci-heading h2{

font-size:46px;
font-weight:800;
color:#101828;
margin-bottom:20px;

}

.pwci-heading p{

font-size:18px;
line-height:1.8;
color:#667085;

}

.pwci-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;

}

.pwci-card{

background:#fff;
padding:35px;
border-radius:22px;
text-align:center;
box-shadow:0 18px 45px rgba(0,0,0,.06);
transition:.35s;

}

.pwci-card:hover{

transform:translateY(-10px);
box-shadow:0 30px 60px rgba(0,0,0,.12);

}

.pwci-icon{width:75px;height:75px;margin:auto;margin-bottom:25px;display:flex;align-items:center;justify-content:center;background: #e801220a;border-radius:20px;font-size:34px;}

.pwci-card h3{

font-size:22px;
margin-bottom:12px;
color:#111827;

}

.pwci-card p{

color:#667085;
line-height:1.7;

}

@media(max-width:991px){

.pwci-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

.pwci-section{

padding:70px 20px;

}

.pwci-grid{

grid-template-columns:1fr;

}

.pwci-heading h2{

font-size:32px;

}

.pwci-heading p{

font-size:16px;

}

}


.pwbs-section{

    padding:110px 20px;
    background:#081323;
    position:relative;
    overflow:hidden;

}

.pwbs-section:before{

    content:"";
    position:absolute;
    width:420px;
    height:420px;
    background:#0d6efd;
    border-radius:50%;
    filter:blur(140px);
    opacity:.18;
    top:-150px;
    left:-120px;

}

.pwbs-section:after{

    content:"";
    position:absolute;
    width:350px;
    height:350px;
    background:#00c2ff;
    border-radius:50%;
    filter:blur(140px);
    opacity:.15;
    bottom:-150px;
    right:-120px;

}

.pwbs-container{

    max-width:1200px;
    margin:auto;
    position:relative;
    z-index:2;

}

.pwbs-box{

    display:grid;
    grid-template-columns:360px 1fr;
    gap:60px;

    background:rgba(255,255,255,.06);

    border:1px solid rgba(255,255,255,.10);

    backdrop-filter:blur(25px);

    border-radius:28px;

    padding:60px;

    box-shadow:0 30px 80px rgba(0,0,0,.35);

}

.pwbs-badge{display:inline-block;padding:10px 20px;background:rgba(255,255,255,.08);color: #e80122;border-radius:50px;font-size:14px;font-weight:700;letter-spacing:1px;margin-bottom:25px;}

.pwbs-left h2{

    color:#fff;

    font-size:44px;

    font-weight:800;

    line-height:1.2;

    margin-bottom:20px;

}

.pwbs-left p{

    color:#c8d2df;

    line-height:1.9;

    font-size:17px;

}

.pwbs-right{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.pwbs-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.06);

    padding:22px;

    border-radius:18px;

    transition:.35s;

}

.pwbs-item:hover{

    transform:translateX(8px);

    background:rgba(255,255,255,.08);

}

.pwbs-check{

    width:42px;
    height:42px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#16c47f;

    color:#fff;

    font-weight:bold;

    font-size:18px;

}

.pwbs-item p{

    color:#fff;

    line-height:1.8;

    margin:0;

    font-size:16px;

}

.pwbs-item strong{color: #e80122;}

@media(max-width:991px){

.pwbs-box{

grid-template-columns:1fr;

gap:40px;

padding:40px;

}

}

@media(max-width:767px){

.pwbs-section{

padding:80px 20px;

}

.pwbs-box{

padding:28px;

}

.pwbs-left h2{

font-size:32px;

}

.pwbs-item{

padding:18px;

}

.pwbs-item:hover{

transform:none;

}

}


.pwcta-section{

position:relative;

overflow:hidden;

padding:120px 20px;

background: linear-gradient(135deg, #0a2b7c 0%, #001431 50%, #000000 100%);

text-align:center;
}

.pwcta-container{

    max-width:900px;
    margin:auto;
    position:relative;
    z-index:2;

}

.pwcta-tag{

    display:inline-block;
    padding:10px 22px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.15);
    border-radius:50px;
    color:#fff;
    font-size:14px;
    font-weight:700;
    letter-spacing:1px;
    margin-bottom:25px;

}

.pwcta-container h2{

    color:#fff;
    font-size:56px;
    line-height:1.15;
    font-weight:800;
    margin-bottom:25px;

}

.pwcta-container p{

    color:rgba(255,255,255,.92);
    font-size:20px;
    line-height:1.8;
    max-width:760px;
    margin:0 auto 45px;

}

.pwcta-container p strong{

    color:#ffffff;

}

.pwcta-buttons{

    display:flex;
    justify-content:center;
    gap:18px;
    flex-wrap:wrap;

}

.pwcta-btn-primary{display:inline-flex;align-items:center;justify-content:center;padding:18px 40px;background:#fff;color: #e80122;text-decoration:none;border-radius:60px;font-size:17px;font-weight:700;transition:.35s;box-shadow:0 18px 45px rgba(0,0,0,.18);}

.pwcta-btn-primary:hover{transform:translateY(-5px);box-shadow:0 30px 60px rgba(0,0,0,.28);color: #000000;}

.pwcta-btn-secondary{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:18px 40px;

    border:2px solid rgba(255,255,255,.35);

    color:#fff;

    text-decoration:none;

    border-radius:60px;

    font-size:17px;
    font-weight:700;

    transition:.35s;

    backdrop-filter:blur(10px);

}

.pwcta-btn-secondary:hover{background:rgba(255,255,255,.12);border-color:#fff;transform:translateY(-5px);color: #ffffff;}

.pwcta-glow{

    position:absolute;
    border-radius:50%;
    filter:blur(130px);
    opacity:.22;

}

.pwcta-glow-one{

    width:420px;
    height:420px;

    background:#6fd3ff;

    top:-180px;
    left:-120px;

}

.pwcta-glow-two{

    width:380px;
    height:380px;

    background:#ffffff;

    bottom:-170px;
    right:-120px;

    opacity:.12;

}

@media(max-width:991px){

.pwcta-container h2{

    font-size:42px;

}

.pwcta-container p{

    font-size:18px;

}

}

@media(max-width:767px){

.pwcta-section{

    padding:80px 20px;

}

.pwcta-container h2{

    font-size:32px;

}

.pwcta-container p{

    font-size:16px;

}

.pwcta-buttons{

    flex-direction:column;

}

.pwcta-btn-primary,
.pwcta-btn-secondary{

    width:100%;

}

}


.pwhero-section{

padding:110px 20px;

background: linear-gradient(135deg, #081c4d 0%, #000000 100%);

position:relative;

overflow:hidden;
}

.pwhero-section:before{

content:"";
position:absolute;
width:450px;
height:450px;
background:#4fc3ff;
border-radius:50%;
filter:blur(140px);
opacity:.15;
top:-180px;
right:-120px;

}

.pwhero-section:after{

content:"";
position:absolute;
width:350px;
height:350px;
background:#ffffff;
border-radius:50%;
filter:blur(140px);
opacity:.08;
left:-100px;
bottom:-150px;

}

.pwhero-container{

max-width:1200px;
margin:auto;
position:relative;
z-index:2;

}

.pwhero-content{

max-width:760px;

}

.pwhero-badge{

display:inline-block;
padding:10px 20px;
border-radius:50px;
background:rgba(255,255,255,.12);
color:#fff;
font-size:14px;
font-weight:700;
letter-spacing:1px;
margin-bottom:25px;

}

.pwhero-content h1{

font-size:60px;
line-height:1.15;
font-weight:800;
color:#fff;
margin-bottom:25px;

}

.pwhero-subtitle{

font-size:24px;
font-weight:600;
color:#fff;
margin-bottom:18px;

}

.pwhero-description{

font-size:18px;
line-height:1.9;
color:rgba(255,255,255,.9);
margin-bottom:40px;

}

.pwhero-features{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:18px;

}

.pwhero-feature{

background:rgba(255,255,255,.08);
padding:18px 20px;
border-radius:14px;
color:#fff;
font-weight:600;
border:1px solid rgba(255,255,255,.08);
backdrop-filter:blur(15px);

}

@media(max-width:991px){

.pwhero-content h1{

font-size:46px;

}

}

@media(max-width:767px){

.pwhero-section{

padding:80px 20px;

}

.pwhero-content{

text-align:center;

}

.pwhero-content h1{

font-size:34px;

}

.pwhero-subtitle{

font-size:20px;

}

.pwhero-description{

font-size:16px;

}

.pwhero-features{

grid-template-columns:1fr;

}

}



/* ===========================================
   ProdigyWebz Contact Form
=========================================== */

.pwform-section{

    background:#ffffff;
    padding:45px;
    border-radius:24px;
    box-shadow:0 20px 60px rgba(15,23,42,.08);
    border:1px solid #edf2f7;

}

.pwform-section .form-label{

    font-size:15px;
    font-weight:600;
    color:#111827;
    margin-bottom:10px;

}

.pwform-section .form-control,
.pwform-section .form-select{

    height:56px;

    border:1px solid #d9e2ec;

    border-radius:14px;

    background:#fff;

    font-size:15px;

    padding:12px 18px;

    box-shadow:none;

    transition:.3s;

}

.pwform-section textarea.form-control{

    height:auto;
    min-height:140px;
    resize:vertical;

}

.pwform-section .form-control::placeholder{

    color:#98a2b3;

}

.pwform-section .form-control:focus,
.pwform-section .form-select:focus{

    border-color:#0d6efd;

    box-shadow:0 0 0 .22rem rgba(13,110,253,.15);

}

.pwform-section .btn{

    min-width:280px;

    height:58px;

    border-radius:60px;

    font-size:17px;

    font-weight:700;

    border:none;

    background:linear-gradient(135deg,#0d6efd,#0057d9);

    transition:.35s;

    box-shadow:0 18px 35px rgba(13,110,253,.25);

}

.pwform-section .btn:hover{

    transform:translateY(-4px);

    background:linear-gradient(135deg,#0057d9,#0047b3);

    box-shadow:0 28px 45px rgba(13,110,253,.35);

}

.pwform-section .btn:focus{

    box-shadow:0 0 0 .25rem rgba(13,110,253,.18);

}

.pwform-section .form-control:hover,
.pwform-section .form-select:hover{

    border-color:#b8c4d3;

}

/* spacing */

.pwform-section .row{

    --bs-gutter-x:24px;
    --bs-gutter-y:24px;

}

/* Tablet */

@media (max-width:991px){

.pwform-section{

padding:35px;

}

}

/* Mobile */

@media (max-width:767px){

.pwform-section{

padding:25px;
border-radius:18px;

}

.pwform-section .form-control,
.pwform-section .form-select{

height:52px;
font-size:15px;

}

.pwform-section textarea.form-control{

min-height:120px;

}

.pwform-section .btn{

width:100%;
min-width:100%;
height:54px;
font-size:16px;

}

.pwform-section .row{

--bs-gutter-x:18px;
--bs-gutter-y:18px;

}

}


/* ===========================================================
   PRODiGYWEBZ PREMIUM FORM
   Glassmorphism • Responsive • Modern UI
=========================================================== */

.pwpf-wrapper{

position:relative;

background: rgb(255 255 255 / 8%);

backdrop-filter:blur(22px);

-webkit-backdrop-filter:blur(22px);

border:1px solid rgba(255,255,255,.15);

border-radius:28px;

padding:50px;

overflow:hidden;

box-shadow: 0 20px 60px rgb(15 23 42 / 3%), inset 0 1px 0 rgb(255 255 255 / 0%);
}

.pwpf-wrapper::before{

    content:"";

    position:absolute;

    width:280px;
    height:280px;

    background:#0d6efd;

    border-radius:50%;

    filter:blur(120px);

    opacity:.12;

    top:-120px;
    right:-120px;

}

.pwpf-wrapper::after{

    content:"";

    position:absolute;

    width:220px;
    height:220px;

    background:#00d4ff;

    border-radius:50%;

    filter:blur(100px);

    opacity:.10;

    left:-80px;
    bottom:-80px;

}

.pwpf-form,
.pwpf-header{

    position:relative;
    z-index:5;

}

/* ==================================
            HEADER
================================== */

.pwpf-header{

    text-align:center;

    margin-bottom:45px;

}

.pwpf-badge{

display:inline-block;

padding:10px 22px;

border-radius:50px;

background: #e801220f;

color: #e80122;

font-size:13px;

font-weight:700;

letter-spacing:1px;

margin-bottom:18px;
}

.pwpf-header h2{

    font-size:42px;

    font-weight:800;

    color:#111827;

    margin-bottom:15px;

}

.pwpf-header p{

    font-size:17px;

    line-height:1.8;

    color:#667085;

    max-width:720px;

    margin:auto;

}

/* ==================================
            FORM
================================== */

.pwpf-group{

    display:flex;

    flex-direction:column;

}

.pwpf-group label{

font-size:14px;

font-weight:600;

color:#111827;

margin-bottom:10px;

margin-top: 15px;
}

/* ==================================
            INPUT BOX
================================== */

.pwpf-input{

    display:flex;

    align-items:center;

    gap:15px;

    background:#fff;

    border:1px solid #e4e7ec;

    border-radius:16px;

    padding:0 18px;

    transition:.35s;

    box-shadow:0 8px 25px rgba(15,23,42,.05);

}

.pwpf-input:hover{

    border-color:#bfd7ff;

    transform:translateY(-2px);

}

.pwpf-input:focus-within{

    border-color:#0d6efd;

    box-shadow:

    0 0 0 5px rgba(13,110,253,.10),

    0 15px 35px rgba(13,110,253,.12);

}

/* ==================================
              ICON
================================== */

.pwpf-input i{

color: #e80122;

width:18px;

text-align:center;

font-size:16px;
}

/* ==================================
        INPUTS
================================== */

.pwpf-input input,
.pwpf-input select{

    width:100%;

    height:58px;

    border:none;

    outline:none;

    background:none;

    font-size:15px;

    color:#111827;

}

.pwpf-input input::placeholder{

    color:#98a2b3;

}

.pwpf-input select{

    cursor:pointer;

}

/* ==================================
          TEXTAREA
================================== */

.pwpf-textarea{

    align-items:flex-start;

    padding-top:16px;

}

.pwpf-textarea i{

    margin-top:8px;

}

.pwpf-textarea textarea{

    width:100%;

    min-height:150px;

    border:none;

    outline:none;

    resize:vertical;

    background:none;

    padding:0;

    font-size:15px;

    color:#111827;

}

/* ==================================
            BUTTON
================================== */

.pwpf-btn{

position:relative;

overflow:hidden;

border:none;

outline:none;

cursor:pointer;

display:inline-flex;

align-items:center;

justify-content:center;

padding:18px 46px;

border-radius:60px;

background: linear-gradient(135deg, #e80122, #000000);

color:#fff;

font-size:17px;

font-weight:700;

transition:.35s;

box-shadow: 0 18px 35px rgb(0 0 0 / 18%);

margin-top: 40px;
}

.pwpf-btn:hover{

transform:translateY(-4px);

box-shadow: 0 28px 55px rgb(0 0 0 / 12%);
}

.pwpf-btn::before{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:70%;

    height:100%;

    background:linear-gradient(

    90deg,

    transparent,

    rgba(255,255,255,.35),

    transparent

    );

    transition:.7s;

}

.pwpf-btn:hover::before{

    left:130%;

}

/* ==================================
          ANIMATION
================================== */

.pwpf-group{

    animation:pwFade .7s ease forwards;

}

@keyframes pwFade{

from{

opacity:0;
transform:translateY(20px);

}

to{

opacity:1;
transform:none;

}

}

/* ==================================
      SCROLLBAR
================================== */

.pwpf-textarea textarea::-webkit-scrollbar{

width:8px;

}

.pwpf-textarea textarea::-webkit-scrollbar-thumb{

background:#0d6efd;

border-radius:20px;

}

/* ==================================
      MOBILE
================================== */

@media(max-width:991px){

.pwpf-wrapper{

padding:35px;

}

.pwpf-header h2{

font-size:34px;

}

}

@media(max-width:767px){

.pwpf-wrapper{

padding:25px;
border-radius:20px;

}

.pwpf-header{

margin-bottom:35px;

}

.pwpf-header h2{

font-size:28px;

}

.pwpf-header p{

font-size:15px;

}

.pwpf-input{

padding:0 15px;

}

.pwpf-input input,
.pwpf-input select{

height:54px;
font-size:14px;

}

.pwpf-textarea{

padding-top:15px;

}

.pwpf-textarea textarea{

min-height:120px;

font-size:14px;

}

.pwpf-btn{

width:100%;

padding:16px 20px;

font-size:16px;

}

}

/* ==================================
      LARGE DESKTOP
================================== */

@media(min-width:1400px){

.pwpf-wrapper{

padding:60px;

}

.pwpf-header h2{

font-size:48px;

}

}


form.pwpf-form {
    width: 80%;
    margin: 0px auto;
}