/* move the body definition to here too */
body {
  text-align: center;
  margin: 0 auto;
  background-image: url("../images/global/blue-abstract-background.jpg"); }

div.outer_page {
  /* Outer Page Area */
  width: 90%;
  text-align: center;
  margin: 0 auto;
  overflow: visible; }

div.working_page {
  /* working area */
  background-color: #00b4d8;
  background-image: url("../images/global/seamless_paper_texture.jpg");
  background-repeat: repeat, repeat;
  position: relative;
  width: 100%;
  overflow: visible;
  margin: 0; }

.big-pop {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 2.86rem;
  text-shadow: 0.07rem 0.07rem 0.14rem #000000;
  color: #03045e;
  margin: 0px; }
  @media screen and (max-width: 768px) {
    .big-pop {
      font-size: 1.5rem;
      text-shadow: 0.0 0.0 0.0 #000000; } }

.pop-address {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 3.0rem;
  color: #03045e;
  margin: 0px; }
  @media screen and (max-width: 768px) {
    .pop-address {
      font-size: 1.5rem;
      font-weight: bold; } }

.pop-mission {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 35px;
  color: #03045e;
  margin: 0px; }
  @media screen and (max-width: 768px) {
    .pop-mission {
      font-size: 5vw;
      font-weight: bold; } }

p.welcome {
  text-align: center;
  color: #03045e;
  font-size: 2.25rem; }
  @media screen and (max-width: 768px) {
    p.welcome {
      font-size: 1.75rem; } }

p.welcome::first-letter {
  color: red;
  font-size: 175%; }

p, li.big {
  color: #03045e;
  font-size: 2.0rem; }
  @media screen and (max-width: 768px) {
    p, li.big {
      font-size: 1.5rem; } }

p.bigger {
  text-align: center;
  color: #03045e;
  font-size: 2.5rem; }
  @media screen and (max-width: 768px) {
    p.bigger {
      font-size: 2.0rem; } }

p.small {
  text-align: center;
  color: #03045e;
  font-size: 16px; }
  @media screen and (max-width: 768px) {
    p.small {
      font-size: 14px; } }

p.smaller {
  text-align: center;
  color: #03045e;
  font-size: 14px; }
  @media screen and (max-width: 768px) {
    p.smaller {
      font-size: 12px; } }

p.tiny {
  text-align: center;
  color: #03045e;
  font-size: 12px; }
  @media screen and (max-width: 768px) {
    p.tiny {
      font-size: 10px; } }

p.big-shadowed {
  text-align: center;
  color: #03045e;
  font-size: 4.75rem;
  text-shadow: 0.06rem 0.06rem 0.08rem #000000; }
  @media screen and (max-width: 768px) {
    p.big-shadowed {
      font-size: 2.0rem;
      text-shadow: 0.02em 0.02em 0.05em #000000; } }

p.med-shadowed {
  text-align: center;
  color: #03045e;
  font-size: 3.0rem;
  text-shadow: 0.03rem 0.03rem 0.05rem #000000; }
  @media screen and (max-width: 768px) {
    p.med-shadowed {
      font-size: 2.25rem;
      text-shadow: 0.01rem 0.01rem 0.04rem #000000; } }

p.sm-shadowed {
  text-align: center;
  color: #03045e;
  font-size: 2.0rem;
  text-shadow: 0.0075rem 0.0075rem 0.04rem #000000; }
  @media screen and (max-width: 768px) {
    p.sm-shadowed {
      font-size: 1.75rem;
      text-shadow: 0.0em 0.0em 0.0em #000000; } }

p.red-letter {
  color: #03045e;
  text-align: left;
  margin: 0;
  font-size: 2.0rem; }
  @media screen and (max-width: 768px) {
    p.red-letter {
      font-size: 1.5rem; } }

p.red-letter::first-letter {
  color: red;
  font-size: 150%; }

img.directory {
  max-height: 200px;
  width: auto;
  border-style: none; }

/* try this for the Google Calendar */
.responsiveCal {
  position: relative;
  padding-bottom: 75%;
  height: 0;
  overflow: hidden; }

.responsiveCal iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

/*  end of new stuff */

/*# sourceMappingURL=page-def.css.map */