Winx Club Believix Layout

Tags: winx club, layout, pink, cute, roxy

Description:

Here is a layout I created based on the Believix transformation from Winx Club from seasons 4 and 5. It's my favorite transformation of them all, with Enchantix being a close second. Also, this layout contains several images of Roxy, the fairy of animals/last fairy on Earth/7th member of the Winx who sadly got demoted from a main character to a side character in season 5 (I will never forgive Nickelodeon for this).

Preview:

click on the image for a larger preview

Code:

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

<style>* {cursor: url(https://cur.cursors-4u.net/toons/too-9/too866.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2009/07/17/winx-rabbit-kiko.html" target="_blank" title="Winx Club -  Rabbit Kiko"><img src="https://cur.cursors-4u.net/cursor.png" alt="Winx Club -  Rabbit Kiko" style="position:absolute; top: 0px; right: 0px;"/></a>

<style>

.logo {

content:url("https://i.ibb.co/WKRbWt8/Frutti-Music-Bar-Winx-Club-Wiki-Fandom-1-removebg-preview.png");

}

</style>


<style>

body{

background-image: url(https://i.ibb.co/v3tHxxJ/Gardenia-Gallery-Winx-Club-Wiki-Fandom.png);
background-color: white;
background-size: 1000px;

}

</style>
<style>

main{

background-color: rgba(255, 255, 255, 0.7);
border: groove #b30059 6px ;
color: #000000;
border-radius: 3px;
font-size: 13px;
 box-shadow: 0px 0px 9px #660033!important;
}

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

.links{
background-image: url(https://i.ibb.co/LtcVGWQ/Frutti-Music-Bar-Winx-Club-Wiki-Fandom-2.png);
background-size: 1000px;
height: 60px;
border-radius: 3px;
margin: 12px!important;
border: solid #cccccc 2px;
outline: groove #666666 3px;

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

.top{

background: -webkit-linear-gradient(#ff0066, #ff99c2)!important;
  -webkit-background-clip: text;
border-radius: 3px;
outline: groove #806600 3px;
}

.blurbs .heading{

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

border: solid #ff3385 2px;
outline: groove #b30047 3px;
}

.friends{

border: solid #ff3385 2px;
outline: groove #b30047 3px;
}

.friends .heading{

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

background: -webkit-linear-gradient(#000000,#b3b3b3)!important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
border-bottom: dashed #b3b3b3 2.5px;
}

.contact{
border: solid #ff3385 2px;
outline: groove #b30047 3px;
}

.table-section{
border: solid #ff3385 2px;
outline: groove #b30047 3px;
}

footer{
background: -webkit-linear-gradient(#ff0066, #ff99c2)!important;
  -webkit-background-clip: text;
color: white;
border-radius: 3px;
outline: groove #993366 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://dl.glitter-graphics.com/pub/121/121891oosf5l2ul7.gif);
}

.blurbs:after{
  content: "";
  white-space: pre-wrap;
border-radius: 4px;
  display: block;
  height: 50px;
  width: px;
  background-image: url(https://dl.glitter-graphics.com/pub/1267/1267661f8oj9z9ku0.gif);
  background-repeat: no-repeat;
  background-size: 200px;
  background-position-x: center;
}

.friends .heading:before{
content: url


}
.blurbs .heading:before{
content: url(https://i.ibb.co/2g74tLC/th-1410801906-removebg-preview.png);
}
.friends:after{
  content: "";
  white-space: pre-wrap;
border-radius: 4px;
  display: block;
  height: 50px;
  width: px;
  background-image: url(https://dl.glitter-graphics.com/pub/1267/1267661f8oj9z9ku0.gif);
  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{


-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://img1.picmix.com/output/stamp/normal/0/1/4/7/607410_d6911.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://i.ibb.co/9VtycZp/th-1004015084-removebg-preview.png")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* Add to Favorites */
content: url("https://i.ibb.co/jzZ5kky/th-1544339798-removebg-preview.png")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* Send Message */
content: url("https://i.ibb.co/nwjQvYr/th-1869924194-removebg-preview.png")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* Forward to Friend */
content: url("https://i.ibb.co/MssYn59/th-3531158158-removebg-preview.png")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* Instant Message */
content: url("https://i.ibb.co/N2cQCrz/th-2961665042-removebg-preview.png")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* Block User */
content: url("https://i.ibb.co/Bsy0x4g/th-50993934-removebg-preview.png")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* Add to Group */
content: url("https://i.ibb.co/c6f5f0P/th-1104782150-removebg-preview.png")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* Report Profile */
content:  url("https://i.ibb.co/r7SsYMF/th-1693013762-removebg-preview.png")
}

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://dl.glitter-graphics.com/pub/2291/2291708xakx0kr763.png);
        height: 2em;
        margin-right: 7px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 2s;
    }
</style>




<style>

.icon {
content: url(https://i.ibb.co/175cRr7/th-3790404506-removebg-preview.png);
display: inline-block;
height: 3.5em;
width: 3.5em;
margin: 0 .05em 0 .1em;
vertical-align: -0.3em;
color: rgba(0,0,0,0);

}

<style>
.online img {
        content: url(https://dl.glitter-graphics.com/pub/2291/2291708xakx0kr763.png);
        height: 2em;
        margin-right: 7px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 2s;
    }
</style>

    <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://i.ibb.co/VT9LBLV/th-3767496886-removebg-preview.png" width="350" height="400"/>

</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;bottom: 9px; &#10;&#10;z-index: 600;"><img src="https://i.ibb.co/S3jg7bN/th-1189296484-removebg-preview.png" width="150" height="250"/>

</div> 


</div></div>  
  


<iframe src="https://www.youtube.com/embed/kE1RaBrqP08?loop=1&autoplay=1&controls=0&start=0&&#x201D;title=" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="&#x201D;&#x201D;" data-ruffle-polyfilled="" width="0" height="0" frameborder="0">
</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.