@import url(/css/reset.css);


/*
 * Site Layout Styles
 */
body {
  background: #bdbec2 url(/img/body-bg.png) repeat-x 0 0;
  color: #3e3e3e;
  font: 80% Helvetica, Arial, sans-serif;
  height: 100%;
  text-align: center;
}

div#site-container {
  background: transparent url(/img/site-container-bg.png) repeat-y 0 0;
  min-height: 100%;
  margin: 0 auto 0 auto;
  padding: 0 10px;
  text-align: left;
  width: 940px;
}
  div#site-container p#skip-navigation {
    position: absolute;
    left: -9999px;
  }


a {
  color: #003c7c;
  text-decoration: none;
}
  a:hover {
    text-decoration: underline;
  }

h1 {
  color: #fff;
  font-size: 1.7em;
  font-weight: normal;
  letter-spacing: 1px;
  margin: 0 0 15px 0;
}
  h1#title {
    background: url(/img/h1-bg.png) no-repeat 0 0;
    height: 38px;
    margin: 0 0 20px 0;
    overflow: hidden;
    padding: 16px 0 0 25px;
  }
h2 {
  color: #000;
  font-size: 1.8em;
  font-weight: normal;
  margin: 0 0 10px 0;
}
h3, h3 a {
  color: #000;
}
h4 {
  color: #000;
  font-size: 1.3em;
  font-weight: normal;
}



p {
  line-height: 150%;
}


/** HEADER **/

div#header {
  background: url(/img/header-bg.png) no-repeat 0 0;
  color: #fff;
  height: 189px;
  margin: 0 0 0 0;
  overflow: hidden;
  padding: 0 0 0 20px;
  position: relative;
}


  div#header ul#topnav {
    height: 38px;
    margin: 0 0 15px 0;
    overflow: hidden;
  }
    ul#topnav li {
      color: #000;
      float: left;
      height: 28px;
      margin: 0 20px 0 0;
      padding: 10px 0 0 0;
    }
      ul#topnav li#username {
        margin: 0 0 0 30px;
      }
    ul#topnav a {
      color: #767f8e;
    }


  div#header img#logo {
    margin: 14px 0 14px 28px;
  }



  div#volunteer-number, div#help-number {
    font-size: 1.1em;
    letter-spacing: 2px;
    left: 305px;
    position: absolute;
    text-align: right;
    top: 60px;
    width: 220px;
  }

  div#volunteer-number, div#help-number { left: 305px; }
  div#help-number { left: 550px; }

  div#volunteer-number span, div#help-number span {
    font-size: 2em;
    font-weight: bold;
    letter-spacing: 1px;
  }



  div#header ul#social {
    height: 32px;
    position: absolute;
    right: 20px;
    top: 10px;
  }
    ul#social li {
      float: left;
      font-size: 1.1em;
      letter-spacing: 2px;
      margin: 0 0 0 10px;
    }

    ul#social li.text {
      font-size: 1.1em;
      padding: 8px 0 0 0;
    }


  div#header ul#mainnav {
    bottom: 0;
    height: 47px;
    left: 20px;
    position: absolute;
    overflow: hidden;
    width: 898px;
  }

    ul#mainnav li {
      background-image: url(/img/mainnav-bg-nolines.png);
      background-position: 0 0;
      background-repeat: no-repeat;
      float: left;
      font-size: 1.3em;
      height: 47px;
      overflow: hidden;
      text-align: center;
    }
      ul#mainnav li a {
        color: #fff;
        display: block;
        font-weight: bold;
        height: 34Px;
        padding: 13px 0 0 0;
        text-shadow: #000 1px 1px;
      }
        ul#mainnav li a.sel {
          color: #fff;
        }


    ul#mainnav li#are-you-homeless {
      background-position: 0 0;
      width: 190px;
    }
      ul#mainnav li#are-you-homeless:hover { background-position: 0 -47px; }
      ul#mainnav li#are-you-homeless:active { background-position: 0 -94px; }
      ul#mainnav li#are-you-homeless.sel { background-position: 0 -141px; }

    ul#mainnav li#services {
      background-position: -190px 0;
      width: 105px;
    }
      ul#mainnav li#services:hover { background-position: -190px -47px; }
      ul#mainnav li#services:active { background-position: -190px -94px; }
      ul#mainnav li#services.sel { background-position: -190px -141px; }

    ul#mainnav li#fundraising {
      background-position: -295px 0;
      width: 181px;
    }
      ul#mainnav li#fundraising:hover { background-position: -295px -47px; }
      ul#mainnav li#fundraising:active { background-position: -295px -94px; }
      ul#mainnav li#fundraising.sel { background-position: -295px -141px; }

    ul#mainnav li#news-and-events {
      background-position: -476px 0;
      width: 95px;
    }
      ul#mainnav li#news-and-events:hover { background-position: -476px -47px; }
      ul#mainnav li#news-and-events:active { background-position: -476px -94px; }
      ul#mainnav li#news-and-events.sel { background-position: -476px -141px; }

    ul#mainnav li#resources {
      background-position: -571px 0;
      width: 131px;
    }
      ul#mainnav li#resources:hover { background-position: -571px -47px; }
      ul#mainnav li#resources:active { background-position: -571px -94px; }
      ul#mainnav li#resources.sel { background-position: -571px -141px; }

    ul#mainnav li#search-form {
      background-position: -702px 0;
      padding: 13px 0 0 30px;
      width: 166px;
    }
      ul#mainnav li#search-form input#field-q {
        background: transparent;
        border: none;
        float: left;
        margin: 3px 0 0 0;
        padding: 0;
        width: 115px;
      }
      ul#mainnav li#search-form input#field-submit {
        float: left;
      }







/* footer */


div#footer {
  border-top: 2px solid #b10738;
  color: #767f8e;
  clear: both;

  overflow: hidden;
  padding: 10px 20px 20px 20px;
}
  div#footer a {
    color: #767f8e;
  }
  div#footer ul li {
    float: left;
    margin: 0 20px 0 0;
  }

  div#footer img#frsb-button {
    float: right;
    margin: 0 10px 4px 0;
  }


/* subpage layout */
div#page-content {
  background: url(/img/subpage-bg.png) no-repeat 0 0;
  margin: 0;
  overflow: hidden;
  padding: 0;
  width: 940px;
}


div#left {
  float: left;
  margin: 0 0 20px 0;
  overflow: hidden;
  padding: 0 0 0 20px;
  width: 160px;
}
div#right {
  float: left;
  margin: 0 0 20px 40px;
  overflow: hidden;
  width: 200px;
}
div#center {
  float: left;
  margin: 0 0 20px 40px;
  overflow: hidden;
  padding: 0;
  width: 450px;
}
  div#center.wide {
    width: 630px;
  }
  div#page-content h3 {
    font-size: 1.6em;
    font-weight: normal;
    margin: 0 0 10px 0;
  }
  div#page-content p {
    margin: 0 0 10px 0;
  }


/* subnav */
ul#subnav li {
  border: 1px solid #fff;
  font-weight: bold;
  margin: 0 0 5px 0;
  padding: 5px 10px;

  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;

  /*position: relative;
  behavior: url(/js/PIE.htc);*/
}


  ul#subnav li:hover {
    border: 1px solid #d9dce0;
  }
    ul#subnav li a {
      color: #767f8e;
      display: block;
      font-size: 1.3em;
    }
  ul#subnav li.sel {
    background: #767f8e;
  }
    ul#subnav li.sel a {
      color: #fff;
    }



a.button {
  background: url(/img/button-bg.png) no-repeat 0 0;
  color: #fff;
  display: inline-block;
  font-size: 1.1em;
  font-weight: bold;
  height: 33px;
  padding: 14px 0 0 0;
  text-align: center;
  width: 162px;
}
  a.button:hover { background-position: 0 -47px; }
  a.button:active { background-position: 0 -94px; }


  a.button.bsmall {
    background-position: -162px 0;
    width: 108px;
  }
  a.button.bsmall:hover { background-position: -162px -47px; }
  a.button.bsmall:active { background-position: -162px -94px; }


img.thumb {
  border: 4px solid #fff;
  margin: 0 0 10px 0;

  -webkit-box-shadow: #666 0px 2px 3px;
  -moz-box-shadow: #666 0px 2px 3px;
  box-shadow: #666 0px 2px 3px;

  /*position: relative;
  behavior: url(/js/PIE.htc);*/
}
  img.thumb.fright {
    margin-left: 10px;
  }
  img.thumb.fleft {
    margin-right: 10px;
  }

p.date {
  font-weight: bold;
}
p.summary {
  font-style: italic;

}


div#center ul {
  list-style-type: disc;
	list-style-image: url(/img/bullet.png);
	list-style-position: inside;
  margin: 0 0 10px 10px;
}
  div#center ul li {
    color: #000;
    font-weight: bold;
    margin: 5px 0 5px 0;
  }

label {
  float: left;
  font-weight: bold;
  width: 120px;
}

div#subscribe, div.answer {
  display: none;
}

div#faq ol li {
  margin: 0 0 5px 0;
}


img.flag {
  border: 4px solid #d1d1d1;
  margin: 0 4px 4px 0;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;

  /*position: relative;
  behavior: url(/js/PIE.htc);*/
}
div.language {
  /*display: none;*/
}

#facebox .content {
  border: 4px solid #d1d1d1;
  padding: 20px !important;

  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;

  /*position: relative;
  behavior: url(/js/PIE.htc);*/
}
   #facebox .content h4 {
    color: #003c7c;
    margin: 0 0 10px 0;
  }



ol {
  margin: 0 0 0 25px;
}