.social .social-link a i {
  width: 30px;
  text-align: center;
}

 .social .social-link a span {
  margin-right: 10px;
  overflow: hidden;
  max-width: 0;
  white-space: nowrap;
  transition: max-width 0.3s ease, color 0.3s ease;

 }
 .social .social-link:hover a {
  width: 150px;
 }
 .social .social-link:hover a span {
  max-width: 120px;
  color:#f1e6e2;
 }
 .contact1 {
  background-color: #fc4c11 !important;
  min-height: 100vh;
}
.contact1 .form-control {
  background-color:#faf8f7;
}
.social {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9999;
  
 }

.social ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
 .social .social-link {
  position: absolute;
  right: 0;
  transition: all .3s ease;
 }
.social .social-link:nth-child(1) { top: 0; }
.social .social-link:nth-child(2) { top: 60px; }
.social .social-link:nth-child(3) { top: 120px; }

 .social .social-link a{
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  padding: 10px;
  background:rgb(255, 102, 102);
  color:#e9dede;
  border-radius: 10px 0 0 10px;
  width: 45px;
  overflow: hidden;
  text-decoration: none;
  font-size: 15px;
  transition: width 0.3s ease;
  
 }
 @media (max-width: 431px) {
  .social .social-link a{
    background: rgba(183, 161, 101, 0.6);
  }
 }
.social .social-link a i {
  width: 30px;
  text-align: center;
}

 .social .social-link a span {
  margin-right: 10px;
  overflow: hidden;
  max-width: 0;
  white-space: nowrap;
  transition: max-width 0.3s ease, color 0.3s ease;

 }
 .social .social-link:hover a {
  width: 150px;
 }
 .social .social-link:hover a span {
  max-width: 120px;
  color:#f1e6e2;
 }
 .contact1 {
  background-color: #f8efec !important;
  min-height: 100vh;
}
.contact1 .form-control {
  background-color:#faf8f7;
}