Enter your name to send a positive message to the next visitor. Only after that you will receive a positive message from the previous visitor. https://www.victorgiers.com/pronoia
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 2.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. /* ==============================================================================================
  2. This copyright notice must be kept untouched in the stylesheet at all times.
  3. The original version of this stylesheet and the associated (x)html
  4. is available at http://www.script-tutorials.com/night-sky-with-twinkling-stars/
  5. Copyright (c) Script Tutorials. All rights reserved.
  6. This stylesheet and the associated (x)html may be modified in any way to fit your requirements.
  7. ================================================================================================= */
  8. * {
  9. margin: 0;
  10. padding: 0;
  11. }
  12. body{
  13. background-color:rgba(33, 33, 33, 1);
  14. color:#ffffff;
  15. display:block;
  16. font: 18px/1.3 Arial,sans-serif;
  17. caret-color: rgba(255,255,255,0.2);
  18. overflow: hidden;
  19. }
  20. input[type=text] {
  21. background-color: rgba(255,255,255, 0.0);
  22. border: 0;
  23. border-bottom: 4px solid rgba(255,255,255, 0.2);
  24. color: white;
  25. height: 80px;
  26. width:500px;
  27. font: 50px/1.3 Arial,sans-serif;
  28. text-align: center;
  29. }
  30. input::placeholder {
  31. color: rgba(255,255,255, 0.4);
  32. }
  33. h2{
  34. margin-top: 30px;
  35. text-align: center;
  36. }
  37. header h2{
  38. font-size: 22px;
  39. margin: 0 auto;
  40. padding: 10px 0;
  41. width: 80%;
  42. text-align: center;
  43. }
  44. header a, a:visited {
  45. text-decoration:none;
  46. color:#fcfcfc;
  47. }
  48. @keyframes move-twink-back {
  49. from {background-position:0 0;}
  50. to {background-position:-10000px 5000px;}
  51. }
  52. @-webkit-keyframes move-twink-back {
  53. from {background-position:0 0;}
  54. to {background-position:-10000px 5000px;}
  55. }
  56. @-moz-keyframes move-twink-back {
  57. from {background-position:0 0;}
  58. to {background-position:-10000px 5000px;}
  59. }
  60. @-ms-keyframes move-twink-back {
  61. from {background-position:0 0;}
  62. to {background-position:-10000px 5000px;}
  63. }
  64. #content{
  65. color:#fff;
  66. text-align: center;
  67. position:absolute;
  68. top:35%;
  69. left:0;
  70. right:0;
  71. bottom:0;
  72. width:100%;
  73. height:100%;
  74. display:block;
  75. z-index:2;
  76. }
  77. .stars, .twinkling {
  78. position:absolute;
  79. top:0;
  80. left:0;
  81. right:0;
  82. bottom:0;
  83. width:100%;
  84. height:100%;
  85. display:block;
  86. }
  87. .stars {
  88. background:#000 url(images/stars.png) repeat top center;
  89. z-index:0;
  90. }
  91. .twinkling{
  92. background:transparent url(images/twinkling.png) repeat top center;
  93. z-index:1;
  94. -moz-animation:move-twink-back 500s linear infinite;
  95. -ms-animation:move-twink-back 500s linear infinite;
  96. -o-animation:move-twink-back 500s linear infinite;
  97. -webkit-animation:move-twink-back 500s linear infinite;
  98. animation:move-twink-back 500s linear infinite;
  99. }