.card {
    width: 400px;
    height: 268px;
}

.flip {
    width: inherit;
    height: inherit;
    transition: 0.7s;
    transform-style: preserve-3d;
    -webkit-animation: flip 2.5s ease;
            animation: flip 2.5s ease;
}

.front,
.back {
    width: inherit;
    height: inherit;
    color: 999999;
    backface-visibility: hidden;
    overflow: hidden;
}
.front {
    transform: translateZ(0);
}


.card-header,
.card-footer{
    display: flex;
    position: relative;
    width: 100%;
}

.dates-container {
    float: left;
    width: 70%;
    margin-left: 23px;
    margin-top: 10px;
    color: 999999;
    font-size: 19px;
    text-align: left;
    font-family: 'Valencia Serial Heavy';
    font-weight: bold;
    color: #525252;
}


.card-header .up-arrow-container {
    position: absolute;
    left: 184px;
    top: -6px;
}
.card-header .down-arrow-container {
    position: absolute;
    left: 184px;
    top: 242px;
}

.arrow-container img.up-arrow{
    width: 32px;
    height: 32px;
}

.links-container {
    float: right;
    width: 30%;
    margin-top: 10px;
    padding-right: 10px;
    text-align: right;
    align-items: center;    
}

.links-container a {
    text-decoration: none; 
}

.card-title {
    position: relative;
    margin-left: 20px;
    text-transform: uppercase;
    font-size: 22px;
    color: #454545;
    text-align: left;
    font-family: 'Tex Gyre Schola';
    font-style: italic;
    line-height: 1.1;
}

.card-title a.node-link{
    text-decoration: inherit;
    color: inherit;
} 

.card-description {
    position: relative;
    margin-top: 1px;
    margin-right: 20px;
    font-size: 12px;
    color: #454545;
    text-align: right;
    font-family: 'Tex Gyre Schola';
    font-style: italic;
}


.card-body {
display: flex;
padding-left: 20px;
}

.card-image {
    width: 25%;
    text-align: center;
    margin-top: 10px;
    overflow: hidden;
    float: left;
}

.card-blurb {
    width: 70%;
    padding-right: 10px;
    padding-left: 10px;
    font-size: 11px;
    float: right;
    line-height: 1.1;
}

.card {
perspective: 1000;
}

.back {
transform: rotateY(180deg) translateZ(0);
background: #ffffff;
}


.main-container {
display: flex;
}

.card-header-left {
width: 70%;
}

.card-header-right {
width: 30%;
}

/**
.card:hover .flip {
transform: rotateY(180deg);
}
**/