[html]<link href="https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,600,700,800,900|Roboto|Raleway|Sawarabi+Gothic" rel="stylesheet">
<style>

#liwmitracker {
width: 500px;
background:  #fff;
height: 400px;
position: relative;
margin: 20px auto;
border: 1px solid #ccc;
outline: 1px solid #990fc3;
outline-offset: 10px;
font-family: roboto;
color: #191919;
line-height: 170%;
font-size: 11px;
}

#liwmitracker picture {
height: 400px;
width: 200px;
position: absolute;
left: 0px;
top: 0px;
background-size: cover;
display: block;
border-right: 1px solid #990fc3;
}

#liwmitracker name {
font-family: playfair display;
font-weight: 900;
width: 400px;
height: 20px;
font-size: 25px;
text-transform: uppercase;
color: #bababa;
position: absolute;
text-align: left;
transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
top: 190px;
left: 9px;
display: block;
}

#liwmitracker infobox {
width: 245px;
height: 360px;
position: absolute;
top: 20px;
right: 20px;
overflow: auto;
font-family: roboto;
font-size: 11px;
line-height: 170%;
text-align: justify;
padding-right: 5px;
color: #191919;
display: block;
}

#liwmitracker h1 {
color: #990fc3;
position: relative;
font-size: 20px;
text-transform: uppercase;
font-family: playfair display;
display: block;
width: auto;
text-align: right;
font-weight: 900;
margin:10px 0px;
border-bottom: 1px solid #bababa;
}

#liwmitracker a {
color: #990fc3;
text-transform: uppercase;
font-family: playfair display;
font-weight: 700;
display: block;
}

#liwmitracker a:before {
background: #990fc3;
height: 5px;
width: 5px;
border-radius: 100%;
content: "";
display: inline-block;
margin: 0px 5px;
}

#liwmitracker infobox::-webkit-scrollbar{width:1px}
#liwmitracker infobox::-webkit-scrollbar-thumb{border:none!important;background:#bababa!important}
#liwmitracker infobox::-webkit-scrollbar-track{background:none!important;border:none!important}

</style>
<div id="liwmitracker">
<name>shaman</name>
<picture style="background-image: url(https://kartinkin.net/uploads/posts/202 … ivo-25.jpg)"></picture>
<infobox>
   <h1>fandoms</h1>
   <a href="Thread Title">гарри поттер</a> ос, гарри (в фем версии)
   <a href="Thread Title">коты-воители</a> искра, ос
   <a href="Thread Title">дом, в котором</a> табаки, ос
   <a href="Thread Title">ориджиналы всех цветов и размеров</a>
   <h1>characters</h1>
   <a href="">руреал</a> крыс
   <a href="">фандом</a> персонаж
   <a href="">фандом</a> персонаж
   <h1>episods</h1>
   <a href="http://noisyrats.rusff.me/viewtopic.php?id=51#p4785">[ориджинал] найдёшь легко наощупь – пустота меня плотней</a> чик-чирик, руреал, мистика
   <a href="">Thread Title</a> Description here
   <a href="">Thread Title</a> Description here
</infobox>
</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]

Отредактировано шаман (2023-04-23 20:42:17)