html {
	scroll-behavior: smooth;
	container-type: scroll-state;
  container-name: scroller;
}

.to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	translate: 80px 0;
  transition: all 0.4s ease, border-color 0.4s ease;
}

@container scroller scroll-state(scrollable: top) {
  .to-top {
    translate: 0 0;
  }
}

body {
  background-color: #fff8f0;
  color: #0f1219;
}

a {
	transition: color 0.3s ease;
}

.to-top {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	width: 50px;
	
	background: white;
	border: 4px solid black;
	cursor: pointer;
}

.to-top img {
	width: 30px;
}

.to-top:hover {
	border-color: #e22b30;
}