/************************************************************************* List View */
/* Using Bootstrap rows/columns for items and articles now */
#volunteerOpps .items { padding: 0; margin-bottom: -2rem; }

#volunteerOpps .items #pagination { margin: 0 auto; padding-bottom: 2rem; }

#volunteerOpps .items article { margin: 0 0 2rem; }

#volunteerOpps .items article h4 { padding-top: 1rem; }

#volunteerOpps .items article .button-container { margin-bottom: 0; margin-top: 1em; }

#volunteerOpps .items article .more { margin-bottom: 1em; -webkit-backface-visibility: hidden; }

#volunteerOpps .items article .more > img { -webkit-backface-visibility: hidden; }

article header { cursor: pointer; padding-right: 12.5%; /*don't creep on the arrow*/ }

article .previewText p { margin-bottom: 0; }

article .details { display: none; border-top: 1px solid #ffffff; padding-top: 2.5%; margin-top: 2.5%; text-align: center; }

.serveThird { padding: 2em; text-align: center; }

.whereText h4 { margin-top: 0; }

.whereText p { margin-bottom: 1em; }

/* Detail View */
#volunteerOpps .return { margin-bottom: 2em; white-space: normal; }

#volunteerOpps .return > span { vertical-align: -1px; }

article.details { padding: 0; border: none; background: none; }

.button-container { display: inline-block; }

.serveThird .iconBox { display: block; width: 100%; margin-bottom: 1.5em; text-align: center; }

.serveThird .iconBox > .icon { font-size: 4em; }

.whereText { display: inline-block; vertical-align: top; width: 64%; }

.serveThird .whereText { width: 100%; }

/* Serve Wide */
#volunteerOpps.detail .serveWide { background-color: transparent; }

.serveWide { display: block; padding: 0 2rem; text-align: center; }

.serveWide .iconBox { display: block; width: 100%; box-sizing: border-box; margin-bottom: 2rem; }

.serveWide .iconBox > .icon { font-size: 5em; }

.serveWide .whereText { display: block; width: 100%; box-sizing: border-box; margin-bottom: 2rem; }

.serveWide .button-container { display: block; width: 100%; box-sizing: border-box; }

@media (min-width:768px) {
  .serveWide { padding: 0 2rem; }
}

@media (min-width: 1024px) {
  .serveWide { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; text-align: left; }
  .serveWide .iconBox { flex-basis: 17%; box-sizing: border-box; margin-bottom: 0; }
  .serveWide .iconBox > .icon { font-size: 5em; }
  .serveWide .whereText { flex-basis: 62%; box-sizing: border-box; padding-right: 4em; margin-bottom: 0; }
  .serveWide .button-container { flex-basis: 25%; box-sizing: border-box; }
}

.serveWide p { margin-bottom: 0; }

/* Highlight */

.highlight { display: block; text-align: center; padding: 2em; margin: 0 0 2rem; }

.highlight:last-child { margin-bottom: 0; }

.highlight .button-container .btn { white-space: normal; line-height: 1.35; display: block; width: 100%; }

@media (min-width: 768px) {
  .highlight { text-align: left; padding: 3rem; }
  .highlight .button-container .btn { display: inline-block; width: auto; }
}

.serveWide + .highlight { margin-top: 3rem; }

#volunteerOpps iframe, #volunteerOpps .fluid-width-video-wrapper iframe { border: none !important; }