@import "mixin";

main{
  padding-top:0px!important;
}

/* ************ */
/* Index Page */
/* ************ */

.container-donate{
  .jumbotron{
    background-image:url(../images/donate-header-bg.jpg);
    background-size:cover;
    padding:150px 0 50px;
    margin-bottom:0;
    .container{
      min-height: 200px;
    }
    h1, p{
      color:#fff;
    }
    h1{
      font-size:39px;
    }
    p{
      font-size:21px;
      a{
        color:#F7941E;
        &:hover{
         
        }
      }
    }
  }
  .content-container{
  position:relative;
  top:-50px;
  background-color:#f9f8f8;
  padding:40px;
  
  &:before, &:after{
    position:absolute;
    top:0;
    content:" ";
    display: table;
    width: 14px;
    display: block;
    height: 292px;
  }
  &:before{
    background-image:url(../images/shadow-left.png);  
    left:-14px;
  }
  &:after{
    background-image:url(../images/shadow-right.png);
    right:-14px;
  }
  
  h2{
    margin-top:0;
  }
  
  > p{
    margin-bottom:40px;
  }
  
  .slider-row{
    margin-bottom:20px;
    .fa{
      color:#afbbdc;
      position:relative;
      top:1px;
    }
    .amount{
      font-size:35px;
      color:#6f6f71;
      font-weight:bold;
      sup{
        font-size:22px;
      }
    }
  }
}

.sidebar{
  .amount-box{
    border-top:1px solid #cbcbcb;
    border-bottom:1px solid #cbcbcb;
    margin:40px 0 20px;
  }
  form.donate-form{
    input:not([type="radio"]), textarea, select{
      width:100%;
      margin-bottom:10px;
    }
    input[type="radio"]{
      margin-bottom:10px;
    }
  }
  .panel{
    padding:20px;
    text-align:center;
    background-color:#eef1f8;
    margin-top:20px;
    h2{
      color:#F7941E;
      font-weight:bold;
    }
    ul{
    padding-left:0;
      li{
        list-style:none;
        list-style-image:url(../images/orange-arrow.png);
      }
    }
  }
}
}


/* ************ */
/* Credit Page */
/* ************ */

.container-credit{
  .jumbotron{
    background-image:url(../images/donate-header-bg.jpg);
    background-size:cover;
    padding:150px 0 50px;
    margin-bottom:0;
    .container{
      min-height: 200px;
    }
    h1, p{
      color:#fff;
    }
    h1{
      font-size:39px;
    }
    p{
      font-size:21px;
      a{
        color:#F7941E;
        &:hover{
         
        }
      }
    }
   }
   
   .accomplished, .thankyou, .friends{
    margin-bottom:40px;
	   header{
	     background-color:#2c2255;
	     
	     margin-bottom:40px;
	     h2{
	       color:#fff;
	       padding:40px 0;
	       margin:0;
	       &:before{
	         @include down-arrow;
	       }
	      
	     }
	   }
	   img{
	    margin:0 20px 20px 0;
	   }
   }
   .accomplished{
    p{
      font-size:21px;
      position:relative;
      top:6px;
      color:#2C2255;
    }
   }
   .thankyou, .friends{
	    header{
	      h2{
	        sup{
	          font-size:20px;
	        }
	      }
	    }
	    p{
	     margin:10px 0px 0px;
	    }
   }
   .friends{
    .col-sm-12{
      border-right:1px solid #dedede;
      &:last-child{
        border:none;
      }
    }
    .more{
      border-bottom:1px solid #dedede;
      padding:10px 0;
      position:relative;
      a {
        &:hover{
          text-decoration:none;
        }
      }
      i.fa{
        background-color:#fff;
        padding:5px;
        display:block;
        position:absolute;
        bottom:-10px;
        left:50%;
        margin-left:-12px;
      }
    }
   }
}


/* ************ */
/* Utility classes */
/* ************ */

.alignCenter{
  text-align:center;
}

.floatLeft{
	float:left;
}

.marginRight{
	margin-right:20px;
}