/****** FILE: themes/unitedway/css/base.css *****/
/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline; }
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block; }
	body {
		line-height: 1; }
	ol, ul {
		list-style: none; }
	blockquote, q {
		quotes: none; }
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none; }
	table {
		border-collapse: collapse;
		border-spacing: 0; }


/* #Images
================================================== */

	img.scale-with-grid, .scale-with-grid { max-width: 100% !important; height: auto !important; }


/* #Misc
================================================== */
	.remove-bottom { margin-bottom: 0 !important; }
	.remove-top { margin-top: 0 !important; }
	.half-bottom { margin-bottom: 10px !important; }
	.half-top { margin-top: 10px !important; }
	.add-bottom { margin-bottom: 20px !important; }
	.add-top { margin-top: 20px !important; }
	.double-top { margin-top: 40px !important; }
	.double-bottom { margin-bottom: 40px !important; }
	.float-right {float: right !important;}
	.float-left {float: left !important;}

	.double-pad-bottom {padding-bottom: 40px !important;}


	#SilverStripeNavigatorMessage { padding: 0px !important; left: 0 !important; right: auto !important; top: 0 !important; font-size: 8px !important; }


/****** FILE: themes/unitedway/css/flexslider.css *****/
/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {
  outline: none; }

.slides,
.flex-control-nav,
.flex-direction-nav {
  margin: 0;
  padding: 0;
  list-style: none; }

/* FlexSlider Necessary Styles
*********************************/
.flexslider {
  margin: 0;
  padding: 0;
  /* Hide the slides before the JS is loaded. Avoids image jumping */ }
  .flexslider .slides > li {
    display: none;
    -webkit-backface-visibility: hidden; }
  .flexslider .slides img {
    width: 100%;
    display: block; }

.flex-pauseplay span {
  text-transform: capitalize; }

/* Clearfix for the .slides element */
.slides:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0; }

html[xmlns] .slides {
  display: block; }

* html .slides {
  height: 1%; }

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {
  display: block; }

/* FlexSlider Default Theme
*********************************/
.flexslider {
  margin: 0px;
  background: #2b3075;
  border: none;
  position: relative;
  zoom: 1;
  border-bottom: 1px solid #eee !important; }

.flexslider.detail {
  border-bottom: none !important; }

.flex-viewport {
  max-height: 2000px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  transition: all 1s ease; }

.loading .flex-viewport {
  max-height: 300px; }

.flexslider .slides {
  zoom: 1; }

.carousel li {
  margin-right: 5px; }

.home-slider h2 {
  color: #fff;
  text-transform: uppercase; }

/* Direction Nav */
.flex-direction-nav {
  *height: 0; }
  .flex-direction-nav a {
    width: 30px;
    height: 30px;
    margin: -20px 0 0;
    display: block;
    background: url(/dynamic-core/images/bg_direction_nav.png) no-repeat 0 0;
    position: absolute;
    top: 50%;
    z-index: 10;
    cursor: pointer;
    text-indent: -9999px;
    opacity: 0;
    -webkit-transition: all .3s ease; }
  .flex-direction-nav .flex-next {
    background-position: 100% 0;
    right: -36px; }
  .flex-direction-nav .flex-prev {
    left: -36px; }

.flexslider:hover .flex-next {
  opacity: 0.8;
  right: 5px; }

.flexslider:hover .flex-prev {
  opacity: 0.8;
  left: 5px; }

.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {
  opacity: 1; }

.flexslider:hover .flex-direction-nav .flex-disabled {
  opacity: 0.3 !important;
  filter: alpha(opacity=30);
  cursor: default; }

/* Control Nav */
.flex-control-nav {
  float: right;
  display: none; }

.flexslider.detail .flex-control-nav {
  margin-top: -20px; }

.flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline; }

.flex-control-paging li a {
  width: 11px;
  height: 11px;
  display: block;
  background: #a2a2a2;
  cursor: pointer;
  text-indent: -9999px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3); }

.flex-control-paging li a:hover {
  background: #cfcfcf; }

.flex-control-paging li a.flex-active {
  background: #58a349;
  cursor: default; }

.flex-control-thumbs {
  margin: 5px 0 0;
  position: static;
  overflow: hidden; }
  .flex-control-thumbs li {
    width: 25%;
    float: left;
    margin: 0; }
  .flex-control-thumbs img {
    width: 100%;
    display: block;
    opacity: .7;
    cursor: pointer; }
  .flex-control-thumbs img:hover {
    opacity: 1; }
  .flex-control-thumbs .flex-active {
    opacity: 1;
    cursor: default; }

.flexslider .text-side {
  width: 410px;
  float: left;
  padding: 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.flexslider .img-side {
  width: 530px;
  float: right;
  border-left: 5px solid #fff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev {
    opacity: 1;
    left: 0; }
  .flex-direction-nav .flex-next {
    opacity: 1;
    right: 0; } }


/****** FILE: themes/unitedway/css/layout.css *****/
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/
/* Table of Content
==================================================
	#Variables
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */
/* Variables
================================================== */
/* #Site Styles
================================================== */
.violators__violator {
  background-color: #cd2e32;
  padding: 20px;
  color: #fff;
  text-align: center;
  font-size: 15px;
  position: relative; }
  .violators__violator a, .violators__violator a:visited {
    color: #fff; }
    .violators__violator a:hover, .violators__violator a:focus, .violators__violator a:visited:hover, .violators__violator a:visited:focus {
      color: #fff;
      text-decoration: underline; }
  .violators__violator p {
    margin-bottom: 10px; }
    .violators__violator p:last-child {
      margin-bottom: 0; }
    .violators__violator p b, .violators__violator p strong {
      font-size: 18px; }

.violators .close-btn {
  position: absolute;
  top: 0px;
  right: 10px;
  text-decoration: none;
  padding: 5px;
  font-weight: bold;
  font-size: 18px;
  line-height: 1;
  font-size: 30px;
  line-height: 1; }
  .violators .close-btn:hover, .violators .close-btn:focus {
    text-decoration: none; }

.violators .violators__violator + .violators__violator {
  border-top: 1px solid #fff; }

.mobile-menu, #mobilenavs {
  display: none; }

.header {
  position: relative;
  padding: 20px 0px 0px;
  margin-bottom: 0px; }
  .header a {
    text-decoration: none; }

.header h1 img {
  display: block; }

.nav-bg {
  background: url("/themes/unitedway/images/nav-bg.jpg") repeat;
  width: 100%; }

nav.primary ul {
  text-align: left;
  position: relative;
  z-index: 1000; }

nav.primary li {
  display: block;
  float: left;
  margin: 0;
  padding-bottom: 0;
  white-space: nowrap;
  border-right: 2px ridge #9c9fcb;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
  position: relative; }
  nav.primary li.last-parent {
    border: 0; }
  nav.primary li a, nav.primary li a:visited {
    font-size: 19px;
    padding: 18px 50px;
    font-weight: bold;
    display: block;
    color: #fff;
    text-transform: uppercase; }
    nav.primary li a:hover, nav.primary li a:visited:hover {
      color: #bebebe; }
  nav.primary li:hover {
    color: #bebebe; }
  nav.primary li:hover .child {
    display: block;
    background: #7c81b8;
    left: 0px; }
    nav.primary li:hover .child li {
      display: block;
      text-align: center;
      width: 100%; }
    nav.primary li:hover .child a {
      padding: 10px;
      text-align: center;
      display: block; }

nav.utility {
  position: absolute;
  top: 0px;
  right: 0px; }
  nav.utility ul {
    text-align: right;
    font-size: 0px; }
  nav.utility li {
    display: block;
    vertical-align: middle;
    font-size: 12px;
    float: right; }
    nav.utility li.search, nav.utility li.donate {
      border-right: 1px solid #fff;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box; }
      nav.utility li.search a, nav.utility li.search a:visited, nav.utility li.donate a, nav.utility li.donate a:visited {
        font-size: 16px;
        font-weight: 900;
        padding: 5px 55px;
        font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
        color: #fff;
        display: block;
        text-transform: uppercase; }
        nav.utility li.search a:hover, nav.utility li.search a:visited:hover, nav.utility li.donate a:hover, nav.utility li.donate a:visited:hover {
          background: #bebebe; }
    nav.utility li.search {
      background-color: #2b3075; }
    nav.utility li.donate {
      background-color: #cd2e32; }

nav.gav {
  position: absolute;
  top: 52px;
  right: 0px; }
  nav.gav ul {
    font-size: 0px; }
  nav.gav li {
    border-right: 1px solid #fff;
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  nav.gav li.mobile-only {
    display: none; }
  nav.gav .give {
    background-color: #f58020; }
  nav.gav .advocate {
    background-color: #7c81b8; }
  nav.gav .volunteer {
    background-color: #cd2e32; }
  nav.gav a, nav.gav a:visited {
    font-size: 19px;
    font-weight: 900;
    padding: 10px 45px;
    font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
    color: #fff;
    display: block;
    text-transform: uppercase; }
    nav.gav a:hover, nav.gav a:visited:hover {
      background: #bebebe; }

.bottom {
  width: 100%;
  position: relative;
  box-shadow: 0px -9px 10px -5px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0px -9px 10px -5px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0px -9px 10px -5px rgba(0, 0, 0, 0.3);
  -o-box-shadow: 0px -9px 10px -5px rgba(0, 0, 0, 0.3); }

.footer {
  margin-bottom: 30px;
  margin-top: 20px !important;
  color: #2b3075; }
  .footer .company-info {
    font-size: 14px;
    line-height: 16px;
    font-weight: bold; }
  .footer .buttons li {
    margin-bottom: 5px;
    font-size: 16px; }
  .footer .buttons .donate {
    background-color: #cd2e32; }
  .footer .buttons .give {
    background-color: #f4801f; }
  .footer .buttons .advocate {
    background-color: #7c81b8; }
  .footer .buttons .volunteer {
    background-color: #cd2e32; }
  .footer .buttons a, .footer .buttons a:visited {
    color: #fff;
    display: block;
    text-align: center;
    width: 100%;
    font-weight: 900;
    text-transform: uppercase;
    font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
    padding: 5px 0px; }
    .footer .buttons a:hover, .footer .buttons a:visited:hover {
      color: #bebebe; }

.footerNav li, .footer-util li {
  display: block;
  padding: 3px 7px; }
  .footerNav li a, .footerNav li a:visited, .footer-util li a, .footer-util li a:visited {
    text-transform: uppercase;
    color: #2b3075;
    font-size: 20px;
    font-weight: bold;
    font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif; }
    .footerNav li a:hover, .footerNav li a:visited:hover, .footer-util li a:hover, .footer-util li a:visited:hover {
      text-decoration: underline; }

.column-row {
  clear: both; }

.sidebar ul {
  /*margin-left: 10px;*/ }
  .sidebar ul li {
    margin-bottom: 5px; }

.sidebar a {
  text-decoration: none; }

.secondary ul li ul {
  display: none; }

.secondary ul li.section ul, .secondary ul li.current ul {
  display: block; }

.secondary ul ul {
  /*margin-left: 10px;*/ }

.secondary ul ul li {
  padding: 0;
  line-height: 18px; }

.navigation li:hover ul.child {
  display: block;
  width: 100%;
  text-align: left; }

ul.child {
  position: absolute !important;
  margin: 0px !important;
  display: none; }
  ul.child li {
    font-size: 12px;
    line-height: 16px; }
    ul.child li:first-child {
      padding-left: 0px; }
    ul.child li.last-child {
      padding-right: 0px;
      border: none; }

.footer a {
  text-decoration: none; }

.secondary ul li a {
  font-size: 16px; }

.secondary ul li li a, .secondary ul li.section li a, .secondary ul li.current li a {
  color: inherit; }

.social li {
  padding: 0px 10px; }

.social a {
  height: 42px;
  width: 43px;
  display: block;
  float: left;
  margin-right: 5px;
  background: url("/themes/unitedway/images/social-sprite.png") no-repeat; }
  .social a span {
    display: none; }
  .social a:hover {
    opacity: .75; }
  .social a.fb {
    background-position: 0px 0px; }
  .social a.tw {
    background-position: -52px 0px; }
  .social a.go {
    background-position: -104px 0px; }
  .social a.li {
    background-position: -157px 0px; }

nav.footerNav {
  font-size: 12px;
  line-height: 12px; }

ul.child li a {
  font-size: 16px;
  padding-top: 0px;
  padding-bottom: 0px; }

.typography h1, .typography h2, .typography h3, .typography h4, .typography h5, .typography h6 {
  color: #5a5a5a;
  margin-bottom: 0px; }

.blue {
  color: #2b3075 !important; }

.spiff-holder {
  height: 300px !important; }

/* #Page Styles
================================================== */
h3.blog-title {
  color: #a8a8a8; }

h3.subtitle {
  font-size: 24px !important; }

.green-text {
  color: #f4801f; }

.crumbs {
  font-size: 14px;
  line-height: 14px;
  margin-top: 20px;
  margin-bottom: 30px;
  font-weight: bold; }
  .crumbs a {
    color: #2b3075 !important; }
  .crumbs .green-text {
    color: #2b3075; }

/*** Misc Alignment ***/
.text-right {
  text-align: right; }

.float-right {
  float: right;
  margin: 0 0 0 10px; }

.float-left {
  float: left;
  margin: 0 10px 0 0; }

/* Definition Lists */
.content dl {
  margin: 0 0 20px;
  width: 100%;
  line-height: 20px;
  float: left;
  /*overflow: hidden;*/ }

.content dt {
  float: left;
  clear: left;
  width: 30%;
  margin-bottom: 5px;
  font-weight: bold; }

.content dd {
  /*white-space: nowrap;*/
  min-height: 21px;
  margin-left: 30%;
  margin-bottom: 5px; }

/* Pagination */
.apple_pagination {
  background: #84D374;
  border: 1px solid #009117;
  text-align: center;
  padding: 1em;
  cursor: default;
  margin-bottom: 20px; }
  .apple_pagination a, .apple_pagination span {
    padding: 0.2em 0.3em; }
  .apple_pagination .disabled {
    color: #fff;
    font-weight: bold; }
  .apple_pagination .current {
    font-style: normal;
    font-weight: bold;
    background-color: #3C9220;
    display: inline-block;
    width: 1.4em;
    height: 1.4em;
    line-height: 1.5;
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
    border-radius: 1em;
    color: #fff; }
  .apple_pagination a {
    text-decoration: none;
    color: #fff;
    font-weight: bold; }
  .apple_pagination a:hover, .apple_pagination a:focus {
    color: #3C9220; }

/* News */
.toolbar {
  border-bottom: 1px solid #eee;
  padding-bottom: 0px;
  margin-bottom: 10px; }

.gallery:hover img {
  opacity: .85; }

#Search .middleColumn {
  width: 100%; }

.white-zone {
  width: 100%;
  background-color: #eeeeed; }

.spiff {
  position: relative;
  display: block;
  overflow: hidden; }
  .spiff .spiff-text {
    position: absolute;
    top: 220px;
    padding: 15px 20px;
    text-align: center;
    width: 100%;
    background: url("/themes/unitedway/images/spiff-bg.png") repeat;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
    color: #fff;
    cursor: pointer; }
    .spiff .spiff-text p {
      line-height: 20px;
      font-weight: bold;
      font-size: 18px; }
    .spiff .spiff-text h4 {
      color: #fff;
      font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
      font-size: 24px;
      line-height: 24px;
      text-transform: uppercase;
      margin-bottom: 50px; }
      .spiff .spiff-text h4 a, .spiff .spiff-text h4 a:visited {
        color: #fff; }
        .spiff .spiff-text h4 a:hover, .spiff .spiff-text h4 a:visited:hover {
          text-decoration: underline; }

.full-spiff h4, .content2 h4 {
  color: #4b4b4b;
  font-weight: bold;
  font-size: 25px; }
  .full-spiff h4 a, .full-spiff h4 a:visited, .content2 h4 a, .content2 h4 a:visited {
    color: #4b4b4b; }
    .full-spiff h4 a:hover, .full-spiff h4 a:visited:hover, .content2 h4 a:hover, .content2 h4 a:visited:hover {
      text-decoration: underline; }

.full-spiff img, .content2 img {
  border: 1px solid #7d82b8;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

h2.home-news {
  color: #2b3075;
  font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  text-align: center; }

.bottom-shadow {
  box-shadow: 0px 9px 10px -5px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0px 9px 10px -5px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0px 9px 10px -5px rgba(0, 0, 0, 0.3);
  -o-box-shadow: 0px 9px 10px -5px rgba(0, 0, 0, 0.3);
  position: relative; }

.text-center {
  text-align: center; }

.uppercase {
  text-transform: uppercase; }

hr.short {
  margin: 30px 0px !important; }

.learn-how {
  position: absolute;
  bottom: 30px;
  left: 37px; }
  .learn-how a {
    padding: 10px 30px;
    background: none;
    border: 1px solid #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #fff !important; }
  .learn-how a:hover {
    color: #f4801f !important;
    border-color: #f4801f;
    text-decoration: none; }

.addressMap img {
  max-width: 100%;
  height: auto; }

p.sharethis {
  margin: 15px 0 30px; }

a.ShareIcon {
  width: 17px;
  height: 17px;
  background: url("/themes/unitedway/images/ShareIcons.png") no-repeat top left;
  display: inline-block;
  margin-right: 10px; }

a.fb-share.ShareIcon {
  background-position: 0px 0px; }

a.tw-share.ShareIcon {
  background-position: -18px 0px; }

a.go-share.ShareIcon {
  background-position: -36px 0px; }

a.li-share.ShareIcon {
  background-position: -55px 0px; }

a.pi-share.ShareIcon {
  background-position: -74px 0px; }

a.em-share.ShareIcon {
  background-position: -92px 0px; }

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden; }

.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

#video-overlay {
  display: none; }

#video-overlay, #transparent-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px;
  z-index: 5000;
  background: url("/themes/unitedway/images/video-bg.png") repeat top left; }

#video-overlay #video {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  display: block;
  position: relative;
  z-index: 9999;
  top: 20%; }

#video-overlay #video a.VideoClose {
  position: absolute;
  top: -25px;
  right: 25%; }

.ImageGallery {
  margin-bottom: 40px; }

.simple_overlay img {
  max-width: 900px;
  height: auto;
  max-height: 80%;
  height: 80%; }

.simple_overlay object, .simple_overlay iframe {
  position: relative;
  z-index: 5010; }

/* the overlayed element */
.simple_overlay {
  /* must be initially hidden */
  display: none;
  /* place overlay on top of other elements */
  z-index: 10000;
  /* styling */
  background-color: #333;
  border: 1px solid #666;
  /* CSS3 styling for latest browsers */
  -moz-box-shadow: 0 0 90px 5px #000;
  -webkit-box-shadow: 0 0 90px #000; }

.simple_overlay img {
  z-index: 9999;
  position: relative; }

/* close button positioned on upper right corner */
.simple_overlay .close {
  background-image: url(/themes/unitedway/images/close.png);
  position: absolute;
  right: -15px;
  top: -15px;
  cursor: pointer;
  height: 35px;
  width: 35px;
  z-index: 10001; }

/* #Media Queries
================================================== */
/* Smaller than standard 960 (devices and browsers) */
/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .crumbs, #access {
    display: none !important; }
  .mobile-navigation {
    float: right;
    margin-top: -30px; }
  .mobile-menu {
    display: block;
    width: 125px;
    margin-top: 40px; }
  #mobilenavs {
    list-style: none;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 550;
    display: block !important; }
    #mobilenavs li {
      position: relative;
      text-align: center; }
      #mobilenavs li ul {
        margin-left: auto;
        margin-right: auto;
        left: auto;
        right: -10px;
        width: 768px;
        display: none;
        top: 27px;
        z-index: 600 !important; }
        #mobilenavs li ul a {
          text-decoration: none;
          color: #fff;
          font-size: 19px;
          font-weight: 900; }
        #mobilenavs li ul li.mobile-util a {
          text-decoration: none;
          color: #1e1c2d;
          font-size: 16px;
          font-weight: normal; }
    #mobilenavs li:hover ul li a:hover {
      text-decoration: none !important;
      filter: alpha(opacity=60);
      -moz-opacity: 0.6;
      -khtml-opacity: 0.6;
      opacity: 0.6; }
    #mobilenavs a {
      display: block; }
    #mobilenavs ul {
      position: absolute;
      left: -9999px;
      margin: 7px 0px 0px;
      background-color: #2b3075; }
      #mobilenavs ul a {
        white-space: nowrap;
        padding: 7px 5px;
        height: auto; }
      #mobilenavs ul li {
        padding: 3px 0px 8px;
        width: 90%;
        margin: 0px auto;
        border-left: none;
        border-right: none;
        border-bottom: 2px solid #f4801f;
        text-align: center; }
      #mobilenavs ul li:last-child {
        border: none; }
  nav.mobile-subnav {
    display: block !important; }
  nav.mobile-subnav li {
    width: 767px !important; }
  nav.utility {
    display: none; }
  .nav-bg {
    height: 5px;
    position: relative; }
  nav.gav {
    position: relative;
    margin-top: -3px;
    top: 17px;
    height: 100px;
    margin-bottom: 15px; }
    nav.gav li {
      width: 50%;
      text-align: center;
      margin-bottom: 10px; }
      nav.gav li.donate.mobile-only {
        background-color: #cd2e32;
        display: inline-block !important; }
  .sixteen.columns.header .seven.columns.alpha.brand {
    width: 100%;
    margin: 0px !important; }
  .sixteen.columns.header .nine.columns.omega.navigation {
    width: 100%;
    margin: 0px !important; }
  .header h1 img {
    display: inline-block; }
  .spiff .spiff-text {
    top: 170px; }
  .img-side, .text-side {
    width: 50% !important;
    padding-bottom: 0px !important; }
  .spiff-holder {
    height: 236px !important; } }

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
  .crumbs, #access {
    display: none !important; }
  .mobile-navigation {
    float: right;
    margin-top: -30px; }
  #mobilenavs {
    list-style: none;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 550;
    display: block !important; }
    #mobilenavs li {
      position: relative;
      text-align: center; }
      #mobilenavs li ul {
        margin-left: auto;
        margin-right: auto;
        left: auto;
        right: 0px;
        width: 300px;
        display: none;
        top: 27px;
        z-index: 600 !important; }
        #mobilenavs li ul a {
          text-decoration: none;
          color: #fff;
          font-size: 19px;
          font-weight: 900; }
        #mobilenavs li ul li.mobile-util a {
          text-decoration: none;
          color: #1e1c2d;
          font-size: 16px;
          font-weight: normal; }
        #mobilenavs li ul li a:hover {
          text-decoration: none !important;
          filter: alpha(opacity=60);
          -moz-opacity: 0.6;
          -khtml-opacity: 0.6;
          opacity: 0.6; }
    #mobilenavs a {
      display: block; }
    #mobilenavs ul {
      position: absolute;
      left: -9999px;
      margin: 7px 0px 0px;
      background-color: #2b3075; }
      #mobilenavs ul a {
        white-space: nowrap;
        padding: 7px 5px;
        height: auto; }
      #mobilenavs ul li {
        padding: 3px 0px 8px;
        width: 90%;
        margin: 0px auto;
        border-left: none;
        border-right: none;
        border-bottom: 2px solid #f4801f;
        text-align: center; }
      #mobilenavs ul li:last-child {
        border: none; }
  .header .five.columns, .header .eleven.columns {
    width: 50% !important; }
  .blog-list .two.columns {
    width: 76px !important; }
  .blog-list .ten.columns {
    width: 210px !important;
    margin-left: 10px; }
  .footer .columns {
    margin-bottom: 10px !important; }
  .mobile-top {
    margin-top: 20px !important; }
  nav.utility {
    display: none; }
  .content {
    margin-top: 20px !important; }
  .sidebar {
    margin-top: 20px !important;
    padding-top: 20px;
    border-top: 1px solid #8baee8; }
  .footer .social ul {
    text-align: center;
    display: block; }
  .footer .social li {
    display: inline-block; }
  .field, .control-group {
    min-width: 98% !important; }
  .nav-bg {
    height: 5px;
    position: relative; }
  nav.gav {
    position: relative;
    margin-top: -3px;
    top: 17px;
    margin-bottom: 20px;
    height: 169px; }
    nav.gav li {
      width: 100%;
      text-align: center;
      margin-bottom: 10px; }
      nav.gav li.donate.mobile-only {
        background-color: #cd2e32;
        display: block; }
  .brand h1 a img {
    width: 85% !important; }
  .text-side, .img-side {
    width: 100% !important; }
  .spiff {
    margin-bottom: 20px !important; }
  .BlogSection .two.columns {
    width: 76px !important; }
  .BlogSection .ten.columns {
    width: 210px !important;
    margin-left: 10px !important; }
  .home .flexslider {
    background: none; }
  .learn-how {
    position: relative;
    top: 0px;
    left: 0px;
    text-align: center;
    margin: 20px 0px; }
    .learn-how a {
      color: #868686 !important;
      border-color: #868686; }
  #video-object embed {
    width: 100% !important; }
  .spiff-holder {
    height: 300px !important; } }

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  #mobilenavs {
    list-style: none;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 601;
    display: block !important; }
    #mobilenavs li ul {
      width: 420px;
      right: 0px;
      left: auto;
      top: 27px; }
  nav.gav {
    position: relative;
    margin-top: -3px;
    top: 17px;
    margin-bottom: 20px;
    height: 73px; }
    nav.gav li {
      width: 50%;
      text-align: center;
      margin-bottom: 10px; }
      nav.gav li.donate {
        background-color: #cd2e32;
        display: inline-block !important; }
  .blog-list .ten.columns {
    width: 330px !important; }
  .brand h1 a img {
    width: auto !important; }
  .spiff .spiff-text {
    top: 360px; }
  .BlogSection .ten.columns {
    width: 330px !important;
    margin-left: 10px !important; }
  .spiff-holder {
    height: 420px !important; } }

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */


/****** FILE: themes/unitedway/css/typography.css *****/
/* Variables
================================================== */
/* #Typography
================================================== */
body {
  background: #e8e8e7;
  font: 16px/21px "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
  color: #5a5a5a;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%; }

h1, h2, h3, h4, h5, h6 {
  color: #2b3075;
  font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
  font-weight: 900; }
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-weight: inherit; }

h1 {
  font-size: 46px;
  line-height: 50px;
  margin-bottom: 14px; }

h2 {
  font-size: 35px;
  line-height: 40px;
  margin-bottom: 10px; }

h3 {
  font-size: 28px;
  line-height: 34px;
  margin-bottom: 8px; }

h4 {
  font-size: 21px;
  line-height: 30px;
  margin-bottom: 4px; }

h5 {
  font-size: 17px;
  line-height: 24px; }

h6 {
  font-size: 14px;
  line-height: 21px; }

p {
  margin: 0 0 20px 0; }
  p img {
    margin: 0; }
  p.lead {
    font-size: 21px;
    line-height: 27px;
    color: #777; }
  p a, p a:visited {
    line-height: inherit; }

.footer, span.tags {
  font-size: 12px;
  line-height: 12px; }

em {
  font-style: italic; }

strong, .strong {
  font-weight: bold; }

small {
  font-size: 80%; }

/*	Blockquotes  */
blockquote, blockquote p {
  font-size: 17px;
  line-height: 24px;
  color: #777;
  font-style: italic; }

blockquote {
  margin: 0 0 20px;
  padding: 9px 20px 0 19px;
  border-left: 1px solid #ddd; }
  blockquote cite {
    display: block;
    font-size: 12px;
    color: #555; }
    blockquote cite a, blockquote cite a:visited {
      color: #555; }
  blockquote cite:before {
    content: "\2014 \0020"; }

hr {
  border: solid #8baee8;
  border-width: 1px 0 0;
  clear: both;
  margin: 40px 0;
  height: 0; }

/* #Links
================================================== */
a, a:visited {
  color: #f4801f;
  text-decoration: none;
  outline: 0; }

a:hover, a:focus {
  text-decoration: underline; }

/* #Lists
================================================== */
ul, ol {
  margin-bottom: 20px; }

ul {
  list-style: none outside; }

ol {
  list-style: decimal; }

ol, ul.square, ul.circle, ul.disc {
  margin-left: 30px; }

ul.square {
  list-style: square outside; }

ul.circle {
  list-style: circle outside; }

ul.disc {
  list-style: disc outside; }

ul ul, ul ol,
ol ol, ol ul {
  margin: 4px 0 5px 30px;
  font-size: 90%; }

ul ul li, ul ol li,
ol ol li, ol ul li {
  margin-bottom: 6px; }

li {
  line-height: 18px; }

ul.large li {
  line-height: 21px; }

li p {
  line-height: 21px; }

.typography ul {
  list-style-type: disc;
  margin-left: 20px; }

.typography ol {
  list-style-type: decimal;
  margin-left: 20px; }

/* LINK ICONS - shows type of file
================================================== */
.typography a[href$=".pdf"],
.typography a[href$=".PDF"],
.typography a.pdf {
  padding: 2px;
  padding-left: 20px;
  background: url(/dynamic-core/images/icons/page_white_acrobat.png) no-repeat left center; }

.typography a[href$=".doc"],
.typography a[href$=".DOC"],
.typography a.doc {
  padding: 2px;
  padding-left: 20px;
  background: url(/dynamic-core/images/icons/page_word.png) no-repeat left center; }

.typography a[href$=".xls"],
.typography a[href$=".XLS"],
.typography a.xls {
  padding: 2px;
  padding-left: 20px;
  background: url(/dynamic-core/images/icons/page_excel.png) no-repeat left center; }

.typography a[href$=".gz"],
.typography a[href$=".GZ"],
.typography a[href$=".gzip"],
.typography a[href$=".GZIP"],
.typography a[href$=".zip"],
.typography a[href$=".ZIP"],
.typography a.archive {
  padding: 2px;
  padding-left: 20px;
  background: url(/dynamic-core/images/icons/page_white_zip.png) no-repeat left center; }

.typography a[href$=".exe"],
.typography a[href$=".EXE"],
.typography a.application {
  padding: 2px;
  padding-left: 20px;
  background: url(/dynamic-core/images/icons/application.png) no-repeat left center; }

/* WYSIWYG EDITOR ALIGNMENT CLASSES 
-------------------------------------------- */
.typography .left {
  text-align: left; }

.typography .center {
  text-align: center; }

.typography .right {
  text-align: right; }

/* IMAGES 
-------------------------------------------- */
.typography img.left {
  float: left;
  max-width: 50%;
  margin: 5px 20px 10px 0; }

.typography img.right {
  float: right;
  max-width: 50%;
  /* Responsive width */
  margin: 5px 0 10px 20px; }

.typography img.leftAlone {
  float: left;
  margin-right: 100%;
  margin-bottom: 10px;
  clear: both; }

.typography img.center {
  float: none;
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-bottom: 10px;
  clear: both; }


/****** FILE: themes/unitedway/css/form.css *****/
/* #Buttons
================================================== */
.donatebutton {
  background: #cd2e32;
  color: #fff !important;
  display: inline-block;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  margin-bottom: 20px;
  line-height: normal;
  padding: 5px 55px;
  border: none;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 900;
  font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif;
  margin-left: 15px; }

.covid-19__button {
  background: #005192;
  color: #ffb351 !important;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  line-height: normal;
  padding: 12px 60px;
  border: none;
  border-radius: 2px;
  font-size: 16px;
  font-weight: 400;
  text-transform: uppercase;
  font-family: "Roboto", Helvetica, Arial, sans-serif;
  transition: all .3s ease-out; }
  .covid-19__button:hover {
    background: #005fab;
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
    text-decoration: none; }
  .covid-19__button:focus {
    text-decoration: none; }

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  background: #2b3075;
  /* Old browsers */
  color: #fff !important;
  display: inline-block;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  margin-bottom: 20px;
  line-height: normal;
  padding: 5px 55px;
  border: none;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 900;
  font-family: "nimbus-sans-condensed", Helvetica, Arial, sans-serif; }

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.donatebutton:hover {
  background: #bebebe;
  text-decoration: underline; }

.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
  border: 1px solid #666;
  background: #ccc;
  /* Old browsers */
  background: #ccc -moz-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba(10, 10, 10, 0.4) 100%);
  /* FF3.6+ */
  background: #ccc -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.35)), color-stop(100%, rgba(10, 10, 10, 0.4)));
  /* Chrome,Safari4+ */
  background: #ccc -webkit-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba(10, 10, 10, 0.4) 100%);
  /* Chrome10+,Safari5.1+ */
  background: #ccc -o-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba(10, 10, 10, 0.4) 100%);
  /* Opera11.10+ */
  background: #ccc -ms-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba(10, 10, 10, 0.4) 100%);
  /* IE10+ */
  background: #ccc linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba(10, 10, 10, 0.4) 100%);
  /* W3C */ }

.button.full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
  width: 100%;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: center; }

/* Fix for odd Mozilla border & padding issues */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/* #Forms
================================================== */
form {
  margin-bottom: 20px; }

fieldset {
  margin-bottom: 20px; }

input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
  border: 1px solid #ccc;
  padding: 6px 4px;
  outline: none;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #777;
  margin: 0;
  width: 100%;
  max-width: 100%;
  display: block;
  margin-bottom: 20px;
  background: #fff; }

select {
  padding: 0; }

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus {
  border: 1px solid #aaa;
  color: #444;
  -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); }

textarea {
  min-height: 60px; }

label,
legend {
  display: block;
  font-weight: bold;
  font-size: 13px; }

select {
  width: 220px; }

input[type="checkbox"] {
  display: inline; }

label span,
legend span {
  font-weight: normal;
  font-size: 13px;
  color: #444; }

/*  EXTRA CLASSES
------------------------------------ */
.field, .control-group {
  display: block;
  float: left;
  margin-right: 4%;
  min-width: 46%; }

.control-group .fullfield {
  width: 98%; }

.fullfield {
  width: 98%; }

.field.checkbox label {
  display: inline-block; }

#Search, #Search .middleColumn input, #SearchForm_SearchForm input {
  display: inline; }

#Search .middleColumn {
  display: inline-block; }

label.required {
  color: red !important;
  font-size: 11px;
  position: absolute;
  top: 28px; }

.middleColumn {
  position: relative; }


/****** FILE: themes/unitedway/javascript/meanMenu/meanmenu.css *****/


/* #######################################################################

	meanMenu
	--------
	
	To be used with jquery.meanmenu.js by Chris Wharton (http://www.meanthemes.com/plugins/meanmenu/)

####################################################################### */

/* hide the link until viewport size is reached */
a.meanmenu-reveal {
display: none;
}

/* when under viewport size, .mean-container is added to body */
.mean-container .mean-bar { 
float: left;
width: 100%;
position: relative;
background: #0c1923;
padding: 4px 0;
min-height: 42px;
z-index: 999999;
}
.mean-container a.meanmenu-reveal {
width: 22px;
height: 22px;
padding: 13px 13px 11px 13px;
position: absolute;
top: 0;
right: 0;
cursor: pointer;
color: #fff;
text-decoration: none;
font-size: 16px;
text-indent: -9999em;
line-height: 22px;
font-size: 1px;
display: block;
font-family: Arial, Helvetica, sans-serif;
font-weight: 700;
}
.mean-container a.meanmenu-reveal span {
display: block;
background: #fff;
height: 3px;
margin-top: 3px;
}
.mean-container .mean-nav { 
float: left;
width: 100%;
background: #0c1923;
margin-top: 33px;
}
.mean-container .mean-nav ul {
padding: 0;
margin: 0;
width: 100%;
list-style-type: none;
}
.mean-container .mean-nav ul li {
position: relative;
float: left;
width: 100%;
}
.mean-container .mean-nav ul li a {
display: block;
float: left;
width: 90%;
padding: 1em 5%;
margin: 0;
text-align: left;
color: #fff;
border-bottom: 1px solid #383838;
border-bottom: 1px solid rgba(255,255,255,0.5);
text-decoration: none;
text-transform: uppercase;
}
.mean-container .mean-nav ul li li a {
width: 80%;
padding: 1em 10%;
border-bottom: 1px solid #f1f1f1;
border-bottom: 1px solid rgba(255,255,255,0.25);
opacity: 0.75; 
filter: alpha(opacity=75);
text-shadow: none !important;
visibility: visible;
}
.mean-container .mean-nav ul li.mean-last a {
border-bottom: none;
margin-bottom: 0;
}
.mean-container .mean-nav ul li li li a {
width: 70%;
padding: 1em 15%;
}
.mean-container .mean-nav ul li li li li a {
width: 60%;
padding: 1em 20%;
}
.mean-container .mean-nav ul li li li li li a {
width: 50%;
padding: 1em 25%;
}
.mean-container .mean-nav ul li a:hover { 
background: #252525;
background: rgba(255,255,255,0.1); 
}
.mean-container .mean-nav ul li a.mean-expand {
width: 26px;
height: 26px;
border: none !important;
padding: 12px !important;
text-align: center;
position: absolute;
right: 0;
top: 0;
z-index: 2;
font-weight: 700;
}
.mean-container .mean-nav ul li a.mean-expand:hover {
background: none;
}
.mean-container .mean-push { 
float: left;
width: 100%;
padding: 0;
margin: 0;
clear: both; 
}
.mean-nav .wrapper {
width: 100%;
padding: 0;
margin: 0;
}


/****** FILE: themes/unitedway/css/skeleton.css *****/
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */

    .container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
    .container .column,
    .container .columns                         { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
    .row                                        { margin-bottom: 20px; }

    /* Nested Column Classes */
    .column.alpha, .columns.alpha               { margin-left: 0; }
    .column.omega, .columns.omega               { margin-right: 0; }

    /* Base Grid */
    .container .one.column,
    .container .one.columns                     { width: 40px;  }
    .container .two.columns                     { width: 100px; }
    .container .three.columns                   { width: 160px; }
    .container .four.columns                    { width: 220px; }
    .container .five.columns                    { width: 280px; }
    .container .six.columns                     { width: 340px; }
    .container .seven.columns                   { width: 400px; }
    .container .eight.columns                   { width: 460px; }
    .container .nine.columns                    { width: 520px; }
    .container .ten.columns                     { width: 580px; }
    .container .eleven.columns                  { width: 640px; }
    .container .twelve.columns                  { width: 700px; }
    .container .thirteen.columns                { width: 760px; }
    .container .fourteen.columns                { width: 820px; }
    .container .fifteen.columns                 { width: 880px; }
    .container .sixteen.columns                 { width: 940px; }

    .container .one-third.column                { width: 300px; }
    .container .two-thirds.column               { width: 620px; }

    /* Offsets */
    .container .offset-by-one                   { padding-left: 60px;  }
    .container .offset-by-two                   { padding-left: 120px; }
    .container .offset-by-three                 { padding-left: 180px; }
    .container .offset-by-four                  { padding-left: 240px; }
    .container .offset-by-five                  { padding-left: 300px; }
    .container .offset-by-six                   { padding-left: 360px; }
    .container .offset-by-seven                 { padding-left: 420px; }
    .container .offset-by-eight                 { padding-left: 480px; }
    .container .offset-by-nine                  { padding-left: 540px; }
    .container .offset-by-ten                   { padding-left: 600px; }
    .container .offset-by-eleven                { padding-left: 660px; }
    .container .offset-by-twelve                { padding-left: 720px; }
    .container .offset-by-thirteen              { padding-left: 780px; }
    .container .offset-by-fourteen              { padding-left: 840px; }
    .container .offset-by-fifteen               { padding-left: 900px; }



/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
        .container                                  { width: 768px; }
        .container .column,
        .container .columns                         { margin-left: 10px; margin-right: 10px;  }
        .column.alpha, .columns.alpha               { margin-left: 0; margin-right: 10px; }
        .column.omega, .columns.omega               { margin-right: 0; margin-left: 10px; }
        .alpha.omega                                { margin-left: 0; margin-right: 0; }

        .container .one.column,
        .container .one.columns                     { width: 28px; }
        .container .two.columns                     { width: 76px; }
        .container .three.columns                   { width: 124px; }
        .container .four.columns                    { width: 172px; }
        .container .five.columns                    { width: 220px; }
        .container .six.columns                     { width: 268px; }
        .container .seven.columns                   { width: 316px; }
        .container .eight.columns                   { width: 364px; }
        .container .nine.columns                    { width: 412px; }
        .container .ten.columns                     { width: 460px; }
        .container .eleven.columns                  { width: 508px; }
        .container .twelve.columns                  { width: 556px; }
        .container .thirteen.columns                { width: 604px; }
        .container .fourteen.columns                { width: 652px; }
        .container .fifteen.columns                 { width: 700px; }
        .container .sixteen.columns                 { width: 748px; }

        .container .one-third.column                { width: 236px; }
        .container .two-thirds.column               { width: 492px; }

        /* Offsets */
        .container .offset-by-one                   { padding-left: 48px; }
        .container .offset-by-two                   { padding-left: 96px; }
        .container .offset-by-three                 { padding-left: 144px; }
        .container .offset-by-four                  { padding-left: 192px; }
        .container .offset-by-five                  { padding-left: 240px; }
        .container .offset-by-six                   { padding-left: 288px; }
        .container .offset-by-seven                 { padding-left: 336px; }
        .container .offset-by-eight                 { padding-left: 384px; }
        .container .offset-by-nine                  { padding-left: 432px; }
        .container .offset-by-ten                   { padding-left: 480px; }
        .container .offset-by-eleven                { padding-left: 528px; }
        .container .offset-by-twelve                { padding-left: 576px; }
        .container .offset-by-thirteen              { padding-left: 624px; }
        .container .offset-by-fourteen              { padding-left: 672px; }
        .container .offset-by-fifteen               { padding-left: 720px; }
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .container { width: 300px; }
        .container .columns,
        .container .column { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column  { width: 300px; }

        /* Offsets */
        .container .offset-by-one,
        .container .offset-by-two,
        .container .offset-by-three,
        .container .offset-by-four,
        .container .offset-by-five,
        .container .offset-by-six,
        .container .offset-by-seven,
        .container .offset-by-eight,
        .container .offset-by-nine,
        .container .offset-by-ten,
        .container .offset-by-eleven,
        .container .offset-by-twelve,
        .container .offset-by-thirteen,
        .container .offset-by-fourteen,
        .container .offset-by-fifteen { padding-left: 0; }

    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .container { width: 420px; }
        .container .columns,
        .container .column { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column { width: 420px; }
    }


/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }