.grid {
    position: relative;
    margin: 0 auto;
    max-width: 1000px;
    list-style: none;
    text-align: center;
}

/* Common style */
.grid figure {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.grid figure img {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}

.grid figure figcaption {
    padding: 2em;
    color: #fff;
    /*text-transform: uppercase;*/
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
    pointer-events: none;
}

.grid figure figcaption
/*.grid figure figcaption > a*/ {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */

/*
.grid figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}
*/

.grid .title {
    text-align: left;
    font-weight: bold;
    font-size: 20px;
}

.grid .subtitle {
    text-transform: uppercase;
    text-align: left;
}

.grid .price {
    text-align: left;
}

.grid figure h2 {
    word-spacing: -0.15em;
    font-weight: 300;
}

.grid figure h2 span {
    font-weight: 800;
}

/*
.grid figure h2,
.grid figure p {
    margin: 0;
}
*/

/*
.grid figure p.description {
    letter-spacing: 1px;
    font-size: 68.5%;
}
*/

/*---------------*/
/***** Zoe *****/
/*---------------*/

figure.effect-zoe figcaption {
    top: auto;
    bottom: 0;
    /*padding: 1em;*/
    /*height: 3.75em;*/
    background: #fff;
    color: #3c4a50;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    height: 100%;
    opacity: 0.9;
}

figure.effect-zoe h2 {
    float: left;
}

figure.effect-zoe p.icon-links a {
    float: right;
    color: #3c4a50;
    font-size: 1.4em;
}

figure.effect-zoe:hover p.icon-links a:hover,
figure.effect-zoe:hover p.icon-links a:focus {
    color: #252d31;
}

figure.effect-zoe p.description {
    padding: 15px 0;
    color: #999;
    opacity: 0;
    -webkit-transition: opacity 0.35s;
    transition: opacity 0.35s;
    -webkit-backface-visibility: hidden; /* Fix for Chrome 37.0.2062.120 (Mac) */
    text-align: left;
    font-size: 16px;
    line-height: 20px;
}

figure.effect-zoe h2,
figure.effect-zoe p.icon-links a,
figure.effect-zoe figcaption>a.btn,
figure.effect-zoe:hover .title,
figure.effect-zoe:hover .subtitle {
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(0,200%,0);
    transform: translate3d(0,200%,0);
}

figure.effect-zoe p.icon-links a span::before {
    display: inline-block;
    padding: 8px 10px;
    font-family: 'feathericons';
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

figure.effect-zoe h2 {
    display: inline-block;
}

figure.effect-zoe:hover p.description {
    opacity: 1;
}

figure.effect-zoe:hover figcaption,
figure.effect-zoe:hover h2,
figure.effect-zoe:hover p.icon-links a,
figure.effect-zoe:hover figcaption>a.btn,
figure.effect-zoe:hover .title,
figure.effect-zoe:hover .subtitle {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-zoe:hover h2,
figure.effect-zoe:hover .title,
figure.effect-zoe:hover .subtitle {
    -webkit-transition-delay: 0.05s;
    transition-delay: 0.05s;
}

figure.effect-zoe:hover p.icon-links a:nth-child(3) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

figure.effect-zoe:hover p.icon-links a:nth-child(2) {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

figure.effect-zoe:hover p.icon-links a:first-child,
figure.effect-zoe:hover figcaption>a.btn {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

figure.effect-zoe ul.list-inline {
    text-align: left;
    margin-bottom: 30px;
}

figure.effect-zoe ul.list-inline>li {
    background-color: #f5f5f5;
    line-height: normal;
    margin: 5px 5px 0 0;
    padding: 5px;
    border-radius: 5px;
    display: inline-block;
}

figure.effect-zoe ul.list-inline>li>a {
    color: #7cb021 !important;
}

figure.effect-zoe ul.list-inline>li>a:hover {
    text-decoration: none;
}

figure.effect-zoe .btn-orange.btn-outline {
    padding: 12px;
    font-size: 16px;
}