Zeppasaurus

Call of the Wild CSS (None)

Mar 12th, 2022 (edited)
46
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.31 KB | None | 0 0
  1. :root {
  2. --bgcolor: #c6c7cf;
  3. --bordercolor: #51525a;
  4. --borderbr: 5px;
  5.  
  6. --bannertxt: 900 25px Times New Roman;
  7. --bannertxtcolor: #e0e0e0;
  8. --bannertop: 75px;
  9. --bannerleft: 65px;
  10. --bannerimg: url("https://img.nickpic.host/AGfwfd.jpg");
  11.  
  12. --h1txt: bold italic 16px Times New Roman;
  13. --h1color: #536780;
  14. --h2txt: italic 12px Times New Roman;
  15. --h2color: #536780;
  16.  
  17. --scrollbgcolor: #8e8e94;
  18. --scrollcolor: #51525a;
  19. --scrollbr: 0px 3px 3px 0px;
  20. }
  21.  
  22. .intro::-webkit-scrollbar, .rules::-webkit-scrollbar, .ranks::-webkit-scrollbar, .spotlights::-webkit-scrollbar, .other1::-webkit-scrollbar, .other2::-webkit-scrollbar {
  23. width: 8px;
  24. }
  25.  
  26. .intro::-webkit-scrollbar-track, .rules::-webkit-scrollbar-track, .ranks::-webkit-scrollbar-track, .spotlights::-webkit-scrollbar-track, .other1::-webkit-scrollbar-track, .other2::-webkit-scrollbar-track {
  27. background: var(--scrollbgcolor);
  28. border-radius: var(--scrollbr);
  29. }
  30.  
  31. .intro::-webkit-scrollbar-thumb, .rules::-webkit-scrollbar-thumb, .ranks::-webkit-scrollbar-thumb, .spotlights::-webkit-scrollbar-thumb, .other1::-webkit-scrollbar-thumb, .other2::-webkit-scrollbar-thumb {
  32. background-color: var(--scrollcolor);
  33. border-radius: var(--scrollbr);
  34. }
  35.  
  36. h1 {
  37. font: var(--h1txt);
  38. color: var(--h1color);
  39. }
  40.  
  41. h2 {
  42. font: var(--h2txt);
  43. color: var(--h2color);
  44. text-transform: uppercase;
  45. }
  46.  
  47. .container {
  48. width: 100%;
  49. height: 1125px;
  50. }
  51.  
  52. .banner {
  53. position: absolute;
  54. padding: 10px;
  55. left: 212px;
  56. width: 460px;
  57. height: 230px;
  58. background-image: var(--bannerimg);
  59. background-size: cover;
  60. background-repeat: no-repeat;
  61. border: solid;
  62. border-color: var(--bordercolor);
  63. border-radius: var(--borderbr);
  64. }
  65.  
  66. .bannertext {
  67. margin-top: var(--bannertop);
  68. margin-left: var(--bannerleft);
  69. font: var(--bannertxt);
  70. text-transform: uppercase;
  71. color: var(--bannertxtcolor);
  72. }
  73.  
  74. .intro {
  75. position: absolute;
  76. padding: 10px;
  77. top: 315px;
  78. left: 212px;
  79. width: 460px;
  80. height: 120px;
  81. overflow: auto;
  82. text-align: justify;
  83. background: var(--bgcolor);
  84. border: solid;
  85. border-color: var(--bordercolor);
  86. border-radius: var(--borderbr);
  87. }
  88.  
  89. .rules {
  90. position: absolute;
  91. padding: 10px;
  92. top: 475px;
  93. left: 212px;
  94. width: 210px;
  95. height: 200px;
  96. overflow: auto;
  97. text-align: justify;
  98. background: var(--bgcolor);
  99. border: solid;
  100. border-color: var(--bordercolor);
  101. border-radius: var(--borderbr);
  102. }
  103.  
  104. .ranks {
  105. position: absolute;
  106. padding: 10px;
  107. top: 475px;
  108. left: 460px;
  109. width: 212px;
  110. height: 200px;
  111. overflow: auto;
  112. text-align: justify;
  113. background: var(--bgcolor);
  114. border: solid;
  115. border-color: var(--bordercolor);
  116. border-radius: var(--borderbr);
  117. }
  118.  
  119. .spotlights {
  120. position: absolute;
  121. padding: 10px;
  122. top: 715px;
  123. left: 212px;
  124. width: 460px;
  125. height: 135px;
  126. overflow: auto;
  127. text-align: justify;
  128. background: var(--bgcolor);
  129. border: solid;
  130. border-color: var(--bordercolor);
  131. border-radius: var(--borderbr);
  132. }
  133.  
  134. .spotlights img {
  135. white-space: nowrap;
  136. margin: auto;
  137. margin-left: 8px;
  138. padding: 10px;
  139. width: 58px;
  140. border-radius: 50px;
  141. }
  142.  
  143. .other1 {
  144. position: absolute;
  145. padding: 10px;
  146. top: 890px;
  147. left: 212px;
  148. width: 210px;
  149. height: 200px;
  150. overflow: auto;
  151. text-align: justify;
  152. background: var(--bgcolor);
  153. border: solid;
  154. border-color: var(--bordercolor);
  155. border-radius: var(--borderbr);
  156. }
  157.  
  158. .other2 {
  159. position: absolute;
  160. padding: 10px;
  161. top: 890px;
  162. left: 460px;
  163. width: 212px;
  164. height: 200px;
  165. overflow: auto;
  166. text-align: justify;
  167. background: var(--bgcolor);
  168. border: solid;
  169. border-color: var(--bordercolor);
  170. border-radius: var(--borderbr);
  171. }
  172.  
  173. .credits {
  174. position: absolute;
  175. padding: 10px;
  176. top: 1130px;
  177. left: 212px;
  178. width: 460px;
  179. height: 16px;
  180. font-size: 9px;
  181. text-transform: uppercase;
  182. text-align: center;
  183. background: var(--bgcolor);
  184. border: solid;
  185. border-color: var(--bordercolor);
  186. border-radius: var(--borderbr);
  187. }
Add Comment
Please, Sign In to add comment