﻿body {
}

.report {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

    .report .blokitem {
        flex: 1;
        margin: 15px;
        max-width: 140px;
    }

    .report .blokitem.first {
        
        max-width: 290px;
    }

    .report .item {
        border-radius: 50%;
        border: 6px solid #ffffff;
        -webkit-box-shadow: 0 3px 10px 0 rgba(0,0,0,.15);
        box-shadow: 0 3px 10px 0 rgba(0,0,0,.15);
    }

        .report .item:first-of-type {
            margin-left: 0;
        }

        .report .item:last-of-type {
            margin-right: 0;
        }

        .report .item a {
            display: block;
            width: 100%;
        }

            .report .item a img {
                width: 100%;
                display: block;
                padding: 20px;
            }

    .report .titleLink {
        margin-top: 10px;
        display: block;
        text-align: center;
        font-size: 12px;
    }


.blokitem:nth-child(1) div.item {
    background: #F04C95;
}

    .blokitem:nth-child(1) div.item:hover {
        background: #d44383;
    }

.blokitem:nth-child(2) div.item {
    background: #B93F65;
}

    .blokitem:nth-child(2) div.item:hover {
        background: #a23759;
    }


.blokitem:nth-child(3) div.item {
    background: #83325B;
}

    .blokitem:nth-child(3) div.item:hover {
        background: #6d2a4c;
    }


.blokitem:nth-child(4) div.item {
    background: #8E836C;
}

    .blokitem:nth-child(4) div.item:hover {
        background: #756c58;
    }

.blokitem:nth-child(5) div.item {
    background: #7A798B;
}

    .blokitem:nth-child(5) div.item:hover {
        background: #656473;
    }


.blokitem div.item {
    background: #49458C;
}

    .blokitem div.item:hover {
        background: #3c3973;
    }
