@charset "utf-8";
body {
	font: 90% Arial, Helvetica, sans-serif;
	line-height:140%;
	margin: 0; 
	padding: 0;
	text-align: center; 
	color: #000000;
	background: #F8F8F8;
}
h1, h2, h3{color:#CC0000;font-family:Georgia, "Times New Roman", Times, serif;line-height:normal}
a{color:#CC0000;text-decoration:none}
a:hover{text-decoration:underline}

/*#container {
	width: 80%;  
	margin: 0 auto; 
} */
.header-top{width:80%;	background: #CC0000;padding:1% 0;margin:0 auto}
.header-top-wrapper{width:100%;	background: #CC0000;padding:0;margin:0}
.header-menu{width:80%;	background: #CC0000;padding:0 10%;border-top:solid 3px white;}
p.header-text a{color:white;}
p.header-text{text-align:right; margin:20px 0 0 0; font-weight:bold; color:white;float:right;max-width:60%}
p.header-text a.email {margin-left:-30px;}
img.header-logo{float:left;margin:0;max-width:40%}
div.banner-top{padding:10px;width:100%;text-align:center;font-weight:bold;margin:0}

#mainContent {
	width:80%;
	padding: 1% 0;
	background: #F8F8F8;
	clear:both;
	text-align: left;
	margin:0 auto;
}

#footer {
	padding: 10px 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	border-top: solid 2px #CC0000;
	clear:both;
}
#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: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

a img{border:none}

/* Generated via www.cssmenubuilder.com 

.menu{margin:0 auto; padding:0; height:30px; width:100%; display:block; background:url('../images/topMenuImages.png') repeat-x;}
.menu li{padding:0; margin:0; list-style:none; display:inline;}
.menu li a{float:left; padding-left:15px; display:block; color:rgb(255,255,255); text-decoration:none; font:12px Verdana, Arial, Helvetica, sans-serif; cursor:pointer; background:url('../images/topMenuImages.png') 0px -30px no-repeat; font-weight:bold;}
.menu li a span{line-height:30px; float:left; display:block; padding-right:15px; background:url('../images/topMenuImages.png') 100% -30px no-repeat;}
.menu li a:hover{background-position:0px -60px; color:rgb(204,0,0);}
.menu li a:hover span{background-position:100% -60px;}
.menu li a.active, .menu li a.active:hover{line-height:30px; font:12px Verdana, Arial, Helvetica, sans-serif; background:url('../images/topMenuImages.png') 0px -90px no-repeat; color:rgb(204,0,0);font-weight:bold;}
.menu li a.active span, .menu li a.active:hover span{background:url('../images/topMenuImages.png') 100% -90px no-repeat;}*/

.homesidebox{width: 200px;height: 320px;
	border:solid 1px #E5E5E5;padding:12px;float:left;
	background:#FFFFFF;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px; /* future proofing */
	-khtml-border-radius: 15px; /* for old Konqueror browsers */
	-moz-box-shadow: 5px 5px 1px #E2E2E2;
 -webkit-box-shadow: 5px 5px 1px #E2E2E2;
 box-shadow: 5px 5px 1px #E2E2E2;}
 
.home-slider{width:450px;height:350px;margin: 0 14px 0 22px;float:left;padding:0}

.gallery a {width:23%;margin:1%;float:left}

 .gallery img{width:96%; border:solid 5px #CCCCCC}
 
 div.row{display:flex}
 div.col-25{width:25%;float:left;margin:1% 1%}
 div.col-50{width:45%;float:left; margin:1% 1%}
 .float-right{border:solid 5px #E2E2E2;float:right;margin:10px 0 10px 15px;width:20%}

img.social-icon{float:left;margin-right:10px;width:50px;valign:middle}

 @media screen and (max-width: 1000px){
	 .header-menu{width:98%;	padding:0 1%;}
	}

@media screen and (max-width: 900px){ /* hamburger menu */
	 .header-menu{width:100%;	padding:0 0 0 20%; margin:0 auto;}
	.home-slider{width:100%;height:auto;margin: 15px;float:none;padding:0}
	.homesidebox{width:92%;height:auto;float:none;padding:1% 3%;margin:1%}
	.float-right{float:right;width:40%;margin:1% 0 1% 2%}

	 div.col-25{width:100%;float:none;}
	 div.col-50{width:100%;float:none}
	 
	.gallery a {width:46%;margin:1% 2%;float:left}
	 
}

@media screen and (max-width: 540px){
	#mainContent{width:96%;margin:0 auto;padding:0}
	p.header-text{float:none; width:100%;margin:10px auto;text-align:center;max-width:none;}
	img.header-logo{float:none; width:70%;margin:10px auto;text-align:center;max-width:none}
	
	.float-right{float:none;width:98%;margin:1%}
	.gallery a {width:98%;margin:3% 1%;float:none}
	#lightbox,#lightboxOverlay{display:none!important} /* not on small screens */
	
	 div.col-25{width:96%;float:none;}
	 div.col-50{width:96%;float:none}

}