
/* html {
    overflow-x: hidden;
  } */
  
  .aboutpage-overflow {
    overflow-x: visible;
  }
  
  body {
    font-family: "Outfit", sans-serif;
    overflow-x: hidden;
    background-color: #0F1215;

  }
  
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: "Outfit", sans-serif;
  }
  
  a {
    text-decoration: none !important;
  }
  
  p {
    color: #ccc;
    font-size: 16px;
    font-weight: 300;
  }
  
  .img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
  }
  
  .heading {
    font-size: 52px;
    color: #fff;
    margin-bottom: 10px;
    line-height: 1.3;
    text-transform: capitalize;
  }
  
  .center-heading {
    text-align: center;
  }
  .sub-title {
    font-size: 20px;
    color: #ccc;
    margin-bottom: 30px;
    line-height: 1.5;
    text-transform: uppercase;
  }
  

  
  /*----------- button -------------*/
  

.default-btn {
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  border-radius: 100px;
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  display: inline-block;
}

.default-btn a,
.default-btn button,
.mas,
.default-btn .subs-btn {
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
}

.mas {
  color: #fff;
  text-align: center;
  width: 101%;
  position: absolute;
  overflow: hidden;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.default-btn a,
.default-btn .subs-btn,
.default-btn button {
  display: block;
  padding: 13px 20px;
  background: #fff;
  color: #000;
  text-align: center;
  -webkit-mask: url(../images/butn-bg.webp);
  mask: url(../images/butn-bg.webp);
  -webkit-mask-size: 2300% 100%;
  mask-size: 2300% 100%;
  -webkit-animation: ani2 0.7s steps(22) forwards;
  animation: ani2 0.7s steps(22) forwards;
  border: 1px solid #666;
  border-radius: 100px;
}

.default-btn a:hover,
.default-btn button:hover,
.default-btn .subs-btn:hover {
  -webkit-animation: ani 0.7s steps(22) forwards;
  animation: ani 0.7s steps(22) forwards;
}

.default-btn .subs-btn {
  border: 0px;
}
.btn-wrap {
    text-align: center;
    margin-top: 20px;
}
.grey-btn {
  outline: 2px solid #242424;
  outline-offset: -1px;
}

.grey-btn a {
  background: #242424;
  color: #fff;
}

/*------*/

.white-btn {
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  border-radius: 100px;
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  display: inline-block;
  border: 1px solid #ffa011;
}

.white-btn a,
.mass {
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
}

.mass {
  color: #fff;
  text-align: center;
  width: 101%;
  position: absolute;
  overflow: hidden;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.white-btn a {
  display: block;
  padding: 13px 20px;
  background: #fff;
  color: #000;
  text-align: center;
  -webkit-mask: url(../images/butn-bg.webp);
  mask: url(../images/butn-bg.webp);
  -webkit-mask-size: 2300% 100%;
  mask-size: 2300% 100%;
  -webkit-animation: ani2 0.7s steps(22) forwards;
  animation: ani2 0.7s steps(22) forwards;
  border-radius: 100px;
}

.white-btn a:hover {
  -webkit-animation: ani 0.7s steps(22) forwards;
  animation: ani 0.7s steps(22) forwards;
}

.white-btn-reverse {
  background: #fff;
}

.white-btn-reverse a {
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  color: #fff;
}

.white-btn-reverse .mass {
  color: #000;
}

@keyframes ani {
  from {
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
  }
  to {
    -webkit-mask-position: 100% 0;
    mask-position: 100% 0;
  }
}

@keyframes ani2 {
  from {
    -webkit-mask-position: 100% 0;
    mask-position: 100% 0;
  }
  to {
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
  }
}


  /*--------------- header ---------------*/

.header-area {
    padding: 15px 0px;
    position: relative;
    background-color: #000;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
  }


  
  .logo a {
    display: inline-block;
  }
  
  .logo a img {
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    width: 150px;
  }
  
  .stick {
        padding: 20px 0px;
    background: #000;
    position: fixed;
  }
  .header-area.stick{
    position: fixed;
    box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
  }
  .header-area.stick {
    margin-top: 0;
    box-shadow: none;
  }

  
  .stick .logo a img {
    width: 140px;
  }
  
  .main-menu {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: auto;
  }
  
  .main-menu ul {
    margin: 0;
  }
  
  .main-menu ul li {
    margin-left: 25px;
    display: inline-block;
  }
  
  .main-menu ul li a {
    color: #ccc;
    font-size: 15px;
    font-weight: 300;
    position: relative;
    transition: all 0.2s ease-In;
  }
   .main-menu ul li a:hover{
    color: #fff !important;
  }
  
  .main-menu ul li a:before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: -3px;
    transition: 0.5s transform ease;
    transform: scale3d(0, 1, 1);
    transform-origin: 0 50%;
    transform-origin: 50% 50%;
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  }
  
  .main-menu ul li a:hover {
    color: #fff;
  }
  
  .main-menu ul li a:hover::before,
  .main-menu ul li a.active::before {
    transform: scale3d(1, 1, 1);
  }
  .main-menu ul li a.active,
  .bigmenu-content a.active {
    color: #A7EE50;
  }
  .dropdown{position: relative;}
.dropdown:hover .dropdown-menu,
.dropdown-menu:hover {

  opacity: 1;
  visibility: visible;
  display: block;
  transform: translateY(3px);
}
.dropdown-menu.solution{
  width: 1100px;
  position: absolute;
  top: 100%; /* ensures it sits directly below */
  left: 0;
  display: none;
  transform: translateY(10px);
  transition: all .5s ease-in-out;
  z-index: 999;
  overflow-y: scroll;
  background-color: #242424;
  padding: 30px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  box-shadow: 0 1px 15px rgba(0, 0, 0, 0.2);
}
/* .dropdown-menu.solution.show {
    position: absolute !important;
    transform: none !important;
    top: unset !important;
    left: 0px !important;
    will-change: unset !important;
} */
.dropdown-menu.solution .menu-item-box .menu-img img {
    width: 100%;
    border-radius: 5px;
    margin-bottom: 10px;
}
.main-menu .menu-title a {
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    transition: all 0.2s ease-In;
}
.main-menu .menu-title a::before{
  display: none;
}
.main-menu .menu-title a:hover{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
} 
.main-menu .menu-title p {
    font-size: 14px;
    margin-bottom: 20px;
}
.main-menu ul li {
    position: unset;
}
  .arrow-link img {
    width: 12px;
    opacity: 0.6;
    transform-origin: 0% 50%;
    transition: all 0.2s ease-In;
  }
  
  .arrow-link:hover img {
    opacity: 1;
    transform: rotate(-45deg);
  }
  
.rightmenu-link {
    display: flex;
    align-items: center;
    justify-content: end;
  }
  .rightmenu-link .default-btn.grey-btn a {
    padding: 12px 40px;
}
  
  .menu-login {
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    transition: all 0.2s ease-In;
    position: relative;
  }
  
  .menu-login:before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: -3px;
    transition: 0.5s transform ease;
    transform: scale3d(0, 1, 1);
    transform-origin: 0 50%;
    transform-origin: 50% 50%;
    background: #439F19;
  }
  
  .menu-login:hover::before {
    transform: scale3d(1, 1, 1);
  }
  
  .menu-login:hover {
    color: #439F19;
  }
  
  .menu-login,
  .rightmenu-link .default-btn,
  .toogle-line {
    margin-left: 22px;
  }
  .right-contact {
    display: flex;
    justify-content: space-between;
    list-style: none;
}

.top-menu-social {
    padding: 0;
    display: flex;
    list-style: none;
}
.top-menu-social li{margin-right: 10px;}
.top-menu-social li a{color: #fff;}
.right-contact li a{color: #fff;font-weight: 300;}
.top-header .menu-social {
    margin: 0;
}
  /*------- menu line butn ------*/
  
  .toogle-line {
    display: flex;
    align-items: center;
  }
  
  .btn1 {
    position: relative;
    cursor: pointer;
    border-radius: 50%;
    display: inline-block;
    width: 22px;
  }
  
  .btn1 .menu-line {
    transition: all 400ms cubic-bezier(0, 0, 0.58, 1);
    height: 1.3px;
    width: 100%;
    background: #fff;
    position: relative;
    float: right;
  }
  
  .btn1 .icon-center {
    margin-top: 6px;
    width: 80%;
  }
  
  .btn1 .icon-bottom {
    margin-top: 6px;
    width: 80%;
  }
  
  .btn1:hover .menu-line {
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    width: 100%;
  }
  
  .wrapper-menu {
    width: 20px;
    height: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    transition: transform 330ms ease-out;
  }
  
  .wrapper-menu.close-sign {
    transform: rotate(-45deg);
  }
  
  .line-menu {
    background-color: #fff;
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    border-radius: 5px;
    width: 100%;
    height: 3px;
  }
  
  .line-menu.half {
    width: 50%;
  }
  
  .line-menu.start {
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: right;
  }
  
  .wrapper-menu.close-sign .line-menu.start {
    transform: rotate(-90deg) translateX(3px);
  }
  
  .line-menu.end {
    align-self: flex-end;
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: left;
  }
  
  .wrapper-menu.close-sign .line-menu.end {
    transform: rotate(-90deg) translateX(-3px);
  }
  
  .wrapper-menu:hover .line-menu {
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  }
  
  .menu-button {
    position: relative;
    margin: 0;
  }
  
  .menu-button span {
    background: #fff;
    border-radius: 10px;
    height: 2px;
    margin: 3px 0;
    transition: 0.4s cubic-bezier(0.68, -0.6, 0.32, 1.6);
  }
  
  .menu-button:hover span {
    background: #ffa011;
  }
  
  .menu-button span:nth-of-type(1) {
    width: 50%;
  }
  
  .menu-button span:nth-of-type(2) {
    width: 100%;
  }
  
  .menu-button span:nth-of-type(3) {
    width: 75%;
  }
  
  .menu-button input[type="checkbox"] {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    z-index: 1;
    cursor: pointer;
  }
  
  .menu-button input[type="checkbox"]:checked ~ span:nth-of-type(1) {
    transform-origin: bottom;
    transform: rotatez(45deg) translate(4px, 0px);
  }
  
  .menu-button input[type="checkbox"]:checked ~ span:nth-of-type(2) {
    transform-origin: top;
    transform: rotatez(-45deg);
  }
  
  .menu-button input[type="checkbox"]:checked ~ span:nth-of-type(3) {
    transform-origin: bottom;
    width: 50%;
    transform: translate(14px, -3px) rotatez(45deg);
  }

  /*-------------- big menu ------------*/

.nonoverflow {
    overflow-x: unset !important;
    overflow-y: hidden !important;
  }
  
  .menu-logobar {
    box-shadow: none !important;
    background: transparent !important;
  }
  
  .menu-logobar .main-menu ul,
  .menu-logobar .rightmenu-link .select-country,
  .menu-logobar .rightmenu-link .menu-login,
  .menu-logobar .rightmenu-link .default-btn {
    display: none;
  }
  
  .menu-close {
    color: #fff;
    text-align: right;
    margin-bottom: 5px;
    position: absolute;
    right: 10%;
    top: 0;
    cursor: pointer;
  }
  
  .menu.open {
    opacity: 1;
    visibility: visible;
    height: 100%;
  }
  
  .menu {
    transition: all 1s cubic-bezier(0.17, 0.04, 0.03, 0.94);
    overflow: hidden;
    box-sizing: border-box;
    visibility: hidden;
    opacity: 0;
    width: 100%;
    height: 0;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 8;
    background: #131313;
  }
  
  .menu::-webkit-scrollbar {
    width: 4px;
    background: #131313;
  }
  
  .menu::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
  }
  
  .menu::-webkit-scrollbar-thumb {
    background-color: rgb(255 255 255 / 80%);
    outline: none;
    border-radius: 50px;
  }
  
  .bigmenu-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    position: relative;
  }
  
  .bigmenu-content-center {
    width: 40%;
  }
  
  .bigmenu-content-left,
  .bigmenu-content-right {
    width: 50%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  .bigmenu-main-link.menu-servicelink li a {
    font-size: 24px;
}
  .menu-servicelink{
  border-top: 1px solid rgb(255 255 255 / 30%);
  border-bottom: 1px solid rgb(255 255 255 / 30%);
  margin: 10px 0px;
  padding: 10px 10px;
  position: relative;
  height: 290px;
  overflow-y: scroll;
  overflow-x: hidden;
}

.menu-servicelink::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

.menu-servicelink::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}

.menu-servicelink::-webkit-scrollbar-thumb
{
	background-color: #439F19;
}

.menu-servicelink::before{
  content: "Services";
  pointer-events: none;
  position: absolute;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: rgba(16, 140, 45, 0.4);
  color: transparent;
  font-size: 64px;
  left: -30px;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-90deg);
  transition: all .8s cubic-bezier(0, 0, 0.58, 1);
  line-height: 1;
  opacity: 0;
}

.menu.open .menu-servicelink::before{
  opacity: 1;
  left: 30px;
  transition-delay: 0.5s;
}
  .bigmenu-main-link {
    margin: 0;
    padding: 0;
    list-style: none;
    transition: all 500ms cubic-bezier(0, 0, 0.58, 1);
    height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 40px;
    padding-top: 40px;
    text-align: right;
    border-top: 1px solid #666;
    border-bottom: 1px solid #666;
  }
  .menu-rating ul {
    padding-left: 0;
    list-style: none;
    display: inline-flex;
}
.menu-rating ul li svg{
  color: #439F19;
}
.menu-rating {
        display: inline-flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 30px;
}
.menu-rating img{
    width: 200px;
    height: 70px;

}
.menu-contact {
    padding-left: 0;
    list-style: none;
    color: #fff;
}
.menu-contact li{
  color: #fff;
  margin: 5px 0;
}
.menu-contact li a{
  color: #fff;
  margin: 5px 0;
}
.menu-contact li a:hover{
  color: #439F19;
}
.menu-rating ul li:nth-child(5){
    margin-right: 10px;
}
.menu-rating ul li:nth-child(6){
    color: #fff;
    font-size: 20px;
}
  .bigmenu-main-link::-webkit-scrollbar {
    width: 4px;
    background: #131313;
  }
  
  .bigmenu-main-link::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
  }
  
  .bigmenu-main-link::-webkit-scrollbar-thumb {
    background-color: rgb(255 255 255 / 80%);
    outline: none;
    border-radius: 50px;
  }
  
  .bigmenu-main-link li {
    margin-bottom: 12px;
    opacity: 0;
    line-height: 1.3;
    transform: translateX(30px);
    transition: all 500ms cubic-bezier(0, 0, 0.58, 1);
  }
  
  .bigmenu-main-link li:last-child {
    margin-bottom: 0px;
  }
  
  .menu.open .bigmenu-main-link li {
    opacity: 1;
    transform: translateX(0px);
  }
  
  .menu.open .bigmenu-main-link li:nth-child(1) {
    transition-delay: 0.3s;
  }
  .menu.open .bigmenu-main-link li:nth-child(2) {
    transition-delay: 0.6s;
  }
  .menu.open .bigmenu-main-link li:nth-child(3) {
    transition-delay: 0.9s;
  }
  .menu.open .bigmenu-main-link li:nth-child(4) {
    transition-delay: 1.2s;
  }
  .menu.open .bigmenu-main-link li:nth-child(5) {
    transition-delay: 1.5s;
  }
  .menu.open .bigmenu-main-link li:nth-child(6) {
    transition-delay: 1.8s;
  }
  .menu.open .bigmenu-main-link li:nth-child(7) {
    transition-delay: 2.1s;
  }
  .menu.open .bigmenu-main-link li:nth-child(8) {
    transition-delay: 2.4s;
  }
  .menu.open .bigmenu-main-link li:nth-child(9) {
    transition-delay: 2.7s;
  }
  .menu.open .bigmenu-main-link li:nth-child(10) {
    transition-delay: 3s;
  }
  
  .bigmenu-main-link li a {
    font-size: 30px;
    color: #fff;
    font-weight: 600;
    text-transform: capitalize;
    display: inline-block;
    position: relative;
    transition: all 500ms cubic-bezier(0, 0, 0.58, 1);
        font-family: "Outfit", sans-serif;
  }
  
  .bigmenu-main-link:hover li a {
    opacity: 0.3;
  }
  
  .bigmenu-main-link li a:hover {
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    opacity: 1;
    transform: translateX(10px);
  }
  
  .bigmenu-innerlinks {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.6s;
    margin-top: 6px;
    padding-right: 20px;
    position: relative;
    height: auto;
    color: rgb(255 255 255 / 30%);
    transition: all 1s ease-in-out;
  }
  
  .bigmenu-main-link li:hover .bigmenu-innerlinks {
    max-height: 20em;
    overflow: visible;
  }
  
  .bigmenu-innerlinks a {
    font-size: 15px !important;
    font-weight: 400 !important;
    margin: 4px;
    transition: all 0.3s ease-in-out;
  }
  
  .bigmenu-innerlinks a:hover {
    transform: translateX(0px) !important;
  }
  
  .menu-contactlink .fa-whatsapp,
  .menu-contactlink .fa-envelope,
  .menu-contactlink .fa-phone,
  .menu-contactlink .fa-location-dot {
    color: rgb(255 255 255 / 40%);
    font-size: 14px;
    margin-top: 6px;
    margin-right: 5px;
  }
  
  .menu-contactlink {
    border-bottom: 1px solid rgb(255 255 255 / 20%);
    padding-bottom: 15px;
    margin-bottom: 15px;
    opacity: 0;
    transform: translateX(30px);
    transition: all 1s cubic-bezier(0, 0, 0.58, 1);
  }
  
  .menu.open .menu-contactlink {
    opacity: 1;
    transform: translateX(0px);
    transition-delay: 0.5s;
  }
  
  .menu-contactlink:last-child {
    border-bottom: 0px;
    padding-bottom: 0px;
    margin-bottom: 0px;
  }
  
  .menu-contactlink p {
    font-size: 24px;
    color: #fff;
    margin-bottom: 6px;
    line-height: 1;
  }
  
  .menu-contactlink span {
    color: rgb(255 255 255 / 40%);
    font-size: 14px;
    display: block;
  }
  
  .menu-contactlink ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  .menu-contactlink ul li {
    display: flex;
    align-items: start;
    margin-bottom: 6px;
  }
  
  .menu-contactlink ul li:last-child {
    margin-bottom: 0px;
  }
  
  .menu-contactlink ul li a {
    color: rgb(255 255 255 / 40%);
    font-size: 15px;
    position: relative;
  }
  .gradiant-color {
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
.readmore{
  margin-top: 10px;
  text-transform: uppercase;
}
  .menu-contactlink ul li a:hover {
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
  
  .menu-contactlink ul li a:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: -2px;
    height: 1.3px;
    width: 0;
    transition: width 0s ease, background 0.25s ease;
  }
  
  .menu-contactlink ul li a:after {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: -2px;
    height: 1.3px;
    width: 0;
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    transition: width 0.5s ease;
  }
  
  .menu-contactlink ul li a:hover:before {
    width: 100%;
    background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    transition: width 0.5s ease;
  }
  
  .menu-contactlink ul li a:hover:after {
    width: 100%;
    background: transparent;
    transition: all 0s ease;
  }
  
  .menu-copyright {
    opacity: 0;
    transform: translateX(-30px);
    transition: all 1s cubic-bezier(0, 0, 0.58, 1);
  }
  
  .menu.open .menu-copyright {
    opacity: 1;
    transform: translateX(0px);
    transition-delay: 0.5s;
  }
  
  .menu-copyright h4 {
    font-size: 40px;
    color: #fff;
    line-height: 1;
    margin-bottom: 2px;
  }
  
  .menu-copyright p {
    font-size: 13px;
    color: #fff;
    margin-bottom: 0;
  }
  
  .menu-social {
    margin: 30px 0px;
    list-style: none;
    padding: 0;
  }
  
  .menu-social li {
    display: inline-block;
    transition: all 800ms cubic-bezier(0, 0, 0.58, 1);
  }
  
  .menu-social li a {
    transition: all 0.2s ease-In;
    color: #fff;
    width: 38px;
    height: 38px;
    border-radius: 5px;
    background: #242424;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 2px;
    font-size: 14px;
    border: 1px solid rgb(255 255 255 / 12%);
  }
  
  .menu-social li:nth-child(1) a:hover {
    background: #3b579d;
    border-color: #3b579d;
  }
  
  .menu-social li:nth-child(2) a:hover {
    background: #d62976;
    border-color: #d62976;
  }
  
  .menu-social li:nth-child(3) a:hover {
    background: #0f1419;
    border-color: #0f1419;
  }
  
  .menu-social li:nth-child(4) a:hover {
    background: #006699;
    border-color: #006699;
  }
  
  
  
  /*-----*/
/* Banner Section */
.banner-section{
  position: relative;
  display: flex;
  align-items: center;
  background: url(../images/banner.webp) no-repeat center center/cover;
  height: 700px;
  object-fit: cover;
}
.banner-section .banner-content p {
  color: #fff;
}
.banner-section .info-box{
  position: absolute;
    display: flex;
    transform: translate(-50%, -50%);
    top: 90%;
    left: 50%;
    justify-content: end;
    align-items: center;
      background: rgb(255 255 255 / 12%);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    padding: 10px 20px;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
}
.banner-section .info-box a{
  color: #fff;
  margin-left: 20px;
  font-size: 18px;
  text-decoration: underline !important;
}
.banner-section .info-box div {
    border: 1px dotted #fff;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 20px;
}
.optimize-section{
  position: relative;
}
.optimize-section .optimize-box{
  position: relative;
  margin-bottom: 30px;
  overflow: hidden;
  border-radius: 10px;
  
}
.optimize-section .optimize-box img {
    width: 100%;
    border-radius: 10px;
    transition: transform 0.4s ease-in-out 0s;
}
.optimize-section .optimize-box:hover img{
  transform: scale(1.03);
}
.optimize-section .optimize-content {
    position: absolute;
    top: 25%;
    padding: 20px;
    width: 70%;
}
.optimize-section .optimize-box p{
  color: #fff;
}
.mobile-app-section{
  position: relative;
  padding: 80px 0;
}
.mobile-app-section .app-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #242424;
    border: 1px solid #6c757d;
    border-radius: 20px;
    background-clip: padding-box;
}

.mobile-app-section .app-wrapper .side-img {
    width: 40%;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}
.mobile-app-section .app-wrapper .app-content {
    padding: 40px;
}
.mobile-app-section .app-wrapper .app-source {
    display: flex;
}
.mobile-app-section .app-wrapper .app-source img{
  width: 150px;
  margin-right: 20px;
}
.form-group .rating, .form-group p{
  text-align: left;
}

/* About Css */
.about-section, .why-choose-section {
  position: relative;
  padding: 80px 0px;
}
.why-choose-section .default-btn.grey-btn {
    margin-top: 30px;
}
.about-section .about-image-wrapper .about-image {
  border-radius: 10px;
  transition: transform 0.4s ease-in-out 0s;
}

/* Product css */
.product-slider{display: flex;}
.wishlist {
    position: absolute;
    width: 50px;
    height: 50px;
    right: 20px;
    top: 8px;
    background: #fff;
    justify-content: center;
    border-radius: 50%;
    font-size: 18px;
    color: #A7EE50;
    transition: all 0.2s ease-In;
    cursor: pointer;
    z-index: 1;
}
.wishlist:hover{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  color: #fff;
}
.story-box .price-detail .selling-price {
    margin-bottom: 0;
    font-size: 22px;
    font-weight: 500;
    color: #fff;
    margin-right: 10px;
}
.story-box .price-detail del{
  color: #343434;
}
.story-box .price-detail del {
    color: #999;
}
.product-slider .arrow {
    position: absolute;
    top: 50%;
    background-color: #fff;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: opacity 0.2s ease-In;
}

.product-slider .slider.slider-for{
  position: relative;
}
.product-slider .slider.slider-for .wishlist{

}

.product-slider .arrow:hover{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  color: #fff;
}
.product-slider .arrow-left{
  left: -20px;
}

.product-slider .arrow-right{
  right: -20px;
}

/* Choose Css */
.why-choose-section .choose-box {
  position: relative;
  margin-top: 30px;
  background: #242424;
  border: 1px solid #6c757d;
  padding: 22px;
  border-radius: 20px;
  background-clip: padding-box;
  min-height: 300px;
  transition: opacity 0.2s ease-In;
}
.why-choose-section .choose-box:hover p{
  color: #fff;
}
.why-choose-section .choose-box img{
  width: 70px;
  height: 70px;
}
.why-choose-section .choose-box .choose-title{
  color: #fff;
  margin-top: 20px;
  font-size: 22px;
  font-weight: 600;
}
.why-choose-section .choose-box:hover{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  color: #fff;
  cursor: pointer;
}














/* old css */
.collateral-client {
  margin-bottom: 80px;
}

.client-subhead {
  color: #fff;
  text-align: center;
  margin: 20px 0px 0px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.client-subhead img {
  width: 16px;
  margin-left: 6px;
}

.client-slider {
  margin-top: 40px;
  position: relative;
}

.client-slider .swiper-slide {
  background: rgb(52 52 52 / 80%);
  padding: 30px;
  text-align: center;
}

.client-slider .swiper-slide img {
  display: block;
  margin: 0 auto;
  width: 90px;
}

.client-slider .swiper-slide h4 {
  display: inline-block;
  margin: 20px 0px 10px;
  line-height: 1.1;
  text-transform: uppercase;
  font-size: 28px;
}

.client-slider .swiper-slide p {
  color: #e9eaf2;
  margin-bottom: 10px;
}

.client-slider .swiper-slide span {
  color: #e9eaf2;
  display: block;
  text-transform: uppercase;
  font-size: 14px;
}

.client-slider .swiper-slide.swiper-slide-active {
  background: #ffffff;
}

.client-slider .swiper-slide.swiper-slide-active p {
  color: rgb(0 0 0 / 80%);
}

.client-slider .swiper-slide.swiper-slide-active span {
  color: #000;
}

.client-slider .arrow-left,
.client-slider .arrow-right {
  z-index: 3;
}
.swiper-slide .arrow-left,
.swiper-slide .arrow-right {
  z-index: 3;
}

.client-slider .arrow-left {
  left: -25px;
}

.client-slider .arrow-right {
  right: -25px;
}

/* old css */
.location-client .swiper-container {
  position: relative;
}

.location-client .swiper {
  width: 100%;
  padding: 60px 0 0 0;
}

.location-client .swiper-slide {
  width: 10rem;
  height: 26rem;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  position: relative;
  border-radius: 12px;
  box-shadow: -1px 5px 15px #0000001f;
  padding: 30px;
  text-align: center;
  background: #343434;
  background: linear-gradient(to bottom, #343434, #343434);
}

.location-client .swiper-slide-active {
  background: #fff;
  background: -webkit-linear-gradient(to bottom, #fff, #fff);
  background: linear-gradient(to bottom, #fff, #fff);
}

.location-client .swiper-slide img {
  display: block;
  margin: 0 auto 10px;
  width: 150px;
}
.location-client .swiper-slide h4 {
  margin: 0px;
  text-transform: uppercase;
  font-size: 18px;
}
.location-client .swiper-slide .h4 {
  margin: 0px;
  text-transform: uppercase;
  font-size: 18px;
  font-family: "Lexend", sans-serif;
}
.location-client .swiper-slide .slide-content p {
  color: #e9eaf2;
  margin-bottom: 10px;
  text-align: center;
}

.location-client .swiper-slide-active p {
  color: #000;
}

.location-client .swiper-button-prev {
  background: white;
  border-radius: 50%;
  top: 47%;
  left: -30px;
  width: 50px;
  height: 50px;
  box-shadow: 0px 2px 11px rgb(0 0 0 / 17%);
}

.location-client .swiper-button-next {
  background: white;
  border-radius: 50%;
  top: 47%;
  right: -30px;
  width: 50px;
  height: 50px;
  box-shadow: 0px 2px 11px rgb(0 0 0 / 17%);
}

.location-client .swiper-button-prev,
.location-client .swiper-button-next {
  display: none;
}
.location-client.DM-testimonial .arrow-left {
    top: 50%;
    position: absolute;
    color: #fff;
    z-index: 1;
    width: 50px;
    height: 50px;
    background: #ffffff29;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    left: 0;
    transition: all 0.2s ease-In;
    border: 1px solid #666;
}
.location-client.DM-testimonial .arrow-right {
    top: 50%;
    position: absolute;
    color: #fff;
    z-index: 1;
    width: 50px;
    height: 50px;
    background: #ffffff29;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    right: 0;
    transition: all 0.2s ease-In;
    border: 1px solid #666;
}
.location-client.DM-testimonial .arrow-right:hover, 
.location-client.DM-testimonial .arrow-left:hover{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  color: #fff;
}

/*-----------------*/

.featured-stories {
  position: relative;
  padding: 30px 0 80px;
}

.featured-stories .heading {
  text-align: center;
  margin-bottom: 30px;
}
.featured-stories .story-box .story-title {
  font-size: 18px;
  color: #fff;
  font-weight: 500;
}
.featured-stories .story-box .story-content {
  min-height: 90px;
  font-size: 15px;
}
.request-content {
    text-align: center;
}
.request-content .request-text.text-center {
    width: 80%;
    margin: 10px auto 30px;
}
.story-box {
  position: relative;
  border: 1px solid rgb(255 255 255 / 15%);
  background: #242424;
  background-clip: padding-box;
  border-radius: 20px;
  padding: 12px;
  display: inline-block;
  margin-bottom: 30px;
  width: 100%;
}
.featured-stories .story-box .home-blog-title,
.bloglist-box .home-blog-title {
  font-weight: 600;
  font-size: 20px;
  color: #fff;
}
.story-box:after {
  content: "";
  position: absolute;
  top: -1px;
  bottom: -1px;
  left: -1px;
  right: -1px;
  background: transparent;
  z-index: -1;
  border-radius: 20px;
  opacity: 0;
  transition: opacity 0.2s ease-In;
}

.story-box:hover:after {
  opacity: 1;
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
}

.story-box .img-responsive {
  border-radius: 20px;
  width: 100%;
  height: 240px;
  object-fit: cover;
  margin-bottom: 20px;
  transition: transform 0.4s ease-in-out 0s;
}
.story-box{
  overflow: hidden;
}
.story-box:hover img{
  transform: scale(1.03);
}
.story-box:hover{
  border: 1px solid #A7EE50;
}
.story-box div {
  display: flex;
  align-items: center;
  margin: 12px 0px;
}

.story-box div img {
  width: 45px;
  margin-right: 10px;
}

.story-box div small {
  color: rgb(255 255 255 / 40%);
  font-size: 90%;
  font-weight: 300;
}

.story-box span {
  background: rgb(153 153 153 / 8%);
  border: 1px solid rgb(255 255 255 / 15%);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease-In;
  float: right;
}

.story-box span img {
  width: 15px;
}

.story-box:hover span {
  transform: rotate(-45deg);
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
}


.oxyiotnews-area {
  margin-bottom: 80px;
}

.oxyiotnews-area .heading {
  margin-bottom: 40px;
}
.oxyiotnews-box img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
}
.oxyiotnews-box {
  /* background: #0F1215;
  border-bottom: 1px solid rgb(0 0 0 / 30%); */
  padding-bottom: 20px;
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
}

.oxyiotnews-box h4 {
  font-size: 22px;
  color: #fff;
  margin-bottom: 5px;
}

.oxyiotnews-box label {
  font-size: 13px;
  color: #666;
  text-transform: uppercase;
  display: block;
  margin: 10px 0px 5px;
  font-weight: 400;
}

.oxyiotnews-view {
  text-align: center;
  margin-top: 30px;
}

.oxyiotnews-right {
  border-bottom: 1px solid rgb(0 0 0 / 30%);
  padding-bottom: 20px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
}

.oxyiotnews-right:last-child {
  margin-bottom: 0px;
}

.oxyiotnews-right .oxyiot-new {
  width: 214px;
  margin-right: 15px;
}
.oxyiotnews-right .oxyiot-new img{
  border-radius: 7px;
}


.home-news .oxyiot-content {
  width: 400px;
}

.oxyiotnews-right div label {
  font-size: 13px;
  color: #666;
  text-transform: uppercase;
  display: block;
  margin: 0px 0px 5px;
  font-weight: 400;
}

.oxyiotnews-right div h4 {
  font-size: 18px;
  color: #fff;
  margin-bottom: 5px;
}
.oxyiotnews-right div h4:hover, .oxyiotnews-box h4:hover {
  color: #439F19;
}
.oxyiotnews-more {
  color: rgb(0 0 0 / 40%);
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.5px;
  transition: 0.3s ease-out;
}

.oxyiotnews-more .fa-arrow-right, .fa-arrow-right {
  transition: 0.2s ease-out;
  margin-left: 3px;
}

.oxyiotnews-more:hover {
  color: #439F19;
}
.default-btn:hover .fa-arrow-right, .trans-btn:hover .fa-arrow-right{
  transform: rotate(-45deg);
}

.home-news .oxyiotnews-more:hover i {
  color: #ae0000;
}
.home-news .oxyiotnews-more:hover .fa-arrow-right {
  transform: translatex(2px);
  color: #ae0000;
}
.fa-arrow-right
.oxyiotnews-more:hover .fa-arrow-right {
  transform: translatex(2px);
  color: #439F19;
}

.oxyiotnews-box p {
  color: #666;
  line-height: 1.8;
}

.newsarea-marquee {
  --gap: -462px;
  position: relative;
  overflow: hidden;
  user-select: none;
  gap: var(--gap);
  flex-direction: column;
  align-items: center;
  height: 467px;
}

.newsarea-marquee-content {
  flex-direction: column;
  justify-content: space-around;
  gap: var(--gap);
  align-items: center;
  animation: scroll-mar 40s linear infinite;
  list-style: none;
  margin: 0;
  padding: 0;
}

.newsarea-marquee:hover .newsarea-marquee-content {
  animation-play-state: paused;
}

@keyframes scroll-mar {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(calc(-100% - var(--gap)));
  }
}

.author-social-share {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.author-social-share .author-details {
    display: flex;
    align-items: center;
}
.author-social-share .author-details .author-name{
  margin-bottom: 0;
}
.blog-detail-box .blog-content .blog-img{
  margin-bottom: 30px;
  width: 100%;
  border-radius: 20px;
}
.blog-detail-box {
    padding: 80px 0;
}
.solution-area {
  padding: 80px 0 0;
}
.solution-area .title {
    font-size: 24px;
    color: #666;
}
.solution-area .news-banner-box {
    margin-bottom: 50px;
}
.trusted-company {
    padding: 80px 0;
}
.trusted-company .heading{
    text-align: center;
}
.trusted-company .company-slider {
    padding: 40px 0 0;
}
.trusted-company .company-img {
    width: 150px !important;
    margin: 0 20px;
}
.blog-detail-box .blog-content h1,
.blog-detail-box .blog-content h2,
.blog-detail-box .blog-content h3,
.blog-detail-box .blog-content h4,
.blog-detail-box .blog-content h5,
.blog-detail-box .blog-content h6{
  color: #fff;
  font-size: 30px;
}
.blog-detail-box .blog-content h2,
.blog-detail-box .blog-content h3 {
  margin: 30px 0 15px;
}
.blog-detail-box .blog-content ul,
.blog-detail-box .blog-content ol {
  padding-left: 22px;
  margin-bottom: 16px;
}
.blog-detail-box .blog-content li {
  color: #ccc;
  margin-bottom: 8px;
  line-height: 1.7;
}
.blog-detail-box .blog-content li strong,
.blog-detail-box .blog-content p strong {
  color: #fff;
}
.blog-detail-box .blog-content a {
  color: #78c142;
  text-decoration: underline;
}
.news-area .news-title {
    text-align: center;
}
.news-area .author-social-share {
    display: flex;
    justify-content: center;
    align-items: center;
}
.news-area .news-date {
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 20px;
}
.news-area .related-news {
    display: flex;
    margin: 30px 0;
}
.news-content {
    border-bottom: 1px solid #666;
    padding-bottom: 30px;
    margin-bottom: 30px;
}
.news-area .news-thumb-img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 10px;
    margin-right: 20px;
}
.news-area .related-news-wrapper {
    display: flex;
    align-items: center;
    width: 50%;
}
.news-area .related-news-wrapper .related-news-title{
  color: #fff;
  font-size: 18px;
  font-weight: 500;
}
.news-area .related-news-wrapper:hover .related-news-title{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.news-banner-box {
    position: relative;
    margin: 40px 0 0;
}
.news-banner-box .news-content{
  position: absolute;
  bottom: 20px;
  padding: 0 30px;
}
.news-title span{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.news-banner-box .news-content .bloglist-admin{
  display: flex;
}
.request-content h5 {
    text-transform: uppercase;
}
.news-banner-box .news-content .news-title, 
.news-banner-box .news-content small,
.news-banner-box .news-content span{
  color: #fff;
}
#related-news-container {
    padding: 80px 0;
}

.faq-area {
  position: relative;
  margin: 80px 0px;
}

.faq-accord {
  margin-top: 30px;
  /* border-top: 1px solid #439F19;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  padding: 0 20px; */
}

.faq-accord .card {
    border-radius: 0px;
    background: none;
    border-top: 1px solid #439F19;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    padding: 3px 20px;
    background-image: url(../images/faq-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    
}

.faq-accord .card-header {
  padding: 0px;
  margin-bottom: 0;
  background-color: transparent;
  border: 0px;
}

.faq-accord .card-header button {
  outline: none;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  box-shadow: none;
  padding: 18px 0px;
  border: 0px;
  border-radius: 0px;
}

.faq-accord .card-header button span {
  color: #fff;
  font-size: 20px;
      font-family: "Outfit", sans-serif;
  text-align: left;
  text-transform: capitalize;
}

.faq-accord .card-header .fa-angle-up,
.faq-accord .card-header .fa-angle-down {
  color: #fff;
  font-size: 18px;
  margin-left: 8px;
}

.faq-accord .card-body {
  padding: 0px 0px 15px;
}

.faq-accord .card-body p {
  /* color: rgb(255 255 255 / 70%); */
  width: 90%;
  margin: 0px;
}

.faq-accord .card-body p a {
  color: #383d41;
  /* color: rgb(255 255 255 / 70%); */
  transition: all 0.2s ease-In;
}

.faq-accord .card-body p a:hover {
  color: #439F19;
}

.request-section .request-content .request-btn {
  text-align: center;
}







.footer-section{
  position: relative;
}
.footer-section .footer-img {
  position: absolute;
  bottom: 0;
  z-index: -1;
}
.footer-section .footer-logo .footer-logo {
  width: 160px;
}
.footer-section .bootom-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer-section .copyright-content {
  border-bottom: 1px solid #ccc;
}
.footer-section .copyright-content p {
  color: #fff;
  text-transform: uppercase;
}
.footer-menu.main-menu ul li a {
  color: #fff;
  font-size: 16px;
  text-transform: capitalize;
}

.request-section {
    padding: 80px 0;
}
.aboutus-section, #product-container {
    padding-top: 80px;
}

/*--------------- blog ---------------*/

.blogbanner-content span {
  color: #fff;
  font-weight: 500;
  text-transform: uppercase;
}

.bloglist-banner {
  position: relative;
  padding: 130px 0px;
}

.blogbanner-img {
  position: absolute;
  top: 50%;
  right: 0;
  width: 40%;
  transform: translateY(-50%);
}


.bloglist-box {
  position: relative;
  border: 1px solid rgb(255 255 255 / 15%);
  background: #242424;
  background-clip: padding-box;
  border-radius: 20px;
  padding: 12px;
  display: inline-block;
  margin-bottom: 30px;
  margin-top: 30px;
  width: 100%;
}
.bloglist-box p {
  min-height: 70px;
  height: 18px;
}


.bloglist-box .img-responsive {
  border-radius: 20px;
  width: 100%;
  height: 240px;
}

.bloglist-admin {
  display: flex;
  align-items: center;
  margin: 12px 0px;
}

.bloglist-admin img {
  width: 45px;
  margin-right: 10px;
}

.bloglist-admin small {
  color: rgb(255 255 255 / 40%);
  font-size: 90%;
  font-weight: 300;
}

.bloglist-date {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bloglist-date span {
  background: rgb(153 153 153 / 8%);
  border: 1px solid rgb(255 255 255 / 15%);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease-In;
}

.bloglist-date label {
  color: rgba(255 255 255/40%);
  margin-bottom: 0px;
  font-size: 14px;
}

.bloglist-box span img {
  width: 15px;
}

.bloglist-box:after {
  content: "";
  position: absolute;
  top: -1px;
  bottom: -1px;
  left: -1px;
  right: -1px;
  background: transparent;
  z-index: -1;
  border-radius: 20px;
  opacity: 0;
  transition: opacity 0.2s ease-In;
}

.bloglist-box:hover:after {
  opacity: 1;
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
}

.bloglist-box:hover span {
  transform: rotate(-45deg);
      background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
}

.bloglist-area .text-center {
  margin-top: 20px;
}

.bloglist-area{
  position: relative;
  padding: 100px 0 80px 0;
}
.blog-detail-box.news-area {
  position: relative;
  padding: 80px 0 0;
}

.news-banner-box .news-banner{
  width: 100%;
  border-radius: 20px;
  height: 440px;
    object-fit: cover;
}

.bloglist-area .container {
  position: relative;
}

/* .blog-item {
  display: none;
} */

/* About Us Page */
.aboutus-section .main-title {
    text-align: center;
    font-size: 65px;
}
.aboutus-section .about-main{
  width: 50%;
    display: block;
    margin: 50px auto;
}

.page-404{
  display: flex;
  align-items: center;
  height: 100vh;
  overflow: hidden;
}
.page-404.page-thankyou{
  background-image: url(../images/thank-bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  height: 100vh;
  width: 100%;
  display: flex;
  align-items: center;
}
.content-thankyou img {
    width: 100px;
    margin: 20px auto;
}
.content-thankyou h1 {
   color: #fff;
   font-size: 30px;
}
.content-404 p {
    color: #fff;
    margin: 40px 0;
}
.content-404 .btn-box{
  display: flex;
  justify-content: center;
}
.content-404 .btn-box a{
  margin: 0 20px;
}

.why-choose-section .request-btn {
    text-align: center;
    margin-top: 40px;
}
.dont-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
}
.wait-title {
    font-size: 40px;
}
.banner-content ul {
    list-style: none;
}
.banner-content ul li {
    display: flex;
    justify-content: start;
    color: #ccc;
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 10px;
}
.banner-content ul li .star-image{
    width: 20px;
    height: 20px;
    margin-right: 10px;
}
.calculator .table {
  table-layout: fixed;
  width: 100%;
}

.calculator .table th,
.calculator .table td {
  width: 15%; /* 4 columns = 100% / 4 = 25% */
  text-align: center;
  vertical-align: middle;
}

.calculator .table th,
.calculator .table td {
  white-space: nowrap;      /* Prevent breaking text */
  overflow: hidden;         /* Prevent overflow */
  text-overflow: ellipsis;  /* Add "..." if text is too long */
}

.calculator-section .calculator .form-control {
    color: #fff;
    background-color: transparent;
    border: 1px solid #666;
    border-radius: 5px;
}
.calculator-section .calculator .table td{
  color: #fff;
  border: none;
}
.calculator-section .calculator .toggle {
    display: flex;
    justify-content: space-between;
    border: 1px solid #666;
    width: 20%;
    align-items: center;
    margin: 0 auto;
    padding: 10px;
    border-radius: 30px;
}
.calculator-section .calculator .toggle a {
    padding: 5px 30px;
    color: #fff;
    border-radius: 20px;
}
.calculator-section .calculator .toggle a.active {

    background-color: #A7EE50;
}
.table{
  /* background-color: #242424ab; */
  border-radius: 20px;
  font-size: 15px;
  overflow: visible;
}
.calculator {
    padding: 30px;
    background-color: #242424ab;
    border-radius: 20px;
    font-size: 15px;
    overflow-x: scroll;
    border: 1px solid #666;
}
.calculator-section {
    padding: 80px 0;
}
.table-bordered{
  border-radius: 20px;
}
.calculator-section .calculator .table th{
  color: #fff;
  border-top: none;
  border-bottom: 1px solid #fff;
  font-weight: 400;
}
.calculator-section .calculator .form-group {
    margin-bottom: 0;
}
.calculator-section .calculator .form-control:focus{
  box-shadow: none !important;
}
.calculator-section .calculator .cal-bottom {
    display: flex;
    justify-content: space-between;
    margin: 30px 0;
    align-items: center;
}
.calculator-section .calculator .calulator-text {
    color: #FFDE33;
    font-size: 20px;
}
.green{
  background-color: #009966;
  color: #fff;
}
.yellow{
  background-color: #FFDE33;
  color: #000;
}
.orange{
  background-color: #FF9933;
  color: #fff;
}
.red{
  background-color: #CC0033;
  color: #fff;
}
.purple{
  background-color: #660099;
  color: #fff;
}
.danger{
  background-color: #7E0023;
  color: #fff;
}
.index-wrapper .table{
  color: #fff;
  background-color: #242424;
}
.index-wrapper .table th{
  font-weight: 400;
}
.index-wrapper .table tr td:nth-child(1){
  width: 120px;
}
.index-wrapper .table tr td:nth-child(2){
  width: 160px;
}
.nav-tabs-wrapper .nav-tabs {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}
.nav-tabs-wrapper .nav-tabs a{
  color: #fff;
}
.tab-wrapper .card {
    background: transparent !important;
}
.tab-wrapper .card strong{
    color: #fff;
    opacity: 100;
    font-weight: 500;
}
.nav-link.active {
    color: #A7EE50 !important;
    background: transparent !important;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 2px solid #A7EE50 !important;
    border-color: #A7EE50 !important;
}
.nav-tabs-wrapper .nav-tabs .nav-item{
  padding: 0 40px;
}
.nav-tabs-wrapper .nav-tabs a:hover{
  border: none;
}
.product-images-section .desc-img {
    width: 100%;
    margin-bottom: 30px;
}
.review-section .rating svg{
  color: #439F19;
}
.total-rating{
  color: #fff;
  margin: 20px 0;
}
.review-list {
    text-align: left;
}
.review-list .review-title{
  font-size: 18px;
  font-weight: 500;
}
.review-list .customer-detail {
    display: flex;
    justify-content: start;
    align-items: center;
}
.review-list .customer-detail .admin-img {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    object-fit: cover;
}
.review-list .customer-detail p{
  margin-bottom: 0;
  margin-left: 10px;
  color: #fff;
}
.review-list .review-box{
  background-color: #242424;
  padding: 20px;
  border-radius: 20px;
  border: 1px solid #666;
  margin-bottom: 30px;
}


/* Product Slider Css */
.product-detail-banner .car-slider-desc {
    max-width: 180px;
    margin: 0 auto;
}
.banner-slider .slider.slider-for {
    max-width: 84%;
    padding-left: 35px;
}
.banner-slider .slider.slider-nav {
    max-width: 16%;
}
.banner-slider .slider.slider-for,
.banner-slider .slider.slider-nav {
    width: 100%;
    float: left;
}
.banner-slider .slider.slider-nav {
    height: 610px;
    overflow: hidden;
}
.slider-banner-image {
    height: 610px;
}
.banner-slider .slider.slider-nav {
    display: flex;
    align-items: center;

}
.slider-nav .slick-slide.thumbnail-image .thumbImg{
    max-width: 178px;
    height: 110px;
    margin: 0 auto;
    border: 1px solid #EBEBEB;
    margin-bottom: 30px;
    border-radius: 10px;
}
.slider-banner-image img,
.slider-nav .slick-slide.thumbnail-image .thumbImg img {
    height: 100%;
    width:100%;
    object-fit: cover;
    border-radius: 10px;
}
.slick-vertical .slick-slide:active,
.slick-vertical .slick-slide:focus,
.slick-arrow:hover,
.slick-arrow:focus {
    border: 0;
    outline: 0;
}
.arrow {
    width: 40px;
    height: 40px;
    border: 1px solid #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    background-color: #fff;
    border-radius: 50px;
    cursor: pointer;
    transition: 0.3s ease-out;
}
.arrow:hover{
  background-color: #439F19;
  color: #fff;
}
.arrow.arrow-left {
    top: 50%;
    position: absolute;
    left: 20px;
}
.product-slider .arrow.arrow-left {
    top: 50%;
    position: absolute;
    left: -20px;
}
.arrow.arrow-right {
    top: 50%;
    position: absolute;
    right: -20px;
}
.slider-nav .slick-slide {
    text-align: center;
}
.slider-nav .slick-slide span {
    font-size: 14px;
    display: block;
    padding: 5px 0 15px;
}
.slick-arrow {
    width: 100%;
    background-color: transparent;
    border: 0;
    background-position: center;
    background-repeat: no-repeat;
    font-size: 0;
    height: 18px;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 99;
}
.slick-prev {
   top: 0;
}
.slick-next {
   bottom: 0;
   background-color: #fff;
}
.slick-prev.slick-arrow {
    background-image: url(../images/black-up-arrow.png);
}
.slick-next.slick-arrow {
    background-image: url(../images/black-down-arrow.png);
}
/*End USE CSS for Slider*/

@media screen and (max-width : 991px) {

	.banner-slider .slider.slider-for,
	.banner-slider .slider.slider-nav {
	    max-width: 100%;
	    float: none;
	}
	.banner-slider .slider.slider-for {
		padding-right: 0;
	}
	.banner-slider .slider.slider-nav {
		height: auto;
	}
	.slider-banner-image {
	    height: 500px;
	} 
	.slider.slider-nav.thumb-image {
        padding: 10px 30px 0;
	}
	.slider-nav .slick-slide span {
		padding: 5px 0;
	}
	.slick-arrow {
		padding: 0;
	    width: 30px;
	    height: 30px;
	    top: 50%;
	    bottom: 0;
	    -webkit-transform: translateY(-50%) rotate(-90deg);
	    -moz-transform: translateY(-50%) rotate(-90deg);
	    -ms-transform: translateY(-50%) rotate(-90deg);
	    transform: translateY(-50%) rotate(-90deg);
	}
	.slick-prev {
	    left: 0;
	    right: unset;
	}
	.slick-next {
	    left: unset;
	    right: 0;
   		background-color: transparent;
	}
	.product-detail-banner .car-slider-desc {
    	max-width: 340px;
	}
	.bid-tag {
    	padding: 10px 0 15px;
	}
	.slider.slider-nav.thumb-image {
	   white-space: nowrap;
	}
	.thumbnail-image.slick-slide {
		padding: 0px 5px;
		min-width: 75px;
		display: inline-block;
		float: none;
	}
}

@media screen and (max-width : 767px) {
	.slider-banner-image {
	    height: 400px;
	}
	.slider.slider-nav.thumb-image {
    	padding: 0px 20px 0;
    	margin: 10px 0px 0;
	}
	.slider-nav .slick-slide.thumbnail-image .thumbImg {
		max-width: 140px;
		height: 80px;
    border-radius: 10px;
	}
	.slick-prev.slick-arrow {
    	background-position: center 10px;
	}
	.slick-next.slick-arrow {
    	background-position: center 10px, center;
	}
	.slider-nav .slick-slide span {
	    font-size: 12px;
	    white-space: normal;
	}
}

@media screen and (max-width: 580px) {
	.slider-banner-image {
	    height:340px;
	}
}

@media screen and (max-width : 480px) {
	.slider-banner-image {
	    height:280px;
	}
}
.product-detail-box .ratings svg{
  color: #439F19;
}
.product-detail-box .ratings span{
  color: #fff;
}
.product-detail-box .price-box{
  color: #439F19;
  font-size: 26px;
  font-weight: 500;
  margin-top: 20px;
}
.product-detail-box .price-box del{
  font-size: 20px;
  color: #fff;
}
.product-detail-box .quantity {
  display: flex;
  border: 2px solid #666;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.product-detail-box .quantity button {
  background-color: #242424;
  color: #fff;
  border: none;
  cursor: pointer;
  font-size: 20px;
  width: 30px;
  height: auto;
  text-align: center;
  transition: background-color 0.2s;
}

.product-detail-box .quantity button:hover {
  background-color: #242424;
}

.product-detail-box .input-box {
  width: 40px;
  text-align: center;
  border: none;
  padding: 8px 10px;
  font-size: 16px;
  outline: none;
  background-color: #242424;
  color: #fff;
  border: 1px solid #666;
}
.product-detail-box .cart-btn a {
    padding: 14px 100px;
}
.product-detail-box .add-cart-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Hide the number input spin buttons */
.product-detail-box .input-box::-webkit-inner-spin-button,
.product-detail-box .input-box::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.product-detail-box .input-box[type="number"] {
  -moz-appearance: textfield;
}





.slider-nav .slick-slide { cursor: pointer; }


	.timelineSlider {

		margin-bottom: 75px;

		&:before, &:after {
			content: "";
		    z-index: 2;
		    display: block;
		    position: absolute;
		    top: 0;
		    width: 450px;
		    height: 100%;
		  }


		.slide-box {
			width: 400px !important;
			margin: auto 75px;
      background: #242424;
      border: 1px solid #6c757d;
      padding: 22px;
      border-radius: 20px;
      background-clip: padding-box;
		}

		.timelineSliderArrowLeft, .timelineSliderArrowRight {
      position: absolute;
      z-index: 3;
      color: #009966;
      margin: auto;
      top: 0;
      bottom: 0;
    }

    .timelineSliderArrowLeft{
      left: 22%;
    }

    .timelineSliderArrowRight {
      right: 23%;
    }

    .slick-track {
      display: flex;
      align-items: center;
    }
	}
.timelineSliderNav svg{
  color: #439F19;
}
#businessTimeline {
    margin-top: 40px;
}
	.timelineSliderNav {

		&:before {
			content: '';
		    position: absolute;
		    top: 40%;
		    left: 0;
		    background: #439F19;
		    height: 1px;
		    width: 100%;
		    transform: translateY(-50%);
		}

		.slick-list {
			display: flex;
			padding-top: 25px;
      top: 0;
			.is-active {
				span {
					  display: flex;
            justify-content: center;
            align-items: center;
				    height: 35px;
				    width: 35px;
				    border-radius: 30px;
				    border: solid 1px #439F19;
				    position: absolute;
				    top: -5px;

				    i {
				    	color: #439F19;
				    	margin-top: 8px;
				    }
				}
				color: #439F19;
			}
		
			.slick-slide {
				text-align: center;
			    display: flex;
			    justify-content: center;
			}
		}
	}

	#timelineSliderNavTopDates {
    		display: flex;
    		margin-left: 10%;
    		position: relative;
    		top: 20px;

    		span {
    			margin-right: 25%;
    			position: relative;
    			padding-top: 5px;

    			&:before {
    				content: '';
				    display: block;
				    height: 20px;
				    width: 1px;
				    position: absolute;
				    bottom: -15px;
				    background: black;
				    left: 18px;
    			}
    		}
		}

	#timelineSliderNavBottomDates {
    		display: flex;
    		margin-left: 25%;
    		position: relative;
    		top: -50px;

    		span {
    			margin-right: 32%;
    			position: relative;
    			padding-top: 5px;

    			&:before {
    				content: '';
				    display: block;
				    height: 20px;
				    width: 1px;
				    position: absolute;
				    top: -15px;
				    background: black;
				    left: 18px;
    			}
    		}
		}

    
  /* --------contact page-------- */
  .contact-banner{
  position: relative;
  margin: 20px 0 80px;
  }

 .contact-banner img,.contact-form img{
border-radius: 20px;
 }
  .contact-banner-details p{
  position: relative;
  font-size: 18px;
  }
  .contact-banner-details p::before{
  position: absolute;
  content: "";
  width: 170px;
  height: 2px;
  background-color: #439F19;
  border-radius: 2px;
  bottom: -15px;
  left: 0;
  }
  .contact-in-touch{
  display: flex;
  flex-direction: column;
  justify-content: end;
  height: 100%;
  }

  .contact-in-touch h3, .contact-in-touch h2{
  font-size: 24px;
  text-transform: capitalize;
  color: #fff;
  }
  .contact-in-touch a{
  display: block;
  color: #fff;
  margin: 5px 0;
  transition: all 0.3s;
  font-size: 15px;
  }
  .contact-in-touch a:hover{
  color: #439F19;
  }
  /* -- */
  .contact-map-img{
  position: relative;
  margin: 80px 0;
  }

  .contact-map-img img{
  width: 100%;
  border-radius: 20px;
  margin-top: 30px;
  }
.contact-form .main-title {
    font-size: 40px;
    font-weight: 500;
    color: #fff;
}
input:focus, textarea:focus{
  box-shadow: none;
  outline: 0;
}
  /* Popup Css */
.common-pop .pop-close .btn-close {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    z-index: 1;
    border: 1px solid #fff;
    border-radius: 50px;
    cursor: pointer;
    background-color: transparent;
}
.common-pop .pop-close .btn-close:hover{
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
}
.common-pop .modal-body {
    padding: 0;
    border: 1px solid rgb(255 255 255 / 15%);
    background: #242424;
    background-clip: padding-box;
}
.common-pop .main-title{
  color: #fff;
  font-size: 30px;
  font-weight: 500;
  text-align: center;
}
.popup-wrapper {
    display: flex;
}
.popup-wrapper .pop-img {
    width: 50%;
}
.popup-wrapper .form-container {
    width: 50%;
    padding: 30px 20px;
}
.form-control{
  background-color: transparent;
  color: #fff;
  border-left: 0;
    border-top: 0;
    border-radius: 0;
    border-right: 0;
}
.form-control:focus{
  background-color: transparent;
  color: #fff;
  border-color: #fff;
  box-shadow: none;
}
.popup-wrapper .btn-wrapper {
    text-align: center;
    margin-top: 30px;
}
.popup-wrapper .popup-img {
    height: 500px;
    object-fit: cover;
    width: 100%;
}
/* Review Css */
.review-form .rating-stars #stars {
    padding-left: 0;
    list-style: none;
    text-align: left;
}
.review-form .rating-stars #stars li{
  display: inline-block;
}
.review-form .rating-stars #stars li svg{
  color: #666;
}
.review-form .star.selected svg{
  color: #439F19 !important;
}
.review-form {
    width: 60%;
    margin: 50px auto;
}
.review-form .btn-wrapper {
    text-align: center;
    display: block;
    width: 100%;
    margin-top: 30px;
}
.review-form button {
    padding: 14px 50px;
    border: none;
    margin: 20px auto;
}
.video-section {
    padding: 80px 0 0;
    position: relative;
    overflow:hidden;

}
.video-section .play-icon{
  position: absolute;
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(to right, #A7EE50 0%, #439F19 90%);
  color: #fff;
  border-radius: 50%;
  pointer-events: none; /* So mouse events pass through */
  transition: transform 0.2s cubic-bezier(.02,1.23,.79,1.08);

}
 

section{
  position: relative;
}
.right-circle {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 240px;
    height: 250px;
    filter: blur(140px);
    opacity: 0.8;
    z-index: -1;
}
.left-circle {
    position: absolute;
    left: 0;
    top: 0;
    width: 240px;
    height: 250px;
    filter: blur(140px);
    opacity: 0.8;
    z-index: -1;
}
.\34 04-btn {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
