Admin
Admin
alias
Hozzászólások
Pontok
Kor
Foglalkozás
Lakhely
PB
user
KERESETT NEVE
Ide írd le, hogy milyen kapcsolat van a karakterek között.
- Keresett karakterlap sablon:
- Kód:
<div class="MM085" style="color: #008799;"><div>
<div class="MM085-tt"><i></i> KERESETT NEVE</div>
<input type="radio" name="MM085" id="MM085-01" checked />
<input type="radio" name="MM085" id="MM085-02" />
<input type="radio" name="MM085" id="MM085-03" />
<div class="MM085-fx">
<div class="MM085-img">
<div style="background-image: url(KERESSTŐLKÉP1);"></div>
<div style="background-image: url(KERESSTŐLKÉP2);"></div>
<div style="background-image: url(KERESSTŐLKÉP3);"></div>
</div>
<div class="MM085-dd"><div>
<div class="MM085-txts">
<div><i class="ion-ios-document"></i><b>
<a href="">Csoport</a><span>IDE</span>
</b></div>
<div><i class="ion-ios-document"></i><b>
<a href="">Kor</a><span>IDE</span>
</b></div>
<div><i class="ion-ios-document"></i><b>
<a href="">Képesség</a><span>IDE</span>
</b></div>
<div><i class="ion-ios-document"></i><b>
<a href="">PB</a><span>IDE</span>
</b></div>
</div>
<div class="MM085-txts">
Ide írd le, hogy milyen kapcsolat van a karakterek között.
</div>
<div class="MM085-txts">
<div><i class="ion-ios-document"></i><b>
<a href="PROFIL LINK">Karakter neve</a><span>Kapcsolat rövid leírása</span>
</b></div>
<div><i class="ion-ios-document"></i><b>
<a href="PROFIL LINK">Karakter neve</a><span>Kapcsolat rövid leírása</span>
</b></div>
<div><i class="ion-ios-document"></i><b>
<a href="PROFIL LINK">Karakter neve</a><span>Kapcsolat rövid leírása</span>
</b></div>
</div>
</div></div>
</div>
<div class="MM085-labs">
<label for="MM085-01"><i class="ion-ios-create"></i><b>Adatok</b></label>
<label for="MM085-02"><i class="ion-ios-heart"></i><b>Kapcsolat</b></label>
<label for="MM085-03"><i class="ion-ios-people"></i><b>Ki keresi még?</b></label>
</div>
</div></div><a href="https://emmescodes.tumblr.com/" class="miMM"></a><link href="//dl.dropbox.com/s/hw1euzwqm52r3bk/IonCSS.css" rel="stylesheet"><style>@font-face { font-family: NewYork; src: url(https://dl.dropbox.com/s/esbjyrst1kgq99e/NewYork.otf); }.MM085, .MM085 * { box-sizing: border-box; scrollbar-color: #0006 #0002 !important; scrollbar-width: thin; transition: .5s; } .MM085 div::-webkit-scrollbar { width: 5px !important; height: 5px !important; background: #0002 !important; } .MM085 div::-webkit-scrollbar-thumb { background: #0006 !important; } .MM085 input, .MM085 br { display: none; } .MM085 { --mm-2: #999; --mm-3: #333; --mm-4: #131313; --mm-5: #202020; width: 450px; margin: 10px auto; border: 1px solid; padding: 0 10px; text-align: center; font: 12px Calibri; } .MM085 > div { background: repeating-linear-gradient(35deg, var(--mm-4) 0px, var(--mm-4) 6px, var(--mm-5) 6px, var(--mm-5) 7px); border: 1px solid var(--mm-3); margin: -11px 0; } .MM085-tt { border: 1px solid var(--mm-3); background-color: var(--mm-4); padding: 20px; margin: 30px; font: 22px NewYork; letter-spacing: 2px; } .MM085-tt > i { display: block; font: 10px calibri; color: var(--mm-2); } .MM085-fx { display: flex; border-top: 1px solid var(--mm-3); border-bottom: 1px solid var(--mm-3); } .MM085-img { min-width: 130px; border: 5px solid var(--mm-4); box-shadow: inset 0 0 0 1px var(--mm-3); position: relative; } .MM085-img::before { content: ""; position: absolute; border: 1px solid; top: -17px; left: -17px; right: -17px; bottom: -17px; } .MM085-dd { flex: 1; border-left: 1px solid var(--mm-3); padding: 30px; } .MM085-dd > div { border: 1px solid var(--mm-3); padding: 5px; background: var(--mm-4); } .MM085-txts { border: 1px solid var(--mm-3); height: 220px; overflow: auto; text-align: left; pointer-events: none; opacity: 0; } .MM085-txts ~ .MM085-txts { margin-top: -220px; } .MM085-txts > div { display: flex; position: relative; } .MM085-txts > div::before { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid; content: ""; transition: .5s; pointer-events: none; opacity: 0; } .MM085-txts > div:hover::before { opacity: 1; } .MM085-txts > div > i { border-right: 1px solid var(--mm-3); padding: 13px; font-size: 14px; } .MM085-txts > div ~ div { border-top: 1px solid var(--mm-3); } .MM085-txts a { color: inherit !important; padding: 5px; display: block; border-bottom: 1px solid var(--mm-3); } .MM085-txts > div > b { flex: 1; } .MM085-txts span { font-size: 10px; color: var(--mm-2); display: block; letter-spacing: 1px; padding: 0 4px 2px; } #MM085-01:checked ~ div .MM085-txts:nth-of-type(1), #MM085-02:checked ~ div .MM085-txts:nth-of-type(2), #MM085-03:checked ~ div .MM085-txts:nth-of-type(3) { pointer-events: auto; opacity: 1; } .MM085-labs { display: flex; margin: 30px; background: var(--mm-4); padding: 5px; border: 1px solid var(--mm-3); } .MM085-labs > label { border: 1px solid var(--mm-3); flex-grow: 1; padding: 15px; display: flex; flex-direction: column; cursor: pointer; } .MM085-labs > label ~ label { margin-left: 5px; } .MM085-labs b { color: var(--mm-2); text-transform: uppercase; font-size: 10px; } .MM085-labs i { font-size: 20px; color: var(--mm-2); } #MM085-01:checked ~ div label[for*="01"], #MM085-02:checked ~ div label[for*="02"], #MM085-03:checked ~ div label[for*="03"] { border-color: initial; } #MM085-01:checked ~ div label[for*="01"] i, #MM085-02:checked ~ div label[for*="02"] i, #MM085-03:checked ~ div label[for*="03"] i { color: inherit; } .MM085-img > div { position: absolute; top: 1px; left: 1px; right: 1px; bottom: 1px; background-position: center; background-size: cover; opacity: 0; } #MM085-01:checked ~ div .MM085-img > div:nth-of-type(1), #MM085-02:checked ~ div .MM085-img > div:nth-of-type(2), #MM085-03:checked ~ div .MM085-img > div:nth-of-type(3) { opacity: 1; } .MM085-txts a:hover { letter-spacing: 2px; } .miMM { display: block; font: bold 10px Calibri; letter-spacing: 2px; text-align: center; transition: 0.5s; text-transform: uppercase; padding: 3px; color: #999 !important; } .miMM:hover { letter-spacing: 3px; }</style><link href="//icons.cappuccicons.com/cpf.css" rel="stylesheet">
Engedélyek ebben a fórumban:
Nem válaszolhatsz egy témára ebben a fórumban.