/*=============== FOOTER ===============*/
.footer{
  background: #222;
  color: #fff;
  margin-top: auto;
  width: 100%;
  display: flex;
  justify-content: center;
}

.footer__container{
  padding-block: 3rem 2rem;
  row-gap: 2.5rem;
}

.footer__links{
  display: flex;
  justify-content: center;
  column-gap: 2rem;
}
.footer__link{
  color: #ff9800;
  transition: color .2s;
}

.footer__link:hover{
  color: #fff;
}

.footer__copy{
  color: #bbb;
  font-size: var(--small-font-size);
  text-align: center;
}

.footer__copy a{
  color: var(--white-color);
  font-weight: var(--font-medium);
}

/*=============== SCROLL BAR ===============*/
::-webkit-scrollbar{
  width: .6rem;
  border-radius: .6rem;
  background-color: hsla(0 ,0% ,63%);
}
::-webkit-scrollbar-thumb{
  border-radius: .5rem;
  background-color: hsla(0 ,0% ,55%);
}

/*=============== SCROLL UP ===============*/
.scrollup{
  position: fixed;
  right: 1rem;
  bottom: -50%;
  display: inline-flex;
  padding: 8px;
  font-size: 1.25rem;
  color: var(--white-color);
  z-index: var(--z-tooltip);
  transition: bottom .4s transform .4s ,background-color .4s;
}

.scrollup:hover{
  transform: translateY(-5rem);
}

/* Show Scroll Up */
.show-scroll{
  opacity: 1;
  bottom: 3rem;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}