API tools faq
paste
Advertisement
nofacesface

M U S I C P A G E (W H I T E)

nofacesface
Nov 28th, 2013
546
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 21.99 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!--PAGE BY NO-FACES-FACE
  5. steal and I'll find you and punch you in the throat  (◡‿◡✿)
  6. -->
  7.  
  8. <head>
  9.  
  10. <title>W H I T E</title> <!-- TITLE OF PAGE -->
  11. <link rel="shortcut icon" href="http://static.tumblr.com/cbjpgjf/N1Imwy86z/tumblr_mqretyucom1rl9td5o1_500.jpg"> <!--REPLACE URL BETWEEN QUOTATIONS WITH DESIRED FAVICON -->
  12.  
  13. <style type="text/css">
  14.  
  15. #tumblr_controls {
  16. position: fixed !important;
  17. }
  18.  
  19. iframe#tumblr_controls { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%); opacity:0.2; right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  20.  
  21. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.2s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  22.  
  23.  
  24. ::-webkit-scrollbar {width: 3px;height:5px;background: none;}
  25. ::-webkit-scrollbar-thumb {background-color:#aaa; /* COLOR OF THE SCROLLBAR */ }
  26.  
  27. /* GENERAL */
  28.  
  29.  
  30. body {
  31.         background-color: #fff; /* COLOR OF BG */
  32.  
  33.         background-image: url(http://25.media.tumblr.com/tumblr_m37lmqN7UD1rsx5i6o3_250.png); /* BG PICTURE (REPLACE THE URL IN THE
  34.         PARENTHESIS) */
  35.         margin: 0;
  36.         word-wrap: break-word;
  37.         background-attachment: fixed;        
  38.  
  39. }
  40.  
  41.  
  42. a:link, a:active, a:visited{text-decoration: none;color: #222; /* LINK COLOR */
  43. -webkit-transition: all 0.7s ease;transition: all 0.7s ease;
  44. -moz-transition: all 0.7s ease;-o-transition: all 0.7s ease;}
  45.  
  46. a:hover{color: #999;} /* LINK HOVER COLOR */
  47.  
  48.  
  49. .namecircle {
  50.     border-radius: 500px;
  51.     overflow: hidden;
  52.     position:fixed;
  53. width:280px; height:280px;
  54. margin-top: 180px; margin-left: 85px;
  55. }
  56.  
  57. .nameimage {
  58.     position:absolute;
  59. width:280px; height:280px;
  60. margin-top: 0px; margin-left: 0px;
  61. border-radius: 500px;
  62. }
  63.  
  64. .nameimage img {
  65.     position: absolute;
  66.     width: 100%;
  67.     height: 280px;
  68.     border-radius: 500px;
  69. }
  70.  
  71. .nameline {
  72.     position: absolute;
  73.     width: 229px;
  74.     height: 19px;
  75.     border-bottom: 1px dashed #999; /* COLOR OF LINES */
  76.     margin-top: 200px;
  77.     margin-left: 24px;
  78. }
  79.  
  80. .aboutbox {
  81.     opacity: 0;
  82.     overflow: hidden;
  83.     position: absolute;
  84. width:280px; height:220px;
  85. border-top-left-radius: 500px;
  86. border-top-right-radius: 500px;
  87. margin-top: 0px; margin-left: 0px;
  88.  background-color: rgba(255,255,255,0.5);
  89.      -webkit-transition: all 0.7s ease;transition: all 0.7s ease;
  90. -moz-transition: all 0.7s ease;-o-transition: all 0.7s ease;
  91.    
  92. }
  93.  
  94. .both:hover .aboutbox {
  95.     opacity: 1;
  96. }
  97.  
  98. .content {
  99.     overflow: hidden;
  100.      position: absolute;
  101.     width: 700px;
  102.     height: 350px;
  103.     margin-top: 250px;
  104.     margin-left: 310px;
  105.         -webkit-transition: all 5s ease;transition: all 5s ease;
  106. -moz-transition: all 5s ease;-o-transition: all 5s ease;
  107. opacity: 1;
  108. }
  109.  
  110.  
  111. .mainline {
  112.     position: absolute;
  113.     width: 640px;
  114.     height: 0px;
  115.     border-bottom: 1px dashed #999; /* COLOR OF LINES */
  116.     margin-top: 149px;
  117.     margin-left: 0px;
  118.     -webkit-transition: all 0.5s ease;transition: all 0.5s ease;
  119. -moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;
  120. }
  121.  
  122.  
  123. .musicwrapper {
  124.     overflow: hidden;
  125.     opacity: 1;
  126.     position: absolute;
  127.     width: 250px;
  128.     height: 120px;
  129.     margin-top: -120px;
  130.     margin-left: 80px;
  131.       -webkit-transition: all .5s ease;transition: all .5s ease;
  132. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  133. }
  134.  
  135. .musicline {
  136.     position: absolute;
  137.     width: 0px;
  138.     height: 150px;
  139.     margin-top: 40px;
  140.     margin-left: 15px;
  141.       border-left: 1px dashed #999; /* COLOR OF LINES */
  142.    
  143. }
  144.  
  145. .musicc {
  146.     overflow: hidden;
  147.       position: absolute;
  148.     width: 35px;
  149.     height: 35px;
  150.     margin-top: 0px;
  151.     margin-left: 0px;
  152.     border-radius: 500px;
  153. }
  154.  
  155. .musicc  img{
  156.      border-radius: 500px;
  157.     position: absolute;
  158.     width: 100%;
  159.     height: 35px;
  160. }
  161.  
  162. .musicplayer {
  163.          border-radius: 500px;
  164.     overflow: hidden;
  165.     opacity: 1;
  166.        position: absolute;
  167.     width: 35px;
  168.     height: 35px;
  169.     margin-top: 0px;
  170.     margin-left: 0px;
  171.         background-color: rgba(255,255,255,0.4);
  172.          -webkit-transition: all .5s ease;transition: all .5s ease;
  173. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  174. }
  175.  
  176. .musicc:hover .musicplayer {
  177.      background-color: rgba(255,255,255,0.5);
  178. }
  179.  
  180. .musicicon {
  181.     position: absolute;
  182.     width: 13px;
  183.     height: 11px;
  184.     margin-top: 12px;
  185.     margin-left: 11px;
  186.     background-color: none;
  187.         -webkit-transition: all .5s ease;transition: all .5s ease;
  188. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  189. }
  190.  
  191. .musicicon img {
  192.     position: absolute;
  193.     width: 100%;
  194.     height: 11px;
  195. }
  196.  
  197. .musicc:hover .musicicon {
  198.     margin-left: 40px;
  199. }
  200.  
  201. .musicplay {
  202.     position: absolute;
  203.     width: 20px;
  204.     height: 20px;
  205.     margin-top: 8px;
  206.     margin-left: -40px;
  207.     overflow: hidden;
  208.         -webkit-transition: all .5s ease;transition: all .5s ease;
  209. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  210. }
  211.  
  212. .musicc:hover .musicplay {
  213.     margin-left: 7px;
  214. }
  215.  
  216. .playerm {
  217.       position: absolute;
  218.    height: 16px;
  219.     width: 50px;
  220.     margin-top: -5px;
  221.     margin-left: -28px;
  222.    
  223. }
  224.  
  225. .playlistbox {
  226.     background: #eee;
  227.     overflow: hidden;
  228.     position: absolute;
  229.     width:250px;
  230.     height: 80px;
  231.     margin-top: 40px;
  232.     margin-left: 17px;}
  233.  
  234. .musicwrapper2 {
  235.     overflow: hidden;
  236.     opacity: 1;
  237.     position: absolute;
  238.     width: 250px;
  239.     height: 120px;
  240.     margin-top: -120px;
  241.     margin-left: 360px;
  242.       -webkit-transition: all .5s ease;transition: all .5s ease;
  243. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  244. }
  245.  
  246.  
  247.  
  248. .musicwrapper3 {
  249.     overflow: hidden;
  250.     opacity: 1;
  251.     position: absolute;
  252.     width: 290px;
  253.     height: 120px;
  254.     margin-top: 0px;
  255.     margin-left: 85px;
  256.       -webkit-transition: all .5s ease;transition: all .5s ease;
  257. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  258. }
  259.  
  260. .musicwrapper4 {
  261.     overflow: hidden;
  262.     opacity: 1;
  263.     position: absolute;
  264.     width: 290px;
  265.     height: 120px;
  266.     margin-top: 0px;
  267.     margin-left: 365px;
  268.       -webkit-transition: all .5s ease;transition: all .5s ease;
  269. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  270. }
  271.  
  272. .musicline2 {
  273.     position: absolute;
  274.     width: 0px;
  275.     height: 78px;
  276.     margin-top: 0px;
  277.     margin-left: 260px;
  278.       border-left: 1px dashed #999; /* COLOR OF LINES */
  279.    
  280. }
  281.  
  282. .musicc2 {
  283.     overflow: hidden;
  284.       position: absolute;
  285.     width: 35px;
  286.     height: 35px;
  287.     margin-top: 85px;
  288.     margin-left: 243px;
  289.     border-radius: 500px;
  290. }
  291.  
  292. .musicc2  img{
  293.      border-radius: 500px;
  294.     position: absolute;
  295.     width: 100%;
  296.     height: 35px;
  297. }
  298.  
  299. .musicplayer2 {
  300.       border-radius: 500px;
  301.     overflow: hidden;
  302.     opacity: 1;
  303.        position: absolute;
  304.     width: 35px;
  305.     height: 35px;
  306.     margin-top: 0px;
  307.     margin-left: 0px;
  308.     background-color: rgba(0,0,0,0.4);
  309.          -webkit-transition: all .5s ease;transition: all .5s ease;
  310. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  311. }
  312.  
  313. .musicc2:hover .musicplayer2 {
  314.      border-radius: 500px;
  315.   background-color: rgba(0,0,0,0.5);
  316. }
  317.  
  318. .musicicon2 {
  319.     position: absolute;
  320.     width: 13px;
  321.     height: 11px;
  322.     margin-top: 12px;
  323.     margin-left: 11px;
  324.     background-color: none;
  325.         -webkit-transition: all .5s ease;transition: all .5s ease;
  326. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  327. }
  328.  
  329. .musicicon2 img {
  330.     position: absolute;
  331.     width: 100%;
  332.     height: 11px;
  333. }
  334.  
  335. .musicc2:hover .musicicon2 {
  336.     margin-left: 40px;
  337. }
  338.  
  339. .musicplay2 {
  340.     position: absolute;
  341.     width: 20px;
  342.     height: 20px;
  343.     margin-top: 8px;
  344.     margin-left: -40px;
  345.     overflow: hidden;
  346.         -webkit-transition: all .5s ease;transition: all .5s ease;
  347. -moz-transition: all .5s ease;-o-transition: all .5s ease;
  348. }
  349.  
  350. .musicc2:hover .musicplay2 {
  351.     margin-left: 7px;
  352. }
  353.  
  354. .playlistbox2 {
  355.     background: #eee;
  356.     position: absolute;
  357.     width:233px;
  358.     height: 80px;
  359.     margin-top: 1px;
  360.     margin-left: 27px;
  361.     overflow: hidden;}
  362.    
  363.  
  364. .playfont {
  365.   text-align: left;
  366.     color: #9a9a9a; /* FONT COLOR OF PLAYLIST TEXT */
  367.     font-family: consolas;
  368.     font-style: oblique;
  369.     font-size: 8px;
  370.     letter-spacing: 2px;
  371.     text-transform: none;
  372.     padding: 2px;
  373.     margin-top: -3px;
  374.     margin-left: -10px;
  375. }
  376.  
  377. b{font-size: 11px;
  378. color: #666; /* FONT COLOR OF THE PLAYLIST TITLE */
  379. }
  380.  
  381. .barfont {
  382.   text-align: right;
  383.     color: #333; /* FONT COLOR OF PAGE TITLE */
  384.     font-family: consolas;
  385.     font-style: oblique;
  386.     font-size: 9px;
  387.     letter-spacing: 4px;
  388.     text-transform: uppercase;
  389.     padding: 5px;
  390. }
  391.  
  392. .descfont {
  393.   text-align: left;
  394.     color: #777;  /* FONT COLOR OF THE DESCRIPTION */
  395.     font-family: consolas;
  396.     font-style: oblique;
  397.     font-size: 10px; /* FONT SIZE OF THE DESCRIPTION */
  398.     letter-spacing: 2px;
  399.     text-transform: none;
  400.     padding: 50px;
  401. }
  402.  
  403. .c img{
  404.     padding-left: 2.5px;
  405.     padding-top: 2px;
  406.      border-radius: 500px;
  407.     opacity: 0;
  408.     width:25px;
  409. height: 25px;
  410. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  411. -o-transition: 0.5s ease;-moz-transition: 0.5s ease;}
  412.  
  413. .c{overflow: hidden; position:fixed;right:7px;bottom:7px; background-color: rgba(0,0,0,0.2);
  414. width: 30px; height: 30px; border-radius: 500px;}
  415.  
  416.  
  417. .c img:hover{
  418.     opacity: 1;
  419. }
  420.  
  421.  
  422.  
  423.  
  424.  
  425. </style>
  426. </head>
  427. <body>
  428.  
  429. <div class="both">
  430. <div class="namecircle">
  431. <div class="nameimage">
  432.  
  433. <!-- INSERT YOUR MAIN CIRCLE IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS BELOW-->
  434. <img src="http://static.tumblr.com/cbjpgjf/N1Imwy86z/tumblr_mqretyucom1rl9td5o1_500.jpg"></div>
  435. <!-- INSERT YOUR MAIN CIRCLE IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS ABOVE-->
  436.  
  437.     <div class="aboutbox">
  438.         <div class="descfont">
  439.         <!-- REPLACE DEFAULT DESCRIPTION WITH YOUR OWN BELOW-->
  440.         to create the playlists, i used <a href="http://www.sheepproductions.com/billy/">billy player</a>. if you have trouble with billy player, you can look <a href="http://cindie.tumblr.com/post/23938117761/billy-audio-player-tutorial">here</a> for direction. i've also made guidelines for customizing this page. you should set up a separate blog for testing. then you can transfer the code to a custom page.
  441.          <!-- REPLACE DEFAULT DESCRIPTION WITH YOUR OWN ABOVE-->
  442.         </div>
  443.        
  444.          
  445.     </div>
  446.     <div class="nameline">
  447.    
  448.      <!-- PAGE TITLE BELOW-->
  449.     <div class="barfont">my music</div>
  450.         <!-- PAGE TITLE ABOVE-->
  451.     </div>
  452. </div>
  453. <div class="content">
  454. <div class="mainline">
  455. <!---playlist 1--->
  456. <div class="musicwrapper">
  457.  <div class="musicline"></div>
  458.  
  459. <!-- INSERT YOUR 1ST PLAYLIST IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS BELOW-->
  460.     <div class="musicc"><img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQOA0JTO2Ko6zEsdCXHWnVkSkO18-ckKzuR4yKGj5CGnx9QGt89">
  461.     <!-- INSERT YOUR MAIN CIRCLE IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS ABOVE-->
  462.    
  463.     <div class="musicplayer"></div>
  464.     <div class="musicicon"><img src="http://media.tumblr.com/tumblr_m9c42oP5ds1rto88t.gif"/></div>
  465.         <div class="musicplay">
  466.         <div class="playerm">
  467.         <!--FIRST PLAYLIST MUSIC CODE BEGINS HERE-->
  468.             <embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=https://dl.dropboxusercontent.com/s/fqt9gwiq8rl023c/Ellie%20Goulding%20Hanging%20on%20%5BEdit%5D%201080p.mp3?dl=1&token_hash=AAGYhUorN59ZU4-4u3zn6sUVGbNjvkuotWNsudWT4gnJvQ&t0=&f1=https://dl.dropboxusercontent.com/s/39xk1ekk866tlav/LIGHTS%20-%20Toes%20%28Lyrics%29.mp3?dl=1&token_hash=AAGHvNb7G83ORTeGmauVGnbRXdsCPrLdlQHIzVbS-c_Gyg&t1=&f2=https://dl.dropboxusercontent.com/s/moz3qgx13c2e05c/Lana%20Del%20Rey%20vs.%20Cedric%20Gervais%20-%20Summertime%20Sadness.mp3?dl=1&token_hash=AAHvRggjTMkADahsxMQID47obhfPzk2ufvKk40px2cQukA&t2=&f3=https://dl.dropboxusercontent.com/s/phgbqryikupjn2t/Miley%20Cyrus%20-%20Someone%20Else%20%28Official%20Lyric%20Video%29.mp3?dl=1&token_hash=AAFuP3SYkmi1zUV7JyDgUlMf1rJLnMxOpJ-LYr9BQc6LxA&t3=&total=4" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />
  469.              <!-- FIRST PLAYLIST MUSIC CODE ENDS HERE-->
  470.         </div>
  471.     </div><!--musicplay-->
  472.     </div>
  473.         <div class="playlistbox">
  474.         <div style="overflow:auto; width: 233px; height: 75px;">
  475.         <div class="playfont">
  476.          <ol>
  477.         <b><!--PLAYLIST TITLE-->Hanging On:<!--PLAYLIST TITLE--></b>
  478.         <li><!-- SONG-->Hanging On - Ellie Goulding<!-- SONG--></li>
  479.         <li><!-- SONG-->Toes - LIGHTS<!-- SONG--></li>
  480.         <li><!-- SONG-->Summertime Sadness<br> -Lana Del Ray, Cedric Gervais<!-- SONG--></li>
  481.         <li><!-- SONG-->Somebody Else - Milet Cyrus<!-- SONG--></li>
  482.         <!--DELETE THE "<!--" AND "-- >" TO ADD SONGS-->
  483.         <!--<li> Song - Artist </li> -->
  484.         <!--<li> Song - Artist </li> -->
  485.         <!--<li> Song - Artist </li> -->
  486.         <!--<li> Song - Artist </li> -->
  487.             </ol>
  488.         </div>
  489.         </div>
  490.         </div>
  491. </div><!--musicwrapper-->  
  492. <!---playlist 1--->
  493.  
  494. <!---playlist 2--->
  495. <div class="musicwrapper2">
  496.  <div class="musicline"></div>
  497.  
  498.  <!-- INSERT YOUR 2ND PLAYLIST IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS BELOW-->
  499.     <div class="musicc"><img src="http://s3.amazonaws.com/rapgenius/daft-punk-get-lucky-612x612.jpg">
  500.     <!-- INSERT YOUR 2ND PLAYLIST IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS ABOVE-->
  501.    
  502.     <div class="musicplayer"></div>
  503.     <div class="musicicon"><img src="http://media.tumblr.com/tumblr_m9c42oP5ds1rto88t.gif"/></div>
  504.         <div class="musicplay">
  505.         <div class="playerm">
  506.        
  507.          <!-- SECOND PLAYLIST MUSIC CODE BEGINS HERE-->
  508.             <embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=https://dl.dropboxusercontent.com/s/8dp04g8sm5xshfd/Justin%20Timberlake%20-%20Pusher%20Love%20Girl%20%28%20Lyrics%20On%20Screen%20%29%202013%20%28%20The%2020%20-%2020%20Experience%20%29.mp3?dl=1&token_hash=AAEtc7U9cBOKXpvSDva7l4lUigomXoBjATaV4v4WUB2cEQ&t0=&f1=https://dl.dropboxusercontent.com/s/pwnv3wu6ywsgo3s/Daft%20Punk%20-%20Get%20Lucky%20%28Album%20Version%29.mp3?dl=1&token_hash=AAFNA43fbnU4KpO8dbhbkdYrcUg1lMaQG2OSMcoO9IONXw&t1=&f2=https://dl.dropboxusercontent.com/s/dotw1alx2oabe0p/American%20Boy%20-%20Estelle.mp3?dl=1&token_hash=AAGaeRBB7Q24ssWKvvW34FCjAzllpvjrZRCAjF7k8FdXng&t2=&f3=https://dl.dropboxusercontent.com/s/21pp2is3x1h61o3/Justin%20Timberlake%20-%20Suit%20%26amp%3B%20Tie%20%28Lyric%20Video%29%20ft.%20JAY%20Z.mp3?dl=1&token_hash=AAG-IyWI4VgFmZeBo-J46QWD40b3Fz3bLCeEMugBTxkSWg&t3=&f4=https://dl.dropboxusercontent.com/s/mdx6dv6rebxd2r7/Justin%20Timberlake%20-%20Strawberry%20Bubblegum%20Official%20Lyric%20Video.mp3?dl=1&token_hash=AAGjjHg30LC53r1EtUBVDq6xgwpiarAMi4IhtOYJo4OEdg&t4=&total=5" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />
  509.              <!--SECOND PLAYLIST MUSIC CODE ENDS HERE-->
  510.              
  511.         </div>
  512.     </div><!--musicplay-->
  513.     </div>
  514.         <div class="playlistbox">
  515.         <div style="overflow:auto; width: 233px; height: 75px;">
  516.         <div class="playfont">
  517.          <ol>
  518.         <b><!--PLAYLIST TITLE-->Get Lucky:<!--PLAYLIST TITLE--></b>
  519.         <li><!-- SONG-->Pusher Love Girl - Justin Timberlake<!-- SONG--></li>
  520.         <li><!-- SONG-->Get Lucky - Daft Punk<!-- SONG--></li>
  521.         <li><!-- SONG-->American Boy - Estelle<!-- SONG--></li>
  522.         <li><!-- SONG-->Suit & Tie feat. Jay Z - Justin Timberlake<!-- SONG--></li>
  523.        <li><!-- SONG-->Strawberry Bubblegum - Justin Timberlake<!-- SONG--></li>
  524.        <!--<li> Song - Artist </li> -->
  525.        <!--<li> Song - Artist </li> -->
  526.        <!--<li> Song - Artist </li> -->
  527.        <!--<li> Song - Artist </li> -->
  528.            </ol>
  529.        </div>
  530.        </div>
  531.        </div>
  532. </div><!--musicwrapper-->  
  533. <!---playlist 2--->
  534.  
  535. <!---playlist 3--->
  536. <div class="musicwrapper3">
  537. <div class="musicline2"></div>
  538.  
  539. <!-- INSERT YOUR 3RD PLAYLIST IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS BELOW-->
  540.    <div class="musicc2"><img src="http://sunsetintherearview.com/wp-content/uploads/2013/09/lorde1.jpg">
  541.    <!-- INSERT YOUR 3RD PLAYLIST IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS ABOVE-->
  542.    
  543.    <div class="musicplayer"></div>
  544.    <div class="musicicon2"><img src="http://media.tumblr.com/tumblr_m9c42oP5ds1rto88t.gif"/></div>
  545.        <div class="musicplay2">
  546.        <div class="playerm">
  547.        
  548.        <!-- THIRD PLAYLIST MUSIC CODE BEGINS HERE-->
  549.           <embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=https://dl.dropboxusercontent.com/s/52kz1zekdejjmgw/Lorde%20-%20Royals%20Lyric%20video.mp3?dl=1&token_hash=AAFZRx_JnnjPt8kUgaEDgyQvCxiCEDSbsAFHEH2SNkwDHQ&t0=&f1=https://dl.dropboxusercontent.com/s/tjewmngynxjh7fn/Santigold%20-%20Freak%20Like%20Me.mp3?dl=1&token_hash=AAFEgrSWJxkDt1s1tu8wEtA1AkkDuTtWJjTjzzckbRaYwA&t1=&f2=https://dl.dropboxusercontent.com/s/95bdxdyz78l8yn1/The%20XX-Crystalised-The%20Neon%20Lights%20Remix.mp3?dl=1&token_hash=AAHB2BZMlHQmSaYl4fZ93HB4_cuWz2s7IHmwht-CAjquTg&t2=&f3=https://dl.dropboxusercontent.com/s/qhubwhxdhgnmos7/Crystal%20Castles-Affection.mp3?dl=1&token_hash=AAGC5QmLh1hTZmJcI8c8bFpRYKtielnueT--30cl1K4NGw&t3=&total=4" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />
  550.           <!-- THIRD PLAYLIST MUSIC CODE ENDS HERE-->
  551.          
  552.        </div>
  553.    </div><!--musicplay-->
  554.    </div>
  555.        <div class="playlistbox2">
  556.        <div style="overflow:auto; width: 233px; height: 75px;">
  557.         <div class="playfont">
  558.          <ol>
  559.         <b><!--PLAYLIST TITLE-->Royals:<!--PLAYLIST TITLE--></b>
  560.         <li><!-- SONG-->Royals - Lorde<!-- SONG--></li>
  561.         <li><!-- SONG-->Freak Like Me - Santigold<!-- SONG--></li>
  562.         <li><!-- SONG-->Crystalised (The Neon Lights Remix) - The XX<!-- SONG--></li>
  563.         <li><!-- SONG-->Affection - Crystal Castles<!-- SONG--></li>
  564.         <!--<li> Song - Artist </li> -->
  565.         <!--<li> Song - Artist </li> -->
  566.         <!--<li> Song - Artist </li> -->
  567.         <!--<li> Song - Artist </li> -->
  568.             </ol>
  569.         </div>
  570.         </div>
  571.         </div>
  572. </div><!--musicwrapper-->  
  573. <!---playlist 3--->
  574.  
  575. <!---playlist 4--->
  576. <div class="musicwrapper4">
  577.  <div class="musicline2"></div>
  578.  
  579.  <!-- INSERT YOUR 4TH PLAYLIST IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS BELOW-->
  580.     <div class="musicc2"><img src="http://i1.sndcdn.com/artworks-000051155435-trsdjp-crop.jpg?8063923">
  581.     <!-- INSERT YOUR 4TH PLAYLIST IMAGE BY REPLACING WHAT IS ALREADY BETWEEN THE QUOTATIONS ABOVE-->
  582.    
  583.     <div class="musicplayer"></div>
  584.     <div class="musicicon2"><img src="http://media.tumblr.com/tumblr_m9c42oP5ds1rto88t.gif"/></div>
  585.         <div class="musicplay2">
  586.         <div class="playerm">
  587.        
  588.         <!-- FOURTH PLAYLIST MUSIC CODE BEGINS HERE-->
  589. <embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=https://dl.dropboxusercontent.com/s/1p1ezvaobte3z5e/hysteria%20%28_wtf%20is%20festival%20trap_%20anthem%29.mp3?dl=1&token_hash=AAHsASdO3E_ymZbeegY_Xv7rl59MlMHWuZjm6zeBQqNCCw&t0=&f1=https://dl.dropboxusercontent.com/s/80alsg820s07kb2/Zedd%20vs%20Bingo%20Players%20-%20Spectrum%20vs%20Out%20Of%20My%20Mind%20%28Chuckie%27s%20Dada%20Titanium%20Voices%20Mash%20Up%29.mp3?dl=1&token_hash=AAGrEEwyrrdIXmkSIG3S--M70FHFQKJdtPkEl96xOIxykg&t1=&f2=https://dl.dropboxusercontent.com/s/7sshglarjxczd14/J%20%20Rabbit%20-%20Tequila%20Remix.mp3?dl=1&token_hash=AAGcXVhUtlZf54pM53ACq2pZM2xOCosUxiwAQ6xWqR6VXg&t2=&f3=https://dl.dropboxusercontent.com/s/sjq9v0423xkzpwq/Baauer%20%26amp%3B%20RL%20Grime%20-%20Infinite%20Daps.mp3?dl=1&token_hash=AAHH4IpnzFsTkbjlOE2Kie1WsAh0u2X_2k2YGm620jCOZw&t3=&f4=https://dl.dropboxusercontent.com/s/hmx2a9ej51zdpdy/Diplo%20%26%20GTA%20-%20Boy%20Oh%20Boy.mp3?dl=1&token_hash=AAFnW5bc8RsrJ8_yZK0m-2TMKhNfC5OAbGVT8M1gcJvKqw&t4=&total=5" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />
  590. <!-- FOURTH PLAYLIST MUSIC CODE ENDS HERE-->
  591.  
  592.         </div>
  593.     </div><!--musicplay-->
  594.     </div>
  595.         <div class="playlistbox2">
  596.         <div style="overflow:auto; width: 233px; height: 75px;">
  597.         <div class="playfont">
  598.          <ol>
  599.         <b><!--PLAYLIST TITLE-->Hysteria:<!--PLAYLIST TITLE--></b>
  600.         <li><!-- SONG-->Hysteria - Boombox Cartel<!-- SONG--></li>
  601.         <li><!-- SONG-->Get Lucky - Daft Punk<!-- SONG--></li>
  602.         <li><!-- SONG-->Out Of My Titanium Spectrum - BingoPlayers VS. Zedd VS. Guetta<!-- SONG--></li>
  603.         <li><!-- SONG-->Tequila (Remix) - J Rabbit<!-- SONG--></li>
  604.         <li><!-- SONG-->Infinite Daps - Baauer & RL Grime<!-- SONG--></li>
  605.        <li><!-- SONG-->Boy Oh Boy - Diplo & GTA<!-- SONG--></li>
  606.        <!--<li> Song - Artist </li> -->
  607.        <!--<li> Song - Artist </li> -->
  608.        <!--<li> Song - Artist </li> -->
  609.        <!--<li> Song - Artist </li> -->
  610.            </ol>
  611.        </div>
  612.        </div>
  613.        </div>
  614. </div><!--musicwrapper-->  
  615. <!---playlist 4--->
  616.  
  617.  
  618.  
  619.  
  620.  
  621.  
  622. </div>
  623. </div><!--content-->
  624. </div><!--both-->
  625.  
  626.  
  627. <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important;}</style><a href="http://www.cursors-4u.com/cursor/2011/03/03/tiny-hand-10.html" target="_blank" border="0" alt="Tiny Hand" style="position:absolute; top: 0px; right: 0px;" /></a>
  628.  
  629. <div class="c">
  630. <a href="http://nff-themes.tumblr.com"><img src="http://static.tumblr.com/cbjpgjf/hmgmwsd81/yyylamo.png"></a>
  631. </div>
  632.  
  633.  
  634.  
  635. </body>
  636. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!