.container {
    display: flex;
    flex-wrap: wrap;
}

.centered-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.container img {
    max-width: 100%;
}
.container .container-img {
    max-width: 100%;
}

/* XL */
.item-1-1 { margin: 0.5%; padding: 0.5%; width: 98%; }
.item-1-2 { margin: 0.5%; padding: 0.5%; width: 48%; }
.item-1-3 { margin: 0.5%; padding: 0.5%; width: 31.333%; }
.item-2-3 { margin: 0.5%; padding: 0.5%; width: 64.666%; }
.item-1-4 { margin: 0.5%; padding: 0.5%; width: 23%; }
.item-3-4 { margin: 0.5%; padding: 0.5%; width: 73%; }
.item-1-5 { margin: 0.5%; padding: 0.5%; width: 18%; }
.item-1-6 { margin: 0.5%; padding: 0.5%; width: 14.666%; }
.item-1-8 { margin: 0.5%; padding: 0.5%; width: 10.5%; }
.item-1-9 { margin: 0.5%; padding: 0.5%; width: 9.111%; }
.item-1-10 { margin: 0.5%; padding: 0.5%; width: 8%; }
.item-1-11 { margin: 0.5%; padding: 0.5%; width: 7.090%; }
.hidden { display: none; }

/* XL */
@media screen and (max-width: 1440px) {
    .xl-item-1-1 { width: 98%; }
    .xl-item-1-2 { width: 48%; }
    .xl-item-1-3 { width: 31.333%; }
    .xl-item-2-3 { width: 64.666%; }
    .xl-item-1-4 { width: 23%; }
    .xl-item-3-4 { width: 73%; }
    .xl-item-1-5 { width: 18%; }
    .xl-item-1-6 { width: 14.666%; }
    .xl-hidden { display: none; }
    .xl-visible { display: block; }
}

/* L */
@media screen and (max-width: 1200px) {
    .l-item-1-1 { width: 98%; }
    .l-item-1-2 { width: 48%; }
    .l-item-1-3 { width: 31.333%; }
    .l-item-2-3 { width: 64.666%; }
    .l-item-1-4 { width: 23%; }
    .l-item-3-4 { width: 73%; }
    .l-item-1-5 { width: 18%; }
    .l-item-1-6 { width: 14.666%; }
    .l-hidden { display: none; }
    .l-visible { display: block; }
}

/* M */
@media screen and (max-width: 992px) {
    .m-item-1-1 { width: 98%; }
    .m-item-1-2 { width: 48%; }
    .m-item-1-3 { width: 31.333%; }
    .m-item-2-3 { width: 64.666%; }
    .m-item-1-4 { width: 23%; }
    .m-item-3-4 { width: 73%; }
    .m-item-1-5 { width: 18%; }
    .m-item-1-6 { width: 14.666%; }
    .m-hidden { display: none; }
    .m-visible { display: block; }
}

/* S */
@media screen and (max-width: 768px) {
    .s-item-1-1 { width: 98%; }
    .s-item-1-2 { width: 48%; }
    .s-item-1-3 { width: 31.333%; }
    .s-item-2-3 { width: 64.666%; }
    .s-item-1-4 { width: 23%; }
    .s-item-3-4 { width: 73%; }
    .s-item-1-5 { width: 18%; }
    .s-item-1-6 { width: 14.666%; }
    .s-hidden { display: none; }
    .s-visible { display: block; }
}

/* XS */
@media screen and (max-width: 506px) {
    .xs-item-1-1 { width: 98%; }
    .xs-item-1-2 { width: 48%; }
    .xs-item-1-3 { width: 31.333%; }
    .xs-item-2-3 { width: 64.666%; }
    .xs-item-1-4 { width: 23%; }
    .xs-item-3-4 { width: 73%; }
    .xs-item-1-5 { width: 18%; }
    .xs-item-1-6 { width: 14.666%; }
    .xs-hidden { display: none; }
    .xs-visible { display: block; }
}

/* XXS */
@media screen and (max-width: 360px) {
    .xxs-item-1-1 { width: 98%; }
    .xxs-item-1-2 { width: 48%; }
    .xxs-item-1-3 { width: 31.333%; }
    .xxs-item-2-3 { width: 64.666%; }
    .xxs-item-1-4 { width: 23%; }
    .xxs-item-3-4 { width: 73%; }
    .xxs-item-1-5 { width: 18%; }
    .xxs-item-1-6 { width: 14.666%; }
    .xxs-hidden { display: none; }
    .xxs-visible { display: block; }
}

/* High */
@media screen and (max-height: 680px) {
    .h-hidden { display: none; }
    .h-visible { display: block; }
}

/* Medium high */
@media screen and (max-height: 520px) {
    .mh-hidden { display: none; }
    .mh-visible { display: block; }
}

/* Tiny */
@media screen and (max-height: 430px) {
    .t-hidden { display: none; }
    .t-visible { display: block; }
}