diff --git a/src/app/airstrip_one/0/components/BeegText.css.ts b/src/app/airstrip_one/0/components/BeegText.css.ts
index ded742a..88837d5 100644
--- a/src/app/airstrip_one/0/components/BeegText.css.ts
+++ b/src/app/airstrip_one/0/components/BeegText.css.ts
@@ -1,29 +1,34 @@
-import { style } from '@vanilla-extract/css'
-
-export const beeg_container = style({
-	position: 'relative',
-	width:    'max-content',
-	height:   'max-content',
-})
-
-const beeg = style({
-	position: 'absolute',
-	fontSize: '3em',
-})
-
-export const beeg_dummy = style([beeg, {
-	position: 'static',
-	color:    'transparent',
-}])
-
-export const beeg_foreground = style([beeg, {
-	background:     'linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,255,0,1) 16%, rgba(0,255,0,1) 33%, rgba(0,255,255,1) 50%, rgba(0,0,255,1) 66%, rgba(255,0,255,1) 83%, rgba(255,0,0,1) 100%)',
-	backgroundClip: 'text',
-	color:          'transparent',
-}])
-
-export const beeg_background = style([beeg, {
-	left:           '-0.1em',
-	top:            ' 0.1em',
-	color:          'black',
+import { style } from '@vanilla-extract/css'
+
+export const beeg_container = style({
+	position: 'relative',
+	width:    'max-content',
+	height:   'max-content',
+})
+
+const beeg = style({
+	position: 'absolute',
+	fontSize: '1.75em',
+	'@media': {
+		'screen and (min-width: 768px)': {
+			fontSize: '3em',
+		}
+	}
+})
+
+export const beeg_dummy = style([beeg, {
+	position: 'static',
+	color:    'transparent',
+}])
+
+export const beeg_foreground = style([beeg, {
+	background:     'linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(255,255,0,1) 16%, rgba(0,255,0,1) 33%, rgba(0,255,255,1) 50%, rgba(0,0,255,1) 66%, rgba(255,0,255,1) 83%, rgba(255,0,0,1) 100%)',
+	backgroundClip: 'text',
+	color:          'transparent',
+}])
+
+export const beeg_background = style([beeg, {
+	left:           '-0.1em',
+	top:            ' 0.1em',
+	color:          'black',
 }])
\ No newline at end of file
diff --git a/src/app/airstrip_one/0/components/BeegText.tsx b/src/app/airstrip_one/0/components/BeegText.tsx
index f288694..f8a729f 100644
--- a/src/app/airstrip_one/0/components/BeegText.tsx
+++ b/src/app/airstrip_one/0/components/BeegText.tsx
@@ -1,16 +1,16 @@
-import {
-	beeg_container,
-	beeg_dummy,
-	beeg_foreground,
-	beeg_background,
-} from './BeegText.css'
-
-export default function BeegText({ children }: { children: React.ReactNode }) {
-	return (
-		<div className={beeg_container}>
-			<p className={beeg_background}>{children}</p>
-			<p className={beeg_foreground}>{children}</p>
-			<p className={beeg_dummy}     >{children}</p>
-		</div>
-	)
+import {
+	beeg_container,
+	beeg_dummy,
+	beeg_foreground,
+	beeg_background,
+} from './BeegText.css'
+
+export default function BeegText({ children }: { children: React.ReactNode }) {
+	return (
+		<div className={beeg_container}>
+			<p className={beeg_background}>{children}</p>
+			<p className={beeg_foreground}>{children}</p>
+			<p className={beeg_dummy}     >{children}</p>
+		</div>
+	)
 }
\ No newline at end of file
diff --git a/src/app/airstrip_one/0/components/Marquee.css.ts b/src/app/airstrip_one/0/components/Marquee.css.ts
index dc67afa..e948dde 100644
--- a/src/app/airstrip_one/0/components/Marquee.css.ts
+++ b/src/app/airstrip_one/0/components/Marquee.css.ts
@@ -1,25 +1,30 @@
-import { style, keyframes } from '@vanilla-extract/css'
-
-export const marquee_container = style({
-	display:         'flex',
-	width:           '100%',
-	height:          'max-content',
-	overflow:        'hidden',
-	backgroundColor: 'black',
-})
-
-const scroll_marquee = keyframes({
-	'0%':   { left: '   0%' },
-	'100%': { left: '-100%' },
-})
-
-export const marquee_content = style({
-	position:                'relative',
-	fontSize:                '1em',
-	color:                   'magenta',
-	whiteSpace:              'nowrap',
-	animationName:            scroll_marquee,
-	animationDuration:       '8s',
-	animationTimingFunction: 'linear',
-	animationIterationCount: 'infinite',
-})
+import { style, keyframes } from '@vanilla-extract/css'
+
+export const marquee_container = style({
+	display:         'flex',
+	width:           '100%',
+	height:          'max-content',
+	overflow:        'hidden',
+	backgroundColor: 'black',
+})
+
+const scroll_marquee = keyframes({
+	'0%':   { left: '   0%' },
+	'100%': { left: '-100%' },
+})
+
+export const marquee_content = style({
+	position:                'relative',
+	fontSize:                '0.75em',
+	color:                   'magenta',
+	whiteSpace:              'nowrap',
+	animationName:            scroll_marquee,
+	animationDuration:       '8s',
+	animationTimingFunction: 'linear',
+	animationIterationCount: 'infinite',
+	'@media': {
+		'screen and (min-width: 768px)': {
+			fontSize: '1em',
+		}
+	}
+})
diff --git a/src/app/airstrip_one/0/components/Marquee.tsx b/src/app/airstrip_one/0/components/Marquee.tsx
index ad6576f..e78f1fe 100644
--- a/src/app/airstrip_one/0/components/Marquee.tsx
+++ b/src/app/airstrip_one/0/components/Marquee.tsx
@@ -1,13 +1,13 @@
-import {
-	marquee_container,
-	marquee_content,
-} from './Marquee.css'
-
-export default function Marquee({ children }: { children: React.ReactNode }) {
-	return (
-		<div className={marquee_container}>
-			<p className={marquee_content}>{children}</p>
-			<p className={marquee_content}>{children}</p>
-		</div>
-	)
+import {
+	marquee_container,
+	marquee_content,
+} from './Marquee.css'
+
+export default function Marquee({ children }: { children: React.ReactNode }) {
+	return (
+		<div className={marquee_container}>
+			<p className={marquee_content}>{children}</p>
+			<p className={marquee_content}>{children}</p>
+		</div>
+	)
 }
\ No newline at end of file
diff --git a/src/app/airstrip_one/0/ministry_of_truth/layout.tsx b/src/app/airstrip_one/0/ministry_of_truth/layout.tsx
index a9ebaa3..1945c94 100644
--- a/src/app/airstrip_one/0/ministry_of_truth/layout.tsx
+++ b/src/app/airstrip_one/0/ministry_of_truth/layout.tsx
@@ -1,10 +1,10 @@
-import { Metadata } from 'next'
-
-export const metadata: Metadata = {
-	title: 'The Ministry of Truth',
-	description: 'The Ministry of Truth',
-}
-
-export default function Layout({ children }: { children: React.ReactNode }) {
-	return <>{children}</>
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+	title: 'The Ministry of Truth',
+	description: 'The Ministry of Truth',
+}
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+	return <>{children}</>
 }
\ No newline at end of file
diff --git a/src/app/airstrip_one/0/ministry_of_truth/page.css.ts b/src/app/airstrip_one/0/ministry_of_truth/page.css.ts
index 407eae4..956299a 100644
--- a/src/app/airstrip_one/0/ministry_of_truth/page.css.ts
+++ b/src/app/airstrip_one/0/ministry_of_truth/page.css.ts
@@ -1,40 +1,51 @@
-import { keyframes, style } from "@vanilla-extract/css";
-
-export const center_vertical = style({
-	position:      'relative',
-	display:       'flex',
-	flexDirection: 'column',
-	alignItems:    'center',
-	margin:        'auto',
-	width:         '50%',
-	border:        '0.3em solid purple'
-})
-
-export const border = style({
-	width:  '60%',
-	marginBottom: '4em',
-	border: '0.3em solid purple',
-})
-
-export const big_brother_style = style({
-	display: 'block',
-	width:  '100%',
-	height: 'auto',
-})
-
-export const message_style = style({
-	boxSizing: 'border-box',
-	width: '100%',
-	height: 'max-content',
-	margin: 0,
-	border: 'none',
-	padding: '0.5em',
-	fontSize: '2em',
-	color: 'magenta',
-	backgroundColor: 'black',
-	overflowWrap: 'break-word',
-	textAlign: 'center',
-	':focus': {
-		outline: 'none',
-	}
-})
+import { keyframes, style } from "@vanilla-extract/css";
+
+export const center_vertical = style({
+	boxSizing:     'border-box',
+	position:      'relative',
+	display:       'flex',
+	flexDirection: 'column',
+	alignItems:    'center',
+	margin:        'auto',
+	width:         '100%',
+	border:        '0.3em solid purple',
+	'@media': {
+		'screen and (min-width: 768px)': {
+			width: '50%',
+		}
+	}
+})
+
+export const border = style({
+	width:        '61%',
+	marginBottom: '4em',
+	border:       '0.3em solid purple',
+})
+
+export const big_brother_style = style({
+	display: 'block',
+	width:   '100%',
+	height:  'auto',
+})
+
+export const message_style = style({
+	boxSizing:       'border-box',
+	width:           '100%',
+	height:          'max-content',
+	margin:          0,
+	border:          'none',
+	padding:         '0.5em',
+	fontSize:        '1em',
+	color:           'magenta',
+	backgroundColor: 'black',
+	overflowWrap:    'break-word',
+	textAlign:       'center',
+	':focus': {
+		outline: 'none',
+	},
+	'@media': {
+		'screen and (min-width: 768px)': {
+			fontSize: '2em'
+		}
+	}
+})
diff --git a/src/app/airstrip_one/0/ministry_of_truth/page.tsx b/src/app/airstrip_one/0/ministry_of_truth/page.tsx
index 36a83ba..a877c6f 100644
--- a/src/app/airstrip_one/0/ministry_of_truth/page.tsx
+++ b/src/app/airstrip_one/0/ministry_of_truth/page.tsx
@@ -1,47 +1,47 @@
-'use client'
-
-import { useEffect, useRef } from 'react'
-import Image from 'next/image'
-import { useSearchParams } from 'next/navigation'
-import BeegText from '../components/BeegText'
-import Marquee from '../components/Marquee'
-import {
-	center_vertical,
-	border,
-	big_brother_style,
-	message_style,
-} from './page.css'
-
-export default function Home() {
-	const search_params = useSearchParams()
-	const input_ref = useRef<HTMLParagraphElement>(null)
-
-	const set_message = (message: string) => {
-		const encoded = btoa(message)
-		const new_url = `${window.location.protocol}//${window.location.host}${window.location.pathname}?e=${encoded}`
-		window.history.replaceState('', '', new_url)
-	}
-
-	const message = search_params.get('e') ?
-		atob(search_params.get('e')!) :
-		(
-			search_params.get('m')
-			?? 'At the apex of the pyramid comes Big Brother. Big Brother is infallible and all-powerful. Every success, every achievement, every victory, every scientific discovery, all knowledge, all wisdom, all happiness, all virtue, are held to issue directly from his leadership and inspiration.'
-		)
-
-	useEffect(() => {
-		set_message(message)
-	})
-
-	return (
-		<div className={center_vertical}>
-			<Marquee>THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU </Marquee>
-			<BeegText>THE MINISTRY OF TRUTH</BeegText>
-			<div className={border}>
-				<Image className={big_brother_style} width={400} height={300} src='/big_brother_screen.gif' alt='Big Brother' />
-				<p ref={input_ref} className={message_style} onInput={() => set_message(input_ref.current!.textContent ?? '')} contentEditable>{message}</p>
-			</div>
-			<Marquee>THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU </Marquee>
-		</div>
-	)
-}
+'use client'
+
+import { useEffect, useRef } from 'react'
+import Image from 'next/image'
+import { useSearchParams } from 'next/navigation'
+import BeegText from '../components/BeegText'
+import Marquee from '../components/Marquee'
+import {
+	center_vertical,
+	border,
+	big_brother_style,
+	message_style,
+} from './page.css'
+
+export default function Home() {
+	const search_params = useSearchParams()
+	const input_ref = useRef<HTMLParagraphElement>(null)
+
+	const set_message = (message: string) => {
+		const encoded = btoa(message)
+		const new_url = `${window.location.protocol}//${window.location.host}${window.location.pathname}?e=${encoded}`
+		window.history.replaceState('', '', new_url)
+	}
+
+	const message = search_params.get('e') ?
+		atob(search_params.get('e')!) :
+		(
+			search_params.get('m')
+			?? 'At the apex of the pyramid comes Big Brother. Big Brother is infallible and all-powerful. Every success, every achievement, every victory, every scientific discovery, all knowledge, all wisdom, all happiness, all virtue, are held to issue directly from his leadership and inspiration.'
+		)
+
+	useEffect(() => {
+		set_message(message)
+	})
+
+	return (
+		<div className={center_vertical}>
+			<Marquee>THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU </Marquee>
+			<BeegText>THE MINISTRY OF TRUTH</BeegText>
+			<div className={border}>
+				<Image className={big_brother_style} width={400} height={300} src='/big_brother_screen.gif' alt='Big Brother' />
+				<p ref={input_ref} className={message_style} onInput={() => set_message(input_ref.current!.textContent ?? '')} contentEditable>{message}</p>
+			</div>
+			<Marquee>THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU THE SNACK IS WATCHING YOU </Marquee>
+		</div>
+	)
+}
diff --git a/src/app/airstrip_one/0/page.css.ts b/src/app/airstrip_one/0/page.css.ts
index 0c8f089..55b4927 100644
--- a/src/app/airstrip_one/0/page.css.ts
+++ b/src/app/airstrip_one/0/page.css.ts
@@ -6,14 +6,24 @@ export const center_vertical = style({
 	flexDirection: 'column',
 	alignItems:    'center',
 	margin:        'auto',
-	width:         '50%',
-	border:        '0.3em solid purple'
+	width:         '100%',
+	border:        '0.3em solid purple',
+	'@media': {
+		'screen and (min-width: 768px)': {
+			width: '50%',
+		}
+	}
 })
 
 export const big_brother_style = style({
-	width:  '40%',
+	width:  '60%',
 	height: 'auto',
-	border: '0.3em solid purple'
+	border: '0.3em solid purple',
+	'@media': {
+		'screen and (min-width: 768px)': {
+			width: '40%',
+		}
+	}
 })
 
 export const cats_div = style({