Portals-layout

Tags: melaniemartinez, portals, layout, autoplay, green, pink, mushroom

Description:

Melanie Martinez portals inspired layout :3
Fairee soireé autoplay
comment if using or any issue
u can see it in my test page "Elian's test page" (for now)

Code:

<!-- (c) Layout created by Elián >3 (https://layouts.spacehey.com/layout?id=101069) -->

<style>
@import url('https://fonts.googleapis.com/css2?family=Merienda:wght@300..900&display=swap');
p{
  font-family: 'Merienda', cursive;
  font-size: 100%;
  color: white;
}
h1,h2,h3,h4,h5 {
  font-family: 'Merienda', cursive
  font-size: 100%;
  color: white; 
}

</style>




<style>
  
.online {
    content: url(http://dl9.glitter-graphics.net/pub/272/272679lz7b9hcea1.gif); 
  width: 30%;
  height: 20%;

  
}

.profile h1{
	  font-family: 'Merienda', monospace!important;
	  color:#ffffff!important;
	  font-size:2rem;
text-shadow: 2px 2px #c2709c;
}

body  {
background: url(https://wallpapercave.com/wp/wp13571176.jpg)  
no-repeat  center  center
fixed;
background-size: cover;
}

main  {
background-color:transparent;
}

main:before {
	width: 100%;
	height: 300px;
	display: block;
	content: "";
    border-radius: 2px;
    margin-top: -6px;
	background-image: url('https://64.media.tumblr.com/a33eb78165b2105cc45b93d73a7f4602/4f06b6018cadc5a2-e3/s1280x1920/8989eb43f88aa401c5a1b39791c6addbebc8a0fa.gifv');
	background-position: center center;
	background-size: cover; 
}

.profile-info {
background-image:
url(https://64.media.tumblr.com/fba523fcd9d7d1c98f9d38d0cecf7e15/5b3f979b0c060efe-51/s1280x1920/a2af6a3b78080080c4c23f06276631107bb096c3.jpg);
background-size: cover; 
box-shadow: 0 0 10px #ebabcd;
 border: 1px #ebabcd;
 font-family: 'Merienda', monospace!important;
	  color:#ffffff!important;

}

.profile  .blurbs  .heading,
.profile  .friends .heading, 
.profile  .contact .heading,
.profile  .table-section .heading {
background-color: #e3b8cf; 
box-shadow: 0 0 8px #ebabcd;
 border: 1px #ebabcd;
 font-family: 'Merienda', monospace!important;
	  color: #ffffff!important;
text-shadow: 2px 2px #c2709c; 
}

nav .links{
    background: url(https://64.media.tumblr.com/7ca9dd5a66d9a5fdfd6b6abb3d4da600/a2c570f6b5cca8f1-aa/s100x200/9cb81cc5ff9cd0ecebb95c1d0fd5ed0c5c1cce5b.jpg);
    border: 2px solid black;
    box-shadow: 0 0 10px #ebabcd;
    border-radius: 8px;
    margin-bottom: black;
    text-align: center;
 font-family: 'Merienda', monospace!important;
	  color:#ffffff!important;
}

.profile  .table-section {
background-color: transparent; 
box-shadow: 0 0 8px #ebabcd; 
 font-family: 'Merienda', monospace!important;
text-shadow: 2px 2px #c2709c; 
}

nav .top {
    background: url(https://64.media.tumblr.com/7ca9dd5a66d9a5fdfd6b6abb3d4da600/a2c570f6b5cca8f1-aa/s100x200/9cb81cc5ff9cd0ecebb95c1d0fd5ed0c5c1cce5b.jpg);
    padding: 15px 10px 14px 10px;
    display: flex;
    position: relative;
    border: 1px #ebabcd;
    box-shadow: 0 0 10px #ebabcd;
 font-family: 'Merienda', monospace!important;
	  color:#ffffff!important;
   
    
}


</style>


<style> 
    
    .contact .inner a img {
        font-size: 0;
    }
    .contact .inner a img:before {
        font-size: 1em;
display: block;
        
    }
    .contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	    /* add to friends */
	    content: url("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png") 
    }
    .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	    /* add to favorites */
	    content: url("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png")  	  
    }
    .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	    /* send Message */
	    content: url("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png") }
    .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	    /* forward to friend */
	    content: url("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png")
    }
    .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	    /* instant message */
	    content: url("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png")
    }
    .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	    /* block user */
	    content: URL("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png")
    }
    .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	    /* add to group */
	    content: url("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png")
    }
    .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	    /* report user */
	    content: url("https://64.media.tumblr.com/0c3112ff03c086d3905b8d4d97242ae5/1f84397863e688c8-6e/s75x75_c1/00a3bacb81bbea21a91a180f0f77f2b3b0cc12cb.png")
    } 
</style>


<style>
.profile .url-info p:last-child:after {content: ""; display: block; background-image: url(http://dl10.glitter-graphics.net/pub/627/627200g55l0cvq19.gif);  width: auto; height: 70px; background-position: top center; background-size: 100%; background-repeat: no-repeat;}
.profile .url-info p {text-align: center;}

</style>

<style>
h4 {
color: #ffffff;
font-size: 12pt;
font-family: 'Merienda', cursive;
}

.section h4, .details-table td:first-child {
color: #ffffff!important;
font-size: 10pt;
font-family: 'Merienda', cursive;

}

a, .count {
color: #ffffff;
font-size: 8pt;
font-family: 'Merienda', cursive;

}

a:hover {
color: #ffffff;
font-size: 8pt;
font-family: 'Merienda', cursive;

}

body,main {
color: #ffffff;
font-size: 8pt;
font-family: 'Merienda', cursive;

}
.details-table td, .details-table td:first-child{
background: none!important;
box-shadow: 0 0 8px #ebabcd;
 border: 1px #ebabcd;
}
footer {
    background-color:transparent;

}
.profile  .blurbs,
.profile  .friends, 
.profile  .contact,
.profile .url-info,
.profile  .table-section {
box-shadow: 0 0 8px #ebabcd;
 border: 1px #ebabcd;
}


</style>



<style>
body { cursor: url('https://64.media.tumblr.com/17c6ecf625cd640da31ca0174da413eb/18232341a10e1fab-c2/s100x200/6f33d6bd05482a9c054d0dbf36c5d130820ed98a.gifv'), auto; }
</style>



<iframe width="0" height="0" src="https://www.youtube.com/embed/z7APVSchu30?&;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>

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.