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

/* Base styles */
.column {
    float: left;
    width: 100%;
}
.size-1of6 {
    width: 16.66%;
}
.size-1of5 {
    width: 20%;
}
.size-1of4 {
    width: 25%;
}
.size-1of3 {
    width: 33.333%;
}
.size-1of2 {
    width: 50%;
}

/* Configurate salvattore with media queries */


/* Listadores de 5 */
@media screen and (max-width: 599px) {
    #timeline5[data-columns]::before {
      display: none;
        content: '1 .column';
    }
}

@media screen and (min-width: 600px) and (max-width: 799px) {
    #timeline5[data-columns]::before {
      display: none;
        content: '2 .column.size-1of2';
    }
}

@media screen and (min-width: 800px) and (max-width: 997px) {
    #timeline5[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 998px) and (max-width: 1199px) {
    #timeline5[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 1200px) and (max-width: 1399px) {
    #timeline5[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 1400px) and (max-width: 1599px) {
    #timeline5[data-columns]::before {
      display: none;
        content: '4 .column.size-1of4';
    }
}

@media screen and (min-width: 1600px) {
    #timeline5[data-columns]::before {
      display: none;
        content: '5 .column.size-1of5';
    }
}


/* Listadores de 4 */
@media screen and (max-width: 599px) {
    #timeline4[data-columns]::before {
        content: '1 .column';
        width: 0;
    }
}

@media screen and (min-width: 600px) and (max-width: 799px) {
    #timeline4[data-columns]::before {
      display: none;
        content: '2 .column.size-1of2';
    }
}

@media screen and (min-width: 800px) and (max-width: 997px) {
    #timeline4[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 998px) and (max-width: 1199px) {
    #timeline4[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 1200px) and (max-width: 1399px) {
    #timeline4[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

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


/* Listadores de 3 */
@media screen and (max-width: 599px) {
    #timeline3[data-columns]::before {
      display: none;
        content: '1 .column';
    }
}

@media screen and (min-width: 600px) and (max-width: 799px) {
    #timeline3[data-columns]::before {
      display: none;
        content: '2 .column.size-1of2';
    }
}

@media screen and (min-width: 800px) and (max-width: 997px) {
    #timeline3[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 998px) and (max-width: 1199px) {
    #timeline3[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}

@media screen and (min-width: 1200px) {
    #timeline3[data-columns]::before {
      display: none;
        content: '3 .column.size-1of3';
    }
}