@charset "utf-8";
		body{
			
			margin:0; 
			background-repeat: repeat;
   			background-image: url("../images/spiral_pattern_expanded_space.png");
		}
		.container{
			
			width:100vw;
			height:100vh;
		
			font-family: Arial, sans-serif;
			font-size: 20px;
			
			display: grid;
			padding:10px; 
			grid-template-columns: repeat(27, 1fr);
			grid-template-rows: 50px 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 50px; /*Get rid of last 20 1frs if problems occur*/
		}
		.container div{
			
			padding: 10px;
			
		}

		.logobox{
			
			/*padding-top: 56.25%;*/
			min-width: 100px;
			max-width: 150px; 
			/*height: 100px;*/
			grid-column-start: 1; 
			grid-column-end: 10; 
			
			grid-row-start: 1;
			grid-row-end: 3;
		}
		#logo{
			
			max-width: 100%;
			height:auto; 
		}

		.nav{
			
			display:inline;
			padding-top: 56.25%;
			position: relative;
			/*width: 1000px;*/
			/*height: 10px; */
			grid-column-start:15;
			grid-column-end:23;
			
			grid-row-start: 1;
			grid-row-end: 2;
		}
		.nav #myLinks{
			
			display:none;
			justify-content:space-between;
			 
			
		}
		.nav #myLinks a {
			
			color: #3c58a7;
			font-weight:bold;
		}
		.nav a.icon{
  					
				background: black;
  				display: none;
  				position: absolute;
  				right: 0;
  				top: 0;
		}
		
		
		.nav a:hover{
  				
			background-color: #ddd;
  			color: black;
		}
		.active{
  				
			background-color: #04AA6D;
  			color: white;
		}
		
		#facebook, #instagram, #twitter, #youtube, #behance{
			
			color: #282560; 
		}
		#button{
			
			background-color:#3c58a7; 
			padding: .75vw 1vw;
			border-radius:6px; 
		}
	
		.name{
			
			/*padding-top: 56.25%;*/
			/*position: relative;*/
			display:flex;
			justify-content:center;
			align-items:center;
			
			width: 50vw;
			height: 10px;
			grid-column-start:9;
			grid-column-end:19;
			
			grid-row-start: 10;
			grid-row-end:12; 
		}
		/*#img_zoom{
	
			width:100%;
			height:auto; 
		}*/
		.occupation{
			
			/*padding-top: 56.25%;*/
			/*position: relative;*/
			display:flex;
			justify-content:center;
			align-items:center;
			
			width: 50vw;
			height: 10px;
			grid-column-start:9;
			grid-column-end:19;
			
			grid-row-start: 13;
			grid-row-end:14; 
		}
		#andrew_rodenhiser, #subheading, #collaborated{
	
			text-align: center;
	
		}
		.headlinebox{
			
			/*padding-top: 56.25%;*/
			/*position: relative;*/
			display:flex;
			justify-content:left;
			align-items:baseline;
			
			width: 50vw;
			height: 10px;
			grid-column-start:4;
			grid-column-end:19;
			
			grid-row-start: 13;
			grid-row-end:15; 
		}
		#headline{
				
			text-align: left; 
	
		}
		.imagebox{
			
			display: flex;
			justify-content: center;
			align-items:center;
			
			min-height: 400px;
			max-height:700px;
			overflow:hidden;
			
			
			grid-column-start:9;
			grid-column-end:19;
			
			grid-row-start:15;
			grid-row-end:23;
			
			
		}
		#infobox, #infobox-tabs{
	
			display: block;
			justify-content: left;
			align-items:left;
			
			min-height: 1100px;
			max-height:1300px;
			overflow:hidden;
			
			
			grid-column-start:4;
			grid-column-end:22;
			
			grid-row-start:17;
			grid-row-end:25;
		}

		#main_image{
			
			width: 100%;
			height: auto;
		}

	video{
	
		cursor: pointer; 
	}

	#lightbox{
	
		position:fixed; 
		z-index: 1000;
		top:0; 
		width:100%;
		height:100%;
		background-color:rgba(0,0,0, .8);
		display: none; 
	}
	#lightbox.active{
	
		display:flex;
		justify-content:center;
		align-items:center;
	
	}
/*.content{
	
	height:400px;
	width:700px;
	overflow:hidden;
	position:relative;
	
	
}*/
.content .images{
	
	height:100%;
	width:100%;
}
.content .slide{
	
	position:absolute;
	top:50%;
	transform: translateY(-50%);
	border: 4px solid #27275f;
	height:45px;
	width:45px;
	cursor:pointer; 
	background:rgba(255,255,255, 0.1);
	
}
.content .slide:hover{
	
	background:rgba(255,255,255, 0.2);
}
.slide span{
	
	font-size:35px;
	color:#27275f;
	line-height:41px;
}
.content .left{
	
	left:7%;
}
.content .right{
	
	right:14%;
}
.images img{
	
	height:100%;
	width:100%;
	
}
		.image-grid div, .image-grid_v2 div .image-grid_one_image div{
	
			padding: 10px;
			/*border: 1px solid black;*/
			margin-right:5vw;
	 
		}

		.image-grid div img, .image-grid_v2 div img, .image-grid_one_image div img{
	
			width:10vw;
			height:auto; 
			cursor:pointer; 
		}

		.collaboratebox{
			
			grid-column-start:9;
			grid-column-end:19;
			
			grid-row-start:24;
			grid-row-end:25; 
		}
		.facbox{
			
			min-width: 50px;
			max-width:100px; 
			
			grid-column-start:10;
			grid-column-end:13;
			
			grid-row-start: 26;
			grid-row-end:28; 
		}
		.libox{
			
			min-width: 50px;
			max-width:100px; 
			
			grid-column-start: 13;
			grid-column-end: 16; 
			
			grid-row-start: 26;
			grid-row-end:28; 
			
		}
		.ccsbox{
			
			min-width: 50px;
			max-width:75px; 
			
			grid-column-start: 16;
			grid-column-end:19;
			
			grid-row-start:26;
			grid-row-end:28; 
		}
				
				
		.footer{
			
			grid-column-start:1;
			grid-column-end:28;
			
			grid-row-start: 31;
			grid-row-end: 33;
			
			background-color: #27275f; 
			color: white;
		}
		
		@media all and (min-width: 1px) and (max-width: 367.9px)
		{
			
			#andrew_rodenhiser{
				
				font: bold 8vw Arial, sans-serif; 
			}
			#subheading{
				
				font: 3.5vw Arial, sans-serif;
			}
			ul li{
				
				list-style: none;
				display:block;
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 2.7vw Arial, sans-serif; 
			}
			#headline{
				
				font: bold 2.8vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 2.5vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:10vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(4,1fr); 
		
			}
			.image-grid_v2{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(2,1fr); 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:5vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-205%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:3%;
			}
			#tapon{
				
				font: 2.2vw Arial, sans-serif; 
			}
			#video{
				
				width:60px;
				height:40px; 
			}
			#info, #info_branding{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw;   
			}
			#aboutinfo{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw;
				margin-top:12vw;
				margin-bottom:-5vw; 
			}
			
			#collaborated{
				
				font: 3.25vw Arial, sans-serif;
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-15vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-15vw; 
				
			}
			#ccs{
			
				width:125%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-10vw;
			}
		}
		@media all and (min-width: 368px) and (max-width: 389.9px)
		{
			#logo{
				
				width:100%;
				height:auto; 
			}
			.nav{
			
				display:inherit;
				padding-top: 56.25%;
				position: relative;
				/*width: 1000px;*/
				/*height: 10px; */
				grid-column-start:15;
				grid-column-end:23;
			
				grid-row-start: 1;
				grid-row-end: 5;
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 2.7vw Arial, sans-serif; 
			}
			#andrew_rodenhiser{
				
				font: bold 8vw Arial, sans-serif; 
				margin-top: 55vw;  /*was 35vw before*/
				/*margin-left:0vw;*/
				
			}
			#subheading{
				
				font: 3.5vw Arial, sans-serif;
				margin-top: 50vw; 
				/*margin-left:0vw;*/
			}
			ul li{
				
				list-style: none;
				display:block;
			}
			#main_image{
				
				width:80%;
				height:auto; 
				/*margin-left:-25vw;*/
			}
			#video{
				
				width:70px;
				height:50px; 
			}
			#headline{
				
				font: bold 2.8vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 2.5vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:10vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(4,1fr); 
		
			}
			.image-grid_v2{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(2,1fr); 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:5vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-205%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:3%;
			}
			#tapon{
				
				font: 2.2vw Arial, sans-serif; 
			}
			#info, #info_branding{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw;
			}
			#aboutinfo{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw;
				margin-top:12vw;
				margin-bottom:-5vw; 
			}
			#collaborated{
				
				font: 3.25vw Arial, sans-serif;
				margin-top:-22vw;
			/*	margin-left:0vw; */
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-15vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-15vw; 
				
			}
			#ccs{
			
				width:125%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-10vw;
			}
		}
		@media all and (min-width: 390px) and (max-width: 484.9px)
		{
			#logo{
				
				width:100%;
				height:auto; 
			}
			.nav{
			
				display:inherit;
				padding-top: 56.25%;
				position: relative;
				/*width: 1000px;*/
				/*height: 10px; */
				grid-column-start:15;
				grid-column-end:23;
			
				grid-row-start: 1;
				grid-row-end: 5;
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 4vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:8vw; 
				margin-left:-5.5vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#andrew_rodenhiser{
				
				font: bold 16vw Arial, sans-serif;
				margin-top: 55vw;  /*was 35vw before*/
				margin-left:-15vw;
				
			}
			#subheading{
				
				font: 3.5vw Arial, sans-serif; 
				margin-top: 70vw; /*was 50 before*/ 
				margin-left:-15vw;
			}
			ul li{
				
				list-style: none;
				display:block;
				font: 4vw Arial, sans-serif;
				margin-left:-5vw; 
			}
			#main_image{
				
				width:160%;
				height:auto; 
				margin-left:-25vw;
				margin-top:15vw;
			}
			#video{
				
				width:85px;
				height:65px; 
			}
			#headline{
				
				font: bold 5.4vw Arial, sans-serif; 
				margin-top:12vw; 
			}
			#subheadline{
				
				font: bold 5.1vw Arial, sans-serif;
			}
			.image-grid{
	
				width:10vw;
				height:30vh;
		
				font: 20px Arial, sans-serif;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(4,1fr); 
		
			}
			.image-grid_v2{
	
				width:10vw;
				height:15vh;
		
				font: 20px Arial, sans-serif;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-4vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:5vh;
		
				font: 20px Arial, sans-serif;
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-4vw;
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-205%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:3%;
			}
			#tapon{
				
				font: 3.5vw Arial, sans-serif; 
			}
			#info, #info_branding{
				
				font: 2.6vw Arial, sans-serif;
				line-height:3.9vw; 
				margin-top:12vw;
				 
			}
			#aboutinfo{
				
				font: 2.3vw Arial, sans-serif;
				line-height:3.7vw;
				margin-top:12vw;
				margin-bottom:-7vw; 
			}
			#collaborated{
				
				font: 3.25vw Arial, sans-serif; 
				margin-top:-12vw;
				margin-left:-15vw; 
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-15vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-15vw; 
				
			}
			#ccs{
			
				width:100%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-7vw;
			}
			.footer{
				font: 2.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 485px) and (max-width: 499.9px)
		{
			#logo{
				
				width:75%;
				height:auto; 
			}
			.nav{
			
				display:inherit;
				padding-top: 56.25%;
				position: relative;
				/*width: 1000px;*/
				/*height: 10px; */
				grid-column-start:15;
				grid-column-end:23;
			
				grid-row-start: 1;
				grid-row-end: 5;
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 4vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:8vw; 
				margin-left:-5.5vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#andrew_rodenhiser{
				
				font: bold 8vw Arial, sans-serif; 
				margin-top: 55vw;  /*was 35vw before*/
				margin-left:-15vw;
				
			}
			#subheading{
				
				font: 3.5vw Arial, sans-serif;
				margin-top: 70vw; /*was 50 before*/ 
				margin-left:-15vw;
			}
			ul li{
				
				list-style: none;
				display:block;
				font: 4vw Arial, sans-serif; 
				margin-left:-5vw; 
			}
			#main_image{
				
				width:70%;
				height:auto; 
				margin-left:-25vw;
				margin-top:15vw;
			}
			#video{
				
				width:80px;
				height:60px; 
			}
			#headline{
				
				font: bold 5.4vw Arial, sans-serif; 
				margin-top:12vw; 
			}
			#subheadline{
				
				font: bold 5.1vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:10vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(4,1fr); 
		
			}
			.image-grid_v2{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-4vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:5vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-4vw; 
		
			}
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-205%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:3%;
			}
			#tapon{
				
				font: 3.5vw Arial, sans-serif; 
			}
			#info, #info_branding{
				
				font: 2.9vw Arial, sans-serif; 
				line-height:3.9vw; 
				margin-top:12vw;
				 
			}
			#aboutinfo{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw;
				margin-top:12vw;
				margin-bottom:-7vw; 
			}
			#collaborated{
				
				font: 3.25vw Arial, sans-serif;
				margin-top:-12vw;
				margin-left:-15vw; 
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-15vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-15vw; 
				
			}
			#ccs{
			
				width:100%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-7vw;
			}
			.footer{
				font: 2.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 500px) and (max-width: 575.9px)
		{
			#logo{
				
				width:60%;
				height:auto; 
			}
			.nav{
			
				display:inherit;
				padding-top: 56.25%;
				position: relative;
				/*width: 1000px;*/
				/*height: 10px; */
				grid-column-start:15;
				grid-column-end:23;
			
				grid-row-start: 1;
				grid-row-end: 5;
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 3.2vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-9vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#andrew_rodenhiser{
				
				font: bold 8vw Arial, sans-serif; 
				margin-top: 35vw;  /*was 35vw before*/
				
			}
			#subheading{
				
				font: 3.5vw Arial, sans-serif;
				margin-top: 40vw; /*was 50 before*/ 
			}
			ul li{
				
				list-style: none;
				display:block;
				font: 3.5vw Arial, sans-serif;
				line-height:5vw; 
			}
			#myLinks{
				
				margin-left:7.5vw; 
				margin-top:5vw; 
			}
			#main_image{
				
				width:80%;
				height:auto; 
			}
			#video{
				
				width:90px;
				height:70px; 
			}
			#headline{
				
				font: bold 3.8vw Arial, sans-serif; 
				margin-left:4vw; 
			}
			#subheadline{
				
				font: bold 3.5vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:10vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(4,1fr); 
		
			}
			.image-grid_v2{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr);
				
				margin-left:-3.5vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:5vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-3.5vw; 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-205%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:3%;
			}
			#tapon{
				
				font: 2.7vw Arial, sans-serif; 
			}
			#info, #aboutinfo{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:4vw; 
			}
			#info_branding{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:0vw; 
			}
			#infobox-tabs{
				
				margin-left:4vw; 
			}
			#collaborated{
				
				font: 3.25vw Arial, sans-serif;
				margin-top:-12vw;
			}
			#fac{
				
				width:110%;
				height:auto; 
				margin-top:-4vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:90%;
				height:auto; 
				margin-top:-5vw; 
				margin-left:2.5vw;
			}
			.footer{
				font: 2.25vw Arial, sans-serif; 
			}
		}
	
		@media all and (min-width: 576px) and (max-width: 627.9px)
		{
			#logo{
				
				width:60%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 6vw Arial, sans-serif; 
				margin-top:30vw; /*was 10vw before*/
			}
			#subheading{
				
				font: 4vw Arial, sans-serif;
				margin-top:38vw;  /*was 18vw before*/
			}
			ul li{
				
				list-style: none;
				display:block;
				line-height:5vw; 
				font: 3.5vw Arial, sans-serif; 
			}
			#myLinks{
				
				margin-left:9vw; 
				margin-top:5vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 3vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-8vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#main_image{
				
				width:100%;
				height:auto; 
				margin-top:20vw;
			}
			#video{
				
				width:110px;
				height:90px; 
			}
			#headline{
				
				font: bold 3.8vw Arial, sans-serif; 
				margin-left:2vw;
			}
			#subheadline{
				
				font: bold 3.5vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(4,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(6, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-3vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-3vw;
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-200%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:5%;
			}
			.content .right
			{
				right:5%;
			}
			#tapon{
				
				font: 2.5vw Arial, sans-serif; 
			}
			#info, #aboutinfo{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:2vw; 
			}
			#info_branding{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:0vw; 
			}
			#infobox-tabs{
				
				margin-left:2vw; 
			}
			#collaborated{
				
				font: 3.25vw Arial, sans-serif;
			}
			#fac{
				
				width:100%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-105vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:75%;
				height:auto; 
				margin-top:-9vw; 
				margin-left:5vw;
			}
			.footer{
				font: 2.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 628px) and (max-width: 726.9px)
		{
			#logo{
				
				width:60%;
				height:auto;
			}
			#andrew_rodenhiser{
				
				font: bold 6vw Arial, sans-serif; 
				margin-top:32vw; /*was 12vw before*/
			}
			#subheading{
				
				font: 3.5vw Arial, sans-serif;
				margin-top:40vw; /*was 20vw before*/
			}
			ul li{
				
				list-style: none;
				display:block;
				line-height:4.5vw; 
			}
			#myLinks{
				
				margin-left: 12vw; 
				margin-top:5vw;
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 2.8vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-7vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#main_image{
				
				width:80%;
				height:auto; 
				margin-top:20vw;
			}
			#video{
				
				width:120px;
				height:100px; 
			}
			#headline{
				
				font: bold 3.4vw Arial, sans-serif; 
				margin-left:2vw; 
			}
			#subheadline{
				
				font: bold 3.1vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(4,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(6, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-3vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-3vw; 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-100%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:5%;
			}
			.content .right
			{
				right:5%;
			}
			#tapon{
				
				font: 2.3vw Arial, sans-serif; 
			}
			#info, #aboutinfo{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:2vw; 
			}
			#info_branding{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:0vw; 
			}
			#infobox-tabs{
				
				margin-left:2vw; 
			}
			#collaborated{
				
				font: 3vw Arial, sans-serif;
			}
			#fac{
				
				width:80%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:150%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:75%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:2.5vw;
			}
			
			.footer{
				font: 2.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 727px) and (max-width: 749.9px)
		{
			#logo{
				
				width:60%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 5vw Arial, sans-serif; 
				margin-top: 15vw;
			}	
			#subheading{
				
				font: 2.5vw Arial, sans-serif;
				margin-top: 23vw;
			}
			ul li{
				
				list-style: none;
				display:block;
				margin-left:15vw;
				line-height:3.75vw; 
			}
			#myLinks{
				
				margin-top:2vw; 
				margin-left:2vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 2.8vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-21vw; 
			}
			#main_image{
				
				width:75%;
				height:auto; 
			}
			#video{
				
				width:110px;
				height:90px; 
			}
			#headline{
				
				font: bold 3.4vw Arial, sans-serif; 
				margin-left:2vw;
			}
			#subheadline{
				
				font: bold 3.1vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:20vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-2.5vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-2.5vw; 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-70%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:5%;
			}
			.content .right
			{
				right:5%;
			}
			#tapon{
				
				font: 2.3vw Arial, sans-serif; 
			}
			#info, #aboutinfo{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:2vw;
			}
			#info_branding{
				
				font: 2.3vw Arial, sans-serif; 
				line-height:3.7vw; 
				margin-left:0vw;
			}
			#infobox-tabs{
				
				margin-left:2vw; 
			}
			#collaborated{
				
				font: 2vw Arial, sans-serif;
				margin-top:-8vw; /*was -6vw before*/ 
			}
			#fac{
				
				width:90%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:150%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:95%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:2.5vw;
			}
			.footer{
				
				margin-top:10vw;
				font: 2.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 750px) and (max-width: 773.9px)
		{
			#logo{
				
				width:60%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 5vw Arial, sans-serif; 
				margin-top: 15vw;
			}	
			#subheading{
				
				font: 2.5vw Arial, sans-serif;
				margin-top: 23vw;
			}
			ul li{
				
				list-style: none;
				display:block;
				margin-left:15vw; 
				line-height:3.75vw; 
			}
			#myLinks{
				
				margin-top:2vw;
				margin-left:2vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 2.5vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:.01vw; 
				margin-left:-21vw; 
			}
			#main_image{
				
				width:55%;
				height:auto; 
			}
			#video{
				
				width:115px;
				height:95px; 
			}
			#headline{
				
				font: bold 3.0vw Arial, sans-serif; 
				margin-left:2vw; 
			}
			#subheadline{
				
				font: bold 2.7vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:20vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(3, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-2.5vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr);
				
				margin-left:-2.5vw; 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-70%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:5%;
			}
			.content .right
			{
				right:7%;
			}
			#tapon{
				
				font: 2vw Arial, sans-serif; 
			}
			#info, #aboutinfo{
				
				font: 1.9vw Arial, sans-serif; 
				line-height:3.2vw;  
				margin-left:2vw; 
			}
			#info_branding{
				
				font: 1.9vw Arial, sans-serif; 
				line-height:3.2vw;  
				margin-left:0vw; 
			}
			#infobox-tabs{
				
				margin-left:2vw; 
			}
			#collaborated{
				
				font: 2vw Arial, sans-serif;
				margin-top:-8vw; /*was -6vw before*/ 
			}
			#fac{
				
				width:90%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:150%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:95%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:2.5vw;
			}
			.footer{
				
				margin-top:10vw;
				font: 2.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 774px) and (max-width: 868.9px)
		{
			#logo{
				
				width:60%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 4vw Arial, sans-serif; 
				margin-top:15vw; /*was 5vw before*/
			}	
			#subheading{
				
				font: 2.25vw Arial, sans-serif;
				margin-top:15vw; /*was 0 before*/
			}
			ul li{
				
				list-style: none;
				display:block;
				line-height:3.25vw; 
			}
			#myLinks{
				
				margin-left:18vw; 
				margin-top:3vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 2.4vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-6vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#main_image{
				
				width:75%;
				height:auto; 
			}
			#video{
				
				width:120px;
				height:100px; 
			}
			#headline{
				
				font: bold 2.8vw Arial, sans-serif; 
				margin-left:2vw;
			}
			#subheadline{
				
				font: bold 2.5vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:20vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-2.5vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-2.5vw; 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-100%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:5%;
			}
			.content .right
			{
				right:7%;
			}
			#tapon{
				
				font: 1.9vw Arial, sans-serif; 
			}
			#info, #aboutinfo, #info_branding{
				
				font: 1.9vw Arial, sans-serif; 
				line-height:3vw;
				margin-top:3vw;
				margin-left:2vw;
			}
			#info_branding{
				
				font: 1.9vw Arial, sans-serif; 
				line-height:3vw;
				margin-top:3vw;
				margin-left:0vw;
			}
			#infobox-tabs{
				
				margin-left:2vw; 
			}
			#collaborated{
				
				font: 2.25vw Arial, sans-serif;
			}
			#fac{
				
				width:100%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:160%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:105%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:2.5vw;
			}
			.footer{
				font: 1.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 869px) and (max-width: 991.9px)
		{
			#logo{
				
				width:75%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 4.2vw Arial, sans-serif; 
				margin-top:15vw; /*was 0 before*/
				
			}	
			#subheading{
				
				font: 2.5vw Arial, sans-serif;
				margin-top:15vw; /*was 0 before*/
			}
			ul li{
				
				list-style: none;
				display:block;
				line-height:3.25vw; 
			}
			#myLinks{
				
				margin-left:18vw; 
				margin-top:3vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 2.0vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-5vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#main_image{
				
				width:75%;
				height:auto; 
				margin-top:5vw; /*was 0 before*/
			}
			#video{
				
				width:130px;
				height:110px; 
			}
			#headline{
				 
				font: bold 2.5vw Arial, sans-serif;
				margin-left:2vw;
			}
			#subheadline{
				
				font: bold 2.2vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:20vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-2vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-2vw; 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-100%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:9%;
			}
			#tapon{
				
				font: 1.5vw Arial, sans-serif; 
			}
			#info, #aboutinfo{
				
				font: 1.8vw Arial, sans-serif; 
				line-height:2.8vw;
				margin-top:2vw;
				margin-left:2vw;
			}
			#info_branding{
				
				font: 1.8vw Arial, sans-serif; 
				line-height:2.8vw;
				margin-top:2vw;
				margin-left:0vw;
			}
			#infobox-tabs{
				
				margin-left:2vw; 
			}
			#collaborated{
				
				font: 2vw Arial, sans-serif;
			}
			#fac{
				
				width:100%;
				height:auto; 
				margin-top:-5vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:160%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:105%;
				height:auto; 
				margin-top:-5vw; 
				margin-left:2.5vw;
			}
			.footer{
				font: 1.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 992px) and (max-width: 1032.9px)
		{
			#logo{
				
				width:75%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 4.2vw Arial, sans-serif; 
				margin-top:-1vw; 
			}
			#subheading{
				
				font: 2.5vw Arial, sans-serif;
			}
			ul li{
				
				list-style: none;
				display:block;
				font: 2vw Arial, sans-serif; 
				line-height:3vw; 
			}
			#myLinks{
				
				margin-left:20vw; 
				margin-top:3vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 1.9vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-5vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#video{
				
				width:140px;
				height:120px; 
			}
			#headline{
				
				font: bold 2.1vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 1.8vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:20vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-2vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:10vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-2vw; 
		
			}
			
			#lightbox.active img{
	
				display:flex;
				justify-content:center;
				align-items:center;
				width:100%;
				height:auto; 
	
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-50%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:5%;
			}
			.content .right
			{
				right:10%;
			}
			#tapon{
				
				font: 1.4vw Arial, sans-serif; 
			}
			#info, #aboutinfo, #info_branding{
				
				font: 1.6vw Arial, sans-serif; 
				line-height:2.4vw; 
				margin-top:2vw;
			}
			#collaborated{
				
				font: 2vw Arial, sans-serif;
			}
			#fac{
				
				width:100%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:160%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:105%;
				height:auto; 
				margin-top:-5vw; 
				margin-left:2.5vw;
			}
			.footer{
				font: 1.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 1033px) and (max-width: 1199.9px)
		{
			#logo{
				
				width:75%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 4.2vw Arial, sans-serif; 
				margin-top:-1vw; 
			}
			#subheading{
				
				font: 2.5vw Arial, sans-serif;
			}
			ul li{
				
				list-style: none;
				display:block;
				font: 1.7vw Arial, sans-serif; 
				line-height:3vw; 
			}
			#myLinks{
				
				margin-left:22vw; 
				margin-top:3vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 1.8vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-4vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#video{
				
				width:140px;
				height:120px; 
			}
			#headline{
				
				font: bold 2.1vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 1.8vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:40vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-2vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-2vw;
		
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-50%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:14%;
			}
			#tapon{
				
				font: 1.3vw Arial, sans-serif; 
			}
			#info, #aboutinfo, #info_branding{
				
				font: 1.6vw Arial, sans-serif; 
				line-height:2.4vw;
				margin-top:2vw;
			}
			#collaborated{
				
				font: 2vw Arial, sans-serif;
			}
			#fac{
				
				width:100%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:160%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:105%;
				height:auto; 
				margin-top:-5vw; 
				margin-left:2.5vw;
			}
			.footer{
				font: 1.25vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 1200px) and (max-width: 1427.9px)
		{
			#logo{
				
				width:85%;
				height:auto; 
			}
			#andrew_rodenhiser{
				
				font: bold 4.2vw Arial, sans-serif; 
				margin-top:-1vw; 
			}
			#subheading{
				
				font: 2vw Arial, sans-serif;
			}
			ul li{
				
				list-style: none;
				display:block;
				line-height:2.5vw; 
			}

			#myLinks{
				
				margin-left:25vw; 
				margin-top:3vw; 
			}
			.nav a.icon{
  					
				background: black;
  				display: block;
  				position: absolute;
  				right: 0;
  				top: 0;
			}
			#tab{
				
				font: 1.55vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-4vw; 
			}
			#tablist li{
				
				display:inline; 
			}
			#video{
				
				width:140px;
				height:120px; 
			}
			#headline{
				
				font: bold 1.9vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 1.6vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:40vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr);
				
				margin-left:-1.5vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr);
				
				margin-left:-1.5vw; 
		
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-50%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:14%;
			}
			
			#tapon{
				
				font: 1.15vw Arial, sans-serif; 
			}
		
			#info, #aboutinfo, #info_branding{
				
				font: 1.4vw Arial, sans-serif; 
				line-height:2.2vw; 
				margin-top:2vw;
			}
			#collaborated{
				
				font: 1.5vw Arial, sans-serif;
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:-5vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:-5vw; 
				
			}
			#ccs{
			
				width:125%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:2.5vw;
			}
			.footer{
				font: 1vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 1428px) and (max-width: 1499.9px)
		{
			#andrew_rodenhiser{
				
				font: bold 4.2vw Arial, sans-serif; 
				margin-top:-1vw; 
			}
			#subheading{
				
				font: 2vw Arial, sans-serif;
			}
			ul li{
				
				list-style: none;
				display:inline;
			}
			#myLinks{
				
				margin-left:-6vw; 
			}
			.nav #myLinks{
			
				display:block;
				justify-content:space-between;
				word-spacing:0vw; 
			
			}
			#tab{
				
				font: 1.4vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw; 
				margin-left:-3vw; 
			}
			#video{
				
				width:160px;
				height:140px; 
			}
			#headline{
				
				font: bold 1.8vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 1.5vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:40vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:30vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-1.25vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(1,1fr); 
				
				margin-left:-1.25vw; 
		
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-50%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:14%;
			}
			#tapon{
				
				font: 0vw Arial, sans-serif; 
			}
			#info, #aboutinfo, #info_branding{
				
				font: 1.3vw Arial, sans-serif; 
				line-height:2.1vw; 
				margin-top:2vw;
			}
			#collaborated{
				
				font: 1.5vw Arial, sans-serif;
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:0vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:0vw; 
				
			}
			#ccs{
			
				width:125%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:5vw;
			}
			.footer{
				font: .75vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 1500px) and (max-width: 1919.9px)
		{
			#andrew_rodenhiser{
				
				font: bold 4vw Arial, sans-serif; 
				margin-top:-1vw; 
			}
			#subheading{
				
				font: 1.75vw Arial, sans-serif;
			}
			ul li{
				
				list-style: none;
				display:inline;
			}
			#myLinks{
				
				margin-left:-4vw; 
			}
			.nav #myLinks{
			
				display:block;
				justify-content:space-between;
			
			}
			#tab{
				
				font: 1.25vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw;
				margin-left:-2.5vw; 
			}
			#video{
				
				width:160px;
				height:140px; 
			}
			#headline{
				
				font: bold 1.6vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 1.3vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:50vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:40vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr);
				
				margin-left:-1.25vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:15vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-1.25vw; 
		
			}
			.content .slide
			{
				top:50%;
				transform: translateY(-50%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;
			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:14%;
			}
			#tapon{
				
				font: 0vw Arial, sans-serif; 
			}
			#info, #aboutinfo, #info_branding{
				
				font: 1.1vw Arial, sans-serif; 
				line-height:1.8vw; 
				margin-top:2vw;
			}
			#collaborated{
				
				font: 1.25vw Arial, sans-serif;
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:0vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:0vw; 
				
			}
			#ccs{
			
				width:125%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:5vw;
			}
			.footer{
				font: .75vw Arial, sans-serif; 
			}
		}
		@media all and (min-width: 1920px) and (max-width: 9999.9px)
		{
			#andrew_rodenhiser{
				
				font: bold 4vw Arial, sans-serif; 
				margin-top:-1vw;
			}
			#subheading{
				
				font: 1.75vw Arial, sans-serif;
			}

			ul li{
				
				list-style: none;
				display:inline;
			}
			.nav #myLinks{
			
				display:block;
				justify-content:space-between;
				word-spacing:.85vw;
			
			}
			#tab{
				
				font: 1.25vw Arial, sans-serif; 
			}
			#tablist{
	
				word-spacing:1vw;
				margin-left:-2.5vw; 
			}
			#headline{
				
				font: bold 1.5vw Arial, sans-serif; 
			}
			#subheadline{
				
				font: bold 1.2vw Arial, sans-serif; 
			}
			.image-grid{
	
				width:20vw;
				height:50vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(3,1fr); 
		
			}
			.image-grid_v2{
	
				width:20vw;
				height:40vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr);
				
				margin-left:-1vw; 
		
			}
			
			.image-grid_one_image{
	
				width:10vw;
				height:20vh;
		
				font-family: Arial, sans-serif;
				font-size: 20px;
			
				display: grid;
				padding:10px; 
				grid-template-columns: repeat(4, 1fr);
				grid-template-rows: repeat(2,1fr); 
				
				margin-left:-1vw; 
		
			}
			.content .slide{

				top:50%;
				transform: translateY(-50%);
				border: 4px solid #27275f;
				height:45px;
				width:45px;

			}
			.content .left
			{
				left:7%;
			}
			.content .right
			{
				right:14%;
			}
			#tapon{
				
				font: 0vw Arial, sans-serif; 
			}
			#info, #aboutinfo, #info_branding{
				
				font: 1vw Arial, sans-serif; 
				margin-top:2vw;
			}
			#collaborated{
				
				font: 1.25vw Arial, sans-serif;
			}
			#fac{
				
				width:120%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:0vw;
			}
			#lil_i{
				
				width:180%;
				height:auto;
				margin-top:-35vw; 
				margin-left:0vw; 
				
			}
			#ccs{
			
				width:125%;
				height:auto; 
				margin-top:-22vw; 
				margin-left:5vw;
			}
			.footer{
				
				font: .75vw Arial, sans-serif;
				margin-top:1.5vw; 
			}
		}