/* ********************************** ********************************** */
/* *                           FEATURE-BOX                             * */
/* ********************************** ********************************** */


.ly-feature-container{
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    align-content: space-around;
    gap:1.0rem;
    row-gap:2.0rem;
}


.ly-feature-box {
    border-radius:var(--ly-border-radius-default);
    display: flex;
    flex-direction: column;
    width: 100%;
        
    border-bottom: 2px solid var(--ly-color-grey-light);
    border-left: 2px solid var(--ly-color-grey-light);
    border-right: 2px solid var(--ly-color-grey-light);
    
    
}

.ly-feature-topbar {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 4rem;    
    background: var(--ly-color-green);
    border-radius:var(--ly-border-radius-default);
    
}

.ly-feature-icon {
    border-radius:var(--ly-border-radius-default);
    width: 5em;
    background: var(--ly-color-violett);
    padding: 1em;
    text-align: center;
    zvalign: middle;
    height: 100%;
}

.ly-feature-icon i {
    font-size: var(--ly-font-size-icon);
    
    color: #fff;
}

.ly-feature-title,
.ly-feature-title p{
    /*Test*/
    color: #fff;
    width: 100%;
    margin-top: auto;
    margin-bottom: auto;
    padding-left: 0.4em;
    
    font-family: var(--ly-font-family-large) !important;
    font-size: var(--ly-font-size-large) !important;
    line-height: var(--ly-line-height-large) !important;
    letter-spacing: var(--ly-letter-spacing-large) !important;
}

.ly-feature-body,
.ly-feature-body p{
    border-radius:var(--ly-border-radius-default);
    
    /* font-size: calc(var(--ly-font-size-default) * 1.3); */
    zbackground: var(--ly-color-white-dark);
    color: var(--ly-color-grey-dark);    
    padding: 1.5rem;
    
    font-family: var(--ly-font-family-medium) !important;
    font-size: var(--ly-font-size-medium) !important;
    line-height: var(--ly-line-height-medium) !important;
    letter-spacing: var(--ly-letter-spacing-medium) !important;
    
}


/* .................................. .................................. */
/* .                            Media-Queries                          . */
/* ..................................................................... */

/* Styles für Bildschirme mit einer Mindestbreite von 0px */
@media only screen and (min-width: 0px) {
    
    .ly-feature-container{
        gap:2.0rem;
    }
    
    .ly-feature-box {
        width:100%;
    }
    

}


/* Styles für Bildschirme mit einer Mindestbreite von 576px */
@media only screen and (min-width: 576px) {

    
}


/* Styles für Bildschirme mit einer Mindestbreite von 992px */
@media only screen and (min-width: 768px) {
    .ly-feature-container{
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: stretch;
        align-content: stretch;
        gap: 2.0rem; 
        row-gap:6.0rem;
    }
    
    .ly-feature-box {
        width:47.7%;
    }
    
  
    
}


/* Styles für Bildschirme mit einer Mindestbreite von 992px */
@media only screen and (min-width: 992px) {
    
    
}


/* Styles für Bildschirme mit einer Mindestbreite von 1200px */
@media only screen and (min-width: 1200px) {
    .ly-feature-box {
        width:31.5%;
    }
    

}


/* Styles für Bildschirme mit einer Mindestbreite von 1400px */
@media only screen and (min-width: 1400px) {
}