Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- [dohtml]
- <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">
- <link href="https://fonts.googleapis.com/css?family=PT+Mono" rel="stylesheet">
- <div id="angr">
- <div id="angr-img" style="background-image: url(180x250 img here, will resize to fit)"></div>
- <div id="angr-scr"></div>
- <div id="angr-text">text here
- </div>
- <h1>everything i do</h1>
- <h2>it's all for you</h2>
- <h3>tag: [user=3352,3]@username[/user]</h3>
- </div>
- <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>
- <style>
- #angr {height: 250px; width: 400px; background: #eee; position: relative; margin: auto}
- #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}
- #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%); }
- #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}
- #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; }
- #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;}
- #angr h2 {opacity: 1}
- #angr h3 {top: 65px; opacity: 0}
- #angr:hover h2 {opacity: 0}
- #angr:hover h3 {opacity: 1}
- #angr-text::-webkit-scrollbar {height: 5px}
- #angr-text::-webkit-scrollbar-thumb {background: #eee!important; border: 1px solid #5E9B8F!important;}
- #angr-text::-webkit-scrollbar-track {background: #5E9B8F!important; border: none!important}
- </style>
- [/dohtml]
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement