Advertisement
oliviacodes

everything i do

Nov 6th, 2018
125
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.57 KB | None | 0 0
  1. [dohtml]
  2. <link href="https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
  3. <link href="https://fonts.googleapis.com/css?family=PT+Mono" rel="stylesheet">
  4.  
  5. <div id="angr">
  6. <div id="angr-img" style="background-image: url(180x250 img here, will resize to fit)"></div>
  7. <div id="angr-scr"></div>
  8. <div id="angr-text">text here
  9.  
  10. </div>
  11. <h1>everything i do</h1>
  12. <h2>it's all for you</h2>
  13. <h3>tag: [user=3352,3]@username[/user]</h3>
  14. </div>
  15.  
  16. <a href="http://oliviacodes.tumblr.com"><div style="width: 400px; margin: 10px auto; text-align: right; font-size: 8px; font-family: arial; text-transform: uppercase; color: #aaa;">oliviacodes</div></a>
  17.  
  18. <style>
  19. #angr {height: 250px; width: 400px; background: #eee; position: relative; margin: auto}
  20. #angr-img {height: 250px; width: 180px; background-size: cover; background-position: center; -webkit-clip-path: polygon(0 0, 100% 0, 79% 100%, 0% 100%); clip-path: polygon(0 0, 100% 0, 60% 100%, 0% 100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); position: absolute}
  21. #angr-scr {height: 250px; width: 180px; position: absolute; background-color: #5E9B8F; mix-blend-mode: multiply;-webkit-clip-path: polygon(0 0, 100% 0, 79% 100%, 0% 100%); clip-path: polygon(0 0, 100% 0, 60% 100%, 0% 100%); }
  22. #angr-text {position: absolute; bottom: 25px; right: 15px; background: #eee; width:285px; height: 110px; overflow: auto; -webkit-columns: 2; -moz-columns: 2; -ms-columns: 2; -o-columns: 2; font-family: pt mono; font-size: 9px; text-align: justify; border: 10px solid #eee; color: #2B413C; line-height: 12px}
  23. #angr h1 {font-family: poppins; position: absolute; text-transform: uppercase; font-weight: 800; font-style: italic; color: #B63947; font-size: 40px; letter-spacing: -3px; top: 20px; left: 80px; line-height: 25px; height: 40px; }
  24. #angr h2, #angr h3 {width: 200px; text-align: right; font-family: poppins; font-size: 10px; color: #5E9B8F; text-align: right; position: absolute; right: 20px; top: 67px; text-transform: uppercase; font-weight: 200; font-style: italic; letter-spacing: 2px; -webkit-transition: 0.6s ease;}
  25. #angr h2 {opacity: 1}
  26. #angr h3 {top: 65px; opacity: 0}
  27. #angr:hover h2 {opacity: 0}
  28. #angr:hover h3 {opacity: 1}
  29. #angr-text::-webkit-scrollbar {height: 5px}
  30. #angr-text::-webkit-scrollbar-thumb {background: #eee!important; border: 1px solid #5E9B8F!important;}
  31. #angr-text::-webkit-scrollbar-track {background: #5E9B8F!important; border: none!important}
  32. </style>
  33. [/dohtml]
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement