@media all and (min-width: 1024px) and (max-width: 1280px) {
	/* REMOVE AFTER TESTING!! */
	#wrapper { /*border: 1px solid green;*/ }
}

@media all and (min-width: 768px) and (max-width: 1024px) {
	/* REMOVE AFTER TESTING!! */
	#wrapper { /*border: 1px solid yellow;*/ }

	#logo h1 a:link, #logo h1 a:visited, #logo h1 a:active {
		width: 452px;
	}

	#nav {
		width: 50%;
	}

	a.proj-block-wide {
		height: 426px;
		width: 100%;
	}

	a.proj-block {
		height: 457px;
		width: 50%;
	}

	.bgimg {
		background-size: cover !important;
	}

	#work-menu {
		width: 46%;
	}

	#proj-tagline {
		width: 46%;
	}

	a.proj-grid {
		height: 462px;
		width: 50%;
	}

	.embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
	.embed iframe, .embed object, .embed embed, .embed video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
}

@media all and (min-width: 480px) and (max-width: 768px) {
	/* REMOVE AFTER TESTING!! */
	#wrapper { /*border: 1px solid blue;*/ }

	#logo {
		transform: scale(0.7);
		transform-origin: top left;
		width: 323px;
	}

	#nav {
		width: 50%;
	}

	#nav ul {
		font-size: 18px;
		margin: 18px 0 1em;
	}

	#nav li a:link, #nav li a:visited, #nav li a:active {
		padding: 0 5px;
	}

	h2#site-description {
		font-size: 32px;
		margin-top: 60px;
	}

	a.proj-block-wide {
		height: 312px;
		width: 100%;
	}

	a.proj-block {
		height: 335px;
		width: 50%;
	}

	.bgimg {
		background-size: cover !important;
	}

	#featured .client {
		width: 33%;
	}

	#work-menu {
		width: 63%;
	}

	#proj-tagline {
		font: 26px/38px Georgia;
		width: 50%;
	}

	a.proj-grid {
		height: 338px;
		width: 50%;
	}

	.embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
	.embed iframe, .embed object, .embed embed, .embed video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

	#footer #social a.soc-link {
		line-height: 42px;
		width: 33.3334%; /* fallback for non-calc() browsers */
		width: calc(100% / 3);
	}
}

@media all and (orientation: landscape) and (max-width: 768px) {
	/* REMOVE AFTER TESTING!! */
	#wrapper { /*border: 1px solid orange;*/ }

	#st-trigger-effects { display: block; }

	#nav { display: none; visibility: hidden; }

	#header {
		margin: 35px 0 30px;
	}

	#logo {
		width: 462px;
	}

	#logo h1 a:link, #logo h1 a:visited, #logo h1 a:active {
		font-size: 27px;
		width: 100%;
	}

	h2#site-description {
		font-size: 28px;
		line-height: 30px;
		margin-top: 40px;
		width: 462px;
	}

	a.proj-block-wide {
		height: 558px;
		width: 100%;
	}

	a.proj-block {
		height: 558px;
		width: 100%;
	}

	.bgimg {
		background-size: cover !important;
	}

	#featured .client {
		width: 50%;
	}

	#latest .news-img, .post .news-img {
		float: left;
		margin: 0 0 15px;
		width: 100%;
	}

	#latest .news-img img, .post .news-img img {
		height: auto;
		width: 100%;
	}

	#latest .news-summary, .post .news-summary {
		clear: both;
		float: left;
		width: 100%;
	}

	#latest .news-meta, .post .news-meta {
		margin-bottom: 32px;
		padding: 0;
	}

	#work-head h2.pagetitle {
		font-size: 38px;
		margin-bottom: 20px;
	}

	#work-menu {
		clear: both;
		float: left;
		margin-bottom: 20px;
		width: 63%;
	}

	#work-menu ul li {
		margin: 0;
	}

	#work-menu ul li:after {
		content: '/';
	}

	#work-menu ul li:last-child:after {
		content: '';
	}

	#work-menu ul li a {
		padding: 0 10px;
	}

	#proj-tagline {
		clear: both;
		float: left;
		font: 26px/38px Georgia;
		margin-top: 20px;
		width: 100%;
	}

	.half {
		margin: 0 0 1.5em;
		width: 100%;
	}

	a.proj-grid {
		height: 558px;
		width: 100%;
	}

	.embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
	.embed iframe, .embed object, .embed embed, .embed video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

	.content h2.pagetitle {
		margin-bottom: 30px;
	}

	#footer #social a.soc-link {
		line-height: 42px;
		width: 50%; /* fallback for non-calc() browsers */
		width: calc(100% / 2);
	}
}

@media all and (max-width: 480px) {
	/* REMOVE AFTER TESTING!! */
	#wrapper {
		/*border: 1px solid red;*/
		padding: 0 15px;
	}

	#st-trigger-effects {
		display: block;
		right: 15px;
		top: 34px;
	}

	#nav { display: none; }

	#header {
		margin: 35px 0 30px;
	}

	#logo {
		transform: none;
		width: 100%;
	}

	#logo h1 a:link, #logo h1 a:visited, #logo h1 a:active {
		background-size: 85% auto;
		width: 100%;
	}

	h2#site-description {
		font-size: 30px;
		line-height: 32px;
		margin-top: 40px;
		width: 100%;
	}

	#content {
		-webkit-flex: 0 1 100%;
		-ms-flex: 0 1 100%;
		flex: 0 1 100%;
	}

	a.proj-block-wide {
		height: 322px;
		width: 100%;
	}

	a.proj-block {
		height: 322px;
		width: 100%;
	}

	a.proj-block-wide .link-text, a.proj-block .link-text {
		font: 29px Georgia;
		padding: 22px 0 0 12px;
	}

	a.proj-block-wide .link-text h3, a.proj-block .link-text h3 {
		color: #fff;
		font-size: 22px;
		font-weight: normal;
		margin: 0 0 40px;
	}

	.bgimg {
		background-size: cover !important;
	}

	#featured .client {
		width: 50%;
	}

	#featured .client img {
		height: auto;
		width: 70%;
	}

	#latest .news-img, .post .news-img {
		float: left;
		margin: 0 0 15px;
		width: 100%;
	}

	#latest .news-img img, .post .news-img img {
		height: auto;
		width: 100%;
	}

	#latest .news-summary, .post .news-summary {
		clear: both;
		float: left;
		width: 100%;
	}

	#latest .news-meta, .post .news-meta {
		margin-bottom: 32px;
		padding: 0;
	}

	#work-head h2.pagetitle {
		font-size: 38px;
		margin-bottom: 20px;
	}

	#work-menu {
		clear: both;
		float: left;
		margin-bottom: 20px;
		width: 100%;
	}

	#work-menu ul li {
		margin: 0;
	}

	#work-menu ul li:after {
		content: '/';
	}

	#work-menu ul li:last-child:after {
		content: '';
	}

	#work-menu ul li a {
		padding: 0 10px;
	}

	#proj-info {
		float: left;
		width: 100%;
	}

	#proj-tagline {
		clear: both;
		float: left;
		font: 26px/38px Georgia;
		margin-top: 20px;
		width: 100%;
	}

	.half {
		margin: 0 0 1.5em;
		width: 100%;
	}

	a.proj-grid {
		font: 29px Georgia;
		height: 322px;
		padding: 22px 0 0 12px;
		width: 100%;
	}

	.embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
	.embed iframe, .embed object, .embed embed, .embed video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

	a.proj-grid h3 {
		font-size: 22px;
		font-weight: normal;
		margin: 0 0 40px;
	}

	.content h2.pagetitle {
		margin-bottom: 30px;
	}

	.content h3.feat {
		font-size: 30px;
		font-weight: normal;
		margin: 0 0 35px;
		padding: 0 0 10px;
	}

	#sidebar {
		-webkit-flex: 0 1 100%;
		-ms-flex: 0 1 100%;
		flex: 0 1 100%;
		padding: 25px 0 0;
	}

	#footer {
		font-size: 16px;
		line-height: 22px;
		margin-top: 3em;
		padding-top: 20px;
	}

	#footer #social a.soc-link {
		line-height: 42px;
		width: 50%; /* fallback for non-calc() browsers */
		width: calc(100% / 2);
	}
}