.tx_tt3_tile {

    --primary: #019983;
    --secondary: #95c11e;

    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.tx_tt3_tile .tileelement {
    padding: 40px 40px;
    min-height: 250px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    position: relative;
}
.tx_tt3_tile .tileelement .element-backgroundimage {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 0;
}
.tx_tt3_tile .tileelement .element-text {
    hyphens: auto;
}
.tx_tt3_tile .tileelement .element-link {
    display: flex;
    align-items: flex-end;
}
.tx_tt3_tile .tileelement .element-link a {
    display: flex;
    line-height: 1.2;
    position: relative;
    padding-left: 2rem;
}
.tx_tt3_tile .tileelement .element-link a:before {
    content: '';
    mask-image: url("data:image/svg+xml; charset=utf8,<svg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='chevron-right' class='svg-inline--fa fa-chevron-right fa-w-10' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path fill='currentColor' d='M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z'></path></svg>");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    position: absolute;
    left: 0;
    top: 0;
    width: 14px;
    height: 100%;
    background-color: var(--primary);
}
.tx_tt3_tile .tileelement .element-icon {
    position: absolute;
    width: auto;
    right: 30px;
    height: 70%;
    display: flex;
    align-items: center;
    opacity: 0.1;
}
@media (min-width: 475px) {
    .tx_tt3_tile .tileelement .element-icon {
        opacity: 1;
    }
}
@media (min-width: 768px) {
    .tx_tt3_tile .tileelement .element-icon {
        height: 100%;
    }
}
.tx_tt3_tile .tileelement .element-icon img, .tx_tt3_tile .tileelement .element-icon svg {
    max-height: 70px;
}
.tx_tt3_tile .tileelement.has-text {
    padding: 30px 20px;
}
@media (min-width: 425px) {
    .tx_tt3_tile .tileelement.has-text {
        padding: 60px 40px;
    }
}
@media (min-width: 1200px) {
    .tx_tt3_tile .tileelement.has-text {
        padding: 80px 60px;
    }
}
.tx_tt3_tile .tileelement.has-title.has-text {
    display: flex;
    flex-direction: column;
}
.tx_tt3_tile .tileelement.has-title.has-text .element-title {
    display: flex;
    flex-direction: column;
}
@media (min-width: 992px) {
    .tx_tt3_tile .tileelement.has-title.has-text .element-title {
        min-height: 116px;
    }
}
@media (min-width: 1200px) {
    .tx_tt3_tile .tileelement.has-title.has-text .element-title {
        min-height: 200px;
    }
}
@media (min-width: 1440px) {
    .tx_tt3_tile .tileelement.has-title.has-text .element-title {
        min-height: 140px;
    }
}
@media (min-width: 1600px) {
    .tx_tt3_tile .tileelement.has-title.has-text .element-title {
        min-height: 140px;
    }
}
@media (min-width: 1680px) {
    .tx_tt3_tile .tileelement.has-title.has-text .element-title {
        min-height: 128px;
    }
}
.tx_tt3_tile .tileelement.has-icon {
    padding: 30px 30px;
    min-height: 150px;
}
@media (min-width: 475px) {
    .tx_tt3_tile .tileelement.has-icon {
        padding-right: 115px;
    }
}
@media (min-width: 768px) {
    .tx_tt3_tile .tileelement.has-icon {
        padding-right: 160px;
    }
}
.tx_tt3_tile .tileelement.min-300 {
    min-height: 300px;
}
.tx_tt3_tile .tileelement.min-400 {
    min-height: 400px;
}
.tx_tt3_tile .tileelement.min-500 {
    min-height: 500px;
}
.tx_tt3_tile .tileelement.min-600 {
    min-height: 600px;
}


/*
 *************************************************************************
 **                       Background (old classes)                      **
 *************************************************************************
*/
.tx_tt3_tile .tileelement.bg--none,
.tx_tt3_tile .tileelement.bg--transparent {
    background-color: transparent;
}
.tx_tt3_tile .tileelement.bg---primary {
    background-color: var(--primary);
    color: white;
}
.tx_tt3_tile .tileelement.bg---primary ul li:before {
    background-color: white;
}
.tx_tt3_tile .tileelement.bg---primary a {
    color: white;
}
.tx_tt3_tile .tileelement.bg---primary a:hover {
    color: var(--secondary);
}
.tx_tt3_tile .tileelement.bg---primary .element-link a:before {
    background-color: white;
}
.tx_tt3_tile .tileelement.bg---primary .element-link a:hover:before {
    background-color: var(--secondary);
}
.tx_tt3_tile .tileelement.bg---secondary {
    background-color: var(--secondary);
    color: white;
}
.tx_tt3_tile .tileelement.bg---secondary ul li:before {
    background-color: white;
}
.tx_tt3_tile .tileelement.bg---secondary a {
    color: white;
}
.tx_tt3_tile .tileelement.bg---secondary a:hover {
    color: var(--primary);
}
.tx_tt3_tile .tileelement.bg---secondary .element-link a:before {
    background-color: white;
}
.tx_tt3_tile .tileelement.bg---secondary .element-link a:hover:before {
    background-color: var(--primary);
}
.tx_tt3_tile .tileelement.bg--white {
    background-color: white;
    color: var(--primary);
}
.tx_tt3_tile .tileelement.bg--white ul li:before {
    background-color: var(--primary);
}
.tx_tt3_tile .tileelement.bg--white a {
    color: var(--primary);
}
.tx_tt3_tile .tileelement.bg--white a:hover {
    color: var(--primary);
}
.tx_tt3_tile .tileelement.bg--white .element-link a:before {
    background-color: var(--primary);
}
.tx_tt3_tile .tileelement.bg--white .element-link a:hover:before {
    background-color: var(--secondary);
}