.mybody {
    font-family: Arial;
    /*font-size: clamp(1rem, 1.5vw, 3rem);*/
    font-size: clamp(1rem, 0.3056rem + 1.3889vw, 3.5rem);
    /* color: white; */
}

.txt-sm {
    font-size: small;
    margin-left: 5px;
}

.txt-xs {
    font-size: smaller;
}

.txt-edit {
    font-size: larger;
    font-weight: bold;
    background-color: beige;
}

.txt-important {
    font-size: larger;
    font-weight: bold;
}

.txt-warning {
    font-weight: bold;
    color: red;
    background-color: beige;
}

.as-btn
{
    cursor: pointer;
}

.nodispl {
    display: none;
}

.ic-milk {
    background-color: beige;
    white-space: nowrap;
}

.ic-fruit {
    background-color: rgb(203, 242, 203);
    white-space: nowrap;
}

.ic-special {
    background-color: rgb(237, 174, 174);
    white-space: nowrap;
}

.ic-sugarfree {
    background-color: rgb(198, 228, 239);
    white-space: nowrap;
}
.myshowbox {
    margin: 10px;
    min-width: 100px;
    min-height: 100px;
    border: 2px solid blue;
}

.myshowbox2 {
    margin: 5px;
    border: 1px solid rgb(96, 96, 197);
}

.myshowbox3 {
    padding: 5px;
    border: 1px solid rgb(96, 96, 197);
    display: inline-flex;
}

.myitem {
    margin-left: 10px;
    margin-right: 10px;
}

.myitem2 {
    padding: 5px;
}

.myflex {
    display: flex;
}

.mybox {
    display: contents;
}

.mymargin {
    margin: 10px;
}

.mymargin1 {
    margin: 10px;
    padding-left: 4px;
    padding-right: 4px;
}

.myfullwidth {
    width: 100%;
}

.mybg1 {
    background-color: lightgray;
}

.myborder1 {
    border: 1px solid darkblue;
}

.mybg2 {
    background-color: rgb(152, 151, 151);
}

.myframe1 {
    padding: 5px;
    position: relative;
    border: 2px solid darkblue;
    border-radius: 5px;
    min-height: 10px;
}

.top-text {
    font-size: 0.7rem;
    width: fit-content;
    position: absolute;
    top: -10px;
    /* Adjust as needed to position the text properly */
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    /* Example background color */
    padding: 0 10px;
    /* Adjust as needed for padding */
}

hr.myhrline {
    margin: 10px;
}

.td-edit {
    border: 2px solid lightblue;
    border-radius: 2px;
}

.split {
    height: 100%;
    width: 50%;
    position: fixed;
    z-index: 1;
    top: 0;
    overflow-x: hidden;
    /* padding-top: 20px; */
    padding: 10px;
}

.left {
    left: 0;
    background-color: rgb(8, 11, 187);
}

.right {
    right: 0;
    background-color: rgb(20, 106, 5);
}

.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.centered img {
    width: 150px;
    border-radius: 50%;
}

.td-fit {
    width:1%;
    white-space: nowrap;
}
.my-bold{
    font-weight: bold;
}

.my-left {
    text-align: left;
}

.my-right {
    text-align: right;
}

.my-center {
    text-align: center;
}