@media screen and (max-width: 1200px) {
	header {
		font-size: .8rem ;
	}

    .header-m {
		top: 0;
		left: 0;
		padding: 8px 15px 0 15px;
		width: 100%;
		height: 5em;
		position: fixed;
		z-index: 30;
		background-color: rgba(255, 255, 255, 0);
    }

	
	.main {
	width: 90vw;
	margin: 9rem auto 0;
	}
	
	.main p,
	.main ul,
	.main ol {
		margin-bottom: 0.5em;
		line-height: 1.6em;
	}

	.menu li {
	display: block;
	font-size: 2.3rem;

	}

	.menu {
		display: block;
		background-color: rgba(255, 255, 255, 0.95);
	}
	
	.menu a {
		display: block;
		margin-bottom: 0.8em;
		font-size: 0.8em;
		letter-spacing: 0.12em;
	}
	
	.menu li .active {
   border-bottom: 2px solid #222;
   padding-bottom: 2px;
   }

   		.image-sub {
	font-size: .85rem;
	line-height: 1.2rem
	}
	
	
	.textpage {
		margin: 20px auto;
	}
	
	h1 {
		font-size: 1.1em;
	}
	
	.grid-sizer, .grid-item { 
	width: 100%; 
	margin-bottom: 2%;
	}
	
	.gutter-sizer { 
	width: 2%; 
}

	.desktop {
		display: none;
	}
	
	.mobile {
		display: block; 
	}  

}



@media screen and (max-width: 800px) {
	
	.header-l {
		padding: 20px 0 0 15px;
	}
	
	.header-r {
		padding: 20px 15px 0 0;

	}

	.main {
	  margin: 5rem auto 0;
	}

	.homecarousel-outer {
  	top: 3.5rem;
	}

	.sitename {
		font-size: 1.7em;
		margin-bottom: 0.48em;
	}


		
	.company {
		font-size: 0.66em;	
	}
	
	.menu a {
	  	margin-bottom: 0.8em;
	  	font-size: 0.7em;
	}
	  
	.desktop {
		display: none;
	}
	
	.mobile {
		display: block; 
	} 

   .grid-text {
	font-size: 1.3rem;
	} 



	.footer {
  font-size: .8rem;
}

}



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

.main {
	width: 100vw
	}
	
	.pic {
		width: 100%;	
	}
	
	.textpage {
		z-index: 0;
		width: 100%;
		margin: 20px auto;
	}
	
	.main p,
	.main ul,
	.main ol {
		margin-bottom: 0.5em;
		line-height: 1.6em;
	}
	
	h1 {
	font-size: 1.1em;
	}

	.image-cell.project {
    aspect-ratio: 1 / 1;
	}
	
	.gutter-sizer { 
	width: 3%; 
	}

	.image-sub {
	font-size: .85rem;
	line-height: 1.2rem
	}

  
    .sitename {
		font-size: 1.7em;
		margin-bottom: 0.5em;
	}
		
	.company {
		font-size: 0.8em;	
	}

	.grid-img {
  	position: relative;
  	margin: 0 0 1.5rem;
  	aspect-ratio: 1 / 1;
	}
	
	.image-cell.project.vert {
    display: inline-block;
    width: 95%;
	}	

	.image-cell.project {
	width: 95%;
	}
	
	.desktop {
		display: none;
	}
	
	.mobile {
		display: block; 
	}  
}

@media screen and (max-width: 320px){
	 .sitename {
	    font-size: 1.1em;
		margin-bottom: 0.5em;
	}
		
	.company {
		font-size: 0.7em;	
	}
}