Index: anon-upload-template.php
===================================================================
--- anon-upload-template.php	(revision 12703)
+++ anon-upload-template.php	(working copy)
@@ -27,15 +27,8 @@
 			padding-top: 10px;
 		}
 
-		.page-template-anon-upload-template-php #footer {
-			position: absolute;
-			bottom: 0;
-			right: 0;
-			left: 0;
-		}
-
 		.video-upload {
-			padding-bottom: 70px;
+			width: 100%;
 		}
 
 		.noscript-show p {
@@ -48,6 +41,7 @@
 
 		.video-upload-left {
 			max-width: 550px;
+			margin: 15px;
 		}
 
 		.video-upload-right {
@@ -56,6 +50,14 @@
 			margin: -25px 0 25px;
 		}
 
+		@media screen and ( max-width: 920px ) {
+			.video-upload-right {
+				float: none;
+				width: auto;
+				margin: 0 10px;
+			}
+		}
+
 		.video-upload p {
 			margin: 16px 0;
 			overflow: hidden;
@@ -74,6 +76,13 @@
 			font-weight: bold;
 		}
 
+		@media screen and ( max-width: 500px ) {
+			.video-upload-left p > label,
+			.video-upload-left div > label {
+				width: 100%;
+			}
+		}
+
 		.video-upload-left p > label.wptv-video-wordcamp-cb {
 			display: inline;
 			float: none;
@@ -93,12 +102,11 @@
 			color: #333;
 			background-color: #fff;
 			padding: 4px;
-			width: 329px;
+			width: 96%;
 			max-width: 329px;
 		}
 
 		.video-upload-left ul.cats-checkboxes {
-			margin-left: 130px;
 			height: 150px;
 			overflow: auto;
 		}
Index: front-page.php
===================================================================
--- front-page.php	(revision 12703)
+++ front-page.php	(working copy)
@@ -49,12 +49,16 @@
 				?>
 
 				<li class="group">
-					<a href="<?php the_permalink(); ?>" rel="bookmark">
 						<span class="video-thumbnail">
+							<a href="<?php the_permalink(); ?>" rel="bookmark">
 							<?php $wptv->the_video_image( 50, null, false ); ?>
+							</a>
 						</span>
-						<span class="video-title"><?php the_title(); ?></span>
-					</a>
+						<span class="video-title">
+							<a href="<?php the_permalink(); ?>" rel="bookmark">
+								<?php the_title(); ?>
+							</a>
+						</span>
 					<?php $wptv->the_event( '<strong class="video-event">', '</strong>' ); ?>
 				</li>
 
Index: header.php
===================================================================
--- header.php	(revision 12703)
+++ header.php	(working copy)
@@ -15,6 +15,7 @@
 <head>
 	<meta charset="<?php bloginfo( 'charset' ); ?>">
 
+	<meta name="viewport" content="width=device-width, initial-scale=1">
 	<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
 	new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
 	j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
Index: sidebar.php
===================================================================
--- sidebar.php	(revision 12703)
+++ sidebar.php	(working copy)
@@ -1,6 +1,6 @@
 <div class="secondary-content">
 	<ul>
-		<li>
+		<li class="widget">
 			<h3><?php esc_html_e( 'Resources', 'wptv' ); ?></h3>
 
 			<ul>
Index: style.css
===================================================================
--- style.css	(revision 12703)
+++ style.css	(working copy)
@@ -86,20 +86,10 @@
 	border: none;
 }
 
-/* Contain floats */
-.group:before, .group:after {
-	content: "";
-	display: table;
+iframe {
+	max-width: 100%;
 }
 
-.group:after {
-	clear: both;
-}
-
-.group {
-	*zoom: 1;
-}
-
 /*************************************/
 
 /* Defaults */
@@ -111,14 +101,6 @@
 	color: #444;
 }
 
-.group:after {
-	content: ".";
-	display: block;
-	height: 0;
-	clear: both;
-	visibility: hidden;
-}
-
 .clear {
 	clear: both;
 }
@@ -246,38 +228,56 @@
 
 #header {
 	margin-top: 10px;
-	height: 57px;
+	padding: 0 30px;
 }
 
+#header:after {
+	clear: both;
+	content: '';
+	display: table;
+}
+
 #header h1 {
 	padding-top: 8px;
-	float: left;
 }
 
 #header .sleeve {
-	width: 942px;
+	max-width: 942px;
 	margin: 0 auto;
 }
 
-#menu ul {
-	float: right;
-	height: 57px;;
+/* Menu */
+
+#menu {
+	clear: both;
+	padding: 10px 0;
 }
 
 #menu li {
-	float: left;
-	display: block;
-	margin-left: 10px;
-	line-height: 57px;
+	display: inline-block;
+	font-size: 14px;
+	margin-left: 0;
+	border-bottom: 1px solid white;
 }
 
+#menu li:last-child {
+	border-bottom: none;
+}
+
+#menu li a {
+	border: 0;
+	padding: 0 5px;
+}
+
+#menu #searchform {
+	margin: 0 0 0 15px;
+}
+
+
 #menu li a,
 #menu li a:link,
 #menu li a:visited {
-	padding: 5px;
-	color: #555;
 	text-decoration: none;
-	border: 0;
 }
 
 #menu .current-menu-item > a,
@@ -288,11 +288,17 @@
 	color: #000 !important;
 }
 
-#searchform {
-	float: right;
-	margin-left: 15px;
+#menu.toggled .menu-primary-container {
+	display: block;
 }
 
+#menu .current-menu-item > a,
+#menu .current-menu-ancestor > a,
+#menu .current_page_item > a,
+#menu .current_page_ancestor > a {
+	color: white !important;
+}
+
 #searchform #searchbox,
 #searchform input#s {
 	box-sizing: content-box;
@@ -303,7 +309,7 @@
 	border-radius: 2px;
 	height: 15px;
 	padding: 5px 6px;
-	width: 140px;
+	width: 71%;
 	-webkit-appearance: textfield;
 }
 
@@ -322,6 +328,8 @@
 	box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
 }
 
+/* Forms */
+
 input[type=submit], button, .button {
 	text-decoration: none;
 	-moz-border-radius: 5px;
@@ -396,6 +404,8 @@
 	);
 }
 
+/* Intro */
+
 .intro {
 	font-size: 30px;
 	height: 64px;
@@ -1479,11 +1489,6 @@
 	display: none;
 }
 
-#content {
-	width: 100%;
-	float: left;
-}
-
 #content .post {
 	margin-bottom: 20px;
 	clear: both;
@@ -1784,21 +1789,21 @@
 	outline: none
 }
 
-.container {
-	width: 940px;
+.wptv-hero .container,
+#page > .container {
 	margin: auto;
+	max-width: 940px;
+	padding: 0 10px;
 }
 
 .primary-content {
-	float: left;
-	width: 700px;
+	flex: 1 1 650px;
 	margin: 0;
 }
 
 .secondary-content {
-	float: right;
-	width: 200px;
-	margin: 0 0 50px 0;
+	flex: 1 1 auto;
+	margin: 0 30px;
 }
 
 .tag-count {
@@ -1869,35 +1874,6 @@
 /* Typography
 ============================================================= */
 
-/* Menu */
-
-#menu {
-	margin-right: 5px;
-}
-
-#menu li {
-	font-size: 14px;
-}
-
-#menu li a,
-#menu li a:link,
-#menu li a:visited {
-	color: #21759b;
-}
-
-#menu li a.selected {
-	color: #545454;
-}
-
-#menu li a:hover,
-#menu li a:focus {
-	color: #d54e21;
-}
-
-#menu #searchform {
-	margin: 0 0 0 15px;
-}
-
 /* Titles and Body Text */
 
 body, td, p,
@@ -1918,7 +1894,7 @@
 }
 
 .page-title {
-	width: 940px;
+	max-width: 940px;
 	margin: auto;
 }
 
@@ -1926,6 +1902,7 @@
 	font-size: 13px;
 	font-weight: bold;
 	-webkit-font-smoothing: antialiased;
+	text-align: left;
 }
 
 h2 {
@@ -2015,25 +1992,19 @@
 ============================================================= */
 
 .wptv-hero {
-	clear: both;
-
-	margin: 10px auto 30px auto;
-	padding: 30px 0 10px 0;
-
+	margin: 10px auto 30px;
+	padding: 30px 0 10px;
 	background: #F0F0F0;
 }
 
 .wptv-hero .main-video {
 	background: #2f2f2f;
-	clear: both;
-
-	float: left;
-	width: 575px;
+	margin: 0 auto;
+	max-width: 575px;
+	position: relative;
 }
 
 .wptv-hero .main-video .video-player {
-	width: 100% !important;
-	height: 323px !important;
 	margin: 0 !important;
 }
 
@@ -2050,7 +2021,7 @@
 }
 
 .wptv-hero .main-video .video-player .videopress-title,
-.wptv-hero .main-video .video-player .videopress-watemark {
+.wptv-hero .main-video .video-player .videopress-watermark {
 	display: none !important;
 }
 
@@ -2096,8 +2067,8 @@
 }
 
 .wptv-hero .secondary-videos {
-	float: right;
-	width: 345px;
+	margin: 20px auto 0;
+	max-width: 575px;
 }
 
 .wptv-hero .secondary-videos h3 {
@@ -2111,20 +2082,13 @@
 
 .wptv-hero .secondary-videos li {
 	font-size: 13px;
-
-	min-height: 75px;
-	position: relative;
-
-	margin: 0 auto 23px 0;
-	padding: 0 0 0 142px;
+	margin: 0 auto 23px;
+	max-width: 130px;
 }
 
 .wptv-hero .secondary-videos .video-thumbnail img {
 	width: 130px;
 	height: 75px;
-
-	position: absolute;
-	left: 0;
 }
 
 .wptv-hero .secondary-videos a:hover img {
@@ -2135,19 +2099,25 @@
 ============================================================= */
 
 .video-list {
-	clear: both;
+	display: flex;
+	flex-wrap: wrap;
+	margin: 0 -5px;
 }
 
+.video-list:after {
+	content: '';
+	flex: auto;
+}
+
 .video-list li {
-	float: left;
-	min-height: 220px;
+	flex: 0 0 160px;
 	margin-bottom: 20px;
+	padding: 0 5px;
 }
 
 .video-list li .video-thumbnail {
 	display: block;
 	width: 100%;
-	height: 100px;
 
 	margin: 0 0 8px 0;
 
@@ -2160,15 +2130,6 @@
 	min-height: 100px;
 }
 
-.video-list.four-col {
-	width: 860px;
-}
-
-.video-list.four-col li {
-	width: 160px;
-	margin-right: 20px;
-}
-
 .secondary-content .video-list .video-title {
 	font-size: 13px;
 	display: block;
@@ -2203,27 +2164,11 @@
 	position: relative;
 }
 
-.archive.video-list .video-thumbnail {
-	position: absolute;
-	top: 0;
-	left: 0;
-
-	width: 220px;
-	height: 120px;
-
-	margin: 0 20px 0 0;
-}
-
 .archive.video-list .video-title {
 	font-size: 16px;
 	margin: 4px 0 8px;
 }
 
-.archive.video-list .video-description {
-	display: block;
-	padding-left: 240px;
-}
-
 .archive.video-list .video-date {
 	color: #aaa;
 	display: block;
@@ -2281,14 +2226,6 @@
 
 /* Video Player and Placeholder */
 
-.single .video-player {
-	float: left;
-	width: 940px !important;
-	height: 529px !important;
-
-	overflow: hidden;
-}
-
 .videopress-placeholder,
 .video-player object {
 	width: 100% !important;
@@ -2418,27 +2355,17 @@
 }
 
 .category .page-title {
-	float: left;
-	width: auto;
-	margin: -8px 0 20px 0;
+	flex: 0 0 25%;
+	margin: -8px auto 20px;
 }
 
 .desc {
-	float: right;
+	flex: 0 0 70%;
 	color: #969696;
 	margin: 3px 0 20px 0;
+	text-align: center;
 }
 
-.category-wordcamptv .secondary-content {
-	float: left;
-	width: 200px;
-}
-
-.category-wordcamptv .primary-content {
-	float: right;
-	margin: 0;
-}
-
 /* WordCamp Individual Page
 ============================================================= */
 
@@ -2453,6 +2380,11 @@
 	margin: 0 0 40px 0;
 }
 
+.secondary-content li.widget {
+	border: 0;
+	text-align: center;
+}
+
 .secondary-content li li {
 	border-bottom: 1px #e5e5e5 solid;
 	padding: 5px 0;
@@ -2468,15 +2400,11 @@
 	padding: 0 0 9px;
 }
 
-.secondary-content li.widget {
-	border: 0;
-}
-
 /* 404 page
 ============================================================= */
 
 .error404 .primary-content {
-	width: 940px;
+	max-width: 940px;
 }
 
 .error404 h2 {
@@ -2512,24 +2440,19 @@
 
 #footer {
 	background: #f0f0f0;
-	clear: both;
 	color: #888;
-	height: 3.5em;
-	margin: 10px 0 15px 0;
+	margin: 10px 0 0 0;
 	padding: 10px 0;
 }
 
 #footer .automattic {
-	width: 400px;
-	float: right;
-	text-align: right;
 	font-size: 11px;
 	letter-spacing: 0.2em;
-	line-height: 3em;
+	line-height: 28px;
+	padding-right: 2px;
 	padding-top: 13px;
-	padding-right: 2px;
+	text-align: center;
 	text-transform: uppercase;
-	line-height: 28px;
 }
 
 #footer .automattic a {
@@ -2540,19 +2463,12 @@
 
 .menu-footer-container,
 #footer div.menu {
-	float: left;
 	line-height: 4em;
-	margin-left: 2px;
 	font-size: 13px;
 	margin-bottom: 0;
+	text-align: center;
 }
 
-.menu-footer-container li,
-#footer div.menu li {
-	display: inline-block;
-	margin: 0 10px;
-}
-
 .menu-footer-container li:last-of-type:after,
 #footer div.menu li:last-of-type:after {
 	content: none;
@@ -2587,3 +2503,220 @@
 #footer img.videopress {
 	display: inline;
 }
+
+/* Media Queries
+============================================================= */
+
+@media screen and ( min-width: 415px ) {
+	.wptv-hero .secondary-videos li {
+		max-width: initial;
+		min-height: 75px;
+		padding-left: 150px;
+		position: relative;
+	}
+
+	.wptv-hero .secondary-videos .video-thumbnail {
+		left: 0;
+		position: absolute;
+	}
+}
+
+@media screen and ( min-width: 500px ) {
+	#header {
+		padding: 0 20px;
+	}
+
+	#header h1 {
+		float: left;
+	}
+
+	.menu-primary-container {
+		display: initial;
+	}
+
+	#menu ul {
+		background-color: transparent;
+		margin-left: -10px;
+		margin-right: auto;
+	}
+
+	#menu li {
+		float: left;
+		margin-left: 10px;
+	}
+
+	#menu li a,
+	#menu li a:link,
+	#menu li a:visited {
+		color: #21759b;
+	}
+
+	#menu li a.selected {
+		color: #545454;
+	}
+
+	#menu li a:hover,
+	#menu li a:focus {
+		color: #d54e21;
+	}
+
+	#searchform {
+		float: right;
+	}
+
+	#searchform #searchbox,
+	#searchform input#s {
+		width: 140px;
+	}
+
+	.secondary-content li.widget {
+		width: 45%;
+		display: inline-block;
+		vertical-align: top;
+		margin-right: -6px;	/* http://css-tricks.com/fighting-the-space-between-inline-block-elements/ */
+		padding-right: 30px;
+	}
+
+	.secondary-content li.widget:nth-child( even ) {
+		margin-right: 0;
+		padding-right: 0;
+	}
+
+}
+
+@media screen and ( min-width: 600px ) {
+	#menu li a:link,
+	#menu li a:visited {
+		color: #555;
+	}
+
+	#footer {
+		height: 3.5em;
+	}
+
+	.menu-footer-container li,
+	#footer div.menu li {
+		display: inline-block;
+		margin: 0 10px;
+	}
+}
+
+@media screen and ( min-width: 940px ) {
+	#menu {
+		clear: initial;
+		padding: 0;
+	}
+
+	#menu ul {
+		float: right;
+		margin-top: 18px;
+	}
+
+	#menu li {
+		padding: 0;
+	}
+
+	#menu li a {
+		display: initial;
+		padding: 5px;
+	}
+
+	#searchform {
+		margin-left: 15px;
+	}
+
+	body .wptv-hero .container,
+	body #page > .container {
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
+		justify-content: space-between;
+	}
+
+	.wptv-hero .main-video {
+		flex: 0 0 575px;
+		margin-left: 0;
+		margin-right: 0;
+	}
+
+	.wptv-hero .secondary-videos {
+		flex: 1 0 320px;
+		margin-left: 23px;
+		margin-top: 0;
+	}
+
+	.secondary-content {
+		flex: 0 0 200px;
+		margin: -20px 0 50px 40px;
+	}
+
+	.secondary-content li.widget {
+		display: initial;
+		text-align: left;
+		width: auto;
+	}
+
+	.category-wordcamptv .secondary-content {
+		margin: 0 30px 0 0;
+		order: 0;
+		width: 170px;
+	}
+
+	.category-wordcamptv .primary-content {
+		margin: 0;
+		order: 1;
+	}
+
+	.single .video-player {
+		float: left;
+		width: 940px !important;
+		height: 529px !important;
+		overflow: hidden;
+	}
+
+	.menu-footer-container,
+	#footer div.menu {
+		float: left;
+	}
+
+	#footer .automattic {
+		float: right;
+		margin-right: 20px;
+		text-align: right;
+		width: 380px;
+	}
+}
+
+@media screen and ( min-width:920px ) {
+	#footer {
+		height: 3.5em;
+	}
+}
+
+@media screen and ( max-width:620px ) {
+	.dot {
+		display: none;
+	}
+}
+
+@media screen and ( min-width:621px ) {
+	.archive.video-list .video-thumbnail {
+		top: 0;
+		left: 0;
+
+		width: 220px;
+		height: 120px;
+
+		margin: 0 20px 0 0;
+	}
+
+	.archive.video-list .video-description {
+		display: block;
+	}
+}
+
+@media screen and ( max-width:400px ) {
+	.entry .contact-form textarea {
+		width: 98%;
+	}
+}
