src/app.css - main - func/funcfolio

@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --scale: 0.05vw;
  --skyblue: #ADF0FF;
  --blue: #A3D1FF;
  --bluefrost: #B8BFFF;
  --yellow: #FFD4AD;
  --purpur: #DFABFF;
  --pink: #FFB2DC;
  --coral: #FFBEBE;
  --green: #C7FFBE;
}

html {
  font-size: var(--scale);
  line-height: 1;
}

@media only screen and (max-width: 1024px) {
  :root {
    --scale: 0.0935vw;
  }
}

.project-item {
  transition: 0.1s cubic-bezier(1,-.27,0,1.58);
  box-shadow: 0rem 0rem 0rem 0rem;
}

.project-item:hover {
  box-shadow: 0rem 0rem 0rem 22rem;
}

.project-item:active {
  box-shadow: 0rem 0rem 0rem 28rem;
}

.link-item {
  transition: 0.1s cubic-bezier(1,-.27,0,1.58);
  box-shadow: 0rem 0rem 0rem 0rem;
}

.link-item:hover {
  box-shadow: 0rem 0rem 0rem 4rem;
}

.link-item:active {
  box-shadow: 0rem 0rem 0rem 8rem;
}

.bg-avatar {
  background-image: url('./lib/images/avatar.png');
}