﻿/*
    Grid manual empleado en:
    - Envio de muestras
    - Sección Artículos
    Código y cálculos disponibles en:
    http://www.responsivegridsystem.com/calculator/
*/


.responsive-img {
    max-width: 100%;
    height: auto;
    display: block;
    width: 100%;
}

/*  SECTIONS  */
.ave-section {
    clear: both;
    padding: 0;
    margin: 0;
    text-align: left;
    position: relative;
}

/*  COLUMN SETUP  */
.ave-col {
    display: block;
    float: left;
    margin: 1% 0 1% 1%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .ave-col:first-child {
        margin-left: 0;
    }

/*  GROUPING  */
.ave-group:before,
.ave-group:after {
    content: "";
    display: table;
}

.ave-group:after {
    clear: both;
}

.ave-group {
    zoom: 1; /* For IE 6/7 */
}
/*  GRID OF TWELVE  */
.span_12_of_12 {
    width: 100%;
}

.span_11_of_12 {
    width: 91.58%;
}

.span_10_of_12 {
    width: 83.16%;
}

.span_9_of_12 {
    width: 74.75%;
}

.span_8_of_12 {
    width: 66.33%;
}

.span_7_of_12 {
    width: 57.91%;
}

.span_6_of_12 {
    width: 49.5%;
}

.span_5_of_12 {
    width: 41.08%;
}

.span_4_of_12 {
    width: 32.66%;
}

.span_3_of_12 {
    width: 24.25%;
}

.span_2_of_12 {
    width: 15.83%;
}

.span_1_of_12 {
    width: 7.416%;
}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
    .ave-col {
        margin: 1% 0 1% 0;
    }



    .span_1_of_12, .span_2_of_12, .span_3_of_12, .span_4_of_12, .span_5_of_12, .span_6_of_12, .span_7_of_12, .span_8_of_12, .span_9_of_12, .span_10_of_12, .span_11_of_12, .span_12_of_12 {
        width: 100%;
    }

    #content-listado-articulos .responsive-img {
        margin: auto;
    }

    #content-listado-articulos a.boton-ver {
        position: relative;
        float: right;
    }
}
