/*
 * Copyright (c) 2018 Eclipse Foundation, Inc.
 * 
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License v. 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0.
 * 
 * Contributors:
 *   Christopher Guindon <chris.guindon@eclipse-foundation.org>
 * 
 * SPDX-License-Identifier: EPL-2.0
*/

// eclipse.org/donate styles

.donate-container {
  @media (max-width: 768px) {
    max-width:355px;
    margin:0 auto;
  }
  .form-inline .input-group>.form-control {
    @media (min-width: 768px) {
      width: 120px;
    }
  }
}

.donate-container-content {
  background-image:url('../../../images/eclipse_org/donate/donate_mountain_bg.png');
  background-repeat:no-repeat;
  background-position:bottom center;
  background-size:100%;
  height:155px;
  @media (min-width : 768px) {
    height:255px;
  }
  position:relative;
  margin-bottom:30px;
  h1{
    font-size:24px;
    @media (min-width : 768px) {
      font-size:42px;
    }
  }
}

@media (max-width : 768px) {
  .btn-donate {
    margin-top:20px;
  }
}

.donate-bar {
  position:absolute;
  bottom:0;
}

.list-donate-amount {
  font-size:18px;
  display:flex;
  position:relative;
  @media (min-width: 768px) {
    font-size:24px;
  }
  color:#9d9fa1;
  li{
    padding:0;
    width:20%;
  }
  li.one{
    margin-left:20px;
  }
  li.two{
    margin-left:10px;
  }
  li.four{
    margin-right:20px;
  }
  @media (min-width: 768px) {
    li.two{
      margin-left:50px;
    }
    li.four{
      margin-right:60px;
    }
  }
}

.grey-link {
  font-weight:normal;
  text-decoration:underline;
  color:#9d9fa1;
  &:hover{
    text-decoration:none;
  }
}

.rangeslider {
  position:absolute;
  bottom:-7px;
}

.rangeslider__handle, .rangeslider__handle:after, .rangeslider__handle:active {
  background-image:url('../../../images/eclipse_org/donate/donate_eclipse_logo.png');
  background-repeat:no-repeat;
  width:50px;
  height:47px;
  border:none;
}

.rangeslider__fill {
  background:#ccc;
}

.donate-modal {
  .modal-content {
    background-image:url(../../../images/eclipse_org/donate/donate_modal_bg.jpg);
    background-position:bottom center;
    background-repeat:no-repeat;
    border-radius:0;
    h4 {
      font-size:1.2em;
    }
  }
  .modal-footer {
    border-top:none;
  }
  .modal-header {
    border-bottom:none;
    padding-bottom:0;
  }
  .recognition-text {
    color:#999;
    font-size:0.9em;
  }
  .donate-modal-footer {
    text-align:center;
    padding-top:0;
  }
}
