Medplum

/* Announcements */ .announcements { background-color: var(--mantine-primary-color-light); padding: var(--mantine-spacing-xs); text-align: center; } /* Hero */ .hero { position: relative; background-image: url('../img/homePage/hero-background.jpg'); background-size: cover; background-position: center; } .heroContainer { height: 400px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding-top: 4.5rem; padding-bottom: 6rem; z-index: 1; position: relative; @mixin smaller-than $mantine-breakpoint-sm { padding-top: 3rem; padding-bottom: 4.5rem; } } .heroTitle { color: var(--mantine-color-white); font-size: 50px; font-weight: 500; line-height: 1.2; @mixin smaller-than $mantine-breakpoint-sm { font-size: 30px; line-height: 1.2; } @mixin smaller-than $mantine-breakpoint-xs { font-size: 28px; line-height: 1.3; } } .heroButton { margin-top: 2.25rem; @mixin smaller-than $mantine-breakpoint-sm { width: 100px; } } /* Call to action */ .callToAction { background-color: var(--mantine-primary-color-filled); color: var(--mantine-color-white); padding: var(--mantine-spacing-md); text-align: center; } /* Task cards */ .card { border: 1px solid light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5)); }