 
:root{
  --autoWidth: 1140px;
  --family: "Poppins", sans-serif;
   --transition: all 0.3s ease;
   --color_red: #DC1111;
   --p_bg: #F9F9F9;
   --s_bg: #EEEEEE;
   --p_color: #3B3B3B;
  --s_color: #C0C0C0;
  --s_color2: #515151;
  --dark: #1F1F21;
  --s_dark: #0D0828;
  --s_dark2: #391B1D;
  --s_dark3: #3D1A1C;
  --grey: #737373;
  --border_color: #C0C0C0;
  --border_color2: rgba(128, 128, 128, 0.35);
  --black: #000;
   --white: #fff;
   --fs14: 0.875em;
  --baseFS: 16px;
  --fs17: 1.0625em;
  --fs18: 1.125em; 
  --fs20: 1.25em;
  --fs22: 1.375em;
  --fs24: 1.5em;
  --fs100: 6.0em;
  --fs60: 3.75em;



  --bannerHeight: 68px;
}


*{
  margin: 0;
  padding:0;
  box-sizing: border-box;
  font-optical-sizing: auto;
   font-style: normal;
}
a{ text-decoration: none; }
ol, ul, li{ margin: 0; list-style: none;  margin: 0;}

p, h1, h2, h3, h4, h5, h6, strong, b{ margin: 0; font-weight: normal; }

 

em{ font-style: normal; }

input, textarea, select, button{ border:0px none; border-radius:0px; background:none; outline:none; -webkit-appearance:none; appearance:none; outline:none; font-family: var(--family); }

img{ display: block; height: auto; outline: none; }

input[type='submit']{  border-radius:0px; -webkit-appearance:none; appearance:none; outline:none; }

textarea{ resize:none; overflow:auto; }

:focus{ outline:none;}

.clearfix:after{content:""; display:block; clear:both; height:0px; visibility:hidden;}

.clearfix{ display:block; zoom:1; }

i, em{ font-style: normal;}

.overflow_hidden{ overflow: hidden !important; }

html{ min-height: 100%;   }



body { width: 100%; font-family: var(--family);  color: var(--black); font-size: var(--baseFS); font-weight: 400; overflow-x: hidden; }
 
.wrapper{  width: 100%; margin: auto; }

.autoContent {  max-width: var(--autoWidth);  padding: 0px 20px; width: 100%; margin: auto; }
 
.all_btn{ color: var(--black); font-size: 22px; line-height: 1.4em;  padding:18px 20px 18px 20px; cursor: pointer; font-weight: 700;   border-radius: 150px;  border: 1px solid #030107;  background: #FFF;  transition: var(--transition); display: block; text-align: center; }

.all_btn:hover{ border-radius: 150px;
background: radial-gradient(238.39% 44.19% at 96.59% 31.25%, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(182.56% 55.34% at 5.68% 100%, rgba(246, 251, 34, 0.51) 0%, rgba(255, 158, 69, 0.00) 100%), radial-gradient(137.51% 118.3% at 32.95% 0%, rgba(255, 137, 137, 0.92) 21.25%, rgba(255, 169, 106, 0.57) 88.62%), radial-gradient(178.09% 220.16% at 94.89% -132.81%, #FF7A00 67.59%, rgba(255, 199, 0, 0.38) 100%), #FFF500;
box-shadow: 0px 20px 60px 0px rgba(232, 205, 110, 0.20), -20px -20px 50px 0px rgba(211, 70, 155, 0.40), 0px 0px 20px 0px rgba(255, 255, 255, 0.60) inset;}
 

.all_btn.btn_orange{  border-radius: 150px;
  background: radial-gradient(238.39% 44.19% at 96.59% 31.25%, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(182.56% 55.34% at 5.68% 100%, rgba(246, 251, 34, 0.51) 0%, rgba(255, 158, 69, 0.00) 100%), radial-gradient(137.51% 118.3% at 32.95% 0%, rgba(255, 137, 137, 0.92) 21.25%, rgba(255, 169, 106, 0.57) 88.62%), radial-gradient(178.09% 220.16% at 94.89% -132.81%, #FF7A00 67.59%, rgba(255, 199, 0, 0.38) 100%), #FFF500;
  box-shadow: 0px 20px 60px 0px rgba(232, 205, 110, 0.20), -20px -20px 50px 0px rgba(211, 70, 155, 0.40), 0px 0px 20px 0px rgba(255, 255, 255, 0.60) inset;}


/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #080812;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(8, 8, 18, 0.50) 26.52%, rgba(147, 62, 255, 0.50) 268.14%);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(8, 8, 18, 0.50) 26.52%, rgba(32, 201, 255, 0.50) 268.14%);
}


.header{ width: 100%;  position: fixed; left: 0px; top: 0px; z-index: 999;  background: var(--p_bg); backdrop-filter: blur(12.066588401794434px);  }

.header_inner{ display: flex; align-items: center; padding: 22px 0px; }

.header_left{ max-width: 202px; width: 100%; display: block; }
.header_logo{ display: block;}
.header_logo img{ width: 100%; height: auto; display: block; }

.header_right{ display: flex; align-items: center; justify-content: flex-end; width: 100%; }




.header_links{ margin-left: auto; }

.header_links ul{ display: flex; align-items: center; gap: 40px;  }

.header_links ul li a{ font-size: var(--fs14); font-weight: 500; color: var(--black); line-height: 1.4em; position: relative; transition:var(--transition) }

.header_links li > * {
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  line-height: 1.5;
}

.header_links li > * span {
  display: inline-block;
  vertical-align: top;
  backface-visibility: hidden;
  text-shadow: 0 1.5em 0 currentColor;
  transform: translate3d(0, 0, 0);
  transition: var(--transition);
}

.header_links li>a:hover span, .header_links ul li > a.active span {
  transform: translate3d(0, -100%, 0); color: var(--color_red);
}
 
 

.header_icons ul{ display: flex; align-items: center; gap: 22px; }


.header_icons ul li a{ width: 30px; height: auto; display: block; cursor: pointer; }
.header_icons ul li a svg{ width: 100%; height: auto; display: block; }
.header_icons ul li a svg path{ transition: var(--transition);}
.header_icons ul li a:hover svg path{ fill: #C387FF;  }


.header_lang{padding-left: 30px; }

.header_flag_icon{  border: 1px solid #31364F; border-radius: 50%; width: 48px; height: 48px; position: relative; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: var(--transition); }

.header_flag_icon img{ width: 100%; max-width: 22px; max-height: 19px; height: auto; display: block; margin: auto;  }

.header_flag_icon:hover{ border-color: #C387FF; box-shadow: 0px 0px 20px rgba(125, 20, 208, 0.80);  }
 
.hidden{ overflow: hidden !important; }

 
 .ps_secSlider_show{ display: none;}

.hamburger-lines {
   
  border-radius: 50%;
  cursor: pointer;
  display: none;
  flex-direction: column;
  flex-shrink: 0;
  height: 40px;
  justify-content: space-between;
  padding: 10.9px 8px;
  position: relative;
  width: 40px;
  z-index: 999
}

.hamburger-lines .line {
  background: var(--white);
  border-radius: 10px;
  display: block;
  height: 1.4px;
  width: 100%
}

.hamburger-lines .line1 {
  transform-origin: 0 0;
  transition: all .4s ease-in-out
}

.hamburger-lines .line2 {
  transition: all .2s ease-in-out
}

.hamburger-lines .line3 {
  transform-origin: 0 100%;
  transition: all .4s ease-in-out
}

.hamburger-lines.open .line {
  margin-left: 7px
}

.hamburger-lines.open .line1 {
  transform: rotate(45deg)
}

.hamburger-lines.open .line2 {
  transform: scaleY(0)
}

.hamburger-lines.open .line3 {
  transform: rotate(-45deg)
}




/* banner */

.banner{ width: 100%; position: relative; padding-top: var(--bannerHeight); overflow: hidden; }
 
 
 
.bannerText{  padding: 50px 0px;  min-height: calc(100vh - 194px); display: flex; align-items: center; }

.bannerText h1{ display: block;  color: var(--black);  font-size: var(--fs100); font-weight: 700; line-height: 1.1em; }
.bannerText h1 strong{ font-weight: 700; display: block; max-width: 880px;}
.bannerText span{ color: var(--white); display: inline-block; vertical-align: top;  padding:6px 24px 14px 24px; position: relative; z-index: 2;  }

.banner_text_slider{ display: inline-block; position: relative; min-height: 134px;  }

.banner_text_slider span{ white-space: nowrap; position: absolute;}

 .bannerText i{ content: ''; 
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: var(--color_red);
  border-radius: 70px;
  display: block;
  height: 100%;
  width: 100%;
  z-index: 1;  min-width: 140px;
}   


.industries{ width: 100%; padding-top: 34px; }



.industry_box_main{  background-color: var(--color_red); padding: 30px 35px 0px;  border-radius: 10px;}

.industry_row{ width: 100%; display: flex;  }

 .industry_row strong{ flex-shrink: 0; color: var(--white); font-size: var(--fs20); font-weight: 600; padding-right: 26px; padding-top: 2px; line-height: 1.4em; cursor: pointer; }

.industry_row ul{ display: flex; align-items: center; gap: 10px; flex-wrap: wrap; max-width: calc(100% - 100px); }

.i_tag{ color: var(--white);  text-align: center; font-size: var(--fs17); line-height: 1.4em; font-weight: 600; padding: 5px 20px; border-radius: 30px; display: inline-block; border: 1px solid var(--white); transition: var(--transition); cursor: pointer; } 

.i_tag.active, .i_tag:hover{ background-color: var(--white);  color: var(--color_red);  }

.industry_box{ padding: 50px 125px; width: 100%;  }


.industry_box p{ color: var(--white); font-size: var(--fs22); font-weight: 500;line-height: 1.4em; }
.industry_tabShow{ display: none;}

.automation{ width: 100%; background-color: var(--p_bg); } 
.automation_sec{ padding: 100px 0px; width: 100%; }
.automation_inner{ padding: 40px 0px;  position: relative; }

.automation_row{ width: 100%;  display: flex; align-items: center; justify-content: flex-end; position: relative; z-index: 2;  }

.automation_box{ width: 100%; max-width: 666px; border-radius: 10px;  background: var(--white);  box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.15); padding: 40px;}


.automation_inner figure{ width: 60%; height: 100%; position: absolute; left: 0px; top: 0px; display: block; border-radius: 0px 20px 20px 0px; overflow: hidden; }

.automation_inner figure img{ width: 100%; height: 100%; object-fit: cover; }

.headlines{ width: 100%;}

.headlines small{ display: block; padding-bottom: 28px; color: var(--color_red); font-size: var(--baseFS); font-weight: 600; line-height: 1.4em; } 

.headlines h2{ display: block; padding-bottom: 38px; color: var(--dark); font-size: var(--fs60); font-weight: 700; line-height: 1em; } 

.color_white{ color: var(--white) !important;}
.text_center{ text-align: center; }

.slick-dots{ width: 100%; display: flex; align-items: center; justify-content: center; gap: 5px; }
.slick-dots li button{ width: 10px; height: 10px; background-color: var(--black); border-radius: 50%; cursor: pointer; font-size: 0; }

.slick-dots li.slick-active button{ background-color: var(--color_red); }

.features{ width: 100%; background: var(--dark); padding: 100px 0px 120px 0px; }

.features_li{ padding-top: 100px; }
.features_li ul li{ padding-bottom: 30px; }

.features_box{ display: flex; align-items: center; padding: 50px 160px; border: 2px solid var(--border_color); border-radius: 250px;  transition: var(--transition); }

.features_box:hover{ border-color: var(--color_red); } 

.features_box i{ padding-right: 80px; }
.features_box i svg{ max-width: 70px; min-width: 48px; height: auto; display: block;}

.features_box i svg path{   transition: var(--transition); }
.features_box:hover i svg.icon_fillStroke path{ stroke: var(--color_red); fill: var(--color_red); }
.features_box:hover i svg.icon_fill path{  fill: var(--color_red); }
.features_box:hover i svg.icon_stroke path{ stroke: var(--color_red); }




.f_box_content strong{ color: var(--s_color); font-size: var(--fs24); font-weight: 700; line-height: 1.2em; transition: var(--transition); padding-bottom: 10px; display: block; }
.features_box:hover .f_box_content strong{ color: var(--white); }
.f_box_content p{ color: var(--s_color); font-size: var(--fs18); line-height: 1.4em;  transition: var(--transition);  }
.features_box:hover .f_box_content p{ color: var(--white); }


.monitoring_system{ padding: 100px 0px 80px 0px; }

.monitoring_system_inner .headlines h2{ max-width: 930px; margin: auto; }


.ms_content ul{ display: flex; flex-wrap: wrap; margin: 0px -15px; }

.ms_content ul li{ width: 33.33%; padding: 0px 15px 30px 15px; }

.ms_box_img{ width: 100%; padding-bottom: 20px; }

.ms_box_img img{ width: 100%; height: auto; object-fit: cover;  display: block; border-radius: 10px; }

.ms_box_info strong{ color: var(--s_dark2); font-size: var(--fs24); font-weight: 600; line-height: 1.4em; padding-bottom: 10px; display: block; }
.ms_box_info p{ color: var(--s_color2); font-size: var(--fs16); line-height: 1.4em; }


.ms_detail{ padding-top: 60px; }
.ms_detail p{ max-width: 850px; margin: auto; color: var(--s_dark3); text-align: center; font-size: var(--fs24); font-weight: 600; line-height: 1.4em; }




.Faqs_section{ width: 100%; padding: 100px 0px; background-color: var(--p_bg);}

.faqs_content{ width: 100%;}

 
.faqs_content_inner{   border-top: 1px solid var(--border_color2);  cursor: pointer; }
 
 
.faqs_question{ width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 24px 0px; }

.faqs_question strong{ font-size: var(--fs22); font-weight: 600; line-height: 1.2em; color: var(--s_dark3); }

.faqs_question_icon{ display: block; font-size:30px; cursor: pointer; color: var(--color_red); }

.faqs_answer{ width: 100%;  padding: 24px 0px;  }

.faqs_answer ul{ padding-left: 18px; }
.faqs_answer ul li{ list-style-type: disc; padding-bottom: 30px; }

.faqs_ans_info strong{ font-size: var(--baseFS);  font-weight: 700; line-height: 1.2em; display: block; padding-bottom: 5px; }

.faqs_ans_info span{font-size: var(--baseFS); line-height: 1.2em; display: block; }

.faqs_answer p{ color: var(--s_color2); font-size: var(--baseFS); font-weight: 400; line-height: 1.4em; padding-bottom: 10px; }

.faqs_answer p a{ color: var(--color_red); }

.faqs_answer{ display: none; }
 



.footer{ width: 100%; padding-top: 130px;}

.footer_inner{ padding-bottom: 20px; }
 
.footer_links ul{ display: flex; align-items: center; gap: 40px;justify-content: center;   }

.footer_links ul li a{ font-size: var(--fs14); font-weight: 500; color: var(--black); line-height: 1.4em; position: relative; transition:var(--transition) }

.footer_links li > * {
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  line-height: 1.5;
}

.footer_links li > * span {
  display: inline-block;
  vertical-align: top;
  backface-visibility: hidden;
  text-shadow: 0 1.5em 0 currentColor;
  transform: translate3d(0, 0, 0);
  transition: var(--transition);
}

.footer_links li>a:hover span, .footer_links ul li > a.active span {
  transform: translate3d(0, -100%, 0); color: var(--color_red);
}
 

.copyright{ width: 100%; padding-bottom: 36px; }

.copyright_inner{ display: flex; align-items: center; justify-content: space-between; padding: 20px 0px; border-bottom: 1px solid var(--border_color2); border-top: 1px solid var(--border_color2); justify-content: center; }

.copyright_left p{ color: var(--gray); font-size: var(--fs14); line-height: 1.2em; }

.footer_icons ul{ display: flex; align-items: center; }
.footer_icons ul li{ padding-right: 10px; }
.footer_icons ul li:last-child{ padding-right: 0px; }

.footer_icons ul li a{ transition: var(--transition); }
.footer_icons ul li a svg{ width: 100%; max-width: 20px; height: auto; display: block; } 

.footer_icons ul li a:hover svg path{ fill: var(--color_red); } 

.contactNum{ display: flex; align-items: center; justify-content: center; gap: 10px; }

.contactNum a{ color: var(--color_red); }













