:root {
  --color-primary: #5e82c9;
  --color-primary-hover: #4569b2;
  --color-accent: #ff3600;
  --color-accent-secondary: #e65b2c;
  --color-white: #fff;
  --gray-50: #f8f8f8;
  --gray-100: #f4f4f4;
  --gray-200: #e4e4e4;
  --gray-300: #d5d1d1;
  --gray-400: #c9c7c7;
  --gray-500: #898b92;
  --gray-600: #686868;
  --gray-700: #777575;
  --gray-900: #24292f;
  --bg-highlight: #fff2ed;
  --bg-muted: #f4fbf2;
}

/*public*/
a:hover {
  color: var(--color-accent);
}
.common-btn {
  border: 0;
  height: 34px;
  line-height: 34px;
  background-color: var(--color-primary);
  font-size: 14px;
  margin-right: 6px;
  width: 96px;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  text-align: center;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  cursor: pointer;
}
.common-btn:hover {
  background: var(--color-primary-hover);
  color: var(--color-white);
}
.link {
  color: var(--color-primary);
}

/*public end*/

/*header*/
#header2016 .header-nav .logo {
  background: var(--color-primary);
}
#header2016 .topnav li .link-menu:hover {
  color: var(--color-accent);
}
#header2016 .main-nav-wrapper li a.nav-menu.current,
#header2016 .main-nav-wrapper li a.nav-menu.hover,
#header2016 .main-nav-wrapper li a.nav-menu:hover {
  background-color: var(--color-primary);
  color: var(--color-white);
  border-bottom: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#header2016 .main-nav-wrapper li a.nav-menu:hover {
  color: var(--color-white);
}

/*header end*/

.query-container .domain-query-btn {
  background: var(--color-primary) url('/template/Tpl_2016/images/icon.png')
    no-repeat 22px -76px;
}
.active-hover {
  border: 2px solid var(--color-primary);
  margin: 0;
  height: 480px;
}
.active-hover .active-title {
  background-color: var(--color-primary);
  color: var(--color-white);
}
.active-hover .price {
  height: 86px;
  line-height: 86px;
}
.active-hover h6 {
  padding: 30px 0px;
}
.g-default-btn {
  height: 40px;
  line-height: 40px;
  color: var(--color-white);
  margin-right: 11px;
  background-color: var(--color-primary);
}
.hover .g-default-btn,
.g-default-btn:hover {
  background-color: var(--color-primary-hover);
  color: var(--color-white);
}
.searchDiv .domain-query-btn {
  background-color: var(--color-primary);
}
.searchDiv .domain-query-btn:hover {
  background-color: var(--color-primary-hover);
}
.wjf-ui-tab {
  background-color: var(--gray-50);
}
.wjf-ui-tab li,
.wjf-ui-tab-style3 li {
  position: relative;
}
.wjf-ui-tab li a {
  background: none;
}
.wjf-ui-tab li a.active {
  background-color: var(--color-primary);
  color: var(--color-white);
  margin-left: -2px;
}
.wjf-ui-tab li span,
.webhosting-tab li span {
  position: absolute;
  width: 1px;
  background: var(--gray-200);
  overflow: hidden;
  height: 32px;
  top: 10px;
  right: 0px;
  color: var(--gray-200);
}
.webhosting-tab li span {
  height: 42px;
}
.webhosting-tab .active .item {
  margin-left: -2px;
}
.wjf-ui-tab li a.active span,
.webhosting-tab .active span {
  display: none;
}
.triangle-top {
  display: none;
  width: 0;
  height: 0;
  border: 8px solid transparent;
  left: 50%;
  margin-left: -4px;
  bottom: -14px;
  border-top-color: var(--color-primary);
  position: absolute;
}
.wjf-ui-tab li a.active .triangle-top,
.wjf-ui-tab-style3 a.active .triangle-top {
  display: inline-block;
}

.line-color {
  margin: 5px auto 40px;
  width: 100px;
  border-bottom: 2px solid var(--color-primary);
}
.hotList li a {
  color: var(--gray-700);
  background-color: var(--gray-200);
}
.hotList li a.active {
  color: var(--color-white);
  background-color: var(--color-primary);
}
#header2016 .shopping-car-container .shopping-car-box h3 span {
  border-bottom: 1px solid var(--color-primary);
}
#header2016 .shopping-car-container .shopping-car-bottom .shopping-car-btn {
  background: var(--color-primary);
}
.domext-select-container .more-domains {
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
}
/*reg*/
.reg-section dt {
  color: var(--color-primary);
}
.reg-content .reg-title h3 {
  border-left: 3px solid var(--color-primary);
}
.reg-content .reg-title .login-btn {
  color: var(--color-primary);
}
.reg-content .reg-title .login-btn:hover {
  color: var(--color-accent);
}
.reg-btn {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  width: 200px;
  height: 44px;
  line-height: 44px;
  background: var(--color-primary);
  font-size: 14px;
  color: var(--color-white);
  text-align: center;
  border: 0;
  cursor: pointer;
}
.reg-btn:hover {
  background: var(--color-primary-hover);
  color: var(--color-white);
}
/*reg end*/

/*whois*/
.whois-content .whois-info .whois-btn,
.whois-domain .jp-domain-list a {
  background: var(--color-primary);
}
.whois-content .whois-info .whois-btn:hover {
  background: var(--color-primary-hover);
}
.whois-list .column-btn {
  background: var(--color-primary);
}
.webhosting-title .line-color {
  margin-bottom: 10px;
}
.webhosting-title h3 {
  margin: 15px 0;
}
/*whois end*/

/*domain reg*/
.dmbuymore-content .content-title h2 {
  border-left: 3px solid var(--color-primary);
}
.dmbuymore-section dt {
  color: var(--color-primary);
}
.dmbuymore-info .dmbuymore-info-buy {
  background: var(--color-primary);
}
.domext-wrapper .more-domains {
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
}
.domext-wrapper .more-domains:hover {
  border: 1px solid var(--color-accent-secondary);
  color: var(--color-accent-secondary);
}
/*domain reg end*/

/*transfer*/
.transfer-search-tab {
  background: var(--color-primary);
}
.transfer-search-tab li .active {
  background: var(--color-accent-secondary);
}
.transfer-search-tab li .active i.triangle-top {
  display: inline-block;
  border-top-color: var(--color-accent-secondary);
}
.transfer-btn {
  background: var(--color-primary);
}
.transfer-middle .tm-title {
  border-left: 4px solid var(--color-primary);
}
.transfer-section-tab li .active {
  border-bottom: 2px solid var(--color-primary);
  color: var(--color-primary);
}
/*transfer end*/

/*webhosting*/
.wjf-page-anchor-nav {
  border-bottom: 1px solid var(--gray-200);
}
.wjf-page-anchor-nav .active {
  border-top: 2px solid var(--color-primary);
  border-left: 1px solid var(--gray-200);
  border-right: 1px solid var(--gray-200);
}
.webhosting-faq .faq-list dt {
  color: var(--color-primary);
}
.webhosting-faq .faq-list .yd_link {
  color: var(--color-accent);
}
/*buy*/
.common-form dt {
  color: var(--color-primary);
  border-left: 2px solid var(--color-primary);
  padding: 8px 0px 8px 24px;
  background-color: var(--gray-50);
  font-size: 16px;
}
.config-table .import-info {
  color: var(--color-primary);
}
.product-detail-desc .title span {
  border-bottom: 2px solid var(--color-primary);
}
.common-form .submit-btn {
  background: var(--color-primary);
}
.common-form .submit-btn:hover {
  background: var(--color-primary-hover);
}
/*buy end*/
.webhosting-info table tr td .info-btn,
.webhosting-tab .active .item {
  background: var(--color-primary);
}
.webhosting-info table.high-light-table tr td .info-btn {
  background-color: var(--color-primary-hover);
}
.webhosting-info table.high-light-table {
  border: 1px solid var(--color-primary);
  box-shadow: 0 0 3px 1px var(--color-primary-hover);
}
.webhosting-info table.high-light-table th {
  color: var(--color-primary);
}
.webhosting-info table tr th {
  background: var(--bg-muted);
}
.webhosting-explain .webhosting-explain-title span {
  border-bottom: 2px solid var(--color-primary);
}
.webhosting-explain .webhosting-explain-txt span {
  color: var(--color-primary);
}
.webhosting-tab .webhosting-tab-list li.active a {
  border-bottom: 2px solid var(--color-primary);
}

.select-webhost {
  padding: 20px 30px;
  background: var(--color-white);
  font-size: 14px;
}
.select-webhost dl dt {
  font-weight: 700;
  float: left;
  height: 32px;
  line-height: 32px;
  width: 90px;
  text-align: right;
}
.select-webhost dl dd {
  float: left;
  margin: 0 4px;
}
.select-webhost a {
  display: inline-block;
  padding: 5px 10px;
}
.select-webhost a.select-active {
  background-color: var(--color-primary);
  color: var(--color-white);
}
/*webhosting end*/

/*vps*/
.vps-faq .faq-list dt {
  color: var(--color-primary);
}
/*vps end*/

/*cloudhost*/
.wjf-ui-tab-style2 li a.active {
  background: var(--color-primary);
}
.wjf-ui-tab-style2 {
  border-bottom: 2px solid var(--color-primary);
}
.progress {
  background-color: var(--color-primary);
}
.cloud-faq .faq-list dt {
  color: var(--color-primary);
}
.host-config .tx-host .tuijian-config input.btn_page_1 {
  background: var(--bg-highlight);
  border: 1px solid var(--color-primary);
}
/*cloudhost end*/

/*mail*/
.sel a.sel_on,
.wjf-ui-tab-style3 .active {
  background: var(--color-primary);
}
.btn-mail {
  background: var(--color-primary);
}
.btn-mail:hover {
  background: var(--color-primary-hover);
}
.wjf-ui-tab-style3 .item {
  height: 60px;
  line-height: 60px;
  margin: 0 20px 0 0;
}
.wjf-ui-tab-style3 {
  text-align: left;
}
.taocan .mail-table tr th {
  background: var(--bg-highlight);
}
/*mail end*/

/*agent*/
.am-column .am-left .am-txt .am-txt-icon {
  color: var(--color-primary);
}
.am-column .am-right .sm-btn1 {
  background: var(--color-primary);
}
.am-column .am-right .sm-btn2 {
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
}
.agent-level .al-title,
.aj-bottom .aj-title h4 {
  border-left: 4px solid var(--color-primary);
  color: var(--color-primary);
}
.mode-content h5 {
  color: var(--color-primary);
}
/*agent end*/

/*bagshow*/
.bagshow-title .bagshow-title-right .bagshow-title-btn,
.bagshow-goods .bagshow-count-right .bagshow-title-btn,
.bagshow-goods .bagshow-table .bagshow-table-btn {
  background-color: var(--color-primary);
}
.bagshow-goods .bagshow-table {
  border: 1px solid var(--gray-200);
  border-top: 2px solid var(--color-primary);
}
.bagshow-goods .bagshow-table tr th,
.bagshow-goods .bagshow-count {
  background: var(--gray-50);
}
/*bagshow end*/

/*help center*/
.navbar-left .nl-title,
.cr-search button,
.mail_tab_center_on {
  background: var(--color-primary);
}
.navbar-left .nl-list .active a,
.navbar-left .nl-list li:hover a {
  background: var(--bg-highlight);
  color: var(--color-primary);
  border-bottom: 1px solid var(--bg-highlight);
}
.cr-search {
  border: 2px solid var(--color-primary);
}
.mail_tab_center_on {
  color: var(--color-white);
}
.navbar-left .nl-list .active i,
.navbar-left .nl-list li:hover i {
  border-left-color: var(--bg-highlight);
}
/*help center end*/

/*footer*/
#footer2016 {
  background-color: var(--gray-900);
  color: var(--gray-500);
}
#footer2016 .footer-bottom p a,
#footer2016 .footer-bottom p a:hover {
  color: var(--gray-500);
}
/*footer end*/

/*manager new*/
.manager-btn,
.common-btn {
  background: var(--color-primary);
}
.manager-btn:hover,
.common-btn:hover {
  background: var(--color-accent-secondary);
}
.mt-news .mt-news-title .active,
.manager-product .mp-title span {
  border-bottom: 2px solid var(--color-primary);
  color: var(--color-primary);
}
.leftmenu_main h1:hover .expand-icon {
  border-left-color: var(--color-primary);
}
.manage_left_menu h1.current .expand-icon {
  border: 5px solid transparent;
  border-top-color: var(--color-primary);
}
.leftmenu_main h1:hover,
.leftmenu_main h1.current,
.leftmenu_main ul li.hover a,
.leftmenu_main ul li a:hover,
.leftmenu_main ul li a.linkcur {
  color: var(--color-primary);
}
.manager-tab li.liactive {
  border-top: 2px solid var(--color-primary);
}
/*manager new end*/
.gray-btn {
  background: var(--gray-300);
  color: var(--gray-600);
}
.gray-btn:hover {
  background: var(--gray-400);
  color: var(--gray-600);
}

/***********/
input.ddos_bt {
  margin-right: 8px;
  display: inline-block;
  width: 88px;
  height: 38px;
  line-height: 38px;
  background: var(--gray-100);
  font-size: 14px;
  text-align: center;
  border: 1px solid var(--gray-100);
  color: var(--gray-600);
  cursor: pointer;
  position: relative;
}

input.ddos_btactivate {
  background: var(--bg-highlight);
  border: 1px solid var(--color-primary);
}
