Advertisement
TheRocketGirl

Bad guy

Apr 7th, 2019
485
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.01 KB | None | 0 0
  1. <div id="backhome"><div class="must1" style="background: url('IMAGEN AQUÍ');"></div><div class="must2"><span>FRASE NO MUY LARGA</span></br> <n>#TAG</n> <n>#TAG</n></div><div id="home"><center><div class="home2"> <span>TITULO NO MUY LARGO <i class="fas fa-radiation"></i></span></div>
  2. <div class="text13">TEXTO</div></center>
  3. </div></div> <div class="credits"><a href="https://therocketgirl-codes.tumblr.com/">- LILITH</a></div>
  4.  
  5.  
  6. <style>#backhome{background: #fff; width: 500px; height: 400px; overflow: hidden;} .must1{width: 420px; height: 400px; display: inline-block; -webkit-transition:0.9s ease-in 0.4s; transition-timing-function: cubic-bezier(0.5,0,0.2,1);} .must2{background: #1E1E1E; width: 400px; height: 80px; transform: rotate(90deg); display: inline-block; color: #fff; position: relative; top: -240px; left: 260px; text-align: center; font-family: Oswald; font-size: 16px;} .must2 n{position: relative; top: 20px; font-size: 12px; letter-spacing: 4px; background: #972E2E; padding: 3px;} .must2 span{letter-spacing: 5px; text-transform: uppercase; top: 10px; position: relative; color: #fff; font-weight: 10px; border-left: 20px solid #972E2E; padding: 5px;} #home{background: #1E1E1E; height: 360px; width: 400px; position: relative; top: -80px; margin-left: 10px; -webkit-transition:0.9s ease-in 0.4s; transition-timing-function: cubic-bezier(0.5,0,0.2,1);} #backhome:hover #home{ top: -460px;-webkit-transition:1.9s ease-in 0s; transition:0.9s ease-in 0.2s; transition-timing-function: cubic-bezier(0.3,0,0.2,1);} #backhome:hover .must1{filter: grayscale(100%); -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out;} .home2{ text-align: left; width: 360px; padding: 5px; position: relative; top: 10px; border-left: 20px solid #972E2E; color :#fff; font-family: Oswald; font-size: 19px; letter-spacing: 5px; text-transform: uppercase;} .text13{background: #1e1e1e; width: 360px; height: 280px; padding: 10px; overflow: auto; font-size: 11px; text-align: justify; color: #fff} .text13::first-letter{ font-size: 60px; float: left; padding: 30px; color: #972E2E; font-family: Staatliches;} div::-webkit-scrollbar {width: 5px; height: 2px;} div::-webkit-scrollbar-button:start:decrement, div::-webkit-scrollbar-button:end:increment{height: 10px;display: none;background: #972E2E;} div::-webkit-scrollbar-track-piece{background: #ccc;} div::-webkit-scrollbar-thumb:vertical{height: 20px; background: #972E2E; border: 1px solid #972E2E;} div::-webkit-scrollbar-thumb:horizontal{height: 20px;background: #972E2E; border: 1px solid #972E2E;} .credits{font-size: 10px; text-align: right; width: 500px; text-transform: lowercase; letter-spacing: 3px;} .credits a {color: #fff;}
  7.  </style>
  8. <link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
  9. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
  10. <link href="https://fonts.googleapis.com/css?family=Staatliches" rel="stylesheet">
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement