исходники
Сообщений 1 страница 7 из 7
Поделиться52023-01-20 18:48:32
[html]<link href="https://fonts.googleapis.com/css2?family=Poiret+One&display=swap" rel="stylesheet">
<style>
.welcomeback { background: #b61c88; background: #b61c88; background: -moz-linear-gradient(-45deg, #b24592 0%, #e81b83 50%, #f15f79 100%); background: -webkit-linear-gradient(-45deg, #b24592 0%,#e81b83 50%,#f15f79 100%); background: linear-gradient(135deg, #b24592 0%,#e81b83 50%,#f15f79 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b61c88', endColorstr='#f12b80',GradientType=1 ); position: relative; margin: 20px auto 0px; width: 500px; height: 550px; border-bottom: 50px solid black; }
.wbhide { position: relative; width: 500px; height: 600px; overflow: hidden; }
.welcomeback input { display: none; }
#wbsecond+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Poiret+One; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbeighth+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Poiret+One; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfirst+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Poiret+One; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfifth+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Poiret+One; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbsixth+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Poiret+One; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbthird+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Poiret+One; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfourth+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Poiret+One; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
.welcomeback label i { font-size: 10px; font-style: normal; letter-spacing: 10px; margin-right: -10px; color: #f15f79; }
.in1 { height: 500px; width: 400px; position: absolute; top: 50px; left: -500px; outline: 1px solid black; outline-offset: 10px; overflow: hidden; transition: 0.6s; opacity: 0; z-index: 2; }
.inimg { position: absolute; background-size: cover; height: 300px; width: 300px; border-radius: 100%; border: 10px solid #e81b83; box-shadow: 0 0 0 1px black; top: 35px; left: 35px; -webkit-transition: 0.7s; transition: 0.7s; transition-delay: 0.5s; -webkit-transition-delay: 0.5s; }
.inimg:after { height: 300px; width: 300px; position: absolute; content: ""; border-radius: 100%; background: #03157e; mix-blend-mode: hard-light; border: 1px solid black; top: -1px; left: -1px; }
.in1:hover .inimg { opacity: 0; -webkit-transition: 0.5s; transition: 0.5s; transition-delay: 0s; -webkit-transition-delay: 0s; transform: rotate(360deg); -webkit-transform: rotate(360deg); }
.in1 name { display: block; font-family: Poiret+One; color: black; font-size: 40px; letter-spacing:20px; position: absolute; bottom: 20px; width: 100%;; text-align: center; text-transform: uppercase; right: -10px; line-height: 140%; }
.winfo1, .winfo2, .winfo3, .winfo4, .winfo5, .winfo6 { padding: 10px; font-family: Poiret+One; position: absolute; letter-spacing: 1px; text-align: right; width: calc(100% - 20px); font-size: 14px; transition: 0.9s; transition-delay: 0s; opacity: 0; top: -400px; background: black; display: flex; flex-direction: row-reverse; border-radius: 10px; color: white; line-height: 100%; justify-content: space-between; }
.winfo2, .winfo4, .winfo6 { text-align: left; flex-direction: row; }
.winfo1 b, .winfo3 b, .winfo5 b { color: #f15f79; text-transform: uppercase; letter-spacing: 5px; margin-left: 10px; font-family: Poiret+One; line-height:130%; }
.winfo2 b, .winfo4 b, .winfo6 b { color: #b24592; text-transform: uppercase; letter-spacing: 5px; margin-right: 10px; font-family: Poiret+One; line-height:130%; }
.in1:hover .winfo1 { transition-delay: 0.2s; opacity: 1; top: 0px; }
.wbplayer .winfo1 { top: 0px; opacity: 1; }
.wbplayer .winfo2 { top: 60px; opacity: 1; }
.wbplayer .winfo3 { top: 120px; opacity: 1; }
.wbplayer .winfo1 b, .wbplayer .winfo3 b { color: #0575e6; }
.wbplayer .winfo2 b { color: #25d6c2; }
.winfo2 { top: -340px; }
.in1:hover .winfo2 { transition-delay: 0.4s; opacity: 1; top: 60px; }
.winfo3 { top: -280px; }
.in1:hover .winfo3 { transition-delay: 0.6s; opacity: 1; top: 120px; }
.winfo4 { top: -220px; }
.in1:hover .winfo4 { transition-delay: 0.8s; opacity: 1; top: 180px; }
.winfo5 { top: -160px; }
.in1:hover .winfo5 { transition-delay: 1s; opacity: 1; top: 240px; }
.winfo6 { top: -100px; }
.in1:hover .winfo6 { transition-delay: 1.2s; opacity: 1; top: 300px; }
#wbsecond:checked ~ #wbfirst+label { opacity: 1; z-index: 3; }
#wbsecond:checked ~ #wbfirst+label i { color: #25d6c2; }
#wbfirst:checked ~ #wbsecond+label { opacity: 1; z-index: 3; }
#wbfirst:checked ~ .in1 { left: 50px; opacity:1; transition-delay: 0.5s; }
#wbsecond:checked ~ #wbthird+label { opacity: 1; z-index: 3; }
#wbsecond:checked ~ #wbthird+label i { color: #25d6c2 }
.wbgradient { height: 0px; width: 0px; background: #25d6c2; background: -moz-linear-gradient(45deg, #25d6c2 0%, #0575e6 50%, #03157e 100%); background: -webkit-linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); background: linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25d6c2', endColorstr='#03157e',GradientType=1 ); position: absolute; right: -500px; top: -500px; border-radius: 100%; transition: 0.4s; transition-delay: 0s; opacity: 0; transition-delay: 0.3s; }
#wbsecond:checked ~ .wbgradient, #wbfourth:checked ~ .wbgradient2 { top: 0px; right: 0px; border-radius: 0%; opacity: 1; height: 550px; width: 500px; }
#wbthird:checked ~ .wbgradient { right: 500px; }
#wbthird:checked ~ #wbfifth+label { opacity: 1; z-index: 3; }
#wbthird:checked ~ #wbfourth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbsixth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbsixth+label i { color: #25d6c2 }
.win2 { height: 350px; width:295px; position: absolute; top: 50px; right: -550px; overflow: auto; transition: 0.6s; border: 50px solid black; background: black; opacity: 0; outline: 1px solid white; outline-offset: 10px; padding-right: 5px; color: #c7c7c7; font-family: Poiret+One; font-size: 12px; text-align: justify; line-height: 210%; letter-spacing: 0.5px; z-index: 2; transition-delay: 0s; }
.welcomeback h1 { color:#b24592; font-family: Poiret+One; letter-spacing: 10px; font-size: 12px; border-bottom: 1px solid #666; }
.win2 b { background: #b24592; color: white; padding: 0px 2px; }
.welcomeback h2 { text-transform: lowercase; text-align: center; font-style: italic; letter-spacing: 2px; color: white; font-size: 13px; }
.wbfree img { color:#25d6c2; font-family: Poiret+One; letter-spacing: 10px; font-size: 12px; border-bottom: 1px solid #666; }
.wbfree b { background: #25d6c2; color: white; padding: 0px 2px; }
.wbfree h2 { text-transform: lowercase; text-align: center; font-style: italic; letter-spacing: 2px; color: black; font-size: 13px; }
#wbthird:checked ~ .win2 { right: 50px; opacity: 1; transition-delay: 0.3s; }
#wbfourth:checked ~ .win2 { right: 550px; transition-delay: 0s; }
.wbgradient2 { height: 0px; width: 0px; background: #25d6c2; background: -moz-linear-gradient(45deg, #25d6c2 0%, #0575e6 50%, #03157e 100%); background: -webkit-linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); background: linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25d6c2', endColorstr='#03157e',GradientType=1 ); position: absolute; right: -500px; top: -500px; border-radius: 100%; transition: 0.4s; opacity: 0; transition-delay: 0.3s; }
#wbseventh+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Poiret+One; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfirst:checked ~ #wbseventh+label { opacity: 1; z-index: 3; }
#wbfirst:checked ~ .wbgradient2 { right: 500px; transition-delay: 0.3s; }
#wbfourth:checked ~ .in1 { left: 550px; transition-delay: 0s; }
#wbfourth:checked ~ #wbeighth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbeighth+label i { color: #25d6c2 }
.wbfree { height: 350px; width:330px; position: absolute; top: 50px; right: 10px; overflow: auto; transition: 0.4s; border: 50px solid white; background: white; opacity: 0; outline: 1px solid black; outline-offset: 10px; padding-right: 5px; color: #555; font-family: Poiret+One; font-size: 12px; text-align: justify; line-height: 210%; letter-spacing: 0.5px; }
#wbsecond:checked ~ .wbfree { opacity: 1; transition-delay: 0.6s; z-index: 1; }
.wbplayer { height: 500px; width: 400px; position: absolute; top: 50px; left: 50px; outline: 1px solid black; outline-offset: 10px; overflow: hidden; transition: 0.4s; opacity: 0; transition-delay: 0s; }
#wbfourth:checked ~ .wbplayer { opacity: 1; transition-delay: 0.6s; z-index: 1; }
.wbalias { font-family: Poiret+One; color: white; position: absolute; width: 100%; right: -10px; text-align: center; bottom: 250px; font-size: 40px; letter-spacing: 10px; line-height: 100%; }
.wbplayerpic { position: absolute; height: 200px; width: 360px; background-size: cover; bottom: 30px; right: 20px; outline: 1px solid black; outline-offset:10px; }
.wbtriggers { position: absolute; width: 100%; right: -4px; font-size: 12px; font-family: Poiret+One; color: white; bottom: 300px; letter-spacing: 4px; text-align: center; }
.wbplayerpic:after { background: #0575e6; height: 200px; width: 360px; content:''; position: absolute; mix-blend-mode: hard-light; }
.win2::-webkit-scrollbar{width:1px} .win2::-webkit-scrollbar-track{background:transparent!important;border:none!important} .win2::-webkit-scrollbar-thumb{background: white} .wbfree::-webkit-scrollbar{width:1px} .wbfree::-webkit-scrollbar-track{background:transparent!important;border:none!important} .wbfree::-webkit-scrollbar-thumb{background: black}
</style>
<div class="welcomeback">
<div class="wbhide">
<input type="radio" id="wbfirst" name="wb" checked>
<label for="wbfirst"><<<<br><i>Информация</i></label>
<input type="radio" id="wbsecond" name="wb">
<label for="wbsecond">>>><br><i>Достижения</i></label>
<input type="radio" id="wbfirst" name="wb">
<label for="wbfirst"><<<<br><i>Информация</i></label>
<input type="radio" id="wbthird" name="wb">
<label for="wbthird">>>><br><i>Подарки</i></label>
<input type="radio" id="wbfifth" name="wb">
<label for="wbsecond"><<<<br><i>Достижения</i></label>
<input type="radio" id="wbfourth" name="wb">
<label for="wbfourth">>>><br><i>Плашки</i></label>
<input type="radio" id="wbsixth" name="wb">
<label for="wbthird"><<<<br><i>Подарки</i></label>
<input type="radio" id="wbseventh" name="wb">
<label for="wbfourth"><<<<br><i>Плашки</i></label>
<input type="radio" id="wbeighth" name="wb">
<label for="wbfirst">>>><br><i>Информация</i></label>
<div class="in1">
<div class="inimg" style="background-image: url(https://forumupload.ru/uploads/001a/dc/75/2/160989.jpg)"></div>
<name>Имя<br>Фамилия</name>
<div class="winfo1">палач в «оси»; наркоман<b>Роль: </b> </div>
<div class="winfo2"> <b>Кличка:</b> о, это же тот ебанутый нарик? </div>
<div class="winfo3"> ответ <b>хуй знает что:</b></div>
<div class="winfo4"><b>Способность:</b> металлокинез (класс I/ранг C)</div>
<div class="winfo5">0%<b>Известность: </b> </div>
<div class="winfo6"><b>Репутация: </b> 0%</div>
</div>
<div class="wbgradient"></div>
<div class="wbfree">
<img src="https://forumupload.ru/uploads/001b/9c/16/3/858098.png" title="Розовый динозаврик"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/858098.png" title="Розовый динозаврик">
</div>
<div class="win2">
This is where the SHIPPER goes!
<h1>this is a title</h1>
<h2>this is a different title</h2>
</p>
</p>
</div>
<div class="wbgradient2"></div>
<div class="wbplayer">
<div class="winfo1"><b>player age</b> HERE</div>
<div class="winfo2"><b>time zone</b> HERE</div>
<div class="winfo3"><b>contact</b> HERE</div>
<div class="wbtriggers"><<< ( triggers: HERE ) >>></div>
<div class="wbalias">monty</div>
<div class="wbplayerpic" style="background-image: url(http://placehold.it/200x360)"></div>
</div>
</div>
</div><center><a href="http://wecode.jcink.net/index.php?showuser=4933" style="color:#ccc;font-size:7px;letter-spacing:5px;">MONTY</a></center>[/html]
Поделиться62023-01-20 19:53:12
[html]<link href="https://fonts.googleapis.com/css?family=Abel|Anton|Staatliches" rel="stylesheet">
<style>
.welcomeback { background: #b61c88; background: #b61c88; background: -moz-linear-gradient(-45deg, #b24592 0%, #e81b83 50%, #f15f79 100%); background: -webkit-linear-gradient(-45deg, #b24592 0%,#e81b83 50%,#f15f79 100%); background: linear-gradient(135deg, #b24592 0%,#e81b83 50%,#f15f79 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b61c88', endColorstr='#f12b80',GradientType=1 ); position: relative; margin: 20px auto 0px; width: 800px; height: 550px; border-bottom: 50px solid black; }
.wbhide { position: relative; width: 800px; height: 600px; overflow: hidden; }
.welcomeback input { display: none; }
#wbsecond+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbeighth+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfirst+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfifth+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbsixth+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbthird+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfourth+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
.welcomeback label i { font-size: 10px; font-style: normal; letter-spacing: 10px; margin-right: -10px; color: #f15f79; }
.in1 { height: 500px; width: 700px; position: absolute; top: 50px; left: -500px; outline: 1px solid black; outline-offset: 10px; overflow: hidden; transition: 0.6s; opacity: 0; z-index: 2; }
.inimg { position: absolute; background-size: cover; height: 300px; width: 300px; border-radius: 100%; border: 10px solid #e81b83; box-shadow: 0 0 0 1px black; top: 35px; left: 180px; -webkit-transition: 0.7s; transition: 0.7s; transition-delay: 0.5s; -webkit-transition-delay: 0.5s; }
.inimg:after { height: 300px; width: 300px; position: absolute; content: ""; border-radius: 100%; background: #03157e; mix-blend-mode: hard-light; border: 1px solid black; top: -1px; left: -1px; }
.in1:hover .inimg { opacity: 0; -webkit-transition: 0.5s; transition: 0.5s; transition-delay: 0s; -webkit-transition-delay: 0s; transform: rotate(360deg); -webkit-transform: rotate(360deg); }
.in1 name { display: block; font-family: Staatliches; color: black; font-size: 40px; letter-spacing:20px; position: absolute; bottom: 20px; width: 100%;; text-align: center; text-transform: uppercase; right: -10px; line-height: 140%; }
.winfo1, .winfo2, .winfo3, .winfo4, .winfo5, .winfo6 { padding: 10px; font-family: abel; position: absolute; letter-spacing: 1px; text-align: right; width: calc(100% - 20px); font-size: 14px; transition: 0.9s; transition-delay: 0s; opacity: 0; top: -400px; background: black; display: flex; flex-direction: row-reverse; border-radius: 10px; color: white; line-height: 100%; justify-content: space-between; }
.winfo2, .winfo4, .winfo6 { text-align: left; flex-direction: row; }
.winfo1 b, .winfo3 b, .winfo5 b { color: #f15f79; text-transform: uppercase; letter-spacing: 5px; margin-left: 10px; font-family: Staatliches; line-height:130%; }
.winfo2 b, .winfo4 b, .winfo6 b { color: #b24592; text-transform: uppercase; letter-spacing: 5px; margin-right: 10px; font-family: Staatliches; line-height:130%; }
.in1:hover .winfo1 { transition-delay: 0.2s; opacity: 1; top: 0px; }
.wbplayer .winfo1 { top: 0px; opacity: 1; }
.wbplayer .winfo2 { top: 60px; opacity: 1; }
.wbplayer .winfo3 { top: 120px; opacity: 1; }
.wbplayer .winfo1 b, .wbplayer .winfo3 b { color: #0575e6; }
.wbplayer .winfo2 b { color: #25d6c2; }
.winfo2 { top: -340px; }
.in1:hover .winfo2 { transition-delay: 0.4s; opacity: 1; top: 60px; }
.winfo3 { top: -280px; }
.in1:hover .winfo3 { transition-delay: 0.6s; opacity: 1; top: 120px; }
.winfo4 { top: -220px; }
.in1:hover .winfo4 { transition-delay: 0.8s; opacity: 1; top: 180px; }
.winfo5 { top: -160px; }
.in1:hover .winfo5 { transition-delay: 1s; opacity: 1; top: 290px; }
.winfo6 { top: -100px; }
.in1:hover .winfo6 { transition-delay: 1.2s; opacity: 1; top: 340px; }
#wbsecond:checked ~ #wbfirst+label { opacity: 1; z-index: 3; }
#wbsecond:checked ~ #wbfirst+label i { color: #25d6c2; }
#wbfirst:checked ~ #wbsecond+label { opacity: 1; z-index: 3; }
#wbfirst:checked ~ .in1 { left: 50px; opacity:1; transition-delay: 0.5s; }
#wbsecond:checked ~ #wbthird+label { opacity: 1; z-index: 3; }
#wbsecond:checked ~ #wbthird+label i { color: #25d6c2 }
.wbgradient { height: 0px; width: 0px; background: #25d6c2; background: -moz-linear-gradient(45deg, #25d6c2 0%, #0575e6 50%, #03157e 100%); background: -webkit-linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); background: linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25d6c2', endColorstr='#03157e',GradientType=1 ); position: absolute; right: -500px; top: -500px; border-radius: 100%; transition: 0.4s; transition-delay: 0s; opacity: 0; transition-delay: 0.3s; }
#wbsecond:checked ~ .wbgradient, #wbfourth:checked ~ .wbgradient2 { top: 0px; right: 0px; border-radius: 0%; opacity: 1; height: 550px; width: 800px; }
#wbthird:checked ~ .wbgradient { right: 500px; }
#wbthird:checked ~ #wbfifth+label { opacity: 1; z-index: 3; }
#wbthird:checked ~ #wbfourth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbsixth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbsixth+label i { color: #25d6c2 }
.win2 { height: 350px; width:570px; position: absolute; top: 50px; right: -550px; overflow: auto; transition: 0.6s; border: 50px solid black; background: black; opacity: 0; outline: 1px solid white; outline-offset: 10px; padding-right: 5px; color: #c7c7c7; font-family: abel; font-size: 12px; text-align: justify; line-height: 210%; letter-spacing: 0.5px; z-index: 2; transition-delay: 0s; }
.welcomeback h1 { color:#b24592; font-family: Staatliches; letter-spacing: 10px; font-size: 12px; border-bottom: 1px solid #666; }
.win2 b { background: #b24592; color: white; padding: 0px 2px; }
.welcomeback h2 { text-transform: lowercase; text-align: center; font-style: italic; letter-spacing: 2px; color: white; font-size: 13px; }
.wbfree h1 { color:#25d6c2; font-family: Staatliches; letter-spacing: 10px; font-size: 12px; border-bottom: 1px solid #666; }
.wbfree b { background: #25d6c2; color: white; padding: 0px 2px; }
.wbfree h2 { text-transform: lowercase; text-align: center; font-style: italic; letter-spacing: 2px; color: black; font-size: 13px; }
#wbthird:checked ~ .win2 { right: 50px; opacity: 1; transition-delay: 0.3s; }
#wbfourth:checked ~ .win2 { right: 550px; transition-delay: 0s; }
.wbgradient2 { height: 0px; width: 0px; background: #25d6c2; background: -moz-linear-gradient(45deg, #25d6c2 0%, #0575e6 50%, #03157e 100%); background: -webkit-linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); background: linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25d6c2', endColorstr='#03157e',GradientType=1 ); position: absolute; right: -500px; top: -500px; border-radius: 100%; transition: 0.4s; opacity: 0; transition-delay: 0.3s; }
#wbseventh+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfirst:checked ~ #wbseventh+label { opacity: 1; z-index: 3; }
#wbfirst:checked ~ .wbgradient2 { right: 500px; transition-delay: 0.3s; }
#wbfourth:checked ~ .in1 { left: 550px; transition-delay: 0s; }
#wbfourth:checked ~ #wbeighth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbeighth+label i { color: #25d6c2 }
.wbfree { height: 350px; width:580px; position: absolute; top: 50px; right: 50px; overflow: auto; transition: 0.4s; border: 50px solid white; background: white; opacity: 0; outline: 1px solid black; outline-offset: 10px; padding-right: 5px; color: #555; font-family: abel; font-size: 12px; text-align: justify; line-height: 210%; letter-spacing: 0.5px; }
#wbsecond:checked ~ .wbfree { opacity: 1; transition-delay: 0.6s; z-index: 1; }
.wbplayer { height: 500px; width: 690px; position: absolute; top: 50px; left: 50px; outline: 1px solid black; outline-offset: 10px; overflow: hidden; transition: 0.4s; opacity: 0; transition-delay: 0s; }
#wbfourth:checked ~ .wbplayer { opacity: 1; transition-delay: 0.6s; z-index: 1; }
.wbalias { font-family: Staatliches; color: white; position: absolute; width: 100%; right: -10px; text-align: center; bottom: 250px; font-size: 40px; letter-spacing: 10px; line-height: 100%; }
.wbplayerpic { position: absolute; height: 200px; width: 360px; background-size: cover; bottom: 30px; right: 20px; outline: 1px solid black; outline-offset:10px; }
.wbtriggers { position: absolute; width: 100%; right: -4px; font-size: 12px; font-family: abel; color: white; bottom: 300px; letter-spacing: 4px; text-align: center; }
.wbplayerpic:after { background: #0575e6; height: 200px; width: 360px; content:''; position: absolute; mix-blend-mode: hard-light; }
.win2::-webkit-scrollbar{width:1px} .win2::-webkit-scrollbar-track{background:transparent!important;border:none!important} .win2::-webkit-scrollbar-thumb{background: white} .wbfree::-webkit-scrollbar{width:1px} .wbfree::-webkit-scrollbar-track{background:transparent!important;border:none!important} .wbfree::-webkit-scrollbar-thumb{background: black}
</style>
<div class="welcomeback">
<div class="wbhide">
<input type="radio" id="wbfirst" name="wb" checked>
<label for="wbfirst"><<<<br><i>Информация</i></label>
<input type="radio" id="wbsecond" name="wb">
<label for="wbsecond">>>><br><i>Достижения</i></label>
<input type="radio" id="wbfirst" name="wb">
<label for="wbfirst"><<<<br><i>Информация</i></label>
<input type="radio" id="wbthird" name="wb">
<label for="wbthird">>>><br><i>Подарки</i></label>
<input type="radio" id="wbfifth" name="wb">
<label for="wbsecond"><<<<br><i>Достижения</i></label>
<input type="radio" id="wbfourth" name="wb">
<label for="wbfourth">>>><br><i>Плашки</i></label>
<input type="radio" id="wbsixth" name="wb">
<label for="wbthird"><<<<br><i>Подарки</i></label>
<input type="radio" id="wbseventh" name="wb">
<label for="wbfourth"><<<<br><i>Плашки</i></label>
<input type="radio" id="wbeighth" name="wb">
<label for="wbfirst">>>><br><i>Информация</i></label>
<div class="in1">
<div class="inimg" style="background-image: url(https://forumupload.ru/uploads/001a/dc/75/2/160989.jpg)"></div>
<name>Имя<br>Фамилия</name>
<div class="winfo1">палач в «оси»; наркоман<b>Роль: </b> </div>
<div class="winfo2"> <b>Кличка:</b> о, это же тот ебанутый нарик? </div>
<div class="winfo3"> однажды отец кая хотел прославиться. а дальше вы знаете. <b>Рандомный факт:</b></div>
<div class="winfo4"><b>металлокинез (класс I/ранг C)</b> сБатарейка – способность генерировать дополнительную энергию своим телом и передавать ее другим посредством тактильного контакта. Она может помогать дольше находится без еды. Отложить сон на некоторое время или дать энергии, когда уже больше нет сил ни на что..</div>
<div class="winfo5"><b>Известность: </b> 0%</div>
<div class="winfo6"><b>Репутация: </b> 0%</div>
</div>
<div class="wbgradient"></div>
<div class="wbfree">
<a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a> <a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a> <a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a> <a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a> <a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a> <a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a>
</p>
</p>
</div>
<div class="win2">
<img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст"> <img src="https://forumupload.ru/uploads/001b/9c/16/3/828816.png" alt="альтернативный текст">
</p>
</p>
</div>
<div class="wbgradient2"></div>
<div class="wbplayer">
<a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a><a href="https://shadeparadox.ru/viewtopic.php?id=432#p64963"><img src="https://forumupload.ru/uploads/001b/9c/16/3/729179.png"></a>
</div>
</div>
</div>[/html]
Поделиться72023-01-20 19:53:44
[html]<link href="https://fonts.googleapis.com/css?family=Abel|Anton|Staatliches" rel="stylesheet">
<style>
.welcomeback { background: #b61c88; background: #b61c88; background: -moz-linear-gradient(-45deg, #b24592 0%, #e81b83 50%, #f15f79 100%); background: -webkit-linear-gradient(-45deg, #b24592 0%,#e81b83 50%,#f15f79 100%); background: linear-gradient(135deg, #b24592 0%,#e81b83 50%,#f15f79 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b61c88', endColorstr='#f12b80',GradientType=1 ); position: relative; margin: 20px auto 0px; width: 500px; height: 550px; border-bottom: 50px solid black; }
.wbhide { position: relative; width: 500px; height: 600px; overflow: hidden; }
.welcomeback input { display: none; }
#wbsecond+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbeighth+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfirst+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfifth+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbsixth+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbthird+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfourth+label { position: absolute; top: 560px; right: 10px; font-size: 30px; font-family: Staatliches; text-align: right; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
.welcomeback label i { font-size: 10px; font-style: normal; letter-spacing: 10px; margin-right: -10px; color: #f15f79; }
.in1 { height: 500px; width: 400px; position: absolute; top: 50px; left: -500px; outline: 1px solid black; outline-offset: 10px; overflow: hidden; transition: 0.6s; opacity: 0; z-index: 2; }
.inimg { position: absolute; background-size: cover; height: 300px; width: 300px; border-radius: 100%; border: 10px solid #e81b83; box-shadow: 0 0 0 1px black; top: 35px; left: 35px; -webkit-transition: 0.7s; transition: 0.7s; transition-delay: 0.5s; -webkit-transition-delay: 0.5s; }
.inimg:after { height: 300px; width: 300px; position: absolute; content: ""; border-radius: 100%; background: #03157e; mix-blend-mode: hard-light; border: 1px solid black; top: -1px; left: -1px; }
.in1:hover .inimg { opacity: 0; -webkit-transition: 0.5s; transition: 0.5s; transition-delay: 0s; -webkit-transition-delay: 0s; transform: rotate(360deg); -webkit-transform: rotate(360deg); }
.in1 name { display: block; font-family: Staatliches; color: black; font-size: 40px; letter-spacing:20px; position: absolute; bottom: 20px; width: 100%;; text-align: center; text-transform: uppercase; right: -10px; line-height: 140%; }
.winfo1, .winfo2, .winfo3, .winfo4, .winfo5, .winfo6 { padding: 10px; font-family: abel; position: absolute; letter-spacing: 1px; text-align: right; width: calc(100% - 20px); font-size: 14px; transition: 0.9s; transition-delay: 0s; opacity: 0; top: -400px; background: black; display: flex; flex-direction: row-reverse; border-radius: 10px; color: white; line-height: 100%; justify-content: space-between; }
.winfo2, .winfo4, .winfo6 { text-align: left; flex-direction: row; }
.winfo1 b, .winfo3 b, .winfo5 b { color: #f15f79; text-transform: uppercase; letter-spacing: 5px; margin-left: 10px; font-family: Staatliches; line-height:130%; }
.winfo2 b, .winfo4 b, .winfo6 b { color: #b24592; text-transform: uppercase; letter-spacing: 5px; margin-right: 10px; font-family: Staatliches; line-height:130%; }
.in1:hover .winfo1 { transition-delay: 0.2s; opacity: 1; top: 0px; }
.wbplayer .winfo1 { top: 0px; opacity: 1; }
.wbplayer .winfo2 { top: 60px; opacity: 1; }
.wbplayer .winfo3 { top: 120px; opacity: 1; }
.wbplayer .winfo1 b, .wbplayer .winfo3 b { color: #0575e6; }
.wbplayer .winfo2 b { color: #25d6c2; }
.winfo2 { top: -340px; }
.in1:hover .winfo2 { transition-delay: 0.4s; opacity: 1; top: 60px; }
.winfo3 { top: -280px; }
.in1:hover .winfo3 { transition-delay: 0.6s; opacity: 1; top: 120px; }
.winfo4 { top: -220px; }
.in1:hover .winfo4 { transition-delay: 0.8s; opacity: 1; top: 200px; }
.winfo5 { top: -160px; }
.in1:hover .winfo5 { transition-delay: 1s; opacity: 1; top: 280px; }
.winfo6 { top: -100px; }
.in1:hover .winfo6 { transition-delay: 1.2s; opacity: 1; top: 320px; }
#wbsecond:checked ~ #wbfirst+label { opacity: 1; z-index: 3; }
#wbsecond:checked ~ #wbfirst+label i { color: #25d6c2; }
#wbfirst:checked ~ #wbsecond+label { opacity: 1; z-index: 3; }
#wbfirst:checked ~ .in1 { left: 50px; opacity:1; transition-delay: 0.5s; }
#wbsecond:checked ~ #wbthird+label { opacity: 1; z-index: 3; }
#wbsecond:checked ~ #wbthird+label i { color: #25d6c2 }
.wbgradient { height: 0px; width: 0px; background: #25d6c2; background: -moz-linear-gradient(45deg, #25d6c2 0%, #0575e6 50%, #03157e 100%); background: -webkit-linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); background: linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25d6c2', endColorstr='#03157e',GradientType=1 ); position: absolute; right: -500px; top: -500px; border-radius: 100%; transition: 0.4s; transition-delay: 0s; opacity: 0; transition-delay: 0.3s; }
#wbsecond:checked ~ .wbgradient, #wbfourth:checked ~ .wbgradient2 { top: 0px; right: 0px; border-radius: 0%; opacity: 1; height: 550px; width: 500px; }
#wbthird:checked ~ .wbgradient { right: 500px; }
#wbthird:checked ~ #wbfifth+label { opacity: 1; z-index: 3; }
#wbthird:checked ~ #wbfourth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbsixth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbsixth+label i { color: #25d6c2 }
.win2 { height: 350px; width:295px; position: absolute; top: 50px; right: -550px; overflow: auto; transition: 0.6s; border: 50px solid black; background: black; opacity: 0; outline: 1px solid white; outline-offset: 10px; padding-right: 5px; color: #c7c7c7; font-family: abel; font-size: 12px; text-align: justify; line-height: 210%; letter-spacing: 0.5px; z-index: 2; transition-delay: 0s; }
.welcomeback h1 { color:#b24592; font-family: Staatliches; letter-spacing: 10px; font-size: 12px; border-bottom: 1px solid #666; }
.win2 b { background: #b24592; color: white; padding: 0px 2px; }
.welcomeback h2 { text-transform: lowercase; text-align: center; font-style: italic; letter-spacing: 2px; color: white; font-size: 13px; }
.wbfree h1 { color:#25d6c2; font-family: Staatliches; letter-spacing: 10px; font-size: 12px; border-bottom: 1px solid #666; }
.wbfree b { background: #25d6c2; color: white; padding: 0px 2px; }
.wbfree h2 { text-transform: lowercase; text-align: center; font-style: italic; letter-spacing: 2px; color: black; font-size: 13px; }
#wbthird:checked ~ .win2 { right: 50px; opacity: 1; transition-delay: 0.3s; }
#wbfourth:checked ~ .win2 { right: 550px; transition-delay: 0s; }
.wbgradient2 { height: 0px; width: 0px; background: #25d6c2; background: -moz-linear-gradient(45deg, #25d6c2 0%, #0575e6 50%, #03157e 100%); background: -webkit-linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); background: linear-gradient(45deg, #25d6c2 0%,#0575e6 50%,#03157e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25d6c2', endColorstr='#03157e',GradientType=1 ); position: absolute; right: -500px; top: -500px; border-radius: 100%; transition: 0.4s; opacity: 0; transition-delay: 0.3s; }
#wbseventh+label { position: absolute; top: 560px; left: 10px; font-size: 30px; font-family: Staatliches; text-align: left; line-height: 40%; cursor: pointer; color: white; opacity: 0; transition: 0.3s; z-index: 0; }
#wbfirst:checked ~ #wbseventh+label { opacity: 1; z-index: 3; }
#wbfirst:checked ~ .wbgradient2 { right: 500px; transition-delay: 0.3s; }
#wbfourth:checked ~ .in1 { left: 550px; transition-delay: 0s; }
#wbfourth:checked ~ #wbeighth+label { opacity: 1; z-index: 3; }
#wbfourth:checked ~ #wbeighth+label i { color: #25d6c2 }
.wbfree { height: 350px; width:295px; position: absolute; top: 50px; right: 50px; overflow: auto; transition: 0.4s; border: 50px solid white; background: white; opacity: 0; outline: 1px solid black; outline-offset: 10px; padding-right: 5px; color: #555; font-family: abel; font-size: 12px; text-align: justify; line-height: 210%; letter-spacing: 0.5px; }
#wbsecond:checked ~ .wbfree { opacity: 1; transition-delay: 0.6s; z-index: 1; }
.wbplayer { height: 500px; width: 400px; position: absolute; top: 50px; left: 50px; outline: 1px solid black; outline-offset: 10px; overflow: hidden; transition: 0.4s; opacity: 0; transition-delay: 0s; }
#wbfourth:checked ~ .wbplayer { opacity: 1; transition-delay: 0.6s; z-index: 1; }
.wbalias { font-family: Staatliches; color: white; position: absolute; width: 100%; right: -10px; text-align: center; bottom: 250px; font-size: 40px; letter-spacing: 10px; line-height: 100%; }
.wbplayerpic { position: absolute; height: 200px; width: 360px; background-size: cover; bottom: 30px; right: 20px; outline: 1px solid black; outline-offset:10px; }
.wbtriggers { position: absolute; width: 100%; right: -4px; font-size: 12px; font-family: abel; color: white; bottom: 300px; letter-spacing: 4px; text-align: center; }
.wbplayerpic:after { background: #0575e6; height: 200px; width: 360px; content:''; position: absolute; mix-blend-mode: hard-light; }
.win2::-webkit-scrollbar{width:1px} .win2::-webkit-scrollbar-track{background:transparent!important;border:none!important} .win2::-webkit-scrollbar-thumb{background: white} .wbfree::-webkit-scrollbar{width:1px} .wbfree::-webkit-scrollbar-track{background:transparent!important;border:none!important} .wbfree::-webkit-scrollbar-thumb{background: black}
</style>
<div class="welcomeback">
<div class="wbhide">
<input type="radio" id="wbfirst" name="wb" checked>
<label for="wbfirst"><<<<br><i>Информация</i></label>
<input type="radio" id="wbsecond" name="wb">
<label for="wbsecond">>>><br><i>Достижения</i></label>
<input type="radio" id="wbfirst" name="wb">
<label for="wbfirst"><<<<br><i>Информация</i></label>
<input type="radio" id="wbthird" name="wb">
<label for="wbthird">>>><br><i>Подарки</i></label>
<input type="radio" id="wbfifth" name="wb">
<label for="wbsecond"><<<<br><i>Достижения</i></label>
<input type="radio" id="wbfourth" name="wb">
<label for="wbfourth">>>><br><i>Плашки</i></label>
<input type="radio" id="wbsixth" name="wb">
<label for="wbthird"><<<<br><i>Подарки</i></label>
<input type="radio" id="wbseventh" name="wb">
<label for="wbfourth"><<<<br><i>Плашки</i></label>
<input type="radio" id="wbeighth" name="wb">
<label for="wbfirst">>>><br><i>Информация</i></label>
<div class="in1">
<div class="inimg" style="background-image: url(https://forumupload.ru/uploads/001a/dc/75/2/160989.jpg)"></div>
<name>Имя<br>Фамилия</name>
<div class="winfo1">палач в «оси»; наркоман<b>Роль: </b> </div>
<div class="winfo2"> <b>Кличка:</b> о, это же тот ебанутый нарик? </div>
<div class="winfo3"> однажды отец кая хотел прославиться. а дальше вы знаете. <b>Рандомный факт:</b></div>
<div class="winfo4"><b>металлокинез (класс I/ранг C)</b> способность управлять железом и другими металлами.</div>
<div class="winfo5"><b>Известность: </b> 0%</div>
<div class="winfo6"><b>Репутация: </b> 0%</div>
</div>
<div class="wbgradient"></div>
<div class="wbfree">
This is where the FREESTYLE goes!
<h1>this is a title</h1>
<h2>this is a different title</h2>
</p>
</p>
</div>
<div class="win2">
This is where the SHIPPER goes!
<h1>this is a title</h1>
<h2>this is a different title</h2>
</p>
</p>
</div>
<div class="wbgradient2"></div>
<div class="wbplayer">
<div class="winfo1"><b>player age</b> HERE</div>
<div class="winfo2"><b>time zone</b> HERE</div>
<div class="winfo3"><b>contact</b> HERE</div>
<div class="wbtriggers"><<< ( triggers: HERE ) >>></div>
<div class="wbalias">monty</div>
<div class="wbplayerpic" style="background-image: url(http://placehold.it/200x360)"></div>
</div>
</div>
</div><center><a href="http://wecode.jcink.net/index.php?showuser=4933" style="color:#ccc;font-size:7px;letter-spacing:5px;">MONTY</a></center>[/html]