Keep working on responsiveness

new/index.html

@@ -220,7 +220,7 @@
 					</div>
 
 					<div class="demobox">
-						<h2 id="on-demand-demo">Experience it</h2>
+						<h2 id="on-demand-demo" lang="de">Experience it</h2>
 						<p>
 							<b>Discover Caddy's automagic HTTPS features with our hosted demo.</b>
 						</p>
@@ -346,10 +346,10 @@
 						</div>
 					</div>
 
-					<div class="action-buttons">
+					<!-- <div class="action-buttons">
 						<a href="/download" class="button primary">Download</a>
 						<a href="/docs/" class="button secondary">Docs<sh></sh></a>
-					</div>
+					</div> -->
 
 					
 				</div>

new/resources/css/home.css

@@ -288,12 +288,13 @@ img.cite {
 }
 
 .demobox h2 {
-	position: absolute;
+	font-size: 90px;
-	top: -99px;
-	font-size: min(90px, 50vw);
 	font-weight: 700;
+	max-width: 100%;
 	white-space: nowrap;
-	max-width: none;
+	overflow-x: auto;
+	white-space: nowrap;
+	margin-top: -1.65em;
 
 	background: linear-gradient(0deg, rgba(27,180,186,1) 10%, rgba(0,61,75,1) 50%);
 	-webkit-background-clip: text;

new/resources/css/marketing.css

@@ -334,7 +334,6 @@ section.dark h3.yellow {
 
 .asides {
 	display: flex;
-	flex-wrap: wrap;
 	gap: 50px;
 	justify-content: space-between;
 	margin: 100px auto 150px auto;
@@ -352,20 +351,15 @@ section.dark h3.yellow {
 
 .asides > * { 
 	flex: 1;
-	/* margin-right: 50px; */
+	min-width: 0; /* kind of a hack that allows proper sizing of pre children; see https://weblog.west-wind.com/posts/2016/feb/15/flexbox-containers-pre-tags-and-managing-overflow */
-	/*min-width: 0;  kind of a hack that allows proper sizing of pre children; see https://weblog.west-wind.com/posts/2016/feb/15/flexbox-containers-pre-tags-and-managing-overflow */
+	min-width: 300px;
-	/* min-width: 300px;
+	width: 100%;
-	width: 100%; */
 }
 
-/* .asides > :last-child {
+.asides-40-60 > :first-child { flex: 2 }
-	margin-right: 0;
+.asides-40-60 > :last-child { flex: 3 }
-} */
+.asides-60-40 > :first-child { flex: 3 }
-
+.asides-60-40 > :last-child { flex: 2 }
-.asides-40-60 > :first-child { width: 40%; }
-.asides-40-60 > :last-child { width: 60%; }
-.asides-60-40 > :first-child { width: 60%; }
-.asides-60-40 > :last-child { width: 40%; }
 
 .asides h2 {
 	text-align: left;
@@ -428,7 +422,7 @@ div.ap-wrapper:fullscreen div.ap-player {
 .display .chroma,
 .display.dark .chroma,
 .display.light .chroma {
-	background: none;
+	background: none !important;
 }
 
 .display code {
@@ -437,7 +431,6 @@ div.ap-wrapper:fullscreen div.ap-player {
 }
 
 .display code {
-	max-width: 800px;
 	font-size: 110%;
 	display: block;
 	position: relative;
@@ -656,27 +649,11 @@ div.ap-wrapper:fullscreen div.ap-player {
 	margin-bottom: 0;
 }
 
-@media (min-width: 1001px) {
-	/* .hero-content .display {
-		transform: scale(1.1);
-		position: relative;
-		left: -7%;
-	} */
-
-	/* div.ap-wrapper div.ap-player {
-
-	} */
-}
-
 @media (max-width: 1000px) {
 	.asides {
 		flex-direction: column;
 	}
 
-	.asides > * { 
-		margin-right: 0;
-	}
-
 	.display {
 		margin-top: 50px;
 		margin-bottom: 50px;

new/sponsor.html

@@ -479,7 +479,7 @@
 						Our take on sponsorships is that all professional and business users of Caddy are expected to invest in a sponsorship, just as we expect tree branches to provide nutrition to their trunk and roots. Our sponsorships are not just feel-good donations. They provide crucial value to companies while sustaining ongoing maintenance.
 					</p>
 					<p>
-						The original author of Caddy, Matt Holt, operates Dyanim, LLC to maintain the project and direct development alongside a global community. Sponsorships are fulfilled by Dyanim, LLC under the auspices of the executive sponsor, ZeroSSL.
+						The original author of Caddy, Matt Holt, operates Dyanim, LLC to maintain the project and direct development alongside a global community. Sponsorships are fulfilled by Dyanim, LLC.
 					</p>
 					<div class="cols cols-big">
 						<div class="col">

src/includes/head.html

@@ -28,7 +28,7 @@
 <meta property="og:image" content="https://caddyserver.com/resources/images/caddy-open-graph.jpg">
 
 <!-- Twitter card tags additive with the og: tags -->
-<meta name="twitter:card" content="summary_large_image">
+<meta name="twitter:card" content="summary">
 <meta name="twitter:domain" value="caddyserver.com">
 <meta name="twitter:description" value="Caddy is a powerful, enterprise-ready, open source web server with automatic HTTPS written in Go">
 <meta name="twitter:image" content="https://caddyserver.com/resources/images/caddy-open-graph.jpg">