﻿.referenceList { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 80px 0 0 0; padding: 0 10px; }
    .referenceList .item { width: 32%; margin: 0 2% 2% 0; background: #f5f5f5; }
        .referenceList .item:hover { box-shadow: 0px 2px 7px 2px #00000080; }
.referenceList .item:nth-child(3n) {margin: 0 0 2% 0;}

.referenceList .item .image {display:flex; justify-content:center; align-items:center; overflow:hidden; height:288px;}
.referenceList .item .image img {display:block; min-width:100%; min-height:100%;}
    .referenceList .item .info { display: block; padding: 24px 16px; }
    .referenceList .item .info .title {font-size:24px; font-weight:bold; display:block; margin: 0 0 10px 0;}
    .referenceList .item .info .desc {font-size: 16px; font-weight:normal; display:block;}
    .referenceList .item .info .squareMeters {display:flex; justify-content:flex-start; align-items:center; font-size:16px; font-weight:normal;}
        .referenceList .item .info .squareMeters img {width: 40px; display:block; margin: 0 20px 0 0;}


@media screen and (max-width: 1000px)
{
    .referenceList { margin: 40px 0 0 0; }

}

@media screen and (max-width: 800px)
{
    .referenceList .item { width: 100%; margin: 0 0 20px 0; }
        .referenceList .item .image { height: auto; max-height:230px;}

}