
/*------------------------------------------------------------------------
# mod_mx_team Extension
# ------------------------------------------------------------------------
# author    mixwebtemplates
# copyright Copyright (C) 2019 mixwebtemplates.com. All Rights Reserved.
# @license - http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
# Websites: http://www.mixwebtemplates.com
-------------------------------------------------------------------------*/

:root {
  --color51-base: #333;
    --mxt-common-white: rgb(255 255 255);
     --qode-hover-move-x: 110%;
 --qode-hover-move-y: 100%
}

.team-51 .mos-img img {display: none !important;}
.team-51 {
 padding:  10px;
}
.mxt-team-thumb  {
 position: relative;
 margin-bottom: 35px;
}
.mxt-team-thumb img {
 border-radius:50%;
 -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
 -webkit-filter: grayscale(2);
          filter: grayscale(2);
}
.mxt-team-wrapper:hover .mxt-team-thumb img{
    -webkit-filter: grayscale(0);
    filter: grayscale(0); }
    
@media (max-width: 575px) {
 .mxt-team-wrapper {
  margin-right:15px;
  margin-left:15px
 }
}
.mxt-team-thumb ul li  {
 list-style:none;
}
.mxt-team-social ul li, .field-value ul li {
 list-style:none;
 position:absolute;
 bottom:18px;
 right:13px
}
.mxt-team-social ul li:nth-child(1) a, .field-value ul li:nth-child(1) a {
 font-size:22px
}
.mxt-team-social ul li:nth-child(1), .field-value ul li:nth-child(1) {
 -webkit-transition:all .2s ease-in-out;
 -moz-transition:all .2s ease-in-out;
 -ms-transition:all .2s ease-in-out;
 -o-transition:all .2s ease-in-out;
 transition:all .2s ease-in-out;
 transform:scale(.6);
 visibility:hidden;
 opacity:0
}
.mxt-team-social ul li:nth-child(2), .field-value ul li:nth-child(2) {
 bottom:27%;
 right:-23px;
 -webkit-transition:all .2s ease-in-out;
 -moz-transition:all .2s ease-in-out;
 -ms-transition:all .2s ease-in-out;
 -o-transition:all .2s ease-in-out;
 transition:all .2s ease-in-out;
 transform:scale(.6);
 visibility:hidden;
 opacity:0
}
.mxt-team-social ul li:nth-child(3), .field-value ul li:nth-child(3) {
 bottom:51%;
 right:-25px;
 -webkit-transition:all .3s ease-in-out;
 -moz-transition:all .3s ease-in-out;
 -ms-transition:all .3s ease-in-out;
 -o-transition:all .3s ease-in-out;
 transition:all .3s ease-in-out;
 transform:scale(.5);
 visibility:hidden;
 opacity:0
}
.mxt-team-social ul li:nth-child(4), .field-value ul li:nth-child(4){
 bottom:72%;
 right:7px;
 -webkit-transition:all .4s ease-in-out;
 -moz-transition:all .4s ease-in-out;
 -ms-transition:all .4s ease-in-out;
 -o-transition:all .4s ease-in-out;
 transition:all .4s ease-in-out;
 transform:scale(.3);
 visibility:hidden;
 opacity:0
}
.mxt-team-social ul li:nth-child(5),.field-value ul li:nth-child(5)  {
 bottom:86%;
 right:63px;
 -webkit-transition:all .5s ease-in-out;
 -moz-transition:all .5s ease-in-out;
 -ms-transition:all .5s ease-in-out;
 -o-transition:all .5s ease-in-out;
 transition:all .5s ease-in-out;
 transform:scale(.2);
 visibility:hidden;
 opacity:0
}
.mxt-team-social ul li:nth-child(6),.field-value ul li:nth-child(6)  {
 bottom:95%;
 right:126px;
 -webkit-transition:all .5s ease-in-out;
 -moz-transition:all .5s ease-in-out;
 -ms-transition:all .5s ease-in-out;
 -o-transition:all .5s ease-in-out;
 transition:all .5s ease-in-out;
 transform:scale(.2);
 visibility:hidden;
 opacity:0
}
.mxt-team-social ul li a, .field-value ul li a {
 font-size:18px;
 width:60px;
 height:60px;
 background:var(--mxt-common-white);
 display:inline-block;
 text-align:center;
 line-height:60px;
 border-radius:50%;
 box-shadow:0 0 18px #0000001a
}


@media only screen and (min-width: 992px) and (max-width: 1199px),only screen and (min-width: 576px) and (max-width: 767px) {
 .mxt-team-social ul li a,  .field-value ul li a {
  width:50px;
  height:50px;
  line-height:50px
 }
}
.mxt-team-social ul li a:hover, .field-value ul li a:hover {
 color:var(--mxt-common-white);
 background:var(--color51-base)
}
.mxt-team-social ul li a:hover svg {
 fill:var(--mxt-common-white)
}
.mxt-team-social ul li a svg {
 width:18px
}
.mxt-team-wrapper:hover .mxt-team-social ul li, .mxt-team-wrapper:hover .field-value ul li {
 list-style:none;
 position:absolute;
 bottom:18px;
 right:13px
}

.mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(1), .mxt-team-wrapper:hover .field-value ul li:nth-child(1) {
 transform:scale(1);
 visibility:visible;
 opacity:1
}
.mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(2), .mxt-team-wrapper:hover .field-value ul li:nth-child(2) {
 bottom:26%;
 right:-18px;
 transform:scale(1);
 visibility:visible;
 opacity:1
}
.mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(3), .mxt-team-wrapper:hover .field-value ul li:nth-child(3) {
 bottom:49%;
 right:-18px;
 transform:scale(1);
 visibility:visible;
 opacity:1
}
@media only screen and (min-width: 992px) and (max-width: 1199px),only screen and (min-width: 576px) and (max-width: 767px) {
 .mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(3), .mxt-team-wrapper:hover .field-value ul li:nth-child(3) {
  bottom:50%
 }
}
.mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(4), .mxt-team-wrapper:hover .field-value ul li:nth-child(4) {
 bottom:70%;
 right:7px;
 transform:scale(1);
 visibility:visible;
 opacity:1
}
@media only screen and (min-width: 992px) and (max-width: 1199px),only screen and (min-width: 576px) and (max-width: 767px) {
 .mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(4), .mxt-team-wrapper:hover .field-value ul li:nth-child(4) {
  bottom:70%
 }
}
.mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(5), .mxt-team-wrapper:hover .field-value ul li:nth-child(5) {
 bottom:85%;
 right:62px;
 transform:scale(1);
 visibility:visible;
 opacity:1
}
.mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(6), .mxt-team-wrapper:hover .field-value ul li:nth-child(6) {
 bottom:90%;
 right:135px;
 transform:scale(1);
 visibility:visible;
 opacity:1
}
@media only screen and (min-width: 992px) and (max-width: 1199px),only screen and (min-width: 576px) and (max-width: 767px) {
 .mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(5),  .mxt-team-wrapper:hover .field-value ul li:nth-child(5) {
  right:53px
 }
  .mxt-team-wrapper:hover .mxt-team-social ul li:nth-child(6),  .mxt-team-wrapper:hover .field-value ul li:nth-child(6) {
   bottom:90%;
   right:110px
 }
}
.mxt-team-title {
 font-weight:500;
 font-size:24px;
 line-height:117%;
 margin-bottom:4px
}
.mxt-team-title a {
 background-image:linear-gradient(#20282d,#20282d),linear-gradient(#20282d,#20282d);
 background-size:0 1px,0 1px;
 background-position:100% 100%,0 100%;
 background-repeat:no-repeat;
 transition:background-size .3s linear;
 -webkit-transition:all .3s ease;
 -moz-transition:all .3s ease;
 -ms-transition:all .3s ease;
 -o-transition:all .3s ease;
 transition:all .3s ease
}
.mxt-team-title a:hover {
 background-image:linear-gradient(#20282d,#20282d),linear-gradient(#20282d,#20282d);
 background-size:0 1px,100% 1px;
 background-position:100% 100%,0 100%;
 background-repeat:no-repeat;
 transition:background-size .3s linear;
 -webkit-transition:all .3s ease;
 -moz-transition:all .3s ease;
 -ms-transition:all .3s ease;
 -o-transition:all .3s ease;
 transition:all .3s ease
}
.mxt-team-designation {
 line-height:100%;
 color: #999
}
.mxt-btn {
 padding:14px 20px;
 color:var(--color51-base);
 border: 1px solid var(--color51-base);
 display:inline-block;
 background:var(--mxt-common-white);
 font-weight:600;
 font-size:14px;
 line-height:100%
}
.mxt-btn:hover {
 color: var(--mxt-common-white);
 border: 1px solid var(--mxt-common-white);
 background:var(--color51-base);
}
.mxt-arrow-angle {
margin-left: 10px;
}
.mxt-arrow-svg-top-right {
 fill:currentColor;
 stroke:none
}
.mxt-arrow-angle path {
 transition:transform .38s cubic-bezier(.37,.08,.02,.93),opacity .18s ease-out
}
.mxt-arrow-angle path:nth-of-type(1) {
 transform:translate(0) translateY(0);
 opacity:1;
 transition-delay:.15s,.15s
}
.mxt-arrow-angle path:nth-of-type(2) {
 transform:translate(calc(-1 * var(--qode-hover-move-x))) translateY(var(--qode-hover-move-y));
 opacity:.5;
 transition-delay:0s,0s
}
.mxt-left-right:hover .mxt-arrow-angle path:nth-of-type(2) {
 transform:translate(0) translateY(0);
 opacity:1;
 transition-delay:.15s,.15s
}
.mxt-left-right:hover .mxt-arrow-angle path:nth-of-type(1) {
 transform:translate(var(--qode-hover-move-x)) translateY(calc(-1 * var(--qode-hover-move-y)));
 opacity:0;
 transition-delay:0s,0s
}
.team-51 .field-label {
  display: none !important;
}

.team-51 ul {
  padding-left: 0rem;
  margin-bottom: 0rem;
}
