signin.css 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414
  1. body {
  2. line-height: 1.6;
  3. font-family: "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei",
  4. "\9ED1\4F53", Arial, sans-serif;
  5. color: #222;
  6. font-size: 14px;
  7. }
  8. /* #top, #header, #footer, #banner{
  9. min-width: 1170px;
  10. }
  11. #top>.container, #header>.container, #footer>.container, #banner>.container {
  12. width: 1170px;
  13. margin: 0 auto;
  14. padding: 0 15px;
  15. } */
  16. h1,h2,h3 {
  17. font-size: 20px;
  18. font-weight: 400;
  19. font-style: normal;
  20. }
  21. @media ( min-width : 1200px) {
  22. .container {
  23. width: 990px;
  24. }
  25. }
  26. .f16 {
  27. font-size: 16px;
  28. }
  29. .f18 {
  30. font-size: 18px;
  31. }
  32. .has-feedback-left {
  33. position: relative;
  34. }
  35. .form-control-feedback-left {
  36. position: absolute;
  37. top: 0;
  38. left: 0;
  39. z-index: 2;
  40. display: block;
  41. width: 30px;
  42. height: 34px;
  43. line-height: 2.3;
  44. text-align: center;
  45. pointer-events: none;
  46. color: #bbb;
  47. font-size: 16px;
  48. }
  49. .has-feedback-left>.form-control {
  50. padding-left: 30px;
  51. }
  52. .btn-inverse {
  53. color: #fff;
  54. background-color: #44b549;
  55. background-image: -moz-linear-gradient(top, #44b549 0, #44b549 100%);
  56. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#44b549),
  57. to(#44b549));
  58. background-image: -webkit-linear-gradient(top, #44b549 0, #44b549 100%);
  59. background-image: -o-linear-gradient(top, #44b549 0, #44b549 100%);
  60. background-image: linear-gradient(to bottom, #44b549 0, #44b549 100%);
  61. border-color: #44b549;
  62. width: 120px;
  63. }
  64. .btn-inverse:hover,.btn-inverse:focus,.btn-inverse:active {
  65. background-color: #2f9833;
  66. background-image: -moz-linear-gradient(top, #2f9833 0, #2f9833 100%);
  67. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2f9833),
  68. to(#2f9833));
  69. background-image: -webkit-linear-gradient(top, #2f9833 0, #2f9833 100%);
  70. background-image: -o-linear-gradient(top, #2f9833 0, #2f9833 100%);
  71. background-image: linear-gradient(to bottom, #2f9833 0, #2f9833 100%);
  72. border-color: #2f9833;
  73. color: #fff;
  74. }
  75. .btn.btn-shadow {
  76. padding: 6px 18px 8px;
  77. }
  78. .btn-primary.btn-shadow {
  79. -webkit-box-shadow: inset 0 -4px 0 #2a6496;
  80. box-shadow: inset 0 -4px 0 #2a6496;
  81. border: 0;
  82. color: #fff;
  83. }
  84. .form-control {
  85. border-color: #e0e0e0;
  86. }
  87. .headerline {
  88. border-top: 1px solid #ddd;
  89. position: relative;
  90. font-size: 24px;
  91. font-weight: 500;
  92. line-height: 22px;
  93. margin: 25px 0 25px -15px;
  94. clear: both;
  95. zoom: 1;
  96. }
  97. .headerline .content {
  98. position: absolute;
  99. top: -14px;
  100. line-height: 24px;
  101. background: #fff;
  102. color: #000;
  103. font-weight: 500;
  104. z-index: 2;
  105. }
  106. .headerline .content.left {
  107. padding: 0 15px 0 10px;
  108. left: 0
  109. }
  110. .headerline .content.right {
  111. padding: 0 0 0 15px;
  112. top: -16px;
  113. right: 0
  114. }
  115. .loading {
  116. display: none;
  117. position: absolute;
  118. width: 100%;
  119. height: 100%;
  120. bottom: 0;
  121. left: 0;
  122. }
  123. .loading.in {
  124. display: block;
  125. }
  126. .loading.in>i {
  127. position: absolute;
  128. top: 50%;
  129. left: 50%;
  130. margin: -33px 0 0 -33px;
  131. background: url("../img/all/loading.gif") no-repeat center center;
  132. width: 66px;
  133. height: 66px;
  134. }
  135. [ng-click] {
  136. cursor: pointer;
  137. }
  138. /*brower-tip*/
  139. #brower-tip {
  140. height: 31px;
  141. line-height: 31px;
  142. background: #ffffe1;
  143. border-bottom: 1px solid #eed8a6;
  144. }
  145. #brower-tip .btn {
  146. margin-left: 5px;
  147. }
  148. /*header*/
  149. #top {
  150. border-top: 4px solid #44b549;
  151. border-bottom: 1px solid #d9dadc;
  152. }
  153. #top .navbar-header .navbar-brand {
  154. height: 50px;
  155. line-height: 50px;
  156. }
  157. #top .navbar-header .title {
  158. background: url("../img/logo/uas_gray.png") no-repeat center center;
  159. width: 87px;
  160. height: 50px;
  161. }
  162. #top .navbar-header b {
  163. display: block;
  164. width: 1px;
  165. height: 18px;
  166. margin: 18px 10px 0 11px;
  167. z-index: 100;
  168. float: left;
  169. background: #ccc;
  170. }
  171. .navbar-header span {
  172. float: left;
  173. height: 50px;
  174. line-height: 50px;
  175. font-size: 20px;
  176. color: #666;
  177. }
  178. /*main*/
  179. #banner {
  180. background: url("../img/bg/bg_signin_2.jpg") no-repeat center center;
  181. background-color: #000;
  182. }
  183. #banner>.container {
  184. height: 460px;
  185. position: relative;
  186. }
  187. #en-info {
  188. position: absolute;
  189. top: 100px;
  190. left: 0;
  191. color: #fff;
  192. letter-spacing: 2px;
  193. }
  194. #login-wrap {
  195. position: relative;
  196. width: 386px;
  197. margin-top: 25px;
  198. padding: 25px 35px 20px;
  199. border-radius: 2px;
  200. -moz-border-radius: 2px;
  201. -webkit-border-radius: 2px;
  202. box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  203. -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  204. -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  205. background-color: #fff;
  206. }
  207. #login-wrap-mobile {
  208. width: 100%;
  209. padding: 25px 15px 20px;
  210. border-radius: 2px;
  211. -moz-border-radius: 2px;
  212. -webkit-border-radius: 2px;
  213. background-color: #fff;
  214. }
  215. #code-wrap {
  216. position: absolute;
  217. top: 25px;
  218. left: 50%;
  219. margin-left: 490px;
  220. padding: 16px;
  221. background-color: #fff;
  222. border-radius: 2px;
  223. -moz-border-radius: 2px;
  224. -webkit-border-radius: 2px;
  225. box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  226. -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  227. -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  228. text-align: center;
  229. color: #717375;
  230. font-size: 12px;
  231. -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  232. -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  233. }
  234. #note {
  235. background-color: #e5e5e5;
  236. height: 32px;
  237. line-height: 32px;
  238. color: #666;
  239. }
  240. #note ul {
  241. overflow: hidden;
  242. position: relative;
  243. }
  244. #note ul li:not(:first-child){
  245. margin-left:30px;
  246. }
  247. #note i {
  248. display: inline-block;
  249. font-weight: 400;
  250. font-style: normal;
  251. vertical-align: middle;
  252. margin-top: -0.2em;
  253. margin-right: 3px;
  254. color: #999;
  255. }
  256. #note a {
  257. width: auto;
  258. overflow: hidden;
  259. text-overflow: ellipsis;
  260. white-space: nowrap;
  261. word-wrap: normal;
  262. max-width: 22em;
  263. color: #666;
  264. }
  265. #note a:hover {
  266. color: #428bca;
  267. text-decoration: none;
  268. }
  269. #note .extra {
  270. position: absolute;
  271. right: 16px;
  272. top: 0;
  273. }
  274. .new {
  275. background: url("../img/icon/new.jpg") no-repeat;
  276. width: 22px;
  277. height: 8px;
  278. vertical-align: middle;
  279. display: inline-block;
  280. margin-left: 6px;
  281. }
  282. #ad-info {
  283. margin-top: 48px;
  284. margin-bottom: 100px;
  285. }
  286. #ad-info .guide-list .item {
  287. border: 1px solid #e5e5e5;
  288. padding: 15px 25px;
  289. margin-bottom: 20px;
  290. height: 160px;
  291. }
  292. #ad-info .guide-list .item:hover {
  293. border-color: #44b549;
  294. }
  295. #ad-info p {
  296. color: #666;
  297. }
  298. /*footer*/
  299. #footer {
  300. color: #f1f1f1;
  301. background-color: #b8b9b9;
  302. padding: 20px 0;
  303. font-size: 12px;
  304. }
  305. #footer a {
  306. color: #f1f1f1;
  307. }
  308. #footer ul {
  309. margin: 0;
  310. }
  311. #footer .list-inline>li:not(:last-child):after {
  312. margin-left: 15px;
  313. content: "|"
  314. }
  315. /*app-bar*/
  316. #app-bar {
  317. position: fixed;
  318. bottom: 0;
  319. left: 0;
  320. right: 0;
  321. height: 45px;
  322. background: rgba(0, 0, 0, .5);
  323. color: #fff;
  324. z-index: 10001;
  325. font-size: 12px;
  326. font-family: "Microsoft Yahei";
  327. }
  328. #app-bar .app-logo {
  329. float: left;
  330. width: 29px;
  331. height: 29px;
  332. margin: 8px 0 0 15px;
  333. }
  334. #app-bar .app-text {
  335. float: left;
  336. padding: 7px 0 0 8px;
  337. line-height: 16px;
  338. }
  339. #app-bar .app-text h2 {
  340. font-weight: normal;
  341. font-size: 15px;
  342. margin-top: 0px;
  343. margin-bottom: 0px;
  344. }
  345. #app-bar .app-close {
  346. float: right;
  347. width: 12px;
  348. height: 12px;
  349. background: url(../img/mobile/app_close.png) no-repeat;
  350. background-size: 100%;
  351. margin: 16px 15px 0 0;
  352. }
  353. #app-bar .app-btn {
  354. float: right;
  355. background-color: #4998E7;
  356. border-radius: 3px;
  357. height: 32px;
  358. padding: 0px 6px;
  359. line-height: 32px;
  360. margin: 6px 18px 0 0;
  361. color: #FFF;
  362. }
  363. @keyframes spin {
  364. 0% { transform: rotate(360deg); }
  365. 100% { transform: rotate(0deg); }
  366. }
  367. .loading>.wrap { width: 64px; height: 64px; position: absolute;left: 50%;top:50%;margin-left:-32px;margin-top: -32px; }
  368. .outer {
  369. background-repeat: no-repeat;
  370. background-size:100%; position: absolute; width: 100%; height: 100%; background-image: url("../img/all/loading.png"); animation: spin 800ms infinite linear; }