@import url('https://fonts.googleapis.com/css2?family=Fira+Sans&family=Open+Sans&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Open Sans', sans-serif;
}

html {
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
}



/****************************Call Section*************************/
.call-buton .cc-calto-action-ripple {
    z-index: 99999;
    position: fixed;
    right: 1rem;
    bottom: 2rem;
    background: red;
    width: 4rem;
    height: 4rem;
    padding: 1rem;
    border-radius: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #ffffff;
    -webkit-animation: cc-calto-action-ripple 0.6s linear infinite;
    animation: cc-calto-action-ripple 0.6s linear infinite;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-items: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
}

.call-buton .cc-calto-action-ripple i {
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
    font-size: 2.2rem;
}

.call-buton .cc-calto-action-ripple:hover i {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

@-webkit-keyframes cc-calto-action-ripple {
    0% {
        -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2);
        box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2);
    }

    100% {
        -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0);
        box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0);
    }
}

@keyframes cc-calto-action-ripple {
    0% {
        -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2);
        box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 0 rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2);
    }

    100% {
        -webkit-box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0);
        box-shadow: 0 4px 10px rgba(236, 139, 0, 0.2), 0 0 0 5px rgba(236, 139, 0, 0.2), 0 0 0 10px rgba(236, 139, 0, 0.2), 0 0 0 20px rgba(236, 139, 0, 0);
    }
}

span.num {
    position: absolute;
    color: red;
    left: -30%;
    bottom: -50%;
}

.footer-head {
    color: white;
    font-size: 1.5rem;

}

@media screen and (max-width: 768px) {
    .footer-head {
        padding-top: 1rem;
    }

    .blog-row {
        flex-direction: column;
    }

    .blog-row .col-sm-4 {
        width: 100% !important;
    }
}

/* ================
    header start 
================== */
.dropdown-content {
    display: none;
    position: absolute;
    top: 0rem;
    right: 9rem;
    padding-top: 4rem;
    height: 24vw;
    padding-bottom: 2rem;
}

@media screen and (max-width: 786px) {
    .dropdown-content .nav-tab {
        display: none;
    }

    .fa-caret-down {
        display: none;
    }
}

ul li {
    background-color: #000;
    list-style: none;
}

.dropdown-content.show {
    display: block;
}

.cursor-dot {
    display: none;
    position: absolute;
    z-index: 10;
    pointer-events: none;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #d54e52;
    border-radius: 50%;
    width: 5px;
    height: 5px;
    -webkit-animation: spin 0.9s linear infinite;
    animation: spin 0.9s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        box-shadow: 0 0 0 0 #d54e52;
    }

    25% {
        box-shadow: 0px 0px 0px 2px rgba(191, 73, 79, 0.8);
    }

    50% {
        box-shadow: 0px 0px 0px 4px rgba(191, 73, 79, 0.6);
    }

    75% {
        box-shadow: 0px 0px 0px 8px rgba(191, 73, 79, 0.4);
    }

    100% {
        box-shadow: 0px 0px 0px 12px rgba(191, 73, 79, 0.1);
    }
}

@keyframes spin {
    0% {
        box-shadow: 0 0 0 0 #d54e52;
    }

    25% {
        box-shadow: 0px 0px 0px 2px rgba(191, 73, 79, 0.8);
    }

    50% {
        box-shadow: 0px 0px 0px 4px rgba(191, 73, 79, 0.6);
    }

    75% {
        box-shadow: 0px 0px 0px 8px rgba(191, 73, 79, 0.4);
    }

    100% {
        box-shadow: 0px 0px 0px 12px rgba(191, 73, 79, 0.1);
    }
}

header {
    width: 100%;
    padding: 2px 10px;
    position: fixed;
    top: 0;
    z-index: 1;
}

header nav {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header nav .logo {
    width: 50%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.img-nav {
    width: 30%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
}

header nav .hamburger-menu-button {
    width: 50%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    cursor: pointer;
}

header nav .hamburger-menu-button i {
    font-size: 40px;
    color: #fff;
    transition: 0.3s;
}

@media (max-width: 768px) {
    header nav .logo img {
        width: 20%;
    }
}

@media (max-width: 450px) {
    header nav .logo img {
        width: 30%;
    }
}

.side-menu {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: scale(0);
    transition: transform 0.3s;
    transform-origin: center;
    perspective: 1000px;
    background-color: #1b2a2f;
    z-index: 2;
}

.side-menu i {
    position: absolute;
    top: 0;
    right: 0;
    margin: 7px 30px;
    filter: drop-shadow(3px 3px 2px rgba(0, 0, 0, 0.6));
    font-size: 35px;
    color: #fff;
    cursor: pointer;
    transition: 0.3s;
}

.side-menu .menu-photos {
    width: 60%;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.side-menu .menu-photos img {
    width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    position: relative;
}

.side-menu .menu-list {
    width: 40%;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.side-menu .menu-list ul {
    position: relative;
}

.side-menu .menu-list ul li {
    list-style: none;
    margin: 30px 0;
}

.side-menu .menu-list ul li a {
    text-decoration: none;
    font-size: 1.6em;
    letter-spacing: 2px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    position: relative;
    transition: all 0.3s ease-out;
}

.side-menu .menu-list ul li a:hover .flip-front {
    transform: rotateX(-90deg) translateZ(25px);
}

.side-menu .menu-list ul li a:hover .flip-back {
    transform: rotateX(0deg) translateZ(25px);
}

.side-menu .menu-list ul li a .text {
    padding: 0 50px;
    visibility: hidden;
}

/* .side-menu .menu-list ul li a .flip-front,
  .side-menu .menu-list ul li a .flip-back {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform-style: flat;
    transition: transform 0.3s ease-out;
  } */
/* .side-menu .menu-list ul li a .flip-front {
    color: #fff;
    border: 2px solid #fff;
    background-color: transparent;
    transform: rotateX(0deg) translateZ(25px);
  } */
/* .side-menu .menu-list ul li a .flip-back {
    color: #fff;
    background-color: #d54e52;
    border: 2px solid #1b2a2f;
    transform: rotateX(90deg) translateZ(25px);
  } */

/* @media (max-width: 1000px) {
    .side-menu {
    
    }
    .side-menu .menu-photos {
      display: none;
    }
  } */

#container-services {
    padding: 0 5rem;
}

.splide {
    position: relative;
    max-width: 100%;
    /* min-height: 100vh; */
    background-color: #111517;
    overflow: hidden;
}

.splide .splide__track {
    position: relative;
    max-width: 100%;
    /* min-height: 100vh; */
    overflow: hidden;
}

@media screen and (max-width: 768px) {

    .splide .splide__track .splide__list .splide__slide .slider-text p {
        font-size: 1.9rem;
        font-weight: 700;
        color: #fff;
        text-transform: capitalize;
        transition: 1s;
        margin: 10px 0;
    }

    #container-services {
        padding: 0 0rem;
    }
}

.splide .splide__track .splide__list {
    position: relative;
    max-width: 100%;
    /* min-height: 100vh; */
}

.splide .splide__track .splide__list .splide__slide {
    max-width: 100%;
    min-height: 100vh;
    display: flex;
    overflow: hidden;
}

.splide .splide__track .splide__list .splide__slide:nth-child(1) {
    justify-content: flex-end;
}

.splide .splide__track .splide__list .splide__slide:nth-child(3) {
    justify-content: flex-end;
}

.splide .splide__track .splide__list .splide__slide .slider-text {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    background: #1b2a2f;
    padding: 0 30px;
}

.splide .splide__track .splide__list .splide__slide .slider-text p {
    font-size: 2.3rem;
    font-weight: 700;
    color: #fff;
    text-transform: capitalize;
    transition: 1s;
    margin: 10px 0;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy {
    -webkit-appearance: button;
    background-color: transparent;
    border: 2px solid #fff;
    color: #d54e52;
    display: inline-block;
    float: right;
    font-weight: 600;
    letter-spacing: 0.2em;
    margin: 0;
    outline: none;
    overflow: visible;
    padding: 1em 2em;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    transition: all 0.3s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 14rem;
    cursor: pointer;
}

.fancy a {
    text-decoration: none;
    transition: 0.2s;
    color: #d54e52;
}

.fancy a:hover {
    text-decoration: none;
    color: #ffffff;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy:hover {
    color: #fff;
    border: 2px solid #d54e52;
    letter-spacing: 0.3em;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy:hover::before {
    background: #d54e52;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy::before {
    content: "";
    width: 1.5625rem;
    height: 2px;
    background: #fff;
    top: 50%;
    left: 1.5em;
    position: absolute;
    transform: translateY(-50%);
    transform-origin: center;
    transition: background 0.3s linear, width 0.3s linear;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy .top-key {
    height: 2px;
    width: 1.5625rem;
    top: -2px;
    left: 0.625rem;
    position: absolute;
    background: #1b2a2f;
    transition: width 0.5s ease-out, left 0.3s ease-out;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-1 {
    height: 2px;
    width: 1.5625rem;
    right: 1.875rem;
    bottom: -2px;
    position: absolute;
    background: #1b2a2f;
    transition: width 0.5s ease-out, right 0.3s ease-out;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-2 {
    height: 2px;
    width: 0.625rem;
    right: 0.625rem;
    bottom: -2px;
    position: absolute;
    background: #1b2a2f;
    transition: width 0.5s ease-out, right 0.3s ease-out;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-2::before {
    width: 0.9375rem;
    background: #fff;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-2 .top-key {
    left: -2px;
    width: 0px;
}

.splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-2 .bottom-key-1,
.splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-2 .bottom-key-2 {
    right: 0;
    width: 0;
}

#slider-text {
    background-color: #9c8b81;
    ;
}

@media (max-width: 800px) {
    #slider-text {
        background: rgba(0, 0, 0, 0.3);
    }
}

#slider-text-2 {
    background-color: #595146;
}

@media (max-width: 800px) {
    #slider-text-2 {
        background: rgba(0, 0, 0, 0.3);
    }
}

#slider-text-3 {
    background-color: #d1d0ce;
}

@media (max-width: 800px) {
    #slider-text-3 {
        background: rgba(0, 0, 0, 0.3);
    }
}

#slider-text-4 {
    background-color: #c56660;
}

@media (max-width: 800px) {
    #slider-text-4 {
        background: rgba(0, 0, 0, 0.3);
    }
}

@media (max-width: 800px) {
    .splide .splide__track .splide__list .splide__slide .slider-text {
        background: linear-gradient(rgba(to bottom, gray));
        height: 30vh;
        width: 100%;
        margin-top: 4rem;
        font-size: 1.8rem;
    }

    .splide .splide__track .splide__list .splide__slide .slider-text button.fancy .top-key {
        background: none;
    }

    .splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-1 {
        background: none;
    }

    .splide .splide__track .splide__list .splide__slide .slider-text button.fancy .bottom-key-2 {
        background: none;
    }
}

.splide__pagination li {
    background-color: transparent;
}



.header {
    background-color: #000;
    width: 100%;
    position: sticky;
    top: 0;
    -webkit-transition: all ease-out 0.5s;
    -moz-transition: all ease-out 0.5s;
    -o-transition: all ease-out 0.5s;
    transition: all ease-out 0.5s;
    z-index: 99;
}


.nav-wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    margin: auto;
    /*width: 90%;*/
    height: 76px;
    padding: 0 25px;
    z-index: 2;
}

.logo-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 860px) {
    .logo-container img {
        width: 68%;

    }
}

.nav-tabs {
    display: flex;
    font-weight: 600;
    font-size: 18px;
    list-style: none;
}

.nav-tabs li a {
    display: flex;
    align-items: center;
    gap: 5px;
    /* space between text and arrow */
}

.nav-tabs li a .fa-caret-down {
    font-size: 0.7em;
    /* smaller than text */
    margin-left: 5px;
}

.nav-tab:not(:last-child) {
    padding: 10px 25px;
    margin: 0;
    /* border-right: 1px solid #eee; */
}

.nav-tab:last-child {
    padding: 10px 0 0 25px;
}

.nav-tab,
.menu-btn {
    cursor: pointer;
}

.hidden {
    display: none;
}

.hero {
    width: 100%;
}

.hero img {
    width: 100%;
}

@media screen and (max-width: 800px) {
    .nav-container {
        position: fixed;
        display: none;
        overflow-y: auto;
        z-index: -1;
        top: 0;
        right: 0;
        width: 280px;
        height: 100%;
        /* background: ; */
        box-shadow: -1px 0 2px rgba(0, 0, 0, 0.2);
    }


    .nav-tabs {
        flex-direction: column;
        align-items: flex-end;
        margin-top: 80px;
        width: 100%;
        background-color: #000;
        /* position: fixed;
    }
  
    .nav-tab:not(:last-child) {
      padding: 20px 25px;
      margin: 0;
      border-right: unset;
      /* border-bottom: 1px solid #f5f5f5; */
    }

    .nav-tab:last-child {
        padding: 15px 25px;
    }

    .menu-btn {

        background-color: #000;
        position: relative;
        margin: 0;
        width: 50px;
        height: 40px;
        cursor: pointer;
        z-index: 2;
        padding: 10px;
        border-radius: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .menu-btn .menu {
        display: block;
        width: 100%;
        height: 4px;
        border-radius: 0px;
        background: #fff;
    }

    .menu-btn .menu:nth-child(1) {
        margin-top: 4px;
        opacity: 1;
    }

    .menu-btn .menu:nth-child(2) {
        margin-top: 4px;
        opacity: 1;
    }

    .menu-btn .menu:nth-child(3) {
        margin-top: 4px;
    }

    #menuToggle:checked+.menu-btn .menu {
        transition: transform 0.2s ease;
    }

    #menuToggle:checked+.menu-btn .menu:nth-child(1) {
        transform: translate3d(0, 6px, 0) rotate(45deg);
    }

    #menuToggle:checked+.menu-btn .menu:nth-child(2) {
        transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
        opacity: 0;
    }

    #menuToggle:checked+.menu-btn .menu:nth-child(3) {
        transform: translate3d(0, -6px, 0) rotate(-45deg);
    }

    #menuToggle:checked~.nav-container {
        z-index: 1;
        display: flex;
        animation: menu-slide-left 0.3s ease;
    }

    @keyframes menu-slide-left {
        0% {
            transform: translateX(200px);
        }

        to {
            transform: translateX(0);
        }
    }
}

.nav-tab a {
    text-decoration: none;
    color: #fff;

}




/* =================
   brand logo client
================== */
.brand {
    background-color: #fff;
    box-shadow: 0 10px 20px -5px rgba(0, 0, 0, .125);
    height: 150px;
    overflow: hidden;
    position: relative;
    width: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
}

@media screen and (max-width: 786px) {
    .brand {
        width: 100%;
    }
}


.brand .slider-track {
    animation: scroll 10s linear infinite;
    display: flex;
    width: calc(290px * 2);
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-250px * 6));
    }
}


.slide-logo {
    margin-right: 4rem;
}

.slide-logo img {
    width: 13vw;
}

@media screen and (max-width: 768px) {
    .slide-logo img {
        width: 37vw;
    }
}

/* =====================
      About section
   ======================*/
@media screen and (max-width: 1000px) {}

.two-img {
    justify-content: space-between;
    align-items: center;
    display: flex;
    margin-top: 2rem;
}

.two-img img {
    width: 800px;
    object-fit: contain;
}

.aboutnext {
    justify-content: center;
    align-items: center;
    display: flex;
}

@media screen and (max-width: 768px) {
    .about-heading {
        width: 100%;
        padding: 0.4rem 1rem;
    }
}

/*.sec-cnt {*/
/*    padding: 2px 22px;*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*}*/


/*.first-sec-img {*/
/*    padding: 2px 22px;*/
/*}*/

/*.first-sec-img h1{*/
/*  background-color: black; */
/*  text-transform: uppercase; */
/*  color: #fff;   */
/*  font-family: 'Open Sans', sans-serif;  */
/*  padding: 0.3rem 2rem; */
/*  width: 40%;*/
/*}*/

/*.fr-img{*/
/*      position: relative;*/
/*      width: 100%;*/
/*    overflow: hidden;*/
/*    padding: 0px;*/
/*    margin: 0px;*/
/*    background-color: green;*/
/*}*/

/*.fr-img img {*/
/*   object-fit: cover;*/
/*    width: 100%;*/
/*    transition: all .5s ease-in-out;*/
/*}*/

/* .fr-img img:hover{*/
/*        transform: scale(1.1);*/
/* }*/


/*.se-sec-img{*/
/*      position: relative;*/
/*  width: 100%;*/
/*   overflow: hidden;*/
/*}*/
/* .se-sec-img img{*/
/*       object-fit: cover;*/
/*   width: 100%;*/
/*   transition: all .5s ease-in-out;*/
/* }*/
/* .se-sec-img img:hover{*/
/*      transform: scale(1.1);*/
/* }*/
/* .sec-img{*/
/*         position: relative;*/
/*   width: 100%;*/
/*    overflow: hidden;*/
/*    padding: 0px;*/
/*    margin: 0px;*/
/* }*/

/* .sec-img img{*/
/*      object-fit: cover;*/
/*    width: 100%;*/
/*    transition: all .5s ease-in-out;*/
/* }*/

/*.sec-img img:hover{*/
/*        transform: scale(1.1);*/
/* }*/
/*.third-cnt p {*/
/*    padding: 16px 22px;*/
/*    background-color: black;*/
/*    color: white;*/
/*    margin: 1px 20px;*/
/*}*/

/*.forth-cnt {*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    padding: 2px 22px;*/
/*}*/




/*.second-sec-img {*/
/*      position: relative;*/
/*   width: 100%;*/
/*    overflow: hidden;*/
/*}*/
/*.second-sec-img img{*/
/*     object-fit: cover;*/
/*    width: 100%;*/
/*    transition: all .5s ease-in-out;*/
/*}*/
/* .second-sec-img img:hover{*/
/*      transform: scale(1.1);*/
/* }*/

/*.se-fir-img img {*/
/*  object-fit: cover;*/
/*    width: 100%;*/
/*    transition: all .5s ease-in-out;*/
/*  }*/
/*  .se-fir-img{*/
/*    position: relative;*/
/*   width: 100%;*/
/*    overflow: hidden;*/
/*  }*/
/*  .se-fir-img img:hover{*/
/*    transform: scale(1.1) rotate(-2deg);*/
/*}*/

/*.fifth-cnt p {*/
/*    padding: 16px 22px;*/
/*    background-color: black;*/
/*    color: white;*/
/*    margin: 1px 20px;*/
/*}*/
/* ==================
       Our Product css
   ===================== */
.product-section {
    padding: 0 4rem;
    margin-top: 1rem;
}

#our-product-heading {
    font-size: 3rem;
    text-align: center;
}

.product-img img {
    width: 100%;
    height: 80vh;

}


.product-image-child img:hover {
    transform: scale(1.1);
}

.product-image-child {
    width: 100%;
    overflow: hidden;
}

.product-image-child img {
    overflow: hidden;
    transition: all 700ms ease;
}

/* ================
      Our Work
   ================ */

.gallery {
    display: flex;
    padding: 2px;
    transition: 0.3s;
    justify-content: center;
    align-items: center;
    margin-top: 1.3rem;

}

.gallery:hover .gallery__image {
    filter: grayscale(1);
}

.gallery__column {
    display: flex;
    flex-direction: column;
    width: 25%;
}

.gallery__link {
    margin: 2px;
    overflow: hidden;
}

.gallery__link:hover .gallery__image {
    filter: grayscale(0);
}

.gallery__link:hover .gallery__caption {
    opacity: 1;
}

.gallery__thumb {
    position: relative;
}

.gallery__image {
    display: block;
    width: 100%;
    transition: 0.3s;
}

.gallery__image:hover {
    transform: scale(1.1);
}

.gallery__caption {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 25px 15px 15px;
    width: 100%;
    font-size: 16px;
    color: white;
    opacity: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
    transition: 0.3s;
}

/* ===============
     Footer section
  ============== */

.footer-section {
    background: #000;
    position: relative;
    margin-top: 3rem;
}

.footer-cta {
    border-bottom: 1px solid #373636;
}

.single-cta i {
    color: #ff5e14;
    font-size: 30px;
    float: left;
    margin-top: 8px;
}

.cta-text {
    padding-left: 15px;
    display: inline-block;
}

.cta-text h4 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 2px;
}

.cta-text span {
    color: #757575;
    font-size: 15px;
}

.footer-content {
    position: relative;
    z-index: 2;
}

#footer-wid {
    padding: 0 5rem;
}

.foter-home {
    padding: 0;
}

.footer-pattern img {
    position: absolute;
    top: 0;
    left: 0;
    height: 330px;
    background-size: cover;
    background-position: 100% 100%;
}

.footer-logo img {
    max-width: 200px;
}

.footer-text p {
    margin-bottom: 14px;
    font-size: 14px;
    color: #7e7e7e;
    line-height: 28px;
}

.footer-social-icon span {
    color: #fff;
    display: block;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px;
}

.footer-social-icon a {
    color: #fff;
    font-size: 16px;
    margin-right: 15px;
}

.footer-social-icon i {
    height: 40px;
    width: 40px;
    text-align: center;
    line-height: 38px;
    border-radius: 50%;
}

.facebook-bg {
    background: #3B5998;

}

.twitter-bg {
    background: #55ACEE;

}

.linkedin-bg {
    background: #007bb5;

}

#wid {
    margin-left: 2rem;
}

.footer-widget-heading h3 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 29px;
    position: relative;
    /*text-align:center;*/

}

.footer-widget-heading h3::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -15px;
    height: 2px;
    width: 50px;
    background: #ff5e14;
    /*align-items:center;*/
}

.footer-widget ul li {
    display: inline-block;
    float: left;
    width: 50%;
    margin-bottom: 12px;

}

.footer-widget ul li a:hover {
    color: #ff5e14;
}

.footer-widget ul li a {
    color: #878787;
    text-transform: capitalize;
    text-decoration: none;
}

.subscribe-form {
    position: relative;
    overflow: hidden;
}

.subscribe-form input {
    width: 100%;
    padding: 14px 28px;
    background: #2E2E2E;
    border: 1px solid #2E2E2E;
    color: #fff;
}

.subscribe-form button {
    position: absolute;
    right: 0;
    background: #ff5e14;
    padding: 13px 20px;
    border: 1px solid #ff5e14;
    top: 0;
}

.subscribe-form button i {
    color: #fff;
    font-size: 22px;
    transform: rotate(-6deg);
}

.copyright-area {
    background: #202020;
    padding: 25px 0;
}

.copyright-text p {
    margin: 0;
    font-size: 14px;
    color: #878787;
    text-align: center;
}

.copyright-text p a {
    color: #ff5e14;
}

.footer-menu li {
    display: inline-block;
    margin-left: 20px;
}

.footer-menu li:hover a {
    color: #ff5e14;
}

.footer-menu li a {
    font-size: 14px;
    color: #878787;
}

.footer-logo p {
    color: #fff;
    font-size: 1.6rem;
}

@media screen and (max-width: 768px) {
    #footer-wid {
        padding: 0 1rem;
    }
}

/* ===============
     services page css
  ============ */
/*.cardabout{*/
/*    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url(./img/interior-background.jpg);*/
/*    background-position: center;*/
/*    background-size: cover;*/
/*    background-attachment: fixed;*/
/*    height: 100vh;*/

/*}*/

/*.card-nomal img {*/
/*   width: 50vw;*/
/*   position: relative;*/
/*}*/

/*.card-nomal::after {*/
/*   content: "hellor";*/
/*   background-color: #000;*/
/*   width: 150px;*/
/*   height: 150px;*/
/*   position: absolute;*/
/*   top: 50%;*/
/*   bottom: 50%;*/
/*}*/
.serv-hero {
    background-image: url("https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img,w_918/http://mygrace.in/wp-content/uploads/2023/06/zaffiro_mod_06.jpg");
    height: 50vh;
}

.serv-hero:hover {
    opacity: 80%;
}

.hero-cnt {
    position: absolute;
    top: 25%;
    right: 44%;
}



/* ==================================== Service Page ======================================= */
.third-sec {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}



.third-sec-cnt1 .content .cgCol,
.cgCol1,
.cgCol2,
.cgCol3 {
    /* background-color: azure; */
    color: black;
}

.third-sec-cnt1 .content i {
    padding: 12px;
    line-height: 0;
}

.third-sec-cnt1 .content:hover .cgCol {
    color: red;
    cursor: pointer;
}

.third-sec-cnt2 .content:hover .cgCol1 {
    color: red;
    cursor: pointer;
}

.third-sec-cnt3 .content:hover .cgCol2 {
    color: red;
    cursor: pointer;
}

.third-sec-cnt4 .content:hover .cgCol3 {
    color: red;
    cursor: pointer;
}


/* ================================= services Testimonail ========================================== */

/*.testim {*/
/*    width: 100%;*/
/*    position: relative;*/

/*    background-color:#0d1f36;*/

/*}*/

/*.testim .wrap {*/
/*    position: relative;*/
/*    width: 100%;*/
/*    max-width: 1020px;*/
/*    padding: 40px 20px;*/
/*    margin: auto;*/
/*}*/

/*.testim .arrow {*/
/*    display: block;*/
/*    position: absolute;*/
/*    color: #eee;*/
/*    cursor: pointer;*/
/*    font-size: 2em;*/
/*    top: 50%;*/

/*    padding: 5px;*/

/*}*/

/*.testim .arrow:before {*/
/*    cursor: pointer;*/
/*}*/

/*.testim .arrow:hover {*/
/*    color: #ea830e;*/
/*}*/


/*.testim .arrow.left {*/
/*    left: 10px;*/
/*}*/

/*.testim .arrow.right {*/
/*    right: 10px;*/
/*}*/

/*.testim .dots {*/
/*    text-align: center;*/
/*    position: absolute;*/
/*    width: 100%;*/
/*    bottom: 60px;*/
/*    left: 0;*/
/*    display: block;*/
/*    height: 12px;*/
/*}*/

/*.testim .dots .dot {*/
/*    list-style-type: none;*/
/*    display: inline-block;*/
/*    width: 12px;*/
/*    height: 12px;*/
/*    border-radius: 50%;*/
/*    border: 1px solid #eee;*/
/*    margin: 0 10px;*/
/*    cursor: pointer;*/

/*    position: relative;*/
/*}*/

/*.testim .dots .dot.active,*/
/*.testim .dots .dot:hover {*/
/*    background: #ea830e;*/
/*    border-color: #ea830e;*/
/*}*/



/*.testim .cont {*/
/*    position: relative;*/
/*    overflow: hidden;*/
/*}*/

/*.testim .cont>div {*/
/*    text-align: center;*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    padding: 0 0 70px 0;*/
/*    opacity: 0;*/
/*}*/

/*.testim .cont>div.inactive {*/
/*    opacity: 1;*/
/*}*/


/*.testim .cont>div.active {*/
/*    position: relative;*/
/*    opacity: 1;*/
/*}*/


/*.testim .cont div .img img {*/
/*    display: block;*/
/*    width: 200px;*/
/*    height: 200px;*/
/*    margin: auto;*/
/*    border-radius: 50%;*/
/*}*/

/*.testim .cont div h2 {*/
/*    color: #ea830e;*/
/*    font-size: 1em;*/
/*    margin: 15px 0;*/
/*}*/

/*.testim .cont div p {*/
/*    font-size: 1.15em;*/
/*    color: #eee;*/
/*    width: 80%;*/
/*    margin: auto;*/
/*}*/

/*.testim .cont div.active .img img {*/
/*    -webkit-animation: testim-show .5s ease-in-out forwards;*/
/*    -moz-animation: testim-show .5s ease-in-out forwards;*/
/*    -ms-animation: testim-show .5s ease-in-out forwards;*/
/*    -o-animation: testim-show .5s ease-in-out forwards;*/
/*    animation: testim-show .5s ease-in-out forwards;*/
/*}*/

/*.testim .cont div.active h2 {*/
/*    -webkit-animation: testim-content-in .4s ease-in-out forwards;*/
/*    -moz-animation: testim-content-in .4s ease-in-out forwards;*/
/*    -ms-animation: testim-content-in .4s ease-in-out forwards;*/
/*    -o-animation: testim-content-in .4s ease-in-out forwards;*/
/*    animation: testim-content-in .4s ease-in-out forwards;*/
/*}*/

/*.testim .cont div.active p {*/
/*    -webkit-animation: testim-content-in .5s ease-in-out forwards;*/
/*    -moz-animation: testim-content-in .5s ease-in-out forwards;*/
/*    -ms-animation: testim-content-in .5s ease-in-out forwards;*/
/*    -o-animation: testim-content-in .5s ease-in-out forwards;*/
/*    animation: testim-content-in .5s ease-in-out forwards;*/
/*}*/

/*.testim .cont div.inactive .img img {*/
/*    -webkit-animation: testim-hide .5s ease-in-out forwards;*/
/*    -moz-animation: testim-hide .5s ease-in-out forwards;*/
/*    -ms-animation: testim-hide .5s ease-in-out forwards;*/
/*    -o-animation: testim-hide .5s ease-in-out forwards;*/
/*    animation: testim-hide .5s ease-in-out forwards;*/
/*}*/

/*.testim .cont div.inactive h2 {*/
/*    -webkit-animation: testim-content-out .4s ease-in-out forwards;*/
/*    -moz-animation: testim-content-out .4s ease-in-out forwards;*/
/*    -ms-animation: testim-content-out .4s ease-in-out forwards;*/
/*    -o-animation: testim-content-out .4s ease-in-out forwards;*/
/*    animation: testim-content-out .4s ease-in-out forwards;*/
/*}*/

/*.testim .cont div.inactive p {*/
/*    -webkit-animation: testim-content-out .5s ease-in-out forwards;*/
/*    -moz-animation: testim-content-out .5s ease-in-out forwards;*/
/*    -ms-animation: testim-content-out .5s ease-in-out forwards;*/
/*    -o-animation: testim-content-out .5s ease-in-out forwards;*/
/*    animation: testim-content-out .5s ease-in-out forwards;*/
/*}*/

/*@-webkit-keyframes testim-scale {*/
/*    0% {*/
/*        -webkit-box-shadow: 0px 0px 0px 0px #eee;*/
/*        box-shadow: 0px 0px 0px 0px #eee;*/
/*    }*/

/*    35% {*/
/*        -webkit-box-shadow: 0px 0px 10px 5px #eee;*/
/*        box-shadow: 0px 0px 10px 5px #eee;*/
/*    }*/

/*    70% {*/
/*        -webkit-box-shadow: 0px 0px 10px 5px #ea830e;*/
/*        box-shadow: 0px 0px 10px 5px #ea830e;*/
/*    }*/

/*    100% {*/
/*        -webkit-box-shadow: 0px 0px 0px 0px #ea830e;*/
/*        box-shadow: 0px 0px 0px 0px #ea830e;*/
/*    }*/
/*}*/

/*@-moz-keyframes testim-scale {*/
/*    0% {*/
/*        -moz-box-shadow: 0px 0px 0px 0px #eee;*/
/*        box-shadow: 0px 0px 0px 0px #eee;*/
/*    }*/

/*    35% {*/
/*        -moz-box-shadow: 0px 0px 10px 5px #eee;*/
/*        box-shadow: 0px 0px 10px 5px #eee;*/
/*    }*/

/*    70% {*/
/*        -moz-box-shadow: 0px 0px 10px 5px #ea830e;*/
/*        box-shadow: 0px 0px 10px 5px #ea830e;*/
/*    }*/

/*    100% {*/
/*        -moz-box-shadow: 0px 0px 0px 0px #ea830e;*/
/*        box-shadow: 0px 0px 0px 0px #ea830e;*/
/*    }*/
/*}*/

/*@-ms-keyframes testim-scale {*/
/*    0% {*/
/*        -ms-box-shadow: 0px 0px 0px 0px #eee;*/
/*        box-shadow: 0px 0px 0px 0px #eee;*/
/*    }*/

/*    35% {*/
/*        -ms-box-shadow: 0px 0px 10px 5px #eee;*/
/*        box-shadow: 0px 0px 10px 5px #eee;*/
/*    }*/

/*    70% {*/
/*        -ms-box-shadow: 0px 0px 10px 5px #ea830e;*/
/*        box-shadow: 0px 0px 10px 5px #ea830e;*/
/*    }*/

/*    100% {*/
/*        -ms-box-shadow: 0px 0px 0px 0px #ea830e;*/
/*        box-shadow: 0px 0px 0px 0px #ea830e;*/
/*    }*/
/*}*/

/*@-o-keyframes testim-scale {*/
/*    0% {*/
/*        -o-box-shadow: 0px 0px 0px 0px #eee;*/
/*        box-shadow: 0px 0px 0px 0px #eee;*/
/*    }*/

/*    35% {*/
/*        -o-box-shadow: 0px 0px 10px 5px #eee;*/
/*        box-shadow: 0px 0px 10px 5px #eee;*/
/*    }*/

/*    70% {*/
/*        -o-box-shadow: 0px 0px 10px 5px #ea830e;*/
/*        box-shadow: 0px 0px 10px 5px #ea830e;*/
/*    }*/

/*    100% {*/
/*        -o-box-shadow: 0px 0px 0px 0px #ea830e;*/
/*        box-shadow: 0px 0px 0px 0px #ea830e;*/
/*    }*/
/*}*/

/*@keyframes testim-scale {*/
/*    0% {*/
/*        box-shadow: 0px 0px 0px 0px #eee;*/
/*    }*/

/*    35% {*/
/*        box-shadow: 0px 0px 10px 5px #eee;*/
/*    }*/

/*    70% {*/
/*        box-shadow: 0px 0px 10px 5px #ea830e;*/
/*    }*/

/*    100% {*/
/*        box-shadow: 0px 0px 0px 0px #ea830e;*/
/*    }*/
/*}*/

/*@-webkit-keyframes testim-content-in {*/
/*    from {*/
/*        opacity: 0;*/
/*        -webkit-transform: translateY(100%);*/
/*        transform: translateY(100%);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -webkit-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/
/*}*/

/*@-moz-keyframes testim-content-in {*/
/*    from {*/
/*        opacity: 0;*/
/*        -moz-transform: translateY(100%);*/
/*        transform: translateY(100%);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -moz-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/
/*}*/

/*@-ms-keyframes testim-content-in {*/
/*    from {*/
/*        opacity: 0;*/
/*        -ms-transform: translateY(100%);*/
/*        transform: translateY(100%);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -ms-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/
/*}*/

/*@-o-keyframes testim-content-in {*/
/*    from {*/
/*        opacity: 0;*/
/*        -o-transform: translateY(100%);*/
/*        transform: translateY(100%);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -o-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/
/*}*/

/*@keyframes testim-content-in {*/
/*    from {*/
/*        opacity: 0;*/
/*        transform: translateY(100%);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        transform: translateY(0);*/
/*    }*/
/*}*/

/*@-webkit-keyframes testim-content-out {*/
/*    from {*/
/*        opacity: 1;*/
/*        -webkit-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        -webkit-transform: translateY(-100%);*/
/*        transform: translateY(-100%);*/
/*    }*/
/*}*/

/*@-moz-keyframes testim-content-out {*/
/*    from {*/
/*        opacity: 1;*/
/*        -moz-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        -moz-transform: translateY(-100%);*/
/*        transform: translateY(-100%);*/
/*    }*/
/*}*/

/*@-ms-keyframes testim-content-out {*/
/*    from {*/
/*        opacity: 1;*/
/*        -ms-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        -ms-transform: translateY(-100%);*/
/*        transform: translateY(-100%);*/
/*    }*/
/*}*/

/*@-o-keyframes testim-content-out {*/
/*    from {*/
/*        opacity: 1;*/
/*        -o-transform: translateY(0);*/
/*        transform: translateY(0);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        transform: translateY(-100%);*/
/*        transform: translateY(-100%);*/
/*    }*/
/*}*/

/*@keyframes testim-content-out {*/
/*    from {*/
/*        opacity: 1;*/
/*        transform: translateY(0);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        transform: translateY(-100%);*/
/*    }*/
/*}*/

/*@-webkit-keyframes testim-show {*/
/*    from {*/
/*        opacity: 0;*/
/*        -webkit-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -webkit-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/
/*}*/

/*@-moz-keyframes testim-show {*/
/*    from {*/
/*        opacity: 0;*/
/*        -moz-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -moz-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/
/*}*/

/*@-ms-keyframes testim-show {*/
/*    from {*/
/*        opacity: 0;*/
/*        -ms-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -ms-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/
/*}*/

/*@-o-keyframes testim-show {*/
/*    from {*/
/*        opacity: 0;*/
/*        -o-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        -o-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/
/*}*/

/*@keyframes testim-show {*/
/*    from {*/
/*        opacity: 0;*/
/*        transform: scale(0);*/
/*    }*/

/*    to {*/
/*        opacity: 1;*/
/*        transform: scale(1);*/
/*    }*/
/*}*/

/*@-webkit-keyframes testim-hide {*/
/*    from {*/
/*        opacity: 1;*/
/*        -webkit-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        -webkit-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/
/*}*/

/*@-moz-keyframes testim-hide {*/
/*    from {*/
/*        opacity: 1;*/
/*        -moz-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        -moz-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/
/*}*/

/*@-ms-keyframes testim-hide {*/
/*    from {*/
/*        opacity: 1;*/
/*        -ms-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        -ms-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/
/*}*/

/*@-o-keyframes testim-hide {*/
/*    from {*/
/*        opacity: 1;*/
/*        -o-transform: scale(1);*/
/*        transform: scale(1);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        -o-transform: scale(0);*/
/*        transform: scale(0);*/
/*    }*/
/*}*/

/*@keyframes testim-hide {*/
/*    from {*/
/*        opacity: 1;*/
/*        transform: scale(1);*/
/*    }*/

/*    to {*/
/*        opacity: 0;*/
/*        transform: scale(0);*/
/*    }*/
/*}*/

/*@media all and (max-width: 300px) {*/
/*    body {*/
/*        font-size: 14px;*/
/*    }*/
/*}*/

/*@media all and (max-width: 500px) {*/
/*    .testim .arrow {*/
/*        font-size: 1.5em;*/
/*    }*/

/*    .testim .cont div p {*/
/*        line-height: 25px;*/
/*    }*/

/*}*/

/* ==================
   testimonial section
================= */

/*.testimonial-slider {*/
/*  background-color: #5072a7;*/
/*  padding: 2em 2em 3em;*/
/*}*/
/*.testimonial-title {*/
/*  color: #fff;*/
/*}*/
/*.testimonial-title h2 {*/
/*  padding-left: 0.2em;*/
/*}*/
/*.card {*/
/*  margin: 0 0.5em;*/
/*  box-shadow: 2px 6px 8px 0 rgba(22, 22, 26, 0.18);*/
/*  border: none;*/
/*  height: 100%;*/
/*}*/
/*.carousel-control-prev,*/
/*.carousel-control-next {*/
/*  background-color: #fff;*/
/*  width: 3em;*/
/*  height: 3em;*/
/*  border-radius: 50%;*/
/*  top: 60%;*/
/*  transform: translateY(-50%);*/
/*}*/

/*@media (min-width: 576px) {*/
/*  .carousel-item {*/
/*    margin-right: 0;*/
/*    flex: 0 0 50%;*/
/*    display: block;*/
/*  }*/
/*  .carousel-inner {*/
/*    display: flex;*/
/*  }*/
/*}*/
/*@media (min-width: 768px) {*/
/*  .carousel-inner {*/
/*    padding: 1em;*/
/*  }*/
/*  .carousel-control-prev,*/
/*  .carousel-control-next {*/
/*    opacity: 1;*/
/*    position: absolute;*/
/*    left: 1em;*/
/*    top: 90%;*/
/*    transform: translateY(-50%);*/
/*  }*/
/*  .carousel-control-next {*/
/*    left: 5em;*/
/*  }*/

/*}*/


/* ====================
          Our work css
       ==================== */

.gallery-title {
    font-size: 36px;
    color: #3F6184;
    text-align: center;
    font-weight: 500;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-top: 2.3rem;
}

.filter-button {
    font-size: 18px;
    border: 2px solid #d54e52;
    ;
    padding: 5px 10px;
    text-align: center;
    color: #3F6184;
    margin-bottom: 30px;
    background: transparent;
}

.filter-button:hover,
.filter-button:focus,
.filter-button.active {
    color: #ffffff;
    background-color: #d54e52;
    outline: none;
}

.gallery_product {
    margin: 0px;
    padding: 0;
    position: relative;
}

.gallery_product .img-info {
    position: absolute;
    background: rgba(0, 0, 0, 0.5);
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    overflow: hidden;
    color: #fff;
    top: 0;
    display: none;
    -webkit-transition: 2s;
    transition: 2s;
}

.gallery_product:hover .img-info {
    display: block;
    -webkit-transition: 2s;
    transition: 2s;
}

/* =============
       Contact form
    ============== */
.img-form {
    background-image: url(https://www.regalokitchens.com/images/parallax-background/contact-details-bg.jpg);
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

.contact-form-2 {
    max-width: 800px;
    margin: 0 auto;
}

label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

input,
textarea {
    width: 95%;
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

button {
    background-color: #4CAF50;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.inputgrupur {
    display: flex;
    gap: 22px;
    margin: 1rem;
}

select[name="cars"] {
    width: 100%;
    border: none;
    padding: 0.7rem;
    border-radius: 5px;
}

.carse {
    border-radius: 10px !important;
    border-bottom: 2px solid #ddd !important;
    width: 91% !important;
    margin-left: 1rem !important;
}

.text-area textarea {
    margin-left: 1rem;
}

#typebutton {

    background: #0d1f36 !important;

    margin-left: 1rem;
    /*width: 11vw;*/
    font-size: 1.3rem;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

@media (max-width: 1000px) {
    #typebutton {
        margin-left: 0rem;
    }

    .inputgrupur {
        display: flex;
        gap: 11px;
        flex-direction: column;
    }

    select[name="cars"] {
        width: 95%;
        border: none;
        padding: 0.7rem;
        border-radius: 5px;
    }

    .inputgrupur {
        display: flex;
        gap: 11px;
        margin: 0.7rem 0 0 0 !important;
    }

    .text-area textarea {
        width: 95% !important;
        margin: 0.7rem 0 0 0;
    }

}


@media (max-width: 600px) {
    .contact-form-2 {
        max-width: 100%;
        padding: 0 10px;
    }
}

/* =================
        Modular kitchen
    ================= */

.modular-heading {
    display: flex;
    justify-content: center;
    align-items: center;
}

#interior_design {
    font-size: 1.5rem;
    font-weight: bold;
}

.content-p p {
    padding: 0 10rem;
    color: #2b2b2b;
    font-size: 0.8rem;
    text-wrap: wrap;
    font-weight: 600;
}

@media screen and (max-width: 768px) {
    .content-p p {
        padding: 0 2rem;
        color: #2b2b2b;
        font-weight: 600;
        font-size: 0.7rem;
    }

}

.modular-heading div {
    width: 90%;
}

#kitchen {
    justify-content: center;
    align-items: center;
    display: flex;
}

@media screen and (max-width: 787px) {
    #kitchen {
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

}

.wrapper-kitchen {
    text-align: center;
    /*margin-left: 5rem;*/
}

.kitchen-img-1 {
    background-image: url(../img/AdobeStock_100798377.jpg);
    background-position: center;
    background-size: cover;
}

.kitchen-img-2 {
    background-image: url(../img/Range2.jpg);
    background-position: center;
    background-size: cover;
}

.kitchen-img-3 {
    background-image: url(../img/Range3.jpg);
    background-position: center;
    background-size: cover;
}

.kitchen-img-4 {
    background-image: url(../img/Range4.jpg);
    background-position: center;
    background-size: cover;
}

.interior-img-4 {
    background-image: url(../img/Group-78.png);
    background-position: center;
    background-size: cover;
}

.kitchen-img-5 {
    background-image: url(../img/Group-100.png);
    background-position: center;
    background-size: cover;
}

.wardrobe-img-5 {
    background-image: url(../img/Group-98.png);
    background-position: center;
    background-size: cover;
}

.Vanity-img-5 {
    background-image: url(../img/Group-99.png);
    background-position: center;
    background-size: cover;
}

.Led-img-5 {
    background-image: url(../img/Group-96.png);
    background-position: center;
    background-size: cover;
}

.kitchen-parent {
    width: 47%;
    margin: 10px;
    height: 70vh;
    overflow: hidden;
    position: relative;
    display: inline-block;
    cursor: pointer;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}

.Range {
    width: 100%;
    background-size: cover;
    height: 100%;
    transition: all 1.1s;
}

.kitchen-parent:hover .Range {
    transform: scale(1.1);
}

.content-p {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0;
    transition: all 0.6s;

}

.content-p:hover {
    opacity: 1;
}

.content-p h2 {
    margin-bottom: 15px;
    color: #fff;
}

.content-p>* {
    transform: translateY(40px);
    transition: transform 0.6s;
    color: white;
}

.content-p:hover>* {
    transform: translateY(20px);
}


@media screen and (max-width: 786px) {
    .kitchen-parent {
        width: 100%;
        /*margin: 0px;*/
        height: 38vh;
    }
}

/* ==============
      css interior
    =============== */
#INTERIOR {
    justify-content: center;
    align-items: center;
    display: flex;
}

@media screen and (max-width: 786px) {
    #INTERIOR {
        justify-content: center;
        height: auto;

        align-items: center;
        flex-direction: column;
    }
}

.shaped-img-1 {
    background-image: url(../img/l_shaped.png);
    background-position: center;
    background-size: cover;
}

.shaped-img-2 {
    background-image: url(../img/u_shaped.png);
    background-position: center;
    background-size: cover;
}

.interior-img-3 {
    background-image: url(../img/home_interior_img3.jpg);
    background-position: center;
    background-size: cover;
}

.interior-img-1 {
    background-image: url(../img/home_interior_img1.jpg);
    background-position: center;
    background-size: cover;
}

.interior-img-2 {
    background-image: url(../img/home_interior_img2.jpg);
    background-position: center;
    background-size: cover;
}

.Island-img-1 {
    background-image: url(../img/SLAND.png);
    background-position: center;
    background-size: cover;
}

.Island-img-2 {
    background-image: url(../img/peninsula.png);
    background-position: center;
    background-size: cover;
}

.Parallel-img-1 {
    background-image: url(../img/paralle.png);
    background-position: center;
    background-size: cover;
}

.Parallel-img-2 {
    background-image: url(../img/sheilving.png);
    background-position: center;
    background-size: cover;
}

.u1_wardrobe-img-1 {
    background-image: url(../img/u4_wardrobe.png);
    background-position: center;
    background-size: cover;
}

.u1_wardrobe-img-2 {
    background-image: url(../img/u3_wardrobe.png);
    background-position: center;
    background-size: cover;
}

.u1_wardrobe-img-3 {
    background-image: url(../img/u2_wardrobe.png);
    background-position: center;
    background-size: cover;
}

.u1_wardrobe-img-4 {
    background-image: url(../img/u1_wardrobe.png);
    background-position: center;
    background-size: cover;
}

.u1_wardrobe-img-5 {
    background-image: url(../img/wardrobe-design-6.png);
    background-position: center;
    background-size: cover;
}

.u1_wardrobe-img-6 {
    background-image: url(../img/modularWardrobe5.jpg);
    background-position: center;
    background-size: cover;
}

/* ==============
    =============== */
#WARDROBE {
    justify-content: center;
    align-items: center;
    display: flex;
}

@media screen and (max-width: 786px) {
    #WARDROBE {
        justify-content: center;
        height: auto;

        align-items: center;
        flex-direction: column;
    }
}

.wardrobe-img-1 {
    background-image: url(../img/wardrobeimg-1.jpg);
    background-position: center;
    background-size: cover;
}

.wardrobe-img-2 {
    background-image: url(../img/wardrobeimg-2.jpg);
    /*     background-position: center;*/
    /*background-size: cover;*/
    background-size: 100% 100%;
}

.wardrobe-img-3 {
    background-image: url(../img/wardrobeimg-3.jpg);
    background-position: center;
    background-size: cover;
}

.wardrobe-img-4 {
    background-image: url(../img/wardrobeimg-4.jpg);
    background-position: center;
    background-size: cover;
}

/* ===============
       css vanity 
      =============== */
#vanity {
    justify-content: center;
    align-items: center;
    display: flex;
}

@media screen and (max-width: 786px) {
    #vanity {
        justify-content: center;
        align-items: center;
        height: auto;
        flex-direction: column;
    }
}

.Vanity-img-2 {
    background-image: url(../img/Vanity-img-1.jpg);
    background-position: center;
    background-size: cover;
}

.Vanity-img-1 {
    background-image: url(../img/Vanity-img-2.jpg);
    background-position: center;
    background-size: cover;
}

.Vanity-img-3 {
    background-image: url(../img/Vanity-img-3.jpg);
    background-position: center;
    background-size: cover;
}

.Vanity-img-4 {
    background-image: url(../img/Vanity-img-4.jpg);
    background-position: center;
    background-size: cover;
}


/* ===============
       css Led panel 
      =============== */
.underline,
.circle {
    position: relative;

}

.underline {
    justify-content: center;
    align-items: center;
    display: flex;
}

.circle-circle::after {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background-color: red;
    position: absolute;
    border-radius: 50%;
    top: 88%;
    left: 46%;
    transform: translate(-50%, -50%);
    animation: movecircle 4s ease-in-out infinite alternate;
    z-index: 3;
}

@keyframes movecircle {
    from {
        transform: translateX(0);
        background-color: yellowgreen;
    }

    to {
        transform: translateX(105px);
        background-color: rebeccapurple;
    }
}

.underline::after {
    content: '';
    display: block;
    width: 9%;
    height: 2px;
    background: black;
    position: absolute;
    bottom: 0px;
    left: 46%;
}

.Led-img-2 {
    background-image: url(../img/Led-img-1.jpg);
    background-position: center;
    background-size: cover;
}

.Led-img-1 {
    background-image: url(../img/Led-img-2.jpg);
    background-position: center;
    background-size: cover;
}

.Led-img-3 {
    background-image: url(../img/Led-img-3.jpg);
    background-position: center;
    background-size: cover;
}

.Led-img-4 {
    background-image: url(../img/Led-img-4.jpg);
    background-position: center;
    background-size: cover;
}

/* ============
    faq section
   ============= */
.accordian {
    width: 90%;
    max-width: 1000px;
    margin: 2rem auto;
}

.accordian-item {
    background-color: white;
    color: #111;
    margin: 1rem 0;
    border-radius: 0.5rem;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
}

.accordian-item-header {
    padding: 0.5rem 3rem 0.5rem 1rem;
    min-height: 3.5rem;
    line-height: 1.25rem;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    background: #efc567;
}

.accordian-item-header::after {
    content: "\002B";
    font-size: 2rem;
    font-weight: bold;
    position: absolute;
    right: 1rem;
    /* transition: all 0.2s ease; */
}

.accordian-item-header.active::after {
    content: "\2212";
}

.accordian-item-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.accordian-item-body-content {
    padding: 1rem;
    line-height: 1.5;
    border-top: 1px solid #34495e;
}

@media (max-width: 768px) {
    html {
        font-size: 14px;
    }
}

/*    =====================*/
/*   why choose us section*/
/*======================= */

.main-project-area.style2 {
    position: relative;
    display: block;
    padding-bottom: 10px;
    background-color: #0d1f36;
}

.main-project-area {
    /* position: relative;
  display: block; */
    background: #ffffff;
    padding: 20px 0 40px;
}

@media (min-width: 1200px) {
    .container2 {
        max-width: 1200px;
    }
}

.fact-counter {
    padding-top: 40px;
}

.nws img {
    max-width: 100%;
    height: auto;
}



@media screen and (max-width: 1200px) {
    .main-project-area.style2 {
        position: relative;
        display: block;
        padding-bottom: 10px;
        /*background-color: #d54e52;*/
        width: 100%;
    }
}

.slider124 {
    background-image: url(../img/active.jpg);
    background-size: cover;
    background-position: center;
}

.slider125 {
    background-image: url('../img/kitchen-slider.jpg');
    background-size: cover;
    background-position: center;
}

.slider126 {
    background-image: url('../img/slide1.jpg');
    background-size: cover;
    background-position: center;
}

.slider123 {
    background-image: url('../img/slide-0.jpg');
    background-size: cover;
    background-position: center;
}

.slider127 {
    background-image: url(../img/slide4.jpg);
    background-size: cover;
    background-position: center;
}

.slider128 {
    background-image: url(../img/slide3.jpg);
    background-size: cover;
    background-position: center;
}

.slider129 {
    background-image: url(../img/ethnic-kitchen-interior-3d-render-bright-color-generative-ai.jpg);
    background-size: cover;
    background-position: center;
}

@media screen and (max-width: 768px) {
    .slider124 {
        background-image: url(../img/active.jpg);
        background-size: 105%;
        background-position: 104% 100%;
        justify-content: flex-end;
        background-repeat: no-repeat;
    }

    .slider125 {
        background-image: url('../img/kitchen-slider.jpg');
        background-size: 105%;
        background-position: 104% 100%;
        justify-content: flex-end;
        background-repeat: no-repeat;
    }

    .slider126 {
        background-image: url('../img/slide1.jpg');
        background-size: 105%;
        background-position: 104% 100%;
        justify-content: flex-end;
        background-repeat: no-repeat;
    }

    .slider127 {
        background-image: url(../img/slide3.jpg);
        background-size: 105%;
        background-position: 104% 100%;
        justify-content: flex-end;
        background-repeat: no-repeat;
    }

    .slider128 {
        background-image: url(../img/slide4.jpg);
        background-size: 105%;
        background-position: 104% 100%;
        justify-content: flex-end;
        background-repeat: no-repeat;
    }

    .slider129 {
        background-image: url(../img/ethnic-kitchen-interior-3d-render-bright-color-generative-ai.jpg);
        background-size: 105%;
        background-position: 104% 100%;
        justify-content: flex-end;
        background-repeat: no-repeat;
    }

    .slider123 {
        background-image: url(../img/slide-0.jpg);
        background-size: 105%;
        background-position: 104% 100%;
        justify-content: flex-end;
        background-repeat: no-repeat;
    }

    .splide .splide__track .splide__list .splide__slide .slider-text {

        background: linear-gradient(to bottom, grey 98%, transparent);
        padding: 68px 35px;
        max-width: 100%;

        min-height: 42vh;
        display: flex;
    }

    .main-project-area {
        background: #ffffff;
        padding: 2px 43px 40px;
    }

    .slider-text .animation-box {
        font-size: 1.8rem !important;
    }

    .splide .splide__track .splide__list .splide__slide {
        max-width: 100%;
        min-height: 77vh !important;
        display: flex;
    }
}

/* ===================
   DROPDOWN SECTION
 ===================== */

#Packa-dom {
    display: none;
}

.package-dom {
    background: #ff7200;
    width: 290px;
    position: fixed;
    z-index: 9999;
    top: 10%;
    right: 9%;
}

.package-dom hr {
    color: #fff;
}

.package-dom ul {
    padding-top: 1.4rem;
    padding-left: 1rem !important;
}

.package-dom ul li {
    list-style: none;
    line-height: 6px;
}

.package-dom ul li a {
    text-decoration: none;

    .package-dom i {
        color: #fff;
        position: relative;
        font-size: 32px;
        left: 258px;
        bottom: 68px;
        /*display: none;*/
    }

    @media screen and (max-width: 768px) {
        .package-dom {
            background-color: #000;
            z-index: 9999;
            top: 0px;
            padding-top: 109px;
            height: 100vh;
            position: fixed;
            left: 0px;
            transform: translateX(-50%, -50%);
            transition: 1s;
        }

        #mein {
            position: relative;
            left: 0.5rem;
        }

        #mei {
            position: absolute;
            top: 251px;
            right: 6%;
        }

        .package-dom ul li a {
            z-index: 9999;
            color: #fff;

        }
    }

    #Packa-dom i {
        display: none;
    }

    @media screen and (max-width: 860px) {
        #Packa-dom i {
            display: block;
        }
    }



    /**************Contact form button*************/


    /**********************Our Team**********************/
    .our-team {
        padding-bottom: 20px;
        text-align: center;
    }

    .our-team .pic {
        display: inline-block;
        width: 220px;
        height: 220px;
        border-radius: 50%;
        background: #FABC3C;
        padding: 70px 20px 30px;
        margin-bottom: 20px;
        position: relative;
    }

    .our-team .social {
        padding: 0;
        margin: 22% 0 0 0;
        list-style: none;
    }

    .our-team .social li {
        display: inline-block;
        margin-right: 5px;
    }

    .our-team .social li a {
        display: block;
        width: 35px;
        height: 35px;
        border-radius: 50%;
        line-height: 35px;
        background: #7740ff;
        font-size: 15px;
        color: #fff;
    }

    .our-team .social li a:hover {
        background: #fff;
        color: #7740ff;
        text-decoration: none;
    }

    .our-team .pic img {
        width: 101%;
        height: 101%;
        border-radius: 50%;
        position: absolute;
        top: -1px;
        left: -1px;
        transition: all 0.6s ease 0s;
    }

    /* .our-team:hover .pic img{
            transform: rotate(-120deg);
            transform-origin: 95% 40% 0;
        } */
    .our-team .title {
        display: block;
        font-size: 20px;
        font-weight: 700;
        color: #7740ff;
        letter-spacing: 1px;
        margin-bottom: 15px;
        position: relative;
    }

    /* .our-team .title:after{
            content: "";
            width: 30px;
            height: 3px;
            background: #FABC3C;
            margin: 0 auto;
            position: absolute;
            bottom: -10px;
            left: 0;
            right: 0;
        } */
    .our-team .post {
        display: block;
        font-size: 15px;
        color: #333;
        text-transform: capitalise;
    }

    @media only screen and (max-width: 990px) {
        .our-team {
            margin-bottom: 30px;

        }

        .our-team .pic {
            width: 100vw;
            /*height: 220px;*/
        }
    }

    /*@media only screen and (max-width: 767px){*/
    /*    .our-team{ overflow: hidden; }*/
    /*}*/


}