Advertisement
Guest User

nostalgic myspace93net layout #2

a guest
Jul 24th, 2020
324
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.21 KB | None | 0 0
  1. body{
  2. background-image: url(https://38.media.tumblr.com/c0622127e2ced31c8f084874201b6026/tumblr_n727odK1LZ1smlzfno1_250.gif);
  3. font-family: Verdana;
  4. text-align:center;
  5. color:white;
  6. text-shadow: 2px 2px orange;
  7. padding-top: 45px;
  8. font-size: 15px;
  9. }
  10.  
  11. p{
  12. margin: 0;
  13. }
  14.  
  15. img{
  16. image-rendering: auto;
  17. image-rendering: crisp-edges;
  18. image-rendering: pixelated;
  19. image-orientation: from-image;
  20. }
  21.  
  22. #container{
  23. max-width: 1024px;
  24. margin-left: auto;
  25. margin-right: auto;
  26. }
  27.  
  28. .box{
  29. border: none;
  30. overflow: hidden;
  31. }
  32.  
  33. button{
  34. width: max-content;
  35. }
  36.  
  37. .avatar{
  38. width:200px;
  39. margin-right: 20px;
  40. cursor: zoom-in;
  41. image-orientation: from-image;
  42. }
  43.  
  44. .boxInfo{
  45. border: 3px solid orange;
  46. margin-bottom: 20px;
  47. margin-top: 20px;
  48. }
  49.  
  50. .boxHead{
  51. background-image: url(https://i.gifer.com/W1kC.gif);
  52. color: white;
  53. padding: 3px;
  54. padding-bottom: 4px;
  55. padding-left: 6px;
  56. }
  57.  
  58. .boxInfo table {
  59. width: 100%;
  60. }
  61.  
  62. .boxInfo td:nth-child(1) {
  63. background-image: url(https://i.gifer.com/W1kC.gif);
  64. width: 25%;
  65. color: #000;
  66. font-weight: bold;
  67. padding: 2px;
  68. }
  69.  
  70. .boxInfo td:nth-child(2) {
  71. background-image: url(https://i.gifer.com/W1kC.gif);
  72. color: #000;
  73. padding: 2px;
  74. }
  75.  
  76. .rightHead{
  77. border: 3px solid orange;
  78. background-image: url(https://i.pinimg.com/originals/f4/39/94/f43994d707423c6682ae3e97f4059919.gif);
  79. color: #fff;
  80. padding-left: 4px;
  81. }
  82.  
  83. .topLeft{
  84. float: left;
  85. border: 5px solid black;
  86. background-image: url(https://cdn.lowgif.com/small/9e5ec24cd7f92eec-background-cute-pink-stars-white-animated-picture-codes-and.gif);
  87. width: calc( 39% - 20px );
  88. padding:10px;
  89. }
  90.  
  91. .topRight{
  92. float: right;
  93. border: 5px solid black;
  94. background-image: url(https://rs187.pbsrc.com/albums/x54/Leicpv/Background-mini/glitter-56.gif~c200);
  95. width: calc( 57% - 20px );
  96. padding:10px;
  97. }
  98.  
  99. .extended{
  100. border: 3px solid black;
  101. background-image: url(https://www.commentnation.com/backgrounds/images/orange_glitter_hearts_seamless_background.gif);
  102. color:white;
  103. text-align: center;
  104. margin-bottom: 20px;
  105. margin-top: 15px;
  106. }
  107.  
  108. .extended a{
  109. text-decoration: none;
  110. }
  111.  
  112. .blurbs{
  113. margin-bottom: 20px;
  114. }
  115.  
  116. h4{
  117. color: white;
  118. margin-bottom: 0px;
  119. }
  120.  
  121. .fwiendCount{
  122. color: #fff;
  123. }
  124.  
  125. .fwiendCounter{
  126. margin-top: 10px;
  127. margin-bottom: 20px;
  128. }
  129.  
  130. .boxButton{
  131. display: inline-block;
  132. width: calc( 49% - 60px );
  133. padding-left: 30px;
  134. height: 24px;
  135. font-size: small;
  136. color: white;
  137. padding-top: 7px;
  138. }
  139.  
  140. .fwiendFace {
  141. max-width: 25%;
  142. filter: grayscale(100%);
  143. display: inline-grid;
  144. width: calc( 24% - 6px );
  145. padding: 3px;
  146. text-align: center;
  147. }
  148.  
  149. .fwiendFace b{
  150. overflow: hidden;
  151. }
  152.  
  153. .fwiendFace img {
  154. width: calc( 100% );
  155. }
  156.  
  157. #top{
  158. padding-left: 10px;
  159. padding-right: 10px;
  160. }
  161.  
  162. #top a{
  163. text-decoration: none;
  164. }
  165.  
  166. #viewFriends{
  167. margin-top: 20px;
  168. margin-bottom: 20px;
  169. text-align: right;
  170. }
  171.  
  172. #userWall{
  173. margin-top: 10px;
  174. word-wrap:break-word;
  175. display:inline-block;
  176. overflow: hidden;
  177. width: 100%;
  178. }
  179.  
  180. #commentInput{
  181. color:orange;
  182. background-image: url(https://data.whicdn.com/images/31024098/original.gif);
  183. width: calc( 100% - 6px );
  184. margin: 0;
  185. margin-top: 10px;
  186. height: 100px;
  187. }
  188.  
  189. form{
  190. margin-bottom: 20px;
  191. text-align: right;
  192. }
  193.  
  194. textarea, textarea:focus {
  195. outline: none;
  196. box-shadow:none !important;
  197. border:3px solid #000;
  198. }
  199.  
  200. #footer{
  201. font-size:small;
  202. width: 100%;
  203. bottom: 0px;
  204. display: grid;
  205. text-align: center;
  206. }
  207.  
  208. #footer a {
  209. text-decoration: none;
  210. }
  211.  
  212. #sMsg {
  213. background-repeat: no-repeat;
  214. background-image: url(img/sendMailIcon.gif);
  215. }
  216. #block {
  217. background-repeat: no-repeat;
  218. background-image: url(img/blockuser.gif);
  219. }
  220. #report {
  221. background-repeat: no-repeat;
  222. background-image: url(img/icon_rank_user4.gif);
  223. }
  224. #add {
  225. background-repeat: no-repeat;
  226. background-image: url(img/addFriendIcon.gif);
  227. }
  228.  
  229. #mailboxContent{
  230. padding: 3px;
  231. }
  232.  
  233. .friendRequests{
  234. display: inline-grid;
  235. width: 43%;
  236. background: orange;
  237. padding: 10px;
  238. border: 3px solid #fff;
  239. max-width: calc( 25% - 85px );
  240. text-align: center;
  241. }
  242.  
  243. .allfwieds{
  244. width: 100%;
  245. margin-bottom: 30px;
  246. }
  247.  
  248. .allfwiedsItem{
  249. max-width: calc( 25% - 85px );
  250. display: inline-grid;
  251. background: orange;
  252. border: 6px solid white;
  253. padding: 10px;
  254. overflow: hidden;
  255. text-align: center;
  256. }
  257.  
  258. .allfwiedsItem img{
  259.  
  260. }
  261.  
  262. .allfwiedsItem a {
  263. text-decoration: none;
  264. }
  265.  
  266. .allfwiedsItem button{
  267. width: auto;
  268. }
  269.  
  270. .allfwiedsItemTop{
  271. background: orange;
  272. }
  273.  
  274. .short{
  275. margin-top: -15px;
  276. }
  277.  
  278. div#header{
  279. background-image: url(https://i.pinimg.com/originals/f4/39/94/f43994d707423c6682ae3e97f4059919.gif);
  280. text-align:center;
  281. color: #fff;
  282. position: fixed;
  283. width: calc( 100% - 15px );
  284. height: 22px;
  285. padding: 5px;
  286. left: 0px;
  287. top: 0px;
  288. margin-bottom: 40px;
  289. border-bottom: 1px solid black;
  290. padding-left: 10px;
  291. padding-top: 6px;
  292. overflow:hidden;
  293. z-index: 300;
  294. }
  295.  
  296. div#hSub {
  297. font-family: Verdana;
  298. background: #202020;
  299. color: white;
  300. text-align: center;}
  301.  
  302. .logo{
  303. font-size:0;
  304. }
  305.  
  306. .logo::after{
  307. color:#fff;
  308. text-align:center;
  309. content:"it just feels sooooo good..";
  310. font-size:15px;
  311. font-weight:600;
  312. }
  313.  
  314. div#online img {
  315. opacity: 0;
  316. }
  317.  
  318. div#online {
  319. background-image: url(https://66.media.tumblr.com/b6bbbaa371cbb7a83720d9b0b6a6d75d/39e0e609e6aeb6c3-9f/s100x200/911239c172d987b047c832cafc7df99311c2009c.gifv);
  320. background-repeat: no-repeat;
  321. margin-left:25px;
  322. }
  323.  
  324. #header a:not(.logo) {
  325. margin-left:10px;
  326. color:#fff;
  327. font-size: small;
  328. text-decoration:none;
  329. }
  330.  
  331. a.logo{
  332. color:white;
  333. text-decoration:none;
  334. }
  335.  
  336. #header img {
  337. top: 9px;
  338. left: 9px;
  339. position: absolute;
  340. }
  341.  
  342. .inboxList{
  343. border-bottom: 1px gray solid;
  344. padding: 10px;
  345. background: orange;
  346. }
  347.  
  348. .inboxListContainer{
  349. border-top: 1px gray solid;
  350. border-left: 1px gray solid;
  351. border-right: 1px gray solid;
  352. }
  353.  
  354. .inboxMsg{
  355. padding: 10px;
  356. background: orange;
  357. margin-top: 20px;
  358. border: 1px gray solid;
  359. }
  360.  
  361. #mail form{
  362. text-align: left;
  363. }
  364.  
  365. #mail{
  366. padding: 20px;
  367. }
  368.  
  369. .url{
  370. border: solid 3px black;
  371. padding: 2px;
  372. }
  373.  
  374. .tableLeft{
  375. background-image: url(https://66.media.tumblr.com/125fc5bfe3a19d16d1e3745bba376f95/tumblr_oibkeo3ELs1s3ba5to2_500.gifv);
  376. width: 25%;
  377. padding: 10px;
  378. vertical-align: top;
  379. overflow: hidden;
  380. }
  381.  
  382. .tableLeft > a > div {
  383. overflow: hidden;
  384. max-width: 115px;
  385. text-align: center;
  386. }
  387.  
  388. .tableRight{
  389. width: 75%;
  390. background-image: url(https://data.whicdn.com/images/8429154/original.gif);
  391. padding: 10px;
  392. vertical-align: top;
  393. overflow-wrap: anywhere;
  394. }
  395.  
  396. .tableLeft img{
  397. max-width: calc(100%);
  398. image-orientation: from-image;
  399. }
  400.  
  401. .tableLeft a{
  402. text-decoration: none;
  403. }
  404.  
  405. .songName{
  406. margin-top: 0px;
  407. font-size: small;
  408. }
  409.  
  410. .player{
  411. padding: 4px;
  412. margin-top: 20px;
  413. margin-bottom: 20px;
  414. background-image: url(https://31.media.tumblr.com/afa79828314bb5beb1b0d44e5daa89a6/tumblr_mr6gcdHUq21rvaseko1_500.gif);
  415. color: #000;
  416. width: calc(100% - 10px );
  417. border: 1px solid #999;
  418. }
  419.  
  420. audio {
  421. /* border: solid 1px #fff; */
  422. /* padding: 2px; */
  423. margin-bottom: 0px;
  424. margin-top: 5px;
  425. width: 100%;
  426. height: 30px;
  427. /* background: #fff; */
  428. outline: none;
  429. margin-bottom: -3px;
  430. /* filter: sepia(0%) saturate(100%) grayscale(0) contrast(100%) invert(100%); */
  431. }
  432.  
  433. a.list{
  434. color: #fff;
  435. text-decoration: none;
  436. }
  437. a.list:hover{
  438. color: orange;
  439. font-weight: bold;
  440. }
  441.  
  442. .blogs, .blog{
  443. margin-bottom: 20px;
  444. }
  445.  
  446. .blogs div, .blog div{
  447. margin-bottom: 10px;
  448. }
  449.  
  450. .blog {
  451. background-image: url(https://i.gifer.com/W1kC.gif);
  452. padding: 15px;
  453. }
  454.  
  455. .blogCorpus{
  456.  
  457. }
  458.  
  459. .blog p {
  460. margin: 1em;
  461. }
  462.  
  463. .blogCard{
  464. width: calc( 25% - 20px );
  465. }
  466.  
  467. .blogCard .avatar {
  468. width: 100%;
  469. margin-right: 0px;
  470. image-orientation: from-image;
  471. }
  472.  
  473. .blogPost{
  474. width: calc( 72% - 20px );
  475. }
  476.  
  477. .blogTitle{
  478. padding-left: 10px;
  479. padding-right: 10px;
  480. padding-top: 20px;
  481. }
  482.  
  483. /* Start http://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/people/peo-6/peo684.cur), auto !important;} /* End http://www.cursors-4u.com */
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement