/*
teal: #339999
dark teal: #006666
light teal: #70D0CF
pale blue: #BFFCFB
orange: #FF8749
grey: #333
light grey: #666


*/

body {
	margin:0;
	padding:0;
	font-family: "Bodoni Moda", serif;
  font-optical-sizing: auto;
  font-style: normal;
  background-color:black;
  color:#fff;
}

/*Begin media queries*/

@media screen and (max-width: 1024px) {
	#globalnav li {
		float:none;
		clear:both;
		text-align:center;
		box-sizing:border-box;
	}

	#subheadline {
		text-align:center;
		width:100%;
		font-size:1.6em;
	}

	div#logo {
		width:100%;
		margin:16px 8px;
		text-align: center;
	}

	div#logo img {
		width:85%;
		height:85%;
	}

	#globalnav {
		width:100%;
		text-align:center;
	}

	#globalnav li.home_icon {
		width:100%;
		text-align:center;
	}

	#globalnav li.home_icon img {
		width:25px;
		height:25px;
	}

	#mobile_montage {
		display:block;
	}

}

@media screen and (min-width:1024px) {
	#subheadline {
		text-align:left;
		width:50%;
		font-size:1.8em;
	}

	div#logo {	
		width:25%;
		margin:16px 8px;
		float:left;
	}

	div#logo img {
		width:110%;
		height:110%;
	}

	#globalnav {
			width:fit-content;
	}

	#globalnav li {
		float:left;
		box-sizing:border-box;
	}

	#globalnav li.home_icon img {
			width:22px;	
	}

	#mainnav {
		width:fit-contents;
		float:right;
	}

	#hero {
		background-image:url('images/montage_bubbles.png');
		background-size:50%;
		background-position:right;
		background-repeat:no-repeat;
	}

	#mobile_montage {
		display:none;
	}

}	

/*End media queries*/

header {
	margin:22px auto 2em auto;
	width:75%;
}

#masthead > h1 {	
	display:none;
}

#hero, #pagecontent {
	width:75%;
	font-size:1.2em;
	color:#fff;
	padding:22px;
	margin:0 auto 0 auto;
}

#pagecontent h2 {
	color:#FF8749;
	font-size:1.4em;
}

#pagecontent ul {
	margin:0 auto 0 auto;
	list-style-position:inside;
	line-height:1.7em;
}

#pagecontent ul > li {
	padding:.8em 0 .8em 0;
}

#pagecontent ul > li > strong {
	color:#70D0CF;
}

#hero {
	margin-top:22px;

}

#mobile_montage {
	clear:both;
	width:75%;
}

#mobile_montage {
	width:auto;
	margin:22px auto 16px auto;
}

#mobile_montage img {
	width:100%;
}

#subheadline {
	color:#339999;
	line-height:1.4em;
	}

#mission p {
	margin-top:32px;
	margin-bottom:32px;
	line-height: 1.6em;
}

.spacer {
	clear:both;
	height:3em;
}

.highlight {
	color:#FF8749;
	font-weight:bold;
}

/*Standard link styles*/
a:link {
	color:#FF8749;
}

a:visited {
	color:#f2f2f2;
}

a:hover,a:active {
	color:#fff;
}

#globalnav {
	list-style-type:none;
	padding:0;
	margin:0;

	margin-top:22px;
}

#globalnav li {
	padding:5px 16px 5px 16px;
	font-size:1.2em;
	box-sizing:border-box;
	border-bottom: 3px solid transparent;


}

#globalnav li.home_icon {
	float:left;
	padding:8px 8px 5px 8px;
	font-size:1.2em;
	box-sizing:border-box;

}


/*Global nav styling and links*/
#globalnav li:hover, 
#ourstory .ourstory,
#solutions .solutions,
#contact .contact,
#projects .project,
#home .home 
{
	border-bottom:3px solid #FF8749;
}

#globalnav li a:link {
	color:#fff;
	text-decoration:none;
}

#globalnav li a:visited {
	color:#f2f2f2;
}

#globalnav li a:hover, a:active {
	color:#FF8749;
}



/*End global nav*/

.clear {
	clear:both;
}

/*Icon grids*/
#icons {
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(125px, 1fr));
    gap: 15px; /* Adds space between the tiles */
}

#icons > .icon {
	box-sizing:fit-content;
}

#icons > .icon img {
	width:125px;
	height:125px;
	margin-left:auto;
	margin-right:auto;
	display:block;
}

/*Subpage styling*/

#subpage_hero {
	width:75%;
	margin:0 auto 0 auto;
}

#subpage_hero_image {
	width:auto;
}

#subpage_hero_image img {
	width:100%;
}

/*Footer*/

#mainfooter {
	width:70%;
	margin-left:auto;
	margin-right:auto;
	margin-top:22px;
	margin-bottom:22px;
	box-sizing:border-box;
	padding:22px;
	text-align:center;
}

a.linkedin img {
	width:45px;
	height:45px;
}