@import url(./typogrphy.css);
@import url(./variables.css);

body {
  font-family: sf-pro-medium;
}

::-webkit-scrollbar {
  display: none;
}

.container {
  max-width: 85%;
}

a,
button {
  font-family: sf-pro-medium;
}

.mobile-menu-icon img {
  filter: invert(1);
}

.mobile-nav-search img {
  filter: invert(1);
}

.mobile-nav-search button {
  background: transparent;
}

.mobile-nav-search-2 img {
  filter: invert(0);
}

.mobile-fixed-svgicons button {
  background: transparent;
}

.mobile-fixed-svgicons span {
  font-size: 14px;
  color: #888888;
}

.mobile-nav-search-2 button {
  background: transparent;
}

.mobile-offcanvas {
  width: 90% !important;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  backdrop-filter: blur(10px);
  background: rgb(2, 0, 36);
  background: linear-gradient(38deg,
      rgba(2, 0, 36, 0.698091736694678) 0%,
      rgba(9, 9, 121, 0.7008928571428572) 44%,
      rgba(83, 119, 179, 0.698091736694678) 100%);
}

.service-box img {
  width: 100%;
}

.mobile-fixed {
  width: max-content;
  box-shadow: rgba(0, 0, 0, 0.113) 0px 3px 6px, rgba(0, 0, 0, 0) 0px 3px 6px;
  background-color: white;
  border-radius: var(--custome-radius);
}

.mobile-menu-icon {
  background: transparent;
}

.language-mobile .button {
  width: max-content;
  border-radius: 30px;
  box-shadow: rgba(255, 255, 255, 0.1) 0px 2px 2.6px;
}

.language-offcanvas-bottom .offcanvas-bottom {
  border-top-left-radius: var(--custome-radius);
  border-top-right-radius: var(--custome-radius);
  height: max-content;
}

.language-offcanvas-body a {
  background-color: #ededed;
  border-radius: 30px;
  width: max-content;
  padding: 10px 15px;
  font-size: 13px;
  box-shadow: rgb(0 0 0 / 10%) 0px 3px 2.6px;
}

/* .language-offcanvas-body a img {
  width: 100%;
  height: auto;
} */

.aquarium-slider {
  width: 100%;
  height: auto;
}

.menu-between-line {
  color: white;
  opacity: 0.2;
}

.offcanvas-close-icon {
  background: transparent;
}

.offcanvas-close-icon img {
  filter: invert(1);
}

.navbar {
  border-bottom: solid 1px rgba(0, 0, 0, 0.116);
  background-color: white;
  z-index: 100;
}

.navbar .nav-item .nav-link {
  padding: 10px 0 !important;
}

.navbar .nav-item.dropdown-li {
  position: relative;
}

.navbar .nav-item.dropdown-li .nav-link-inner {
  color: #777;
  text-decoration: none;
  font-weight: lighter;
}

.navbar .dropdown-li .dropdown-custom {
  position: absolute;
  top: 50%;
  left: 0;
  background-color: #fff;
  padding: 0px 0px 0px;
  border: 1px solid #ddd;
  opacity: 0;
  display: none;
  border-radius: 0 15px 15px 15px;
}

.navbar .dropdown-custom-inner {
  position: absolute;
  top: 0;
  left: 90%;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 0 15px 15px 15px;
  margin-top: -11px;
  opacity: 0;
  display: none;
}

.navbar .nav-item.dropdown-li:hover .dropdown-custom {
  opacity: 1;
  display: block;
  top: 100%;
  animation: dropdown 0.5s ease-in-out;
}

.navbar .dropdown-li-inner:hover .dropdown-custom-inner {
  opacity: 1;
  display: block;
  left: 100%;
  animation: dropdowninner 0.5s ease-in-out;
}

@keyframes dropdown {
  0% {
    top: 50%;
    opacity: 0;
  }

  100% {
    top: 100%;
    opacity: 1;
  }
}

@keyframes dropdowninner {
  0% {
    left: 90%;
    opacity: 0;
  }

  100% {
    left: 100%;
    opacity: 1;
  }
}

.navbar .dropdown-li .dropdown-custom ul {
  width: max-content;
  margin: 10px 0 !important;
}

.navbar .dropdown-li .dropdown-custom li {
  border-bottom: 1px solid #ddd;
  padding: 0px 0 10px;
}

.navbar .dropdown-li .dropdown-custom li:last-child {
  border-bottom: none;
}

.navbar .dropdown-li .dropdown-custom li a {
  padding: 0px 15px 0px !important;
}

.nav-item>.nav-link::after {
  content: "";
  width: 0%;
  position: absolute;
  height: 1px;
  background-color: #888888;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  transition: 0.4s;
}

.nav-item:hover .nav-link::after {
  width: 100%;
}

.nav-search>button,
.nav-shopping-cart>button {
  border-radius: 50%;
  line-height: 0;
  width: 35px;
  height: 35px;
  box-shadow: rgb(0 0 0 / 10%) 0px 2px 2.6px;
  background-color: #ededed;
}

.nav-item>.nav-link {
  font-size: 13px;
  color: #888888;
  position: relative;
  padding: 0 !important;
}

.navbar-nav .nav-link.active {
  color: #0a676e;
}

.navbar-nav {
  gap: 37px;
}

.language .button {
  background-color: #ededed;
  border-radius: 30px;
  width: 60px;
  height: 35px;
  font-size: 13px;
  box-shadow: rgb(0 0 0 / 10%) 0px 3px 2.6px;
}

.engish-language {
  color: #888888;
}

.language-customised-gap {
  gap: 5px;
}

.swiper {
  width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

.swiper-slide {
  background-size: cover;
  background-position: center;
}

.mySwiper2 {
  height: 80%;
  width: 100%;
}

.mySwiper {
  height: 25%;
  box-sizing: border-box;
}

.mySwiper .swiper-slide {
  width: 25%;
  height: 100%;

  opacity: 1;
}

.mySwiper .swiper-slide::after {
  content: "";
  position: absolute;
  height: 100px;
  background: linear-gradient(0deg,
      rgba(0, 0, 0, 0.8) 100%,
      rgba(255, 255, 255, 0) 100%);
  backdrop-filter: blur(2px);
  width: 100%;
  bottom: 0;
}

.mySwiper .swiper-slide-thumb-active::after {
  display: none;
}

.mySwiper .swiper-slide-thumb-active {
  opacity: 1;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.swiper-main-gradiant::after {
  content: "";
  position: absolute;
  width: 50%;
  height: 100%;

  background: linear-gradient(90deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(0, 0, 0, 0.700717787114846) 77%);
  top: 0;
  right: 0;
  z-index: 2;
}

.swiper-main-gradiant::before {
  content: "";
  position: absolute;
  width: 50%;
  height: 100%;

  background: linear-gradient(270deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(0, 0, 0, 0.700717787114846) 77%);
  top: 0;
  left: 0;
  z-index: 2;
}

.slider-content {
  bottom: 100px;
  z-index: 10;
  right: 0;
  left: 0;
  margin: auto;
}

.swiper-slide-child img {
  height: 100px;
}

.desktop-serach-modal .form-search>button {
  border-radius: 50%;
  background: rgb(255, 255, 255);
  background: linear-gradient(24deg,
      rgba(255, 255, 255, 1) 0%,
      rgba(237, 224, 224, 1) 31%);
  box-shadow: rgb(0 0 0 / 10%) 0px 3px 2.6px;
}

.desktop-serach-modal .form-search>input[type="text"] {
  width: 87%;
  border-radius: 30px;
  border: 0;
  background-color: #ededed;
  box-shadow: rgb(0 0 0 / 10%) 0px 3px 2.6px;
  padding-bottom: 5px;
}

.desktop-serach-modal .form-search>input[type="text"]:focus-visible {
  outline: 0;
}

.desktop-serach-modal .form-search>input[type="text"]::placeholder {
  font-size: 14px;
  color: #00000080;
  padding-bottom: 10px;
}

.search-modal-content {
  background: linear-gradient(38deg,
      rgb(7 63 157 / 70%) 0%,
      rgb(9 9 121 / 70%) 32%,
      rgb(2 0 36 / 70%) 100%);
  backdrop-filter: blur(10px);
}

.search-modal-content>.modal-header button {
  background-color: transparent;
  filter: invert(1);
}

.search-suggestions ul li img {
  filter: invert(1);
}

.swiper-button-next:after,
.swiper-button-prev:after {
  font-size: 12px;
}



.slider-content>h1 {
  font-size: 40px;
}

.slider-content>p {
  color: #eeeeee;
}

.slider-content span {
  color: #eeeeee;
}

.slider-content-botton .button-1 {
  border: 1px solid #075c63;
  padding: 5px 15px;
  border-radius: 30px;
  background-color: #075c63;
  box-shadow: rgb(255 255 255 / 36%) 0px 3px 3px -1px,
    rgba(255, 255, 255, 0.05) 0px 4px 6px -2px;
}

.slider-content-botton .button-2 {
  border: 1px solid white !important;
  padding: 5px 15px;
  border-radius: 30px;
  background-color: #ffffff;
  color: #333333;
  box-shadow: rgb(255 255 255 / 36%) 0px 3px 3px -1px,
    rgba(255, 255, 255, 0.05) 0px 4px 6px -2px;
}

.swiper-mobile-gradiant::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(0, 0, 0);
  background: linear-gradient(0deg,
      rgba(0, 0, 0, 0.8) 15%,
      rgba(255, 255, 255, 0) 100%);
  z-index: 1;
  bottom: 0;
}

.titles {
  font-size: 20px;
  color: #0a676e;
  font-size: 30px;
}

.titles-undergrapg {
  width: 280px;
  font-size: 12px;
  color: #444444;
}

.products-category .products-item {
  width: 100%;
  background-color: #f8fcff;
  transition: 0.3s;
  height: 100%;
}

.products-discription {
  line-height: 15px;
  color: #444444;
}

.products-category .col-4 {
  padding-right: 20px;
  padding-left: 20px;
}

.mySwiper4,
.swiper-slide {
  height: auto;
}

.services-type3>.top-p {
  color: #a9b5aa;
}

.services-type3 {
  background-color: #eef9ff;
}

.p-uniq {
  color: #a9b5aa;
}

.caompare-with-us {
  position: relative;
  overflow: hidden;
}

.caompare-with-us::after {
  content: " ";
  position: absolute;
  width: 260px;
  height: 100px;
  background-color: #1e00ff;
  top: -50px;
  left: 100px;
  border-radius: 50%;
  z-index: 0;
  filter: blur(20px);
  opacity: 0.6;
  transform: scale(1.5);
}

.caompare-with-us::before {
  content: " ";
  position: absolute;
  width: 100px;
  height: 80px;
  background-color: #ff0000;
  top: -50px;
  left: 400px;
  border-radius: 50%;
  z-index: 0;
  filter: blur(20px);
  opacity: 0.6;
  transform: scale(1.5);
}

.services-center-img::after {
  content: "";
  position: absolute;
  bottom: 0;
  height: 50%;
  width: 100%;
  background: rgb(255, 255, 255);
  background: linear-gradient(0deg,
      rgba(255, 255, 255, 0.164) 0%,
      rgba(255, 255, 255, 0) 60%);
  right: 0;
}

.services-type1 {
  background-color: #c6fafe;
}

.services-type1 .top-p {
  color: #444444;
}

.services-type1 .bottom-p {
  color: #a9b5aa;
}

.mySwiper5,
.mySwiper7,
.mySwiper6 {
  height: auto;
}

.contact-us-gradient {
  width: 50px;
  height: 100%;
  background: rgb(255, 255, 255);
  backdrop-filter: blur(5px);
  background: linear-gradient(90deg,
      rgba(255, 255, 255, 0.15) 0%,
      rgba(255, 255, 255, 0) 50%,
      rgba(255, 255, 255, 0.15) 100%);
}

.contact-us-icons {
  width: 30px;
  height: 30px;
  border-radius: 5px;
  background-color: #333333;
}

.mySwiper6 img {
  width: 100%;
  height: auto;
}

.mySwiper7 img {
  width: 40px !important;
}

.footer-hr {
  width: 55px;
  opacity: 1;
  background-color: white;
  height: 2.5px;
}

.footer-icons {
  width: 25px;
  height: 25px;
  border-radius: 5px;
  box-shadow: #0a676e 0px 0px 0px 2px, rgba(9, 30, 66, 0.13) 0px 0px 1px 1px;
  transition: 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer-icons:hover {
  transform: rotate(15deg);
}

#scrollBtn {
  background-color: transparent;
}

@keyframes jumpAnimation {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-5px);
  }
}

.to-top-icon {
  animation: jumpAnimation 1.5s infinite;
}

.contact-us-call {
  padding: 5px 15px;
  background-color: #075c63;
  border-radius: 30px;
  border: 1px solid #075c63;
  transition: 0.4s;
}

.contact-us-call:hover {
  background-color: transparent;
  color: #075c63 !important;
}

.contact-us-circle {
  width: 30px;
  height: 30px;
  background-color: #d9d9d9;
  border-radius: 50%;
}

.products-outinfo {
  background-color: #eef9ff;
}

.mobile-contactus::after {
  content: " ";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(255, 255, 255);
  background: linear-gradient(270deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 1) 80%);
  z-index: 1;
  bottom: 0;
  right: 0;
}

.products-item:hover {
  box-shadow: rgba(0, 0, 0, 0.082) 0px 3px 7px;
}

.seemore-transform:hover .seemore-i {
  transform: rotate(37deg);
}

.seemore-transform .seemore-i {
  transition: 0.4s;
}

.services-center-img:hover,
.services-type1:hover,
.services-type2:hover,
.services-type3:hover {
  scale: 1.01;
  opacity: 0.7;
}

.services-center-img,
.services-type1,
.services-type2,
.services-type3 {
  transition: 0.4s;
}

.nav-search>button:hover,
.nav-shopping-cart>button:hover,
.nav-shopping-cart>button:hover,
.language button:hover {
  box-shadow: none;
}

.nav-search>button,
.nav-shopping-cart>button,
.nav-shopping-cart>button,
.language button {
  transition: 0.4s;
}

.slider-content-botton .button-1:hover,
.slider-content-botton .button-2:hover {
  background-color: transparent;
  box-shadow: none;
  color: white;
  border-color: white !important;
}

.slider-content-botton .button-1,
.slider-content-botton .button-2 {
  transition: 0.4s all ease-in-out;
}

.contact-us-icons:hover,
.contact-us-circle:hover {
  transform: rotate(15deg);
}

.contact-us-icons,
.contact-us-circle {
  transition: 0.4s all ease-in-out;
}

.products-outinfo:hover {
  scale: 1.01;
  opacity: 0.7;
}

.products-outinfo {
  transition: 0.4s all ease-in-out;
}

.footer-ul a {
  transition: 0.4s;
  position: relative;
}

.footer-ul a::after {
  content: "";
  position: absolute;
  width: 0%;
  height: 1px;
  background-color: white;
  bottom: -2px;
  right: 0;
  left: 0;
  margin: auto;
  transition: all ease-in-out 0.4s;
}

.footer-ul a:hover::after {
  width: 100% !important;
}

.fixed-menu-active .img2 {
  display: none;
  opacity: 0;
}

.fixed-menu-active .img1:active .img2 {
  display: block;
  opacity: 1;
}

.offcanvas-top {
  height: max-content !important;
}

.mySwiper9 .swiper-slide img {
  height: auto;
}

.mySwiper-pro-new-2 .swiper-slide img {
  height: auto;
}


.discription img {
  height: auto !important;
}

.table-responsive {
  overflow-x: auto;
}

.social-search-offcanvas {
  width: 35%;
}

.scrolled {
  position: fixed;
  top: 0;
  z-index: 1000;
  animation: openfromside 0.3s;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

.services-bg-image {
  width: 100%;
  height: 20rem;
  background-size: cover;
  border-radius: 10px;
}

.working-bnt {
  border: 1px solid #075c63;
  padding: 5px 15px;
  border-radius: 30px;
  background-color: #075c63;
  transition: 0.3s;
}

.working-bnt:hover {
  background-color: transparent;
  color: #075c63 !important;
}



@keyframes openfromside {
  0% {
    opacity: 0;
  }

  50% {
    opacity: 0.5;
  }

  100% {
    opacity: 1;
  }
}

.boxdes input {
  opacity: 0;
  position: absolute;
  pointer-events: none;
}

.boxdes .p {
  overflow: hidden;
  white-space: inherit;
  word-wrap: break-word;
  transition: max-height 0.5s ease;
  color: #444;
  text-overflow: ellipsis;
  max-height: 25rem;
  line-height: 1.75rem;
  font-size: 0.9rem;
  position: relative;
}

.boxdes .button {
  border: 1px solid #075c63;
  padding: 5px 15px;
  border-radius: 30px;
  background-color: #075c63;
  color: #333333;
  transition: 0.4s;
  color: white;
  font-size: 12px;
  width: max-content;
  padding: 5px 10px !important;
  display: none;
}

.boxdes .button:hover {
  background-color: transparent;
  color: #075c63;
}

.boxdes input:checked+.p {
  --webkit-line-clamp: unset;
  max-height: inherit !important;
  height: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}

.mapi iframe {
  height: 100% !important;
}

.boxdes .p::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.81) 68%);
  height: 50%;
}

.boxdes .p.remove-after::after {
  content: unset !important;
}

.boxdes input:checked~.button {
  opacity: 0;
  visibility: hidden;
  max-height: 0;
}

.boxdes input:checked+.p::after {
  height: 0%;
}

.mapi iframe {
  width: 100%;
  border-radius: 10px;
}

.dropdown-button66 {
  background-color: #ededed;
  border-radius: 30px;
  /* width: 60px; */
  height: 35px;
  font-size: 13px;
  box-shadow: rgb(0 0 0 / 10%) 0px 3px 2.6px;
  border: 0;
  color: black;
  padding: 5px 10px;
}

.dropdown-menu66 {
  display: none;
  position: absolute;
  right: 0;
  background-color: white;
  min-width: 150px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  overflow: hidden;
  top: 100%;
  animation: dropdownSlide66 0.5s;
}

.dropdown-menu66 a {
  display: block;
  padding: 10px;
  text-decoration: none;

  color: black;
  transition: background 0.3s;
  color: rgb(136, 136, 136);
  font-size: 14px;
}

.dropdown-menu66 a:hover {
  background-color: #f1f1f1;
}

.dropdown66:hover .dropdown-menu66 {
  display: block;
}

@keyframes dropdownSlide66 {
  from {
    opacity: 0;
    transform: translateY(-15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.disabe-66 {
  pointer-events: none;
  color: rgb(136, 136, 136) !important;
}


.mySwiper8 img {
  border-radius: 15px;
}

.mySwiper-pro-new-1 img {
  border-radius: 15px;
}


/* .lla::before {
  color: black !important;
} */

.mySwiper19 img {
  border-radius: 15px;
}

.mySwiper-project-1 img {
  border-radius: 15px;
}


.mySwiper-project-3 img {
  border-radius: 15px;
}

.mySwiper70 img {
  border-radius: 15px;
}

.breadcrumb-item {
  font-size: 12px !important;
}

.breadcrumb-item+.breadcrumb-item::before {
  color: white !important;
}

.lla+.lla::before {
  color: black !important;
}

.noyfound-tx {
  color: #888888;
  font-size: 14px;
}

.admin-image {
  max-width: 100%;
}

.admin-sticy {
  display: none !important;
}

.hed2-pro {
  height: 80px;
  object-fit: cover;
}

.products-outinfo span {
  text-overflow: ellipsis;
  padding-bottom: 10px;
  -webkit-line-clamp: 2;
  /* تعداد خطوط که می‌خواهید نمایش داده بشه */
  -webkit-box-orient: vertical;
  display: -webkit-box;
  min-height: 52px;
}


.limit-10 {
    text-overflow: ellipsis;
  padding-bottom: 10px;
  -webkit-line-clamp: 2;
  /* تعداد خطوط که می‌خواهید نمایش داده بشه */
  -webkit-box-orient: vertical;
  display: -webkit-box;
  padding: 0 !important;
}

.fixed-whats-up {
  width: 61px;
  height: 55px;
  background-color: #25d366;
  transition: 0.5s all ease-in-out;
  overflow: hidden;
  align-content: center;
  border-radius: 15px;
}

.ks89dhwed:nth-child(1) .aqua-new-srvices {
  background: linear-gradient(60deg, rgba(97, 235, 255, 1) 6%, rgba(72, 167, 181, 1) 100%);
}

.ks89dhwed:nth-child(2) .aqua-new-srvices {
  background: linear-gradient(60deg, rgba(183, 95, 255, 1) 6%, rgba(139, 3, 249, 1) 100%);
}

.ks89dhwed:nth-child(3) .aqua-new-srvices {
  background: linear-gradient(60deg, rgba(255, 184, 207, 1) 6%, rgba(239, 90, 134, 1) 100%);
}

.ks89dhwed:nth-child(4) .aqua-new-srvices {
  background: linear-gradient(60deg, rgba(254, 198, 129, 1) 6%, rgba(249, 182, 93, 1) 100%);
}

.ks89dhwed:nth-child(1) .aqua-new-srvices:hover {
  background: linear-gradient(180deg, rgba(97, 235, 255, 1) 6%, rgba(72, 167, 181, 1) 100%);
}

.ks89dhwed:nth-child(2) .aqua-new-srvices:hover {
  background: linear-gradient(180deg, rgba(183, 95, 255, 1) 6%, rgba(139, 3, 249, 1) 100%);
}

.ks89dhwed:nth-child(3) .aqua-new-srvices:hover {
  background: linear-gradient(180deg, rgba(255, 184, 207, 1) 6%, rgba(239, 90, 134, 1) 100%);
}

.ks89dhwed:nth-child(4) .aqua-new-srvices:hover {
  background: linear-gradient(180deg, rgba(254, 198, 129, 1) 6%, rgba(249, 182, 93, 1) 100%);
}



.mySwiper-new-services img {
  width: 50px !important;
  height: 50px !important;
}

.project-invert {
  padding: 7px 14px;
  background-color: rgba(0, 0, 0, 0.028);
  border-radius: 30px;
  height: max-content;
  font-size: 14px;
  color: black;
}

.project-invert-disabled img {
  opacity: 25%;
}

.project-invert-disabled {
  color: rgba(0, 0, 0, 0.222);
}

.project-invert-disabled {
  pointer-events: none !important;
}

.manager-after .management::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 20%;
  background-color: #00000084 !important;
  backdrop-filter: blur(4px);
  width: 100%;
  border-radius: 0 0 20px 20px;
  z-index: 2;
}