/*
   Spezific styling for salvattore
   Feel free to edit it as you like
   More info at http://salvattore.com
 */

/* Base styles — only inside the news board, so floats do not leak */
.fh5co-board,
#fh5co-board {
    width: 100%;
    clear: both;
    overflow: hidden;
}
.fh5co-board .column,
#fh5co-board .column {
    float: left;
    box-sizing: border-box;
}
@media screen and (max-width: 767px) {
    .fh5co-board .column,
    #fh5co-board .column {
        float: none;
        position: relative;
        clear: both;
        width: 100%;
    }
}
.size-1of4 {
    width: 25%;
}
.size-1of3 {
    width: 33.333%;
}
.size-1of2 {
    width: 50%;
}

/* xs: 1 news (default, Bootstrap xs < 768px) */
.fh5co-board[data-columns]::before,
#fh5co-board[data-columns]::before {
    content: '1 .column';
    color: transparent !important;
}

/* sm: 2 news (≥ 768px) */
@media screen and (min-width: 768px) {
    .fh5co-board[data-columns]::before,
    #fh5co-board[data-columns]::before {
        content: '2 .column.size-1of2';
        color: transparent !important;
    }
}

/* md: 3 news (≥ 992px) */
@media screen and (min-width: 992px) {
    .fh5co-board[data-columns]::before,
    #fh5co-board[data-columns]::before {
        content: '3 .column.size-1of3';
        color: transparent !important;
    }
}

/* lg: 4 news (≥ 1200px) */
@media screen and (min-width: 1200px) {
    .fh5co-board[data-columns]::before,
    #fh5co-board[data-columns]::before {
        content: '4 .column.size-1of4';
        color: transparent !important;
    }
}
