#it-widget-ui-buttons {
    display: none !important;
}

#it-widget-ui-gdpr-button {
    display: none !important;
}

#it-widget-ui-languages {
    left: 3% !important;
    right: auto !important;
    bottom: 2% !important;
}

#it-widget-ui-gdpr {
    right: 3% !important;
    left: auto !important;
    bottom: 2% !important;
}

.it-widget-ui-bottom-button-size-by-width img {
    height: calc(5vw / 0.5625) !important;
    /* why is this the only way I can get it to not be squashed? */
}

.it-widget-ui-bottom-button-size-by-height img {
    height: 5vh !important;
    /* why is this the only way I can get it to not be squashed? */
}

.it-widget-ui-bottom-button-size-by-width span {
    display: none;
}

.it-widget-ui-bottom-button-size-by-height span {
    display: none;
}

#it-widget-ui-qrcode, #it-widget-ui-video, #it-widget-ui-image {
    bottom: 8% !important;
}

/* hide kioskUI's status display */
#it-widget-status {
    display: none !important;
}

#make-call-div {
    display: flex;
    flex-direction: column;
    width: 100vw;
    height: 100vh;
    background-color: black;
    align-items: center;
}

#make-call-portrait {
    height: 30%;
    border-radius: 50%;
    content: url("portrait.png");
    margin: 10vh 0vh 5vh 0vh;
}

#make-call-div p {
    color: white;
    /* text-align: center; */
}

#make-call-btn {
    width: 15vh;
    height: auto;
    object-fit: contain;
    background: none;
    border: none;
}

#make-call-btn img {
    width: 100%;
    height: 100%;
}

audio {
    display: none;
}