@charset "utf-8";
/* CSS Document */


* {
  box-sizing: border-box;
}

body {

  width: 100%;
  margin: 0;
  padding: 0px;
  font-family:  'Union Regular';
  font-weight:  normal;
  font-style:   normal;
  font-stretch: normal;
}

/*Parent Container*/

header{
	width:100%;
	left:0px;
	padding:0px;
	height:15vh;
	word-wrap: break-word;
}

.title_right{
	
	font-size: 6vw;
	font-family: 'Union Regular';
	padding-top: 0px;
	height:8vw;
	float: right;
	right:4vw;
	top:2vw;
	z-index:9000;
	text-align: right;
	position:fixed;

}

.title_right:hover{
	border-bottom: 4px solid blue;


}


.title_left{
	font-size: 6vw;
	font-family: 'Union Regular';
	display:flex; justify-content:flex-start;
	padding-top: 0px;
	left:4vw;
	top:2vw;
	height:8vw;
	z-index:9000;
    position:fixed;
}

.title_left:hover{
	border-bottom: 4px solid blue;
	
}

 a{
	color:black;
	text-decoration:none;
}

 a:link{
	color:black;
	text-decoration:none;
}

 a:active{
	color:black;
	text-decoration:none;
}

 a:visited{
	color:black;
	text-decoration:none;
}

a:hover{
	color:#0000ff;
	text-decoration:none;	
}


#project_title a:hover{
	color:#0000ff;
	text-decoration:underline;	
}






.project_title{
	
	font-family: 'Union Regular';
	font-weight: 100;
	position:sticky;
	
}




/*Responsive CSS*/
* {box-sizing: border-box;}


/*MAIN PAGE*/
.project_wrapper{
	
	padding-top: 0px;
	padding-left:2%;
	padding-right:2%;
	padding-bottom:0px;
}
	.project_icon{
		grid-area:icon;
		

	}

	.project_title{
	grid-area:title;
	font-size: 5vw;
	}


	.project_grid_wrapper_left{
		display:grid;
		grid-template-columns: 1fr ;
		grid-template-rows: 50px 300px;
		grid-template-areas: "icon" "title";
		grid-gap: 10px;
		padding: 10px;
		align-items:center;
		text-align:center;
		
		

	}
	.project_grid_wrapper_right{
		display:grid;
		grid-template-columns: 1fr;
		grid-template-rows: 50px 300px;
		grid-template-areas: "icon" "title";
		grid-gap: 10px;
		padding: 10px;
		align-items:center;
		text-align:center;
		

	}
	

/*CONTENT FORMATTING*/	
	.content_title{
	font-family: 'Union Regular';
	font-weight: 100;
	 position:sticky;
	 font-size:10vw;
	
	}
	
	.content_icon{
	width: 80vw;
	} 
	.content_wrapper{
		max-width: 100%;
		padding:0px;
		text-align:center;
	}


	.content_grid_one-column{
		display:grid;
		grid-template-columns: 1fr ;
		grid-gap: 0px;
		padding: 0px;
		align-items:center;
		text-align:center;
		overflow: hidden;
		width:75%;
		padding-top:10vh;
	}

	.content_grid_two-columns{
		display:grid;
		grid-template-columns: 1fr;
		grid-gap: 5vw;
		padding: 0px;
		overflow: hidden;
		align-content: flex-end;
		width:75%;
		margin:auto;
		padding-top:10vh;

	}
	.content_grid_four-columns{
		display:grid;
		grid-template-columns: 1fr;
		grid-gap: 5vw;
		padding: 5vw;
		align-items:center;
		text-align:center;	
		width:75%;
		padding-top:10vh;
	
	}	
	.content_img_margin{
		grid-area:content_img_margin;
		max-width:75%;
		margin: auto;
		padding-top:10vh;
	
	}
	
	.content_img{
		grid-area:content_img;
		max-width:75%;
		min-width: 100%;
		margin: auto;
	}
	
		.content_img_portrait{
		grid-area:content_img;
		width:35vw;
		max-width:75vw;
		min-width: 50vw;
		
	}
	.content_img_bleed{
		grid-area:content_img_bleed;
		width:100vw;
		float:right;
		margin: auto;
		padding-top:10vh;
	
	}
	.content_text{
		font-size: 10vw;
		font-family: 'Union Regular';	
		color:black;
		text-decoration: none;
		max-width: 70%;
		margin: auto;
		padding-top:10vh;
		padding-bottom: 5vh;
		}
	.content_text_p{
		-webkit-column-count: 1; /* Old Chrome, Safari and Opera */
  		-moz-column-count: 1; /* Old Firefox */
		column-count: 1;
		text-align: left;
		font-size: 10vw;
		font-family: 'Union Regular';
		max-width:70%;
		margin:auto;
		padding-top:2vh;
		padding-bottom: 5vh;
	}

	.content_subtitle{
		font-size: 10vw;
		font-family: 'Union Regular';	
		color:black;
		text-decoration: underline;
		max-width: 70%;
		margin: auto;
		padding-top:5vh;
		padding-bottom: 5vh;
		text-align: left;
		}

	.nav_arrow_right{
		position:fixed; 
		top:50%; 
		right:10px;
		width:6vh;
		}
		
	.nav_arrow_left{
		position:fixed; 
		top:50%; 
		left:10px;
		width:6vh;
		}
		

	.nav_x{
		position:fixed; 
		background-image:url("../img/Xb.png");
		top:80vh; 
		left:46vw;
		width:10vw;
		height: 10vw;
		background-position: center;
 		background-repeat: no-repeat; 
  		background-size: cover;
		}
	.nav_x:hover{
		position:fixed; 
		background-image:url("../img/X.png");
		top:80vh; 
		left:46vw;
		width:10vw;
		height: 10vw;
		background-position: center;
 		background-repeat: no-repeat; 
  		background-size: cover;
		}
			
	
	.project_facts{
	
		font-family:'Union Regular';	
		font-weight: 100;  
		font-size:3vw; 
		padding-bottom: 150px;
		}


@media (min-width: 800px) {
	.project_icon{
		grid-area:icon;

	}

	.project_title{
	grid-area:title;
	font-size: 3vw;
	}


	.project_grid_wrapper_left{
		display:grid;
		grid-template-columns: 1fr 2fr;
		grid-template-rows: 40vmin;
		grid-template-areas: "icon title";
		grid-gap: 10px;
		padding: 10px;
		align-items:center;
		text-align: left;
		justify-content: center;
		height:50vmin;

	}
	.project_grid_wrapper_right{
		display:grid;
		grid-template-columns: 2fr 1fr;
		grid-template-rows: 40vmin;
		grid-template-areas: "title icon";
		grid-gap: 10px;
		padding: 10px;
		align-items:center;
		text-align: left;
		justify-content: center;
		height:50vmin;

	}



/*CONTENT FORMATTING*/	
	.content_title{
	font-family: 'Union Regular';
	font-weight: 100;
	 position:sticky;
	 font-size:6vw;
	
	}
	
	.content_icon{
	width: 25vw;
	}
	
	.content_wrapper{
		max-width: 100%;
		padding:0px;
		text-align:center;
	}
	.content_grid_one-column{
		display:grid;
		grid-template-columns: 1fr ;
		grid-gap: 0px;
		padding: 0px;
		align-items:center;
		text-align:center;
		overflow: hidden;
		width:75%;
		padding-top:10vh;
	}

	.content_grid_two-columns{
		display:grid;
		grid-template-columns: 1fr 1fr ;
		grid-gap: 5vw;
		padding: 0px;
		overflow: hidden;
		align-content: flex-end;
		width:75%;
		margin:auto;
		padding-top:10vh;

	}
	.content_grid_four-columns{
		display:grid;
		grid-template-columns: 1fr 1fr 1fr ;
		grid-gap: 5vw;
		padding: 5vw;
		align-items:center;
		text-align:center;	
		width:75%;
		padding-top:10vh;
	
	}	
	.content_img_margin{
		grid-area:content_img_margin;
		max-width:75%;
		margin: auto;
		padding-top:10vh;
	
	}
	
	.content_img{
		grid-area:content_img;
		max-width:75%;
		min-width: 100%;
		margin: auto;
		
	}
	
	.content_img_portrait{
		grid-area:content_img;
		width:35vw;
		max-width:75vw;
		min-width: 50vw;
		
	}
	.content_img_bleed{
		grid-area:content_img_bleed;
		width:100vw;
		float:right;
		margin: auto;
		margin-bottom: 10vh;
		padding-top:10vh;
	
	}
	
	
	
		
	}
	.content_text{
		font-size: 2vw;
		font-family: 'Union Regular';	
		color:black;
		text-decoration: none;
		max-width: 50%;
		margin: auto;
		padding-top:10vh;
		padding-bottom: 5vh;
		}
	
	.content_text_100{
		font-size: 2vw;
		font-family: 'Union Regular';	
		color:black;
		text-decoration: none;
		max-width: 100%;
		margin: auto;
		padding-top:2vh;
		padding-bottom: 5vh;
		}
	
	.content_text_p{
		-webkit-column-count: 1; /* Old Chrome, Safari and Opera */
  		-moz-column-count: 1; /* Old Firefox */
		column-count: 1;
		text-align: left;
		font-size: 2vw;
		font-family: 'Union Regular';
		max-width:70%;
		margin:auto;
		padding-top:2vh;
		padding-bottom: 5vh;
	}

	.content_subtitle{
		font-size: 2vw;
		font-family: 'Union Regular';	
		color:black;
		text-decoration: underline;
		max-width: 70%;
		margin: auto;
		padding-top:5vh;
		padding-bottom: 5vh;
		text-align: left;
		}
		
	.nav_arrow_right{
		position:fixed; 
		top:45%; 
		right:40px;
		width:11vh;
		}
		
	.nav_arrow_left{
		position:fixed; 
		top:45%; 
		left:40px;
		width:11vh;
		}
	
	.nav_x{
		position:fixed; 
		background-image:url("../img/Xb.png");
		top:85vh; 
		left:48vw;
		width:4vw;
		height: 4vw;
		background-position: center;
 		background-repeat: no-repeat; 
  		background-size: cover;
		}
	.nav_x:hover{
		position:fixed; 
		background-image:url("../img/X.png");
		top:85vh; 
		left:48vw;
		width:4vw;
		height: 4vw;
		background-position: center;
 		background-repeat: no-repeat; 
  		background-size: cover;
		}
				
	.project_facts{
	
		font-family:'Union Regular';	
		font-weight: 100;  
		font-size:2vw; 
		padding-bottom: 150px;
	}
	
}