﻿
.chart-sponsoring{
    position: relative;    
}

.sponsoring-chart{
    margin: auto;
    width: 1036px !important;
    height: 518px !important;
}

.c-label{
    width: 228px;
    height: 79px;
    position: absolute;
    top: 50%;
    left:50%;
    transform: translate(-50%, -50%);
    display: block;
}

.text-sponsoring-chart {
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    font-size: 38px;
}

#sonstiges {
    margin-top: -290px;
    margin-left: -125px;
}

#umwelt {
    margin-top: -240px;
    margin-left: -180px;
}

#wirtschaft {
    margin-top: 0;
    margin-left: -375px;
}

#sport {
    margin-top: -140px;
    margin-left: -340px;
}

#soziales {
    margin-top: -170px;
    margin-left: 320px;
}

#bildung{
    margin-top: 180px;
    margin-left: 330px;
}

#kultur{
    margin-top: 285px;
    margin-left: 200px;
}

.spenden {
    width: 330px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    margin-left: -450px;
    margin-top: 300px;
}

.spenden-text{
    font-size: 30px;
    font-family: var(--font-SK-Head);
    font-weight: 600;
    
}

.mt-section-impression{
    margin-top: 300px;
}

@media (max-width: 1440px) {
    
    .spenden{
        margin-left: -300px;
    }
}


@media (min-width: 1024px) {
    
    .c-label{
        display: block;
    }
    
    .c-m-label{
        display: none;
    }
    
}

@media (max-width: 1023px ) {
    
    .c-label{
        display: none;
    }

    .sponsoring-chart{
        margin: auto;
        width: 600px !important;
        height: 300px !important;
    }
    
    .spenden{
        margin-left: -200px;
        margin-top: -250px;
    }

    .c-m-label{
        position: absolute;
        width: 200px;
        top: 50%;
        left:50%;
        transform: translate(-50%, -50%);
        display: block;
    }


    #m-sonstiges {
        margin-top: 350px;
        margin-left: -120px;
    }

    #m-umwelt {

        margin-top: 300px;
        margin-left: 120px;
    }

    #m-wirtschaft {
        margin-top: 250px;
        margin-left: 120px;
    }

    #m-sport {
        margin-top: 300px;
        margin-left: -120px;

    }

    #m-soziales {
        margin-top: 200px;
        margin-left: -120px;

    }

    #m-bildung{
        margin-top: 200px;
        margin-left: 120px;

    }

    #m-kultur{
        margin-top: 250px;
        margin-left: -120px;

    }


    .mt-section-impression{
        margin-top: 500px;
    }
    
}

@media (max-width: 767px) {

    .sponsoring-chart{
        width: 420px !important;
        height: 210px !important;
    }

    .text-sponsoring-chart{

        font-size: 24px;

    }

    .spenden{
        margin-left: -40px;
        margin-top: -150px;
        width: 300px;
    }

    .spenden-text{
        font-size: 24px;
    }

    .c-m-label{
        position: absolute;
        width: 200px;
        top: 50%;
        left:50%;
        transform: translate(-50%, -50%);
        display: block;
    }


    #m-sonstiges {
        margin-top: 450px;
        margin-left: 0;
    }

    #m-umwelt {

        margin-top: 400px;
        margin-left: 0;
    }

    #m-wirtschaft {
        
        margin-top: 350px;
        margin-left: 0;
    }

    #m-sport {
        margin-top: 300px;
        margin-left: 0;
    }

    #m-soziales {
        margin-top: 150px;
        margin-left: 0;
    }

    #m-bildung{
        margin-top: 200px;
        margin-left: 0;
    }

    #m-kultur{
        margin-top: 250px;
        margin-left: 0;
    }


    .mt-section-impression{
        margin-top: 500px;
    }


}


@media (max-width: 426px) {

    .sponsoring-chart{
        width: 360px !important;
        height: 180px !important;
    }

    .text-sponsoring-chart{
        margin-top: 5px;
         font-size: 18px;

    }

    .spenden{
        margin-left: -20px;
        margin-top: -150px;
        width: 230px;
    }

    .spenden-text{
        font-size: 16px;
    }

    .c-m-label{
        position: absolute;
        width: 200px;
        top: 50%;
        left:50%;
        transform: translate(-50%, -50%);
        display: block;
    }

    #m-sonstiges {
        margin-top: 450px;

    }

    #m-umwelt {

        margin-top: 400px;

    }

    #m-wirtschaft {
        margin-top: 350px;

    }

    #m-sport {
        margin-top: 300px;

    }

    #m-soziales {
        margin-top: 150px;

    }

    #m-bildung{
        margin-top: 200px;

    }

    #m-kultur{
        margin-top: 250px;

    }


    .mt-section-impression{
        margin-top: 500px;
    }  
    
}



@media (max-width: 321px) {

    .sponsoring-chart{
        width: 300px !important;
        height: 150px !important;
    }
    
    .text-sponsoring-chart{
       
        font-size: 16px;
        
    }

    .spenden{
        margin-left: -20px;
        margin-top: -130px;
        width: 230px;
    }
    
    .spenden-text{
        font-size: 16px;
    }
    
    .c-m-label{
        position: absolute;
        width: 150px;
        top: 50%;
        left:50%;
        transform: translate(-50%, -50%);
        display: block;
    }

    #m-sonstiges {
        margin-top: 450px;

    }

    #m-umwelt {

        margin-top: 400px;

    }

    #m-wirtschaft {
        margin-top: 350px;

    }

    #m-sport {
        margin-top: 300px;

    }

    #m-soziales {
        margin-top: 150px;

    }

    #m-bildung{
        margin-top: 200px;

    }

    #m-kultur{
        margin-top: 250px;

    }
    
    
    .mt-section-impression{
        margin-top: 500px;
    }
}