From test, 6 Years ago, written in CSS.
This paste is a reply to Re: Untitled from test
- view diff
Embed
  1. @import url();
  2.  
  3. html {
  4.   background: none;
  5. }
  6.  
  7. body {
  8.   background-color: #161F30;
  9.         color: #fefefe;
  10.         font-family: Arial, Tahoma, Verdana, sans-serif;
  11. }
  12.  
  13. b, strong {
  14.         font-weight: bold;
  15. }
  16.  
  17. em, i {
  18.         font-style: italic;
  19. }
  20.  
  21. #container {
  22.         width: 900px;
  23.         margin: 0 auto;
  24. }
  25.  
  26. .container {
  27.         padding: 10px;
  28. }
  29.  
  30. h1, h2, h3 ,h4 {
  31.         font-weight: bold;
  32.         color: #fff;
  33. }
  34.  
  35. h1 {
  36.         font-size: 116%;
  37. }
  38.  
  39. h2 {
  40.         font-size: 108%;
  41. }
  42.  
  43. h3 {
  44.         font-size: 100%;
  45. }
  46.  
  47. h4 {
  48.         font-size: 93%;
  49. }
  50.  
  51. /* !Header */
  52. .header {
  53. }
  54.  
  55. .header h1 {
  56.         margin-top: 1px;
  57.         float: left;
  58. }
  59.  
  60. .header h1 a.title {
  61.         text-decoration: none;
  62.         color: #FFFFFF;
  63.         font-size: 160%;
  64.         font-family: 'Yanone Kaffeesatz', sans-serif;
  65.         font-weight: bolder;
  66.         letter-spacing: 2px;
  67.         -webkit-transition: all .25s ease-in-out;
  68.         -moz-transition: all .25s ease-in-out;
  69.         -ms-transition: all .25s ease-in-out;
  70.         -o-transition: all .25s ease-in-out;
  71.         transition: all .25s ease-in-out;
  72. }
  73.  
  74. .header h1 a.title:hover {
  75.         text-shadow: 0 0 5px #ccc;
  76. }
  77.  
  78. .header .tabs {
  79.         float: right;
  80.         margin-top: 8px;
  81. }
  82.  
  83. .header .tabs li {
  84.         display: inline;
  85.         text-align: center;
  86.         font-weight: bold;
  87. }
  88.  
  89. .header .tabs li a {
  90.         margin-left: 10px;
  91.         float: left;
  92.         width: auto;
  93.         color: #222;
  94.         text-decoration: none;
  95.         border-radius: 5px;
  96.         padding: 4px 7px;
  97.         border-right: 3px solid #fff;
  98.         border-left: 3px solid #fff;
  99.         background-color: #ccc;
  100.         -webkit-transition: all .25s ease-in-out;
  101.         -moz-transition: all .25s ease-in-out;
  102.         -ms-transition: all .25s ease-in-out;
  103.         -o-transition: all .25s ease-in-out;
  104.         transition: all .25s ease-in-out;
  105. }
  106.  
  107. .header .tabs li , .header .tabs li a:hover {
  108.         border-right: 3px solid #457DAF;
  109.         border-left: 3px solid #457DAF;
  110. }
  111.  
  112. /* !Content */
  113. .content {     
  114.         margin-top: 10px;      
  115.         float: left;
  116. }
  117.  
  118. .replies {
  119.         margin: 10px auto;
  120. }
  121.  
  122. .replies, .content {
  123.         width: 874px;
  124.         clear: both;
  125.         background-color: #222;
  126.         box-shadow: 0 0 9px #ccc;
  127. }
  128.  
  129. /* !Forms */
  130. .form_wrapper {
  131.         width: 854px;
  132. }
  133.  
  134. .form_wrapper.margin {
  135.         padding-bottom: 20px;
  136. }
  137.  
  138. .form_wrapper.background {
  139.         border: solid 2px #b7ddf2;
  140.         background: #EBF4FB;
  141.         padding: 14px;
  142. }
  143.  
  144. .form_wrapper .item_group {
  145.         clear: both;
  146.         width: 900px;
  147. }
  148.  
  149. .form_wrapper .item_group .item {
  150.         width: 284px;
  151.         margin-right: 10px;
  152.         clear: none;
  153. }
  154.  
  155. .form_wrapper .item_group .item_captcha {
  156.         width: 450px;
  157.     margin-bottom: -10px;
  158. }
  159.  
  160. .form_wrapper .item_group .captcha {
  161.     margin-left: 10px;
  162.     padding-left: 10px;
  163.     display: block;
  164. }
  165.  
  166. .form_wrapper .item_group .item input, .form_wrapper .item_group .item select {
  167.         width: 104px;
  168.         float: left;
  169.         border-radius: 5px;
  170. }
  171.  
  172. .form_wrapper .item_group .item select {
  173.         width: 115px;
  174. }
  175.  
  176. .form_wrapper .item {
  177.         clear: both;
  178.         width: 100%;
  179.         float: left;
  180.         margin-bottom: 10px;
  181. }
  182.  
  183. .form_wrapper .hidden {
  184.         display: none;
  185. }
  186.  
  187. .form_wrapper .advanced {
  188.         width: 100%;
  189.         text-align: center;
  190.         color: #ccc;
  191.         margin-top: 20px;
  192.         /*margin-left: 140px;*/
  193.         font-size: 93%;
  194. }
  195.  
  196. .form_wrapper label {
  197.         display: block;
  198.         font-weight: bold;
  199.         text-align: right;
  200.         width: 140px;
  201.         float: left;
  202. }
  203.  
  204. .form_wrapper .instruction {
  205.         color: #ccc;
  206.         display: block;
  207.         font-size: 85%;
  208.         font-weight: normal;
  209.         text-align: right;
  210.         width: 140px;
  211.         /*display: none;*/
  212. }
  213.  
  214. .form_wrapper .instruction.error {
  215.         color: #F02F34;
  216. }
  217.  
  218. .form_wrapper .instruction.error p {
  219.         margin: 0;
  220.         line-height: inherit;
  221. }
  222.  
  223. .form_wrapper input, .form_wrapper select {
  224.         width: 25%;
  225. }
  226.  
  227. .form_wrapper input.check {
  228.         width: auto;
  229.         margin-right: 10px;
  230. }
  231.  
  232. .form_wrapper select, .form_wrapper input, .form_wrapper textarea {
  233.         float: left;
  234.         padding: 4px 2px;      
  235.         margin: 2px 0 20px 10px;
  236.         border: solid 1px #457DAF;
  237.         font-size: 93%;
  238.         border-radius: 5px;
  239. }
  240.  
  241. .form_wrapper .text_beside {
  242.         width: 130px;
  243.         float: left;
  244. }
  245.  
  246. .form_wrapper .text_beside input, .form_wrapper .item_group .item .text_beside input {
  247.         margin-right: 5px;
  248.         float: left;
  249.         width: auto;
  250. }
  251.  
  252. .form_wrapper .text_beside p {
  253.         font-size: 93%;
  254.         float: left;
  255. }
  256.  
  257. .form_wrapper textarea {
  258.         width: 694px;
  259. }
  260.  
  261. .form_wrapper button {
  262.         clear: both;
  263.         float: left;
  264.         margin-left: 150px;
  265.         width: 125px;
  266.         height: 30px;
  267.         border: 0;
  268.         background: #666666;
  269.         text-align: center;
  270.         line-height: 231%;
  271.         color: #FFFFFF;
  272.         font-size: 85%;
  273.         font-weight: bold;
  274.         padding: 0;
  275.     cursor: pointer;
  276.         margin-top: 20px;
  277.         border-radius: 16px;
  278.         -webkit-transition: all .25s ease-in-out;
  279.         -moz-transition: all .25s ease-in-out;
  280.         -ms-transition: all .25s ease-in-out;
  281.         -o-transition: all .25s ease-in-out;
  282.         transition: all .25s ease-in-out;
  283. }
  284.  
  285. .form_wrapper button:hover {
  286.         color: #000;
  287.         background-color: #ccc;
  288. }
  289.  
  290. .form_wrapper .dangerbutton:hover {
  291.         background: #f00;
  292. }
  293.  
  294. .form_wrapper .message_wrapper .message {
  295.         margin-top: -10px;
  296. }
  297.  
  298. .spacer {
  299.         clear: both;
  300.         height: 1px;
  301. }
  302.  
  303. .clear {
  304.     clear: both;
  305. }
  306.  
  307. .explain {
  308.         font-size: 12px;
  309.         color: #dfdfdf;
  310.         margin-bottom: 20px;
  311. }
  312.  
  313. .explain.border {
  314.         border-bottom: solid 1px #9ABAD7;
  315.         padding-bottom: 10px;
  316. }
  317.  
  318. .explain.lowmargin {
  319.         margin-bottom: 10px;
  320. }
  321.  
  322. /* Pagination */
  323.  
  324. .pages {
  325.         margin-top: 20px;
  326.         font-size: 116%;
  327.         text-align: center;
  328.         width: 100%;
  329.         float: left;
  330.         clear: both;
  331. }
  332.  
  333. /* !Recent Paste Listings */
  334. .recent {
  335.         clear: both;
  336.         width: 854px;
  337. }
  338.  
  339. .recent th {
  340.         font-weight: bold;
  341.         font-size: 100%;
  342.         text-align: left;
  343. }
  344.  
  345. .recent .title{
  346.         width: 280px;
  347. }
  348.  
  349. .recent .name {
  350.         width: 180px;
  351. }
  352.  
  353. .recent .lang {
  354.         width: 100px;
  355. }
  356.  
  357. .recent .time {
  358.         width: 100px;
  359. }
  360.  
  361. .recent .hits {
  362.         width: 70px;
  363. }
  364.  
  365. .recent tr {
  366.         line-height: 30px;
  367. }
  368.  
  369. .recent tr.title {
  370.         line-height: auto;
  371. }
  372.  
  373. .recent tr td {
  374.         font-size: 100%;
  375.         padding: 3px;
  376. }
  377.  
  378. .recent .odd {
  379.         background-color: none;
  380. }
  381.  
  382. .recent .even {
  383.         background-color: #F1F5FA;
  384. }
  385.  
  386. /* !Pastes */
  387. .meta {
  388.         font-size: 93%;
  389.         line-height: 18px;
  390. }
  391.  
  392. .meta .spacer, .spacer.high {
  393.         height: 10px;
  394.         width: 100%;
  395.         clear: both;   
  396. }
  397.  
  398. .detail {
  399.         display: block;
  400.         width: 100%;
  401.         clear: both;
  402. }
  403.  
  404. . {
  405.         font-style: italic;
  406.         color: #eee;
  407. }
  408.  
  409. .detail .item {
  410.         color: #ccc;
  411.         width: 50px;
  412.         display: block;
  413.         float: left;
  414. }
  415.  
  416. #embed_field {
  417.     width: 200px;
  418.     border: 1px solid #ccc;
  419. }
  420.  
  421. .paste {
  422.         margin: 0 auto;
  423.         width: 900px;
  424.         font-size: 100%;
  425. }
  426.  
  427. .paste .text_formatted {
  428.         clear: both;
  429.         float: left;
  430.         width: 874px;
  431.         border: 3px solid #D5DAE3;
  432.         margin-top: 10px;
  433.         margin-left: 10px;
  434.         background: #fff;
  435.     position: relative;
  436.     color: #aaa;
  437. }
  438.  
  439. .text_formatted ol {
  440.         padding-left: 50px;
  441. }
  442.  
  443. .text_formatted ol li {
  444.         list-style: decimal outside;
  445. }
  446.  
  447. /* !Messages */
  448. .message {
  449.         width: 100%;
  450.         font-size: 85%;
  451.         margin-bottom: 15px;
  452.         color: #fff;
  453. }
  454.  
  455. .message.success {
  456.         background-color: green;
  457. }
  458.  
  459. .message.status {
  460.         background: #DB9330;
  461. }
  462.  
  463. .message.error {
  464.         background: red;
  465. }
  466.  
  467. .message .container {
  468.         padding: 5px;
  469. }
  470.  
  471. /* About Page */
  472. .about {
  473.         line-height: 18px;
  474. }
  475.  
  476. .about  {
  477.         margin-top: 10px;
  478.         float: left;
  479.         clear: both;
  480.         width: 100%;
  481. }
  482.  
  483. .about p, .about ul, .about code {
  484.         margin-bottom: 10px;
  485. }
  486.  
  487. .about ul, .about code {
  488.         margin-left: 20px;
  489. }
  490.  
  491. .about ul li {
  492.         list-style-type: disc;
  493.         list-style-position: inside;
  494. }
  495.  
  496. .about code {
  497.         width: 100%;
  498.         clear: both;
  499.         display: block;
  500.         border-left: 3px solid #AAAAAA;
  501.         padding-left: 10px;
  502.         padding-top: 4px;
  503.         padding-bottom: 4px;
  504. }
  505.  
  506. /* !Footer */
  507. .footer {
  508.         width: 100%;
  509.         clear: both;
  510.         float: left;
  511.         margin-top: 30px;
  512.         padding-bottom: 30px;
  513.         text-align: center;
  514.         font-size: 93%;
  515.         color: #777;
  516.         font-family: Helvetica, Arial, sans-serif;
  517.         line-height: 16px;
  518. }
  519.  
  520. .footer a {
  521.         color: inherit;
  522.         text-decoration: underline;
  523.         -webkit-transition: all .25s ease-in-out;
  524.         -moz-transition: all .25s ease-in-out;
  525.         -ms-transition: all .25s ease-in-out;
  526.         -o-transition: all .25s ease-in-out;
  527.         transition: all .25s ease-in-out;
  528. }
  529.  
  530. .login {
  531.     margin-left: 30%;
  532.     margin-right: auto;
  533. }
  534.  
  535. .login_error {
  536.     border: 1px solid;
  537.     margin: 0 30% 10px 25%;
  538.     padding:15px 10px 15px 50px;
  539.     text-align: center;
  540.     background-color: #ccc;
  541.     color: #D8000C;
  542. }
  543.  
  544. .login .form_wrapper input {
  545.     margin: 1px 0 0 5px;
  546.     width: 130px;
  547. }
  548.  
  549. .login .form_wrapper label {
  550.     width: 104px;
  551. }
  552.  
  553. /* Special for dark theme */
  554.  
  555. a {color: #fff; text-decoration: underline;-webkit-transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;-ms-transition: all .25s ease-in-out;-o-transition: all .25s ease-in-out;transition: all .25s ease-in-out;}
  556. a:hover {color: #ccc; text-decoration: none;}
  557. .CodeMirror-scroll {background-color: #fff;}
  558.  
captcha