@charset "utf-8";
html,body,div,span,label,legend,caption,tfoot,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,video{margin:0;padding:0;outline:0;border:0;background:transparent;font-size:100%;}
html{-webkit-tap-highlight-color:rgba(0,0,0,0)}
body{background: #fff;color: #2f2f2f;font-size:16px;/*font-family:Helvetica,Arial,sans-serif,Comfortaa;*/font-family: Arial,Helvetica,Neue Helvetica World,Vazirmatn;overflow-x:hidden;}
td{ border:1px solid #efefef; height:40px;}
/*html.mac body{font-family:"PingFang SC",Microsoft YaHei,Helvetica,Arial,sans-serif;}*/
*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
article,hgroup,menu,nav,section,aside,details,figcaption,figure,footer,header{display:block;}
nav ul,ul,li{list-style:none;}
blockquote{quotes:none;}
blockquote:before,blockquote:after{content:none;}
a{ertical-align:baseline;text-decoration:none;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;margin:0;padding:0;}
a,input{outline:none;}
a:hover,a:focus{color:var(--hovercolor);text-decoration:none;cursor:pointer;}
img{max-width: 100%;height: auto;}
ins{color:#323841;background-color:#ff9;text-decoration:none;}
mark{color:#323841;background-color:#ff9;font-weight:bold;font-style:italic;}
*::selection {background:#24418e;color: #ffffff; text-shadow:none}
*::-moz-selection {background:#24418e;color: #ffffff;text-shadow:none}
@font-face{font-family:"Poppins";src: url(../fonts/Poppins-L.otf) format('truetype');font-weight: normal;font-style: normal;}
.clear {clear: both;font-size: 0;margin: 0;padding: 0;display: block; _height: 0;overflow: hidden;}
.clearfix:after {visibility: hidden; display: block;font-size: 0; content: " ";clear: both;height: 0;}
.clearfix { *zoom: 1;clear:both; font-size:0; line-height:0;}
.icon {background-image: url("/images/ico.png");display: inline-block;vertical-align: middle;}
/*----------- container -----------*/
.container{max-width:1600px;margin:0 auto;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0 20px}
.wrap{position:relative;max-width:1300px;margin:0 auto;}
.marg40{ margin-top:40px!important;}
.marg50{ margin-top:50px!important;}
.margb50{ margin-bottom:50px!important;}
.margb80{ margin-bottom:80px!important;}
.marg80{ margin-top:80px!important;}
.marg120{ margin-top:120px!important;}
@media screen and (max-width: 1920px){.container{margin: 0px auto;max-width:1600px}}
@media screen and (max-width: 1600px){.container{margin: 0px auto;max-width:1400px}}
@media screen and (max-width: 1440px){.container{margin: 0px auto;max-width:1300px}}
@media screen and (max-width: 1300px){.container{margin: 0px auto;max-width:1200px}}
@media screen and (max-width: 1280px){.container{margin: 0px auto;max-width:1200px}}
@media screen and (max-width: 1024px){.container{margin: 0px auto;max-width:1000px}}
:root {
  --menucolor:#212121;
  --webcolor:#142a52;
  --background:#f8f8f8;
  --hovercolor:#22abc3;
}
.posi{ position:relative}
/*----------- 头部 -----------*/
.header{ padding-top:60px;}
.header .header-nav{position:fixed;width:100%;float:left;background-color:rgba(255, 255, 255, 1); z-index:886;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;box-shadow:0 0 10px rgba(22,22,22,0.1); top:0}
.header .header-nav.fixed{background-color:rgba(255, 255, 255,1); opacity:1}
.header .nav-content{width:100%;}
.header .logo{ position:absolute;font-size:0px; height:63px; overflow: hidden; display: block; text-indent: -20000em; width: auto;background-size: 100% 100%; top:40%; margin-top:-25px;}
.header .logo a{display: block; color: #999; }
.header .logo .logob{ display: none}
.logo img{ height:63px;}
.mLogo{height:63px;}
.mLogo .logo{ display:none}
.header.opaque {padding-top:0px;}
.header.opaque .header-nav{background-color:rgba(255, 255, 255, 0.5);box-shadow:0 0 10px rgba(0,0,0,0.5)}
.header.opaque .header-nav.fixed{background-color:rgba(255, 255, 255, 1); opacity:1;box-shadow:0 0 10px rgba(22,22,22,0.1);}
.header.opaque .navbar a{ color:var(--menucolor);}
.header.opaque .navbar a:hover{ color:var(--hovercolor);}
.header.opaque .navbar a::after {content: ''; position: absolute;left: 0; bottom: 0;width: 0;height: 2px;background-color:var(--hovercolor);transition: width 0.3s ease;transform-origin: center;}
.header.opaque .navbar a:hover::after {width: 100%;}

.header.opaque .navbar li.active > a{color:#a52124; opacity: 1}
.navbar li.on > a{ color: #161616;}
.header.opaque .navbar li:after{ visibility: hidden; opacity: 0}
.header.opaque .header-nav.fixed .navbar a,.header.opaque .inner .navbar a{ color: var(--menucolor); opacity: 1}
.header.opaque .inner .navbar a:hover{ color: #fff;}
.header.opaque .header-nav.fixed .navbar li:after{ visibility: visible; opacity: 1}
.header.opaque .header-nav.fixed .navbar li.active > a,.header.opaque .header-nav.fixed .navbar li.on > a{color:var(--hovercolor);}
.header.opaque .logo .logoa,.header.opaque .header-nav.fixed .logo .logob{ display: none}
.header.opaque .logo .logob,.header.opaque .header-nav.fixed .logo .logoa{ display: block}
.header.noOpaque .navbar a{ line-height: 60px;}

/*导航栏*/
.navbar{ float:right;margin: 0;}
.navbar li{display: block; float: left; margin:0px ; position: relative; min-width:50px; text-align: center;}
.navbar a{display: block;line-height:80px; padding:0px 35px; font-size:18px; font-weight: 500; color:var(--menucolor);-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
.header-nav.fixed .navbar a{ line-height:80px;}
.header-nav.fixed .navbar>li>ul>li>a{ line-height:40px;}
.navbar li.active>a, .navbar li.on>a{color:#24418e;}

.navbar li.active:after,.navbar li:hover:after{width:100%;}
/*inner*/
.inner{ display:none; position:absolute; z-index:49;width:100%;top:60px; left:0}
.inner li{ width:100%; margin:0;}
.inner li a {display: block;font-size: 16px;font-weight:500;line-height: 32px;padding: 4px 15px;border-bottom:1px solid #eee; background-color: rgba(255,255,255,.96);}
.inner li#nvabar-item-index a{border-top:1px solid #eee;}
.inner li a:hover{background:#14016d; color:#fff;border-bottom:1px solid #24418e;}
.navbar li:after{background:#14016d;content:"";height:2px; width:0px;position:absolute;left:50%; transform:translateX(-50%);bottom:0;webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
.inner .navbar li.active:after,.inner .navbar li:hover:after{ width:0}
.navbar li>ul>li:before{ background-color:transparent; content: ''; transition: all 0.3s;}
.navbar li.active:before, .navbar li.on:before{width: 100%; left: 0;}

#navBox>div>ul>li:hover>ul{top:100%;filter:alpha(opacity=85)!important;opacity:0.85!important;max-height:inherit;}
#navBox>div>ul>li>ul{position:absolute;width:auto;top:130%;right:0;text-align:center;padding:0px 0; z-index:60;filter:alpha(opacity=0)!important;opacity:0!important;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease; max-height:0; overflow:hidden;}
#navBox>div>ul>li>ul>li a{float:none;display:block;padding:10px;color:#333; background-color:#f7f7f7;font-size:13px; text-align:center; line-height:25px; opacity: 1; width:200px; }
#navBox>div>ul>li>ul>li:after{ display:none}
#navBox>div>ul>li>ul>li{width:100%;padding:0;margin:0;font-size:14px;}
#navBox>div>ul>li>ul>.on a{color:#fff!important;background-color:rgba(0,0,0,0.9);}
#navBox>div>ul>li>ul>li.active a{}
#navBox>div>ul>li>ul>li.on>a{color:#fff}

.header .moble-bars{ padding: 0; margin:15px 0 0;font-size:21px;float:right; color:#999; display:none; position: relative; z-index: 99}
.header a:hover.moble-bars{/*color:#142a52*/}
.fixed {left: 0; opacity: 0.98;position: fixed;right: 0;top: 0; width: 100%;z-index:888;}

/*----------- breadcrumb -----------*/
.breadcrumb{max-width: 1220px; margin:0 auto;padding:12px 0;clear: both;overflow: hidden; border-bottom:1px solid #ddd;text-indent:5px}
.fa-angle-right,.fa-bullhorn{font-size: 16px; margin: 0 4px;}
/* Banner Slider */
.single_slide_slider{ margin-top:80px;}
.swiper-button-next{background:url(../images/right.png) no-repeat;filter:alpha(opacity=50);opacity:0.5;}
.swiper-button-prev{background:url(../images/left.png) no-repeat;filter:alpha(opacity=50);opacity:0.5;}
.banner-pages .swiper-pagination-bullet {width:50px;height:4px;display:inline-block;background-color:#ffffff;opacity:.5;border-radius:0;}
.banner-pages .swiper-pagination-white .swiper-pagination-bullet {background:#fff}
.banner-pages .swiper-pagination-bullet-active {opacity:1;background:#22abc3}

/*moble*/
.moble{max-width:1260px; margin:0 auto; height:0px; background:#fff; width:100%; padding:0 10px; display: none; position:fixed; top:0; z-index:889}
.moble a.moble-bars,.moble a.search-btn{-webkit-transition:all .6s ease;-o-transition:all .6s ease;transition:all .6s ease}
.Wauto{ width:100%; max-width:none; padding:0;}
.fixed .sbtn,.fixed .searchBox,.header.noOpaque .sbtn{ color: #999}
a.search-btn{ display:none;}

.sbtn{ position:inherit; float:right; font-size:18px; background:rgba(0,0,0,.0);height:40px; line-height:40px; border-radius:1000px; text-align:center; margin-top:19px; margin-left:10px;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;filter:alpha(opacity=65)!important;opacity:0.65!important;}
.lang{ position: relative; float:right;padding:0 7px;  height:25px; line-height:25px; text-align:center; margin-top:27px; left:20px;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;
    background: rgba(0,0,0,0.05);border-radius: 15px;}
.lang{ position: relative; float:right;padding:0 20px;line-height:25px; text-align:center;margin-top:27px; left:20px;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;}
.lang i{ font-size:18px; padding-right:5px; color:#2f2f2f}
.lang img{ width:30px;}
.lang:hover{color: #fff !important;filter:alpha(opacity=100)!important;opacity:1!important;}
.lang .dropdown-toggle{ color:var(--menucolor); filter:alpha(opacity=100)!important;opacity:1!important;font-size:14px;}
.dropdown-menu{ font-size:14px;}
.dropdown-menu li img{ width:25px; padding-right:5px;}
.fixed .lang .dropdown-toggle{color:var(--menucolor);}
.fixed .lang .dropdown-toggle:hover{ color: var(--menucolor) !important;filter:alpha(opacity=100)!important;opacity:1!important;}
.fixed .sbtn,.header.noOpaque .sbtn{margin-top:19px;}
.fixed .lang{margin-top:25px;}

.header.noOpaque .lang{margin-top: 20px;color: #333;background: rgba(0,0,0,0.1)}
.header.noOpaque .lang .dropdown-toggle{color: #333;}
.lang{ position: relative; float:right;padding:0 10px;  height:30px; line-height:30px; text-align:center; margin-top:27px; left:20px;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;
   border-radius: 5px; border:1px solid #efefef;}
.lang:hover{color: #fff !important;filter:alpha(opacity=100)!important;opacity:1!important;}

/*放大镜*/
.fangdapic{ overflow:hidden; position:relative; border:1px solid #dddddd; padding:20px;}
.fangdapic>img{ transition: 1s all; -webkit-transition: 1s all; -moz-transition: 1s all; -o-transition: 1s all; -ms-transition: 1s all; width:100%}
a:hover .fangdapic>img{transform: scale(1.1);-webkit-transform: scale(1.1);}
li:hover .fangdapic>img{transform: scale(1.1);-webkit-transform: scale(1.1);}
/*底部foot*/
.contact-form-section {background-color: #00b5c9;padding: 50px 20px;display: flex;justify-content: center;align-items: center;position: relative;overflow: hidden;}
.contact-form-section::before {content: ""; position: absolute;left: 0;top: 20px;width: 30%;height: 100%;background: url("/images/bot_car.png") no-repeat center/contain;z-index: 1;}
.form-container {width: 100%; max-width: 800px;position: relative;z-index: 2;margin-left: auto;padding: 0 20px;}
.form-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));gap: 20px;margin-bottom: 25px;}
.form-grid input,.form-grid textarea {width: 100%;padding: 12px 15px; border: 1px solid #fff;background: transparent;color: #fff;font-size: 16px;outline: none;}
.form-grid input::placeholder,.form-grid textarea::placeholder {color: #fff; opacity: 0.8;}
.submit-btn {background-color: #008899;color: #fff;border: none; padding: 12px 30px;font-size: 16px;cursor: pointer;border-radius: 4px;transition: background 0.3s;}
.submit-btn:hover {background-color: #006677;}
.footer-section { background-color: #1a1a1a;color: #fff; padding: 60px 20px 30px;}
.footer-container {max-width: 1600px; margin: 0 auto;display: grid;grid-template-columns: 500px 1fr 1fr 1fr;}
/*.footer-container {max-width: 1600px; margin: 0 auto;display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));}*/
.footer-column h3 { font-size: 18px;margin-bottom: 25px;color: #fff;font-weight: 500;}
.contact-list {list-style: none;}
.contact-list li { margin-bottom: 15px;font-size: 14px;display: flex;align-items: flex-start;gap: 10px;}
.contact-list li i {font-size: 16px; margin-top: 2px;}
.link-list {list-style: none;}
.link-list li { margin-bottom: 12px;font-size: 14px;}
.link-list a {color: #fff;text-decoration: none;transition: color 0.3s;}
.link-list a:hover {color: #00b5c9;}
.qrcode-group {display: flex;gap: 20px;flex-wrap: wrap;}
.qrcode-item { text-align: center;}
.qrcode-item img {width: 120px;height: 120px; margin-bottom: 10px;}
.qrcode-item p { font-size: 12px;color: #ccc;}
.copyright { max-width:1600px;margin: 40px auto 0; padding-top: 20px;border-top: 1px solid #333;text-align: center;font-size: 12px; color: #999;}

/* 响应式调整（小屏幕） */
@media (max-width: 768px) {
	.contact-form-section::before {width: 50%;}
	.form-container { margin-left: 0; }
	.qrcode-group {justify-content: center; }
	.footer-section{background:#1a1a1a; color:#fff;padding: 30px 0 20px 10px;}
    .mo{ display:none}
}

@media (max-width: 480px) {
	.contact-form-section {padding: 30px 15px;}
	.contact-form-section::before {display: none; /* 手机端隐藏卡车图片，避免遮挡 */}

}
@media (max-width:768px) {
body{font-size:15px;}
.mlang{margin: 0;position: fixed;top: 10px;right: 90px;}
.mlang a.dropdown-toggle{font-size: 18px; color:#999 }
.single_slide_slider{margin-top:1px;}
.wrap{margin:0 auto;max-width:98%;}
.marg80{ margin-top:40px!important;}
.margb80{margin-bottom:40px!important;}
.marg40{ margin-top:20px!important;}
.marg50{ margin-top:20px!important;}
.mob{ display:none}

.bnBox{margin-top:-70px;}

.container{margin:0 auto;width:98%;}
/*foot*/
.foot_bg{padding:20px 0px 20px 0;}
.footcenter{ display:none;}
.footright{ display:none;}
.footLeft{ float:left;width:98%; margin-left:2%;overflow:hidden;}
.footico{padding-top:1px;}
.footico p{ width:100%; float:left; line-height:40px;font-size:13px;}
.rightFix{ display:none}
.copyright{ text-align:center}

}
/*----------- media -----------*/
@media screen and (max-width:1024px){
    .header .nav-content{width: 1024px;}
    .navbar a{font-size: 14px;padding:0 10px;}
    .lang{left:5px;}
	.rightFix{ display:none}
}
@media screen and (max-width:1200px){
    .header .nav-content{width: 1100px;}
    .navbar a{font-size: 14px;padding:0 10px;}
    .lang{left:5px;}
	.rightFix{ display:none}
	.footLeft{ float:left;width:400px;}
	.footcenter{ float:left;width:500px;overflow:hidden; margin-left:40px; }
	.footright{ float:right;width:130px;overflow:hidden; }
	.footright h3{ font-size:16px; line-height:40px; font-weight:bold; color:#2e2e2e;}

}
@media screen and (max-width:960px){
    .header,.header.opaque{ padding-top: 60px;}
    .navbar{ float:left; width:100%;}
    .moble{ display:block; height:60px;}
    #navBox{ display:none;}
    nav>ul>li>ul li{font-size: 14px;text-indent:0px;}
	.header.opaque .header-nav.fixed .navbar a,.header.opaque .inner .navbar a{ color: #2e2e2e; opacity: 1}
    .header.opaque .navbar li.active > a{color: #F00;}
    .search-pup,.mLogo .logo,a.search-btn,.header .moble-bars,.header.opaque .header-nav.fixed .logo .logoa,.header.opaque .logo .logoa{ display:block;}
    .header.opaque .logo .logob{ display: none}
    .search-btn,.sbtn,.searchBox{color:#aaa;}
    .moble{padding: 0 20px;}
    .bnBox{margin-top:-70px;}
	.rightFix{ display:none}
}

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

    .container{ padding:0 12px;}
    .bnBox{margin-top:-70px;}
	.rightFix{ display:none}
}

@media screen and (max-width:640px){
    .header,.header.opaque{ padding-top:48px;}
    .moble{ height:48px;padding: 0 10px;}
    .header .moble-bars{ margin-top:9px;}
    .search-btn{ top:12px; right:45px;}
    .inner{ top:48px;}
    .mLogo{ height: 48px}
    .mLogo .logo{ height:28px; margin-top:-10px;}
    .mLogo .logo img{ height: 28px}
    .search-pup form button{ top:7px;}
    img.avatar{ width: 40px; height: 40px;}
	.bnBox{margin-top:-70px;}
    .bnBox.cateBn .text h3{font-size: 28px;}
    .bnBox.cateBn .text p{ font-size: 14px;}
	.rightFix{ display:none}
}
/*CSS动画样式*/
.anim{visibility:hidden;}
.animated{visibility:visible;}
/*在线客服rightFix*/
.rightFix {width: 65px; position: fixed;right: 10px;bottom: 10%;z-index: 999;}
.rightFix a {width: 65px; height: auto;background:var(--hovercolor);text-align: center;display: block;margin-bottom: 6px;position: relative;padding-top: 8px;
  border-radius: 5px;padding-bottom: 5px;}
.rightFix a h3 {color: #fff; font-weight: 400;font-size: 12px;}
.rightFix .ico {width: 32px; height: 32px;display: block;position: relative;overflow: hidden;transition: all ease 300ms;margin: 0 auto 1px;padding: 0;
  background: url("/images/fix-ico.png") no-repeat 0 0;}
.rightFix .img { width: 110px;height: auto;position: absolute;left: -10px;top: 0;padding: 6px; background: #2c2c2c;border: 1px solid #ddd;background: #fff;
  display: none;text-align: center;opacity: 0;filter: alpha(opacity=0);transition: all ease-in-out 0.2s;border-radius: 5px;color: #333;padding-bottom: 10px;}
.rightFix .img p {padding-top: 5px;}
.rightFix a:hover .img {opacity: 1;filter: alpha(opacity=100);left: -120px;display: block;}
.rightFix .img img {width: 110px;height: 110px;}
.rightFix a span {width: 200px;text-align: center;height: 62px;line-height: 62px;position: absolute;top: 0;background: #147b8d;color: #fff;display: block;font-weight: bold;font-size: 18px;opacity: 0;filter: alpha(opacity=0);transition: all ease-in-out 0.2s;border-radius: 7px 0 0 7px;}
.rightFix a:hover {background-color: #147b8d;overflow: visible;}
.rightFix a:hover h3 { color: #fff;}
.rightFix a.fix-ewm:hover img {opacity: 1;filter: alpha(opacity=100);left: -140px;}
.rightFix a:hover span {opacity: 1;filter: alpha(opacity=100);left: -210px;}
.rightFix .fix-tel:hover .ico { background-position: -32px 0;}
.rightFix .fix-xcx .ico {background-position: 0 -32px;}
.rightFix .fix-xcx:hover .ico {background-position: -32px -32px;}
.rightFix .fix-ewm .ico {background-position: 0 -64px;}
.rightFix .fix-ewm:hover .ico {background-position: -32px -64px;}
.rightFix .mess .ico {background-position: 0 -96px;}
.rightFix .mess:hover .ico {background-position: -32px -96px;}
.rightFix .fix_top .ico {background-position: 0 -128px;}
.rightFix .fix_top:hover .ico,
.rightFix .fix_top.hover .ico {background-position: -32px -128px;}
.rightFix .fix-form { background-position: 10px -234px;}
.rightFix .fix-form span {font-size: 14px; line-height: 23px;width: 180px;}
.rightFix .fix-form:hover {background-position: -37px -234px;}

/*弹出搜索框*/
.fl{ float:lef;}
.modal {
  display: none;/* 默认隐藏 */
  position: fixed;/* 根据浏览器定位 */
  z-index: 666;/* 放在顶部 */
  left: 0;
  top: 0;
  width: 100%;/* 全宽 */
  height: 100%;/* 全高 */
  overflow: auto;/* 允许滚动 */
  background-color: rgba(0, 0, 0, 0.4);/* 背景色 */
}
/*模态框内容*/
.modal-content {
  display: flex;/*采用flexbox布局*/
  flex-direction: column;/*垂直排列*/
  position: relative;
  background-color: #fefefe;
  margin: 15% auto;/*距顶部15% 水平居中*/
  padding: 20px;
  border: 1px solid #888;
  width: 650px;
  animation: topDown 0.4s;/*自定义动画，从模态框内容上到下出现*/
}
@keyframes topDown {
  from {
    top: -300px;
    opacity: 0;
  }
  to {
    top: 0;
    opacity: 1;
  }
}
/*模态框头部*/
.modal-header {
  display: block;/*采用flexbox布局*/
  flex-direction: row;/*水平布局*/
  align-items: center;/*内容垂直居中*/
  justify-content: space-between;
  text-align: right;
}
/*关闭X 样式*/
.close {
  float: right;
  color: #aaa;
  font-size: 28px;
  font-weight: bold;
  transition: all ease 0.36s;
  display: block;
  width: 32px;
  height: 32px;
  background: url("/images/closeModal.png") no-repeat center center;
}
.close:hover {
  color: black;
  text-decoration: none;
  cursor: pointer;
  transform: rotate(360deg);
  transition: all ease 0.36s;
}
.modal-body {
  padding-top: 20px;
  padding-bottom: 30px;
  margin-top: 10px;
}
.modal-body .stxt {
  float: left;
  width: 450px;
  height: 48px;
  border: #CCC solid 1px;
  padding-left: 30px;outline: none;
}
.modal-body .bottons {
  width: 80px;
  height: 50px;
  background: url("/images/search_btn.png") no-repeat center center var(--hovercolor);
  border: none;
  cursor: pointer;
}