Advertisement
Emmes

Retro OS Style (relas)

Oct 16th, 2019
409
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.49 KB | None | 0 0
  1. <div class="MG2"><div class="ttMG2">Nombre Apellido <i>Relationships</i></div><div class="inMG2"><div class="imgMG2" style="background-image: url(https://i.postimg.cc/JnSnDD4d/Screenshot-2019-10-07-Pinterest.png);"><b></b></div><div class="xxMG2">
  2.  
  3. <span>Edad</span>
  4. <span>Nacionalidad</span>
  5. <span>Ocupación</span>
  6. <span>Estado Cívil</span>
  7. <span>Grupo</span>
  8. <span>Rango</span>
  9.  
  10. </div></div>
  11.  
  12. <div class="xxMG2"><label><input type="checkbox"><span>Nombre Apellido</span><div><div>Halvah gingerbread ice cream muffin dragée. Icing brownie donut cake. Pastry pastry marshmallow oat cake jelly-o. Cheesecake sweet cake jelly beans jelly beans chupa chups gummies.
  13.  
  14. Cake liquorice cotton candy tootsie roll dragée lemon drops caramels candy canes marzipan. Icing dragée macaroon sweet sugar plum chocolate bar bear claw wafer. Bonbon fruitcake danish toffee jelly oat cake croissant pastry candy canes.
  15.  
  16. Wafer tootsie roll candy. Cotton candy donut fruitcake. Oat cake jelly beans brownie soufflé fruitcake.</div><div style="background-image: url(https://via.placeholder.com/150x130);"></div></div></label></div>
  17.  
  18. <div class="xxMG2"><label><input type="checkbox"><span>Nombre Apellido</span><div><div>Halvah gingerbread ice cream muffin dragée. Icing brownie donut cake. Pastry pastry marshmallow oat cake jelly-o. Cheesecake sweet cake jelly beans jelly beans chupa chups gummies.
  19.  
  20. Cake liquorice cotton candy tootsie roll dragée lemon drops caramels candy canes marzipan. Icing dragée macaroon sweet sugar plum chocolate bar bear claw wafer. Bonbon fruitcake danish toffee jelly oat cake croissant pastry candy canes.
  21.  
  22. Wafer tootsie roll candy. Cotton candy donut fruitcake. Oat cake jelly beans brownie soufflé fruitcake.</div><div style="background-image: url(https://via.placeholder.com/150x130);"></div></div></label></div>
  23.  
  24. <div class="xxMG2"><label><input type="checkbox"><span>Nombre Apellido</span><div><div>Halvah gingerbread ice cream muffin dragée. Icing brownie donut cake. Pastry pastry marshmallow oat cake jelly-o. Cheesecake sweet cake jelly beans jelly beans chupa chups gummies.
  25.  
  26. Cake liquorice cotton candy tootsie roll dragée lemon drops caramels candy canes marzipan. Icing dragée macaroon sweet sugar plum chocolate bar bear claw wafer. Bonbon fruitcake danish toffee jelly oat cake croissant pastry candy canes.
  27.  
  28. Wafer tootsie roll candy. Cotton candy donut fruitcake. Oat cake jelly beans brownie soufflé fruitcake.</div><div style="background-image: url(https://via.placeholder.com/150x130);"></div></div></label></div>
  29.  
  30. <div class="xxMG2"><label><input type="checkbox"><span>Nombre Apellido</span><div><div>Halvah gingerbread ice cream muffin dragée. Icing brownie donut cake. Pastry pastry marshmallow oat cake jelly-o. Cheesecake sweet cake jelly beans jelly beans chupa chups gummies.
  31.  
  32. Cake liquorice cotton candy tootsie roll dragée lemon drops caramels candy canes marzipan. Icing dragée macaroon sweet sugar plum chocolate bar bear claw wafer. Bonbon fruitcake danish toffee jelly oat cake croissant pastry candy canes.
  33.  
  34. Wafer tootsie roll candy. Cotton candy donut fruitcake. Oat cake jelly beans brownie soufflé fruitcake.</div><div style="background-image: url(https://via.placeholder.com/150x130);"></div></div></label></div>
  35.  
  36. <div class="xxMG2"><label><input type="checkbox"><span>Nombre Apellido</span><div><div>Halvah gingerbread ice cream muffin dragée. Icing brownie donut cake. Pastry pastry marshmallow oat cake jelly-o. Cheesecake sweet cake jelly beans jelly beans chupa chups gummies.
  37.  
  38. Cake liquorice cotton candy tootsie roll dragée lemon drops caramels candy canes marzipan. Icing dragée macaroon sweet sugar plum chocolate bar bear claw wafer. Bonbon fruitcake danish toffee jelly oat cake croissant pastry candy canes.
  39.  
  40. Wafer tootsie roll candy. Cotton candy donut fruitcake. Oat cake jelly beans brownie soufflé fruitcake.</div><div style="background-image: url(https://via.placeholder.com/150x130);"></div></div></label></div>
  41.  
  42. </div><a class="miMG2" href="https://emmescodes.tumblr.com/" title="Code by Emme">Emme</a>
  43.  
  44. <link href="https://fonts.googleapis.com/css?family=PT+Sans:400,700|VT323&display=swap" rel="stylesheet"><style>.MG2, .MG2 * {box-sizing: border-box; scrollbar-color: #29de21 #0003; scrollbar-width: thin;} .MG2 label {color: inherit; margin: 0;} .MG2, .xxMG2 label > div > div:nth-of-type(2):before, .imgMG2 b {width: 500px; background-color: #0009; background-image: linear-gradient(to bottom, #29de2117 1px, #0000 1px, #0000 6px), linear-gradient(to bottom, #29de2144 1px, #0000 1px, #0000 6px); margin: auto; padding: 20px; font: 12px PT Sans; text-align: center; background-size: 6px 6px, auto 6px; background-repeat: repeat, no-repeat; animation: retro 15s linear infinite; box-shadow: inset 0 0 50px 10px #000; color: #29de21;} @keyframes retro {from {background-position: top center, top;} to {background-position: top center, bottom;}} .ttMG2 {font: 25px VT323; text-transform: uppercase; letter-spacing: 2px; text-shadow: 0 0 3px; text-align: left;} .ttMG2 > i {float: right;} .inMG2 {position: relative; padding-left: 170px;} .xxMG2 {position: relative; padding: 4px; background: #00800040; box-shadow: 0 0 15px 5px #00800040;} .xxMG2::before, .xxMG2::after {content: ""; position: absolute; left: 0; right: 0; border: 2px solid; border-bottom: none; height: 15px; box-sizing: border-box;} .xxMG2::before {top: 0;} .xxMG2::after {bottom: 0; transform: rotate(180deg);} .imgMG2 {position: absolute; top: 0; left: 0; bottom: 0; width: 160px; box-shadow: 0 0 15px 5px #00800040, inset 0 0 15px 5px #00800040; padding: 7px; background-clip: content-box; background-size: cover; background-position: center;} .imgMG2::before, .imgMG2::after {content: ""; position: absolute; top: 0; bottom: 0; width: 15px; border: 2px solid; border-right: none; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 calc(100% - 15px), 100% calc(100% - 15px), 100% 15px, 0 15px); box-sizing: border-box;} .imgMG2:before {left: 0;} .imgMG2:after {right: 0; transform: rotate(180deg);} .xxMG2 > span, .xxMG2 > label > span {display: block; padding: 8px; margin: 4px; box-shadow: inset 0 0 30px -15px; letter-spacing: 2px;} .xxMG2 > span:hover, .xxMG2 > label > span:hover {box-shadow: inset 0 0 40px -15px;} .MG2 > .xxMG2 {margin-top: 5px;} .xxMG2 > label input {display: none;} .xxMG2 > label > span {font: 20px VT323; cursor: pointer;} .xxMG2 label > div {height: 0; overflow: hidden; transition: .5s; display: flex; padding: 0 4px;} .xxMG2 input:checked ~ div {height: 150px; margin-top: 5px; padding: 4px;} .xxMG2 label > div > div:nth-of-type(1) {flex: 1; background: #0003; margin: 8px; box-shadow: 0 0 5px 2px #0003; text-align: justify; padding: 5px; overflow: auto; border: 5px solid transparent;} .xxMG2 label > div > div:nth-of-type(2) {height: 130px; width: 150px; border: 1px solid; border-radius: 20px; margin: 5px 5px 5px 10px; background-position: center; background-size: cover; box-shadow: inset 0 0 5px, inset 0 0 25px #0009, 0 0 15px -5px; overflow: hidden; position: relative;} .xxMG2 label > div > div:nth-of-type(2)::before, .imgMG2 b {content: ""; box-shadow: none; background-color: transparent; position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%;} .xxMG2 br, .MG2 > br {display: none;} .miMG2 {display: block; font: 10px arial; letter-spacing: 2px; text-align: center; transition: .5s;} .miMG2:hover {letter-spacing: 10px;} .MG2 div::-webkit-scrollbar {width: 5px !important; height: 5px !important; background: #0006 !important;} .MG2 div::-webkit-scrollbar-thumb {background: #29de21 !important;}</style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement