@charset "UTF-8";
@import url("fonts.css");

<style>

/* common styles */
	html {
		height: 100%;
		}

	body {
		display: flex;
		flex-direction: column;
		height: 98vh; /* Avoid the IE 10-11 `min-height` bug. */
		font-family: "montserrat_alternatesregular", "Trebuchet MS", Geneva, sans-serif;
		}

	* {
		box-sizing: border-box;
		}

	.content {
		flex: 1 0 auto; /* Prevent Chrome, Opera, and Safari from letting these items shrink to smaller than their content's default minimum size. */
		}

	#logopng {
		max-width:40vw; height:auto;
		}

	a {
		text-decoration: none;
		color: #000;
		}



 /*nav bar div*/
	.topnav {
		overflow: hidden;
		padding-left: 20px;
		padding-right: 10px;
		padding-top: 10px;
		height:175px;
		}
		
		
/*large screen menu*/
	.topnav a {
		float: right;
		display: block;color: #000;
		text-align: center;
		padding:50px 6px;
		text-decoration:none;
		font-size: 18px;
		font-family: "montserrat_alternatesmedium";
		}

/*hambuger menu icon hidden*/
	.topnav .icon {
		display: none;
		}

/*set screen width for menu switch*/
@media screen and (max-width: 720px) {
  
	.topnav a:not(:first-child){
		display: none;
		}
	.topnav a.icon {
		padding: 4px 5px;
		display: inline;
		}

	.topnav {
		overflow: hidden; 
		padding-left: 20px;
		padding-right: 10px;
		padding-top: 5px;
		height:130px;
		}

/*show hamburger menu */
	.topnav.responsive .icon {
		position: relative;
		top: -50px;
		}
		
/*small screen menu text*/  
	.topnav.responsive a {
		position: relative;
		top:-50px;
    	float: none;
   	 	display: block;
    	text-align: right;
		padding: 1px 5px;
		font-size:14px;
		font-family: "montserrat_alternatesmedium"
		}

}


/*headlines*/
	.headline {
		margin-left: auto;
		margin-right:auto;
    	width: 90%;
    	padding: 10px;
		z-index: -1;
		position: relative;
		font-size: calc(5px + 4vw);
		font-weight: 400;
		text-align: center;
		z-index: -1;
		font-family: "montserrat_alternatessemibold";	
		}
	
	.subhead {
		position: relative;
		font-size: calc(5px + 3vw);
		font-weight: 400;
		text-align: center;
		}


/*footer*/
	.footer {
		position:relative;
   		padding-top:25px;
		padding-bottom:10px;
   		width: 95%;
   		margin:auto;
   		text-align: right;
		}

	#social {
		padding: 6px;
		font-size: 20px;
		width:32px;
		text-align: center;
		text-decoration: none;
		margin: 2px 3px;
		border-radius: 40%;
		color: white;
		background-color: #55088c;
		}


	.fa:hover {
		opacity: 0.7;
		}




/***************************************/
/* idiviual page styles */
/***************************************/

/*main page style*/

  
	
    	



/***************************************/

/*tech page style*/

<style>
/* tech page styles */
/* rows containing 2 columns */
	.techrow {
		width: 90%;
		position: relative;
		margin-left: auto;
		margin-right: auto;
		}

	#techrow1  {
		padding-top:10px;
		}


/* Create two equal columns that floats next to each other */
	.techcolumn {
		float:left;
		width: 50%;
		text-align:center;
		padding-bottom:20px;
		}

/* Clear floats after the columns */
.techrow:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 720px) {
  .techcolumn {
    width: 100%;
  }
}


.section {
	font-size: calc(12px + 2.5vw);
}
.techlist {
	padding-top:5px;
	font-size: calc(12px + 1vw);
	text-transform: lowercase;
	color: #000;
}
#techrow3 {
	font-size: calc(12px + 1vw);
	text-transform: lowercase;
	text-align: center;
	padding-top: 20px;
}
   
</style>
   



/***************************************/





/*onset style*/

@media screen and (max-width: 720px) {
#onsetmaintext {
	position: relative;
	font-size: 5vw;
	text-align: center;

}
  #onsetmaintext2 {
	position: relative;
	font-size: 3.5vw;
	text-align: center;
  	
}
}

/***************************************/

</style>/* CSS Document */