/* global definitions */
:root {
    --about-bg-color: #1D1D1B;
    --about-titel-color: #fcbf00;
    --about-text-color: #e0e0e0;
}

.sec_about {
    display: block;
    width: 100%;
    background-color: var(--about-bg-color);
    color: var(--about-text-color);

    & h1 {
        color: var(--about-titel-color);
    }

    & .text-blk {
        display: block;
        width: 100%;
        color: var(--about-text-color);

        & cite {
            display: block;
            width: 100%;
            color: var(--about-text-color);
            text-align: center;
        }

        & p {
            display: block;
            width: 100%;
            color: var(--about-text-color);
            text-align: center
        }
    }
}

@media screen and (min-width: 1200px) {
    .sec_about {
        padding: 3rem 0;

        & h1 {
            padding: 2.5rem 0rem;
            font-size: 5rem;
        }

        & .text-blk {
            padding: 3rem;

            & cite {
                padding: 1.5rem ;
                font-size: 3rem;
                font-weight: bold;
                font-style: normal;
            }

            & p {
                padding: 1rem ;
                font-size: 2rem;
            }
        }
    }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
    .sec_about {
        padding: 5rem 0;

        & h1 {
            padding: 1.5rem 0rem;
            font-size: 5rem;
        }

        & .text-blk {
            padding: 3rem;

            & cite {
                padding: 1.5rem ;
                font-size: 2.7rem;
                font-weight: bold;
                font-style: normal;
            }

            & p {
                padding: 1rem ;
                font-size: 1.8rem;
            }
        }
    }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
    .sec_about {
        padding: 5rem 0;

        & h1 {
            padding: 1.5rem 0rem;
            font-size: 5rem;
        }

        & .text-blk {
            padding: 3rem;

            & cite {
                padding: 1.5rem ;
                font-size: 2.7rem;
                font-weight: bold;
                font-style: normal;
            }

            & p {
                padding: 1rem ;
                font-size: 1.8rem;
            }
        }
    }
}

@media screen and (min-width: 480px) and (max-width: 768px) {
    .sec_about {
        padding: 5rem 0;

        & h1 {
            padding: 1.5rem 0rem;
            font-size: 4rem;
        }

        & .text-blk {
            padding: 3rem;

            & cite {
                padding: 1.5rem ;
                font-size: 2.7rem;
                font-weight: bold;
                font-style: normal;
            }

            & p {
                padding: 1rem ;
                font-size: 1.8rem;
            }
        }
    }
}

@media screen and (max-width: 480px) {
    .sec_about {
        padding: 5rem 0;

        & h1 {
            padding: 1.5rem 0rem;
            font-size: 5rem;
        }

        & .text-blk {
            padding: 3rem;

            & cite {
                padding: 1.5rem ;
                font-size: 2.2rem;
                font-weight: bold;
                font-style: normal;
            }

            & p {
                padding: 1rem ;
                font-size: 1.6rem;
            }
        }
    }
}