body { font-family: Arial, Helvetica, sans-serif; color: white; } ul { list-style: none; margin: 0; padding: 0; } * { scrollbar-width: thin; scrollbar-color: hsl(220, 10%, 32%) hsl(220, 10%, 17%); } ::-webkit-scrollbar-corner { background: rgb(30, 30, 30); } ::-webkit-scrollbar-thumb { background-color: rgb(73, 73, 73); border-radius: 4px; } ::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-track { background: rgb(30, 30, 30); } .scroll-container { position: absolute; top: 0; position: -webkit-sticky; /* Safari */ position: sticky; } button { position: absolute; top: 0; right: 0; background-color: #34495e; border: none; color: white; padding: 8px 18px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer; border-radius: 6px; } .checkbox-container { position: absolute; top: 0; position: -webkit-sticky; /* Safari */ position: sticky; color: #fff; } .checkbox-container .checkbox-container-inside { position: absolute; top: 110px; right: 0; } input[type="checkbox" i] { background-color: initial; cursor: pointer; appearance: auto; box-sizing: border-box; margin: 3px 3px 3px 4px; padding: initial; border: initial; color: rgb(55, 142, 240); } .viewers-container { position: absolute; top: 0; position: -webkit-sticky; /* Safari */ position: sticky; color: #fff; } .viewers-container span { position: absolute; top: 85px; right: 0; } .connection-status-container { position: absolute; top: 0; position: -webkit-sticky; /* Safari */ position: sticky; color: #fff; } #connection-status { position: absolute; top: 10px; right: 150px; height: 20px; width: 20px; background-color: gray; border-radius: 50%; display: inline-block; } .actions-container { position: absolute; top: 0; position: -webkit-sticky; /* Safari */ position: sticky; } #btn-clear-console { top: 40px; right: 70px; } #btn-add-line { top: 40px; }