.responsive-cell-block {
  min-height:         75px;
}

.text-blk {
  margin-top:         0px;
  margin-right:       0px;
  margin-bottom:      0px;
  margin-left:        0px;
  line-height:        25px;
}

.responsive-container-block {
  min-height:         75px;
  height:             fit-content;
  width:              100%;
  display:            flex;
  flex-wrap:          wrap;
  margin-top:         0px;
  margin-right:       auto;
  margin-bottom:      0px;
  margin-left:        auto;
  justify-content:    space-evenly;
}

.container {
  max-width:          1380px;
  margin-top:         60px;
  margin-right:       auto;
  margin-bottom:      60px;
  margin-left:        auto;
  padding-top:        0px;
  padding-right:      30px;
  padding-bottom:     0px;
  padding-left:       30px;
}

.responsive-container-block.container {
  margin:             10px !important;
}

.card {
  text-align:         center;
  box-shadow:         rgba(0, 0, 0, 0.05) 0px 4px 20px 7px;
  display:            flex;
  flex-direction:     column;
  align-items:        center;
  padding-top:        30px;
  padding-right:      25px;
  padding-bottom:     30px;
  padding-left:       25px;
}

.card-container {
  width:              280px;
  margin-top:         0px;
  margin-right:       10px;
  margin-bottom:      25px;
  margin-left:        10px;
}

.name {
  margin-top:         20px;
  margin-right:       0px;
  margin-bottom:      5px;
  margin-left:        0px;
  font-size:          18px;
  font-weight:        800;
}

.position {
  margin-top:         0px;
  margin-right:       0px;
  margin-bottom:      10px;
  margin-left:        0px;
}

.feature-text {
  margin-top:         0px;
  margin-right:       0px;
  margin-bottom:      20px;
  margin-left:        0px;
  color:            rgb(122, 122, 122);
  line-height:        30px;
}

.social-icons {
  width:              70px;
  display:            flex;
  justify-content:    space-between;
}

.team-image-wrapper {
  clip-path:          circle(50% at 50% 50%);
  width:              130px;
  height:             130px;
}

.team-member-image {
  max-width:          100%;
  width:              100%;
  height:             100%; 
  object-fit:         fill;
  background-color: gray;
  color:              var(--club-primary-color);
}

.team-member-image.default-img {
  padding:            10px !important;
}

@media (max-width: 767px) {
  .container,
  .card-container {
    margin:           0px 0px 25px 0px;
  }

  .card-container {
    width:            100%;
  }
}  

.social-icons {
  display:            inline-flex;
  flex-direction:     row;
  align-items:        center;
  justify-content:    space-around;
}

.social-icons > a {
  color:              var(--club-primary-color);
}

.card-container {
  display:                      flex;
  justify-content:              center;
}

.flip-card {
  background-color:             transparent;
  width:                        100%;
  height:                       400px;
  perspective:                  1000px;
}

.flip-card .inner {
  position:                     relative;
  width:                        100%;
  height:                       100%;
  transition:                   transform 0.8s;
  transform-style:              preserve-3d;
}

.flip-card .inner .front,
.flip-card .inner .back {
  position:                     absolute;
  width:                        100%;
  height:                       100%;
  -webkit-backface-visibility:  hidden;
  backface-visibility:          hidden;
  display:                      flex;
  align-items:                  center;
  justify-content:              center;
  flex-direction:               column;
}

.flip-card .inner .back {
  transform:                    rotateY(180deg);
}

.flip-card:hover .inner,
.flip-card.is-flipped .inner {
  transform:                    rotateY(180deg);
}

.avatar img { 
  width:                        100%;
  height:                       auto;
}

.person.card,
.sponsor.card {
  padding:                      20px !important;
  margin:                       20px !important;
  box-shadow:                   0 5px 15px 0px rgba(0,0,0,0.6);
}

.sponsor.card {
  border-radius:                25px !important;
}

.person.card:hover,
.sponsor.card:hover {
  transform:                    translatey(0px);
  animation:                    floatImage 6s ease-in-out infinite;
}

.sponsor.card:hover {
  border:                       2px solid var(--club-secondary-color);
}

.sponsor-image-wrapper {
  height:                       130px;
}

.sponsor-member-image {
  max-width:                    100%;
  width:                        100%;
  height:                       100%; 
}

.sponsor-member-image.default-img {
  object-fit:                   contain;
  background-color:             gray;
  color:                        var(--club-primary-color);
  padding:                      10px !important;
}

@-webkit-keyframes floatImage {
  0% {
    box-shadow:                 0 5px 15px 0px rgba(0,0,0,0.6);
    transform:                  translatey(0px);
  }
  50% {
    box-shadow:                 0 25px 15px 0px rgba(0,0,0,0.2);
    transform:                  translatey(-20px);
  }
  100% {
    box-shadow:                 0 5px 15px 0px rgba(0,0,0,0.6);
    transform:                  translatey(0px);
  }
}
@keyframes floatImage {
  from {
    box-shadow:                 0 5px 15px 0px rgba(0,0,0,0.6);
    transform:                  translatey(0px);
  }
  50% {
    box-shadow:                 0 25px 15px 0px rgba(0,0,0,0.2);
    transform:                  translatey(-20px);
  }
  to {
    box-shadow:                 0 5px 15px 0px rgba(0,0,0,0.6);
    transform:                  translatey(0px);
  }
}

@-webkit-keyframes slideUp {
  0% {
    bottom:                     -100%;
    opacity:                    0;  
  }
  50% {
    bottom:                     -50%;
    opacity:                    .5;  
  }
  100% {
    bottom:                     0%;
    opacity:                    1;  
  }
}
@keyframes slideUp {
  from {
    bottom:                     -100%;
    opacity:                    0;  
  }
  50% {
    bottom:                     -50%;
    opacity:                    .5;  
  }
  to {
    bottom:                     0%;
    opacity:                    1;  
  }
}

@-webkit-keyframes slideDown {
  0% {
    top:                        -100%;
    opacity:                    0;  
  }
  50% {
    top:                        -50%;
    opacity:                    .5;  
  }
  100% {
    top:                        0%;
    opacity:                    1;  
  }
}
@keyframes slideDown {
  from {
    top:                        -100%;
    opacity:                    0;  
  }
  50% {
    top:                        -50%;
    opacity:                    .5;  
  }
  to {
    top:                        0%;
    opacity:                    1;  
  }
}