.hidden {
    visibility: hidden;
}

.circle {
    width: 100px;
    border-radius: 10px;
    position: absolute;
    transition: all 1s ease;
    
}

    .circle.active {
        box-shadow: 0 0 30px white, 0 0 30px white;
    }

.icon {
    position: relative;
    min-width: 100px;
    min-height: 100px;
    border-radius: 10px;
    background-repeat: no-repeat;
    box-shadow: 0 0 5px white, 0 0 5px white;
    background-color: forestgreen;
}

    .icon a {
        min-width: 100px;
        min-height: 100px;
    }

    .icon:hover {
        box-shadow: 0 0 30px white, 0 0 30px white;
    }

    .icon:active {
        transform: translateY(4px);
    }

#icon1 {
    background-image: url('/images/hellwig-icons/waermepumpen_100.png'); 
}

#icon2 {
    background-image: url('/images/hellwig-icons/kaeltetechnik_100.png'); 
}

#icon3 {
    background-image: url('/images/hellwig-icons/sanitaer_100.png'); 
}

#icon4 {
    background-image: url('/images/hellwig-icons/wasserstoff_100.png');
}

#icon5 {
    background-image: url('/images/hellwig-icons/solar_100.png');
}

#icon6 {
    background-image: url('/images/hellwig-icons/pv-speicher_100.png'); 
}

#icon7 {
    background-image: url('/images/hellwig-icons/e-mobilitaet_100.png'); 
}

@media (max-width: 768px) {

    .circle {
        width: 75px;
        height: 75px;
    }

    .icon {
        width: 75px;
        height: 75px;
        min-width: 75px;
        min-height: 75px;
    }

        .icon:hover {
            box-shadow: 0 0 15px white, 0 0 15px white;
        }

    #icon1 {
        background-image: url('/images/hellwig-icons/solar.png');
    }

    #icon2 {
        background-image: url('/images/hellwig-icons/pv-speicher.png');
    }

    #icon3 {
        background-image: url('/images/hellwig-icons/e-mobilitaet.png');
    }

    #icon4 {
        background-image: url('/images/hellwig-icons/smart-home.png');
    }

    #icon5 {
        background-image: url('/images/hellwig-icons/waermepumpen.png');
    }

    #icon6 {
        background-image: url('/images/hellwig-icons/wasserstoff.png');
    }

    #icon7 {
        background-image: url('/images/hellwig-icons/kaeltetechnik.png');
    }
}