soupghosts's profile picture

Published by

published
updated

Category: Web, HTML, Tech

Omori layout:3

<style>

body:before {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed;

top: 0;

left: 0;

z-index: 100;

background-image: url('https://www.icegif.com/wp-content/uploads/2022/07/icegif-937.gif');

background-size: cover;

background-repeat: no-repeat;

background-position: center center;

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

pointer-events: none;

}

@keyframes yourAnimation { 0.0% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; } </style>



<style>


body{ background-image: );

background-image:url(https://i.redd.it/98y002ff6sf81.gif);

Background-size: 100%;

}


body::after {

 content: "";

   background:  url('https://i.imgur.com/9DCsiKm.png');

  position: absolute;

  white-space: pre;

background-size: 100%;

}


main:before {

      background-image: url(https://cdn2.steamgriddb.com/file/sgdb-cdn/hero_thumb/d6d7f563c6ce9c976832bca992a70102.jpg);

      background-position: center center;

      background-size: 150%;

display: block;

content: "";

    width: 100%;

    height: 150px;

    border-radius: 10px;

    margin-bottom: 10px;

    margin-left: 8px;

filter: grayscale(40%); 

  }


.row {

    width: 100%;

    display: table;

    table-layout: fixed;

    background-color: #0f011ba8;

}


.general-about .details {

width: 300px;}


.profile .table-section, .profile .contact{

    margin-top: 20px;

}


footer {

margin: 1em;

position: relative;

}


main .right {

    width: 300px;

    background-color: #white;

}


.profile .contact, .profile .url-info, .profile .table-section, .home-actions {

    margin-top: 20px;

    border: 2px solid #e7c9ecff;

}


a{color: #e7c9ecff;}






.col.w-40 {

    width: 43%;

}


nav .links {

    background-color: #21013d94; top bottom color

}


.comments-table td:first-child, .music-table td:first-child {

    background-image: url(https://cdn.discordapp.com/attachments/812136634413613107/1123744370114437220/going_to_deeper_well.jpg);

    text-align: center;

    font-weight: bold;

    width: 38%;

    background-size: cover;

}


nav .top {

    background: #4c0f5c8b; top color

    color: black;

}


main {

    background:#ffffff00;

    color: #673084ff;

}


.profile .blurbs .section h4 {

    color: #921fa6ff; about me color

}


.count {

    color: #3076e2;}


nav{

    font-size: 100%;

  font-family: 'Splash';}


.profile .blurbs .heading, .profile .friends .heading {

    background:#21013d94;

    color: #edc886;

}


.details-table td {

    background: #4c0f5c8b; intrests right box

    vertical-align: top;

    color: #e7c9ecff;

}


.details-table td:first-child {

    background: #21013d94; intrests left box

    color: #e7c9ecff;

}



.profile .contact, .profile .url-info, .profile .table-section, .home-actions {

    margin-top: 20px;

}


.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {

    background: #21013d94; contacting

    color: #e7c9ecff;

    padding: 2px 7px;

}


.profile .mood {

    margin-top: 20px;

}


div. mood{     border: 2px solid #f0d373;}




 .mood {

    margin-bottom: 20px;

}


main {

    font-size: 95%;

   font-family: 'Roboto Condensed';

}



.url-info{

    background: url("https://cdn.discordapp.com/attachments/812136634413613107/1123498416534728714/tumblr_580a5a203aa884488c72ade21acbd091_7869d13d_1280.gif"); omori and mewo    background-position: center;

    background-size: cover;

    border: var(--borders)!important;

    border-radius: var(--curve);

    height: 120px;

color: #e7c9ecff;

filter: grayscale(50%);

}



.comments-table td {

    color: White;

background-image: url(https://cdn.discordapp.com/attachments/812136634413613107/1123744369745350726/something_omori.jfif); right side of comments table

background-size: cover;

}


.comments-table td:first-child img:not(.icon) {

    visibility: hidden;

}


.comment-replies {

    padding: 0 5px;

    border: 1.7px solid #e7c9ecff;

}





 


     .online {

        content: url("https://cdn.discordapp.com/attachments/812136634413613107/1123503081162813500/20230627_233959.gif");

  content-position: center;

   width: 95px; }


}



@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); }

}





.icon, .award img {

    visibility: hidden;

}


/* contact icons */

.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: "⟡";

}

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

/* add to favorite */

content: "☆"

}

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

/* send a message */

content: "☆"

}

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

/* foward to friend*/

content: "⟡"

}

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

/* instant message */

content: "⟡"

}

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

/* block user */

content: "☆"

}

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

/* add 2 group  */

content: "☆"

}

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

/* report */

content: "⟡"

}



main {

    border-radius: 10px;

    margin-top: 8px;

}


footer {

    background: #ffffff00;

color:White;

}



nav::before {

   content: "";

   background:  url(https://cdn.discordapp.com/attachments/812136634413613107/1123492726944579654/Snow_Angel_28Neutral29.gif);

background-size: 240px;

    position: fixed;

    float: right;

    display: inline;

    bottom: 0;

    right: 10px;

    height: 196px;

    width: 195px;

    margin-bottom: 1px;

    margin-right: 1px;

}




</style>






<style>


.col, main, footer, nav .links, nav .top, html::before {

animation: float 3s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

@keyframes float {

0% { transform: translate(0, 0px);

}

50% {

transform: translate(0, 8px);

}

100% {

transform: translate(0, -0px);

}


}



</style>




<style>* {cursor: url(https://cur.cursors-4u.net/nature/nat-6/nat509.cur), auto !important;}</style>

<style>* {cursor: url(https://cur.cursors-4u.net/others/oth-8/oth702.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2011/11/29/knife-7.html" target="_blank" title="Knife"><img src="https://cur.cursors-4u.net/cursor.png" alt="Knife" style="position:absolute; top: 0px; right: 0px;"/></a>


<style>

</style>


<style>


.logo {


content:url("https://cdn.discordapp.com/attachments/812136634413613107/1123730602559033474/Untitled161_20230628143922.png");


}


</style>




<style>

body:before {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed;

top: 0;

left: 0;

z-index: 100;

background-image: url(https://www.icegif.com/wp-content/uploads/2022/07/icegif-937.gif);

background-size: cover;

background-repeat: no-repeat;

background-position: center center;

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

pointer-events: none;

}

@keyframes yourAnimation { 0.0% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; } </style>





<style>

::-webkit-scrollbar {

width: 16px

}


::-webkit-scrollbar:horizontal {

height: 17px

}


::-webkit-scrollbar-corner {

background: #380E54

}


::-webkit-scrollbar-track:vertical {

background: linear-gradient(90deg, #3a1b5eeb, #3a1b5eeb 20%)

}


::-webkit-scrollbar-track:horizontal {

background: linear-gradient(180deg, #541b5eeb, #672073f2 20%)

}


::-webkit-scrollbar-thumb {

border: 1.5px solid #888;

border-radius: 3px;

box-shadow: inset 0 -1px 1px #fff, inset 0 1px 1px #fff;

background-color: #380E54;

}


::-webkit-scrollbar-thumb:vertical {

background: url("https://cdn.discordapp.com/attachments/812136634413613107/1124435934071505016/Untitled205_20230630132649.png") no-repeat 50%, linear-gradient(90deg, #380E54 45%, #380E54 0, #380E54)

}


::-webkit-scrollbar-thumb:horizontal {

background: url("https://cdn.discordapp.com/attachments/812136634413613107/1124429455906058280/Untitled203_20230630130055.png") no-repeat 50%, linear-gradient(180deg, #380E54 45%, #380E54 0, #380E54)

}


::-webkit-scrollbar-button:horizontal:end:increment,

::-webkit-scrollbar-button:horizontal:start:decrement,

::-webkit-scrollbar-button:vertical:end:increment,

::-webkit-scrollbar-button:vertical:start:decrement {

display: block

}


::-webkit-scrollbar-button:vertical {

height: 17px

}


::-webkit-scrollbar-button:vertical:start:decrement {

background: white;

background-image: url("https://cdn.discordapp.com/attachments/812136634413613107/1124425539621499050/Untitled201_20230630124250.png");

background-repeat: no-repeat;

background-position: center;

-moz-background-size: cover;

-webkit-background-size: cover;

-o-background-size: cover;

background-size: cover;

}


::-webkit-scrollbar-button:vertical:start:increment {

display: none;

}


::-webkit-scrollbar-button:vertical:end:decrement {

display: none;

}


::-webkit-scrollbar-button:vertical:end:increment {

background: white;

background-image: url("https://cdn.discordapp.com/attachments/812136634413613107/1124425539264970762/Untitled200_20230630124212.png");

background-repeat: no-repeat;

background-position: center;

-moz-background-size: cover;

-webkit-background-size: cover;

-o-background-size: cover;

background-size: cover;

}


</style>


<style>

:root {

--polaroid-name: "Zill✩"; /* name displayed on polaroid */

--name-size: 1.6em; /* font size of name */

--toggle-displayname: none; /* change this to "initial" to restore display name */

}

@font-face {

font-family: 'teabeer';

src: url('https://fluorescent-lights.neocities.org/teabeer.ttf') format('truetype');

}

.profile h1 {

display: var(--toggle-displayname);

}

.general-about .profile-pic {

position: relative;

filter: drop-shadow(0 0 0.25rem gray);

transform: rotate(4deg);

margin: 0 20px 8px -5px;

transition: transform .5s;

}

.general-about .profile-pic:hover {

transform: scale(1.2) rotate(-3deg);

}

.general-about .profile-pic:before {

content: var(--polaroid-name);

font-family: 'teabeer';

font-size: var(--name-size);

position: absolute;

z-index: 2;

bottom: -30px;

left: 0px;

width: 100%;

text-align: center;

}

.general-about .profile-pic:after {

content: "";

background: url('https://fluorescent-lights.neocities.org/polaroid.png');

position: absolute;

background-size: contain;

background-repeat: no-repeat;

top: -5px;

left: -5px;

width: 170px;

height: 210px;

}

.mood {

margin-top: 50px;

}

</style>


<style>


.friends:not(.friends#comments) > .inner {

    position: relative;

    top: 3px;

}

.friends-grid {

    height: 140px;

    overflow-y: scroll;

    display: flex;

    justify-content: space-evenly;

    flex-wrap: wrap;

}

.profile .friends .person {

    position: relative;

}

.profile .friends .person a:not(a:first-child) {

    border: solid white;

    border-width: 5px 5px 25px;

    box-shadow: 3px 3px 5px #515151;

    width: 150px;

    display: table-cell;

}

.profile .friends .person a:first-child p {

    position: absolute;

    top: 100px;

}

.profile .friends .person img:not(.icon) {

    width: 95px;

    height: 95px;




</style>



put in who id like to meet


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

.profile .friends .person img:not(.icon):hover {

    transform: scale(1.2);

    transition: 0.5s ease;

}

.profile .friends .person img:not(.icon) {

    transition: 0.5s ease

}

</style>



<iframe width="560" height="315" src="https://www.youtube.com/embed/mifHo9fC5QI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=""></iframe>



0 Kudos

Comments

Displaying 0 of 0 comments ( View all | Add Comment )