// ---------------------- //
// STYLE VARIABLES
// ---------------------- //

// ORGANIC SHAPES //
$hasOrganicShape: true; // apply randomized shape overlays to images

// ---------------------- //
// ELEMENTS
// ---------------------- //

// ---------------------- //
// ✨ YOUR CUSTOM STYLES
// ---------------------- //

// 📖  Check out our documentation for more information on how you can style you campaign: https://developers.raisely.com/docs/styling-introduction

// Add your own custom css below to get things looking just how you want

.css-17ch47p 
{
    background-color: #fff;
}
.col__container, .image-tile, .image-tile:before, .profile-tile__content, .profile-tile .progress-bar__progress, .profile-tile .progress-bar__bar:before, .image-wrapper img {
    border-radius: 0px !important;
}
.block--box, 
.raisely-blockwrapper--box, 
.block--separator:before, 
.raisely-blockwrapper--separator:before, 
.donation-form, 
.donation-form__amount-btn, 
.signup-form 
{
    border-radius: 0px !important;
}
.form-field, .note-editor-container .note-editor .form-group, .note-editor-container .note-editor .checkbox 
{
      border: 0px solid lightgrey !important;
}
.donation-form--v3 .donation-form__method-payment-button-wrapper iframe, 
.donation-form--v3 .donation-form__nav:not(.override), 
.donation-form--v3 .donation-form__stripe-buttons:not(.override) 
{
    border-radius: 30px !important;
    border: 0px solid black !important;
    color: white !important;
    border-width: 0px;
}
.donation-form .donation-form__giving-label, 
.donation-form--v3 .donation-form__giving-label {
  background-color: #00000000 !important;
  color: #e4761e !important;
  font-size: 2.5em;
  border: 0px solid lightgrey !important;
  border-radius: 0px !important;
  line-height: 1.5em;
}
.form-field__error,
.form-field__required
{
  color: #e4761e;
}
.donation-form--v3 .donation-form__nav:not(.override) .donation-form__method-button, 
.donation-form--v3 .donation-form__nav:not(.override) .donation-form__next, 
.donation-form--v3 .donation-form__stripe-buttons:not(.override) .donation-form__submit-button {
    background-color: #e4761e !important;
    color: #fff !important;
    border-color: #e4761e !important;
    border-width: 0px;
}
.donation-form--v3 .donation-form__title
{
  color: #000;
}


.form__method-button:hover, .donation-form--v3 .donation-form__nav:not(.override) .donation-form__method-button:focus, .donation-form--v3 .donation-form__nav:not(.override) .donation-form__next:hover, .donation-form--v3 .donation-form__nav:not(.override) .donation-form__next:focus, .donation-form--v3 .donation-form__stripe-buttons:not(.override) .donation-form__submit-button:hover, .donation-form--v3 .donation-form__stripe-buttons:not(.override) .donation-form__submit-button:focus,
.donation-form--v3 .donation-form__nav:not(.override) .donation-form__method-button:hover, .donation-form--v3 .donation-form__nav:not(.override) .donation-form__method-button:focus, .donation-form--v3 .donation-form__nav:not(.override) .donation-form__next:hover, .donation-form--v3 .donation-form__nav:not(.override) .donation-form__next:focus, .donation-form--v3 .donation-form__stripe-buttons:not(.override) .donation-form__submit-button:hover, .donation-form--v3 .donation-form__stripe-buttons:not(.override) .donation-form__submit-button:focus
{
    background-color: #241E4E;
    border-color:unset;
    color: #fff;
  
}
.donation-form__amount-btn, .donation-form--v3 .donation-form__other-field.form-field input.input-full, .donation-form--v3 .note-editor-container .note-editor .donation-form__other-field.form-group input.input-full, .note-editor-container .note-editor .donation-form--v3 .donation-form__other-field.form-group input.input-full, .donation-form--v3 .note-editor-container .note-editor .donation-form__other-field.checkbox input.input-full, .note-editor-container .note-editor .donation-form--v3 .donation-form__other-field.checkbox input.input-full, .donation-form--v3 .donation-form__other-field.form-field input::placeholder, .donation-form--v3 .note-editor-container .note-editor .donation-form__other-field.form-group input::placeholder, .note-editor-container .note-editor .donation-form--v3 .donation-form__other-field.form-group input::placeholder, .donation-form--v3 .note-editor-container .note-editor .donation-form__other-field.checkbox input::placeholder, .note-editor-container .note-editor .donation-form--v3 .donation-form__other-field.checkbox input::placeholder, .form-field input
{
  
  color: #000  !important;
}
.donation-form--v3, .form-field__label-text, .note-editor-container .note-editor .form-group input, .note-editor-container .note-editor .checkbox input
{
  color: #646464  !important;
}
 .form-field, .note-editor-container .note-editor .form-group, .note-editor-container .note-editor .checkbox
{
  color: #222  !important;
}
.donation-form__spe-box 
{
    background: #ffffff00 !important;
}
.progress-bar__progress, .progress-bar__bar
{
  border-radius: 0px !important;
}
.donation-form--v3 .donation-form__nav:not(.override) .donation-form__next:hover
{
  color: #fff  !important;
}
.donation-form--v3 .donation-form__body--success .donation-form__share 
{
	border-radius: 0px;
  background: rgba(233, 141, 68, 0.25);
}
.share-button 
{
  border-radius: 0px !important;
}
.donation-form--v3.donation-form,
.donation-form--v3 .donation-form__body
{
  background-color: #f8f8f8;
  border-color: #f8f8f8;
  border-radius: 0px !important;
}
.donation-form--v3 .donation-form__amount
{
  gap: 20px;
}

.donation-form--v3 .donation-form__step-select__step
{
   top: 4px;
}
.donation-form__amount-btn
{
  border: unset !important;
  background-color: #fff !important;
}

.donation-form__amount--width-full .donation-form__amount-btn
{
 	display: flex;
  align-items: center;
}
@media (max-width: 370px)
{
  .donation-form__amount--width-full .donation-form__amount-btn
  {
    display: block;
    
  }
}

.donation-form__amount--width-full .donation-form__amount-btn,
.form-field--currency
{
  padding: 15px;
  background-color: #ffff !important;
  border-radius: 0px !important;
  border: unset !important;
}
input:-internal-autofill-selected 
{
  background-color: #fff !important;
}

.donation-form__amount-title
{
      text-align: left;
	font-weight: normal;
}

.donation-form--v3 .donation-form__amount-type-btn--active ~ .frequency-label, 
.donation-form--v3 .donation-form__payment-buttons-btn--active ~ .frequency-label
{
	color: #E4761E !important;
}

.donation-form--v3 .donation-form__amount-type-btn--inactive .frequency-label, 
.donation-form--v3 .donation-form__payment-buttons-btn--inactive .frequency-label
{
	color: #fff !important;
}

.donation-form__amount-btn:hover,
.donation-form__amount-btn--selected.button--donation
{
    background-color: #241E4E !important;
    border-color:unset !important;
    color: #fff !important;
}  

.donation-form__amount--width-full .donation-form__amount-btn:hover,
.form-field--currency:hover,
.form-field--currency:has( input:active),
.form-field--currency:has( input:focus),
.form-field--currency:has(input:not(:placeholder-shown))
{
  background-color: #241E4E !important;
  border-color: unset !important;
  color: #fff !important;
}
 .donation-form--v3 .donation-form__other-field.form-field input.input-full
{
   color: #fff !important;
}
.donation-form__amount-btn--selected.button--donation 
{
  box-shadow: unset !important;
}

.donation-form--v3 .form-field--text:hover .form-field__input-group__prepend,
.donation-form--v3 .form-field--text:hover input.input-full,
.donation-form--v3 .form-field--text:hover input.input-full::placeholder,
.donation-form--v3 .form-field--currency:has( input:focus) input.input-full,
.donation-form--v3 .form-field--currency:has( input:focus) input.input-full::placeholder,
.donation-form--v3 .form-field--currency:has( input:focus) .form-field__input-group__prepend
{
  color: #fff !important;
}
.donation-form__amount--width-full .donation-form__amount-btn:hover .donation-form__amount-value,
.form-field__input-group:has(input:not(:placeholder-shown)) .form-field__input-group__prepend,
.donation-form--v3 .form-field__input-group__prepend
{
  color: #fff;
  opacity: 1;
}
.donation-form__amount-value,
.form-field__input-group .form-field__input-group__prepend,
.donation-form__giving-label
{
  
}
.donation-form__amount-value
{
  font-size: 2em;
  min-width: 140px;
  text-align: left;
}
.form-field__input-group:has(input:not(:placeholder-shown))
{
  color: #fff;
}
.form-field:has( #feeOptIn)
{
  border-width: 0px !important;
}
.form-field--currency .form-field__input-group__prepend 
{
    color: #000;
}
.donation-form__payment-logos__variable__wrapper
{
  display: none;
}
.donation-form--v3 .donation-form__step-select__step__divider
{
	margin-top: 8px;
}
/* @import must be at top of file, otherwise CSS will not work
//@import url("//hello.mystatic/fonts.net/count/3bca71");

@font-face {
  font-family: 'HelveticaNeueLTPro-Bd';
  src: url("https://raisely-images.imgix.net/clean-safe-water/uploads/font-woff-2-730982.woff2") format('woff2');
}
@font-face {
  font-family: 'HelveticaNeueLTPro-Md';
  src: url('https://raisely-images.imgix.net/clean-safe-water/uploads/helvetica-neue-lt-pro-md-woff-2-7ee1f5.woff2') format('woff2');
}
@font-face {
  font-family: 'HelveticaNeueLTPro-LtIt';
  src: url('https://raisely-images.imgix.net/clean-safe-water/uploads/helvetica-neue-lt-pro-lt-it-woff-2-7a65fb.woff2') format('woff2');
}
@font-face {
  font-family: 'SketchetikFillBold';
  src: url('https://raisely-images.imgix.net/clean-safe-water/uploads/sketchetik-fill-bold-woff-2-bd3df0.woff2') format("woff2");
}
@font-face {
  font-family: 'HelveticaNeueLTPro-Lt';
  src: url('https://raisely-images.imgix.net/clean-safe-water/uploads/helvetica-neue-lt-pro-lt-woff-2-e3589d.woff2') format('woff2');
}
 */
body {
	background-color: #fff;
	color: #000;
	font-size: 16px;
	line-height: 22px;
	margin: 0;
	overflow-x: hidden;
}

h1,
h2
{
    margin: 0 0 30px;
    letter-spacing: -0.4px;
}
h3,
h4,
h5,
h6 {
	margin: 0 0 20px;
    letter-spacing: 0px;
}
h1
{
   font-family: "Anton";
}
h2,
h3,
h4,
h5,
h6
{
  font-family: "Roboto";
}
h2,
h3,
h4,
h5
{
  font-weight: bold;
}
h1,
h6
{
  font-weight: normal;
}
.donation-form__amount-btn,
.form-field input,
.form-field__input-group__prepend,
.progress-bar__total,
.progress-bar__goal
{
  font-family: "Roboto";
  font-weight: bold;
}
h1 
{
	font-size: 54px;
  line-height: 64px;
}
h2 
{
	font-size: 40px;
  line-height: 46px;
}
h3 
{
	font-size: 30px;
  line-height: 36px;
}
h4 
{
	font-size: 24px;
  line-height: 30px;
}
h5,
h6
{
	font-size: 18px;
  line-height: 24px;
}
p {

	font-size: 16px;
	line-height: 22px;
}

h2.block--text-heading
{
  text-align: center;
}
