bunny knowledge (uxie x rabbitswarren)

m[border=transparent;
*biiig background image;
--bg: url('https://i.imgur.com/ff81P8e.png');
*top left image!;
--img-1: url('https://64.media.tumblr.com/5d4ce43047dfd76ebab04a0f26702792/tumblr_oq105jGgaB1uk5odio1_400.jpg');
*half-transparent background of the boxes;
--color-1: rgb(27, 30, 37, 0.9);
*accent colour/text colour;
--color-2: #CC5F4A;

height:430px; width:750px; padding:0; padding-bottom:20px; position:relative; line-height:0; margin:auto;][border=transparent; height:100%; width:100%; padding:5px; box-sizing:border-box; background: var(--bg) 50% 0%; background-size:cover; border-radius:12px; display:flex; flex-flow:column wrap; align-content:center;]

   [comment]----image container----[/comment]
   [border=transparent; height:60%; width:24%; padding:3px 0; box-sizing:border-box; background-color: var(--color-1); border-radius:10px; margin:5px; display:flex; flex-flow:column nowrap; overflow:hidden;]

      [comment]----image----[/comment]
      [border=transparent; flex-grow:1; width:100%; padding:0; background: var(--img-1); background-size:90%; background-repeat:no-repeat; transform:scaleX(1.11);
/*edit the following to adjust the cropping of the image*/ background-position: 50% 50%;][/border]

      [comment]----credit----[/comment]
      [border=transparent; height:fit-content; width:100%; padding:0; line-height:100%; font-size:9px; margin:3px 0; letter-spacing:1px; color: var(--color-2); text-align:center; flex-shrink:0;][font=Georgia][comment]
----* * *credit the artist here! replace the xx with the artist's profile link!----
[/comment]art by [url='xx'][border=0; padding:0; display:inline; color: var(--color-2);][comment]
----* * * artist name here----
[/comment]arithm[/border][/url][/font][/border]
   [/border]

   [comment]----info container----[/comment]
   [border=transparent; height:34%; width:24%; padding:3px 0; box-sizing:border-box; background-color: var(--color-1); border-radius:10px; margin:5px; display:flex; flex-flow:column nowrap; overflow:hidden; color: var(--color-2);]
      [comment]----name----[/comment]
      [border=transparent; height:fit-content; width:100%; padding:0; font-size:30px; line-height:110%; text-align:center;][font=Euphoria Script][comment]
----* * *name here----
[/comment]Warren Burns[/font][/border]

      [comment]----pronouns----[/comment]
      [border=transparent; height:fit-content; width:100%; padding:0; font-size:12px; line-height:100%; text-align:center;][font=Georgia][comment]
----* * * pronouns here----
[/comment](he/him)[/font][/border]

      [comment]----quote----[/comment]
      [border=transparent; height:fit-content; width:100%; padding:0; font-size:13px; line-height:120%; margin:5px 0; text-align:center;][font=Georgia][comment]
----* * * small quote (one line only!)----
[/comment]"a lil something something"[/font][/border]

      [comment]----links----[/comment]
      [border=transparent; flex-grow:1; width:100%; padding:5px 3px; box-sizing:border-box; display:flex; flex-flow: row wrap; justify-content:center; align-content:center; font-size:11px;]

         [comment]----link one----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0; margin:5px auto;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; color: var(--color-2); padding:0; line-height:110%;][comment]
----* * * link title here----
[/comment]Discord Link[/border][/url][/font]
         [/border]

         [comment]----link two----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0; margin:5px auto;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; color: var(--color-2); padding:0; line-height:110%;][comment]
----* * * link title here----
[/comment]Webnovel Link[/border][/url][/font]
         [/border]

         [comment]----link three----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0; margin:5px auto;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; color: var(--color-2); padding:0; line-height:110%;][comment]
----* * * link title here----
[/comment]Wattpad Link[/border][/url][/font]
         [/border]

         [comment]----link four----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0; margin:5px auto;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; color: var(--color-2); padding:0; line-height:110%;][comment]
----* * * link title here----
[/comment]DeviantArt Link[/border][/url][/font]
         [/border]
      [/border]

   [/border]
   [comment]----info container end----[/comment]

   [comment]----text header----[/comment]
   [border=transparent; height:23%; width:73%; padding:3px 0; box-sizing:border-box; background-color: var(--color-1); border-radius:10px; margin:5px; display:flex; flex-flow:column nowrap; align-items:center; overflow:hidden; color: var(--color-2);]
      [comment]----title----[/comment]
      [border=transparent; height:fit-content; width:100%; padding:0; line-height:100%; font-size:34px; text-align:center; margin-bottom:8px; flex-shrink:0;][font=Euphoria Script][comment]
----* * *big title here (one line only)----
[/comment]Why do all the monsters come out at night?[/font][/border]

      [comment]----more links----[/comment]
      [border=transparent; height:fit-content; width:100%; padding:0; font-size:14px; display:flex; flex-flow: row nowrap; align-items:center; justify-content:center; flex-shrink:0;]

         [comment]----link one----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; padding:0; color: var(--color-2); line-height:110%;][comment]
----* * * link title here!----
[/comment]Thread Hub[/border][/url][/font]
         [/border]

         [border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 4px; font-size:11px;][fa]far fa-star[/fa][/border]

         [comment]----link two----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; padding:0; color: var(--color-2); line-height:110%;][comment]
----* * * link title here!----
[/comment]Character Gallery[/border][/url][/font]
         [/border]

         [border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 4px; font-size:11px;][fa]far fa-star[/fa][/border]

         [comment]----link three----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; padding:0; color: var(--color-2); line-height:110%;][comment]
----* * * link title here!----
[/comment]RP Partner Search[/border][/url][/font]
         [/border]

         [border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 4px; font-size:11px;][fa]far fa-star[/fa][/border]

         [comment]----link four----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0;][font=Georgia][comment]
----* * * replace the xx with your link!----
[/comment][url='xx'][border=0; display:inline; padding:0; color: var(--color-2); line-height:110%;][comment]
----* * * link title here!----
[/comment]Game Central Station[/border][/url][/font]
         [/border]

      [/border]
      [comment]----more links end----[/comment]

      [comment]----music player----[/comment]
      [border=transparent; flex-grow:1; width:fit-content; max-width:90%; padding:0; color: var(--color-2); margin:3px 0; position:relative; display:flex; flex-flow: row nowrap; align-items:center; justify-content:center; pointer-events:none;]
         [comment]----play button----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:11px; margin-right:13px; margin-top:2px; flex-shrink:0;][fa]fas fa-play[/fa][/border]

         [comment]----song name (replace xx with your youtube link!)----[/comment]
         [url='xx'][border=transparent; height:fit-content; width:fit-content; padding:0; font-size:13px; color: var(--color-2); line-height:100%; pointer-events:auto;][font=Georgia][comment]
----* * *song name----
[/comment]song name[/font][/border][/url]

         [border=transparent; height:0; width:8px; border-top:2px solid var(--color-2); padding:0; margin:2px 5px 0 5px;][/border]

         [comment]----song artist----[/comment]
         [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:13px; opacity:.85; color: var(--color-2); line-height:80%; pointer-events:auto;][font=Georgia][comment]
----* * *song artist----
[/comment]artist name[/font][/border]

         [comment]----media player (soundcloud only! do not change the type of media!)----[/comment]
         [border=transparent; height:12px; width:11px; padding:0; opacity:0.01%; position:absolute; top:4px; left:-1px; overflow:hidden; pointer-events:auto;]
[comment]----soundcloud player (put soundcloud link between media=soundcloud and /media)----[/comment]
[border=transparent; height:80px; width:160px; padding:0; margin-top:-20px; margin-left:-20px;]
[media=soundcloud]https://soundcloud.com/l2share96/bibi-restless[/media]
[/border]
         [/border]

      [/border]
      [comment]----music player end----[/comment]
   [/border]
   [comment]----text header end----[/comment]

   [comment]----body text----[/comment]
   [border=transparent; height:70%; width:73%; padding:12px 0; box-sizing:border-box; background-color: var(--color-1); border-radius:10px; margin:5px; display:flex; flex-direction:column; overflow:hidden; color: var(--color-2);][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 12px; box-sizing:border-box; font-size:12px; text-align:justify; line-height:130%;][font=Georgia][comment]
----* * *text starts here!----
[/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vulputate convallis arcu sit amet molestie. Praesent non eleifend risus. Integer eleifend rhoncus pulvinar. Donec pharetra dui eros, quis fringilla metus maximus id. Phasellus congue porta sapien, id dignissim ante hendrerit ut. Maecenas ante nulla, hendrerit at dignissim eget, commodo et lacus. Cras ut eleifend dui. Sed non lectus leo. Morbi vehicula turpis sem, vel efficitur quam egestas a. Morbi magna leo, dapibus a placerat eu, ultrices vel enim. In sed nunc auctor, viverra lectus eu, tempus nunc. Maecenas vulputate ligula vel mi maximus bibendum eu ultrices turpis. Praesent iaculis, lorem facilisis dictum tempus, augue urna rutrum nunc, vel efficitur ex odio id dolor. Vestibulum vehicula nisi erat, vel mollis enim volutpat at. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam porta risus ac efficitur egestas.

Donec varius mi at lacus gravida cursus. Curabitur eu mattis sapien, vitae condimentum velit. Nulla quis lacus et lectus vestibulum sodales eu a dui. In fringilla porta risus, eget lacinia purus vehicula tristique. Pellentesque elementum quam vitae nisl varius, luctus vulputate justo sagittis. Aenean non nisi pretium, tincidunt nunc nec, aliquam felis. Maecenas diam nulla, dapibus non pharetra ac, tincidunt at turpis. Phasellus imperdiet mi vel neque hendrerit consequat. Mauris justo nibh, gravida eu turpis nec, commodo tincidunt urna. In laoreet mi sit amet vehicula porta.

Morbi ornare vitae justo id viverra. Fusce ultricies nisl non enim interdum, vel malesuada urna rhoncus. Aliquam sed neque lectus. Quisque et sodales urna. Donec egestas nibh ac quam suscipit, sit amet placerat nunc ullamcorper. Mauris ac consectetur sapien, id fermentum est. In hac habitasse platea dictumst. Proin facilisis lorem et finibus volutpat. Suspendisse id urna eu mi auctor porttitor. Proin gravida tristique eros rutrum placerat. In hac habitasse platea dictumst. Curabitur sollicitudin libero dolor, non consequat est convallis vel. Maecenas et sollicitudin urna. In tincidunt molestie odio a porta. Vestibulum gravida leo quis condimentum blandit. Integer a purus et dui varius ullamcorper id vel lectus.
   [/font][/border][/border][/border]

[/border][comment]----signature! (do not remove!)-----
[/comment][bg=transparent; height:fit-content; padding:0; width:100%; position:absolute; left:0; bottom:10px; z-index:7;opacity:0.7;font-size:10px;text-align:center; line-height:130%; color: var(--color-2);][font=Open Sans]♡design by rabbitswarren, coded by uxie♡[/font][/bg][/border]