:root {
  --white: #ffffff;
  --black: #000000;
  --yellow: #FFC107;
  --blue: #002F6C;
}

/*-------------- Owl crousel ---------------*/
body.home{
  background-color: #fff;
}
/* SLIDER */
#slider {
  position: relative;
  padding: 0px;
}
.slider-inner-bg-image:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 79%;
  height: 100%;
  background: var(--dark-blue);
  opacity: 0.7;
  clip-path: polygon(0% 100%, 55.186% 0%, 100.077% 0%, 100.077% 100%, 0% 100%);
  z-index: 1;
}
.slider-inner-bg-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slider-inner-bg-image{
  height: 700px;
  width: 100%;
  position: relative;
  z-index: 0;
}
.slider-content-column {
  justify-content: center;
  border-left: 3px solid var(--yellow);
  padding: 50px 70px 20px 70px !important;
  position: relative;
}
.slider-content-column:after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 37%;
  height: 3px;
  background: var(--yellow);
}
#slider .slider-content-box:after {
  content: '';
  position: absolute;
  top: 0%;
  left: 39.2%;
  width: 3px;
  height: 50px;
  background: var(--yellow);
  z-index: -1;
}
.slider-content-column:before{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 90%;
  height: 3px;
  background: var(--yellow);
}
.slider-box:before {
  bottom: 20px;
  content: '';
  position: absolute;
  background: var(--yellow);
  width: 90%;
  height: 3px;
  left: 0;
  right: 0;
  margin: auto;
}
.slider-icon-image {
  width: fit-content;
  position: absolute;
  z-index: 1;
  background: var(--dark-blue);
  border: 2px solid var(--yellow);
  padding: 8px;
  bottom: -25px;
}
#slider .slide-small-heading{
  background: #fff;
  color: var(--dark-blue);
  padding: 10px 35px 10px 15px;
  clip-path: polygon(0 0, 100% 0, 82% 100%, 0% 100%);
  font: 600 14px / 22px var(--pri-font);
}
#slider h5 {
  font: 600 22px / 30px var(--sec-font);
}
.slider-para {
  color: #fff;
  width: 70%;
  margin: auto;
  background: var(--yellow);
  padding: 20px 30px;
  font: 600 16px / 22px var(--pri-font);
}
.slider-content-main-box{
  position: absolute;
  left: 0;
  right: 0;
  top: 35%;
  z-index: 1;
}
.slider-touch-form-box h3{
  font: 700 28px / 35px var(--pri-font);
}
#slider .owl-dots {
  display: flex;
  margin: auto;
  position: relative;
  top: -60px;
  width: fit-content;
  gap: 6px;
}
#slider .owl-carousel button.owl-dot {
  background: var(--yellow);
  border: none;
  width: 15px;
  height: 4px;
  border-radius: 5px;
}
#slider .owl-carousel button.owl-dot.active{
  background: var(--white) !important;
  width: 40px;
}
.slider-inner-right-image {
  position: absolute;
  bottom: 20px;
  right: 20px;
  height: 400px;
  width: 200px;
  z-index: 2;
  animation: bouncess 2s ease-in-out 0s infinite alternate;
  animation-delay: 0.8s;
}
.slider-inner-right-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}



.abt-icon {
  position: relative;
  z-index: 1;
  padding: 10px;
}
.abt-icons1 {
  left: -33px;
  width: 50px;
  height: 50px;
  animation: bouncess 2s ease-in-out 0s infinite alternate;
  animation-delay: 0.8s;
  bottom: 0px;
}
.abt-icons-gradeint {
  background: linear-gradient(var(--gradient-angle), rgba(255, 255, 255, 1), rgba(58, 58, 58, 1));
  animation: rotation 5s linear 0s infinite normal forwards;
  backdrop-filter: blur(50px);
  margin: 0 auto;
  /* height: 300px; */
  width: 54px;
  height: 54px;
  position: absolute;
  inset: 0 0 0 -2px;
  z-index: -1;
  margin: auto;
}
.abt-img-wrap img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  padding: 7px;
  object-fit: contain;
}
.abt-icon::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--dark-blue);
  padding: 14px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(5px);
  z-index: -1;
}



@keyframes bouncess{
  0% {
      -webkit-transform: translateY(0px);
      transform: translateY(0px);
  }
  100% {
      -webkit-transform: translateY(-30px);
      transform: translateY(-15px);
  }
}

















#slider .top {
  animation: sanimateTop 7s ease-in-out infinite;
}
#slider .top {
  top: 0;
  left: 0;
  /* width: 40%; */
  height: 4px;
  background: linear-gradient(90deg, #b4b4b4 0%, var(--blue) 47.5%, var(--dark-blue) 100%);
  z-index: 1;
}

#slider .bottom {
  animation: sanimateBottom 7s ease-in-out infinite;
}
#slider .bottom {
  right: 0;
  bottom: 0;
  height: 4px;
  background: linear-gradient(90deg, #b4b4b4 0%, var(--blue) 47.5%, var(--dark-blue) 100%);
}
#slider .left {
  animation: sanimateLeft 7s ease-in-out infinite;
}
#slider .left {
  left: -4px;
  bottom: 0;
  width: 4px;
  height: 4px;
  background: linear-gradient(110deg, #b4b4b4 0%, var(--blue) 47.5%, var(--dark-blue) 100%);
}

#slider .right {
  animation: sanimateRight 7s ease-in-out infinite;
}
#slider .right {
  top: -45%;
  left: 35.2%;
  width: 4px;
  height: 0;
  background: linear-gradient(90deg, #F2E496 0%, #B3892D 47.5%, #BA983C 100%);
  z-index: 2;
}

#slider .animate-border {
  position: absolute;
}

@keyframes sanimateTop{
  25% {
    width: 37%;
    opacity: 1;
  }
  30%, 100% {
      opacity: 0;
  }
}
@keyframes sanimateLeft{
  0%, 75% {
    opacity: 0;
    bottom: 0;
    height: 0;
  }
  100% {
      opacity: 1;
      height: 100%;
  }
}
@keyframes sanimateBottom{
  0%, 50% {
    opacity: 0;
    width: 0;
  }
  75% {
      opacity: 1;
      width: 100%;
  }
  76%, 100% {
      opacity: 0;
  }
}

@keyframes sanimateRight{
  0%, 25% {
    opacity: 0;
    height: 0;
  }
  50% {
      opacity: 1;
      height: 45%;
  }
  55%, 100% {
      height: 45%;
      opacity: 0;
  }
}

.slider-down-icon-svg{
  position: absolute;
  bottom: -18px;
  z-index: 1;
  left: 0;
  right: 0;
  margin: auto;
  width: fit-content;
  background: var(--yellow);
  padding: 9px 10px;
  animation: bouncess 5s ease-in-out 0s infinite alternate;
}