:root{--text-color-primary:#4e2c69;--text-color-secondary:white;--background-color-primary:#688AB7;--background-color-secondary:white;--breakpoint-tablet:60px;--breakpoint-laptop:1024px;--breakpoint-desktop:1280px;--max-width:1024px}html{font-size:16px;scroll-behavior:smooth;background-color:var(--background-color-primary)}body{font-family:Helvetica,trebuchet ms,lucida sans unicode,lucida grande,lucida sans,Arial,sans-serif;margin:0;background-color:var(--background-color-primary);display:grid;grid-template-rows:auto 1fr auto;grid-template-areas:"header" "main" "footer";min-height:100vh;gap:0}h2{font-size:1.8rem}header{grid-area:header;width:100%;height:12rem;max-width:var(--max-width);margin:0 auto;text-align:center;color:var(--text-color-secondary);display:flex;align-items:center;justify-content:center;span { font-size: clamp(0.8rem, 3vw, 1.6rem); font-weight: 100; font-family: Helvetica, sans-serif; width: 33.3%; text-align: center; } object { height: 8rem; width: 8rem; }}#intro{display:block;box-sizing:border-box;background-color:var(--background-color-secondary);min-height:0;margin:2rem auto;@media screen and (width < 1024px){margin-left: 1rem; margin-right: 1rem; padding: 1rem;}border:.3rem double var(--background-color-primary)}main{grid-area:main;background-color:var(--background-color-secondary);text-align:center;section { max-width: 1024px; margin: auto; display: flex; flex-direction: row-reverse; align-items: center; justify-content: center; min-height: 300px; color: var(--text-color-primary); @media screen and (width < 1024px) { flex-direction: column; } &:nth-child(even) { flex-direction: row; @media screen and (width < 1024px) { flex-direction: column; } } img, picture { flex: 1; display: block; width: 100%; height: 100%; } div { flex: 1; padding-top: 3rem; padding-bottom: 3rem; h2 { text-box-trim: trim-start; text-box-edge: cap text; margin: 0 0 2rem 0; } a { display: inline-block; background-color: var(--text-color-primary); color: var(--text-color-secondary); margin-top: 1rem; padding: 0.5rem 1rem 0.5rem 1rem; text-decoration: none; text-transform: uppercase; } p { margin-left: 3rem; margin-right: 3rem; } } }}footer{grid-area:footer;width:100%;max-width:var(--max-width);margin:0 auto;display:flex;flex-wrap:wrap-reverse;align-items:center;background-color:var(--background-color-primary);text-align:center;img { border-radius: 50% 50% 0% 0%; margin: 4rem 0 4rem 0; } picture { width: 100%; @media screen and (width >= 1024px) { width: 40%; } } div:nth-child(2) { width: 100%; @media screen and (width >= 1024px) { width: 60%; } h2 { color: var(--text-color-secondary); } }}#social{background-color:var(--background-color-primary);font-size:1.4em;text-align:center;opacity:.8;margin-top:2.5rem;a { margin: 1rem; color: black; }}