
.examples {

    label, input, legend {
    display: block;
    font-size: 1.5rem;
    }

    label, legend {
    font-weight: bold;
    margin-bottom: 0;
    text-box-trim: trim-both;
    }
    
    fieldset {
    border-radius: calc(10rem / 16);
    border: calc(1rem / 16) black solid;
    padding: 1rem;
    }
    
    input {
    border: calc(1rem / 16) black solid;
    margin-block-start: .5rem;
    padding: 8px;
    }

    input:not(fieldset input) {
    inline-size: stretch;

        @media(min-width: 26.25rem) {

            inline-size: calc(318rem / 16);

        }

    }

    #phone-formatting {
    margin: 0;
    }
    
    fieldset { 
        
        input {
        display: inline-block;
        margin: .5rem .5rem .5rem 0;
        max-width: calc(100rem / 16);
        }

    }
    
    .float-example {
    position: relative;

        label {
        display: inline-block;
        font-weight: normal;
        inset-block-start: 5px;
        inset-inline-start: calc(10rem / 16);
        line-height: normal;
        position: absolute;
        transition: all .2s ease;
        z-index: 2;
        }
    
        input:focus ~ label, input:valid ~ label {
        background-color: white;
        font-size: .8rem;
        inset-block-start: -9px;
        padding: 0 1rem;
        }

    }

}