Chat Noir - Expediente

<link href="https://fonts.googleapis.com/css2?family=Arimo&family=Yeseva+One&display=swap" rel="stylesheet"><script src="//pull.cappuccicons.com/cpf.js"></script><div class="mirbox" id="chatnoir"> <div class="mirboxtop"> <div class="mirboxphr">Marshmallow carrot cake wafer powder cotton candy sugar plum chocolate cake lollipop jelly. Toffee sesame snaps jelly-o muffin ice cream cookie. Candy croissant candy powder ice cream powder bear claw sweet pastry. Pudding liquorice tootsie roll oat cake pie icing pudding tootsie roll.</div><div class="mirboxsig"><span class="cp cp-paw"></span></div><div class="mirboxtit">Chat Noir</div></div><div class="mirboxmiddle"> <div class="mirboxbar"></div><div class="mirboxcon0"> <input type="checkbox" name="mirchat1" id="mirchat1"/> <input type="checkbox" name="mirchat2" id="mirchat2"/> <input type="checkbox" name="mirchat3" id="mirchat3"/> <div class="mirc0"><img src="http://pa1.narvii.com/6352/d118fa3036c1388e7f78297a89f4340ba54804ab_00.gif"></img></div><div class="mirc1"> <div class="mirc1tit">Personalidad</div><div class="mirc1cont0"> <img src="https://i.pinimg.com/originals/13/9b/d9/139bd9e50bfd2f641dacf08b35823ff9.gif"></img> <div class="mirc1con1">Macaroon jelly-o cake tootsie roll cheesecake tootsie roll soufflé jelly cupcake. Cotton candy marshmallow bonbon apple pie halvah croissant apple pie gingerbread. Pie sesame snaps shortbread lollipop marshmallow topping. Chupa chups dessert gingerbread gummies cupcake. Carrot cake pastry cotton candy gummi bears brownie sugar plum pie. Dessert cotton candy cheesecake cotton candy icing cheesecake oat cake. Sweet roll sesame snaps fruitcake chupa chups cotton candy. Jelly beans sesame snaps dessert soufflé gummies. Dragée cookie toffee jelly beans dragée lemon drops. Soufflé caramels wafer cake toffee apple pie pastry biscuit brownie. Sweet pie candy oat cake tootsie roll carrot cake oat cake chocolate cake. Jelly gummi bears fruitcake dragée lollipop tiramisu. Gummi bears jelly-o macaroon halvah danish cupcake wafer halvah chupa chups.</div></div></div><div class="mirc2"> <div class="mirc2tit">Historia</div><div class="mirc2txt"><div class="mirc2txt1">Biscuit chupa chups cookie shortbread gummies icing. Pudding jelly lemon drops pie muffin dessert pie. Sweet chocolate bar jujubes fruitcake croissant dessert chocolate cake tiramisu tiramisu. Cupcake apple pie cotton candy gummies donut apple pie. Jelly sweet jelly-o croissant tiramisu. Bear claw cake dessert pastry shortbread. Tootsie roll shortbread jelly beans chocolate cheesecake. Halvah dragée liquorice soufflé candy apple pie wafer macaroon. Wafer bear claw tootsie roll pie soufflé dessert dessert. Chocolate cake pastry pastry pudding dragée tiramisu croissant gummi bears. Jujubes apple pie chocolate dessert carrot cake lemon drops cupcake apple pie. Gingerbread bonbon jelly ice cream cake marshmallow cupcake cupcake toffee. Wafer candy fruitcake icing soufflé tart. Bear claw cotton candy pudding muffin wafer</div></div></div><div class="mirc3"> <div class="mirc3cont"> <span class="mirc3dat">Dato1</span> <span class="mirc3dat">Dato1</span> <span class="mirc3dat">Dato1</span> <span class="mirc3dat">Dato1</span> <span class="mirc3dat">Dato1</span> <span class="mirc3dat">Dato1</span> <span class="mirc3dat">Dato1</span> </div></div><div class="mircontbot"> <label for="mirchat1">Personalidad</label> <label for="mirchat2">Historia</label> <label for="mirchat3">Otro</label> </div></div></div><div class="mirboxbottom" style="height: 30px;"></div></div><div class="mystcred"><a href="https://mystiqueworkshop.tumblr.com/">MYSTIQUE</a></div><style>#chatnoir{--mirfondo: #000; --miraccent: #7ed957; --mircolor1: #FFF; --mirtext: #000; --mirtxt1: #FFF;}.mirbox{width: 510px; height: auto; margin: 0 auto; background: var(--mirfondo); padding: 25px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: justify;}.mirboxtop, .mirboxbottom{width: 470px; height: 100px; padding: 20px; background: var(--miraccent); display: flex; justify-content: space-around; align-items: center;}.mirboxphr{font: 12px 'Arimo'; width: 350px; font-style: italic;}.mirboxsig{width: 70px; height: 70px; padding: 10px; display: flex; justify-content: center; align-item: center; font-size: 70px; border: 1px solid var(--mirfondo); border-radius: 100%;}.mirboxtit{width: 470px; position: absolute; font: 50px 'Yeseva One'; margin-top: 130px; text-align: center; text-shadow: 2px 2px var(--miraccent); color: var(--mirfondo);}.mirboxmiddle{width: 500px; height: 350px; padding: 10px; display: flex; justify-content: space-around; align-items: center; margin-top: 15px;}.mirboxbar{width: 40px; height: 350px; background: var(--miraccent);}.mirboxcon0{width: 450px; height: 330px; overflow:hidden;}.mirboxcon0 input{display:none;}.mircontbot{width: 450px; display: flex; justify-content: center; margin-top: 7px;}.mircontbot label{cursor:pointer; text-align: center;margin-left: 5px; width: 100px; height: 10px; padding: 10px; background: var(--miraccent); font: 15px 'Arimo'; display: flex; justify-content: center; align-items: center;}.mirc0{width: 430px; height: 280px; margin: 0 auto; padding: 5px; border: 1px solid var(--miraccent); display: flex; justify-content: center; align-items: center;}.mirc0 img{width: 430px; height: 280px;}.mirc1, .mirc2, .mirc3{width: 410px; height: 260px; position: absolute; margin-left: 10px; background: var(--miraccent); padding: 10px; opacity: 0; margin-top: 100px; transition: all 1s ease-out; z-index: 1;}.mirboxcon0 input#mirchat1:checked ~ .mirc1{margin-top: -286px; opacity: 1; transition: all 1s ease-in; z-index: 1;}.mirc1tit{font: 30px 'Yeseva One'; text-shadow: 2px 2px var(--miraccent); color: var(--mirfondo);}.mirc1cont0{display: flex; justify-content: space-around; align-items: center;}.mirc1cont0 img{width: 150px; height: 200px; padding: 5px; border: 1px solid var(--mirfondo);}.mirc1cont0 .mirc1con1{width: 240px; height: 180px; overflow: auto; overflow: auto; padding: 5px; padding-right: 15px; font: 12px 'Arimo'; color: var(--mirtxt);}.mirboxcon0 input#mirchat2:checked ~ .mirc2{margin-top: -286px; opacity: 1; transition: all 1s ease-in; z-index: 1;}.mirc2tit{font: 30px 'Yeseva One'; text-shadow: 2px 2px var(--miraccent); color: var(--mirfondo);}.mirc2txt{width: 440px; height: 200px; display: flex; justify-content: center; align-items: center;}.mirc2txt1{width: 360px; height: 180px; overflow: auto; padding-right: 15px; margin-top: 40px; font: 12px 'Arimo'; margin-left: -10px; margin-top: 25px; color: var(--mirtxt);} .mirboxcon0 input#mirchat3:checked ~ .mirc3{margin-top: -286px; opacity: 1; transition: all 1s ease-in; z-index: 1;}.mirc3cont{width: 400px; height: 230px; overflow: auto; border: 20px solid transparent;}.mirc3cont span{width: 90%; padding: 5px; background: var(--mirfondo); display: inline-block; margin-bottom: 5px; font: 15px 'Arimo'; color: var(--mirtxt1);}.mystcred{width: 540px; margin: 1px auto; text-align: center;}.mystcred a{font: 11px 'century gothic'; text-decoration: none; color: #000; font-weight: 500;}.mirc2txt1::-webkit-scrollbar{width:4px; height: auto;}.mirc1con1::-webkit-scrollbar{width:4px; height: auto;}.mirc2txt1::-webkit-scrollbar-thumb:vertical{width: 4px; height:10px; background-color: var(--mirfondo);}.mirc1con1::-webkit-scrollbar-thumb:vertical{width: 4px; height:10px; background-color: var(--mirfondo);}</style>