API tools faq
paste
Advertisement
Emmes

MH0.- Cute Particles (cronologia)

Emmes
Nov 18th, 2019
749
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.22 KB | None | 0 0
raw download clone embed print report
  1. <div class="MH0" style="color: #e2967c;"><div class="ttMH0"><div class="imgMH0"><div style="background-image: url(https://i.postimg.cc/tRMsw-SZv/01.jpg);"></div></div><strong><b>Titulo Aquí</b>Cronología</strong><div><strong>D</strong><span>Bonbon jelly-o tootsie roll tiramisu croissant candy canes. Biscuit pie oat cake brownie dragée marzipan sweet roll danish. Cake pie croissant jelly-o lollipop cheesecake lollipop tart. Dessert bear claw danish.
  2.  
  3. Apple pie danish jujubes. Wafer pudding bear claw gummies. Bonbon sesame snaps lollipop candy croissant. Jelly-o marzipan oat cake chupa chups muffin gingerbread gingerbread gummies liquorice.</span></div></div><div class="labMH0"><label><input type="checkbox"><div><div><div style="background-image: url(https://i.postimg.cc/9Q3rFDBG/03.jpg);"></div><strong><b>Temas Activos</b></strong><span><div><a href="URL">Título del tema</a>
  4. <i>con <b>Nombre Apellido</b></i>
  5.  
  6. <a href="URL">Título del tema</a>
  7. <i>con <b>Nombre Apellido</b></i>
  8.  
  9. <a href="URL">Título del tema</a>
  10. <i>con <b>Nombre Apellido</b></i>
  11.  
  12. <a href="URL">Título del tema</a>
  13. <i>con <b>Nombre Apellido</b></i>
  14.  
  15. <a href="URL">Título del tema</a>
  16. <i>con <b>Nombre Apellido</b></i>
  17. </div></span></div></div><b>Activos</b></label><label><input type="checkbox"><div><div><div style="background-image: url(https://i.postimg.cc/4NHYg6pf/02.jpg);"></div><strong><b>Temas Completados</b></strong><span><div><a href="URL">Título del tema</a>
  18. <i>con <b>Nombre Apellido</b></i>
  19. </div></span></div></div><b>Completados</b></label></div></div><a class="miMH0" href="https://emmescodes.tumblr.com/" title="Code by Emme">Emme</a>
  20.  
  21. <link href="https://fonts.googleapis.com/css?family=Lato|Montserrat:300,400,800&display=swap" rel="stylesheet"><style>.MH0, .MH0 * {box-sizing: border-box; scrollbar-color: #0006 #0003; scrollbar-width: thin;} @font-face {font-family: HW Icons; src: url(https://cdn.statically.io/gh/EmmesCodes/Tipografias/0ae07c71/HW-Icons.otf);} .MH0 {width: 450px; margin: auto; font: 12px Lato; text-align: center;} .ttMH0 > strong, .ttMH0 > div, .labMH0 > label, .labMH0 > label > div > div {background-color: #222; background-image: url(http://www.pngall.com/wp-content/uploads/2017/11/Particles-PNG.png); background-size: cover; vertical-align: top; padding: 20px;} .ttMH0 {position: relative; padding-left: 170px;} .ttMH0 > strong {display: block; margin-bottom: 10px;} .imgMH0 {position: absolute; top: 0; left: 0; bottom: 0; width: 160px;} .imgMH0 > div:before, .imgMH0 > div:after, .labMH0 > label > div > div > div:before, .labMH0 > label > div > div > div:after {content: ""; position: absolute; box-shadow: inset 0 0 0 200px; z-index: 5; top: -10px; bottom: -10px; left: -10px; right: -10px; -webkit-mask-image: url(https://i.postimg.cc/k4GF2dqw/500.png);} .imgMH0 > div:before, .labMH0 > label > div > div > div:before {-webkit-mask-position: bottom right;} .imgMH0 > div:after, .labMH0 > label > div > div > div:after {-webkit-mask-position: top left;} .imgMH0 > div, .labMH0 > label > div > div > div {background-color: #111; background-position: center; background-size: cover; position: relative;} .imgMH0 > div {height: 100%;} .ttMH0 > strong {font-weight: normal; position: relative;} .ttMH0 > strong > b {font: 300 20px Montserrat; text-transform: uppercase; letter-spacing: 3px; color: #CCC; display: block;} .ttMH0 > strong::after, .imgMH0:after {font: 40px HW Icons; text-shadow: 2px 2px 2px #000; position: absolute;} .ttMH0 > strong::after {content: "Q"; right: 7px; bottom: 0;} .imgMH0::after {content: "o"; bottom: -5px; left: calc(50% - 40px);} .ttMH0 > strong ~ div {text-align: justify; hyphens: auto;} .ttMH0 > strong ~ div > strong {font: 60px HW Icons; float: left; margin: 10px 20px 0;} .ttMH0 > strong ~ div > span {color: #CCC;} .labMH0 {margin: 10px -5px 0; display: flex;} .labMH0 input {display: none;} .labMH0 > label {margin: 0 5px; flex: 1; position: relative; cursor: pointer; color: inherit;} .labMH0 > label::before {content: ""; -webkit-mask-image: url(https://i.postimg.cc/qM4qwxCH/700.png); box-shadow: inset 0 0 0 100px; -webkit-mask-size: 100% 100%; display: block; width: 70px; height: 70px; margin: auto;} .labMH0 > label:nth-of-type(even):before {transform: rotate(180deg);} .labMH0 > label > b {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #CCC; font: 15px Montserrat; text-transform: uppercase; text-shadow: 2px 2px 2px #000; z-index: 5;} .labMH0 > label::after {content: "r"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font: 50px HW Icons; padding-top: 7px;} .labMH0 > label:nth-of-type(even)::after {content: "t";} .labMH0 > label:hover::after {animation: late .5s infinite alternate;} @keyframes late {from {transform: translate(-50%, -50%) scale(1);} to {transform: translate(-50%, -50%) scale(.7);}} .labMH0 > label > div {position: fixed; top: 0; left: 0; bottom: 0; right: 0; background: #0009; z-index: 999; display: none;} .labMH0 > label > div > div {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); cursor: auto; padding: 20px; width: 400px;} .labMH0 input:checked ~ div {display: block;} .labMH0 > label > div > div > div {height: 100px; margin-bottom: 20px;} .labMH0 > label > div > div > strong::before, .labMH0 > label > div > div > strong::after {font: 30px HW Icons; content: "m"; display: inline-block; vertical-align: middle; margin: 0 5px 0 2px;} .labMH0 > label > div > div > strong::before {transform: rotateY(180deg);} .labMH0 > label > div > div > strong > b {font: 300 15px Montserrat; text-transform: uppercase; letter-spacing: 3px; color: #CCC;} .labMH0 > label > div > div > span > div {max-height: 150px; overflow: auto; margin-top: 5px;} .labMH0 > label > div > div > span > div a {font: 12px Montserrat; color: inherit !important; text-transform: uppercase; letter-spacing: 2px; transition: .3s;} .labMH0 > label > div > div > span > div a:hover {letter-spacing: 3px;} .labMH0 > label > div > div > span > div i {color: #CCC;} .miMH0 {display: block; font: 10px arial; letter-spacing: 2px; text-align: center; transition: .5s;} .miMH0:hover {letter-spacing: 10px;} .MH0 div::-webkit-scrollbar {width: 5px !important; height: 5px !important; background: #0006 !important;} .MH0 div::-webkit-scrollbar-thumb {background: #0003 !important;} </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!