
:root{
    --card_radius: 0px;
}

.card{
    /*max-width: 500px;*/
    transition: 0.3s;
    border-radius: var(--card_radius);
    /*margin-bottom: 5px;*/
}

.card-multicol{
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.card-text {
    word-wrap: break-word;
}

/* On mouse-over, add a deeper shadow */
.card-multicol:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.4);
}

.card img {
    max-width:100%;
    max-height:100%;
    float: none;
    /*margin-top: 10px;*/
    /*margin-left: 10px;*/
    /*margin-right: 10px;*/
    /*alignment: center;*/
    padding: 5px;
    border-radius: var(--card_radius);
}


.pressable{
    cursor: pointer;
    -webkit-filter: drop-shadow( 1px 3px 2px #666 );
    filter: drop-shadow( 1px 3px 2px #666 );

}

.pressable:hover{
    /*box-shadow: 0 5px #666;*/
    -webkit-filter: drop-shadow( 0px 5px 3px #666 );
    filter: drop-shadow( 0px 5px 3px #666 );
}

.pressable:active{
    /*box-shadow: 0 5px #666;*/
    -webkit-filter: drop-shadow( 0px 2px 1px #666 );
    filter: drop-shadow( 0px 2px 1px #666 );
    transform: translateY(1px);
}


.card-group{
    /*display: flex;*/
    flex-direction: row;
    flex-flow: row wrap;

}

.card .container{
    /*height: 250px;*/
    max-width: 100%;
    transition: 0.3s;
    border-radius: var(--card_radius);
    padding: 5px;

}

.card .card-body{
    padding: 5px;
    max-width: 100%;
    word-wrap: break-word;

}
.card .card-text{

    max-width: 100%;
    font-size: 1.0rem;
    word-wrap: break-word;

}

.card .card-title{
    font-size: 1.5rem;
}

/*.vbresultcards .card .card-footer{*/
.card .card-footer{
    max-width: 100%;
    height: 3ex;
    align-self: flex-end;
    flex: 1 1 auto;
    border-radius: 10px;
    padding: 3px;
}