.rav {
    background-color: var(--accent) !important;
    color: white !important;
}

#amdi div div div {
    background-color: white;
    border-style: solid;
    border-width: 1px;
    border-color: #9e9e9e;
    border-radius: 30px;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


    #amdi div div div sup {
        margin-bottom: 9px;
    }



.view04 {
    width: 100%;
    color: gray;
    height: auto;
    font-size: 85%;
    border-color: #ababab;
    border-top: none;
    border-left: none;
    border-right: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    align-content: flex-end;
    max-height: 25px;
    min-height: 25px;
}

.screen {
    width: 100%;
    border-width: 1.3px;
    height: 60px;
    border-style: solid;
    font-size: 110%;
    border-color: #ababab;
    border: none;
    padding: 5px;
    align-items: center;
    align-content: flex-end;
    min-height: 50px;
    max-width: 100%;
    word-break: break-word;
    overflow-y: auto;
    margin-bottom: 0;
    line-height: 20px;
    text-align: end;
}

.screen2 {
    width: 100%;
    color: gray;
    border-width: 1.3px;
    height: auto;
    border-style: solid;
    margin-bottom: 8px;
    font-size: 85%;
    border-color: #ababab;
    border-top: none;
    border-left: none;
    border-right: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    padding: 5px;
    align-items: center;
    align-content: flex-end;
    max-height: 25px;
    min-height: 25px;
}

.screen3 {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    height: 25px;
}

.treg_on {
    border: none !important;
    color: black !important;
    padding: 0 !important;
    padding-left: 4px !important;
    height: 23px !important;
    margin: 0 !important
}

.treg_off {
    border: none !important;
    color: lightgray !important;
    padding: 0 !important;
    padding-left: 4px !important;
    height: 23px !important;
    margin: 0 !important
}

.screen sup {
}

#amdi {
    border-width: 1px !important;
    border-radius: 13px !important;
    border: 10px solid rgb(221 221 221) !important;
}


@media (min-width: 300px) {
    #amdi {
        display: flex;
        border-style: solid;
        padding: 7px;
        border-width: 1px;
        border-radius: 2px;
        align-content: center;
        flex-wrap: wrap;
        text-align: center;
        justify-content: space-evenly;
        width: 320px;
        max-width: 320px;
        align-items: center;
        font-weight: 500;
        font-size: 110%;
    }

        #amdi div div div {
            margin: 2px;
            width: 37px;
            height: 34px;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 0px;
            cursor: pointer;
            user-select: none;
            font-size: 70%;
        }

    #amdi div div {
        flex-direction: row;
        max-width: 52px;
    }

    .div_btn_holder {
        flex-direction: unset;
        display: flex;
        padding-bottom: 0;
        width: 100%;
        justify-content: space-evenly;
    }

    .dot {
        font-size: 100%;
    }

    .comma {
        font-size: 100%;
    }

    .strel {
        font-size: 100%;
    }
}

@media (min-width: 400px) {
    #amdi {
        width: 370px;
        max-width: 370px;
    }

        #amdi div div div {
            width: 43px;
            height: 40px;
        }

        #amdi div div {
            max-width: 54px;
        }


    .dot {
        font-size: 110% !important;
    }

    .comma {
        font-size: 110% !important;
    }

    .strel {
        font-size: 110% !important;
    }
}

@media (min-width: 450px) {
    #amdi {
        width: 387px;
        max-width: 387px;
    }

        #amdi div div div {
            
        }

        #amdi div div {
            max-width: 56px;
        }


    .dot {
        font-size: 110% !important;
    }

    .comma {
        font-size: 110% !important;
    }

    .strel {
        font-size: 110% !important;
    }
}

@media (min-width: 500px) {
    #amdi {
        width: 458px;
        max-width: 458px;
        font-size: 100%;
    }

        #amdi div div div {           
            font-size: 90%;
            padding: 5px;            
        }

        #amdi div div {
            max-width: 66px;
        }


    .dot {
        font-size: 110% !important;
    }

    .comma {
        font-size: 110% !important;
    }

    .strel {
        font-size: 110% !important;
    }
}

@media (min-width: 600px) {
    #amdi {
        width: 555px;
        max-width: 555px;
        font-size: 100%;
    }

        #amdi div div div {           
            font-size: 100%;
            padding: 10px;          
        }

        #amdi div div {
            max-width: 79px;
        }


    .dot {
        font-size: 110% !important;
    }

    .comma {
        font-size: 110% !important;
    }

    .strel {
        font-size: 110% !important;
    }
}



@media (min-width: 700px) {
    #amdi {
        display: flex;
        border-width: 1px;
        border-radius: 13px;
        align-content: center;
        flex-wrap: wrap;
        text-align: center;
        justify-content: space-evenly;
        width: 655px;
        max-width: 655px;
        align-items: center;
        font-weight: 500;
        font-size: 110%;
        border: 10px solid rgb(221 221 221);
    }

    .div_btn_holder {
        flex-direction: column;
        display: contents;
    }

    #amdi div div {
        flex-direction: row;
    }

        #amdi div div div {
            margin: 10px;           
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 3px;
            cursor: pointer;
            user-select: none;
        }

    .dot {
        font-size: 120% !important;
    }

    .comma {
        font-size: 120% !important;
    }

    .strel {
        font-size: 120% !important;
    }
}