/*Banner Start*/
section:nth-of-type(2).s-block.s-block--fixed-banner.wide-placeholder .container{
    padding: 0;
    margin-top: -2.7vw;
    max-width: 100%;
    }
    section:nth-of-type(2).s-block.s-block--fixed-banner.wide-placeholder .container .banner--fixed img {
    border-radius: 0rem 0rem 5rem 5rem !important;
}
@media (max-width: 991px) {
section:nth-of-type(2).s-block.s-block--fixed-banner.wide-placeholder .container{
    padding: 0;
    margin-top: -8vw !important;
    max-width: 100%;
    }
        section:nth-of-type(2).s-block.s-block--fixed-banner.wide-placeholder .container .banner--fixed img {
    border-radius: 0rem 0rem 1.6rem 1.6rem !important;
}
    .w-24 {
    width: 4rem;
    }
}
div.kayan-banners.py-10.overflow-hidden {
margin-top: -6.5rem;
}
div.flex.lg:flex-nowrap.flex-wrap.gap-8.w-full.h-full.items-center.justify-center {
flex-wrap: nowrap !important;
}
div.kayan-features.px-10.py-10.border-black.overflow-hidden {
    padding-left: 0rem !important;
    padding-right: 0rem !important;
}
.banner--fixed img {
--tw-bg-opacity: 0;
}
/*Banner End*/

#app::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: fixed;
  opacity: .25;
  z-index: -1;
  background-position: bottom center !important;
  background-repeat: repeat !important;
  background-size: 10vw !important;
  background-image: linear-gradient(92.83deg,#fcf0d4 0,#fcf0d4 100%) !important;
  content: "";
  display: block;
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%;
}
body {
  font-weight: 600 !important;
  background-color: #fcf0d4 !important;
  color: var(--main-text-color);
}
.s-products-slider-card {
  border-radius: 3rem !important;
  perspective: 1000px;
}

.s-products-slider-card {
  padding-top: 50px;
  /* border-radius: 10px; */
  border: 3px solid rgb(255, 255, 255);
  transform-style: preserve-3d;
  background: linear-gradient(135deg,#0000 18.75%,#f3f3f3 0 31.25%,#0000 0),
      repeating-linear-gradient(45deg,#f3f3f3 -6.25% 6.25%,#ffffff 0 18.75%);
  background-size: 60px 60px;
  background-position: 0 0, 0 0;
  background-color: #f0f0f0;
  width: 100%;
  box-shadow: rgba(142, 142, 142, 0.3) 0px 30px 30px -10px;
  transition: all 0.5s ease-in-out;
}

.s-products-slider-card:hover {
  background-position: -100px 100px, -100px 100px;
  transform: rotate3d(0.5, 1, 0, 30deg);
}

.s-products-slider-card {
  background: #182B4C;
  /* border-radius: 10px 100px 10px 10px; */
  transition: all 0.5s ease-in-out;
  padding: 60px 25px 25px 25px;
  transform-style: preserve-3d;
}

.s-products-slider-card h4{
  display: inline-block;
  color: white;
  font-size: 25px;
  font-weight: 900;
  transition: all 0.5s ease-in-out;
  transform: translate3d(0px, 0px, 50px);
}


.content-box .card-title:hover {
  transform: translate3d(0px, 0px, 60px);
}

.s-button-element:not(:disabled):not([loading]) {
  background: #D1AB7A !important;
  margin-top: 10px;
  font-size: 12px;
  font-weight: 700;
  color: #f2f2f2;
  transition: all 0.5s ease-in-out;
  transform: translate3d(0px, 0px, 30px);
}

.kayan-footer  {
  --black-700: hsla(0 0% 12% / 1);
  --border_radius: 9999px;
  --transtion: 0.3s ease-in-out;
  --offset: 2px;

  cursor: pointer;
  position: relative;

  display: flex;
  align-items: center;
  gap: 0.5rem;

  transform-origin: center;

  padding: 1rem 2rem;
  background-color: transparent;

  border: none;
  border-radius: var(--border_radius);
  transform: scale(calc(1 + (var(--active, 0) * 0.1)));

  transition: transform var(--transtion);
}

.kayan-footer::before {
   content: ""; 
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 100%;
  height: 100%;
  background-color: var(--black-700);

  border-radius: var(--border_radius);
  box-shadow: inset 0 0.5px hsl(0, 0%, 100%), inset 0 -1px 2px 0 hsl(0, 0%, 0%),
    0px 4px 10px -4px hsla(0 0% 0% / calc(1 - var(--active, 0))),
    0 0 0 calc(var(--active, 0) * 0.375rem) hsl(260 97% 50% / 0.75);

  transition: all var(--transtion);
  z-index: -1;
}

.kayan-footer::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 100%;
  height: 100%;
  background-color: rgba(243,231,129,1);
  background-image: radial-gradient(
      at 51% 89%,
      hsla(266, 45%, 74%, 1) 0px,
      transparent 50%
    ),

 linear-gradient(171deg, rgba(2,0,36,1) 0%, rgba(243,231,129,1) 8%, rgba(41,44,45,1) 100%); 
  background-position: top;

  opacity: var(--active, 0);
  border-radius: var(--border_radius);
  transition: opacity var(--transtion);
  z-index: 2;
}
.kayan-footer li * {
  color: #fff !important;
}
.kayan-footer h5 {
  min-width: 100%;
}
.kayan-footer h5 {
  /*! height: 50px; */
  /*! margin: 5px; */
  /*! width: 120px; */
  background: #333 !important;;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  cursor: pointer;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: solid #404c5d 1px;
  font-size: 16px;
  color: rgb(161, 161, 161);
  -webkit-transition: 500ms;
  transition: 500ms;
  border-radius: 5px;
  background: linear-gradient(145deg, #2e2d2d, #212121);
  -webkit-box-shadow: -1px -5px 15px #41465b, 5px 5px 15px #41465b,
    inset 5px 5px 10px #212121, inset -5px -5px 10px #212121;
  box-shadow: -1px -5px 15px #41465b, 5px 5px 15px #41465b,
    inset 5px 5px 10px #212121, inset -5px -5px 10px #212121;
  text-align: center;
  border-radius: 2rem !important;
}

.kayan-footer h5:hover {
  -webkit-box-shadow: 1px 1px 13px #20232e, -1px -1px 13px #545b78;
  box-shadow: 1px 1px 13px #20232e, -1px -1px 13px #545b78;
  color: #d6d6d6;
  -webkit-transition: 500ms;
  transition: 500ms;
}

.kayan-footer h5:active {
  -webkit-box-shadow: 1px 1px 13px #20232e, -1px -1px 33px #545b78;
  box-shadow: 1px 1px 13px #20232e, -1px -1px 33px #545b78;
  color: #d6d6d6;
  -webkit-transition: 100ms;
  transition: 100ms;
}




.s-products-slider-card .s-product-card-price,
.kayan-card .s-product-card-price {
    color: rgba(243,231,129,1) !important;
  }

  .s-products-slider-card .s-product-card-price {
    color: rgba(243,231,129,1) !important;
  }
  footer .md\:flex > div {
    background: #000 !important;
    min-width: 33%
  }
  
  /* From Uiverse.io by dylanharriscameron */ 
  footer .md\:flex > div {
    position: relative;
    border-radius: 14px;
    z-index: 1111;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 20px 20px 60px #000, -20px -20px 60px #545454;
    ;
  }
  
  
.kayan-header  {
    background: #182B4C !important;;
}
.navbar  {
    background: #F8C292 !important;
  border-radius: 0 0 3rem 3rem !important;
}
[class*=" sicon-"], [class^="sicon-"] {
   background: #F8C292 !important;
  padding:5px;
  border-radius: 2rem !important;
}
  
.kayan-card {
  
}

.kayan-card {
  border-radius: 3rem !important;
  perspective: 1000px;
 
}
.px-10 {
  padding: 10px !important;
}

.kayan-card {
  padding-top: 50px;
  /* border-radius: 10px; */
  border: 3px solid rgb(255, 255, 255);
  transform-style: preserve-3d;
  background: linear-gradient(135deg,#0000 18.75%,#f3f3f3 0 31.25%,#0000 0),
      repeating-linear-gradient(45deg,#f3f3f3 -6.25% 6.25%,#ffffff 0 18.75%);
  background-size: 60px 60px;
  background-position: 0 0, 0 0;
  background-color: #f0f0f0;
  width: 100%;
  box-shadow: rgba(142, 142, 142, 0.3) 0px 30px 30px -10px;
  transition: all 0.5s ease-in-out;
}
.flex.items-center.justify-center.flex-col.gap-2.aos-init.aos-animate i {
  padding: 22px !important;
}

.kayan-card:hover {
  background-position: -100px 100px, -100px 100px;
  transform: rotate3d(0.5, 1, 0, 30deg);
}

.kayan-card {
  background: #182B4C;
  /* border-radius: 10px 100px 10px 10px; */
  transition: all 0.5s ease-in-out;
  padding: 60px 25px 25px 25px;
  transform-style: preserve-3d;
}

.kayan-card h4{
  display: inline-block;
  color: white;
  font-size: 20px;
  font-weight: 900;
  transition: all 0.5s ease-in-out;
  transform: translate3d(0px, 0px, 50px);
}
.kayan-card  {
  padding-left: 5px !important;
  padding-right: 5px !important;
}
.kayan-card  .px-6 {
  padding-left: 2px !important;
  padding-right: 2px !important;
}
.kayan-card  .px-6 h4 {
  font-size: 14px !important;
}
div.kayan-features.px-10.py-10.border-black.overflow-hidden {
  background: #0E2046;
  border-radius: 0 !important;
}
div.kayan-features.px-10.py-10.border-black.overflow-hidden * {
  color: #fff !important;
}
.kayan-footer {
    background: #0E2046 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
.kayan-footer::before {
  display: none !important;
  border-radius: 0 !important;
}
footer .md\:flex > div {
  background: #F8C292 !important;
  box-shadow: unset !important;
    min-height: 200px;
  justify-content: flex-start !important;
}
.kayan-footer h5 {
  box-shadow: unset !important;
  background: transparent !important;
  border-radius: 0 !important;
  border: none !important;
  border-bottom: #545454 solid 3px !important;
  max-width: 90% !important;
  min-width: 90% !important;
  color: #545454 !important;

}
footer .md\:flex > div * {
  color: #545454 !important;
  font-size: 15px !important;
}

@media screen and (max-width: 767px) {
.kayan-card .px-6 h4 {
  font-size: 14px !important;
   min-height: 52px !important;
  max-height: 52px !important;
  overflow: hidden;
}
}

.kayan-card .s-button-element:not(:disabled):not([loading]) {
  max-width: 85% !important;
  margin: 0 7.5% 10px auto !important;
}
.s-products-slider-card.swiper-slide {
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}
.kayan-card {

  padding: 5px;
  
}
.kayan-card  img {
  border-radius: 3rem !important;
}
.kayan-card .px-6 {
    padding-left: 2px !important;
    padding-right: 2px !important;
    flex-direction: column;
    display: flex;
}
.kayan-card .px-6 h4 {
        font-size: 14px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        overflow: hidden;
    }