Просмотр файла design/style.css

Размер файла: 14.42Kb
  1. @font-face {
  2. font-family: 'AleksandraC';
  3. src: url('font/aleksandracregular.ttf') format('truetype');
  4. font-weight: 400;
  5. font-style: normal;
  6. }
  7. body {
  8. background: #f0f0f0 !important;
  9. color: #333;
  10. max-width: 600px;
  11. margin: 0 auto !important;
  12. font-size: 13px !important;
  13. font-family: 'AleksandraC';
  14. }
  15. a {
  16. text-decoration: none !important;
  17. -webkit-transition: all 0.3s ease-out;
  18. -moz-transition: all 0.3s ease-out;
  19. -o-transition: all 0.3s ease-out;
  20. transition: all 0.3s ease-out;
  21. }
  22. a:hover {
  23. color: #005580 !important;
  24. text-decoration: none !important;
  25. }
  26. header {
  27. background: #5d80a6;
  28. padding: 0;
  29. text-align: center;
  30. color: #fff;
  31. width: 100%;
  32. z-index: 99999;
  33. box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  34. position: fixed;
  35. top: 0;
  36. max-width: 600px;
  37. }
  38. header a {
  39. display: block;
  40. padding: 15px;
  41. text-decoration: none;
  42. }
  43. header table {
  44. width: 100%;
  45. }
  46. header td {
  47. padding: 0;
  48. }
  49.  
  50. .mOm{
  51. -webkit-box-shadow: 0px 28px 59px 0px rgba(93,128,166,0.50);
  52. -moz-box-shadow: 0px 28px 59px 0px rgba(93,128,166,0.50);
  53. box-shadow: 0px 28px 59px 0px rgba(93,128,166,0.50);
  54. border-right: 1px solid #5d80a6;
  55. border-left: 1px solid #5d80a6;
  56. border-top: 1px solid #5d80a6;
  57. }
  58. .l_bar {
  59. width: 1%;
  60. -webkit-transition: all 0.3s ease-out;
  61. -moz-transition: all 0.3s ease-out;
  62. -o-transition: all 0.3s ease-out;
  63. transition: all 0.3s ease-out;
  64. }
  65.  
  66. .l_bar:hover {
  67. width: 1%;
  68. background: #4d7199;
  69. }
  70.  
  71. .r_bar {
  72. width: 1%;
  73. -webkit-transition: all 0.3s ease-out;
  74. -moz-transition: all 0.3s ease-out;
  75. -o-transition: all 0.3s ease-out;
  76. transition: all 0.3s ease-out;
  77. }
  78.  
  79. .r_bar:hover {
  80. width: 1%;
  81. background: #4d7199;
  82. }
  83.  
  84. .c_bar {
  85. width: 60%;
  86. }
  87.  
  88. .block {
  89. margin: 10px 8px;
  90. box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),
  91. 0 3px 0px -3px rgba(0,0,0,.2),
  92. 0 2px 5px 0 rgba(0,0,0,.05);
  93. }
  94.  
  95. .block.first {
  96. margin-top: 65px;
  97. }
  98.  
  99. .title {
  100. color: #fff;
  101. background: #5d80a6;
  102. padding: 15px;
  103. text-shadow: 1px 1px 2px rgba(52,52,52,0.20);
  104. white-space: nowrap;
  105. overflow: hidden;
  106. text-overflow: ellipsis;
  107. }
  108.  
  109. .title a {
  110. color: #fff !important;
  111. }
  112.  
  113. .title a:hover {
  114. color: #f4f4f4 !important;
  115. }
  116.  
  117. .title.back {
  118. padding-left: 5px;
  119. }
  120. .menu, .page {
  121. padding: 8px;
  122. color: #333;
  123. background: #fff;
  124. border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  125. font-size: 12px;
  126. margin: 0 !important;
  127. }
  128. .page a{
  129. padding: 1px 5px;
  130. border: 1px solid #4b6a8e;
  131. color: #4b6a8e;
  132. border-radius: 3px;
  133. }
  134.  
  135. .page_select {
  136. padding: 1px 5px;
  137. border: 1px solid #ccc;
  138. color: #ccc;
  139. border-radius: 3px;
  140. }
  141. .page a:hover {
  142. background: #e0e0e0;
  143. padding: 5px 9px;
  144. }
  145. .menu:last-child {
  146. border-bottom: none;
  147. }
  148. .err {
  149. background: #f2f2f2;
  150. padding: 10px;
  151. border-bottom: 1px solid #e8e8e8;
  152. border-left: 1px solid #e8e8e8;
  153. border-right: 1px solid #e8e8e8;
  154. text-decoration: none;
  155. color: #333;
  156. }
  157.  
  158. .menu2 {
  159. background: #f2f2f2;
  160. padding: 10px;
  161. border-bottom: 1px solid #e8e8e8;
  162. border-left: 1px solid #e8e8e8;
  163. border-right: 1px solid #e8e8e8;
  164. text-decoration: none;
  165. color: #333;
  166. }
  167. .prev {
  168. color: #333;
  169. background: #fff;
  170. font-size: 12px;
  171. margin: 0 !important;
  172. }
  173. .link a {
  174. background: #fff;
  175. padding: 15px 15px 15px 8px;
  176. border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  177. display: block;
  178. text-decoration: none;
  179. white-space: nowrap;
  180. overflow: hidden;
  181. text-overflow: ellipsis;
  182. -webkit-transition: all 0.3s ease-out;
  183. -moz-transition: all 0.3s ease-out;
  184. -o-transition: all 0.3s ease-out;
  185. transition: all 0.3s ease-out;
  186. }
  187. .link a:hover {
  188. background: #f2f2f2;
  189. padding: 15px 15px 15px 8px;
  190. border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  191. display: block;
  192. text-decoration: none;
  193. white-space: nowrap;
  194. }
  195. .link a:last-child {
  196. border-bottom: none;
  197. }
  198.  
  199. footer {
  200. background: #5d80a6;
  201. color: #fff;
  202. text-shadow: 1px 1px 2px rgba(52,52,52,0.20);
  203. font-size: 13px;
  204. font-family: Roboto;
  205. padding: 10px;
  206. }
  207.  
  208. footer a {
  209. color: #fff !important;
  210. }
  211.  
  212. footer a:hover {
  213. color: #fff !important;
  214. }
  215.  
  216. h1 {
  217. font-size: 13px !important;
  218. font-family: 'AleksandraC';
  219. text-align: center;
  220. color: #333;
  221. line-height: 15px !important;
  222. }
  223.  
  224. h4 {
  225. font-family: Roboto !important;
  226. font-weight: 300 !important;
  227. margin-top: 12px !important;
  228. margin-left: 5px !important;
  229. float: left !important;
  230. }
  231.  
  232. .gb {
  233. padding: 8px;
  234. color: #333;
  235. background: #fff;
  236. border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  237. font-size: 12px;
  238. margin: 0;
  239. }
  240.  
  241. .m {
  242. background:#fff;
  243. padding: 8px;
  244. color: #444;
  245. text-align: justify;
  246. }
  247.  
  248. .copy {
  249. color: #333;
  250. background: #fff;
  251. float: right;
  252. margin-top: 0px;
  253. margin-right: 5px;
  254. padding-top: 0px;
  255. padding-bottom: 0px;
  256. padding-left: 4px;
  257. padding-right: 4px;
  258. border-radius: 2px;
  259. border: 1px solid #444;
  260. font-size: 11px;
  261. }
  262.  
  263. .comments {
  264. padding: 10px;
  265. font-size: 15px;
  266. border-bottom: 1px dotted rgba(0, 0, 0, 0.05);
  267. background: #fff;
  268. }
  269.  
  270. .comments:last-child {
  271. border-bottom: none;
  272. }
  273.  
  274. .comm {
  275. color: #9B9191;
  276. }
  277.  
  278. .name {
  279. font-size: 17px;
  280. }
  281.  
  282. .emoji {
  283. width: 14px;
  284. }
  285.  
  286. .on {
  287. margin-left: 5px;
  288. }
  289.  
  290. .del {
  291. float: right;
  292. padding: 0px 5px;
  293. background: none;
  294. border-radius: 3px;
  295. font-size: 20px;
  296. opacity: 0.2;
  297. -webkit-transition: all 0.3s ease-out;
  298. -moz-transition: all 0.3s ease-out;
  299. -o-transition: all 0.3s ease-out;
  300. transition: all 0.3s ease-out;
  301. }
  302.  
  303. .del:hover {
  304. float: right;
  305. padding: 0px 5px;
  306. background: rgba(245, 245, 245, 0.5);
  307. border-radius: 3px;
  308. opacity: 1;
  309. }
  310.  
  311. .del a:hover {
  312. opacity: 0.8;
  313. }
  314.  
  315. .delete {
  316. float: right;
  317. font-size: 25px;
  318. }
  319.  
  320. .pagination {
  321. border-top: 1px solid rgba(0, 0, 0, 0.05);
  322. text-align: center;
  323. font-size: 13px;
  324. }
  325.  
  326. .pagination a, .pagination b {
  327. background: #eee;
  328. padding: 5px 9px;
  329. }
  330.  
  331. .pagination a:hover {
  332. background: #e0e0e0;
  333. padding: 5px 9px;
  334. }
  335.  
  336. select {
  337. width: 214px !important;
  338. }
  339.  
  340. a.left {
  341. float: left;
  342. background: #5d80a6;
  343. padding: 13px;
  344. }
  345.  
  346. a.left:hover {
  347. background: #4d7199;
  348. }
  349.  
  350. code {
  351. padding: 0 !important;
  352. background: none !important;
  353. border: 0 !important;
  354. display: block !important;
  355. margin: 1px !important;
  356. overflow: auto !important;
  357. }
  358.  
  359. .egg {
  360. color: #4d7199 !important;
  361. margin-right: 5px;
  362. float: right;
  363. text-shadow: none;
  364. }
  365.  
  366. .egg:hover {
  367. color: #333 !important;
  368. }
  369.  
  370. #sp b {
  371. display: none;
  372. position: fixed;
  373. bottom: 50px;
  374. right: 8px;
  375. padding: 6px 15px;
  376. border-radius: 6px;
  377. background: #333;
  378. opacity: 0.6;
  379. text-align: center;
  380. }
  381.  
  382. #sp:hover b {
  383. display: block;
  384. }
  385.  
  386.  
  387. input[type=text], input[type=password] {
  388. text-align: left !important;
  389. color: #333 !important;
  390. padding: 3px !important;
  391. border-radius: 1px !important;
  392. outline: none !important;
  393. }
  394.  
  395. textarea{
  396. background: #fff;
  397. border-radius: 1px !important;
  398.  
  399. color: #333 !important;
  400. outline: none !important;
  401. }
  402.  
  403. form {
  404. margin: 0 !important;
  405. }
  406.  
  407. .btn {
  408. position: relative;
  409. overflow: hidden;
  410. margin-right: 4px;
  411. }
  412.  
  413. .btn input {
  414. position: absolute;
  415. top: 0;
  416. right: 0;
  417. margin: 0;
  418. opacity: 0;
  419. transform: translate(-300px, 0) scale(4);
  420. font-size: 23px;
  421. cursor: pointer;
  422. }
  423.  
  424. * + html .btn {
  425. padding: 2px 15px;
  426. margin: 1px 0 0 0;
  427. }
  428.  
  429. .container {
  430. width: 100% !important;
  431. margin: 0 !important;
  432. }
  433.  
  434. .clearfix {
  435. white-space: nowrap;
  436. overflow: hidden;
  437. text-overflow: ellipsis;
  438. }
  439.  
  440. .sidr {
  441. display: none;
  442. position: absolute;
  443. position: fixed;
  444. top: 0;
  445. height: 100%;
  446. z-index: 9999;
  447. width: 250px;
  448. overflow-y: auto;
  449. font-family: sans-serif;
  450. font-size: 15px;
  451. background: #fff;
  452. color: #333;
  453. }
  454.  
  455. .sidr .sidr-inner {
  456. padding: 0 0 15px;
  457. }
  458.  
  459. .sidr .sidr-inner>p {
  460. margin-left: 25px;
  461. margin-right: 15px;
  462. }
  463.  
  464. .sidr.right {
  465. left: auto;
  466. right: -260px;
  467. }
  468.  
  469. .sidr.left {
  470. left: -260px;
  471. right: auto;
  472. }
  473.  
  474. .sidr p {
  475. font-size: 13px;
  476. margin: 0 0 12px;
  477. }
  478.  
  479. .sidr p a {
  480. color: #333 !important;
  481. }
  482.  
  483. .sidr>p {
  484. margin-left: 15px;
  485. margin-right: 15px;
  486. }
  487.  
  488. .sidr ul {
  489. display: block;
  490. margin: 0 0 25px;
  491. padding: 0;
  492. }
  493.  
  494. .sidr ul li {
  495. display: block;
  496. margin: 0;
  497. line-height: 48px;
  498. }
  499.  
  500. .sidr ul li:hover,.sidr ul li.active,.sidr ul li.sidr-class-active {
  501. border-top: none;
  502. }
  503.  
  504. .sidr ul li a:hover{
  505. background: #f2f2f2;
  506. }
  507.  
  508. .sidr ul li a,.sidr ul li span {
  509. padding: 0 10px;
  510. display: block;
  511. text-decoration: none;
  512. color: #333 !important;
  513. font-size: 14px;
  514. -webkit-transition: all 0.3s ease-out;
  515. -moz-transition: all 0.3s ease-out;
  516. -o-transition: all 0.3s ease-out;
  517. transition: all 0.3s ease-out;
  518. }
  519.  
  520. .sidr ul li ul {
  521. border-bottom: none;
  522. margin: 0;
  523. }
  524.  
  525. .sidr ul li ul li {
  526. line-height: 40px;
  527. font-size: 13px;
  528. }
  529.  
  530. .sidr ul li ul li:last-child {
  531. border-bottom: none;
  532. }
  533.  
  534. .sidr ul li ul li:hover,.sidr ul li ul li.active,.sidr ul li ul li.sidr-class-active {
  535. border-top: none;
  536. line-height: 41px;
  537. }
  538.  
  539. .sidr ul li ul li a,.sidr ul li ul li span {
  540. color:rgba(255,255,255,0.8);
  541. padding-left: 30px;
  542. }
  543.  
  544.  
  545. .sidr li.t_menu {
  546. margin-bottom: 15px;
  547. font-family: Roboto;
  548. font-size: 17.5px;
  549. background: url(/design/img/menu_header.png) 60% 70% no-repeat !important;
  550. }
  551.  
  552. .sidr li.t_menu span {
  553. font-size: 18px !important;
  554. margin-left: 2px;
  555. color: #fff !important;
  556. }
  557.  
  558. .sidr li.t_menu .l-m-i {
  559. width: 70px;
  560. height: 70px;
  561. border-radius: 50%;
  562. margin: 10px;
  563. }
  564.  
  565. .sidr li.t_menu .l-m-i {
  566. background: #000;
  567. }
  568.  
  569. .sidr li.t_menu .l-m-i:hover {
  570. background: url(/design/img/logo-hover.gif) 50% no-repeat;
  571. }
  572.  
  573. .sidr li.t_menu .r-m-i {
  574. float: right;
  575. padding: 3px 15px;
  576. }
  577.  
  578. .sidr li.t_menu .r-m-i:hover {
  579. background: transparent;
  580. }
  581.  
  582. .sidr form {
  583. margin: 0 15px;
  584. }
  585.  
  586. .sidr label {
  587. font-size: 13px;
  588. }
  589.  
  590. div#sidr ul li {
  591. list-style: none;
  592. }
  593.  
  594. .passEye {
  595. position: relative;
  596. display: inline-block;
  597. }
  598.  
  599. .passEye input::-ms-reveal, .p assEye input::-ms-clear {
  600. display: none;
  601. }
  602.  
  603. .passEye .eye {
  604. position: absolute;
  605. right: 5px;
  606. top: 50%;
  607. margin-top: -10px;
  608. display: block;
  609. height: 10px;
  610. width: 18px;
  611. background: url(/design/img/eye.png) no-repeat left 2px;
  612. cursor: pointer;
  613. }
  614.  
  615. .passEye .openEye {
  616. background-position: left bottom;
  617. }
  618.  
  619. .switch {
  620. width: 100%;
  621. background: transparent;
  622. margin-bottom: 55px;
  623. text-decoration: none;
  624. white-space: nowrap;
  625. overflow: hidden;
  626. text-overflow: ellipsis;
  627. -webkit-transition: all 0.3s ease-out;
  628. -moz-transition: all 0.3s ease-out;
  629. -o-transition: all 0.3s ease-out;
  630. transition: all 0.3s ease-out;
  631. }
  632.  
  633. .switch:hover {
  634. background: #f2f2f2;
  635. }
  636.  
  637. .l_e {
  638. width: 1px;
  639. padding-left: 8px;
  640. }
  641.  
  642. .r_e {
  643. width: 1px;
  644. margin-right: 70px;
  645. margin-top: 4px;
  646. }
  647.  
  648. .op {
  649. margin-top: 10px;
  650. position: absolute;
  651. left: 14px;
  652. }
  653.  
  654. .sw {
  655. display: block;
  656. }
  657.  
  658. .sw:not(:checked) + label + * {
  659. display: none;
  660. }
  661.  
  662. input.sw {
  663. opacity: 0;
  664. position: absolute;
  665. left: -9999px;
  666. }
  667.  
  668. input.sw + label {
  669. -webkit-transition: .2s ease;
  670. transition: .2s ease;
  671. display: inline-block;
  672. height: 15px;
  673. width: 50px;
  674. position: relative;
  675. box-shadow: inset 0 0 0px 2px #e4e4e4;
  676. border-radius: 60px;
  677. margin-top: 8px;
  678. background: #e4e4e4;
  679. }
  680.  
  681. input.sw + label:before {
  682. content: "";
  683. position: absolute;
  684. display: block;
  685. height: 15px;
  686. width: 30px;
  687. top: 0;
  688. left: 0;
  689. border-radius: 15px;
  690. background: rgba(76, 217, 100, 0);
  691. -webkit-transition: 0.2s cubic-bezier(0.24, 0, 0.5, 1);
  692. transition: 0.2s cubic-bezier(0.24, 0, 0.5, 1);
  693. }
  694.  
  695. input.sw + label:after {
  696. content: "";
  697. position: absolute;
  698. display: block;
  699. height: 25px;
  700. width: 25px;
  701. top: 50%;
  702. margin-top: -13px;
  703. left: 1px;
  704. border-radius: 60px;
  705. background: #fff;
  706. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1),
  707. 0 4px 0px 0 rgba(0, 0, 0, 0.04),
  708. 0 4px 9px rgba(0, 0, 0, 0.13),
  709. 0 3px 3px rgba(0, 0, 0, 0.05);
  710. -webkit-transition: 0.35s cubic-bezier(0.54, 1.6, 0.5, 1);
  711. transition: 0.35s cubic-bezier(0.54, 1.6, 0.5, 1);
  712. }
  713.  
  714. input.sw + label span {
  715. white-space: nowrap;
  716. height: 30px;
  717. line-height: 30px;
  718. margin-left: 50px;
  719. padding-left: 16px;
  720. }
  721.  
  722. input.sw:checked + label:before {
  723. width: 51px;
  724. background: #5d80a6;
  725. -webkit-transition: width 0.2s cubic-bezier(0, 0, 0, 0.1) !important;
  726. transition: width 0.2s cubic-bezier(0, 0, 0, 0.1) !important;
  727. }
  728.  
  729. input.sw:checked + label:after {
  730. left: 26px;
  731. background: #4d7199;
  732. }
  733.  
  734. input.sw:checked + label {
  735. box-shadow: inset 0 0 0px 25px #e4e4e4;
  736. -webkit-transition: box-shadow 2.5s cubic-bezier(0, 1.2, 0.94, 0.95);
  737. transition: box-shadow 2.5s cubic-bezier(0, 1.2, 0.94, 0.95);
  738. }
  739.  
  740. .jp-title {
  741. margin-left: 65px;
  742. font-size: 13px;
  743. color: #999;
  744. }
  745.  
  746. .jp-no-solution {
  747. font-size: 12px;
  748. color: #999;
  749. }
  750.  
  751. .jp-title ul {
  752. padding: 0;
  753. margin: 0;
  754. list-style: none;
  755. white-space: nowrap;
  756. overflow: hidden;
  757. text-overflow: ellipsis;
  758. }
  759.  
  760. .jp-gui {
  761. position: relative;
  762. background: transparent;
  763. overflow: hidden;
  764. margin-top: -18px;
  765. }
  766.  
  767. .jp-jplayer, .jp-audio {
  768. width: 310px;
  769. height: 40px;
  770. margin: 0px auto;
  771. padding: 2px 0;
  772. }
  773.  
  774. .jp-controls {
  775. padding: 0;
  776. margin: 0;
  777. list-style: none;
  778. }
  779.  
  780. .jp-controls li {
  781. display: inline;
  782. }
  783.  
  784. .jp-controls a {
  785. color: #333;
  786. }
  787.  
  788. .jp-play,.jp-pause {
  789. width: 40px;
  790. height: 40px;
  791. margin-left: 10px;
  792. display: inline-block;
  793. text-align: center;
  794. line-height: 30px;
  795. }
  796.  
  797. .jp-controls .jp-play:hover,.jp-controls .jp-pause:hover {
  798. background: transparent;
  799. }
  800.  
  801. .jp-progress {
  802. background: #f2f2f2;
  803. position: absolute;
  804. right: 50px;
  805. top: 27.5px;
  806. width: 195px;
  807. }
  808.  
  809. .jp-play-bar {
  810. height: 3px;
  811. background: #5d80a6;
  812. position: relative;
  813. }
  814.  
  815. .jp-play-bar:after {
  816. content: "";
  817. position: absolute;
  818. display: block;
  819. height: 11px;
  820. width: 11px;
  821. margin-top: -4px;
  822. margin-left: -10.7px;
  823. left: 100%;
  824. border-radius: 60px;
  825. background: #5d80a6;
  826. cursor: pointer;
  827. }
  828.  
  829. .jp-time-holder {
  830. color: #999;
  831. font-size: 12px;
  832. line-height: 14px;
  833. position: absolute;
  834. right: 15px;
  835. top: 22px;
  836. }
  837. .st_1 {
  838. margin-left:20px;
  839. margin-bottom:0;
  840. border-style:solid;
  841. border-color:transparent transparent #6182aa transparent;
  842. border-width:0px 0px 10px 10px;
  843. height:0px;
  844. width:0px
  845. }
  846. .st_2 {
  847. margin:3px;
  848. margin-top:0;
  849. border:#6182aa 2px solid;padding:5px;
  850. color:#000;
  851. background-color:#cddae7;-o-border-radius:10px;
  852. border-radius:10px;-moz-border-radius:10px;
  853. word-wrap:break-word
  854. }
  855. .center {
  856. text-align:center;
  857. }
  858. * { outline: none !important; }