/******************************* OVERRIDES */
/* staff colors*/
.staff3-items article .staff3-rollover { background-color: rgba(37, 37, 37, 0.7); color: #fff; }

.staff3-items article .staff3-rollover p { color: #fff; }

.staff3-items article .staff3-rollover ul li a { color: rgba(37, 37, 37, 0.8); background-color: rgba(255, 255, 255, 0.5); }

.staff3-items article .staff3-rollover ul li a:hover { background-color: #fff; }

.staff3-items.staff3-detail article ul.staff3-social li a { color: #fff; background-color: rgba(37, 37, 37, 0.5); }

.staff3-items.staff3-detail article ul.staff3-social li a:hover { background-color: #3fafba; }

#staff3 .filters { padding: 1rem;}

/******************************* LIST */
.staff3-heading { text-align: center; }

#staff3-results { position: relative; }

.staff3-items.staff3-row { display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-pack: center; justify-content: center;}

@media (min-width: 768px) { .staff3-items.staff3-row { -webkit-box-pack: flex-start; justify-content: flex-start; } }

.staff3-items.staff3-row article { width: 80%; padding: 0 10%; text-align: center; margin-bottom: 3em; }

@media (min-width: 768px) { .staff3-items.staff3-row article { box-sizing: border-box; padding: 0 1.5em; -webkit-box-flex: 0; flex: 0 0 50%; } }

@media (min-width: 992px) { .staff3-items.staff3-row article { -webkit-box-flex: 0; flex: 0 0 25%; } }

.staff3-items.staff3-row.pastors { -webkit-box-pack: center; justify-content: center; }

.staff3-items.staff3-row.pastors article { width: 100%; padding: 0; }

@media (min-width: 992px) { .staff3-items.staff3-row.pastors article { -webkit-box-flex: 0; flex: 0 0 33%; padding: 0 .5em; } }

.staff3-items.staff3-row.featured { -webkit-box-pack: center; justify-content: center; }

@media (min-width: 992px) { .staff3-items.staff3-row.featured article { padding: 0 .75em; } }

.staff3-items article .staff3-image { position: relative; margin-bottom: 1.5em; overflow: hidden; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; }

.staff3-items article .staff3-image img { display: block; width: 100%; height: auto; }

.staff3-items article .staff3-image:hover .staff3-rollover { opacity: 1; }

.staff3-items article .staff3-rollover { position: absolute; right: 0; top: 0; width: 100%; height: 100%; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; transition: 0.4s; }

.staff3-items article .staff3-rollover .staff3-rollover-inner { position: absolute; top: 0; left: 0; width: 100%; height: 75%; height: calc(100% - 58px); /*buffer matches ul (li height + ul top calc + 10)*/ overflow-x: hidden; overflow-y: auto; }

.staff3-items article .staff3-rollover .staff3-rollover-inner a { position: relative; display: block; height: 100%; }

.staff3-items article .staff3-rollover .staff3-rollover-inner p { position: relative; display: inline-block; vertical-align: middle; width: 90%; padding: 1em 5% 0 5% !important; margin: 0 !important; font-size: 12px; line-height: 2em; text-align: center; }

.staff3-items article .staff3-rollover .staff3-rollover-inner span.spacer { height: 100%; display: inline-block; vertical-align: middle; }

.staff3-items article .staff3-rollover ul, .staff3-items article .staff3-rollover li { list-style: none !important; margin: 0 !important; padding: 0 !important; }

.staff3-items article .staff3-rollover ul { position: absolute; left: 0; bottom: 20px; width: 100%; display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; }

.staff3-items article .staff3-rollover ul li { padding: 0 .25rem !important; }

.staff3-items article .staff3-rollover ul li a { display: block; width: 28px; height: 28px; text-align: center; border-radius: 100%; }

.staff3-items article .staff3-rollover ul li a i { display: inline-block; font-size: 16px; line-height: 28px; }

.staff3-items article .staff3-info p { font-size: 16px; }

.staff3-items.pastors article .staff3-rollover .staff3-rollover-inner p { padding: 1em 10% 0 10% !important; width: 80%; font-size: 14px; }

/******************************* DETAIL */
.staff3-items.staff3-detail article { overflow: hidden; }

@media (min-width: 768px) { .staff3-items.staff3-detail article .staff3-image { float: left; width: 30%; } }

@media (min-width: 768px) { .staff3-items.staff3-detail article .staff3-info { float: right; width: 65%; } }

.staff3-items.staff3-detail article .staff3-info h3 { text-transform: uppercase; }

.staff3-items.staff3-detail article ul.staff3-social { list-style: none !important; margin: .75em 0 1.5em 0 !important; padding: 0 !important; }

.staff3-items.staff3-detail article ul.staff3-social li { display: inline-block; list-style: none !important; margin: 0 1em 0 0 !important; padding: 0 !important; }

.staff3-items.staff3-detail article ul.staff3-social li a { display: block; width: 28px; height: 28px; text-align: center; border-radius: 100%; }

.staff3-items.staff3-detail article ul.staff3-social li a i { display: inline-block; font-size: 16px; line-height: 28px; }

#staff3-return { text-align: center; font-size: 13px; line-height: 1; }

@media (min-width: 768px) { #staff3-return { text-align: right; } }

#staff3-return a { display: inline-block; text-transform: uppercase; padding: .75em 2em; line-height: 1; font-weight: 700; }
