

/* Background-image Css */
.bg {
  position: relative;
  z-index: 1;
}

.bg::before {
  content: "";
  position: absolute;
  inline-size: 100%;
  block-size: 100%;
  inset-inline-start: 0;
  inset-block-start: 0;
  background-color: #000;
  opacity: .8;
  z-index: -1;
}

/* button */
/* utils */
/* layouts */
.mtt-social .mtt-social-icon-one svg,
.mtt-social .mtt-social-icon-two svg,
.mtt-social .mtt-social-icon-three svg,
.mtt-social .mtt-social-icon-four svg {
  inline-size:16px;
}
.mtt-team-area-style1 .mtt-our-team-box {
  padding-block-start: 30px;
  padding-inline: 25px;
  padding-block-end: 40px;
  background: #f7f5ec;
  text-align: center;
  overflow: hidden;
  position: relative;
  margin-block-end: 30px;
  border-radius: 5px;
}
.mtt-style-1 {
    block-size: 130px !important;
}
.mtt-pic {
  flex-basis: 250px;
  block-size: 350px;
}
.mtt-pic img {
  inline-size: 100%;
  block-size: 100%!important;
  object-fit: cover;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-pic {
  display: inline-block;
  inline-size:130px;
  block-size: 130px;
  margin-block-end: 50px;
  z-index: 1;
  position: relative;
  border: 10px solid transparent;
  border-radius: 50%;
  -webkit-transition: .4s linear;
  transition: .4s linear;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-pic::before {
  content: "";
  inline-size: 100%;
  block-size: 0;
  border-radius: 50%;
  background: #ee4266;
  position: absolute;
  inset-block-end: 135%;
  inset-inline-end: 0;
  inset-inline-start: 0;
  opacity: 0.2;
  -webkit-transform: scale(3);
          transform: scale(3);
  -webkit-transition: all 0.3s linear 0s;
  transition: all 0.3s linear 0s;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-pic img {
  inline-size: 100%;
  block-size: 100%;
  border-radius: 50%;
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.9s ease 0s;
  transition: all 0.9s ease 0s;
  -o-object-fit: cover;
     object-fit: cover;
}
.mtt-team-area-style1 .mtt-our-team-box:hover .mtt-pic {
  border-color: #ee4266;
}
.mtt-team-area-style1 .mtt-our-team-box:hover .mtt-pic::before {
  block-size: 100%;
}
.mtt-team-area-style1 .mtt-our-team-box:hover .mtt-pic img {
  -webkit-box-shadow: 0 0 0 14px #f7f5ec;
          box-shadow: 0 0 0 14px #f7f5ec;
  -webkit-transform: scale(0.7);
          transform: scale(0.7);
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-team-content {
  margin-block-end: 30px;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-team-content .mtt-title {
  font-size: 22px;
  font-weight: 700;
  color: #4e5052;
  letter-spacing: 1px;
  text-transform: capitalize;
  margin-block-end: 5px;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-team-content .mtt-post {
  display: block;
  font-size: 15px;
  color: #4e5052;
  text-transform: capitalize;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-social {
  inline-size: 100%;
   padding-block: 0px;
  padding-inline: 0px;
  margin-block: 0px;
  margin-inline: 0px;
  background: #eb1768;
  position: absolute;
  inset-block-end: -100px;
  inset-inline-start: 0;
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-social a {
  display: flex;
  justify-content: center;
  align-items: center;
   padding-block: 10px;
  padding-inline: 10px;
  font-size: 17px;
  color: #fff;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.mtt-team-area-style1 .mtt-our-team-box .mtt-social a:hover {
  color: #eb1768;
  background: #f7f5ec;
}
.mtt-team-area-style1 .mtt-our-team-box:hover .mtt-social {
  inset-block-end: 0;
}


/* Style 2 */
.mtt-team-area-style2 .mtt-our-team-box {
  overflow: hidden;
  cursor: pointer;
  margin-block-end: 40px;
}
.mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item {
  position: relative;
  -webkit-transition: .4s linear;
  transition: .4s linear;
}
.mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item .mtt-team-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  inset-block-start: 0;
  inset-inline-start: 0;
  text-align: center;
  background: -webkit-gradient(linear, left top, left bottom, from(#8dadc75d), 
  color-stop(40%, #79a1c1f7), color-stop(40%, #81a2bd), to(#8dadc75d));
  background: linear-gradient(#8dadc75d, #79a1c1f7 40%, #81a2bd 40%, #8dadc75d);
  color: white;
  text-transform: capitalize;
  -webkit-transform: translateY(114%);
          transform: translateY(114%);
  inline-size: 100%;
  block-size: 100%;
  position: absolute;
  padding-block: 5px;
  padding-inline: 15px;
}
@media (max-width:767px) {
  .mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item .mtt-team-content {
    block-size: 102%;
  }
}
.mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item .mtt-team-content .mtt-title {
  font-size: 25px;
  font-weight: 700;
  text-transform: capitalize;
  margin-block-end: 10px;
}
.mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item .mtt-team-content .mtt-post {
  display: block;
  font-size: 18px;
  font-weight: 400;
  margin-block-end: 10px;
}
.mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item .mtt-team-content .mtt-social {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-block-start: 10px;
}
.mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item .mtt-team-content .mtt-social a {
  color: #fff;
  font-size: 18px;
  margin-block: 0px;
  margin-inline: 5px;
  inline-size:40px;
  display: flex;
  justify-content: center;
  align-items: center;
  block-size: 40px;
  line-height: 40px;
  border-radius: 50%;
  background: rgba(228, 101, 143, 0.87);
  border: 1px solid transparent;
  text-align: center;
  -webkit-transition: .4s linear;
  transition: .4s linear;
}
.mtt-team-area-style2 .mtt-our-team-box .mtt-our-team-item .mtt-team-content .mtt-social a:hover {
  -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
  background: transparent;
  border: 1px solid rgba(228, 101, 143, 0.87);
}
.mtt-team-area-style2 .mtt-our-team-box:hover .mtt-our-team-item {
  -webkit-transform: translateY(-114%);
          transform: translateY(-114%);
}

/* Column Number Show Css */
  .mtt-grid-column1 .column_number {
    flex: 0 0 auto;
    inline-size: 100%;
    max-inline-size: 100%;
  }
  .mtt-grid-column2 .column_number {
    flex: 0 0 auto;
    inline-size: 50%;
    max-inline-size: 50%;
  }
  .mtt-grid-column3 .column_number {
    flex: 0 0 auto;
    inline-size: 33.33%;
    max-inline-size: 33.33%;
  }
  .mtt-grid-column4 .column_number {
    flex: 0 0 auto;
    inline-size: 25%;
    max-inline-size: 25%;
  }
  .mtt-grid-column5 .column_number {
    flex: 0 0 auto;
    inline-size: 20%;
    max-inline-size: 20%;
  }
  .mtt-grid-column6 .column_number {
    flex: 0 0 auto;
    inline-size: 16.66%;
    max-inline-size: 16.66%;
  }

@media (min-width:2400px) {
  .mtt-grid-widescreen-column1 .column_number {
    flex: 0 0 auto;
    inline-size: 100%;
    max-inline-size: 100%;
  }
  .mtt-grid-widescreen-column2 .column_number {
    flex: 0 0 auto;
    inline-size: 50%;
    max-inline-size: 50%;
  }
  .mtt-grid-widescreen-column3 .column_number {
    flex: 0 0 auto;
    inline-size: 33.33%;
    max-inline-size: 33.33%;
  }
  .mtt-grid-widescreen-column4 .column_number {
    flex: 0 0 auto;
    inline-size: 25%;
    max-inline-size: 25%;
  }
  .mtt-grid-widescreen-column5 .column_number {
    flex: 0 0 auto;
    inline-size: 20%;
    max-inline-size: 20%;
  }
  .mtt-grid-widescreen-column6 .column_number {
    flex: 0 0 auto;
    inline-size: 16.66%;
    max-inline-size: 16.66%;
  }
}
@media (max-width:1366px) {
  .mtt-grid-laptop-column1 .column_number {
    flex: 0 0 auto;
    inline-size: 100%;
    max-inline-size: 100%;
  }
  .mtt-grid-laptop-column2 .column_number {
    flex: 0 0 auto;
    inline-size: 50%;
    max-inline-size: 50%;
  }
  .mtt-grid-laptop-column3 .column_number {
    flex: 0 0 auto;
    inline-size: 33.33%;
    max-inline-size: 33.33%;
  }
  .mtt-grid-laptop-column4 .column_number {
    flex: 0 0 auto;
    inline-size: 25%;
    max-inline-size: 25%;
  }
  .mtt-grid-laptop-column5 .column_number {
    flex: 0 0 auto;
    inline-size: 20%;
    max-inline-size: 20%;
  }
  .mtt-grid-laptop-column6 .column_number {
    flex: 0 0 auto;
    inline-size: 16.66%;
    max-inline-size: 16.66%;
  }
}
@media (max-width:1200px) {
  .mtt-grid-tablet_extra-column1 .column_number {
    flex: 0 0 auto;
    inline-size: 100%;
    max-inline-size: 100%;
  }
  .mtt-grid-tablet_extra-column2 .column_number {
    flex: 0 0 auto;
    inline-size: 50%;
    max-inline-size: 50%;
  }
  .mtt-grid-tablet_extra-column3 .column_number {
    flex: 0 0 auto;
    inline-size: 33.33%;
    max-inline-size: 33.33%;
  }
  .mtt-grid-tablet_extra-column4 .column_number {
    flex: 0 0 auto;
    inline-size: 25%;
    max-inline-size: 25%;
  }
  .mtt-grid-tablet_extra-column5 .column_number {
    flex: 0 0 auto;
    inline-size: 20%;
    max-inline-size: 20%;
  }
  .mtt-grid-tablet_extra-column6 .column_number {
    flex: 0 0 auto;
    inline-size: 16.66%;
    max-inline-size: 16.66%;
  }
}
@media (max-width:1024px) {
  .mtt-grid-tablet-column1 .column_number {
    flex: 0 0 auto;
    inline-size: 100%;
    max-inline-size: 100%;
  }
  .mtt-grid-tablet-column2 .column_number {
    flex: 0 0 auto;
    inline-size: 50%;
    max-inline-size: 50%;
  }
  .mtt-grid-tablet-column3 .column_number {
    flex: 0 0 auto;
    inline-size: 33.33%;
    max-inline-size: 33.33%;
  }
  .mtt-grid-tablet-column4 .column_number {
    flex: 0 0 auto;
    inline-size: 25%;
    max-inline-size: 25%;
  }
  .mtt-grid-tablet-column5 .column_number {
    flex: 0 0 auto;
    inline-size: 20%;
    max-inline-size: 20%;
  }
  .mtt-grid-tablet-column6 .column_number {
    flex: 0 0 auto;
    inline-size: 16.66%;
    max-inline-size: 16.66%;
  }
}
@media (max-width:880px) {
  .mtt-grid-mobile_extra-column1 .column_number {
    flex: 0 0 auto;
    inline-size: 100%;
    max-inline-size: 100%;
  }
  .mtt-grid-mobile_extra-column2 .column_number {
    flex: 0 0 auto;
    inline-size: 50%;
    max-inline-size: 50%;
  }
  .mtt-grid-mobile_extra-column3 .column_number {
    flex: 0 0 auto;
    inline-size: 33.33%;
    max-inline-size: 33.33%;
  }
  .mtt-grid-mobile_extra-column4 .column_number {
    flex: 0 0 auto;
    inline-size: 25%;
    max-inline-size: 25%;
  }
  .mtt-grid-mobile_extra-column5 .column_number {
    flex: 0 0 auto;
    inline-size: 20%;
    max-inline-size: 20%;
  }
  .mtt-grid-mobile_extra-column6 .column_number {
    flex: 0 0 auto;
    inline-size: 16.66%;
    max-inline-size: 16.66%;
  }
}
@media (max-width:767px) {
  .mtt-grid-mobile-column1 .column_number {
    flex: 0 0 auto;
    inline-size: 100%;
    max-inline-size: 100%;
  }
  .mtt-grid-mobile-column2 .column_number {
    flex: 0 0 auto;
    inline-size: 50%;
    max-inline-size: 50%;
  }
  .mtt-grid-mobile-column3 .column_number {
    flex: 0 0 auto;
    inline-size: 33.33%;
  }
  .mtt-grid-mobile-column4 .column_number {
    flex: 0 0 auto;
    inline-size: 25%;
    max-inline-size: 25%;
  }
  .mtt-grid-mobile-column5 .column_number {
    flex: 0 0 auto;
    inline-size: 20%;
    max-inline-size: 20%;
  }
  .mtt-grid-mobile-column6 .column_number {
    flex: 0 0 auto;
    inline-size: 16.66%;
    max-inline-size: 16.66%;
  }
}