card{
    display:block;
    position: relative;

    height:120px;
    width:calc(100% - 40px);
    margin-top:15px;
    margin-bottom: 15px;
    margin-left:20px;
    
    background : rgb(25,25,25);

    border-radius: 15px;
    border:none;
    overflow-y: hidden;
}

card.transparent
{
    background : transparent;
}

card > block{
    position: relative;
    display:inline-block;
    vertical-align: middle;
}

card > block.mid-vertical
{
    width:50%;
    margin:0;
    padding: 10px;
    box-sizing: border-box;
    height:100%;
}

card > block.thirdl-vertical
{
    width:33%;
    margin:0;
    padding: 10px;
    box-sizing: border-box;
    height:100%;
}
card > block.thirdm-vertical
{
    width:65%;
    margin:0;
    padding: 10px;
    box-sizing: border-box;
    height:100%;
}

card > block.mid-horizontal.sub
{
    width:100%;
    margin:0;
    padding: 10px;
    box-sizing: border-box;
    height:20px;
}

card > block.mid-horizontal.main
{
    width:100%;
    margin:0;
    padding: 10px;
    box-sizing: border-box;
    height:calc(100% - 20px);
}

card.big
{
    height:200px;
}

card.small
{
    height:70px;
}

card > block > canvas
{
    height:100% !important;
    width:100%;
    object-fit: cover;
}

card h2{
    position: relative;
    font-size: 13px;
}