58 lines
1 KiB
CSS
58 lines
1 KiB
CSS
/*
|
|
Spezific styling for salvattore
|
|
Feel free to edit it as you like
|
|
More info at http://salvattore.com
|
|
*/
|
|
|
|
/* Base styles */
|
|
.column {
|
|
float: left;
|
|
}
|
|
@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';
|
|
}
|
|
}
|
|
|