:root {
    --fbg: hsl(0, 0%, 60%);
    --bd: grey;
    --bg: background-color: whitesmoke;
}

.app {
  height: 100dvh; width: 100%; max-width: 1000px; margin: 0 auto; position: relative;;
  min-width: 250px; border-radius: 0px; border-top: 0; border-bottom: 0;
}
.tab {height: 100%; flex-grow: 1;}

.circular {
 font-size: 22px; aspect-ratio: 1; line-height: 40px; padding: 0; display: inline-block; height: 40px; width: 40px; text-align: center; border-radius: 100%; border: 1px solid rgb(110, 110, 110);
}
.circular2 {
 font-size: 16px; aspect-ratio: 1; line-height: 40px; padding: 0; display: inline-block; height: 40px; width: 40px; text-align: center; border-radius: 100%; border: 1px solid rgb(110, 110, 110);
}
.circular3 {
 font-size: 3rem; aspect-ratio: 1; line-height: 100px; padding: 0; display: inline-block; height: 100px; width: 100px; text-align: center; border-radius: 100%; border: 1px solid rgb(110, 110, 110);
}

.horizon {
  display: inline-block; height: 5px; width: 100%; width: 20px; background-color: var(--bg);
}


.project-x {
   width: 100%; max-height: 400px; text-align: center; padding: 10px; border-radius: 10px; border: 1px solid grey;
}