/*===============================================
Template Name: allentix - SEO Marketing Agency HTML5 Template
Author:  https://templatemonster.com/user/dreamit-solution
Description: Description
Version: 1.0.0
Text Domain: allentix
Tags: agency, consulting, digital agency, digital marketing, digital marketing agency, marketing, marketing agency, media agency, portfolio, seo, seo agency, seo agency theme, seo marketing, smm, social media marketing agency.
================================================*/

/*TABLE OF CONTENTS*/
/*=====================
01. Ltefolio Header Top Menu Area Css
02. Ltefolio Nav Menu Area Css 
03. Ltefolio Slider Area Css
04. Ltefolio Section Title Css
05. Ltefolio Service Area css
06. Ltefolio About Area Css
07. Ltefolio Counter Area Css
08. Ltefolio Case Study Area Css
09. Ltefolio Testimonial Area Css
10. Ltefolio Process Area Css
11. Ltefolio Team Area Css
12. Ltefolio Faq Area Css
13. Ltefolio Brand Section Css
14. Ltefolio Call Do Section Css
15. Ltefolio Form Box Css
16. Ltefolio Skill Area Css
17. Ltefolio Blog Area Css
18. Ltefolio footer Area Css
19. Ltefolio Subscribe Area Css
20. Ltefolio Lines CSS
21. Ltefolio Prossess Ber Css
22. Ltefolio Scrollup Section
23. Ltefolio Bounce Animation Css 
24. Ltefolio Animation Dance
25. Ltefolio Breadcumb Area Css
26. Ltefolio abouts_areas Css
27. Ltefolio Feture-Area Css
28. Ltefolio Pricing Section Css
29. Ltefolio Web Development Section CSS
30. Ltefolio Contact  US Css
31. Ltefolio Blog Sidber Widget CSS
32. Ltefolio Case Study Details Css
33. Ltefolio Search Box Css
34. Ltefolio Loader Css
=======================*/


/*<!-- ============================================================== -->
 <!-- allentix Reset Code & Common Start Here -->
<!-- ============================================================== -->*/

.allentix-logo a {
    font-size: 40px;
    color: #fff;
    font-weight: 500;
    padding-left: 42px;
    position: relative;
}

.allentix-logo a span {
    color: #cf1547;
    font-weight: 600;
}

.allentix-logo img {
    width: 48px;
    position: absolute;
    left: 0;
    top: -8px;
}


.allentix-section-sub-title h5 {
    font-size: 16px;
    line-height: 28px;
    color: #ec0946;
    font-weight: 600;
    background-color: #ce144645;
    display: inline-block;
    border-radius: 8px 0;
    padding: 2px 20px;
}

.allentix-section-title h1 {
    font-size: 40px;
    line-height: 50px;
    color: #282828;
    font-weight: 700;
    width: 85%;
    margin: 28px 0 0;
}

.allentix_nav_manu {
    transition: .5s;
    z-index: 2;
    position: relative;
    padding: 0 70px 0;
    margin-bottom: -95px;
    border-bottom: 1px solid rgba(16,18,16,0.10196078431372549);
}

.sticky {
    left: 0;
    margin: auto;
    position: fixed !important;
    top: 0;
    width: 100%;
    -webkit-box-shadow: 0 2px 5px -2px rgba(206, 20, 70, 0.1);
    box-shadow: 0 2px 5px -2px rgba(206, 20, 70, 0.1);
    background: #00000067;
    transition: .5s !important;
    z-index: 922;
    -webkit-animation: 300ms ease-in-out fadeInDown;
    animation: 500ms ease-in-out fadeInUp;
    animation-name: slideInDown;
    backdrop-filter: blur(5px);
}

.sticky nav.header-menu {
    background: transparent;
}

.sticky nav.header-menu ul li {
    display: inline-block;
    padding: 22px 0 22px 54px;
    position: relative;
}

/*<!-- ============================================================== -->
 <!-- allentix Reset Code & Common End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- allentix Header Menu Start Here -->
<!-- ============================================================== -->*/

header.header-manu-section {
    position: fixed;
    width: 100%;
    z-index: 999;
}

nav.header-menu {
    text-align: right;
}

nav.header-menu ul li {
    display: inline-block;
    padding: 32px 0 32px 54px;
    position: relative;
}

nav.header-menu a {
    font-size: 14px;
    line-height: 28px;
    color: #fff;
    font-weight: 500;
    text-transform: uppercase;
    transition: .5s;
}

nav.header-menu a:hover {
    color: #cf1547;
    filter: hue-rotate(360deg);
}

nav.header-menu ul>li:first-child>a {
    color: #cf1547;
    font-weight: 700;
}

nav.header-menu ul li:first-child a i {
    font-size: 18px;
}


/* Submenu Start Here */

nav.header-menu ul li:hover .submenu{
    visibility: visible;
    opacity: 1;
    transform: translateY(0) scale(1);
}

.submenu {
    position: absolute;
    top: 92px;
    left: 0;
    width: 205px;
    background: #fff;
    z-index: 50;
    border-top: 3px solid #cf1547;
    transition: .4s;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    transform: translateY(20%) scale(.8);
    text-align: left;
    filter: drop-shadow(5px 5px 5px rgba(60, 115, 206, 0.2));
}

.sticky .submenu {
    top: 72px;
}

nav .submenu ul li {
    display: block;
    width: 100%;
    background: #fff;
    padding: 8px 20px !important;
    transition: .4s;
    position: relative;
    z-index: 1;
}

nav .submenu ul li:before {
    position: absolute;
    content: '';
    width: 0%;
    height: 100%;
    background: #cf1547;
    top: 0;
    right: -15px;
    transform: skewX(-35deg);
    transition: .4s;
    z-index: -1;
}

nav .submenu ul li:after {
    position: absolute;
    content: '';
    width: 0%;
    height: 100%;
    background: #c39e75;
    top: 0;
    left: -15px;
    transform: skewX(-35deg);
    transition: .4s;
    z-index: -1;
}

nav .submenu ul>li>a {
    color: #282828 ;
    transition: .4s;
    width: 100%;
}

nav .submenu ul>li:first-child>a {
    color: #282828;
    font-weight: 500;
}

nav .submenu ul li:hover a{
    color: #fff !important;
}

nav .submenu ul li:hover:before,
nav .submenu ul li:hover:after {
    background: #cf1547;
    filter: hue-rotate(360deg);
    width: 58%;
}

/* Submenu End Here */

/*<!-- ============================================================== -->
 <!-- Allentix Header Menu End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Banner Section Start Here -->
<!-- ============================================================== -->*/

section.banner-section {
    height: 950px;
    display: flex;
    align-items: center;
    text-align: center;
    background: url(../image/banner-bg.jpg) no-repeat center;
    background-size: cover;
}

.banner-title h1 {
    font-size: 65px;
    line-height: 82px;
    color: #ffffff;
    font-weight: 700;
    width: 60%;
    margin: 16px auto 0;
}

.banner-desc p {
    color: #ffffff;
    width: 40%;
    margin: 16px auto 26px;
}

.banner-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
}

.banner-btn a:hover {
    filter: hue-rotate(360deg);
}


.banner-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #282828;
    transform: scale(0);
    transition: .7s;
    z-index: -1;
    border-radius: 12px 0;
}

.banner-btn a:hover::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Banner Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix About Section Start Here -->
<!-- ============================================================== -->*/

section.about-section {
    padding: 100px 0;
    background: url(../image/about-bg.jpg) no-repeat center;
    background-size: cover;
}

.about-thumb img {
	margin-left: -12rem;
}

.about-desc p {
	margin: 10px 0;
	width: 80%;
}

.about-lists {
    display: flex;
    gap: 50px;
}

.about-list ul li {
    font-size: 18px;
    color: #777777;
    margin: 14px 0;
}

.about-list i {
    color: #ce1446;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    border: 1px solid #ce1346;
    margin-right: 16px;
}

.about-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
    margin-top: 20px;
}

.about-btn a:hover {
    filter: hue-rotate(360deg);
}


.about-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #282828;
    transform: scale(0);
    transition: .7s;
    z-index: -1;
    border-radius: 12px 0;
}

.about-btn a:hover::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix About Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Service  Section Start Here -->
<!-- ============================================================== -->*/

section.service-section {
    padding: 100px 0 70px;
    background-color: #fff9fb;
    text-align: center;
}

section.service-section  .allentix-section-title h1 {
    margin: 28px auto 0;
}

.service-box {
    margin-top: 40px;
}

.service-single-box {
    background: #fff;
    border-radius: 12px;
    padding: 40px 44px;
    transition: .5s;
    position: relative;
    z-index: 1;
    filter: drop-shadow(0px 5px 30px rgba(79,1,147,0.09));
    margin-bottom: 30px;
}

.service-single-box::before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    transition: .5s;
    z-index: -1;
    background: #cd1345;
    border-radius: 12px;
}

.service-single-box:hover::before {
    height: 100%;
    filter: hue-rotate(360deg);
}

.service-box-icon img {
    transition: .5s;
}

.service-single-box:hover .service-box-icon img {
    filter:  brightness(0) invert(1);
}

.service-box-title h5 {
    font-size: 22px;
    line-height: 30px;
    color: #282828;
    font-weight: 700;
    margin: 24px 0;
    transition: .5s;
}

.service-single-box:hover .service-box-title h5 {
    color: #fff;
}

.service-box-title.style h5 {
    margin: 18px 0;
}

.service-box-desc p {
    transition: .5s;
}

.service-single-box:hover .service-box-desc p {
    color: #fff;
}

.service-box-btn a {
    color: #ce1446;
    font-weight: 600;
    transition: .5s;
}

.service-single-box:hover .service-box-btn a {
    color: #fff;
}

.service-box-btn i {
    font-size: 18px;
}

/*<!-- ============================================================== -->
 <!-- Allentix Servcice Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Portfolio Section Start Here -->
<!-- ============================================================== -->*/

section.portfolio-section {
    padding: 100px 0 70px;
}

section.portfolio-section .allentix-section-title h1 {
    margin: 28px auto 0;
}

.portfolio-box {
    margin-top: 46px;
}

.portfolio-single-box {
    position: relative;
    margin-bottom: 30px;
}

.portfolio-box-thumb img {
    border-radius: 40px;
    width: 100%;
}

.portfolio-box-content {
    background: #cd1345;
    width: 80%;
    border-radius: 12px 0;
    text-align: center;
    padding: 20px 0;
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    margin: auto;
    transform: perspective(500px) rotateX(-90deg);
    transition: all 400ms linear 0ms;
    -webkit-transition: all 400ms linear 0ms;
    opacity: 0;
    visibility: hidden;
}

.portfolio-single-box:hover .portfolio-box-content {
    transform: perspective(500px) rotateX(0deg);
    opacity: 1;
    visibility: visible;
}

.portfolio-box-sub-title h6 {
    font-size: 16px;
    line-height: 28px;
    color: #fefefe;
    font-weight: 400;
}

.portfolio-box-title h5 {
    font-size: 22px;
    line-height: 28px;
    color: #fefefe;
    font-weight: 700;
    margin-top: 10px;
}

.portfolio-btn {
    text-align: center;
}

.portfolio-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
    margin: 10px 0 20px;
}

.portfolio-btn a:hover {
    filter: hue-rotate(360deg);
}


.portfolio-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #282828;
    transform: scale(0);
    transition: .7s;
    z-index: -1;
    border-radius: 12px 0;
}

.portfolio-btn a:hover::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Portfolio Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Testimonial Section Start Here -->
<!-- ============================================================== -->*/

section.testimonial-section {
    padding: 100px  0;
    background: url(../image/testimonial-bg.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    z-index: 1;
}

section.testimonial-section .allentix-section-sub-title h5 {
    background-color: #f6d3dc;
}

section.testimonial-section .allentix-section-title h1 {
    color: #fff;
    margin: 28px auto 0;
}

.testimonial-slider {
    margin-top: 42px;
}

.testimonial-box {
    background: #fff;
    border-radius: 40px;
    padding: 40px 40px 34px;
    position: relative;
    margin: 0 20px 30px 0;
}

.testimonial-desc p {
    margin: 20px 0;
}

.testimonial-box:before {
    position: absolute;
    content: '';
    top: 20px;
    left: 20px;
    width: 100%;
    height: 100%;
    background: #cd1345;
    z-index: -1;
    border-radius: 40px;
}

.testimonial-title h6 {
    font-size: 18px;
    line-height: 28px;
    color: #282828;
    font-weight: 700;
}

.testimonial-designation h6 {
    font-size: 16px;
    line-height: 26px;
    color: #777777;
    font-weight: 400;
}

.testimonial-icon i {
    color: #cd1345;
    font-size: 44px;
    position: absolute;
    top: 36px;
    right: 40px;
}

section.testimonial-section .owl-dots {
    text-align: center;
    margin-top: 40px;
}

section.testimonial-section .owl-dot {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background-color: #f6d3dc;
    display: inline-block;
    margin: 0px 5px;
}

section.testimonial-section .owl-dot.active {
    background: #cd1345;
}

/*<!-- ============================================================== -->
 <!-- Allentix Testimonial Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Pricing Section start Here -->
<!-- ============================================================== -->*/

section.pricing-section {
    padding: 100px 0 70px;
}

section.pricing-section .allentix-section-title h1 {
    margin: 28px auto 0;
}

.pricing-box {
    margin-top: 44px;
}

.pricing-single-box {
    border-radius: 40px;
    background-color: #fff9fb;
    padding: 46px 0;
    position: relative;
    z-index: 1;
    margin-bottom: 30px;
}

.pricing-single-box:before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: #cd1345;
    transition: .5s;
    z-index: -1;
    border-radius: 40px;
}

.pricing-single-box:hover:before {
    height: 100%;
    filter: hue-rotate(360deg);
}

.pricing-box-title h5 {
    font-size: 22px;
    line-height: 28px;
    color: #282828;
    font-weight: 700;
    text-align: center;
    transition: .5s;
}

.pricing-single-box:hover .pricing-box-title h5 {
    color: #fff;
}

.pricing-rate h2 {
    text-align: center;
    font-size: 40px;
    line-height: 28px;
    color: #ce1346;
    font-weight: 700;
    margin: 32px 0 24px;
    transition: .5s;
}

.pricing-single-box:hover .pricing-rate h2 {
    color: #fff;
}

.pricing-rate span {
    font-size: 16px;
}

.pricing-desc p {
	margin: auto;
	width: 65%;
	text-align: center;
	transition: .5s;
}

.pricing-single-box:hover .pricing-desc p {
    color: #fff;
}

.pricing-list {
	padding: 16px 0px 30px 90px;
}

.pricing-list ul li {
    margin: 3px 0;
    transition: .5s;
}

.pricing-single-box:hover .pricing-list ul li {
    color: #fff;
}

.pricing-list i {
    margin-right: 10px;
    color: #282828;
    font-size: 26px;
    transition: .5s;
}

.pricing-single-box:hover .pricing-list i {
    color: #fff;
}

.pricing-btn {
    text-align: center;
}

.pricing-btn  a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
}

.pricing-single-box:hover .pricing-btn a {
    filter: hue-rotate(360deg);
    color: #282828;
}


.pricing-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
    border-radius: 12px 0;
}

.pricing-single-box:hover .pricing-btn a::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Pricing Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Blog Section End Here -->
<!-- ============================================================== -->*/

section.blog-section {
    padding: 100px 0;
    background-color: #fff9fb;
}

section.blog-section .allentix-section-title h1 {
    margin: 28px auto 0;
}

.blog-box {
    margin-top: 46px;
}

.blog-box-thumb {
    overflow: hidden;
    border-radius: 40px 40px 0 0;
}

.blog-box-thumb img {
    width: 100%;
    transition: .5s;
}

.blog-single-box:hover .blog-box-thumb img {
    transform: scale(1.1);
}

.blog-box-content {
    padding: 28px 32px;
}

.blog-box-post-date h6 {
    font-size: 15px;
    line-height: 30px;
    color: #777777;
    font-weight: 400;
}

.blog-box-post-date i {
    color: #cd1345;
    font-size: 20px;
    margin-right: 6px;
}

.blog-box-title a {
    font-size: 22px;
    line-height: 28px;
    color: #232323;
    font-weight: 700;
    transition: .5s;
    margin: 22px 0;
    width: 90%;
}

.blog-single-box:hover .blog-box-title a {
    color: #cd1345;
}

.blog-box-desc p {
	transition: .5s;
	margin-bottom: 26px;
	width: 80%;
}

.blog-single-box:hover .blog-box-desc p {
    color: #cd1345;
}

section.blog-section .blog-box-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    margin-left: 0;
}

.blog-single-box:hover .blog-box-btn a {
    filter: hue-rotate(360deg);
    color: #282828;
}


.blog-box-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
    border-radius: 12px 0;
}

.blog-single-box:hover .blog-box-btn a::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Blog Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Contact Section Start Here -->
<!-- ============================================================== -->*/

section.contact-section {
    padding: 100px  0;
}

.contact-thumb img {
	margin-left: -8rem;
}

.contact-form {
    margin-top: 20px;
}

.form-top,
.form-middle-left,
.form-middle-right {
    width: 100%;
}

.form-top input,
.form-middle-left input,
.form-middle-right input {
    width: 100%;
    border: none;
    border-bottom: 1px solid #28282826;
    height: 50px;
    margin-bottom: 30px;
}

.form-top input,
.form-middle-left input,
.form-middle-right input,
.form-bottom textarea {
    font-size: 16px;
    line-height: 28px;
    color: #777777;
    font-weight: 400;
}

.form-middle {
    display: flex;
    gap: 26px;
}

.form-bottom textarea {
    width: 100%;
    border: none;
    border-bottom: 1px solid #28282826;
    height: 140px;
    margin-bottom: 30px;
    resize: none;
}

.form-btn button {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
    margin-top: 22px;
}

.form-btn button {
    filter: hue-rotate(360deg);
}


.form-btn button::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #282828;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
    border-radius: 12px 0;
}

.form-btn button:hover::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Contact Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Contact Section End Here -->
<!-- ============================================================== -->*/

footer.footer-section {
    padding: 100px 0 0;
    background: #000;
}

.footer-desc p {
    margin: 34px 0 30px;
    color: #fff;
}

.footer-social-link li {
    display: inline-block;
    margin: 4px;
}

.footer-social-link a {
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 35px;
    border-radius: 33px;
    border: 1px solid #cf1547;
    color: #cf1547;
    transition: .5s;
}

.footer-social-link a:hover {
    color: #fff;
    border: 1px solid #fff;
}

.footer-customer-service-title h4 {
    font-size: 22px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 42px;
}

.footer-customer-service a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 400;
    margin-bottom: 12px;
    transition: .5s;
}

.footer-customer-service a:hover {
    color: #cf1547;
    filter: hue-rotate(360deg);
}

.footer-link-title h4 {
    font-size: 22px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 42px;
}

.footer-link a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 400;
    margin-bottom: 12px;
    transition: .5s;
}

.footer-link a:hover {
    color: #cf1547;
    filter: hue-rotate(360deg);
}

.footer-contact-title h4 {
    font-size: 22px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 42px;
}

.footer-contact li:first-child i {
	float: left;
	line-height: 26px;
}

.footer-contact li p {
    font-size: 16px;
    line-height: 26px;
    color: #fefefe;
    font-weight: 400;
    padding-left: 30px;
}

.footer-contact li i {
    color: #cf1547;
    margin-right: 12px;
}

.footer-contact li a {
    margin-bottom: 19px;
    font-size: 16px;
    line-height: 26px;
    color: #fefefe;
    font-weight: 400;
    transition: .5s;
}

.footer-contact li a:hover {
    color: #cf1547;
    filter: hue-rotate(360deg);
}


.footer-bottom {
    background-color: #ce1446;
    margin-top: 100px;
}

.footer-bottom-desc p {
    font-size: 16px;
    line-height: 30px;
    color: #ffffff;
    font-weight: 400;
    margin: 0;
}

.footer-bottom-link {
    text-align: right;
}

.footer-bottom-link li {
    display: inline-block;
    margin: 35px  0 35px 28px;
}

.footer-bottom-link a {
    font-size: 16px;
    line-height: 30px;
    color: #ffffff;
    font-weight: 400;
}

/*<!-- ============================================================== -->
 <!-- Allentix Contact Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- ============================================================== -->
            <!-- Allentix Homepage Two Section Start Here -->
<!-- ============================================================== -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Header Section Start Here -->
<!-- ============================================================== -->*/

header.header-manu-section.style-two {
    background: #fff;
    position: relative;
}

header.header-manu-section.style-two .allentix-logo a {
    color: #282828;
}

header.header-manu-section.style-two nav.header-menu a {
    color: #282828;
}

header.header-manu-section.style-two .search-box-outer i {
    color: #282828;
}

/*<!-- ============================================================== -->
 <!-- Allentix Header Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Banner Section Start Here -->
<!-- ============================================================== -->*/

section.banner-section.style-two {
    background: url(../image/banner-bg2.jpg) no-repeat center;
    background-size: cover;
    text-align: left;
}

section.banner-section.style-two .banner-title h1 {
    font-size: 58px;
    line-height: 76px;
    width: 100%;
    margin: 16px 0 0;
}

section.banner-section.style-two .banner-desc p {
    width: 88%;
    margin: 19px 0 30px;
}

.banner-thumb img {
    margin-left: 5rem;
}

/*<!-- ============================================================== -->
 <!-- Allentix Banner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Service Section Start Here -->
<!-- ============================================================== -->*/

section.service-section2 {
    padding: 100px 0 50px;
}

section.service-section2 .allentix-section-title h1 {
    margin: 28px auto 0;
}

.service-box2 {
    margin-top: 82px;
}

.service2-single-box {
    background-color: #fff9fb;
    border-radius: 40px;
    padding: 0  36px 36px;
    text-align: center;
    position: relative;
    z-index: 1;
    margin-bottom: 50px;
}

.service2-single-box::before {
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 0;
    background: #cf1547;
    transition: .5s;
    border-radius: 40px;
    z-index: -1;
}

.service2-single-box:hover::before {
    height: 100%;
}

.service2-box-icon {
    width: 80px;
    height: 80px;
    border-radius: 40px;
    background-color: #f6d3dc;
    margin: auto;
    line-height: 80px;
    transition: .5s;
    position: absolute;
    left: 0;
    right: 0;
    top: -40px;
    filter: drop-shadow(0px 15px 30px rgba(0,0,0,0.1));
}

.service2-single-box:hover .service2-box-icon {
    background: #fff;
}

.service2-box-title h5 {
    font-size: 22px;
    line-height: 54px;
    color: #282828;
    font-weight: 700;
    padding: 56px 0 4px;
    transition: .5s;
}

.service2-single-box:hover .service2-box-title h5 {
    color: #fff;
}

.service2-box-desc p {
    transition: .5s;
}

.service2-single-box:hover .service2-box-desc p {
    color: #fff;
}

.service2-box-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
    margin-top: 14px;
}

.service2-single-box:hover .service2-box-btn a {
    filter: hue-rotate(360deg);
    color: #282828;
}

.service2-box-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
    border-radius: 12px 0;
}

.service2-single-box:hover .service2-box-btn a::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Service Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix About Section Start Here -->
<!-- ============================================================== -->*/

section.about-section.style-two {
    background: #fff9fb;
}

section.about-section.style-two .about-thumb img {
	margin-left: -6rem;
}

section.about-section.style-two .allentix-section-title h1 {
	width: 82%;
}

.about-items {
    margin: 26px 0 -8px;
}

.about-item {
    display: flex;
    gap: 16px;
}

.about-item-icon span {
    width: 35px;
    height: 35px;
    border-radius: 4px 0;
    background-color: #f6d3dc;
    display: inline-block;
    text-align: center;
    line-height: 35px;
    color: #ce1346;
    font-size: 18px;
    font-weight: 500;
    margin-top: 4px;
}

.about-item-title h5 {
    font-size: 22px;
    line-height: 28px;
    color: #282828;
    font-weight: 700;
}

.about-item-desc p {
    width: 58%;
}

/*<!-- ============================================================== -->
 <!-- Allentix About Section End Here -->
<!-- ============================================================== -->*/





/*<!-- ============================================================== -->
 <!-- ============================================================== -->
            <!-- Allentix Homepage Three Section Start Here -->
<!-- ============================================================== -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Banner Section Start Here -->
<!-- ============================================================== -->*/

section.banner-section.style-3 {
    background: url(../image/banner-bg3.jpg) no-repeat center;
    background-size: cover;
}

.banner-title span {
    color: #cf1547;
}

section.banner-section.style-3 .banner-btn {
    float: left;
    margin-right: 120px;
}

.banner-play-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ce1446;
    font-weight: 700;
    position: relative;
    margin-top: 14px;
}

.banner-play-btn i {
    width: 55px;
    height: 55px;
    border-radius: 28px;
    background-color: #fefefe;
    display: inline-block;
    text-align: center;
    line-height: 55px;
    font-size: 40px;
    padding-left: 5px;
    color: #cf1547;
    position: absolute;
    left: -80px;
    top: -14px;
    -webkit-animation: ripple-white 1s linear infinite;
    animation: ripple-blue 1s linear infinite;
    -webkit-transition: .5s;
    transition: .5s;
    animation-name: play-btn;
}

/*<!-- ============================================================== -->
 <!-- Allentix Banner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Banner Section End Here -->
<!-- ============================================================== -->*/

section.work-section {
    padding: 100px 0 55px;
}

section.work-section .allentix-section-title h1 {
    margin: 28px auto 0;
}

.work-box {
    margin-top: 44px;
}

.work-single-box {
    text-align: center;
    margin-bottom: 45px;
}

.work-box-title h5 {
    font-size: 22px;
    line-height: 28px;
    color: #282828;
    font-weight: 700;
    margin: 30px 0 18px;
}

.work-box-desc p {
    width: 88%;
    margin: auto;
}

.work-box-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
    margin-top: 26px;
}

.work-box-btn a:hover {
    filter: hue-rotate(360deg);
    color: #282828;
}

.work-box-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
    border-radius: 12px 0;
}

.work-box-btn a:hover::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Banner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix About Section Start Here -->
<!-- ============================================================== -->*/

section.about-section.style-3 .about-thumb img {
    margin-left: 0rem;
}

.about-item-icon img {
    width: 100%;
}

.about-items.style-2 .about-item-title h5 {
    font-size: 20px;
}

/*<!-- ============================================================== -->
 <!-- Allentix About Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- ============================================================== -->
            <!-- Allentix Homepage Four Section Start Here -->
<!-- ============================================================== -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Banner Section Start Here -->
<!-- ============================================================== -->*/

section.banner-section.style-4 {
    background: url(../image/banner-bg4.jpg) no-repeat center;
    background-size: cover;
    text-align: left;
}

section.banner-section.style-4 .banner-title h1 {
    font-size: 65px;
    width: 40%;
}

section.banner-section.style-4 .banner-desc p {
    width: 46%;
    margin: 16px 0 26px;
}

/*<!-- ============================================================== -->
 <!-- Allentix Banner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix About Details Section Start Here -->
<!-- ============================================================== -->*/

section.about-details-section {
    background-color: #fff9fb;
}

.about-details-thumb img {
	margin-left: -14rem;
}

.about-details-desc p {
    margin: 14px 0 20px; 
}

.about-details-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
    margin-top: 16px;
}

.about-details-btn a:hover {
    filter: hue-rotate(360deg);
    color: #282828;
}

.about-details-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
    border-radius: 12px 0;
}

.about-details-btn a:hover::before {
    transform: scale(1);
}


/*<!-- ============================================================== -->
 <!-- Allentix About Details Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- ============================================================== -->
            <!-- Allentix Inner Page Start Here -->
<!-- ============================================================== -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Banner Inner Section Start Here -->
<!-- ============================================================== -->*/

section.banner-inner-section {
    background: url(../image/banner-inner-bg.jpg) no-repeat center;
    background-size: cover;
    padding: 144px 0;
}

.banner-inner-title h1 {
    font-size: 70px;
    line-height: 60px;
    color: #ffffff;
    font-weight: 600;
}

.banner-inner-link {
    margin-top: 24px;
}

.banner-inner-link ul li {
    display: inline-block;
    margin-right: 10px;
    color: #ffffff;
}

.banner-inner-link a {
    font-size: 22px;
    line-height: 44px;
    color: #ffffff;
    font-weight: 500;
    transition: .5s;
}

.banner-inner-link a:hover {
    color: #cf1547;
    filter: hue-rotate(360deg);
}

.banner-inner-link ul li:first-child i {
    margin-right: 10px;
}

/*<!-- ============================================================== -->
 <!-- Allentix Banner Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Blog Inner Section Start Here -->
<!-- ============================================================== -->*/

section.blog-inner-section {
    padding: 100px 0;
}

section.blog-inner-section .allentix-section-title h1 {
    margin: 28px auto 0;
}

.blog-inner-box {
	margin-top: 44px;
}

.blog-inner-single-box {
    position: relative;
}

.blog-inner-box-thumb img {
    width: 100%;
}

.blog-inner-content.style-two {
    position: absolute;
    bottom: -5rem;
    left: 0;
    right: 0;
}

.blog-inner-content {
    padding: 30px;
    border-radius: 5px;
    background-color: #fff9fb;
    width: 80%;
    position: relative;
    margin: auto;
    transition: .5s;
    z-index: 1;
}

.blog-inner-content:before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: #cf1547;
    transition: .5s;
    border-radius: 5px;
    z-index: -1;
}

.blog-inner-single-box:hover .blog-inner-content:before {
    height: 100%;
    filter: hue-rotate(360deg);
}

.blog-inner-box-date h6 {
    font-size: 15px;
    line-height: 30px;
    color: #777777;
    font-weight: 400;
    transition: .5s;
}

.blog-inner-single-box:hover .blog-inner-box-date h6 {
    color: #fff;
}

.blog-inner-box-date i {
    color: #cf1547;
    padding-right: 6px;
    font-size: 18px;
    transition: .5s;
}

.blog-inner-single-box:hover .blog-inner-box-date i {
    color: #fff;
}

.blog-inner-box-title h3 {
    font-size: 22px;
    line-height: 28px;
    color: #232323;
    font-weight: 700;
    margin: 16px 0 8px;
    transition: .5s;
}

.blog-inner-single-box:hover .blog-inner-box-title h3 {
    color: #fff;
    margin: 16px 0 62px;
}

.blog-inner-box-desc p {
    font-size: 15px;
    line-height: 26px;
    color: #ffffff;
    font-weight: 400;
    margin: 0;
    visibility: hidden;
    opacity: 0;
    transition: .5s;
    -webkit-transition: .5s;
    position: absolute;
    bottom: -24px;
}

.blog-inner-single-box:hover .blog-inner-box-desc p {
    opacity: 1;
    visibility: visible;
    bottom: 24px;
}

.blog-btn {
    text-align: center;
    margin-top: 6rem;
}


.blog-btn a {
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    background: #cf1547;
    padding: 13px  30px;
    border-radius: 12px 0;
    position: relative;
    transition: .5s;
    z-index: 1;
    border: 1px solid transparent;
    margin-top: 16px;
}

.blog-btn a:hover {
    filter: hue-rotate(360deg);
    color: #282828;
}

.blog-btn a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
    border-radius: 12px 0;
}

.blog-btn a:hover::before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Blog Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Service Inner Section Start Here -->
<!-- ============================================================== -->*/

section.work-section.style-2 .work-single-box {
    text-align: center;
    margin-bottom: 30px;
    padding: 42px 0;
    background-color: #fff9fb;
    border-radius: 20px;
    position: relative;
    z-index: 1;
}

section.work-section.style-2 .work-single-box:before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: #cf1547;
    transition: .5s;
    z-index: -1;
    border-radius: 20px;
}

section.work-section.style-2 .work-single-box:hover:before {
    height: 100%;
    filter: hue-rotate(360deg);
}

section.work-section.style-2 .work-box-icon {
    background: #cf1547;
    text-align: center;
    height: 82px;
    width: 90px;
    border-radius: 30% 79% 42% 54%/60% 77% 32% 46%;
    margin: auto;
    line-height: 82px;
    transition: .5s;
}
section.work-section.style-2 .work-single-box:hover .work-box-icon {
    filter: hue-rotate(360deg);
    background: #fff;
}

section.work-section.style-2 .work-box-icon img {
    filter: brightness(0) invert(1);
    transition: .5s;
}

section.work-section.style-2 .work-single-box:hover .work-box-icon img {
    filter: brightness(1) hue-rotate(360deg) !important;
}

section.work-section.style-2 .work-box-title h5 {
    transition: .5s;
}

section.work-section.style-2 .work-single-box:hover .work-box-title h5 {
    color: #fff;
}

section.work-section.style-2 .work-box-desc p {
    transition: .5s;
}

section.work-section.style-2 .work-single-box:hover .work-box-desc p {
    color: #fff;
}

.work-single-box:hover  .work-box-btn a {
    color: #282828;
}

.work-single-box:hover  .work-box-btn a:before {
 transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Service Inner Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Team Inner Section Start Here -->
<!-- ============================================================== -->*/

section.team-inner-section {
    padding: 100px 0 70px;
}

section.team-inner-section .allentix-section-title h1 {
    margin: 28px auto 0;
}

.team-inner-box {
    margin-top: 46px;
}

.team-inner-single-box {
    border-radius: 5px;
    text-align: center;
    overflow: hidden;
    margin-bottom: 30px;
}

.team-inner-box-thumb {
    position: relative;
    overflow: hidden;
}

.team-inner-box-thumb img {
    width: 100%;
    transition: .5s;
}

.team-inner-single-box:hover .team-inner-box-thumb img {
    transform: scale(1.1);
}

.team-thumb-social {
    position: absolute;
    top: 55%;
    right: 30px;
    transition: .5s;
    visibility: hidden;
    opacity: 0;
}

.team-inner-single-box:hover .team-thumb-social {
    top: 25%;
    visibility: visible;
    opacity: 1;
}

.team-thumb-social a {
    width: 45px;
    height: 45px;
    border-radius: 25px;
    background-color: #c92752;
    text-align: center;
    line-height: 45px;
    color: #fff;
    font-size: 18px;
    margin: 4px 0;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.team-thumb-social a:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #282828;
    transform: scale(0);
    border-radius: 30px;
    z-index: -1;
    transition: .5s;
}

.team-thumb-social a:hover:before {
    transform: scale(1);
}

.team-innner-box-content {
    background: #f2f3f5;
    padding: 26px 0;
    position: relative;
    z-index: 1;
}

.team-innner-box-content:before {
    position: absolute;
    content: ''; 
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: #c92752;
    z-index: -1;
    transition: .5s;
}

.team-inner-single-box:hover .team-innner-box-content:before {
    width: 100%;
    filter: hue-rotate(360deg);
}

.team-inner-sub-title h6 {
    font-size: 22px;
    line-height: 30px;
    color: #232323;
    font-weight: 700;
    transition: .5s;
}

.team-inner-single-box:hover .team-inner-sub-title h6 {
    color: #fff;
}

.team-inner-box-title h6 {
    font-size: 14px;
    line-height: 28px;
    color: #727272;
    font-weight: 500;
    transition: .5s;
}

.team-inner-single-box:hover .team-inner-box-title h6 {
    color: #fff;
}

/*<!-- ============================================================== -->
 <!-- Allentix Team Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix About Inner Section End Here -->
<!-- ============================================================== -->*/

section.about-section.style-5 {
    background: #fff;
}

section.about-section.style-5 .about-thumb img {
    margin-left: 3rem;
}

/*<!-- ============================================================== -->
 <!-- Allentix About Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Faq Inner Section End Here -->
<!-- ============================================================== -->*/

section.faq-inner-section {
    padding: 100px 0;
}

section.faq-inner-section .allentix-section-title h1 {
    font-weight: 500;
    margin: 28px auto 0;
}

ul.accordion {
    margin-top: 38px;
}

.accordion li {
    position: relative;
    z-index: 1;
    background: transparent;
    filter: drop-shadow(0px 5px 13.5px rgba(51,51,51,0.05));
    margin-bottom: 30px;
    border: 1px solid #d8d8d8;
}

.accordion li a {
    position: relative;
    width: 100%;
    display: block;
    cursor: pointer;
    background-color: transparent;
    padding: 18px 20px;
    z-index: 1;
    display: flex;
    justify-content: space-between;
}

.accordion-title {
    font-size: 18px;
    line-height: 28px;
    color: #282828;
    font-weight: 700;
}

.accordion li a.active .accordion-title {
    color: #cf1547;
}

.accordian-icon  {
    transform: rotate(0deg);
    transition: .5s;
}

.accordion li a.active .accordian-icon {
    transform: rotate(180deg);
    color: #cf1547;
}

.accordion li p {
    display: none;
    font-size: 16px;
    margin: 0;
    padding: 0  25px 25px;
}


/*<!-- ============================================================== -->
 <!-- Allentix Faq Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Pricing Inner Section start Here -->
<!-- ============================================================== -->*/

section.pricing-inner-page {
    padding: 100px  0 70px;
}

section.pricing-inner-page .allentix-section-title h1 {
    margin: 28px auto 0;
    font-weight: 500;
}

.pricing-inner-box {
    margin-top: 40px;
}

.pricing-inner-single-box {
    border-radius: 20px;
    filter: drop-shadow(0 0 9px rgba(2,2,2,0.15));
    background-color: #ffffff;
    overflow: hidden;
    margin-bottom: 30px;
}

.pricing-inner-box-top {
    padding: 20px 40px 22px;
    background-color: #f6d3dc;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.pricing-inner-box-top:before {
    position: absolute;
    content: '';
    top: 10px;
    right: 16px;
    width: 94px;
    height: 50px;
    background-image: radial-gradient(#ffffff73 2px,transparent 2px);
    background-size: 20px 16px;
    transition: .5s;
    -webkit-animation: dance 2s alternate infinite;
    animation: dance 2s alternate infinite;
}

.pricing-inner-box-top:after {
    position: absolute;
    content: '';
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    background: #cf1547;
    z-index: -1;
    transition: .5s;
}

.pricing-inner-single-box:hover .pricing-inner-box-top:after {
    width: 100%;
    left: 0;
}

.pricing-inner-box-top h5 {
    font-size: 22px;
    line-height: 34px;
    color: #282828;
    font-weight: 700;
    transition: .5s;
}

.pricing-inner-box-top h6 {
    font-size: 16px;
    line-height: 28px;
    color: #777777;
    font-weight: 400;
    margin: 6px 0 14px;
    transition: .5s;
}

.pricing-inner-box-top h2 {
    font-size: 36px;
    line-height: 44px;
    color: #282828;
    font-weight: 700;
    position: relative;
    padding-left: 16px;
    transition: .5s;
}

.pricing-inner-single-box:hover .pricing-inner-box-top h5,
.pricing-inner-single-box:hover .pricing-inner-box-top h6,
.pricing-inner-single-box:hover .pricing-inner-box-top h2 {
    color: #fff;
}

.pricing-inner-single-box span {
    font-size: 16px;
    position: absolute;
    top: -6px;
    left: 0;
}

.pricing-inner-box-bottom {
    padding: 22px 40px;
}

.pricing-inner-box-bottom li i {
    padding-right: 16px;
    font-size: 22px;
    color: #cf1547;
}

.pricing-inner-box-bottom li {
    font-size: 16px;
    line-height: 28px;
    color: #777777;
    font-weight: 400;
    margin: 10px 0;
}

section.pricing-inner-page .pricing-btn {
    text-align: left;
    margin: 36px 0 20px;
}

section.pricing-inner-page .pricing-btn a {
    border: 1px solid #cf1547;
}

section.pricing-inner-page .pricing-btn a:before {
    background: #282828;
}

section.pricing-inner-page .pricing-inner-single-box:hover .pricing-btn a:before {
    transform: scale(1);
}


/*<!-- ============================================================== -->
 <!-- Allentix Pricing Inner Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Blog Details Inner Section Start Here -->
<!-- ============================================================== -->*/


.blog-details-thumb img {
    width: 100%;
}

.blog-detials-post-date h6 {
    display: inline-block;
    font-size: 15px;
    line-height: 15px;
    color: #797979;
    font-weight: 500;
    font-family: "Poppins";
    margin: 30px 20px 12px 0;
}

.blog-detials-post-date i {
    color: #cf1547;
    padding-right: 6px;
    font-size: 18px;
}

.blog-details-title h1 {
    font-size: 35px;
    line-height: 60px;
    color: #333333;
    font-weight: 700;
    margin: 0 0 20px;
}

.blog-detials-desc p span {
    color: #cf1547;
    font-weight: 500;
}

.shop-detials-shere h4 {
    font-size: 20px;
    line-height: 28px;
    color: #333333;
    font-weight: 600;
    margin: 0;
}

.blog-details-social {
    display: flex;
    align-items: center;
    gap: 30px;
    margin: 34px 0;
    border-top: 1px solid #e4e1e1;
    padding: 18px 0 0;
}

.blog-details-social-title h5 {
    font-size: 22px;
    font-weight: 400;
    line-height: 34px;
    margin: 0;
}

.blog-details-social-link ul li {
    display: inline-block;
    margin: 0 2px;
}

.blog-details-social-link a {
    width: 45px;
    height: 45px;
    border-radius: 22px;
    background-color: #797979;
    line-height: 45px;
    text-align: center;
    display: inline-block;
    color: #fff;
    position: relative;
    z-index: 1;
}

.blog-details-social-link a:before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #cf1547;
    z-index: -1;
    border-radius: 30px;
    transition: .5s;
    transform: scale(0);
}

.blog-details-social-link a:hover:before {
    transform: scale(1);
}

.blog-details-box {
    display: flex;
    align-items: center;
    gap: 30px;
}

.blog-detials-single-box {
    border-radius: 5px;
    background-color: #f8f9f7;
    text-align: center;
    padding: 58px 0;
}

.blog-detials-single-box h4 {
    font-size: 20px;
    line-height: 30px;
    color: #333333;
    font-weight: 600;
    width: 70%;
    margin: auto;
}

.blog-title h2 {
    font-size: 24px;
    line-height: 30px;
    color: #333333;
    font-weight: 600;
    margin: 42px 0 34px;
}

.related-blog-single-box {
    border-radius: 40px;
    filter: drop-shadow(0px 5px 30px rgba(226,226,226,0.5));
    background-color: #ffffff;
}

.blog-box-thumb img {
    width: 100%;
    border-radius: 4px 4px 0 0;
}

.blog-box-thumb {
    position: relative;
    overflow: hidden;
}

.blog-box-thumb:before {
    position: absolute;
    content: '';
    top: 0%;
    left: 0;
    width: 0%;
    height: 100%;
    background: rgb(27 27 30 / 60%);
    transition: .4s;
    border-radius: 4px 0 0 0;
}

.blog-box-thumb:after {
    position: absolute;
    content: '';
    top: 0%;
    right: 0;
    width: 0%;
    height: 100%;
    background: rgb(27 27 30 / 60%);
    transition: .4s;
    border-radius: 0 4px 0 0;
}

.related-blog-single-box:hover .blog-box-thumb:before,
.related-blog-single-box:hover .blog-box-thumb:after{
    width: 50%;
}

.blog-content {
    padding: 32px;
    position: relative;
    z-index: 1;
}

.blog-content:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #cf1547;
    border-radius: 0 0 40px 40px;
    transition: .4s;
    transform: scale(0);
    z-index: -1;
}

.related-blog-single-box:hover .blog-content:before{
    transform: scale(1);
    filter: hue-rotate(360deg);
}

.blog-box-date h5 {
    font-size: 16px;
    line-height: 50px;
    color: #cf1547;
    font-weight: 400;
    margin: 0;
    transition: .4s;
}

.related-blog-single-box:hover .blog-box-date h5{
    color: #fff;
}

.blog-box-title a {
    display: inline-block;
    font-size: 18px;
    line-height: 30px;
    color: #333;
    font-weight: 500;
    margin: 10px 0 20px;
    transition: .4s;
}

.related-blog-single-box:hover .blog-box-title a {
    color: #fff;
}

.blog-box-footer {
    align-items: center;
    display: flex;
    gap: 12px;
    border-top: 1px solid rgba(39,39,39,0.10196078431372549);
    padding: 20px 0 0;
    transition: .4s;
}

.related-blog-single-box:hover .blog-box-footer{
    border-top: 1px solid #fff;
}

.posted-by a,
.post-comment a {
    font-size: 15px;
    line-height: 30px;
    color: #333;
    font-weight: 400;
    display: inline-block;
    transition: .4s;
}

.related-blog-single-box:hover .posted-by a,
.related-blog-single-box:hover .post-comment a,
.related-blog-single-box:hover .posted-by a i,
.related-blog-single-box:hover .post-comment a i{
    color: #fff;
}

.posted-by a i ,
.post-comment a i {
    color: #cf1547;
    transition: .4s;
}

.blog-box-btn a {
    color: #1f1f1f;
    margin-left: 32px;
    transition: .4s;
}

.related-blog-single-box:hover .blog-box-btn a{
    color: #fff;
}

.comments-title h4 {
    font-size: 24px;
    line-height: 30px;
    color: #333333;
    font-weight: 600;
    margin: 42px 0 34px;
}

.blog-details-comments-item {
    display: flex;
    gap: 24px;
    position: relative;
    border-bottom: 1px solid #e0dcdc;
    padding-bottom: 46px;
}

.blog-details-comments-item:nth-child(3) {
    margin-top: 70px;
}

.comment-profile i {
    font-size: 80px;
    color: #d8d8d8;
    margin-top: 6px;
    display: inline-block;
}

.comment-title h5 {
    margin: 0px 0 20px;
    font-size: 20px;
    line-height: 30px;
    color: #333333;
    font-weight: 600;
}

.comment-reply button {
    font-size: 12px;
    line-height: 30px;
    color: #ffffff;
    font-weight: 600;
    font-family: "Poppins";
    text-align: center;
    width: 92px;
    height: 32px;
    border-radius: 5px;
    background-color: #cf1547;
    border: none;
    position: absolute;
    top: 0;
    right: 0;
    transition: .5s;
}

.comment-reply button:hover {
    filter: hue-rotate(360deg);
}

.add-comment-title h4 {
    font-size: 24px;
    line-height: 60px;
    color: #333333;
    font-weight: 600;
    margin: 32px 0;
}

.blog-details-form-top textarea {
    width: 100%;
    height: 225px;
    border-radius: 5px;
    background-color: #fcfcfc;
    border: 1px solid #e6e6e6;
    padding: 10px 20px;
    resize: none;
    margin-bottom: 13px;
}

.blog-details-form-middle input {
    display: inline-block;
    width: 100%;
    height: 60px;
    border-radius: 5px;
    background-color: #fcfcfc;
    border: 1px solid #e6e6e6;
    padding: 10px 20px;
    margin-bottom: 20px;
}

.blog-details-form-bottom {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 10px;
}

.form-bottom-email,
.form-bottom-site {
    width: 100%;
}

.form-bottom-email input, .form-bottom-site input {
    display: inline-block;
    width: 100%;
    height: 60px;
    border-radius: 5px;
    background-color: #fcfcfc;
    border: 1px solid #e6e6e6;
    padding: 10px 20px;
}

.form-bottom-email input::placeholder, .form-bottom-site input::placeholder, 
.blog-details-form-middle input::placeholder, .blog-details-form-top textarea::placeholder {
    font-size: 16px;
    line-height: 28px;
    color: #797979;
    font-weight: 400;
}

.form-condition input {
    float: left;
    margin-right: 10px;
}

.form-condition p {
    margin: 0;
    display: inline-block;
}

.form-condition input {
    float: left;
    margin: 7px 10px 0 0;
    cursor: pointer;
}

.blog-details-form-btn button {
    display: inline-block;
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 600;
    border-radius: 5px;
    padding: 12px 32px;
    overflow: hidden;
    background-color: #cf1547;
    position: relative;
    z-index: 1;
    transition: .4s;
    border: none;
    margin-top: 24px;
}

.blog-details-form-btn button:hover {
    filter: hue-rotate(360deg);
}

.blog-details-form-btn button::before {
    position: absolute;
    content: '';
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    background: #333;
    transition: .5s;
    z-index: -1;
    border-radius: 5px;
}

.blog-details-form-btn button:hover::before {
    width: 100%;
    left: 0;
    filter: hue-rotate(360deg);
}


/*<!-- ============================================================== -->
 <!-- Allentix Blog Details Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Blog List Inner Section Start Here -->
<!-- ============================================================== -->*/

section.blog-details {
    padding: 100px 0 70px;
}

.blog-deteils-post {
    border-radius: 12px;
    border: 1px solid #e4e4e4;
    margin-bottom: 30px;
}

.blog-details-post-thumb img {
    width: 100%;
    border-radius: 12px 12px 0 0;
}

.blog-deteils-post-content {
    padding: 10px 30px;
}

.blog-deteils-content-top {
    display: flex;
    align-items: center;
    gap: 20px;
}

.blog-deteils-content-top h6 {
    font-size: 15px;
    line-height: 60px;
    color: #777777;
    font-weight: 400;
}

.blog-deteils-content-top i {
    color: #cf1547;
    font-size: 20px;
    padding-right: 10px;
}

.blog-deteils-post-type i {
    display: inline-block;
    transform: rotate(90deg);
    padding: 3px 0px 0 7px;
    line-height: 0;
}

.blog-deteils-post-title h1 {
    font-size: 25px;
    line-height: 30px;
    color: #232323;
    font-weight: 700;
    margin: 4px 0 16px;
}


.style-two .shop-categories {
    margin-top: 30px;
}

.read-more a {
    font-size: 17px;
    line-height: 28px;
    color: #282828;
    font-weight: 500;
    margin-bottom: 40px;
    display: inline-block;
}

.recent-post a {
    display: inline-block;
}

.recent-post-icon {
    width: 90px;
    height: 90px;
    float: left;
    margin-right: 20px;
    margin-top: 4px;
}

.recent-post-icon img {
    border-radius: 5px;
}

.post-title h5 {
    font-size: 16px;
    line-height: 24px;
    color: #282828;
    font-weight: 500;
    margin: 0;
}

.post-date h5 {
    font-size: 14px;
    color: #616161;
    font-weight: 400;
    margin: 0;
    line-height: 24px;
}

.post-date i{
    color: #cf1547;
    padding-right: 6px;
}

.search-catagory {
    position: relative;
    display: inline-block;
    width: 100%;
}

.search-catagory input {
    width: 100%;
    height: 60px;
    padding: 10px 30px;
    background-color: #fcfcfc;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
}

.search-catagory button {
    position: absolute;
    top: 0;
    bottom: 0;
    font-size: 26px;
    border: none;
    right: 0;
    color: #fff;
    background: #cf1547;
    width: 80px;
    border-radius: 0 5px 5px 0;
}

.style-two .shop-categories {
    margin-top: 30px;
    background: #fff;
    padding: 30px;
    border-radius: 5px;
    background-color: #f8f9f7;
}

.shop-section-title h3 {
    font-size: 20px;
    line-height: 45px;
    color: #333333;
    font-weight: 700;
    margin: 0 0 20px;
    padding-bottom: 16px;
    border-bottom: 3px solid #e6e5e5;
    position: relative;
}

.shop-section-title h3:before {
    position: absolute;
    content: '';
    top: 61px;
    left: 0;
    width: 50px;
    height: 3px;
    background: #cf1547;
}

.shop-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.shop-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 8px 0;
    font-weight: 400;
    color: #333;
}

.shop-list-left i {
    width: 25px;
    height: 25px;
    display: inline-block;
    border-radius: 4px;
    color: #fff;
    text-align: center;
    line-height: 28px;
    font-size: 20px;
    background: #fff;
    margin-right: 8px;
    transition: .5s;
    cursor: pointer;
    border: 1px solid #cf1547;
}

.shop-list-left i:hover, 
.shop-list-left i.active {
    background: #cf1547;
    filter: hue-rotate(360deg);
}

.cloud-tag li {
    display: inline-block;
    margin: 10px 6px 0 0;
}

.cloud-tag li a {
    padding: 6px 20px;
    background: #fff;
    border-radius: 4px;
    transition: .4s;
    font-weight: 400;
    position: relative;
    display: inline-block;
    z-index: 1;
    font-size: 14px;
    color: #333;
    transition: .5s;
}

.cloud-tag li a:hover {
    color: #fff;
}

.cloud-tag li a::before{
    position: absolute;
    content: '';
    top: 0;
    left: 50%;
    width: 0%;
    height: 100%;
    background-color: #cf1547;
    transition: .4s;
    z-index: -1;
    border-radius: 4px;
}

.cloud-tag li a:hover::before { 
    width: 100%;
    left: 0;
    filter: hue-rotate(360deg);
}

.newsletter {
    position: relative;
}

.newsletter input {
    width: 100%;
    height: 60px;
    border-radius: 3px;
    background-color: #ffffff;
    border: 1px solid #2828282e;
    padding: 10px 30px;
    margin-bottom: 20px;
    margin-top: 20px;
}

.newsletter i {
    opacity: 0.702;
    font-size: 15px;
    line-height: 28px;
    color: #282828;
    position: absolute;
    top: 36px;
    right: 18px;
}

.newsletter button {
    height: 60px;
    width: 100%;
    border-radius: 3px;
    background-color: #cf1547;
    border: none;
    font-size: 17px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .4s;
}

.newsletter button:hover{
    filter: hue-rotate(250deg);
}

.newsletter button:before {
    position: absolute;
    content: '';
    top: 0;
    left: -50px;
    width: 0%;
    height: 100%;
    background: #282828;
    filter: hue-rotate(250deg);
    transform: skew(-29deg, 10deg) scale(1.8);
    transition: .4s;
    z-index: -1;
}

.newsletter button:after {
    position: absolute;
    content: '';
    top: 0;
    right: -74px;
    width: 0%;
    height: 100%;
    background: #282828;
    filter: hue-rotate(250deg);
    transform: skew(-29deg, 10deg) scale(1.8);
    transition: .4s;
    z-index: -1;
}

.newsletter button:hover:before,
.newsletter button:hover:after{
    width: 50%;
}

.comment ul li a {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
}

.recent-comment-icon i {
    width: 50px;
    height: 50px;
    border-radius: 5px;
    background-color: #fff;
    display: inline-block;
    line-height: 50px;
    text-align: center;
    color: #cf1547;
    font-size: 18px;
    transition: .5s;
}

.comment ul li a:hover .recent-comment-icon i {
    background-color: #cf1547;
    color: #fff;
    filter: hue-rotate(360deg);
}

.recent-comment-content p {
    color: #333;
    margin: 0;
    transition: .5s;
}

.comment ul li a:hover .recent-comment-content p {
    color: #282828;
}

.contact-us {
    background: url(../image/blog-details-inner-thumb-5.png) no-repeat center;
    background-size: cover;
    text-align: center;
    padding: 100px 0;
    margin-top: 30px;
    border-radius: 5px;
    position: relative;
}

.contact-us:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    border-radius: 5px;
    opacity: 50%;
    z-index: -1;
}

.contact-title h1 {
    font-size: 46px;
    font-weight: 400;
    color: #fff;
    margin: 20px 0;
}

.contact-btn a {
    display: inline-block;
    font-size: 16px;
    color: #333;
    background: #fff;
    padding: 8px 28px;
    border-radius: 4px;
    position: relative;
    z-index: 1;
    margin-top: 10px;
    transition: .5s;
}

.contact-btn a:hover {
    color: #fff;
}

.contact-btn a:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #cf1547;
    border-radius: 4px;
    transition: .5s;
    z-index: -1;
    transform: scale(0);
}

.contact-btn a:hover:before {
    transform: scale(1);
    filter: hue-rotate(360deg);
}

/*<!-- ============================================================== -->
 <!-- Allentix Blog List Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Contact Inner Section Start Here -->
<!-- ============================================================== -->*/

.contact-thumb {
    position: relative;
}

.contact-inner-shape {
	position: absolute;
	z-index: -1;
	left: -2rem;
	top: -2rem;
}

.contact-inner-shape img {
    -webkit-animation: Dance 2s a infinite;
    animation: Dance 2s linear infinite;
    transition: all ease-in-out .5s;
}

.contact-inner-shape2 {
	position: absolute;
	top: 0;
	right: -5rem;
	display: inline-block;
}

.contact-inner-shape2 img {
    -webkit-animation: rotateme 2s linear infinite;
    animation: rotateme 2s linear infinite;
}

section.contact-section.style-two .contact-content {
    filter: drop-shadow(0 0 9px rgba(2,2,2,0.15));
    background-color: #ffffff;
    border-radius: 12px;
    padding: 36px 52px;
}

section.contact-section.style-two .form-top input,
section.contact-section.style-two .form-middle-left input,
section.contact-section.style-two .form-middle-right input {
    border: 1px solid #28282826;
    padding: 10px 20px;
    height: 60px;
    border-radius: 5px;
}

section.contact-section.style-two .form-bottom textarea {
    border: 1px solid #28282826;
    padding: 10px 20px;
    border-radius: 5px;
    height: 140px;
}

.contact-inner-desc p {
    margin: 16px 0 32px;
}

/*<!-- ============================================================== -->
 <!-- Allentix Contact Inner Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Contact Location Inner Section Start Here -->
<!-- ============================================================== -->*/

.contact-location iframe {
    height: 600px;
    width: 100%;
}

/*<!-- ============================================================== -->
 <!-- Allentix Contact Location Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Shop Inner Section Start Here -->
<!-- ============================================================== -->*/

section.shop-inner-page {
    padding: 100px 0 70px;
}

section.shop-inner-page .allentix-section-title h1 {
    margin: 28px auto 0;
}

.shop-inner-box {
    margin-top: 44px;
}

.shop-inner-single-box {
    position: relative;
    text-align: center;
    overflow: hidden;
    margin-bottom: 30px;
}

.shop-inner-box-thumb {
    position: relative;
    overflow: hidden;
}

.shop-inner-box-thumb img {
    width: 100%;
    border-radius: 40px;
}

.shop-inner-box-thumb:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #cf1547 ;
    opacity: 50%;
    transform: scale(0);
    transition: .5s;
    border-radius: 40px;
}

.shop-inner-single-box:hover .shop-inner-box-thumb:before {
    transform: scale(1);
}

.shop-inner-content {
    position: absolute;
    text-align: center;
    z-index: 1;
    top: 80%;
    left: 0;
    right: 0;
    transition: .5s;
    visibility: hidden;
    opacity: 0;
}

.shop-inner-single-box:hover .shop-inner-content {
    visibility: visible;
    opacity: 1;
    top: 32%;
}

.shop-inner-sub-title h6 {
    font-size: 16px;
    line-height: 28px;
    color: #fefefe;
    font-weight: 400;
}

.shop-inner-title h5 {
    font-size: 22px;
    line-height: 28px;
    color: #fefefe;
    font-weight: 700;
    margin-top: 10px;
}

.shop-inner-btn a {
    width: 45px;
    height: 45px;
    text-align: center;
    line-height: 45px;
    border-radius: 30px;
    background: #fff;
    color: #cf1547;
    font-size: 18px;
    position: relative;
    z-index: 1;
    transition: .5s;
    border: 1px solid #fff;
    margin: 20px 6px 0;
}

.shop-inner-btn a:hover {
    color: #fff;
}

.shop-inner-btn a:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #cf1547 ;
    transform: scale(0);
    transition: .5s;
    border-radius: 30px;
    z-index: -1;
}

.shop-inner-btn a:hover:before {
    transform: scale(1);
}

/*<!-- ============================================================== -->
 <!-- Allentix Shop Inner Section End Here -->
<!-- ============================================================== -->*/



/*<!-- ============================================================== -->
 <!-- Allentix Checkout Inner Section Start Here -->
<!-- ============================================================== -->*/

/* / Apply some basic styles to the checkout container / */
.checkout-container {
    width: 700px;
    margin: 0 auto;
    padding: 100px 0;
    text-align: center;
    font-family: Arial, sans-serif;
}

/* / Style the table / */
.checkout-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}

.checkout-table th, .checkout-table td {
    border: 1px solid #ccc;
    padding: 10px;
    color: #282828;
}

.checkout-table th {
    background-color: #f2f2f2;
    color: #282828;
}

/* / Style the "Proceed to Payment" button / */
.checkout-button {
    background-color: #cf1547;
    color: #fff;
    border: none;
    padding: 10px 20px;
    font-size: 18px;
    cursor: pointer;
    border-radius: 4px;
}

.checkout-button:hover {
    background-color: #cf1547;
}

/* / Style the quantity input / */
.quantity {
    width: 40px;
    text-align: center;
}

/* / Highlight changed quantity values / */
.changed {
    background-color: #ffff99;
}

/*<!-- ============================================================== -->
 <!-- Allentix Checkout Inner Section End Here -->
<!-- ============================================================== -->*/


/*<!-- ============================================================== -->
 <!-- Allentix Portfolio Details Inner Section Start Here -->
<!-- ============================================================== -->*/

section.potfolio-details-section {
    padding: 120px 0;
    background: #f8f8f8;
}

.portfolio-info {
    background: #fff;
    filter: drop-shadow(0px 3px 30px rgba(189,189,189,0.26));
    padding: 68px 60px;
}

.portfolio-info-title h1 {
    font-size: 35px;
    line-height: 40px;
    color: #282828;
    font-weight: 400;
    margin: 0;
}

.portfolio-info-details {
    margin-top: 26px;
}

.portfolio-info-details h6 {
    font-size: 22px;
    line-height: 28px;
    color: #282828;
    font-weight: 400;
}

.portfolio-info-details span {
    font-weight: 300;
    font-size: 18px;
}

.portfolio-info-shere-title h5 {
    font-size: 22px;
    line-height: 60px;
    color: #282828;
    font-weight: 400;
    text-transform: capitalize;
    margin: 0;
}

.portfolio-info-share {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

.portfolio-info-share ul li {
    display: inline-block;
    margin: 0 4px;
}

.portfolio-info-share ul li a {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background-color: #f8f5f0;
    display: inline-block;
    color: #282828;
    text-align: center;
    line-height: 40px;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.portfolio-info-share ul li a:hover {
    color: #fff;
}

.portfolio-info-share ul li a::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #cf1547;
    transform: scale(0);
    z-index: -1;
    transition: .5s;
    border-radius: 20px;
}

.portfolio-info-share ul li a:hover::before {
    transform: scale(1);
    filter: hue-rotate(360deg);
}

.portfolio-info-thumb {
    filter: drop-shadow(0px 3px 30px rgba(189,189,189,0.26));
}

.portfolio-info-thumb img {
    width: 100%;
}

.portfolio-strategy {
    margin: 60px 0 120px;
    padding: 50px 60px;
    background: #fff;
    filter: drop-shadow(0px 3px 30px rgba(189,189,189,0.26));
}

.portfolio-strategy-title h1 {
    font-size: 35px;
    line-height: 40px;
    color: #282828;
    font-weight: 400;
    margin: 0 0 20px;
}

.portfolio-strategy-desc p {
    margin: 0;
}

.portfolio-related-title h1 {
    font-size: 35px;
    line-height: 60px;
    color: #282828;
    font-weight: 400;
    margin-bottom: 8px;
}

.portfolio-related-btn a {
    font-size: 14px;
    color: #616161;
    font-weight: 400;
    text-transform: uppercase;
    display: inline-block;
    width: 110px;
    height: 45px;
    background-color: #e4e4e4;
    text-align: center;
    line-height: 45px;
    margin-top: 20px;
    transition: .5s;
    position: relative;
    z-index: 1;
}

.portfolio-related-btn a:hover {
    color: #fff;
}

.portfolio-related-btn a:before {
    position: absolute;
    content: '';
    top: 0;
    right: 0;
    width: 0%;
    height: 100%;
    background: #cf1547;
    transition: .5s;
    z-index: -1;
}

.portfolio-related-btn a:hover:before {
    width: 100%;
    filter: hue-rotate(360deg);
    left: 0;
}

.portfolio-related-thumb {
    position: relative;
    text-align: center;
}

.portfolio-related-thumb:before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: #282828;
    opacity: .7;
    transition: .5s;
}

.portfolio-related-thumb:hover:before {
    height: 100%;
    top: 0;
}

.portfolio-related-thumb img {
    width: 100%;
}

.related-thumb-content {
	position: absolute;
	bottom: -10%;
	left: 0;
	right: 0;
	visibility: hidden;
	opacity: 0;
    transition: .5s;
}

.portfolio-related-thumb:hover .related-thumb-content {
    bottom: 7%;
    visibility: visible;
    opacity: 1;
}

.related-thumb-content a {
    font-size: 18px;
    line-height: 30px;
    color: #ffffff;
    font-weight: 400;
    display: inline-block;
    padding: 10px 44px 10px 24px;
    background-color: #cf1547;
    transition: .5s;
    position: relative;
}

.related-thumb-content a:hover {
    filter: hue-rotate(360deg);
}

.related-thumb-content a i {
    transition: .5s;
    position: absolute;
    top: 11px;
    right: 20px;
}

.related-thumb-content a:hover i {
    right: 14px;
}

/*<!-- ============================================================== -->
 <!-- Allentix Portfolio Details Inner Section End Here -->
<!-- ============================================================== -->*/




/*<!--==============================================================-->
 <!-- Allentix Shop Details Inner End Here -->
<!--==============================================================-->*/

section.shop-details-section {
    padding: 100px 0;
}

.thumb-tabs {
    background: #fff;
    padding: 50px;
    border-radius: 5px;
    filter: drop-shadow(0 0 15px rgba(218,218,218,0.3));
}

.tab-content {
    display: none;
    -webkit-animation: move .4s ease-in;
    animation: FadeInUp .5s ease-in;
}

.tab-content.active {
    display: block;
}

.shop-details-thumb {
    position: relative;
}

.shop-details-thumb img {
    width: 100%;
    border-radius: 4px;
    filter: drop-shadow(0 0 15px rgba(218,218,218,0.3));
}

.add-to-favourite {
    position: absolute;
    top: 30px;
    right: 30px;
}

.add-to-favourite a{
    width: 50px;
    height: 50px;
    border-radius: 28px;
    background-color: #282828;
    color: #ffffff;
    text-align: center;
    line-height: 50px;
    position: relative;
    z-index: 1;
    transition: .4s;
    overflow: hidden;
    display: inline-block;
}

.add-to-favourite a:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #cf1547;
    transform: scale(0);
    z-index: -1;
    transition: .4s;
    border-radius: 30px;
}

.add-to-favourite a:hover:before {
    transform: scale(1);
    filter: hue-rotate(360deg);
}

.tab-btn button{
    width: 120px;
    height: 86px;
    border-radius: 4px;
    background-color: #ffffff;
    border: 1px solid rgba(13,14,20,0.1);
    margin-top: 30px;
    overflow: hidden;
    padding: 0;
}

.tab-btn button:focus {
    outline: none;
}

.tab-btn button.active {
    border: 1px solid #cf1547;
}

.shop-details-title h2 {
    font-size: 30px;
    line-height: 36px;
    color: #282828;
}

.rate-left ul li {
    display: inline-block;
    color: #cf1547;
    font-size: 16px;
    margin: 16px 4px 16px 0;
}

.shop-details-rate {
    display: flex;
    gap: 16px;
    align-items: center;
}

.rate-right p {
    font-size: 17px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    margin: 0;
}

.shop-details-price h5 {
    font-size: 20px;
    line-height: 28px;
    color: #cf1547;
    font-weight: 500;
    margin: 0 0 20px 0;
}

.shop-details-price h5 span {
    opacity: 0.502;
    text-decoration: line-through;
    color: #26272c;
    padding-left: 10px;
}

.select-product {
    width: 130px;
    height: 52px;
    border-radius: 4px;
    background-color: #ffffff;
    border: 1px solid rgba(13,14,20,0.1);
    padding: 10px 30px;
    position: relative;
    float: left;
    margin-right: 20px;
}

.select-shop-btn {
    position: absolute;
    top: 0;
    right: 14px;
}

.select-shop-btn i {
    font-size: 18px;
    line-height: 25px;
    color: #26272c;
    font-family: "Font Awesome 5 Free";
}

.add-to-cart-btn a {
    width: 143px;
    height: 54px;
    line-height: 54px;
    border-radius: 4px;
    background-color: #cf1547;
    display: inline-block;
    font-size: 16px;
    color: #ffffff;
    font-weight: 500;
    text-align: center;
    transition: .4s;
}

.add-to-cart-btn a:hover {
    filter: hue-rotate(360deg);
}

.shop-features {
    margin-top: 26px;
}

.shop-details-color h5 {
    font-size: 16px;
    line-height: 28px;
    color: #26272c;
    font-weight: 500;
    margin: 0 0 22px;
}

.shop-details-color h5 span{
    color: #616161;
    padding-left: 6px;
}

.shop-features td{
    font-size: 16px;
    line-height: 36px;
    font-weight: 500;
}

.table-title {
    color: #282828;
}

section.shop-related .shop-cart-thumb::before {
    clip-path: polygon(0 0, 200% 0%, 0% 200%);
}

section.shop-related .shop-content {
    background-color: #fff;
    text-align: left;
    filter: drop-shadow(0 0 20px rgba(228,228,228,0.5));
    padding: 22px 30px 6px;
}


section.shop-related .shop-title h3 {
    color: #0d0e13;
    font-size: 18px;
    margin: 5px 0 0px;
}

section.shop-related .shop-price del {
    color: #616161;
    font-weight: 400;
    margin-right: 8px;
}

section.shop-related .shop-rating li {
    font-size: 14px;
}

section.shop-related .shop-cart-btn a {
    border: transparent;
    color: #fff;
    display: none;
}

.info-tab-btn button {
    padding: 14px 30px;
    border-radius: 4px;
    background-color: #ffffff;
    border: 1px solid rgba(13,14,20,0.1);
    font-size: 16px;
    line-height: 28px;
    color: #1f1f1f;
    font-weight: 400;
    float: left;
    margin-right: 20px;
    width: auto;
    height: auto;
}

.info-desc {
    margin-top: 34px;
}

.info-tab-btn button.active {
    background-color: #cf1547;
    color: #fff;
}

.tab-contents {
    margin-top: 30px;
    margin-bottom: 40px;
    -webkit-animation: move .4s ease-in;
    animation: FadeInUp .5s ease-in;
    display: none;
}

.tab-contents.active {
    display: block;
}

.additional-info {
    border-top: 1px solid rgba(223,223,223,0.55);
    border-bottom: 1px solid rgba(223,223,223,0.55);
}

.additional-info table {
    width: 100%;
}

tr.table-bg {
    background-color: rgba(223,223,223,0.2);
}

td.table_title {
    font-size: 16px;
    line-height: 28px;
    color: #282828;
    font-weight: 400;
    width: 180px;
    height: 68px;
    padding: 0 40px;
}

.profile-icon i {
    font-size: 66px;
    color: #dfdfdf;
}


.shop-review {
    display: flex;
    align-items: center;
    gap: 24px;
}

.review-rate li {
    display: inline-block;
    letter-spacing: 4px;
    color: #cf1547;
}

.profile-name {
    position: relative;
    display: flex;
    gap: 38px;
}

.profile-name h5 {
    font-size: 17px;
    line-height: 28px;
    color: #282828;
    font-weight: 500;
    margin: 0;
}

.review-date h5 {
    position: relative;
    opacity: 0.800;
    font-size: 15px;
    line-height: 28px;
    color: #282828;
    font-weight: 400;
}

.review-date h5:before {
    position: absolute;
    content: '';
    top: 14px;
    left: -28px;
    background: #282828;
    width: 20px;
    height: 1px;
}

.reply button {
    border: none;
    background: transparent;
    font-size: 14px;
    color: #282828;
}

.add-review-title h3 {
    font-size: 18px;
    line-height: 28px;
    color: #282828;
    font-weight: 500;
    margin: 0;
}

.your-rate {
    display: flex;
    gap: 26px;
    align-items: center;
}

.rate-right li {
    font-size: 15px;
    letter-spacing: 5px;
    line-height: 28px;
    color: #cf1547;
    font-family: "Font Awesome";
    display: inline-block;
}

.rate-left h5 {
    opacity: 0.800;
    font-size: 16px;
    line-height: 28px;
    color: #282828;
    font-weight: 400;
    margin: 0;
}

.review-form-top {
    display: flex;
    gap: 28px;
    margin-bottom: 20px;
    margin-top: 30px;
}

.form-top-left,
.form-top-right {
	width: 100%;
}

form.review-form label {
    display: block;
    opacity: 0.902;
    font-size: 14px;
    line-height: 28px;
    color: #282828;
    font-weight: 400;
    margin-bottom: 6px;
}

form.review-form input {
	width: 100%;
	height: 54px;
	background-color: #ffffff;
	border: 1px solid rgba(13,14,20,0.1);
	padding: 10px 20px;
}

form.review-form textarea {
    width: 100%;
    height: 156px;
    background-color: #ffffff;
    border: 1px solid rgba(13,14,20,0.1);
    padding: 10px 20px;
    resize: none;
}

form.review-form input::placeholder,
form.review-form textarea::placeholder{
    opacity: 0.702;
    font-size: 14px;
    line-height: 28px;
    color: #282828;
    font-weight: 400;
}

section.shop-related {
    margin: 0 0 100px;
}

.shop-related-title h2 {
    font-size: 36px;
    line-height: 40px;
    margin-bottom: 30px;
}

/*<!--==============================================================-->
 <!-- Allentix shop Details Inner End Here -->
<!--==============================================================-->*/



/*<!--==============================================================-->
 <!-- Allentix Cart Inner Start Here -->
<!--==============================================================-->*/

.shoping-cart-area {
    background: #fff none repeat scroll 0 0;
    padding: 100px 0;
}

.area-title.bdr h2 {
    font-size: 40px;
    font-weight: 600;
    line-height: 50px;
    margin-bottom: 30px;
}

.c-img {
    width: 12%;
}

.c-img img {
    width: 120px;
}

.c-price {
    color: #cf1547;
    font-size: 30px;
    font-weight: 700;
    width: 15.4%;
}

.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th {
    border-bottom-width: 0;
    text-align: center;
}

.table.table-bordered tr {
    font-weight: 700;
    text-transform: capitalize;
    font-size: 16px
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
    vertical-align: middle;
}

.table.table-bordered tr th {
    color: #666;
    text-transform: uppercase;
}

.c-qty {
    width: 1%
}

.c-qty span {
    border: 1px solid #ddd;
    color: #777;
    display: block;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    margin: 0;
    width: 40px;
}

.trash-btn {
    width: 4%;
}

.c-name span {
    color: #888;
    font-size: 11px;
    font-style: italic;
    margin: 10px;
}

.c-head,
tfoot tr {
    background: #ddd none repeat scroll 0 0;
}

.button.c_button {
    background: #cf1547 none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 15px;
    font-weight: 700;
    padding: 10px 35px;
    position: relative;
    z-index: 1;
    border-radius: 5px;
    margin-top: 16px;
}

.button.c_button:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    border-radius: 5px;
    width: 100%;
    height: 100%;
    background: #282828;
    transform: scale(0);
    z-index: -1;
    transition: .5s;
}

.button.c_button:hover:before {
    transform: scale(1);
}

.button.c_button:hover {
    filter: hue-rotate(360deg);
    color: #fff
}

.button.c_button.c-shop {
    float: left;
}

.button.c_button.c-pc {
    float: right;
    margin-left: 10px;
}

.button.c_button.c-up {
    float: right;
}

.discount {
    border-radius: 5px;
}

.discount h2 {
    border-bottom: 1px solid #ededed;
    color: #666;
    font-size: 16px;
    font-weight: bold;
    margin: 0 -15px;
    padding: 15px;
    text-transform: uppercase;
}

.cart-collaterals .discount .discount-form {
    overflow: hidden;
    padding: 10px;
}

.discount-form label {
    font-weight: normal;
    margin: 5px 0;
}

.discount .discount-form .input-box {
    position: relative;
}

.discount .discount-form .input-box input {
    border: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: none;
    box-sizing: border-box;
    color: #aaa;
    height: 36px;
    padding: 6px 10px;
    width: 100%;
}

.discount .discount-form .input-box::before {
    background: #efefef;
    border-radius: 0;
    content: "\f0dd";
    height: 34px;
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    position: absolute;
    text-align: center;
    right: 1px;
    top: 1px;
    width: 29px;
    color: #282828;
}

.single-dis {
    border: 1px solid #e2e2e2;
    border-radius: 5px;
    overflow: hidden;
    padding: 12px 15px;
}

.single-dis .button.c_button span {
    font-size: 16px;
    font-weight: 700;
}

.button.c_button.dis-left {
    margin-top: 20px;
}

.shop_subtotal {
    float: right;
    margin-bottom: 20px;
}

.subtotal-area {
    background: #f9f9f9 none repeat scroll 0 0;
    border: 1px solid #e2e2e2;
    border-radius: 5px;
    text-align: right;
    padding: 8px 15px 20px;
    font-size: 15px
}

tfoot tr.s-total {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}

.subtotal-area .shop_subtotal tr {
    float: right;
    padding: 10px 0;
}

.s-price {
    padding: 0 2px 0 15px;
}

.sp-bottom-menu-wrapper.common4 {
    background: #fff none repeat scroll 0 0;
    border-top: 1px solid #ddd;
}

/*<!--==============================================================-->
 <!-- Allentix Cart Inner End Here -->
<!--==============================================================-->*/







/*==========================================
 <-- allentix Search CSS  Start -->
=========================================*/

.search-popup {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    margin-top: -540px;
    transform: translateY(-100%);
    background-color: #2828283b;
    -webkit-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition: all 1500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    backdrop-filter: blur(5px);
}

.search-popup{
    width: 100%;
}

.search-active .search-popup{
    transform: translateY(0%);
    margin-top: 0;
}

.search-popup .close-search {
    position: absolute;
    left: 0;
    right: 0;
    top: 75%;
    margin: 0 auto;
    margin-top: -200px;
    border-radius: 50%;
    text-align: center;
    background: linear-gradient(to right, #cf1547 6%, #e9e9e9 96%);
    width: 70px;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    border-bottom: 3px solid #ffffff;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    opacity: 0;
    visibility: hidden;
    height: 70px;
    line-height: 70px;
    text-align: center;
    border-top-color: #fff;
}

.search-popup .close-search i{
    position: relative;
    font-size: 30px;
    color: #ffffff;
}

.search-active .search-popup .close-search{
    visibility: visible;
    opacity: 1;
    top: 50%;
    -webkit-transition-delay: 1500ms;
    -moz-transition-delay: 1500ms;
    -ms-transition-delay: 1500ms;
    -o-transition-delay: 1500ms;
    transition-delay: 1500ms;
}

.search-popup form{
    position: absolute;
    max-width: 700px;
    top: 50%;
    left: 15px;
    right: 15px;
    margin:-35px auto 0;
    transform: scaleX(0);
    transform-origin: center;
    background-color: #111111;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.search-active .search-popup form{
    transform: scaleX(1);
    -webkit-transition-delay: 1200ms;
    -moz-transition-delay: 1200ms;
    -ms-transition-delay: 1200ms;
    -o-transition-delay: 1200ms;
    transition-delay: 1200ms;
}

.search-popup .form-group{
    position:relative;
    margin:0px; 
    overflow: hidden;
}

.search-popup .form-group input[type="text"], .search-popup .form-group input[type="search"] {
    position: relative;
    display: block;
    font-size: 18px;
    line-height: 50px;
    color: #000000;
    height: 70px;
    width: 100%;
    padding: 10px 30px;
    background-color: #ffffff;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    font-weight: 500;
    text-transform: capitalize;
    border: 2px solid #cf1547;
    border-radius: 5px;
}

.search-popup .form-group input[type="submit"], .search-popup .form-group button {
    position: absolute;
    right: 30px;
    top: 0px;
    height: 70px;
    line-height: 70px;
    background: transparent;
    text-align: center;
    font-size: 24px;
    color: #cf1547;
    padding: 0;
    cursor: pointer;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    border: none;
}

.search-popup .form-group input[type="submit"]:hover,
.search-popup .form-group button:hover{
    color: #000000;
}

.search-popup input::placeholder,
.search-popup textarea::placeholder{
    color:#000000;
}

.search-popup .close-search.style-two{
    position: absolute;
    right: 25px;
    left: auto;
    color:#ffffff;
    width:auto;
    height:auto;
    top:25px;
    margin:0px;
    border:none;
    background:none !important;
    box-shadow:none !important;
    -webkit-transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
    transition:all 500ms ease;
}

.search-popup .close-search.style-two i{
    font-size:20px;
    color:#f00;
}

.search-box-btn.search-box-outer i {
    font-size: 20px;
    display: inline-block;
    color: #fff;
    cursor: pointer;
    transition: .5s;
}

.search-box-btn.search-box-outer i:hover {
    color: #cf1547;
    filter: hue-rotate(360deg);
}


/*==========================================
 <-- allentix Search CSS  End -->
=========================================*/



/*===========================
<-- allentix Loader Css -->
=============================*/

.loader_bg {
    position: fixed;
    z-index: 9999;
    background: linear-gradient( #070f23 6%, #071025 96%);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    text-align: center;
    flex-direction: column;
    justify-content: center;
}

.loader_bg h3 {
    color: #00abe3;
    position: absolute;
    bottom: 3rem;
}



/*
<!-- ============================================================== -->
<!--Scrollup Button Section -->
<!-- ============================================================== -->*/



/*------back-to-top------------*/

.prgoress_indicator {
    position: fixed;
    right: 50px;
    bottom: 20px;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    border-radius: 50px;
    box-shadow: inset 0 0 0 2px rgba(24, 24, 24, 0.2);
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px) !important;
    transition: all 200ms linear !important;
}

.prgoress_indicator.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) !important;
  background: #fff;
}

.prgoress_indicator::after {
    position: absolute;
    content: "\f106";
    font-family: "Font Awesome 5 Free";
    text-align: center;
    line-height: 46px;
    font-size: 18px;
    color: #cd1345;
    left: 0;
    top: 0;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    font-weight: 900;
    z-index: 1;
    transition: all 200ms linear !important;
}

.prgoress_indicator::before {
  position: absolute;
  content: "\f106";
  font-family: "Font Awesome 5 Free";
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  font-weight: 900;
  opacity: 0;
  -webkit-background-clip: text;
    background-clip: text;
  -webkit-text-fill-color: transparent;
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  z-index: 2;
  transition: all 200ms linear !important;
}

.prgoress_indicator:hover ::after {
  color: #2871ff;
}

.prgoress_indicator:hover ::before {
  opacity: 1;
}

.prgoress_indicator svg path {
  fill: none;
}

.prgoress_indicator svg.progress-circle path {
    stroke: #cd1345;
    stroke-width: 4;
    box-sizing: border-box;
    transition: all 200ms linear !important;
}



/* curser Animation */

.curser {
    position: fixed;
    top: 0;
    left: 0;
    width: 30px;
    height: 30px;
    border: 2px dotted #cf1547;
    border-radius: 50%;
    mix-blend-mode: difference;
    pointer-events: none;
    transform: translate(-50%, -50%);
    z-index: 999;
    transition: .20s;
}

.curser2 {
    position: fixed;
    top: 0;
    left: 0;
    width: 24px;
    height: 24px;
    background:  #cf1547;
    border-radius: 50%;
    mix-blend-mode: difference;
    pointer-events: none;
    transform: translate(-50%, -50%);
    z-index: 9999;
    transition: .1s;
}

/* curser Animation */


/*<!-- ============================================================== -->
 <!-- allentix animation start here -->
<!-- ============================================================== -->*/

@keyframes loader{
    0%{
        transform: scale(0);
        opacity: 0;
    }
    50%{
        opacity: 1;
    }
    100%{
        transform: scale(1);
        opacity: 0;
    }
}

@keyframes zoomIn {
    from{
      -webkit-transform: scale(.7) translateY(100px);
      transform: scale(.7) translateY(100px);
      opacity: 0;
    }
    to{
      -webkit-transform: scale(1) translateY(0);
      transform: scale(1) translateY(0);
      opacity: 1;
    }
  }
  
  
@keyframes ZoomIn {
    from{
      -webkit-transform: scale(.6);
      transform: scale(.6);
      opacity: 0;
    }
    to{
      -webkit-transform: scale(1) ;
      transform: scale(1);
      opacity: 1;
    }
  }
  
@keyframes FadeInUp {
    from{
      -webkit-transform: translateY(10%);
      transform:  translateY(10%);
      opacity: 0;
    }
    to{
      -webkit-transform:  translateY(0%) ;
      transform:  translateY(0%);
      opacity: 1;
    }
  }

  @keyframes rotate {
    0% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
        -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }
    100% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
        -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@keyframes rotate2 {
    0% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
        -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }
    100% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
        -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@keyframes rotate3 {
    0% {
        transform: rotateX(-150deg) rotateY(-235deg) rotateZ(0deg);
        -webkit-transform: rotateX(-150deg) rotateY(-235deg) rotateZ(0deg);
    }
    
    100% {
        transform: rotateX(-150deg) rotateY(-235deg) rotateZ(360deg);
        -webkit-transform: rotateX(-150deg) rotateY(-235deg) rotateZ(360deg);
    }
}

@keyframes rotate4 {
    0% {
        transform: rotateX(220deg) rotateY(20deg) rotateZ(0deg);
        -webkit-transform: rotateX(220deg) rotateY(20deg) rotateZ(0deg);
    }
    
    100% {
        transform: rotateX(220deg) rotateY(20deg) rotateZ(360deg);
        -webkit-transform: rotateX(220deg) rotateY(20deg) rotateZ(360deg);
    }
}  


@keyframes ripple {

    0%,
    35% {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0.8;
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(2);
        -moz-transform: scale(2);
        -ms-transform: scale(2);
        -o-transform: scale(2);
        transform: scale(2);
    }
}


@keyframes movebounce {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }

    50% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}


@keyframes moveleftbounce {
    0% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }

    50% {
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }
}




@-webkit-keyframes play-btn {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(206, 20, 70, 0.3), 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3);
        box-shadow: 0 0 0 0 rgba(206, 20, 70, 0.3), 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3)
    }
    100% {
        -webkit-box-shadow: 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3), 0 0 0 30px rgba(206, 20, 70, 0);
        box-shadow: 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3), 0 0 0 30px rgba(206, 20, 70, 0)
    }
}

@keyframes play-btn {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(206, 20, 70, 0.3), 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3);
        box-shadow: 0 0 0 0 rgba(206, 20, 70, 0.3), 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3)
    }
    100% {
        -webkit-box-shadow: 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3), 0 0 0 30px rgba(206, 20, 70, 0);
        box-shadow: 0 0 0 10px rgba(206, 20, 70, 0.3), 0 0 0 20px rgba(206, 20, 70, 0.3), 0 0 0 30px rgba(206, 20, 70, 0)
    }
}





.dance {
    -webkit-animation: dance 2s alternate infinite;
    animation: dance 2s alternate infinite;
}

@keyframes dance {
    0% {
        -webkit-transform: scale(0.5);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

@keyframes Dance {
    0% {
        -webkit-transform: translateY(0px);
    }

    50% {
        -webkit-transform: translateY(25px);
    }

    100% {
        -webkit-transform: translateX(0px);
    }
}

.dance2 {
    -webkit-animation: dance2 4s alternate infinite;
    animation: dance2 4s alternate infinite;
}

@keyframes dance2 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
    }

    50% {
        -webkit-transform: translate3d(25px, -25px, 0);
    }

    100% {
        -webkit-transform: translate3d(0, -25px, 25px);
    }
}


@keyframes Rotateme {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes rotateme {
    from {
        -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
      }
      to {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
      }
}

@keyframes Ripple {
    0% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }
    50% {
        transform: scale(3);
        -webkit-transform: scale(3 );
    }    
    100% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}