Gesuchsvorlage - Druckversion

Der Titel für dieses Gesuch

Name

Ein Avatarname

Alter

Relation

Aufgabe

Der schöne Name

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed semper, eros sit amet congue euismod, arcu urna hendrerit metus, sit amet vulputate quam orci at dolor. Donec a justo ac massa scelerisque commodo id ac nulla. Etiam eget ultricies nibh, vel convallis nisl. Suspendisse eu feugiat nulla. Duis suscipit egestas tellus ac laoreet. Maecenas pulvinar tellus nec convallis facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum non enim nec eros dapibus ornare. Integer semper augue sem, id varius massa semper ac. Etiam lacus ante, congue interdum consectetur nec, consectetur sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent urna sem, dignissim vitae lacus vel, lobortis dignissim odio. Sed eget dolor pharetra, viverra turpis sit amet, laoreet justo. Nulla maximus nibh ac nibh tincidunt, eget scelerisque augue rhoncus.

Gesucht von

Name

Avatar

Alter

Relation

Aufgabe

Here we are

Zum Forum

Zum Gesuch

Code:

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"><link href="https://fonts.googleapis.com/css2?family=Philosopher&family=Tenor+Sans&display=swap" rel="stylesheet"><style type="text/css">#hc {width: 500px; margin: auto; background: #3b1d15; box-shadow: 3px 3px 18px -8px #263238; padding: 5px; } .hcinnen {width: 500px; box-sizing: border-box; display: block; background: #424345;} .hctitel {width: 480; box-sizing: border-box; text-align: center; font-family: 'Philosopher', sans-serif; font-weight: bold; font-size: 30px; color: #b7b7b7b; height: 40px; margin-bottom: 15px; background-color: #3b1d15;} .hcfaktbox {width: 160px; display: inline-block; height: 350px; border: 3px solid #5b1203; margin-bottom: 10px;} .hcrahmen {width: 150px; height: 150px; padding: 5px; background: #3b1d15; clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); margin-top: 5px; margin-bottom: 5px;} .hcrahmen .bild {width: 100%; height: 100%; background-size: cover; box-sizing: border-box; clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); margin-bottom: 5px;} .hcfakt {color: #b7b7b7; width: 160px; border: 1px solid #5b1203; font-family: 'Tenor Sans', sans-serif; box-sizing: border-box; padding: 4px; font-size: 12px; margin-bottom: 3px; text-align: center; } .hcfakticon {border-right:1px solid #3b1d15;padding-right:5px;font-size:12px;color:#b7b7b7;margin-right:5px; float:left;} .hcfree {width: 130px; border: 2px solid #5b1203; font-family: 'Tenor Sans', sans-serif; box-sizing: border-box; font-size: 15px; font-weight: bold; text-transform: uppercase; letter-spacing: 2px; color: #808592; padding: 5px; text-align: center;} .hcvergeben {width: 130px; border: 2px solid #808592; font-family: 'Rajdhani', sans-serif; box-sizing: border-box; font-size: 15px; font-weight: bold; text-transform: uppercase; letter-spacing: 2px; background: #5b1203; color: #808592; text-align: center;  padding: 5px; text-align: center;} .hcsuchbox {width: 312px; height: 355px; border: 3px solid #5b1203; display: block; box-sizing: border-box; margin-bottom: 10px; margin-left: 2px;} .hcsuchtitel {background: #3b1d15; color: #b7b7b7; font-family: 'Philosopher', sans-serif; font-size: 30px; width: 100%; height: 30px; text-align: center; box-sizing: border-box; line-height: 90%;} .hcsuchtext {color: #b7b7b7; padding: 7px; width: 306px; height: 318px; font-family: 'Tenor Sans', sans-serif; font-size: 13px; overflow: auto; scrollbar-width: thin; text-align: justify; box-sizing: border-box; } .hctrenner {width: 300px; height: 7px; background: #5b1203; margin: auto; box-sizing: border-box; } .hcunderboxtext {with: 465px; height: 170px; color: #b7b7b7; overflow: auto; scrollbar-width: thin; box-sizing: border-box; font-family: 'Tenor Sans', sans-serif; font-size: 12.5px; padding: 5px;} .hcfaktbox2 {width: 160px; display: inline-block; height: 350px; border: 3px solid #5b1203; margin-bottom: 10px;} .hcrahmen {width: 150px; height: 150px; padding: 5px; background: #5b1203; clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);} .hcsuchbox2 {width: 312px; height: 355px; border: 3px solid #5b1203; display: block; box-sizing: border-box; margin-bottom: 10px; margin-right: 2px;} .hcunderbox {border-left: 2px solid #5b1203; border-right: 2px solid #5b1203; margin-left: 15px; padding-bottom: 5px; width: 465px; height: 210px;} .hclink {float: left; background: #5b1203; margin: 4px; padding: 4px; width: 225px; text-align: center;font-family: 'Verdana'; font-size: 10px; color: #808592;box-shadow: 0px 5px 7px -5px #000;} .hclink a {text-align: center; font-family: 'Verdana'; font-size: 12px; color: #808592;}</style>

<div id="hc"><div class="hcinnen"><div class="hctitel"> Der Titel für dieses Gesuch </div>

<table width="500px" style="display: inline-flex;"><tr style="display: inline;"><td>

<div class="hcfaktbox"><div class="hcrahmen"><div class="bild" style="background-image: url('https://abload.de/img/13c359d4-543c-4b66-896pctv.jpg');"></div></div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-user"></i></span> Name </div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-eye"></i></span> Ein  Avatarname </div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-birthday-cake"></i></span> Alter</div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-heart"></i></span> Relation</div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-folder-open"></i></span> Aufgabe</div></div></td>

<td><div class="hcsuchbox"><div class="hcsuchtitel"> Der schöne Name </div><div class="hcsuchtext"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed semper, eros sit amet congue euismod, arcu urna hendrerit metus, sit amet vulputate quam orci at dolor. Donec a justo ac massa scelerisque commodo id ac nulla. Etiam eget ultricies nibh, vel convallis nisl. Suspendisse eu feugiat nulla. Duis suscipit egestas tellus ac laoreet. Maecenas pulvinar tellus nec convallis facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum non enim nec eros dapibus ornare. Integer semper augue sem, id varius massa semper ac. Etiam lacus ante, congue interdum consectetur nec, consectetur sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent urna sem, dignissim vitae lacus vel, lobortis dignissim odio. Sed eget dolor pharetra, viverra turpis sit amet, laoreet justo. Nulla maximus nibh ac nibh tincidunt, eget scelerisque augue rhoncus.</div></div></td></tr>

<tr style="display: inline;"><td>

<div class="hcsuchbox2"><div class="hcsuchtitel"> Gesucht von</div><div class="hcsuchtext"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed semper, eros sit amet congue euismod, arcu urna hendrerit metus, sit amet vulputate quam orci at dolor. Donec a justo ac massa scelerisque commodo id ac nulla. Etiam eget ultricies nibh, vel convallis nisl. Suspendisse eu feugiat nulla. Duis suscipit egestas tellus ac laoreet. Maecenas pulvinar tellus nec convallis facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum non enim nec eros dapibus ornare. Integer semper augue sem, id varius massa semper ac. Etiam lacus ante, congue interdum consectetur nec, consectetur sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent urna sem, dignissim vitae lacus vel, lobortis dignissim odio. Sed eget dolor pharetra, viverra turpis sit amet, laoreet justo. Nulla maximus nibh ac nibh tincidunt, eget scelerisque augue rhoncus.</div></div></td>

<td><div class="hcfaktbox2"><div class="hcrahmen"><div class="bild" style="background-image: url('https://abload.de/img/13c359d4-543c-4b66-896pctv.jpg');"></div></div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-user"></i></span> Name </div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-eye"></i></span> Avatar </div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-birthday-cake"></i></span> Alter</div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-heart"></i></span> Relation</div><div class="hcfakt"><span class="hcfakticon"><i class="fas fa-folder-open"></i></span> Aufgabe</div></div></td></tr></table>

<div class="hcunderbox"><div class="hcsuchtitel"> Here we are</div><div class="hcunderboxtext">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed semper, eros sit amet congue euismod, arcu urna hendrerit metus, sit amet vulputate quam orci at dolor. Donec a justo ac massa scelerisque commodo id ac nulla. Etiam eget ultricies nibh, vel convallis nisl. Suspendisse eu feugiat nulla. Duis suscipit egestas tellus ac laoreet. Maecenas pulvinar tellus nec convallis facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum non enim nec eros dapibus ornare. Integer semper augue sem, id varius massa semper ac. Etiam lacus ante, congue interdum consectetur nec, consectetur sed enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent urna sem, dignissim vitae lacus vel, lobortis dignissim odio. Sed eget dolor pharetra, viverra turpis sit amet, laoreet justo. Nulla maximus nibh ac nibh tincidunt, eget scelerisque augue rhoncus.</div></div>

<table width="500px">

<tr><td><div class="hclink"><a href="https://exitwounds/index.php" target="_blank">Zum  Forum </a></div></td><td><div class="hclink"><a href="link" target="_blank"> Zum Gesuch </a></div></td></tr></table>

</div></div>