.find-hero .left-hero h3, .find-hero .left-hero p{
  color: white;
}

.quote-form{
  background-color: white;
  border-radius: 2px;
  padding: 30px;
}
.quote-form .title{
  color: #ff8a00;
  font-size: 23px;
  font-weight: 600;
}
.quote-form label{
  font-size: 16px;
}
.quote-form .form-group{
  padding-bottom: 10px;
}
.quote-form textarea{
  height: 90px;
}

.upload-file{
  border: 1px dashed gray;
  border-radius: 3px;
  padding: 20px;
}
.upload-file input{
  width: 70%;
}
.upload-file button{
 outline: none;
 border: 1px solid gray;
 margin: 10px 0px;
 border-radius: 3px;
 background-color: white;
 color: black;
 font-size: 14px;
 font-weight: 600;
}

.upload-file span{
  font-size: 12px;
  width: 70%;
  margin-left: 20px;
}
.form-group button{
  background-color: #ff8a00;
  color: white;
  border: none;
  outline: none;
  padding: 5px 20px;
  border-radius: 2px;
  margin-right: 15px;
}

.row-upload{
  background-color: #ff880068;
  margin-bottom: 10px;
  list-style: none;
  padding: 15px 20px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.row-upload i{
  font-size: 30px;
  color: #ff8a00;
}
.details span{
  font-size: 14px;
}
.row-upload .content{
width: 100%;
margin-left: 15px;
}
.progress-area .details{
  display: flex;
  align-items: center;
  margin-bottom: 7px;
  justify-content: space-between;
}
.progress-area .progress-bar{
  height: 6px;
  width: 100%;
  background-color: white;
  border-radius: 30px;
}
.progress-bar .progress{
  height: 100%;
  width: 0%;
  background-color: #ff8a00;
  border-radius: inherit;
}
.uploaded-area .row-upload .content{
  display: flex;
  align-items: center;
}
.uploaded-area{
  max-height: 150px;
  overflow-y: scroll;
}
.uploaded-area::-webkit-scrollbar{
  width: 0px;
}
.uploaded-area .row-upload .details{
  display: flex;
  flex-direction: column;
  margin-left: 15px;
}
.uploaded-area .details .size{
  font-size: 11px;
  color: #404040;
}
.uploaded-area .fa-check{
  font-size: 16px;
}

/* showcase */
.showcase-box{
  margin: 10px 0px;
}
.showcase-box .thumbnail{
  /* height: 300px; */
  width: 100%;
  position: relative;
}
.showcase-box{
  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}
.showcase-box .footer{
  /* margin-top: -60px; */
  width: 100%;
  position: absolute;
  bottom: 0px;
  left: 0px;
  display: flex;
  flex-direction: column;
  padding: 0px 10px 0px 10px;
  background-color: white;
  /* height: 0px; */
  /* opacity: 0; */
  /* visibility: hidden; */
  /* transition: all 0.3s ease-in-out; */
  height: 0px;
  transition: .5s ease all;
  
}

.showcase-box .title{
  font-size: 14px;
  font-weight: 700;
  color: black;
}
.showcase-box .price{
  font-size: 14px;
  font-weight: 400;
}
/* animation for .footer of shwocase box */
.thumbnail {
  position: absolute;
  overflow: hidden;
  max-width: 100%;
  z-index: 1;
}
.thumbnail::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #e5e5e5;
  opacity: 0;
  transition: .5s ease all;
}
.thumbnail img {transition: .5s ease all; width: 100%; object-fit:cover;}
.thumbnail:hover img {
  transform: scale(1.1);
}

.thumbnail:hover::after {opacity: 0.2;}
.thumbnail:hover::after {opacity: 0.2;}
.thumbnail:hover .footer
{
  height: 55px;
  transition: .5s ease all;
}

/* frelanccer-done */
.frelanccer-done{
  padding: 0px 11px;
}
.frelanccer-done .title{
  font-size: 24px;
  color: black;
  font-weight: 700;
}