Toyhouse page code

<!--------- [HTML] SOFT SKY BY XYITH & QUYLLI

i n f o

  - feel free to message Quylli with any questions you have!
  - make sure to turn off WYSIWYG!
  - you're welcome to modify this code however you like but the credit to me MUST remain!
  - do not redistribute this code! these are for the buyer's use only, I have a list of people with access to the code. Let me know if you have multiple accounts you'll be using it on.
  - mobile friendly
  - may not be able to be used with CSS
  - I don't recommend cutting parts out of the code unless you're 110% sure you've got it right ^^"

------------->
<!--------------

  BACKGROUND

    - UNSPLASH.COM is a great resource for free background images.
    - Want to change the position of the background image on the page? Find the part that says "background-position: center center" and play around between the words top, bottom, and center. The first center is on the vertical axis; the second center is on the horizontal axis.
      - For example, to keep the image horizontally centered but show the top part of the image, you can change the "center center" to "top center".

---------->
<div style="position:fixed; top:0; bottom:0; left:0; width:100%;
  background-image:url(https://f2.toyhou.se/file/f2-toyhou-se/images/32875269_sdCMktzQuPFkHuH.png);
  background-position: center center;
  background-size: cover;
  background-attachment: fixed;">
	<br>
</div>
<div class="justify-content-center">
	<div class="col-lg-8 col-md-11" style="max-width: 590px;">
		<!--------------

  MAIN CONTAINER

    - RGBA: red-green-blue-opacity. To alter the color of the transparent background, get the RGB values and replace the first three numbers. To edit the opacity, change the last number: 0 = fully transparent, 1 = fully opaque.

    - IMAGE (OPTIONAL): Just if you want to add an additional texture over the background color, like a transparent checkerboard and such! An example of this is visible in the code's custom color example.
      - transparenttextures.com is an amazing resource for these
      - TO DELETE: just delete the entire line of code that says "background-image:url();" but make sure not to delete anything else.

---------->
		<div style="border-radius: .5em;
    background:rgba(0, 0, 0,.3);
    background-image:url(TEXTURE IMAGE URL HERE, SEE NOTES ABOVE FOR DETAILS);
    z-index: 2;">
			<!------------

    MENU BAR

  -------------->
			<div class="mx-0 mt-0 mb-4 bg-faded hidden-sm-down" style="border-radius: .5em; overflow:hidden; box-shadow:0px 0px 5px rgba(0,0,0,.2);">

				<h1 class="py-2 px-4 m-0 text-center justify-content-between" style="font-size:1rem; letter-spacing:3px;">
					<!----------- links: replace all "USERNAME" with your own username. ------------>
					<!--bulletins-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/bulletins" title="bulletins"><i class="fal fa-thumbtack"></i></a>
					<!--characters-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/characters" title="characters"><i class="fas fa-users"></i></a>
					<!--links-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/links" title="links"><i class="fas fa-link"></i></a>
					<!--worlds-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/worlds" title="worlds"><i class="fas fa-globe"></i></a>
					<!--favorites-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/favorites" title="favorites"><i class="fas fa-star"></i></a>
					<!--designs-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/created" title="designs"><i class="fas fa-palette"></i></a>
					<!--art-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/art" title="art"><i class="fas fa-paint-brush"></i></a>
					<!--library-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/literatures" title="library"><i class="fas fa-book"></i></a>
					<!--comments-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/comments" title="comments"><i class="fas fa-comment"></i></a>
					<!--stats-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/stats" title="stats"><i class="fas fa-chart-bar"></i></a>
					<!--message-->
					<a data-toggle="tooltip" href="https://toyhou.se/~messages/create/trashkid" title="message"><i class="fas fa-envelope"></i></a>
					<!--sub-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/subscribe" title="sub"><i class="fas fa-pencil"></i></a>
					<!--authorize-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/authorize" title="authorize"><i class="fas fa-heart"></i></a>
					<!--block-->
					<a data-toggle="tooltip" href="https://toyhou.se/trashkid/block" title="block"><i class="fas fa-ban"></i></a>
					<!--report-->
					<!--you'll have to ask a friend or use an alternate account to get the report link for you by reporting your profile; you can ask me if needed!-->
					<a data-toggle="tooltip" href="LINK%20HERE" title="report"><i class="fas fa-exclamation-triangle"></i></a></h1>
			</div>
			<!----------- menu bar end ------------>
			<div class="d-flex w-100 px-3" style="flex-direction:column;">
				<!------------

      FIRST CONTAINER

    -------------->
				<div class="bg-faded my-3 mx-auto text-muted w-100" style="border-radius: .5em; max-width: 400px;">
					<!----------- name ------------>
					<div class="mt-2" style='font-weight: 100; font-size: 3rem; font-family: "Courier New"; text-align: center;'><img src="https://f2.toyhou.se/file/f2-toyhou-se/images/31835863_CKTjUqFP3bw8jm2.png" class="fr-fic fr-dib" width="400" height="400"><span style='font-family: "comic sans ms", sans-serif;'>trashkid</span></div>
					<!---------------- ICON (200x200 BEST) ---------------------------------------------->
					<!---------

        INFO

          - don't delete the quotation marks below, and keep a space between the beginning/end of the quote and the quotation marks! They aren't the normal quotation marks you see on the keyboard ^^

      ---------->

					<p class="my-3 mx-5" style="max-width:300px;">Hello! I&#39;m trashkid, A female 13 year old artist that is obsessed with drawing cute images. I quite often make adorable affordable adopts, YCHs and fan art. I also do commissions and requests once and a while. Make sure to read my T.O.S(Terms of Service).If you need anything or have any questions or concerns please contact me!</p>
					<!--Info end-->
					<!---------

        LINKS

          - to delete one, simply delete its line!
          - I get all my icons from fontawesome.com ; if you want to add another one, simply follow the same format with an icon from there ^^

      --------->

					<h3 align="center" class="text-uppercase my-4" style="font-size:19px;letter-spacing:8px; padding-bottom: 4px;">
						<!--Deviantart-->
						<a href="https://www.deviantart.com/ghoststylon"><i class="fab fa-deviantart"></i></a>
						<!--Youtube-->
						<a href="https://www.youtube.com/channel/UCn9taUqVaMLkbmcpiPNIeFQ/featured"><i class="fab fa-youtube"></i></a><i class="fab fa-youtube">&nbsp;</i></h3>
				</div>
				<!--First container end-->
				<!--Spacer, Ignore-->
				<div class="hidden-sm-down my-3">
					<br>
				</div>
				<!------------

    SECOND CONTAINER

    -------------->
				<div class="bg-faded mt-0 mb-3 mx-auto text-muted w-100" style="border-top-left-radius: 0.5em; border-top-right-radius: 0.5em; border-bottom-right-radius: 0.5em; border-bottom-left-radius: 0.5em; max-width: 400px; text-align: center;">
					<!----------- image ---------->
					<img style="max-height: 200px;" class="justify-content-center mx-auto my-2 fr-fic fr-dii" src="https://f2.toyhou.se/file/f2-toyhou-se/images/32825852_p2vvomrwLt9zTGj.png" width="200" height="200">
					<!----------- Paragraph ------------>

					<p class="mx-5 mb-2 mt-1" style="max-width:300px;">Miscellaneous text here! Comms, friends, etc. It can be anything, really.</p>
					<!----------- Art Credits ------------>

					<p class="mb-3" style="font-size:8px;">Icon by LiticaHarmony || Image by N-iryani</p>
				</div>
				<!--Second Container End-->
				<!--Spacer, Ignore-->
				<div class="hidden-sm-down my-3">
					<br>
				</div>
				<!--Main Container End-->
				<!---------- credits ----------------->
				<div class="text-center pt-2 pb-3" style="font-size: 15px; opacity:0.9;">
					<!--Pagedoll Credit-->
					<a class="pl-2" data-toggle="tooltip" href="ARTIST%20LINK%20HERE" title="pagedoll"><i class="fas fa-star"></i></a>
					<!---- Code, DO NOT REMOVE --------->
					<a class="pl-2" data-toggle="tooltip" href="https://toyhou.se/9336607.soft-sky-temp-name-" title="code by Xyith"></a>
					<!--Background Credit-->
					<a class="pl-2" data-toggle="tooltip" href="BACKGROUND%20SITE%20LINK%20HERE" title="background"><i class="fas fa-image"></i></a></div>
				<!--Credits end-->
				<!-----------

  PAGEDOLL

  - to move up/down, edit the bottom:0px. Can be negative.
  - to move left/right, edit the left:0px. Can be negative.
  - Do not edit right:60%; this resizes it with screen narrowness so it won't cover the text.

------------>

				<p>
					<br>
				</p>
				<div class="hidden-sm-down" style="position:fixed; z-index:4; right:60%;
    bottom:0px;
    left:0px;"><img src="https://f2.toyhou.se/file/f2-toyhou-se/images/31944401_W2tKNFc3c1Gj2b8.png" style="max-height: 500px;" class="fr-fic fr-dii" width="548" height="500"></div>

				<p>
					<br>
				</p>
			</div>
		</div>
	</div>
</div>