/* ================================================================
   OCIA PUBLIC EVENTS
   ----------------------------------------------------------------
   Design foundation:
   CharityFund / job/events-grid-3column.html
   CharityFund / job/events-details-style2.html

   This file only adds OCIA-specific behavior and states.
   ================================================================ */


/* ================================================================
   EVENT GRID
   ================================================================ */

.ocia-events-grid{
  display:flex;
  flex-wrap:wrap;
}

.ocia-events-grid > [class*="col-"]{
  display:flex;
}

.ocia-events-grid .schedule-box{
  width:100%;
  margin-bottom:30px;
}


/* ================================================================
   EVENT MEDIA
   ================================================================ */

.ocia-event-thumb{
  position:relative;
  overflow:hidden;
  min-height:230px;
  background:#f4f4f4;
}

.ocia-event-thumb img{
  width:100%;
  height:100%;
  min-height:230px;
  object-fit:cover;
}

.ocia-event-placeholder{
  min-height:230px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.ocia-event-placeholder i{
  font-size:54px;
}


/* ================================================================
   STATUS
   ================================================================ */

.ocia-event-status{
  display:inline-block;
  margin-bottom:10px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
}


/* ================================================================
   META
   ================================================================ */

.ocia-event-meta{
  margin:0 0 15px;
  padding:0;
  list-style:none;
}

.ocia-event-meta li{
  margin-bottom:7px;
}

.ocia-event-meta i{
  width:20px;
}


/* ================================================================
   DETAIL
   ================================================================ */

.ocia-event-detail .thumb{
  margin-bottom:30px;
}

.ocia-event-detail__description{
  font-size:16px;
  line-height:1.8;
}

.ocia-event-detail__description p{
  margin-bottom:20px;
}

.ocia-event-detail-sidebar .widget{
  margin-bottom:30px;
}

.ocia-event-detail-sidebar .list-border li{
  padding:12px 0;
}

.ocia-event-detail-sidebar strong{
  display:block;
  margin-bottom:3px;
}


/* ================================================================
   HISTORICAL NOTICE
   ================================================================ */

.ocia-event-history-note{
  margin-bottom:30px;
  padding:18px 22px;
  border-left:4px solid currentColor;
  background:#fafafa;
}


/* ================================================================
   EMPTY / ERROR
   ================================================================ */

.ocia-event-state{
  width:100%;
  padding:45px 25px;
  text-align:center;
}

.ocia-event-state i{
  display:block;
  margin-bottom:15px;
  font-size:42px;
}


/* ================================================================
   RESPONSIVE
   ================================================================ */

@media (max-width:767px){

  .ocia-events-grid{
    display:block;
  }

  .ocia-events-grid > [class*="col-"]{
    display:block;
  }

}