@font-face {
  font-family: dinregular;
  src: url(../fonts/dinregular.eot?_=5G230907);
  src: url(../fonts/dinregular.eot?#iefix) format("embedded-opentype"),
    url(../fonts/dinregular.woff?_=5G230907) format("woff"),
    url(../fonts/dinregular.ttf?_=5G230907) format("truetype"),
    url(../fonts/dinregular.svg#dinregular?_=5G230907) format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: dinregulalIcon;
  src: url(../fonts/dinregIcon.eot?_=5G230907);
  src: url(../fonts/dinregIcon.eot?#iefix) format("embedded-opentype"),
    url(../fonts/dinregIcon.woff?_=5G230907) format("woff"),
    url(../fonts/dinregIcon.ttf?_=5G230907) format("truetype"),
    url(../fonts/dinregIcon.svg#dinregular?_=5G230907) format("svg");
  font-weight: normal;
  font-style: normal;
}


/* 重置bootstrap样式  --------------------------------- start --------------------------------- */
.icon-dinregular { font-family: dinregulalIcon !important }
.overflow-auto { overflow: auto; }
.text-bold { font-weight: 600; }
.text-primary { color: #444 !important }
.text-secondary { color: #fff !important }
.text-danger { color: red !important; font-weight: normal; }
.text-yellow { color: #FFCC33 !important; }
.text-green { color: #03fc1a !important; }
.text-underline { text-decoration: underline; }
.bg-transparent { background: 0 0 !important }
.bg-gray { background: #f5f5f5 }
.bg-white { background: #fff }
.btn { border: none; outline: none; }
.btn.disabled, .btn[disabled] { background: #ccc }
.btn.disabled:hover, .btn[disabled]:hover { background: #ccc }
.btn-primary,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open>.dropdown-toggle.btn-primary.focus,
.open>.dropdown-toggle.btn-primary:focus,
.open>.dropdown-toggle.btn-primary:hover { background-color: #1890ff; border: none; }
.p-0 { padding: 0 !important }
.p-1 { padding: .2rem !important }
.pt-2, .py-2, .p-2 { padding-top: .6rem !important }
.pb-2, .py-2, .p-2 { padding-bottom: .6rem !important }
.pr-2, .px-2, .p-2 { padding-right: .6rem !important }
.pl-2, .px-2, .p-2 { padding-left: .6rem !important }
.pt-3, .py-3, .p-3 { padding-top: 1rem !important }
.pb-3, .py-3, .p-3 { padding-bottom: 1rem !important }
.pr-3, .px-3, .p-3 { padding-right: 1rem !important }
.pl-3, .px-3, .p-3 { padding-left: 1rem !important }
.pt-4, .py-4, .p-4 { padding-top: 1.5rem !important }
.pb-4, .py-4, .p-4 { padding-bottom: 1.5rem !important }
.pr-4, .px-4, .p-4 { padding-right: 1.5rem !important }
.pl-4, .px-4, .p-4 { padding-left: 1.5rem !important }
.pt-5, .py-5, .p-5 { padding-top: 3rem !important }
.pb-5, .py-5, .p-5 { padding-bottom: 3rem !important }
.pr-5, .px-5, .p-5 { padding-right: 3rem !important }
.pl-5, .px-5, .p-5 { padding-left: 3rem !important }
.m-0 { margin: 0 !important }
.mt-0 { margin-top: 0 !important }
.mt-2, .my-2, .m-2 { margin-top: .6rem !important }
.mb-2, .my-2, .m-2 { margin-bottom: .6rem !important }
.ml-2, .mx-2, .m-2 { margin-left: .6rem !important }
.mr-2, .mx-2, .m-2 { margin-right: .6rem !important }
.mt-3, .my-3, .m-3 { margin-top: 1rem !important }
.mb-3, .my-3, .m-3 { margin-bottom: 1rem !important }
.ml-3, .mx-3, .m-3 { margin-left: 1rem !important }
.mr-3, .mx-3, .m-3 { margin-right: 1rem !important }
.mt-4, .my-4, .m-4 { margin-top: 1.5rem !important }
.mb-4, .my-4, .m-4 { margin-bottom: 1.5rem !important }
.mr-4, .mx-4, .m-4 { margin-right: 1.5rem !important }
.ml-4, .mx-4, .m-4 { margin-left: 1.5rem !important }
.mt-5, .my-5, .m-5 { margin-top: 3rem !important }
.mb-5, .my-5, .m-5 { margin-bottom: 3rem !important }
.ml-5, .mx-5, .m-5 { margin-left: 3rem !important }
.mr-5, .mx-5, .m-5 { margin-right: 3rem !important }
.border-0 { border: none !important }
.border-bottom-1 { border-bottom: 1px solid !important }
.nav-stacked>li>a { border: 1px solid #ccc; padding: 1.1em 0.5em 1.1em 0.7em; color: #444; }
.nav-stacked>li>a:hover { background: unset; }
.nav-pills>li.active>a { color: #1890ff; border: 1px solid #1890ff; background: #fff !important; }
.nav-pills>li.active>a, 
.nav-pills>li.active>a:focus, 
.nav-pills>li.active>a:hover { background: unset; color: #1890ff; }
.navbar { border-width: 0; border-bottom-width: 1px }
.checkbox-inline, .radio-inline { min-width: 4em; }
.form-control[disabled], 
.form-control[readonly], 
.inline-box { display: inline-block; }
.pointer { cursor: pointer; }
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover { background-color: unset; border-color: transparent; border-bottom: 2px solid #1890ff; }
.nav-tabs>li>a { color: #444; min-height: 45px; outline: none; }
.nav-tabs>li>a:hover { background: unset; border-color: transparent; }
.table thead tr th { vertical-align: sub; }
.modal-header button.close,
.modal-header button.close:hover { font-size: 18px; color: red; opacity: 1; }
.form-control { line-height: normal; }  /* line-height: normal; 解决safari浏览器placeholder垂直不居中的问题 */
.font-12 { font-size: 12px; }
table { border-collapse: unset; }
table.table-bordered  { border-collapse: collapse; }
fieldset[disabled] .form-control { background-color: #eee; opacity: .8; }
button[disabled], html input[disabled] { cursor: not-allowed; }
p { margin-bottom: 0; }
/* 重置bootstrap样式  --------------------------------- end --------------------------------- */




/* 重置easyDialog样式  --------------------------------- start --------------------------------- */
.easyDialog_wrapper { color: #444; border-radius: 5px; display: none; }
.easyDialog_wrapper .easyDialog_content { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 5px; background: #fff; }
.easyDialog_wrapper .easyDialog_title { height: 40px; line-height: 40px; overflow: hidden; /* color: #fff; */ padding: 0 10px; font-size: 14px; border-bottom: 1px solid #e5e5e5; background: #f8f8f8; border-radius: 5px 5px 0 0; }
.easyDialog_wrapper .close_btn { font-family: Arial, Helvetica, sans-serif; font-size: 18px; _font-size: 12px; font-weight: 700; color: #999; text-decoration: none; float: right; }
.easyDialog_wrapper .close_btn:hover { color: #333; }
.easyDialog_wrapper .easyDialog_text { font-size: 13px; line-height: 22px; }
.easyDialog_wrapper .easyDialog_footer { padding: 0 10px; *zoom: 1; }
.easyDialog_wrapper .easyDialog_footer:after { content: ''; display: block; height: 0; overflow: hidden; visibility: hidden; clear: both; }
.easyDialog_wrapper .btn_highlight,
.easyDialog_wrapper .btn_normal { border: 1px solid; border-radius: 0px; cursor: pointer; float: right; font-size: 14px; padding: 2px 8px; min-width: 78px; height: 34px; line-height: 28px; margin-bottom: 10px; margin-right: 20px; }
.easyDialog_wrapper .btn_highlight { background: #1890ff; color: #fff; outline: none; border-radius: 5px; }
/* .easyDialog_wrapper .btn_highlight:hover { background: #666; } */
.easyDialog_wrapper .btn_normal { background: #1890ff; color: #fff; outline: none; border-radius: 5px; }
/* .easyDialog_wrapper .btn_normal:hover { background: #666; } */
.easyDialog_wrapper .closex { margin-left: 2px; font-size: 18px; /* background: white; */ color: red; }
.easyDialog_wrapper .easyDialog_title { margin-bottom: 0; }
#easyDialogBox .dialog-modal { width: 34rem; word-wrap: break-word; word-break: break-word; padding: 1rem 3rem; }
#easyDialogBox .dialog-modal.waiting-dialog { padding: 3rem }
#easyDialogBox .dialog-modal.alert-dialog,
#easyDialogBox .dialog-modal.confirm-dialog { padding: 1.5rem }
/* 重置bootstrap样式  --------------------------------- end --------------------------------- */




/* 全局样式  --------------------------------- start --------------------------------- */
label { font-weight:400; margin-bottom: 0; }
hr { border-top:1px solid #ccc }
li,ol,ul { list-style-position:outside; list-style:none; margin-block-start:0; margin-block-end:0; padding-inline-start:0 }
textarea { resize: none; }

#default-tips { background: red;height: 30px;line-height: 30px;color: #fff;text-align: center;font-size: 13px;cursor: pointer; }
#status-bar { font-size: 1.4rem; }
#account,#lang,#to_home { display:inline-block; cursor:pointer }
#sms_tips{display: inline-block;cursor: pointer;}
#sms_icon { font-size: 1.5em;display: inline-block;padding-right: 3px;padding-left: 1px; /*animation: 1.5s fadeInOut infinite steps(1);*/ }
#wifi_icon { font-size: 2.6rem;}
#extender_icon { font-size: 2rem; cursor: pointer; }
/* #roam { font-weight: bold; } */
#fota_icon { font-size:1.8em; /*animation: 1.5s fadeInOut infinite steps(1);*/  padding-left: 1px;}
#traffic { font-size: 2em; color: #888;}
#battery span { font-size: 2em; }
#battery span:nth-of-type(1) { color: #888; }
#battery span:nth-of-type(2) { color: #888; margin-left: -0.93em; } 
#battery label { margin-left: -2.60em; font-size: 12px; vertical-align: text-bottom;text-align: center;width: 32px; transform: scale(0.8); }
#errHint,
#errHint0,
#errHint1 { color: red; line-height: 2.4rem; }
#ethernet_icon { font-size: 2.2rem; cursor: default; }
#logo>img { display: none; }
input[type="password"]::-ms-reveal { display: none; }

.navbar .container-fluid { max-width: 97.5rem; min-width: 30rem; }
.main-content-section { max-width: 97.5rem; min-width: 30rem; }
.main-content { background: #fff; border-radius: 0.6rem; padding: 3rem 6rem 8rem; border: 1px solid #e1e1e1 }
.main-content header.content-header { border-bottom: 1px solid #ccc; padding: 15px 0; margin-bottom: 3.5rem; }
.main-content header.content-header > div:last-child { height: 4rem; line-height: 4rem; margin-left: 2rem; font-size: 1.5rem; font-weight: bold; cursor: pointer; }
.main-content header.content-header div.icon { width: 4rem; height: 4rem; color: #fff; text-align: center; line-height: 4rem; border-radius: 5px; }
.main-content header.content-header div.icon span { font-size: 24px; }

.footer-copyright { font-size:80%; margin-top:.5em }
.separator-line { font-size:2em; margin:0 .2em }
.separator-title { font-size: 1.5rem; font-weight: bold; }
.auto-fota-dialog { padding: 3rem; min-width: 30rem; text-align: center; }

.customform input,
.customform select,
.customform textarea { border:1px solid #e0e0e0; padding:0 .8rem; width:100%; font-size:14px; height:3.7rem; border-radius: 0.3rem; line-height: normal; } /* line-height: normal; 解决safari浏览器placeholder垂直不居中的问题 */
.customform select { padding-left: .5rem; }
.customform input[type=checkbox],
.customform input[type=radio] { margin-right:.625em; width:auto; padding:0; font-size:1.2em; height:auto }
.customform div.line_form { vertical-align:middle; line-height:3.7rem}
.customform label.check { font-size:1.8em }
.customform fieldset { border:1px solid #999; }
.customform legend { font-size:1.0em; border:0 solid #999; padding:.2em .4em; background:#1890ff; color:#fff; width:auto; }
.customform .radio-inline { padding-left:0; vertical-align:unset; }
.customform .radio-inline~input[type=radio] { margin-left:2em }
.customform .row { margin-bottom: 2rem; }

.top-menu { margin-bottom:0; min-height: unset; background: #fff; border-bottom: 1px solid #e1e1e1; box-shadow: 0 4px 10px 0 rgb(0 0 0 / 5%);}
.top-menu li,.top-menu ul { margin-bottom:0; padding: 0; }
.top-menu li { float:left; width: 25%; }
.top-menu li.menu-item>a { display:inline-block; height:100%; width:100%; text-align:center; cursor:pointer; padding:14px 0; text-decoration:none; color:#fff; outline:0 }
.top-menu li.menu-item>a .iconfont { display:block; font-size: 2.6rem; }
.top-menu li.menu-item.active>a { color: #1890ff !important; }
.top-menu li.menu-item.active>a .text { font-weight: bold; }
/* 全局样式  --------------------------------- end --------------------------------- */




/* 子页面样式  --------------------------------- start --------------------------------- */
.icon-home { font-size:1.2em }
.icon-login { font-size:1.44em }
.icon-signal { font-size:2.2em; }
.icon-signal-bg { color:#888; }
.icon-signal-lv { margin-left:-0.97em; }
.icon-signal-lv-7 { font-size: 1.5em; }
.icon-no-card { margin-left: -0.5em; }
.login-footer { position: fixed; width: 100%; left: 0; bottom: 1em; font-size: 80% }

table.filter-table tr.tr-filter th,
table.filter-table tr.tr-filter td { vertical-align: middle; text-align: center; line-height: unset; padding: 1px;}
table.filter-table tr.tr-filter .close-btn { font-size: 1.6em; cursor: pointer; background: transparent; border: none;}
table.filter-table tr.tr-filter .close-btn:hover { color: red; }
table.filter-table tr.tr-filter input, 
table.filter-table tr.tr-filter select { outline: none; height: 3rem;}
table.filter-table tr.tr-filter th:first-child { width: 4rem; }
table.filter-table tr.tr-filter th:last-child { width: 4rem; }
table.filter-table { border: 1px solid #e0e0e0; }
table.filter-table tbody tr.tr-filter:first-child td { padding-top: 4px; }
table.filter-table tbody tr.tr-filter:last-child td { padding-bottom: 4px; }
table.conn-table tr>* { padding: 0.9rem 1rem; }
table.table-bottom-bordered>tbody>tr>td { border: 0; border-bottom: 1px solid #ccc; vertical-align: middle; word-wrap: break-word; word-break: break-word; }

#user_list_table td, 
#user_list_table th { padding: 0.8em 10px; text-align: left; box-sizing: content-box; }
#user_list_table th { padding-top: 1.5em; padding-bottom: 1.5em; border: 1px solid #ccc; border-width: 1px 0; }
#user_list_table span.access-type { font-size: 3.2rem; }
#user_list_table th.clear { min-width: 42px; text-align: center; }
#user_list_table td.clear-offline { color: #1890ff; width: 36px; text-align: center; cursor: pointer; }
#user_list_table #inputEditMAC,
#user_list_table #inputEditAlias { width: 220px; }
#user_list_table .alias_name { display: inline-block; } 
#user_list_table .connnect-time { font-size: 1.2rem; color: #aaa; }
#user_list_table .current-user { color: #1890ff; font-weight: bold; }


.file-box { display: inline-block; position: relative; height: 30px; width: 100%; padding-right: 100px;}
.file-box>* { height: 100% !important; }
.file-box .name { float: left; }
.file-box .button { float: left; line-height: 30px; padding: 0 10px; width: 100px; margin-right: -100px; text-align: center; }
.file-box .file { position: absolute; top: 0; left: 0; opacity: 0; width: 100%; }

.release-content p { word-wrap: break-word; word-break: normal; }
.release-content .tips { border: 1px solid #7f7f7f; }
.release-content .tips ol,
.release-content .tips li { list-style: decimal; list-style-position: outside; margin-left: 1rem; }
.release-content .head { background: #7f7f7f; padding: 0.4em; color: white; }
.release-content .spin { display: inline-block; width: 1.2em; height: 1.2em; background: url("../images/red-loader.gif") no-repeat no-repeat; }
.release-content .align_span { display: inline-block; width: 7em; }
.fota-updaing-dialog .progress { margin-bottom: 0; }

.module-zone .module-zone-header { border-bottom: 1px solid #CCC; font-size: 16px; font-weight: bold; padding-bottom: 6px; margin-bottom: 20px; }
.module-zone .app-modules { cursor: pointer; height: 13rem; padding-left: 7rem; }
.module-zone .icon { float: left; margin-left: -7rem; width: 6.4rem; height: 6.4rem; line-height: 6.4rem; border-radius: 1rem; text-align: center; }
.module-zone .icon .iconfont { font-size: 40px; color: #fff; }
.module-zone .text { float: left; padding-left: .5rem; padding-right: 1rem; max-width: 15rem; line-height: 18px; }
.module-zone .text .description { font-size: 11px; color: #909396; word-break: break-word; }
.module-zone .text .title { font-size: 13px; margin-bottom: .5rem; font-weight: bold; }

.icon-skin0 { background: #ff9000; }
.icon-skin1 { background: #80bf00; }
.icon-skin2 { background: #a2b3ba; }
.icon-skin3 { background: #b36a35; }
.icon-skin4 { background: #6798e5; }
.icon-skin5 { background: #7ddb6b; }
.icon-skin6 { background: #ff6666; }
.icon-skin7 { background: #003366; }
.icon-skin8 { background: #09ddc0; }
.icon-skin9 { background: #ffcc00; }
.icon-skin-black { background: #000; }

div.password-template { position: relative;}
div.password-template span.show-password { font-size: 20px; top: 6px; right: 5px; position: absolute; cursor: pointer; }
div.line-switch { padding-top: 0.6rem; }
div.line-switch .switch-control { position: relative; width: 48px; height: 24px; text-align: center; line-height: 24px; cursor: pointer; font-size: 44px; }
div.line-switch .switch-control.icon-switch-off { color: #CCC; }
div.line-switch .switch-control.icon-switch-on { color: #1890ff; }

div.home-page { padding: 3rem 0; overflow-x: auto;}
div.topology { position: relative; margin: 0 auto 9rem; width: 600px; height: 9rem; }
div.topology .topology-section { position: relative; width: 80px; height: 90px; }
div.topology .topology-section p { position: absolute; top: 10rem; font-size: 14px; width: 150%; text-align: center; margin-bottom: 0; left: -20px; }
div.topology #device-terminal { background: url(/images/device.png?_=x55001) no-repeat center bottom; background-size: 70px; user-select: none; }
div.topology #mobile-router { position: absolute; left: 50%; margin-left: -40px; }
div.topology #mobile-router.cpe { background: url(/images/cpe.png?_=5G220901) no-repeat center bottom; background-size: 40px; }
div.topology #mobile-router.odu { background: url(/images/odu_z.png?_=5G220901) no-repeat center bottom; background-size: 40px; }
div.topology #mobile-router.c150 { background: url(/images/c150.png?_=5G230505) no-repeat center bottom; background-size: 80px; }
div.topology #net-status { background: url(/images/net.png?_=x55001) no-repeat center bottom; background-size: 60px; }
div.topology #device-terminal #user_list_count { position: absolute; width: 28px; height: 28px; border-radius: 15px; /* background: #32a3fa; */ right: 22px; top: 37px; color: #000; text-align: center; /* border: 1px solid #aaa; */ line-height: 30px; font-weight: bold; }
div.topology #mobile-router p { width: 180px;left: -50px; }
div.topology #mobile-router a#hostname { text-decoration: none; border-bottom: 1px solid; padding-bottom: 2px; word-wrap: break-word; word-break: break-word; line-height: 20px; }
div.topology .wifi-zone { position: absolute; width: 150px; left: 95px; top: 2.5rem; }
div.topology .connection-zone { position: absolute; width: 150px; right: 95px; top: 2.5rem; }
div.topology .wifi-zone hr,
div.topology .connection-zone hr { margin-top: 29px; }
div.topology .connection-zone #btn_dial { background: #1890ff; position: absolute; top: -10px; width: 90px; margin-left: -45px ; left: 50% ; border: none; color: white; border-radius: 20px; cursor: pointer; }
div.topology .connection-zone #wan_connection_icon { position: absolute; width: 20px; height: 20px; top: 16px; left: 50%; margin-left: -10px; font-size: 20px; background: #fff; }
div.topology .connection-zone #wan_connection_desc { position: absolute; width: 100%; text-align: center; bottom: -3rem; font-size: 1.2rem; }
div.router-status { width: 82rem; margin: 0 auto; }
div.router-status.mini { width: 60rem; }
div.router-status ._item { width: 250px; height: 200px; margin: 0 auto; border: 1px solid #ddd; }
div.router-status .home-connect-tbl { background: transparent; width: 80%; margin: 15px auto 0; }
div.router-status .home-connect-tbl td { border-bottom: 1px solid #ccc; border-left: 0; font-size: 13px; padding: 0.525em; }
div.router-status .home-connect-tbl tr:last-child td { border-bottom: 0 }
div.router-status .current-traffic-title { font-size: 13px; font-weight: bold; /* text-align: center; */ padding-top: 10px; padding-left: 20px; }
div.router-status .echart-element { position: relative; }
div.router-status .echart-element #speed-echart { position: relative; height: 150px; margin-top: 25px; z-index: 10; }
div.router-status .echart-element #speed-up { position: absolute; background: #20c7f2; width: 70px; text-align: center; border-radius: 5px; color: #fff; left: 160px; bottom: 25px; height: 16px; line-height: 16px; font-size: 1.1rem; }
div.router-status .echart-element #speed-down { position: absolute; background: #6757da; width: 70px; text-align: center; border-radius: 5px; color: #fff; left: 160px; bottom: 45px; height: 16px; line-height: 16px; font-size: 1.1rem; }
div.router-status .echart-element .right-border-line { position: absolute; height: 160px; width: 0; border-right: 1px dashed #e9e9e9; top: 0; right: 99px; }
div.router-status .echart-element .top-border-line { position: absolute; height: 0; border-top: 1px dashed #e9e9e9; width: 100%; left: 0; top: 50px; }
div.router-status .echart-element #cpu-occu-rate { text-align: center; position: absolute; width: 100%; top: 50%; font-size: 1.7rem; font-weight: bold; margin-top: -0.7rem; }
div.router-status .echart-element #cpu-echart { height: 200px; }
div.router-status .echart-element .legend-echarts { position: absolute; bottom: 5px; left: 1.8rem; }
div.router-status .echart-element .legend-echarts label { position: relative; display: inline-block; font-size: 1.0rem; padding-left: 1.2rem; margin-right: 1.8rem; }
div.router-status .echart-element .legend-echarts label:before { display: block; background: #6757da; content: ""; width: 10px; height: 10px; position: absolute; left: 0; top: 2px; }
div.router-status .echart-element .legend-echarts label:nth-child(2):before { background: #20c7f2; }
div.router-status .echart-element #cpu-echart+.legend-echarts label:nth-child(1):before { background: #00c13f; }
div.router-status .echart-element #wan_ip_address { margin: 5px; position: absolute; font-size: 1.2rem; font-weight: bold; }

form.login-form-box { position: relative; box-shadow: 0px 0px 25px #999; padding: 80px 70px 40px 70px; background: #fff; max-width: 45.8rem; margin: 0 auto;}
form.login-form-box > .form-group { margin-bottom: 2rem; }
span.remain-tips { font-weight: bold; }
div.lang-box { position: absolute; right: 20px; top: 15px; font-size: 1.2rem; }
div.lang-box a { color: #1890ff; text-decoration: underline; }

.pw-level { margin-top: 0.1em; padding: 0; }
.pw-level li { width: 14.285%; float: left; }
.pw-level li span { display: block; height: 16px; background: #00c13f; border: 1px solid #fff; }
.pw-level.level-0 li span { background: #bcbcbc; }
.pw-level.level-1 li:nth-child(1)~li span { background: #bcbcbc; }
.pw-level.level-2 li:nth-child(2)~li span { background: #bcbcbc; }
.pw-level.level-3 li:nth-child(3)~li span { background: #bcbcbc; }
.pw-level.level-4 li:nth-child(4)~li span { background: #bcbcbc; }
.pw-level.level-5 li:nth-child(5)~li span { background: #bcbcbc; }
.pw-level.level-6 li:nth-child(6)~li span { background: #bcbcbc; }

.curr-time-control .line_form { margin-top: 20px; }
.curr-time-control .form-group { width: 12%; float: left; margin-bottom: 0; }
.curr-time-control .form-group:last-child { width: 28%; }
.curr-time-control .form-group input { padding: 0 0.2rem; }
.curr-time-control .form-group button#edit_current_time { height: 3.7rem; }
.start-time-control .line_form { margin-top: 20px; }
.start-time-control .form-group { width: 33.3333%; float: left; margin-bottom: 0; }

#tbl_contact_filter, #tbl_group_mgt_filter { float: right !important; }
#message_content { width: 100%; height: 12rem; word-wrap: break-word; word-break: break-all; overflow-y: auto; }
#recipients_number { width: 100%; resize:none  }
#sim_not_support_tips { font-size: 1.2rem; }
div.dialog_table_r button,
div.dialog_table_r input[type=button] { margin-right: 0 !important; margin-left: 5px;}
div.dialog_table_r button:last-child,
div.dialog_table_r input[type=button]:last-child { margin-left: 0;}

#search_wifi_list { cursor: pointer; }
#txt-ppoe-status, 
#txt-extender-status { outline: none; border-width: 0 0 1px 0; }
.period-fields > * { width: 23% !important; float: left; }
.period-fields > div { width: 8% !important; }

#engineer-content .page-title { margin: 10px 0;  padding-bottom: 10px; border-bottom: 1px solid #000; font-size: 2rem; }
#status-engineer .page-title { font-size: 2rem; }

tr.schedule-item td,
tr td#parental_new_item_mac { vertical-align: middle !important; }
a.schedule-item-icon:hover { text-decoration: none; }
a.schedule-item-icon .icon-clock { font-size: 24px; cursor: pointer; }
div#schedule_list .schedule-item { border: 1px dotted #ddd; padding: 10px; font-size: 1.3rem; }
div#schedule_list .schedule-item .time-select { width: 5rem; }
div#schedule_list .circle-weekday { user-select: none; display: inline-block; }
div#schedule_list .circle-weekday span { display: inline-block; padding: 2px; border: 1px dotted #888; cursor: pointer; margin: 1px; margin-right: 3px; text-align: center; min-width: 4rem;}
div#schedule_list .circle-weekday span.selected { background: #00c13f; border: 1px solid #00c13f; color:#fff;}


div#location-content #location_echart_bar { width: 500px;height:400px; margin: 0 auto; }
div#location-content .best-pos-header { text-align: center;font-size:24px;font-weight:bold }
div#location-content  #list-info-position { border: 1px solid #cccccc; padding-bottom: 12px; border-radius: 8px; padding: 0; }
div#location-content .li-position { border-bottom: 1px solid #cccccc; }
div#location-content .score { float: right; height: 6em; line-height: 6em; vertical-align: middle; padding-right: 12px; }
div#location-content .left { float: left; padding-left: 12px; }
div#location-content .left div { padding-top: 6px; }
div#location-content #list-info-position li.title { height: 2em; background-color: #eeeeee; line-height: 2em; font-size: 16px; vertical-align: middle; padding:0 12px; border-radius: 8px 8px 0 0; }
div#location-content #clear-position { float: right; color: blue; padding-right: 12px; }
div#location-content .star-item { display: inline-block; width: 20px; height: 20px; vertical-align: bottom; cursor: pointer; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAoCAMAAADJ7yrpAAAAYFBMVEUAAAD92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92Un92UmCTPEWAAAAH3RSTlMA9iwe++hAgPLJo13i3Td8JO3Sk4xtYkYUC76cVBIjGgBFCwAAAMtJREFUKM+1kUkOhCAQRUEFBHGep67737JRlEFNJ73wbyAv9WtRD/1O3z/AqrqzDqC7spEAkPECGagwlwRJE28wbpJAk5xjcIJ5rmBBwAsp9nLpsvJYkMWWxRk6QrHZSJFJesIU2UQnjCwLwSQ0kG4zQmzzdmcCuA5VocaQGNiyQX8G1qK/8q6jNH1wtCx3RxwhfnUkM3Vs6ToSdNUDK52NI6JL+4R1JD/HYaXriOsP9xxN+p08R0JV1ZlnzxELRBSJIPccSe1IvufoCxGAFoLwSVOBAAAAAElFTkSuQmCC') center top no-repeat; }
div#location-content .unchecked { background-position: center bottom; }
div#location-content #location_name { background: none repeat scroll 0 0 #fff; border: 1px solid #E0E0E0; padding: 0 8px; width: 100%; font-size: 14px; border-radius: 5px; outline: none; height: 32px; }


div#diagnosis-content .diagnosis-items .pull-right { font-size: 1.2rem; color: #ccc; }
div#diagnosis-content .diagnosis-items .line { height: 3.5rem; line-height: 3.5rem; }
div#diagnosis-content .diagnosis-items .wrap-line { border-bottom: 1px solid #e1e1e1; }
div#diagnosis-content #wifi_status_area.wrap-line { border-top: 1px solid #e1e1e1; }
div#diagnosis-content .detect-item-info { margin-left: 50px; line-height: 26px; font-size: 1.2rem; }
div#diagnosis-content .running-circle { animation: rotate-circle 2s infinite linear; }
div#diagnosis-content .diagnosis-items .icon-right { color: #00c13f; font-size: 2rem; }
div#diagnosis-content .diagnosis-items .icon-wrong { color: red; font-size: 2rem; }
div#diagnosis-content .diagnosis-tips { font-size: 1.2rem; text-align: center; width: 170px; margin-top: 30px; }
#diag-status { position: relative; width: 170px; }
#diag-status .state-graphic { width: 100%; height: 170px; border-radius: 75px; }
#diag-status .state-txt, #diag-status .state-score { position: absolute; width: 100%; top: 75px; text-align: center; font-size: 1.5rem; z-index: 1; }
#diag-status .state-score { font-size: 1.3rem; display: none; top: 65px; }
#diag-status .state-score .s-value { font-size: 3.5rem; }
#diag-status.state-well .state-graphic { background: #00c13f; }
#diag-status.state-well .state-txt, #diag-status.state-well .state-score { color: #00c13f }
#diag-status.state-warn .state-graphic { background: #FFCC33; }
#diag-status.state-warn .state-txt, #diag-status.state-warn .state-score { color: #FFCC33 }
#diag-status.state-bad .state-graphic { background: red; }
#diag-status.state-bad .state-txt, #diag-status.state-bad .state-score { color: red }

#vpn-content .vpn-table { min-width: 600px; }
#vpn-content .vpn-table td>input[type=text], 
#vpn-content .vpn-table td>select { height: 2.5rem; line-height: 2.5rem; width: 100%; }
#vpn-content .vpn-table thead { font-size: 1.3rem; }
#vpn-content .vpn-table .vpn-operating { word-break: normal; }
#vpn-content #connect_item_name,
#vpn-content #vpn_connect_status { border-width: 0 0 1px 0; outline: none; }
#vpn-content #add_vpn_protocol_type { -webkit-appearance: menulist-button;  /* safari浏览器 */ }

.phonebook-modal input[type="text"], 
.phonebook-modal select {
  height: 3.7rem !important;
  line-height: normal !important;
  -webkit-appearance: menulist-button;  /* safari浏览器 */ 
}

textarea[name=ping_result] { height: 20rem; }

.steps-controls .wizard-fileds > div { float: left; margin-right: 1rem;}
.steps-controls .divider { border-bottom: 1px solid #eee; margin-top: 17px; width: 100px;}
.steps-controls .divider.activied { border-color: #00c13f; }
.steps-controls .circle-icon { display:inline-block; width: 32px; height: 32px; line-height: 32px; text-align: center; border-radius: 50%; border: 1px solid #ccc; background: #ccc; font-family: 'Microsoft Yahei'; margin-right: 10px;}
.steps-controls .steps-item.activied .circle-icon { background: #00c13f; border-color: #00c13f; color: #fff; font-size: 16px; }

table.custom-notify-table th,
table.xmpp-server-table th { line-height: 32px !important; }

.group-new-item { word-break: break-all; word-wrap: break-word; }
table#sms_list_table { border-collapse: collapse; }

#logo > img {
  display: block;
  max-width: 130px;
  margin-top: 5px;
  width: auto;
  height: auto;
}

/* 子页面样式  --------------------------------- end --------------------------------- */



@media screen and (max-width:767px){
  #easyDialogBox .dialog-modal { width: 30rem; padding: 1rem; }
  #default-tips { font-size: 1.2rem; }
  #sms-content .aside-nav { margin-top: 0 }
  nav.top-menu .menu-item div.text { display:none }
  nav.top-menu .menu-item a { padding-bottom: 5px; }
  nav.top-menu li.menu-item .icon { font-size: 1.35em; }
  div.main-content { margin-top: 15px; font-size: .8em; padding: 2rem 1rem; }
  div.main-content header.content-header { padding-top: 0; }
  form.customform { padding: 0 1rem; }
  form.customform label.name { font-size: 1.2em; padding-left: 0; }
  .p-xs-0, .pl-xs-0 { padding-left: 0 !important; }
  .p-xs-0, .pr-xs-0 { padding-right: 0 !important; }
  .pt-xs-3,.py-xs-3,.p-xs-3 { padding-top:1rem!important }
  .pb-xs-3,.py-xs-3,.p-xs-3 { padding-bottom:1rem!important }
  .pr-xs-3,.px-xs-3,.p-xs-3 { padding-right:1rem!important }
  .pl-xs-3,.px-xs-3,.p-xs-3 { padding-left:1rem!important }
  .inline-xs-box { display: inline-block; }
  .customform fieldset { padding: 0 10px;}
  .module-zone .app-modules { cursor: pointer; height: 10rem; padding-left: 4rem; }
  .module-zone .icon { width: 4rem; height: 4rem; border-radius: 5px; margin-left: -4rem;  line-height: 4rem; }
  .module-zone .icon span.iconfont { font-size: 24px; }
  .module-zone .text { padding-right: .5rem; }
  .module-zone p { margin-bottom: .5rem; line-height: 1.6rem;}
  .easyDialog_wrapper .easyDialog_text { padding: .5rem 1rem; }
  .nav-tabs[role='tablist']>li>a { padding: 10px 5px; }
  .table-responsive { border: none; padding-right: 2px;}
  .table-responsive #parental-table { border: 1px solid #ddd; }
  div#diag-status { margin: 0 auto; }
}

@media screen and (min-width:768px){
  #easyDialogBox .dialog-modal.larger-width { width: 43.5rem; }
  #conn-content { font-size:.9em; filter:alpha(opacity=95); -moz-opacity:.95; -khtml-opacity:.95; opacity:.95 }
  #p_note { padding-left:2em; margin-bottom:.4em }
  .customform fieldset { margin-left: -1.5rem; margin-right: -1.5rem; margin-bottom:1.6em; font-size:1em;}
  .customform fieldset > div{ margin-left: 1.5rem;margin-right: 1.5rem }
  .customform legend { margin-left: 1.5rem; }
  .regularStyle { display:block; line-height:18px }
  .main-content-section { margin-top: 3rem; }
}

@keyframes rotate-circle {
  0% {
    transform: rotate(0deg)
  }
  100% {
    transform: rotate(360deg)
  }
}