#kontakt__start {
    position: relative;
    width: 100vw;
    height: 100vh;
}

.kontakt__img {    
    width: auto;
    width: 75vw;
    height: 85vh;
    background-image: url("../img/Depositphotos_194509062_XL.jpg");
    background-size: cover;
    background-position: center;
}

.kontakt__header {
    width: 45%;
    background-color: #EC7304E5;
    bottom: 20vh;
}

.kontakt__header h2 {
    color: white;
    font-size: 6vh;
    padding: 7% 10%; 
    font-weight: 800;
    letter-spacing: .055em;
}

#kontakt__start .mousey {
    bottom: 5vh;
    left: 78vw;
}

#dane {
    background-color: #EC7304;
    color: white;
}

/* mapa */
#mapa {
    position: relative;
    background-color: white;
}

#dane {
    padding: 5em;
}

#dane .col-md-4 {
    padding-right: 2em;
}

#dane .btn {
    margin-top: 5em;
}

#dane .row:first-child {
    padding-bottom: 3em;
}

#mapa h3 {
    font-size: 1.75rem;
}

#mapa .col-md-6 {
    padding: 4em;
}

.mapa__header {
   padding: 5em;
   padding-bottom: 3em;
   padding-left: 0;
}

#mapa-wynik h5 {
    padding-bottom: 2em;
}

#mapa-wynik h4 {
    text-align: right;
    font-size: 4rem;
}

.doradca-dane {
    width: 25vw;
    height: 200px;
    padding: 2em 5em;
    background: #E5E5E5;
}

.qr img {
    width: 200px;
    height: 200px;
}

#id1,#id2,#id3,#id4 {
    display: none;
} 

g {
    cursor: pointer;
}

#map svg {
    width: 44vw;
    height: auto;
}

@media only screen and (max-width: 1600px) {
    .kontakt__img {
        height: 75vh;
    }
}

@media only screen and (max-width: 1366px) {
    .doradca-dane {
        padding: 2em 3em;
    }
}
    
@media only screen and (max-width: 1200px) {
    .kontakt__header {
        width: 65%;
        padding: 2em;
    } 

    #mapa-wynik h5 {
        padding-bottom: 1em;
    }

    .doradca{
        width: 45vw;
    }

    #kontakt__start .mousey {
        display: none;
    }

    .kontakt__header {
        width: 80%;
    }

    .kontakt__header h2 {
        font-size: 4vh;
    }

    .doradca-dane {
        padding: 1em 2em;
    }
}
 
@media only screen and (max-width: 920px) {

    .doradca {
        width: 60vw;
    }

    .doradca-dane {
        width: 35vw;
    }

    #map svg {
        display: block;
        width: 80vw;
        margin: 0 auto;
    }
}


@media only screen and (max-width: 820px) {
    .kontakt__header h2 {
        font-size: 5vh;
    }


    .mapa__header {
        padding-left: 1em;
    }

    .doradca {
        width: 80vw;
        margin-bottom: 2em;
    }

    .doradca-dane {
        width: 40vw;
    }
}


@media only screen and (max-width: 768px) {
    #dane .btn {
        margin-top: 16em;
    }
}


@media only screen and (max-width: 576px) {

    #dane {
        padding-bottom: 7em;
    }

    #dane .btn {
        position: absolute;
        bottom: 0;
        margin-top:20px;
        margin-bottom: 40px;
    }

    .doradca {
        width: 95vw;
    }

    .doradca-dane {
        width: 45vw;
        padding: 2em 1em;
    }
}

@media only screen and (max-width: 440px) {
    #dane {
        padding: 2em;
        padding-top: 3em;
        padding-bottom: 9em;
    }

    .kontakt__img {
        background-position: 30% 0;
    }

    .kontakt__header h2 {
        font-size: 4vh;
    }

    .kontakt__header {
        width: 80%;
        padding: 1em;
    }

    .mapa__header  {
        padding: 2em;
    }

    #mapa .col-1 {
        display: none;
    }

    #dane .btn {
        left: 50%;
        transform: translateX(-50%);
    }
}


@media only screen and (max-width: 360px) {

    .qr img {
        width: 45vw;
        height: 45vw;
    }

    .doradca-dane {
        width: 50vw;
        height: 45vw;
        padding: .5em;

    }


}

@media only screen and (max-width: 320px) {
    h5 {
        font-size: 1.15rem;
    }
}