.btn-hover {
  width: 100%;
  height: 356px;
  display: flex;
  position: relative;
  border-radius: 0px 0px 20px 20px;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.upload-btn {
  visibility: hidden;
  transition: 0.1s;
  display: flex;
  align-items: center;
  margin-top: 130px;
  justify-content: center;
}

.btn-hover:hover .upload-btn {
  visibility: visible;
  transition: 0.3s;
}

.hoverfile-attach {
  border-radius: 6px;
  margin-right: 25px;
  cursor: pointer;
}

.hoverfile-upload label {
  position: relative;
  overflow: hidden;
  font-size: 16px;
  height: 56px;
  width: 186px;
  display: flex;
  align-items: center;
  background-color: #eaeaea;
  border-radius: 6px;
  justify-content: center;
  cursor: pointer;
}

.hoverfile-upload input {
  position: absolute;
  opacity: 0;
}

.upload-btn button.btn {
  padding: 9px 13px;
  border-color: aliceblue;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  height: 54px;
  width: 186px;
  border-radius: 6px;
}
/* .btn-hover .upload-files {
  visibility: hidden;
  width: 300px;
  height: 50px;
}
.btn-hover:hover .upload-files {
  visibility: visible;
  transition: 0.4s ease;
} */
.overlay-mouse {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  transition: 0.4s ease;
}
.btn-hover:hover .overlay-mouse {
  display: block;
  background: rgba(0, 0, 0, 0.4);
}
/* drag-button */
.drag-button {
  width: 264px;
  height: 56px;
  box-shadow: 0 15px 18px 0 rgba(57, 50, 77, 0.2);
  backdrop-filter: blur(74px);
  border-radius: 6px;
  -webkit-backdrop-filter: blur(74px);
  border: solid 1px #a49bbe;
  background-image: linear-gradient(
    103deg,
    #2b2639 -40%,
    rgba(43, 38, 57, 0) 129%
  );
}
/* profile */
.user-profiles {
  position: relative;
  margin: 25px 0 0;
}
.user-profiles i {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
  transition: 0.1s;
  color: #fff;
}

.overlays {
  visibility: hidden;
  position: absolute;
  background: rgba(0, 0, 0, 0.3);
  transition: opacity 500ms;
  width: 100%;
  height: 100%;
  top: 0;
  border-radius: 50%;
}
.user-profiles:hover i,
.user-profiles:hover .overlays {
  visibility: visible;
  opacity: 1;
}
.circular {
  position: absolute;
  width: 105px;
  height: 110px;
  top: 0px;
  bottom: 0px;
  transform: translate(-2px, -2px);
}

.onHoverActionOnModal{
  width: 350px;
  height: 250px !important;
  border-radius: 20 !important;
  margin-right: 16;
  margin-bottom: 16;
  position: relative;
}

.portfolioBox {
  background-color: rgba(0,0,0,0.263) !important;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1 !important;
  position: absolute;
  top: 0;
  visibility: hidden;
}

.onHoverActionOnModal:hover .portfolioBox {
  visibility: visible !important;
}
.threeDot{
}

.threeDot:hover .portfolioBox {
  visibility: visible !important;
}