/* scss/Atoms/_Card.scss */

.card {
	display: flex;
	@include borderRadius(4px);
	@include box-shadow(0, 1px, 5px, rgba(0,0,0,0.2));
    align-items: center;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    padding: 1em 0;
    border: 1px solid rgba($primary-color, 0);
    transition: all .25s ease-in-out;
    width: 100%;

    &.interactive  {
        cursor: pointer;
        
        &:hover {
            border: 1px solid rgba($primary-color, 1);
            transition: all .25s ease-in-out;
        }
    }
    
}