@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    font-family: var(--f1);
}

a {
    text-decoration: none !important;
    display: inline-block !important;
}

img {
    width: 100%;
    display: block;
}
section.articles {
    margin-bottom: 130px;
}
ul {
    padding: 0;
    margin: 0;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    padding: 0;
    margin: 0;
}

.spacing {
    padding: 100px 0;
}

.News-letter-email .email input.form-control:focus {
    box-shadow: none;
}
.header-logo a {
    width: 100%;
    display: block !important;
}

.header-logo a img {
    width: 50%;
    margin: 0 auto;
}
:root {
    --c1: #000;
    /* Black */
    --c2: #fff;
    /* White */
    --c3: #FFBC99;
    /* Red */
    --c4: #358243;
    /* Background Color */
    --c5: #7D8E95;
    /* Background Color */
    --c6: #8e8e8e;
    --c7: #7D8E95;
    --f1: 'Plus Jakarta Sans';
    --f2: 'Playfair Display';
    --c10: #FFECD9;
    --c11: #272727;
}

::selection {
    background: var(--c5);
}

.address-history {
    line-height: 1.8;
}

.address-history .note {
    margin-top: 10px;
    font-style: italic;
    opacity: 0.8;
}

/* inner-wrapper */

.inner-header {
    height: 500px;
    background-position: center !important;
    background-attachment: fixed !important;
    position: relative;
    display: flex;
    align-items: center;
    padding-top: 120px;
    text-align: center;
    background-size: cover !important;
    transform: scaleX(-1);
}
.page-id-52 section.inner-header {
    transform: scaleX(1);
}

.page-id-52 .inner-header .inner-header-title h2 {
    transform: scaleX(1);
}
.page-id-54 section.inner-header {
    transform: scaleX(1) !important;
}
.page-id-57 section.inner-header {
    transform: scaleX(1);
}

.page-id-57 .inner-header .inner-header-title h2 {transform: scale(1);}
.page-id-54 .inner-header .inner-header-title h2 {
    transform: scaleX(1) !important;
}
.inner-header:before {
    width: 100%;
    height: 100%;
    content: "";
    background: rgb(0 0 0 / 60%);
    position: absolute;
    left: 0;
    top: 0;
}

.inner-header .container {
    position: relative;
}

.inner-header .inner-header-title h2 {
    color: #fff;
    font-size: 80px;
    text-transform: uppercase;
    font-weight: 900;
    transform: scaleX(-1);
}

/* end inner-wrapper */
/* Header-Start */
header.header {
    position: absolute;
    width: 100%;
    z-index: 9999;
}

.header-socials {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.phone a:hover {
    transform: translateY(-10px);
}

.phone span i:hover {
    color: var(--c2);
}

.phone span i {
    font-size: 20px;
    transform: rotate(-42deg);
    color: var(--c3);
    transition: .5s;
    cursor: pointer;
}
header.header .top-header .header-socials {
    gap: 40px;
}
section.eating.spacing .restaurant-content {
    width: 100%;
}.client-con a img {
    height: 150px;
}
.client-con a img {
    height: 150px;
}
section.eating .restaurant-content p {
    border: 0;
    padding-bottom: 0;
}

.phone a {
    font-size: 14px;
    color: var(--c2);
    transition: .5s;
}

.phone.email span i {
    transform: perspective(10px);
}

.socials-icon {
    display: flex;
    gap: 10px;
    justify-content: end;
}

.insta {
    width: 30px;
    height: 30px;
    border: 1px solid var(--c2);
    align-items: center;
    display: flex;
    justify-content: center;
    border-radius: 66%;
    transition: .5s;
    cursor: pointer;
}

.insta i {
    font-size: 14px;
    transition: .5s;
}

.header-nav-bar nav ul {
    display: flex;
    gap: 70px;
    justify-content: end;
}

.insta a {
    color: var(--c2);
}

.header-nav-bar nav ul li a {
    color: var(--c2);
    position: relative;
    transition: .5s;
    font-size: 16px;
}

.header-bottom {
    padding-top: 40px;
}

.top-header {
    border-bottom: 1px solid #ffffff42;
    padding: 20px 0;
    margin-bottom: 10px;
}

.header-btn a, .header-btn button {
    background: var(--c4);
    padding: 15px 26px;
    border-radius: 50px;
    color: var(--c2);
    font-size: 16px;
    position: relative;
    transition: transform 0.6s ease-in-out, box-shadow 0.3s ease-in-out, color 0.3s ease-in-out;
    overflow: hidden;
    z-index: 1;
    border: 0;
}

.web-title h2 {
    font-size: 48px;
    font-weight: 500;
    color: var(--c1);
    line-height: 1;
    font-family: var(--f2);
}

.img-1 {
    overflow: hidden;
    border-radius: 25px;
    cursor: pointer;
}

.service-con:hover {
    backdrop-filter: blur(9px);
}

.History-img:hover img {
    transform: scale(1.1);
}

.service-btn a:hover i {
    transform: rotate(-35deg);
}

.service-btn a:hover {
    color: var(--c3);
}

.service-btn a:hover i {
    transform: rotate(-35deg);
}

.service-btn a:hover {
    color: var(--c3);
}

.History-img {
    overflow: hidden;
    border-radius: 25px;
}

.img-2 {
    border-radius: 25px;
    overflow: hidden;
}

.img-2:hover img {
    transform: scale(1.1);
}

.img-2 img {
    transition: .5s;
    cursor: pointer;
}

.img-1:hover img {
    transform: scale(1.1);
}

.insta:hover a i {
    color: var(--c1);
}

.insta:hover {
    background: var(--c2);
}

.web-title h2 span {
    font-family: var(--f1);
    color: var(--c4);
}

.header-btn {
    text-align: end;
}

/* Banner-Start */

section.main-home {
    position: relative;
    z-index: -0;
}

.banner:before {
    position: absolute;
    content: '';
    background-blend-mode: overlay;
    background-color: #000000a8;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.video-main {
    position: relative;
    display: flex;
    justify-content: center;
}

.video-icon {
    position: absolute;
    top: 30px;
    left: 20px;
}

@keyframes animate-pulse {
    0% {
        box-shadow:
            0 0 0 0 #fff,
            0 0 0 0 rgba(53, 130, 67, 0.4);
    }

    40% {
        box-shadow:
            0 0 0 40px rgba(53, 130, 67, 0),
            0 0 0 0 rgba(53, 130, 67, 0.4);
    }

    80% {
        box-shadow:
            0 0 0 60px rgba(53, 130, 67, 0),
            0 0 0 30px rgba(53, 130, 67, 0);
    }

    100% {
        box-shadow:
            0 0 0 0 rgba(53, 130, 67, 0),
            0 0 0 30px rgba(53, 130, 67, 0);
    }
}

.video-icon a {
    width: 90px;
    height: 90px;
    z-index: 1;
    overflow: hidden;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--c2);
    font-size: 25px;
    color: var(--c1);
    box-shadow: -1px 4px 24px var(--c1);
    animation: animate-pulse 2.5s ease-out infinite;
    transition: all .5s;
    position: relative;
}


.header-btn.banner-btn {
    text-align: start !important;
    justify-content: center;
}

.video-img img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 150px;
    object-position: top;
    transition: all .5s;
    filter: brightness(0.5);
}



.form-socials .phone span:hover {
    background: var(--c3);
    border-color: var(--c3);
}

.banner-content {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 250px 0px 100px;
}

.top-title span {
    color: var(--c2);
    border: 3px solid var(--c5);
    padding: 10px 25px;
    border-radius: 40px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 40px;
    display: inline-block;
    line-height: 1;
}

.banner-inner-content h1 {
    font-size: 72px;
    color: var(--c2);
    font-family: Playfair Display;
    margin-bottom: 50px;
}

.banner-inner-content p {
    color: var(--c2);
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 20px;
}

.banner-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scaleX(-1);
}

.header-nav-bar.header-inner-nav nav ul {
    justify-content: start;
    gap: 40px;
}

.banner-inner-img span img {
    width: 35px;
    height: 35px;
    object-fit: cover;
    border-radius: 30px;
}

.banner-inner-img {
    display: flex;
}

.banner-inner-img span {
    margin: 0 -3px;
    transition: all .5s;
    display: inline-block;
}

.banner-inner-img p {
    color: var(--c2);
    font-size: 15px;
}

.para {
    padding-left: 40px;
}

.inner-banner-div {
    border-top: 2px solid #5f5f5f;
    padding-top: 30px;
    margin-top: 50px;
}

.banner {
    height: 900px;
    position: relative;
    z-index: 1;
}

.banner-img {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -2;
}

.header-btn.banner-btn a, .banner-btn button {
    padding: 15px 30px;
    width: fit-content !important;
}

/* about-sec */
.img-1 img {
    width: 100%;
    height: 872px;
    object-fit: cover;
    border-radius: 20px;
    transition: .5s;
}

.img-2 {
    width: 423px;
    height: 322px;
    object-fit: cover;
    border-radius: 20px;
    border: 5px solid var(--c2);
    position: absolute;
    bottom: -53px;
    right: -80px;
    transition: .5s;
}

.about-main-img {
    position: relative;
}

.about-content .top-title span {
    color: var(--c7);
    margin-bottom: 20px;
}

.about-content {
    padding: 100px 50px 100px 50px;
}

.about-content h2 {
    font-family: var(--f2);
    font-size: 46px;
    margin-bottom: 20px;
}

.about-content p {
    font-size: 18px;
    line-height: 27px;
    margin-bottom: 35px;
    color: var(--c1) !important;
}


/* section-marquee */

.marquee-slider .marquee {
    overflow: hidden !important;
    position: relative;
    height: 75px;
    overflow: hidden;
    white-space: nowrap;
    display: flex;
    align-items: center;
    padding: 70px;
}

.marquee-slider .marquee--inner {
    display: block;
    width: 200%;
    position: absolute;
    animation: marquee 20s linear infinite;
    display: flex;
}

.marquee-slider .marquee--inner:hover {
    animation-play-state: paused;
}

.marquee-slider .marquee span {
    color: var(--c1);
    font-weight: 1000;
    transition: all 0.7s;
    font-size: 72px;
    text-transform: uppercase;
    word-spacing: 8px;
}

.marquee-slider .slider-right-left {
    transition: all 0.7s;
}

.marquee--inner span div span {
    font-family: var(--fblack);
}

.marquee-slider .slider-right-left:hover .marquee span {
    color: #fff;
}

.marquee-slider .slider-right-left:hover {
    background: #111;
}

.marquee-slider .slider-right-left .marquee--inner {
    animation: marquee-right 5s linear infinite;
}

.marquee-slider .slider-right-left .marquee--inner:hover {
    animation-play-state: paused;
    color: red;
}

.marquee-slider {
    position: relative;
}

.marquee--inner>span div span {
    position: relative;
}

.marquee-slider .slider-right-left:hover .marquee--inner>span div span:after {
    background-color: var(--c3);
}

.marquee-slider .slider-right-left .marquee--inner>span div span:after {
    transition: all 0.7s;
}

.slider-right-left .marquee--inner>span div span:after {
    background-color: #000;
}

.marquee-slider .marquee span {
    margin: 0 35px;
}

@keyframes marquee-right {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

/* Service-sec */
section.Service-Sec {
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    z-index: 999;
}

section.Service-Sec:before {
    position: absolute;
    content: '';
    background-blend-mode: overlay;
    background: #00000085;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: -1;
}

.service-con {
    backdrop-filter: blur(3px);
    background: rgb(255 255 255 / 21%);
    border-radius: 25px;
    color: var(--c2);
    border: 2px solid #ffffff42;
    transition: .5s;
    cursor: pointer;
    padding: 0 50px;
    height: 350px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.service-con h6 {
    font-family: var(--f2);
    font-size: 28px;
    margin-bottom: 20px;
}

.service-con p {
    font-size: 17px;
}

.service-btn a {
    color: var(--c2);
    font-family: var(--f1);
    display: inline-flex !important;
    transition: all .5s;
    align-items: center;
    gap: 5px;
}

.service-btn a i {
    transition: .5s;
    line-height: 1;
}

/* Story-sec */
section.Story-sec.spacing {
    color: var(--c2);
    background-size: cover;
    background-repeat: no-repeat;
}

.story-con h4 {
    font-size: 48px;
    font-family: var(--f2);
    font-weight: 500;
    margin-bottom: 30px;
}

.story-con p {
    font-size: 18px;
    margin-bottom: 30px;
}

.story-btn a {
    background: var(--c2);
    padding: 10px 60px;
    border-radius: 30px;
    color: var(--c1);
}

.about-content.story-con {
    padding: 0 !important;
}

a.buy-anc {
    background: none;
    border: 1px solid #344649;
    color: var(--c1);
}

.header-btn.banner-btn.story-btn-anc {
    display: flex;
    gap: 25px;
}

.about-content.story-con p {
    margin-bottom: 35px;
}

.History-img img {
    box-shadow: 0px 0px 100px #00000026;
    border-radius: 25px;
    transition: .5s;
    cursor: pointer;
}

/* Discover-sec */
section.discover-sec {
    background-image: url(http://localhost/Wrentham/wp-content/uploads/2025/12/discover-img_compressed.webp);
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    z-index: 999;
}

section.discover-sec:before {
    position: absolute;
    content: '';
    background-blend-mode: overlay;
    background-color: #000000b8;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: -2;
}

section.discover-sec.spacing .story-con {
    color: var(--c2);
}

section.discover-sec .story-btn a {
    background: var(--c4);
    color: var(--c2);
    padding: 10px 30px;
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: .5s;
}

/* Gallery-sec */
section.gallery-slider.spacing {
    background: var(--c10);
    position: relative;
}


section.gallery-slider.spacing .swiper-slide {
    margin-right: 8px !important;
    width: 300px !important;
    height: 411px !important;
    padding: 40px 0 !important;
    object-fit: cover;
}

section.gallery-slider.spacing .swiper-slide:nth-child(1) {
    width: 201px !important;
    height: 341px;
}

section.gallery-slider.spacing .swiper-slide:nth-child(2) {
    width: 406px !important;
    height: 341px;
}

section.gallery-slider.spacing .swiper-slide:nth-child(3) {
    width: 406px !important;
    height: 341px;
}

section.gallery-slider.spacing .swiper-slide:nth-child(4) {
    width: 281px !important;
    height: 341px;
}

section.gallery-slider.spacing .swiper-slide:nth-child(5) {
    width: 255px !important;
    height: 341px;
}

section.gallery-slider.spacing .swiper-slide:nth-child(6) {
    width: 246px !important;
    height: 341px;
}

section.gallery-slider.spacing .swiper-slide img {
    height: 100%;
}

/* Scrollbar Track */
section.gallery-slider.spacing .swiper-scrollbar {
    height: 8px !important;
    width: 70% !important;
    overflow: hidden;
    background: #404141;
    border-radius: 12px;
    bottom: 70px !important;
    left: 50% !important;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
}

/* Scrollbar Thumb */
section.gallery-slider.spacing .swiper-scrollbar-drag {
    background: #F9FDFC;
    width: 35% !important;
    border-radius: 12px;
    height: 4px;
}

section.gallery-slider.spacing .swiper.mySwiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    padding: 40px 0;
}

/* Scrollbar Thumb */
.swiper-scrollbar-drag {
    background: #F9FDFC;
    width: 35% !important;
    border-radius: 12px;
    height: 4px;
}

.swiper.mySwiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    padding: 40px 0;
}

/* Get-in-touch */
section.Get-in-touch-sec {
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    z-index: 999;
}

section.Get-in-touch-sec:before {
    position: absolute;
    content: '';
    background-blend-mode: overlay;
    background-color: #00000094;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: -1;
}

.get-touch-con span {
    border: 2px solid #7D8E95;
    font-family: var(--f1);
    font-size: 14px;
    color: var(--c2);
    padding: 6px 10px;
    text-transform: uppercase;
    border-radius: 30px;
    font-weight: 500;
}

section.discover-sec .story-btn a:hover {
    color: var(--c1);
}

.get-touch-con h2 {
    font-size: 48px;
    font-family: var(--f2);
    color: var(--c2);
    margin-top: 20px;
    margin-bottom: 50px;
}

.form-sec {
    backdrop-filter: blur(3px);
    background: rgb(255 255 255 / 21%);
    padding: 70px 50px;
    border: 2px solid #ffffff6b;
    border-radius: 20px;
}

.input-type label {
    font-size: 19px;
    margin-bottom: 10px;
    color: var(--c2);
}

.form-sec .input-type input.form-control {
    background: no-repeat;
    border: 0;
    border-bottom: 2px solid #ffffff4a;
    border-radius: 0;
    margin-bottom: 30px;
    padding: 15px 0;
    color: var(--c2);
}

.form-sec .input-type textarea.form-control {
    background: none;
    border: 0;
    border-bottom: 2px solid #ffffff4a;
    border-radius: 0;
    margin-bottom: 30px;
    height: 150px;
    padding: 14px 10px;
    color: var(--c2);
}

.form-sec .input-type button.form-control {
    background: var(--c4);
    border: 0;
    padding: 13px 0;
    border-radius: 40px;
    color: var(--c2);
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: .5s;
}

section.Get-in-touch-sec .story-con h4,
.story-con p {
    color: var(--c2);
    font-size: 16px;
}

.form-socials {
    align-items: start;
    flex-direction: column;
    gap: 40px;
}


.form-socials .phone span {
    border: 2px solid var(--c3);
    width: 70px;
    height: 70px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .5s;
    cursor: pointer;
}

.form-socials .phone {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: start !important;
}

.form-socials .phone i {
    font-size: 30px;
    transition: all .5s;
}

.form-socials .phone a {
    font-size: 19px;
}

.form-sec .input-type input.form-control::placeholder {
    color: var(--c2);
}

.form-sec .input-type textarea.form-control::placeholder {
    color: var(--c2);
}

.socials-icon.form-socials-icon {
    justify-content: start;
    margin-top: 50px;
}

.main-form-con {
    padding-left: 50px;
}

/* Newsletter */
section.News-letter-sec {
    background: var(--c4);
}

.News-letter-con h6 {
    font-size: 48px;
    font-family: var(--f2);
    color: var(--c2);
}

.News-letter-email .email {
    position: relative;
}

.News-letter-email .email input.form-control {
    background: no-repeat;
    border: 0;
    border-bottom: 2px solid var(--c2);
    border-radius: 0;
    color: var(--c2);
}

.News-letter-email .email input.form-control::placeholder {
    color: var(--c2);
}

.News-letter-email .email button {
    position: absolute;
    top: 0;
    right: 0;
    line-height: 37px;
    color: var(--c2);
    background: none;
    border: 0;
    transition: all .5s;
}

/* Footer */
footer.main-footer {
    background: var(--c11);
}

.footer-logo {
    margin-bottom: 40px;
}

.socials-icon.footer-socails-icon {
    justify-content: center;
    margin-top: 40px;
}

.socials-icon.footer-socails-icon .insta {
    width: 40px;
    height: 40px;
}

.socials-icon.footer-socails-icon .insta i {
    font-size: 18px;
}

.header-nav-bar nav ul li a:hover {
    color: var(--c3);
}

.terms-link .header-nav-bar ul {
    display: flex;
    gap: 20px;
    justify-content: end;
}

.terms-link .header-nav-bar ul li a {
    font-size: 16px;
    color: var(--c2);
}

.footer-bottom {
    border-top: 1px solid #d9d9d940;
    padding-top: 30px;
    margin-top: 30px;
}

footer.main-footer {
    padding-bottom: 0px;
    padding-top: 60px;
}

.terms-link .header-nav-bar ul li {
    position: relative;
}

.terms-link .header-nav-bar ul li:before {
    position: absolute;
    content: '';
    width: 1px;
    height: 22px;
    background: var(--c2);
    right: -10px;
}

.terms-link .header-nav-bar ul li:last-child::before {
    content: unset;
}

.web-title span {
    border: 1px solid var(--c4);
    padding: 5px 20px;
    margin-bottom: 20px;
    display: inline-block;
    border-radius: 50px;
    font-size: 16px;
}

.form-sec .input-type input.form-control:focus {
    box-shadow: none !important;
}

.form-sec .input-type textarea.form-control:focus {
    box-shadow: none !important;
}

section.Get-in-touch-sec .story-con h4 {
    font-size: 35px;
}

section.History-sec .row .col-lg-6:nth-child(1) {
    margin-bottom: 60px;
}

section.History-sec .row .col-lg-6:nth-child(2) {
    padding-left: 20px;
}

section.History-sec .row .col-lg-6:nth-child(3) {
    padding-right: 35px;
}

.header-nav-bar nav ul li a:before {
    position: absolute;
    content: '';
    width: 0px;
    height: 1px;
    background: var(--c3);
    bottom: 0;
    right: 0;
    transition: .5s;
}

.header-nav-bar nav ul li a:hover::before {
    right: unset;
    width: 100%;
    left: 0;
}

.header-nav-bar nav ul li a:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 0%;
    height: 1px;
    background: var(--c3);
    transition: all .5s;
}

.header-nav-bar nav ul li a:hover i {
    transform: rotate(180deg);
}

.header-nav-bar ul li a i {
    transition: .5s;
    font-size: 14px;
}

.header-nav-bar nav ul li a:hover::after {
    right: unset;
    left: 0;
    width: 100%;
}

.header-nav-bar ul>li {
    position: relative;
}

section.Story-sec.spacing .story-btn a::before {
    border-bottom: 52px solid vaR(--c1) !important;
}

section.Story-sec.spacing .story-btn a {
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: .5s;
}

section.Story-sec.spacing .story-btn a:hover {
    color: var(--c2);
}

.header-nav-bar nav>ul>li>ul {
    position: absolute;
    flex-direction: column;
    top: 40px;
    width: 300px;
    left: 0px;
    height: 450px;
    transition: .5s;
    z-index: 9999;
    background: var(--c1);
    box-shadow: 0px 0px 5px 0px var(--c1);
    padding: 20px 20px;
    gap: 12px;
    transform-origin: top;
    transform: scaleY(0);
}

.header-nav-bar nav ul>li:hover ul {
    transform: scaleY(1);
}

.header-btn a::before, .header-btn button::before {
    content: "";
    position: absolute;
    top: 0;
    right: -50px;
    bottom: 0px;
    left: 0;
    border-right: 50px solid transparent;
    border-bottom: 61px solid vaR(--c2) !important;
    transform: translateX(-100%);
    transition: transform 0.6s ease-in-out;
    z-index: -1;
    height: 100%;
    border-top: 0;
}

.header-btn a:hover, .header-btn button:hover {
    color: var(--c4);
    /* box-shadow: 0px 0px 4px var(--c4); */
    /* font-weight: 600; */
}

.header-btn a:hover::before, .header-btn button:hover::before {
    transform: translateX(0);
}

.story-btn a::before {
    content: "";
    position: absolute;
    top: 0;
    right: -50px;
    bottom: 0px;
    left: 0;
    border-right: 50px solid transparent;
    border-bottom: 52px solid vaR(--c2) !important;
    transform: translateX(-100%);
    transition: transform 0.6s ease-in-out;
    z-index: -1;
}

.story-btn a:hover {
    color: var(--c4);
    box-shadow: 0px 0px 4px var(--c4);
    font-weight: 600;
}

.story-btn a:hover::before {
    transform: translateX(0);
}

a.buy-anc:before {
    border-bottom: 52px solid vaR(--c1) !important;
}

a.buy-anc {
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: .5s;
}

a.buy-anc:hover {
    color: var(--c2);
}

.form-sec .input-type button.form-control:before {
    position: absolute;
    content: '';
    border-bottom: 52px solid vaR(--c2) !important;
}

.form-sec .input-type button.form-control:before {
    content: "";
    position: absolute;
    top: 0;
    right: -50px;
    bottom: 0px;
    left: 0;
    border-right: 50px solid transparent;
    border-bottom: 52px solid vaR(--c2) !important;
    transform: translateX(-100%);
    transition: transform 0.6s ease-in-out;
    z-index: -1;
}

.swiper-slide a {
    width: 100%;
    height: 317px;
}

.form-sec .input-type button.form-control:hover {
    color: var(--c4);
    box-shadow: 0px 0px 4px var(--c4);
    font-weight: 600;
}

.form-sec .input-type button.form-control:hover::before {
    transform: translateX(0);
}

.form-socials .phone span:hover i {
    color: var(--c1);
}

.header-socials .phone a:hover {
    transform: translateX(10px);
}

.phone {
    display: flex;
    gap: 5px;
    align-items: center;
}

.video-img:hover img {
    transform: scale(1.2);
}

.video-img {
    overflow: hidden;
    width: 450px;
    height: 150px;
    border-radius: 80px;
}

.video-icon a::before {
    content: '';
    width: 100%;
    height: 0%;
    position: absolute;
    top: 0;
    left: 0;
    background: var(--c4);
    border-radius: 50%;
    z-index: -1;
    transition: all .5s;
}

.video-icon a:hover {
    color: var(--c2);
}

.video-icon a:hover::before {
    height: 100%;
}

.testi-banner-imgs {
    display: flex;
    align-items: center;
}

.banner-inner-img span:hover {
    cursor: pointer;
    transform: translateY(-10px);
}

.News-letter-email button {
    display: inline-block;
}

.News-letter-email .email button:hover {
    transform: rotate(-25deg);
}

.header-nav-bar ul>li:nth-child(2) ul {
    height: 200px;
}

.header-nav-bar ul>li:nth-child(6) ul {
    height: 420px;
}

.copy-right p {
    color: var(--c2);
}

.restaurant-content .phone span i,
.restaurant-content .phone a {
    color: var(--c1);
}

.restaurant-main {
    display: flex;
    align-items: center;
    gap: 0px;
    border: 1px solid var(--c4);
    border-radius: 10px;
    margin-bottom: 30px;
    height: 100%;
    position: relative;
}

.restaurant-img {
    width: 35%;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    height: 100%;
}

.restaurant-content {
    width: 65%;
    padding: 0 30px;
}

.restaurant-img img {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    height: 100%;
    object-fit: cover;
    transition: all .5s;
}

.restaurant-img img:hover {
    transform: scale(1.1);
    cursor: pointer;
}

.restaurant-content p {
    border-bottom: 1px solid var(--c4);
    margin-bottom: 20px;
}

.restaurant-content h2 {
    font-size: 40px;
    border-bottom: 1px solid var(--c4);
    padding-bottom: 10px;
}

.business-img {
    width: 35%;
}

articles .about-page-img img {
    aspect-ratio: 1;
    object-fit: cover;
    transition: all .5s;
}

.about-page-content {
    width: 100%;
    margin: 0 auto;
}

.article {
    padding: 20px 30px;
    background: var(--c3);
    position: relative;
    margin-bottom: 100px;
}

.article h4 {
    font-size: 16px;
    margin-bottom: 20px;
    font-style: italic;
}

.article p {
    font-size: 14px;
}

.about-page-img {
    border: 3px solid #000;
    padding: 40px;
    overflow: hidden;
    height: 100%;
}

.history-content h2 {
    margin-bottom: 30px;
}

.about-page-img img:hover {
    cursor: pointer;
    filter: grayscale(0);
}

.article p:nth-of-type(3) {
    position: absolute;
    background: var(--c3);
    width: 306px;
    left: 0;
    padding: 20px 30px;
}

.old-photos img {
    box-shadow: 0px 0px 5px 0px #0000008f;
    margin-bottom: 20px;
    border-radius: 10px;
    height: 300px;
    object-fit: cover;
}

.old-photos p {
    margin: 0;
}

.old-photos {
    padding: 0px 5px;
    margin: 10px 0px;
}

.celebrations-title p {
    margin: 20px 0px 0px;
}

.img-2.another-img {
    right: -55px;
}

.header-socials p:last-child {
    padding: 0;
    margin: 0;
    border: 0;
}
section.eating.spacing .restaurant-content h2 {
    border: 0;
    text-transform: capitalize;
}

section.eating.spacing .old-photos img {
    height: 320px;
    object-fit: cover;
}

section.eating.spacing .restaurant-content h2 {
    border: 0;
}

section.eating.spacing .restaurant-content h6 {
    font-size: 27px;
    font-weight: 700;
    margin-bottom: 20px;
}

.church-img {
    width: 110px;
    margin: 20px auto;
}

img.inner-img-church {
    width: 300px;
    height: 300px;
    object-fit: contain;
    margin: 60px auto;
}

.map iframe {
    display: block;
    width: 100%;
}

/* hide sub-menu by default */
.header-nav-bar nav ul li ul li .sub-menu {
    position: absolute;
    left: 100%;
    top: 0;
    width: 220px;
    background: var(--c1);
    box-shadow: 0px 0px 5px 0px var(--c1);
    padding: 15px;
    transform: scaleY(0);
    transform-origin: top;
    transition: .4s ease;
    z-index: 9999;
}

/* show sub-menu on hover */
.header-nav-bar nav ul li ul li:hover>.sub-menu {
    transform: scaleY(1);
}

section.eating.spacing.Sports-sec .restaurant-content {
    padding: 0;
}

section.eating.spacing.Sports-sec .restaurant-content h2 span {
    font-size: 18px;
}

section.eating.spacing.Sports-sec .phone {
    flex-direction: column;
}

section.eating.spacing.Sports-sec .phone.email {
    flex-direction: row;
    margin-top: 20px;
}

.tel-phone {
    margin-top: 20px;
}

.restaurant-content a {
    color: var(--c1);
    width: 100% !important;
    overflow: hidden;
}

section.Massachusetts .restaurant-content {
    padding: 0;
}

.mass-img {
    margin-bottom: 70px;
}

section.eating.Massachusetts .poem h2 {
    margin-bottom: 40px;
}

.restaurant-content.village-con span {
    display: block;
    padding-bottom: 30px;
    font-size: 20px;
}

.restaurant-content.village-con span a {
    text-decoration: underline !important;
}

.restaurant-content.village-con span {
    display: block;
    padding-bottom: 30px;
    font-size: 20px;
}

.restaurant-content.village-con span a {
    text-decoration: underline !important;
}

.village-table-wrap {
    margin-top: 25px;
}

.village-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

.village-table th,
.village-table td {
    padding: 12px 15px;
    border: 1px solid #ddd;
    text-align: left;
}

.village-table th {
    background: #f5f5f5;
    font-weight: 600;
}

.committee-list {
    padding-left: 20px;
}

.committee-list li {
    margin-bottom: 6px;
}

.village-table {
    width: 100%;
    border-collapse: collapse;
}

.village-table th,
.village-table td {
    padding: 12px 15px;
    border: 1px solid #ddd;
}

.village-table th {
    background: #f5f5f5;
}

mujhe image ke layout me table bana do styling achi krdenaha.restaurant-content.village-con span {
    display: block;
    padding-bottom: 30px;
    font-size: 20px;
}

.restaurant-content.village-con span a {
    text-decoration: underline !important;
}

.village-table-wrap h3 {
    margin-top: 25px;
    text-align: center;
    margin-bottom: 30px;
}

.village-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

.village-table th,
.village-table td {
    padding: 12px 15px;
    border: 1px solid #ddd;
    text-align: left;
}

.village-table th {
    background: #f5f5f5;
    font-weight: 600;
}

.committee-list {
    padding-left: 20px;
}

.committee-list li {
    margin-bottom: 6px;
}

.village-table {
    width: 100%;
    border-collapse: collapse;
}

.village-table th,
.village-table td {
    padding: 12px 15px;
    border: 1px solid #ddd;
}

.village-table th {
    background: #f5f5f5;
}

.village-card {
    background: #fff;
    padding: 25px;
    border-radius: 14px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
    margin-top: 40px;
}

.village-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 20px;
}

.modern-table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 10px;
    overflow: hidden;
}

.modern-table th {
    background: #f6f4ef;
    padding: 14px 16px;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 16px;
}

.modern-table td {
    padding: 16px;
    font-size: 15px;
    vertical-align: top;
    border-bottom: 1px solid #eee;
}

.modern-table tbody tr:nth-child(even) {
    background: #fafafa;
}

.modern-table tbody tr:hover {
    background: #f1f1f1;
    transition: 0.3s;
}

.event-desc {
    display: block;
    margin-top: 6px;
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

/* Responsive */
@media (max-width: 768px) {

    .modern-table th,
    .modern-table td {
        font-size: 14px;
        padding: 12px;
    }
}

.slider-img.swiper-dots {
    display: flex;
    gap: 30px;
}

.slider-content img {
    height: 800px;
    object-fit: cover;
}

.header-btn {
    display: flex;
    justify-content: end;
    gap: 20px;
    align-items: center;
}

/* RESPONSIVE MENU CSS */

.ham-menu-btn a span {
    width: 32px;
    height: 3px;
    background-color: var(--c2);
}

.ham-menu-btn a {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.responsive-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 70%;
    height: 100%;
    background-color: #ffffff80;
    z-index: 999999999999;
    transition: all .5s;
}

.responsive-menu-inner {
    height: 100%;
    padding: 30px;
    position: relative;
    width: 100%;
    background-color: var(--c2);
    right: -100%;
    background-position: left;
    background-image: url('../images/rb-6_compressed.webp');
    background-attachment: fixed;
}

.responsive-menu-inner:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--c2);
    opacity: 0.9;
}

.responsive-logo-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 1;
}

.respon-cross a,
.respon-cross a i {
    display: block;
}

.respon-cross a {
    width: 50px;
    height: 50px;
    border: 1px solid var(--c1);
    border-radius: 50%;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    color: var(--c1);
    transition: all .5s;
}

.respon-cross a:hover {
    transform: rotate(90deg);
    color: var(--c1);
    border-color: var(--c1);
}

.respon-logo a {
    display: block !important;
}

.respon-logo {
    width: 120px;
}

.responsive-links ul li a {
    color: var(--c1);
    transition: all .5s;
    font-size: 20px;
    font-weight: 500;
    display: inline-block !important;
    padding: 12px 0px;
    font-family: var(--f1);
}



.responsive-links {
    margin-top: 50px;
    overflow-y: auto;
    height: calc(100vh - 232px);
}

.responsive-links ul li ul {
    display: none;
}

.responsive-links ul li a:hover {
    color: var(--c4);
}

.responsive-links ul li ul li a {
    padding-left: 40px;
    font-size: 22px;
}

.responsive-links ul li:has(ul)::before {
    position: absolute;
    content: "\f067";
    top: 16px;
    right: 0;
    font-family: "Font Awesome 5 Pro";
    font-size: 22px;
    color: var(--c4);
}

.responsive-links ul li {
    position: relative;
    border-bottom: 1px solid #808080c4;
}

.responsive-links ul li.active::before {
    content: "\f068";
    color: var(--c1);
}

.responsive-socials {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: var(--c2);
    padding: 12px 0px;
}

.responsive-socials ul {
    display: flex;
    gap: 30px;
    justify-content: center;
}

.responsive-socials ul li a {
    color: var(--c1);
    font-size: 20px;
}

.responsive-menu.active {
    right: 0;
}

.responsive-menu.active .responsive-menu-inner {
    left: 0;
    transition-delay: .3s !important;
    transition: all .7s;
}

body.stop-scroll {
    overflow-y: hidden;
}

.web-btn.responsive-btn a {
    background-color: var(--c1);
    margin-top: 30px;
    display: block !important;
    text-align: center;
    color: var(--c3);
}

.respon-logo {
    width: 50px;
}

.respon-cross {
    position: absolute;
    top: 0;
    right: 0px;
}

.information-first {
    height: 430px;
}

.information-firs-img {
    width: 100%;
}

.school-item h4 {
    margin-bottom: 20px;
}

.phone.email {
    margin-bottom: 0px;
    line-break: anywhere;
}

.restaurant-content ul li {
    margin-bottom: 10px;
}

.restaurant-content h2 {
    font-size: 24px;
}

.contact-box {
    padding: 30px 40px;
    box-shadow: 0px 0px 10px -5px #000;
    border-radius: 15px;
    margin: 20px 0px;
    transition: all .5s;
}

.contact-box h4 {
    color: var(--c1);
    text-transform: capitalize;
    font-size: 30px;
}

.contact-box p {
    margin: 0;
}

.contact-box a {
    margin: 20px 0px;
    padding: 10px 30px;
    background-color: var(--c4);
    color: var(--c2);
    text-transform: math-auto;
    transition: all .5s;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.contact-box a:hover {
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
    background-color: var(--c11);
}

.contact-box:hover {
    box-shadow: 0px 0px 10px 0px var(--c4);
}

.contact-box ul {
    margin: 20px 0px 0px;
    padding-left: 20px;
}

.contact-box ul li {
    list-style: disc;
}

.contact-buttons {
    display: flex;
    align-items: center;
    gap: 20px;
}

.contact-buttons a {
    margin: 20px 0px 0px;
}

.booking-field {
    display: flex;
    flex-direction: column;
    margin: 10px 0px;
    gap: 10px 0px;
}

.booking-field input, .booking-field select, .booking-field textarea {
    width: 100%;
    padding: 12px 30px;
    border: 1px solid #00000033;
    border-radius: 100px;
    background: var(--c2);
    transition: all .5s;
}

.header-btn.banner-btn button {
    margin-top: 30px;
}

.booking-field:has(input[type="checkbox"]) {
    flex-direction: row;
    gap: 20px !important;
}

.booking-field:has(input[type="checkbox"]) input {
    width: inherit;
}

.booking-field input:focus-visible, .booking-field select:focus-visible, .booking-field textarea:focus-visible {
    outline: 0;
    border-color: var(--c4);
}

.facility-main_hall {
    background-color: #4caf50 !important;
}

.facility-meeting_room {
    background-color: #2196f3 !important;
}

.facility-games_room {
    background-color: #ff9800 !important;
}

.facility-kitchen {
    background-color: #9c27b0 !important;
}

.facility-whole_venue {
    background-color: #f44336 !important;
}

.fc-daygrid-event-harness {
    display: flex;
    align-items: center;
    justify-content: center;
    position: unset !important;
}

a.fc-event.fc-event-start.fc-event-end.fc-event-future.fc-daygrid-event.fc-daygrid-dot-event {
    display: block !important;
    padding: 12px 8px;
    color: var(--c1);
    width: 90%;
    margin: 0 auto;
}

.fc-daygrid-event-dot {
    display: none;
}

a.fc-event.fc-event-start.fc-event-end.fc-event-future.fc-daygrid-event.fc-daygrid-block-event.fc-h-event {
    display: block !important;
    width: 90%;
    margin: 0 auto;
    padding: 8px 0px;
}

.fc-event-main-frame {
    display: block !important;
}

.fc-event-main-frame {
    padding: 0px 5px;
    color: #000 !important;
}

.fc-event-time {
    font-weight: 500 !important;
}

.fc-event-title {
    font-weight: 800;
}

.about-content ul {
    list-style: disc !important;
    padding: 0px 0px 0px 20px;
    margin: 0px 0px 20px;
}

.about-content ul li {
    list-style: disc;
}

.about-content ul li a {
    text-decoration: underline !important;
}
.booking-event {
    font-size: 14px;
    line-height: 1.3;
}

.booking-event strong {
    display: block;
    font-weight: 600;
}
.resturant-con {}

section.village-hall-history .resturant-con {
    margin-top: 50px;
    margin-bottom: 50px;
    color: var(--c2);
}
.banner-content {
    padding-bottom: 0px;
    padding-top: 200px;
}
section.village-hall-history .resturant-con ul li {
    list-style: disc;
    margin-left: 20px;
}

section.village-hall-history .resturant-con ul {
    margin: 30px 0;
}
.booking-event span {
    text-transform: capitalize;
}

.mass-img img {
    aspect-ratio: unset;
    width: 100%;
}

.service-con p a {
    color: var(--c3);
    text-decoration: underline !important;
}

.header-nav-bar nav ul li:nth-child(2) ul {
    background-color: #358243;
}

.header-nav-bar nav ul li:nth-child(2) ul li a {
    font-weight: 700;
}

p.disclaimer {
    font-weight: 700;
    color: #ff0000de;
    margin-top: 20px !important;
}

.church-con p {
    margin: 0 0 10px !important;
}

.page-id-307 .inner-header .inner-header-title {
    display: none !important;
}

.contact-box.church-box p {
    margin-bottom: 0;
}

.contact-box.church-box p a {
    margin: 10px 5px !important;
}

.contact-box.church-box > a {
    margin: 10px 0;
}

.contact-box.church-box {
    padding: 20px;
    width: 90%;
}
.about-page-img img {
    width: 100%;
    height: 100%;
}

.image-caption {
    padding-top: 20px;
}
ul.top-inner {
    height: 330px !important;
}
.image-caption h6 {
    font-size: 20px;
}
.history-content p {
    margin-top: 30px;
}

ul.last-dropdown {
    left: -160px !important;
}
footer.main-footer .header-nav-bar ul {
    justify-content: center;
}
.terms-link .header-nav-bar ul {
    justify-content: end !important;
}
.where-eat-image {
    width: 70%;
}
.page-id-52.inner-header {
    height: 730px !important;
    background-position: 0% 100% !important;
}