@import "bootstrap/scss/bootstrap"
@import "variables"

root
  --bs-primary: #{$dark-blue_500}
  --bs-secondary: #{$dark-blue_400}

body
  font-family: 'Poppins', sans-serif
  background-color: white
  .blur
    width: 30em
    height: 30em
    position: fixed
    border-radius: 50%
    box-shadow: 15em 15em 30em 1em rgba($dark-blue_500, 0.3)
    transform: translateX(-100%) translateY(-100%)
    -ms-transform: translateX(-100%) translateY(-100%)
  .blur.top-left
    top: 0
    left: 0
  .blur.bottom-right
    right: 0
    bottom: 0
    transform: translateX(100%) translateY(100%) rotate(180deg)
    -ms-transform: translateX(-100%) translateY(-100%) rotate(180deg)

main
  margin-top: 144px