#chatbots-available{ height: 32px; align-self: end; margin-right: 10px; position: absolute; right: 0; } #users-traffic-stat{ position: relative; width: 100%; height: calc(50vh - 36.5px); margin-bottom: 12px; } #users-traffic-stat canvas{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; } .overlay{ background: black; } #receipts-stat{ position: relative; width: 60%; height: calc(50vh - 56.5px); margin-right: 6px; } #receipts-stat canvas{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; } #tendency-stat{ position: relative; width: 40%; height: calc(50vh - 56.5px); margin-left: 6px; } #tendency-stat canvas{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; } #global-filters, #sfilters{ position: relative; padding: 8px 0; display: flex; justify-content: center; } /*#global-filters .filter{ display: none; }*/ #nodata{ display: none; padding: 10px 0; } #global-filters .filter:nth-of-type(n+2){ margin-left: 12px; } .filter select{ height: 30px; } #view-stats{ padding: 0 5%; } @media all and (max-width: 800px) { #chatbots-available{ position: static !important; } #global-filters, #sfilters{ padding: 8px 0 0 0 !important; } #view-stats .flex{ flex-wrap: wrap-reverse; justify-content: center; } #tendency-stat{ width: 100%; margin-left: 0px; } #receipts-stat{ width: 100%; margin-right: 0px; margin-top: 10px; } }