.mobile-donate
{
    background-color: #E4761E;
    padding: 30px 0px;
}

.mobile-donate legend
{
    font-size: 26px;
    line-height: 32px;
    font-family: "SketchetikFillBold", "HelveticaNeueLTPro-Bd", "Muli", sans-serif;
    color: #fff;
    text-align: center;
    display: block;
    width: 100%;
    margin-bottom: 30px;
}

.mobile-donate fieldset
{
    padding: 0px;
    margin: 0px;
}
input.gift-selector[type=radio]
{
    display: none;
}
.mobile-donate label.tertiary.button
{
    text-shadow: none;
}
input.gift-selector[type=radio]:checked + label.tertiary.button
{
    background-color: #fff;
    color: #E4761E;
}
label.tertiary.button
{
    width: 49%;
}
#monthly + label.tertiary.button
{
    float: right;
}
.donate-amount,
.donate-amount:focus
{
    padding: 6px;
    font-family: "HelveticaNeueLTPro-Bd", "Muli", sans-serif;
    font-size: 18px;
    text-align: left;
    margin: 20px 0;
    color: #fff;
    background-color: #E4761E;
    border: none;
    border-bottom: 2.5px solid #fff;
}

input.donate-amount,
label.donation-label span,
label.donation-label{
  display: block;
  padding: 5px;
  padding-left: 15px;
    font-family: "HelveticaNeueLTPro-Bd", "Muli", sans-serif;
  font-size: 18px;
}
input.donate-amount
{
    transition: padding-top 0.2s ease, margin-top 0.2s ease;
    overflow-x: hidden; /* Hack to make "rows" attribute apply in Firefox. */
}
input.donate-amount::placeholder
{
    color: rgb(256, 256, 256, 0.0)
}
input.donate-amount:focus::placeholder
{
    color: #fff;
    transition: color 0.2 ease;
}
label.donation-label
{
    display: block;
    position: relative;
    white-space: nowrap;
    padding: 0;
    margin: 0;
    width: 100%;
    -webkit-transition: width 0.4s ease;
    transition: width 0.4s ease;
    height: 0px;
}

input.donate-amount:focus,
input.donate-amount:valid
{
    padding-top: 25px;
  padding-left: 15px;
}
input.donate-amount:focus + label > span,
input.donate-amount:valid + label > span {
  top: -80px;
  font-size: 14px;
  color: rgb(256, 256, 256, 1.0)!important;
}

input.donate-amount + label > span{
  font-weight: 300;
  margin: 0;
  position: absolute;
  color: rgb(256, 256, 256, 0.6)!important;
  font-size: 18px;
  top: -54px;
  left: 0px;
  z-index: 10;
  -webkit-transition: top 0.2s ease, font-size 0.2s ease, color 0.2s ease;
  transition: top 0.2s ease, font-size 0.2s ease, color 0.2s ease;
}
label.donation-label::before
{
    content: '$';
    display: block;
    color: #fff;
    position: relative;
    top: -48px;
}