@media only screen and (min-width: 768px) {
#footer .site-credits {
	display: none
}
.touch #screen2 #buttons {
	display: none
}
}
@media only screen and (min-width: 1024px) {
.grid .project {
	/*margin-right: 25px;*/
}
}
@media only screen and (min-width: 1000px) {
#navigation, #navigation .menu > li {
	display: block!important
}
#menu-toggle {
	display: none
}
.el-for-mobile {
	display: none
}
.grid .project:nth-child(3), .grid .project:nth-child(6), .grid .project:nth-child(9), .grid .project:nth-child(12), .grid .project:nth-child(15), .grid .project:nth-child(18), .grid .project:nth-child(21), .grid .project:nth-child(24), .grid .project:nth-child(27), .grid .project:nth-child(30), .grid .project:nth-child(33), .grid .project:nth-child(36), .grid .project:nth-child(39), .grid .project:nth-child(42), .grid .project:nth-child(45), .grid .project:nth-child(48), .grid .project:nth-child(51), .grid .project:nth-child(54), .grid .project:nth-child(57), .grid .project:nth-child(60) {
	margin-right: 0
}
#footer {
	min-height: 96px
}
}
@media only screen and (min-width: 1400px) {
.studio .banner.narrow-banner {
	margin: 0 2% 3.25em 0;
	float: left;
	width: 33%
}
.studio .banner.wide-banner {
	display: block!important;
	margin: 0 auto 3.25em;
	float: left;
	width: 65%
}
}
@media only screen and (min-width: 2700px) {
#footer {
	min-height: 100px
}
}
@media only screen and (max-width: 1600px) {

	.news-article .footer-wrapper {
		margin: 0 70px 0 40px;
	}

}

@media only screen and (max-width: 1400px) {
.project-info .shares {
	margin-bottom: 30px
}
}
@media only screen and (max-width: 1200px) {
.header-wrapper, .contents-wrapper {
	margin: 0 40px
}

.footer-wrapper {
	margin: 0 20px 0 40px;
}

.studio .footer-wrapper,
.publications .footer-wrapper,
.project-detail .footer-wrapper,
.news .footer-wrapper,
.work .footer-wrapper,
.home .footer-wrapper{
	margin: 0 40px 0 40px;	
}

.news-article .footer-wrapper {
	margin: 0 20px 0 40px;
}

.cd-top {
	right: 40px
}
}
@media only screen and (max-width: 1024px) {
#navigation .menu li {
	padding: 0 30px
}
}
@media only screen and (max-width: 1000px) {
#branding {
	width: auto
}
#navigation {
	position: absolute;
	display: none;
	left: 40px;
	top: 70px
}
#navigation .menu-wrapper {
	padding: 0
}
#navigation .menu {
	float: none
}
#navigation .menu li {
	margin: 0 auto 1.5em;
	float: none;
	padding: 0
}
#navigation .menu li a:hover, #navigation .menu li.active > a, #navigation .menu li.show-child > a {
	border-bottom: solid 2px #ffe600
}
#navigation .menu .sub-menu li.All {
	display: block
}
.nav-open #navigation {
	display: block
}
#menu-toggle {
	display: block
}
.project-info {
	padding: 30px 30px 50px;
	width: 35%;
	min-width: 300px;
}
.touch .project-info {
	padding: 30px;
	width: 75%;
}
.project-info-wrap {
	max-height: 100%
}
.project-caption {
	bottom: 30px;
	left: 5px
}
#overview .studio-section .studio-content br {
	display: none
}
.cd-top {
	top: auto;
	left: auto;
	bottom: 20px;
	right: 20px;
	height: 10px;
	width: 17px
}
.cd-top:before {
	background-image: url(../img/slidearrow.png);
	background-position: top left;
	background-size: 17px 21px;
	height: 10px;
	width: 17px
}

.studio .cd-top:before, .news .cd-top:before, .publications .cd-top:before {
	background-image: url(../img/slidearrow-black.png);
	background-position: top left
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -85px;
	height: 85px
}

.studio .cd-top {
	right: 40px;
	bottom: 45px;
}

.news .cd-top {
	right: 40px;
	bottom: 60px;
}

}
@media only screen and (max-width: 900px) {
.team-grid .team-member {
	margin: 0 3% 0 0;
	width: 31.33%
}
.team-grid .team-member:nth-child(3), .team-grid .team-member:nth-child(6), .team-grid .team-member:nth-child(9), .team-grid .team-member:nth-child(12) {
	margin: 0
}
}
@media only screen and (max-width: 768px) {
body {
	padding-top: 52px
}
.header-wrapper, .contents-wrapper, .footer-wrapper {
	margin: 0
}
.header-wrapper {
	padding-bottom: 18px
}
#branding {
	margin-left: 30px;
	padding: 20px 0 0
}
#menu-repeater {
	padding-left: 30px;
	top: 26px
}
.lt-ie10 #menu-repeater, html.no-smil #menu-repeater {
	top: 28px
}
#navigation, #menu-repeater {
	left: 0
}
#navigation .menu-wrapper {
	padding: 0 30px
}
#menu-toggle {
	right: 30px;
	top: 17px
}
#footer {
	padding: 15px 0;
	position: relative
}
.studio-section .credit,
.studio-section .contact,
.studio-section .address {
	line-height: 1.6em!important;
	width: 100%;
	float: none;
	clear: both
}
.studio #contents {
	padding-bottom: 52px;
}
.news #footer,
.studio #footer {
	/*display: none;*/
	position: fixed;
	width: 100%;
}
	.studio #footer .footer-wrapper {
		margin-right: 20px;
	}
	.news #footer-navigation .menu,
	.studio #footer-navigation .menu {
		margin-bottom: 5px;
	}
.home #footer {
	/*display: none*/
	position: absolute;
}
#footer #footer-navigation {
	/*display: none*/
}
#footer .site-credits {
	display: none
}

#footer-navigation .menu li.last {
	padding-right: 30px;
}

#contents {
	padding: 0
}
#main-wrapper.work #contents {
	margin-bottom: 0;
	height: 100%
}
.contents-wrapper {
	padding: 20px 30px
}
.project-detail .contents-wrapper {
	padding: 0
}
.home .contents-wrapper {
	padding: 0
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -50px;
	height: 50px
}
#overview .studio-section .studio-title {
	display: none
}
#overview .studio-section .studio-content {
	padding: 0;
	width: 100%
}
#overview .studio-section .studio-content br {
	display: none
}
.studio .contents-wrapper {
	padding: 0
}
.studio .studio-section {
	padding: 20px 30px;
	margin-bottom: .45em
}
.studio-section .studio-title, .studio-section .studio-content {
	padding: 0;
	width: 100%;
	float: none
}
.studio-section .studio-title h3 {
	font: 500 16px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif;
	margin: 0 auto 30px
}
#overview .studio-section {
	padding: 20px 30px
}
#overview .studio-section .studio-content p {
	font: normal 16px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif;
	line-height: 1.45em
}
.studio .banner {
	margin-bottom: .45em
}
#gmap {
	margin-bottom: .45em
}
.team-grid {
	padding: 20px 30px;
	margin-bottom: .45em
}
.team-grid .team-member .info .name {
	font: 500 20px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.team-grid .team-member .info .name a, .team-grid .team-member .info .name a:hover {
500 14px "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif;
}
.team-grid .team-member .info .title {
	font: 500 14px "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.cd-top {
	right: 30px;
	bottom: 20px
}
.project-detail .cd-top {
	bottom: 20px
}
.cd-top.cd-is-visible {
	opacity: 1
}
.cd-top.cd-is-visible:hover {
	opacity: 1
}
.news-grid {
	padding: 0
}
.news-grid .news-item .banner {
	margin: 0 auto 2em;
	display: block;
	height: auto
}
.news-grid .news-item .banner.maxien {
	height: 464px
}
.news-grid .news-item .thumbnail {
	display: none
}
#screen2 {
	height: 100%
}
#screen2 #buttons a {
	background: url(../img/slidearrow.png) no-repeat bottom left;
	position: fixed;
	cursor: default;
	bottom: 20px;
	right: 20px;
	height: 10px;
	width: 17px;
	top: auto;
	left: auto
}
#screen2 #buttons a.prev {
	display: none
}
#custom-slider {
	overflow: auto
}
#custom-slider ul {
	width: 100%!important;
	height: auto
}
#custom-slider li {
	margin: 0 auto 1em;
	height: auto;
	float: none;
	width: 100%!important
}
#custom-slider li img {
	height: auto;
	width: 100%;
	margin: 0
}
.project-caption {
	position: fixed;
	padding: 20px;
	bottom: 5px;
	left: 8px
}
.project-info {
	width: 100%!important;
	position: fixed;
	height: 100%;
	z-index: 9
}
.info-toggle {
	color: transparent;
	font-size: 0
}
.info-toggle:hover:before {
	background-position: bottom left
}
.show-info .info-toggle {
	position: fixed;
	z-index: 999;
	right: 25px;
	top: 27px
}
.show-info .info-toggle:before {
	background: url(../img/info-toggle.png) no-repeat bottom right
}
.show-info #footer {
	z-index: 0
}
.show-info #screen2 #buttons {
	z-index: 1
}
.news-grid {
	padding: 0
}
.news-grid .news-item {
	margin-bottom: 2.5em
}
.news-grid .news-item .news-meta, .news-grid .news-item .news-entry {
	padding: 0 20px;
	width: 100%;
	float: none
}
.project-caption {
	width: auto!important;
	max-width: 80%;
	padding: 14px
}
.show-info #screen2 #buttons, .project-detail.show-info .cd-top {
	opacity: 0!important
}
.project-info {
	padding: 20px
}
.show-info .info-toggle {
	right: 42px
}
.shares {
	margin: 0 auto 1em
}
.shares .title {
	margin: 0
}
.shares.active .title {
	margin: 0 auto 15px
}
#hero-slider {
	height: 100%!important
}
#arrow_right, #arrow_left {
	height: 100%
}
#cycle-nav {
	display: none
}

.studio .footer-wrapper ,
.publications .footer-wrapper ,
.project-detail .footer-wrapper ,
.news .footer-wrapper ,
.work .footer-wrapper ,
.home .footer-wrapper {
	margin: 0 0 0 40px;
}

.studio .cd-top {
	right: 20px;
	bottom: 72px;
}

.news .cd-top {
	bottom: 45px;
	right: 30px;
}

.news .footer-wrapper {
	margin-right: 30px;
}

.news-article .footer-wrapper {
	margin-right: 10px;
}

.project-detail #footer-navigation .menu {
	float: none;
	text-align: right;
	margin-bottom: 30px;
}

.project-detail #footer-navigation .menu li.back {
	display: inline-block;
	float: none;
}

.project-detail #footer-navigation .menu li.last {
	float: none;
	display: inline-block;
	padding-right: 0;
	padding-left: 0;
}

.project-detail .short-info {
	/*display: none;*/
}

.publications .cd-top ,
.work .cd-top ,
.news .cd-top {
	bottom: 55px !important;
}

}

@media only screen and (max-width: 767px) {

	.studio .footer-wrapper ,
	.publications .footer-wrapper ,
	.project-detail .footer-wrapper ,
	.news .footer-wrapper ,
	.home .footer-wrapper {
		margin-left: 0;
	}

}

@media only screen and (max-width: 667px) {

	.home #footer-navigation .menu {
		float: none;
	}
	
	.home #footer-navigation .menu li.news {
		padding-left: 15px;
	}

	.home #footer-navigation .menu li.last {
		text-align: left;
		padding-right: 0;
		padding-left: 15px;
	}

	.home #footer-navigation #search {
		width: 355px;
	}

	.home #footer-navigation .menu li {
	}	

	.home #footer-navigation .menu li.first,
	.home #footer-navigation .menu li.last {
		float: none;
		display: block;
	}

	.home #footer-navigation .menu li.last {
		height: 22px;
	}

	.news-article #footer-navigation .menu li.active #search input[type=text] {
		width: 200px;
		padding: 0;
	}

	.news-article #footer-navigation .menu li.news-back {
		padding: 0 20px 0;
	}

	.news-article #footer-navigation .menu li.last {
		padding: 0;
	}
	
	.project-detail #footer-navigation .menu {
		float: none;
	}

	.news-article .cd-top {
		bottom: 45px;
	}


}


@media only screen and (max-width: 503px) {
	
	.home .contents-wrapper,
	.work .contents-wrapper,
	.project-detail .contents-wrapper ,
	.studio .contents-wrapper ,
	.news .contents-wrapper {
		margin-top: 50px;
	}

}


@media only screen and (max-width: 600px) {
.work .contents-wrapper > .grid {
	margin-left: -15px;
}
.grid .project {
	width: 50%;
	margin-bottom: 15px;
	padding-left: 15px;
}
.grid .project:nth-child(3n+1) {
	clear: inherit;
}
.grid .project:nth-child(3), .grid .project:nth-child(6), .grid .project:nth-child(9), .grid .project:nth-child(12), .grid .project:nth-child(15), .grid .project:nth-child(18), .grid .project:nth-child(21), .grid .project:nth-child(24), .grid .project:nth-child(27), .grid .project:nth-child(30), .grid .project:nth-child(33), .grid .project:nth-child(36), .grid .project:nth-child(39), .grid .project:nth-child(42), .grid .project:nth-child(45), .grid .project:nth-child(48), .grid .project:nth-child(51), .grid .project:nth-child(54), .grid .project:nth-child(57), .grid .project:nth-child(60) {
	/*margin: 0 3% 15px 0*/
}
.grid .project:nth-child(even) {
	/*margin: 0*/
}
#overview .studio-section .studio-content p {
	font: 500 16px/1.4em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif;
	margin: 0 auto 30px
}
.team-grid .team-member .info .name {
	font: 500 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.team-grid .team-member .info .name a, .team-grid .team-member .info .name a:hover {
	font: 500 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.team-grid .team-member .info .title {
	font: 500 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.studio-section .studio-content p {
	font: normal 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif;
	margin: 0 auto 15px;
	line-height: 1.5em
}
.studio-section .address, .studio-section .contact, .studio-section .credit {
	float: none;
	font: normal 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.client li, .client .client-title {
	font: normal 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
a.archive-link {
	font: normal 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.news-grid .news-item .news-title {
	font: 500 16px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.shares .title a, .news-grid .news-item .post-date, .news-grid .news-item .categories, .news-grid .news-item .news-entry, .news-grid .news-item .news-entry p {
	font: normal 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-caption .project-title, .project-info .project-title, .project-caption .location, .project-info .location {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info .project-meta {
	font: 500 16px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info p {
	font: normal 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}



#footer-navigation .menu li.last {
	padding-right: 15px;
}

.home #footer-navigation .menu li.news {
	padding-right: 15px;
	margin-bottom: 15px;
}

#footer-navigation .menu li.active #search input[type=text] {
	width: 250px;
}

.news-article .footer-wrapper {
	margin-right: 0;
}

}
@media only screen and (max-width: 500px) {
body {
	padding-top: 0
}
#header {
	/*position: relative*/
}
.contents-wrapper {
	overflow: visible
}
#branding h1 a {
	background: url(../img/logo_02.png) no-repeat bottom left;
	background-size: 270px 10px;
	min-width: 270px
}
#menu-repeater {
	top: 52px
}
.lt-ie10 #menu-repeater, html.no-smil #menu-repeater {
	top: 52px
}
#menu-toggle {
	top: 14px
}
#menu-toggle span {
	margin-bottom: 5px;
	width: 25px
}
.nav-open #menu-toggle .t3 {
	-webkit-transform: rotate(-90deg) translateX(4px);
	-moz-transform: rotate(-90deg) translateX(4px);
	-ms-transform: rotate(-90deg) translateX(4px);
	-o-transform: rotate(-90deg) translateX(4px);
	transform: rotate(-90deg) translateX(4px)
}
#main-wrapper.work {
	height: auto
}
#main-wrapper.work #contents {/*margin-bottom:-76px;*/
	min-height: 90%;
	height: auto
}
.grid .project, .grid .project:nth-child(3), .grid .project:nth-child(6), .grid .project:nth-child(9), .grid .project:nth-child(12), .grid .project:nth-child(15), .grid .project:nth-child(18), .grid .project:nth-child(even) {
	margin: 0 auto 20px;
	width: 100%
}
.grid .project .project-title {
	font: normal 14px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
.team-grid .team-member {
	min-height: 253px
}
.team-grid .team-member, .team-grid .team-member:nth-child(3), .team-grid .team-member:nth-child(6), .team-grid .team-member:nth-child(9), .team-grid .team-member:nth-child(12) {
	margin: 0 8% 0 0;
	width: 46%
}
.team-grid .team-member:nth-child(even) {
	margin: 0
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: 0;
	height: 0
}

.home #footer-navigation #search {
	width: 250px;
}

}
@media only screen and (max-width: 420px) {
.news-grid .news-item .banner {
	height: auto
}
.project-info .shares li a {
	background-size: 117px 21px
}
.shares li a {
	height: 20px;
	width: 20px
}

.news-article #footer {
	padding: 15px 15px;
}
}
@media only screen and (max-width: 400px) {
#branding {
	margin-left: 20px
}
#branding h1 a {
	background: url(../img/logo_02.png) no-repeat center left;
	background-size: 270px 10px;
	min-width: 270px
}
#menu-toggle {
	right: 20px;
	top: 20px
}
.nav-open #menu-toggle {
	top: 20px
}
#menu-toggle span {
	margin-bottom: 4px;
	width: 20px
}
.nav-open #menu-toggle .t3 {
	-webkit-transform: rotate(-90deg) translateX(2px);
	-moz-transform: rotate(-90deg) translateX(2px);
	-ms-transform: rotate(-90deg) translateX(2px);
	-o-transform: rotate(-90deg) translateX(2px);
	transform: rotate(-90deg) translateX(2px)
}
#navigation .menu-wrapper {
	padding: 0 20px
}
#menu-repeater {
	padding-left: 20px
}
.contents-wrapper {
	padding: 0
}
.grid .project .project-title {
	padding: 0 20px
}
.studio .banner {
	height: 320px
}
.studio .studio-section, #overview .studio-section {
	padding-left: 20px;
	padding-right: 20px
}
.studio-section .studio-title, .studio-section .studio-content {
	width: 100%;
	float: none
}
.team-grid {
	padding: 30px 20px 0
}
.client {
	float: none;
	width: 100%
}
.studio #contact .studio-section {
	margin-bottom: 0
}
.show-info .info-toggle {
	right: 20px
}

.news .footer-wrapper {
	margin-right: 20px;
}

.news-article .footer-wrapper {
	margin-right: 5px;
}

.project-detail #footer-navigation .menu li.back {
	padding: 0 15px 0 0;
}

.project-detail #footer {
	padding: 15px 20px 15px 30px;
}

.project-detail #footer-navigation .menu li.active #search input[type=text] {
	width: 200px;
}
}
@media only screen and (max-width: 360px) {
#branding h1 a {
	background: url(../img/logo_02.png) no-repeat center left;
	background-size: 244px 9px;
	min-width: 244px
}
#menu-toggle {
	top: 16px
}
#menu-toggle span {
	margin-bottom: 4px;
	width: 20px
}
.nav-open #menu-toggle .t3 {
	-webkit-transform: rotate(-90deg) translateX(2px);
	-moz-transform: rotate(-90deg) translateX(2px);
	-ms-transform: rotate(-90deg) translateX(2px);
	-o-transform: rotate(-90deg) translateX(2px);
	transform: rotate(-90deg) translateX(2px)
}
}
@media only screen and (max-width: 320px) {
#branding {
	margin-left: 15px
}
#navigation .menu-wrapper {
	padding: 0 15px
}
#menu-repeater {
	padding-left: 15px
}
#menu-toggle {
	right: 15px
}
#navigation .menu .sub-menu li {
	margin: 0 auto 10px
}
.cd-top {
	right: 15px
}
.project-detail .cd-top {
	right: 20px
}
.team-grid {
	padding: 15px 15px 0
}
.news-grid .news-item .news-meta, .news-grid .news-item .news-entry {
	padding: 0 15px
}
.show-info .info-toggle {
	right: 20px
}
.project-info {
	padding: 15px
}
.project-caption {
	padding: 10px
}
.project-caption .project-title, .project-info .project-title, .project-caption .location, .project-info .location {
	font: 500 20px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info .project-meta {
	font: 500 14px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info p {
	font: normal 12px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
#overview .studio-section .studio-content p {
	font: normal 22px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
#main-wrapper.work #contents {
	min-height: 896px
}
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#screen2 #buttons a {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 31px;
}
.cd-top:before, .ios .cd-top:before {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.ios .studio .cd-top:before, .ios .news .cd-top:before, .ios .publications .cd-top:before {
	background-image: url(../img/slidearrow-black@2x.png);
	background-size: 17px 21px
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
body {
	padding-top: 52px
}
.header-wrapper {
	padding-bottom: 18px
}
#branding {
	padding: 20px 0 0
}
#navigation {
	padding: 15px 0 0
}
#navigation .menu .active .sub-menu {
	/*display: block;*/
}
#navigation .menu .sub-menu li.All {
	display: block
}
#footer {
	padding: 14px 0;
	min-height: 50px
}
#contents {
	padding-bottom: 52px
}
.studio .banner {
	margin-bottom: 1.75em
}
.studio-section {
	margin-bottom: 1.75em;
	padding: 10px 0
}
.team-grid {
	margin-bottom: 1.75em;
	padding: 10px 0
}
#overview .studio-section {
	padding: 2em 0
}
#overview .studio-section .studio-content br {
	display: none
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
#overview .studio-section .studio-content p {
	font: normal 22px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
#main-wrapper.work #contents {
	min-height: 896px
}
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#screen2 #buttons a {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.cd-top:before, .ios .cd-top:before {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.ios .studio .cd-top:before, .ios .news .cd-top:before {
	background-image: url(../img/slidearrow-black@2x.png);
	background-size: 17px 21px
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
body {
	padding-top: 52px
}
.header-wrapper {
	padding-bottom: 18px
}
#branding {
	padding: 20px 0 0
}
#navigation {
	padding: 15px 0 0
}
#navigation .menu .sub-menu li.All {
	display: block
}
#footer {
	padding: 14px 0;
	min-height: 50px
}
#contents {
	padding-bottom: 52px
}
.studio .banner {
	margin-bottom: 1.75em
}
.studio-section {
	margin-bottom: 1.75em;
	padding: 10px 0
}
.team-grid {
	margin-bottom: 1.75em;
	padding: 10px 0
}
#overview .studio-section {
	padding: 2em 0
}
#overview .studio-section .studio-content br {
	display: none
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
#overview .studio-section .studio-content p {
	font: normal 22px/1.2em "Basis Grotesque Pro Regular", 'Helvetica Neue', Arial, Droid, sans-serif
}
#main-wrapper.work #contents {
	min-height: 896px
}
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#screen2 #buttons a {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.cd-top:before, .ios .cd-top:before {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.ios .studio .cd-top:before, .ios .news .cd-top:before, .ios .publications .cd-top:before {
	background-image: url(../img/slidearrow-black@2x.png);
	background-size: 17px 21px
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
body {
	padding-top: 55px;
}
.header-wrapper {
	padding-bottom: 18px
}
#branding {
	padding: 20px 0 0
}
#navigation {
	padding: 15px 0 0
}
#navigation .menu .sub-menu li.All {
	display: block
}
#footer {
	padding: 14px 0;
	min-height: 50px
}
#contents {
	padding-bottom: 52px
}
.studio .banner {
	margin-bottom: 1.75em
}
.studio-section {
	margin-bottom: 1.75em;
	padding: 10px 0
}
.team-grid {
	margin-bottom: 1.75em;
	padding: 10px 0
}
#overview .studio-section {
	padding: 2em 0
}
#overview .studio-section .studio-content br {
	display: none
}
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
.cd-top:before, .ios .cd-top:before {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.ios .studio .cd-top:before, .ios .news .cd-top:before {
	background-image: url(../img/slidearrow-black@2x.png);
	background-size: 17px 21px
}
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
#screen2 #buttons a {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
#navigation {
	padding: 10px 0 0
}
#navigation .menu li {
	margin: 0 auto 1.2em
}
#navigation .menu .sub-menu {
	width: 400px
}
#navigation .menu .sub-menu li {
	margin: 0 auto 20px;
	float: left;
	width: 50%
}
#navigation .menu .sub-menu {
	top: 45px
}
.project-info {
	padding-top: 55px
}
}
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {
.cd-top:before, .ios .cd-top:before {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.ios .studio .cd-top:before, .ios .news .cd-top:before {
	background-image: url(../img/slidearrow-black@2x.png);
	background-size: 17px 21px
}
}
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
#screen2 #buttons a {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
#navigation {
	padding: 20px 0 0
}
#navigation .menu .sub-menu {
	width: 400px;
	top: 50px
}
#navigation .menu .sub-menu li {
	margin: 0 auto 20px;
	float: left;
	width: 50%
}
.project-info {
	padding-top: 55px
}
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
.cd-top:before, .ios .cd-top:before {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.ios .studio .cd-top:before, .ios .news .cd-top:before {
	background-image: url(../img/slidearrow-black@2x.png);
	background-size: 17px 21px
}
#menu-toggle {
	top: 17px
}
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#screen2 #buttons a {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 31px;
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#navigation .menu .sub-menu {
	width: 400px;
	top: 50px
}
#navigation .menu .sub-menu li {
	margin: 0 auto 20px;
	float: left;
	width: 50%
}
.project-info {
	padding-top: 55px
}
}
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.cd-top:before, .ios .cd-top:before {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
.ios .studio .cd-top:before, .ios .news .cd-top:before {
	background-image: url(../img/slidearrow-black@2x.png);
	background-size: 17px 21px
}
#menu-toggle {
	top: 14px
}
}
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#screen2 #buttons a {
	background-image: url(../img/slidearrow@2x.png);
	background-size: 17px 21px
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: landscape) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#navigation .menu .sub-menu {
	width: 400px;
	top: 50px
}
#navigation .menu .sub-menu li {
	margin: 0 auto 25px;
	float: left;
	width: 50%
}
.project-info {
	padding-top: 55px
}
}
@media screen and (device-width: 320px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media screen and (device-width: 320px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info {
	padding-top: 55px
}
}
@media screen and (device-width: 320px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media screen and (device-width: 320px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info {
	padding-top: 55px
}
}
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info {
	padding-top: 55px
}
}
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
#maximage .mc-image {
	background-size: contain;
	background-position: top left
}
}
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape) {
.team-grid h3, .studio-section .studio-title h3 {
	font: 500 24px/1.2em "Basis Grotesque Pro Medium", 'Helvetica Neue', Arial, Droid, sans-serif
}
.project-info {
	padding-top: 55px
}
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
#branding h1 a {
	background-image: url(../img/logo_02@2x.png)
}
#menu-repeater > a:before {
	background-image: url(../img/menu-back-arrow@2x.png);
	background-size: 6px 12px
}
.info-toggle:before, .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.show-info .info-toggle:before, .show-info .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.cd-top:before {
	background-image: url(../img/back-to-top@2x.png);
	background-size: 74px 22px
}
.social-icons .fb {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .twitter {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .google {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .linkedin {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .instagram {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .pinterest {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
}
@media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
#branding h1 a {
	background-image: url(../img/logo_02@2x.png)
}
#menu-repeater > a:before {
	background-image: url(../img/menu-back-arrow@2x.png);
	background-size: 6px 12px
}
.info-toggle:before, .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.show-info .info-toggle:before, .show-info .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.cd-top:before {
	background-image: url(../img/back-to-top@2x.png);
	background-size: 74px 22px
}
.social-icons .fb {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .twitter {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .google {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .linkedin {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .instagram {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .pinterest {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
}
@media (-webkit-min-device-pixel-ratio: 1.3), (min-resolution: 124.8dpi) {
#branding h1 a {
	background-image: url(../img/logo_02@2x.png)
}
#menu-repeater > a:before {
	background-image: url(../img/menu-back-arrow@2x.png);
	background-size: 6px 12px
}
.info-toggle:before, .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.show-info .info-toggle:before, .show-info .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.cd-top:before {
	background-image: url(../img/back-to-top@2x.png);
	background-size: 74px 22px
}
.social-icons .fb {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .twitter {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .google {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .linkedin {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .instagram {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .pinterest {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
}
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
#branding h1 a {
	background-image: url(../img/logo_02@2x.png)
}
#menu-repeater > a:before {
	background-image: url(../img/menu-back-arrow@2x.png);
	background-size: 6px 12px
}
.info-toggle:before, .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.show-info .info-toggle:before, .show-info .info-toggle:hover:before {
	background-image: url(../img/info-toggle@2x.png);
	background-size: 35px 35px
}
.cd-top:before {
	background-image: url(../img/back-to-top@2x.png);
	background-size: 74px 22px
}
.social-icons .fb {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .twitter {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .google {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .linkedin {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .instagram {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
.social-icons .pinterest {
	background-image: url(../img/social-media-icons@2x.png);
	background-size: 442.5px 37.5px
}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 21), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) {
#branding h1 a {
background-image:url(../img/logo_02@2x.png)
}
#menu-repeater > a:before {
background-image:url(../img/menu-back-arrow@2x.png);
background-size:6px 12px
}
.info-toggle:before, .info-toggle:hover:before {
background-image:url(../img/info-toggle@2x.png);
background-size:35px 35px
}
.show-info .info-toggle:before, .show-info .info-toggle:hover:before {
background-image:url(../img/info-toggle@2x.png);
background-size:35px 35px
}
.cd-top:before {
background-image:url(../img/back-to-top@2x.png);
background-size:74px 22px
}
.social-icons .fb {
background-image:url(../img/social-media-icons@2x.png);
background-size:442.5px 37.5px
}
.social-icons .twitter {
background-image:url(../img/social-media-icons@2x.png);
background-size:442.5px 37.5px
}
.social-icons .google {
background-image:url(../img/social-media-icons@2x.png);
background-size:442.5px 37.5px
}
.social-icons .linkedin {
background-image:url(../img/social-media-icons@2x.png);
background-size:442.5px 37.5px
}
.social-icons .instagram {
background-image:url(../img/social-media-icons@2x.png);
background-size:442.5px 37.5px
}
.social-icons .pinterest {
background-image:url(../img/social-media-icons@2x.png);
background-size:442.5px 37.5px
}
}
@media only screen and (max-width: 768px) {
	.news-article #footer {
		padding: 20px 30px;
	}
	.news-article #footer #footer-navigation {
		display: block;
	}
	#navigation .menu .active.show-child .sub-menu {
		display: block;
	}
	#screen2{ z-index: 8; }
	#screen2 #buttons{
		height: auto;
		width: auto;
	}
}
@media only screen and (max-width: 420px) {
	.news-article #footer {
		padding: 15px 20px;
	}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
.touch #screen2 #buttons {
	display: block;
}
#screen2 #buttons a.prev,  #screen2 #buttons a.next {
	background-position: top left;
	background-repeat: no-repeat;
	height: 36px;
	width: 21px;
	top: 50%;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls.png);
	left: 30px;
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls.png);
	right: 30px;
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -56px;
	height: 55px;
}
#clients:before {
	height: 54px;
}
.news-article #footer {
	padding: 15px 20px;
}
.news-article #footer #footer-navigation {
	display: block;
}
}
/* iPad 1 and 2 Landscape */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
.touch #screen2 #buttons {
	display: block;
}
#screen2 #buttons a.prev,  #screen2 #buttons a.next {
	background-position: top left;
	background-repeat: no-repeat;
	height: 36px;
	width: 21px;
	top: 50%;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls.png);
	left: 30px;
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls.png);
	right: 30px;
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -56px;
	height: 55px;
}
#clients:before {
	height: 54px;
}
.news-article #footer {
	padding: 15px 20px;
}
.news-article #footer #footer-navigation {
	display: block;
}
}
/* iPad 3 and 4 Landscape */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
.touch #screen2 #buttons {
	display: block;
}
#screen2 #buttons a.prev,  #screen2 #buttons a.next {
	background-position: top left;
	background-repeat: no-repeat;
	height: 36px;
	width: 21px;
	top: 50%;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls.png);
	left: 30px;
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls.png);
	right: 30px;
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -56px;
	height: 55px;
}
#clients:before {
	height: 54px;
}
.news-article #footer {
	padding: 15px 20px;
}
.news-article #footer #footer-navigation {
	display: block;
}
}
/* Galaxy Tab 10.1 Landscape */
@media (max-device-width: 1280px) and (orientation: landscape) {
.touch #screen2 #buttons {
	display: block;
}
#screen2 #buttons a.prev,  #screen2 #buttons a.next {
	background-position: top left;
	background-repeat: no-repeat;
	height: 36px;
	width: 21px;
	top: 50%;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls.png);
	left: 30px;
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls.png);
	right: 30px;
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -56px;
	height: 55px;
}
#clients:before {
	height: 54px;
}
.news-article #footer {
	padding: 15px 20px;
}
.news-article #footer #footer-navigation {
	display: block;
}
}
/* Asus Nexus 7 Landscape */
@media screen and (device-width: 601px) and (device-height: 906px) and (-webkit-min-device-pixel-ratio: 1.331) and (-webkit-max-device-pixel-ratio: 1.332) and (orientation: landscape) {
.touch #screen2 #buttons {
	display: block;
}
#screen2 #buttons a.prev,  #screen2 #buttons a.next {
	background-position: top left;
	background-repeat: no-repeat;
	height: 36px;
	width: 21px;
	top: 50%;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls.png);
	left: 30px;
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls.png);
	right: 30px;
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -56px;
	height: 55px;
}
#clients:before {
	height: 54px;
}
.news-article #footer {
	padding: 15px 20px;
}
.news-article #footer #footer-navigation {
	display: block;
}
}
/* Kindle Fire HD 7" Landscape */
@media only screen  and (min-device-width: 800px)  and (max-device-width: 1280px)  and (-webkit-min-device-pixel-ratio: 1.5)  and (orientation: landscape) {
.touch #screen2 #buttons {
	display: block;
}
#screen2 #buttons a.prev,  #screen2 #buttons a.next {
	background-position: top left;
	background-repeat: no-repeat;
	height: 36px;
	width: 21px;
	top: 50%;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls.png);
	left: 30px;
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls.png);
	right: 30px;
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -56px;
	height: 55px;
}
#clients:before {
	height: 54px;
}
.news-article #footer {
	padding: 15px 20px;
}
.news-article #footer #footer-navigation {
	display: block;
}
}
/* Kindle Fire HD 8.9" Landscape */
@media only screen  and (min-device-width: 1200px)  and (max-device-width: 1600px)  and (-webkit-min-device-pixel-ratio: 1.5)  and (orientation: landscape) {
.touch #screen2 #buttons {
	display: block;
}
#screen2 #buttons a.prev,  #screen2 #buttons a.next {
	background-position: top left;
	background-repeat: no-repeat;
	height: 36px;
	width: 21px;
	top: 50%;
	transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls.png);
	left: 30px;
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls.png);
	right: 30px;
}
#about:before, #philosophy:before, #andrew-franz:before, #team:before, #clients:before, #contact:before, .studio .contents-wrapper > section:before {
	margin-top: -56px;
	height: 55px;
}
#clients:before {
	height: 54px;
}
.news-article #footer {
	padding: 15px 20px;
}
.news-article #footer #footer-navigation {
	display: block;
}
}
/*
 * Retina Screens
 */

@media screen  and (min-device-width: 1200px)  and (max-device-width: 1600px)  and (-webkit-min-device-pixel-ratio: 2)  and (min-resolution: 192dpi) {
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls@2x.png);
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls@2x.png);
}
}

/* For including high-res graphics, but only for screens that can make use of them. "Retina" being "2x": */
@media  (-webkit-min-device-pixel-ratio: 2),  (min-resolution: 192dpi) {
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls@2x.png);
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls@2x.png);
}
}

/* 1.25 dpr */
@media  (-webkit-min-device-pixel-ratio: 1.25),  (min-resolution: 120dpi) {
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls@2x.png);
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls@2x.png);
}
}

/* 1.3 dpr */
@media  (-webkit-min-device-pixel-ratio: 1.3),  (min-resolution: 124.8dpi) {
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls@2x.png);
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls@2x.png);
}
}

/* 1.5 dpr */
@media  (-webkit-min-device-pixel-ratio: 1.5),  (min-resolution: 144dpi) {
#screen2 #buttons a.prev {
	background-image: url(../img/hero-left-controls@2x.png);
}
#screen2 #buttons a.next {
	background-image: url(../img/hero-right-controls@2x.png);
}
}
 @media  only screen and (-webkit-min-device-pixel-ratio: 2),  only screen and ( min--moz-device-pixel-ratio: 2),  only screen and ( -o-min-device-pixel-ratio: 2/1),  only screen and ( min-device-pixel-ratio: 2),  only screen and ( min-resolution: 192dpi),  only screen and ( min-resolution: 2dppx) {
 #screen2 #buttons a.prev {
background-image: url(../img/hero-left-controls@2x.png);
}
 #screen2 #buttons a.next {
background-image: url(../img/hero-right-controls@2x.png);
}
}

@media only screen and (max-width: 600px) {
	.news-article #footer {
		padding: 15px 28px;
	}
}

@media only screen and (max-width: 420px) {
	.news-article #footer {
		padding: 15px 15px;
	}

	.news-article .footer-wrapper {
		margin-right: 10px;
	}
}

@media only screen and (max-width: 320px) {
	.news .footer-wrapper {
		margin-right: 15px;
	}

	.news .cd-top {
		right: 15px;
	}

	.news-article .footer-wrapper {
		margin-right: 0;
	}
}