/* A5.3 Переадресация*/
#pun-redirect, #pun-maint {
  margin: 50px 0% 50% 30%;
  float: none;
  width: 372px;
  height: 94px;
  background-image: url("ссылка на картинку");
background-position: center;
font-size: 0px;
  }

http://cs9.pikabu.ru/post_img/2017/01/1 … 315301.jpg

[html]<link href="https://fonts.googleapis.com/css?family=Oswald|Covered By Your Grace" rel="stylesheet"><style type="text/css"> .NOMcellule {font-family:Oswald;} .CONTENUcellule {font-family:Covered By Your Grace; font-size:16px;letter-spacing:1px;color:#1f1f1f;} .attributrp{width:70px;height: auto; background-color:#009999; font-family:Oswald;font-size:12px;border-radius:10px;color:white;text-align:center;margin-right:5px;}</style>

<center><div style="width:475px; height:auto;padding:7px;background-color:white;"><div style="width:auto;height:25px;background-color:#009999;text-align:center;border-radius:10px;color:white;font-size:18px;padding-top:5px;" class="NOMcellule">MES TOPICS</div><table><td><div style="width:460px; height:auto;background-color:#c9d1df;border-radius:10px;padding:5px;color:grey"><div class="NOMcellule" style="color:#009999;font-size:14px;padding:0 0 5px 7px;">ICI, nom du personnage</div><div style="padding-left:20px"><table><td><div class="attributrp">EN COURS</div></td><td style="width:350px;height:auto;" class="CONTENUcellule">Le nom de ton topic</td></table>
<table><td><div class="attributrp">TERMINÉ</div></td><td class="CONTENUcellule">Le nom de ton topic</td></table></div></div></td></table>
<table><td><div style="width:460px; height:auto;background-color:#c9d1df;border-radius:10px;padding:5px;color:grey"><div class="NOMcellule" style="color:#009999;font-size:14px;padding:0 0 5px 7px;">ICI, nom du personnage</div><div style="padding-left:20px"><table><td><div class="attributrp">EN COURS</div></td><td style="width:350px;height:auto;" class="CONTENUcellule">Le nom de ton topic</td></table>
<table><td><div class="attributrp">EN COURS</div></td><td class="CONTENUcellule">Le nom de ton topic</td></table></div></div></td></table>
<table><td><div style="width:460px; height:auto;background-color:#c9d1df;border-radius:10px;padding:5px;color:grey"><div class="NOMcellule" style="color:#009999;font-size:14px;padding:0 0 5px 7px;">ICI, nom du personnage</div><div style="padding-left:20px"><table><td><div class="attributrp">EN COURS</div></td><td style="width:350px;height:auto;" class="CONTENUcellule">Le nom de ton topic</td></table>
<table><td><div class="attributrp">TERMINÉ</div></td><td class="CONTENUcellule">Le nom de ton topic</td></table></div></div></td></table>
<table><td><div style="width:460px; height:auto;background-color:#c9d1df;border-radius:10px;padding:5px;color:grey"><div class="NOMcellule" style="color:#009999;font-size:14px;padding:0 0 5px 7px;">ICI, nom du personnage</div><div style="padding-left:20px"><table><td><div class="attributrp">EN COURS</div></td><td style="width:350px;height:auto;" class="CONTENUcellule">Le nom de ton topic</td></table>
<table><td><div class="attributrp">ABANDON</div></td><td class="CONTENUcellule">Le nom de ton topic</td></table></div></div></td></table>
</div></center>[/html]

https://daisygifhunts.tumblr.com/post/8 … 184-mostly

https://data.whicdn.com/images/258401658/original.jpg

[html]<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Oranienbaum&display=swap" rel="stylesheet">
<style>#armglav {display:block; padding:40px; margin: 1em 1em 2em 1em; background-image: url(https://forumstatic.ru/files/001a/c7/53/51371.jpg);  border: 1px solid #b9b2a6; outline: 1px solid #403d34; width:610px; box-sizing:border-box; box-shadow: 0 0 5px #75795d inset; height: 450px}

/*блок аватарок*/
.armpers {display:block; border-top: 2px solid #6f685b; text-align:center; margin:35px auto 20px; }
.arava{display:inline-block; width: 50px; height: 50px; border-radius:50%; background:#000; margin: -25px 10% auto auto; border: 2px solid #6f685b; transition: all 0.3s ease; background-position:50% 50%; background-size:cover;}
.arava:last-child {margin-right:0px;}
.arava:hover {transition: all 0.3s ease; transform: scale(1.2);}

/***  блок1   ***/
.block {display:block;
width: 250px;
top: 270px;
background: #f0e8d838;
       border: 1px solid #b9b2a6;
    outline: 1px solid #403d34;
    margin: 1px 0 5px 1px;
    text-align: justify;
    font-size: 9px;
    color: #23201c !important;
    letter-spacing: .5px;
    height: 100px;
overflow: auto;
position: absolute
}

/***  блок2   ***/
.block2 {display:block;
width: 250px;
top: 270px;
background: #f0e8d838;
       border: 1px solid #b9b2a6;
    outline: 1px solid #403d34;
    margin: 1px 0 5px 280px;
    text-align: justify;
    font-size: 9px;
    color: #23201c !important;
    letter-spacing: .5px;
    height: 100px;
overflow: auto;
position: absolute
}

/***  блок большой   ***/
.blockbig {display:block;
width: 529px;
top: 150px;
background: #f0e8d838;
       border: 1px solid #b9b2a6;
    outline: 1px solid #403d34;
    margin: 1px 0 5px 1px;
    text-align: justify;
    font-size: 9px;
    color: #23201c !important;
    letter-spacing: .5px;
    height: 80px;
position: absolute
}

/***   БЛОК ТЕКСТА   ***/
.artext {padding: 0 215px; top: 235px;font-size:16px; color:#403d34; font-family: Oranienbaum; font-variant: small-caps; text-shadow: 1px 1px 0 #dad3c0; text-align: center; position: absolute}
.twotext {padding: 0 115px; top: 257px;font-size:9px; color:#403d34; font-family: Merriweather;text-transform: uppercase; text-align: center; position: absolute}
.theetext {padding: 0 380px; top: 257px;font-size:9px; color:#403d34; font-family: Merriweather;text-transform: uppercase; text-align: center; position: absolute}
</style><div id="armglav"><div class="armpers">

<!--   ЗДЕСЬ АВАТАРЫ   -->

<div class="arava" style="background-image:url(https://i.ibb.co/VHPhdg0/mikasa.jpg)"></div>
<div class="arava" style="background-image:url(https://i.ibb.co/M8xDyrG/eren.jpg)"></div>
<div class="arava" style="background-image:url(https://i.ibb.co/bH6cVrS/armin.jpg)"></div>
</div>

<div class="blockbig">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>

<div class="block">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. </div>

<div class="block2">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>

<div class="artext"><b>Придержаны</b></div>
<div class="twotext"><b>роли</b></div>
<div class="theetext"><b>внешности</b></div>
</div>[/html]