@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;800&display=swap');
html {
  scroll-behavior: smooth;
}
body{
	background: #25365e;
	padding:25px;
	font-family: 'Nunito', sans-serif;
}
div .container{
	margin:0 auto;
}
img{
	/* -webkit-filter: sepia(80%); /* Safari 6.0 - 9.0 */
	/* filter: sepia(80%); */
}
a:active, a:hover{
	text-decoration:none;
}
#flex-container{
	margin:10px auto;
	font-family: 'Open Sans', sans-serif;
	font-weight:700;
	font-size:3em;
	color:#fff;
	max-width:1000px;
	display:flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#flex-container #locations{
	font-size:0em;
}

	#flex-container div img{ 
		object-fit: cover;
		max-width:400px;
	}
	
	#flex-container div img#logo{ 
		object-fit: cover;
		max-width: 220px;
	}
	
	#flex-container div#text_box{
		background-color: #fff; 
		/* background-image: linear-gradient(to bottom, rgba(150, 185, 74, 1), rgba(50, 41, 24, 1)); */
		line-height: 1.1em;
		padding:0 .2em;
	}
		#flex-container div#ppl-team-image{
			background-image: linear-gradient(to bottom, rgba(37, 54, 94, 0) 60%, rgba(37, 54, 94, 1)), url('../media/ppl_group.png');
			height: 225px;
			background-size: cover;
		}
		#flex-container div#text_box h1{ 
			color: #ee3e5d;
			text-transform:uppercase;
			text-align:center;
			font-weight:800;
			font-size:0.75em;
			margin:.2em 0;
		}
		#flex-container div#text_box p{
			color: #274279;
			text-align:center;
			font-weight:800;
			font-size:0.5em;
			line-height: 120%;
			float:left;
		}
		#flex-container div#text_box ul{ 
			list-style-type:none;
			display:flex;
			justify-content: center;
			flex-wrap: wrap;
			float:left;
		}
		#flex-container div#text_box ul li{
			color: #ee3e5d;
			font-size:0.5em; 
			flex:50%;
			text-align:center;
			line-height: 1.6em;  
		}
			#flex-container div#text_box ul li a{
			    color: #ee3e5d;
			}
	
	#flex-container div#text_box strong{
		font-weight:800;
	}
	
	#flex-container div#text_box span{
		text-transform:uppercase;
		clear:both;
		display:block;
		font-weight:1000;
	}
	
	#flex-container div#text_box #factcheck{
		font-size: .25em;
		font-weight: normal;
		padding-top: 20px;
	}
	

	.grid {
	  display: grid;
	  grid-template-columns: 2lf, 1fr;
	}

	.tall {
	  grid-row: 2 / span 2;
	  grid-column: 3;
	}

	.wide {
	  grid-column: 1 / span 3;
	  grid-row: 1;
	}

	.bottom {
	  grid-row: 3;
	}

	.hours {
		grid-row:4;
		text-align:center;
	}
	.hours p{
		width:100%;
	}
	#pitch, #locations{
		background-color:#fff;
		padding:15px;
	}
	
	#pitch{
		background-color:#25365e;
		margin-top: -1px;
		z-index: 2;
	}
		#pitch h3{ 
			margin-top: -1.5em;
			font-weight: 700;
			text-align:center;
		}
		
		#pitch ul li {
			font-size: .5em;
			font-weight: normal;
			line-height: 1.15em;
			padding: 2px 0px 15px 36px;
			background: url(../media/check.png) no-repeat left top;
		}
			

		#pitch p, #locations p{
			font-size:.25em;
			color: #274279;
		}
		
		#locations ul li h4{
			margin-top:60px;
		}
			
			#locations ul li:first-of-type h4{
				margin-top:0;
			}
		
		#locations ul li h4, #locations ul li ul li h5, #locations ul li ul li h6{
			color: #274279;
			font-weight:700;
		}
		#locations ul li ul li h5{
			color: #ee3e5d;
			font-weight:700;
			margin-top:1.3933333333rem;
			margin-bottom:0;
		}
		#locations ul li ul li h6{
			margin: 0.3rem 0 0.3rem 0;
		}
		#locations ul li ul li span{
			color: #274279;
			font-size: 1.15rem;
		}

audio{
	margin: 0 auto;
}

header .pfb{
	margin-top: 5em;
}

footer .pfb{
	width:90%;
	max-width:800px;
	color:#585858;
	font-size:1em;
	text-align:center;
	margin:100px auto;
}

@media only screen and (min-width: 1050px) {
	.row {
	  display: flex;
	  flex-direction: row;
	  flex-wrap: wrap;
	  width: 100%;
	}
	#ppl-team-image, #pitch{
		width:40%;
	}
	#text_box, #locations{
		width:60%;
	}
	#locations{
		margin-top:-20px;
		border-top:3px dotted #ee3e5d;
	}
}
@media only screen and (max-width: 1050px) {
	body{
		padding:10px;
	}
	#flex-container div img{
		max-height: 100%;
		min-width:auto;
		width: 100%;
		object-fit: cover;
	}
	#flex-container{
		margin:0;
		display:flex;
		flex-direction: column;
		max-width:600px;
	}
	#flex-container{
		font-size:2em;
	}
	#flex-container div#text_box h1 {
		margin-bottom: 0.4em;
	}
	#flex-container div img#logo {
		max-width: 175px;
		padding-bottom: 10px;
	}
	#flex-container div#ppl-team-image{
			background-image: linear-gradient(to bottom, rgba(255, 255, 255, 1) 1%, rgba(255, 255, 255, 0) 10%), linear-gradient(to bottom, rgba(37, 54, 94, 0) 60%, rgba(37, 54, 94, 1)), url('../media/ppl_group.png');
	}
	#flex-container div#text_box ul {
		width:100%;
	}
	
		#pitch ul li{
			font-size: .8em;
			padding: 0px 0px 15px 36px;
		}
		
			#pitch ul li:first-of-type{
				padding-top: 0;
			}
			#pitch ul li:last-of-type{
				padding-bottom: 0;
			}
	.grid-box{
		grid-column: 1 / span 3;
	}
	.tall{
		grid-row: 5;
		text-align:center;
	}
	.tall img{
		margin:0 auto;
	}
	.row:first-of-type{
		flex-direction: column-reverse;
	}
/* 	#ppl-team-image{
		order:-2;
	}
	#text_box{
		order:-1;
	}
	#pitch{
		order: -1;
	}
	#locations{
		order: -2;
	}
 */	#flex-container div#text_box h1{
		font-size:1.2em;
	}
	#flex-container div#text_box p, #flex-container div#text_box ul li, #pitch p, #locations p{
		font-size:.8em;
	}
	#ppl-team-image {
		margin-top: -1px;
		width: 100%;
	}
	header .pfb{
		width: 80%;
	}
}
