/* Mobile phones - Portrait */
@media screen and (min-device-width: 320px) 
	and (max-device-width: 667px) 
	and (orientation: portrait) {
		
	@font-face {
      font-family: 'fontello';
      src: url('fonts/fontello.eot?73326379');
      src: url('fonts/fontello.eot?73326379#iefix') format('embedded-opentype'),
           url('fonts/fontello.woff?73326379') format('woff'),
           url('fonts/fontello.ttf?73326379') format('truetype'),
           url('fonts/fontello.svg?73326379#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }
	
	p {
		font-size: 1.5em;
	}
	
	h5 {
		font-size: 1.5em;
	}
	
	h6 {
		font-size: 1.25em;
	}
	
	#navicon {
		display: block;
		font-family: 'fontello';
		font-size: 5em;
		line-height: 1.3em;
		float: right;
	}
	
	#navicon:hover {
		color: #7c7c7c;
	}
	
	#navicon .hide,
	#navicon.on .show {
		display: none;
	}
	
	#navicon.on .hide {
		display: block;
	}
	
	#masthead {
		position: fixed;
		top: 0;
		z-index: 10000;
		background-color: white;
		width: 480px;
		height: 6.5em;
	}
	
	#logo .big {
		display: none;
	}
	
	#logo .small {
		display: block;
	}

	#navigation {
		position: absolute;
		top: .94em;
		font-size: 2.5em;
		line-height: 1.5em;
		display: none;
		background: white;
		padding: 30px 0;
		
	}
	
	#navigation .parentnav .subnav {
		width: 225px;
	}	
	
	#navigation .subnav.projects {
		width: 225px;
		margin-left: 30px;
	}
	
	#navigation .subnav.projects .nav-block {
		width: 100%;
	}
	
	#navigation .subnav.contact {
		margin-top: -5.25em;
	}
	
	#main-wrapper {
		width: 510px;
	}
	
	.content {
		margin-top: 6.5em;
	}
	
	#projects-list .block {
		height: 300px;
	}
	
	#projects-list .block .thumb .info-wrapper {
		display: none;
	}
	
	#projects-list .title {
		display: none;
	}
	
	#projects-list .mobile-hide {
		display: none;
	}
	
	#quotes.block {
		font-size: 1.2em;
		height: auto;
	}
	
	.left-middle-wrapper,
	.middle-right-wrapper,
	.left, 
	.middle, 
	.right,
	.onecol,
	.threecol,
	#project-images li.landscape img {
		width: 480px;
	}
	
	.right {
		float: left;
	}
	
	#pages .middle {
		width: 480px;
	}
	
	#pages .middle img {
		max-width: 100%;
	}
	
	#pages .static-thumb:nth-child(even) {
		margin-right: 0; 
	}
	
	#pages .middle #connect {
		position: static;
		padding-bottom: 30px;
	}
	
	#pages .threecol img {
		width: 100%;
		height: auto;
	}
	
	#pages table tr td {
		width: 100%;
	}

	#people-too .people-too-thumb:nth-child(even) {
		margin-right: 0!important;
	}
	
	#people-too .people-too-thumb.last-col {
		margin-right: 28px;
	}
	
	.project-status {
		font-size: 1.5em;
	}
	
	.project-utilities, .project-share, 
	#projects-list.greyscale {
		display: none;
	}
	
	.project-meta a {
		width: 60%;
	}
	
	#projects-detail .left, 
	#projects-detail .left-middle-wrapper {
		position: relative;
	}
	
	.more-info {
		display: block;
		width: 1em;
		height: 1.3em;
		font-family: "fontello";
		font-size: 3em;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 9999;
		text-align: center;
	}
	
	.more-info .hide,
	.more-info.on .show {
		display: none;
	}
	
	.more-info.on .hide {
		display: inline-block;
	}
	
	#projects-detail .middle {
		/*position: absolute;
		top: 7.5em;*/
		background: url(../images/interface/divider.gif) repeat-x top left white;
		background-color: white;
		position: relative;
		margin-top: -11.5em;
		padding-top: 1em;
		display: none;
	}
		
	#footer .contact {
		width: 100%;
		font-size: 1em;
		line-height: 1.3em;
		padding-bottom: 1em;
	}
	
	#footer .contact span.company {
		display: block;
	}
	
	#footer .credit {
		width: 100%;
		font-size: 1em;
		line-height: 1.3em;
		text-align: left;
	}
	
	#blog .entry-body img {
		max-width: 100%;
	}
}


/* Mobile phones - Landscape */
@media screen and (min-device-width: 320px) 
	and (max-device-width: 667px) 
	and (orientation: landscape) {

	@font-face {
      font-family: 'fontello';
      src: url('fonts/fontello.eot?73326379');
      src: url('fonts/fontello.eot?73326379#iefix') format('embedded-opentype'),
           url('fonts/fontello.woff?73326379') format('woff'),
           url('fonts/fontello.ttf?73326379') format('truetype'),
           url('fonts/fontello.svg?73326379#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }
	
	p {
		font-size: 1.75em;
	}
	
	h5 {
		font-size: 1.5em;
	}
	
	h6 {
		font-size: 1.5em;
	}
	
	#navicon {
		display: block;
		font-family: 'fontello';
		font-size: 5em;
		line-height: 1.3em;
		float: right;
	}
	
	#navicon:hover {
		color: #7c7c7c;
	}
	
	#navicon .hide,
	#navicon.on .show {
		display: none;
	}
	
	#navicon.on .hide {
		display: block;
	}
	
	#masthead {
		position: fixed;
		top: 0;
		z-index: 10000;
		background-color: white;
		height: 6.5em;
		width: 990px;
	}
	
	#logo .big {
		display: none;
	}
	
	#logo .small {
		display: block;
	}

	#navigation {
		position: absolute;
		top: .94em;
		font-size: 2.5em;
		line-height: 1.5em;
		display: none;
		background: white;
		padding: 30px 0;
		width: 990px;
	}
	
	.content {
		margin-top: 6.5em;
	}
	
	#projects-list .block {
		height: 300px;
	}
	
	#projects-list .block .thumb .info-wrapper {
		display: none;
	}
	
	#projects-list .title {
		display: none;
	}
	
	#projects-list .mobile-hide {
		display: none;
	}
	
	
	#project-images li.landscape img {
		width: 735px;
	}
	
	.project-status {
		font-size: 1.5em;
	}
	
	.project-utilities, .project-share, 
	#projects-list.greyscale {
		display: none;
	}
	
	.project-meta a, .project-meta h1 {
		width: 60%;
	}
 
 	#projects-detail .left, 
	#projects-detail .left-middle-wrapper {
		position: relative;
	}

	.more-info {
		display: block;
		width: 1em;
		height: 1.3em;
		font-family: "fontello";
		font-size: 3em;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 9999;
		text-align: center;
	}
	
	.more-info .hide,
	.more-info.on .show {
		display: none;
	}
	
	.more-info.on .hide {
		display: inline-block;
	}
	
	#projects-detail .middle {
		background: url(../images/interface/divider.gif) repeat-x top left white;
		background-color: white;
		position: relative;
		margin-top: -11.5em;
		padding-top: 1em;
		display: none;
	}
	
	#footer .contact {
		width: 100%;
		font-size: 1em;
		line-height: 1.3em;
		padding-bottom: 1em;
	}
	
	#footer .contact span.company {
		display: block;
	}
	
	#footer .credit {
		width: 100%;
		font-size: 1em;
		line-height: 1.3em;
		text-align: left;
	}
}


@media only screen 
	and (min-device-width : 768px) 
	and (max-device-width : 1024px) {
	
	@font-face {
      font-family: 'fontello';
      src: url('fonts/fontello.eot?73326379');
      src: url('fonts/fontello.eot?73326379#iefix') format('embedded-opentype'),
           url('fonts/fontello.woff?73326379') format('woff'),
           url('fonts/fontello.ttf?73326379') format('truetype'),
           url('fonts/fontello.svg?73326379#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }
	
	p {
		font-size: 1.5em;
	}
	
	h5 {
		font-size: 1.5em;
	}
	
	h6 {
		font-size: 1.5em;
	}
	
	#navicon {
		display: block;
		font-family: 'fontello';
		font-size: 5em;
		line-height: 1.3em;
		float: right;
	}
	
	#navicon:hover {
		color: #7c7c7c;
	}
	
	#navicon .hide,
	#navicon.on .show {
		display: none;
	}
	
	#navicon.on .hide {
		display: block;
	}
	
	#masthead {
		position: fixed;
		top: 0;
		z-index: 10000;
		background-color: white;
		height: 6.5em;
		width: 990px;
	}
	
	#logo .big {
		display: none;
	}
	
	#logo .small {
		display: block;
	}

	#navigation {
		position: absolute;
		top: .94em;
		font-size: 2.5em;
		line-height: 1.5em;
		display: none;
		background: white;
		padding: 30px 0;
		width: 990px;
	}
	
	.content {
		margin-top: 6.5em;
	}
	
	#projects-list .block {
		height: 300px;
	}
	
	#projects-list .block .thumb .info-wrapper {
		display: none;
	}
	
	#projects-list .title {
		display: none;
	}
	
	#projects-list .mobile-hide {
		display: none;
	}
	
	
	#project-images li.landscape img {
		width: 735px;
	}
	
	.project-status {
		font-size: 1.5em;
	}
	
	.project-utilities, .project-share, 
	#projects-list.greyscale {
		display: none;
	}
	
	.project-meta a, .project-meta h1 {
		width: 60%;
	}
 
 	#projects-detail .left, 
	#projects-detail .left-middle-wrapper {
		position: relative;
	}

	.more-info {
		display: block;
		width: 1em;
		height: 1.3em;
		font-family: "fontello";
		font-size: 3em;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 9999;
		text-align: center;
	}
	
	.more-info .hide,
	.more-info.on .show {
		display: none;
	}
	
	.more-info.on .hide {
		display: inline-block;
	}
	
	#projects-detail .middle {
		background: url(../images/interface/divider.gif) repeat-x top left white;
		background-color: white;
		position: relative;
		margin-top: -11.5em;
		padding-top: 1em;
		display: none;
	}
	
	#footer .contact {
		width: 100%;
		font-size: 1.5em;
		line-height: 1.3em;
		padding-bottom: 1em;
	}
	
	#footer .contact span.company {
		display: block;
	}
	
	#footer .credit {
		width: 100%;
		font-size: 1.5em;
		line-height: 1.3em;
		text-align: left;
	}
	
}