/*======================================
Theme Name: tyremix Child
Theme URI: https://www.plappermaul.at
Description: Child Theme Yootheme tyremix
Version: 1.0
Author: Reinhard Ekker
Author URI: https://www.plappermaul.at
Template: yootheme
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
======================================*/

.ppm-aktionen-grid .el-item .el-title {
    font-size: 22px;
    line-height: 1.4;
    font-family: niveau-grotesk;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0;
    color: #179CDA;
}

.ppm-aktionen-grid [class*="el-gueltig"] {
    display: block;
    font-size: 17px;
    line-height: 1.4;
    font-weight: 700;
}

.ppm-aktionen-grid .el-gueltig-von::before {
    content: "Gültig vom "
}

.ppm-aktionen-grid .el-gueltig-bis::before {
    content: "bis zum "
}

.ppm-aktionen-grid > div {
    background-color: #1d1d1d;
    padding: 0 !important;
    flex: 0 1 30% !important;
}

.ppm-aktionen-grid {
    gap: 32px !important;
    flex-wrap: wrap;

}

.ppm-aktionen-grid .el-item div:last-child {
    margin-bottom: 20px;
}

.ppm-aktionen-grid .el-item .el-title,
.ppm-aktionen-grid .el-item .el-title ~ div {
    padding: 0 20px;
}

.ppm-aktionen-grid .el-item picture img {
    width: 100%;
}

/* RESPONSIVE IMAGE */

.ppm-aktionen-grid .el-item picture {
    display: none;
}

.ppm-aktionen-grid .el-item picture:only-of-type {
    display: block !important;
}

.ppm-aktionen-section .uk-container > .uk-grid {
    margin: 0 !important;
}

@media screen and (max-width: 767px) {
    .ppm-aktionen-grid .el-item picture:last-of-type {
        display: block !important;
    }
}

@media screen and (min-width: 768px) {
    .ppm-aktionen-grid .el-item picture:first-of-type {
        display: block !important;
    }
}

@media screen and (max-width: 1023px) {
    .ppm-aktionen-grid > div {
        flex: 1 1 100% !important;
    }
}

@media screen and (min-width:768px) {
    .ppm-aktionen-grid > div {
        flex: 1 1 40% !important;
        max-width: calc(50% - 16px);
    }
}



/* AKTIONEN MENU ITEM */

.menu-item a sup::before {
    background: #179CDA;
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left:50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    border-radius: 50%;
}

.menu-item a sup {
    margin-left: 5px;
    transform: scale(.8);
}

.menu-item a:hover sup,
.menu-item a:active sup,
.menu-item a:focus sup,
.menu-item a:visited sup {
    color: #fff !important;
}

/* AKTIONEN GÜLTIGKEIT */

.el-gueltig-bis::before {
    content: "G\00fcltig bis " !important;
}

.el-gueltig-von + .el-gueltig-bis::before {
    content: "bis zum " !important;
}