#body					{ padding:0px; margin:0px; }

						
#wrapper 				{ margin:0px auto; background-color:#E0E0E0; border-color: 1px #990000 solid }


#top 					{ background-color:#000000; width:100%; 
						padding:10px 0; overflow:hidden; border-bottom:1px #cccccc solid; 
						border-top:3px #cccccc solid; }

#top					{  }


#logo 					{ margin:5px 0 0 1.5%; float:left; }

#logo img				{ width:80%;					}


#social-media 			{ float:right; margin:0 20px 0px 0; background-color:black; }
#social-media p 		{ color:#ffffff; font-size:18px; font-weight:bold; margin:10px 10px 4px 0px; }
#social-media img 		{ width:40px; height:40px; }
#social-media ul li 	{ display:inline; padding:10px; }

#mytopnav 			 {
					  overflow: hidden; 
					  
					  background-color: #333; border-bottom:3px #cccccc solid;	padding-left:5%; }
					
					.mytopnav a {
					  float: left;
					  display: block;
					  color: #f2f2f2;
					  text-align: center;
					  padding: 14px 35px;
					  text-decoration: none;
					  font-size: 20px;
					}
					
					.mytopnav a:hover {
					  background-color: grey; color: white;

					}
					
					.mytopnav a.active {
					  background-color: #990000;
					  color: white;
					}
					
					.mytopnav .icon {
					  display: none;
					}
					
					@media screen and (max-width: 960px) {
					  .mytopnav a:not(:first-child) {display: none;}
					  .mytopnav a.icon {
					    float: right;
					    display: block; color:white;
					  }
					}
					
					@media screen and (max-width: 960px) {
					  .mytopnav.responsive {position: relative;}
					  .mytopnav.responsive .icon {
					    position: absolute;
					    right: 0;
					    top: 0;
					  }
					  .mytopnav.responsive a {
					    float: none;
					    display: block;
					    text-align: left;
					  }
					}




#banner	img				{ width:100%; height:50%; border-bottom:3px #999999 solid;
						}

#banner					{box-sizing: border-box;}
						body {font-family: Verdana, sans-serif;}
						.mySlides {display: none;}
						img {vertical-align: middle;}
						
						/* Slideshow container */
						.slideshow-container {
						  max-width: 100%;
						  position: relative;
						  margin: auto;
						}
						
						/* Caption text */
						.text {
						  color: #f2f2f2;
						  font-size: 15px;
						  padding: 8px 12px;
						  position: absolute;
						  bottom: 8px;
						  width: 100%;
						  text-align: center;
						}
						
						/* Number text (1/3 etc) */
						.numbertext {
						  color: #f2f2f2;
						  font-size: 12px;
						  padding: 8px 12px;
						  position: absolute;
						  top: 0;
						}
						
						/* The dots/bullets/indicators */
						.dot {
						  height: 15px;
						  width: 15px;
						  margin: 1% 0 0 2px;
						  background-color: #bbb;
						  border-radius: 50%;
						  display: inline-block;
						  transition: background-color 1.6s ease;
						}
						
						.active {
						  background-color: #717171;
						}
						
						/* Fading animation */
						.fade {
						  -webkit-animation-name: fade;
						  -webkit-animation-duration: 5s;
						  animation-name: fade;
						  animation-duration: 5s;
						}
						
						@-webkit-keyframes fade {
						  from {opacity: .4} 
						  to {opacity: 1}
						}
						
						@keyframes fade {
						  from {opacity: .1} 
						  to {opacity: 1}
						}
						
						/* On smaller screens, decrease text size */
						@media only screen and (max-width: 300px) {
						  .text {font-size: 11px}
						}
						


#content				{ width:63%; float:left; background-color:#E0E0E0; height:auto;
						}
						
#content h1				{ color: #990000; font-size:32px; text-align:center; padding-top:2%; }

#content h2				{ color: #990000; font-size:24px; text-align:center; padding:25px 10px 15px 10px; }

#content ul li			{ margin-left:3%; font-size:18px; padding-right:20px; padding-left:20px; font-weight:bold; 
						 }


#juicebox-container		{ width: 100%; height:100%; padding-top:1%; }

#content p				{ font-size:18px; padding-left:20px; padding-right:20px; padding-bottom:2%; line-height:150%;	}

#content img			{  max-width:25%;
						  border-top-left-radius:5%;
						  border-top-right-radius:5%;
						  border-bottom-left-radius:5%; 
						  border-bottom-right-radius:5%;
						  padding:0.75%; border:1px #888888 solid; margin:0.5%;	 }




#content a				{ background-color: #990000; border-radius:30%; border:2px #888888 solid; margin:0.5%;						  
						  color: white;
						  padding: 1.25%;
						  text-decoration: none;
						  text-transform: uppercase; }

#contentg				{ width:100%; background-color:#E0E0E0; height:auto; padding-left:10%; padding-right:10%;
						}

#contentg h1			{ font-size:32px; color: #990000; text-align:center; padding-bottom:1%; 
						padding-top:1%; }

#content-wide 			{ width:100%; margin:auto;	Padding-bottom:25px; background-color:#E0E0E0; height:auto; }

#content-wide h1		{ color:#990000; font-size:32px; padding-top: 10px;	padding-bottom:15; text-align:center; }

#content-wide h2		{ color:#990000; font-size:24px; padding-top: 10px;	padding-bottom:15; text-align:center; }

#content-wide h4		{ text-align:center; 
						}

						
#content-wide  p		{ font-size :18px; padding-left:5%; padding-right:5%; padding-bottom:20px; line-height:150%; }

#content-wide ul li   	{ margin-left:3%; margin-right:3%; padding-left:20px; color:darkgreen;  font-size:18px; padding-bottom:1%;}

						
#content-wide img		{ width:22%; 
						  border-top-left-radius:5%;
						  border-top-right-radius:5%;
						  border-bottom-left-radius:5%; 
						  border-bottom-right-radius:5%;
						  padding:0.5%; border:1px #888888 solid; margin:0.5%;	}

						* {
						  box-sizing: border-box;
						}
						
						/* Create two equal columns that floats next to each other */
						.column {
						  float: left;
						  width: 50%;
						  padding: 10px;
						  }
						
						/* Clear floats after the columns */
						.row:after {
						  content: "";
						  display: table;
						  clear: both;
						}
						
						/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
						@media screen and (max-width: 800px) {
						  .column {
						    width: 100%;
						  }
						}




#container				{box-sizing: border-box;  } /* Contact form container */

#container label		{ color:#990000; }

						input[type=text], select, textarea {
						  width: 100%;
						  padding: 12px;
						  border: 1px solid #ccc;
						  border-radius: 4px;
						  box-sizing: border-box;
						  margin-top: 6px;
						  margin-bottom: 16px;
						  resize: vertical;
						}
						
						input[type=submit] {
						  background-color: #4CAF50;
						  color: white;
						  padding: 12px 20px;
						  border: none;
						  border-radius: 4px;
						  cursor: pointer;
						}
						
						input[type=submit]:hover {  background-color: #45a049; }
						
						.container { text-align:center;
						  border-radius: 20px;
						  background-color: #E0E0E0;
						  padding:3% 12% 12% 12%;    
						}


#map-responsive			{ overflow:hidden; padding-bottom:80%; position:relative; height:70%; }

#map-responsive iframe  { left:10% ; right:10%; top:7.5%; bottom:5%; height:90%; width:80%; position:absolute; }

#address				{ color:#990000; }
#address	p     		{ 	padding-top:5%;	margin-left: 7.5%;		}


#rightside				{ width:29.8%; background-color:#E0E0E0; float:right; padding-left:1px; height:inherit; padding-bottom:2%; 
						  Border-left: 4px #CCCCCC solid; border-radius:7.5%; Border-right: 4px #CCCCCC solid; border-radius:7.5%; margin-right:4%;
						}

#rightside h1			{ text-align:center; font-size:32px; color:#990000; padding-top:25px; }

#rightside h2			{ text-align:center; font-size:24px; color:#990000; padding-top:30px; }

#rightside h3			{ text-align:center; font-size:20px; color:#990000; padding-top:15px; line-height:150%; }


#rightside p			{ font-size:18px; padding-right:5%;	padding-left:5%; line-height:150%; color:#990000; }

#rightside ul li		{ font-size:18px; font-weight:bold; padding-right:20px;	padding-left:20px;  color:#990000; }

#rightside img			{ width:60%;
						  border-top-left-radius:5%;
						  border-top-right-radius:5%;
						  border-bottom-left-radius:5%; 
						  border-bottom-right-radius:5%;
						  padding:1%; border:1px #888888 solid; margin:5%;  }
						  
#rightside video		{ max-width:80%; margin-left:auto; margin-right:auto;
						  border-top-left-radius:3%;
						  border-top-right-radius:3%;
						  border-bottom-left-radius:3%; 
						  border-bottom-right-radius:3%;
						  margin-bottom:15%;
						}									

						@media screen and (max-width: 960px) {
#content 				{ 
						width: 95%; float: none;
						padding: 3% 4%;
						}
						
#rightside 				{
						width: 95%; float:none; border-left:none; border-right:none; margin-right:1%; margin-left:2%; 
 
						}

#rightside p			{ color:black; }

					}


#footer					{ clear:both; background-color:#555555; padding:20px 0; border-top:4px #999999 solid; 
						   }
#footer a				{ text-align:center; text-decoration:none; color:#ffffff; }
#footer	p				{ color:#ffffff; text-align:center; font-size:14px; }