"im high rn" popup ORIGINAL POPUP CREATED BY WOODLOUSE (AKA NOT ME)

ORIGINAL POPUP LINK: https://layouts.spacehey.com/layout?id=88333

if used, please credit woodlouse, not me as they did all the coding and i just edited it lol

also pls comment if using

THE CODE ITSELF:

<div id="profile">

<ul>

<a href="#profile" id="thex">×</a>

<a href="#profile" id="metoo">me too</a>

<a href="#profile" id="cool">cool</a>

<a href="#profile" id="idc">idc</a>

</ul></div>

<style> 

a {

    text-align:center;

}

#profile {

    position: fixed;

    background-color: transparent;

    z-index: 100;

    top: 0; 

    left: 0;

    width: 100vw;

    height: 100vh;

    padding: 50px 100px;

    font-size: 150%;

    overflow-y: scroll;

    opacity: 1;

    transition: 0.1s;

}

#profile > * {

    width: 100%;

    max-width: 700px!important;

    margin: 20px auto;

    display: block;

}

#profile:target {

    opacity: 0;

    visibility: hidden;

}

#profile > ul {

    position: absolute;

    padding: 0px 0px;

    background-color: white;

    background-image: url("https://file.garden/ZvbWFiE050beWb7z/attention%20im%20high%20rn.jpg");

    height: 120px;

    width: 300px;

    background-size: contain;

    top: 210px;

    left: calc(50% - 150px);

    background-size: 360px;

    background-position: center center;

    border-top-left-radius: 7px;

    border-top-right-radius: 7px;

}

a#thex {

    right: 3px;

    position: absolute;

    top: 4px;

    background-color: #eb4822;

    height: 24px;

    line-height: 17px;

    padding-top: 0px;

    width: 24px;

    font-size: 28px;

    color: white;

    border: 0.5px outset #4e4e4d;

    box-shadow: -0.5px -0.5px 1px inset #000000;

    border-radius: 5px;

    font-family: verdana;

    text-decoration: none!important;

}

a#thex:hover {

    border: 1px black inset;

    text-decoration: none;

    box-shadow: 0.5px 0.5px 1px inset #000000;

    font-style: normal;

}

a#metoo {

    height: 24px;

    display: block;

    bottom: 16px;

    position: absolute;

    left: 28px;

    font-size: 11px;

    font-family: ms ui gothic;

    color: black!important;

    border: black inset 1px;

    background-color: #ece9d8;

    width: 76px;

    line-height: 13px;

    padding: 5px;

    border-radius: 0;

    box-shadow: -0.5px -0.5px 3px inset black;

    font-style: normal;

    text-decoration: none!important;

    font-family: ms ui gothic;

}

a#cool {

height: 24px;

    display: block;

    bottom: 16px;

    position: absolute;

    left: 125px;

    font-size: 11px;

    font-family: ms ui gothic;

    color: black!important;

    border: black inset 1px;

    background-color: #ece9d8;

    width: 60px;

    line-height: 13px;

    padding: 5px;

    border-radius: 0;

    box-shadow: -0.5px -0.5px 3px inset black;

    font-style: normal;

    text-decoration: none!important;

}

a#idc {

    height: 24px;

    display: block;

    bottom: 16px;

    position: absolute;

    right: 33px;

    font-size: 11px;

    font-family: ms ui gothic;

    color: black!important;

    border: black inset 1px;

    background-color: #ece9d8;

    width: 62px;

    line-height: 13px;

    padding: 5px;

    border-radius: 0;

    box-shadow: -0.5px -0.5px 3px inset black;

    font-style: normal;

    text-decoration: none!important;

}

a#metoo:hover {

    text-decoration: none;

    box-shadow: 0.5px 0.5px 3px inset black;

}

a#cool:hover {

    text-decoration: none;

    box-shadow: 0.5px 0.5px 3px inset black;

}

a#idc:hover {

    text-decoration: none;

    box-shadow: 0.5px 0.5px 3px inset black;

}

</style>