@import url('http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700');
* { margin:0; padding:0; box-sizing:border-box; }
*:active { border:none; }

html { margin:0; padding:0; position:relative; top:0; left:0; width:100%; }
body { position:relative; top:0; left:0; margin:0; padding:0; width:100%; background-color:#fff;
	font-family: Helvetica, Arial, sans-serif; font-size:100%; color:#000;
}

a, a:active { text-decoration: none; color: #000; }
a:link { }
a:visited { color: #000; }
a:hover { color: #f00; text-decoration: underline; }

h1 { font-size:2em; margin:0 0 .3em 0; }
h2 { font-size: 1.5em; margin:0 0 .3em 0; }

p { margin-bottom:6px; }

nav {
	position:fixed; top:0; left:0; z-index:100;
	width:100%;
	background-color:#42629a; /* #AB82FF current:mediumpurple1 #0046a0 #0082C3 #c0392b #2980b9 */
}
nav ul {
	background-color:transparent;
	width:100%;
	margin:0;
	padding:0 0 16px 0;
	padding:0;
	list-style:none;
	vertical-align:middle;
	font-family: Arial, Helvetica, sans-serif;
}
nav ul li {
	display:inline-block;
	position:relative;
	width:auto;
	text-align:center;
}
nav ul li a, nav ul li a:active, nav ul li a:visited {
	display:block;
	padding:8px 20px;
	font-size:18px;
	color:#fff;
	line-height:1em;
	transition:all .5s;
}
nav ul li a:hover {
	background-color:gold;
	color:#000 !important;
	text-decoration:underline;
}

/*Style 'show menu' label button and hide it by default*/
.show-menu {
	display: none; padding: 4px 0; background: #0046a0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:1.5em; color: #fff;
	text-decoration: none; text-align: center;
}

/*Hide checkbox*/
nav input[type=checkbox] { display: none; }

/*Show menu when invisible checkbox is checked*/
nav input[type=checkbox]:checked ~ ul { display: block; }

#wrapper {
	position:relative;
	top:0; left:0;
	z-index:1;
	width:100%; max-width:1280px; 
	margin:34px auto 0 auto;
	background-color:#fff;
}

header { font-family:Garamond,Times,'Times New Roman',serif; color:#42629a; }
#masthead { margin:0; font-size:2.3em; text-shadow:1px 1px 0 #444; }
#tagline { font-weight:bold; font-variant:small-caps; }
#mft { font-size:.7em; font-variant:small-caps; }

#mainContent {
	position:relative;
	top:0; left:0;
	margin:0;
	padding:.5em 1em;
	min-height:450px;
	background-color:#fff;
}


#mainContent p { text-align:justify; line-height:1.3em; }


footer {
	padding:4px;
	background-color:#0082C3;
	color:#fff;
}
footer a, footer a:visited { color:#fff; }

.smalltext, .smallText { font-size:.5em; }
.centered { text-align:center !important; }
.boldText, .strongtext, .strongText { font-weight:bold; }
.reg { text-decoration:underline; }
.center40 { margin-left:auto; margin-right:auto; width:40%; }
.center50 { margin-left:auto; margin-right:auto; width:50%; }
.center60 { margin-left:auto; margin-right:auto; width:60%; }
.center70 { margin-left:auto; margin-right:auto; width:70%; }
.center80 { margin-left:auto; margin-right:auto; width:80%; }
.clearLeft { display:block; clear:both; height:1px; }
.noWrap { white-space:nowrap; }
.noOverflow { overflow:hidden; }
.pre { white-space:pre; }
.clearLeft { clear:left; font-size:1px; height:1px; line-height:1px; }
.clearRight { clear:right; font-size:1px; height:1px; line-height:1px; }
.clearFix { }
.clearFix:after {
    content: " ";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.parallax {
  font-family:'PT Sans Narrow',sans-serif;
  position:relative; top:0; left:0;
  height: 280px;
  background-position: 50% -60px;
  background-repeat: no-repeat;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  overflow:hidden;
}
.parallax h2 { font-size:2.3em; color:#fff; text-shadow:1px 1px 0 #000; color:gold; }
.parallax p { font-family:'PT Sans Narrow',sans-serif; font-size:1.5em; color:#fff; text-shadow:1px 1px 2px #000; }

.halfBox { box-sizing:border-box; float:left; width:46%; margin-right:2%; padding:4px 8px; min-width:260px; }
.thirdBox { box-sizing:border-box; float:left; width:29%; margin-right:3.3%; min-width:300px; }
.leftSplash { float:left; width:30%; margin:0 2em 2em 0; text-align:center; }
.leftSplash img { width:98%; max-width:275px; }
.rightSplash { float:right; width:30%; margin:0 0 2em 2em; text-align:center; }
.rightSplash img { width:98%; max-width:275px; }
.pomegranate { 	background-color:#c0392b; } /* #2980b9 */
.learnMore { position:absolute; bottom:0; right:48%; font-size:1.5em; }
.learnMore a:active, .learnMore a:visited, .learnMore a:link { color:yellow; text-shadow:1px 1px 1px #444; text-decoration:underline; }
.internal h1 { font-family:georgia,serif; font-style:italic; }

body header { padding:.2em 1em; border-bottom:solid 2px gold; background-color:#f8f8f8; box-shadow:3px 3px 3px #000; }
body #mainContent { margin-top:.5em; min-height:580px; }
.internal #mainContent h3 { margin-bottom:.3em; }
.internal .block { margin:0 0 1em 5%; padding:.5em 1em; width:80%; background-color:#e5dfec; }
.internal .block:nth-child(3) { background-color:#c4bc96; }

#sidebar { position:fixed; top:280px; right:18px; }
.internal #sidebar { top:120px; }
/*Style 'show menu' label button and hide it by default*/
.show-sidebar { padding:4px; }
#mailSidebar { display:none; width:300px; background-color:#fff; }

/*Hide checkbox*/
#mailBox input[type=checkbox] { display: none; }
#mailBox label img { width:64px; }
/*Show menu when invisible checkbox is checked*/
#mailBox input[type=checkbox]:checked ~ div { display: block; }
#mailSidebar { padding:.5em 1em; width:260px; font-size:.8em; }
#mailSidebar label { font-weight:bold; }

#para1 { padding:.2em 1em; height:280px; background-position: 50% -80px; background-position: 50% 0px; background-image:url('images/merced.jpg'); }
#para1 h1 { font-size:2.5em; color:#fff; text-shadow:1px 1px 0 #000; }
#para1 #logoBox { position:absolute; top:1em; right:1em; width:22em; color:#fff; text-shadow:1px 1px 0 #000; }
#logoBox h3 { font-family:'Lucida Handwriting','Comic Sans MS',cursive; font-size:2.2em; color:gold; }
#logoBox p:first-of-type { font-family:'Lucida Handwriting','Comic Sans MS',cursive; font-size:1em; color:gold; }
#logoBox p { font-size:1.2em; }

#para2 { margin-top:.5em; padding:.2em 1em; height:280px;  background-position: 50% 0px; background-image:url('images/merced.jpg'); color:#fff; }

#para3 { margin-top:.5em; padding:.2em 1em; height:240px;  background-position: 50% 0px; background-image:url('images/merced.jpg'); color:#fff; }

#para4 { margin-top:.5em; padding:.2em 1em; height:254px;  background-position: 50% 0px; background-image:url('images/merced.jpg'); color:#fff; }
#para4 #workingBox { margin:0 auto; width:610px; }
#para4 #workingBox div { box-sizing:border-box; float:left; width:290px; height:245px; margin-right:12px; padding:6px 8px; background-color:rgba(64, 64, 64, .60); }
#para4 #workingBox div h2 { font-size:2em; }
#para4 #workingBox div ul { margin-left:2em; color:yellow; text-shadow:1px 1px 0 #444; }
#para4 #workingBox div:first-child ul { margin-left:1em; }

#mainContent #planIcons { text-align:center; line-height:100px; }
#mainContent #planIcons img { margin-left:12px; vertical-align:middle; }

/* =====================
     Media Queries
   ===================== */

@media all and (max-width:768px) {
.noMobile { display:none; }
#nav ul {
	width:90%;
}
.center80, .center70, .center60 { width:auto; }

} /* end media query 768px */


@media all and (max-width:480px) {

h1 { margin-top:4px; font-size:1.5em; text-align:center; }
textarea { box-sizing:border-box; width:100%; }

#wrapper { width:auto; box-shadow:none;}

nav ul { display:none; width:auto; height:auto; }
nav ul li { display:block; width:auto; height:auto; }
nav ul li a { padding:6px 4px; text-align:center; line-height:2.1em;  }

/*Display 'show menu' link*/
.show-menu { display:block; }
#sidebar { top:240px; right:4px; }
#mailBox label img { width:32px; }

.internal #mainContent { margin-top:0; }
.internal .block { margin:0 0em 1em 0em; width:auto; font-size:.9em; }

.halfBox, .thirdBox { float:none; width:auto; margin:0 2%; }
#workingBox { margin:0 4px; width:auto; }

} /* end media query 480px */

