Advertisement
Emmes

MM064.- Hello (expediente)

May 23rd, 2022
815
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 8.09 KB | None | 0 0
  1. <div class="MM064"><div>
  2. <div class="MM064-img" style="background-image: url(https://i.postimg.cc/brydTjwT/13.png);"></div>
  3. <b>Nombre</b>
  4. <span>by Nombre del PB</span>
  5.  
  6. <input type="radio" name="MM064" id="MM064-1" checked>
  7. <input type="radio" name="MM064" id="MM064-2">
  8. <input type="radio" name="MM064" id="MM064-3">
  9. <input type="radio" name="MM064" id="MM064-4">
  10. <input type="radio" name="MM064" id="MM064-5">
  11.  
  12. <div class="MM064-la">
  13. <label for="MM064-1"><span class="th th-star"></span><b>Básico</b></label>
  14. <label for="MM064-2"><span class="th th-brain"></span><b>Psico</b></label>
  15. <label for="MM064-3"><span class="th th-notebook"></span><b>Histórico</b></label>
  16. <label for="MM064-4"><span class="th th-atom"></span><b>Habilidad</b></label>
  17. <label for="MM064-5"><span class="th th-briefcase"></span><b>Extras</b></label>
  18. </div>
  19.  
  20. <div class="MM064-sd">
  21.  
  22. <div class="MM064-txt m1">
  23. <b>Básico</b>
  24. <div><b>Nombre</b>Info Aquí</div>
  25. <div><b>Edad</b>Info Aquí</div>
  26. <div><b>Nacionalidad</b>Info Aquí</div>
  27. <div><b>Ocupación</b>Info Aquí</div>
  28. <div><b>Grupo</b>Info Aquí</div>
  29. <div><b>Rango</b>Info Aquí</div>
  30. <div><b>Afinidad</b>Info Aquí</div>
  31. </div>
  32.  
  33. <div class="MM064-txt m2">
  34. <b>Psico</b>
  35. <div class="MM064-sr"><div>Bonbon muffin donut halvah. Dragée jujubes dragée marzipan toffee caramels dragée tiramisu cheesecake. Dragée chocolate caramels toffee bear claw lemon drops fruitcake.
  36.  
  37. Sweet roll soufflé danish icing. Cake jelly beans chocolate cake danish halvah sesame snaps. Topping jelly gummi bears jelly-o croissant croissant gummi bears sugar plum. Fruitcake gingerbread cupcake liquorice ice cream gingerbread cake apple pie.
  38.  
  39. Pastry bear claw sweet pie gummies chocolate bar. Brownie soufflé cake. Ice cream gummies apple pie carrot cake sesame snaps brownie gummi bears. Pudding fruitcake cake cupcake cupcake candy canes gingerbread.</div></div>
  40. </div>
  41.  
  42. <div class="MM064-txt m3">
  43. <b>Historia</b>
  44. <div class="MM064-sr"><div>Bonbon muffin donut halvah. Dragée jujubes dragée marzipan toffee caramels dragée tiramisu cheesecake. Dragée chocolate caramels toffee bear claw lemon drops fruitcake.
  45.  
  46. Sweet roll soufflé danish icing. Cake jelly beans chocolate cake danish halvah sesame snaps. Topping jelly gummi bears jelly-o croissant croissant gummi bears sugar plum. Fruitcake gingerbread cupcake liquorice ice cream gingerbread cake apple pie.
  47.  
  48. Pastry bear claw sweet pie gummies chocolate bar. Brownie soufflé cake. Ice cream gummies apple pie carrot cake sesame snaps brownie gummi bears. Pudding fruitcake cake cupcake cupcake candy canes gingerbread.</div></div>
  49. </div>
  50.  
  51. <div class="MM064-txt m4">
  52. <b>Habilidad</b>
  53. <div class="MM064-sr"><div>Bonbon muffin donut halvah. Dragée jujubes dragée marzipan toffee caramels dragée tiramisu cheesecake. Dragée chocolate caramels toffee bear claw lemon drops fruitcake.
  54.  
  55. Sweet roll soufflé danish icing. Cake jelly beans chocolate cake danish halvah sesame snaps. Topping jelly gummi bears jelly-o croissant croissant gummi bears sugar plum. Fruitcake gingerbread cupcake liquorice ice cream gingerbread cake apple pie.
  56.  
  57. Pastry bear claw sweet pie gummies chocolate bar. Brownie soufflé cake. Ice cream gummies apple pie carrot cake sesame snaps brownie gummi bears. Pudding fruitcake cake cupcake cupcake candy canes gingerbread.</div></div>
  58. </div>
  59.  
  60. <div class="MM064-txt m5">
  61. <b>Extras</b>
  62. <div class="MM064-sr"><div>Bonbon muffin donut halvah. Dragée jujubes dragée marzipan toffee caramels dragée tiramisu cheesecake. Dragée chocolate caramels toffee bear claw lemon drops fruitcake.
  63.  
  64. Sweet roll soufflé danish icing. Cake jelly beans chocolate cake danish halvah sesame snaps. Topping jelly gummi bears jelly-o croissant croissant gummi bears sugar plum. Fruitcake gingerbread cupcake liquorice ice cream gingerbread cake apple pie.
  65.  
  66. Pastry bear claw sweet pie gummies chocolate bar. Brownie soufflé cake. Ice cream gummies apple pie carrot cake sesame snaps brownie gummi bears. Pudding fruitcake cake cupcake cupcake candy canes gingerbread.</div></div>
  67. </div>
  68.  
  69. </div>
  70.  
  71. </div></div><a href="https://emmescodes.tumblr.com/" class="miMM">emme</a><link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@700&family=Open+Sans:wght@400;700&display=swap" rel="stylesheet"><link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet"><style>.MM064, .MM064 * {box-sizing: border-box; scrollbar-color: #0006 #0002 !important; scrollbar-width: thin; transition: .3s;} .MM064 input, .MM064 br {display: none;} .MM064 {width: 400px; margin: auto; border-radius: 40px; padding: 30px; box-shadow: 0 40px 40px -30px #0009; font: 10px Open Sans; color: #555;} .MM064-img, .MM064 > div, .MM064 {background: linear-gradient(-45deg, #FFF, #e1e2e7); border-style: solid; border-width: 1px; border-color: #dddee2 #FFF #FFF #dddee2;} .MM064 > div {border-radius: 20px; background: linear-gradient(-45deg, #e1e2e7, #FFF9); text-align: center; display: flex; flex-direction: column;} .MM064-img {height: 150px; background-position: center; background-size: cover; margin: 20px; border-radius: 10px;} .MM064 > div > b {font: 700 40px Josefin Sans; text-transform: uppercase;} .MM064-la > label > span, .MM064 > div > b {background: linear-gradient(45deg, #9ca2b9, #5e667b); background-clip: text; color: transparent;} .MM064-sd > div > b, .MM064 > div > span {margin-top: 5px;text-transform: uppercase; letter-spacing: 3px; padding-left: 3px; color: #f58b2e; font-weight: bold; min-width: 100%;} .MM064-la {margin: 20px; display: flex; justify-content: space-between;} .MM064-la > label {border-style: solid; border-width: 1px; border-color: #dddee2 #FFF #FFF #dddee2;padding: 15px; border-radius: 10px; position: relative; background: #FFF; font-size: 16px; margin: 0; cursor: pointer;} #MM064-1:checked ~ div label[for*="-1"], #MM064-2:checked ~ div label[for*="-2"], #MM064-3:checked ~ div label[for*="-3"], #MM064-4:checked ~ div label[for*="-4"], #MM064-5:checked ~ div label[for*="-5"], .MM064-la label:hover {transform: scale(1.1); box-shadow: 0 10px 20px -10px #0009; z-index: 20;} .MM064-la b {position: absolute; opacity: 0; pointer-events: none; font-size: 10px; white-space: nowrap; background: #dddee2; top: 10px; left: 50%; padding: 10px; border-radius: 10px; transform: translate(-50%); z-index: 10;} .MM064-la label:hover b {top: calc(100% + 5px); box-shadow: 0 10px 20px -10px #0009; opacity: 1;} .MM064-la b::before {content: ""; position: absolute; width: 16px; height: 8px; top: -8px; left: calc(50% - 8px); background: #dddee2; clip-path: polygon(50% 0%, 0% 100%, 100% 100%);} .MM064-sd {position: relative; overflow: hidden; margin: 0 20px 20px;} .MM064-txt {transform-origin: right bottom; transform: rotate(90deg);} .MM064-txt.m1 {display: flex; flex-wrap: wrap; margin: 0 -5px -5px;} .MM064-txt > div {min-width: 40%; flex: 1; margin: 5px; background: #FFF; border-radius: 10px; overflow: hidden; line-height: 30px;} .MM064-txt.m1 > div > b {display: block; background: linear-gradient(45deg, #9ca2b9, #5e667b); color: #FFF; text-transform: uppercase; font-size: 8px; letter-spacing: 2px; padding: 3px 3px 3px 5px; text-shadow: 1px 1px #5e667b, -1px 1px #5e667b, 1px -1px #5e667b, -1px -1px #5e667b; line-height: 10px;} #MM064-1:checked ~ div .m1, #MM064-2:checked ~ div .m2, #MM064-3:checked ~ div .m3, #MM064-4:checked ~ div .m4, #MM064-5:checked ~ div .m5 {transform: rotate(0deg);} .MM064-txt ~ .MM064-txt {position: absolute; top: 0; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column;} .MM064-sr {margin: 5px 0 0; position: relative;} .MM064-sr > div {line-height: 100%; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; text-align: justify; hyphens: auto; overflow: auto; font-size: 12px;} .MM064-sr > div br {display: block;} .MM064-sr > div br + br, margin: 5px;} .MM064 div::-webkit-scrollbar {width: 5px !important; height: 5px !important; background: #0002 !important;} .MM064 div::-webkit-scrollbar-thumb {background: #0006 !important;} .miMM {display: block; font: bold 10px Calibri; letter-spacing: 2px; text-align: center; transition: 0.5s; text-transform: uppercase; padding: 3px; color: #444;} .miMM:hover {letter-spacing: 3px;}</style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement