Want more features on Pastebin? Sign Up, it's FREE!
Guest

Untitled

By: a guest on Jan 2nd, 2013  |  syntax: CSS  |  size: 10.25 KB  |  views: 98  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. html, body, div, span, applet, object, iframe,
  2. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  3. a, abbr, acronym, address, big, cite, code,
  4. del, dfn, em, img, ins, kbd, q, s, samp,
  5. small, strike, strong, sub, sup, tt, var,
  6. b, u, i, center,
  7. dl, dt, dd, ol, ul, li,
  8. fieldset, form, label, legend,
  9. table, caption, tbody, tfoot, thead, tr, th, td,
  10. article, aside, canvas, details, embed,
  11. figure, figcaption, footer, header, hgroup,
  12. menu, nav, output, ruby, section, summary,
  13. time, mark, audio, video {
  14.   margin: 0;
  15.   padding: 0;
  16.   border: 0;
  17.   font: inherit;
  18.   font-size: 100%;
  19.   vertical-align: baseline; }
  20.  
  21. html {
  22.   line-height: 1; }
  23.  
  24. ol, ul {
  25.   list-style: none; }
  26.  
  27. table {
  28.   border-collapse: collapse;
  29.   border-spacing: 0; }
  30.  
  31. caption, th, td {
  32.   text-align: left;
  33.   font-weight: normal;
  34.   vertical-align: middle; }
  35.  
  36. q, blockquote {
  37.   quotes: none; }
  38.   q:before, q:after, blockquote:before, blockquote:after {
  39.     content: "";
  40.     content: none; }
  41.  
  42. a img {
  43.   border: none; }
  44.  
  45. article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  46.   display: block; }
  47.  
  48. body {
  49.   font-family: arial, sans-serif;
  50.   font-size: 16px;
  51.   font-style: normal;
  52.   background: url(../img/wood.jpg) center top repeat;
  53.   color: #4e4e4e; }
  54.  
  55. #users {
  56.   position: fixed;
  57.   top: 25px;
  58.   left: 0;
  59.   bottom: 0;
  60.   background: url(../img/bg.png);
  61.   width: 65px;
  62.   -webkit-box-shadow: 0px 0px 30px black inset;
  63.   -moz-box-shadow: 0px 0px 30px black inset;
  64.   box-shadow: 0px 0px 30px black inset; }
  65.   #users div{
  66.     width: 250px;
  67.     color: #FFF;
  68.   }
  69.   #users img {
  70.     vertical-align:middle;
  71.     margin: 5px;
  72.     position: relative;
  73.     -webkit-animation-name: "fadeInUp";
  74.     -moz-animation-name: "fadeInUp";
  75.     -ms-animation-name: "fadeInUp";
  76.     -o-animation-name: "fadeInUp";
  77.     animation-name: "fadeInUp";
  78.     -webkit-animation-duration: 1s;
  79.     -moz-animation-duration: 1s;
  80.     -ms-animation-duration: 1s;
  81.     -o-animation-duration: 1s;
  82.     animation-duration: 1s;
  83.     -webkit-box-shadow: 0px 0px 10px black inset, 0px 1px 0px rgba(255, 255, 255, 0.1);
  84.     -moz-box-shadow: 0px 0px 10px black inset, 0px 1px 0px rgba(255, 255, 255, 0.1);
  85.     box-shadow: 0px 0px 10px black inset, 0px 1px 0px rgba(255, 255, 255, 0.1);
  86.     -webkit-border-radius: 3px;
  87.     -moz-border-radius: 3px;
  88.     -ms-border-radius: 3px;
  89.     -o-border-radius: 3px;
  90.     border-radius: 3px; }
  91. #room {
  92.   position: fixed;
  93.   left: 0;
  94.   right: 0;
  95.   top: 0;
  96.   background: url(../img/bg.png);
  97.   height: 25px;
  98.   -webkit-box-shadow: 0px 0px 30px black inset;
  99.   -moz-box-shadow: 0px 0px 30px black inset;
  100.   box-shadow: 0px 0px 30px black inset;}
  101.   #room span{
  102.     line-height: 25px;
  103.     color: #FFF;
  104.     padding-left: 5px;
  105.     padding-right: 5px;
  106.   }
  107.  
  108. #form {
  109.   position: fixed;
  110.   left: 65px;
  111.   right: 0;
  112.   bottom: 0;
  113.   background: #d2d2d2;
  114.   height: 50px; }
  115.   #form .text {
  116.     padding: 0 5px;
  117.     border: solid 1px #d2d2d2;
  118.     height: 32px;
  119.     position: fixed;
  120.     bottom: 9px;
  121.     left: 74px;
  122.     right: 9px;
  123.     -webkit-border-radius: 3px;
  124.     -moz-border-radius: 3px;
  125.     -ms-border-radius: 3px;
  126.     -o-border-radius: 3px;
  127.     border-radius: 3px;
  128.     -webkit-box-shadow: 0px 1px 3px #d2d2d2 inset;
  129.     -moz-box-shadow: 0px 1px 3px #d2d2d2 inset;
  130.     box-shadow: 0px 1px 3px #d2d2d2 inset; }
  131.   #form .submit {
  132.   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  133.   background-color: #f5f5f5;
  134.   background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  135.   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  136.   background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  137.   background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  138.   background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  139.   background-repeat: repeat-x;
  140.   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  141.   border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  142.   border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  143.   *background-color: #e6e6e6;
  144.   /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  145.  
  146.   filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  147.   border: 1px solid #bbbbbb;
  148.   *border: 0;
  149.   border-bottom-color: #a2a2a2;
  150.   *margin-left: .3em;
  151.   -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
  152.   -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
  153.   box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
  154.     position: fixed;
  155.     height: 32px;
  156.     bottom: 9px;
  157.     right: 9px;
  158.     cursor: pointer; }
  159.  
  160. #messages {
  161.   position: fixed;
  162.   top: 25px;
  163.   left: 65px;
  164.   right: 0px;
  165.   bottom: 30px;
  166.   overflow: scroll;
  167.   background: url("../img/wood.jpg") repeat scroll center top transparent;
  168.   padding: 10px;
  169.   box-shadow: 0 0 30px black outset; }
  170.   #messages .message {
  171.     display: block;
  172.     position: relative;
  173.     background-color: #FFF;
  174.     border-bottom: 1px solid #d2d2d2;
  175.     padding: 10px;
  176.     z-index: 20;
  177.     -webkit-animation-name: "fadeInRight";
  178.     -moz-animation-name: "fadeInRight";
  179.     -ms-animation-name: "fadeInRight";
  180.     -o-animation-name: "fadeInRight";
  181.     animation-name: "fadeInRight";
  182.     -webkit-animation-duration: 0.4s;
  183.     -moz-animation-duration: 0.4s;
  184.     -ms-animation-duration: 0.4s;
  185.     -o-animation-duration: 0.4s;
  186.     animation-duration: 0.4s; }
  187.     #messages .message:after {
  188.       content: '';
  189.       position: absolute;
  190.       bottom: -3px;
  191.       left: 0;
  192.       right: 0;
  193.       background-color: #FFF;
  194.       height: 1px;
  195.       z-index: 10;
  196.       border-bottom: 1px solid #d2d2d2; }
  197.     #messages .message:before {
  198.       content: '';
  199.       position: absolute;
  200.       bottom: -5px;
  201.       left: 0;
  202.       right: 0;
  203.       background-color: #FFF;
  204.       height: 1px;
  205.       z-index: 10;
  206.       border-bottom: 1px solid #d2d2d2; }
  207.   #messages img {
  208.     position: absolute;
  209.     display: block;
  210.     -webkit-border-radius: 6px;
  211.     -moz-border-radius: 6px;
  212.     -ms-border-radius: 6px;
  213.     -o-border-radius: 6px;
  214.     border-radius: 6px;
  215.     -webkit-box-shadow: 0px 0px 10px black inset;
  216.     -moz-box-shadow: 0px 0px 10px black inset;
  217.     box-shadow: 0px 0px 10px black inset; }
  218.   #messages .info {
  219.     margin-left: 65px; }
  220.   #messages strong {
  221.     font-weight: bold;
  222.     color: #4e4e4e;
  223.     font-size: 14px; }
  224.   #messages p {
  225.     margin-bottom: 10px;
  226.     font-size: 14px; }
  227.   #messages .date {
  228.     font-size: 12px;
  229.     color: #ababab;
  230.     position: absolute;
  231.     top: 10px;
  232.     right: 10px; }
  233.   #messages .sep {
  234.     height: 20px; }
  235.  
  236. #msgtpl {
  237.   display: none; }
  238.  
  239. #login {
  240.   background-color: rgba(0, 0, 0, 0.8);
  241.   position: fixed;
  242.   top: 0;
  243.   left: 0;
  244.   right: 0;
  245.   bottom: 0;
  246.   z-index: 2000; }
  247.   #login #loginform {
  248.     position: absolute;
  249.     left: 0;
  250.     right: 0;
  251.     top: 50%;
  252.     margin-top: -55px;
  253.     text-align: center; }
  254.     #login #loginform input {
  255.       color: #FFF;
  256.       border: 1px solid rgba(0, 0, 0, 0.4);
  257.       background-color: rgba(0, 0, 0, 0.4);
  258.       height: 30px;
  259.       outline: none;
  260.       padding: 0 5px;
  261.       -webkit-border-radius: 6px;
  262.       -moz-border-radius: 6px;
  263.       -ms-border-radius: 6px;
  264.       -o-border-radius: 6px;
  265.       border-radius: 6px;
  266.       -webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1);
  267.       -moz-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1);
  268.       box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1); }
  269.       #login #loginform input::-webkit-input-placeholder {
  270.         color: rgba(255, 255, 255, 0.4);
  271.         -webkit-transition-duration: 0.3s;
  272.         -moz-transition-duration: 0.3s;
  273.         -ms-transition-duration: 0.3s;
  274.         -o-transition-duration: 0.3s;
  275.         transition-duration: 0.3s; }
  276.       #login #loginform input:focus::-webkit-input-placeholder {
  277.         filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  278.         opacity: 0; }
  279.   #login h1 {
  280.     font-size: 50px;
  281.     color: #FFF; }
  282.   #login p {
  283.     color: #FFF;
  284.     font-size: 16px;
  285.     padding: 20px;
  286.     filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  287.     opacity: 0.7; }
  288.  
  289. @-moz-keyframes fadeInUp {
  290.   0% {
  291.     -moz-transform: translateY(20px);
  292.     transform: translateY(20px);
  293.     opacity: 0; }
  294.  
  295.   100% {
  296.     -moz-transform: translateY(0);
  297.     transform: translateY(0);
  298.     opacity: 1; } }
  299.  
  300. @-webkit-keyframes fadeInUp {
  301.   0% {
  302.     -webkit-transform: translateY(20px);
  303.     transform: translateY(20px);
  304.     opacity: 0; }
  305.  
  306.   100% {
  307.     -webkit-transform: translateY(0);
  308.     transform: translateY(0);
  309.     opacity: 1; } }
  310.  
  311. @-o-keyframes fadeInUp {
  312.   0% {
  313.     -o-transform: translateY(20px);
  314.     transform: translateY(20px);
  315.     opacity: 0; }
  316.  
  317.   100% {
  318.     -o-transform: translateY(0);
  319.     transform: translateY(0);
  320.     opacity: 1; } }
  321.  
  322. @-ms-keyframes fadeInUp {
  323.   0% {
  324.     -ms-transform: translateY(20px);
  325.     transform: translateY(20px);
  326.     opacity: 0; }
  327.  
  328.   100% {
  329.     -ms-transform: translateY(0);
  330.     transform: translateY(0);
  331.     opacity: 1; } }
  332.  
  333. @keyframes fadeInUp {
  334.   0% {
  335.     transform: translateY(20px);
  336.     opacity: 0; }
  337.  
  338.   100% {
  339.     transform: translateY(0);
  340.     opacity: 1; } }
  341.  
  342. @-moz-keyframes fadeInRight {
  343.   0% {
  344.     -moz-transform: translateX(20px);
  345.     transform: translateX(20px);
  346.     opacity: 0; }
  347.  
  348.   100% {
  349.     -moz-transform: translateX(0);
  350.     transform: translateX(0);
  351.     opacity: 1; } }
  352.  
  353. @-webkit-keyframes fadeInRight {
  354.   0% {
  355.     -webkit-transform: translateX(20px);
  356.     transform: translateX(20px);
  357.     opacity: 0; }
  358.  
  359.   100% {
  360.     -webkit-transform: translateX(0);
  361.     transform: translateX(0);
  362.     opacity: 1; } }
  363.  
  364. @-o-keyframes fadeInRight {
  365.   0% {
  366.     -o-transform: translateX(20px);
  367.     transform: translateX(20px);
  368.     opacity: 0; }
  369.  
  370.   100% {
  371.     -o-transform: translateX(0);
  372.     transform: translateX(0);
  373.     opacity: 1; } }
  374.  
  375. @-ms-keyframes fadeInRight {
  376.   0% {
  377.     -ms-transform: translateX(20px);
  378.     transform: translateX(20px);
  379.     opacity: 0; }
  380.  
  381.   100% {
  382.     -ms-transform: translateX(0);
  383.     transform: translateX(0);
  384.     opacity: 1; } }
  385.  
  386. @keyframes fadeInRight {
  387.   0% {
  388.     transform: translateX(20px);
  389.     opacity: 0; }
  390.  
  391.   100% {
  392.     transform: translateX(0);
  393.     opacity: 1; } }
clone this paste RAW Paste Data