.tiles_products {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    position: relative;
    margin: -2.5em 0 0 -2.5em;
}
.tiles_products article {
    -moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    -ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    transition: transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    position: relative;
    margin: 2.5em 0 0 2.5em;
	background: #404040;
}
.tiles_products article:hover {
    -moz-transition: background-color 0.5s ease, opacity 0.5s ease;
    -webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
    -ms-transition: background-color 0.5s ease, opacity 0.5s ease;
    transition: background-color 0.5s ease, opacity 0.5s ease;
    background: #404040;
}
.tiles_products article.completelist {
    width: calc(25% - 2.5em);
    margin: 2.5em 0 0 2.5em;
    font-size: 0.7em;
}
.tiles_products article > .image {
    -moz-transition: -moz-transform 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease;
    -ms-transition: -ms-transform 0.5s ease;
    transition: transform 0.5s ease;
    position: relative;
    display: block;
    width: 100%;
	padding: 0.2em 0.2em 3.4em 0.2em;
    overflow: hidden;
}
.tiles_products article > .image img {
    display: block;
    width: 100%;
}
.tiles_products article > .image:before {
    pointer-events: none;
    -moz-transition: background-color 0.5s ease, opacity 0.5s ease;
    -webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
    -ms-transition: background-color 0.5s ease, opacity 0.5s ease;
    transition: background-color 0.5s ease, opacity 0.5s ease;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    z-index: 1;
}
.tiles_products article > .image:after {
    pointer-events: none;
    -moz-transition: opacity 0.5s ease;
    -webkit-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    opacity: 0.25;
    z-index: 2;
}
.tiles_products article > a {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -moz-align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    -moz-transition: background-color 0.5s ease, -moz-transform 0.5s ease;
    -webkit-transition: background-color 0.5s ease, -webkit-transform 0.5s ease;
    -ms-transition: background-color 0.5s ease, -ms-transform 0.5s ease;
    transition: background-color 0.5s ease, transform 0.5s ease;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 14.8em 0.2em 1em 0.2em;
    border-bottom: 0;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    z-index: 3;
}
.tiles_products article.completelist > a h2 {
    -moz-transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    -webkit-transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    -ms-transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    opacity: 1;
	color: #ffffff;
}
.tiles_products article > a > :last-child { margin: 0; }
.tiles_products article > a h2 { margin: 0; }


.tiles_products article:nth-child(6n - 5) > .image:before { background-color: #6fc3df; }
.tiles_products article:nth-child(6n - 4) > .image:before { background-color: #8d82c4; }
.tiles_products article:nth-child(6n - 3) > .image:before { background-color: #ec8d81; }
.tiles_products article:nth-child(6n - 2) > .image:before { background-color: #c75b9b; }
.tiles_products article:nth-child(6n - 1) > .image:before { background-color: #8ea9e8; }
.tiles_products article:nth-child(6n) > .image:before { background-color: #87c5a4; }

body:not(.is-touch) .tiles_products article:nth-child(6n - 5):hover > .image:before { background-color: #6fc3df; opacity: 0.4;}
body:not(.is-touch) .tiles_products article:nth-child(6n - 4):hover > .image:before { background-color: #8d82c4; opacity: 0.4;}
body:not(.is-touch) .tiles_products article:nth-child(6n - 3):hover > .image:before { background-color: #ec8d81; opacity: 0.4;}
body:not(.is-touch) .tiles_products article:nth-child(6n - 2):hover > .image:before { background-color: #c75b9b; opacity: 0.4;}
body:not(.is-touch) .tiles_products article:nth-child(6n - 1):hover > .image:before { background-color: #8ea9e8; opacity: 0.4;}
body:not(.is-touch) .tiles_products article:nth-child(6n):hover > .image:before { background-color: #87c5a4; opacity: 0.4;}

body:not(.is-touch) .tiles_products article:hover > .image:after {
    opacity: 0.0;
}
* + .tiles_products {
    margin-top: 2em;
}
body.is-preload .tiles_products article {
    -moz-transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0;
}
@media screen and (max-width: 480px) {
    .tiles_products article.completelist {
        width: 100%;
    }
}
@media screen and (max-width: 1280px) {
    .tiles_products article.completelist { width: calc(20% - 2.5em); font-size: 0.55em; }
	.tiles_products article > a { padding: 14.7em 1em 0 1em; }
    .tiles_products { margin: -1.25em 0 0 -1.25em; }
    .tiles_products article { margin: 1.25em 0 0 1.25em; }
}
@media screen and (max-width: 1080px) {
    .tiles_products article > a { padding: 13.7em 1em 0 1em; }
}
@media screen and (max-width: 1010px) {
    .tiles_products article > a { padding: 12.7em 1em 0 1em; }
}
@media screen and (max-width: 980px) {
    .tiles_products article.completelist { width: calc(25% - 2.5em); }
    .tiles_products article > a { padding: 16em 1em 0 1em; }
    .tiles_products { margin: -2.5em 0 0 -2.5em; }
    .tiles_products article { margin: 2.5em 0 0 2.5em; }
}
@media screen and (max-width: 955px) {
    .tiles_products article > a { padding: 15.5em 1em 0 1em; }
}
@media screen and (max-width: 930px) {
    .tiles_products article > a { padding: 15em 1em 0 1em; }
}
@media screen and (max-width: 880px) {
    .tiles_products article > a { padding: 14em 1em 0 1em; }
}
@media screen and (max-width: 736px) {
    .tiles_products article.completelist { width: calc(50% - 2.5em); font-size: 1em; }
    .tiles_products article > a { padding: 13em 1em 0 1em; }
    .tiles_products { margin: -1.25em 0 0 -1.25em; }
    .tiles_products article { width: calc(50% - 1.25em); margin: 1.25em 0 0 1.25em; }
    .tiles_products article:hover > .image { -moz-transform: scale(1.0); -webkit-transform: scale(1.0); -ms-transform: scale(1.0); transform: scale(1.0); }
}
@media screen and (max-width: 700px) {
    .tiles_products article > a { padding: 12em 1em 0 1em; }
}
@media screen and (max-width: 660px) {
    .tiles_products article > a { padding: 11em 1em 0 1em; }
}
@media screen and (max-width: 620px) {
    .tiles_products article > a { padding: 10em 1em 0 1em; }
}
@media screen and (max-width: 480px) {
    .tiles_products article.completelist { width: calc(100% - 2.5em); font-size: 1em; }
    .tiles_products article > a { padding: 12.7em 1em 0 1em; }
    .tiles_products { margin: 0; }
    .tiles_products article { margin: 1.25em 0 0 0; }
}


.tiles_products2 {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    position: relative;
    margin: -2.5em 0 0 -2.5em;
}
.tiles_products2 article {
    -moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    -ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    transition: transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease;
    position: relative;
    margin: 2.5em 0 0 2.5em;
	background: #404040;
}
.tiles_products2 article:hover {
    -moz-transition: background-color 0.5s ease, opacity 0.5s ease;
    -webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
    -ms-transition: background-color 0.5s ease, opacity 0.5s ease;
    transition: background-color 0.5s ease, opacity 0.5s ease;
    background: #404040;
}
.tiles_products2 article.completelist {
    width: calc(14.28571% - 2.5em);
    margin: 2.5em 0 0 2.5em;
    font-size: 0.45em;
}
.tiles_products2 article > .image {
    -moz-transition: -moz-transform 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease;
    -ms-transition: -ms-transform 0.5s ease;
    transition: transform 0.5s ease;
    position: relative;
    display: block;
    width: 100%;
	padding: 0.2em 0.2em 5.4em 0.2em;
    overflow: hidden;
}
.tiles_products2 article > .image img {
    display: block;
    width: 100%;
}
.tiles_products2 article > .image:before {
    pointer-events: none;
    -moz-transition: background-color 0.5s ease, opacity 0.5s ease;
    -webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
    -ms-transition: background-color 0.5s ease, opacity 0.5s ease;
    transition: background-color 0.5s ease, opacity 0.5s ease;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    z-index: 1;
}
.tiles_products2 article > .image:after {
    pointer-events: none;
    -moz-transition: opacity 0.5s ease;
    -webkit-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    opacity: 0.25;
    z-index: 2;
}
.tiles_products2 article > a {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -moz-align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    -moz-transition: background-color 0.5s ease, -moz-transform 0.5s ease;
    -webkit-transition: background-color 0.5s ease, -webkit-transform 0.5s ease;
    -ms-transition: background-color 0.5s ease, -ms-transform 0.5s ease;
    transition: background-color 0.5s ease, transform 0.5s ease;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 13em 0.2em 1em 0.2em;
    border-bottom: 0;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    z-index: 3;
}
.tiles_products2 article.completelist > a h2 {
    -moz-transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    -webkit-transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    -ms-transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out, color 0.4s ease-in-out;
    opacity: 1;
	color: #ffffff;
}
.tiles_products2 article > a > :last-child { margin: 0; }
.tiles_products2 article > a h2 { margin: 0; }


.tiles_products2 article:nth-child(6n - 5) > .image:before { background-color: #6fc3df; }
.tiles_products2 article:nth-child(6n - 4) > .image:before { background-color: #8d82c4; }
.tiles_products2 article:nth-child(6n - 3) > .image:before { background-color: #ec8d81; }
.tiles_products2 article:nth-child(6n - 2) > .image:before { background-color: #c75b9b; }
.tiles_products2 article:nth-child(6n - 1) > .image:before { background-color: #8ea9e8; }
.tiles_products2 article:nth-child(6n) > .image:before { background-color: #87c5a4; }
/*
body:not(.is-touch) .tiles_products2 article:hover > .image {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
*/
body:not(.is-touch) .tiles_products2 article:nth-child(6n - 5):hover > .image:before { background-color: #6fc3df; opacity: 0.4;}
body:not(.is-touch) .tiles_products2 article:nth-child(6n - 4):hover > .image:before { background-color: #8d82c4; opacity: 0.4;}
body:not(.is-touch) .tiles_products2 article:nth-child(6n - 3):hover > .image:before { background-color: #ec8d81; opacity: 0.4;}
body:not(.is-touch) .tiles_products2 article:nth-child(6n - 2):hover > .image:before { background-color: #c75b9b; opacity: 0.4;}
body:not(.is-touch) .tiles_products2 article:nth-child(6n - 1):hover > .image:before { background-color: #8ea9e8; opacity: 0.4;}
body:not(.is-touch) .tiles_products2 article:nth-child(6n):hover > .image:before { background-color: #87c5a4; opacity: 0.4;}

body:not(.is-touch) .tiles_products2 article:hover > .image:after {
    opacity: 0.0;
}
* + .tiles_products2 {
    margin-top: 2em;
}
body.is-preload .tiles_products2 article {
    -moz-transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0;
}
@media screen and (max-width: 480px) {
    .tiles_products2 article.completelist {
        width: 100%;
    }
}
@media screen and (max-width: 1280px) {
    .tiles_products2 article.completelist { width: calc(20% - 2.5em); font-size: 0.55em; }
	.tiles_products2 article > a { padding: 14.7em 1em 0 1em; }
    .tiles_products2 { margin: -1.25em 0 0 -1.25em; }
    .tiles_products2 article { margin: 1.25em 0 0 1.25em; }
}
@media screen and (max-width: 1080px) {
    .tiles_products2 article > a { padding: 13.7em 1em 0 1em; }
}
@media screen and (max-width: 1010px) {
    .tiles_products2 article > a { padding: 12.7em 1em 0 1em; }
}
@media screen and (max-width: 980px) {
    .tiles_products2 article.completelist { width: calc(25% - 2.5em); }
    .tiles_products2 article > a { padding: 16em 1em 0 1em; }
    .tiles_products2 { margin: -2.5em 0 0 -2.5em; }
    .tiles_products2 article { margin: 2.5em 0 0 2.5em; }
}
@media screen and (max-width: 955px) {
    .tiles_products2 article > a { padding: 15.5em 1em 0 1em; }
}
@media screen and (max-width: 930px) {
    .tiles_products2 article > a { padding: 15em 1em 0 1em; }
}
@media screen and (max-width: 880px) {
    .tiles_products2 article > a { padding: 14em 1em 0 1em; }
}
@media screen and (max-width: 736px) {
    .tiles_products2 article.completelist { width: calc(50% - 2.5em); font-size: 1em; }
    .tiles_products2 article > a { padding: 13em 1em 0 1em; }
    .tiles_products2 { margin: -1.25em 0 0 -1.25em; }
    .tiles_products2 article { width: calc(50% - 1.25em); margin: 1.25em 0 0 1.25em; }
    .tiles_products2 article:hover > .image { -moz-transform: scale(1.0); -webkit-transform: scale(1.0); -ms-transform: scale(1.0); transform: scale(1.0); }
}
@media screen and (max-width: 700px) {
    .tiles_products2 article > a { padding: 12em 1em 0 1em; }
}
@media screen and (max-width: 660px) {
    .tiles_products2 article > a { padding: 11em 1em 0 1em; }
}
@media screen and (max-width: 620px) {
    .tiles_products2 article > a { padding: 10em 1em 0 1em; }
}
@media screen and (max-width: 480px) {
    .tiles_products2 article.completelist { width: calc(100% - 2.5em); font-size: 1em; }
    .tiles_products2 article > a { padding: 12.7em 1em 0 1em; }
    .tiles_products2 { margin: 0; }
    .tiles_products2 article { margin: 1.25em 0 0 0; }
}