#test-object input,
#test-object button
{
    font-size: unset;
    padding: 0;
    text-transform: none;
}


#test-object input
{
    line-height: normal;
    min-height: unset;
    border-radius: 0;
    margin: 0;
}
#test-object
{
    line-height: normal;
    max-height: 100vh;
}
@keyframes fade-in
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

@keyframes from-bottom
{
    from
    {
        transform: translateY(500%);
    }
}

@keyframes from-bottom-m
{
    from
    {
        transform: translate(-50%, 500%);
    }
}

@keyframes from-top
{
    from
    {
        transform: translateY(-500%);
    }
}
@keyframes from-top-m
{
    from
    {
        transform: translate(-50%, -500%);
    }
}
@keyframes from-left
{
    from
    {
        transform: translateX(-500%);
    }
}
@keyframes from-left-m
{
    from
    {
        transform: translate(-500%, -50%);
    }
}
@keyframes from-right
{
    from
    {
        transform: translateX(500%);
    }
}
@keyframes from-right-m
{
    from
    {
        transform: translate(500%, -50%);
    }
}
@keyframes from-bottom-left
{
    from
    {
        transform: translate(-500%,500%);
    }   
}
@keyframes from-bottom-right
{
    from
    {
        transform: translate(500%,500%);
    }   
}
@keyframes from-top-left
{
    from
    {
        transform: translate(-500%,-500%);
    }   
}
@keyframes from-top-right
{
    from
    {
        transform: translate(500%,-500%);
    }   
}
#popup
{
    height: 100%;
    position: relative;
    width: 100%;
    z-index: 9999;
}
span.component-settings,
span.component-delete
{
    display: none;
}
#test-object form.component-email-form
{
    display: flex;
    flex-direction: column;
    gap: .5rem;
    font-family: sans-serif;
    font-size: 1.5rem;
    line-height: 1.5rem;
    max-width: 100%;
}
#test-object input[type=email]
{
    border: 1px solid #369;
    padding: .5rem;
    width: 100%;
}
#test-object .component-button button:hover
{
    cursor: pointer;
}
#test-object .component-button button
{
    background-color: #369;
    border: none;
    color: white;
    outline: none;
    padding: .5rem 1rem;
}
#test-object .component-text label
{
    display: none;
}
#test-object { color: black; }
#test-object { z-index: 9998; }
.component-close { z-index: 9999; }
.component-close:hover,
.component-button:hover { cursor: pointer; }

#popup { max-width: 100vw; }

@keyframes bluring
{
    from
    {
        backdrop-filter: unset;
    }
    to
    {
        backdrop-filter: blur(3px);
    }
}
@keyframes shading
{
    from
    {
        background-color: transparent;
    }
    to
    {
        background-color: rgba(0,0,0,.7);
    }
}