Changes for page Home
Last modified by Alex Cotiugă on 2026/01/13 13:12
From version 7.87
edited by Alex Cotiugă
on 2025/11/13 21:16
on 2025/11/13 21:16
Change comment:
There is no comment for this version
To version 7.55
edited by Alex Cotiugă
on 2025/11/13 12:38
on 2025/11/13 12:38
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Objects (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -3,216 +3,237 @@ 3 3 Agnease helps organizations maintain, upgrade, and extend their XWiki environments with clarity and precision. Focusing on stability, performance, and long-term support we ensure your business knowledge and collaboration tools remain dependable, secure, and adaptable to growth.*# 4 4 {{html clean="false"}} 5 5 <main class="agnease-landing"> 6 - <!-- ================= HERO ================= --> 7 - <section class="hero hero-centered" aria-labelledby="hero-title"> 8 - <div class="container"> 9 - <div class="row"> 10 - <div class="col-sm-12"> 11 - <div class="hero-inner"> 12 - <h1 id="hero-title">Professional XWiki solutions, from setup to long-term stability</h1> 13 - <p class="lead">Need your XWiki upgraded, secured, or improved? Let’s make it happen</p> 14 - <div class="hero-cta"> 15 - <a class="btn btn-primary" href="#contact" aria-label="Schedule a call with Agnease"> 16 - Request a consultation 17 - </a> 18 - </div> 19 - <ul class="benefits"> 20 - <li>Smooth upgrades</li> 21 - <li>Reliable support plans</li> 22 - <li>Custom integrations</li> 23 - <li>Secure, optimized platforms</li> 24 - </ul> 6 + <!-- ================= HERO ================= --> 7 + <section class="hero hero-centered" aria-labelledby="hero-title"> 8 + <div class="container"> 9 + <div class="hero-inner"> 10 + <h1 id="hero-title">Professional XWiki solutions, from setup to long-term stability</h1> 11 + <p class="lead">Need your XWiki upgraded, secured, or improved? Let’s make it happen</p> 12 + <div class="hero-cta"> 13 + <a class="btn btn-primary" href="#contact" aria-label="Schedule a call with Agnease">Request a consultation</a> 25 25 </div> 15 + <ul class="benefits"> 16 + <li>Smooth upgrades</li> 17 + <li>Reliable support plans</li> 18 + <li>Custom integrations</li> 19 + <li>Secure, optimized platforms</li> 20 + </ul> 26 26 </div> 27 27 </div> 28 - </div> 29 - </section> 23 + </section> 24 + <!-- ========= WHY CHOOSE AGNEASE (widgets) ========= --> 25 + #set ($whySectionData = [{ 26 + 'title': 'Stability & security', 27 + 'icon': 'shield', 28 + 'content': 'Proven upgrade steps, rollback safety, and proactive hardening keep your wiki reliable.' 29 + },{ 30 + 'title': 'Predictable delivery', 31 + 'icon': 'check-square-o', 32 + 'content': 'Clear scope, defined steps, and documented results to avoid surprises.' 33 + },{ 34 + 'title': 'Clean integrations', 35 + 'icon': 'link', 36 + 'content': 'Maintainable SSO, API, and system connections tailored to your environment.' 37 + },{ 38 + 'title': 'Long-term support', 39 + 'icon': 'life-ring', 40 + 'content': 'Guaranteed response times, regular checks, and fast assistance when needed.' 41 + }]) 42 + <section aria-labelledby="why-title"> 43 + <div class="container"> 44 + <h2 id="why-title">Why choose Agnease</h2> 45 + <p class="lead">10+ years of XWiki expertise with structured delivery and lasting collaboration</p> 46 + <div class="widgets" role="list"> 47 + #foreach ($entry in $whySectionData) 48 + <article class="widget" role="listitem"> 49 + <div class="icon" aria-hidden="true"> 50 + <i class="fa fa-$entry.icon"></i> 51 + <h4>$entry.title</h4> 52 + </div> 53 + <p>$entry.content</p> 54 + </article> 55 + #end 56 + </div> 57 + </div> 58 + </section> 59 + <!-- ================= SERVICES ================= --> 60 + #set ($servicesSectionData = [{ 61 + 'title': 'Upgrades', 62 + 'icon': 'refresh', 63 + 'content': 'Stay current with the latest XWiki LTS and keep your instance secure and stable.', 64 + 'items': [ 65 + 'Audit setup, extensions, and configurations', 66 + 'Test upgrades with backups and validation', 67 + 'Safe production rollout with minimal downtime' 68 + ] 69 + },{ 70 + 'title': 'Maintenance, Support & Recovery', 71 + 'icon': 'stethoscope', 72 + 'content': 'Ensure long-term stability and quick response when issues appear.', 73 + 'items': [ 74 + 'Monitoring and performance checks', 75 + 'Security patching, log analysis, triage', 76 + 'Issue recovery, data repair, hardening' 77 + ] 78 + }]) 79 + <section class="services" aria-labelledby="services-title"> 80 + <div class="container"> 81 + <h2 id="services-title">Services</h2> 82 + <p class="services-sub">All the XWiki services you need, delivered with precision and care</p> 83 + <div class="services-grid"> 84 + <!-- Row 1 --> 85 + #foreach ($entry in $servicesSectionData) 86 + <article class="service"> 87 + <i class="fa fa-$entry.icon" aria-hidden="true"></i> 88 + <div class="body"> 89 + <h4>$entry.title</h4> 90 + <p>$entry.content</p> 91 + <ul> 92 + #foreach ($item in $entry.items) 93 + <li>$item</li> 94 + #end 95 + </ul> 96 + </div> 97 + </article> 98 + #end 30 30 31 - <!-- ========= WHY CHOOSE AGNEASE (widgets) ========= --> 32 - #set ($whySectionData = [{ 33 - 'title': 'Stability & security', 34 - 'icon': 'shield', 35 - 'content': 'Proven upgrade steps, rollback safety, and proactive hardening keep your wiki reliable.' 36 - },{ 37 - 'title': 'Predictable delivery', 38 - 'icon': 'check-square-o', 39 - 'content': 'Clear scope, defined steps, and documented results to avoid surprises.' 40 - },{ 41 - 'title': 'Clean integrations', 42 - 'icon': 'link', 43 - 'content': 'Maintainable SSO, API, and system connections tailored to your environment.' 44 - },{ 45 - 'title': 'Long-term support', 46 - 'icon': 'life-ring', 47 - 'content': 'Guaranteed response times, regular checks, and fast assistance when needed.' 48 - }]) 49 - <section aria-labelledby="why-title"> 50 - <div class="container"> 51 - <h2 id="why-title">Why choose Agnease</h2> 52 - <p class="lead">10+ years of XWiki expertise with structured delivery and lasting collaboration</p> 53 - <div class="row widgets" role="list"> 54 - #foreach ($entry in $whySectionData) 55 - <div class="widget col-sm-6 col-md-3" role="listitem"> 56 - <div class="icon" aria-hidden="true"> 57 - <i class="fa fa-$entry.icon"></i> 58 - <h4>$entry.title</h4> 100 + <article class="service"> 101 + <i class="fa fa-stethoscope" aria-hidden="true"></i> 102 + <div class="body"> 103 + <h3>Maintenance, Support & Recovery</h3> 104 + <p>Ensure long-term stability and quick response when issues appear.</p> 105 + <ul> 106 + <li>Monitoring and performance checks</li> 107 + <li>Security patching, log analysis, triage</li> 108 + <li>Issue recovery, data repair, hardening</li> 109 + </ul> 59 59 </div> 60 - <p>$entry.content</p> 61 - </div> 62 - #end 63 - </div> 64 - </div> 65 - </section> 66 - <!-- ================= SERVICES ================= --> 67 - #set ($servicesSectionData = [{ 68 - 'title': 'Upgrades', 69 - 'icon': 'refresh', 70 - 'content': 'Stay current with the latest XWiki LTS and keep your instance secure and stable.', 71 - 'items': [ 72 - 'Audit setup, extensions, and configurations', 73 - 'Test upgrades with backups and validation', 74 - 'Safe production rollout with minimal downtime' 75 - ] 76 - },{ 77 - 'title': 'Maintenance, Support & Recovery', 78 - 'icon': 'stethoscope', 79 - 'content': 'Ensure long-term stability and quick response when issues appear.', 80 - 'items': [ 81 - 'Monitoring and performance checks', 82 - 'Security patching, log analysis, triage', 83 - 'Issue recovery, data repair, hardening' 84 - ] 85 - },{ 86 - 'title': 'Development & Integrations', 87 - 'icon': 'cogs', 88 - 'content': 'Extend and connect XWiki to fit your workflow and systems.', 89 - 'items': [ 90 - 'Custom apps, macros, automation', 91 - 'SSO, REST APIs, LDAP, CRM links', 92 - 'Maintainable extensions for long-term use' 93 - ] 94 - },{ 95 - 'title': 'Hosting & Deployment', 96 - 'icon': 'cloud', 97 - 'content': 'Cloud-ready environments designed for reliability and performance.', 98 - 'items': [ 99 - 'Containerized deployment and TLS', 100 - 'Backups, restore strategy, observability', 101 - 'Optimization and load tuning' 102 - ] 103 - },{ 104 - 'title': 'Migrations to XWiki', 105 - 'icon': 'exchange', 106 - 'content': 'Move from Confluence, SharePoint, or MediaWiki to XWiki with full data integrity and structure.', 107 - 'items': [ 108 - 'Preserve hierarchy, attachments, and permissions', 109 - 'Convert macros, categories, and metadata for XWiki', 110 - 'Redirect old URLs and maintain SEO consistency' 111 - ] 112 - }]) 113 - <section class="services" aria-labelledby="services-title"> 114 - <div class="container"> 115 - <h2 id="services-title">Services</h2> 116 - <p class="services-sub">All the XWiki services you need, delivered with precision and care</p> 117 - <div class="services-grid"> 118 - #foreach ($entry in $servicesSectionData) 111 + </article> 112 + 113 + <!-- Row 2 --> 119 119 <article class="service"> 120 - <i class="fa fa- $entry.icon" aria-hidden="true"></i>115 + <i class="fa fa-cogs" aria-hidden="true"></i> 121 121 <div class="body"> 122 - <h 4>$entry.title</h4>123 - <p> $entry.content</p>117 + <h3>Development & Integrations</h3> 118 + <p>Extend and connect XWiki to fit your workflow and systems.</p> 124 124 <ul> 125 - #foreach($itemin$entry.items)126 - <li>$item</li>127 - #end120 + <li>Custom apps, macros, automation</li> 121 + <li>SSO, REST APIs, LDAP, CRM links</li> 122 + <li>Maintainable extensions for long-term use</li> 128 128 </ul> 129 129 </div> 130 130 </article> 131 - #end 126 + 127 + <article class="service"> 128 + <i class="fa fa-cloud" aria-hidden="true"></i> 129 + <div class="body"> 130 + <h3>Hosting & Deployment</h3> 131 + <p>Cloud-ready environments designed for reliability and performance.</p> 132 + <ul> 133 + <li>Containerized deployment and TLS</li> 134 + <li>Backups, restore strategy, observability</li> 135 + <li>Optimization and load tuning</li> 136 + </ul> 137 + </div> 138 + </article> 139 + 140 + <!-- Row 3 (single, centered) --> 141 + <article class="service service--center"> 142 + <i class="fa fa-exchange" aria-hidden="true"></i> 143 + <div class="body"> 144 + <h3>Migrations</h3> 145 + <p>Move from Confluence, SharePoint, or MediaWiki to XWiki with full data integrity and structure.</p> 146 + <ul> 147 + <li>Preserve hierarchy, attachments, and permissions</li> 148 + <li>Convert macros, categories, and metadata for XWiki</li> 149 + <li>Redirect old URLs and maintain SEO consistency</li> 150 + </ul> 151 + </div> 152 + </article> 153 + </div> 132 132 </div> 133 - </div> 134 - </section> 155 + </section> 135 135 136 - <!-- ================= METRICS ================= --> 137 - <section aria-labelledby="metrics-title"> 138 - <div class="container"> 139 - <h2 id="metrics-title">Delivery at a glance</h2> 140 - <div class="metrics" role="list"> 141 - <div class="metric" role="listitem"> 142 - <div class="num">8–12h</div> 143 - <div class="label">Typical LTS upgrade window</div> 157 + <!-- ================= METRICS ================= --> 158 + <section aria-labelledby="metrics-title"> 159 + <div class="container"> 160 + <h2 id="metrics-title">Delivery at a glance</h2> 161 + <div class="metrics" role="list"> 162 + <div class="metric" role="listitem"> 163 + <div class="num">8–12h</div> 164 + <div class="label">Typical LTS upgrade window</div> 165 + </div> 166 + <div class="metric" role="listitem"> 167 + <div class="num"><1h</div> 168 + <div class="label">Average service downtime during upgrades</div> 169 + </div> 170 + <div class="metric" role="listitem"> 171 + <div class="num">24–48h</div> 172 + <div class="label">First response SLA (plans)</div> 173 + </div> 174 + <div class="metric" role="listitem"> 175 + <div class="num">10+ yrs</div> 176 + <div class="label">XWiki expertise</div> 177 + </div> 144 144 </div> 145 - <div class="metric" role="listitem"> 146 - <div class="num"><1h</div> 147 - <div class="label">Average service downtime during upgrades</div> 148 - </div> 149 - <div class="metric" role="listitem"> 150 - <div class="num">24–48h</div> 151 - <div class="label">First response SLA (plans)</div> 152 - </div> 153 - <div class="metric" role="listitem"> 154 - <div class="num">10+ yrs</div> 155 - <div class="label">XWiki expertise</div> 156 - </div> 179 + <p class="lead" style="margin-top:.6rem">*for rehearsed, staged upgrades on supported environments.</p> 157 157 </div> 158 - <p class="lead" style="margin-top:.6rem">*for rehearsed, staged upgrades on supported environments.</p> 159 - </div> 160 - </section> 181 + </section> 161 161 162 - <!-- ================= PROCESS ================= --> 163 - <section aria-labelledby="process-title"> 164 - <div class="container"> 165 - <h2 id="process-title">Process</h2> 166 - <p class="lead">Calm, predictable, and transparent from start to finish.</p> 167 - <div class="steps"> 168 - <div class="step"> 169 - <h3>1) Assess</h3> 170 - <p>Review environment, extensions, constraints, and risks with no surprises.</p> 183 + <!-- ================= PROCESS ================= --> 184 + <section aria-labelledby="process-title"> 185 + <div class="container"> 186 + <h2 id="process-title">Process</h2> 187 + <p class="lead">Calm, predictable, and transparent from start to finish.</p> 188 + <div class="steps"> 189 + <div class="step"> 190 + <h3>1) Assess</h3> 191 + <p>Review environment, extensions, constraints, and risks with no surprises.</p> 192 + </div> 193 + <div class="step"> 194 + <h3>2) Plan</h3> 195 + <p>Agree scope, milestones, downtime windows, and rollback checkpoints.</p> 196 + </div> 197 + <div class="step"> 198 + <h3>3) Deliver</h3> 199 + <p>Execute, verify, document, and hand over with actionable notes.</p> 200 + </div> 171 171 </div> 172 - <div class="step"> 173 - <h3>2) Plan</h3> 174 - <p>Agree scope, milestones, downtime windows, and rollback checkpoints.</p> 175 - </div> 176 - <div class="step"> 177 - <h3>3) Deliver</h3> 178 - <p>Execute, verify, document, and hand over with actionable notes.</p> 179 - </div> 180 180 </div> 181 - </div> 182 - </section> 203 + </section> 183 183 184 - <!-- ================= FAQ ================= --> 185 - <section class="faq" aria-labelledby="faq-title"> 186 - <div class="container"> 187 - <h2 id="faq-title">FAQ</h2> 188 - <details> 189 - <summary>How much downtime should we expect for an upgrade?</summary> 190 - <p>Most upgrades complete in a short maintenance window. For mission-critical wikis we rehearse and stage changes to minimize downtime.</p> 191 - </details> 192 - <details> 193 - <summary>Can you help if our wiki is already broken?</summary> 194 - <p>Yes. We start with an audit to stabilize the instance, recover missing features, and harden configuration.</p> 195 - </details> 196 - <details> 197 - <summary>Do you offer support plans?</summary> 198 - <p>Yes, from ad-hoc assistance to ongoing retainers with response-time guarantees and monthly health checks.</p> 199 - </details> 200 - </div> 201 - </section> 205 + <!-- ================= FAQ ================= --> 206 + <section class="faq" aria-labelledby="faq-title"> 207 + <div class="container"> 208 + <h2 id="faq-title">FAQ</h2> 209 + <details> 210 + <summary>How much downtime should we expect for an upgrade?</summary> 211 + <p>Most upgrades complete in a short maintenance window. For mission-critical wikis we rehearse and stage changes to minimize downtime.</p> 212 + </details> 213 + <details> 214 + <summary>Can you help if our wiki is already broken?</summary> 215 + <p>Yes. We start with an audit to stabilize the instance, recover missing features, and harden configuration.</p> 216 + </details> 217 + <details> 218 + <summary>Do you offer support plans?</summary> 219 + <p>Yes, from ad-hoc assistance to ongoing retainers with response-time guarantees and monthly health checks.</p> 220 + </details> 221 + </div> 222 + </section> 202 202 203 - <!-- ================= CTA ================= --> 204 - <section id="contact" aria-labelledby="contact-title"> 205 - <div class="container"> 206 - <div class="cta-band"> 207 - <div> 208 - <h3 id="contact-title">Need a reliable plan for your XWiki?</h3> 209 - <p class="lead" style="margin:0">Upgrades, support, and integrations handled with low risk and clear communication.</p> 224 + <!-- ================= CTA ================= --> 225 + <section id="contact" aria-labelledby="contact-title"> 226 + <div class="container"> 227 + <div class="cta-band"> 228 + <div> 229 + <h3 id="contact-title">Need a reliable plan for your XWiki?</h3> 230 + <p class="lead" style="margin:0">Upgrades, support, and integrations handled with low risk and clear communication.</p> 231 + </div> 232 + <a class="btn btn-primary" href="mailto:hello@agnease.com">Contact Agnease</a> 210 210 </div> 211 - <a class="btn btn-primary" href="mailto:hello@agnease.com">Contact Agnease</a> 212 212 </div> 213 - </div> 214 - </section> 215 -</main> 235 + </section> 236 + </main> 216 216 {{/html}} 217 217 #* 218 218 = XWiki Multi-Factor Authentication (MFA) Application =
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -120,78 +120,69 @@ 120 120 } 121 121 } 122 122 123 - /* === WHY CHOOSE (widgets usingBootstrapgrid) === */123 + /* === WHY CHOOSE (widgets with inline icon + title) === */ 124 124 .widgets { 125 - margin-top: 12px; 125 + display: grid; 126 + gap: 16px; 127 + grid-template-columns: 1fr; 126 126 127 - /* Flex layout for equal-height and spacing */ 129 + @media (min-width: 860px) { 130 + grid-template-columns: repeat(4, 1fr); 131 + } 132 + } 133 + 134 + .widget { 135 + background: #fff; 136 + border: 1px solid @line; 137 + border-radius: @radius; 138 + padding: 18px; 139 + box-shadow: @shadow-sm; 128 128 display: flex; 129 - flex-wrap: wrap; 130 - justify-content: space-between; 141 + flex-direction: column; 142 + justify-content: flex-start; 143 + gap: 8px; 144 + text-align: left; 145 + transition: transform 0.18s ease, box-shadow 0.18s ease; 131 131 132 - .widget { 133 - box-sizing: border-box; 147 + &:hover { 148 + transform: translateY(-2px); 149 + box-shadow: @shadow; 150 + } 134 134 135 - /* Desktop (md+) – 4 per row */ 136 - flex: 0 0 24%; 137 - max-width: 24%; 138 - margin-bottom: 16px; 139 - 140 - /* Card look */ 152 + /* The icon + title row */ 153 + .icon { 141 141 display: flex; 142 - flex-direction: column; 143 - height: 100%; 144 - padding: 18px; 145 - background: #fff; 146 - border: 1px solid @line; 147 - border-radius: @radius; 148 - box-shadow: @shadow-sm; 149 - transition: transform .18s ease, box-shadow .18s ease; 155 + align-items: center; 156 + gap: 10px; 157 + padding: 6px 0; 158 + border-bottom: 1px solid fade(@line, 60%); 159 + margin-bottom: 6px; 150 150 151 - &:hover { 152 - transform: translateY(-2px); 153 - box-shadow: @shadow; 161 + i { 162 + color: @brand; 154 154 } 155 155 156 - .icon { 157 - display: flex; 158 - align-items: center; 159 - gap: 10px; 160 - padding-bottom: 6px; 161 - margin-bottom: 8px; 162 - border-bottom: 1px solid fade(@line, 60%); 163 - i { color: @brand; } 164 - h4 { margin: 0; line-height: 1.2; color: @text; } 165 - } 166 - 167 - p { 165 + h4 { 166 + /*font-weight: 700; */ 168 168 margin: 0; 169 - color: @ muted;170 - line-height: 1. 45;168 + color: @text; 169 + line-height: 1.2; 171 171 } 172 172 } 173 173 174 - /* Tablet (sm–md) – 2 per row */ 175 - @media (max-width: 991px) { 176 - .widget { 177 - flex: 0 0 48%; 178 - max-width: 48%; 179 - } 173 + /* Body paragraph */ 174 + p { 175 + color: @muted; 176 + margin: 0; 177 + line-height: 1.45; 180 180 } 181 - 182 - /* Mobile (xs) – 1 per row */ 183 - @media (max-width: 767px) { 184 - .widget { 185 - flex: 0 0 100%; 186 - max-width: 100%; 187 - } 188 - } 189 189 } 190 190 191 - /* SERVICES */ 192 - .services {181 + /* SERVICES */ 182 + .services { 193 193 h2 { 194 194 margin: 0 0 .3rem; 185 + /* rely on global heading sizing */ 195 195 } 196 196 197 197 .services-sub { ... ... @@ -199,11 +199,12 @@ 199 199 color: @muted; 200 200 } 201 201 202 - /* Flexlayout:2 perrow ondesktop*/193 + /* Grid: two columns, last item spans both */ 203 203 .services-grid { 204 - display: flex; 205 - flex-wrap: wrap; 206 - gap: 32px 36px; // row gap, column gap 195 + display: grid; 196 + grid-template-columns: repeat(2, minmax(0, 1fr)); 197 + column-gap: 36px; 198 + row-gap: 32px; 207 207 } 208 208 209 209 .service { ... ... @@ -213,15 +213,12 @@ 213 213 padding: 18px 0; 214 214 border-top: 1px solid @line; 215 215 216 - /* two per row */ 217 - flex: 1 1 calc(50% - 18px); 218 - max-width: calc(50% - 18px); 219 - 220 220 /* first row: no top border */ 221 221 &:nth-of-type(-n + 2) { 222 222 border-top: none; 223 223 } 224 224 213 + /* icon badge */ 225 225 > i { 226 226 width: 42px; 227 227 height: 42px; ... ... @@ -236,7 +236,7 @@ 236 236 } 237 237 238 238 .body { 239 - h 4{228 + h3 { 240 240 margin: 0 0 4px; 241 241 font-size: 1.125rem; 242 242 font-weight: 800; ... ... @@ -260,30 +260,27 @@ 260 260 line-height: 1.45; 261 261 } 262 262 } 263 - } 264 264 265 - /* If there is an odd number of services, center the last one */ 266 - .services-grid > .service:last-child:nth-child(odd) { 267 - flex-basis: 100%; 268 - max-width: 680px; 269 - margin-left: auto; 270 - margin-right: auto; 253 + /* last item (Migrations): centered single row */ 254 + &.service--center { 255 + grid-column: 1 / -1; 256 + max-width: 680px; 257 + justify-self: center; 258 + border-top: 1px solid @line; // always show a separator above it 259 + } 271 271 } 272 272 273 - /* Mobile:single column, full-width*/262 + /* Responsive */ 274 274 @media (max-width: 760px) { 275 275 .services-grid { 276 - gap: 20px; 265 + grid-template-columns: 1fr; 266 + row-gap: 20px; 277 277 } 278 278 279 279 .service { 280 280 grid-template-columns: 40px 1fr; 281 - flex: 1 1 100%; 282 - max-width: 100%; 283 283 284 - /* reset border for all, then remove only on first */ 285 - border-top: 1px solid @line; 286 - 272 + /* on mobile only the first service has no top border */ 287 287 &:nth-of-type(1) { 288 288 border-top: none; 289 289 } ... ... @@ -293,14 +293,10 @@ 293 293 height: 36px; 294 294 font-size: 16px; 295 295 } 296 - } 297 297 298 - /* On mobile, last item behaves like all others */ 299 - .services-grid > .service:last-child:nth-child(odd) { 300 - flex-basis: 100%; 301 - max-width: 100%; 302 - margin-left: 0; 303 - margin-right: 0; 283 + &.service--center { 284 + max-width: 100%; 285 + } 304 304 } 305 305 } 306 306 }