/* Requires: normalize.css */
/* Global Reset & Standards ---------------------- */
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  background: white;
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  font-size: ms(0);
  line-height: 1;
  color: #4c565c;
  position: relative;
  -webkit-font-smoothing: antialiased;
}

/* Links ---------------------- */
a img {
  border: none;
}

a {
  color: #2ba6cb;
  text-decoration: none;
  line-height: inherit;
}

a:hover, .friend-result:hover .add-friend-link {
  color: #2795b6;
}

a:focus {
  color: #2795b6;
}

p a, p a:visited {
  line-height: inherit;
}

/* Misc ---------------------- */
.left {
  float: left;
}

.right {
  float: right;
}

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

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

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

.hide {
  display: none;
}

.hide-override {
  display: none !important;
}

.highlight {
  background: #ffff99;
}

#googlemap img, object, embed {
  max-width: none;
}

#map_canvas embed {
  max-width: none;
}

#map_canvas img {
  max-width: none;
}

#map_canvas object {
  max-width: none;
}

/* Reset for strange margins by default on <figure> elements */
figure {
  margin: 0;
}

/* The Grid ---------------------- */
.row {
  width: 1200px;
  max-width: 100%;
  min-width: 768px;
  margin: 0 auto;
}
.row .row {
  width: auto;
  max-width: none;
  min-width: 0;
  margin: 0 -15px;
}
.row.collapse .column, .row.collapse .columns {
  padding: 0;
}
.row .row {
  width: auto;
  max-width: none;
  min-width: 0;
  margin: 0 -15px;
}
.row .row.collapse {
  margin: 0;
}

.column, .columns {
  float: left;
  min-height: 1px;
  padding: 0 15px;
  position: relative;
}
.column.centered, .columns.centered {
  float: none;
  margin: 0 auto;
}

[class*="column"] + [class*="column"]:last-child {
  float: right;
}

[class*="column"] + [class*="column"].end {
  float: left;
}

.one, .row .one {
  width: 8.33333%;
}

.two, .row .two {
  width: 16.66667%;
}

.three, .row .three {
  width: 25%;
}

.four, .row .four {
  width: 33.33333%;
}

.five, .row .five {
  width: 41.66667%;
}

.six, .row .six {
  width: 50%;
}

.seven, .row .seven {
  width: 58.33333%;
}

.eight, .row .eight {
  width: 66.66667%;
}

.nine, .row .nine {
  width: 75%;
}

.ten, .row .ten {
  width: 83.33333%;
}

.eleven, .row .eleven {
  width: 91.66667%;
}

.twelve, .row .twelve {
  width: 100%;
}

.row .offset-by-one {
  margin-left: 8.33333%;
}

.row .offset-by-two {
  margin-left: 16.66667%;
}

.row .offset-by-three {
  margin-left: 25%;
}

.row .offset-by-four {
  margin-left: 33.33333%;
}

.row .offset-by-five {
  margin-left: 41.66667%;
}

.row .offset-by-six {
  margin-left: 50%;
}

.row .offset-by-seven {
  margin-left: 58.33333%;
}

.row .offset-by-eight {
  margin-left: 66.66667%;
}

.row .offset-by-nine {
  margin-left: 75%;
}

.row .offset-by-ten {
  margin-left: 83.33333%;
}

.push-two {
  left: 16.66667%;
}

.pull-two {
  right: 16.66667%;
}

.push-three {
  left: 25%;
}

.pull-three {
  right: 25%;
}

.push-four {
  left: 33.33333%;
}

.pull-four {
  right: 33.33333%;
}

.push-five {
  left: 41.66667%;
}

.pull-five {
  right: 41.66667%;
}

.push-six {
  left: 50%;
}

.pull-six {
  right: 50%;
}

.push-seven {
  left: 58.33333%;
}

.pull-seven {
  right: 58.33333%;
}

.push-eight {
  left: 66.66667%;
}

.pull-eight {
  right: 66.66667%;
}

.push-nine {
  left: 75%;
}

.pull-nine {
  right: 75%;
}

.push-ten {
  left: 83.33333%;
}

.pull-ten {
  right: 83.33333%;
}

img {
  height: auto;
}

img, object, embed {
  max-width: 100%;
}

img {
  -ms-interpolation-mode: bicubic;
}

#map_canvas img, .map_canvas img {
  max-width: none !important;
}

/* Nicolas Gallagher's micro clearfix */
.row {
  *zoom: 1;
}
.row:before, .row:after {
  content: " ";
  display: table;
}
.row:after {
  clear: both;
}

/* Block Grids ---------------------- */
/* These are 2-up, 3-up, 4-up and 5-up ULs, suited
for repeating blocks of content. Add 'mobile' to
them to switch them just like the layout grid
(one item per line) on phones

For IE7/8 compatibility block-grid items need to be
the same height. You can optionally uncomment the
lines below to support arbitrary height, but know
that IE7/8 do not support :nth-child.
-------------------------------------------------- */
.block-grid {
  display: block;
  overflow: hidden;
  padding: 0;
}
.block-grid > li {
  display: block;
  height: auto;
  float: left;
}
.block-grid.one-up {
  margin: 0;
}
.block-grid.one-up > li {
  width: 100%;
  padding: 0 0 15px;
}
.block-grid.two-up {
  margin: 0 -15px;
}
.block-grid.two-up > li {
  width: 50%;
  padding: 0 15px 15px;
}
.block-grid.two-up > li:nth-child(2n+1) {
  clear: both;
}
.block-grid.three-up {
  margin: 0 -12px;
}
.block-grid.three-up > li {
  width: 33.33333%;
  padding: 0 12px 12px;
}
.block-grid.three-up > li:nth-child(3n+1) {
  clear: both;
}
.block-grid.four-up {
  margin: 0 -10px;
}
.block-grid.four-up > li {
  width: 25%;
  padding: 0 10px 10px;
}
.block-grid.four-up > li:nth-child(4n+1) {
  clear: both;
}
.block-grid.five-up {
  margin: 0 -8px;
}
.block-grid.five-up > li {
  width: 20%;
  padding: 0 8px 8px;
}
.block-grid.five-up > li:nth-child(5n+1) {
  clear: both;
}
.block-grid.six-up {
  margin: 0 -8px;
}
.block-grid.six-up > li {
  width: 16.66667%;
  padding: 0 8px 8px;
}
.block-grid.six-up > li:nth-child(6n+1) {
  clear: both;
}
.block-grid.seven-up {
  margin: 0 -8px;
}
.block-grid.seven-up > li {
  width: 14.28571%;
  padding: 0 8px 8px;
}
.block-grid.seven-up > li:nth-child(7n+1) {
  clear: both;
}
.block-grid.eight-up {
  margin: 0 -8px;
}
.block-grid.eight-up > li {
  width: 12.5%;
  padding: 0 8px 8px;
}
.block-grid.eight-up > li:nth-child(8n+1) {
  clear: both;
}
.block-grid.nine-up {
  margin: 0 -8px;
}
.block-grid.nine-up > li {
  width: 11.11111%;
  padding: 0 8px 8px;
}
.block-grid.nine-up > li:nth-child(9n+1) {
  clear: both;
}
.block-grid.ten-up {
  margin: 0 -8px;
}
.block-grid.ten-up > li {
  width: 10%;
  padding: 0 8px 8px;
}
.block-grid.ten-up > li:nth-child(10n+1) {
  clear: both;
}
.block-grid.eleven-up {
  margin: 0 -8px;
}
.block-grid.eleven-up > li {
  width: 9.09091%;
  padding: 0 8px 8px;
}
.block-grid.eleven-up > li:nth-child(11n+1) {
  clear: both;
}
.block-grid.twelve-up {
  margin: 0 -8px;
}
.block-grid.twelve-up > li {
  width: 8.33333%;
  padding: 0 8px 8px;
}
.block-grid.twelve-up > li:nth-child(12n+1) {
  clear: both;
}

/* Base Type Styles Using Modular Scale ---------------------- */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h5, h6, pre, form, p, blockquote, th, td {
  margin: 0;
  padding: 0;
  font-size: 18px;
  direction: ltr;
}

p {
  font-family: inherit;
  font-weight: normal;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 27px;
}
p.lead {
  font-size: 22.5px;
  line-height: 1.6;
  margin-bottom: 27px;
}

aside p {
  font-size: 17px;
  line-height: 1.35;
  font-style: italic;
}

h1, h2, h3, h4, h5, h5, h6 {
  font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-style: normal;
  color: #336d8a;
  text-rendering: optimizeLegibility;
  line-height: 1.1;
  margin-bottom: 18px;
  margin-top: 18px;
}
h1 small, h2 small, h3 small, h4 small, h5 small, h5 small, h6 small {
  font-size: 60%;
  color: #84b8d2;
  line-height: 0;
}

h1 {
  font-size: 71px;
}

h2 {
  font-size: 47px;
}

h3 {
  font-size: 44px;
}

h4, h5 {
  font-size: 29px;
}

h5 {
  font-size: 27px;
}

h6 {
  font-size: 18px;
}

hr {
  border: solid #ddd;
  border-width: 1px 0 0;
  clear: both;
  margin: 22px 0 21px;
  height: 0;
}

.subheader {
  line-height: 1.3;
  color: #84b8d2;
  font-weight: 300;
  margin-bottom: 27px;
}

em, i {
  font-style: italic;
  line-height: inherit;
}

strong, b {
  font-weight: bold;
  line-height: inherit;
}

small {
  font-size: 60%;
  line-height: inherit;
}

code {
  font-weight: bold;
  background: #ffff99;
}

/* Lists ---------------------- */
ul, ol, dl {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 27px;
  list-style-position: outside;
}

ul li ul, ul li ol {
  margin-left: 20px;
  margin-bottom: 0;
}
ul.square, ul.circle, ul.disc {
  margin-left: 27px;
}
ul.square {
  list-style-type: square;
}
ul.square li ul {
  list-style: inherit;
}
ul.circle {
  list-style-type: circle;
}
ul.circle li ul {
  list-style: inherit;
}
ul.disc {
  list-style-type: disc;
}
ul.disc li ul {
  list-style: inherit;
}
ul.no-bullet {
  list-style: none;
}
ul.large li {
  line-height: 21px;
}

ol {
  margin-left: 20px;
}
ol li ul, ol li ol {
  margin-left: 20px;
  margin-bottom: 0;
}

/* Blockquotes ---------------------- */
blockquote, blockquote p {
  line-height: 1.5;
  color: #84b8d2;
}

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

abbr, acronym {
  text-transform: uppercase;
  font-size: 90%;
  color: #336d8a;
  border-bottom: 1px solid #ddd;
  cursor: help;
}

abbr {
  text-transform: none;
}

/*
 * Print styles.
 *
 * Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
 * Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com)
*/
.print-only {
  display: none !important;
}

@media print {
  * {
    background: transparent !important;
    color: black !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important;
  }

  /* Black prints faster: h5bp.com/s */
  a, a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
    content: "";
  }

  /* Don't show links for images, or javascript/internal links */
  pre, blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
  }

  /* h5bp.com/t */
  tr, img {
    page-break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }

  @page {
    margin: 0.5cm;
}

  p, h2, h3 {
    orphans: 3;
    widows: 3;
  }

  h2, h3 {
    page-break-after: avoid;
  }

  .hide-on-print {
    display: none !important;
  }

  .print-only {
    display: block !important;
  }

  .hide-for-print {
    display: none !important;
  }

  .show-for-print {
    display: inherit !important;
  }
}
/* Requires
   globals.css */
/* Standard Forms ---------------------- */
form {
  margin: 0 0 19.41641px;
}

.row form .row {
  margin: 0 -6px;
}
.row form .row .column, .row form .row .columns {
  padding: 0 6px;
}
.row form .row.collapse {
  margin: 0;
}
.row form .row.collapse .column, .row form .row.collapse .columns {
  padding: 0;
}

label {
  font-size: 18px;
  color: #4d4d4d;
  cursor: pointer;
  display: block;
  font-weight: 500;
  margin-bottom: 3px;
}
label.right {
  float: none;
  text-align: right;
}
label.inline {
  line-height: 36px;
  margin: 0 0 12px 0;
}

.prefix, .postfix {
  display: block;
  position: relative;
  z-index: 2;
  text-align: center;
  width: 100%;
  padding-top: 0;
  padding-bottom: 0;
  height: 36px;
  line-height: 35px;
}

a.button.prefix, a.button.postfix {
  padding-left: 0;
  padding-right: 0;
  text-align: center;
}

span.prefix, span.postfix {
  background: #f2f2f2;
  border: 1px solid #cccccc;
}

.prefix {
  left: 2px;
  -moz-border-radius-topleft: 2px;
  -webkit-border-top-left-radius: 2px;
  border-top-left-radius: 2px;
  -moz-border-radius-bottomleft: 2px;
  -webkit-border-bottom-left-radius: 2px;
  border-bottom-left-radius: 2px;
  overflow: hidden;
}

.postfix {
  right: 2px;
  -moz-border-radius-topright: 2px;
  -webkit-border-top-right-radius: 2px;
  border-top-right-radius: 2px;
  -moz-border-radius-bottomright: 2px;
  -webkit-border-bottom-right-radius: 2px;
  border-bottom-right-radius: 2px;
}

input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea {
  background-color: white;
  font-family: inherit;
  border: 1px solid #cccccc;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.75);
  display: block;
  font-size: 14px;
  margin: 0 0 12px 0;
  padding: 6px;
  height: 36px;
  width: 100%;
  -webkit-transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -o-transition: all 0.15s linear;
  transition: all 0.15s linear;
}
input[type="text"].oversize, input[type="password"].oversize, input[type="date"].oversize, input[type="datetime"].oversize, input[type="email"].oversize, input[type="number"].oversize, input[type="search"].oversize, input[type="tel"].oversize, input[type="time"].oversize, input[type="url"].oversize, textarea.oversize {
  font-size: 27px;
  padding: 4px 6px;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus {
  background: #fafafa;
  border-color: #b3b3b3;
}
input[type="text"][disabled], input[type="password"][disabled], input[type="date"][disabled], input[type="datetime"][disabled], input[type="email"][disabled], input[type="number"][disabled], input[type="search"][disabled], input[type="tel"][disabled], input[type="time"][disabled], input[type="url"][disabled], textarea[disabled] {
  background-color: #ddd;
}

textarea {
  height: auto;
}

select {
  width: 100%;
}

/* Fieldsets */
fieldset {
  border: solid 1px #ddd;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  padding: 12px;
  margin: 18px 0;
}
fieldset legend {
  font-weight: bold;
  background: white;
  padding: 0 3px;
  margin: 0;
  margin-left: -3px;
}

/* Errors */
.error input, input.error, .error textarea, textarea.error, .error input:focus, input.error:focus, .error textarea:focus, textarea.error:focus {
  border-color: #c60f13;
  background-color: rgba(198, 15, 19, 0.1);
}

.error input:focus, input.error:focus, .error textarea:focus, textarea.error:focus {
  outline-color: #f5797c;
}

.error label, label.error {
  color: #c60f13;
}

.error small, small.error {
  display: block;
  padding: 6px 4px;
  margin-top: -13px;
  margin-bottom: 12px;
  background: #c60f13;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  -moz-border-radius-bottomleft: 2px;
  -webkit-border-bottom-left-radius: 2px;
  border-bottom-left-radius: 2px;
  -moz-border-radius-bottomright: 2px;
  -webkit-border-bottom-right-radius: 2px;
  border-bottom-right-radius: 2px;
}

/* Custom Forms ---------------------- */
form.custom {
  /* Custom input, disabled */
}
form.custom span.custom {
  display: inline-block;
  width: 16px;
  height: 16px;
  position: relative;
  top: 2px;
  border: solid 1px #cccccc;
  background: white;
}
form.custom span.custom.radio {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  -ms-border-radius: 100px;
  -o-border-radius: 100px;
  border-radius: 100px;
}
form.custom span.custom.checkbox:before {
  content: "";
  display: block;
  line-height: 0.8;
  height: 14px;
  width: 14px;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 14px;
  color: #fff;
}
form.custom span.custom.radio.checked:before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  -ms-border-radius: 100px;
  -o-border-radius: 100px;
  border-radius: 100px;
  background: #222222;
  position: relative;
  top: 3px;
  left: 3px;
}
form.custom span.custom.checkbox.checked:before {
  content: "\00d7";
  color: #222222;
}
form.custom div.custom.dropdown {
  display: block;
  position: relative;
  width: auto;
  height: 28px;
  margin-bottom: 9px;
  margin-top: 2px;
}
form.custom div.custom.dropdown ul {
  overflow-y: auto;
  max-height: 200px;
}
form.custom div.custom.dropdown a.current {
  display: block;
  width: auto;
  line-height: 26px;
  min-height: 28px;
  padding: 0;
  padding-left: 6px;
  padding-right: 38px;
  border: solid 1px #dddddd;
  color: #141414;
  background-color: white;
  white-space: nowrap;
}
form.custom div.custom.dropdown a.selector {
  position: absolute;
  width: 27px;
  height: 28px;
  display: block;
  right: 0;
  top: 0;
  border: solid 1px #dddddd;
}
form.custom div.custom.dropdown a.selector:after {
  content: "";
  display: block;
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 5px;
  border-color: #aaaaaa transparent transparent transparent;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -2px;
  margin-left: -5px;
}
form.custom div.custom.dropdown:hover a.selector:after, form.custom div.custom.dropdown.open a.selector:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 5px;
  border-color: #222222 transparent transparent transparent;
}
form.custom div.custom.dropdown.open ul {
  display: block;
  z-index: 10;
}
form.custom div.custom.dropdown.small {
  width: 134px !important;
}
form.custom div.custom.dropdown.medium {
  width: 254px !important;
}
form.custom div.custom.dropdown.large {
  width: 434px !important;
}
form.custom div.custom.dropdown.expand {
  width: 100% !important;
}
form.custom div.custom.dropdown.open.small ul {
  width: 134px !important;
}
form.custom div.custom.dropdown.open.medium ul {
  width: 254px !important;
}
form.custom div.custom.dropdown.open.large ul {
  width: 434px !important;
}
form.custom div.custom.dropdown.open.expand ul {
  width: 100% !important;
}
form.custom div.custom.dropdown ul {
  position: absolute;
  width: auto;
  display: none;
  margin: 0;
  left: 0;
  top: 27px;
  margin: 0;
  padding: 0;
  background: white;
  background: rgba(255, 255, 255, 0.95);
  border: solid 1px #cccccc;
}
form.custom div.custom.dropdown ul li {
  color: #555555;
  font-size: 17px;
  cursor: pointer;
  padding: 3px;
  padding-left: 6px;
  padding-right: 38px;
  min-height: 18px;
  line-height: 18px;
  margin: 0;
  white-space: nowrap;
  list-style: none;
}
form.custom div.custom.dropdown ul li.selected {
  background: #cdebf5;
  color: black;
}
form.custom div.custom.dropdown ul li.selected:after {
  content: "\2013";
  position: absolute;
  right: 10px;
}
form.custom div.custom.dropdown ul li:hover {
  background-color: #cdebf5;
  color: black;
}
form.custom div.custom.dropdown ul li:hover:after {
  content: "\2013";
  position: absolute;
  right: 10px;
  color: #a3dbec;
}
form.custom div.custom.dropdown ul li.selected:hover {
  background: #cdebf5;
  cursor: default;
  color: black;
}
form.custom div.custom.dropdown ul li.selected:hover:after {
  color: black;
}
form.custom div.custom.dropdown ul.show {
  display: block;
}
form.custom .custom.disabled {
  background-color: #dddddd;
}

/* Correct FF custom dropdown height */
@-moz-document url-prefix() {
  form.custom div.custom.dropdown a.selector {
    height: 28px;
  }
}

.lt-ie9 form.custom div.custom.dropdown a.selector {
  height: 28px;
}

/* Tabs ---------------------- */
.tabs {
  list-style: none;
  border-bottom: solid 1px #e6e6e6;
  display: block;
  height: 40px;
  padding: 0;
  margin-bottom: 20px;
}
.tabs.contained {
  margin-bottom: 0;
  margin-left: 0;
}
.tabs dt, .tabs li.section-title {
  color: #b3b3b3;
  cursor: default;
  display: block;
  float: left;
  font-size: 12px;
  height: 40px;
  line-height: 40px;
  padding: 0;
  padding-right: 9px;
  padding-left: 20px;
  font-weight: normal;
  width: auto;
  text-transform: uppercase;
}
.tabs dt:first-child, .tabs li.section-title:first-child {
  padding: 0;
  padding-right: 9px;
}
.tabs dd, .tabs li {
  display: block;
  float: left;
  padding: 0;
  margin: 0;
}
.tabs dd a, .tabs li a {
  color: #6f6f6f;
  display: block;
  font-size: 18px;
  height: 40px;
  line-height: 40px;
  padding: 0px 37.8px;
}
.tabs dd a:focus, .tabs li a:focus {
  font-weight: bold;
  color: #2ba6cb;
}
.tabs dd.active, .tabs li.active {
  border-top: 3px solid #2ba6cb;
  margin-top: -3px;
}
.tabs dd.active a, .tabs li.active a {
  cursor: default;
  color: #3c3c3c;
  background: #fff;
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  font-weight: bold;
}
.tabs dd:first-child, .tabs li:first-child {
  margin-left: 0;
}
.tabs.vertical {
  height: auto;
  border-bottom: 1px solid #e6e6e6;
}
.tabs.vertical dt, .tabs.vertical dd, .tabs.vertical li {
  float: none;
  height: auto;
}
.tabs.vertical dd, .tabs.vertical li {
  border-left: 3px solid #cccccc;
}
.tabs.vertical dd a, .tabs.vertical li a {
  background: #f2f2f2;
  border: none;
  border: 1px solid #e6e6e6;
  border-width: 1px 1px 0 0;
  color: #555;
  display: block;
  font-size: 18px;
  height: auto;
  line-height: 1;
  padding: 15px 20px;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
}
.tabs.vertical dd.active, .tabs.vertical li.active {
  margin-top: 0;
  border-top: 1px solid #4d4d4d;
  border-left: 4px solid #1a1a1a;
}
.tabs.vertical dd.active a, .tabs.vertical li.active a {
  background: #4d4d4d;
  border: none;
  color: #fff;
  height: auto;
  margin: 0;
  position: static;
  top: 0;
  -webkit-box-shadow: 0 0 0;
  -moz-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}
.tabs.vertical dd:first-child a.active, .tabs.vertical li:first-child a.active {
  margin: 0;
}
.tabs.pill {
  border-bottom: none;
  margin-bottom: 10px;
}
.tabs.pill dd, .tabs.pill li {
  margin-right: 10px;
}
.tabs.pill dd:last-child, .tabs.pill li:last-child {
  margin-right: 0;
}
.tabs.pill dd a, .tabs.pill li a {
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  -ms-border-radius: 1000px;
  -o-border-radius: 1000px;
  border-radius: 1000px;
  background: #e6e6e6;
  height: 26px;
  line-height: 26px;
  color: #666;
}
.tabs.pill dd.active, .tabs.pill li.active {
  border: none;
  margin-top: 0;
}
.tabs.pill dd.active a, .tabs.pill li.active a {
  background-color: #2ba6cb;
  border: none;
  color: #fff;
}
.tabs.pill.contained {
  border-bottom: solid 1px #eee;
  margin-bottom: 0;
}
.tabs.pill.two-up dd, .tabs.pill.two-up li, .tabs.pill.three-up dd, .tabs.pill.three-up li, .tabs.pill.four-up dd, .tabs.pill.four-up li, .tabs.pill.five-up dd, .tabs.pill.five-up li {
  margin-right: 0;
}
.tabs.two-up dt a, .tabs.two-up dd a, .tabs.two-up li a, .tabs.three-up dt a, .tabs.three-up dd a, .tabs.three-up li a, .tabs.four-up dt a, .tabs.four-up dd a, .tabs.four-up li a, .tabs.five-up dt a, .tabs.five-up dd a, .tabs.five-up li a {
  padding: 0 27px;
  text-align: center;
  overflow: hidden;
}
.tabs.two-up dt, .tabs.two-up dd, .tabs.two-up li {
  width: 50%;
}
.tabs.three-up dt, .tabs.three-up dd, .tabs.three-up li {
  width: 33.33%;
}
.tabs.four-up dt, .tabs.four-up dd, .tabs.four-up li {
  width: 25%;
}
.tabs.five-up dt, .tabs.five-up dd, .tabs.five-up li {
  width: 20%;
}

ul.tabs-content {
  display: block;
  margin: 0 0 20px;
  padding: 0;
}
ul.tabs-content > li {
  display: none;
}
ul.tabs-content > li.active {
  display: block;
}
ul.tabs-content.contained {
  padding: 0;
}
ul.tabs-content.contained > li {
  border: solid 0 #e6e6e6;
  border-width: 0 1px 1px 1px;
  padding: 20px;
}
ul.tabs-content.contained.vertical > li {
  border-width: 1px 1px 1px 1px;
}

.no-js ul.tabs-content > li {
  display: block;
}

/* Table of Contents

:: Visibility
:: Alerts
:: Labels
:: Tooltips
:: Panels
:: Accordion
:: Side Nav
:: Sub Nav
:: Pagination
:: Breadcrumbs
:: Lists
:: Inline/Link Lists
:: Keystroke Chars
:: Image Thumbnails
:: Video
:: Tables
:: Microformats
:: Progress Bars
:: Pricing Tables

*/
/* Alerts ---------------------- */
div.alert-box {
  display: block;
  padding: 6px 7px 7px;
  font-weight: bold;
  font-size: 18px;
  color: white;
  background-color: #2ba6cb;
  border: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 12px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
  position: relative;
}
div.alert-box.success {
  background-color: #5da423;
  color: #fff;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
}
div.alert-box.alert {
  background-color: #c60f13;
  color: #fff;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
}
div.alert-box.secondary {
  background-color: #e9e9e9;
  color: #505050;
  text-shadow: 0 1px rgba(255, 255, 255, 0.3);
}
div.alert-box a.close {
  color: #333;
  position: absolute;
  right: 4px;
  top: -1px;
  font-size: 27px;
  opacity: 0.2;
  padding: 4px;
}
div.alert-box a.close:hover, div.alert-box .friend-result:hover .close.add-friend-link, .friend-result:hover div.alert-box .close.add-friend-link, div.alert-box a.close:focus {
  opacity: 0.4;
}

/* Labels ---------------------- */
.label {
  padding: 1px 4px 2px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  line-height: 1;
  white-space: nowrap;
  display: inline;
  position: relative;
  bottom: 1px;
  color: #fff;
  background: #2ba6cb;
}
.label.radius {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
.label.round {
  padding: 1px 7px 2px;
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  -ms-border-radius: 1000px;
  -o-border-radius: 1000px;
  border-radius: 1000px;
}
.label.alert {
  background-color: #c60f13;
}
.label.success {
  background-color: #5da423;
}
.label.secondary {
  background-color: #e9e9e9;
  color: #505050;
}

/* Tooltips ---------------------- */
.has-tip {
  border-bottom: dotted 1px #cccccc;
  cursor: help;
  font-weight: bold;
  color: #333333;
}
.has-tip:hover, .has-tip:focus {
  border-bottom: dotted 1px #196177;
  color: #2ba6cb;
}
.has-tip.tip-left, .has-tip.tip-right {
  float: none !important;
}

.tooltip {
  display: none;
  background: black;
  background: rgba(0, 0, 0, 0.85);
  position: absolute;
  color: white;
  font-weight: bold;
  font-size: 12px;
  padding: 5px;
  z-index: 999;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  line-height: normal;
}
.tooltip > .nub {
  display: block;
  width: 0;
  height: 0;
  border: solid 5px;
  border-color: transparent transparent black transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.85) transparent;
  position: absolute;
  top: -10px;
  left: 10px;
}
.tooltip.tip-override > .nub {
  border-color: transparent transparent black transparent !important;
  border-color: transparent transparent rgba(0, 0, 0, 0.85) transparent !important;
  top: -10px !important;
}
.tooltip.tip-top > .nub, .tooltip.tip-centered-top > .nub {
  border-color: black transparent transparent transparent;
  border-color: rgba(0, 0, 0, 0.85) transparent transparent transparent;
  top: auto;
  bottom: -10px;
}
.tooltip.tip-left, .tooltip.tip-right {
  float: none !important;
}
.tooltip.tip-left > .nub {
  border-color: transparent transparent transparent black;
  border-color: transparent transparent transparent rgba(0, 0, 0, 0.85);
  right: -10px;
  left: auto;
}
.tooltip.tip-right > .nub {
  border-color: transparent black transparent transparent;
  border-color: transparent rgba(0, 0, 0, 0.85) transparent transparent;
  right: auto;
  left: -10px;
}
.tooltip.noradius {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
.tooltip.opened {
  color: #2ba6cb !important;
  border-bottom: dotted 1px #196177 !important;
}

.tap-to-close {
  display: block;
  font-size: 10px;
  font-size: 1rem;
  color: #888888;
  font-weight: normal;
}

/* Panels ---------------------- */
.panel {
  background: #f2f2f2;
  border: solid 1px #e6e6e6;
  margin: 0 0 22px 0;
  padding: 20px;
}
.panel > :first-child {
  margin-top: 0;
}
.panel > :last-child {
  margin-bottom: 0;
}
.panel.callout {
  background: #2ba6cb;
  color: #fff;
  border-color: #2284a1;
  -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5);
  -moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5);
  box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5);
}
.panel.callout a {
  color: #fff;
}
.panel.callout .button {
  background: white;
  border: none;
  color: #2ba6cb;
  text-shadow: none;
}
.panel.callout .button:hover, .panel.callout .button:focus {
  background: rgba(255, 255, 255, 0.8);
}
.panel.radius {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

/* Accordion ---------------------- */
ul.accordion {
  margin: 0 0 22px 0;
  border-bottom: 1px solid #e9e9e9;
}
ul.accordion > li {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid #e9e9e9;
}
ul.accordion > li > div.title {
  cursor: pointer;
  background: #f6f6f6;
  padding: 15px;
  margin: 0;
  position: relative;
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
  -webkit-transition: 0.15s background linear;
  -moz-transition: 0.15s background linear;
  -o-transition: 0.15s background linear;
  transition: 0.15s background linear;
}
ul.accordion > li > div.title h1, ul.accordion > li > div.title h2, ul.accordion > li > div.title h3, ul.accordion > li > div.title h4, ul.accordion > li > div.title h5, ul.accordion > li > div.title h5 {
  margin: 0;
}
ul.accordion > li > div.title:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 6px;
  border-color: transparent #9d9d9d transparent transparent;
  position: absolute;
  right: 15px;
  top: 21px;
}
ul.accordion > li .content {
  display: none;
  padding: 15px;
}
ul.accordion > li.active {
  border-top: 3px solid #2ba6cb;
}
ul.accordion > li.active .title {
  background: white;
  padding-top: 13px;
}
ul.accordion > li.active .title:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 6px;
  border-color: #9d9d9d transparent transparent transparent;
}
ul.accordion > li.active .content {
  background: white;
  display: block;
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
}

/* Side Nav ---------------------- */
ul.side-nav {
  display: block;
  list-style: none;
  margin: 0;
  padding: 27px 0;
}
ul.side-nav li {
  display: block;
  list-style: none;
  margin: 0 0 9px 0;
}
ul.side-nav li a {
  display: block;
}
ul.side-nav li.active a {
  color: #4d4d4d;
  font-weight: bold;
}
ul.side-nav li.divider {
  border-top: 1px solid #e6e6e6;
  height: 0;
  padding: 0;
}

/* Sub Navs http://www.zurb.com/article/292/how-to-create-simple-and-effective-sub-na ---------------------- */
dl.sub-nav {
  display: block;
  width: auto;
  overflow: hidden;
  margin: -4px 0 18px;
  margin-right: 0;
  margin-left: -9px;
  padding-top: 4px;
}
dl.sub-nav dt, dl.sub-nav dd {
  float: left;
  display: inline;
  margin-left: 9px;
  margin-bottom: 10px;
}
dl.sub-nav dt {
  color: #999;
  font-weight: normal;
}
dl.sub-nav dd a {
  text-decoration: none;
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  -ms-border-radius: 1000px;
  -o-border-radius: 1000px;
  border-radius: 1000px;
}
dl.sub-nav dd.active a {
  font-weight: bold;
  background: #2ba6cb;
  color: #fff;
  padding: 3px 9px;
  cursor: default;
}

/* Pagination ---------------------- */
ul.pagination {
  display: block;
  height: 24px;
  margin-left: -5px;
}
ul.pagination li {
  float: left;
  display: block;
  height: 24px;
  color: #999;
  font-size: 18px;
  margin-left: 5px;
}
ul.pagination li a {
  display: block;
  padding: 1px 7px 1px;
  color: #555;
}
ul.pagination li:hover a, ul.pagination li a:focus {
  background: #e6e6e6;
}
ul.pagination li.unavailable a {
  cursor: default;
  color: #999;
}
ul.pagination li.unavailable:hover a, ul.pagination li.unavailable a:focus {
  background: transparent;
}
ul.pagination li.current a {
  background: #2ba6cb;
  color: white;
  font-weight: bold;
  cursor: default;
}
ul.pagination li.current a:hover, ul.pagination li.current .friend-result:hover .add-friend-link, .friend-result:hover ul.pagination li.current .add-friend-link, ul.pagination li.current a:focus {
  background: #2ba6cb;
}

div.pagination-centered {
  text-align: center;
}
div.pagination-centered ul > li {
  float: none;
  display: inline-block;
}

/* Breadcrums ---------------------- */
ul.breadcrumbs {
  display: block;
  background: #f6f6f6;
  padding: 6px 10px 7px;
  border: 1px solid #e9e9e9;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  overflow: hidden;
  margin-left: 0;
}
ul.breadcrumbs li {
  margin: 0;
  padding: 0 12px 0 0;
  float: left;
  list-style: none;
}
ul.breadcrumbs li a, ul.breadcrumbs li span {
  text-transform: uppercase;
  font-size: 11px;
  font-size: 1.1rem;
  padding-left: 12px;
}
ul.breadcrumbs li:first-child a, ul.breadcrumbs li:first-child span {
  padding-left: 0;
}
ul.breadcrumbs li:before {
  content: "/";
  color: #aaa;
}
ul.breadcrumbs li:first-child:before {
  content: " ";
}
ul.breadcrumbs li.current a {
  cursor: default;
  color: #333;
}
ul.breadcrumbs li:hover a, ul.breadcrumbs li a:focus {
  text-decoration: underline;
}
ul.breadcrumbs li.current:hover a, ul.breadcrumbs li.current a:focus {
  text-decoration: none;
}
ul.breadcrumbs li.unavailable a {
  color: #999;
}
ul.breadcrumbs li.unavailable:hover a, ul.breadcrumbs li.unavailable a:focus {
  text-decoration: none;
  color: #999;
  cursor: default;
}

/* Inline Link List */
ul.inline-list, ul.link-list {
  margin: 0 0 17px -22px;
  padding: 0;
  list-style: none;
  overflow: hidden;
}
ul.inline-list > li, ul.link-list > li {
  list-style: none;
  float: left;
  margin-left: 22px;
  display: block;
}
ul.inline-list > li > *, ul.link-list > li > * {
  display: block;
}

/* Keytroke Characters ---------------------- */
.keystroke, kbd {
  font-family: "Consolas", "Menlo", "Courier", monospace;
  font-size: 17px;
  padding: 2px 4px 0px;
  margin: 0;
  background: #ededed;
  border: solid 1px #dbdbdb;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

/* Image Thumbnails ---------------------- */
.th {
  display: block;
}
.th img {
  display: block;
  border: solid 4px #fff;
  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  -webkit-transition-property: box-shadow;
  -moz-transition-property: box-shadow;
  -o-transition-property: box-shadow;
  transition-property: box-shadow;
  -webkit-transition-duration: 300ms;
  -moz-transition-duration: 300ms;
  -o-transition-duration: 300ms;
  transition-duration: 300ms;
}
.th:hover img, .th:focus img {
  -webkit-box-shadow: 0 0 6px 1px rgba(43, 166, 203, 0.5);
  -moz-box-shadow: 0 0 6px 1px rgba(43, 166, 203, 0.5);
  box-shadow: 0 0 6px 1px rgba(43, 166, 203, 0.5);
}

/* Video - Mad props to http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/ ---------------------- */
.flex-video {
  position: relative;
  padding-top: 25px;
  padding-bottom: 67.5%;
  height: 0;
  margin-bottom: 16px;
  overflow: hidden;
}
.flex-video.widescreen {
  padding-bottom: 57.25%;
}
.flex-video.vimeo {
  padding-top: 0;
}
.flex-video iframe, .flex-video object, .flex-video embed, .flex-video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Tables ---------------------- */
table {
  background: #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  margin: 0 0 18px;
  border: 1px solid #ddd;
}

table thead, table tfoot {
  background: #f5f5f5;
}

table thead tr th,
table tfoot tr th,
table tbody tr td,
table tr td,
table tfoot tr td {
  display: table-cell;
  font-size: 18px;
  line-height: 18px;
  text-align: left;
}

table thead tr th,
table tfoot tr td {
  padding: 8px 10px 9px;
  font-size: 18px;
  font-weight: bold;
  color: #222;
}

table thead tr th:first-child, table tfoot tr td:first-child {
  border-left: none;
}

table thead tr th:last-child, table tfoot tr td:last-child {
  border-right: none;
}

table tbody tr.even,
table tbody tr.alt {
  background: #f9f9f9;
}

table tbody tr:nth-child(even) {
  background: #f9f9f9;
}

table tbody tr td {
  color: #333;
  padding: 9px 10px;
  vertical-align: top;
  border: none;
}

/* Microformats ---------------------- */
ul.vcard {
  display: inline-block;
  margin: 0 0 12px 0;
  border: 1px solid #ddd;
  padding: 10px;
}
ul.vcard li {
  margin: 0;
  display: block;
}
ul.vcard li.fn {
  font-weight: bold;
  font-size: 19px;
}

p.vevent span.summary {
  font-weight: bold;
}
p.vevent abbr {
  cursor: default;
  text-decoration: none;
  font-weight: bold;
  border: none;
  padding: 0 1px;
}

/* Progress Bar ---------------------- */
div.progress {
  padding: 2px;
  margin-bottom: 10px;
  border: 1px solid #cccccc;
  height: 25px;
  /* meter */
  /* border radii */
}
div.progress .meter {
  background: #2ba6cb;
  height: 100%;
  display: block;
  width: 50%;
}
div.progress.secondary .meter {
  background: #e9e9e9;
}
div.progress.success .meter {
  background: #5da423;
}
div.progress.alert .meter {
  background: #c60f13;
}
div.progress.radius {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
div.progress.radius .meter {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
}
div.progress.round {
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  -ms-border-radius: 1000px;
  -o-border-radius: 1000px;
  border-radius: 1000px;
}
div.progress.round .meter {
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  -ms-border-radius: 1000px;
  -o-border-radius: 1000px;
  border-radius: 1000px;
}

/* Pricing Tables ---------------------- */
.pricing-table {
  border: solid 1px #dddddd;
  margin-left: 0;
  margin-bottom: 20px;
}
.pricing-table * {
  list-style: none;
  line-height: 1;
}
.pricing-table .title {
  background-color: #dddddd;
  padding: 15px 20px;
  text-align: center;
  color: #333333;
  font-weight: bold;
  font-size: 16px;
}
.pricing-table .price {
  background-color: #eeeeee;
  padding: 15px 20px;
  text-align: center;
  color: #333333;
  font-weight: normal;
  font-size: 20px;
}
.pricing-table .description {
  background-color: white;
  padding: 15px;
  text-align: center;
  color: #777777;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.4;
  border-bottom: dotted 1px #dddddd;
}
.pricing-table .bullet-item {
  background-color: white;
  padding: 15px;
  text-align: center;
  color: #333333;
  font-size: 14px;
  font-weight: normal;
  border-bottom: dotted 1px #dddddd;
}
.pricing-table .cta-button {
  background-color: whitesmoke;
  text-align: center;
  padding: 20px;
}

/* CSS for jQuery Reveal Plugin
 * Maintained for Foundation. foundation.zurb.com
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */
/* Reveal Modals ---------------------- */
.reveal-modal-bg {
  position: fixed;
  height: 100%;
  width: 100%;
  background: #000;
  background: rgba(0, 0, 0, 0.45);
  z-index: 40;
  display: none;
  top: 0;
  left: 0;
}

.reveal-modal {
  background: #fff;
  visibility: hidden;
  display: none;
  top: 100px;
  left: 50%;
  margin-left: -260px;
  width: 520px;
  position: absolute;
  z-index: 41;
  padding: 30px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}
.reveal-modal .close-reveal-modal:not(.button) {
  font-size: 22px;
  font-size: 2.2rem;
  line-height: .5;
  position: absolute;
  top: 8px;
  right: 11px;
  color: #aaa;
  text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.6);
  font-weight: bold;
  cursor: pointer;
}
.reveal-modal.small {
  width: 30%;
  margin-left: -15%;
}
.reveal-modal.medium {
  width: 40%;
  margin-left: -20%;
}
.reveal-modal.large {
  width: 60%;
  margin-left: -30%;
}
.reveal-modal.xlarge {
  width: 70%;
  margin-left: -35%;
}
.reveal-modal.expand {
  width: 90%;
  margin-left: -45%;
}
.reveal-modal .row {
  min-width: 0;
  margin-bottom: 10px;
}
.reveal-modal > :first-child {
  margin-top: 0;
}
.reveal-modal > :last-child {
  margin-bottom: 0;
}

@media print {
  .reveal-modal {
    border: solid 1px #000;
    background: #fff;
  }
}
.nav-bar {
  background: none;
}
.nav-bar > li {
  border: none;
  border-right: none;
  -webkit-box-shadow: 0 0 0;
  -moz-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}
.nav-bar > li:first-child {
  -webkit-box-shadow: 0 0 0;
  -moz-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}
.nav-bar > li:last-child {
  border-right: none;
  -webkit-box-shadow: 0 0 0;
  -moz-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}
.nav-bar > li.active {
  background: none;
}
.nav-bar > li.active > a {
  color: black;
  cursor: default;
}
.nav-bar > li.active:hover {
  background: none;
  cursor: default;
}
.nav-bar > li:hover {
  background: none;
}
.nav-bar > li a {
  color: black;
}

/* -----------------------------------------
   General
----------------------------------------- */
html {
  height: 100%;
  background: #ebf5fe;
}

a:focus {
  outline: none;
}

.clear {
  clear: both;
}

.hidden, input.hidden {
  display: none;
}
.hidden.alert-box, input.hidden.alert-box {
  display: none;
}

.reveal-modal {
  z-index: 1000;
}

.heading-margin {
  margin-top: 20px;
}

hr {
  border-top: 1px solid #ddd;
  clear: both;
  margin: 0 0 20px;
  height: 0;
}
hr.dim {
  border-top: 1px dashed rgba(255, 255, 255, 0.2);
}

ul {
  margin-left: 20px;
}

.icon-font, i {
  font-family: "Fontello", "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-style: normal;
}

/* -----------------------------------------
   Header
----------------------------------------- */
.header {
  background: #abd1e8 url(../images/structure/header_clouds.jpg) repeat-x;
  background-position: -888px top;
  /* What in Gods green army is going on here? */
  position: relative;
  border-bottom: 1px solid #ccc;
}

.logo {
  padding: 15px 0;
}

.nav-block {
  position: absolute;
  right: 0;
  top: 31px;
}
.nav-block ul {
  height: 40px;
}

.nav-break {
  display: none;
}

.nav, .user {
  display: inline-block;
}
.nav li, .user li {
  float: left;
  height: 45px;
  display: block;
}
.nav li a, .user li a {
  display: block;
  line-height: 45px;
  float: left;
  font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: normal;
  padding: 0;
  font-size: 19px;
  font-size: 1.9rem;
  color: #336d8a;
  text-align: center;
}
.nav li a:hover, .nav li .friend-result:hover .add-friend-link, .friend-result:hover .nav li .add-friend-link, .user li a:hover, .user li .friend-result:hover .add-friend-link, .friend-result:hover .user li .add-friend-link {
  color: #44a1d4;
}

.nav li {
  position: relative;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
.nav li a {
  padding: 0 15px;
}
.nav li a.give-joy {
  margin-right: 0px;
  padding-right: 25px;
  background: url(../images/structure/arrow_blue.png) 102px 22px no-repeat;
}
.nav li.active > a {
  font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: bold;
}
.nav li ul {
  margin: 0;
  padding: 10px 0;
  z-index: 999;
  display: none;
  position: absolute;
  top: 44px;
  left: 10px;
  width: 250px;
  height: 200px;
  background: white;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #ddd;
  -webkit-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  -moz-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
}
.nav li ul:before {
  content: ' ';
  display: block;
  background: url(../images/structure/up_triangle.png) no-repeat;
  width: 33px;
  height: 15px;
  position: absolute;
  z-index: 404;
  top: -12px;
  left: 79px;
}
.nav li ul li {
  display: block;
  margin: 0 5%;
  width: 90%;
  border-top: 1px solid #eeeeee;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
.nav li ul li.first {
  border-top: none;
}
.nav li ul li a {
  font-size: 14px;
  font-size: 1.4rem;
  width: 100%;
  color: #6f797d;
  text-align: left;
  padding: 0 0 0 60px;
}
.nav li ul li#nav_causes a {
  background: url(../images/icons/icon_give_to_a_causeSM.png) no-repeat left center;
}
.nav li ul li#nav_donate a {
  background: url(../images/icons/icon_give_to_joy_fundSM.png) no-repeat left center;
}
.nav li ul li#nav_voucher a {
  background: url(../images/icons/icon_give_a_giftSM.png) no-repeat left center;
}
.nav li ul li#nav_other-ways a {
  background: url(../images/icons/icon_give_give_giveSM.png) no-repeat left center;
}
.nav li:hover ul {
  display: block;
}

ul.user {
  margin-left: 0;
}
ul.user li a {
  padding: 0 15px;
  vertical-align: middle;
  position: relative;
}
ul.user img {
  display: inline-block;
  vertical-align: middle;
}
ul.user .join-button {
  margin-right: 15px;
  padding-right: 25px;
  background: url(../images/structure/small_hearts.png) center right no-repeat;
}
ul.user .dashboard-button {
  padding: 0 0 0 5px;
}
ul.user #user_dropdown {
  padding: 0 12px 8px 12px;
  margin-right: 10px;
  width: 56px;
  background: url(../images/structure/arrow_blue.png) no-repeat 100% 47%;
}
ul.user #user_dropdown img {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
}
ul.user .notification-count {
  font-family: Calibri, Corbel, "Lucida Grade", "Bitstream Vera Sans", "Luxi Serif", Verdana, sans-serif;
  color: white;
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 13px;
  background-color: #cc3333;
  padding: 1px 4px;
  position: absolute;
  top: 0;
  right: -10px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
  border-radius: 30px;
  -webkit-box-shadow: 1px 1px 2px 0 gray;
  -moz-box-shadow: 1px 1px 2px 0 gray;
  box-shadow: 1px 1px 2px 0 gray;
}

ul.donate-now {
  margin-left: 0;
}
ul.donate-now li {
  position: relative;
  width: 115px;
}
ul.donate-now li a {
  text-indent: -9999em;
  width: 115px;
  height: 91px;
  position: absolute;
  background: url(../images/buttons/donate.png) top left no-repeat;
  z-index: 6;
  top: -2px;
}
ul.donate-now li a:hover, ul.donate-now li .friend-result:hover .add-friend-link, .friend-result:hover ul.donate-now li .add-friend-link {
  background-position: bottom left;
}
@media all and (max-width: 900px) {
  ul.donate-now li a {
    background: url(../images/buttons/donate_small.png) top left no-repeat;
    height: 51px;
  }
  ul.donate-now li a:hover, ul.donate-now li .friend-result:hover .add-friend-link, .friend-result:hover ul.donate-now li .add-friend-link {
    background-position: bottom left;
  }
}

#signin_form_container, #signout_form_container {
  width: 262px;
  margin-top: 0;
  padding: 10px 15px 10px;
  background: white;
  position: absolute;
  z-index: 1000;
  top: 55px;
  right: 5px;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  -moz-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
}
#signin_form_container:before, #signout_form_container:before {
  content: '';
  display: block;
  background: url(../images/structure/up_triangle.png) no-repeat;
  width: 33px;
  height: 15px;
  position: absolute;
  z-index: 1008;
  top: -12px;
  left: 35%;
}
#signin_form_container form, #signout_form_container form {
  padding-top: 15px;
}
#signin_form_container h3, #signout_form_container h3 {
  margin: 5px 0 3px;
}
#signin_form_container p, #signout_form_container p {
  font-size: 13px;
  font-size: 1.3rem;
  padding-bottom: 0;
}
#signin_form_container small, #signout_form_container small {
  color: #888;
}
#signin_form_container input, #signout_form_container input {
  font-size: 13px;
  font-size: 1.3rem;
  margin-bottom: 5px;
}
#signin_form_container .user-action, #signout_form_container .user-action {
  padding: 12px 0 0 0;
}

@media (max-width: 999px) {
  .logo {
    padding: 5px 0 70px;
  }

  .nav-block {
    top: 81px;
  }
}
/* -----------------------------------------
   Modals?
----------------------------------------- */
.close-button {
  position: absolute;
  top: 3px;
  right: 3px;
  color: #c8c8c8;
}

/* -----------------------------------------
   Structure
----------------------------------------- */
.feature {
  position: relative;
  min-height: 375px;
  margin: 0 auto;
  z-index: 5;
  background-color: white;
  background-position: center top;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.feature:before {
  width: 100%;
  height: 5px;
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0px;
  background: url(../images/structure/shadow_horizontal_top.png) bottom center no-repeat;
  z-index: 999;
}
.feature .feature-fade {
  height: 100%;
  width: 100%;
  overflow: hidden;
  background: url(../images/structure/social_angels_fade.png) no-repeat center top;
  padding: 10px 0;
  -webkit-background-size: 120%;
  -moz-background-size: 120%;
  -o-background-size: 120%;
  background-size: 120%;
}
.feature .feature-wrapper {
  display: table;
  height: 375px;
  float: right;
}
.feature .feature-wrapper .feature-block {
  float: none;
  display: table-cell;
  vertical-align: middle;
  height: 100%;
}
.feature .row, .feature .twelve.columns, .feature .feature-wrapper, .feature .feature-block, .feature .feature-fade {
  min-height: 375px;
}
@media (min-width: 1450px) {
  .feature {
    min-height: 480px;
  }
  .feature .feature-wrapper {
    height: 480px;
  }
  .feature .row, .feature .twelve.columns, .feature .feature-wrapper, .feature .feature-block, .feature .feature-fade {
    min-height: 480px;
  }
}
.feature .panel {
  float: right;
  max-width: 450px;
  margin: 0 10px 0;
  background: url(../images/structure/bg_white_90.png);
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid #ddd;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  -moz-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
}
.feature .panel p {
  line-height: 1.2em;
}
.feature .details {
  padding: 20px;
  background: white;
  background: rgba(255, 255, 255, 0.66);
  border: none;
}
.feature .details h1 {
  line-height: 1.3;
  padding-top: 0;
  margin-top: 0;
}
.feature .details p {
  color: #444;
}
.feature .details .button {
  background: none;
  border: none;
  color: #666;
}

.panel {
  overflow: auto;
  background-color: white;
}

.video-frame, .picture-frame {
  display: block;
  border: 10px solid white;
  -webkit-box-shadow: 1px 1px 6px 0 #bbbbbb;
  -moz-box-shadow: 1px 1px 6px 0 #bbbbbb;
  box-shadow: 1px 1px 6px 0 #bbbbbb;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
}
.video-frame .home-video, .picture-frame .home-video {
  border: 1px solid #aaa;
  display: block;
}
.video-frame img, .picture-frame img {
  width: 100%;
}
@media (max-width: 900px) {
  .video-frame, .picture-frame {
    display: block;
    border: 5px solid white;
  }
}

/* -----------------------------------------
   Partners logos
----------------------------------------- */
.partner-logo {
  height: 120px;
  width: 100%;
  background-position: top center;
  background-repeat: no-repeat;
  display: block;
  text-indent: -9999em;
}
.partner-logo:hover {
  background-position: bottom center;
}

/* -----------------------------------------
   Home page stats
----------------------------------------- */
@media all and (max-width: 900px) {
  .stat p {
    margin-bottom: 25px;
  }
}

/* -----------------------------------------
   Search boxes
----------------------------------------- */
.search {
  padding: 20px 25px 20px;
  margin-top: 20px;
  overflow: auto;
  background: #3e85a8;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 0 8px 2px #336d8a;
  -moz-box-shadow: inset 0 0 8px 2px #336d8a;
  box-shadow: inset 0 0 8px 2px #336d8a;
}
.search form {
  margin: 0;
}
.search .search-button {
  float: right;
  width: 90%;
}
.search .button.filter {
  width: 29%;
}
.search .view-all {
  display: block;
  margin-top: 20px;
}
.search .view-all:hover {
  color: #ddd;
}

/* -----------------------------------------
   Pagination
----------------------------------------- */
.pagination a, .pagination strong {
  display: inline-block;
  height: 20px;
  padding: 4px 7px;
  color: #555;
  font-size: 14px;
  font-size: 1.4rem;
}
.pagination a:hover, .pagination .friend-result:hover .add-friend-link, .friend-result:hover .pagination .add-friend-link, .pagination a:focus {
  background: #e6e6e6;
}
.pagination strong {
  background: #44a1d4;
  color: white;
  cursor: default;
}

/* -----------------------------------------
   Tables
----------------------------------------- */
table {
  background: none;
  border: none;
}
table tbody tr:nth-child(even) {
  background: none;
}
table tbody tr:nth-child(odd) {
  background: none;
}

table.zebra tbody tr:nth-child(even) {
  background: #f9f9f9;
}
table.zebra tbody tr:nth-child(odd) {
  background: #deeef3;
}

/* -----------------------------------------
   'Empty' layout
----------------------------------------- */
.empty-layout {
  background: #fcf7f3;
  height: 100%;
  overflow: auto;
}
.empty-layout .container {
  height: 100%;
  background: url(../images/structure/big_cloud.jpg) repeat-x center top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  overflow: visible;
  padding-top: 40px;
}
.empty-layout .inner {
  overflow: auto;
  border: 1px solid white;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  background: url(../images/structure/bg_white_50.png);
  background: rgba(255, 255, 255, 0.5);
  padding: 20px 40px 20px;
  margin-top: 20px;
}
.empty-layout .inner label {
  font-size: 18px;
  font-size: 1.8rem;
  color: #4c565c;
}

/* -----------------------------------------
   About
----------------------------------------- */
.about-page-people .picture-frame {
  -webkit-box-shadow: 1px 1px 6px 0 rgba(34, 34, 34, 0.5);
  -moz-box-shadow: 1px 1px 6px 0 rgba(34, 34, 34, 0.5);
  box-shadow: 1px 1px 6px 0 rgba(34, 34, 34, 0.5);
}
.about-page-people img {
  cursor: pointer;
}
.about-page-people .head-angel {
  border-right: 1px solid #2d8dc2;
}

/* -----------------------------------------
   News
----------------------------------------- */
.post .date {
  text-transform: uppercase;
  color: #336d8a;
  margin-top: 8px;
}
.post .date div {
  font-size: 30px;
  font-size: 3rem;
  line-height: 1em;
}

.read-more-news {
  margin-bottom: 40px;
  display: block;
}

/* -----------------------------------------
   Contact
----------------------------------------- */
.contact-form {
  padding: 20px 30px 30px 30px;
  background-color: #deeef3;
  border: 1px solid #93c7d8;
}
.contact-form table tbody tr,
.contact-form table, .contact-form tr, .contact-form td {
  padding: 0;
}

/* -----------------------------------------
   Photo cropping block
----------------------------------------- */
.photo-crop .preview {
  width: 128px;
  height: 128px;
  overflow: hidden;
}
.photo-crop #save_thumb {
  width: 116px;
  margin: 30px 0 10px 6px;
}
.photo-crop .cancel_image_btn {
  width: 116px;
  display: block;
}

.qq-upload-list {
  display: none;
}

/* -----------------------------------------
   Footer
----------------------------------------- */
footer {
  margin: 0;
  padding: 40px 0 0 0;
  background: #ebf6fa url(../images/structure/footer_clouds.jpg) bottom center repeat-x;
  position: relative;
}
footer h4, footer h5 {
  color: #336d8a;
}
footer a {
  color: #777;
}
footer .social-footer .icon-font {
  font-size: 10px;
  font-size: 1rem;
}
footer .promise-footer img {
  padding: 20px 20px 60px 0;
}
@media all and (max-width: 769px) {
  footer .promise-footer img {
    float: left;
    padding-bottom: 75px;
  }
}
footer .copyright {
  color: #888;
  padding-top: 50px;
  padding-bottom: 10px;
  font-size: 13px;
  font-size: 1.3rem;
}
footer .copyright a, footer .copyright p {
  font-size: 13px;
  font-size: 1.3rem;
}
footer nav a {
  line-height: 1.8;
  display: block;
}

/* -----------------------------------------
   User heads
----------------------------------------- */
.head-shot {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  cursor: pointer;
}

/* -----------------------------------------
   Fonts
----------------------------------------- */
/* Open Sans */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans/OpenSans-Light-webfont.eot");
  src: url("../fonts/OpenSans/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans/OpenSans-Light-webfont.woff") format("woff"), url("../fonts/OpenSans/OpenSans-Light-webfont.ttf") format("truetype"), url("../fonts/OpenSans/OpenSans-Light-webfont.svg#OpenSansLight") format("svg");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans/OpenSans-LightItalic-webfont.eot");
  src: url("../fonts/OpenSans/OpenSans-LightItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans/OpenSans-LightItalic-webfont.woff") format("woff"), url("../fonts/OpenSans/OpenSans-LightItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic") format("svg");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans/OpenSans-Regular-webfont.eot");
  src: url("../fonts/OpenSans/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans/OpenSans-Regular-webfont.woff") format("woff"), url("../fonts/OpenSans/OpenSans-Regular-webfont.ttf") format("truetype"), url("../fonts/OpenSans/OpenSans-Regular-webfont.svg#OpenSansRegular") format("svg");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans/OpenSans-Italic-webfont.eot");
  src: url("../fonts/OpenSans/OpenSans-Italic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans/OpenSans-Italic-webfont.woff") format("woff"), url("../fonts/OpenSans/OpenSans-Italic-webfont.ttf") format("truetype"), url("../fonts/OpenSans/OpenSans-Italic-webfont.svg#OpenSansItalic") format("svg");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans/OpenSans-Bold-webfont.eot");
  src: url("../fonts/OpenSans/OpenSans-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans/OpenSans-Bold-webfont.woff") format("woff"), url("../fonts/OpenSans/OpenSans-Bold-webfont.ttf") format("truetype"), url("../fonts/OpenSans/OpenSans-Bold-webfont.svg#OpenSansBold") format("svg");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans/OpenSans-BoldItalic-webfont.eot");
  src: url("../fonts/OpenSans/OpenSans-BoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans/OpenSans-BoldItalic-webfont.woff") format("woff"), url("../fonts/OpenSans/OpenSans-BoldItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic") format("svg");
  font-weight: 700;
  font-style: italic;
}

/* Source Sans Pro */
@font-face {
  font-family: 'Source Sans Pro';
  src: url("../fonts/SourceSansPro/SourceSansPro-Regular-webfont.eot");
  src: url("../fonts/SourceSansPro/SourceSansPro-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/SourceSansPro/SourceSansPro-Regular-webfont.woff") format("woff"), url("../fonts/SourceSansPro/SourceSansPro-Regular-webfont.ttf") format("truetype"), url("../fonts/SourceSansPro/SourceSansPro-Regular-webfont.svg#SourceSansProRegular") format("svg");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Source Sans Pro';
  src: url("../fonts/SourceSansPro/SourceSansPro-It-webfont.eot");
  src: url("../fonts/SourceSansPro/SourceSansPro-It-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/SourceSansPro/SourceSansPro-It-webfont.woff") format("woff"), url("../fonts/SourceSansPro/SourceSansPro-It-webfont.ttf") format("truetype"), url("../fonts/SourceSansPro/SourceSansPro-It-webfont.svg#SourceSansProItalic") format("svg");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Source Sans Pro';
  src: url("../fonts/SourceSansPro/SourceSansPro-Bold-webfont.eot");
  src: url("../fonts/SourceSansPro/SourceSansPro-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/SourceSansPro/SourceSansPro-Bold-webfont.woff") format("woff"), url("../fonts/SourceSansPro/SourceSansPro-Bold-webfont.ttf") format("truetype"), url("../fonts/SourceSansPro/SourceSansPro-Bold-webfont.svg#SourceSansProBold") format("svg");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Source Sans Pro';
  src: url("../fonts/SourceSansPro/SourceSansPro-BoldIt-webfont.eot");
  src: url("../fonts/SourceSansPro/SourceSansPro-BoldIt-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/SourceSansPro/SourceSansPro-BoldIt-webfont.woff") format("woff"), url("../fonts/SourceSansPro/SourceSansPro-BoldIt-webfont.ttf") format("truetype"), url("../fonts/SourceSansPro/SourceSansPro-BoldIt-webfont.svg#SourceSansProBoldItalic") format("svg");
  font-weight: 700;
  font-style: italic;
}

/* Google fonts */
/* Fontello icon font */
@font-face {
  font-family: 'Fontello';
  src: url("../fonts/Fontello/fontello.eot?80271899");
  src: url("../fonts/Fontello/fontello.eot?80271899#iefix") format("embedded-opentype"), url("../fonts/Fontello/fontello.woff?80271899") format("woff"), url("../fonts/Fontello/fontello.ttf?80271899") format("truetype"), url("../fonts/Fontello/fontello.svg?80271899#Fontello") format("svg");
  font-weight: normal;
  font-style: normal;
}

/* -----------------------------------------
   Typography
----------------------------------------- */
h1, h2, h3, h4, h5, h5, h6 {
  padding: 0;
  margin: 0;
}

h1 {
  font-size: 36px;
  font-size: 3.6rem;
  margin-bottom: 20px;
  line-height: 1.1em;
}

h2 {
  font-size: 28px;
  font-size: 2.8rem;
  margin-bottom: 20px;
  line-height: 1.1em;
}

h3 {
  font-size: 22px;
  font-size: 2.2rem;
  margin-bottom: 14px;
  line-height: 1.5em;
}

h4, h5 {
  margin: 17px 0 8px 0;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  color: #555;
}

h5 {
  font-size: 16px;
  font-size: 1.6rem;
  color: #444;
}

.main-heading {
  font-size: 36px;
  font-size: 3.6rem;
  margin-bottom: 20px;
}
.main-heading.shadow {
  text-shadow: 1px 1px 0 rgba(20, 20, 20, 0.4);
}

.sub-heading {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 20px;
}
.sub-heading.shadow {
  text-shadow: 1px 1px 0 rgba(240, 240, 255, 0.5);
}

.sub-heading, .descriptor {
  color: #295870;
}

.bold {
  font-weight: bold;
}

.text-white {
  color: white;
}

.text-gold {
  color: #fab950;
}

.text-dark-blue {
  color: #336d8a;
}

.small-text {
  font-size: 13.5px;
}

p {
  margin: 0;
  padding-bottom: 25px;
}
p:last-child {
  padding-bottom: 0;
}

table thead tr th, table tfoot tr th, table tbody tr td, table tr td, table tfoot tr td {
  font-size: 18px;
  line-height: 1.6em;
  color: #4c565c;
}

blockquote {
  font-size: 18px;
  font-size: 1.8rem;
  color: #637078;
  border: none;
  padding-left: 80px;
  padding-bottom: 10px;
  margin-left: 10px;
  width: 80%;
  background: url(../images/structure/pull_quote.png) top left no-repeat;
}
blockquote p {
  color: #7c8a92;
}

.body-font, input, textarea {
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}

/* -----------------------------------------
   Notifications
----------------------------------------- */
#notifications {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
  text-align: center;
  font: bold 18px/18px "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  line-height: 1.4em;
  color: white;
}
#notifications a {
  color: white;
  text-decoration: underline;
}
#notifications div {
  padding: 20px 30px;
}
#notifications div ul {
  list-style: none;
}
#notifications div.alert {
  background-color: #bd4247;
  border-bottom: 1px solid #973539;
}
#notifications div.success {
  background-color: #669533;
  border-bottom: 1px solid #4c6f26;
}
#notifications .close-notifications {
  padding: 0;
  position: absolute;
  top: 33%;
  right: 25px;
  cursor: pointer;
  font-size: 1.5em;
  color: white;
  color: rgba(255, 255, 255, 0.7);
}
#notifications .close-notifications:hover {
  color: white;
}

.notice {
  position: relative;
  width: 100%;
  text-align: center;
  line-height: 1.4em;
  color: white;
  padding: 20px 80px 20px 40px;
  background-color: #336d8a;
  border-bottom: 1px solid #255065;
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: bold;
}
.notice p {
  margin: 0;
  padding: 0;
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: bold;
}
.notice a {
  color: white;
  text-decoration: underline;
}
.notice .close-notice {
  padding: 0;
  position: absolute;
  top: 33%;
  right: 25px;
  cursor: pointer;
  font-size: 1.5em;
  color: white;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
}
.notice .close-notice:hover {
  color: white;
  text-decoration: none;
}

/* -----------------------------------------
   Inputs
----------------------------------------- */
input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  padding: 7px 8px;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 23px;
  border: 1px solid #bbb;
  background-color: #fafafa;
  color: #666;
  transition: none;
  -o-transition: none;
  -moz-transition: none;
  -webkit-transition: none;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
select:focus,
textarea:focus {
  background: white;
  border: 1px solid #999;
  outline: 0;
}

input[type="password"] {
  padding-right: 80px;
}

select, select:focus {
  outline: none;
}

.label, label {
  font-size: 18px;
  font-size: 1.8rem;
  text-transform: none;
  text-align: left;
  background: none;
  margin: 15px 0 5px 0;
  color: #4c565c;
}

input.large {
  font-size: 30px;
  line-height: 40px;
  height: 50px;
  padding: 5px 10px 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  border-color: #ccc;
}
input.large:focus {
  background: white;
  border: 1px solid #aaa;
  outline: 0;
}

.error_highlight input[type="email"],
.error_highlight input[type="text"],
.error_highlight input[type="password"],
.error_highlight select,
.error_highlight textarea {
  border-color: #bd4247;
}

input[type="email"].error_highlight,
input[type="text"].error_highlight,
input[type="password"].error_highlight,
select.error_highlight,
textarea.error_highlight {
  border-color: #bd4247;
}

button {
  padding: 0;
}

.button {
  display: inline-block;
  height: 37px;
  line-height: 37px;
  padding: 0 14px;
  margin-left: 6px;
  margin-right: 6px;
  font-weight: normal;
  border: none;
  cursor: pointer;
  position: relative;
  text-align: center;
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: 400;
  color: white;
  overflow: visible;
  background: url(../images/buttons/small_blue_middle.png) repeat-x;
  font-size: 13px;
  font-size: 1.3rem;
}
.button:before, .button:after {
  content: ' ';
  position: absolute;
  top: 0;
  left: -6px;
  height: 37px;
  width: 6px;
  background: url(../images/buttons/small_blue_left.png) no-repeat;
}
.button:after {
  left: auto;
  right: -6px;
  background: url(../images/buttons/small_blue_right.png) no-repeat;
}
.button.yellow {
  color: #333;
  font-weight: bold;
  text-shadow: 1px 1px 0 rgba(240, 240, 255, 0.5);
  background: url(../images/buttons/small_yellow_middle.png) repeat-x;
}
.button.yellow:before, .button.yellow:after {
  background: url(../images/buttons/small_yellow_left.png) no-repeat;
}
.button.yellow:after {
  background: url(../images/buttons/small_yellow_right.png) no-repeat;
}
.button.yellow:hover, .button.yellow:hover:before, .button.yellow:hover:after {
  color: black;
}
.button.grey {
  color: #4c565c;
  text-shadow: 1px 1px 0 rgba(240, 240, 255, 0.5);
  background: url(../images/buttons/small_grey_middle.png) repeat-x;
}
.button.grey:before, .button.grey:after {
  background: url(../images/buttons/small_grey_left.png) no-repeat;
}
.button.grey:after {
  background: url(../images/buttons/small_grey_right.png) no-repeat;
}
.button.grey:hover, .button.grey:hover:before, .button.grey:hover:after {
  color: black;
}
.button.gradient {
  height: 35px;
  line-height: 35px;
  margin-left: 3px;
  margin-right: 3px;
  color: #666;
  background: url(../images/buttons/grey_middle.png) repeat-x;
}
.button.gradient:before, .button.gradient:after {
  content: ' ';
  position: absolute;
  top: 0;
  left: -3px;
  height: 35px;
  width: 3px;
  background: url(../images/buttons/grey_left.png) no-repeat;
}
.button.gradient:after {
  left: auto;
  right: -3px;
  background: url(../images/buttons/grey_right.png) no-repeat;
}
.button.gradient:hover, .button.gradient:hover:before, .button.gradient:hover:after {
  background-position-y: -35px;
  color: #666;
}
.button.gradient:active, .button.gradient:active:before, .button.gradient:active:after {
  background-position-y: -70px;
}
.button:hover, .button:hover:before, .button:hover:after {
  background-position: 0 -37px;
  color: #fafafa;
}

.show-password {
  margin: 0 5px 0 0;
  right: 0;
  top: 0;
  position: absolute;
  padding: 12px 18px 10px 18px;
  text-align: center;
  background: #bbb;
  font-weight: bold;
  cursor: pointer;
  color: white !important;
  font-size: 14px;
  font-size: 1.4rem;
  -webkit-border-radius: 0 2px 2px 0;
  -moz-border-radius: 0 2px 2px 0;
  -ms-border-radius: 0 2px 2px 0;
  -o-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
}
.show-password.showing {
  background: #44a1d4;
}

.show-password-box {
  visibility: hidden;
  position: absolute;
}

.qq-upload-button {
  width: 140px;
  overflow: hidden;
  text-align: center;
}
.qq-upload-button div {
  font-size: 13px;
  font-size: 1.3rem;
}

#banana {
  top: -100px;
  position: absolute;
}

@media (max-width: 768px) {
  input[type="submit"], button, select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
  }
}
/* -----------------------------------------
   Bands
----------------------------------------- */
.band {
  position: relative;
  overflow: hidden;
  font-size: 20px;
  font-size: 2rem;
  color: #555;
  padding: 40px 0;
}
.band:before {
  width: 100%;
  height: 5px;
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0px;
  background: url(../images/structure/shadow_horizontal_top.png) bottom center no-repeat;
  z-index: 9;
}
.band.paper-light {
  background: url(../images/structure/bg_paper_light.png) top left repeat;
  border-bottom: 1px solid #ccc;
}
.band.paper-dark {
  background: url(../images/structure/bg_paper_dark.png) top left repeat;
  border-bottom: 1px solid #ccc;
}
.band.blue {
  background: #44a1d4 url(../images/structure/blue_background.png);
  background: #44a1d4 url(../images/structure/bg_paper_blue.png);
  border-top: 1px solid #336d8a;
  border-bottom: 1px solid #336d8a;
}
.band.white {
  background-color: white;
}
.band.dark-blue {
  background: #336d8a;
}
.band .divider {
  height: 100px;
  display: inline-block;
  margin-bottom: -25px;
  border-left: 3px dotted #7EBAD7;
  border-left: 3px dotted rgba(180, 200, 220, 0.7);
}
@media all and (max-width: 520px) {
  .band .divider {
    display: none;
  }
}
.band .box-link {
  padding: 25px;
  display: inline-block;
  margin: 0 25px;
  font-size: 44px;
  font-size: 4.4rem;
  text-shadow: 1px 1px 2px rgba(100, 100, 100, 0.94);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
}
.band .box-link:hover {
  cursor: pointer;
  background: url(../images/structure/bg_white_10.png);
  background: rgba(255, 255, 255, 0.1);
  -webkit-box-shadow: 0 2px 4px 0 rgba(100, 100, 120, 0.1);
  -moz-box-shadow: 0 2px 4px 0 rgba(100, 100, 120, 0.1);
  box-shadow: 0 2px 4px 0 rgba(100, 100, 120, 0.1);
  color: white;
}
.band .box-link .descriptor {
  margin-top: 10px;
  font-size: 18px;
  font-size: 1.8rem;
  text-shadow: none;
  display: block;
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: normal;
}

/* -----------------------------------------
   Cause lists
----------------------------------------- */
.slide-window {
  overflow: hidden;
  height: 480px;
  margin-bottom: 30px;
}
.slide-window .slider-right, .slide-window .slider-left {
  top: 268px;
  width: 63px;
  height: 58px;
  z-index: 101;
  display: block;
  position: absolute;
  padding-top: 12px;
}
.slide-window .slider-right:hover, .slide-window .slider-left:hover {
  background-position: bottom;
}
.slide-window .slider-left {
  left: 5px;
  background-image: url(../images/structure/previous_arrow.png);
}
.slide-window .slider-right {
  right: 9px;
  background-image: url(../images/structure/next_arrow.png);
}
.slide-window .cause-blocks .cause-slide {
  display: inline-block;
}

.more-slider a {
  display: block;
  padding: 10px;
  color: #336d8a;
}
.more-slider div {
  margin: -5px auto 30px auto;
  width: 47px;
  height: 51px;
  cursor: pointer;
}
.more-slider .down {
  background: url(../images/buttons/arrow_down.png) 0px -20px no-repeat;
}
.more-slider .up {
  background: url(../images/buttons/arrow_up.png) top left no-repeat;
}
.more-slider hr {
  border: none;
  height: 6px;
  width: 100%;
  background: url(../images/structure/hr_cause_description.png) top center no-repeat;
  margin: 0;
  border-top: 1px solid #cccccc;
}

.cause-stats, .cause-details, .cause-block {
  -webkit-transition: all 0.3s 0.2s;
  -webkit-transition-delay: ease;
  -moz-transition: all 0.3s 0.2s ease;
  -o-transition: all 0.3s 0.2s ease;
  transition: all 0.3s 0.2s ease;
}

.cause-block {
  display: inline-block;
  border: 1px solid #ccc;
  position: relative;
  overflow: hidden;
  height: 480px;
  width: 99%;
  padding: 0;
  margin: 0 1% 50px 0;
  cursor: pointer;
}
.cause-block .cause-stats {
  background: #444;
  background: rgba(50, 50, 50, 0.8);
  position: absolute;
  bottom: 100px;
  width: 100%;
  color: white;
  padding: 20px 5px 20px 20px;
  border-top: 1px solid #555;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.cause-block .cause-details {
  position: absolute;
  width: 100%;
  bottom: 0;
  height: 100px;
  padding: 20px 20px;
  background: url(../images/structure/bg_white_90.png);
  background: rgba(255, 255, 255, 0.9);
  -webkit-box-shadow: inset 0 -25px 85px -10px white;
  -moz-box-shadow: inset 0 -25px 85px -10px white;
  box-shadow: inset 0 -25px 85px -10px white;
  color: #333;
}
.cause-block .cause-title a {
  font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: normal;
  color: #336d8a;
  font-size: 20px;
  font-size: 2rem;
}
.cause-block .cause-excerpt {
  overflow: hidden;
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
}
.cause-block .cause-fade {
  position: absolute;
  bottom: 0;
  height: 30px;
  width: 100%;
  z-index: 8;
  background: transparent url(../images/structure/cause_fade.png) repeat-x;
}
.cause-block a {
  color: #44a1d4;
}
.cause-block .complete {
  color: #f9b850;
  text-transform: uppercase;
}
.cause-block .gradient {
  position: absolute;
  bottom: 1px;
  width: 99%;
  left: 2px;
  height: 43px;
  background: url(../images/structure/box_gradient.png);
}
.cause-block:hover {
  background-position: center -40px !important;
}
.cause-block:hover .cause-details {
  background: white;
  height: 240px;
}
.cause-block:hover .cause-excerpt {
  opacity: 1;
}
.cause-block:hover .cause-title a {
  color: #336d8a;
}
.cause-block:hover .cause-stats {
  padding: 10px 10px 10px 20px;
  bottom: 240px;
}

.completed-ribbon {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 86px;
  height: 86px;
  background: transparent url(../images/structure/finished_corner_stitch.png) no-repeat top left;
}

.donation-overlay-container {
  position: relative;
}
.donation-overlay-container .donation-overlay {
  position: absolute;
  z-index: 10;
  top: -115px;
  right: 0;
  padding: 0 15px;
  width: 450px;
}
.donation-overlay-container .donation-overlay .cause-stats {
  width: 100%;
  padding: 10px;
  text-align: center;
  font-size: 16px;
  font-size: 1.6rem;
  color: #ac6c05;
  background-color: #fab950;
  border: 1px solid #f69b07;
  margin-bottom: 10px;
}
.donation-overlay-container .donation-overlay .cause-stats strong {
  font-size: 21px;
  font-size: 2.1rem;
}
.donation-overlay-container .donation-overlay .donation-btn, .donation-overlay-container .donation-overlay .redemption-btn, .donation-overlay-container .donation-overlay .kindness-btn {
  padding: inherit 20px;
  width: 45%;
}
.donation-overlay-container .donation-overlay .kindness-btn {
  float: right;
  width: 60%;
  margin-top: 55px;
}
@media (max-width: 490px) {
  .donation-overlay-container .donation-overlay {
    width: 100%;
    top: -185px;
  }
  .donation-overlay-container .donation-overlay .donation-btn, .donation-overlay-container .donation-overlay .redemption-btn, .donation-overlay-container .donation-overlay .kindness-btn {
    width: 100%;
    margin-bottom: 10px;
  }
  .donation-overlay-container .donation-overlay .kindness-btn {
    margin-top: 125px;
  }
}

#donate_form_container, #redeem_form_container, #in_kind_form_container {
  z-index: 13;
  position: relative;
  float: right;
  width: 100%;
  background: white;
  padding: 30px 15px 15px;
  margin-top: 5px;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  -moz-box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
  box-shadow: 0 1px 1px 0 rgba(100, 100, 100, 0.4);
}
#donate_form_container input#hash, #redeem_form_container input#hash, #in_kind_form_container input#hash {
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 45px;
  height: 60px;
  padding: 7px 10px 0 10px;
}
#donate_form_container h2, #redeem_form_container h2, #in_kind_form_container h2 {
  margin-top: 0;
}
#donate_form_container p, #redeem_form_container p, #in_kind_form_container p {
  margin-bottom: 10px;
  line-height: 1.3em;
}

label.anon-donate {
  display: inline-block;
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: normal;
  margin-top: 13px;
}

select.group-dropdown {
  margin-bottom: 10px;
  padding: 6px;
  font-family: "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  background: #fafafa;
  color: #666;
  width: 100%;
  line-height: 1;
  border: 1px solid #e1e1e1;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  -webkit-appearance: none;
  -moz-appearance: none;
}

textarea#user_message {
  margin-bottom: 5px;
}

/*.donations {
	padding-top: 18px;
}*/
.maxlength {
  text-align: right;
  font-size: 0.8em;
  color: #336d8a;
  margin-bottom: 10px;
}

.social-links a {
  width: 98px;
  text-align: center;
  height: 45px;
  display: inline-block;
  background: top center no-repeat;
  margin: 20px 40px 40px 0;
}
.social-links a:hover, .social-links .friend-result:hover .add-friend-link, .friend-result:hover .social-links .add-friend-link {
  background-position: bottom center;
}
.social-links #facebook {
  background-image: url(../images/icons/icon_facebook.png);
}
.social-links #twitter {
  background-image: url(../images/icons/icon_twitter.png);
}
.social-links #email {
  background-image: url(../images/icons/icon_email.png);
}
.social-links #youtube {
  background-image: url(../images/icons/icon_youtube.png);
}
.social-links #pinterest {
  background-image: url(../images/icons/icon_pinterest.png);
}
.social-links span {
  display: inline-block;
  padding-top: 50px;
  font-size: 12px;
  font-size: 1.2rem;
  color: #336d8a;
}

/*.donations {
	height:600px; //jQuery overwrites this - CausesController.js

	//MOVE DONATION HISTORY OFF EDGE
	@media (max-width:1090px) {
		position: relative;
		right: 15px;
	}
}*/
.other-almost-finished {
  margin-top: 0;
}

/* -----------------------------------------
   imgAreaSelect default style
----------------------------------------- */
.imgareaselect-border1 {
  background: url(../images/imgareaselect/border-v.gif) repeat-y left top;
}

.imgareaselect-border2 {
  background: url(../images/imgareaselect/border-h.gif) repeat-x left top;
}

.imgareaselect-border3 {
  background: url(../images/imgareaselect/border-v.gif) repeat-y right top;
}

.imgareaselect-border4 {
  background: url(../images/imgareaselect/border-h.gif) repeat-x left bottom;
}

.imgareaselect-border1, .imgareaselect-border2,
.imgareaselect-border3, .imgareaselect-border4 {
  filter: alpha(opacity=50);
  opacity: 0.5;
}

.imgareaselect-handle {
  background-color: #fff;
  border: solid 1px #000;
  filter: alpha(opacity=50);
  opacity: 0.5;
}

.imgareaselect-outer {
  background-color: #000;
  filter: alpha(opacity=50);
  opacity: 0.5;
}

.group-image {
  margin: 11px 0 5px 0;
  border-radius: 3px;
}

.search-result {
  overflow: auto;
}
.search-result img {
  width: 128px;
  margin: 0 20px 0 0;
  border: 1px solid #e1e1e1;
}

.leaderboard {
  width: 100%;
  margin-bottom: 40px;
}
.leaderboard tbody tr td {
  padding: 5px 3px;
  border-top: 1px solid #e1e1e1;
}

.donate-form p {
  margin-bottom: 5px;
}
.donate-form .block-grid.five-up {
  margin: 0;
}
.donate-form .block-grid.five-up > li {
  padding: 0;
}
.donate-form .preset, .donate-form .payment-method div {
  color: #606060;
  font-size: 20px;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  background: #f5f5f5;
  border: 1px solid #ddd;
  border-right: none;
  cursor: pointer;
}
.donate-form .preset:first-child, .donate-form .payment-method div:first-child {
  -webkit-border-radius: 2px 0 0 2px;
  -moz-border-radius: 2px 0 0 2px;
  -ms-border-radius: 2px 0 0 2px;
  -o-border-radius: 2px 0 0 2px;
  border-radius: 2px 0 0 2px;
}
.donate-form .preset:last-child, .donate-form .payment-method div:last-child {
  -webkit-border-radius: 0 2px 2px 0;
  -moz-border-radius: 0 2px 2px 0;
  -ms-border-radius: 0 2px 2px 0;
  -o-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
  border-right: 1px solid #ddd;
}
.donate-form .preset:hover, .donate-form .payment-method div:hover {
  background: #eaeaea;
}
.donate-form .preset.selected, .donate-form .payment-method div.selected {
  color: white;
  cursor: default;
  background: url("../images/structure/selected_button.jpg");
  text-shadow: 0 1px 2px #646464;
  -webkit-box-shadow: inset 0 1px 2px 0 rgba(100, 100, 100, 0.7);
  -moz-box-shadow: inset 0 1px 2px 0 rgba(100, 100, 100, 0.7);
  box-shadow: inset 0 1px 2px 0 rgba(100, 100, 100, 0.7);
}
.donate-form .donation-amount, .donate-form .name {
  position: relative;
  width: 100%;
  padding-bottom: 10px;
  margin: 5px 0 20px;
  border-bottom: 1px solid #e9e9e9;
}
.donate-form .donation-amount span.inner, .donate-form .name span {
  font-size: 24px;
  font-size: 2.4rem;
  color: #d6d6d6;
  position: absolute;
  top: 20px;
  z-index: 30;
  padding: 0 15px;
}
.donate-form .donation-amount-input {
  font-size: 39px;
  font-size: 3.9rem;
  line-height: 50px;
  height: 60px;
  padding: 7px 60px 0 35px;
}
.donate-form .name {
  padding-bottom: 0;
}
.donate-form .name span {
  font-size: 32px;
  font-size: 3.2rem;
  top: 14px;
}
.donate-form .dollar {
  font-size: 38px;
  font-size: 3.8rem;
}
.donate-form .currency {
  right: 0;
}
.donate-form .payment-method {
  padding: 0 0 25px 0;
  margin: 25px 0 20px 0;
  border: 1px solid #e9e9e9;
  border-style: solid none;
}
.donate-form .payment-method div {
  width: 165px;
}
.donate-form .donation-history {
  padding: 0 20px 20px 50px;
}
.donate-form .donation {
  font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  border-top: 1px solid #e9e9e9;
  padding: 15px 0;
  min-height: 85px;
}
.donate-form .donation .details {
  text-align: right;
  display: inline-block;
  padding-right: 15px;
  border-right: 1px solid #e9e9e9;
}
.donate-form .donation .dollarz {
  font-size: 36px;
  font-size: 3.6rem;
  color: #696969;
}
.donate-form .donation .donator-name {
  font-size: 20px;
  font-size: 2rem;
  color: #b9b9b9;
}
.donate-form .donation .message {
  padding-left: 15px;
  font-size: 14px;
  color: #555;
  line-height: 1.3;
  vertical-align: middle;
}

#donate_submit_btn {
  float: right;
}

.donate-joy {
  margin-top: 20px;
}

#voucher_main {
  border: 3px solid white;
}

.voucher-thumbs.block-grid.three-up > li {
  padding: 0 15px 14px;
}
.voucher-thumbs li img {
  border: 2px solid #2b87ba;
  cursor: pointer;
}
.voucher-thumbs .active {
  border: 2px solid white;
}

@media (max-width: 767px) {
  .button.voucher-preview {
    display: none;
  }
}
.donation-item {
  border-radius: 3px;
  min-height: 170px;
  background: transparent url(../images/structure/bg_donation_history_item.png) top left repeat-x;
  position: relative;
}
.donation-item .donator-image {
  height: 80px;
  width: 80px;
  margin-right: 10px;
}
.donation-item .payroll-giver {
  position: absolute;
  top: 70px;
  left: 8px;
  width: 70px;
  height: 18px;
  background: url(../images/icons/payroll_giver_large.png) top left no-repeat;
}
.donation-item .payroll-giver.joyfund-giver {
  background: url(../images/icons/joy_fund_large.png) top left no-repeat !important;
}
.donation-item h5 {
  margin: 5px 0 0 0;
}
.donation-item p {
  padding: 5px 5px 0 5px;
  line-height: 1.2;
  font-size: 15px;
  font-size: 1.5rem;
  margin-top: 10px;
}
.donation-item p.value {
  padding: 5px 0 0 0;
  font-size: 22px;
  font-size: 2.2rem;
  margin: 0;
}

.dash-bg {
  background: white;
  *zoom: 1;
  border: 1px solid #ddd;
}
.dash-bg:before, .dash-bg:after {
  content: " ";
  display: table;
}
.dash-bg:after {
  clear: both;
}
.dash-bg h2 {
  margin-top: 14px;
}

.dashboard .user-avatar {
  width: 128px;
  height: 128px;
  margin: 0 30px 10px 0;
  background: white;
  -webkit-box-shadow: 0 0px 4px -1px rgba(30, 30, 30, 0.5);
  -moz-box-shadow: 0 0px 4px -1px rgba(30, 30, 30, 0.5);
  box-shadow: 0 0px 4px -1px rgba(30, 30, 30, 0.5);
}
.dashboard .user-name, .dashboard .group-name {
  margin-bottom: 0;
}
.dashboard #dashboard_edit_profile_button {
  display: block;
  margin-top: 10px;
}
.dashboard #edit_profile_container {
  background: #4c565c;
  position: relative;
}
.dashboard #edit_profile_container label {
  color: #ddd;
}
.dashboard #edit_profile_container #cancel_edit_link {
  margin-top: 10px;
  cursor: pointer;
  font-size: 13px;
  font-size: 1.3rem;
}
.dashboard .dashboard-module {
  background: #f2f2f2;
  border: 1px solid #ddd;
  padding: 5px 15px 15px 15px;
}
.dashboard .dashboard-module h2, .dashboard .dashboard-module .button.right {
  margin-top: 14px;
}
.dashboard .feed {
  background: #fcfcfc;
  min-height: 387px;
  border: none;
}
.dashboard .feed.dashboard-module {
  border-right: 1px solid #ddd;
}
.dashboard .sidebar {
  background: none;
  border: none;
}
.dashboard .tab-bar {
  height: 70px;
  background: white;
  border-bottom: 5px solid #44a1d4;
}
.dashboard .tab-bar .tab-box {
  display: block;
  float: left;
  padding: 0;
  margin: 0;
}
.dashboard .tab-bar .tab {
  display: block;
  padding: 18px 0 13px 20px;
  background: white;
  border-top: 1px solid #dedede;
  border-right: 1px solid #dedede;
  font-size: 34px;
  font-size: 3.4rem;
}
.dashboard .tab-bar .tab.dashboard {
  border-left: 1px solid #dedede;
}
.dashboard .tab-bar .tab:hover {
  background: #fafafa;
}
.dashboard .tab-bar .tab.active {
  color: white;
  background: #44a1d4;
  border-color: #44a1d4;
  box-shadow: none;
}
.dashboard .feed-item {
  padding: 0;
  margin: 8px 0;
  border-bottom: 1px solid #e6e6e6;
  position: relative;
  min-height: 120px;
}
.dashboard .feed-item .donator-image {
  margin: 8px 18px 8px 15px;
  height: 80px;
  width: 80px;
}
.dashboard .feed-item .payroll-giver {
  position: absolute;
  top: 90px;
  left: 8px;
  width: 70px;
  height: 18px;
  background: url(../images/icons/payroll_giver_large.png) top left no-repeat;
}
.dashboard .feed-item .payroll-giver.joyfund-giver {
  background: url(../images/icons/joy_fund_large.png) top left no-repeat;
}
.dashboard .feed-item .donator {
  margin-top: 10px;
  margin-bottom: 5px;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}
.dashboard .feed-item .donation-amount span {
  color: #888;
  font-size: 16px;
  font-size: 1.6rem;
}
.dashboard .feed-item .donation {
  min-height: 105px;
  padding-top: 10px;
}
.dashboard .feed-item .donation .donation-cause {
  margin: 0 5px 5px 0;
  font-size: 16px;
  font-size: 1.6rem;
}
.dashboard .feed-item .donation .donation-cause a {
  color: #336d8a;
}
.dashboard .feed-item .donation .donation-message {
  font-size: 14px;
  font-size: 1.4rem;
}
.dashboard .feed-item .donation .donation-message a {
  color: #444;
}
.dashboard .feed-item .get-receipt {
  font-size: 13px;
  font-size: 1.3rem;
}
.dashboard .feed-item .meta {
  margin-left: -31px;
}
.dashboard .feed-item .meta .meta-left {
  width: 265px;
  float: left;
}
.dashboard .feed-item .meta .meta-left small {
  display: block;
}
.dashboard .feed-item .meta .meta-right {
  position: relative;
  overflow: hidden;
  padding: 12px 12px 0 12px;
  border-left-style: none;
}
.dashboard .feed-item .anon {
  color: #888;
}
.dashboard .feed-item .anon img {
  opacity: 0.7;
}

#filter_mine {
  width: 130px;
  margin-top: 10px;
  border-top-color: #cfcfcf;
}

#clear_search {
  position: absolute;
  cursor: pointer;
  right: 23px;
  top: 52px;
  color: #999;
}

#friend_search {
  padding-right: 27px;
}

#friend_search_results {
  max-height: 720px;
  overflow: auto;
  position: absolute;
  z-index: 2;
  background: white;
  border: 1px solid #ddd;
  border-style: solid none;
  background: white url(../images/structure/shadow_horizontal_small.png) top no-repeat;
}

.friend-result {
  height: 70px;
  margin: 5px 0;
  border-bottom: 1px solid #eee;
  position: relative;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
.friend-result img {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 5px;
}
.friend-result .add-friend-link {
  display: block;
  margin-top: 23px;
  padding-right: 15px;
  font-size: 20px;
  font-size: 2rem;
}
.friend-result .find-friend-name {
  display: inline-block;
  margin: 0 0 0 15px;
  max-width: 240px;
}
.friend-result:last-child {
  margin-bottom: 0;
}

.no-results {
  padding: 13px 0 0 5px;
  font-style: italic;
  color: #777;
}

#friend_request_container, #friend_tooltip {
  padding: 10px;
  background: #efefef;
  border: 1px solid #ddd;
  z-index: 9000;
  -webkit-box-shadow: 0 0 1px 0 rgba(100, 100, 100, 0.4);
  -moz-box-shadow: 0 0 1px 0 rgba(100, 100, 100, 0.4);
  box-shadow: 0 0 1px 0 rgba(100, 100, 100, 0.4);
}

#friend_request_container {
  position: absolute;
  height: 135px;
  left: 0;
  border-left: none;
  border-right: none;
  width: 100%;
  *zoom: 1;
}
#friend_request_container:before, #friend_request_container:after {
  content: " ";
  display: table;
}
#friend_request_container:after {
  clear: both;
}

#friend_tooltip {
  display: none;
  width: 280px;
  position: absolute;
}
#friend_tooltip:before {
  content: ' ';
  display: block;
  background: url(../images/structure/up_triangle_grey.png) no-repeat;
  width: 33px;
  height: 15px;
  position: absolute;
  z-index: 9001;
  top: -15px;
  right: 116px;
}
#friend_tooltip .friend-name.main {
  width: 160px;
  font-size: 16px;
  font-size: 1.6rem;
  padding-top: 5px;
  font-weight: bold;
  display: inline-block;
}
#friend_tooltip .action {
  font-family: "Fontello", "Source Sans Pro", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  cursor: pointer;
  float: right;
  padding: 3px 5px;
  display: inline-block;
}
#friend_tooltip .action:hover {
  opacity: 0.7;
}

.unfriend-yes-button {
  margin-left: 20px;
}

.incoming-friends {
  border-bottom: 1px solid #ddd;
  overflow: auto;
}

.friend-request-panel, .group-request-panel {
  display: inline-block;
  position: relative;
  border-top: 1px solid #ddd;
  padding: 15px 0 15px 0;
}
.friend-request-panel img, .friend-request-panel h3, .group-request-panel img, .group-request-panel h3 {
  display: inline-block;
}
.friend-request-panel img, .group-request-panel img {
  margin: 0 15px 0 0;
  float: left;
  vertical-align: top;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
}
.friend-request-panel h3, .group-request-panel h3 {
  margin: 0 0 10px 0;
  width: 200px;
}
.friend-request-panel p, .group-request-panel p {
  width: 200px;
  margin-left: 79px;
  font-size: 14px;
  font-size: 1.4rem;
  color: #888;
  line-height: 1.3;
}
.friend-request-panel .buttons, .group-request-panel .buttons {
  width: 60px;
  position: absolute;
  right: 0;
  top: 10px;
}
.friend-request-panel .friend-request-button, .group-request-panel .friend-request-button {
  padding: 20px;
  display: block;
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 0;
}
.friend-request-panel .friend-request-button:hover, .group-request-panel .friend-request-button:hover {
  opacity: 0.6;
}
.friend-request-panel .friend-request-button:first-child, .group-request-panel .friend-request-button:first-child {
  margin-top: 3px;
  margin-bottom: 6px;
}
.friend-request-panel .friend-request-button.decline, .group-request-panel .friend-request-button.decline {
  color: #c21e2d;
}

.send-message-form, .remove-friend {
  margin-top: 15px;
}

.thread .title {
  overflow: auto;
}
.thread .title strong {
  font-weight: normal;
  color: #888;
}
.thread time {
  padding: 3px 20px 0 0;
}
.thread .groups-meta {
  margin-right: 100px;
}
.thread .messages-meta {
  margin-right: 100px;
  margin-top: -56px;
}

ul.accordion > li > div.title {
  padding: 15px 25px 15px 45px;
}

ul.accordion > li.unread > div.title {
  background: white;
}

.unread .title {
  color: #111;
}
.unread .title strong {
  font-weight: bold;
  color: #555;
}
.unread .title:before {
  display: block;
  content: ' ';
  width: 3px;
  height: 47px;
  background: #44a1d4;
  position: absolute;
  left: 1px;
  top: 6px;
}

.active .title {
  color: #111;
}
.active .title strong {
  font-weight: bold;
  color: #555;
}

.open {
  background: white;
}
.open .state {
  color: #44a1d4;
}

.thread-image {
  position: absolute;
  top: 15px;
  left: 15px;
}

.post-container {
  display: none;
}
.post-container .meta {
  overflow: visible;
  padding: 15px 0 10px 0;
  background: #ededed;
  position: relative;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  border-radius: 6px;
  *zoom: 1;
}
.post-container .meta:before, .post-container .meta:after {
  content: " ";
  display: table;
}
.post-container .meta:after {
  clear: both;
}
.post-container .meta:before {
  position: absolute;
  left: -20px;
  top: 20px;
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 10px;
  border-color: transparent #ededed transparent transparent;
}
.post-container .mine .meta {
  margin-right: 0;
  background: #f6f6f6;
}
.post-container .mine .meta .name {
  text-align: right;
}
.post-container .mine .meta:before {
  left: auto;
  right: -20px;
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 10px;
  border-color: transparent transparent transparent #f6f6f6;
}
.post-container .post {
  margin: 8px 0;
}
.post-container .post img {
  display: inline-block;
  float: right;
  width: 48px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  margin-top: 9px;
}
.post-container .post .mine img {
  float: left;
}

.message-reply-form {
  padding: 0 100px;
}

#reply {
  max-height: 87px;
  max-width: 100%;
  margin: 20px 0;
}

.group-list .panel {
  position: relative;
  height: 200px;
  padding-top: 7px;
  overflow: hidden;
}
.group-list .panel.is-admin {
  background: white url(../images/structure/group_owner_corner.png) top right no-repeat;
}
.group-list h3 {
  padding-top: 5px;
}
.group-list img {
  margin-right: 5px;
  max-width: 64px;
  max-height: 64px;
  float: left;
}
@media all and (max-width: 850px) {
  .group-list img {
    display: none;
  }
}
.group-list .strapline {
  display: inline-block;
  margin-top: 8px;
  line-height: 1;
  color: #666;
  *zoom: 1;
  font-size: 16px;
  font-size: 1.6rem;
}
.group-list .strapline:before, .group-list .strapline:after {
  content: " ";
  display: table;
}
.group-list .strapline:after {
  clear: both;
}
.group-list .group-meta {
  font-size: 14px;
  font-size: 1.4rem;
  color: #888;
  position: absolute;
  bottom: 8px;
}
.group-list .group-meta .new-discussions {
  font-weight: bold;
}
.group-list .view-group {
  margin-left: 10px;
}

.group-header .strapline {
  display: inline;
}

.two.columns .group-view-img {
  margin-top: 25px;
  -webkit-box-shadow: 3 red 5px 0;
  -moz-box-shadow: 3 red 5px 0;
  box-shadow: 3 red 5px 0;
}

.edit-group {
  display: block;
  margin-top: 10px;
}

.delete-group {
  border-top: 1px dashed #ccc;
  font-size: 14px;
  font-size: 1.4rem;
}
.delete-group span {
  color: #c21e2d;
  cursor: pointer;
}

.group-stats {
  margin-top: 50px;
  display: block;
  font-size: 22px;
  font-size: 2.2rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
}
.group-stats span {
  border-right: 1px solid #ddd;
  text-align: center;
  width: 25%;
  display: inline-block;
}
.group-stats span small {
  display: block;
}
.group-stats span:first-child {
  border-left: 1px solid #ddd;
}

.group-message-board {
  margin-top: 50px;
  border-top: 1px solid #eee;
}

.group-threads {
  border-top: 1px solid #ddd;
  margin-top: 10px;
}
.group-threads .thread-header {
  width: 70%;
}
.group-threads .thread-image {
  margin-left: -8px;
}
.group-threads .right-meta {
  width: 30%;
}
.group-threads .message {
  font-size: 16px;
  font-size: 1.6rem;
}

/* This is the default Tooltipster theme (feel free to modify or duplicate and create multiple themes!): */
.tooltipster-default {
  border-radius: 5px;
  border: 2px solid #000;
  background: #4c4c4c;
  color: #fff;
}

/* Use this next selector to style things like font-size and line-height: */
.tooltipster-default .tooltipster-content {
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 16px;
  padding: 8px 10px;
  overflow: hidden;
}

/* This next selector defines the color of the border on the outside of the arrow. This will automatically match the color and size of the border set on the main tooltip styles. Set display: none; if you would like a border around the tooltip but no border around the arrow */
.tooltipster-default .tooltipster-arrow .tooltipster-arrow-border {
  /* border-color: ... !important; */
}

/* If you're using the icon option, use this next selector to style them */
.tooltipster-icon {
  cursor: help;
  margin-left: 4px;
}

/* This is the base styling required to make all Tooltipsters work */
.tooltipster-base {
  padding: 0;
  font-size: 0;
  line-height: 0;
  position: absolute;
  z-index: 9999999;
  pointer-events: none;
  width: auto;
  width: 150px;
  overflow: visible;
}

.tooltipster-base .tooltipster-content {
  overflow: hidden;
}

/* These next classes handle the styles for the little arrow attached to the tooltip. By default, the arrow will inherit the same colors and border as what is set on the main tooltip itself. */
.tooltipster-arrow {
  display: block;
  text-align: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.tooltipster-arrow span, .tooltipster-arrow-border {
  display: block;
  width: 0;
  height: 0;
  position: absolute;
}

.tooltipster-arrow-top span, .tooltipster-arrow-top-right span, .tooltipster-arrow-top-left span {
  border-left: 8px solid transparent !important;
  border-right: 8px solid transparent !important;
  border-top: 8px solid;
  bottom: -8px;
}

.tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-top-left .tooltipster-arrow-border {
  border-left: 9px solid transparent !important;
  border-right: 9px solid transparent !important;
  border-top: 9px solid;
  bottom: -8px;
}

.tooltipster-arrow-bottom span, .tooltipster-arrow-bottom-right span, .tooltipster-arrow-bottom-left span {
  border-left: 8px solid transparent !important;
  border-right: 8px solid transparent !important;
  border-bottom: 8px solid;
  top: -8px;
}

.tooltipster-arrow-bottom .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
  border-left: 9px solid transparent !important;
  border-right: 9px solid transparent !important;
  border-bottom: 9px solid;
  top: -8px;
}

.tooltipster-arrow-top span, .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom .tooltipster-arrow-border {
  left: 0;
  right: 0;
  margin: 0 auto;
}

.tooltipster-arrow-top-left span, .tooltipster-arrow-bottom-left span {
  left: 6px;
}

.tooltipster-arrow-top-left .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
  left: 5px;
}

.tooltipster-arrow-top-right span, .tooltipster-arrow-bottom-right span {
  right: 6px;
}

.tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border {
  right: 5px;
}

.tooltipster-arrow-left span, .tooltipster-arrow-left .tooltipster-arrow-border {
  border-top: 8px solid transparent !important;
  border-bottom: 8px solid transparent !important;
  border-left: 8px solid;
  top: 50%;
  margin-top: -7px;
  right: -8px;
}

.tooltipster-arrow-left .tooltipster-arrow-border {
  border-top: 9px solid transparent !important;
  border-bottom: 9px solid transparent !important;
  border-left: 9px solid;
  margin-top: -8px;
}

.tooltipster-arrow-right span, .tooltipster-arrow-right .tooltipster-arrow-border {
  border-top: 8px solid transparent !important;
  border-bottom: 8px solid transparent !important;
  border-right: 8px solid;
  top: 50%;
  margin-top: -7px;
  left: -8px;
}

.tooltipster-arrow-right .tooltipster-arrow-border {
  border-top: 9px solid transparent !important;
  border-bottom: 9px solid transparent !important;
  border-right: 9px solid;
  margin-top: -8px;
}

/* Some CSS magic for the awesome animations - feel free to make your own custom animations and reference it in your Tooltipster settings! */
.tooltipster-fade {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  -ms-transition-property: opacity;
  transition-property: opacity;
}

.tooltipster-fade-show {
  opacity: 1;
}

.tooltipster-grow {
  -webkit-transform: scale(0, 0);
  -moz-transform: scale(0, 0);
  -o-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  transform: scale(0, 0);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -ms-transition-property: -ms-transform;
  transition-property: transform;
  -webkit-backface-visibility: hidden;
}

.tooltipster-grow-show {
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  transform: scale(1, 1);
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
}

.tooltipster-swing {
  opacity: 0;
  -webkit-transform: rotateZ(4deg);
  -moz-transform: rotateZ(4deg);
  -o-transform: rotateZ(4deg);
  -ms-transform: rotateZ(4deg);
  transform: rotateZ(4deg);
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -ms-transition-property: -ms-transform;
  transition-property: transform;
}

.tooltipster-swing-show {
  opacity: 1;
  -webkit-transform: rotateZ(0deg);
  -moz-transform: rotateZ(0deg);
  -o-transform: rotateZ(0deg);
  -ms-transform: rotateZ(0deg);
  transform: rotateZ(0deg);
  -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 1);
  -webkit-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  -moz-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  -ms-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  -o-transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
  transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
}

.tooltipster-fall {
  top: 0px;
  -webkit-transition-property: top;
  -moz-transition-property: top;
  -o-transition-property: top;
  -ms-transition-property: top;
  transition-property: top;
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
}

.tooltipster-fall.tooltipster-dying {
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  -ms-transition-property: all;
  transition-property: all;
  top: 0px !important;
  opacity: 0;
}

.tooltipster-slide {
  left: -40px;
  -webkit-transition-property: left;
  -moz-transition-property: left;
  -o-transition-property: left;
  -ms-transition-property: left;
  transition-property: left;
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
}

.tooltipster-slide.tooltipster-dying {
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  -ms-transition-property: all;
  transition-property: all;
  left: 0px !important;
  opacity: 0;
}

/* CSS transition for when contenting is changing in a tooltip that is still open */
.tooltipster-content-changing {
  -webkit-transform: scale(1.1, 1.1);
  -moz-transform: scale(1.1, 1.1);
  -o-transform: scale(1.1, 1.1);
  -ms-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
}

/* -----------------------------------------
   Social Angels
----------------------------------------- */
.tooltipster-light {
  border-radius: 5px;
  border: 1px solid #cccccc;
  background: #ededed;
  color: #666666;
  text-align: center;
}

.tooltipster-light .tooltipster-content {
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 16px;
  padding: 8px 10px;
}

.tooltipster-fall {
  top: 500px;
}
