/* CSS Document */
/*______________________________________________ Layout Styling for desktops */

/*______________________________________________ Global variables*/
:root {
	--hmbar-width: 60px;
	--hmbar-height: 10px;
	--topnavwidth: 100%;
	--topnavheight: 15%;
	--hamburger-gap: 6px;
	--hamburger-margin:10px;
	--background: #08264e;
	--foreground: #ffffff; /* F2F3F4;*/
	--footercolor: #fafafa; /* #e5e4e2;*/
	--white:#00000;

	font-family:Arial, Helvetica, sans-serif;

}

/*{
	text-align: center;
} */

h1 {
		font-size: 3em;
		color: var(--background);
}

h2 {
		font-size: 1.8em;
		color: var(--background);
 }

h3 {
		font-size: 1.5em;
		color: var(--background);
}

p {
		font-size: 16pt;
		color: var(--background);
 }

 a {
		font-weight: bold;
		text-decoration: none;
		color: var(--background);
 }

 img {
	pointer-events: none;  /* these two lines prevent right click on image to get save as */
	-webkit-touch-callout: none;
	
 }


 /*______________________________________________ Start Body Info*/	
 
 body {
	height:100%;
	display: flex;
  	flex-direction: column;
}
/*______________________________________________ End Body Info*/	

/*______________________________________________ Start Header Info*/	

	.top_partition{
		position: fixed;
		top:0;
		left:0;
		right:0;
		width:100%;
		background-color: var(--background);
		z-index: 1;
		height: var(--topnavheight); /* 15% of page*/
		}
	

	.top_partition img {
		display: block;
		margin-left: auto;
  		margin-right: auto; 
		margin-top: auto;
		max-height: 98%; /* this is 98% of the top partition height*/
		width: auto;
		padding-bottom: 3%;
	}
	
/*______________________________________________ End Header Info ****/

/*______________________________________________ Main style Info ****/

main {
	position:relative;
	margin-top: 10%;  /*this value seemed to work. prob need variable*/
	width: 100%;
	flex:1;
	z-index: -1;
	text-align: center;
	/*background-color: yellowgreen;*/
}
main::after {
	content: '';
	display: block;
	height:calc(0.95* var(--topnavheight)); 
	/* Set same as footer's height */
  }
/*______________________________________________ End Main style Info ****/

/*______________________________________________ On Main Page info*/

	.pagetitle {
		align-content: left;
		Width: 80%;
		margin: auto;
	}

	.PageInfo {
		
		/*margin-top: 2%; */
		Width: 80%;
		margin: auto;
		text-align:center;		
	}

	.PageInfo p {
		text-indent: 2%;
	}
/*______________________________________________ On Main Start Content1 */

	.content {		
		Width:60%;	/*center of page*/
		margin-left: 20%;
		margin-right: auto;
		display:flex;
		flex-direction: row;
		flex-wrap: wrap;
		column-count: 2;
	/*	background-color: yellowgreen;*/
		
	}

	.content>.column {
		display:block;
		/*text-align: left;*/
		align-content: center; 
	}
	
	.content>.column p {
		text-align: left;
		align-content: center; 
		margin-left: 10%;
	}

	#imgs {
		width: 60%;
		padding-top: 10%;  /*was10%*/
		padding-bottom: 10%;
		align:middle;
		/*object-position: center;*/
		
		
	}

	.column h3 p a {
		
	}
	
/*______________________________________________ End content ###*/

/*______________________________________________ Start Footer Info ****/

.footer{
	position: absolute;
  	height: var(--topnavheight);
	background-color:var(--footercolor);
}

.pgbottom{
/*	position: fixed;*/ /*this will anchor footer during scrolling- do not delete in case it is needed later along with the top calculation */
	
	left:0;
	right:0;
	width:100%;
	z-index: 1;
	
	/*top:calc(85vh);*/  /*keep in case */
	/*height: var(--topnavheight); /* 15% of page*/ /*keep in case */
}
hr{
	color:var(--background);
	border-top: 2px dotted;
	

}	
.socials{
	display:block;
	flex-direction: row;
	align-items: center;
	text-align: center;
}

.socials img{
	padding-top: 1%;
	margin-inline: 1%;
}

#AMZ{
	width:5%;
}
#YT {
	width:5%;
} 
#TPT {
	width:5%;
}
#IG{
	width:5%;
}
#RB{
	width:5%;
}
#FB {
	width:2.5%;
}


.copyright{
	position:relative;
	display:  block;
	align-items: center;
	text-align: center;
	padding-bottom: 5px ;
}
.copyright p {
	font-size: 12pt;
}


/*** should check for resizing of footer. 
Also need space between last content section and footer.

*/
/*______________________________________________ Footer */
