Spaceoddity

.wrapper{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.fixed{
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
}
.fixed-content{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

Но во-первых откуда данные о размере пикселя камеры

media only screen and (max-width: 1216px) {

.content{
text-align: center;

position: relative;
margin: 0 auto;
}

.content_block {
text-align: left;

position: relative;
max-width: 1200px;
width: 295px;
height: 200px;
border: solid 1px;
display: inline-block;
padding-bottom: 50px;
margin: 0 auto;
margin-top: 40px;

background-color: #FFE475;
}
//...

<button type="button" class="btn focus-btn active" data-timer-val="5">Focus</button>
<button type="button" class="btn short-break-btn" data-timer-val="25">Short Break</button>
<button type="button" class="btn long-break-btn" data-timer-val="45">Long Break</button>

let startingMinutes = document.querySelector(".btn.active").dataset.timerVal;
//...
function highlightTab(event) {
    for (i = 0; i < buttons.length; i++) {
        buttons[i].className = buttons[i].className.replace(' active', '');
    }

    event.currentTarget.className += ' active';
    startingMinutes = event.currentTarget.dataset.timerVal;
}