.dp-section {
    clear: both;
    padding: 0px;
    margin: 0px;
}

.dp-group:before,
.dp-group:after {
    content: "";
    display: table;
}

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

.dp-group {
    zoom: 1;
    /* For IE 6/7 (trigger hasLayout) */
}

.dp-col {
    display: block;
    float: left;
    margin: 1% 0 1% 1.6%;
}

.dp-col img {
    max-width: 100%;
    height: auto;
    border: 0;
    box-shadow: none;
}

.dp-col:first-child,
.dp-col.firstcol {
    margin-left: 0;
    clear: left;
}


/*  GRID OF TWO   ============================================================================= */
.dp-col_2_of_2 {
    width: 100%;
}

.dp-col_1_of_2 {
    width: 49%;
}

/* all browsers except IE6 and lower */
@media only screen and (max-width: 480px) {
    .dp-col {
        margin: 1% 0 1% 0%;
    }

    .dp-col_2_of_2 {
        width: 49% !important;
    }

    .dp-col_1_of_2 {
        width: 49% !important;
    }

    .dp-col_1_of_2 .dp-img-wrapper>img {
        width: 140px !important;
        height: 140px !important;
    }
}

/*  GRID OF THREE   ============================================================================= */
.dp-col_3_of_3 {
    width: 100%;
}

.dp-col_2_of_3 {
    width: 66.13%;
}

.dp-col_1_of_3 {
    width: 32.26%;
}

@media only screen and (max-width: 480px) {
    .dp-col_3_of_3 {
        width: 100%;
    }

    .dp-col_2_of_3 {
        width: 100%;
    }

    .dp-col_1_of_3 {
        width: 100%;
    }
}

/*  GRID OF FOUR   ============================================================================= */
.dp-col_4_of_4 {
    width: 100%;
}

.dp-col_3_of_4 {
    width: 74.6%;
}

.dp-col_2_of_4 {
    width: 49.2%;
}

.dp-col_1_of_4 {
    width: 23.8%;
}

@media only screen and (max-width: 480px) {
    .dp-col_4_of_4 {
        width: 100%;
    }

    .dp-col_3_of_4 {
        width: 100%;
    }

    .dp-col_2_of_4 {
        width: 100%;
    }

    .dp-col_1_of_4 {
        width: 100%;
    }
}

/*  GRID OF FIVE   ============================================================================= */
.dp-col_5_of_5 {
    width: 100%;
}

.dp-col_4_of_5 {
    width: 79.68%;
}

.dp-col_3_of_5 {
    width: 59.36%;
}

.dp-col_2_of_5 {
    width: 39.04%;
}

.dp-col_1_of_5 {
    width: 18.72%;
}

@media only screen and (max-width: 480px) {
    .dp-col_5_of_5 {
        width: 100%;
    }

    .dp-col_4_of_5 {
        width: 100%;
    }

    .dp-col_3_of_5 {
        width: 100%;
    }

    .dp-col_2_of_5 {
        width: 100%;
    }

    .dp-col_1_of_5 {
        width: 100%;
    }
}

/*  GRID OF SIX   ============================================================================= */
.dp-col_6_of_6 {
    width: 100%;
}

.dp-col_5_of_6 {
    width: 83.06%;
}

.dp-col_4_of_6 {
    width: 66.13%;
}

.dp-col_3_of_6 {
    width: 49.2%;
}

.dp-col_2_of_6 {
    width: 32.26%;
}

.dp-col_1_of_6 {
    width: 15.33%;
}

@media only screen and (max-width: 480px) {
    .dp-col_6_of_6 {
        width: 100%;
    }

    .dp-col_5_of_6 {
        width: 100%;
    }

    .dp-col_4_of_6 {
        width: 100%;
    }

    .dp-col_3_of_6 {
        width: 100%;
    }

    .dp-col_2_of_6 {
        width: 100%;
    }

    .dp-col_1_of_6 {
        width: 100%;
    }
}