* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  outline: none;
  /* font-family: Lato, sans-serif; */
}

a {
  text-decoration: none;
}

li {
  list-style: none;
}

.contact-btn {
  display: inline-block;
  border: 1px solid #907cff;
  color: #907cff;
  padding: .5rem 1rem;
  text-decoration: none;
  font-size: 1rem;
  text-transform: capitalize;
  font-weight: 700;
  border-radius: 5px;
  text-align: center;
}

.send-btn {
  display: inline-block;
  background-color: #907cff;
  color: #fff;
  padding: .5rem .6rem;
  text-decoration: none;
  font-size: 1rem;
  text-transform: capitalize;
  border-radius: 5px;
  text-align: center;
}

.send-btn:hover {
  color: #fff;
  box-shadow: rgba(86, 86, 175, 0.942) 0px 30px 60px -12px inset, rgba(134, 111, 235, 0.876) 0px 18px 36px -18px inset;
}

.read-more {
  display: inline-block;
  border: 1px solid #fff;
  color: #fff;
  padding: .5rem .6rem;
  text-decoration: none;
  font-size: 1rem;
  text-transform: capitalize;
  border-radius: 5px;
  text-align: center;
  transition: background-color .3s ease-in;
}

.read-more:hover {
  background-color: #fff;
  border-color: #fff;
  color: #907cff;
}

section {
  padding: 5px 3%;
}

/* ----------------moblie_header-------------- */

.moblie_header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  box-shadow: rgba(196, 194, 194, 0.25) 0px 25px 50px -12px;
  z-index: 9999;
  padding: 10px 3%;
}

.moblie_header .icon_container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.moblie_header .icon_container .bars_logo {
  display: flex;
  align-items: center;
  gap: 5px;
}

.moblie_header .icon_container .menubtn {
  border: 1px solid #ddd;
  padding: 5px 8px;
  cursor: pointer;
}

.moblie_header .icon_container .menubtn i {
  font-size: 1.2rem;
}

.moblie_header .icon_container .bars_logo .logo_h5 {
  display: none;
}

.moblie_header .icon_container .bars_logo .logo_h5.active {
  display: inline;
}

.moblie_header .icon_container .right_icon {
  display: flex;
  align-items: center;
}

.moblie_header .icon_container .right_icon .mess i {
  border: 1px solid #333;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  cursor: pointer;
}

.moblie_header .navbar_container {
  position: absolute;
  top: 0%;
  left: -120%;
  width: 80%;
  height: 100vh;
  background-color: #fff;

  z-index: 999;
  transition: left .3s linear;
}

.moblie_header .navbar_container.active {
  left: 0%;
  box-shadow: 0 10px 100vw 300px rgba(34, 29, 29, 0.731);
}

.moblie_header .navbar_container .heading {
  background-color: #009577;
  display: block;
  width: 100%;
  margin-top: -8px;
  text-align: center;
  padding: .5rem 1.5rem;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.moblie_header .navbar_container .heading .close-btn {
  cursor: pointer;
  font-size: 1.6rem;
}


.moblie_header .navbar_container .navbar>ul {
  width: 100%;
  margin-top: 2rem;
  padding: 0 1.6rem;
}

.moblie_header .navbar_container .navbar ul li a {
  color: #333;
  text-transform: capitalize;
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.moblie_header .navbar_container .submenu {
  display: none;
  list-style: none;
  padding-left: .5rem;
  margin-left: 2rem;
  transition: all 0.3s ease;
  border-left: 1px solid #f72475;
}

.moblie_header .navbar_container .submenu.service_submenu{
  height: 20rem;
  overflow-y: auto;
  scroll-behavior: smooth;
}

.moblie_header .navbar_container .submenu.service_submenu::-webkit-scrollbar{
  width: 8px;
  background-color: rgb(208, 202, 202);
}
.moblie_header .navbar_container .submenu.service_submenu::-webkit-scrollbar-thumb{
  width: 5px;
  background-color: #009577;
  border-radius: 20px;
}



.moblie_header .navbar_container .nav-item.active>.submenu {
  display: block;
}

.nav-item.active > a.nav-link {
  color: #009577 !important;
}

.nav-item.active .dropdown-icon i {
  color: #009577;
}

.moblie_header .navbar_container .navbar .dropdown-icon {
  margin-left: 5px;
  transition: transform 0.3s ease;
}

.moblie_header .navbar_container .nav-item.active .dropdown-icon i {
  transform: rotate(180deg);
  /* Flip the chevron when open */
}

/* ---------------header start------------ */

.header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  padding: 10px 2%;

}

.header .header_left .logo{
  display: flex;
  align-items: center;
  gap: 5px;
  text-decoration: none;
}
.header .header_left h1 {
  font-size: 1.5rem;
  list-style: 0;
}

.header .header_left p {
  line-height: 0;
  margin-bottom: .3rem;
}

.header .header_center ul {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 0;
}



.header .header_center ul li a {
  text-decoration: none;
  font-size: 1.3rem;
  font-weight: 100;
  color: #000;
  text-transform: uppercase;
  padding: 91px 10px 6px;
}

.header .header_center ul li a:hover,
.header .header_center ul li a.active {
  background-color: #907cff;
  color: #fff;

}

.header .header_right .conatct_number {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.header .header_right .conatct_number .contact-btn i {
  font-size: 1.6rem;
  transform: rotate(-26deg);
}

/* --------------menu_container ------------- */
.menu_container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 2%;
  background-color: #eee;
  position: relative;
  z-index: 999;
}

.menu_container .range {
  
 
  padding: 16px 5px 16px 5px;
}

.menu_container .range:hover{
  background-color: #907cff;
  color: #fff;
}

.menu_container .range h5 a{
  text-decoration: none;
  color: #907cff;
  margin-bottom: 0;
   cursor: pointer;
   border-right: 2px solid #907cff;
   padding-right: 10px;
}
.menu_container .range:hover h5 a{
  color: #fff;
}
.menu_container .all_menu ul {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 0;
}



.menu_container .all_menu ul li a {
  text-decoration: none;
  color: #333;
  border-right: 1px solid #666;
  padding-right: 8px;
}

.menu_container .all_menu ul li:last-child a {
  border-right: none;
}

.menu_container .all_menu ul li:hover a,
.menu_container .all_menu ul li.active a {
  color: #907cff;
}

.menu_container .search_bar {
  border: 1px solid #ddd;
  padding: .5rem 2rem;
  border-radius: 5px;
  background-color: #fff;
  display: flex;
  align-items: center;
}

.menu_container .search_bar input {
  background-color: transparent;
  border: none;
  outline: none;
  font-size: 1.3rem;
  font-weight: 300;
}


.menu_container .search_bar i {
  font-size: 1.5rem;
}

/* Container for dropdown */
.menu_container .all_menu ul .dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown button or trigger */
.menu_container .all_menu ul .dropdown-button {
  padding: 10px 20px;
  color: white;
  cursor: pointer;
  /* border-radius: 5px; */
}

.menu_container .all_menu ul .dropdown-button:hover {
  background-color: #fff;
}

/* Hidden dropdown content */
.menu_container .all_menu ul .dropdown-content {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  background-color: white;
  /* min-width: 160px; */
  width: max-content;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  z-index: 1;
  /* border-radius: 5px; */
  overflow: hidden;
}

/* Dropdown links */
.menu_container .all_menu ul .dropdown-content a {
  color: black;
  padding: 10px 15px;
  text-decoration: none;
  display: block;
}

.menu_container .all_menu ul .dropdown-content a:hover {
  /* background-color: #f1f1f1; */
  color: #907cff;
}

/* Show dropdown on hover */
.menu_container .all_menu ul .dropdown:hover .dropdown-content {
  display: block;
}

/* -----------------slider_home---------------- */
.slider_home {
  padding: 10px 2%;
}

.slider_home .card_box {
  position: relative;
  border: 1px solid #eee;
  height: 420px;
}

.slider_home .card_box .image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.slider_home .card_box .image img {
  width: 100%;
  height: 100%;
}

.slider_home .card_box .content {
  position: absolute;
  bottom: -13%;
  padding: 2rem 0;
  width: 100%;
  background-color: rgba(43, 26, 32, .74);
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: #fff;
  transition: bottom .3s linear;
}

.slider_home .card_box:hover .content {
  bottom: 0%;
}

.slider_home .card_box .content a {
  color: #fff;
}

.slider_home .swiper-button-prev,
.slider_home .swiper-button-next {
  width: 2rem;
  height: 2rem;
  border: 1px solid #907cff;
  background-color: #907cff;
  border-radius: 50%;
}

.slider_home .swiper-button-prev:after,
.slider_home .swiper-button-next:after {
  font-size: 1.2rem;
  color: #fff;
}

/* ---------------------BankingServices------------ */

.BankingServices {
  background-color: #907cff;
}

.BankingServices .heading {
  color: #fff;

}

.BankingServices .box {
  border-right: 2px solid #fff;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  padding: 0 10px;
}

.BankingServices .box .icon i {
  font-size: 2rem;
}

.BankingServices .box p {
  margin-bottom: 0;
}

.BankingServices .box:nth-child(4) {
  border-right: none;
}

.BankingServices .contactus {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  margin-top: 2.5rem;
}

.BankingServices .contactus p {
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
}

.BankingServices .contactus .contact-btn {
  font-size: 1.5rem;
  font-weight: 500;
  padding: .5rem 2rem;
}

/* -----------------services ---------------- */
.services .heading {
  text-align: center;

}

.services .heading h2 {
  position: relative;
}

.services .heading h2::before {
  position: absolute;
  bottom: -4px;
  content: '';
  height: 4px;
  width: 10%;
  background-color: #907cff;
  border-radius: 20px;
}

.services .box {
  padding: 10px;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  border-radius: 10px;
}

.services .box .image {
  width: 100%;
  height: 12rem;
  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
}

.services .box .image img {
  width: 100%;
  height: 100%;
}

.services .box .content {
  padding: 10px;
}

.services .box .content .h4 a {
  color: #444;
  text-decoration: none;
}

.services .box .content .h4:hover a {
  color: #907cff;

}

.services .box .content ul {
  padding-left: 0;
}

.services .box .content ul li a {
  color: #555;
  text-decoration: none;
  font-size: 1.1rem;
  transition: color .3s linear;
}

.services .box .content ul li {
  border-bottom: 1px dotted #666;
  padding: 10px 0;
}

.services .box .content ul li:hover a {
  color: #907cff;
}

.services .box .content .View {
  text-align: center;
  color: #000;
  font-size: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.services .contactus {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 3rem;
}


.services .contactus .contact-btn {
  padding: .5rem 1.7rem;
  font-size: 1.3rem;
  transition: background-color .3s ease-in;
}

.services .contactus .contact-btn:hover {
  background-color: #907cff;
  color: #fff;
}

.services_video .video-frame {
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
}

.services_video .video-frame video,
.services_video .video-frame iframe{
  width: 100%;
  height: 100%;
}

.services_video .video_container .video-frame {
  height: 10rem;
}

.services_video .video_container h5 {
  color: #907cff;
  font-size: 1rem;
  margin-bottom: 0;
  margin-top: .3rem;
}

/* --------------------contact_section----------------  */

.contact_section .address{
  background-color: #907cff;
  color: #fff;

}

.contact_section .address .title{
  border-bottom: 1px solid #fff;
  padding: 10px 15px;
}


.contact_section .address .box{
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  text-transform: capitalize;
}

.contact_section .address .box h4{
  text-transform: uppercase;
}

.contact_section .address .box i{
  font-size: 2rem;
}

.contact_section .address .box a.get-btn{
  color: #fff;
  font-size: 1rem;
  text-decoration: none;
  border: 1px solid #eee;
  padding: 5px 10px;
}
.contact_section .address .box .modal  .modal-dialog{
  margin-top: 6rem;
}
.contact_section .address .box .modal .modal-body span{
    color: #333;
}

.contact_section .address .box .modal .modal-body .input-box{
  border: 1px solid #009577;
  padding: 5px 10px;
  border-radius: 5px;
  width: 70%;
}

.contact_section .address .box .modal .modal-body .input-box label{
  color: #333;
  background-color: #eee;
  padding: 5px 10px;
}

.contact_section .address .box .modal .modal-body .input-box input{
  border: none;
  outline: none;
}

.contact_section .address .box .modal .modal-body p{
  color: #666;
  margin-top: 10px;
  font-size: 14px;
}


.contact_section .address .box .modal .modal-body .submitbtn{
  background-color: #009577;
  border: none;
  outline: none;
  color: #fff;
  padding: 8px 20px;
  font-size: 1.1rem;
  border-radius: 3px;
  width: 40%;
  transition: background-color .3s linear;
}
.contact_section .address .box .modal .modal-body .submitbtn:hover{
  background-color: #086150;
}

/* -----------------------price section --------------   */
.home_banner ul{
  display: flex;
  align-items: center;
  gap: 5px;
  list-style: none;
  padding-left: 0;
}

.home_banner ul li a{
  font-size: 1rem;
  color: #666;
  text-decoration: none;
  text-transform: capitalize;
}
.home_banner ul li a.active{
  color: #000;
}

.media_banners{
  box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
}
.media_banners .thumb-img {
  width: 100%;
  height: 60px;
  object-fit: cover;
  margin-bottom: 10px;
  border: 2px solid transparent;
  border-radius: 4px;
  cursor: pointer;
  transition: 0.3s ease;
}
.media_banners .thumb-img:hover,
.media_banners .thumb-img.active {
  border-color: #9370db;
}

#mainMedia img {
  max-height: 315px;
  width: 100%;
  border-radius: 6px;
}
#mainMedia iframe{
  max-height: 515px;
  width: 100%;
  border-radius: 6px;
  height: 10rem;
}
.media_banners .price {
  font-size: 22px;
  font-weight: bold;
}
.media_banners .btn-quote {
  background-color: #9370db;
  color: white;
  font-weight: 500;
}
.media_banners .btn-quote:hover {
  background-color: #7a5cc9;
}
.media_banners .media-thumbs {
  max-height: 270px;
  overflow-y: hidden;
}
.media_banners .media_banner_swiper{
  /* overflow: inherit !important; */
  padding: 2rem 0;
}
.media_banners .media_banner_swiper .swiper-wrapper{
  flex-direction: column;
  /* overflow: hidden; */
  /* height: 400px; */
}

.media_banners .media_banner_swiper .swiper-wrapper .swiper-slide{
  width: 100% !important;
  height: 100% !important;
}

.media_banners .swiper-button-next{
  position: absolute;
  top: 0px !important;
  left: 40%;
  transform: rotate(-90deg) translateX(-50%);
  z-index: 99;
}

.media_banners .swiper-button-next:after,
.media_banners .swiper-button-prev:after{
  font-size: 1.8rem;
  color: #907cff;
}

.media_banners .swiper-button-prev{
  position: absolute;
  top: 250px !important;
  left: 40%;
  transform: rotate(-90deg) translateX(-50%);
}


/* ---------------footer -------------------- */
.footer ul {
  /* text-align: center; */
}

.footer ul h4 {
  font-size: 2rem;
  text-transform: capitalize;

}

.footer ul li a {
  text-decoration: none;
  color: #fff;
  font-size: 1.2rem;
  text-transform: capitalize;
}

@media (max-width: 991px) {
  .header .header_left {
    margin-top: 4rem;
  }

  .header .header_center,
  .header .header_right {
    display: none;
  }



  .menu_container {
    display: none;
  }

  .contact_section .address .box .modal .modal-body .input-box {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
}
}

@media (max-width: 768px) {
    .video-container_box{
        margin-top: 1rem !important;
    }
     .video-container_box  .video-container h5{
        font-size: .9rem;
     }
    .moblie_header .icon_container .bars_logo .logo_h5{
        font-size: .8rem;
    }
    
}