body {
    background-color: white;
}

.header {

}

.footer {

}

.logo {
    width: 150px;
}

.navbar-bg {
    background-color: rgb(245, 245, 245);
}

.nav-link-custom {
    font-size: 28px;
    margin-left: 5px;
}

.game-container {
    border-radius: 75px;
}

.game-container-content {
    margin-left: 0px;
}

.cyf-container {
    background-image: url("img1/2pg_background.png");
}

.puzzlehub-container {
    background-image: url("img1/puzzlehub_background.png");
}
.puzzlehub-container .app-title, .puzzlehub-container .app-subtitle {
    color: black;
}

.bucos-container {
    background-image: url("img1/bucos_background.png");
}

.app-icon {
    width: 100%;
    border-radius: 60px;
}

.app-title {
    color: white;
    text-align: center;
}

.app-subtitle {
    color: rgb(255, 255, 255);
    opacity: 0.8;
    text-align: center;
}

.store-badge {
    height: 60px;
}

.lightgray-bg {
    background-color: rgb(240, 240, 240);
}

.logo-grid {
    width: 90%;  
}

.about-content {
    font-size: 1.8em;
}

.content-with-text {
    font-size: 1.2em;
}

.social-media-icon {
    margin-left: 15px;
    margin-right: 15px;
    width: 30px;
    height: 30px;
}

.apply-for-position-button {
    background-color: rgb(155, 208, 76);
    color: white;
    width: 100%;
    padding: 15px;
    text-align: center;
    font-size: 42px;
    border-radius: 50px;
    text-decoration: none!important;
    display: block;
}

.apply-for-position-button:hover {
    background-color: rgb(122, 172, 48);
}

@media (min-width: 576px) { 
    .game-container {
        border-radius: 90px;
    }
    
    .app-icon {
        width: 100%;
        border-radius: 70px;
    }
}

@media (min-width: 768px) { 
    .game-container {
        border-radius: 110px;
    }
    
    .app-icon {
        width: 100%;
        border-radius: 95px;
    }
}

@media (min-width: 992px) { 
    .game-container {
        border-radius: 55px;
    }

    .game-container-content {
        margin-left: 40px;
    }

    .store-badge {
        height: 70px;
    }

    .logo-grid {
        width: 70%;  
    }
        
    .app-icon {
        width: 100%;
        border-radius: 40px;
    }

    .app-title {
        text-align: left;
    }

    .app-subtitle {
        text-align: left;
    }
}

@media (min-width: 1200px) { 

}

@media (min-width: 1400px) { 
    
}