@page {
    size: 8.5in,11in;
}


@media (min-width: 701px) {

    .desktop-ml30 {
        margin-left: 30px;
    }

    .desktop-floatleft {
        float: left;
    }

    .referredby {
        width:800px;
    }

    .referredbydetail {
        margin-top: 6px;
        margin-left: 4px;
        width: 400px;
    }

    .desktop-floatright {
        float: right;
    }

    .desktop-width360 {
        width: 450px;
    }

    .desktop-width850 {
        width: 850px;
    }


    .desktop-width950 {
        width: 950px;
    }

    .formclass {
        width: 100%;
        max-width: 950px;
        margin-left: 15px;
        margin-right: 15px;
        font-family: system-ui;
    }

    .understandings {
        width:800px;
    }

    label {
        text-align: right;
        width:145px;
    }

    .rjlabelcontainer {
        min-width: 16px;
        display: inline-block;
        text-align: right;
    }

    .firstlast {
        width: 150px;
    }

    .city {
        margin-top:6px;
        width: 206px;
        padding-right:6px;
    }

    .mw52pct {
        max-width: 52%;
    }

    .state {
        width: 30px;
    }

    .zip {
        width: 55px
    }
    .street {
        width: 309px;
    }
    .acks {
        width: 97%;
    }

    .consent-ack-signature {
        width: 700px !important;
    }

    input[type="submit"] {
        width: 195px;
        margin-right:5px
    }
}

form {
    max-width: 100%;
    margin: 0 auto;
}


input[type="submit"] {
    background-color: #4caf50;
    color: white;
    cursor: pointer;
}

input[type="submit"]:hover {
    background-color: #45a049;
}


input[type="button"].cancel {
    background-color: #dd9393;
    color: white;
    cursor: pointer;
    width: 195px;
    margin-right: 5px
}

input[type="button"].cancel:hover {
    background-color: #aa6161;
}

label {
    font-weight: 600;
    margin-top: 10px;
    margin-right: 7px;

}

@media print {
    
    article {
        min-width: 1200px !important;
        width: 1200px !important;
    }
}


@media (max-width: 700px ){

    body {
        font-family: Arial, sans-serif;
        margin: 20px;
    }

    .rjlabelcontainer {
        display: block;
    }
    label {
        display: block;
    }

    input,
    textarea {
        width: 100%;
        padding: 8px;
        margin-top: 5px;
        margin-bottom: 10px;
        box-sizing: border-box;
    }

    .phone-pleft {
        padding-left: 8%;
    }

    .floaters {
        clear: both;
        display: block;
    }


    .formclass {
        font-family: system-ui;
    }

    input[type="date"] {
        width: 98%;
    }

    input[type="text"] {
        width: 98%;
    }

    input[type="tel"] {
        width: 98%;
    }

    input[type="checkbox"] {
        width: auto !important;
    }

    .hide-for-phone {
        display: none;
    }

    .street {
        width: 100%;
    }

    .city {
        width: 50% !important;
        padding-right: 6px;
    }

    .phone-w98 {
        width: 98%;
    }

    .referredby {
        padding-right: 8px;
    }

    .referredbydetail {
        width: 98% !important;
        
    }

    .state {
        width: 15% !important;
    }

    .zip {
        width: 30% !important;
    }

    .consent-ack-signature {
        width: 100% !important;
    }
}


.human-body {
    width: 100px;
    position: relative;
    height: 268px;
    display: block;
    margin: 20px ;
}

.human-body svg:hover {
    cursor: pointer;
}

.human-body svg path[data-selected="false"]:hover {
        fill: #aaaaaa;
    }


.human-body svg {
    position: absolute;
    left: 50%;
}

path[data-selected="true"] {
    fill: red;
}

#area #data  {
    fill: #000;
}

/* Chrome, Safari, Edge, Opera */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* Firefox */
input[type="number"] {
    -moz-appearance: textfield;
}


.svgbox {
    width: 260px; 
    height: 280px;
}