API tools faq
paste
Emmes

Infinito (multi - pestañas)

Emmes
Jun 13th, 2020
2,408
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.98 KB | None | 0 0
raw download clone embed print report
  1. <div class="MM014"><input type="radio" name="MM014" id="MM014-01" checked><input type="radio" name="MM014" id="MM014-02"><input type="radio" name="MM014" id="MM014-03"><input type="radio" name="MM014" id="MM014-04"><input type="radio" name="MM014" id="MM014-05">
  2.  
  3. <div class="MM014-in m1"><div class="MM014-img" style="background-image: url(https://i.postimg.cc/tTVnT008/001.jpg);"></div>
  4. <div class="MM014-tt"><b>Título 01 Aquí</b>Frase, información breve o alguna cosita aquí.</div>
  5. <div class="MM014-txt">Halvah tart <b>biscuit croissant</b>. Chupa chups sesame snaps chocolate bar chocolate lollipop powder. Cookie sweet cookie. Gummies pie chocolate bar jelly donut tootsie roll cotton candy.
  6.  
  7. Fruitcake cupcake fruitcake. Tootsie roll soufflé cupcake lollipop marshmallow sugar plum. Ice cream tootsie roll brownie. Liquorice chocolate bar jujubes.
  8.  
  9. Dragée carrot cake icing donut sesame snaps. Dragée donut cheesecake chocolate cake. Jelly-o oat cake cupcake tart apple pie bonbon sesame snaps brownie. Macaroon fruitcake chupa chups brownie chocolate bar croissant fruitcake sugar plum.</div>
  10. </div><label for="MM014-01"></label>
  11.  
  12. <div class="MM014-in m2"><div class="MM014-img" style="background-image: url(https://i.postimg.cc/c1w8GNBn/002.jpg);"></div>
  13. <div class="MM014-tt"><b>Título 02 Aquí</b>Frase, información breve o alguna cosita aquí.</div>
  14. <div class="MM014-txt">Halvah tart biscuit croissant. Chupa chups sesame snaps chocolate bar chocolate lollipop powder. Cookie sweet cookie. Gummies pie chocolate bar jelly donut tootsie roll cotton candy.
  15.  
  16. Fruitcake cupcake fruitcake. Tootsie roll soufflé cupcake lollipop marshmallow sugar plum. Ice cream tootsie roll brownie. Liquorice chocolate bar jujubes.
  17.  
  18. Dragée carrot cake icing donut sesame snaps. Dragée donut cheesecake chocolate cake. Jelly-o oat cake cupcake tart apple pie bonbon sesame snaps brownie. Macaroon fruitcake chupa chups brownie chocolate bar croissant fruitcake sugar plum.</div>
  19. </div><label for="MM014-02"></label>
  20.  
  21. <div class="MM014-in m3"><div class="MM014-img" style="background-image: url(https://i.postimg.cc/pT8yvDzH/003.jpg);"></div>
  22. <div class="MM014-tt"><b>Título 03 Aquí</b>Frase, información breve o alguna cosita aquí.</div>
  23. <div class="MM014-txt">Halvah tart biscuit croissant. Chupa chups sesame snaps chocolate bar chocolate lollipop powder. Cookie sweet cookie. Gummies pie chocolate bar jelly donut tootsie roll cotton candy.
  24.  
  25. Fruitcake cupcake fruitcake. Tootsie roll soufflé cupcake lollipop marshmallow sugar plum. Ice cream tootsie roll brownie. Liquorice chocolate bar jujubes.
  26.  
  27. Dragée carrot cake icing donut sesame snaps. Dragée donut cheesecake chocolate cake. Jelly-o oat cake cupcake tart apple pie bonbon sesame snaps brownie. Macaroon fruitcake chupa chups brownie chocolate bar croissant fruitcake sugar plum.</div>
  28. </div><label for="MM014-03"></label>
  29.  
  30. <div class="MM014-in m4"><div class="MM014-img" style="background-image: url(https://i.postimg.cc/90YMRCLg/004.jpg);"></div>
  31. <div class="MM014-tt"><b>Título 04 Aquí</b>Frase, información breve o alguna cosita aquí.</div>
  32. <div class="MM014-txt">Halvah tart biscuit croissant. Chupa chups sesame snaps chocolate bar chocolate lollipop powder. Cookie sweet cookie. Gummies pie chocolate bar jelly donut tootsie roll cotton candy.
  33.  
  34. Fruitcake cupcake fruitcake. Tootsie roll soufflé cupcake lollipop marshmallow sugar plum. Ice cream tootsie roll brownie. Liquorice chocolate bar jujubes.
  35.  
  36. Dragée carrot cake icing donut sesame snaps. Dragée donut cheesecake chocolate cake. Jelly-o oat cake cupcake tart apple pie bonbon sesame snaps brownie. Macaroon fruitcake chupa chups brownie chocolate bar croissant fruitcake sugar plum.</div>
  37. </div><label for="MM014-04"></label>
  38.  
  39. <div class="MM014-in m5"><div class="MM014-img" style="background-image: url(https://i.postimg.cc/gjWj2nH6/005.jpg);"></div>
  40. <div class="MM014-tt"><b>Título 05 Aquí</b>Frase, información breve o alguna cosita aquí.</div>
  41. <div class="MM014-txt">Halvah tart biscuit croissant. Chupa chups sesame snaps chocolate bar chocolate lollipop powder. Cookie sweet cookie. Gummies pie chocolate bar jelly donut tootsie roll cotton candy.
  42.  
  43. Fruitcake cupcake fruitcake. Tootsie roll soufflé cupcake lollipop marshmallow sugar plum. Ice cream tootsie roll brownie. Liquorice chocolate bar jujubes.
  44.  
  45. Dragée carrot cake icing donut sesame snaps. Dragée donut cheesecake chocolate cake. Jelly-o oat cake cupcake tart apple pie bonbon sesame snaps brownie. Macaroon fruitcake chupa chups brownie chocolate bar croissant fruitcake sugar plum.</div>
  46. </div><label for="MM014-05"></label>
  47.  
  48. </div><a class="miMM" href="https://emmescodes.tumblr.com/" title="Code by Emme">Emme</a><link href="https://fonts.googleapis.com/css2?family=Montserrat&family=Roboto+Slab&display=swap" rel="stylesheet"><link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet"><style>.MM014 label:hover:before, .MM014-tt b::after, .MM014-txt b { color: #1dcac4; } .MM014, .MM014 * { box-sizing: border-box; scrollbar-color: #1dcac4 #0002; scrollbar-width: thin; } .MM014 { width: 300px; height: 400px; position: relative; background: #0001; margin: auto; border-radius: 40px; border: 10px solid transparent; font: 10px Montserrat; color: #666; } .MM014-in, .MM014 label {transition: 0s; cursor: pointer; position: absolute; background: #FFF; right: 0; border-radius: 30px; box-shadow: 0 20px 30px -30px #000d; } .MM014-in { top: 0; left: 0; bottom: 90px; transform: translate(calc(100% + 20px)); opacity: 0; pointer-events: none; transition: .5s; display: flex; flex-wrap: wrap; border: 20px solid transparent; } .MM014 label { bottom: 0; width: calc(50% - 5px); height: 80px; margin: 0; opacity: 0; pointer-events: none; display: flex; align-items: center; justify-content: center; z-index: 10; color: inherit; } .MM014 label::before { content:"\ebc6"; font: 16px honeybee; } #MM014-01:checked ~ label[for*="-05"]::before, #MM014-02:checked ~ label[for*="-01"]::before, #MM014-03:checked ~ label[for*="-02"]::before, #MM014-04:checked ~ label[for*="-03"]::before, #MM014-05:checked ~ label[for*="-04"]::before { content:"\ebb9"; } #MM014-01:checked ~ label[for*="-02"], #MM014-02:checked ~ label[for*="-03"], #MM014-03:checked ~ label[for*="-04"], #MM014-04:checked ~ label[for*="-05"], #MM014-05:checked ~ label[for*="-01"], #MM014-01:checked ~ .MM014-in.m1, #MM014-02:checked ~ .MM014-in.m2, #MM014-03:checked ~ .MM014-in.m3, #MM014-04:checked ~ .MM014-in.m4, #MM014-05:checked ~ .MM014-in.m5 { transform: translate(0); opacity: 1; pointer-events: auto; } #MM014-02:checked ~ .MM014-in.m1, #MM014-03:checked ~ .MM014-in.m2, #MM014-04:checked ~ .MM014-in.m3, #MM014-05:checked ~ .MM014-in.m4, #MM014-01:checked ~ .MM014-in.m5 { transform: translate(calc(-100% - 20px)); } #MM014-01:checked ~ label[for*="-05"], #MM014-02:checked ~ label[for*="-01"], #MM014-03:checked ~ label[for*="-02"], #MM014-04:checked ~ label[for*="-03"], #MM014-05:checked ~ label[for*="-04"] { right: inherit; left: 0; opacity: 1; pointer-events: auto; } .MM014 label:active { transform: scale(.9) !important; } .MM014-img { width: calc(50% - 5px); height: 100px; border-radius: 15px; margin-right: 10px; background-position: center; background-size: cover; } .MM014-tt { width: calc(50% - 5px); align-self: center; } .MM014-tt b { font: 14px Roboto Slab; display: block; } .MM014-tt b::after { content: ""; display: block; width: 35px; margin: 5px 0 7px; border-top: 2px solid; } .MM014-txt { width: 100%; height: calc(100% - 110px); margin-top: 10px; text-align: justify; overflow: auto; padding-right: 3px; } .MM014 input, .MM014 br { display: none; } .MM014-tt br, .MM014-txt br { display: block; margin: 5px; } .MM014 div::-webkit-scrollbar { width: 5px !important; height: 5px !important; background: #0002 !important; } .MM014 div::-webkit-scrollbar-thumb { background: #1dcac4 !important; } .miMM { display: block; font: bold 10px Calibri; letter-spacing: 2px; text-align: center; transition: 0.5s; text-transform: uppercase; padding: 3px; } .miMM:hover { letter-spacing: 3px; }</style>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!