Create a new version of paste:

<div class="MM092"><div style="background-image: url(https://i.postimg.cc/qBjv5qRs/hr1.jpg);"><b></b>

<input type="radio" name="MM092" id="MM092-01" checked />
<input type="radio" name="MM092" id="MM092-02" />
<input type="radio" name="MM092" id="MM092-03" />
<input type="radio" name="MM092" id="MM092-04" />

<div class="MM092-lab">
<label for="MM092-01">Inicio</label>
<label for="MM092-02">Personalidad</label>
<label for="MM092-03">Historia</label>
<label for="MM092-04">Extras</label>
</div>

<div class="MM092-fx"><div>

</***********PRIMER PESTAÑA******************/>
<div class="MM092-pestaña m1">
<div class="MM092-img">
<div style="background-image: url(https://i.postimg.cc/bwc6KQ3W/hr01.png);"></div>
<div style="background-image: url(https://i.postimg.cc/vZrPMcKB/hr02.png);"></div>
</div>

<div class="MM092-tt">
<i>Conoce el universo de</i>
<b>She Corvus Clan</b>
</div>

<div class="MM092-info">
<div><b>Nombre:</b> Info Aquí.</div>
<div><b>Edad:</b> Info Aquí.</div>
<div><b>Nacionalidad:</b> Info Aquí.</div>
<div><b>Grupo:</b> Info Aquí.</div>
<div><b>Rango:</b> Info Aquí.</div>
<div><b>Played by:</b> Info Aquí.</div>
</div>

</div>

</***********SEGUNDA PESTAÑA******************/>
<div class="MM092-pestaña m2">
<div class="MM092-txt"><div>Marzipan lollipop cheesecake cheesecake candy canes. Gummi bears ice cream chocolate halvah gummies topping ice cream. Cupcake sugar plum tootsie roll biscuit chocolate cake sugar plum tootsie roll jelly. Cookie brownie croissant croissant shortbread bear claw cotton candy cupcake.

Cheesecake bear claw chocolate cake marshmallow topping donut chupa chups candy canes bear claw. Icing cheesecake caramels gummies apple pie. Topping dragée sweet roll donut jelly beans. Chocolate bar apple pie candy canes tart donut soufflé marzipan.

Halvah soufflé marzipan cookie marshmallow. Chocolate bar donut dessert croissant halvah candy canes. Candy candy chocolate cake donut cotton candy candy topping cookie pudding. Jelly-o dessert biscuit cotton candy sweet roll bonbon.

Chocolate bar jelly-o sweet roll sweet roll soufflé donut caramels sweet carrot cake. Topping chocolate cake wafer candy canes pudding cheesecake. Jelly-o chocolate bar oat cake jujubes jelly marshmallow bonbon sweet.

Shortbread marshmallow toffee powder pie macaroon. Candy tiramisu muffin caramels pastry caramels biscuit. Macaroon chocolate macaroon cookie cotton candy tart macaroon.</div></div>
</div>

</***********TERCERA PESTAÑA******************/>
<div class="MM092-pestaña m3">
<div class="MM092-txt"><div>Cheesecake bear claw chocolate cake marshmallow topping donut chupa chups candy canes bear claw. Icing cheesecake caramels gummies apple pie. Topping dragée sweet roll donut jelly beans. Chocolate bar apple pie candy canes tart donut soufflé marzipan.

Halvah soufflé marzipan cookie marshmallow. Chocolate bar donut dessert croissant halvah candy canes. Candy candy chocolate cake donut cotton candy candy topping cookie pudding. Jelly-o dessert biscuit cotton candy sweet roll bonbon.

Chocolate bar jelly-o sweet roll sweet roll soufflé donut caramels sweet carrot cake. Topping chocolate cake wafer candy canes pudding cheesecake. Jelly-o chocolate bar oat cake jujubes jelly marshmallow bonbon sweet.

Shortbread marshmallow toffee powder pie macaroon. Candy tiramisu muffin caramels pastry caramels biscuit. Macaroon chocolate macaroon cookie cotton candy tart macaroon.</div></div>
</div>

</***********CUARTA PESTAÑA******************/>
<div class="MM092-pestaña m4">
<div class="MM092-xx"><b>Gustos</b>Tiramisu chocolate pudding brownie jujubes. Tootsie roll caramels pudding pastry apple pie jelly. Biscuit cheesecake shortbread lemon drops macaroon chocolate cake.

Chocolate cake cupcake pastry sugar plum cookie gummies. Marzipan caramels muffin toffee fruitcake lemon drops. Shortbread cheesecake jujubes chupa chups marzipan cheesecake ice cream sugar plum jelly-o. Ice cream carrot cake pastry marzipan cheesecake sesame snaps gummies gingerbread.

<b>Disgustos</b>Shortbread caramels brownie jelly sweet roll bonbon tiramisu. Pie marzipan chocolate cake cookie lollipop sesame snaps. Donut tart liquorice jelly beans cupcake.

Sugar plum dessert tiramisu powder muffin topping. Wafer cupcake lollipop biscuit wafer topping icing candy canes shortbread. Oat cake oat cake fruitcake lemon drops jelly beans.

<b>Familia</b>Macaroon pudding gummi bears muffin cake ice cream. Powder macaroon oat cake topping cupcake biscuit lemon drops. Cake cheesecake macaroon tiramisu marshmallow.</div>
</div>

</div></div>

<div class="MM092-fl">
<label for="MM092-01"></label>
<label for="MM092-02"></label>
<label for="MM092-03"></label>
<label for="MM092-04"></label>
</div>

</div></div><a href="https://emmescodes.tumblr.com/" class="miMM">emme</a><link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Playfair+Display:wght@400;700&display=swap" rel="stylesheet"><style>@font-face { font-family: SGothic; src: url(https://dl.dropbox.com/s/dll890qp9alk0mr/SGothic.ttf); } .MM092, .MM092 * { box-sizing: border-box; scrollbar-color: #0006 #0002 !important; scrollbar-width: thin; transition: 2s; } .MM092 div::-webkit-scrollbar { width: 5px !important; height: 5px !important; background: #0002 !important; } .MM092 div::-webkit-scrollbar-thumb { background: #0006 !important; } .MM092 input, .MM092 br { display: none; } .MM092 { --mm-01: #564d25; --mm-02: #FFF; width: 500px; background: #111; overflow: hidden; padding: 20px; margin: auto; border: 1px solid #000; font: 10px Montserrat; color: #DDD; position: relative; text-shadow: 1px 1px #111, -1px 1px #111, 1px -1px #111, -1px -1px #111, 0 5px 5px #000; box-shadow: 0 20px 30px -20px #000; } .MM092 > div { min-height: 300px; background-position: center; border: 1px solid var(--mm-01); padding: 30px; display: flex; flex-direction: column; align-items: center; } .MM092 > div::after, .MM092 > div::before, .MM092::after, .MM092::before { content: ""; position: absolute; width: 10px; height: 10px; top: 20px; left: 20px; z-index: 200; background: #111; border-color: var(--mm-01); border-style: solid; } .MM092::before { border-width: 0 1px 1px 0; } .MM092::after { left: calc(100% - 30px); border-width: 0 0 1px 1px; } .MM092 > div::before { top: calc(100% - 30px); border-width: 1px 1px 0 0; } .MM092 > div::after { left: calc(100% - 30px); top: calc(100% - 30px); border-width: 1px 0 0 1px; } .MM092 > div > b { position: absolute; top: 21px; left: 21px; right: 21px; bottom: 21px; background: linear-gradient(to top, #111D, #1119, transparent); } .MM092-fx { width: 100%; } .MM092-fx > div { display: flex; width: 400%; } .MM092-pestaña { width: 25%; } .MM092-tt { display: flex; flex-direction: column; align-items: center; letter-spacing: 2px; } .MM092-tt > b { font: 30px/24px Playfair Display; color: var(--mm-02); display: flex; align-items: center; } .MM092-tt > b::after, .MM092-tt > b::before { content: ""; width: 30px; background: var(--mm-01); height: 4px; border: 1px solid #111; margin: 10px; box-shadow: 0 3px 8px #000; } .MM092 > div > b ~ * { z-index: 10; } .MM092-lab { width: 100%; display: flex; } .MM092-lab > label { border: 1px solid var(--mm-01); flex-grow: 1; padding: 5px; text-align: center; background: #1119; text-transform: uppercase; font-size: 8px; letter-spacing: 2px; box-shadow: 0 3px 8px #000; position: relative; cursor: pointer; transition: .3s; } .MM092-lab > label ~ label { margin-left: 5px; } .MM092-lab > label:hover, #MM092-01:checked ~ div label[for*="-01"], #MM092-02:checked ~ div label[for*="-02"], #MM092-03:checked ~ div label[for*="-03"], #MM092-04:checked ~ div label[for*="-04"] { font-weight: bold; } .MM092-lab label:active { transform: scale(.8); } #MM092-01:checked ~ .MM092-lab label[for*="-01"]::before, #MM092-02:checked ~ .MM092-lab label[for*="-02"]::before, #MM092-03:checked ~ .MM092-lab label[for*="-03"]::before, #MM092-04:checked ~ .MM092-lab label[for*="-04"]::before { content: ""; bottom: -2px; left: 0; right: 0; border-top: 3px solid var(--mm-01); position: absolute; } #MM092-02:checked ~ .MM092-fx > div { margin-left: -100%; } #MM092-03:checked ~ .MM092-fx > div { margin-left: -200%; } #MM092-04:checked ~ .MM092-fx > div { margin-left: -300%; } .MM092-pestaña { filter: blur(100px); opacity: 0; pointer-events: none; } #MM092-01:checked ~ div .MM092-pestaña.m1, #MM092-02:checked ~ div .MM092-pestaña.m2, #MM092-03:checked ~ div .MM092-pestaña.m3, #MM092-04:checked ~ div .MM092-pestaña.m4 { filter: blur(0px); opacity: 1; pointer-events: auto; } .MM092-fl > label { position: absolute; top: 50%; width: 30px; height: 35px; background-image: url(https://i.postimg.cc/dQ2C6pLb/hrFlecha.png); transform: rotateY(180deg); right: 40px; opacity: 0; pointer-events: none; transition: 0s !important; cursor: pointer; background-size: 100% 100%; z-index: 100; } .MM092-fl > label:hover { width: 35px; height: 45px; margin: -5px -2.5px; } .MM092-fl > label:active { width: 25px; height: 25px; margin: 5px 2.5px; } #MM092-01:checked ~ .MM092-fl label[for*="-02"], #MM092-02:checked ~ .MM092-fl label[for*="-03"], #MM092-03:checked ~ .MM092-fl label[for*="-04"] { pointer-events: auto; opacity: 1; } #MM092-02:checked ~ .MM092-fl label[for*="-01"], #MM092-03:checked ~ .MM092-fl label[for*="-02"], #MM092-04:checked ~ .MM092-fl label[for*="-03"] { right: inherit; left: 40px; transform: none; pointer-events: auto; opacity: 1; } .MM092-img { margin: 50px; height: 280px; display: flex; align-items: center; justify-content: center; } .MM092-img::after { content: url('https://i.postimg.cc/kgH5JgR0/klipartz-com.png'); } .MM092-img > div { position: absolute; width: 130px; height: 170px; z-index: -1; margin-top: 5px; background-position: center; background-size: cover; border-radius: 50%; box-shadow: inset 5px 9px 5px #000; } .MM092-img > div ~ div { opacity: 0; } .MM092:hover .MM092-img > div ~ div { opacity: 1; } .MM092-info { display: flex; flex-wrap: wrap; font-size: 12px; margin: 35px -10px -5px; } .MM092-info > div { margin: 5px 10px; min-width: 40%; display: flex; justify-content: space-between; flex: 1; border-bottom: 1px dotted var(--mm-01); text-shadow: none; } .MM092-info b { border-bottom: 3px solid var(--mm-01); margin-bottom: -2px; } .MM092-txt { position: relative; padding: 30px 30px 0; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; } .MM092-txt::before { content: url(https://i.postimg.cc/sf9gLZ5X/txtop.png); } .MM092-txt::after { content: url(https://i.postimg.cc/L698F6VV/txtbot.png); } .MM092-txt > div { margin: 20px; text-align: justify; hyphens: auto; font-size: 12px; max-height: 300px; overflow: auto; } .MM092-txt > div::first-letter { font: 50px SGothic; float: left; margin: 7px 5px -3px 0; background: var(--mm-01); padding: 10px; border: 1px solid #111; } .MM092-xx br, .MM092-txt > div br { display: block; margin-top: 5px; } .MM092-pestaña.m4 { display: flex; align-items: center; justify-content: center; } .MM092-xx { margin: 40px; text-align: justify; font-size: 12px; hyphens: auto; max-height: 450px; overflow: auto; } .MM092-xx > b { float: left; border-bottom: 3px solid var(--mm-01); letter-spacing: 2px; margin: 6px 10px 0 0; } .miMM { display: block; font: bold 10px Calibri; letter-spacing: 2px; text-align: center; transition: 0.5s; text-transform: uppercase; padding: 3px; color: #DDD !important; } .miMM:hover { letter-spacing: 3px; }</style>