Kagera Web Interface
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

style.css 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576
  1. a {
  2. color : #868686;
  3. text-decoration : none;
  4. }
  5. abbr {
  6. border-bottom : 1px dotted #666;
  7. cursor : help;
  8. font-variant : normal;
  9. }
  10. body {
  11. background-attachment : fixed;
  12. background-image : url('images/bg.png');
  13. color : #868686;
  14. font-family : Arial;
  15. padding-top : 25px;
  16. }
  17. button, input[type=button], input[type=reset], input[type=submit] {
  18. background : transparent url('images/button.png');
  19. border : 0px;
  20. color : #DDDDDD;
  21. height : 31px;
  22. text-shadow : #000000 1px 1px;
  23. width : 104px;
  24. }
  25. button:hover, input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover {
  26. background-position : center;
  27. }
  28. button:active, input[type=button]:active, input[type=reset]:active, input[type=submit]:active {
  29. background-position : bottom;
  30. }
  31. h1 {
  32. border-bottom : 1px solid #C9C9C9;
  33. color : #C9C9C9;
  34. font-family : "trebuchet ms";
  35. font-size : 20px;
  36. font-weight : bold;
  37. margin : 2px 0px 15px 0px;
  38. text-shadow : 1px 1px #000000;
  39. }
  40. h2 {
  41. border-bottom : 1px solid #C9C9C9;
  42. color : #C9C9C9;
  43. font-family : "trebuchet ms";
  44. font-size : 20px;
  45. font-weight : bold;
  46. margin : 35px 0px 15px 0px;
  47. text-shadow : 1px 1px #000000;
  48. }
  49. hr {
  50. border-bottom : 1px solid #3F3A3E;
  51. border-left : none;
  52. border-right : none;
  53. border-top : 1px solid #000000;
  54. clear : both;
  55. margin-top : 35px;
  56. }
  57. img {
  58. border : 0px;
  59. }
  60. input[type=checkbox], input[type=radio] {
  61. display : none;
  62. }
  63. input[type=checkbox] + label, input[type=radio] + label {
  64. background-repeat : no-repeat;
  65. background-position : 0 0;
  66. cursor : pointer;
  67. display : inline-block;
  68. font-size : 12px;
  69. height : 15px;
  70. line-height : 15px;
  71. padding-left : 20px;
  72. vertical-align : middle;
  73. }
  74. input[type=checkbox]:checked + label, input[type=radio]:checked + label {
  75. background-position : 0 -15px;
  76. }
  77. input[type=checkbox]:checked + label:hover, input[type=radio]:checked + label:hover {
  78. background-position : 0 -45px;
  79. }
  80. input[type=checkbox] + label:hover, input[type=radio] + label:hover {
  81. background-position : 0 -30px;
  82. }
  83. input[type="checkbox"]:disabled + label, input[type="radio"]:disabled + label {
  84. background-position : 0 -60px;
  85. color : #505050;
  86. cursor : default;
  87. }
  88. input[type=checkbox] + label {
  89. background-image : url('images/checkbox.png');
  90. }
  91. input[type=radio] + label {
  92. background-image : url('images/radiobtn.png');
  93. }
  94. input[type=password], input[type=text] {
  95. background-color : #2B2B2B;
  96. border : 1px solid #191919;
  97. box-shadow : inset 0px 2px 1px #242424, 0 1px 0 #303030;
  98. color : #919191;
  99. font-family : arial;
  100. font-size : 12px;
  101. height : 16px;
  102. margin : -1px 0px -1px 0px;
  103. padding : 0px 3px 0px 3px;
  104. width : 278px;
  105. }
  106. input[type=password]:focus, input[type=text]:focus, input[type=password]:hover, input[type=text]:hover {
  107. background-color : #383838;
  108. box-shadow : inset 0px 2px 1px #292929, 0 1px 0 #303030;
  109. }
  110. input[type=password]:disabled, input[type=text]:disabled {
  111. background-color : #1E1E1E;
  112. box-shadow : inset 0px 2px 1px #1B1B1B, 0 1px 0 #303030;
  113. color : #505050;
  114. }
  115. input.clogout {
  116. background : transparent url('images/clogout.png');
  117. border : 0px;
  118. color : #DDDDDD;
  119. font-family : Arial;
  120. font-size : 12px;
  121. height : 81px;
  122. padding-top : 41px;
  123. text-shadow : #000000 1px 1px;
  124. width : 80px;
  125. }
  126. input.creboot {
  127. background : transparent url('images/creboot.png');
  128. border : 0px;
  129. color : #DDDDDD;
  130. font-family : Arial;
  131. font-size : 12px;
  132. height : 81px;
  133. padding-top : 41px;
  134. text-shadow : #000000 1px 1px;
  135. width : 80px;
  136. }
  137. input.creboot:hover, input.clogout:hover {
  138. background-position : center;
  139. }
  140. input.creboot:active, input.clogout:active {
  141. background-position : bottom;
  142. }
  143. option {
  144. cursor : default;
  145. }
  146. p {
  147. margin-bottom : 10px;
  148. text-align : justify;
  149. }
  150. p a {
  151. border-bottom : 1px dotted #666;
  152. }
  153. pre {
  154. color : #B9B9B9;
  155. font-size : 12px;
  156. margin : 2px 2px 2px 2px;
  157. }
  158. select {
  159. -moz-appearance : none;
  160. -webkit-appearance : none;
  161. appearance : none;
  162. background-color : #2B2B2B;
  163. border : 1px solid #191919;
  164. box-shadow : inset 0px 2px 1px #242424, 0 1px 0 #303030;
  165. color : #919191;
  166. cursor : pointer;
  167. display : inline-block;
  168. font-family : arial;
  169. font-size : 12px;
  170. height : 17px;
  171. margin : -1px 0px -1px 0px;
  172. outline : none;
  173. padding : 0px 3px 0px 0px;
  174. width : 285px;
  175. }
  176. select:hover {
  177. background-color : #383838;
  178. box-shadow : inset 0px 2px 1px #292929, 0 1px 0 #303030;
  179. }
  180. select:disabled {
  181. background-color : #1E1E1E;
  182. box-shadow : inset 0px 2px 1px #1B1B1B, 0 1px 0 #303030;
  183. color : #505050;
  184. cursor : default;
  185. }
  186. small {
  187. font-size : 11px;
  188. }
  189. table {
  190. border-collapse : collapse;
  191. border-spacing : 0px;
  192. }
  193. textarea {
  194. background-color : #2B2B2B;
  195. border : 1px solid #191919;
  196. box-shadow : inset 0px 2px 1px #242424, 0 1px 0 #303030;
  197. color : #919191;
  198. font-size : 12px;
  199. height : 300px;
  200. padding : 2px 2px 2px 2px;
  201. overflow : auto;
  202. resize : vertical;
  203. white-space : pre;
  204. width : 766px;
  205. word-wrap : normal;
  206. }
  207. textarea:focus, textarea:hover {
  208. background-color : #383838;
  209. box-shadow : inset 0px 2px 1px #292929, 0 1px 0 #303030;
  210. }
  211. textarea:disabled, textarea:disabled {
  212. background-color : #1E1E1E;
  213. box-shadow : inset 0px 2px 1px #1B1B1B, 0 1px 0 #303030;
  214. color : #505050;
  215. }
  216. .body {
  217. background-image : url('images/body.png');
  218. clear : both;
  219. float : left;
  220. width : 1006px;
  221. }
  222. .code {
  223. background-color : #1D1D1D;
  224. border : 1px solid #141414;
  225. box-shadow : inset 0px 2px 1px #1B1B1B, 0 1px 0 #303030;
  226. height : 500px;
  227. overflow : auto;
  228. width : 770px;
  229. }
  230. .collapsed {
  231. margin-bottom : 20px;
  232. margin-top : 7px;
  233. overflow : hidden;
  234. height : 40px;
  235. }
  236. .collapsed .navbody a.active {
  237. border-top : none;
  238. margin-top : 0px;
  239. }
  240. .collapsed .navheader {
  241. background-image : url('images/navhead2.png');
  242. background-repeat : no-repeat;
  243. }
  244. #content {
  245. color : #919191;
  246. float : right;
  247. font-family : Arial;
  248. font-size : 14px;
  249. margin-bottom : 7px;
  250. margin-right : 20px;
  251. margin-top : 7px;
  252. padding-left : 7px;
  253. width : 771px;
  254. }
  255. .controls {
  256. float : right;
  257. margin-right : 15px;
  258. margin-top : 17px;
  259. text-align : right;
  260. }
  261. .confdata {
  262. line-height : 18px;
  263. width : 772px;
  264. }
  265. .confdata .name {
  266. background-color : #1D1D1D;
  267. border : 1px solid #141414;
  268. padding : 5px 30px 5px 5px;
  269. width : 40%;
  270. }
  271. .confdata .spacer {
  272. height : 15px;
  273. padding : 5px 5px 5px 5px;
  274. }
  275. .confdata .title {
  276. background-color : #1D1D1D;
  277. border : 1px solid #141414;
  278. color : #C9C9C9;
  279. font-weight : bold;
  280. height : 25px;
  281. text-align : center;
  282. }
  283. .confdata .value {
  284. background-color : #262626;
  285. border : 1px solid #141414;
  286. padding : 5px 5px 5px 5px;
  287. }
  288. #dim {
  289. -moz-opacity : 0.8;
  290. background-color : #000000;
  291. display : none;
  292. filter : alpha(opacity=80);
  293. height : 200%;
  294. left : 0px;
  295. opacity : 0.8;
  296. position : absolute;
  297. top : 0px;
  298. width : 100%;
  299. z-index : 20;
  300. }
  301. .footer {
  302. background-image : url('images/footer.png');
  303. background-repeat : no-repeat;
  304. clear : both;
  305. font-size : 10px;
  306. padding-right : 10px;
  307. padding-top : 7px;
  308. text-align : right;
  309. width : 996px;
  310. }
  311. .formctrl {
  312. text-align : right;
  313. width : 100%;
  314. }
  315. .header {
  316. background-image : url('images/header.png');
  317. height : 107px;
  318. width : 1006px;
  319. }
  320. .hidden {
  321. display : none;
  322. }
  323. .hidden .code {
  324. height : 250px;
  325. }
  326. .loginbox {
  327. background : transparent url('images/loginbox.png') no-repeat;
  328. font-size : 14px;
  329. height : 191px;
  330. left : 50%;
  331. margin : -150px 0px 0px -224px;
  332. padding : 22px 0px 0px 25px;
  333. position : absolute;
  334. top : 50%;
  335. width : 448px;
  336. }
  337. .loginbox input[type=password], .loginbox input[type=text] {
  338. margin-bottom : 12px;
  339. float : left;
  340. width : 205px;
  341. }
  342. .loginbox label {
  343. float : left;
  344. margin-right : 5px;
  345. text-align : right;
  346. width : 180px;
  347. }
  348. .loginbox .body {
  349. background : none;
  350. width : 398px;
  351. }
  352. .logo {
  353. color : #6C6C6C;
  354. float : left;
  355. font-size : 10px;
  356. padding-top : 83px;
  357. text-align : right;
  358. width : 428px;
  359. }
  360. #mainmenu {
  361. float : left;
  362. font-family : Arial, sans-serif;
  363. padding-left : 12px;
  364. width : 190px;
  365. }
  366. #msg {
  367. background : url('images/msg.png');
  368. color : #FFFFFF;
  369. display : none;
  370. font-size : 16px;
  371. font-weight : bold;
  372. height : 38px;
  373. left : 50%;
  374. margin : -23px 0px 0px -247px;
  375. padding : 8px 0px 0px 8px;
  376. position : absolute;
  377. text-shadow : #000000 1px 1px;
  378. top : 50%;
  379. width : 487px;
  380. z-index : 21;
  381. }
  382. #msg img {
  383. vertical-align : middle;
  384. }
  385. .navbody {
  386. border : none;
  387. display : block;
  388. list-style : none;
  389. margin : 0px 0px 0px 0px;
  390. padding : 0px 0px 0px 0px;
  391. }
  392. .navbody a {
  393. color : #C9C9C9;
  394. display : block;
  395. font-family : verdana;
  396. font-size : 13px;
  397. font-weight : bold;
  398. padding : 6px 9px 6px 9px;
  399. text-decoration : none;
  400. text-shadow : #000000 1px 1px;
  401. }
  402. .navbody a:hover {
  403. background-color : #2F2F2F;
  404. border-bottom : 1px solid #161616;
  405. border-top : 1px solid #161616;
  406. margin-top : -1px;
  407. padding : 6px 9px 5px 9px;
  408. }
  409. .navbody a.active {
  410. color : #FE8013;
  411. background-color : #2F2F2F;
  412. border-bottom : 1px solid #161616;
  413. border-top : 1px solid #161616;
  414. margin-top : -1px;
  415. padding : 6px 9px 5px 9px;
  416. }
  417. .navbody li {
  418. background-image : url('images/navbody.png');
  419. padding : 0px 4px 0px 4px;
  420. }
  421. .navbox {
  422. margin-top : 7px;
  423. overflow : hidden;
  424. }
  425. .navfooter {
  426. background-image : url('images/navfoot.png');
  427. display : block;
  428. height : 4px;
  429. margin : -1px 0px 10px 0px;
  430. }
  431. .navheader {
  432. background-image : url('images/navhead1.png');
  433. color : #FFFFFF;
  434. cursor : default;
  435. display : block;
  436. font-family : arial;
  437. font-size : 14px;
  438. font-weight : bold;
  439. height : 26px;
  440. padding-left : 12px;
  441. padding-top : 14px;
  442. text-shadow : #000000 1px 1px;
  443. width : 190px;
  444. }
  445. .portno {
  446. font-weight : bold;
  447. }
  448. .portspeed {
  449. font-size : 10px;
  450. }
  451. .portstate td {
  452. text-align : center;
  453. width : 80px;
  454. }
  455. .select {
  456. position : relative;
  457. font-size : 16px;
  458. }
  459. .select:after {
  460. background-image : url('images/arrow.png');
  461. content : '';
  462. height : 4px;
  463. pointer-events : none;
  464. position : absolute;
  465. right : 7px;
  466. top : 8px;
  467. width : 8px;
  468. }
  469. .select:before {
  470. background-color : #2E2E2E;
  471. box-shadow : inset 0px 5px 4px #3E3E3E;
  472. border : 1px solid #191919;
  473. content : '';
  474. height : 15px;
  475. pointer-events : none;
  476. position : absolute;
  477. right : 0px;
  478. top : 1px;
  479. width : 20px;
  480. }
  481. .tips div {
  482. background-color : #FFFFAA;
  483. border : 1px solid #FE8013;
  484. color : #000000;
  485. font-family : verdana;
  486. font-size : 12px;
  487. padding : 3px;
  488. position : absolute;
  489. visibility : hidden;
  490. z-index : 10;
  491. }
  492. .webui {
  493. background-image : url('images/stripes.png');
  494. background-repeat : no-repeat;
  495. margin-left : auto;
  496. margin-right : auto;
  497. width : 1006px;
  498. }