@charset "utf-8";
/* CSS Document */
/* Copyright 2015 Propaganda Design Inc. */

/*-------------------------------------------------------------------
	Less than 960px
-------------------------------------------------------------------*/
@media screen and (max-width: 960px) {
	section { width:90%; }
	.project-list { font-size:15px !important; line-height:17px !important; }
}

/*-------------------------------------------------------------------
	Less than 785px
-------------------------------------------------------------------*/
@media screen and (max-width: 785px) {
	.devices { height:auto; }
	.device {  border:5px solid #231f20;  }
	.device-monitor { margin:0 auto; width:80%; background-size:cover; position:relative; left:auto; display:block; }
	.device-iphone { width:15%; background-size:cover; display:block;border-top-width:12px; border-bottom-width:12px;  }
	.device-ipad { width:30%; background-size:cover; display:block;border-top-width:12px; border-bottom-width:12px;  }
	.l-row-4 > div:nth-child(4n-1) { padding:0 5px 0 10px; }
	.l-row-4 > div:nth-child(4n-2) { padding:0 10px 0 5px; }
	.l-row-4 > div:nth-child(4n) { padding:0 0 0 15px; }
	.l-row-4 > div:nth-child(4n+1) { clear:both; padding:0 15px 0 0; }
	.project-list { margin:0 0 20px 0;}
}

/*-------------------------------------------------------------------
	Less than 595px (Mobile)
-------------------------------------------------------------------*/
@media screen and (max-width: 595px) {
	.l-grid > div { float:none !important; padding:0 0 0 0 !important; width:100% !important; margin:0 auto !important; }
	.navigation > ul > li > ul { zoom:1; filter:alpha(opacity=100); opacity:1; display:block; position:relative; }
	.navigation > ul > li, .navigation > ul > li > ul > li, .navigation > ul > li a { width:100%; display:block; }
	.pagination.l-grid > .l-grid-10 { width:10% !important; float:left !important; }
	.pagination.l-grid > .l-grid-80 { width:80% !important; float:left !important; }
	h1 { font-size:40px; line-height:45px; }
	h3 { font-size:20px; line-height:25px; text-align:left; }
	.project-link , .tasks { text-align:left; }
	.header-section { width:100%; }
	.navigation { margin-top:20px; }
	.mosaicflow__column, .mosaicflow__column:nth-child(2n) { padding-left:0; padding-right:0; }
	header { padding:30px 20px; background-attachment:scroll !important; max-height:600px; }
	.navigation { padding:0; }
	#logo { width:106px; height:12px; font-size:20px; background-size:cover; }
	.navigation-trigger p { font-size:15px; top:-6px; }
	.navigation-trigger { height:15px;    margin: 0 60px 30px 0; }
	.navigation-trigger span:nth-child(2),.navigation-trigger span:nth-child(3) { top:6px; }
	.navigation-trigger span:nth-child(4) { top: 12px; }
	header section { width:100%; }
	.navigation {    background: url(../images/common/bg-header.png); }
	.navigation > ul > li > a { font-size:14px; padding:10px 20px; }
	.services > li, .zap > li { width:100%; }
	footer p { font-size:11px; }
	.l-row-2.has-col-small-gaps > div:nth-child(2n) { padding:0 !important; }
	.project-list { font-size:25px !important; line-height:27px !important; }
	.project-list .project-list-tasks { display:block; opacity:0.7; }
	.project-list { width:85%; margin-left:auto; margin-right:auto; }
	.project-link-icon:after { width:120px; height:120px; }
}


/*-------------------------------------------------------------------
	Retina Displays
-------------------------------------------------------------------*/
@media only screen and (-Webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) {
	
}