@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700;800&display=swap");

:root {
   --primary: #24aeb1;
   --second: #393185;
   --light: #eff5ff;
   --dark: #1b2c51;
   --popp: "Poppins", sans-serif;
}

* {
   padding: 0;
   margin: 0;
   box-sizing: border-box;
   scroll-behavior: smooth;
}

html {
   font-size: 16px;
}

body {
   font-family: "Poppins", sans-serif;
   color: #444;
}

::-webkit-scrollbar {
   width: 6px;
   height: 1px;
}

::-webkit-scrollbar-track {
   background: transparent;
}

::-webkit-scrollbar-thumb {
   /* background: linear-gradient(to bottom, var(--second-color), var(--primary)); */
   background: #393185;
   /* border-radius: 0 0 20px 20px; */
   transition: 2s linear;
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: "Raleway", sans-serif;
}

h5,
h6 {
   font-weight: 500;
}

.flex_property {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   flex-wrap: wrap;
   -webkit-box-align: center;
   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center;
}

.whatsapp {
   color: #25d366;
   background-color: #25d366;
}

.facebook {
   color: #4267b2;
   background-color: #4267b2;
}

.instagram {
   background: -moz-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
   background: -webkit-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
   background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
}

.youtube {
   background-color: #ff0000;
}

.twitter {
   color: #1da1f2;
   background-color: #1da1f2;
}

.linkedin {
   color: #0a66c2;
   background-color: #0a66c2;
}

.fw-medium {
   font-weight: 500 !important;
}

.fw-bold {
   font-weight: 700 !important;
}

.fw-black {
   font-weight: 900 !important;
}

.back-to-top {
   position: fixed;
   display: none;
   right: 44px;
   bottom: 44px;
   background-color: var(--primary);
   color: #fff;
   z-index: 99;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
   opacity: 0.9;
   outline: 1px solid var(--primary);
}

.back-to-top:hover {
   opacity: 1;
   color: #fff;
   outline-offset: 2px;
}

/*** Spinner ***/
#spinner {
   display: none;
   position: fixed;
   top: 50%;
   left: 50%;
   opacity: 0;
   visibility: hidden;
   transition: opacity 0s ease-out, visibility 0s linear 0.5s;
   z-index: 99999;
   -webkit-transition: opacity 0s ease-out, visibility 0s linear 0.5s;
   -moz-transition: opacity 0s ease-out, visibility 0s linear 0.5s;
   -ms-transition: opacity 0s ease-out, visibility 0s linear 0.5s;
   -o-transition: opacity 0s ease-out, visibility 0s linear 0.5s;
   width: 100%;
   height: 100vh;
}

#spinner.show {
   display: inline-flex;
   background-color: #fff;
   transition: opacity 0.5s ease-out, visibility 0s linear 0s;
   visibility: visible;
   opacity: 1;
}

/*** Button ***/
.btn {
   font-weight: 500;
   transition: 0.5s;
}

.btn.btn-primary,
.btn.btn-secondary {
   color: #ffffff;
}

.btn-square {
   width: 38px;
   height: 38px;
}

.btn-sm-square {
   width: 32px;
   height: 32px;
}

.btn-lg-square {
   width: 48px;
   height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
   padding: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: normal;
}

/*** Navbar ***/
.navbar {
   justify-content: space-between;
}

.navbar .dropdown-toggle::after {
   border: none;
   content: "\f107";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   vertical-align: middle;
   margin-left: 8px;
}

.navbar .nav-link {
   position: relative;
   color: var(--dark);
   font-family: var(--popp);
   font-weight: 500;
   margin: 0px;
   padding: 5px 15px;
   text-transform: capitalize;
   letter-spacing: 0.6px;
   outline: none;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
   color: var(--primary);
}

.navbar .nav-link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 2px;
   bottom: 0;
   position: absolute;
   left: auto;
   right: 0;
   z-index: -1;
   -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   -o-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   background: currentColor;
}

.navbar .navbar-brand {
   height: 76px;
   overflow: hidden;
   padding-block: 8px;
}

.navbar .navbar-brand img {
   height: 100%;
}

.navbar.sticky-top {
   top: -100px;
   transition: 0.5s;
}

.navbar.shadow-sm .navbar-collapse > a:last-of-type {
   display: none;
}

.navbar .navbar-collapse a.login_link {
   text-decoration: underline;
   text-underline-offset: 10px;
   color: var(--second);
}

@media (min-width: 992px) {
   .navbar .nav-item .dropdown-menu {
      display: block;
      border: none;
      margin-top: 0;
      top: 150%;
      opacity: 0;
      visibility: hidden;
      transition: 0.5s;
   }

   .navbar .nav-item:hover .dropdown-menu {
      top: 108%;
      visibility: visible;
      transition: 0.5s;
      opacity: 1;
      box-shadow: 0 4px 15px #ddd;
      border-bottom: 2px solid var(--second);
      padding: 0;
      overflow: hidden;
   }

   .navbar .nav-item .dropdown-menu .dropdown-item {
      padding: 0.5rem 1rem;
      /* font-size: 15px; */
   }

   .navbar .nav-item .dropdown-menu .dropdown-item:not(:last-of-type) {
      border-bottom: 1px solid #eee;
   }
}

/*** Header ***/
.header-carousel .owl-carousel-item {
   height: 490px;
}

.header-carousel .hero_pright {
   background-position: right center;
   background-size: cover;
}

.header-carousel .owl-carousel-text {
   position: relative;
   width: 100%;
   height: 100%;
   padding: 2rem 1rem;
   top: 0;
   left: 0;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: center;
   row-gap: 30px;
}

.header-carousel .owl-carousel-text :is(h1, h2, h3, h4, h5, h6) {
   color: #fff;
}

.header-carousel .owl-carousel-text .hero_text {
   font-size: 50px;
   font-weight: 800;
   margin-bottom: 20px;
   text-shadow: 3px 2px 0px rgba(0, 0, 0, 0.3);
}

.header-carousel .owl-carousel-text h4,
.owl-carousel-text h5 {
   font-family: var(--popp);
   font-weight: 400;
}

.header-carousel .owl-carousel-text .hero_icon {
   display: inline-block;
   width: 54px;
   aspect-ratio: 1/1;
   padding: 8px;
   margin-right: 15px;
   background-color: #fff;
   outline: 1px dashed #fff9;
   outline-offset: 2px;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.header-carousel .owl-carousel-text .hero_slide_img {
   height: 400px;
   max-height: 420px;
}

.header-carousel .owl-carousel-text .hero_slide_img img {
   height: 100%;
   margin: auto;
}

.owl-carousel-text .hero_slide_img.hero_animate {
   height: 340px;
   max-height: 360px;
   animation: animate_serv_img 8s infinite, up-down 2s ease-in-out infinite alternate-reverse both;
   -webkit-animation: animate_serv_img 8s infinite, up-down 2s ease-in-out infinite alternate-reverse both;
}

@keyframes animate_serv_img {

   0%,
   30% {
      background: url("../img/product/capsules.png") no-repeat center;
      /* background-size: 100% 100%; */
      background-size: auto 100%;
   }

   35%,
   65% {
      background: url("../img/product/tablets.png") no-repeat center;
      background-size: auto 100%;
      border-radius: 0%;
   }

   70%,
   95% {
      background: url("../img/product/oinements.png") no-repeat center;
      background-size: auto 100%;
      /* border-radius: 50%; */
   }
}

.owl-carousel .owl-item {
   /* max-height: 540px; */
   overflow: hidden;
}

.owl-carousel .owl-item .owl-carousel-text > div {
   transition: 1s;
   -webkit-transition: 1s;
   -moz-transition: 1s;
   -ms-transition: 1s;
   -o-transition: 1s;
}

.owl-carousel .owl-item .owl-carousel-text .fadeInLeft {
   transform: translateX(-100%);
   -webkit-transform: translateX(-100%);
   -moz-transform: translateX(-100%);
   -ms-transform: translateX(-100%);
   -o-transform: translateX(-100%);
}

.owl-carousel .owl-item .owl-carousel-text .fadeInRight {
   transform: translateX(100%);
   -webkit-transform: translateX(100%);
   -moz-transform: translateX(100%);
   -ms-transform: translateX(100%);
   -o-transform: translateX(100%);
}

.owl-carousel .owl-item.active .owl-carousel-text .fadeInLeft,
.owl-carousel .owl-item.active .owl-carousel-text .fadeInRight {
   transform: translateX(0);
   -webkit-transform: translateX(0);
   -moz-transform: translateX(0);
   -ms-transform: translateX(0);
   -o-transform: translateX(0);
}

.owl-carousel .owl-item .owl-carousel-text .fadeInDown {
   transform: translateY(100%);
   -webkit-transform: translatey(100%);
   -moz-transform: translatey(100%);
   -ms-transform: translatey(100%);
   -o-transform: translatey(100%);
}

.owl-carousel .owl-item.active .owl-carousel-text .fadeInDown {
   transform: translateY(0);
   -webkit-transform: translatey(0);
   -moz-transform: translatey(0);
   -ms-transform: translatey(0);
   -o-transform: translatey(0);
}

.owl-carousel .owl-item img {
   width: auto;
   height: 100%;
}

.header-carousel .owl-nav {
   position: absolute;
   top: 50%;
   left: 50%;
   /* bottom: 0; */
   width: 90%;
   padding: 0;
   color: #fff;
   text-align: center;
   z-index: 1;
   transform: translate(-50%, -50%);
}

.header-carousel .owl-nav .owl-prev,
.header-carousel .owl-nav .owl-next {
   width: 45px;
   height: 45px;
   background: transparent;
   border: 1px solid #ffffff;
   border-radius: 45px;
   font-size: 22px;
   position: absolute;
   top: 0;
   bottom: 0;
   z-index: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 0;
   color: #fff;
   text-align: center;
   background: none;
   border: 0;
   opacity: 0;
   transition: 0.6s;
   -webkit-transition: 0.6s;
   -moz-transition: 0.6s;
   -ms-transition: 0.6s;
   -o-transition: 0.6s;
}

.header-carousel .owl-nav .owl-prev {
   left: -5%;
}

.header-carousel .owl-nav .owl-next {
   right: -5%;
}

.header-carousel:hover .owl-nav .owl-prev {
   left: 0;
   opacity: 0.8;
   border: 1px solid #fffa;
}

.header-carousel:hover .owl-nav .owl-next {
   right: 0;
   opacity: 0.8;
   border: 1px solid #fffa;
}

.header-carousel .owl-nav .owl-prev:hover,
.header-carousel .owl-nav .owl-next:hover {
   background-color: #39318544;
   opacity: 1;
}

.header-carousel .owl-dots {
   position: absolute;
   height: 45px;
   bottom: 30px;
   left: 50%;
   transform: translateX(-50%);
   display: flex;
   align-items: center;
   justify-content: center;
}

.header-carousel .owl-dot {
   position: relative;
   display: inline-block;
   margin: 0 5px;
   width: 15px;
   height: 15px;
   background: transparent;
   border: 1px solid #ffffff;
   border-radius: 15px;
   transition: 0.5s;
}

.header-carousel .owl-dot::after {
   position: absolute;
   content: "";
   width: 5px;
   height: 5px;
   top: 4px;
   left: 4px;
   background: #ffffff;
   border-radius: 5px;
}

.header-carousel .owl-dot.active {
   background: var(--primary);
   border-color: var(--primary);
}

.page-header {
   position: relative;
   background: url(../img/hero-bg/rapross2.png) center no-repeat;
   background-size: cover;
   text-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
}

.page-header::before {
   content: "";
   position: absolute;
   inset: 0;
   width: 100%;
   background: linear-gradient(to Right, #000c, #0002);
}

.page-header_about {
   height: 320px;
   background-position: center;
   background-size: cover;
   margin-bottom: 40px;
}

.page-header .page_hero_content {
   position: relative;
}

.page-header .page_hero_content * {
   color: #fff;
}

.breadcrumb-item + .breadcrumb-item::before {
   color: var(--light);
}

/*** Feature ***/
@media (min-width: 1200px) {
   .feature-text {
      padding-left: calc(((100% - 1140px) / 2) + 0.75rem);
   }
}

/*** Team ***/
.team-item img {
   position: relative;
   top: 0;
   transition: 0.5s;
}

.team-item:hover img {
   top: -30px;
}

.team-item .team-text {
   position: relative;
   height: 100px;
   transition: 0.5s;
}

.team-item:hover .team-text {
   margin-top: -60px;
   height: 160px;
}

.team-item .team-text .team-social {
   opacity: 0;
   transition: 0.5s;
}

.team-item:hover .team-text .team-social {
   opacity: 1;
}

.team-item .team-social .btn {
   display: inline-flex;
   color: var(--primary);
   background: #ffffff;
   border-radius: 40px;
}

.team-item .team-social .btn:hover {
   color: #ffffff;
   background: var(--primary);
}

/*** Appointment ***/
.bootstrap-datetimepicker-widget.bottom {
   top: auto !important;
}

.bootstrap-datetimepicker-widget .table * {
   border-bottom-width: 0px;
}

.bootstrap-datetimepicker-widget .table th {
   font-weight: 500;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
   padding: 10px;
   border-radius: 2px;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
   background: var(--primary);
}

.bootstrap-datetimepicker-widget table td.today::before {
   border-bottom-color: var(--primary);
}

/*** Testimonial ***/
.testimonial-carousel::before {
   position: absolute;
   content: "";
   top: 0;
   left: 0;
   height: 100%;
   width: 0;
   background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
   z-index: 1;
}

.testimonial-carousel::after {
   position: absolute;
   content: "";
   top: 0;
   right: 0;
   height: 100%;
   width: 0;
   background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
   z-index: 1;
}

.testimonial-carousel .owl-item .testimonial-text {
   background: var(--light);
   transform: scale(0.8);
   transition: 0.5s;
   -webkit-transform: scale(0.8);
   -moz-transform: scale(0.8);
   -ms-transform: scale(0.8);
   -o-transform: scale(0.8);
}

.testimonial-carousel .owl-item.center .testimonial-text {
   background: var(--primary);
   transform: scale(1);
}

.testimonial-carousel .owl-item .testimonial-text *,
.testimonial-carousel .owl-item .testimonial-item img {
   transition: 0.5s;
}

.testimonial-carousel .owl-item.center .testimonial-text * {
   color: var(--light) !important;
}

.testimonial-carousel .owl-item.center .testimonial-item img {
   background: var(--primary) !important;
}

.testimonial-carousel .owl-nav {
   position: absolute;
   width: 350px;
   top: 15px;
   left: 50%;
   transform: translateX(-50%);
   display: flex;
   justify-content: space-between;
   opacity: 0;
   transition: 0.5s;
   z-index: 1;
}

.testimonial-carousel:hover .owl-nav {
   width: 300px;
   opacity: 1;
}

.testimonial-carousel .owl-nav .owl-prev,
.testimonial-carousel .owl-nav .owl-next {
   position: relative;
   color: var(--primary);
   font-size: 45px;
   transition: 0.5s;
}

.testimonial-carousel .owl-nav .owl-prev:hover,
.testimonial-carousel .owl-nav .owl-next:hover {
   color: var(--dark);
}

/*** footer_sec ***/
.footer_sec {
   position: relative;
   background-color: #000;
   padding-top: 60px;
   /* background: linear-gradient(to bottom, transparent, var(--light)); */
   /* border-top: 1px solid #ddd; */
}

.footer_sec * {
   color: #fff;
}

.footer_sec p {
   font-size: 1rem;
}

.footer_sec .footer_logo {
   display: inline-block;
   height: 56px;
   margin-bottom: 15px;
}

.footer_sec .footer_logo img {
   height: 100%;
}

.footer_sec h5 {
   font-weight: 600;
}

.footer_sec ul {
   padding-left: 0.5rem;
}

.footer_sec .footer_link {
   position: relative;
   display: block;
   margin-block: 10px;
}

.footer_sec .footer_link i.fa {
   padding-right: 8px;
   color: #ccc;
   font-size: 12px;
   line-height: 0;
   font-weight: 600;
}

.footer_sec .footer_link a {
   position: relative;
   padding: 3px 0;
   padding: 3px 0;
   position: relative;
   -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   -o-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   z-index: 1;
}

.footer_sec .footer_link a::after {
   content: "";
   width: 0;
   height: 1px;
   bottom: 0;
   position: absolute;
   left: auto;
   right: 0;
   z-index: -1;
   -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   -o-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   background: currentColor;
}

.footer_sec a:hover {
   color: var(--primary) !important;
}

.footer_sec .footer_link a:hover:after {
   width: 100%;
   left: 0;
   right: auto;
}

.footer_sec .btn.btn-social {
   margin-right: 5px;
   width: 35px;
   height: 35px;
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--light);
   border: 1px solid #ffffff;
   transition: 0.3s;
}

.footer_sec .btn.btn-social:hover {
   color: var(--primary);
}

.footer_sec .btn.btn-link {
   display: block;
   margin-bottom: 5px;
   padding: 0;
   text-align: left;
   /* color: #ffffff; */
   font-size: 15px;
   font-weight: normal;
   text-transform: capitalize;
   transition: 0.3s;
}

.footer_sec .btn.btn-link::before {
   position: relative;
   content: "\f105";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   margin-right: 10px;
}

.footer_sec .btn.btn-link:hover {
   color: var(--primary);
   letter-spacing: 1px;
   box-shadow: none;
}

.footer_sec .copyright {
   padding: 25px 0;
   font-size: 15px;
   border-top: 1px solid #ddd;
}

.footer_sec .copyright a {
   color: var(--light);
   border-bottom: 1px solid #c7dcfb44 !important;
}

.footer_sec .copyright a:hover {
   color: var(--primary);
}

.footer_sec .footer_map {
   max-height: 165px;
   height: 100%;
   position: relative;
   line-height: 0;
   /* border: solid 2px #555; */
   box-shadow: 8px 8px 0px -1.6px #000, 8px 8px #444;
   /* -webkit-box-shadow: 12px 12px 0px -2px #000, 12px 12px #555; */
   overflow: hidden;
   border-radius: 10px 5px 10px 5px;
   -webkit-border-radius: 10px 5px 10px 5px;
   -moz-border-radius: 10px 5px 10px 5px;
   -ms-border-radius: 10px 5px 10px 5px;
   -o-border-radius: 10px 5px 10px 5px;
}

.footer_sec .footer_map iframe {
   margin: 0;
   padding: 0;
   height: 100%;
   width: 100%;
}

.topbar_sec {
   background-color: #000;
   /* background-color: #eff5ff; */
   /* height: 54px; */
   overflow: hidden;
}

.topbar_sec * {
   color: #fff;
}

.topbar_sec .topbar_content > span {
   display: inline-block;
   margin: 8px 5px;
   /* padding-block: 5px; */
}

.topbar_sec .topbar_content > span:not(.social_link) a:hover {
   color: var(--light);
   text-decoration: underline;
   text-underline-position: 10px;
}

.topbar_sec .topbar_content .social_link a {
   display: inline-block;
   width: 35px;
   aspect-ratio: 1/1;
   line-height: 34px;
   padding: 0;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.topbar_sec .topbar_content .social_link a:hover {
   outline: 1px solid #aaa;
   outline-offset: 2px;
}

.hero_container {
   /* background: linear-gradient(to right, #000, #0002); */
   background-color: var(--light);
}

.msg_sec {
   position: relative;
   margin-bottom: -25px;
   z-index: 9;
}

.msg_sec .msg_content {
   height: 150px;
   background-position: left center;
   /* outline: 2px solid var(--light); */
   /* outline-offset: 3px; */
   border-radius: 20px;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   -ms-border-radius: 20px;
   -o-border-radius: 20px;
   display: flex;
   align-items: center;
   padding-left: 1.5rem;
}

.msg_sec .msg_content h4 {
   color: var(--second);
   font-weight: 600;
   margin: 0;
   font-family: var(--popp);
}

.about_sec {
   position: relative;
   background: url(../img/image/home-about.jpg);
   background-size: 100%;
   background-position: center;
   padding: 60px 0 30px;
}

.about_sec::before {
   content: "";
   position: absolute;
   inset: 0;
   background-color: #000b;
}

.about_sec * {
   color: #fff;
   text-align: center;
}

.about_sec .flex-column > img:first-of-type {
   width: 80%;
   border-radius: 15px;
   -webkit-border-radius: 15px;
   -moz-border-radius: 15px;
   -ms-border-radius: 15px;
   -o-border-radius: 15px;
}

.about_content {
   position: relative;
   padding: 5px;
}

.about_content p {
   line-height: 1.6;
}

.about_content .about_mid {
   font-size: 94%;
   /* border-bottom: 1px solid #eee; */
}

.about_content .about_mid > span {
   justify-content: center;
   padding: 10px 4px;
}

.about_content .about_mid > span:not(:last-of-type) {
   border-right: 1px solid #fff8;
}

.about_content .about_mid > span h5 {
   font-weight: 600;
   color: var(--primary);
   max-width: 150px;
   /* width: 100%; */
}

.about_content .about_mid img {
   margin-right: 15px;
   width: 46px;
   aspect-ratio: 1/1;
   background-color: #fff;
   padding: 4px;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.about_content .about_mv {
   gap: 10px 15px;
   border: none;
}

.about_content .about_mv > span {
   padding: 10px 10px 0;
   /* box-shadow: 0 2px 10px #eee; */
}

.about_content .about_mv > span h5 {
   letter-spacing: 1px;
   font-weight: 600;
}

.about_content .about_btn {
   color: #000;
   padding: 10px 25px;
   border: 1px solid #444;
   margin-top: 5px;
   box-shadow: inset 0 0 0 50px var(--primary);
   border-radius: 20px;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   -ms-border-radius: 20px;
   -o-border-radius: 20px;
}

.about_content .about_btn:hover {
   border: 1px solid var(--primary);
   /* color: var(--primary); */
   box-shadow: inset 0 0 0 0px var(--primary);
}

.about_content .about_btn i {
   transition: 0.4s;
}

.about_content .about_btn:hover i {
   transform: translateX(6px);
}

/* about link start  */
.about_content .about_link > span {
   position: relative;
   display: inline-block;
   border-left: 2px solid var(--primary);
   padding: 8px 10px;
   margin: 0 10px 10px 0;
   font-weight: 500;
   /* margin-top: 10px; */
   z-index: 0;
   overflow: hidden;
   transition: 1s;
}

.about_link > span::before {
   content: "";
   position: absolute;
   top: 0;
   left: 1px;
   height: 100%;
   width: 0;
   background-color: var(--primary);
   /*-webkit-box-shadow: 4px 6px 15px -3px rgba(0, 0, 0, 0.4);
   box-shadow: 4px 6px 15px -3px rgba(0, 0, 0, 0.4);
   */
   z-index: -1;
   transition: 1s;
   border-radius: 0 10px 10px 0;
   -webkit-border-radius: 0 10px 10px 0;
   -moz-border-radius: 0 10px 10px 0;
   -ms-border-radius: 0 10px 10px 0;
   -o-border-radius: 0 10px 10px 0;
}

.about_link > span:hover {
   color: #fff;
   /* transform: translateY(4px); */
}

.about_link > span:hover::before {
   width: 100%;
}

.about_content .about_link > span a {
   position: relative;
}

.about_content .about_link > span a:hover {
   color: #fff;
}

.about_content .about_link > span * {
   color: var(--primary);
   transition: 1s;
}

.about_content .about_link > span:hover * {
   color: var(--dark);
}

/* .about_content .about_link > span:hover a {
   text-shadow: 0 0 6px var(--primary);
} */
.about_content .about_link > span a::before {
   content: "";
   width: 0;
   height: 1px;
   bottom: 0;
   position: absolute;
   left: 50%;
   z-index: -1;
   -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   -o-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
   background: currentColor;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -moz-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   -o-transform: translateX(-50%);
}

.about_content .about_link > span a:hover::before {
   width: 100%;
   /* left: 0;
   right: auto; */
}

.about_page_sec .mision_vision {
   padding: 15px 20px;
   box-shadow: 0 2px 12px #eee;
   height: 100%;
   flex-wrap: nowrap;
}

.about_page_sec .mision_vision img {
   height: 100px;
}

.about_page_sec .mision_vision h5 {
   font-weight: 700;
   letter-spacing: 0.6px;
   color: var(--second);
}

.feature_sec {
   position: relative;
   margin-block: 20px 35px;
}

.feature_sec .container {
   padding-block: 30px;
   background-color: var(--light);
   border-radius: 10px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   -o-border-radius: 10px;
}

.feature_sec .feature_content {
   justify-content: space-between;
   align-items: stretch;
}

.feature_sec .feature_box * {
   transition: 0.4s;
   -webkit-transition: 0.4s;
   -moz-transition: 0.4s;
   -ms-transition: 0.4s;
   -o-transition: 0.4s;
}

.feature_sec .feature_box {
   /* max-width: 260px;
   width: 100%; */
   flex-direction: column;
   text-align: center;
   padding: 5px 10px;
}

.feature_sec .feature_box:not(:last-of-type) {
   border-right: 2px solid #fff;
}

.feature_sec .feature_box:hover h6 {
   color: var(--primary);
}

.feature_sec .feature_box:hover p {
   color: var(--second);
}

.feature_sec .feature_box:hover .feature_icon {
   transform: rotateY(360deg);
   -webkit-transform: rotateY(360deg);
   -moz-transform: rotateY(360deg);
   -ms-transform: rotateY(360deg);
   -o-transform: rotateY(360deg);
}

.feature_sec .feature_box h6 {
   font-weight: 700;
   color: var(--second);
}

.feature_sec .feature_box p {
   font-size: 90%;
   margin: 0;
}

.feature_sec .feature_icon {
   display: inline-block;
   width: 60px;
   aspect-ratio: 1/1;
   line-height: 58px;
   margin-right: 15px;
   text-align: center;
   /* background-color: #ddd;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%; */
}

.feature_sec .feature_icon img {
   /* width: 100%; */
}

.contact_page_sec .contact_box {
   display: flex;
   align-items: center;
   height: 100%;
   padding: 15px 10px;
   background-color: var(--light);
   border-radius: 10px;
   transition: 0.4s;
   -webkit-transition: 0.4s;
   -moz-transition: 0.4s;
   -ms-transition: 0.4s;
   -o-transition: 0.4s;
   outline: 1px solid #fff;
   outline-offset: -5px;
}

.contact_page_sec .contact_box:hover {
   box-shadow: 2px 2px 10px #ddd8;
   transform: translateY(3px);
   -webkit-transform: translateY(3px);
   -moz-transform: translateY(3px);
   -ms-transform: translateY(3px);
   -o-transform: translateY(3px);
}

.contact_page_sec .contact_box :is(h4, h5, h6, p) {
   font-family: var(--popp);
}

.contact_page_sec .contact_box a {
   color: var(--second);
}

.contact_page_sec .contact_box a:hover {
   color: var(--primary);
}

.contact_page_sec .contact_box i {
   color: var(--second);
   font-size: 20px;
}

.contact_page_sec .contact_box:hover i {
   color: var(--primary);
}

.contact_page_sec .contact_page_bottom {
   position: relative;
   margin-top: 60px;
   background-color: var(--light);
   border-radius: 10px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   -o-border-radius: 10px;
   user-select: none;
}

.contact_page_sec .contact_form {
   position: relative;
   padding: 30px 25px 20px;
   border-right: 2px solid #fff;
}

.contact_page_sec .contact_form .form-control {
   color: #222;
}

.contact_page_sec .contact_form .form-control:focus {
   box-shadow: 0 0 0 0.15rem rgba(4, 99, 250, 0.15);
}

.counter_content {
   position: relative;
   display: inline-flex;
   margin-block: 10px;
   margin-left: 0%;
   padding: 24px 10px 10px;
   background-color: #fff;
   border-left: 2px solid var(--dark);
   box-shadow: 0px 5px 10px rgba(121, 99, 104, 0.1), 0px 1px 18px rgba(0, 0, 0, 0.08);
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   -ms-border-radius: 5px;
   -o-border-radius: 5px;
}

.counter_content .counter_box {
   padding-inline: .75rem;
   text-align: center;
   /* width: calc(100% / 3); */
}

.counter_content .counter_box:not(:last-of-type) {
   border-right: 1px solid #aaa;
}

.counter_content .counter_box h2 {
   color: var(--second);
   font-family: var(--popp);
   /* color: var(--primary); */
}

.counter_content .counter_box h6 {
   font-family: var(--popp);
   color: var(--primary);
   font-size: 1.1rem;
}

.why_choose {
   position: relative;
   padding: 70px 0 30px;
   background: linear-gradient(transparent, #eff4ff99, transparent);
}

.why_choose .why_choose_left h2 {
   text-align: center;
}

/* 
.why_choose .why_choose_left h2:hover {
   color: var(--primary);
} */
.why_choose .whychoose_box {
   /*display: inline-block;
   */
   /* width: 50%; */
   min-height: 160px;
   height: 100%;
   padding: 20px 14px;
   margin-bottom: 15px;
   box-shadow: 0 2px 10px #ddd8;
   background-color: #fff;
   /* display: flex;
   flex-direction: column;
   align-items: center; */
   text-align: center;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   -ms-border-radius: 5px;
   -o-border-radius: 5px;
   transition: 0.4s;
   -webkit-transition: 0.4s;
   -moz-transition: 0.4s;
   -ms-transition: 0.4s;
   -o-transition: 0.4s;
   overflow: hidden;
}

.why_choose .whychoose_box:hover {
   box-shadow: 0 0px 12px #ddde;
   transform: translateY(3px);
   -webkit-transform: translateY(3px);
   -moz-transform: translateY(3px);
   -ms-transform: translateY(3px);
   -o-transform: translateY(3px);
}

.why_choose .whychoose_box .icon_box {
   position: relative;
   display: inline-block;
   transition: 1s;
   /* top: -10px;
   right: -50px;
   bottom: 0;
   left: 50%;

   transform: translateX(-50%); */
}

.why_choose .whychoose_box .icon_box::before,
.why_choose .whychoose_box .icon_box::after {
   content: "";
   position: absolute;
   z-index: 0;
   transition: 0.4s;
}

.why_choose .whychoose_box .icon_box::before {
   /*background: #fff1ea;
   */
   background-color: var(--light);
   border-radius: 100%;
   top: -10px;
   right: -50px;
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -moz-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   -o-transform: translateX(-50%);
   transition: 1s;
   outline: 2px solid var(--light);
   outline-offset: -2px;
}

.why_choose .whychoose_box .icon_box::after {
   content: " ☆";
   color: var(--primary);
   font-weight: 400;
   font-size: 24px;
   background: #24aeb188;
   border-radius: 100%;
   right: -10px;
   /* bottom: 5px; */
   width: 10px;
   height: 25px;
   line-height: 100px;
   padding-inline: 15px;
}

.why_choose .whychoose_box:hover .icon_box::before {
   content: "";
   /*outline: 1px solid #24aeb144;
   outline-offset: 3px;
   */
   width: 300px;
   height: 300px;
   transition: 1s;
   outline: 2px solid var(--light);
   outline-offset: 4px;
}

.why_choose .whychoose_box img {
   position: relative;
   z-index: 5;
   transition: 0.4s;
   -webkit-transition: 0.4s;
   -moz-transition: 0.4s;
   -ms-transition: 0.4s;
   -o-transition: 0.4s;
   opacity: 0.9;
}

.why_choose .whychoose_box:hover img {
   transform: rotateY(180deg);
   -webkit-transform: rotateY(180deg);
   -moz-transform: rotateY(180deg);
   -ms-transform: rotateY(180deg);
   -o-transform: rotateY(180deg);
   opacity: 1;
}

.why_choose .whychoose_box h5 {
   position: relative;
   margin-top: 12px;
   font-weight: 600;
   text-shadow: 0 0 14px #24aeb133;
   /* word-break: break-all; */
   /* text-wrap: wrap; */
}

.why_choose .whychoose_box:hover h5 {
   color: var(--primary);
}

.why_choose .col-lg-6 span.flex_property {
   gap: 10px 15px;
   flex-wrap: nowrap;
}

.client_box {
   width: 140px;
   aspect-ratio: 1/1;
   margin-inline: auto;
   background-color: #fff;
   /* border: 1px solid #ccc; */
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
   display: grid;
   place-items: center;
   overflow: hidden;
}

.owl-carousel .owl-item .client_box img {
   width: 100%;
   height: auto;
}

div.dataTables_wrapper div.dataTables_length select {
   max-width: 65px;
   width: 100%;
   color: var(--second);
}

.product_page .product_list_content {
   position: relative;
   max-width: 1000px;
   margin-inline: auto;
   width: 100%;
   padding: 30px 20px;
   margin-bottom: 20px;
   background-color: #fff;
   box-shadow: 0 4px 18px #dddb;
}

.product_page .product_list_content2 {
   margin-top: -40px;
   border-radius: 15px;
   -webkit-border-radius: 15px;
   -moz-border-radius: 15px;
   -ms-border-radius: 15px;
   -o-border-radius: 15px;
}

.product_list_content .dataTables_wrapper > .row:first-of-type .col-sm-12:first-child {
   order: 2;
}

.product_list_content .dataTables_wrapper > .row:first-of-type .col-sm-12:first-child > div {
   text-align: right;
}

.product_list_content .dataTables_wrapper > .row > div[class^="col-"]:last-child {
   padding-inline: 0;
}

.product_list_content .dataTables_wrapper .dataTables_filter {
   text-align: left;
}

.product_list_content .dataTables_filter input[type="search"] {
   width: 100%;
   border: 1px solid #888;
   height: 40px;
}

.product_list_content table {
   /* border-collapse: collapse; */
   border-top: 1px solid #eee;
   border-bottom: 1px solid #aaa;
   padding-block: 10px 15px;
   background-color: #fff;
}

.product_list_content table thead th {
   font-weight: 500;
   color: #000;
   border-color: #aaa !important;
   text-align: center;
   background-color: #eee9;
}

.product_list_content table thead {
   vertical-align: middle;
}

.product_list_content table.table-striped tr :not(:first-child) {
   text-align: center;
   vertical-align: middle;
}

/* .input-group-text,
select.form-control:not([size]):not([multiple]),
.form-control:not(.form-control-sm):not(.form-control-lg) {
   font-size: 14px;
   padding: 10px 15px;
   height: 38px;
} */
.product_list_content .dataTables_filter input[type="search"]:focus,
.form-control:focus,
.input-group-text:focus {
   /* background-color: #fefeff; */
   border-color: #95a0f4;
   border: 1px solid #95a0f4;
   box-shadow: 0 0 0 0.2rem rgba(4, 99, 250, 0.1);
}

.product_list_content table.table-striped tbody tr {
   color: #222;
   border: #eee;
}

.table-striped.dataTable tbody tr:last-of-type td {
   border: none !important;
}

.table-striped.dataTable tbody tr:hover {
   background-color: rgba(0, 0, 0, 0.04);
}

.table-striped tbody tr:nth-of-type(odd) {
   background-color: #eff5ff55;
   --bs-table-accent-bg: none;
}

.product_list_content .table-responsive .form-control {
   background-color: #fff;
   margin-block: 6px;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   -ms-border-radius: 5px;
   -o-border-radius: 5px;
}

.product_list_content ul .paginate_button {
   display: inline-block;
   margin-right: 8px;
}

.product_list_content ul .paginate_button.previous a,
.product_list_content ul .paginate_button.next a {
   border-color: #39318566;
}

.product_list_content ul .paginate_button.previous a:hover,
.product_list_content ul .paginate_button.next a:hover {
   background-color: var(--second);
   color: #fff;
}

.product_list_content ul .paginate_button.disabled {
   cursor: not-allowed;
   opacity: 0.9;
}

.product_list_content ul .paginate_button.disabled a {
   border-color: transparent;
}

.product_list_content ul .paginate_button .page-link {
   display: inline-block;
   font-family: "Poppins", sans-serif;
   color: var(--second);
   width: 40px;
   height: 40px;
   aspect-ratio: 1/1;
   /* line-height: 40px; */
   text-align: center;
   vertical-align: middle;
   text-decoration: none;
   border: 1px solid #eee;
   border-radius: 50%;
   background-color: #fff;
   box-shadow: 0px 0px 10px 0px #eee;
}

.product_list_content ul .paginate_button.active .page-link {
   background-color: var(--second);
   color: #fff;
}

.email_sec {
   position: relative;
   /* height: 45px; */
   padding: 0;
   max-width: 600px;
   width: 100%;
   margin-inline: auto;
}

.email_sec input[type="email"] {
   max-width: 520px;
   width: 100%;
   height: 45px;
   padding: 0 1rem;
   margin-left: auto;
   font-size: 15px;
   border: 1px solid var(--second);
   border-radius: 8px;
   background-color: transparent;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   -ms-border-radius: 8px;
   -o-border-radius: 8px;
}

.email_sec input[type="submit"] {
   max-height: 44px;
   position: absolute;
   right: 4px;
   height: 85%;
   padding: 0.5em 1em;
   border: none;
   border-radius: 8px;
   background-color: var(--second);
   color: #fff;
   font-size: 15px;
   cursor: pointer;
   transition: background-color 0.3s ease-in-out;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   -ms-border-radius: 8px;
   -o-border-radius: 8px;
}

.email_sec input[type="submit"]:hover {
   background-color: #5e5dcd;
}

.email_sec input[type="email"]:focus,
.email_sec input[type="email"]:focus-visible {
   outline: none;
   box-shadow: 0 0 5px 5px #39318522;
}

/* Facility Page Start */
.page_container {
   padding: 2.5rem 2.1rem 3rem;
   box-shadow: 0 4px 12px #eee;
   border-radius: 15px;
   -webkit-border-radius: 15px;
   -moz-border-radius: 15px;
   -ms-border-radius: 15px;
   -o-border-radius: 15px;
}

.product_list_content .dt-buttons .btn-group {
   position: absolute;
   top: -7%;
}

.production_sec .production_img {
   width: 100%;
   overflow: hidden;
   text-align: center;
   padding-bottom: 18px;
}

.production_sec .production_img img {
   max-width: 320px;
   width: 100%;
   filter: drop-shadow(4px 5px 6px #999);
   -webkit-filter: drop-shadow(4px 5px 6px #999);
}

.production_sec .production_img .clip {
   border-radius: 15px;
   overflow: hidden;
   clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
   /* clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%); */
}

.production_sec .slider-team {
   position: relative;
   text-align: center;
}

.production_sec .slider-team .team-img {
   position: relative;
   display: inline-block;
   z-index: 10;
   border: 2px solid #fff;
   height: 300px;
}

.production_sec .slider-team.second_img .team-img::before {
   position: absolute;
   bottom: -10px;
   right: -10px;
   left: auto;
   width: 80%;
   height: 80%;
   content: "";
   background: var(--dark);
}

.production_sec .slider-team .team-img::before {
   content: "";
   position: absolute;
   bottom: -10px;
   left: -10px;
   width: 75%;
   height: 80%;
   background: var(--dark);
   z-index: -1;
}

.production_sec .slider-team .team-img img {
   border-radius: 5px;
   max-width: 100%;
   height: 100%;
}

.production_sec :is(p, h6) {
   line-height: 1.6;
   font-size: 104%;
   font-family: var(--popp);
}

.production_box {
   /* box-shadow: 0 2px 12px #eee; */
   padding: 15px 10px;
   margin: 0px 5px 15px;
   display: flex;
   align-items: center;
}

.production_left h4 {
   text-align: center;
   margin-bottom: 1rem;
   color: var(--second);
}

.production_box * {
   font-family: var(--popp);
}

.production_box h2 {
   color: var(--second);
}

.production_box h5,
.production_box h4 {
   color: var(--primary);
   font-weight: 500;
}

.production_box img {
   border-right: 1px solid var(--second);
   padding-right: 5px;
   margin-right: 5px;
}

/* .production_ul li::marker {
   list-style-type: ">";
} */
.production_ul {
   margin-left: 0;
   padding-left: 0;
   padding-left: 0rem;
}

.production_ul li {
   /* list-style-type: "> "; */
   /* position: relative; */
   position: relative;
   list-style: none;
   padding-left: 2rem;
   /* text-indent: -1em; */
}

.production_ul li > i {
   position: absolute;
   top: 8px;
   left: 0;
   color: var(--primary);
}

/* facility_sec Start */
.facility_sec {
   position: relative;
   background: url(../img/hero-bg/rapross4.png);
   background-attachment: fixed;
   background-position: left center;
   background-size: cover;
   z-index: 2;
}

.facility_sec::before {
   content: "";
   position: absolute;
   inset: 0;
   background-color: #1b2c5188;
   z-index: -1;
}

.facility_sec h1 {
   color: #fff;
}

.facility_sec .service-item {
   position: relative;
   background-color: var(--light);
   padding: 30px 8px 16px;
   height: 100%;
   overflow: hidden;
   border-radius: 10px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   -o-border-radius: 10px;
   transition: 0.4s;
   -webkit-transition: 0.4s;
   -moz-transition: 0.4s;
   -ms-transition: 0.4s;
   -o-transition: 0.4s;
}

.facility_sec .service-item::before {
   content: "";
   position: absolute;
   background: url(../img/icons/shape1.png) no-repeat;
   inset: 0;
   top: -30%;
   left: 40%;
}

.facility_sec .service-item:hover {
   background-color: #0a66c2;
   margin-top: -6px;
   box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
}

.facility_sec .service-item .facility_icon {
   position: relative;
   left: 50%;
   width: 70px;
   height: 70px;
   padding: 10px;
   background-color: #fff;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -moz-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   -o-transform: translateX(-50%);
   overflow: hidden;
}

.facility_sec .service-item .facility_icon img {
   width: 100%;
}

.facility_sec .service-item h4 {
   font-family: var(--popp);
   font-weight: 600;
   text-align: center;
   font-size: 20px;
}

.facility_sec .service-item:hover h4,
.facility_sec .service-item:hover p {
   color: #fff;
}

.facility_sec .service-item > p {
   /* display: -webkit-box;
   line-clamp: 2;
   -webkit-line-clamp: 2;
   overflow: hidden;
   white-space: pre-wrap;
   text-overflow: ellipsis; */
   /* overflow: hidden;
   width: 100px; */
   display: -webkit-box;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   font-size: 94%;
   text-overflow: ellipsis;
   white-space: pre-wrap;
   overflow: hidden;
   /* width: 200px;  */
   text-align: center;
}

.facility_sec .service-item .btn {
   position: relative;
   display: inline-flex;
   left: 50%;
   width: 114px;
   height: 40px;
   color: #444;
   align-items: center;
   background: #ffffff;
   border-radius: 40px;
   white-space: nowrap;
   overflow: hidden;
   transition: 0.5s;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -moz-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   -o-transform: translateX(-50%);
}

.facility_sec .service-item:hover .btn {
   width: 144px;
}

.facility_sec .counter_content {
   border: none;
   max-width: 1000px;
   width: 100%;
   background-color: transparent;
   box-shadow: none;
   justify-content: space-around;
   padding: 0;
}

.facility_sec .counter_content .counter_box {
   min-width: 9.375rem;
   aspect-ratio: 1/1;
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: #fff;
   flex-direction: column;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.counter_box1 {
   display: inline-flex;
   text-align: center;
   padding: 12px;
   aspect-ratio: 1/1;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   z-index: 10;
}

/*   Gallery Page Start */
.section-ajeet-title {
   position: relative;
   font-size: 30px;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   margin: 0 0 35px;
}

.gallery-sec {
   padding: 90px 0 40px;
}

.gf-column {
   float: left;
   display: none;
   /* Hide all elements by default */
}

/* The "show" class is added to the filtered elements */
.show {
   display: block;
}

.gfilter {
   padding: 20px 2px 10px;
   text-align: center;
   max-width: 1050px;
   margin: auto;
   object-fit: cover;
}

.gf-btn {
   padding: 10px 20px;
   margin: 5px 4px 4px 0;
   display: inline-block;
   color: #000;
   background: #fff;
   font-size: 18px;
   font-weight: 500;
   border: 1px solid #265df2;
   text-decoration: none;
   transition: all 0.2s;
   border-radius: 9px;
   cursor: pointer;
}

.gf-btn:hover,
.gf-btn-active {
   background: #265df2;
   color: #fff;
   -webkit-transform: translateY(3px);
   -ms-transform: translateY(3px);
   transform: translateY(3px);
}

.gallery {
   display: flex;
   justify-content: center;
   width: fit-content;
   max-width: 1320px;
   flex-wrap: wrap;
   margin: 25px auto;
   /* gap: 14px; */
}

.gallery img {
   width: 200px;
   height: 260px;
   object-fit: cover;
   /* background: center center/cover no-repeat #ddd; */
   transition: 0.3s ease-in-out;
   border-radius: 12px;
   overflow: hidden;
   margin: 10px 10px;
}

.gallery img:hover::after {
   content: "E";
}

.gallery img:hover,
video:hover {
   transform: scale(1.1);
}

.butonsSection {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 7px 15px;
   gap: 15px;
}

/* .closeBtn {
   font-size: 22px;
   letter-spacing: 2px;
   color: #fff;
   transition: all 0.4s linear;
   padding: 8px 50px;
   border-radius: 25px;
   background: red;
   border: 0;
   outline-offset: -5px;
   outline: 2px solid #fff;
} */
.closeBtn {
   position: absolute;
   content: "Close";
   right: -20px;
   top: -20px;
   font-size: 22px;
   font-weight: 500;
   color: white;
   transition: 0.5s linear;
   width: 45px;
   aspect-ratio: 1/1;
   background: red;
   border: none;
   outline: 3px solid #0009;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.closeBtn:hover {
   cursor: auto;
   background: white;
   color: black;
}

.openDiv {
   width: 100%;
   height: 100vh;
   background: #000000cc;
   position: fixed;
   top: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   left: 0;
   z-index: 9999;
}

.imgPreview {
   /*width: 70%;
   */
   object-fit: scale-down;
   max-height: 80vh;
   height: auto;
   border-radius: 10px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   -o-border-radius: 10px;
}

.sets .hide,
.sets .pophide {
   width: 0%;
   opacity: 0;
}

/* Responsive css Code Start */
@media (max-width: 767px) {
   .gallery img {
      margin: 8px 8px;
      width: 175px;
   }

   .closeBtn {
      padding: 8px 25px;
   }

   .imgPreview {
      width: 80%;
      height: auto;
   }
}

@media (max-width: 575px) {
   .gallery img {
      margin: 8px 6px;
      width: 155px;
   }

   .gf-btn {
      font-size: 15px;
   }

   .closeBtn {
      font-size: 18px;
      padding: 8px 25px;
      border-radius: 15px;
   }

   .closeBtn:hover {
      padding: 8px 20px;
   }

   .imgPreview {
      width: 90%;
      /* max-height: 50vh; */
      height: auto;
   }
}

.popupdiv {
   position: relative;
}

.page_bottom_img {
   position: relative;
   height: 260px;
}

.page_bottom_img.bottom_img1 {
   background-image: url(../img/image/rapross-bottom.jpg);
   background-position: center;
   background-size: auto 100%;
}

.about_logo {
   position: relative;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-evenly;
   background-color: #fff;
}

.about_logo img {
   height: 150px;
}

.about_content .about_mid_page {
   text-align: center;
}

.page_end_img {
   position: relative;
   overflow: hidden;
}

.page_end_img .end_img {
   height: 300px;
   overflow: hidden;
   border-radius: 6px 6px 0 0;
   -webkit-border-radius: 6px 6px 0 0;
   -moz-border-radius: 6px 6px 0 0;
   -ms-border-radius: 6px 6px 0 0;
   -o-border-radius: 6px 6px 0 0;
}

.page_end_img .end_img img {
   height: 100%;
   border-radius: 6px 6px 0 0;
   -webkit-border-radius: 6px 6px 0 0;
   -moz-border-radius: 6px 6px 0 0;
   -ms-border-radius: 6px 6px 0 0;
   -o-border-radius: 6px 6px 0 0;
}

.page_end_img::before {
   content: "";
   position: absolute;
   inset: 0;
   /* background: url(to bottom, transparent, transparent, #0009); */
   background: linear-gradient(to bottom, transparent, transparent, #000a);
}

.hexagon-gallery {
   margin: auto;
   /* margin-top: 50px; */
   /* max-width: 1000px; */
   display: inline-grid;
   display: -ms-inline-grid;
   display: -moz-inline-grid;
   /* grid-template-columns: repeat(3, 1fr); */
   grid-template-columns: repeat(1, 1fr);
   grid-auto-rows: 135px;
   grid-gap: 14px;
   padding-bottom: 45px;
}

.hexagon-gallery .hex {
   display: flex;
   position: relative;
   width: 165px;
   height: 180px;
   background-color: #424242;
   -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
   clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

.hex:first-child {
   grid-row-start: 1;
   grid-column: 2 / span 2;
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -moz-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   -o-transform: translateX(-50%);
}

.hex:nth-child(2) {
   grid-row-start: 2;
   grid-column: 1 / span 2;
}

.hex:nth-child(3) {
   grid-row-start: 2;
   grid-column: 3 / span 2;
}

.hexagon-gallery .hex img {
   width: 100%;
   height: auto;
   display: block;
   object-fit: cover;
}

/* facility_sec 2 Start */
.facility_sec2 {
   position: relative;
   background-attachment: fixed;
   background-position: left center;
   background-size: cover;
   z-index: 2;
}

.facility_sec2::before {
   content: "";
   position: absolute;
   inset: 0;
   background-color: #1b2c5188;
   z-index: -1;
}

.facility_sec2 h1 {
   margin-bottom: 20px;
   color: #fff;
   text-align: center;
   text-transform: capitalize;
}

.facility_sec2 .img-container {
   margin-inline: auto;
   text-align: center;
   max-width: 330px;
   width: 100%;
   border-radius: 10px;
   margin-bottom: 20px;
   overflow: hidden;
   background-color: #fff;
   padding: 15px;
}

.facility_sec2 .img-container img {
   width: 100%;
}

.facility_sec2 .img-container h5 {
   /* color: #fff; */
   margin-block: 8px 18px;
   font-size: 1.3rem;
   letter-spacing: 0.5px;
   text-transform: capitalize;
}

.facility_sec2 .counter_content {
   border: none;
   max-width: 1000px;
   width: 100%;
   background-color: transparent;
   box-shadow: none;
   justify-content: space-around;
   padding: 0;
}

.facility_sec2 .sub_categary {
   /* width:250px; */
   border-radius: 14px 14px;
   background-color: #fff;
   margin-bottom: 20px;
   overflow: hidden;
}

.facility_sec2 .sub_categary img {
   width: 100%;
}

.facility_sec2 .sub_categary h6 {
   margin-top: 15px;
   text-align: center;
   font-weight: 500;
   margin-bottom: 1rem;
   font-family: var(--popp);
   font-size: 1.12rem;
}

.category_box {
   max-width: 200px;
   width: 100%;
   margin-inline: auto;
   background-color: #fff;
   /* border: 1px solid #ccc; */
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
   display: grid;
   place-items: center;
}

.owl-carousel .owl-item .category_box img {
   width: 100%;
   height: auto;
}

.certificate_card {
   position: relative;
   max-height: 400px;
   border: 1px solid #eee;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   border-radius: 12px 12px 0 0;
   transition: all 0.4s;
   cursor: zoom-in;
   overflow: hidden;
}

.certificate_img img {
   width: 100%;
   height: auto;
   object-fit: cover;
   object-position: top;
   transition: 1s;
}

.certificate_card:hover .certificate_img img {
   scale: 1.1;
}

.certificate_name {
   position: absolute;
   /* height: 80px; */
   bottom: 0px;
   width: 100%;
   padding: 6px 15px;
   font-weight: 500;
   text-align: center;
   background-color: #eee;
   transition: 1s;
}

.certificate_card:hover .certificate_name {
   transform: translateY(30px);
   opacity: 25%;
}

.video_container {
   position: relative;
   width: 100%;
   aspect-ratio: 16 / 9;
   overflow: hidden;
   border-radius: 10px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   -o-border-radius: 10px;
}

.video_container::before {
   content: "";
   position: absolute;
   inset: 100px;
   background-color: #0004;
   opacity: 0;
   transition: 0.5s;
   pointer-events: none;
}

.video_container:hover:before {
   inset: 0;
   opacity: 1;
}

.video_container a {
   display: inline-block;
   position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;
   z-index: 2;
}

.video_container .zoom-icon {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 2.81rem;
   height: 2.81rem;
   line-height: 2.81rem;
   font-size: 1.25rem;
   color: #000;
   text-align: center;
   background-color: #fff;
   color: white;
   border-radius: 50%;
   transition: 0.5s;
   z-index: 1;
   opacity: 0;
}

.video_container:hover .zoom-icon {
   opacity: 1;
}