.img-responsive{max-width: 100%;height: 100%;width: auto;}
.fe-spin-fast {display: inline-block; -webkit-animation: fe-spin-fast 0.1s infinite linear; animation: fe-spin-fast 0.1s infinite linear; }
@-webkit-keyframes fe-spin-fast {0% {-webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% {-webkit-transform: rotate(359deg); transform: rotate(359deg); }
}
@keyframes fe-spin-fast {0% {-webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% {-webkit-transform: rotate(359deg); transform: rotate(359deg); }
}
.material-card {position: relative; height: 0; padding-bottom: calc(100% - 16px); margin-bottom: 6.6em; }
.material-card h2 {position: absolute; top: calc(100% - 16px); left: 0; width: 100%;height: 71px;padding: 10px 16px; color: #fff; font-size: 1.2rem; line-height: 1.4rem; margin: 0; z-index: 10; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.material-card h2 span {display: block;white-space: nowrap;}
.material-card h2 span a{display:inline-block;color: #fff;}
.material-card h2 strong {font-weight: 400; display: block; font-size: 0.8em;color:#dee2e6; }
.material-card h2:before,
.material-card h2:after {content: ' '; position: absolute; left: 0; top: -16px; width: 0; border: 8px solid; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.material-card h2:after {top: auto; bottom: 0; }
@media screen and (max-width: 767px) {.material-card.mc-active {padding-bottom: 0; height: auto; }
}
.material-card.mc-active h2 {top: 0; padding: 10px 16px 10px 90px; }
.material-card.mc-active h2:before {top: 0; }
.material-card.mc-active h2:after {bottom: -16px; }
.material-card .mc-content {position: absolute; right: 0; top: 0; bottom: 16px; left: 16px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.material-card .mc-btn-action {position: absolute; right: 16px; top: 15px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; border: 5px solid; width: 54px; height: 54px; line-height: 44px; text-align: center; color: #fff; cursor: pointer; z-index: 20; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.material-card.mc-active .mc-btn-action {top: 62px; }
.material-card .mc-description p{font-size: 1rem;line-height:1.5rem;color: #333;max-height: 260px;}
.material-card .mc-description {position: absolute; top: 100%; right: 30px; left: 30px; bottom: 54px;overflow-y: scroll; opacity: 0;scrollbar-width: thin; -ms-overflow-style: none; scrollbar-color: #888 #f1f1f1; filter: alpha(opacity=0); -webkit-transition: all 1.2s; -moz-transition: all 1.2s; -ms-transition: all 1.2s; -o-transition: all 1.2s; transition: all 1.2s; }
.material-card .mc-footer {height: 0; overflow: hidden; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.material-card .mc-footer h4 {position: absolute; top: 200px; left: 30px; padding: 0; margin: 0; font-size: 16px; font-weight: 700; -webkit-transition: all 1.4s; -moz-transition: all 1.4s; -ms-transition: all 1.4s; -o-transition: all 1.4s; transition: all 1.4s; }
.material-card .mc-footer a {display: block; float: left; position: relative; width: 35px; height: 35px; margin-left: 5px; margin-bottom: 15px; font-size: 28px; color: #fff; line-height: 35px; text-decoration: none; top: 200px; }
.material-card .mc-footer a:nth-child(1) {-webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
.material-card .mc-footer a:nth-child(2) {-webkit-transition: all 0.6s; -moz-transition: all 0.6s; -ms-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s; }
.material-card .mc-footer a:nth-child(3) {-webkit-transition: all 0.7s; -moz-transition: all 0.7s; -ms-transition: all 0.7s; -o-transition: all 0.7s; transition: all 0.7s; }
.material-card .mc-footer a:nth-child(4) {-webkit-transition: all 0.8s; -moz-transition: all 0.8s; -ms-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s; }
.material-card .mc-footer a:nth-child(5) {-webkit-transition: all 0.9s; -moz-transition: all 0.9s; -ms-transition: all 0.9s; -o-transition: all 0.9s; transition: all 0.9s; }
.material-card .img-container {overflow: hidden; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 3; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.material-card.mc-active .img-container {-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; left: 0; top: 12px; width:50px; height:50px; z-index: 20; }
.material-card.mc-active .mc-content {padding-top: 5.6em; }
@media screen and (max-width: 767px) {.material-card.mc-active .mc-content {position: relative; margin-right: 16px; }
}
.material-card.mc-active .mc-description {top: 77px; padding-top:2rem; opacity: 1; filter: alpha(opacity=100); }
@media screen and (max-width: 767px) {.material-card.mc-active .mc-description {position: relative; top: -28px; right: auto; left: auto; padding:2rem 1rem; bottom: 0; }
}
@media (max-width: 991.98px) {.right-side{display: none}
}
.material-card.mc-active .mc-footer {overflow: visible; position: absolute; top: calc(100% - 16px); left: 16px; right: 0; height: 70px; padding-top: 15px; padding-left: 25px; }
.material-card.mc-active .mc-footer a {top: 0; }
.material-card.mc-active .mc-footer h4 {top:-15px; }
.material-card.Indigo h2 {background-color: #3F51B5; }
.material-card.Indigo h2:after {border-top-color: #3F51B5; border-right-color: #3F51B5; border-bottom-color: transparent; border-left-color: transparent; }
.material-card.Indigo h2:before {border-top-color: transparent; border-right-color: #1A237E; border-bottom-color: #1A237E; border-left-color: transparent; }
.material-card.Indigo.mc-active h2:before {border-top-color: transparent; border-right-color: #3F51B5; border-bottom-color: #3F51B5; border-left-color: transparent; }
.material-card.Indigo.mc-active h2:after {border-top-color: #1A237E; border-right-color: #1A237E; border-bottom-color: transparent; border-left-color: transparent; }
.material-card.Indigo .mc-btn-action {background-color: #3F51B5; }
.material-card.Indigo .mc-btn-action:hover {background-color: #1A237E; }
.material-card.Indigo .mc-footer h4 {color: #1A237E; }
.material-card.Indigo .mc-footer a {background-color: #1A237E; }
.material-card.Indigo.mc-active .mc-content {background-color: #E8EAF6; }
.material-card.Indigo.mc-active .mc-footer {background-color: #C5CAE9; }
.material-card.Indigo.mc-active .mc-btn-action {border-color: #E8EAF6; }