/* ************************************************************************** */
/* *  Variables                                                             * */
/* ************************************************************************** */

@media screen and (orientation: landscape) {
  :root {
    --item-border-radius: 1vh;
    --item-border-width: 2px;
  }
}

@media screen and (orientation: portrait) {
  :root {
    --item-border-radius: 1vw;
    --item-border-width: 2px;
  }
}

/* Global font settings and background */
body {
    font-family: Segoe UI, Verdana, sans-serif;
    font-size: 12px;
    background-color: lightsteelblue;
    margin: 0px;
}

/* Centered desktop area */
.contentDesktop {
    margin: auto;
    max-width: 1000px;
    min-width: 400px;
  }


/* White box with rounded edges, content container */
.contentArea {
    margin: 8px 4px;
    background-color: white;
    border-radius: 10px;
    padding: 10px;
}

/* Chart canvas */
canvas {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.disableTextSelect {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}