@import ../../includes/_colors
@import ../../includes/_fonts
@import ../../includes/_mixins

body
    margin: 0
    font-family: Montserrat, sans-serif

p
    margin: 0

.aio-news-wrapper
    background-color: $color-rot
    width: 100vw
    height: 100vh
    display: flex
    justify-content: center
    gap: 60px
    @include mobile
        flex-direction: column

    .news-element
        background-color: $color-gruen
        display: flex
        flex-direction: column
        justify-content: center
        width: 40%
        @include tablet
            width: 30%
        @include mobile
            width: 80%
        height: 40%
        align-self: center
        p
            margin-left: 30px

        p:nth-child(1)
            font-weight: 300
            font-size: 20px
            @include mobile
                font-size: 30px
            padding-bottom: 0px

        p:nth-child(2)
            font-weight: 500
            font-size: 60px
            line-height: 60px
            padding-bottom: 20px

        p:nth-child(3)
            font-weight: 400
            font-size: 20px
            padding-bottom: 20px
            width: 80%

        a
            align-self: flex-end
            margin-right: 30px
            background-color: $color-weiss
            color: $color-rot
            text-decoration: none
            font-weight: 500
            padding: 8px
        a:hover
            background-color: $color-rot
            color: $color-weiss
            @include tablet
                background-color: $color-weiss
                color: $color-rot