/**
OVERRIDING STYLES FROM SAME DONATION BLOCK
Based on: https://www.hrw.org/donate-now?promo_id=1002
sepaarted this just so we can change styles as needed
and so it doesn't affect the entire site like it did when i just dropped it in
**/
.donation-form--cta.donation-form {
  background: #000000;
  background-image: url("/sites/all/themes/hrw/img/promos/donation-promo--small.jpg");
  background-size: cover;
  background-position: top center;
  color: #ffffff;
  position: relative;
  display: block;
  max-width: 100%;
  padding-top: 160px; }
  @media (min-width: 30em) {
    .donation-form--cta.donation-form {
      padding-top: 220px; } }
  @media (min-width: 51.25em) {
    .donation-form--cta.donation-form {
      background-image: url("/sites/all/themes/hrw/img/promos/donation-promo--large.jpg");
      background-position: center center;
      padding-top: 0; } }

.donation-form--cta.row {
  display: table;
  margin: 2em 0;
  vertical-align: top;
  width: 100%; }

.donation-form--cta .form--gradient {
  border-top: 5px solid #f96c1f;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 0;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+73&0+0,0.82+90 */
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, transparent 0%, #000000 73%, #000000 90%);
  background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.67) 73%, rgba(0, 0, 0, 0.82) 90%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0, 0, 0, 0)', endColorstr='rgba(209, 0, 0, 0)',GradientType=0 );
  /* IE6-9 */ }
  @media (min-width: 51.25em) {
    .donation-form--cta .form--gradient {
      /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+77,000000+77&0.82+7,0+90,0+90 */
      /* FF3.6-15 */
      /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to right, #000000 0%, #000000 7%, #000000 77%, transparent 90%);
      background: linear-gradient(to right, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.82) 7%, rgba(0, 0, 0, 0.13) 77%, transparent 90%);
      /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(209, 0, 0, 0)', endColorstr='rgba(0, 0, 0, 0)',GradientType=1 );
      /* IE6-9 */ } }

@media (min-width: 51.25em) {
  .donation-form--cta .the-form {
    float: left;
    width: 55%; } }

@media (min-width: 64em) {
  .donation-form--cta .the-form {
    width: 50%; } }

.donation-form--cta .form--heading {
  color: #ffffff;
  font-size: 20px;
  margin: 0 0 24px 0;
  padding: 24px 24px 0;
  position: relative;
  z-index: 1; }
  @media (min-width: 37.5em) {
    .donation-form--cta .form--heading {
      font-size: 22px; } }
  @media (min-width: 87.5em) {
    .donation-form--cta .form--heading {
      font-size: 23px; } }
  @media (min-width: 98.125em) {
    .donation-form--cta .form--heading {
      font-size: 26px; } }

.donation-form--cta .hrw-form {
  color: #000;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  overflow: hidden;
  padding: 0 24px 24px;
  position: relative;
  z-index: 1; }

.donation-form--cta input[type="radio"] {
  left: -999em;
  position: absolute; }

.donation-form--cta .OtherInput {
  background: #007dc3;
  box-sizing: border-box;
  color: #ffffff;
  display: block;
  float: left;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.25;
  max-width: 100%;
  padding: 9px 0;
  text-align: center; }
  @media (min-width: 37.5em) {
    .donation-form--cta .OtherInput {
      font-size: 22px; } }
  @media (min-width: 87.5em) {
    .donation-form--cta .OtherInput {
      font-size: 23px; } }
  @media (min-width: 98.125em) {
    .donation-form--cta .OtherInput {
      font-size: 26px; } }

.donation-form--cta .Other,
.donation-form--cta .OtherInput,
.donation-form--cta .OtherToggle {
  cursor: pointer;
  display: none;
  margin-right: 0; }
  .donation-form--cta .Other.is-visible,
  .donation-form--cta .OtherInput.is-visible,
  .donation-form--cta .OtherToggle.is-visible {
    display: block; }

.donation-form--cta .label-wrapper {
  box-sizing: border-box;
  float: left;
  padding: 1px;
  width: 50%; }
  @media (min-width: 37.5em) {
    .donation-form--cta .label-wrapper {
      width: 33.33333%; } }

.donation-form--cta label {
  background: #ffffff;
  color: #444;
  cursor: pointer;
  display: block;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.25;
  padding: 10px 0;
  text-align: center;
  width: 100%; }
  .donation-form--cta label:hover {
    color: #000000; }
  @media (min-width: 37.5em) {
    .donation-form--cta label {
      font-size: 22px; } }
  @media (min-width: 87.5em) {
    .donation-form--cta label {
      font-size: 23px; } }
  @media (min-width: 98.125em) {
    .donation-form--cta label {
      font-size: 26px; } }

.donation-form--cta input:checked + label {
  background: #007dc3;
  color: #ffffff; }

.donation-form--cta .donate-button-holder {
  text-align: center;
  width: 100%; }
  .donation-form--cta .donate-button-holder button {
    border-radius: 0;
    width: calc(100% - 2px);
    margin: 1px 0 0 0;
    padding: 12px 24px;
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase; }
    @media (min-width: 37.5em) {
      .donation-form--cta .donate-button-holder button {
        font-size: 22px; } }
    @media (min-width: 87.5em) {
      .donation-form--cta .donate-button-holder button {
        font-size: 23px; } }
    @media (min-width: 98.125em) {
      .donation-form--cta .donate-button-holder button {
        font-size: 26px; } }

.donation-promo--one-column .donation-form--cta {
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
  width: 100%; }

@media (min-width: 77.5em) and (max-width: 87.5em) {
  .donation-promo--two-column .donation-form--cta.donation-form {
    background-image: url("/sites/all/themes/hrw/img/promos/donation-promo--small.jpg");
    background-position: top center;
    padding-top: 200px; } }

@media (min-width: 77.5em) and (max-width: 87.5em) {
  .donation-promo--two-column .donation-form--cta .form--gradient {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+73&0+0,0.82+90 */
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, transparent 0%, #000000 73%, #000000 90%);
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.67) 73%, rgba(0, 0, 0, 0.82) 90%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0, 0, 0, 0)', endColorstr='rgba(209, 0, 0, 0)',GradientType=0 );
    /* IE6-9 */ } }

@media (min-width: 77.5em) and (max-width: 87.5em) {
  .donation-promo--two-column .donation-form--cta .the-form {
    width: 100%; } }

@media (min-width: 64em) and (max-width: 77.5em) {
  .donation-promo--two-column .donation-form--cta .form--heading {
    font-size: 26px; } }

@media (min-width: 64em) and (max-width: 77.5em) {
  .donation-promo--two-column .donation-form--cta .OtherInput {
    font-size: 26px; } }

@media (min-width: 64em) and (max-width: 77.5em) {
  .donation-promo--two-column .donation-form--cta label {
    font-size: 26px; } }

@media (min-width: 64em) and (max-width: 77.5em) {
  .donation-promo--two-column .donation-form--cta .donate-button-holder button {
    font-size: 26px; } }
