.about-section {
  padding: 40px 0px;
}

.about-right {
  padding-left: 50px;
}

.about-right p.about-comp {
  background-color: #efefef;
  padding: 6px 19px;
  display: inline-block;
  border-radius: 20px;
  color: #f7c51e;
  font-weight: 600;
  text-transform: uppercase;
}

.about-right .bio-link {
  position: relative;
  display: inline-flex;
  text-decoration: none;
  color: #fff;
  background-color: #434444;
  overflow: hidden;
  z-index: 1;
  align-items: center;
  border-radius: 10px;
}
/* .about-right button i {
  padding-left: 10px;
} */

.about-right .bio-link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  transform: scaleX(0);
  transform-origin: 0 50%;
  width: 100%;
  height: 100%;
  background-color: #f7c51e;
  z-index: -1;
  border-radius: 10px;
  transition: transform 750ms;
}

.about-right .bio-link:hover::before {
  transform: scaleX(1);
}

.about-right .bio-link:hover {
  color: #000;
}

.about-right a {
  position: relative;
  display: inline-flex;
  text-decoration: none;
  color: #fff;
  background-color: #434444;
  overflow: hidden;
  z-index: 1;
  align-items: center;
  padding: 13px 45px 13px 20px;
  border-radius: 10px;
}

.about-right a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  transform: scaleX(0);
  transform-origin: 0 50%;
  width: 100%;
  height: 100%;
  background-color: #f7c51e;
  z-index: -1;
  border-radius: 10px;
  transition: transform 750ms;
}

.about-right a:hover::before {
  transform: scaleX(1);
}

.about-right a:hover {
  color: #000;
}

.about-right a::after {
  content: "\f061";
  font-family: "FontAwesome";
  font-size: 20px;
  color: #fff;
  position: absolute;
  right: 14px;
  top: 10px;
  font-weight: 100;
  -webkit-text-stroke: 1px #363434;
}

.about-right a:hover:after {
  -webkit-animation: moveArrow 750ms;
  animation: moveArrow 750ms;
}

@-webkit-keyframes moveArrow {
  0% {
    transform: translateX(0px);
  }

  49% {
    transform: translateX(50px);
  }

  50% {
    transform: translateX(-50px);
  }

  100% {
    transform: translateX(0px);
  }
}

@keyframes moveArrow {
  0% {
    transform: translateX(0px);
  }

  49% {
    transform: translateX(50px);
  }

  50% {
    transform: translateX(-50px);
  }

  100% {
    transform: translateX(0px);
  }
}

.cmp-vissin {
  background: rgba(217, 217, 217, 0.4);
  padding: 40px 0px 40px 0px;
}

.about-viss-miss {
  display: flex;
}
.left-image span {
  position: relative;
  display: flex;
  line-height: normal;
  justify-content: center;
}
.left-image span:before {
  font-family: "FontAwesome";
  font-size: 50px;
  color: #f7c51e;
  -webkit-text-stroke: 1px #f0f0f0;
}
span.about-us-vision-icon:before {
  content: "\f0eb";
}
span.about-us-mission-icon:before {
  content: "\f140";
}
span.about-us-value-icon:before {
  content: "\e4fb";
}

.left-image img {
  width: 57px;
  height: auto;
}

.right-content {
  padding-left: 0px;
}

.right-content p {
  margin-bottom: 0;
}
.staff-section {
  padding: 40px 0px 0px 0px;
}

.section-title-new {
  text-align: center;
  margin-bottom: 30px;
}

.staff-section .section-title-new p {
  background-color: #efefef;
  padding: 6px 19px;
  display: inline-block;
  border-radius: 20px;
  color: #f7c51e;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 15px;
}

.staff-detaild {
  text-align: center;
  padding-top: 20px;
}

.staff-detaild h3 {
  font-size: 18px;
  margin-bottom: 3px;
}

.staff-detaild p {
  margin-bottom: 0px;
}

.staff-image {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
}

.staff-image img {
  width: 100%;
}

.staff-image:hover {
  -webkit-transform: translate3d(0, -8px, 0);
  transform: translate3d(0, -8px, 0);
}
.bg-gradient-base-transparent {
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(rgba(22, 32, 44, 1)),
    to(transparent)
  );
  background-image: linear-gradient(
    to top,
    rgba(22, 32, 44, 0.9) 8%,
    transparent 90%
  );
}

.staff-image section {
  position: absolute;
  opacity: 1;
  bottom: 0;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  flex-direction: column;
  justify-content: end;
  display: none !important;
}

.staff-image:hover section {
  opacity: 1;
}

.profile-detail {
  padding: 5px 10px;
}

.profile-detail p {
  text-align: center;
  color: #fff;
}

.social-icon {
  width: 100%;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding-bottom: 20px;
  position: relative;
  left: 0;
  right: 0;
  margin: 0px auto;
}

.social-icon a {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  margin: 0px 5px;
  text-decoration: none;
  color: #f7c51e;
  position: relative;
}

.social-icon a i {
  line-height: 18px;
}

.social-buttons {
  border-radius: 5px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: -10px;
}

.social-buttons__button {
  margin: 5px;
}

.social-icons {
  width: 100%;
}
.social-button__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  border-radius: 100%;
  background: #fff;
  text-align: center;
}

.social-button i,
.social-button svg {
  position: relative;
  z-index: 1;
  transition: 0.3s;
}

.social-button i {
  font-size: 18px;
}

.social-button svg {
  height: 40%;
  width: 40%;
}

.social-button::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 0;
  height: 0;
  border-radius: 100%;
  transition: 0.3s;
}

.social-button:focus,
.social-button:hover {
  color: #fff;
  text-decoration: none;
}

.social-button:focus::after,
.social-button:hover::after {
  width: 100%;
  height: 100%;
  margin-left: -50%;
}

.social-button--facebook {
  color: #3b5999;
}

.social-button--facebook::after {
  background: #3b5999;
}

.social-button--twitter {
  color: #1da1f2;
}

.social-button--twitter::after {
  background: #1da1f2;
}

.about-left img {
  max-width: 100%;
}
.about-right {
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 30px;
}
.about-right p.about-comp {
  margin: 10px auto;
}
.cmp-vissin .container {
  padding-left: 20px;
  padding-right: 20px;
}

.cmp-vissin .right-content {
  padding-left: 18px;
}
.years-exp {
  justify-content: center;
}

.cmp-vissin {
  background: rgba(217, 217, 217, 0.4);
  padding: 45px 0px 30px 0px;
}
