ZZDianXin_UI - 郑州电信 演示

index.css 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867
  1. @font-face {
  2. font-family: 'iconfont';
  3. src: url('../fonts/iconfont.eot');
  4. /* IE9*/
  5. src: url('../fonts/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  6. url('../fonts/iconfont.woff') format('woff'), /* chrome、firefox */
  7. url('../fonts/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  8. url('../fonts/iconfont.svg#iconfont') format('svg');
  9. /* iOS 4.1- */
  10. }
  11. body {
  12. font-family: "微软雅黑";
  13. }
  14. .ldtp-con {
  15. display: block;
  16. }
  17. .ld-sercon select {
  18. height: auto;
  19. }
  20. ul li {
  21. list-style: none;
  22. overflow: hidden;
  23. }
  24. .iconfont {
  25. font-family: "iconfont";
  26. font-style: normal;
  27. color: #FFFFFF;
  28. }
  29. .fr {
  30. float: right;
  31. }
  32. .fl {
  33. float: left;
  34. }
  35. .size-12 {
  36. font-size: 12px;
  37. }
  38. .title-box {
  39. margin-top: 5px;
  40. }
  41. .title-box li {
  42. margin-left: 30px;
  43. }
  44. .title-box li:hover {
  45. cursor: pointer;
  46. }
  47. .HoverColor {
  48. color: #f8ac59;
  49. }
  50. .FailureColor {
  51. color: #f95f5e;
  52. }
  53. .navbar-header {
  54. width: 100%;
  55. background-color: #2f4050;
  56. padding-top: 10px;
  57. }
  58. .title-box li p {
  59. color: #FFFFFF;
  60. font-size: 14px;
  61. font-weight: bold;
  62. letter-spacing: 2px;
  63. margin-top: 5px;
  64. }
  65. .size-14 {
  66. font-size: 14px;
  67. color: #FFFFFF !important;
  68. }
  69. .img-circle {
  70. width: 58px;
  71. }
  72. .xian {
  73. border: 1px solid #FFFFFF;
  74. display: inline-block;
  75. width: 15%;
  76. margin: 5px;
  77. }
  78. .ss {
  79. margin-left: 20px;
  80. }
  81. .fe-3 {
  82. font-size: 3em;
  83. }
  84. .title-box p {
  85. text-align: center;
  86. }
  87. .closed {
  88. display: inline-block;
  89. /* margin-left: 5%;*/
  90. cursor: pointer;
  91. color: #FFFFFF;
  92. float: right;
  93. margin-right: 5%;
  94. width: 25%;
  95. }
  96. .closed div {
  97. overflow: hidden;
  98. }
  99. .closed ul {
  100. margin-bottom: 0px;
  101. }
  102. .closed li {
  103. float: left;
  104. margin-right: 20px;
  105. }
  106. .closed i {
  107. display: inline-block;
  108. background: url(../img/chilun.png) no-repeat;
  109. margin-right: 5px;
  110. width: 14px;
  111. height: 16px;
  112. vertical-align: middle;
  113. }
  114. .ga {
  115. background-position: 0 0 !important;
  116. }
  117. .sz {
  118. background-position: 0 -15px !important;
  119. }
  120. .tc {
  121. background-position: 0 -33px !important;
  122. }
  123. .zhuangtai {
  124. display: block;
  125. width: 30%;
  126. margin-left: 10px;
  127. font-size: 14px;
  128. font-weight: 800;
  129. }
  130. .wq {
  131. color: #f95f5e;
  132. }
  133. #top-search li:hover {
  134. color: #eaeaea;
  135. }
  136. .content-tabs1 ul {
  137. padding-left: 0;
  138. }
  139. .content-tabs1 li {
  140. list-style: none;
  141. float: left;
  142. height: 5px;
  143. }
  144. .top1 {
  145. background-color: #68adfe;
  146. }
  147. .top2 {
  148. background-color: #9897f0;
  149. }
  150. .top3 {
  151. background-color: #87eebf;
  152. }
  153. .top4 {
  154. background-color: #68b0fe;
  155. }
  156. .top5 {
  157. background-color: #f95a83;
  158. }
  159. .top6 {
  160. background-color: #eb76dd;
  161. }
  162. .top7 {
  163. background-color: #69cbd0;
  164. }
  165. .top8 {
  166. background-color: #69cbd0;
  167. }
  168. .top9 {
  169. background-color: #aaf58d;
  170. }
  171. .top10 {
  172. background-color: #f76a53;
  173. }
  174. .top11 {
  175. background-color: #eb76dd;
  176. }
  177. .top12 {
  178. background-color: #6c77da;
  179. }
  180. .top13 {
  181. background: -webkit-linear-gradient(left, #f073db, #65abfc);
  182. background: -moz-linear-gradient(left, #f073db, #65abfc);
  183. background: -o-linear-gradient(left, #f073db, #65abfc);
  184. background: -webkit-gradient(linear, 100% 0, 0 0, from(#65abfc), to(#f073db));
  185. background: linear-gradient(left, #f073db, #65abfc);
  186. /* Opera 11.1 - 12.0 */
  187. /* Firefox 3.6 - 15 */
  188. /* 标准的语法 */
  189. }
  190. .zts {
  191. height: 30px;
  192. margin-left: 2%;
  193. line-height: 30px;
  194. padding-top: 15px;
  195. }
  196. .zts li {
  197. height: 20px;
  198. line-height: 20px;
  199. font-weight: bold;
  200. letter-spacing: 2px;
  201. }
  202. .quan {
  203. width: 15px;
  204. height: 15px !important;
  205. border-radius: 50%;
  206. margin-right: 2%;
  207. margin-left: 5px;
  208. margin-top: 2px;
  209. }
  210. .lx {
  211. background: #6a6d69;
  212. }
  213. .br {
  214. background: red;
  215. }
  216. .bl {
  217. background: #7ab85b;
  218. }
  219. .LH {
  220. line-height: 35px;
  221. }
  222. .zts span {
  223. line-height: 20px;
  224. margin-right: 50px;
  225. font-size: 12px;
  226. }
  227. .photo {
  228. width: 40px;
  229. height: 40px;
  230. border-width: 2px;
  231. border-style: solid;
  232. border-radius: 50%;
  233. border-color: #ffb400 #fc3c04 #fdfc01 #00e3c0;
  234. margin-bottom: 1px;
  235. }
  236. .photo img {
  237. display: block;
  238. width: 100%;
  239. height: 100%;
  240. }
  241. .ls {
  242. /*margin-left: 20px;*/
  243. text-align: center;
  244. }
  245. .ls span {
  246. margin-right: 10px;
  247. }
  248. .min-right {
  249. margin-right: 10px;
  250. }
  251. .navbar-top-links i {
  252. width: 24px;
  253. height: 21px;
  254. display: block;
  255. background: url(../img/topIcon.png) no-repeat;
  256. background-position: center center;
  257. margin: 0 auto;
  258. }
  259. /*挂断*/
  260. .DropCall {
  261. background-position: 0px 0 !important;
  262. }
  263. /*外呼*/
  264. .MakeCall {
  265. background-position: 0px -20px !important;
  266. }
  267. /*置忙*/
  268. .SayBusy {
  269. background-position: 0px -42px !important;
  270. }
  271. /*置闲*/
  272. .SayFree {
  273. background-position: 0px -65px !important;
  274. }
  275. /*多方通话*/
  276. .Meeting {
  277. background-position: 0px -85px !important;
  278. }
  279. /*转移*/
  280. .Transfer {
  281. background-position: 0px -108px !important;
  282. }
  283. /*保持*/
  284. .Hold {
  285. background-position: 0px -131px !important;
  286. }
  287. /*接回*/
  288. .Retrieve {
  289. background-position: 0px -153px !important;
  290. }
  291. /*签入*/
  292. .Login {
  293. background-position: 0px -197px !important;
  294. }
  295. /*签出*/
  296. .Logout {
  297. background-position: 0px -175px !important;
  298. }
  299. .navbar-top-links .active {
  300. background-position-x: -23px !important;
  301. }
  302. .ldcr-bottom .detail-con ul li .active a {
  303. color: #f95a83 !important;
  304. }
  305. .ldcr-bottom .detail-con ul li .active em {
  306. color: #f95a83 !important;
  307. }
  308. .ldcr-bottom .detail-con ul li .active+.explancon {
  309. display: block !important;
  310. }
  311. .searchbtn {
  312. width: 2.5em;
  313. height: 24px;
  314. border-radius: 5px;
  315. position: absolute;
  316. background-color: #f8ac59;
  317. background-image: url(../img/searIcon.png);
  318. background-repeat: no-repeat;
  319. background-position: center center;
  320. cursor: pointer;
  321. }
  322. .max-box {
  323. height: 42px;
  324. width: 100%;
  325. }
  326. .laydate_body .laydate_bottom,
  327. .laydate_body .laydate_top {
  328. height: 31px !important;
  329. }
  330. .laydate_body .laydate_y .laydate_yms ul li {
  331. width: 59px !important;
  332. }
  333. .col-sm-1 {
  334. padding-right: 0;
  335. line-height: 34px;
  336. }
  337. ul.ztree {
  338. overflow-y: scroll;
  339. overflow-x: auto;
  340. }
  341. .minBacha {
  342. position: absolute;
  343. top: 0;
  344. right: 80px;
  345. z-index: 10;
  346. overflow: hidden;
  347. }
  348. .minBacha>div {
  349. float: left;
  350. height: 35px;
  351. width: 35px;
  352. margin-left: 2px;
  353. }
  354. .minBacha>div a {
  355. display: block;
  356. height: 100%;
  357. width: 100%;
  358. text-align: center;
  359. background-position: center center;
  360. background-color: #2f4050;
  361. opacity: .5;
  362. }
  363. .minBacha>div a:hover {
  364. opacity: 1;
  365. }
  366. .minClosed>a {
  367. background: url("../img/min.png") no-repeat;
  368. }
  369. .Bacha>a {
  370. background: url("../img/gb.png") no-repeat;
  371. }
  372. .lblcount {
  373. position: absolute;
  374. right: 5px;
  375. top: 7px;
  376. }
  377. .first {
  378. z-index: 1000;
  379. }
  380. .khzl {
  381. font-size: 12px;
  382. border: 0;
  383. margin: 35px auto;
  384. color: #fff;
  385. }
  386. .khzl tr {
  387. border: 0;
  388. }
  389. .khzl th {
  390. padding: 5px 8px 5px 0;
  391. text-align: right;
  392. width: 40%;
  393. font-weight: normal;
  394. border: 0;
  395. }
  396. .khzl tbody>tr>td,
  397. .khzl tbody>tr>th {
  398. border: 0;
  399. }
  400. .khzl tbody>tr>td input {
  401. border: 0;
  402. outline: none;
  403. background: #243747;
  404. padding-left: 5px;
  405. width: 100%;
  406. }
  407. .khbtn {
  408. /*background: #97a0a8;*/
  409. color: #1ab394;
  410. font-size: 14px;
  411. vertical-align: middle;
  412. }
  413. .hei-list {
  414. width: 400px;
  415. margin: 0 auto;
  416. }
  417. .heiTop {
  418. height: 35px;
  419. background: #1ab394;
  420. color: #fff;
  421. line-height: 35px;
  422. padding: 0 15px;
  423. border-top-left-radius: 3px;
  424. border-top-right-radius: 3px;
  425. }
  426. .heiTop .htl {
  427. float: left;
  428. margin: 0;
  429. }
  430. .heiTop .bacha {
  431. float: right;
  432. font-size: 18px;
  433. cursor: pointer;
  434. margin: 0;
  435. }
  436. .heiCon {
  437. width: 100%;
  438. background: #fff;
  439. text-align: center;
  440. padding: 25px 15px;
  441. height: auto;
  442. overflow-y: auto;
  443. border: 1px solid #eee;
  444. }
  445. #time-word {
  446. border: 1px solid #1ab394;
  447. padding: 5px 0 5px 10px;
  448. width: 120px;
  449. outline: none;
  450. color: #000;
  451. }
  452. .chooses {
  453. margin-top: 10px;
  454. }
  455. .btns {
  456. background: #1ab394;
  457. color: #fff;
  458. padding: 3px 10px;
  459. outline: none;
  460. font-size: 12px;
  461. margin-left: 15px;
  462. border: 0;
  463. border-radius: 3px;
  464. box-sizing: border-box;
  465. }
  466. .bianji {
  467. display: inline-block;
  468. height: 16px;
  469. width: 16px;
  470. vertical-align: middle;
  471. margin-right: 5px;
  472. }
  473. .bianji.edi {
  474. background: url(../img/xgai.png) no-repeat;
  475. }
  476. .bianji.sav {
  477. background: url(../img/bbc.png) no-repeat;
  478. }
  479. .bianji.canc {
  480. background: url(../img/quxi.png) no-repeat;
  481. }
  482. .t-shade {
  483. position: fixed;
  484. top: 0;
  485. left: 0;
  486. width: 100%;
  487. height: 100%;
  488. background: rgba(0, 0, 0, 0.48);
  489. z-index: 10004;
  490. display: none;
  491. }
  492. .shade_k {
  493. z-index: 10005;
  494. width: 40%;
  495. margin: 10% auto;
  496. background-color: #fff;
  497. box-shadow: 1px 1px 50px rgba(0, 0, 0, .3);
  498. border-radius: 5px;
  499. }
  500. .shade_title {
  501. padding: 0 80px 0 20px;
  502. height: 42px;
  503. line-height: 42px;
  504. border-bottom: 1px solid #eee;
  505. font-size: 16px;
  506. color: #FFFFFF;
  507. overflow: hidden;
  508. background-color: rgb(26, 179, 148);
  509. border-radius: 2px 2px 0 0;
  510. position: relative;
  511. }
  512. .setwin {
  513. position: absolute;
  514. right: 15px;
  515. top: 5px;
  516. font-size: 20px;
  517. line-height: initial;
  518. }
  519. .setwin a {
  520. font-size: 20px;
  521. color: #fff;
  522. }
  523. .shade_content {
  524. overflow-y: auto;
  525. position: relative;
  526. padding-bottom: 50px;
  527. padding: 10px;
  528. }
  529. .wh_btn {
  530. width: 80%;
  531. text-align: center;
  532. padding-top: 20px;
  533. margin: 0 auto;
  534. margin-bottom: 20px;
  535. }
  536. .wh_btn input {
  537. padding: 7px 20px;
  538. color: #FFF;
  539. border-radius: 5px;
  540. margin-right: 30px;
  541. border: 1px solid #999;
  542. border-color: rgb(26, 179, 148);
  543. }
  544. .sc_btn {
  545. color: rgb(255, 255, 255);
  546. font-size: 12px;
  547. margin-left: 15px;
  548. box-sizing: border-box;
  549. background: rgb(26, 179, 148);
  550. padding: 6px 10px;
  551. outline: none;
  552. border-width: 0px;
  553. border-style: initial;
  554. border-color: initial;
  555. border-image: initial;
  556. border-radius: 3px;
  557. }
  558. .sc_btn:hover {
  559. color: #fff !important;
  560. }
  561. .cx {
  562. display: block;
  563. }
  564. .phoneBZ {
  565. display: inline-block;
  566. height: 15px;
  567. width: 15px;
  568. position: absolute;
  569. right: 0px;
  570. bottom: -15px;
  571. background: url(../img/phoneBZ.png) no-repeat;
  572. display: none;
  573. }
  574. #menuContent {
  575. background: #fff;
  576. position: absolute;
  577. width: 100%;
  578. border: 1px solid darkgrey;
  579. right: 0;
  580. top: 21px;
  581. z-index: 10;
  582. /* display: none;*/
  583. overflow-y: auto;
  584. }
  585. #organizer {
  586. height: 25px;
  587. width: 128px;
  588. display: inline-block;
  589. position: relative;
  590. }
  591. #treeDemo li {
  592. width: 100%;
  593. }
  594. .bootstrap-select>.dropdown-toggle.bs-placeholder {
  595. background-color: #ffffff !important;
  596. border-color: #e5e6e7 !important;
  597. }
  598. .filter-option {
  599. color: #676b6d;
  600. }
  601. .bootstrap-select>.dropdown-toggle.btn-default {
  602. background-color: #ffffff !important;
  603. border-color: #e5e6e7 !important;
  604. color: #555;
  605. }
  606. #fkdep_market {
  607. display: nones;
  608. }
  609. .roll-right.J_tabRight {
  610. right: 0;
  611. }
  612. /*软电话*/
  613. .open-softphone{
  614. position: fixed;
  615. bottom: 70px;
  616. right: 40px;
  617. width: 30px;
  618. height: 30px;
  619. }
  620. .open-softphone img{
  621. width: 100%;
  622. height: 100%;
  623. }
  624. .open-softphone i{
  625. font-size:24px
  626. }
  627. .softphone-box{
  628. display: none;
  629. position: fixed;
  630. bottom: 70px;
  631. right: 100px;
  632. width: 270px;
  633. height: 435px;
  634. background:linear-gradient(to bottom,#6a95cb,#1f4379);
  635. box-shadow: 3px 3px 1px #888888;
  636. }
  637. .phone_tooltip{
  638. width: 88%;
  639. height: 20%;
  640. background: #FFFFFF;
  641. margin: 8% auto;
  642. border-radius:8%;
  643. padding: 3% 5%;
  644. }
  645. .phone_tooltip p{
  646. margin: 0;
  647. padding: 1% 0;
  648. }
  649. .phone_btn_div{
  650. width: 100%;
  651. height: 8%;
  652. }
  653. .phone_btn_div ul{
  654. overflow: hidden;
  655. height: 100%;
  656. }
  657. .phone_btn_div ul li{
  658. cursor: pointer;
  659. width: 25%;
  660. margin-left: 6%;
  661. height: 100%;
  662. text-align: center;
  663. padding: 3% 0;
  664. font-size: 13px;
  665. border-radius: 5%;
  666. background: #FFFFFF;
  667. float: left;
  668. }
  669. .phoneNum_box ul{
  670. overflow: hidden;
  671. }
  672. .phoneNum_box ul li{
  673. cursor: pointer;
  674. font-size: 28px;
  675. width: 25%;
  676. margin-left: 6%;
  677. height: 100%;
  678. text-align: center;
  679. padding: 3% 0;
  680. border-radius: 5%;
  681. float: left;
  682. color: #FFFFFF;
  683. }
  684. .phone_btn_bot{
  685. position: relative;
  686. }
  687. .phone_btn_bot .posbtn1{
  688. position: absolute;
  689. left:10%;
  690. cursor: pointer;
  691. }
  692. .phone_btn_bot .posbtn2{
  693. position: absolute;
  694. left: 50%;
  695. font-size: 15px;
  696. margin-left: -18px;
  697. color: #FFFFFF;
  698. padding: 3% 0;
  699. cursor: pointer;
  700. }
  701. .phone_btn_bot .posbtn3{
  702. position: absolute;
  703. right: 10%;
  704. cursor: pointer;
  705. }
  706. .phTooltipResult{
  707. width: 100%;
  708. border: none;
  709. outline: none;
  710. height: 65%;
  711. background: #CCCCCC;
  712. line-height: 30px;
  713. padding-left: 15px;
  714. }