.materials--front .header h2 {
    margin    : 0;
    font-size : 3.2rem;
}

.materials--front .header .link {
    text-align : right;
}

.materials--front .items {
    padding      : 0;
    margin       : 0;
    margin-right : -85%;
}

@media all and (min-width : 760px) {
    .materials--front .items {
        margin-left  : 0;
        padding-left : 0;
        margin-right : -33%;
    }
}

@media all and (max-width : 760px) {
    .materials--front .items .tns-ovh {
        overflow : visible;
    }

    .materials--front .items .tns-outer {
        margin-left  : -2rem;
        padding-left : 2rem;
    }

    .materials--front .items .tns-inner {
        padding-left : 2rem;
    }
}

@media all and (min-width : 1280px) {
    .materials--front .items {
        margin-right : 0;
    }
}

.materials--front--items {
    margin-top : 1.6rem;
    display    : flex;
}

.materials--front--items .item {
    display    : block;
    box-sizing : border-box;
    flex-basis : 50%;
}

@media all and (min-width : 760px) {
    .materials--front--items .item {
        flex-basis : 33.3333%;
        flex-grow  : 0.5;
    }
}

@media all and (min-width : 1380px) {
    .materials--front--items .item {
        flex-basis : 25%;
        flex-grow  : 0.3333;
    }
}

.materials--front--items .item .wrapper {
    border-radius  : 1.5rem;
    overflow       : hidden;
    border         : var(--border--common);
    box-sizing     : border-box;
    height         : 100%;
    display        : flex;
    flex-direction : column;
}

.materials--front--items .item .wrapper picture {
    display          : block;
    background-color : var(--color--background--gray);
}

.materials--front--items .item .wrapper picture img {
    display      : block;
    margin       : auto;
    aspect-ratio : 1.4;
    width        : 100%;
    height       : auto;
}

.materials--front--items .item .wrapper .description {
    padding        : 3.2rem;
    display        : flex;
    flex-direction : column;
    height         : 100%;
}

.materials--front--items .item .wrapper .description h3 {
    font-family : var(--font--walsheim);
    font-weight : 500;
    font-size   : 2rem;
    margin-top  : 0;
}

.materials--front--items .item .wrapper .description h3 a {
    color           : inherit;
    text-decoration : none;
}

.materials--front--items .item .wrapper .description h3 a:hover {
    color : var(--color--purple);
}

.materials--front--items .item .wrapper .description ul.properties {
    display : block;
    padding : 0;
    margin  : 0;
}

.materials--front--items .item .wrapper .description ul.properties li {
    color       : var(--color--gray);
    white-space : nowrap;
    display     : block;
}

@media all and (min-width : 760px) {
    .materials--front--items .item .wrapper .description ul.properties li {
        display : inline;
    }

    .materials--front--items .item .wrapper .description ul.properties li:not(:first-of-type) {
        position     : relative;
        padding-left : 1em;
    }

    .materials--front--items .item .wrapper .description ul.properties li:not(:first-of-type):before {
        content          : "";
        display          : block;
        position         : absolute;
        bottom           : 50%;
        left             : 0.25em;
        margin-bottom    : -1.5px;
        width            : 4px;
        height           : 4px;
        border-radius    : 50%;
        background-color : var(--color--gray);
        opacity          : 0.5;
    }
}

.materials--front--items .item .wrapper .description .bottom {
    margin-top      : auto;
    display         : flex;
    flex-direction  : row;
    flex-wrap       : nowrap;
    align-items     : flex-end;
    justify-content : space-between;
    padding-top     : 0.8rem;
}

.materials--front--items .item .wrapper .description .bottom .prices {
    color       : var(--color--purple);
    font-family : var(--font--comfortaa);
    white-space : nowrap;
    font-size   : 1.4rem;
}

.materials--front--items .item .wrapper .description .bottom .prices .prefix {
    font-family : var(--font--walsheim);
}

.materials--front--items .item .wrapper .description .bottom .prices .price {
    display     : inline-block;
    font-size   : 3.2rem;
    font-weight : bold;
}

.value.top__on-request {
	font-size: 2.5rem;
}

.materials--front--items .item .wrapper .description .bottom .prices .price .value {
    display : block;
}

.materials--front--items .item .wrapper .description .bottom .prices .price .old {
    color           : var(--color--gray);
    font-size       : 1.6rem;
    text-decoration : line-through;
    margin-bottom   : 0.8rem;
}

.materials--front--items .item .wrapper .description .bottom .prices .measure {
    display     : inline-block;
    font-family : var(--font--walsheim);
    margin-left : -0.125em;
}

.materials--front--items .item .wrapper .description .bottom .prices .measure:before {
    content      : "/";
    margin-right : 0.125em;
}

.materials--front--items .item .wrapper .description .bottom .actions {
    padding-left : 0.8rem;
}

@media all and (min-width : 760px) {
    .materials--front--items .item .wrapper .description .bottom .actions {
        transition : opacity var(--transition);
        opacity    : 0;
    }
}

.materials--front--items .item .wrapper .description .bottom .actions a.button,
.materials--front--items .item .wrapper .description .bottom .actions button {
    display   : block;
    padding   : 12px;
    min-width : 0;
}

@media all and (max-width : 760px) {
    .materials--front--items .item .wrapper .description .bottom .actions a.button span,
    .materials--front--items .item .wrapper .description .bottom .actions button span {
        display : none;
    }

    .materials--front--items .item .wrapper .description .bottom .actions a.button i.icon,
    .materials--front--items .item .wrapper .description .bottom .actions button i.icon {
        margin-left  : 0;
        margin-right : 0;
    }
}

.materials--front--items .item.tns-item {
    flex-basis : unset;
}

.materials--front--items .item:hover h3 {
    color : var(--color--purple);
}

.materials--front--items .item:hover h3 a {
    color : inherit;
}

.materials--front--items .item:hover .description .bottom .actions {
    opacity    : 1;
    transition : opacity var(--transition);
}

.materials--front .bottom {
    margin-top : 1.6rem;
}

/*# sourceMappingURL=style.css.map */