Coding
 Es hagelt Nüsse

Codingbaum - Wähle Deine Aufgaben
#1


Es hagelt Nüsse

am


Es hagelt Nüsse



Du beschließt, Dein mulmiges Gefühl erstmal zu ignorieren. Das Narrativ sagt, das ist eine gute Idee. Du suchst Dir einen der großen, hohen Bäume und richtest Dich zwischen seinen Wurzeln ein, breitest Deine Abenteurer*innendecke aus und machst es Dir gemütlich. Eigentlich ist es zu warm für ein Feuer und Du willst nicht den Wald abfackeln - meistens nimmt Dir das wer übel. Nicht, dass Du da Erfahrung hast ...
Also wickelst Du Dich in Deine Decke und lauschst ein wenig in die Nacht.
Plötzlich fällt Dir etwas auf den Kopf! Erschrocken schaust Du Dich um. Aber da fällt schon wieder etwas! Du springst auf und siehst nach oben, dann zu Boden. Nüsse! Silberne Nüsse! Aber bevor Du eine aufheben kannst, hagelt es weitere und sie haben es alle auf dich abgesehen!

Eilig sammelst Du alle Nüsse auf, die Du tragen kannst in dem Nussregen. Sie sind immerhin silbrig. Vielleicht sind sie was wert! Aber dann suchst Du das Weite, ehe Du von den Nüssen erschlagen wirst ...

Die Aufgabe



Es ist an Dir, möglichst viele silberne Nüsse einzusammeln! Es gibt insgesamt 13 Nüsse. Hinter jeder Nuss verbirgt sich eine Coding-Aufgabe, die keine fortgeschrittenen Techniken voraussetzt, um sie zu lösen. Poste in diese Topic und wähle eine Zahl. Du erhältst dann im Geheimen Deine Aufgabe, die Du lösen musst. Editiere Deinen Beitrag und poste Deinen Code, um Rubine zu erhalten.
Hast Du eine Aufgabe erledigt, darfst Du Dir eine weitere aussuchen. Du darfst keine Aufgabe zweimal wählen. Poste dazu erneut in diese Topic mit der Wunschzahl Deiner Wahl. Du darfst, wenn Dir die Zeit reicht, alle 13 Aufgaben erledigen. Schaffst Du das, erhältst Du 100 Rubine obendrauf!

Achtung! Du darfst nicht über Deine Aufgabe öffentlich reden. Der Reiz besteht ja darin, dass Du nicht weißt, was sich hinter welcher Nummer befindet. Daher gilt auch, wenn Du Fragen zu Deiner Aufgabe hast, schreibe eine PN an Hugo mit dem Betreff #Codingbaum. Stelle Deine Frage nicht in der offiziellen Fragentopic!

Cheaten



Natürlich kannst Du auch cheaten. Wie könnte es anders sein? Wenn Dir eine Aufgabe nicht zusagt, kannst Du den Tauschstein einsetzen, um Dir eine neue Aufgabe geben zu lassen. Sende den Stein an Hugo zusammen mit einer PN mit dem Betreff #Codingbaum. Sobald Du von Hugo die Bestätigung erhalten hast, kannst Du Dir eine neue Aufgabe aussuchen.

Code posten



Bei den Codingaufgaben sind sowohl welche für Foren- als auch für Postcodes dabei. Beim Posten gilt:
Postcodes vollständig in den Beitrag + Code im Code-Tag
Forencodes als Screenshot im Beitrag + Code im Code-Tag + Link zu Codepen oder einer anderen Liveansicht

Belohnung



Wie viele Rubine Du erhältst, hängt von der Aufgabe ab. Es gibt zwischen 10 und 35 Rubine pro Aufgabe. Wie viel Du für eine Aufgabe bekommst, steht immer bei der Aufgabe. Schaffst Du alle 13 Aufgaben, bekommst Du 100 Rubine zusätzlich und ein besonderes Item oben drauf!

In Kurz



Wähle eine der Aufgaben, indem Du in Deinen Beitrag die Zahl schreibst
Du bekommst die Aufgabe geheim, löst sie und editierst die Lösung in Deinen Beitrag
Du darfst nicht öffentlich über Deine Aufgabe sprechen
19. Juli - 23:59
0
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#2


Es hagelt Nüsse

am


Was steckt den in Nuss Nr XX?

Well... this escalated quickly. Yeah it moves...

[Bild: https://abload.de/img/2022-06-214b2jvh.png]
[Bild: https://abload.de/img/2022-06-217qukdl.png]
[Bild: https://abload.de/img/2022-06-216p8k3l.png]
[Bild: https://abload.de/img/2022-06-218mbj6s.png]


HTML


Code:
<div class="header_container">
  <div class="header_fname">
    <div class="header_fname_pos">
      <div class="header_fname_over">Back into the</div>
      <div class="header_fname_title">Shadows</div>
      <div class="header_fname_sub"> Cyperpunk | 2062 | Seattle</div>
    </div>
  </div>
  <div class="header_boxes_cont">
    <div class="header_box active">
      <div class="header_box_hide">
        <div class="header_box_title title_upper">Plot</div>
        <div class="header_box_text">Spione der Cooperations sind in die unteren Bezirke Seattle eingetrungen. Wer hätte gedacht, dass die Kommunikation überwacht wird? Neue wege müssen gesucht werden, um Informationen zu übermitteln und jeder braucht immer Nuyen</div>
        <div class="header_box_plot"><i class="fa-solid fa-user-secret"></i><i class="fa-solid fa-microchip"></i><i class="fa-solid fa-yen-sign"></i></div>
        <div class="header_box_title title_lower">Plot</div>
      </div>
    </div>
    <div class="header_box non_active">
      <div class="header_box_hide">
        <div class="header_box_title title_upper">News</div>
        <div class="header_box_text header_box_news">
          <div><i class="fa-solid fa-newspaper"></i></div>
          <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Odio urna, id sollicitudin pharetra, eget interdum. Quam neque aliquet facilisi fames libero ultrices tincidunt. Non mattis cras dui, ac. Id enim id augue suspendisse.</div>
        </div>
        <div class="header_box_title title_lower">News</div>
      </div>
    </div>
    <div class="header_box non_active">
      <div class="header_box_hide">
        <div class="header_box_title title_upper">Team</div>
        <div class="header_box_text header_box_team">
          <div class="header_box_member">
            <div><i class="fa-solid fa-crow"></i></div>
            <div>Background, Steckbriefe</div>
            <div><a href="">send PM</a></div>
          </div>
          <div class="header_box_member">
            <div><i class="fa-solid fa-cat"></i></div>
            <div>Technik, Gesuche</div>
            <div><a href="">send PM</a></div>
          </div>
        </div>
        <div class="header_box_title title_lower">Team</div>
      </div>
    </div>
    <div class="header_box non_active">
      <div class="header_box_hide">
        <div class="header_box_title title_upper">Gesuche</div>
        <div class="header_box_text">
          <div class="header_box_gesuche">
            <div class="header_box_gesuch">
              <div><i class="fa-solid fa-mars"></i></div>
              <div>
                <div class="header_box_gtitle">Head of Y-Cooperation</div>
                <div class="header_box_stitle">Gesucht von <a href="">Matrix</a></div>
              </div>
            </div>

            <div class="header_box_gesuch">
              <div><i class="fa-solid fa-mars-and-venus"></i></div>
              <div>
                <div class="header_box_gtitle">Street Samurai</div>
                <div class="header_box_stitle">Gesucht von <a href="">Coinless</a></div>
              </div>
            </div>

            <div class="header_box_gesuch">
              <div><i class="fa-solid fa-genderless"></i></div>
              <div>
                <div class="header_box_gtitle">Avatar der Matrix</div>
                <div class="header_box_stitle">Gesucht von <a href="">Loveless</a></div>
              </div>
            </div>
          </div>
        </div>

        <div class="header_box_title title_lower">Gesuche</div>
      </div>
    </div>
  </div>
  </div><div class="header_menu"></div>

CSS


Code:
/*Credits:
Background:https://unsplash.com/photos/CKD2uFQOPWc
Pattern: https://www.toptal.com/designers/subtlepatterns/tactile-noise/
JS:https://codepen.io/z-/pen/OBPJKK
*/
  

:root {
  --font:#4C1353;
  --box:#EED0F1;
  --col1:#F5F5F5;
  --shadow:#8B2396;
  --ub:'Kenia', cursive;
  --text:'Roboto', sans-serif;
}

body{
  background-image:url('https://abload.de/img/tactile_noisem6jiu.png');
  font-family:var(--text);
  font-size:14px;
  line-height:1.4;
  color:var(--font);
  margin:0px;
}

.header_container {
  /*background-image:url('https://abload.de/img/jesse-collins-ckd2ufq2cjo6.jpg');*/
  background:#9361A3;
  display:flex;
  height:340px;
  padding:20px;
  justify-content:space-between;
  
  
}

.header_fname{
  color:var(--col1);
  align-self:end;
  flex-basis:40%;
  display:flex;
  justify-content:flex-end;
  margin-right:50px;
  margin-bottom:30px;
}
.header_fname_pos{
  width:299px;
}

.header_fname_title {
  font-family:var(--ub);
  font-size:90px;
  opacity:0.6;
}

.header_fname_sub {
  text-align:center;
  margin-top:-25px;
  font-size:18px;
}

.header_fname_over {
  text-align:right;
  margin-bottom:-45px;
  font-size:23px;
}


.header_menu{
  background:var(--font);
  height:80px;
}

.header_boxes_cont{
  display:flex;
  gap:20px;
  flex: 0 1 60%;
  align-self:center;
}

.header_box{
  background:var(--box);
flex: 0 0 60px;
   transition:.9s  cubic-bezier(0.7, 0.22, 0.36, 0.8);
  height:260px;
  border-radius:40px;
   overflow:clip;
box-shadow: 8px 8px 0px var(--shadow);
}

.header_box_hide{
    display:flex;
  flex-direction:column;
  justify-content:center;
}

.active {
flex:0 0 500px;
  border-radius:20px;
     transition:.9s  cubic-bezier(0.7, 0.22, 0.36, 0.8);
}

.active div {
       transition: .9s  cubic-bezier(0.7, 0.22, 0.36, 0.8) 0.05s;
}

.non_active div{
opacity:0;
  width:0;
transition:.9s  cubic-bezier(0.7, 0.22, 0.36, 0.8);
}

.non_active div div{
width:0;
transition:.9s  cubic-bezier(0.7, 0.22, 0.36, 0.8);
}

.header_box_title{
  font-family:var(--ub);
  font-size:66px;
  opacita:0.9;
  width:500px;
}

.title_upper {
  text-align:right;
position:relative;
  right:10px;
  top:-70px;
  margin-bottom:-120px;
  opacity:0.1;
    z-index:0;
  font-size:120px;
  
}

.title_lower {
  margin-top:-10px;
  margin-left:20px;
}

.header_box_text {
  width:380px;
  margin:auto;
  text-align:justify;
  margin-top:20px;
  position:relative;
  z-index:2;
  
}

.header_box_plot {
  display:flex;
  width:380px;
  margin:auto;
  justify-content:flex-end;
  gap:30px;
  font-size:44px;
  margin-bottom:-20px;
  margin-top:10px;
    color:var(--shadow)
}


.header_box_news {
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.header_box_news div:nth-child(1) {
  font-size:64px;
  color:var(--shadow)

}

.header_box_news div:nth-child(2) {
  flex:0 0 70%;
}

.header_box_team {display:flex;
justify-content:space-between;
  margin-top:-5px;
}

.header_box_member div:nth-child(1) {
  font-size:60px;
  text-align:center;
}

.header_box_member div:nth-child(2) {
  text-align:center;
}
.header_box_member div:nth-child(3) a {
text-decoration:none;
background:var(--shadow);
  color:var(--col1);
  display:flex;
  justify-content:center;
  align-items:center;
  padding:10px;
  border-radius:25px;
  transition:0.3s ease-in;
}

.header_box_member div:nth-child(3) a:hover {
    transition:0.3s ease-out;
  background:var(--font);
    border-radius:5px;
  opacity:0.8;
  
}

.header_box_gesuche {
  overflow:scroll;
  height:110px;
}

.header_box_gesuch {display:flex;
  justify-content:space-between;
}

.header_box_gesuch div:nth-child(1) {
  align-self:center;
  font-size:33px;
}
.header_box_gesuch div:nth-child(2) {
  flex: 0 0 80%;
  padding-right:20px;
}

.header_box_gtitle {
  font-family:var(--ub);
  font-size:10px;
  text-align:right;
}

.header_box_stitle {
  text-align:right;
  color:var(--shadow);
  margin-top:-5px;
  margin-bottom:5px;
}

.header_box_stitle a {
  text-decoration:none;
  color:var(--shadow);
  
}

.non_active:hover{
  cursor:pointer;
}

Jquery


Code:
$(".header_box").click(function(){
    $('.active').not($(this)).toggleClass('active non_active');
  $(this).toggleClass('active non_active');
  
});
21.06.2022, 19:17: Hugo hat diesen Beitrag moderiert

Rubine sind verrabt worden
19. Juli - 23:59
6
1
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#3


Es hagelt Nüsse

am


Damit ich den Überblick nicht verliere, bin ich langweilig und fange vorne an: Was wohl in der Nuss Nr. XxX steckt? Huhn

Hier das Ergebnis Huhn


Code in ausgeführter Form:

Dinosaur Island
Storyline

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.


Fakten
  • Spielort: In einem Land vor unserer Zeit
  • Spielzeit: Vor unserer Zeit
  • Mindestpostinglänge: 1500 Feuersteine
  • Rating: 18 Säbelzahntiger
  • Spielbare Charaktere: Von T-Rex bis Triceratops



Und Code als Code:

Code:
<div class="dys_container">
  <div class="dys_topbox">
    <div class="hdino">Dinosaur Island</div>
    <div class="hdino2">Storyline</div>
  </div>
  <div class="dys_bottombox">
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>

    <div class="dys_fakten">
      <div class="hdino2">Fakten</div>
      <ul>
        <li>Spielort: In einem Land vor unserer Zeit
        <li>Spielzeit: Vor unserer Zeit
        <li>Mindestpostinglänge: 1500 Feuersteine
        <li>Rating: 18 Säbelzahntiger
        <li>Spielbare Charaktere: Von T-Rex bis Triceratops
      </ul>
      <div class="hdino"><a href="https://epic.quodvide.de/">Zum Forum</a></div>
    </div>
  </div>
</div>

<style>@import url("https://fonts.googleapis.com/css2?family=Fascinate&display=swap");@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@200&display=swap");:root{--dys-background:#e9f5db;--dys-mainfont:"Nunito",sans-serif;--dys-fancyfont:"Fascinate",cursive;--dys-fontcolor:#97a97c;--dys-fontcolor-dunkel:#718355}.dys_container{background:var(--dys-background);margin:auto;padding:40px;height:auto;width:500px;font-family:var(--dys-mainfont);border:solid var(--dys-fontcolor-dunkel)}.dys_topbox{background-color:#cfe1b9;background-image:url("https://www.transparenttextures.com/patterns/concrete-wall.png")}.hdino{font-family:var(--dys-fancyfont);color:var(--dys-fontcolor-dunkel);font-size:40px;text-align:center}.hdino2{color:var(--dys-fontcolor-dunkel);font-size:30px;text-align:center}.dys_bottombox p,ul{text-align:justify;line-height:30px;color:var(--dys-fontcolor-dunkel);font-weight:bold}.dys_bottombox a{color:var(--dys-fontcolor-dunkel);text-decoration:none}.dys_bottombox a:hover{color:var(--dys-fontcolor)}.dys_fakten{background-color:#cfe1b9;background-image:url("https://www.transparenttextures.com/patterns/concrete-wall.png")}</style>

Und zum Codepen geht es hier.
21.06.2022, 19:19: Hugo hat diesen Beitrag moderiert

Rubine sind in deinem Inventar aufgetaucht
19. Juli - 23:59
4
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#4


Es hagelt Nüsse

am


Die Nr. XXX bitte joke
keine fortgeschrittenen Techniken wurden vorgegaukelt... frech




Code:
<div class="sirenpilzbox"><div class="siren-pilz-kappe"></div><div class="wobble-hor-bottom"><div class="siren-pilz-mitte"></div><div class="siren-pilz-unten"></div></div></div>

<style type="text/css">.sirenpilzbox {width:500px;height:500px;position:relative;}.siren-pilz-kappe {width:155px;height:100px;background-color:#282828;border-radius:100px 100px 0px 0px;margin-bottom:-100px;background-image: radial-gradient( circle farthest-corner at 10% 20%,  rgba(233,175,132,1) 0%, rgba(186,126,81,1) 95.6% );}.siren-pilz-mitte {width:110px;height:100px;border-right: 20px solid transparent;border-bottom: 100px solid rgba(186,126,81,1);border-left: 20px solid transparent;}.siren-pilz-unten {width:150px;height:80px;border-radius: 0px 0px 100px 100px;background-color:rgba(186,126,81,1);}.wobble-hor-bottom {-webkit-animation: wobble-hor-bottom 3s infinite both;animation: wobble-hor-bottom 3s infinite both;}@-webkit-keyframes wobble-hor-bottom {0%,
  100% {-webkit-transform: translateX(0%);transform: translateX(0%);-webkit-transform-origin: 50% 50%;transform-origin: 50% 50%;}15%{-webkit-transform: translateX(-30px) rotate(-6deg);transform: translateX(-30px) rotate(-6deg);}30%{-webkit-transform: translateX(15px) rotate(6deg);transform: translateX(15px) rotate(6deg);}45% {-webkit-transform: translateX(-15px) rotate(-3.6deg);transform: translateX(-15px) rotate(-3.6deg);}60%{-webkit-transform: translateX(9px) rotate(2.4deg);transform: translateX(9px) rotate(2.4deg);}75%{-webkit-transform: translateX(-6px) rotate(-1.2deg);transform: translateX(-6px) rotate(-1.2deg);}}@keyframes wobble-hor-bottom {0%,100% {-webkit-transform: translateX(0%);transform: translateX(0%);-webkit-transform-origin: 50% 50%;transform-origin: 50% 50%;}15% {-webkit-transform: translateX(-30px) rotate(-6deg);transform: translateX(-30px)rotate(-6deg);}30%{-webkit-transform: translateX(15px) rotate(6deg);transform: translateX(15px) rotate(6deg);}45%{-webkit-transform: translateX(-15px) rotate(-3.6deg);            transform: translateX(-15px) rotate(-3.6deg);}60%{-webkit-transform: translateX(9px) rotate(2.4deg);transform: translateX(9px) rotate(2.4deg);}75%{-webkit-transform: translateX(-6px) rotate(-1.2deg);transform: translateX(-6px) rotate(-1.2deg);}}</style>
21.06.2022, 19:20: Hugo hat diesen Beitrag moderiert

Rubine wurden verteilt.
19. Juli - 23:59
3
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#5


Es hagelt Nüsse

am


Ich würde mir dann gerne die Nuss Nr. XXX einverleiben. :D

Uff. Das war echt hart! :( laughing Huhn

Das hier ist mein absolut hässliches Werk. laughing





Code:
<div class="dys_pilz">
  <div class="dys_kopf"></div>
  <div class="dys_stamm"></div>
  </div>


<style type="text/css">:root{--dys_col-bg:#1e361c;--dys_col-rot:#930000;--dys_col-grau:#f3f3f3}.dys_pilz{display:flex;flex-direction:column;align-items:center}.dys_kopf{background:var(--dys_col-rot);width:300px;height:200px;border:1px solid black;border-radius:50px 50px 10px 10px;animation:horizontal-shaking .5s infinite}.dys_stamm{background:var(--dys_col-grau);width:100px;height:200px;border:1px solid black;border-radius:0 0 5px 5px}@keyframes horizontal-shaking{0{transform:translateX(0)}25%{transform:translateX(5px)}50%{transform:translateX(-5px)}75%{transform:translateX(5px)}100%{transform:translateX(0)}}</style>
22.06.2022, 23:25: Hugo hat diesen Beitrag moderiert

Rubine wurden nachgeworfen
19. Juli - 23:59
3
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#6


Es hagelt Nüsse

am


[XXX] bitte

Terra Nova
Real Life  Dinosaurier  Kreidezeit  L3S3V3
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.




Code:
<div id="dino-serendipity-box"><img><div class="dino-serendipity-bigtitle"><div class="dino-serendipity-smalltitle-h1"><i class="cp cp-dinosaur-o"></i></div><div class="dino-serendipity-bigtitle-h1">Terra Nova</div>
<div class="dino-serendipity-smalltitle-b1">Real Life&nbsp;&nbsp;Dinosaurier&nbsp;&nbsp;Kreidezeit&nbsp;&nbsp;L3S3V3</div></div><div class="dino-serendipity-in"><div class="dino-serendipity-textbox">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div></div><div class="dino-serendipity-borderbox"></div><div class="dino-serendipity-buttonbox"><a href="#" class="dino-serendipity-button">Forum</a><a href="#" class="dino-serendipity-button">Gesuche</a><a href="#" class="dino-serendipity-button">Listen</a></div></div>

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">

<style type="text/css">#dino-serendipity-box {width:550px;height:750px;background-color:#519872;position:relative;}#dino-serendipity-box img {position:absolute;z-index:0;width:550px;height:750px;filter: grayscale(100%) brightness(40%) contrast(150%);opacity:0.3;background-image:url('https://abload.de/img/220621_dino_templatea3jj4.png');}.dino-serendipity-bigtitle {position:absolute;z-index:1;width:450px;height:80px;margin:150px 0px 0px 50px;text-align:center;}.dino-serendipity-bigtitle-h1 {font-family: 'Kanit', sans-serif;font-weight:800;color:#396b50;font-size:45px;text-transform:uppercase;margin:35px 0px 0px 0px;}.dino-serendipity-smalltitle-h1{color:#8cc5a6;font-size:35px;}.dino-serendipity-smalltitle-b1{color:#8cc5a6;font-size:13px;font-family:Calibri, sans-serif;text-transform:uppercase;font-weight:500;letter-spacing:2px;margin-top:-12px;}.dino-serendipity-in {width:410px;height:330px;position:absolute;z-index:1;background-color:;margin: 310px 0px 0px 50px;text-align:center;background-color: rgba(57, 107, 80, 0.4); padding:20px 20px 20px 20px;}.dino-serendipity-textbox {width:410px;height:330px;overflow:auto;color:#8cc5a6;font-family:Calibri, sans-serif;text-align:justify !important;font-size:13px;padding:0px 10px 0px 0px;}.dino-serendipity-textbox::-webkit-scrollbar {width: 10px;}.dino-serendipity-textbox::-webkit-scrollbar-thumb {width: 5px;background-color:#3f7156;}.dino-serendipity-borderbox {width:450px;position:absolute;margin:630px 0px 0px 50px;height:50px;background-color:#294d3a;}.dino-serendipity-buttonbox {width:450px;position:absolute;margin:700px 0px 0px 50px;height:30px;text-align:center;}a.dino-serendipity-button:link, a.dino-serendipity-button:visited {color:#8cc5a6;font-family: 'Kanit', sans-serif;text-decoration:none;font-size:13px;display:inline-block;width:80px;height:20px;margin-left:10px;padding:5px 0px 5px 0px;text-align:center;background-color:#294d3a;transition:1s;}a.dino-serendipity-button:hover {background-color:#8cc5a6;color:#294d3a;}</style>
21.06.2022, 19:27: Hugo hat diesen Beitrag moderiert

Rubine wurden verrabt
19. Juli - 23:59
3
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#7


Es hagelt Nüsse

am


[WEG] bitte!
19. Juli - 23:59
0
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#8


Es hagelt Nüsse

am


Dann bitte einmal die Nr. XXX. :)

Hier das Ergebnis:

Ich wollt ich wär ein Huhn
ich hätt' nicht viel zu tun
Die gesuchte Henne

Avatar: Henne Bertha
Alter: 3 Jahre
Beziehung: Huhn

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Fakt 1
Fakt 2
Fakt 3
Fakt 4

Ei auf der Suche

Avatar: Ei Nstein
Alter: 3 Stunden
Beziehung: Ei


Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Fakt 1
Fakt 2
Fakt 3
Fakt 4

Über das Forum

  • Rating: 18+
  • Mindestpostinglänge: 1500 Zeichen
  • Spielzeit: 2022




Code:
<div class="dysei_container">
  <div class="dysei_topbox">
    <div class="dysei_h1">Ich wollt ich wär ein Huhn</div>
    <div class="dysei_h2">ich hätt' nicht viel zu tun</div>
  </div>
  <div class="dysei_h3">Die gesuchte Henne</div>

  <div class="dysei_gesuchtbox_1">
    <div class="dysei_gesuchtbox_fakt">Avatar: Henne Bertha</div>
    <div class="dysei_gesuchtbox_fakt">Alter: 3 Jahre</div>
    <div class="dysei_gesuchtbox_fakt">Beziehung: Huhn</div>
  </div>

  <div class="dysei_gesuchtbox">
    <div class="dysei_gesuchtbox_bild"><img src="https://abload.de/img/huhnei1l2kjk.png"></div>
    <div class="dysei_gesuchtbox-text">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div>
  </div>

  <div class="dysei_gesuchtbox_1">
    <div class="dysei_gesuchtbox_fakt">Fakt 1</div>
    <div class="dysei_gesuchtbox_fakt">Fakt 2</div>
    <div class="dysei_gesuchtbox_fakt">Fakt 3</div>
    <div class="dysei_gesuchtbox_fakt">Fakt 4</div>
  </div>

  <div class="dysei_suchendbox">
    <div class="dysei_h3">Ei auf der Suche</div>

    <div class="dysei_gesuchtbox_1">
      <div class="dysei_gesuchtbox_fakt">Avatar: Ei Nstein</div>
      <div class="dysei_gesuchtbox_fakt">Alter: 3 Stunden</div>
      <div class="dysei_gesuchtbox_fakt">Beziehung: Ei</div>
    </div>

    <div class="dysei_gesuchtbox">

      <div class="dysei_gesuchtbox-text">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div>
      <div class="dysei_gesuchtbox_bild"><img src="https://abload.de/img/huhneimdj5k.png"></div>
    </div>

    <div class="dysei_gesuchtbox_1">
      <div class="dysei_gesuchtbox_fakt">Fakt 1</div>
      <div class="dysei_gesuchtbox_fakt">Fakt 2</div>
      <div class="dysei_gesuchtbox_fakt">Fakt 3</div>
      <div class="dysei_gesuchtbox_fakt">Fakt 4</div>
    </div>

    <div class="dysei_bottombox">
      <div class="dysei_h2">Über das Forum</div>
      <ul>

        <li>Rating: 18+
        <li>Mindestpostinglänge: 1500 Zeichen
        <li>Spielzeit: 2022
      </ul>

      <div class="dysei_linkbox"><a href="https://epic.quodvide.de/index.php">Zum Forum</a></div>
    </div>
  </div>
</div>

<style>@import url("https://fonts.googleapis.com/css2?family=Satisfy&display=swap");@import url("https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200&display=swap");:root{--dysei_color_1:#000;--dysei_color_2:#e393b3;--dysei_font-1:"Satisfy",cursive;--dysei_font-2:"Source Sans Pro",sans-serif;--dysei_bg1:url("https://www.toptal.com/designers/subtlepatterns/uploads/watercolor.png");--dysei_bg2:#f3d0de;--dysei_bg2a:rgb(243,208,222,0.5)}.dysei_container{background:var(--dysei_bg2);margin:auto;padding:40px;height:auto;width:500px;font-family:var(--dysei_font-2);font-size:20px}.dysei_topbox{background:var(--dysei_bg1)}.dysei_h1{font-family:var(--dysei_font-1);font-size:40px;text-align:center;font-weight:bold}.dysei_h2{font-size:35px;text-align:center;font-weight:bold;text-transform:uppercase}.dysei_h3{text-transform:uppercase;text-align:center;font-size:30px}.dysei_gesuchtbox{border:solid;display:flex;justify-content:center;flex-direction:row}.dysei_gesuchtbox img{padding:20px;width:200px;height:400px}.dysei_gesuchtbox-text{padding:20px;text-align:justify;width:220px;box-sizing:border-box}.dysei_gesuchtbox_fakt{background:var(--dysei_color_2);width:170px;border-radius:10%;text-align:center;margin:10px}.dysei_gesuchtbox_1{display:flex;flex-align:row}.dysei_bottombox{background:var(--dysei_bg1)}.dysei_bottombox ul{background:var(--dysei_bg2a)}.dysei_bottombox a{text-decoration:none;color:var(--dysei_color_1);font-weight:bold}.dysei_bottombox a:hover{text-transform:uppercase;color:var(--dysei_color_2)}.dysei_linkbox{text-align:center}</style>
23.06.2022, 20:05: Hugo hat diesen Beitrag moderiert

Rubine sind verteilt
19. Juli - 23:59
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#9


Es hagelt Nüsse

am


Ich würde mich bitte gerne einmal an der Nr. [TROLLZENSUR] probieren. happy


Code:
<style type="text/css">:root{--hintergrundfarbe:#c2c39b;--boxenfarbe:#a1bcd9;--umrandungsfarbe:#337295;--inhaltsfarbe:#ced4da;--boxenfont:Georgia,serif;--inhaltsfont:Trebuchet MS,Verdana,sans-serif;--inhaltsfontfarbe:#000;--ueberschriftenfarbe:#183647;--ueberschriftenfont:'Ms Madi';--zitatfarbe:#000}#aussen{background:var(--hintergrundfarbe);color:var(--inhaltsfontfarbe);display:flex;flex-direction:row;font-family:var(--boxenfont);width:700px}.links{background:var(--inhaltsfarbe);display:flex;flex-direction:column;justify-content:flex-start;width:280px}.charaktername{font-size:1.5em;margin-top:20px;text-align:center}.charaktername a{color:var(--ueberschriftenfarbe);text-decoration:none}.charaktername a:hover{color:var(--zitatfarbe);text-decoration:underline}.charaktertitel{font-size:.8em;text-align:center}.spielerinfos{font-size:.8em;text-align:center;margin:5px}.avatar{border:2px solid var(--umrandungsfarbe);height:220px;margin:5px;text-align:center;width:270px}.interaktion,.awards{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}img.interaktion_bild{height:30px;margin:5px;width:30px}img.award{height:60px;margin-right:5px;width:60px}.links_stats{align-items:center;display:flex;flex-direction:column;justify-content:center;text-align:center}.box{background:var(--boxenfarbe);border:1px solid var(--umrandungsfarbe);font-size:.88em;line-height:1em;margin:2px 5px 2px 5px;padding:5px;text-align:left;width:250px}p.kurzinfos{text-align:justify;margin:5px 0}.icon{border:2px solid var(--umrandungsfarbe);height:100px;margin:10px;text-align:Center;width:200px}.awards_ueberschrift{border-bottom:1px solid var(--umrandungsfarbe);font-color:var(--ueberschriftenfarbe);margin:10px;text-align:center}.rechts{background:var(--inhaltsfarbe);display:flex;flex-direction:column;width:700px}.kopfzeile{border-bottom:.5px solid var(--umrandungsfarbe);display:flex;flex-direction:row;font-size:.8em;justify-content:space-between;margin:20px 20px 5px 30px}.kopfzeile a{color:var(--inhaltsfontfarbe);text-decoration:none}.beitragsanzahl{text-align:right}.post{color:var(--inhaltsfontfarbe);font-family:var(--inhaltsfont);line-height:1.5em;margin:10px 20px 10px 30px;text-align:justify}.fusszeile{border-top:1px solid var(--umrandungsfarbe);display:flex;flex-direction:row;justify-content:flex-end;text-align:right}img.fusszeile_bild{height:20px;margin:10px 5px 5px 5px;width:20px}<div id="aussen">
  <div class="links">
    <div class="charaktername"><a href="linkzumprofil">Miriam Mustermensch</a></div>
    <div class="spielerinfos">gespielt von xxx</div>
    <div class="avatar"><img src="https://abload.de/img/avatarm7k2n.jpg" /></div>
    <div class="charaktertitel">Mensch und Eichhörnchen von Welt</div>
    <div class="interaktion">
      <div class="interaktion_element"><img class="interaktion_bild" title="PN schicken" src="https://abload.de/img/12393089uk0r.png" /></div>
      <div class="interaktion_element"><img class="interaktion_bild" src="https://abload.de/img/116572y4k84.png" title="Suche alle Beiträge von diesem User" /></div></div>
    <div class="links_stats">
      <div class="box">
        <strong>Alter:</strong> 42 Jahre<br />
        <strong>Herkunft:</strong> Nimmerland<br />
        <strong>Wohnort: </strong>Uruguay<br />
        <strong>Wesen:</strong> Wer-Eichhörnchen<br />
        <strong>Beruf: </strong>Nussknackerin<br />
        <strong>Lieblingsfarbe: </strong>Ocker<br />
        <strong>Fähigkeiten: </strong> Klettern
      </div>
        <div class="box"><strong>Kurzinfos:</strong><p class="kurzinfos">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea tak.</p></div>
      <div class="box"><strong>weitere Charaktere: </strong><br />
        Paula Pusteblume, Lira Löffelstil
      </strong> </div>
          <div class="box">        <strong>Pronomen: </strong>sie/ihr<br /></div>
    <div class="icon"><img src="https://abload.de/img/iconplj1i.gif" /></div>
      <div class="awards_ueberschrift">Awards</div>
    <div class="awards">
    <div class="award_element"><img class="award" title="Wenn das die Guten sind, möchte ich Darth Vader sein!" src="https://abload.de/img/noun_darthvaderm8kd0.png" /></div>
    <div class="award_element"><img class="award" title="Du siehst doch Gespenster!" src="https://abload.de/img/noun_geist3ckxx.png" /></div>
    <div class="award_element"><img class="award" title="Du bist ja ein echter Lebensretter!" src="https://abload.de/img/noun_lebensrettertckgm.png" /></div>
    <div class="award_element"><img class="award" title="Verneige dich vor dem Porzellangott!" src="https://abload.de/img/noun_porzellanmxjr3.png" /></div>
    <div class="award_element"><img class="award" title="Erwecke das Tier in dir! Du hast dich das erste Mal ingame gewandelt." src="https://abload.de/img/noun_wandlungphjcx.png" /></div>
  </div>
  </div>
  </div>
  <div class="rechts">
    <div class="kopfzeile">
      <div class="datum">11. November 2011, 11:11 Uhr</div>
     <div class="beitragsanzahl"><a href="direktlinkzumbeitrag">#111</a></div>
    </div>
    <div class="post_inhalt"><p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p><p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p><p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. </p><p>Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. </p></div>
    <div class="signatur"></div>
    <div class="fusszeile"><div class"fusszeile_element"><img class="fusszeile_bild" src="https://abload.de/img/12509254hkff.png" title="editieren" /> </div>
      <div class"fusszeile_element"><img class="fusszeile_bild" src="https://abload.de/img/565703tzk0k.png" title="zitieren" /></div>
      <div class"fusszeile_element"><img class="fusszeile_bild" src="https://abload.de/img/12358998sjuy.png" title="löschen" /></div>
      <div class"fusszeile_element"><img class="fusszeile_bild" src="https://abload.de/img/507256gzjzx.png" title="nach oben" /></div></div>
  </div>
</div>
22.06.2022, 20:34: Hugo hat diesen Beitrag moderiert

Rubine sind verteilt
19. Juli - 23:59
2
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#10


Es hagelt Nüsse

am


Ich nehm die [BIEEEEP]

das hohle Ei
Logan Lerman
Fakt 1
Fakt 2
Fakt 3
Vorname Nachname
Fakt 4
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
das dumme Huhn
Taylor Momsen
Fakt 4
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Fakt 1
Fakt 2
Fakt 3
Vorname Nachname
We can be awesome
but we may be a real stupid couple
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.



Code:
<div id="eiserendipity-gesuch-box"><div class="eiserendipity-suchbox"><div class="eiserendipity-namenbox"><div class="eiserendipity-gesuchname">das <s>hohle</s> Ei</div><div class="eiserendipity-gesuchname-untername">Logan Lerman</div></div><div class="eiserendipity-bildbox"><img src="https://via.placeholder.com/155x140" /></div></div><div class="eiserendipity-suchtext"><div class="eiserendipity-linkespalte"><div class="eiserendipity-facts">Fakt 1</div><div class="eiserendipity-facts">Fakt 2</div><div class="eiserendipity-facts">Fakt 3</div><div class="eiserendipity-name">Vorname Nachname</div></div><div class="eiserendipity-beschreibungstext"><div class="eiserendipity-btext"><div class="eiserendipity-facts" style="display:inline-block !important;">Fakt 4</div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div></div></div><div class="eiserendipity-suchbox"><div class="eiserendipity-bildbox"><img src="https://via.placeholder.com/155x140" /></div><div class="eiserendipity-namenbox"><div class="eiserendipity-gesuchname">das <s>dumme</s> Huhn</div><div class="eiserendipity-gesuchname-untername">Taylor Momsen</div></div></div><div class="eiserendipity-suchtext"><div class="eiserendipity-beschreibungstext"><div class="eiserendipity-btext"><div class="eiserendipity-facts" style="display:inline-block !important;">Fakt 4</div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div></div><div class="eiserendipity-linkespalte"><div class="eiserendipity-facts">Fakt 1</div><div class="eiserendipity-facts">Fakt 2</div><div class="eiserendipity-facts">Fakt 3</div><div class="eiserendipity-name">Vorname Nachname</div></div></div><div class="eiserendipity-h1"><div class="eiserendipity-h1in"><div class="eiserendipity-h1-text">We can be awesome</div><div class="eiserendipity-h1-text-klein">but we may be a real stupid couple</div></div></div><div class="eiserendipity-allgemeintext"><div class="eiserendipity-allgemeintext-scroll">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div></div><div class="eiserendipity-buttonsbox"><a href="#" class="eiserendipity-buttonsbox-link">Zum Gesuch</a><a href="#" class="eiserendipity-buttonsbox-link">Zum Forum</a></div></div>

<style type="text/css">#eiserendipity-gesuch-box {position:relative;padding:60px 40px 40px 40px;width:520px;min-height:100px;background-image:url('https://abload.de/img/220621_pink_patteru6jq1.png');}.eiserendipity-suchbox {width:480px;height:180px;margin-bottom:10px;background-color:#444;padding:20px;display: flex;flex-wrap: nowrap;flex-direction: row;align-items: flex-start;    justify-content:space-between;}.eiserendipity-namenbox {width:280px;height:180px;background-color:#555;}.eiserendipity-gesuchname {margin-top:65px;color:#f48798;text-align:center;width:280px;height:40px;text-transform:uppercase;font-weight:800;line-height:25px;font-size:35px;font-family:Times New Roman, sans-serif;}.eiserendipity-gesuchname-untername {font-family:'Calibri', sans-serif;text-transform:uppercase;width:280px;text-align:center;height:40px;color:#d9d9d9;font-size:11px;letter-spacing:2px;margin-top:-35px;}.eiserendipity-bildbox {width:155px;height:140px;background-color:#333;padding:20px;}.eiserendipity-bildbox img {opacity:0.8;}.eiserendipity-suchtext {width:480px;height:250px;padding:20px;background-color:#444;display: flex;flex-wrap: nowrap;flex-direction: row;align-items: flex-start;    justify-content:space-between;margin-bottom:20px;}.eiserendipity-linkespalte {width:150px;height:250px;background-color:#555;}.eiserendipity-facts {font-family:Calibri,sans-serif;display: block;text-align:center;margin-bottom: 10px;padding: 10px 10px 10px 10px;background-color: #333;color: #f48798;font-size: 13px;text-decoration: none;transition: 0.7s ease;margin:5px;}.eiserendipity-facts:hover {background-color: #f48798;color:#fff;transition: 3s ease;}.eiserendipity-name {width:140px;height:80px;padding-top:20px;font-family:Times New Roman, sans-serif;color:#444;text-transform:uppercase;font-weight:900;line-height:27px;font-size:30px;text-align: end;margin:5px 0px 0px 15px;word-break: break-all;}.eiserendipity-beschreibungstext {width:300px;height:230px;background-color:#444;padding:10px;}.eiserendipity-btext {width:290px;height:230px;padding:0px 10px 0px 0px;overflow:auto;text-align:justify;font-family:'calibri',sans-serif;line-height:13px;color:#d9d9d9;}.eiserendipity-btext::-webkit-scrollbar {width: 5px;}.eiserendipity-btext::-webkit-scrollbar-thumb {width: 5px;background-color:#555;}.eiserendipity-h1 {width:480px;padding:20px;height:50px;background-color:#444;}.eiserendipity-h1in {width:470px;height:30px;padding:10px;background-color:#333;text-align:center;}.eiserendipity-h1-text {font-family:'Times New Roman', sans-serif;text-transform:uppercase;font-weight:800;font-size:30px;color:#f48798;}.eiserendipity-h1-text-klein {font-family:'Calibri', sans-serif;text-transform:uppercase;width:470px;text-align:center;height:40px;color:#d9d9d9;font-size:11px;letter-spacing:2px;margin-top:-13px;}.eiserendipity-allgemeintext {margin-top:10px;width:480px;height:200px;padding:20px;background-color:#333;margin-bottom:20px;}.eiserendipity-allgemeintext-scroll {width:480px;height:200px;text-align:justify;font-family:'Calibri', sans-serif;overflow:auto;line-height:13px;padding:0px 10px 0px 0px;color:#d9d9d9;}.eiserendipity-allgemeintext-scroll::-webkit-scrollbar {width: 5px;}.eiserendipity-allgemeintext-scroll::-webkit-scrollbar-thumb {width: 5px;background-color:#555;}.eiserendipity-buttonsbox {width:500px;text-align:center;padding:20px;height:20px;padding:10px;}a.eiserendipity-buttonsbox-link:link, a.eiserendipity-buttonsbox-link:visited {color:#f48798;font-family: 'Calibri', sans-serif;text-decoration:none;font-size:12px;display:inline-block;width:110px;height:15px;padding:10px 10px 10px 10px;text-align:center;background-color:#444;transition:2s;margin-left:10px;text-transform:uppercase;}a.eiserendipity-buttonsbox-link:hover {background-color: #f48798;color:#fff;}</style>
21.06.2022, 21:47: Hugo hat diesen Beitrag moderiert

Rubine wurden verteilt
19. Juli - 23:59
4
1
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.