/* body {
    background-color: rgb(193, 195, 199);
} */


.navbar-brand, .navbar-utama a {
    color: black !important;
}

.navbar-fixed-top.scrolled {
    /* background-color: rgb(146, 100, 100) !important;
    transition: background-color 200ms linear; */
    box-shadow: 0 0 0 1px rgba(226, 226, 226, 0.7);
  }

.navbar-utama a{
    margin-left: 25px;

}

/* navbar becomes mobile sidebar under lg breakpoint */
@media (max-width: 992px) {
    
    .navbar-collapse.collapsing .navbar-nav {
        z-index: 999;
        background-color: rgba(255, 255, 255, 0.97);
        color: black;
        display: block;
        position: fixed;
        top: 0;
        bottom: 0;
        left: -45%;
        transition: all 0.2s ease;
    }

    .navbar-collapse.show .navbar-nav {
        z-index: 999;
        background-color: rgba(255, 255, 255, 0.97);
        color: black;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        flex-direction: column;
        height: auto;
        width: 75%;
        transition: left 0.35s ease;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }
}

.tombol-sign:hover {
    background-color: white!important;
}

section.hero {
    margin-top: 100px;
}

.banner h3{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 50px;
    font-weight: bold;
}

.banner p {
    font-size: 19px;
}

.services, .services2 {
    margin-top: 122px;
}

@media (max-width: 991.98px) { 
    .services, .services2 {
        margin-top: 100px;
    }
 }

.services p, .services2 p{
    font-family: 'Roboto';
    font-size: 16px;
    color: #87A1B6;
}

.services h3, .services2 h3 {
    font-family: 'Nunito Sans';
    font-size: 40px;
    font-weight: 600;
}

/* ============ Skills ============== */


.card {
    min-height: 150px;
}

/* Tablet Screen < */
@media (max-width: 575.98px) {
    .card-title {
        font-size: 9px;
    }
}

.ig-color {
    color: white;
}

.html5-color {
    color: orange;
}

.css3-color {
    color: blue;
}

.js-color {
    color: #f0db4f;
}

.bootstrap-color {
    color: #b283fa;
}

.react-color {
    color: #61dbfb;
}

.nodejs-color {
    color: #31e272;
}

.php-color {
    color: #8993be;
}

.laravel-color {
    color: red;
}

.ci-color {
    color: #dd4814;
}

.java-color {
    color: #5382a1;
}

.fb-color {
    color: #4267B2;
}

.insta-color {
    color: #fd1d1d;
}

.wa-color {
    color: #25D366;
}

.line-color {
    color: #00B900;
}
.linkedin-color {
    color: #0e76a8;
}
/* ============= Skills ================ */



@media (max-width: 991.98px) { 
    .navbar-utama a{
        margin-left: 0;
    }
 }


/* ==== Bagian Plan ==== */

.plan .border-biru {
    border-top: 6px solid #0593FA;
}

.plan .harga-plan-biru {
    color: #0593FA;
}

.plan .border-hijau {
    border-top: 6px solid #56CBAE;
}

.plan .harga-plan-hijau {
    color: #56CBAE;
}

.plan .border-merah {
    border-top: 6px solid #FA6770;
}

.plan .harga-plan-merah {
    color: #FA6770;
}


/* Terakhir */

.akhir {
    margin-top: 122px;
}

@media (max-width: 991.98px) { 
    .akhir {
        margin-top: 100px;
    }
}