@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body {
    font-family: Poppins;
    /* color: #073c8b; */
}

.p__custom {
    color: #6c757d;
}

.font__color {
    color: #073c8b;
}

/* soon */
.brand__logo img {
    width: 300px;
    position: absolute;
    display: flex;
    margin-top: 40px;
    top: 0;
}

.bg__img img {
    width: 100vw; 
    height: 100vh; 
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.hero__section h1{
    font-weight: bold;
    margin-top: 30vh;
    font-size: 72px;
    letter-spacing: 3px
}

.hero__section img {
    background: no-repeat center;
    background-size: cover;
    width: 100%;
    height: 100vh;
}

.hero__section::before img {
    background-color: rgba(0,0,0,0.6);
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/* Card Properti*/
.search-panel {
    background-color: #ffffff;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    border-radius: 20px;
    margin-top: -50px;
    padding: 20px;
}

.card-img-top{
    border-radius: 20px;
    padding: 10px;
    cursor: pointer;
}

.card {
    height: auto;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

.card-body {
    padding: 20px;
    margin-top: -10px;
}

.btn-outline-primary {
    border-radius: 50px;
    width: 150px;
    font-size: 12px;
}

.button-group button {
    border-radius: 50px;
    width: 130px;
    font-size: 12px;
}
/* end soon */

/* navbar */
.top__nav {
    background-color: #073c8b;
    font-size: 14px;
    height: auto;
    width: auto;
}

.navbar {
    background-color: #ffffff;
}

.nav-link {
    color: #073c8b;
    font-weight: normal;
    /* letter-spacing: 0.3px; */
    font-size: 15px;
}

.nav-link:hover {
    color: #0180e9;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: #0180e9;
}

.nav-item {
    margin-left: 20px;
}

/* .nav-link:hover::after {
    content: "";
    display: block;
    border-bottom: 2px solid #073c8b;
    width: 50%;
    padding-bottom: 5px;
    margin: auto;
    margin-bottom: -7px;
} */
/* end navbar */

/* header */
.header__beranda {
    width: 100%;
    height: 70vh;
    background-image: url(/img/bg-headerhome-fix.jpeg);
    background-size: cover;
    background-repeat: no-repeat;
}

.header__about {
    width: 100%;
    height: 70vh;
    background-image: url(/img/bg-headerabout.jpeg);
    background-position: 70%;
    background-size: cover;
    background-repeat: no-repeat;
}

.header__artikel {
    width: 100%;
    height: 70vh;
    background-image: url(/img/bg-headerartikel.jpg);
    background-position: 70%;
    background-size: cover;
    background-repeat: no-repeat;
}

.header__hubkami {
    width: 100%;
    height: 70vh;
    background-image: url(/img/bg-headerhubkami.jpg);
    background-position: 70%;
    background-size: cover;
    background-repeat: no-repeat;
}

.header__aset {
    width: 100%;
    height: 70vh;
    background-image: url(/img/bg-headerproperti.jpg);
    background-position: 70%;
    background-size: cover;
    background-repeat: no-repeat;
}

/* .banner__properti {
    text-align: center;
}

.parent {
    width: 100%;
    height: 70vh;
    overflow: hidden;
    position: relative;
    display: inline-block;
    cursor: pointer;
    filter: brightness(0.8);
}

.child {
    height: 100%;
    width: 100%;
    background-size: cover;
    transition: all 1.1s;
}

.bg-one {
    background-image: url(/img/banner_properti.jpg);
}

.parent:hover .child {
    transform: scale(1.2);
    filter: brightness(1.2);
} */

.banner__properti {
    width: 100%;
    height: 90vh;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.banner__properti img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    filter: brightness(0.5);
    transition: all 0.3s;
    z-index: -1;
}

.banner__properti:hover img {
    transform: scale(1.2);
    filter: brightness(0.7);
}

.search-beranda {
    margin-top: 4rem;
}

/* end */

.map__wrapper {
    max-width: 600px;
    position: relative;
}

.map__wrapper img {
    filter: blur(10px);
    border-radius: 40px;
}

.gmaps {
    border-radius: 10px;
    width: 100%;
}

.visi_misi-mobile {
    visibility: hidden;
}

/* button custom */
.btn__custom {
    font-weight: medium;
    font-size: 12px;
    border-radius: 30px;
    width: 120px;
}
/* end button custom */

/* footer */
.footer__mms {
    background-color: #0080e8;
    height: auto;
    width: auto;
}
/* end footer */

.modal-content {
    background-color: transparent;
    border: none;
}

.foto-img-mobile {
    visibility: hidden;
    width: 0;
    height: 0;
}

/* responsive */
@media (max-width: 577px) {
    .foto-img-fullscreen {
        visibility: hidden;
        width: 0;
        height: 0;
    }

    .foto-img-mobile {
        visibility: visible;
        width: auto;
        height: auto;
    }

    .navbar {
        z-index: 10;
    }

    dd {
        margin-bottom: 0.4rem;
    }
}

@media (max-width: 500px) {
    .brand__logo img{
        width: 200px;
    }

    .hero__section h1{
        font-weight: bold;
        font-size: 42px;
    }
}

@media (max-width: 769px) {
    .multi-img {
        width: 100% !important;
    }

    /* .top__nav {
        visibility: hidden;
    }

    .navbar {
        margin-top: -100px;
    } */
}
/* end */