.page { position: relative; height: calc(100vh - 50px); /* max-height: -webkit-fill-available; */ flex: auto; background-color: #000; color: #bababb; overflow-y: scroll; text-align: center; padding-bottom: 114px; } .result-container__values { display: flex; flex-direction: column; gap: 8px; max-width: 250px; margin: 0 auto; } .result-container__value { display: flex; justify-content: space-between; } .result-container__value-label { color: #fff; font-weight: 500; } .result-container__value-value { font-weight: 500; } .result-container__text { line-height: 1.2; margin-top: 32px; } .button { position: fixed; font-weight: 500; border: none; bottom: 24px; width: calc(100% - 64px); max-width: 496px; border-radius: 32px; padding: 24px 0; background: -moz-linear-gradient(to bottom, #01d400, #196e17); background: -webkit-linear-gradient(to bottom, #01d400, #196e17); background: linear-gradient(to bottom, #01d400, #196e17); color: #fff; } .button-red { padding: 12px 0; background: -moz-linear-gradient(to bottom, #FF003D, #6B174A); background: -webkit-linear-gradient(to bottom, #FF003D, #6B174A); background: linear-gradient(to bottom, #FF003D, #6B174A); } .cross { position: absolute; top: 24px; right: 24px; width: 24px; height: 24px; border: solid 2px #bdbdbd; border-radius: 100%; rotate: 45deg; cursor: pointer; } .cross::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 10px; height: 2px; background-color: #bdbdbd; } .cross::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 2px; height: 10px; background-color: #bdbdbd; }