Template:Card/style.css

.card{ transition:0.2s ease-in; display:flex; }

.card:hover { box-shadow:0px 0px 7px 0px rgba(0,0,0,.6); z-index:99; position:relative; }

.card:hover .cardImg img{ transform: scale(1.04); outline:none; opacity:1.0; }

.card:hover .secondaryCard a{	text-decoration:none; color:#282828; }

.card.vertical{ flex-direction:column; height:100%; }

.card.horizontal{ flex-direction:row; }

@media (max-width:1000px) { .cardImg{ height:auto; }

}

.card.horizontal .mainCard{ flex:1; height:auto; max-height:none; }

.card.horizontal .secondaryCard{ flex:2; }

.mainCard { width:auto; }

.cardImg { display:flex; align-items: center; background:#282828; overflow:hidden; padding:0; max-height: 12em; }

.cardImg a{ width:100%; }

.cardImg img{ width: 100%; height: auto; transition: 0.4s ease-out; opacity:0.85; }

.secondaryCard { width:auto; padding:7px; }

.secondaryCard a{ color:#1A5793; }

.secondaryCard .byline { font-size:.9em; color:#4171A0; }

.secondaryCard h2 { margin-top:0; }