YURI AYATO LAYOUT!

-----LAYOUT BY MAGMA(https://spacehey.com/impacter)

/background/

<style>

}

<main {

background-image: url(https://files.catbox.moe/d7vkf2.png);

background-size: 200px;

}

</style>

---

/inner profile blurb thing/

<style>

.profile .blurbs .inner{

background-image: url(https://files.catbox.moe/jkx2nv.png);

background-size: 500px;

}

</style>

---

/music/

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

---

//yuri chibi/

<style>

/*hidden on mobile */

.image {

    background: url('https://files.catbox.moe/ouzirx.png') no-repeat;

    background-size: 100%!important;

    position: fixed;

    right: 0px;

    bottom: 0px;

    height: 320px;

    width: 300px;

    z-index: 1000;

    opacity: 1;

}

@media (max-width: 600px) {

.image{display:none;}

}

</style>

<div class="image"></div>

--

/logo/

<style>

nav img.logo {

content:url("https://files.catbox.moe/2wrzs0.png");

}

</style>

--

/loading/

<style>

body:before {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed; 

top: 0; 

left: 0; 

z-index: 100;

background-image: url('https://media1.tenor.com/m/f_93Rqe5dUQAAAAC/anime-ayato-yuri.gif');

background-size: cover;

background-repeat: no-repeat;

background-position:center;

animation: yourAnimation 2s ease 0s 1 normal forwards;

pointer-events: none;}

@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 

</style>

--

/icons/

<style>

.contact img.icon {

display: none;

}

.contact{background-color: !important;}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a::before{

/* add to friends */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('https://pixelsafari.neocities.org/favicon/fashion/bow/pink14.gif');

background-size: 100% 100%;

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a::before{

/* add to favorites */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('http://i11.photobucket.com/albums/a168/evelynregly/minigifs/mini012.gif');

background-size: 100% 100%;

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before{

/* send message */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('https://pixelsafari.neocities.org/favicon/fashion/bow/pink14.gif');

background-size: 100% 100%;

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before{

/* forward to friend */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('http://i11.photobucket.com/albums/a168/evelynregly/minigifs/mini012.gif');

background-size: 100% 100%;

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before{

/* instant message */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('https://pixelsafari.neocities.org/favicon/fashion/bow/pink14.gif');

background-size: 100% 100%;

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {

/* block user */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('http://i11.photobucket.com/albums/a168/evelynregly/minigifs/mini012.gif');

background-size: 100% 100%;

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {

/* add to group */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('https://pixelsafari.neocities.org/favicon/fashion/bow/pink14.gif');

background-size: 100% 100%;

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {

/* report user */

content: " ";

display: inline-block;

width: 20px;

height: 20px;

background-image: url('http://i11.photobucket.com/albums/a168/evelynregly/minigifs/mini012.gif');

background-size: 100% 100%;

}

--

/inner images thingis idk/

<style>

.profile .friends .heading {

background-image: url(https://files.catbox.moe/s3lver.jpg);

background-size: 500px;

}

.profile .friends .inner {

background-image: url(https://files.catbox.moe/alr9kq.jpg);

background-size: 500px;

}

div.contact {

background-image: url(https://files.catbox.moe/bk9ujd.jpg);

}

.profile .contact .heading {

background-image: url(https://files.catbox.moe/bk9ujd.jpg)

}

.profile .table-section .heading {

background-image: url(https://files.catbox.moe/s3lver.jpg);

}

.details-table td:first-child {

background-image: url(https://files.catbox.moe/s3lver.jpg);

color: ADD HEX CODE HERE;

}

.details-table td {

background: #ffedf745;

}

</style>

--

/backkround in side and outside/

<style>

body {

background-image: url(https://files.catbox.moe/q13i9a.gif);

background-size: 500px;

background-attachment: fixed;

}

main {

background-image: url(https://files.catbox.moe/vvlyus.png);

background-size: 200px;

}

</style>

<!-- ROUNDED BORDERS -->

<style>

    .top{

        border-radius: 25px 25px 0 0 !important;

    }

</style>

<!-- CUSTOM ONLINE NOW -->

<style>

.online {

        content: url("https://pixelsafari.neocities.org/text/welcome7.gif");}</style><

---