@charset "utf-8";
/* CSS Document */

html, body {
/*	height:100%; */
}

body  {
	/*font:100% Verdana, Arial, Helvetica, sans-serif;*/
	margin:0;
	padding:0;
	text-align:center;
}
#header { 
	text-align:center;
    background-color:#7a1511;
	margin:0 auto;
	padding:0;
	width:100%;
	height:250px;
}
#keyarea {
	max-width:1200px;
	margin:0 auto;
	text-align:left;
	padding:0;
	background-color:#7a1511;
	/*background-color:#701b10;*/
}
#keyarea p a:not(.phone){
	color:#000; 
}
#keyarea p a:hover{
	color:#306; 
} 
#keyarea h1 {
	float:left;
	margin:0;
	padding:5px 0; 
	max-width:175px; 
	height:225px; 
	position:relative;	
}
#keyarea p {
	margin:10px 5px 0 0;
	float:right; 
	top:5px;
	font-weight:bold;
	/*color:#103063;*/
	color:#FFF;
	font-size:14px;
	text-align:right;
}
#keyarea img.olympic {
	margin:-130px 5px 0 0;
	float:right; 
	text-align:right;
	position:relative;
}
#keyarea h2 { 
	float:left;
	margin:15px 0 0 0;
	padding:0 0 0 15px; 
	font-size:24px; 
	max-width:575px;
	position:relative;
	text-shadow:1px 1px 2px #999;
}
#keyarea h2 span:not(.itf) { 
	color:#CCC;
}
#keyarea h3 { 
	margin:0 auto;
	vertical-align:bottom;
	padding:0 0 0 15px; 
	font-size:17px;
	color:#BBB;
	max-width:650px;
	position:relative;
	font-size:16px;
}
#keyarea h4 {
  float: none;
  margin: 0 auto;
  padding: 0 0 5px 0;
  font-size: 14px;
  color: #FFF;
  color: #6D2F9B;
  max-width: 575px;
  position: relative;	
}
#keyarea div.fb-like {
	float:left;
	margin:10px 0 0 0; 
	padding:5px 0 0 0;
	max-width:300px;
	position:relative;
	text-align:left; 
}
ul.mheader {
	color:#ddd;
}
ul.mheader strong {
	color:#6CF;
}
/**************Start Side Navigation CSS Code by WebPaws.com, copyright 2010**************/

/*  Regular Nav 	*/
.topnav {
	margin:0 auto;
	margin-top:-50px;
	max-width:1200px;
	width:100%;
	display:inline-block
	/*height:auto;*/
}
nav {
	width:100%;
	/*height:auto;
	background-color:#000;*/
	line-height:30px;
	margin:0 auto;
}
nav ul.m {
	margin-right:10px;
    background-color:none;
	/*display:flex;	*/
  	justify-content:center;
}
nav #about {
	display:none;
	background-color:none;
}
nav ul ul li {
   display:block;
   width:175px;
   line-height:45px;
   border:1px solid #ccc;
   padding:0;
   background-color:none;
}
nav ul ul {
   display:block;
   width:175px;
   background-color:none;
   overflow:visible;
}
nav ul ul li:first-child{
	/*margin-top:10px;*/
}
nav ul.m li{
	list-style-type:none;
	display:inline-block;
	transition:0.4s;
	font-size:16px;
	font-weight:900;
	background-color:none;
}
nav ul.m li:hover{
	/*background-color:#2196f3;*/
}
nav ul.m li a{
	text-decoration:none;
	color:#fff;
	padding:6px;
	width:100%;
	display:inline-block;
}
nav ul.m li a:hover{
	color:#000;
	background-color:#2196f3;
	transition-delay:0.1s;
}
nav ul.m ul li a{
	text-decoration:none;
	color:#fff;
	padding:0;
	margin:0;
	display:inline-block;
	width:100%;
	text-align:center;
}
nav ul.m ul li a:hover{
	color:#000;
	background:#3F65E9;
	box-shadow:none;
	transition-delay:0.1s;
}
#mobilenav {
	margin: 15px auto;
	/*max-width:1200px;*/
}
.mobileNavButton {
	display:none;
}
/*  End Regular Nav */


#page {
	background-color:#113178; 
	max-width:1200px;
	margin:0 auto; 
	text-align:center;
	position:relative;
	border:1px solid dodgerblue;
}

#main {
	max-width:1200px; 
	padding:10px 10px 0 10px; 
	margin:10px auto; 
	text-align:left;
	position:relative;
}

/* Begin WebForm CSS Code */
section {
	text-align:center;
	padding: 25px 0 15px 0;
	color:white;
}
p{color: white;}
section.videos {
	text-align:center;
	padding:5px;
}
.container { 
	margin:0 auto;
	padding:0 5px;
	max-width:100%;
	text-align:left;
}
		.feature {
		width: 100%;
		max-width:480px;
		text-align: left;
		margin: 0 0 10px 0;
		font-size: 1rem;
		display: flex;
		align-items: center;
		justify-content: center;
		}
	.feature p {
		width:60%;
		display:inline-block;
		text-align:left;
		max-width:210px;
	}		
	.container p a { 
		color:#444;
	}

#posting_form_short{
	border-collapse:collapse;
	border:1px solid #DDD;
	border-bottom-width:3px;
	border-bottom-color:#bbb;
	width:630px;
	margin:0 auto;
	margin-bottom:20px;
	position:relative;
}
#posting_form_short fieldset{
	border:0 solid #AAA;
	border-top-width:1px;
	margin:15px;color:#555;
	padding:10px 5px;
}
#posting_form_short legend{
	font-size:18px;
	font-weight:bold;
	padding:0 10px;
	margin-left:20px;
	color:#222;
}
#posting_form_short_header {
	/*color:#FFFFFF; */
	font-size:24px; 
	vertical-align:top; 
	padding:0;
	font-weight:bold;
	line-height:40px;
	font-family:'Trebuchet MS';
	text-align:center;
	width:500px;
	background-image:url(../images/posting_form_header.png);
	background-repeat:repeat-x;
	margin:0 auto;
}
#contact-area {
	width:475px;
}

#posting_form_short label{
	display:block;
	margin-top:8px;
	font-weight:bold;
	color:#333;
}

#posting_form_short input[type=text],#posting_form_short select,#posting_form_short textarea{
	border:1px solid #BBB;
}

#posting_form_short input,#posting_form_short select,#posting_form_short textarea{
	width:280px;
}

#posting_form_short #programs{
	width:350px;
	margin:0 auto;
	text-align:left;
}
#posting_form_short #programs input{
	margin:3px 5px;
	display:inline;
	width:20px;
}
#posting_form_short #programs label { 
	width:3100px;
	display:inline;
	margin:3px 5px;
}
input,select,textarea{
	padding:2px;}
	
input[type=button],input[type=submit]{
	background-color:#ddd;
	color:#333;
	border:1px outset #ccc;
	cursor:pointer;
}

input[type=button]:hover,input[type=submit]:hover{
	background-color:#ccc;
}
input[type=text],textarea,select,input[type=password]{
	border:1px solid #ccc;
/*	background-color:#fff;*/
	color:#333;
	background-image:url(../images/input_shadow.png);
	background-repeat:repeat-x;
}
/* End WebForm CSS Code */


a {text-decoration:none;}
a.home{color:#999;}
a:hover {text-decoration:underline;}
a.phone {color:inherit;}


		.responsive {
		  width: 100%;
		  height: auto;
		  max-width:150px;
		  border:none;
		}
		
.container {
  display: flex; /* Establishes a flex container */
  flex-wrap: wrap; /* Allows items to wrap to the next line on smaller screens */
  gap: 10px; /* Adds space between columns */
}

.column {
  flex: 1 1 calc(33.333% - 10px); /* Sets each column to take up approx. one-third of the width, accounting for gap */
  /* Other styling like border, padding, background-color can be added here */
}

/* Media query for smaller screens */
@media (max-width: 768px) { /* Example breakpoint for tablets and phones */
  .column {
    flex: 1 1 100%; /* Makes each column take full width, stacking them vertically */
  }
}		



#prefooter {
	text-align:center; 
	vertical-align:top; 
	margin:-16px auto 0px auto; 
	width:1000px; 
	color:#333333;
	z-index:20;
}
#prefooter a {
	color:#333333;
	text-decoration:none;
}

#prefooter a:hover {
	color:#666;
	text-decoration:underline;
}

.twoColFixLtHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 5px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

#footer p {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ddd;
	text-align:center;
	margin:10px 0;
	background:transparent;
	padding:3px 0;
	margin:0;
}

#footer a {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ddd; 
	font-weight:bold;
	text-align:center;
	text-decoration:none;
}
#footer a:hover {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #27609B;
	text-align:center;
	text-decoration:underline;
}

@media screen and (max-width: 480px) {
   .wplogo {
	   margin:15px auto 0 auto;
   }
   h2 {
	   padding:5px 15px;
   }   

	/* Mobile Nav  */
	nav{
		width:100%;
		height:auto;
		background-color:none;
		line-height:auto;
		margin:0 auto;
	}
	nav ul{
		float:none;
		margin-right:inherit;
		margin:0 auto;
	}
	nav #services, nav #about, nav #games {
		display:none;
	}
  nav ul.m li{
	list-style-type:none;
	display:inline-block;
	transition:0.4s;
	font-size:16px;
	font-weight:900;
	background-color:none;
	max-width:400px;
	width:100%;
	margin:0 auto;
  }
	nav ul li{
		list-style-type:none;
		display:block;
		transition:0.4s;
		font-size:inherit;
		font-weight:inherit;
		max-width:400px;
	    width:100%;
		margin:0 auto;
	}
	nav ul li:hover{
		background-color:inherit;
		font-weight:900;
	}
	nav ul li a{
		text-decoration:none;
		color:#fff;
		padding:6px;
	}
	nav ul li a:hover{
		color:#000;
		background:#2196f3;
		box-shadow:none;
		transition-delay:0.1s;
	}
	nav ul ul{
	  max-width:400px;
	  width:100%;
	  margin:0 auto;
    }
	#mobilenav {
	  /*display:none;*/
	}
	ul#mobilenav {
		list-style:none;
		margin-bottom:25px;
	}
	ul#mobilenav li ul li {
	  max-width:400px;
	  width:100%;
	  border:1px solid #1D3557;
	}
	ul#mobilenav li ul li a{
	/* border:1px solid #1D3557; */
	  border:none;
	  color:#000;
	  background-color:#5D94FF; /* 71CFE9 41B9E1 #A8DADC light green */ /*4169E1*/
	}
	.fa-caret-down {
	  display:inline-block;
	  float:right;
	}
	.icon {
	  background: black;
	  display: inline-block;
	  position: absolute;
	  right: 7px;
	  top: 9px;
	}
	.topnav a {
	  color: #000;
	  padding: 14px 16px;
	  text-decoration: none;
	  font-size: 17px;
	  display: block;
	  border:1px solid #1D3557; /* 083BD6 457B9D */
	  background-color:#4169E1;/*lighter blue*/
	}
	.topnav a:hover {
	  background-color: #ddd;
	  color: black;
	}
	/* End Mobile Nav */
	   
	/* Hamburger Nav */
	.mobileNavButton{
	  -webkit-tap-highlight-color: rgba(0,0,0,0);
	  -webkit-tap-highlight-color: transparent;
	  display:flex;
	  align-items:center;
	  justify-content:center;
	  flex-direction:column;
	  cursor:pointer;
	  background-color:#36F;
	  width:33px;
	  height:33px;
	  border-radius:10px;
	  margin-top:15px;
	}
	.mobileNavButton span{
		background-color:#007;
		box-shadow:0px 0px 10px 0px rgba(240,128,128,0.3);
		width:17px;
		height:4px;
		border-radius:4px;
		margin:1px 0px;
		transition:margin 0.4s cubic-bezier(.79,.21,.06,.81),transform 0.4s cubic-bezier(.79,.21,.06,.81);
		color:#FFF;
	}
	.mobileNavButton span:nth-child(2){
		transform-origin:50% 50%;
	}
	.active .mobileNavButton span{
		margin:-2px;
	}
	.active .mobileNavButton span:nth-child(1){
		transform:rotate(-45deg);
	}
	.active .mobileNavButton span:nth-child(2){
		transform:scale(0);
	}
	.active .mobileNavButton span:nth-child(3){
		transform:rotate(45deg);
	}
	/* End Hamburger Nav */

	.btn {
		display: block;
		font-size: 1.25rem;
		max-width:275px;
		margin:5px auto;
	}
	h1 {
		font-size: 2.5rem;
		margin:-15px 0 8px 0;
	}
	h2 {
		font-size: 1.125rem;
	}
	.ibstrap {
	  max-width:225px;
  }
	section:not(.videos) {
		padding: 25px 0 15px 0;
	} 
		.feature {
		width: 100%;
		max-width:480px;
		text-align: left;
		margin: 0 0 10px 0;
		font-size: 1rem;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.feature i {
		width:40%;
		display:inline-block;
		font-size:2.5rem;
		margin-right:15px;
		text-align:right;
		max-width:65px;
	}
	.feature p {
		width:60%;
		display:inline-block;
		text-align:left;
		max-width:210px;
	}
	.feature span {
		width: 15%;
		min-width: 60px;
		margin-right: 20px;
	}
	.quote {
		padding: 30px 0;
	}
	blockquote p {
		font-size: 1.125rem;
	}
	blockquote cite {
		font-size: 0.875rem;
	}
	.programs ul {
		width:100%;
		max-width:425px;
		margin:7px 17px 7px 10px;
		padding-left:10px;
	}
	.programs ul li {
		width:100%;
		max-width:400px;
		text-align:left;
		padding-left:0px;
	}	
	footer {
		padding: 30px 0 10px 0;
	}
	footer li {
		display:block;
		margin:5px auto;
	}
	.submenu {
		width: 1
0%;
		position: relative;
	}
}  
@media screen and (max-width: 330px) {
	.mobileNavButton{
		top:48px;
		left:50%;
		right:50%;
	}
	#mobilenav {display:block;}
}