*{
	scroll-behavior: smooth;
}

body{
	font-family: 'Roboto', sans-serif;
	margin: 0;
}

body .section1{
 background-image: url(../img/donation0.jpg);
 background-position:center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
}


.elements{
	display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
      height: 625px; 
}


.elements .heading{
 /* padding: 15px;*/
}

.elements .heading h1{
	text-align: center;
	color: #dddddd;
	font-size: 50px;
}.elements .details p{
	text-align: center;
	color: #dddddd;
	padding: 5px;
	
}
.button{
	margin-bottom: 50px;
	text-decoration: none;
	color: white;
	background-color: #FF5959;
	padding: 15px;
	border-radius: 5px;
}

.overlay{
  background-color: rgba(0, 0, 0, 0.6);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
}


.section2,.form,.section3,.section5,.section4{
	display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.donate h1{
	font-weight: bold;
	font-size: 45px;
	margin-top: 100px;
		margin-bottom: 0;
}

.donate-details{
	margin-bottom: 25px;
}
.donate-details p, .plan-details p ,.update-details p,.need-details p{
	text-align: center;
	color: #707070;
	
}

.block{
	display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}

.block div{
	padding: 15px;
	background-color: #FAFAFA;
	border-radius: 5px;
	margin: 10px 10px 50px 10px;
	height: 80px;
	width: 80px;
}

#tk{
	border: 2px solid #FF5959;
}

.block div h4{
	
	color: #707070;
	text-align: center;
	font-size: 25px;
}

.form input{
	outline: none;
	width: 500px;
	border-top-style: none;
	border-left-style: none;
	border-right-style: none;
	border-bottom-style: 1px solid #000000;
	/*text-align: center;*/
}



.button1{
	text-decoration: none;
	color: white;
	background-color: #FF5959;
	padding: 15px;
	border-radius: 5px;	
	margin: 20px 10px 10px 10px;
}

.form{
	margin-bottom: 100px;
}



.section3 .plan-heading h1{
	font-weight: bold;
	font-size: 45px;
	margin-bottom: 0;
	margin-top: 0;
}

.section4 .need-heading h1{
	font-weight: bold;
	font-size: 45px;
	margin-bottom: 20px;
	margin-top: 30px;
}

.section5 .update-heading h1{
	font-weight: bold;
	font-size: 45px;
	margin-bottom: 0;
	margin-top: 20px;
}

.plans{
	display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  padding: 80px 80px 80px 80px;
}

.plans div{
	
	padding: 40px;
	margin: 20px 20px 20px 20px;
	border-radius: 5px;
}
#food{
	background: rgb(252,252,252);
background: linear-gradient(90deg, rgba(252,252,252,1) 0%, rgba(210,139,139,1) 0%, rgba(255,198,198,1) 100%);
}
#shelter{
	background: rgb(252,252,252);
background: linear-gradient(90deg, rgba(252,252,252,1) 0%, rgba(210,139,139,1) 0%, rgba(255,51,51,1) 100%);
}
#education{
	background: rgb(252,252,252);
background: linear-gradient(90deg, rgba(252,252,252,1) 0%, rgba(210,139,139,1) 0%, rgba(255,198,198,1) 100%);
}

.section5 .input1{
background: rgb(238,174,202);
background: linear-gradient(90deg, rgba(238,174,202,1) 0%, rgba(148,187,233,1) 100%);
border-radius: 5px;
width: 45%;
padding: 50px;
display: flex;
justify-content: center;
margin: 20px 40px 110px 40px;
}

.input1 input{
	outline: none;
	border-style: none;
	border-bottom-left-radius:5px;
	border-top-left-radius:5px;
	background-color: #dddddd;
}

.section5 .input1 a{
	background-color: #FF5959;
	color: white;
	text-align: center;
	text-decoration: none;
	padding: 10px;
	border-bottom-right-radius:5px;
	border-top-right-radius:5px;
}
.need{
	display: flex;
	justify-content: center;
}

.need img{
	border-radius: 5px;
	height: 250px;
	width: 550px;
}

.need-divider{
	display: flex;
	justify-content: center;
	flex-direction: row;
	padding: 35px;
	margin: 15px 30px 60px 30px;
}


.donate1{
	padding: 80px;
	margin: 40px;
}

.done{
	background-image: url(../img/donation5.jpg) !important ;
  background-position:center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
}


.done-accessories{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}

.done-accessories h1{
	color: white;
	font-weight: bold;
	font-size: 45px;
}

.done-details p{
	color: white;
	font-weight: bold;
	font-size: larger;
}

.boxes,.boxes1{
	  display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: white;
}

.boxes div{
	padding: 30px;
    background-color: #FF5959;
    border-radius: 5px;
    margin: 10px 10px 50px 10px;
    height: 60px;
    width: 80px;
    text-align: center;
}
.boxes1 div{

	padding: 30px;
    border-radius: 5px;
    margin: 10px 10px 50px 10px;
    height: 60px;
    width: 80px;
    text-align: center;
}

.total-raised h2 span{
	font-size: 10px;
	float: left;
}

footer{
	background-color: #0B0D17;
	height: 130px;


}

footer h1{
	text-align: center;
	color: #FF5959;
	margin: 0;
	padding: 15px;
	font-family: 'Lobster', cursive;
}



footer p{
	color: white;
	text-align: center;
	padding: 5px;
}