diff --git a/new/includes/examples/custom-ca.md b/new/includes/examples/custom-ca.md
index 5118714..cae940a 100644
--- a/new/includes/examples/custom-ca.md
+++ b/new/includes/examples/custom-ca.md
@@ -1,9 +1,3 @@
-<script>
-ready(() => {
-	window.$_('.ex-custom-ca pre.chroma').classList.add('light');
-});
-</script>
-
 <div class="ex-custom-ca">
 
 ```caddy
@@ -24,3 +18,7 @@ internal.example.com {
 ```
 
 </div>
+
+<script>
+window.$_('.ex-custom-ca code').classList.add('light');
+</script>
\ No newline at end of file
diff --git a/new/includes/examples/file-server.md b/new/includes/examples/file-server.md
index b490a0c..e5a7290 100644
--- a/new/includes/examples/file-server.md
+++ b/new/includes/examples/file-server.md
@@ -25,7 +25,7 @@ ready(() => {
 	endElement = findNextText(startElement, 'browse');
 	wrapRangeWithSpan(startElement, endElement, 'rollover-browse rollover-purple');
 
-	window.$_('.ex-fs pre.chroma').classList.add('light');
+	window.$_('.ex-fs code').classList.add('light');
 });
 </script>
 
diff --git a/new/includes/examples/json-automate-certs.md b/new/includes/examples/json-automate-certs.md
index 3512dbc..4a1fd2b 100644
--- a/new/includes/examples/json-automate-certs.md
+++ b/new/includes/examples/json-automate-certs.md
@@ -1,9 +1,3 @@
-<script>
-ready(() => {
-	window.$_('.ex-json-automate-certs pre.chroma').classList.add('light');
-});
-</script>
-
 <div class="ex-json-automate-certs">
 
 ```json
@@ -23,3 +17,6 @@ ready(() => {
 ```
 
 </div>
+<script>
+window.$_('.ex-json-automate-certs code').classList.add('light');
+</script>
diff --git a/new/includes/examples/local-https.md b/new/includes/examples/local-https.md
index 7a5ad6f..2c1b058 100644
--- a/new/includes/examples/local-https.md
+++ b/new/includes/examples/local-https.md
@@ -1,9 +1,3 @@
-<script>
-ready(() => {
-	window.$_('.ex-local-https pre.chroma').classList.add('light');
-});
-</script>
-
 <div class="ex-local-https">
 
 ```caddy
@@ -21,3 +15,7 @@ http://localhost {
 ```
 
 </div>
+
+<script>
+window.$_('.ex-local-https code').classList.add('light');
+</script>
\ No newline at end of file
diff --git a/new/includes/examples/proxy.md b/new/includes/examples/proxy.md
index dbac84b..97291f8 100644
--- a/new/includes/examples/proxy.md
+++ b/new/includes/examples/proxy.md
@@ -13,6 +13,8 @@ ready(() => {
 	startElement = findWithContent('.ex-proxy pre.chroma code span.line', 'reverse_proxy /service/* {');
 	endElement = findNextText(startElement, '}');
 	wrapRangeWithSpan(startElement, endElement, 'rollover-ha rollover-blue');
+
+	window.$_('.ex-proxy code').classList.add('dark');
 });
 </script>
 
diff --git a/new/includes/examples/website-caddyfile.md b/new/includes/examples/website-caddyfile.md
index fd4831c..6a95dc8 100644
--- a/new/includes/examples/website-caddyfile.md
+++ b/new/includes/examples/website-caddyfile.md
@@ -1,9 +1,3 @@
-<script>
-ready(() => {
-	window.$_('.ex-website-caddyfile pre.chroma').classList.add('light');
-});
-</script>
-
 <div class="ex-website-caddyfile">
 
 ```caddy
@@ -23,3 +17,7 @@ reverse_proxy /api/* localhost:9002
 ```
 
 </div>
+
+<script>
+window.$_('.ex-website-caddyfile code').classList.add('light');
+</script>
\ No newline at end of file
diff --git a/new/includes/footer.html b/new/includes/footer.html
index 8c3d66e..9206e84 100644
--- a/new/includes/footer.html
+++ b/new/includes/footer.html
@@ -11,7 +11,7 @@
 			</p>
 			<br>
 			<p>
-				&copy; {{now | date "2006"}} Stack Holdings. All rights reserved.
+				&copy; {{now | date "2006"}} ZeroSSL. All rights reserved.
 			</p>
 		</div>
 		<div class="link-col" style="margin-left: auto;">
diff --git a/new/includes/head.html b/new/includes/head.html
index 28bd27f..632c9ba 100644
--- a/new/includes/head.html
+++ b/new/includes/head.html
@@ -44,7 +44,7 @@
 <!-- Algolia DocSearch -->
 <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3"> -->
 
-<!-- Global site tag (gtag.js) - Google Analytics (Stack Holdings) -->
+<!-- Global site tag (gtag.js) - Google Analytics (ZeroSSL) -->
 <!-- <script async src="https://www.googletagmanager.com/gtag/js?id=G-2DLB04LK4P"></script>
 <script>
 	window.dataLayer = window.dataLayer || [];
diff --git a/new/on-demand-tls.html b/new/on-demand-tls.html
index 305b69c..1ff0139 100644
--- a/new/on-demand-tls.html
+++ b/new/on-demand-tls.html
@@ -2,7 +2,8 @@
 <html>
 	<head>
 		<title>Caddy is the best web server for HTTPS</title>
-		{{include "/includes/head.html"}}
+		{{import "/includes/head.html"}}
+		{{template "head"}}
 		<link rel="stylesheet" href="/resources/css/marketing.css">
 		<link rel="stylesheet" href="/resources/css/on-demand.css">
 		<link rel="canonical" href="https://caddyserver.com/on-demand-tls">
diff --git a/new/resources/css/home.css b/new/resources/css/home.css
index 02952dd..b902537 100644
--- a/new/resources/css/home.css
+++ b/new/resources/css/home.css
@@ -109,7 +109,6 @@ h1 .subheading  {
 
 div.ap-wrapper div.ap-player {
 	box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.25);
-	transform: scale(1.1);
 	border-radius: 10px;
 }
 
@@ -122,93 +121,6 @@ div.ap-wrapper:fullscreen div.ap-player {
 	background-color: transparent;
 }
 
-.display {
-	perspective: 1500px;
-}
-
-.display code {
-	border-radius: 10px;
-	width: 100%;
-}
-
-.display code {
-	max-width: 800px;
-	font-size: 110%;
-	display: block;
-	position: relative;
-	padding: 20px 40px;
-	white-space: pre;
-	font-weight: bold;
-	overflow-x: auto;
-	box-shadow: 10px 10px 25px rgba(0, 0, 0, 0.1);
-}
-.display.left code {
-	box-shadow: -10px 10px 25px rgba(0, 0, 0, 0.1);
-}
-
-.display.right > * {
-	transform: rotateY(-25deg);
-}
-.display.left > * {
-	transform: rotateY(25deg);
-}
-
-.display code.light {
-	background: #fff linear-gradient(135deg, rgba(255,255,255,0) 0%,rgba(241,241,241,0.5) 46%,rgba(225,225,225,0.5) 46.25%,rgba(246,246,246,0) 100%);
-	color: #222;
-}
-
-.display code.dark,
-.ap-player {
-	/* background: #333 linear-gradient(135deg, rgba(0, 0, 0, 0) 0%,rgba(125, 125, 125, 0.3) 46%,rgba(45, 45, 45, 0.8) 46.8%,rgba(0, 0, 0, 0) 100%); */
-	background: rgb(0 0 0 / .7) linear-gradient(135deg, transparent 0%, rgb(200 200 200 / 0.25) 46%, rgb(200 200 200 / .15) 46.5%, transparent 100%);
-	color: #fff;
-}
-
-.light .display code.dark {
-	background: #333 linear-gradient(135deg, rgba(0, 0, 0, 0) 0%,rgba(125, 125, 125, 0.3) 46%,rgba(45, 45, 45, 0.8) 46.8%,rgba(0, 0, 0, 0) 100%);
-}
-
-.display .comment {
-	color: gray;
-}
-
-.blinking {
-	animation: blinking 1s infinite;
-	background-color: #fff;
-	width: .5em;
-	height: 1.2em;
-	position: relative;
-	top: 5px;
-	display: inline-block;
-}
-
-@keyframes blinking {
-	0%   { background-color: #fff; }
-	45%  { background-color: #fff; }
-	60%  { background-color: transparent; }
-	99%  { background-color: transparent; }
-	100% { background-color: #fff; }
-}
-
-
-.rollover-green,
-.rollover-purple,
-.rollover-blue,
-.rollover-yellow {
-	transition: background-color 250ms;
-}
-
-.dark .rollover-green.show { background-color: #41e68e2b; }
-.dark .rollover-purple.show { background-color: #a52fa55f; }
-.dark .rollover-blue.show { background-color: #0a62aa5b; }
-.dark .rollover-yellow.show { background-color: #ffcb5064; }
-
-.light .rollover-green.show { background-color: #41e68e4b; }
-.light .rollover-purple.show { background-color: #a52fa545; }
-.light .rollover-blue.show { background-color: #0a62aa3a; }
-.light .rollover-yellow.show { background-color: #ffcb5064; }
-
 
 
 .sponsors-leaders {
diff --git a/new/resources/css/marketing.css b/new/resources/css/marketing.css
index ebccfcf..4b4fdc6 100644
--- a/new/resources/css/marketing.css
+++ b/new/resources/css/marketing.css
@@ -419,6 +419,12 @@ div.ap-wrapper:fullscreen div.ap-player {
 	perspective: 1500px;
 }
 
+.display .chroma,
+.display.dark .chroma,
+.display.light .chroma {
+	background: none;
+}
+
 .display code {
 	border-radius: 10px;
 	width: 100%;
@@ -435,6 +441,9 @@ div.ap-wrapper:fullscreen div.ap-player {
 	overflow-x: auto;
 	box-shadow: 10px 10px 25px rgba(0, 0, 0, 0.1);
 }
+.display.dark code {
+	box-shadow: 10px 10px 25px rgba(0, 0, 0, 0.5);
+}
 .display.left code {
 	box-shadow: -10px 10px 25px rgba(0, 0, 0, 0.1);
 }
@@ -446,7 +455,8 @@ div.ap-wrapper:fullscreen div.ap-player {
 	transform: rotateY(25deg);
 }
 
-.display code.light {
+.display code.light, 
+.display .chroma.light {
 	background: #fff linear-gradient(135deg, rgba(255,255,255,0) 0%,rgba(241,241,241,0.5) 46%,rgba(225,225,225,0.5) 46.25%,rgba(246,246,246,0) 100%);
 	color: #222;
 }
@@ -497,7 +507,15 @@ div.ap-wrapper:fullscreen div.ap-player {
 .rollover-blue.show { background-color: #0a62aaa3; }
 .rollover-yellow.show { background-color: #ffcb50; }
 
+.dark .rollover-green.show { background-color: #41e68e7c; }
+.dark .rollover-purple.show { background-color: #a52fa58c; }
+.dark .rollover-blue.show { background-color: #0a62aa96; }
+.dark .rollover-yellow.show { background-color: #ffcb5064; }
 
+.light .rollover-green.show { background-color: #41e68e4b; }
+.light .rollover-purple.show { background-color: rgba(230, 78, 230, 0.522); }
+.light .rollover-blue.show { background-color: #65b4f586; }
+.light .rollover-yellow.show { background-color: #ffcb50d5; }