/*
 * Copyright (c) 2018 Eclipse Foundation, Inc.
 * 
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License v. 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0.
 * 
 * Contributors:
 *   Christopher Guindon <chris.guindon@eclipse-foundation.org>
 * 
 * SPDX-License-Identifier: EPL-2.0
*/

// Based off the work done by Eric Poirier <eric.poirier@eclipse-foundation.org>
// for the newsletter page.

// Featured-centered-item

.featured-centered-item {
  height:260px;
  text-align: center;
  white-space: nowrap;
  position:relative;
  @media (max-width: 1200px) {
    height:205px;
  }
  @media (max-width: 768px) {
    margin-bottom:15px;
  }
  &:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
  }
  .centered-item {
    display: inline-block;
    vertical-align: middle;
    @media (max-width: 1200px) {
      width:205px;
      padding:20px;
    }
    @media (max-width: 480px) {
      width: 165px;
      padding:20px;
    }
    img {
      display:inherit;
    }
  }
  
  a.hidden-item {
    opacity:0;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    background-color:rgba(0,0,0,0.8);
    &:hover {
      opacity:1;
      text-decoration:none;
    }
  }
  
  a {
    position:absolute;
    display:table;
    z-index:9;
    top:0;
    left:0;
    height:260px;
    @media (max-width: 1200px) {
      height:205px;
    }
    width:100%;
    padding: 20px;
    white-space: normal;
    color:#fff;
    .item-title, .item-description{
      color:#fff;
      display:block;
      margin-bottom:10px;
    }
    .item-title {
      text-transform: uppercase;
      font-size:18px;
      font-weight:300;
    }
    .item-description {
      @media (max-width: 1200px) {
        display:none;
      }
    }
    .arrow {
      font-size:2em;
      color:#fff;
    }
    .centered-vertical-item {
      display:table-cell;
      vertical-align:middle;
    }
  }
}

