ul.samples {
    display: block;
    position: relative;
    padding-left: 0;
    overflow: hidden;
    margin-left: -50px;
    margin-top: 20px;
}

ul.samples li {
    width: 200px;
    height: 260px;
    position: relative;
    float: left;
    margin: 0 0 50px 50px;
    overflow: hidden;
    border: 3px solid #2c3959;
}

ul.samples li a {
    display: block;
    width: 200px;
    height: 260px;
    position: relative;
    background-position: 0 0;
    background-repeat: no-repeat;
}

ul.samples a div {
    display: none;
    position: absolute;
    left:0;
    bottom: 0;
    width: 90%;
    padding: 5%;
    background-color: #2c3959;
    color: #fff;
    text-align: center;
    font-family: 'MuseoSansCyrl';
    font-weight: 900;
}

ul.samples a:hover div {
    display: block;
}

ul.samples a span {
    display: block;
    font-size: 14px;
    line-height: 14px;
    color: #eee;
    font-family: 'MuseoSansCyrl';
    font-weight: 300;
}

ul.samples img {
    display: block;
    width: 200px;
    height: 260px;
}

@media all and (max-width: 480px) {
    body ul.samples {margin-left: 0; text-align: center}
    body ul.samples li {width: 150px; height: 195px; margin: 0 5px 10px 5px; display: inline-block; float: none}
    body ul.samples li img {width: 100%}
}

@media all and (max-width: 352px) {
    body ul.samples li {width: 140px; height: 182px; margin: 0 0 4px 0}
}