body {
	background: linear-gradient(-45deg, #5bed44, #d8ee75, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.header{
  text-align: center;
  margin-right: 45px;
}

.header-title {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif

}


.all-content{
  height: 100%;
  width: 90%;
  align-items: center;
  display: flexbox;
  flex-direction: column;
  margin-left: 4%;
}

.text-boxes .text-box{
  height: 100px;
  width: 100%;
  max-width: 200%;
}

.text-boxes .text-box textarea{
  height: 100%;
  width: 100%;
  font-size: 15px;
  font-weight: 400;
  outline: none;
  border: 1px solid #265df2;
  border-radius: 8px;
  background: #e7edfe;
}

.text-box textarea::-webkit-scrollbar{
  display: none;
}

button{
  height: 45px;
  width: 155px;
  color: #fff;
  background:  #3e6ff4;
  outline: none;
  border: none;
  border-radius: 8px;
  font-size: 17px;
  font-weight: 400;
  margin: 5px 0;
  cursor: pointer;
  transition: all 0.5s ease;
}

button:hover{
  background: #f11976;
}

.placeholder {
  display: flex;
  flex-direction: column;
}

.placeholder-box {
  height: 30px;
  width: 100%;
  font-size: 15px;
  font-weight: 400;
  outline: none;
  border: 1px solid #265df2;
  border-radius: 4px;
  background: #e7edfe;
}

.icon-box{
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  margin-top: 150px;
}

.icon-box .box {
margin-right: 10px;
width: 60px;
height: 60px;
border-radius: 30px;
display: flex;
justify-content: center;
align-items: center;
transition: transform 1s;
cursor: pointer;
background: linear-gradient(to bottom, var(--accent-color), var(--gradient-color));

}

.icon-box .box i{
  font-size: 20px;
  color: #fff;
}

.icon-box .box:hover{
  transform: rotate(360deg)
}

.icon-box i:hover{
  transition:  transform 1s, filter 2s ease-in-out;
  transform: scale(1.4)
}


.icon-box .box:nth-child(1){
--accent-color: #1609f0;
--gradient-color: #316ef4;
}
.icon-box .box:nth-child(2){
--accent-color: #00acee;
--gradient-color: #1fd1f9;
}
.icon-box .box:nth-child(3){
--accent-color: #ea4c89;
--gradient-color: #fb2175;
}
.icon-box .box:nth-child(4){
--accent-color: #0e76a8;
--gradient-color: #00acee;
}
.icon-box .box:nth-child(5){
--accent-color: #ea4c89;
--gradient-color: #ee4056;
}
.icon-box .box:nth-child(6){
--accent-color: #03c8a8;
--gradient-color: #89d8d3;
}

.footer{
  text-align: center;
  margin-top: 40px;
  margin-right: 50px;
}