Advertisement
Guest User

css26/05

a guest
May 26th, 2018
92
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.20 KB | None | 0 0
  1. #playground {
  2. width: 640px;
  3. height: 480px;
  4. background-color: #000;
  5. position: static;
  6. display: inline-block;
  7. position: absolute;
  8. left: 30%;
  9. top: 20%;
  10. z-index:-1;
  11. }
  12. #muro{
  13.  
  14. position: relative;
  15. z-index: 100;
  16.  
  17. }
  18.  
  19. #salirRanking{
  20. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  21. transform: translate(900%, 1300%);
  22. -ms-transform: translate(-50%, -50%);
  23. background-color: #f1f1f1;
  24. color: black;
  25. font-size: 25px;
  26. padding: 10px 30px;
  27. font-family:Tw Cen MT black;
  28. cursor: pointer;
  29. border-radius: 5px;
  30. text-align: center;
  31.  
  32. }
  33. #salirRanking:hover {
  34. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  35. color: white;
  36.  
  37. }
  38. #actualizar-btn{
  39. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  40. transform: translate(20%, 10%);
  41. -ms-transform: translate(-50%, -50%);
  42. background-color: #f1f1f1;
  43. color: black;
  44. font-size: 16px;
  45. padding: 16px 30px;
  46. font-family:Tw Cen MT;
  47. cursor: pointer;
  48. border-radius: 5px;
  49. text-align: center;
  50. }
  51. #serpiente{
  52. position:relative;
  53. transform: translate(130%, 33.5%);
  54. z-index:100;
  55. }
  56.  
  57. #actualizar-btn:hover {
  58. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  59. color: white;
  60.  
  61. }
  62. #crear-btn{
  63. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  64. transform: translate(10%, 10%);
  65. -ms-transform: translate(-50%, -50%);
  66. background-color: #f1f1f1;
  67. color: black;
  68. font-size: 16px;
  69. padding: 16px 30px;
  70. font-family:Tw Cen MT;
  71. cursor: pointer;
  72. border-radius: 5px;
  73. text-align: center;
  74.  
  75. }
  76. #crear-btn:hover {
  77. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  78. color: white;
  79.  
  80. }
  81.  
  82. #ranking{
  83. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  84. transform: translate(430%, 100%);
  85.  
  86. background-color: #f1f1f1;
  87. color: black;
  88. font-size: 25px;
  89. padding: 16px 50px;
  90. font-family:Tw Cen MT black;
  91. cursor: pointer;
  92. border-radius: 5px;
  93. text-align: center;
  94.  
  95. }
  96. #ranking:hover {
  97. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  98. color: white;
  99.  
  100. }
  101. #buscar-btn{
  102. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  103. transform: translate(0%, 10%);
  104. -ms-transform: translate(-50%, -50%);
  105. background-color: #f1f1f1;
  106. color: black;
  107. font-size: 16px;
  108. padding: 16px 30px;
  109.  
  110. cursor: pointer;
  111. border-radius: 5px;
  112. text-align: center;
  113. font-family:Tw Cen MT;
  114. }
  115.  
  116. #buscar-btn:hover{
  117. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  118. color: white;
  119.  
  120. }
  121. #message{
  122. left:3%;
  123. position:relative;
  124. }
  125. #send-btn{
  126.  
  127. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  128. transform: translate(20%, 0%);
  129. -ms-transform: translate(-50%, -50%);
  130. background-color: #f1f1f1;
  131. color: black;
  132. font-size: 12px;
  133. padding: 5px 15px;
  134. font-family:Tw Cen MT;
  135. cursor: pointer;
  136. border-radius: 5px;
  137. text-align: center;
  138.  
  139. }
  140.  
  141. #send-btn:hover{
  142. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  143. color: white;
  144.  
  145. }
  146. #lista{
  147. display:inline-block;
  148. top:20%;
  149. left:1%;
  150. font-family:Tw Cen MT black;
  151. font-size:15px;
  152. position: absolute;
  153. border: 1px solid #CCCCCC;
  154. border-right-color: #999999;
  155. border-bottom-color: #999999;
  156. background-color:#ffffffba;
  157. height: 480px;
  158. overflow-y: scroll;
  159. padding-left: 10px;
  160. width: 10%;
  161.  
  162.  
  163. }
  164.  
  165. #console-container {
  166. position: absolute;
  167. z-index: -1;
  168. text-align: justify;
  169. margin-left: 15px;
  170. width: 300px;
  171. display:inline-block;
  172. background-color:#ffffffba;
  173. top:20%;
  174. left:11%;
  175. }
  176.  
  177. #selector{
  178.  
  179. position:relative;
  180. background-color: rgb(255, 255, 255);
  181. border: 3px solid #050505;
  182. z-index: 100;
  183. width:50%;
  184. font-family:Tw Cen MT;
  185.  
  186. transform:translate(0%,100%);
  187.  
  188. }
  189. #f{
  190. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  191. font-family:Tw Cen MT;
  192. transform: translate(0%, 0%);
  193. -ms-transform: translate(-50%, -50%);
  194. background-color: #f1f1f1;
  195. color: black;
  196. font-size: 12px;
  197. padding: 5px 15px;
  198. font-family:Tw Cen MT;
  199. cursor: pointer;
  200. border-radius: 5px;
  201. text-align: center;
  202. }
  203. #f:hover{
  204. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  205. color: white;
  206.  
  207. }
  208.  
  209. #d{
  210. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  211. font-family:Tw Cen MT;
  212. transform: translate(0%, 0%);
  213. -ms-transform: translate(-50%, -50%);
  214. background-color: #f1f1f1;
  215. color: black;
  216. font-size: 12px;
  217. padding: 5px 15px;
  218. font-family:Tw Cen MT;
  219. cursor: pointer;
  220. border-radius: 5px;
  221. text-align: center;
  222. }
  223. #d:hover{
  224. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  225. color: white;
  226.  
  227. }
  228. #m{
  229. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  230. font-family:Tw Cen MT;
  231. transform: translate(0%, 0%);
  232. -ms-transform: translate(-50%, -50%);
  233. background-color: #f1f1f1;
  234. color: black;
  235. font-size: 12px;
  236. padding: 5px 15px;
  237. font-family:Tw Cen MT;
  238. cursor: pointer;
  239. border-radius: 5px;
  240. text-align: center;
  241. }
  242. #m:hover{
  243. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  244. color: white;
  245.  
  246. }
  247.  
  248. #salir{
  249. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  250. font-family:Tw Cen MT;
  251. transform: translate(600%, 1650%);
  252. -ms-transform: translate(-50%, -50%);
  253. background-color: #f1f1f1;
  254. color: black;
  255. font-size: 15px;
  256. padding: 10px 30px;
  257. font-family:Tw Cen MT;
  258. cursor: pointer;
  259. border-radius: 5px;
  260. text-align: center;
  261.  
  262. }
  263. #salir:hover{
  264. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  265. color: white;
  266.  
  267. }
  268.  
  269. #comenzar{
  270. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  271. font-family:Tw Cen MT;
  272. transform: translate(350%, 1650%);
  273. -ms-transform: translate(-50%, -50%);
  274. background-color: #f1f1f1;
  275. color: black;
  276. font-size: 15px;
  277. padding: 10px 30px;
  278. font-family:Tw Cen MT;
  279. cursor: pointer;
  280. border-radius: 5px;
  281. text-align: center;
  282.  
  283. }
  284. #comenzar:hover{
  285. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);;
  286. color: white;
  287.  
  288. }
  289.  
  290. #console {
  291. border: 1px solid #CCCCCC;
  292. border-right-color: #999999;
  293. border-bottom-color: #999999;
  294. height: 453px;
  295. overflow-y: scroll;
  296. font-family:Tw Cen MT;
  297. font-size:15px;
  298. padding-left: 5px;
  299. padding-right: 5px;
  300. width: 100%;
  301. }
  302.  
  303. #console p {
  304. padding: 0;
  305. margin: 0;
  306. }
  307.  
  308. #partidas-container{
  309.  
  310. display:inline-block;
  311. top:20%;
  312. right:1%;
  313.  
  314. position: absolute;
  315. border: 1px solid #CCCCCC;
  316. border-right-color: #999999;
  317. border-bottom-color: #999999;
  318. background-color:#ffffffba;
  319. height: 480px;
  320. overflow-y: scroll;
  321. padding-right: 10px;
  322. width: 30%;
  323. z-index: -1;
  324. }
  325.  
  326.  
  327.  
  328.  
  329. #partidas div{
  330.  
  331. margin-left: 10px;
  332. margin-right: 10px;
  333. margin-top: 5%;
  334. margin-bottom: 20 px;
  335.  
  336. }
  337. body {
  338.  
  339. background: url(fondo.png)no-repeat fixed center center #333;
  340. background-size: cover;
  341. }
  342. #partidas{
  343. position: relative;
  344. margin-left: 10px;
  345. margin-right: 10px;
  346. margin-top: 50 px;
  347. text-align:justify;
  348. font-size: 17px;
  349. font-family:Tw Cen MT;
  350. z-index: -1;
  351. }
  352. #unirse-btn{
  353. -webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
  354. transform: translate(10%, 0%);
  355. -ms-transform: translate(-50%, -50%);
  356. background-color: #f1f1f1;
  357. color: black;
  358. font-size: 16px;
  359. padding: 10px 20px;
  360. font-family:Tw Cen MT;
  361. cursor: pointer;
  362. border-radius: 5px;
  363. text-align: center;
  364. }
  365.  
  366. #unirse-btn:hover{
  367. background: linear-gradient(to right, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);;
  368. color: white;
  369.  
  370. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement