/*	Header	*/

header#h1 {background-color:white;}
header#h1 div {display:flex;flex-flow:row wrap;max-width:1200px;margin:0 auto;padding-top:1vh;padding-bottom:1vh;}
header#h1 div h1 {
	font-family: 'Oswald',Verdana,Geneva,Arial,Helvetica,sans-serif;
	color:#95c11f;text-shadow: 1px 1px 2px gainsboro;
	flex-grow:1;display:flex;flex-flow:row wrap;align-items:center;
}
header#h1 div h1.beta {color:#b22222;}
header#h1 div h1 img {margin-right:1vw;}

header#h1 div p {line-height:1.50;font-family:'Open Sans',sans-serif;color:#2f3f10;}
header#h1.x div p {flex-grow:1;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;}


@media screen and (max-width:767px) {
	
	header#h1 div h1 {font-size:calc(25px + 1vw);				/*	1vw = 3.2px at 320px so 28px will be 28 - 3.2(3) = 25	*/}
	header#h1 div h1 {justify-content:center;}
	header#h1 div h1 img {height:42px;width:auto;}
	
	header#h1 div p {
		font-size:calc(11px + 1vw);								/*	1vw = 3.2px at 320px so 14px will be 14 - 3.2(3) = 11	*/
		font-weight:normal;}
	header#h1 div p {flex:1 1 auto;text-align:center;}
	header#h1 div p {margin:1vh;}
	
}

@media screen and (min-width:768px) and (max-width:1199px) {
	
	header#h1 {padding-left:1vw;padding-right:1vw;}
	header#h1 div h1 {font-size:calc(32px + 1vw);				/*	1vw = 12px at 1200px so 40px will be 40 - 12 = 28	*/}
	header#h1 div p {flex-grow:1;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;}
	header#h1 div p {
		font-size:calc(6px + 1vw);								/*	1vw = 12px at 1200px so 18px will be 18 - 12 = 6	*/
		font-weight:normal;
	}
}

@media screen and (min-width:1200px) {

	header#h1 div h1 {font-size:44px;}
	header#h1 div p {flex-grow:1;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;}
	header#h1 div p {font-size:20px;font-weight:bold;}
	
}
