+
{section.basicTitle}
diff --git a/src/components/sections/employeeHighlight/employeeHighlight.module.css b/src/components/sections/employeeHighlight/employeeHighlight.module.css
index 43a66c278..753ab218e 100644
--- a/src/components/sections/employeeHighlight/employeeHighlight.module.css
+++ b/src/components/sections/employeeHighlight/employeeHighlight.module.css
@@ -14,7 +14,41 @@
}
}
-.titleSection {
+.image {
+ border-radius: 0.75rem;
+ overflow: hidden;
+
+ min-width: 150px;
+ max-width: 15rem;
+
+ @media (min-width: 640px) {
+ min-width: 240px;
+ max-width: 21.25rem;
+ }
+
+ @media (min-width: 1024px) {
+ min-width: 260px;
+ max-width: 21.25rem;
+ }
+
+ @media (min-width: 1400px) {
+ min-width: 360px;
+ max-width: 27.5rem;
+ }
+
+ @media (min-width: 1800px) {
+ min-width: 460px;
+ max-width: 33.75rem;
+ }
+}
+
+.textContainer {
+ display: flex;
+ flex-direction: column;
+ gap: 0.625rem;
+}
+
+.titleContainer {
display: flex;
flex-direction: column;
align-items: flex-start;
@@ -41,10 +75,7 @@
.name {
display: flex;
flex-direction: column;
- justify-content: flex-start;
- align-items: flex-start;
- padding: 0.75rem 1.25rem 0.625rem 1.25rem;
- border: 1px solid var(--Violet-700);
+ padding: 0.25rem 0.75rem 0.125rem 0.75rem;
border-radius: 1.5rem;
background-color: var(--text-primary-light);
}
@@ -53,31 +84,3 @@
width: 100%;
text-wrap: wrap;
}
-
-.image {
- border-radius: 0.75rem;
- overflow: hidden;
-
- min-width: 150px;
- max-width: 15rem;
-
- @media (min-width: 640px) {
- min-width: 240px;
- max-width: 21.25rem;
- }
-
- @media (min-width: 1024px) {
- min-width: 260px;
- max-width: 21.25rem;
- }
-
- @media (min-width: 1400px) {
- min-width: 360px;
- max-width: 27.5rem;
- }
-
- @media (min-width: 1800px) {
- min-width: 460px;
- max-width: 33.75rem;
- }
-}