:root {
  --primary-color: #e1ad3d;

  --secondary-color: #000000;

  --accent-color: #ffffff;

  --text-color: #333333;

  --background-color: #f9f9f9;

  --body-font: "Poppins", sans-serif;

  --heading-font: "Playfair Display", serif;

  --cursive-font: "Carattere", cursive;
}

@-webkit-keyframes animationFade {
  from {
    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;

    -webkit-transform: none;

    transform: none;
  }
}

@-o-keyframes animationFade {
  from {
    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;
  }
}

@keyframes animationFade {
  from {
    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;

    -webkit-transform: none;

    -o-transform: none;

    transform: none;
  }
}

html {
  overflow-x: hidden;
}

body {
  overflow-x: hidden;

  padding: 0;

  margin: 0;

  font-family: var(--body-font);

  background: #fff;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: var(--heading-font);
}

a {
  text-decoration: none;
}

.sec-pad {
  padding-top: 80px;
}

.section-heading {
  padding-bottom: 30px;
}

.section-heading h3 {
  font-family: var(--heading-font);

  font-weight: 700;

  color: #000;

  font-size: 40px;

  line-height: 40px;
}

/*--- HEADER   --*/

header {
  position: relative;

  z-index: 999;

  width: 100%;

  margin-bottom: 10px;
}

.header-show {
  position: fixed;

  top: 0;

  z-index: 999;

  width: 100%;

  background-color: #fff;

  -webkit-animation-name: animationFade;

  -o-animation-name: animationFade;

  animation-name: animationFade;

  -webkit-animation-duration: 1s;

  -o-animation-duration: 1s;

  animation-duration: 1s;

  -webkit-animation-fill-mode: both;

  -o-animation-fill-mode: both;

  animation-fill-mode: both;

  -webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);

  box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
}

.header-show .navbar {
  width: 100%;
}

.header-show .navbar .navbar-brand img {
  width: 60px !important;
}

.navbar {
  background: #fff8ea;

  padding: 0px;
}

.navbar-brand img {
  width: 70px;
}

.navbar-brand {
  position: relative;
}

.navbar-nav li {
  margin: 0px 24px;
}

.navbar-nav li a {
  font-weight: 600;

  color: var(--secondary-color);

  font-size: 16px;

  letter-spacing: 1px;

  padding: 4px 12px;

  display: inline-block;

  line-height: 30px;

  position: relative;

  transition: all 0.5s;

  font-family: var(--body-font);

  text-transform: uppercase;
}

.navbar-nav li a.active {
  color: var(--text-color);

  transition: all 0.5s;
}

.navbar-nav li a:hover {
  color: var(--text-color);

  transition: all 0.5s;
}

.navbar .navbar-nav .dropdown-menu {
  position: absolute;

  border-radius: 0px;

  border: 0px;

  background: #f8f9fa;

  padding-top: 24px;

  transition: all 0.7s;

  padding-bottom: 0px;
}

.dropdown-item {
  padding: 5px 15px;

  font-weight: 600;

  color: #000;

  background-color: transparent;

  border-left: 2px solid #000;

  line-height: 25px;

  transition: all 0.7s;
}

.dropdown-item:hover {
  color: #fff;

  background-color: #000;

  transition: all 0.7s;
}

.dropdown-menu li {
  margin: 5px 0px;
}

.dropdown-menu li:last-child {
  margin: 5px 0px 0px 0px;
}

.btn-header {
  background: var(--secondary-color);

  color: white;

  padding: 10px 20px;
}

.topbar {
  background: var(--secondary-color);

  padding: 4px 0;
}

.topbar ul li a {
  color: var(--accent-color);

  font-size: 13px;
}

/* ---    SLIDER_MAIN ---  */

.slider-main {
}

.carousel-indicators button {
  color: #fff;

  display: inline-block;
}

.carousel-indicators [data-bs-target] {
  text-indent: 0;

  height: 45px;

  width: 45px;

  background: var(--primary-color);

  opacity: 1;

  border: 0px;

  border-radius: 50%;
}

.carousel-indicators [data-bs-target].active {
  background: var(--secondary-color);
}

.carousel-indicators {
  position: absolute;

  right: 0;

  bottom: 10px;

  justify-content: center;

  left: 0;

  z-index: 2;

  padding: 0;

  margin-right: 0px;

  margin-left: 0px;

  margin-bottom: 0px;
}

.carousel-item {
  position: relative;

  padding: 0 10px;

  background: white;
}

.carousel-item .banner-text {
  position: absolute;

  width: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

  letter-spacing: 10px;

  font-family: "CaviarDreams";

  height: 100%;

  top: 150px;

  left: 0;

  text-align: center;
}

.carousel-item .banner-text h3 {
  font-size: 120px;

  font-weight: 700;

  color: #fff;

  text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.4), 0px 8px 13px rgba(0, 0, 0, 0.1),
    0px 18px 23px rgba(0, 0, 0, 0.1);
}

.banner-btn a {
  background: #000;

  color: #ffde89;

  padding: 10px 25px;

  border-radius: 25px;

  margin-top: 30px;

  text-decoration: none;

  font-size: 20px;

  font-weight: 500;

  letter-spacing: 2px;

  transition: all 0.5s;
}

.banner-btn a:hover {
  background: #412215;

  transition: all 0.5s;
}

.banner-btn a span {
  padding-left: 10px;
}

/*--- SERVICES   ---*/

.service-box {
  background: #ffc266;

  padding: 25px 35px;

  box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;

  min-height: 330px;
}

.service-image {
  text-align: center;
  background: #fff;
  padding: 15px;
  border-radius: 50%;
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.service-image img {
  width: auto;
  height: 50px;
  object-fit: contain;
}

.service-content {
  text-align: center;

  color: #000;
}

.service-content h4 {
  font-weight: 600;

  font-family: "Azonix";

  padding-top: 10px;

  font-size: 24px;
}

.service-content p {
  display: block;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  -webkit-box-orient: vertical;

  overflow: hidden;

  text-overflow: ellipsis;
}

.service-btn a {
  background: #000;

  color: #ffde89;

  padding: 8px 20px;

  border-radius: 25px;

  margin-top: 10px;

  text-decoration: none;

  font-size: 16px;

  font-weight: 500;

  display: inline-block;

  transition: all 0.7s;
}

.service-btn a:hover {
  background: #fff;

  color: #000;

  transition: all 0.7s;
}

.service-btn a span {
  padding-left: 10px;
}

/*--- ABOUT   ---*/

.about-main {
  padding-top: 80px;
}

.about-content a {
  padding: 8px 20px;

  border-radius: 25px;

  color: #fff;

  background: #000;

  display: inline-block;

  text-decoration: none;
}

.about-content {
  padding-left: 30px;
}

.abt-image,
.about-main {
  position: relative;
}

.abt-image {
  height: 500px;
}

.abt-image a:after {
  background: transparent;

  border: 10px solid #f68712;

  content: "";

  width: 100%;

  height: 100%;

  position: absolute;

  top: -10px;

  left: -10px;
}

.abt-image img {
  width: 100%;

  height: 100%;

  margin-top: 20px;

  margin-left: 20px;

  object-fit: cover;

  z-index: 9;
}

.abt-image:hover img {
  filter: hue-rotate(45deg);

  transition: all 0.8s;
}

.why-image img {
  height: 64px;

  width: 64px;

  filter: brightness(0);
}

.why-wrap {
  box-shadow: rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px;

  border-radius: 10px;
}

.why-text {
  padding: 15px;
}

#pr-slide_01 .item {
  height: 550px;
}

.owl-theme .owl-dots .owl-dot.active span {
  width: 15px;

  background: #fbc829;
}

.contact-wrap {
  background: rgba(0, 0, 0);

  padding: 35px 100px;

  z-index: 9;

  width: 100%;

  position: relative;
}

.contact-wrap .form-control {
  border-radius: 0px;

  color: #fff;

  background: transparent;

  height: 48px;

  box-shadow: none;

  border-bottom: 2px solid #fff;

  border-left: 0px solid #fff;

  border-right: 0px solid #fff;

  border-top: 0px solid #fff;

  padding-left: 0px;
}

.contact-wrap textarea.form-control {
  height: 150px;
}

.contact-wrap .form-control:focus {
  box-shadow: none;

  border-bottom: 2px solid #fff;

  border-left: 0px solid #fff;

  border-right: 0px solid #fff;

  border-top: 0px solid #fff;

  padding-left: 0px;
}

.contact-wrap ::placeholder {
  color: #fff;
}

.send-btn a {
  background: #fff;

  color: #000;

  padding: 8px 20px;

  border-radius: 25px;

  margin-top: 10px;

  text-decoration: none;

  font-size: 16px;

  font-weight: 500;

  display: inline-block;

  transition: all 0.7s;
}

/*--- PRODUCTS   ---*/

.gallery-two {
  padding-top: 80px;

  background: url(../images/gall-bg.jpg);

  background-size: cover;

  background-position: center center;

  background-repeat: no-repeat;

  position: relative;

  width: 100%;
}

#gallery_two .item {
  padding-bottom: 20px;
}

.product-box {
  position: relative;
}

.project-details {
  position: absolute;

  bottom: 0;

  transform: translate(-50%, 50%);

  left: 50%;

  padding: 10px;

  width: 80%;

  color: #000;

  text-align: center;

  background: #ffda68;

  padding: 5px 0px;

  border-radius: 10px;
}

.project-details h5 {
  font-size: 22px;

  font-weight: 600;

  margin-bottom: 10px;
}

.project-details p {
  padding-bottom: 0px;

  font-size: 16px;

  line-height: 22px;
}

.product-box img {
  width: 100%;

  object-fit: contain;
}

#gallery_two .owl-item .item .product-box {
  transform: scale(0.8);

  box-shadow: none;

  transition: all 1s;
}

#gallery_two .owl-item.active.center .item .product-box {
  width: 100% !important;

  transform: scale(1.1);

  transition: all 1s;

  box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px,
    rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
}

#gallery_two .owl-item .item .product-box img {
  border-radius: 15px;
}

#gallery_two .owl-stage-outer {
  padding: 50px 10px;
}

#gallery_two .owl-item .item .product-box .project-details {
  opacity: 0;
}

#gallery_two .owl-item.active.center .item .product-box .project-details {
  opacity: 1;
}

/*---    ABOUT MAIN   ---*/

/*---   TESTIMONIAL   ---*/

.testi-image {
  text-align: center;

  display: flex;

  justify-content: center;

  margin-bottom: 20px;

  position: relative;
}

.testi-image img {
  width: 100px !important;
  height: 100px;
  border-radius: 50%;
}

/*---  GALLERY   ---*/

.gallery-item {
  position: relative;
}

.gallery-item a {
  color: #fff;
}

.gallery-item a img {
  width: 100%;

  height: 100%;
}

.gallery-item a .cover {
  display: flex;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  font-size: 40px;

  width: 0%;

  height: 0%;

  justify-content: center;

  align-items: center;

  background: rgba(0, 0, 0, 0.7);

  opacity: 0;

  transition: all 0.5s;
}

.gallery-item:hover a .cover {
  width: 100%;

  height: 100%;

  opacity: 1;

  transition: all 0.5s;
}

.view-all {
  text-align: center;

  font-family: "Archivo", sans-serif;

  padding: 8px 25px;

  border: 2px solid #023047;

  border-radius: 25px;

  color: #fff;

  background: #023047;

  display: inline-block;

  text-decoration: none;

  font-weight: 600;

  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

  transition: all 0.5s;
}

.view-all:hover {
  background: #000;

  color: #fff;

  border: 2px solid #000;

  transition: all 0.5s;
}

/*---- CLIENT ---*/

.contact-home {
  padding-bottom: 40px;
}

.client-box {
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

#client-slide_01 .item {
  padding: 20px;
}

/*---- CONTACT   ----*/

.contact-map {
  height: 100%;

  padding: 0;

  margin: 0;
}

.contact-form {
  background: #000;

  height: 100%;

  padding: 45px 30px;
}

.contact-form .form-control {
  border-radius: 0px;

  border-bottom: 2px solid #fff;

  border-left: 0px solid #fff;

  border-right: 0px solid #fff;

  border-top: 0px solid #fff;

  height: 48px;

  padding-left: 0px;

  background: transparent;

  color: #fff;
}

.contact-form .form-control {
  border-radius: 0px;

  border-bottom: 2px solid #fff;

  border-left: 0px solid #fff;

  border-right: 0px solid #fff;

  border-top: 0px solid #fff;

  box-shadow: none;
}

.contact-form textarea.form-control {
  height: 150px;
}

.contact-form textarea.form-control::placeholder {
  color: #fff;
}

.contact-form input.form-control::placeholder {
  color: #fff;
}

.send-btn {
  margin-top: 10px;
}

.send-btn a {
  text-align: center;

  display: inline-block;

  width: 100%;

  background: #fff;

  color: #000;

  padding: 10px 0px;
}

/*----   FOOTER   ----*/

.footer {
  background: #fff8ea;

  padding-top: 50px;
}

.company-logo img {
  width: 120px;
}

.company-text {
  padding-right: 25px;
}

.qlink-wrapper h5,
.smedia-wrapper h5 {
  padding-bottom: 8px;

  margin-bottom: 20px;

  color: black;

  font-size: 22px;
}

.qlink-wrapper ul {
  list-style: none;

  padding-left: 0px;
}

.qlink-wrapper li {
  margin-bottom: 6px;
}

.qlink-wrapper li a {
  color: black;

  line-height: 30px;

  transition: all 0.5s;
}

.qlink-wrapper li a:hover {
  color: #c7760d;

  line-height: 30px;

  transition: all 0.5s;
}

.qlink-wrapper li a span {
  color: #fbc829;

  font-size: 20px;

  padding-right: 10px;
}

.smedia-wrapper ul {
  list-style: none;

  padding-left: 0px;

  display: flex;

  align-items: center;
}

.smedia-wrapper ul li {
  margin-right: 15px;
}

.smedia-wrapper ul li:last-child {
  margin-right: 0px;
}

.smedia-wrapper ul li a img {
  width: 30px;

  height: 30px;

  object-fit: contain;
}

.social-icons li a {
  display: inline-block;

  width: 40px;

  height: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

  color: white;

  background: black;
}

.copyright {
  background: #101010;

  color: #fff;

  font-size: 14px;

  padding: 8px 0px;

  text-align: center;
}

.copyright p span a {
  color: #fbc829;

  text-decoration: none;
}

/*--- CMS BANNER   ---*/

.cms-banner {
  position: relative;

  height: 450px;

  overflow: hidden;
}

.cms-banner img {
  width: 100%;

  height: 100%;

  object-fit: cover;
}

.cms-banner .cover {
  background: rgba(0, 0, 0, 0.6);

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;

  font-family: "CaviarDreams";

  display: flex;

  align-items: center;

  justify-content: center;
}

.cms-banner .cover h1 {
  color: #fff;

  font-size: 54px;

  font-weight: 700;

  text-align: center;

  text-transform: uppercase;
}

.cms-banner .cover p {
  text-align: center;

  padding: 25px 0px;
}

.cms-banner .cover p span {
  margin-right: 15px;

  color: #fffbc7;

  font-weight: 600;
}

.cms-banner .cover p a {
  margin-right: 15px;

  font-size: 24px;

  color: #fff;

  text-decoration: none;

  font-weight: 600;
}

.cnt-btn {
  position: fixed;

  bottom: 60px;

  right: 20px;

  z-index: 9999;
}

.call-btn img,
.whatsapp-btn img {
  width: 44px;

  height: 44px;
}

.call-btn {
  margin-bottom: 15px;
}

.detail-bx-wrap {
  height: 250px;

  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;

  padding: 15px;

  border-radius: 10px;
}

.detail-bx-icon {
  margin-left: auto;

  margin-right: auto;

  text-align: center;

  box-shadow: rgb(50 50 93 / 25%) 0px 2px 5px -1px,
    rgb(0 0 0 / 30%) 0px 1px 3px -1px;

  width: 100px;

  height: 100px;

  border-radius: 50%;

  display: flex;

  justify-content: center;

  align-items: center;
}

.detail-bx-icon img {
  width: 60px;

  height: 60px;
}

.details-bx-con {
  text-align: center;
}

.details-bx-con h5 a {
  color: #000;

  font-weight: 500;

  font-size: 20px;
}

.service-icon{
    width:80px;
    height:80px;
    display:flex;
    margin:0 auto;
    align-items:center;
    justify-content:center;
    background:#fff;
}

.service-icon img{
    width:54px !important;
    height:auto;
}