/*global configs, will not change with display width*/
:root
{
	interpolate-size:allow-keywords;
  	--nscc-green:#00693f;
}
details
{
	overflow:hidden;
  	background-color:lightgray;
}
details::details-content
{
	block-size:0;
	transition:block-size 0.5s, content-visibility 0.5s;
	transition-behavior:allow-discrete;
}
details[open]::details-content
{
	block-size:auto;
}
.lexend
{
	font-family: "Lexend", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	margin:0;
}
.bordered
{
	border: 2px solid black;
  	margin: 0.5vw;
	grid-column: 2 / span 1;
}
header
{	
	background-image:url('banner.jpg');
  	background-color:gray;
	background-blend-mode:multiply;
	background-size:cover;
	width:100%;
}
/*no max width, min is 1440px*/
h1
{
	font-size:4.5vw;
	color:white;
	text-align:center;
	margin-top:0px;
	padding-top:60px;
}
summary
{
	
	font-size:1vw;
	font-weight:bold;
	margin:0.5vw;
	cursor:pointer;
}
.big
{
	font-size:2vw;
	text-align:center;
}
.grid
{
	display:grid;
	grid-template-columns:10% 80% 10%;
  	background-color:var(--nscc-green);
  	padding:1.5vw;
}
#box1
{
	grid-row: 1 / span 1;
}
#space
{
	grid-row: 2 / span 1;
}
#box2
{
	grid-row: 3 / span 1;
}
details p, details li
{
	margin:10px 50px;
}
#subtitle
{
	text-align:center;
	font-size:1.5vw;
  	padding-left:5px;
  	padding-right:5px;
}
#logo
{
	margin:20px;
	padding:5px;
	background-color:rgba(255,255,255,0.6);
	border:2px solid black;
	position:absolute;
}
header p
{
	text-align:center;
	font-size:1vw;
  	color:white;
}
h2
{
	font-size:3vw;
  	text-align:center;
  	color:white;
}
#toplogo
{
	width:0px;
  	height:0px;
}
img
{
	width:inherit;
}
#toplogodiv
{
	display: block;
  	margin:0px auto;
  	padding:0px;
  	height:0px;
}
/*large laptop*/
@media (max-width:1439px)
{
  	h1
  	{
    	font-size:6.5vw;
  	}
  	h2
  	{
      	font-size:4.5vw;
  	}
}
/*laptop*/
@media (max-width:1023px)
{
	#toplogo
  	{
     	width:100%;
      	margin:20px 0px;
      	height:auto;
  	}
  	#logo
  	{
    	width:0px;
      	margin:0px;
      	padding:0px;
      	border:0px;
  	}
  	#toplogodiv
  	{
      	padding:10px;
      	width:70vw;
      	height:auto;
      	border: 2px solid black;
      	background-color:rgba(255,255,255,0.6);
  	}
  	#subtitle
  	{
    	font-size:2.5vw;
  	}
  	.hidebr
  	{
    	display:none;
  	}
  	h1
  	{
      	padding-top:45px;
  	}
}
/*tablet*/
@media (max-width:767px)
{
	#space
  	{
      	display:none;
  	}
}
/*mobile device - large*/
@media (max-width:424px)
{
	
}
/*mobile device - medium*/
@media (max-width:374px)
{
	
}
/*mobile device - small*/
@media (max-width:319px)
{
	
}