/* Hauptblock */
.article {
    padding: .5% 1% 1% 1%;
    background-color: rgba(0, 0, 0, 0.9);
    color: #fff;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
    max-width: auto;
    width: auto;
    margin: 4% 1%; /* Standardmäßiger Abstand nach unten */
}

/* Flexbox Container */
.article__flex-container {
    display: flex;
    align-items: flex-start;
}

/* Linke und rechte Seiten der Flexbox */
.article__flex-item-left {
    flex: 1;
}

.article__flex-item-right {
    flex: 1;
    margin-left: 20px;
}

/* Elemente innerhalb des Blocks */
.article__title {
    font-size: 2vh;
    margin-bottom: 10px;
}

.article__subtitle {
    font-size: 1.6vh;
    margin-bottom: 8px;
}

.article__text {
    font-size: 1.1vh;
    margin-bottom: 6px;
}

.article__text-section {
    margin-bottom: 20px;
}

.article__image {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin-bottom: 15px;
}

/* Button */
.article__button {
    background-color: rgba(40, 90, 255, 0.8);
    color: #fff;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    display: inline-block;
    text-decoration: none;
}

.article__button:hover {
    background-color: rgba(30, 70, 200, 0.8);
}