* {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        vertical-align: baseline;
        background: transparent;
   }



.grad_color{
	background-image: linear-gradient( #4a3df6, magenta);
}


.mainlogo {
	float: left;
	height: 120px;
	padding: 5px;
	}
	
	.maintitle,
	.address,
	.phone{
	color: yellow;
	}
	
	
	
	h1{
		font-size: 250%;
		}


	h2{
		font-size: 200%;
		}
		
		.address{
		margin-bottom: 20px;
		}

	
	.descriptionImage{
		margin: auto;
		column-count: 1;
		column-width: 400px;
	}
	

	.court6 {
		display: block;
		width: 50%;
		float: left;
		margin-left: 5%;
		margin-right: 5%;
		margin-bottom: 25px;
		height: 300px;
		border: 5px solid white;
	}
	
	
	.Directions{
		float: none;
		margin-left: 25px;
	}


	.map{
		display: block;
		margin-left: auto;
		margin-right: auto;
		height: 200px;
		width: 300px;
	}
	
	.solid_color{
		background-color: magenta;
	}
	
	.facilities{

	}

	.facilities nav {
		margin-left: 100px;
		height: 50px;
	}

	.facilities ul {
		text-align: center;
		list-style: none;
		padding: 0;
	}
	
	.facilities ul li a {
		text-decoration: none;
		
	}
		
	.facilities ul li a:hover {
		color: white;
	}
	

	
	.facilities ul li{
      display: inline-block;
 		
	}
	

	
	.hours{
		text-align: left;
		margin-left: 25px
	}
	
	.hours nav ul li{
		border-bottom: 1px solid MediumVioletRed;
	
	}
	
	.closing{
		background-color: blue
	}
	
/*	For mobile devices...*/
	@media screen and (max-width: 480px) {
		 
		 .descriptionImage{
		 font-size: 150%;
		 }
		 
		h1{
		font-size: 200%;
		}

		h2{
			font-size: 150%;
		}
		 
		.court6 {
			display: block;
			width: 75%;
			float: none;
			margin-left: 5%;
			margin-right: 5%;
			margin-bottom: 25px;
			height: 300px;
			border: 5px solid white;
		}
		
		h3{
		font-size: 125%;
		}
			
	}