/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
 .form_launcher_maincontainer {
 	position: relative;
 	text-align: center;
 	color: white;
    background-image: url(https://www.w3schools.com/howto/img_parallax.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
    height: 700px;

 }


 .form_launcher_centered {
 	position: absolute;
 	top: 50%;
 	left: 50%;
 	transform: translate(-50%, -50%);
 	background: white;
 	padding: 30px 60px;
    width: 30%;

 }


.form_launcher_heading {
    text-transform: uppercase;
    padding-bottom: 0px;
}

.form_launcher_des {
	color: black;
	font-size: 14px;
    padding-bottom: 15px !important;

}

.funButton, .funButton2{
    background-color: #000;
    color: #fff;
    border: none;
    cursor: pointer;
    font-size: 16px;
    outline: none;
    padding: 8px 28px;
    margin-bottom: 10px;
}    


/* Amount Input*/
#form_launcher_donation_amount {
    width: 100%;
    margin-bottom: 10px;
    padding: 5px 5px 5px 23px;
    font-size: 22px;
}

form#wages-form {
	margin: 25px 0px;
	text-align: center;
}
form #dollarsign {
	color: black;
	margin-right: 10px;
	vertical-align: middle;
	margin: 0;
	font-size: 20px;
}

#wage {
	color:  #bcbcbc;
	font-size: 25px;
	font-weight: 400;
	text-align: left;
	height: 40px;
  border: none;
  border-bottom: 2px solid #d1d1d1;
  padding-left: 0px;
	max-width: 110px;
	background: transparent;
	margin: 0 15px;
	max-width: 150px;
	vertical-align: middle;
	padding-top: 10px;
	display: inline-block;
}
#wage-per {
	color: #ffffff;
	font-size: 18px;	font-weight: 500;
	text-align: center;;
	 background-color:  #28aded !important;
	height: 40px;
	border-radius: 2px;
	text-transform: uppercase;
	vertical-align: middle;
	display: inline-block;
}
form #equal {
	color:  #d1d1d1;
	font-size: 60px;
	vertical-align: middle;
	margin: 0 20px;
}
#wages-form #wage-per-day {
	font-size: 35px;
	vertical-align: middle;
}
#wages-form #per-day {
	font-size: 14px;
	vertical-align: bottom;
}
form h4 { font-size: 14px; }
#total { display: inline-block;}
#clean-water,
#malaria,
#tuition {
	width: 29%;
	display: inline-block;
	text-align: center;
	margin-bottom: 15px;
}
#clean-water {
  width: 37%;
}
#provides {
	margin: 50px 0 30px 0;
}
#provides #clean-water span,
#provides #malaria span,
#provides #tuition span {
	text-align: center;
	color: #323232;
	font-size: 35px; 
	font-weight: bold;
	text-align: center;
} 
#clean-water p,
#malaria p,
#tuition p {
	font-size: 20px;
	text-transform: uppercase;
	font-weight: bold;

}
div.or {
	display:inline-block;
	margin-bottom: 25px;
	color: #999;
}

#finatamount_text{
    text-align: center;
     display: none;
}

.bottombtn {
	    list-style: none;
    position: absolute;
    bottom: -40px;
    z-index: 9999999999;
    display: list-item;
    width: 84%;
    text-align: center;
    display: none;
}
.bottombtn a:first-child {
    margin-left: 170px;
}


.bottombtn .btn {
    padding: 5px 10px;
}

/* Media Query */

@media(max-width: 1530px) {
	#clean-water,
	#malaria,
	#tuition {
		width: 29%;
		display: inline-block;
		text-align: center;
		margin-bottom: 15px;
	}
}
@media(max-width: 1508px) {
	#clean-water,
	#malaria,
	#tuition {
		width: 25%;
	}
}
@media(max-width: 1450px) {
	#wage {
		font-size: 20px;
		max-width: 110px;
	}
	form #equal {
		font-size: 40px;
		margin: 0 10px;
	}
	#total {
		margin-top: 25px;
	}
}
@media(max-width: 1400px) {
	#donateFormLeft h2 {
		font-size: 32px;
	}
	#donateFormLeft h4 {
		font-size: 18px;
	}
}
@media(max-width: 1385px) {
				#clean-water p,
				#malaria p,
				#tuition p {
					font-size: 14px;
				}
}
@media(max-width: 1256px) {
	#clean-water p,
	#malaria p,
	#tuition p {
		font-size: 12px;
	}
}
@media(max-width: 900px) {
	#clean-water,
  #malaria,
  #tuition { 
		width: 100%;
		display: block;
	}
  #clean-water p,
  #malaria p,
  #tuition p { 
		font-size: 100%;
	}
}
@media(max-width: 866px) {
	#dollarSignWages	{
		display: block;
		margin: 0 auto 15px;
	}
	#wage-per {
		margin: 0 auto;
		display: block;
	}
}

@media only screen and (max-width: 768px) {
    .form_launcher_centered {
  
      width: 80%;

    }
}


hr#formSplit {
	height: 3px;
	border-top: 3px solid #28ADED;
	width: 60%;
	margin: 25px auto;
}
#giving-amount {
	color: #EE9E38;
}
#giving-amount-field {
    color: #000;
    font-size: 20px;
    font-weight: 400;
    text-align: left;
    height: 40px;
    border: none;
    border-bottom: 3px solid #EE9E38;
    padding-left: 0px;
    max-width: 110px;
    background: transparent;
    margin: 0 15px;
    max-width: 125px;
    vertical-align: middle;
		display: block;
}

#givenow_btn_v2{
	background-color: #f04323;
    border-color: #f04323;
}