Miracle Musical Layout (WIP!)

Tags: miracle musical, tally hall, beach, hawaii, rainbow, liminal space, night, black

Description:

based off the hawaii part ii cover (credit isn't needed but would be cool :))

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Sol?! (https://layouts.spacehey.com/layout?id=26050) -->

<style>

body{
background-image:
url(https://i.imgur.com/LWWzLzP.jpg);
background-color: #b5b5b5
background-attachment: fixed;
background-size: 1000px;
font-family: Courier;
}

nav{ 
  background-color: #000;
  text-color: #fff;
}

main {
  background-color: #111;
  color: #ccc;
}

   .top{
    background-color: #222222 !important;
}

   .links{
     text-align:center;
    background-color: transparent !important;
}

.profile .contact, .profile .table-section, .profile .url-info {
  border: 1px solid #000;
}
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
  background-color: #444;
  color: #bbb;
}

.profile .table-section .details-table td {
  background-image:
 url(https://i.imgur.com/S4PAzLk.png)
  color: #000;
}
</style>

<style>
.profile .blurbs .section h4{
color: white;
}
</style>

<style>
   a:hover {
     color: black; 
   } 
   a{
     color: white; 
   }
</style>

<style>
.profile .blurbs .heading, .profile .friends .heading {
color: black;
background-color:rgba(0, 0, 0, 1);
color: white;
border-radius:10px;
border: 1px dotted rgba(255, 255, 255, 1)
}
</style>

<style>
nav {
    background: #h5h5h5;
    border: var(--borders);

}

{

   .links: #fff
    background: #h5h5h5

}

   {

    .profile-pic {
        border-radius: 500px;
        overflow: hidden;

        border: 5px dotted #FFFFFF;
    }


    .container {
        border-radius: 15px 15px 0 0;
        overflow: hidden;
        margin-top: 30px;
        padding: 10px;
    }

    footer {
        border-radius: 15px;
        background: rgba(255, 255, 255, 0.94) !important;
        display: block !important;
    }

    table.comments-table td {
        background-color: white !important;
    }

    .comments-table td:first-child {
        width: 80px;
        border-radius: 500px;
    }

    .profile .friends .person img {
        border-radius: 500px;
    }

    .blog-preview p {
        font-size: 1.4rem;
    }

    a.addme {
        font-size: 2rem;
        font-weight: bold;
        margin-bottom: 15px;
        display: block;
    }
.profile .blurbs, .profile .friends, .profile .about me{
color: black;
background-color:rgba(0, 0, 0, 1);
color: white;
border-radius:10px;
border: 1px dotted rgba(255, 255, 255, 1)
}

.profile .contact, .profile .table-section, .profile .url-info {
  border: 1px dotted  rgba(255, 255, 255, 1)
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
  background-color: black;
  color: white;
  }

   .table-section .heading{
    border-radius: 25px 25px 25px 25px !important;
    text-align:center;
    background-color: #999999 !important;

}

    table.details-table{
    background-color: #999999 !important;
    background-image: url('https://cdn.pixabay.com/photo/2020/06/25/11/30/pastel-5339368_1280.jpg') !important;
    background-attachment: SCROLL !important;
    background-repeat: REPEAT !important;
    background-position: CENTER !important;}

    .profile .details-table td{
    background-color: #888888 !important;

}

footer {

   color: #faf;

   background: #000;

   
}



footer .links {

   background: rgba(255, 255, 255, 0);

   border: 0px;


}



.logo {

   content: url(https://i.imgur.com/ultYD2Y.jpg);

}



</style>

<style>
.online{content:url("https://i.imgur.com/SRvy3Xe.gif");}
</style>



<iframe width="0" height="0" src="https://www.youtube.com/embed/hR5Z-_E1sVc//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>

<style>body { cursor: url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/967cfe8c-c6b7-4445-a585-f85a8c14e785/d2jmejc-ee2007b4-5518-4c8e-a4d9-68e1cd920262.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzk2N2NmZThjLWM2YjctNDQ0NS1hNTg1LWY4NWE4YzE0ZTc4NVwvZDJqbWVqYy1lZTIwMDdiNC01NTE4LTRjOGUtYTRkOS02OGUxY2Q5MjAyNjIuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.bytkROsJZqSD52shnHe9qadcfNpV-ztPC7XA1sKuFIQ'), auto; }</style>

<div class="snowflakes">


  <div class="snowflake">


   *


  </div>


  <div class="snowflake">


  .


  </div>


  <div class="snowflake">


  *


  </div>


  <div class="snowflake">


  .


  </div>


  <div class="snowflake">


  *


  </div>


  <div class="snowflake">


  .


  </div>


  <div class="snowflake">


    *


  </div>


  <div class="snowflake">

    .


  </div>


  <div class="snowflake">


    *


  </div>



  </div>


<style>


/* customizable snowflake styling */


.snowflake {


  color: white;


  font-size: 1em;


  font-family: Arial, sans-serif;


  text-shadow: 0 0 5px rgba(0,0,0,0.7);


}





@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s}


</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 23 comments ( View all | Add Comment )

Airy / Craig	1710105089 Using Report Comment
Tmndoro	1706933547 using x33 Report Comment
Lys. 🍮	1705610241 Using!! :3 Report Comment
Momonica	1703050840 using!! for some reason the background is not working though :( Report Comment
JunoWasMad	1702680830 ajjfiskfn this is beautiful using :D Report Comment
space.	1698602850 Using! 1!! 1 Report Comment
Yours_truly_the_whale	1693379245 Using Report Comment
qepi	1693350033 this will be the first layout i will use Report Comment
frank	1690670760 USIJGN !!!!! Report Comment
frank	1690670760 USIJGN !!!!! Report Comment
kiib !	1690444331 usingg Report Comment
Boniscool	1689279920 ILL USE THIS SOMEDAY Report Comment
Limona	1684781247 love this concept! the songs are epic Report Comment
NeonFoxo	1683394881 USING Report Comment
BexDHM	1682769393 OMG I WILL DEFINITELY USE THIS Report Comment
Aziraphale	1682723816 USINGOMGOMOGOMG Report Comment OH MY GOD STANLEY PARABE FAN!?!? by •┈••✦ ♡ ✦••┈•; 1692555241; Report ABOSLUTELY LMAOOOO (SORRY FOR LATE RESPONSE) by Aziraphale; 1695867201; Report ABOSLUTELY LMAOOOO (SORRY FOR LATE RESPONSE) by Aziraphale; 1695867204; Report ABOSLUTELY LMAOOOO (SORRY FOR LATE RESPONSE) by Aziraphale; 1695867206; Report ABOSLUTELY LMAOOOO (SORRY FOR LATE RESPONSE) by Aziraphale; 1695867206; Report ABOSLUTELY LMAOOOO (SORRY FOR LATE RESPONSE) by Aziraphale; 1695867207; Report ABOSLUTELY LMAOOOO (SORRY FOR LATE RESPONSE) by Aziraphale; 1695867208; Report ABOSLUTELY LMAOOOO (SORRY FOR LATE RESPONSE) by Aziraphale; 1695867209; Report THE.. SEVEN.. REPLIES.... by •┈••✦ ♡ ✦••┈•; 1696202927; Report THE.. SEVEN.. REPLIES.... by •┈••✦ ♡ ✦••┈•; 1696202929; Report SEVEN,,,,, REPLIES,,,,,,,, OH GOOD GOD by •┈••✦ ♡ ✦••┈•; 1696202947; Report WHAT IS HAPPENING??? by Aziraphale; 1696373257; Report WHAT IS HAPPENING??? by Aziraphale; 1696373259; Report IT ONLY DID IT TWIXE THIS TIME by •┈••✦ ♡ ✦••┈•; 1696378157; Report
ROWAN	1682028875 USING BWAAUGGHHH Report Comment
vincent ; vince	1681668926 USING OH MYGOD Report Comment
नव !! ☆	1681345030 USING!!! Report Comment
Juno	1680423270 using. i love miracle musical 🙇 Report Comment