@charset "utf-8";
/* CSS Document */
:root {
	--anchor: #ccc;
	--anchorH: #fff;
	--sectionVPadding: 80px;
	--primaryColor: #0345bf;
	--primaryHover: #044cd0;
	--secondaryColor: #3366cc;
	--secondaryHover: #6699cc;

  	--hlogo-minHeight: 40px; /*60*/
	--hlogo-maxHeight: 50px; /* 100 */
	--header-minPadding: 10px;
	--header-maxPadding: 20px;
	--header-minHeight: calc(var(--hlogo-minHeight) + (var(--header-minPadding) * 2));
	--header-maxHeight: calc(var(--hlogo-maxHeight) + (var(--header-maxPadding) * 2));

	--blue: #0345BF;
	--dkBlue: #0066cc;
	--Green: #007700;
	--dkGreen: #005100;
}


/* top bar */
	#sp-top-bar .fab, #sp-top-bar .fas, #sp-top-bar .far, #sp-top-bar a {
		font-size: 24px;
		color: var(--secondaryColor);
		margin-top: 2px;
		padding: 7px 0;
	}
	#sp-top-bar ul.sp-contact-info li span.fas,
	#sp-top-bar ul.sp-contact-info li span.far {
		color:var(--anchor); margin-left:10px;}
	#sp-top-bar ul.sp-contact-info li span.fas:hover {color:var(--anchorH);}
	#sp-top-bar ul.sp-contact-info li a {font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;}
/* header */
	#sp-header {
		background-color: white;
		border-bottom: 2px solid red;
		box-shadow: 0 0 15px rgba(0,0,0,.7);
	}
	/* header animation */
/*		#sp-header {
			height: 110px;
			padding: 20px 0;
			transition: all .75s ease;
		}
		#sp-header.header-sticky {
			height: 70px;
			padding: 10px 0;
		}

		#sp-header #sp-logo, #sp-header .logo {height:auto !important; margin:0; padding:0; line-height:0 !important;}
		.logo-image {
		  height: 70px;
		  margin-bottom: 0;
		  transition: all .75s ease;
		}
		#sp-header.header-sticky .logo-image {
		  height: 40px;
		}*/
	.social-icons li a span {
		color: var(--secondaryColor) !important;
		font-size: 1.4em;
	}
	.social-icons li a span:hover, #sp-top-bar a:hover {
		color: white !important;
	}

	/* header animation */
		#sp-header, #sp-header .logo, #sp-header .logo-image, .sp-megamenu-parent > li > a {transition:all .75s ease-out;}
	  /*container */
		#sp-header, #sp-header .logo {height: var( --header-maxHeight );}
		#sp-header.header-sticky, #sp-header.header-sticky .logo {height: var( --header-minHeight );} 
		#offcanvas-toggler {transition:all .75s ease-out;}
	  /* logo */
		#sp-header .logo-image {height: var(--hlogo-maxHeight) !important; padding-left:5px;}
		.logo-image-phone {height: var(--hlogo-maxHeight) !important;}
		#sp-header.header-sticky .logo-image-phone {height: var(--hlogo-minHeight) !important;}
		#sp-header.header-sticky .logo-image {height: var(--hlogo-minHeight) !important;}
	  /* offcanvas toggler */
		.header-sticky  #offcanvas-toggler {height: var(--header-minHeight); line-height: var(--header-minHeight);}
	  /* menu items */
		.sp-megamenu-parent > li > a {line-height: var(--header-maxHeight);}
		.header-sticky .sp-megamenu-parent > li > a {line-height:var(--header-minHeight);}
		#sp-header.header-sticky.hide {
			top: -100px;
		}	  
	  
/* menu */
	#sp-header .sp-megamenu-parent > li > a, #sp-header .sp-megamenu-parent > li > span, .offcanvas-menu .offcanvas-inner ul.menu > li a, .offcanvas-menu .offcanvas-inner ul.menu > li span {
		font-size: 1.4em;
		font-weight: 600;
		color: #333;
	}
	#sp-header .sp-megamenu-parent > li > a:hover,
	#sp-header .sp-megamenu-parent > li > span:hover,
	.offcanvas-menu .offcanvas-inner ul.menu > li a:hover,
	.offcanvas-menu .offcanvas-inner ul.menu > li span:hover {
		color: var(--secondaryColor);
	}
	#sp-header .sp-megamenu-parent > li.active > a,
	.offcanvas-menu .offcanvas-inner ul.menu > li.active a,
	.offcanvas-menu .offcanvas-inner ul.menu > li.active a:hover {
		color: var(--primaryColor) !important;
		text-decoration: underline;
		text-decoration-thickness: 3px;
		text-underline-offset: 5px;
		text-decoration-color: var(--primaryColor) !important;
		cursor:default;
	}
/* off canvas */
	.sp-contact-info li[class^="sp-contact-"] {
		font-size: 1.3em;
		color: #333;
		font-weight: 600;
		margin-left:10px;
	}
	.offcanvas-menu .offcanvas-inner ul.menu > li a {
		padding: 15px 0;
	}

	.offcanvas-menu .social-icons li a span:hover {
		color: black !important;}
	.offcanvas-menu a img {height:40px !important; width:auto;}
	.offcanvas-menu .social-icons li a span {font-size: 2em;}

/* content */
	#sp-main-body {padding:40px 0 60px;}
	#sp-user1, #sp-user2, #sp-contact {padding: var(--sectionVPadding) 0 !important;}
	#sp-notification {padding:20px 0 !important; background-color:black;}
	#sp-notification p {margin-bottom:0; color:#aaa; text-align:justify; font-size:.9em;}
  /* social */
	  .article-social-share .social-share-icon ul li a {
		  background-color: var(--primaryColor);
		  color: white;
		  border:2px solid black;
	  }
	  .article-social-share .social-share-icon ul li a:hover {
		  background-color: white;
		  color: var(--primaryColor);
		  border:2px solid var(--primaryColor);
	  }
  /* home contact */	

h1, h2, h3, h4, h5, h6 {
	font-family: 'Nunito Sans', sans-serif;
	text-decoration: none;
	font-weight:600;	
}

h1 {
	margin: 0 auto 40px !important;
	font-size: 1.2em;
	font-weight: 500;
	line-height: 2.7em;
	text-align: center;
	padding-bottom: 0;
	color: #999;
}
h1 span.larger {
	display: block;
	font-size: 2.8em;
	font-weight: bold;
	color: black;	
}
h2 {font-size:2.4em;}
h3 {font-size:2.0em;}
h4 {font-size:1.8em;}
h5 {font-size:1.6em;}
h6 {font-size:1.4em;}
p {font-size:1.2em;}
p.lead {
	font-size: 115%;
	font-weight: bold;
	color: #333;
}
a {color: var(--primaryColor); text-decoration:underline; font-weight:600;}
a:hover {color: var(--secondaryHover); text-decoration:underline;}

/* Contact section */
	#sp-contact {
	  background: url("../../../images/Glenard-Roos-Water-Drop-BG.jpg") center bottom no-repeat, linear-gradient( #000000 0%, #004d87 50% );
		background-size: auto, auto;
	  background-size: 100% auto;
	  color: white !important;
	  text-align: center;
	}
	
	#sp-contact h2, #sp-contact p {
		color: white;
		text-shadow: 3px 3px 3px rgba(0,0,0,.7);
	}
	#sp-contact .btn {
		width: 90%;
		text-shadow: none !important;
		box-shadow: 3px 3px 3px rgba(0,0,0,.7);
	}
/* Bottom Section */
	#sp-bottom .sp-module {
		margin-bottom: 40px;
	}
	#sp-bottom .sp-module .sp-module-title {
		font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;
		font-weight: 700;
		font-size: 2em;
		margin: 0 0 30px;
		color: #fff;
		border-bottom:3px solid #fff;
	}
	#sp-bottom .menu > li a, #sp-bottom p, #sp-bottom2 li {
		display: block;
		font-size: 1.3em !important;
		padding: 0;
		color: #eee;
	}
	#sp-bottom .menu > li a {color: var(--secondaryColor);}
	#sp-bottom .menu > li a:hover {color: var(--secondaryHover);}
	#sp-bottom .menu > li.active a {
		color: white;
		text-decoration: underline var(--secondaryColor);
		text-decoration-thickness: 2px;
		text-underline-offset: 6px;
		cursor:default;}
	#sp-bottom .sp-module ul.menu > li{
		display: block;
		margin-bottom: 4px;
		width: 33%;
		text-align: left;
	}

	#logo-bottom .phone {font-weight:600;}
	#logo-bottom {display:block; text-align:center; margin:auto;}
	#logo-bottom img {max-width:80%; margin:0 auto 20px;}
	
	
/* Footer Section */
	#sp-footer .container-inner {padding: 15px 0; border-color: rgba(255, 255, 255, 0.3)}
	.sp-copyright, .sp-webdesign {
		display:block;
		font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;
		font-size:1.2em;
		text-align:center;}

/* contact us page */
  /* address icons */
	.fa, .fab, .fad, .fal, .far, .fas, .icon-joomla, [class*=" icon-"], [class^="icon-"] {
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
		display: inline-block;
		font-style: normal;
		font-variant: normal;
		line-height: 1;
	}
	#address i.fa, #hours i.far, .media i.fas {
		font-size: 1.5rem !important;
		margin: 2px 7px 0 0 !important;
		vertical-align: top;
	}
	.media-body {
		-ms-flex: 1;
		flex: 1;
		display: inline-block;
	}
	#address h5 {
		font-family: "Arial Narrow", sans-serif, "Helvetica Neue", "Lucida Grande", Arial;
		font-stretch: extra-condensed;
		text-transform: none;
		font-size: 1.5rem;
	}
  /* contact form */
	.contact-form {
	  background-color: rgba(0,0,0,.2);
	  padding: 20px 15px;
	  border: 1px solid rgba(0,0,0,.2);
	}
	#contact-form legend {
		text-transform: uppercase;
		font-weight: bold;
		font-size: 2em;
	}
	.form-horizontal .controls {
	  margin-left: 0;
	}	
	
/* classes */
	.red, .star {font-weight:bold; color:red;}
	.img-responsive {
		width: 100%;
		height: auto;
	}
	.btn-primary {
		background-color: var(--primaryColor);
		text-decoration:none;
		font-weight:600;
		border: 1px solid #ddd;
		color: #ddd !important;
	}
	.btn-primary:hover {
		background-color: var(--primaryHover);
		text-decoration:none;
		border: 1px solid white;
		color: white !important;
	}


@media screen and (min-width: 576px) {
	:root {	--hlogo-maxHeight: 60px; /* 100 */}
	h1 {line-height:2.2em;}
	#sp-contact .btn {width: 70%;}
	#logo-bottom img {max-width:70%;}
	.contact-form {padding: 20px 40px;}
}
@media screen and (min-width: 768px) {
	#sp-contact .btn {width: 90%;}
	.sp-copyright {text-align:left;}
	.sp-webdesign {text-align:right;}
	#sp-bottom .sp-module ul.menu > li{width: 50%;}
}
@media screen and (min-width: 992px) {
	#sp-contact .btn {width: 70%;}
	#logo-bottom img {max-width:80%;}
}
@media screen and (min-width: 1200px) {
	#sp-contact .btn {width: 50%;}
	#logo-bottom img {max-width:70%;}
}