main {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        position: sticky;
        height: 30em;
        width: 38em;
        margin: 0;
        padding: 2em;
        background-image: url(../imgs/funct/border.png);
        background-size: 90% 100%;
        background-repeat: no-repeat;
        background-position: center;
        filter: drop-shadow(0px 0px 1px) drop-shadow(0px 0px 1px white) drop-shadow(0px 0px 1px white) drop-shadow(0px 0px 1px white) drop-shadow(0px 0px 1px white) drop-shadow(1px 1px 0px #0000004d);
        text-align: center;
    }

    #mainframe {
        height: 23em;
        width: 25.3em;
        position: relative;
        border: none;
        clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);
        -webkit-mask: 
            linear-gradient(transparent 0%, black 15%, black 85%, transparent 100%),
            linear-gradient(transparent 0%, black 45%, black 55%, transparent 100%) 100% 100% / 100% 120%;
        mask: 
            linear-gradient(transparent 0%, black 15%, black 85%, transparent 100%),
            linear-gradient(transparent 0%, black 45%, black 55%, transparent 100%) 100% 100% / 100% 120%;
    }

    #title {
        height: 4.8em;
        width: 12.5em;
        position: static;
        background-image: url(../imgs/funct/themes/lace/lace_title.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        background-position: center;
        transition: transform 0.5s ease;
    }

    #title:hover {
        transform: translateY(-8%);
        transition: transform 0.5s ease;
    }

    #button {
        width: 7em;
        margin: 0;
    }
    
    #hidden {
        display: flex;
        flex-direction: column;
    }

    #buttontxt {
        display: none;
    }

    textarea {
        height: 3.5em;
        resize: none;
    }