header{
  //height:90px;
  background:#fff;
  box-shadow:0px 0px 8px 0px rgba(0, 0, 0, 0.20);
  //position: fixed;
  //top:0;
  //left:0;
  //right:0;
  //z-index: 99;
  padding:10px 0;
}

.donation-wrapper{
  padding:0;
  background-color: #f6f6f6;
  .container{
    padding-left:0;
    padding-right:0;
  }
  @media(min-width:768px){
    padding:40px 0;
    .container{
      padding-left:15px;
      padding-right:15px;
    }
  }
}

.donation{
  background-color: #fff;
  border-radius: .25rem;
  box-shadow: 0 16px 24px rgba(0, 0, 0, 0.07);

  &-title{
    padding:15px 3rem 18px 3rem;
    background:$color_primary_dark;
    color:#fff;
    //border-bottom:1px solid #ddd;
  }

  &-body{
    //padding: 15px;
    padding:15px 0;
  }

  &-sub{
    padding:15px;
    border:1px solid #ddd;
    //background-color: #e5e6e6;
    border-radius:0.4rem;
    p{
      font-size:18px;
      font-weight: 500;
      line-height: 1.6;
    }
  }

  &-subtitle{
    padding: 15px;
    background: #cce4d9;
    border-radius: 0.4rem;
  }

  &-right{
    display: none;
  }

  @media (min-width:992px) {

    &-body{
      padding: 2rem 0 3rem;
    }

    &-sub{
      padding:15px;
    }

    &-subtitle{
      padding:30px;
    }

    &-right{
      display: block;
      background-color:#fff;
      border-radius:.25rem;
      box-shadow:0 6px 10px rgba(0, 0, 0, 0.07);

      &-wrapper{
        .table{
          &-row{
            &.amount-row{
              td{
                //text-align: right;
              }
            }
            th{
              padding-left:20px;
              padding-right:10px;
              border-right:1px solid #ddd;
              width:60%;
              font-weight:500;
            }
            td{
              padding-right:20px;
              padding-left:20px;
            }
          }
        }
      }

      &-title{
        padding:10px 20px 15px 20px;
        background:$color_primary_dark;
        color:#fff;
      }
    }
  }


}

.row.small-gutters{
  margin-left:-7.5px;
  margin-right:-7.5px;
}
.row.small-gutters [class*='col-']{
  padding-left:7.5px;
  padding-right:7.5px;
}
.field-label{
  transition:0.4s all ease;
  margin:0;
  position: absolute;
  top:20%;
  left:20px;
  background-color: #fff;
  //color: rgba(131, 131, 131, 0.49);
  cursor:auto;
  font-size:18px;
  &.required-sign{
    padding-right:18px;
  }
}
.field-label.focused{
  top:-12px;
  color:#202020;
  font-size:16px;
  cursor:default;
}
.other-amount .form-control{
  height:70px;
}
.form-control:focus{
  box-shadow:none;
  border:2px solid #202020;
}
.other-amount{
  position: relative;
}
.other-amount .field-label{
  font-size:22px;
  top:23%;
  left:20px;
}
.other-amount .field-label.focused{
  top:-16px;
  font-size:20px;
  color:#202020;
}
.recurring{
  border:1px solid #ced4da;
  border-radius: .25rem;
  padding:20px 15px;
  position: relative;
}
.recurring-title{
  margin: 0;
  position: absolute;
  top: -14px;
  background: #fff;
  /* color: #fff; */
  /* padding: 0px 15px; */
  /* border-radius: 15px; */
  font-size: 18px;
}
.field-normal{
  height:50px;
}
.form-group{
  position: relative;
}
.text-small{
  font-size:14px;
  line-height: 1.4;
  color:#838383;
}

.icon-cvv{
  img{
    height: 30px;
    position: absolute;
    top: 9px;
    right: 10px;
  }
}