/**
 * Donation
 */
@import url(http://fonts.googleapis.com/css?family=Montserrat)

.icon-satisfied
  position: absolute
  margin: -3px 0px 0px 4px

#donate-button
  background: #32373c
  position: absolute
  right: 0
  margin-right: 7px
  margin-top: -1px

#symbol
  height: 27px
  margin-top: -4px
  margin-left: 2px

.svg-paypal-border, .svg-paypal-letter1to3
  fill: #1B557D

.svg-paypal-letter4to6
  fill: #107DB0

#paypal-button
  width: 180px
  height: 55px
  background: rgba(158, 158, 158, 0.2) !important
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12)

.svg-paypal
  margin-top: -42px
  margin-left: 8px
  width: 140px

/**
 * Dogecoin Donate Button
 * author Felix Yadomi
 * link   http://codepen.io/yadomi/pen/EGiKD
 */
.btn-dogecoin
  font-size: 14px
  white-space: nowrap
  position: relative
  overflow: hidden
  margin-top: 30px !important
  margin-bottom: 3px !important
  cursor: pointer
  font-family: 'Montserrat'
  width: 160px
  height: 45px
  padding: 5px 10px
  background: #f4b840 !important
  border-radius: 2px
  color: #333
  text-transform: uppercase
  -webkit-transition: width .35s ease
  transition: width .35s ease
  margin: 80px auto
  span
    display: block
  .currency
    font-size: 1.1em
    &:before
      content: 'Donate with'
      font-size: .65em
      display: block
  .symbol
    -webkit-transition: all .2s ease
    transition: all .2s ease
    font-size: 2.3em
    border: 2px solid #333
    border-radius: 360px
    padding: 4px
    width: 33px
    height: 33px
    text-align: center
    line-height: 1em
    margin-right: 5px
  p
    -webkit-transition: all .2s ease
    transition: all .2s ease
    padding: 0
    margin: 0
  .symbol, p
    display: inline-block
    white-space: nowrap
  &:hover
    p
      -webkit-transform: translateX(120px)
      transform: translateX(120px)
    .symbol
      -webkit-transform: translateX(40px)
      transform: translateX(40px)
  &.opened
    width: 390px
    &:hover
      p
        -webkit-transform: inherit
        transform: inherit
        cursor: text
      .symbol
        -webkit-transform: inherit
        transform: inherit
    .currency
      text-transform: initial
      &:before
        content: 'Thank you !'
        text-transform: uppercase

@media (max-width: 782px)
  .btn-dogecoin
    &.opened
      width: 89% !important
    .currency:before
      display: none !important
    &:hover .symbol
      -webkit-transform: translateX(35px) !important
      transform: translateX(35px) !important