Barbie Layout

Tags: barbie, pink, cute, basic, automusic, autoplay
Description:

auto plays barbie life in the dreamhouse intro feel free to edit anything!! dony need credit but comment if using i just like knowing hehe
Preview:

click on the image for a larger preview
Code:

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

<style>* {cursor: url(https://cur.cursors-4u.net/special/spe-1/spe62.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2006/04/20/spe62.html" target="_blank" title="I Love Girls"><img src="https://cur.cursors-4u.net/cursor.png" alt="I Love Girls" style="position:absolute; top: 0px; right: 0px;"/></a>

<style>

body{

background-image: url(https://www.ranklogos.com/wp-content/uploads/2014/09/logo_barbie.png);
background-color: white;
background-size: 380px;

}

main{

background-color: rgba(255, 255, 255, 0.9);
border: groove #ff309b 6px ;
color: #ff309b;
border-radius: 33px;
font-size: 13px;
 box-shadow: 0px 0px 9px #ff75bc!important;
}

h4{
font-size: 16px;
 background: -webkit-linear-gradient(#ffbade, #ff309b);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
h1{
font-size: 30px!important;
 background: -webkit-linear-gradient(#ffbade, #ff309b);
-webkit-text-stroke: 0.8px #ed5aa6;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.links{
background-image: url(http://1.bp.blogspot.com/-98ptYRTPj2I/VCn3NGd_-CI/AAAAAAAAD54/trye94IZtVA/s1600/banner-barbie.png);
background-size: 300px;
height: 64px;
border-radius: 33px;
margin: 12px!important;
border: solid #ffa1d1 2px;
outline: groove #ff309b 3px;

}
nav .links a{
 text-shadow: 0px 0px 9px #fff2fe!important;
}

.top{

background-image: -webkit-linear-gradient(#ffbade, #ff309b)!important;
  -webkit-background-clip: text;
border-radius: 33px;
outline: groove #ff309b 3px;
}
.blurbs .heading{

background: -webkit-linear-gradient(#faf2f6,#fffcfe)!important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
border-bottom: dashed #ffc7e4 2.5px;
}
.blurbs{

border: solid #ffa1d1 2px;
outline: groove #ff309b 3px;
}

.friends{

border: solid #ffa1d1 2px;
outline: groove #ff309b 3px;
}

.friends .heading{

background: -webkit-linear-gradient(#faf2f6,#fffcfe)!important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
border-bottom: dashed #ffc7e4 2.5px;
}
.contact .heading{

background: -webkit-linear-gradient(#faf2f6,#fffcfe)!important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
border-bottom: dashed #ffc7e4 2.5px;
}
.col.left:before {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 34px;
  width: px;
  background-image: url(https://64.media.tumblr.com/fffdc8c4163df9d99f005fb2096849f3/eaec3bdf26d1fdfd-bb/s640x960/72ee911cb06e1591791d123624cb0d7f3ccbc392.pnj);
  background-repeat: no-repeat;
  background-size: 300px;
  background-position-x: center;
}
.col.right:before {
  content: "";
  white-space: pre-wrap;
border-radius: 55px;
  display: block;
  height: 130px;
  width: px;
  background-image: url(https://cdn.shopify.com/s/files/1/0166/6656/t/333/assets/Head01.gif?v=7693216546048990231);
  background-repeat: no-repeat;
  background-size: 130px;
  background-position-x: center;

}
.contact{
border: solid #ffa1d1 2px;
outline: groove #ff309b 3px;
}

.table-section{
border: solid #ffa1d1 2px;
outline: groove #ff309b 3px;
}
.table-section .heading{
background: -webkit-linear-gradient(#faf2f6,#fffcfe)!important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
border-bottom: dashed #ffc7e4 2.5px;
}
:root {
    --logo-blue: none; 
    --darker-blue: #c42778; 
    --lighter-blue: none; 
    --even-lighter-blue: none;
    --lightest-blue: none;
    --dark-orange: red; 
    --light-orange: none; 
    --even-lighter-orange: none; 
    --green: white;
}
footer{
background: -webkit-linear-gradient(#ffbade, #ff309b)!important;
  -webkit-background-clip: text;
color: white;
border-radius: 100px;
outline: groove #ff309b 3px;
}
table.comments-table{

display: block;
height: 250px!important;
overflow-y: scroll;

}

.table-section{

display: block;
height: 250px!important;
overflow-y: scroll;
}
.online{
content: url(https://cdn.discordapp.com/attachments/1002765210932744333/1099330885255434250/glorormr.png);
}

.blurbs:after{
  content: "";
  white-space: pre-wrap;
border-radius: 55px;
  display: block;
  height: 50px;
  width: px;
  background-image: url(https://64.media.tumblr.com/9a5b6aa5ac419d06ead14c27c94ded79/e4ed25d8fb0ed184-dd/s400x600/2467713aafc8766fcbc06c306059b53c9694f660.gifv);
  background-repeat: no-repeat;
  background-size: 200px;
  background-position-x: center;
}
.friends .heading:before{
content: url


}
.blurbs .heading:before{
content: url(https://64.media.tumblr.com/8217003d2e5348fd2643828394fc0b96/137591622c623e21-d8/s500x750/9d77545cb1ee9b1383a21c932f02fa54654b22e3.gifv);
}
.friends:after{
  content: "";
  white-space: pre-wrap;
border-radius: 55px;
  display: block;
  height: 50px;
  width: px;
  background-image: url(https://64.media.tumblr.com/9a5b6aa5ac419d06ead14c27c94ded79/e4ed25d8fb0ed184-dd/s400x600/2467713aafc8766fcbc06c306059b53c9694f660.gifv);
  background-repeat: no-repeat;
  background-size: 200px;
  background-position-x: center;

 
}


@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
.comments-table img,
.person img{

filter: grayscale(100%) blur(1px);
-webkit-mask-image: url(https://cdn.discordapp.com/attachments/1002765210932744333/1093413057243381800/hart.png);

-webkit-mask-size: 100%;

-webkit-mask-repeat: no-repeat;

-webkit-mask-position: center;

transform:scale(1.025,1.025);

position:relative;

top:-0.25em;

}
.general-about .profile-pic img{

-webkit-mask-image: url(https://cdn.discordapp.com/attachments/1002765210932744333/1093413057243381800/hart.png);

-webkit-mask-size: 100%;

-webkit-mask-repeat: no-repeat;

-webkit-mask-position: center;

transform:scale(1.025,1.025);

position:relative;

top:-0.25em;

}
  .profile{
        
    direction: rtl;
    
    }
    .blurbs{
    
    direction: ltr;
        
    }
    .blog-preview{
        
    direction: ltr;
        
    }
    .friends{
    
    direction: ltr;
        
    }
    .general-info{
        
    direction: ltr;
        
    }
    .contact{
        
    direction: ltr;
    
    }
    .url-info{
        
    direction: ltr;
        
    }
    .details-table{
        
    direction: ltr;
        
    }
    .profile .table-section .heading{
    
    direction: ltr;
        
    }
    .details p{

    direction: ltr;

   }
   .mood{

       direction: ltr;

   
}
.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://pixelbank.neocities.org/decome/hearts/2e2814da.gif")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* Add to Favorites */
content: url("https://pixelbank.neocities.org/decome/hearts/2e2814da.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* Send Message */
content: url("https://pixelbank.neocities.org/decome/swirlys/3d21ef26.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* Forward to Friend */
content: url("https://pixelbank.neocities.org/decome/swirlys/3d21ef26.gif")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* Instant Message */
content: url("https://pixelbank.neocities.org/decome/sweets/f163080.gif")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* Block User */
content: url("https://pixelbank.neocities.org/decome/sweets/f163080.gif")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* Add to Group */
content: url("https://pixelbank.neocities.org/decome/clothing/c25d7d10.gif")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* Report Profile */
content:  url("https://pixelbank.neocities.org/decome/clothing/c25d7d10.gif")
}

img:hover, .friends:hover{
      animation:shake 10s;
      animation-iteration-count:infinite;
filter: none;
}
@keyframes shake{
    0% {
        transform:translate(1px,1px) rotate(0deg);
    }
 
    10% {
        transform:translate(-1px,-2px) rotate(-1deg);
    }
 
    20% {
        transform:translate(-3px,0px) rotate(1deg);
    }
 
    30% {
        transform:translate(3px,2px) rotate(0deg);
    }
 
    40% {
        transform:translate(1px,-1px) rotate(1deg);
    }
 
    50% {
        transform:translate(-1px,2px) rotate(-1deg);
    }
 
    60% {
        transform:translate(-3px,1px) rotate(0deg);
    }
 
    70% {
        transform:translate(3px,1px) rotate(-1deg);
    }
 
    80% {
        transform:translate(-1px,-1px) rotate(1deg);
    }
 
    90% {
        transform:translate(1px,2px) rotate(0deg);
    }
 
    100%
   
}


<style>
.online img {
        content: url(https://creazilla-store.fra1.digitaloceanspaces.com/silhouettes/7971146/hibiscus-flower-silhouette-4bb7ee-md.png);
        height: 2em;
        margin-right: 7px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 2s;
    }
</style>




<style>

.icon {
content: url(https://dl.glitter-graphics.com/pub/1009/1009254cq7evun01h.gif);
display: inline-block;
height: 1.1em;
width: 1.5em;
margin: 0 .05em 0 .1em;
vertical-align: -0.3em;
color: rgba(0,0,0,0);

}

<style>
.online img {
        content: url(https://creazilla-store.fra1.digitaloceanspaces.com/silhouettes/7971146/hibiscus-flower-silhouette-4bb7ee-md.png);
        height: 2em;
        margin-right: 7px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 2s;
    }
</style>


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

</iframe>



    <div class="mobileHide">

        <style>

   .mobileHide { display: inline;}

   /* Smartphone Portrait and Landscape */

   @media only screen

   and (min-device-width : 320px)

   and (max-device-width : 480px){  .mobileHide { display: none;}}

</style>

<div style="">

 <div style="float:  ; &#10;&#10;max-height: 400px; &#10;&#10;position: fixed; &#10;&#10;right:1px; &#10;&#10;bottom: 9px; &#10;&#10;z-index: 600;"><img src="https://dl.glitter-graphics.com/pub/727/727057f5owblcuts.gif" width="300" height="300"/>

</div> 


</div></div>

 <div class="mobileHide">

        <style>

   .mobileHide { display: inline;}

   /* Smartphone Portrait and Landscape */

   @media only screen

   and (min-device-width : 320px)

   and (max-device-width : 480px){  .mobileHide { display: none;}}

</style>

<div style="">

 <div style="float:  ; &#10;&#10;max-height: 400px; &#10;&#10;position: fixed; &#10;&#10;left:1px; &#10;&#10;top: 9px; &#10;&#10;z-index: 600;"><img src="https://dl.glitter-graphics.com/pub/1599/1599772tdznowdr4o.gif" width="300" height="300"/>

</div> 


</div></div>
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.