.totop { display: inline-flex; background-color: {{ .Site.Params.color.primary }}; color: #f2f2f2; width: 50px; height: 50px; align-items: center; justify-content: center; border-radius: 50%; margin: 30px; position: fixed; bottom: 0px; right: 0px; transition: background-color .3s; z-index: 1000; } .show { visibility: visible; opacity: 1; } .hide { visibility: hidden; opacity: 0; } @media screen and (min-width: 600px) { .totop:hover { cursor: pointer; background-color: black; } }