@import url('../fonts/stylesheet.css');
:root {
--neon-green: #A1EA43;
--primary-green: #A1EA43;
--dark-bg: #0a1e1e;
--light-bg: #f8f9fa;
--themecolor1: #E51635;
--themecolor2: #0E1116;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-size: 1;
}
body {
color: #000;
overflow-x: hidden;
font-family: 'Lufga';
font-style: normal;
position: relative;
background: #FFFCFA;
}

.color-1{color: #000;}
.color-2{color: #6A727D;}

h1{font-size: 44px;}
h2{font-size: 42px;}
.fs-24{font-size: 24px;}
.fs-20{font-size: 20px;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-family: 'Sulphur Point';
font-weight: bold;
}

.top-header {
background: #fff;
padding: 15px 0px;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
position: sticky;
top: 0;  transition: all 0.3s;
z-index: 1000;
}

.container {
max-width: 1366px;
margin: 0 auto;
/*! padding: 0 20px; */
}

.header-content {
display: flex;
justify-content: space-between;
align-items: center;
padding: 16px 42px 0;
transition: all 0.3s;
}

.logo {
font-size: 28px;
font-weight: bold;
color: #e74c3c;
font-style: italic;
text-decoration: none;
}

.top-header.fixed  {padding: 9px 0 12px;}
.top-header.fixed  .header-content { padding: 16px 42px 0;}
.fixed .search-input {/*! height: 26px; */}
.fixed .btn-outline-login, .fixed .btn-signup {/*! padding: 5px 26px; */}
.logo img {
transition: all 0.5s;
}
.fixed .logo img {
width:  100px;
}
/* Search Box */
.search-box {
display: flex;
align-items: center;
gap: 8px;
border: 1px solid #E6F0FF;
border-radius: 80px;
padding: 0px 15px;
background: #fff;
}

.search-box input {
border: none;
background: transparent !important;
outline: none;transition: all 0.3s;
/*! width: 200px; */
}

.search-icon {
color: #666;
}

/* Navigation */

 ul.nav-menu li {
	list-style-type: none;
	display: flex;
}
 ul.nav-menu {padding: 0;}
 ul.nav-menu li a {
	 text-decoration: none;
	 transition: color 0.3s ease;
	 position: relative;
}
  ul.nav-menu li a::after {
	 content: "";
	 width: 0%;
	 background-color: var(--themecolor1);
	 opacity: 1;
	 position: absolute;
	 height: 3px;
	 bottom: -15px;
	 right: 0;
	 left: 0;
	 transition: all .5s;
	 margin: auto;
}
  ul.nav-menu li a:hover::after {
	 width: 100%;
}


.nav-menu {
list-style: none;
display: flex;
gap: 30px;
align-items: center;
padding: 0;
justify-content: space-between;
margin: 0;
}

.nav-menu li a {
text-decoration: none;
color: #000;
font-weight: 400;
font-size: 16px;
text-transform: uppercase;
letter-spacing: 10%;
transition: color 0.3s;
}

.nav-menu li a:hover {
color: #e74c3c;
}

/* Header Buttons */
.header-buttons {
display: flex;
gap: 10px;
}

.header-buttons button {
padding: 8px 20px;
border-radius: 20px;
border: none;
cursor: pointer;
font-weight: 500;
transition: transform 0.3s;
font-size: 14px;
}

.btn-login {
background: #fff;
color: #e74c3c;
border: 1px solid #e74c3c;transition: all 0.3s;
}

.btn-signup {
background: #e74c3c;transition: all 0.3s;
color: white;
}

.btn-signup:hover, .btn-login:hover {
/*! transform: scale(1.05); */
}

/* Mobile Menu Toggle */
.mobile-menu-toggle {
display: none;
background: none;
border: none;
font-size: 24px;
cursor: pointer;
color: #333;
}
 /* Submenu Styles */
        .submenu {
            position: absolute;
            top: 100%;
            left: 0;
            background: white;
            /*! box-shadow: 0 5px 20px rgba(0,0,0,0.15); */
            border-radius: 0;
            max-width: 1366px;
            padding: 15px 0;
            opacity: 0;
            visibility: hidden;
            transform: translateY(10px);
            transition: all 0.3s ease;
            z-index: 1000;
            margin-top: 15px;
            right: 0;
            margin: auto;
        }

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

        .submenu-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 10px;
            padding: 0 20px;
        }

        .submenu-column h4 {
            font-size: 20px;
            color: #e51635;
            text-transform: uppercase;
            margin-bottom: 10px;
            /*! font-weight: 600; */
            letter-spacing: 0.05em;
        }

        .submenu-column ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .submenu-column ul li {
            display: block;
            width: 100%;
            margin-bottom: 5px;
        }

        .submenu-column ul li a {
            display: block;
            padding: 8px 10px;
            color: #333;
            /*! font-size: 14px; */
            text-transform: none;
            letter-spacing: normal;
            border-radius: 5px;
            transition: all 0.3s;
        }

        .submenu-column ul li a::after {
            display: none;
        }

        .submenu-column ul li a:hover {
            background: #f8f9fa;
            color: var(--themecolor1);
            padding-left: 15px;
        }

        /* Mobile Menu Toggle */
        .mobile-menu-toggle {
            display: none;
            background: none;
            border: none;
            font-size: 24px;
            cursor: pointer;
            color: #333;
        }

        .mobile-close {
            display: none;
        }

        .menu-overlay {
            display: none;
        }
/* Mobile Styles */
@media (max-width: 768px) {
.search-box {
display: none;
}

.nav-menu {
position: fixed;
left: -100%;
top: 0;
width: 280px;
height: 100vh;
background: white;
flex-direction: column;
padding: 80px 20px 20px;
box-shadow: 2px 0 10px rgba(0,0,0,0.1);
transition: left 0.3s ease;
gap: 0;justify-content: flex-start;
z-index: 999;
padding-top: 31px !important;
}

.nav-menu.active {
left: 0;
}

.nav-menu li {
	width: 100%;
	margin-bottom: 5px;
	flex-wrap: wrap;
}

.nav-menu li a {
display: block;
padding: 10px 13px;
border-radius: 5px;
text-transform: none;
width: 100%;
}

.nav-menu li a:hover {
background: #f8f9fa;
}

.header-buttons {
display: none;
}

.mobile-menu-toggle {
display: block;
}

.menu-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(0,0,0,0.5);
z-index: 998;
display: none;
}

.menu-overlay.active {
display: block;
}

.mobile-close {
position: absolute;
top: 20px;
right: 20px;
font-size: 30px;
background: none;
border: none;
cursor: pointer;
color: #333;
display: none;
}

.nav-menu.active ~ .mobile-close {
display: block;
}

 /* Mobile Submenu */
            .submenu {
                position: static;
                opacity: 1;
                visibility: visible;
                transform: none;
                box-shadow: none;
                border-radius: 0;
                margin-top: 0;
                padding: 0;
                max-height: 0;
                overflow: hidden;
                transition: max-height 0.3s ease;
                background: #f8f9fa;
            }

            .nav-menu li.submenu-open .submenu {
                max-height: 600px;
            }

            .submenu-grid {
                grid-template-columns: 1fr;
                padding: 10px 0;
            }

            .submenu-column {
                padding: 0;
            }

            .submenu-column h4 {
                padding: 10px 20px;
                margin-bottom: 5px;
            }

            .submenu-column ul li a {
                padding: 10px 20px 10px 40px;
                background: transparent;
            }

            .submenu-column ul li a:hover {
                background: #fff;
                padding-left: 45px;
            }

            .mobile-menu-toggle {
                display: block;
            }

            .menu-overlay {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100vh;
                background: rgba(0,0,0,0.5);
                z-index: 998;
                display: none;
            }

            .menu-overlay.active {
                display: block;
            }

            .mobile-close {
                position: absolute;
                top: 3px;
                right: 14px;
                font-size: 22px;
                background: none;
                border: none;
                cursor: pointer;
                color: #333;
                display: block;
                z-index: 1000;
            }

            .nav-menu.active .mobile-close {
                display: block;
            }

            /* Arrow indicator for mobile submenu */
            .has-submenu > a::before {
                content: "›";
                float: right;
                font-size: 20px;display: none !important;
                transition: transform 0.3s;
            }

            .has-submenu.submenu-open > a::before {
                transform: rotate(90deg);display: none !important;
            }
            ul.nav-menu li a::after {
	bottom: 0;

}

}


.header-actions {
gap: 16px;
max-width: 1366px;
margin: auto;
padding: 0 15px;
}
/* Search box */
.search-box {
width: 320px;
}

.search-input {
padding-left: 35px;
height: 37px;
border-radius: 81px;
border: 1.5px solid #dbe6ff;
font-size: 16px;
}

.search-input:focus {
box-shadow: none;
border-color: #dbe6ff;
}

.search-icon {
position: absolute;
top: 48%;
left: 15px;
transform: translateY(-50%);
font-size: 18px;
color: #CF3104;
width: 21px;
height: 21px;
line-height: 1;
text-align: center;
}

/* Login button */
.btn-outline-login {
border-radius: 83px;
padding: 6px 26px;
border: 1px solid #CF3104;
color: #CF3104;
font-weight: 500;
}

.btn-outline-login:hover {
background: #CF3104;
color: #fff;
}

/* Sign Up button */
.btn-signup {
border-radius: 50px;
padding: 6px 26px;
background: #CF3104;
color: #fff;
font-weight: 500;
}

.btn-signup:hover {
background: #b83200;
color: #fff;
}

.btn.btn-white {
background: #fff;
padding: 13px 31px;
text-transform: uppercase;
border-radius: 0;
font-size: 16px;
font-weight: 400; 
}

.btn.btn-white:hover {
background: #CF3104;
color: #fff;
}

/* Hero Banner */
.hero-banner {

text-align: center;
position: relative;
overflow: hidden;
}

.hero-banner::before {
content: '★';
position: absolute;
font-size: 100px;
color: rgba(255,255,255,0.1);
animation: rotate 20s linear infinite;
}

.hero-content {
position: absolute;
bottom: 70px;
left: 0;
right: 0;
}


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

.hero-content h1 {
color: white;
font-size: 48px;
font-weight: bold;
margin-bottom: 10px;
font-style: italic;
}

.hero-content p {
color: rgba(255,255,255,0.9);
font-size: 18px;
}

/* Category Section */
.category-section {
padding: 80px 20px;
text-align: center;
}

.category-section h2 {
margin-bottom: 15px;
}

.category-section p {
margin-bottom: 40px;
}

p {
color: #6A727D;
font-size: 18px;
}


.category-card {
text-align: center;
margin-bottom: 30px;
cursor: pointer;
transition: transform 0.3s;
}

.category-card:hover {
transform: translateY(-10px);
}

.category-icon {
width: 120px;
height: 120px;
border-radius: 50%;
margin: 0 auto 15px;
display: flex;
align-items: center;
justify-content: center;
font-size: 48px;
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.category-card h5 {
font-size: 16px;
color: #333;
font-weight: 600;
}

/* Trending Section */
.trending-section {
background: #DDD9B3;
padding: 42px 40px;
border-radius: 24px;
margin: 0px auto;
}

.trending-section h3 {
font-size: 28px;
margin-bottom: 10px;
}

/* Wedding Invitation Section */
.invitation-section {
background: #F4C2C2;
padding: 60px 25px;
border-radius: 24px;
margin: 80px auto;
}

.kidsbirthday{
background: #F5F5F7;
padding: 60px 25px;
border-radius: 24px;
margin: 0px auto;
}
.kidsbirthday .category-card, .cardcategories .category-card {border: 0px solid #E6F0FF;}
.fw-200{font-weight: 200;}
.cardcategories{
padding: 60px 25px;
border-radius: 24px;

}


.kidsbirthday .swiper-scrollbar {background: #fff;}
.kidsbirthday .swiper-scrollbar-drag {background: #E1E3E5;}

.cardcategories .swiper-scrollbar {background: rgba(255,204,0,0.1);}
.cardcategories .swiper-scrollbar-drag {background: #FFCC00;}

.invitation-section h3 {
text-align: center;
font-size: 28px;
margin-bottom: 40px;
}

.invitation-card {
background: white;
border-radius: 15px;
padding: 15px;
margin-bottom: 30px;
/*! box-shadow: 0 5px 15px rgba(0,0,0,0.1); */
transition: transform 0.3s;
border: 1px solid #E6F0FF;
}

.invitation-card:hover {
transform: scale(1.05);
}

.invitation-card img {
width: 100%;
border-radius: 10px;
margin-bottom: 15px;
}



.invitation-card p {
font-size: 14px;
font-weight: 500;
color: #6A727D;
}

/* Kids Birthday Section */
.kids-section {
padding: 80px 20px;
text-align: center;
}



/* Responsive */
@media (max-width: 768px) {
.desktop-menu {
display: none;
}

.mobile-menu-toggle {
display: block;
}

.hero-content h1 {
font-size: 32px;
}

.ipad-p{padding-top: 0px;}
}

/* Animation Classes */
.fade-in-up {
animation: fadeInUp 0.8s ease-out;
}

@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}



.browse-btn {
display: inline-block;
padding: 14px 31px;
background-color: #f5c400;   /* yellow */
color: #000;
/*! font-weight: 600; */
letter-spacing: 10%;
text-transform: uppercase;
text-decoration: none;
transition: all 0.3s ease;
border-radius: 0;
}

.browse-btn:hover {
background-color: #b10f2e;
color: #fff;
}

.category-card {
outline: none;
padding: 40px 20px;
background: #FFF;
border: 1px solid #E6F0FF;
border-radius: 16px;
}

.card-content {
text-align: center;
cursor: pointer;
transition: transform 0.3s ease;
}

.card-content:hover {
transform: translateY(-5px);
}

.card-circle {
width: 220px;
height: 220px;
border-radius: 50%;
margin: 0 auto 20px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
box-shadow: 0 4px 15px rgba(0,0,0,0);
}

.card-circle img {
width: 175px;
height: 225px;
object-fit: cover;
border-radius: 10px;
padding: 22px;
margin-bottom: -70px;
}

.holiday-party { background: #B6D1A2; }
.kid-birthday { background: #D5EFEC; }
.adult-birthday { background: #F6E6FF; }
.nre-year { background: #FDB679; }
.teaparty { background: #99CB9A; }
.sports { background: #7DC9E4; }
.videogames { background: #A3A5FF; }
.bg-F4EDE7 { background: #F4EDE7; }
.bg-F9E39D { background: #F9E39D; }
.bg-FFCC00 { background:rgba(255,204,0,0.1); }

.rounded3{ border-radius: 16px; }


.card-title {
font-size: 24px;
/*! font-weight: 500; */
letter-spacing: 10%;
color: #000;
text-transform: uppercase;
margin-bottom: 0;
}

#categories .btn-wrap, .kidsbirthday .btn-wrap, .cardcategories .btn-wrap{display: none;}




.video-thumb {
position: relative;
border-radius: 15px;
overflow: hidden;
cursor: pointer;
}

.video-thumb img {
width: 100%;
border-radius: 15px;
}

.play-btn {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 55px;
height: 55px;
background: #fff;
color: #c94b4b;
font-size: 22px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}

.video-time {
position: absolute;
bottom:33px;
right: 10px;
background: rgba(0,0,0,0.7);
color: #fff;
font-size: 12px;
padding: 3px 11px;
border-radius: 16px;
}

.video-info {
padding: 10px 5px;
}

.video-info h4 {
font-size: 16px;
margin-bottom: 4px;
}

.video-info p {
font-size: 13px;
color: #666;
}

/* Modal Video */
.video-modal video {
width: 100%;
height: auto;
border-radius: 12px;
}

.close-video {
position: absolute;
right: 15px;
top: 15px;
z-index: 10;
}


.btn-close.videoclose {	
background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
margin-left: auto;
}

.blog-card {
background: #fff;
border-radius: 14px;
padding: 18px;
border: 1px solid #E6F0FF;
transition: 0.3s ease;
}

.blog-card:hover {
transform: translateY(-4px);
}

.blog-img img {
width: 100%;
object-fit: cover;
border-radius: 12px;
}

.blog-content {
padding: 15px 5px 5px;
}

.blog-content .meta {
color: #000;
margin-bottom: 8px;
}

.blog-content h3 {
font-size: 24px;
font-weight: 500;
color: #212121;
line-height: 1.4;
cursor: pointer;
margin-top: 11px;
font-family: 'Lufga';
}


.blog-content h3:hover {
color: #CF3104;
text-decoration: underline;

}

.testimonial {width: 100%;}
.testimonial_box-top {background-color: #fff;padding: 40px 35px;position: relative;
/* box-shadow: 5px 5px 20px rgba(229, 229, 229, 0.301); */border-radius: 16px;
border: 1px solid #E6F0FF;
}
.testimonial_box-icon {margin-top: -12px;padding-right: 20px;}
.testimonial_box-text p {color: #000000;}
.testimonial_box-bottom {padding-top: 20px;/*! padding-bottom: 10px; */}
.testimonial_box-text {padding-top: 8px;height: 100%;min-height: 148px;}
.testimonial_box-profile {display: flex;}
.testimonial_box-img {display: flex;justify-content: center;}
.testimonial_box-img img {width: 50px;height: 50px;border-radius: 50px;border: 0px solid #e5e5e5;}
.testimonial_box-info {display: flex;justify-content: center;flex-direction: column;padding-left: 16px;margin-right: auto;}
.testimonial_box-name h4 {font-size: 20px;line-height: 25px;color: var(--themecolor2);margin-bottom: 0;}
.testimonial_box {margin: 0 15px;}
.testimonial_box-job p {color: var(--themecolor2);font-size: 14px;text-transform: uppercase;letter-spacing: 3px;line-height: 20px;
font-weight: 300;margin-bottom: 0;}
.testimonial_box-name p{font-size: 14px;font-weight: 400;}
.slick-dots li button:before {font-size: 15px;color: var(--themecolor2);}
.testimonial_box-inner{padding-top: 31px;}
/* .testimonial  .slick-track {padding-left: 19%;} */
.testimonial .slick-dots li {width: 150px;}
.testimonial .slick-dots li button::before {width: 100%;height: 3px;content: '';background: #EBEFF6;}
.testimonial .slick-dots li.slick-active button::before {opacity: 1;background: var(--themecolor1);}
.testimonial .slick-dots {bottom: -70px;text-align: left; display: none !important;}
.py-80{padding-top: 80px !important; padding-bottom: 80px !important;}
.testimonial{position: relative;}
.testimonial::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 265px;
height: 100%;
background: url(../images/leftsad.png) top -150px center;
pointer-events: none; 	z-index: 99;
bottom: 0;
}

.testimonial::before {
content: '';
position: absolute;
top: 0;
right: 0;
width: 265px;
height: 100%;
background: url(../images/rightsad.png) top -150px center;
pointer-events: none;
z-index: 99;
bottom: 0;
}

/* Footer */
.footer {
background: #F2F2F2;
color: #212121;
padding: 60px 0 4px; position: relative;
}
.footer-border{position: absolute;
top: 0;
left: 0;
right: 0;}
.footer h5 {
color: var(--themecolor2); 
margin-bottom: 1.5rem;
font-weight: 500;
font-family: 'Lufga';
text-transform: uppercase;
font-size: 18px;
}

.color898989{color: #898989;}
.navbar-toggler {

color: #fff;
background-color: #464d3e;

} 



.footer a {
color: #6A727D;
text-decoration: none;
display: block;
margin-bottom: 15px;
transition: color 0.3s;
font-size: 18px;
}

.footer a:hover, .footer a.active {
color: var(--themecolor1);
}
.footer-social {
display: flex;
gap: 1rem;
margin-top: 2rem;
}
.footer-social a {
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #ECECED;
display: flex;
align-items: center;
justify-content: center;
color: #000;
text-decoration: none;
transition: all 0.3s ease;
}
.footer-social a:hover {
	background-color: var(--themecolor1);
}
.footer-social a:hover img{
	filter: brightness(255);
}

.footer-bottom {
border-top: 1px solid #D8D9D9;
padding-top: 2rem;
display: flex;
justify-content: space-between;
align-items: center;
}
.copyright {
border-top: 1px solid #D8D9D9;
padding: 1rem 0;
margin-top: 3rem;
text-align: center;
color: #fff;
background: #9E2822;
}

.copyright p{margin-bottom: 0px;color: #fff;}

@media (max-width: 768px) {
.hero-content h1 {
font-size: 2rem;
}

.hero-section {
min-height: auto;
padding: 60px 0;
}

.section-title h2 {
font-size: 1.8rem;
}
}
/**cookies banner **/
.cookies-statement {
text-align: left;
padding: 12px 50px;
position: fixed;
bottom: 0;
background: #0d0d0d;
z-index: 9999;
box-shadow: 0 5px 13px #0d0d0d;
width: 100%;
}
.cookies-statement .cookies-btn ul li {
display: inline-block;
padding: 0 5px;
}
.Cookiesclose .icon {
width: 25px;
height: 25px;
position: absolute;
right: 10px;
top: 10px;
background: #BA9C5C;
padding: 5px;
border-radius: 50%;
cursor: pointer;
fill: #062360;
}
.Cookiesclose .icon {
cursor: pointer;
fill: #fff;
}
.cookies-statement .cookies-btn ul li a {
width: 135px;
padding: 13px 30px;
font-size: 14px;
line-height: 1;
}
.cookies-statement .cookies-btn ul li a:hover {
background: var(--neon-green);
}
.cookies-statement h3{
font-size:26px;
line-height: 30px;
}
.Cookies a:hover{
color:#fff;
}
.Cookies p {
margin-bottom: 0px;
line-height: 22px;
font-size: 16px;
}
/*cookies statement*/
.cookies_container {
width: 100%;
padding: 30px 50px;
position: fixed;
bottom: 0;
left: 0;
background: #fff;
z-index: 9999;
box-shadow: 0 0 26px #ba9c5c;
}
.cookies_container h2 {
font-size: 26px;
line-height: 26px;
font-weight: bold;
}
.cookies_container p {
font-size: 16px;
line-height: 22px;
}

.accordion-body {
font-size: 18px;
color: #000;
}
.testimonial-header h2 {
font-size: 42px;
}
.fs-18{font-size: 18px;}
.fs-24{font-size: 20px;}
.privacy a{color: #000; text-decoration: none; font-weight: 600;}
.privacy a:hover{color: var(--primary-green); }

.headerbg {
background: linear-gradient(135deg, #030301 0%, #527721 100%);

}
.Oops{font-size: 44px; font-weight: 600;}
.hero-image{

object-fit: cover;
}


/* Custom Arrow Styling */
.custom-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 10;
cursor: pointer;
}

.custom-arrow.next-arrow {
right: 4rem;
}

.custom-arrow.prev-arrow {
left: 4rem;
}

.arrow-wrapper {
position: relative;
width: 56px;
height: 56px;
}

/* Circle Progress */
.progress-circle {
position: absolute;
top: 0;
left: 0;
width: 56px;
height: 56px;
transform: rotate(-90deg);
}

.progress-bg {
fill: none;
stroke: rgba(255, 255, 255, 0.15);
stroke-width: 2;
}

.progress-bar {
fill: none;
stroke: rgba(255, 255, 255, 0.4);
stroke-width: 2;
stroke-linecap: round;
stroke-dasharray: 163.36;
stroke-dashoffset: 163.36;
}

.progress-bar.animating {
animation: progressAnimation 5s linear forwards;
}

@keyframes progressAnimation {
from {
stroke-dashoffset: 163.36;
}
to {
stroke-dashoffset: 0;
}
}

/* Arrow Button */
.arrow-button {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 48px;
height: 48px;
background: white;
border: none;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
transition: background 0.3s;
z-index: 2;
}

.arrow-button:hover {
background: #f0f0f0;
}

.arrow-button svg {
width: 16px;
height: 16px;
}

.prev-arrow .arrow-button svg {
transform: rotate(180deg);
}

/* Hide on mobile */
@media (max-width: 1024px) {
.custom-arrow.next-arrow {
	right: 1rem;
	top: 65px;
}
}

/* Slick dots customization */
.slick-dots {
bottom: 30px;
}

.slick-dots li button:before {
font-size: 12px;
color: white;
opacity: 0.5;
}

.slick-dots li.slick-active button:before {
opacity: 1;
color: white;
}

.footer-column ul li {
	list-style-type: none;
	display: flex;
}
.footer-column ul {padding: 0;}
.footer-column ul li a {
	 text-decoration: none;
	 transition: color 0.3s ease;
	 position: relative;
}
 .footer-column ul li a::after {
	 content: "";
	 width: 0%;
	 background-color: var(--themecolor1);
	 opacity: 1;
	 position: absolute;
	 height: 1px;
	 bottom: -1px;
	 right: 0;
	 left: 0;
	 transition: all .5s;
	 margin: auto;
}
 .footer-column li a:hover::after {
	 width: 100%;
}

@media (max-width: 1290px) {
.nav-menu li a {
font-size: 15px;
letter-spacing: 6%;
}
}


@media (max-width: 767px) {
.ipad-w{width: 100%;}
.navbar-nav.ms-auto.align-items-center {
background: #030400;
padding: 22px;
}
h1 {
font-size: 35px;
}
.nav-tabs {
gap: 14px;
flex-wrap: nowrap;
}
.nav-tabs .nav-link {
font-size: 15px;
white-space: nowrap;
}
.cookies-statement {
padding: 12px 16px;
}
.cookies-btn.text-center {
margin-top: 8px;
}
.cookies-statement .cookies-btn ul li a {
width: 115px;
padding: 9px 23px;
}

.pricing-section, .faq-section, .contact-section {
padding: 50px 20px;
}

.feature-illustration img{width: 100%;}
.accordion-button {
padding: 1rem;
font-size: 18px;
}

.testimonial-card {
padding: 1rem;
}
.faq-section {
margin: 63px 0px;
}
.hero-content {
padding-top: 55px;
}
.accordion-body {
font-size: 16px;
}
.testimonial-header h2 {
font-size: 29px;
}
.fs-24 {
font-size: 17px;
}
.fs-18 {
font-size: 16px;
}
.testimonial-section{ padding-top: 0px;}

.contact-icon {
width: 36px;
}

.contact-icon img{
width: 100%;
}
.trending-section {
padding: 28px 22px;
}
h2 {
font-size: 28px;
}
.invitation-section, .kidsbirthday, .cardcategories, .kids-section {
padding: 33px 15px;
border-radius: 16px;
}
.invitation-section {
margin: 50px auto;
}

.blog-content h3 {
font-size: 20px;
margin-top: 11px;
}
.py-80 {
padding-top: 40px !important;
padding-bottom: 40px !important;
}

.logo img {
width: 87px;
}
.fixed .logo img {
width: 87px;
}
.header-content {
padding: 0px 0px 0;
}
.top-header {
padding: 7px 0px;
}


.hero-content {
bottom: 40px;
position: inherit;
}
.browse-btn {
padding: 7px 27px;
letter-spacing: 0px;

}
.mobile-menu-toggle {
position: absolute;
right: 15px;
top: 24%;
}
.copyright {
margin-top: 1rem;
}
.testimonial_box-top {
padding: 15px;

}
.testimonial::before, .testimonial::after {
width: 135px;

}

}