/* Base styles */
.column {float: left;}

/* div.post-image {width:100%; padding:20px 10px; text-align:center; background: #cc0;} */
div.post-image {width:100%; padding:20px 10px 40px 10px; text-align:center; background: #2FA1FF;}
div.event {background:#cc0;} 
div.video {background:#445;}
div.status {background:#cc0000;}
a.next-link {text-decoration:none; display:inline-block; padding:15px 30px; color:#fff; background:#2FA1FF; margin:20px auto 0; border-radius:2px;}
a.next-link:hover, a.next-link:active, a.next-link:visited {text-decoration:none; color:#fff; background:#2FA1FF;}
div.post-image img {width:120px; height:120px; border-radius:60px; border:2px solid #fff; padding:4px;  -webkit-transition: all 0.2s ease-in-out;  -moz-transition: all 1s ease-in-out;
  -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
div.post-image img:hover {border: 8px solid rgba(256, 256, 256, 0.5);}
#fh5co-board .item a {color:#666; font-weight:bold; display:inline-block; padding:10px 5px 0 0; font-size:12px;}
#fh5co-board .item a:hover {text-decoration:none;}
span.page-title {display:block; text-align:center; color: #fff; padding: 1em 0 0 0; font-size: 1.4em; font-weight: 100;}
div.item div.animate-box div.date {padding:6px 10px 2px 10px; background:#fff; color:#222; position:absolute; text-align:center; font-size:14px; font-weight:400; right:10px; border-radius: 4px; line-height:18px; border-top-right-radius:0; border-top-left-radius:0;}
div.item div.animate-box div.date span.year {display:block; font-size:11px;}
div.item div.animate-box div.caption {font-size:11px; color:#fff; text-align:left; position:absolute; bottom:0; left:5%; padding:8px 0 4px 0; width:75%; overflow:hidden; white-space: nowrap;}
footer a, footer a:hover {color:#999; text-decoration:none;}

@media screen and (max-width: 480px) {
    .column {
        float: none;
        position: relative;
        clear: both;
    }
}
.size-1of4 {
    width: 25%;
}
.size-1of3 {
    width: 33.333%;
}
.size-1of2 {
    width: 50%;
}


#fh5co-board[data-columns]::before {
    content: '4 .column.size-1of4';
}

/* Configurate salvattore with media queries */
@media screen and (max-width: 450px) {
    #fh5co-board[data-columns]::before {
        content: '1 .column';
    }
}

@media screen and (min-width: 451px) and (max-width: 700px) {
    #fh5co-board[data-columns]::before {
        content: '2 .column.size-1of2';
    }
}

@media screen and (min-width: 701px) and (max-width: 850px) {
    #fh5co-board[data-columns]::before {
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 851px) {
    #fh5co-board[data-columns]::before {
        content: '4 .column.size-1of4';
    }
}