

.nav-link .bubble-text {
    color: white !important;
    font-size: 15px !important;
}
h1{
    font-size: 17.5px;
}
.top-bubble-col{
    margin-top: 10%;
}
.bubble-row {
    margin-bottom: 25px;
}

.headerImg{
    height: 1080px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('../assets/img_background_desktop.jpg');
}

.bubble{
    border-radius: 50%;
    width: 120px;
}

.nav-link{
    transition: color 0.3s ease;
}
.nav-link:hover img{
      width: 150px;
  }

@media (max-width: 1382px){
    .headerImg{
        height: 1080px;
    }
}

@media (max-width: 600px){
        .headerImg{
        width: 100vw;
        min-height: 525px;
        height: 60vh;
        /* position: relative; */
        background-repeat: no-repeat;
        background-size: cover;
        background-image: url('/assets/img_background.jpeg');
    }
    
    .bubble{
        border-radius: 50%;
        width: 80px;
    }

    .nav-link:hover img{
      width: 120px;
  }
}

@media (max-width: 414px ) {
    .bubble-text{
        font-size: 11.9px !important;
    }
    
    /* Keep bubbles in rows on mobile */
    .bubble-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: center !important;
    }
    
    .bubble-row .col,
    .bubble-row .top-bubble-col {
        flex: 0 1 auto !important;
        max-width: none !important;
        padding: 0 5px !important;
    }
}

@media (max-width: 420px ) {

    .bubble{
        border-radius: 50%;
        width: 80px;
    }

    .nav-link:hover img{
      width: 100px;
  }
}

@media (max-width: 380px ) {

    .nav-link:hover img{
      width: 100px;
    }
    
    .bubble-text{
        font-size: 10px !important;
    }
}