/*
 * Copyright 2021 Phase One Website Design & Hosting
 * https://www.phaseonewebsitedesign.com/
 */

/* ------------------------------------------------------------------ */
/* ------- Colors --------------------------------------------------- */
/* Contents copyright Phase One Website Design & Hosting
   https://www.phaseonewebsitedesign.com/
	#000066   0,  0,102	Blue,  dark
	#10527c  19, 82,124	Blue,  medium
	#6a96b9 106,150,185	Blue,  light
	#ddb695 221,182,149	Brown, light
	#ac754c 172,117, 76	Brown, medium
	#714423 113, 68, 35	Brown, dark
	#0f8012  15,128, 18	Green
*/

/* ------------------------------------------------------------------ */
/* ------- BEGIN Horizonal Tabbed Informational Area ---------------- */

.tabs-outer {margin:0 auto; margin-top:40px; margin-bottom:-20px; min-width:320px; max-width:800px;}
.tabs-inner {background:#fff; color:#000000;}
.tabs-inner > div {display:none; padding:20px 25px 5px;}

.tabs-outer input {display:none;}
label {display:inline-block; padding:10px 15px; font-weight:600; text-align:center;}
label:hover {background-color:#10527c; color:#ffffff; cursor:pointer;}
input:checked + label {background:#000066; color:#ffffff;}

#tab1:checked ~ .tabs-inner #content1,
#tab2:checked ~ .tabs-inner #content2,
#tab3:checked ~ .tabs-inner #content3,
#tab4:checked ~ .tabs-inner #content4 {display:block;}

@media screen and (max-width:400px) { label {padding:15px 10px;} }

/* ------- END Horizonal Tabbed Informational Area ------------------ */
/* ------------------------------------------------------------------ */


/* ------------------------------------------------------------------ */
/* ------- BEGIN the Home Page Hero Intro Image --------------------- */
<!-- Responsive Full-width Hero Image with CSS Text, Button & Popup. Source: www.action360.ca @action360ca -->
<!-- Code found here: https://www.csscodelab.com/full-width-responsive-css-hero-image-heading-caption/ -->
.hero-image {}
.hero-image {
	background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url("../images/hero-home-460x307.jpg");
	/*background-image:url("../images/hero-home-460x307.jpg");*/
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	border-bottom:3px solid #10527c;
	height:50%;
	position:relative;
}
.hero-text {left:50%; position:absolute; text-align:center; top:50%; transform:translate(-50%, -50%);}
.hero-text h1 {color:#ffffff; font-family:Georgia; font-size:100px; font-style:italic; font-weight:bold; margin:10px; text-shadow:2px 2px #000000;}
.hero-text p  {color:#ffffff; font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:50px;  font-style:italic; padding:7px 10px; text-shadow:1px 1px #000000;}

@media (min-width:100px) {
	.hero-text {left:35%; top:50%; transform:translate(-35%, -50%); width:95%;}
	.hero-image {background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), background-image:url("../images/hero-home-460x307.jpg");}
	.hero-text h1 {font-size:28px; padding:7px 10px;}
	.hero-text p  {font-size:20px; line-height:1.2;}
}
@media (min-width:300px) {
	.hero-image {height:65%;}
}
@media (min-width:400px) {
	.hero-image {background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url("../images/hero-home-720x480.jpg"); height:70%;}
}
@media (min-width:720px) {
	.hero-image {background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url("../images/hero-home-980x654.jpg"); height:80%;}
}
@media (min-width:980px) {
	.hero-image {background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url("../images/hero-home-1240x827.jpg");}
}
@media (min-width:1240px) {
	.hero-image {background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url("../images/hero-home-1500x1000.jpg");}
}
@media (min-width:1500px) {
	.hero-image {background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url("../images/hero-home-1760x1173.jpg");}
}
@media (min-width:1760px) {
	.hero-image {background-image:linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url("../images/hero-home-1920x1280.jpg");}
}
/* **************************************************************************** */
@media (min-width:700px) {
	.hero-text {left:37%; top:50%; transform:translate(-35%, -50%); width:85%;}
	.hero-text h1 {font-size:32px;}
	.hero-text p  {font-size:25px;}
}
@media (min-width:800px) {
	.hero-text {left:40%; top:50%; transform:translate(-35%, -50%); width:80%;}
	.hero-text h1 {font-size:40px;}
	.hero-text p  {font-size:30px;}
}
@media (min-width:900px) {
	.hero-text {left:38%; top:50%; transform:translate(-35%, -50%); width:75%;}
}
@media (min-width:1000px) {
	.hero-text {left:40%; top:50%; transform:translate(-35%, -50%); width:70%;}
	.hero-text h1 {font-size:50px;}
	.hero-text p  {font-size:40px;}
}
@media (min-width:1200px) {
	.hero-text {left:41%; top:50%; transform:translate(-35%, -50%); width:60%;}
}
@media (min-width:1400px) {
	.hero-text {left:43%; top:50%; transform:translate(-35%, -50%); width:50%;}
}
@media (min-width:1600px) {
	.hero-text {left:44%; top:50%; transform:translate(-35%, -50%); width:40%;}
}
/* ------- END the Home Page Hero Intro Image ----------------------- */
/* ------------------------------------------------------------------ */


/* -------------------------------------------------------------------------------------------- */
/* ------- BEGIN the Home Page Informational Block with Background Image ---------------------- */
<!-- Responsive Full-width Hero Image with CSS Text, Button & Popup. Source: www.action360.ca @action360ca -->
<!-- Code found here: https://www.csscodelab.com/full-width-responsive-css-hero-image-heading-caption/ -->
.infoBgNarrow, .infoAreaPL1Narrow {background-position:center;}
.infoBg, .infoAreaPL1 {display:none;}
.infoBgText, .infoAreaTextRight {top:50%;}
.infoBgText, .infoAreaTextRight h2 {color:#10527c;}
.infoBgText, .infoAreaTextRight p  {color:#10527c;}
@media (min-width:100px) {
	/* Show the abbreviated text content & 100% width image */
	.infoBgNarrow {background-image:url("../images/home-intro-460x144.jpg");}
	.infoBgNarrow {background-position:center; background-repeat:no-repeat; background-size:cover; border-bottom:3px solid #10527c;}
	.infoAreaPL1Narrow {background-image:url("../images/info-area-hp-2-460x144.jpg");}
	.infoAreaPL1Narrow {background-position:center; background-repeat:no-repeat; background-size:cover; border-bottom:3px solid #10527c;}
	.infoBg, .infoAreaPL1 {display:none;}
	.infoBgText, .infoAreaTextRight    {display:inline-block; padding:6% 4% 1% 4%; width:92%;}
	.infoBgText h2, .infoAreaTextRight h2 {color:#10527c; font-family:Georgia; font-size:16px; line-height:1.3; text-shadow:1px 1px 2px #10527c; font-weight:bold;}
	.infoBgText p,  .infoAreaTextRight p  {color:#10527c; font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:16px; line-height:1.3; text-shadow:1px 1px 2px #10527c;} /* Font drop shadow: Horizontal, Vertical, Blur */
}
@media (min-width:600px) {
	/* Show the complete text content & the 60%/40% width image */
	.infoBgNarrow, .infoAreaPL1Narrow {display:none;}
	.infoBg      {background-image:url("../images/home-intro-720x225.jpg");}
	.infoBg      {background-position:center; background-repeat:no-repeat; background-size:cover; border-bottom:3px solid #10527c; display:block;}
	.infoAreaPL1 {background-image:url("../images/info-area-hp-2-720x225.jpg");}
	.infoAreaPL1 {background-position:center; background-repeat:no-repeat; background-size:cover; border-bottom:3px solid #10527c; display:block;}
	.infoBgText        {display:inline-block; padding:5% 4% 1% 4%;  width:54%;}
	.infoAreaTextRight {display:inline-block; padding:5% 0% 1% 39%; width:58%;}
	.infoBgText h2, .infoAreaTextRight h2 {color:#10527c; font-family:Georgia; font-size:18px; line-height:1.3; text-shadow:1px 1px 2px #10527c; font-weight:bold;}
	.infoBgText p,  .infoAreaTextRight p  {color:#10527c; font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:18px; line-height:1.3; text-shadow:1px 1px 2px #10527c;} /* Font drop shadow: Horizontal, Vertical, Blur */
}
@media (min-width:720px) {
	.infoBg      {background-image:url("../images/home-intro-980x306.jpg");}
	.infoAreaPL1 {background-image:url("../images/info-area-hp-2-980x306.jpg");}
	.infoAreaTextRight {padding-left:41%; width:56%;}
}
@media (min-width:800px) {
	.infoBgText, .infoAreaTextRight {padding-bottom:3%}
}
@media (min-width:980px) {
	.infoBg      {background-image:url("../images/home-intro-1240x388.jpg");}
	.infoAreaPL1 {background-image:url("../images/info-area-hp-2-1240x388.jpg");}
}
@media (min-width:900px) {
	.infoBgText h2, .infoAreaTextRight h2 {font-size:22px;}
	.infoBgText p,  .infoAreaTextRight p  {font-size:20px;}
	.infoAreaTextRight {padding-left:42%; width:55%;}
}
@media (min-width:1240px) {
	.infoBg      {background-image:url("../images/home-intro-1500x469.jpg");}
	.infoAreaPL1 {background-image:url("../images/info-area-hp-2-1500x469.jpg");}
}
@media (min-width:1300px) {
	.infoBgText h2, .infoAreaTextRight h2 {font-size:26px;}
	.infoBgText p,  .infoAreaTextRight p  {font-size:24px;}
}
@media (min-width:1500px) {
	.infoBg      {background-image:url("../images/home-intro-1760x550.jpg");}
	.infoAreaPL1 {background-image:url("../images/info-area-hp-2-1760x550.jpg");}
}
@media (min-width:1760px) {
	.infoBg      {background-image:url("../images/home-intro-1920x600.jpg");}
	.infoAreaPL1 {background-image:url("../images/info-area-hp-2-1920x600.jpg");}
}
/* ------- END the Home Page Informational Block with Background Image ---------------------- */
/* ------------------------------------------------------------------------------------------ */
