@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@100;200;300;500&display=swap');
@font-face {
    font-family: 'Bellerose';
    /* The name you will use to refer to this font */
    src: url('assets/BELLEROSE.TTF') format('woff2');
    /* Preferred format */
    font-weight: normal;
    /* Specify font weight (optional) */
    font-style: normal;
    /* Specify font style (optional) */
}


/* @import url('https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@100&display=swap'); */


/* @font-face {
    font-family: LoversQuar;
    src: url(./LoversQuarrel-Regular.otf);
} */

html {
    overflow-x: hidden;
    /* overflow-y: hidden; */
    min-width: 1921px;
    font-family: 'Bellerose', serif;
    ;
    /* transform: scale(1); */
    /* scroll-behavior: smooth; */
}

html {
    zoom: 75%;
}

.tiperumah .rumahs .overlay {
    zoom: 140%;
}

* {
    scroll-behavior: smooth;
}

body {
    width: 100%;
    height: 100%;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    /* scroll-behavior: inherit; */
    overflow: hidden;
}

.loader-wrapper {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #03342b;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

.loader {
    display: inline-block;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: loader 2s infinite ease;
}

.loader-wrapper .loader img {
    width: 205px;
    height: auto;
    zoom: 120%;
}

@keyframes loader {
    0% {
        filter: saturate(80%) brightness(100%);
    }
    50% {
        filter: saturate(80%) brightness(130%);
    }
}

.menufasilitas {
    /* padding-top: 10.5rem; */
}

.contact {
    padding-top: 90px;
}

#tiperumah {
    display: block;
    height: 90px;
    visibility: hidden;
    margin-top: -90px;
}

.branch img,
.background img,
.bluebackground img {
    width: 99.7%;
}

a {
    text-decoration: none;
}

.dropmenu {
    display: none;
}


/* MENU */

header .iconmenu .dropmenu .dropitem,
.iconmenu {
    /* transition: background-color 100ms linear; */
}

header {
    width: 100%;
    display: flex;
    position: fixed;
    flex-direction: column;
    background-image: url('./assets/navbar.png');
    background-size: cover;
    background-position: center bottom;
    height: 4.938rem;
    padding-top: 1.8em;
    font-family: 'Kufam', sans-serif;
    /* font-weight: lighter; */
    z-index: 5;
}

.nav {
    height: 100%;
    background-color: transparent;
}

.logo {
    transition: all 200ms;
}

.logo:hover {
    filter: saturate(80%) brightness(120%);
}


/* header .iconmenu .logo:hover {
    background: url(./assets/Logo\ RYU\ \(2\).png);
    animation: ease-out 3000ms;
} */

header .iconmenu,
header .iconmenu .menu {
    display: flex;
    flex-flow: row;
    justify-content: flex-end;
    align-items: flex-end;
    height: 90%;
    font-size: 1.75rem;
}

header .menu .bar,
header .menu a,
header .dropmenu .dropitem a {
    text-decoration: none;
    display: flex;
    flex-flow: row;
    justify-content: center;
    font-style: normal;
    /* font-weight: bold; */
    font-size: 2.25rem;
    color: #FFFFFF;
    width: 14.48rem;
    align-items: flex-end;
    transition: width 0.2s ease-in;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

header .menu .bars {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-none;
}


/* header .menu .bar {
    border-bottom: solid #CCB416;
    width: 0;
    transition: width 0.2s ease-in;
} */

header .dropmenu .dropicon {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-evenly;
    width: 40px;
    height: 50px;
    /* margin-right: 5em; */
}

header .dropmenu .dropicon .strip {
    width: 100%;
    height: 4px;
    border-bottom: 5px solid white;
}

header .iconmenu .dropmenu:hover {
    cursor: pointer;
}

.banner {
    background: #CCB416;
}


/* 
.yellow {
    height: 5px;
    width: 100%;
    background: #CCB416;
} */

.banner .bot {
    height: 3px;
}

.branch img {
    opacity: 20%;
    mix-blend-mode: multiply;
}

.contact .sosmed {
    height: 18rem;
}

.branch {
    display: flex;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 4.14%, rgba(255, 255, 255, 0.312661) 13.08%, rgba(255, 255, 255, 0.560018) 20.8%, rgba(255, 255, 255, 0.799449) 29.74%, #FFFFFF 37.87%, #FFFFFF 53.72%), #08332B;
    mix-blend-mode: multiply;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: -500px;
    height: 467px;
}

section#two {
    background-image: url('./assets/background-about.jpg');
    background-size: cover;
    background-position: center top;
    padding-bottom: 8rem;
}

section#two .title {
    font-family: 'Bellerose', serif;
    font-size: 24rem;
    width: 100%;
    color: #2E4C14;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #2A6605;
    margin-top: .25em;
}

section#two .des {
    font-family: "Montserrat", sans-serif;
    width: 100%;
    color: #005261;
    margin-top: 1em;
    width: 70%;
    font-weight: 600;
    line-height: 3rem;
    font-size: 2.7rem;
    opacity: 80%;
    text-align: center;
    letter-spacing: 5px;
}

section#three {
    background-image: url('./assets/background-contact.png');
    background-size: cover;
    background-position: left top;
    padding-bottom: 27em;
}

.contact .contacttext {
    /* CONTACT */
    font-style: normal;
    font-weight: 400;
    font-size: 10rem;
}

.sticky-contact {
    position: fixed !important;
    width: 16rem;
    bottom: 5px;
    right: 12px;
    z-index: 999;
}

.sticky-contact:hover {
    filter: saturate(85%) brightness(115%) drop-shadow(0px 4px 12px #0000005d);
}

.greend-land {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* mix-blend-mode: multiply; */
    width: 100%;
    /* background-repeat: no-repeat;
    width: 100%;
    background-color: white;
    mix-blend-mode: multiply; */
    z-index: 2;
    transition: transform 300ms;
    /* overflow: hidden; */
}

.menu1wrap {
    overflow: hidden;
    /* height: 115vw; */
    height: 140em;
}

.greend-land h1 {
    padding-top: 25px;
    /* margin-bottom: .38em; */
    text-align: center;
    font-family: "Kufam", sans-serif;
    width: 1014px;
    font-style: normal;
    font-weight: normal;
    height: 114px;
    font-size: 120px;
    line-height: 135px;
    color: rgba(0, 0, 0, 0.7);
}

.greend-land p {
    font-style: normal;
    font-weight: normal;
    font-size: 1.6em;
    line-height: 1.5em;
    text-align: center;
    width: 1025px;
    height: fit-content;
    padding-bottom: 1em;
    color: rgba(0, 0, 0, 0.6);
}

.bluebackground {
    height: 1px;
    z-index: -1;
    background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
    mix-blend-mode: multiply;
    /* display: flex; */
    /* justify-content: flex-start; */
    background-size: cover;
    position: relative;
    width: 100%;
}

.bluebackground img {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
}

.botwheat {
    height: 22em;
}

.contact .desc h5 {
    font-size: 4rem;
}

.menufasilitas {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 2.5em;
    overflow: hidden;
    /* padding-bottom: 7em; */
    height: fit-content;
}

.menufasilitas h1 {
    width: 406px;
    height: 98px;
    font-style: normal;
    font-weight: 500;
    font-size: 80px;
    line-height: 98px;
    font-style: normal;
    color: rgba(0, 0, 0, 0.7);
}

.menufasilitas .fasilitas {
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    align-items: center;
    border-radius: 30px;
    width: 95%;
    height: 100%;
    margin-bottom: 31px;
    /* background: rgba(250, 250, 250, 0.35); */
    z-index: 2;
}

.menufasilitas .fasilitas .fasil {
    display: flex;
    flex-direction: column;
    height: 223px;
    align-items: center;
    padding-bottom: 12em;
}

.menufasilitas .fasilitas .fasil span {
    font-size: 2.75rem;
    margin-top: .5em;
    text-align: center;
}

.menufasilitas .fasilitas .fasil img {
    width: 22rem;
}

.menufasilitas .fasilitas .fasil img:first-child {
    filter: drop-shadow(0px 4px 12px rgba(0, 0, 0, 0.3));
    margin-right: 2em;
    width: 90%;
    height: fit-content;
}

.menufasilitas .fasilitas .desc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    height: 223px;
    margin-left: 20px;
    width: 17rem;
}

.menufasilitas .fasilitas .desc .one {
    line-height: 64px;
    /* or 67% */
    text-align: right;
    letter-spacing: -0.15em;
    color: rgba(46, 76, 20, 0.8);
}

.menufasilitas h1,
.menufasilitas p {
    margin: 0px;
    padding: 0px;
    text-align: right;
    color: rgba(46, 76, 20, 0.8);
}

.menufasilitas h2 {
    font-weight: 700;
    font-size: 80px;
    line-height: 98px;
    color: rgba(0, 0, 0, 0.7);
}

.menufasilitas h1 {
    font-size: 100px;
    letter-spacing: -5px;
    width: 225px;
}

.menufasilitas p {
    font-style: normal;
    font-weight: bolder;
    font-size: 30px;
    line-height: 37px;
    color: rgba(0, 0, 0, 0.6);
    margin-left: -35px;
}

.menufasilitas .descbot {
    font-weight: normal;
}

.menufasilitas .fitur {
    display: flex;
    flex-flow: row;
    justify-content: space-around;
    margin-left: 80px;
    margin-top: 4em;
    /* width: 100%; */
}

.menufasilitas .fitur .item img {
    width: 25rem;
}

.fade h1 {
    /* TIPE RUMAH */
    font-family: 'Montserrat' !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 8.4rem !important;
    line-height: 122px !important;
    /* identical to box height */
    letter-spacing: 0.3em !important;
    color: #DFEDD2 !important;
    margin-top: 6.7rem !important;
}


/* .menufasilitas .fitur .item {
    display: flex;
    flex-flow: column;
    align-items: center;
} */

.menufasilitas .fitur .item p {
    width: 350px;
    text-align: center;
}

.menufasilitas .fitur .item h1 {
    width: 29px;
    height: 80px;
}

.menufasilitas .fitur .item .words {
    width: 350px;
    display: inline-flex;
    flex-direction: row;
    align-items: flex-end;
}

.menufasilitas .fitur .item .satu {
    width: 310px;
}

.menufasilitas .fitur .item .words p {
    margin-left: 20px;
}

.menufasilitas .fitur img:first-child {
    /* border-radius: 100%;
    border: 5px solid #CCB416; */
    filter: drop-shadow(0px 4px 12px rgba(0, 0, 0, 0.3));
    margin-bottom: 2em;
}

.menufasilitas .fitur img {
    /* border-radius: 100%;
    border: 5px solid #CCB416; */
    width: 18.791em;
}

.menufasilitas .fitur .item .bsd {
    display: flex;
    flex-direction: row;
    margin-left: 30px;
}

.menufasilitas .fitur .item .bsd p {
    width: 140px;
}

.menufasilitas .fitur .item .bsd .tol {
    margin-left: -20px;
}

.tiperumah {
    overflow: hidden;
    /* margin-top: 68.5px; */
    width: 100%;
    display: flex;
    flex-flow: column;
    align-items: center;
    padding-bottom: 140px;
    /* background: #0A3C33; */
}

.tiperumah .background {
    width: 100%;
    height: 1px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 74.48%);
    mix-blend-mode: hard-light;
    opacity: 0.2;
    z-index: 0;
}

.tiperumah h1 {
    width: 100%;
    font-style: normal;
    font-weight: 500;
    font-size: 72px;
    line-height: 88px;
    /* identical to box height */
    color: #CCB416;
    margin-top: 50px;
    margin-bottom: 110px;
    z-index: 2;
    margin-left: 11rem;
}

.tiperumah .fade {
    display: flex;
    width: 100%;
    /* background: linear-gradient(180deg, #FFFFFF -373.21%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), #0A3C33; */
    justify-content: flex-start;
    padding-top: 15px;
    margin-top: 0px;
}

.tiperumah .rumahs {
    display: flex;
    flex-flow: row;
    width: 90%;
    justify-content: space-evenly;
    z-index: 2;
}

.tiperumah .rumahs .rumah {
    display: flex;
    align-items: flex-end;
    background-size: cover;
}

.tiperumah .rumahs .subsidi {
    background-image: url(https://d335zq4gyrs1di.cloudfront.net/subsidi.jpg);
}

.tiperumah .rumahs .subsidi .tag {
    left: -1780px;
}

.tiperumah .rumahs .tengah {
    background-image: url(https://d335zq4gyrs1di.cloudfront.net/midd.jpg);
}

.tiperumah .rumahs .tengah .tag {
    display: none;
}

.tiperumah .rumahs .last {
    background-image: url(https://d335zq4gyrs1di.cloudfront.net/last.jpg);
}

.tiperumah .rumahs .last .tag {
    display: none;
    /* margin-right: -900px; */
    /* right: 3000px; */
}

.tiperumah .rumahs .tag {
    display: flex;
    width: 600px;
    height: 150px;
    background: #E0FDEC;
    border-radius: 25px;
    text-align: center;
    font-size: 40px;
    position: relative;
    flex-direction: column;
    align-items: center;
    color: #03342b;
    vertical-align: top;
    /*box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.12), 0 4px 4px rgba(0, 0, 0, 0.12), 0 8px 8px rgba(0, 0, 0, 0.12), 0 16px 16px rgba(0, 0, 0, 0.12);*/
    padding: 1px;
    opacity: 0.7;
}

.tag h2 {
    font-family: 'Montserrat', sans-serif;
    font-style: normal;
    line-height: 110px;
    height: 0px;
    margin-top: -10px;
    font-weight: 400;
    font-size: 90px;
    text-align: center;
    padding-top: 1px;
    margin-bottom: 64px;
    opacity: 1;
    color: #03342B;
    font-weight: 700;
}

.tag .text {
    display: flex;
    flex-flow: row;
    justify-content: space-none;
    align-items: center;
    width: 550px;
}

.tag .text p:first-child {
    font-weight: bold;
    background-color: #FF0000;
    display: flex;
    align-items: center;
    padding-left: 9px;
    padding-right: 9px;
    height: 50px;
    font-style: normal;
    font-weight: 600;
    font-size: 36px;
    line-height: 44px;
    text-align: center;
    color: #53FF64;
}

.tag p:last-child {
    font-weight: 400;
    font-size: 36px;
    line-height: 44px;
    text-align: center;
    color: #FF7A00;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    letter-spacing: 5%;
}

.tiperumah .rumahs .rumah {
    width: 45%;
    height: 48.125rem;
    border: #2E4C14 solid 5px;
    border-radius: 30px;
    background-position: center center;
}

.tiperumah .rumahs .rumah:hover {
    cursor: pointer;
}

.tiperumah .rumahs .overlay .left .backtwo {
    display: none;
}

.outercontact {
    display: flex;
    flex-flow: column;
    align-items: center;
    width: 100%;
    /* overflow: hidden; */
}

.contact {
    display: flex;
    flex-flow: row;
    margin-top: 50px;
    font-family: 'Montserrat', sans-serif;
    /* background-image: url(./assets/308_green_wheat\ 2.png); */
    background-repeat: no-repeat;
    width: 100%;
    justify-content: space-evenly;
}

.contact .logo {
    margin-bottom: -15px;
}

.contact .desc h1 {
    font-size: 8.5rem;
    line-height: 88px;
    margin-bottom: 1.1em;
    margin-top: -20px;
    color: rgba(0, 0, 0, 0.7);
    line-height: 122px;
    /* identical to box height */
    letter-spacing: 0.3em;
    color: #DFEDD2;
}

.contact .desc p,
.contact .desc h5 {
    font-size: 36px;
    line-height: 44px;
    color: #DFEDD2;
}

.contact .desc p a {
    color: #DFEDD2;
}

.contact .desc h5 {
    font-style: normal;
    font-weight: bold;
    margin-top: 7px;
    color: '#DFEDD2';
}

.contact .desc,
.contact .mapsos {
    display: flex;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    text-align: center;
    width: 50%;
    /* color: rgba(0, 0, 0, 0.6); */
}

.contact .desc {
    width: 52%;
    padding-top: 7em;
}

.contact .mapsos {
    width: 48%;
}

.contact .mapsos {
    align-items: flex-start;
}

.contact .mapsos iframe,
.contact .sosmed,
.outercontact .wadiv .phone {
    border: 3px solid #2E4C14;
    box-sizing: border-box;
    border-radius: 40px;
}

.contact .desc p {
    font-weight: 400;
    font-size: 30px;
}

.contact .sosmed {
    display: flex;
    flex-flow: row;
    justify-content: space-evenly;
    align-items: center;
    height: 223px;
    background: rgba(255, 255, 255, 0.3);
    padding: 16px;
    padding-top: 2px;
    margin-bottom: 60px;
    margin-top: 10px;
}

.wa:hover {
    cursor: pointer;
}

.contact .desc .alamat {
    margin-top: 0px;
}

.outercontact .wheat {
    position: absolute;
    padding-left: 0;
    /* height: 100%; */
    z-index: -2;
    /* width: 100%; */
    margin-top: 700px;
    /* margin-left: -10px; */
}

.contact .desc .marketing {
    margin-bottom: -4px;
    margin-top: -30px;
}

.outercontact .wadiv {
    display: flex;
    width: 100%;
    margin-left: -200px;
    margin-top: -150px;
    justify-content: flex-end;
}

.outercontact .wadiv .phone {
    display: none;
    width: 480px;
    /* height: 260px; */
    background: rgba(255, 255, 255, 0.5);
    flex-flow: column;
    justify-content: space-evenly;
    align-items: center;
    z-index: 9999999;
}

.outercontact .wadiv .phone .num {
    width: 440px;
    border-bottom: #CCB416 solid 1px;
    padding: 17px;
    display: flex;
    align-items: center;
}

.outercontact .wadiv .phone .num .clickable {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-evenly;
    width: 400px;
}

.mapsos .clickable {
    color: #DFEDD2
}

.outercontact .wadiv .phone .num:last-child {
    border: none;
}

.outercontact .wadiv .phone .num a {
    width: 315px;
    height: 50px;
    font-style: normal;
    font-weight: 500;
    font-size: 36px;
    line-height: 45px;
    text-align: center;
    letter-spacing: 0.02em;
    color: rgba(0, 0, 0, 0.45);
}

.mapsos .sosmed .clickable {
    filter: drop-shadow(0px 4px 12px #0000005d);
}

.sosmed img {
    width: 17rem;
}

.clickable:hover {
    filter: saturate(85%) brightness(115%) drop-shadow(0px 4px 12px #0000005d);
    cursor: pointer;
}

.wadiv .phone .num .clickable:hover,
.alamat .clickable:hover,
.mapsos .clickable:hover {
    color: #DFEDD2;
    filter: none;
    font-weight: 800 !important;
}

.tiperumah .rumahs .overlay {
    display: none;
    position: fixed;
    flex-flow: row;
    justify-content: space-evenly;
    background: #FFFFFF;
    /* border-radius: 30px; */
    width: 100%;
    /* max-width: 1920px; */
    z-index: 999;
    font-size: 1.05em;
    overflow: scroll;
}

.tiperumah .rumahs .overlay .left {
    display: flex;
    flex-flow: column;
    justify-content: space-none;
}

.tiperumah .rumahs .overlay .left .desc {
    display: flex;
    flex-flow: row;
    justify-content: space-evenly;
    align-items: flex-start;
    width: 100%;
}

.tiperumah .rumahs .overlay .left .desc .back,
.tiperumah .rumahs .overlay .left .nav tr:last-child td p {
    font-style: normal;
    font-weight: 600;
    text-align: center;
    color: rgba(0, 0, 0, 0.4);
    width: 4em;
    background: #C4C4C4;
    border-radius: 0.7vw;
    /* margin-top: 15 vw; */
    font-size: 1.5em;
    margin: 0em;
    padding: 0.2em;
}

.tiperumah .rumahs .overlay .left .nav tr:last-child td p {
    display: flex;
    justify-content: center;
}

.tiperumah .rumahs .overlay .left .desc .back {
    margin-top: 1.5em
}


/* .tiperumah .rumahs .overlay .left .nav tr:last-child td {
        padding: 0.3vw;
    } */

.tiperumah .rumahs .overlay .left .nav tr:last-child td p {
    font-size: 1.5em;
    width: 4em;
}

.tiperumah .rumahs .overlay .left .desc .back:hover,
.tiperumah .rumahs .overlay .left .nav tr:last-child td p:hover {
    color: #CCB416;
    background-color: #03342b;
}

.tiperumah .rumahs .overlay .left .desc .text tr:first-child td:first-child {}

.tiperumah .rumahs .overlay .left .nav {
    border: 2px solid rgba(0, 0, 0, 0.5);
    box-sizing: border-box;
    border-radius: 0.7em;
    padding: 0.3em;
}

.tiperumah .rumahs .overlay .left .nav tr:first-child th {
    font-style: normal;
    font-weight: 600;
    font-size: 1.2em;
    /* line-height: 29px; */
    text-align: center;
    letter-spacing: 0.25em;
}

.tiperumah .rumahs .overlay .left .nav tr:first-child th p {
    width: 100%;
    align-items: center;
    margin: 0.2em;
    margin-bottom: 0.2em;
}

.tiperumah .rumahs .overlay .left .nav tr {
    /* background-color: #03342b; */
}

.tiperumah .rumahs .overlay .left img {
    width: 69em;
    height: auto;
}

.tiperumah .rumahs .overlay .right {
    display: flex;
    flex-flow: column;
    justify-content: space-none;
    align-items: center;
    /* padding: 30em; */
    /* padding-top: 100px; */
}

.tiperumah .rumahs .overlay .right img {
    height: 23em;
}

.overlay .texts {
    /* margin-top: -20em; */
    padding: 1px;
}

.overlay .texts tr:first-child td:first-child {
    /* font-family: Montserrat; */
    font-style: normal;
    font-weight: 600;
    font-size: 3.5em;
    line-height: 1.2em;
    text-align: center;
    color: #000000;
}

.overlay .texts tr:first-child td:last-child {
    font-style: normal;
    font-weight: normal;
    font-size: 2.5em;
    line-height: 1em;
    text-align: center;
}

.overlay .texts tr:last-child td:first-child {
    font-style: normal;
    font-weight: bold;
    font-size: 1.9em;
    line-height: 1em;
    text-align: center;
    color: #FFE53D;
    background-color: #d40404;
}

.overlay .texts tr:last-child td:last-child {
    font-style: normal;
    font-weight: normal;
    font-size: 1.65em;
    line-height: 1.5em;
    text-align: center;
    color: #000000;
    background-color: white;
}

.overlay .right .spec tr:first-child th h5 {
    font-style: normal;
    font-weight: 600;
    font-size: 2.1em;
    line-height: 1em;
    /* or 92% */
    color: #000000;
    padding: 0px;
    margin: 0.8em;
}

.overlay .right .spec tr td {
    font-style: normal;
    font-weight: 400;
    font-size: 1.2em;
    line-height: 1.3em;
    color: #000000;
}

.overlay .right .spec tr td:first-child {
    font-weight: 800;
    display: flex;
    align-items: flex-start;
}

@media only screen and (max-width: 1880px) {
    /* html {
        zoom: 94%;
    } */
    html {
        zoom: 65%;
    }
    .tiperumah .rumahs .overlay {
        zoom: 120%;
    }
    .loader-wrapper .loader img {
        zoom: 170%;
    }
    /* margin-right: ; */
    .outercontact .wheat {
        width: 100%;
    }
    .tiperumah .rumahs .overlay .left img {
        width: 92em;
    }
    .tiperumah .rumahs .overlay .right img {
        height: 27em;
    }
    .tiperumah .rumahs .overlay .left img {
        width: 117em;
    }
    .tiperumah .rumahs .overlay .left .nav {
        width: 15em;
        height: auto;
    }
    .tiperumah .rumahs .overlay .left .nav tr:first-child th {
        font-size: 1.7em;
    }
    .tiperumah .rumahs .overlay .left .nav td p,
    .tiperumah .rumahs .overlay .right .nav td p {
        margin-inline: auto;
    }
    .tiperumah .rumahs .overlay .left .desc .back {
        font-size: 2.5em;
    }
    .tiperumah .rumahs .overlay .left .nav tr:last-child td p,
    .tiperumah .rumahs .overlay .right .nav tr:last-child td p {
        font-size: 2.5em;
        margin-inline: auto;
        width: 90%;
    }
}

@media only screen and (max-width: 1800px) {
    /* html {
        zoom: 80%;
    } */
    .loader-wrapper .loader img {
        zoom: 120%;
    }
    .greend-land .bluebackground img {
        height: 123em;
    }
}

@media only screen and (max-width: 1550px) {
    html {
        zoom: 60%;
    }
    .loader-wrapper .loader img {
        zoom: 160%;
    }
    .outercontact .wheat {
        width: 100%;
    }
}

@media only screen and (max-width: 1450px) {
    html {
        zoom: 55%;
    }
}

@media only screen and (max-width: 1360px) {
    /* html {
        zoom: 60%;
    } */
    .loader-wrapper .loader img {
        zoom: 180%;
    }
    .outercontact .wheat {
        width: 120%;
    }
    .overlay .right .spec tr:first-child th h5 {
        font-size: 2.1em;
    }
    .overlay .right .spec tr td {
        font-size: 1.5em;
    }
    .tiperumah .rumahs .overlay .right img {
        width: 30em;
        height: auto;
    }
}

@media only screen and (max-width: 1320px) {
    .greend-land .bluebackground img {
        height: 123em;
    }
    .tiperumah .rumahs .overlay .left img {
        width: 117em;
    }
    .tiperumah .rumahs .overlay .left .nav {
        width: 22em;
        height: auto;
    }
    .tiperumah .rumahs .overlay .left .nav tr:first-child th {
        font-size: 1.7em;
    }
    .tiperumah .rumahs .overlay .left .desc .back {
        font-size: 2.5em;
    }
    .tiperumah .rumahs .overlay .left .nav tr:last-child td p {
        font-size: 2.5em;
    }
    html {
        zoom: 50%;
    }
    .loader-wrapper .loader img {
        zoom: 200%;
    }
    /* header .menu .bar,header .menu a {
        font-size: 2rem;
        width: 14rem;
    } */
}

@media only screen and (max-width: 1213px) {
    .tiperumah .rumahs .overlay .left img {
        width: 97em;
    }
    header .menu .bar,
    header .menu a {
        font-size: 2rem;
        width: 13rem;
    }
    .tiperumah .rumahs .overlay {
        zoom: 100%;
    }
}

@media only screen and (max-width: 1058px) {
    .tiperumah .rumahs .overlay .left img {
        width: 77em;
    }
    .tiperumah .rumahs .rumah .tag {
        display: flex;
        position: relative;
        margin-bottom: 0;
        left: 0;
    }
    header .menu .bar,
    header .menu a {
        width: 11rem;
        font-size: 1.8rem;
    }
    section#two .title {
        font-size: 22rem;
        width: 95%;
    }
    section#two .des {
        font-size: 2rem;
    }
    .menufasilitas .fasilitas .fasil img:first-child {
        width: 90%;
        height: fit-content;
    }
    .menufasilitas .fasilitas .fasil img {
        width: 20rem;
    }
    .menufasilitas .fitur .item img {
        width: 20rem;
    }
    .tiperumah .rumahs .rumah {
        /* width: 38.125rem; */
        height: 36.125rem;
    }
    .menufasilitas .fasilitas {
        height: 20%;
    }
}

@media only screen and (max-width: 972px) {
    html {
        zoom: 40%;
    }
    .loader-wrapper .loader img {
        zoom: 220%;
    }
    .tiperumah .rumahs .overlay .left img {
        width: 96em;
        height: auto;
    }
    .tiperumah .rumahs .overlay .left .texts tr:first-child td:first-child {
        font-size: 4.2em;
    }
    .overlay .texts tr:first-child td:last-child {
        font-size: 3.2em;
    }
    .overlay .texts tr:last-child td:first-child {
        font-size: 2.3em;
    }
    .overlay .texts tr:last-child td:last-child {
        font-size: 2.35em;
        line-height: 2em;
    }
    .overlay .right .spec tr:first-child th h5 {
        font-size: 2.9em;
    }
    .overlay .right .spec tr td {
        font-size: 1.7em;
        line-height: 2em;
    }
    .tiperumah .rumahs .overlay .right img {
        width: 28em;
        height: auto;
    }
}

@media only screen and (max-width: 866px) {
    .tiperumah .rumahs .overlay .left img {
        width: 84em;
    }
}

@media only screen and (max-width: 780px) {
    html {
        zoom: 32%;
    }
    .loader-wrapper .loader img {
        zoom: 250%;
    }
    .tiperumah .rumahs .overlay .left img {
        width: 100em;
    }
    .tiperumah .rumahs .overlay .right {
        width: 100em;
        height: 20%;
        display: flex;
        flex-wrap: wrap;
        padding: 10em;
    }
    .tiperumah .rumahs .overlay {
        /* display: flex; */
        flex-flow: column;
        align-items: center;
        justify-content: flex-start;
    }
    header .iconmenu .dropmenu {
        display: flex;
        height: 60px;
        margin-right: 1.5rem;
    }
    header .iconmenu .dropitem {
        display: none;
    }
    header .iconmenu .dropmenu .dropitem .bars {
        list-style: none;
        display: inline-block;
        position: relative;
    }
    header .iconmenu .dropmenu .dropitem {
        display: none;
        flex-flow: column;
        align-items: center;
        justify-content: space-evenly;
        width: 10vw;
        height: 5vw;
        z-index: 5;
        /* margin-top: 14vw; */
        position: absolute;
        top: 4rem;
        right: 2rem;
        /* left: 0; */
    }
    header .iconmenu .dropmenu .dropitem a {
        font-size: 2rem;
        line-height: 3em;
        width: 7.5em;
        background-color: #1ea7ca;
        margin-right: 6.5rem;
    }
    header .iconmenu .dropmenu .dropitem a:hover {
        background-color: #4ad0f1;
    }
    header .iconmenu .menu {
        display: none;
    }
    header {
        zoom: 200%;
        background-image: url('./assets/navbar414.png');
        background-position: right center;
    }
    .tiperumah .rumahs .overlay .right img {
        width: 50em;
    }
    .overlay .left .desc .nav,
    .overlay .left .desc .back {
        zoom: 145%;
    }
    .sticky-contact {
        width: 20rem;
    }
}

@media only screen and (max-width: 630px) {
    html {
        zoom: 27%;
    }
    .loader-wrapper .loader img {
        zoom: 300%;
    }
}

@media only screen and (max-width: 530px) {
    html {
        zoom: 20%;
    }
    .tiperumah .rumahs .overlay .right {
        height: 65em;
        display: flex;
        justify-content: space-none;
        align-items: flex-start;
    }
    .tiperumah .rumahs .overlay .right img {
        width: 56em;
        height: auto;
    }
    .tiperumah .rumahs .overlay .right .spec tr td {
        font-size: 2.3em;
    }
    .tiperumah .rumahs .overlay .right .spec {
        width: 50em;
    }
    .tiperumah .rumahs .overlay .left .texts {
        zoom: 120%;
    }
    .tiperumah .rumahs .overlay .left .back,
    .tiperumah .rumahs .overlay .left .nav {
        zoom: 117%;
    }
    .tiperumah .rumahs .overlay .left .desc .nav,
    .tiperumah .rumahs .overlay .left .desc .back {
        zoom: 133%;
    }
    .loader-wrapper .loader img {
        zoom: 380%;
    }
    header .iconmenu .dropmenu .dropitem {
        /*top: 18rem;*/
        /* left: 0; */
    }
    header .iconmenu .dropmenu .dropitem a {
        /* margin-right: 10rem; */
    }
}

@media only screen and (max-width: 470px) {
    .tiperumah .rumahs .overlay .right .spec {
        width: 40em;
    }
}

@media only screen and (max-width: 414px) {
    header {
        zoom: 300%;
    }
    .sticky-contact {
        width: 30rem;
    }
    .greenstuff,
    .tiperumah {
        zoom: 200%;
        display: flex;
        flex-flow: column;
    }
    .tiperumah .background img {
        width: 220em;
    }
    .sosmed img {
        width: 15rem;
    }
    .greend-land p {
        font-size: 2em;
        width: 29em;
    }
    .menu1wrap {
        height: 530em;
    }
    .greend-land {
        height: fit-content;
    }
    .menufasilitas {
        zoom: 200%;
    }
    .menufasilitas .fasilitas {
        display: flex;
        flex-flow: wrap;
        padding-top: 5em;
        justify-content: space-evenly;
        width: 80%;
    }
    .menufasilitas .fasilitas .fasil:first-child {
        margin-bottom: 2em;
    }
    .menufasilitas .fasilitas .fasil {
        width: 40%;
    }
    .menufasilitas .fitur .item {
        display: flex;
        flex-flow: column;
    }
    .menufasilitas .fitur .item .words .descbot,
    .menufasilitas .fitur .item .words h1 {
        line-height: 0.8em;
    }
    .menufasilitas .fitur {
        display: flex;
        flex-wrap: wrap;
        width: 60em;
        height: fit-content;
        margin-inline: auto;
    }
    .tiperumah .rumahs {
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: space-evenly;
        height: 110em;
    }
    .tiperumah .rumahs .rumah .tag {
        display: flex;
        position: relative;
        margin-bottom: 0;
        left: 0;
        width: 100%;
    }
    .tiperumah .background img {
        width: 280em;
    }
    .contact {
        display: flex;
        zoom: 220%;
        flex-flow: column;
        align-items: center;
        height: fit-content;
    }
    .contact .desc {
        /* margin-top: 12em; */
    }
    .contact .desc h5,
    .contact .desc p {
        font-size: 2.8rem !important;
        width: 20em;
        line-height: 2em;
    }
    .contact .desc h5 {
        font-size: 3.2rem !important;
    }
    .outercontact .wadiv .phone {
        zoom: 250%;
        margin-top: -5em;
    }
    .tiperumah h1,.fade h1 {
        margin-left: 7rem;
    }
    .fade h1,.contact .desc h1{
        font-size:6.4rem !important;
    }
    .fade-custom h1{
        font-size:12rem !important;
        margin-top:2em !important;
        /*font-weight:600 !important;*/
    }
    .botwheat {
        height: 30em;
    }
    .outercontact .wadiv {
        margin-left: -330px;
        margin-bottom: 280px;
    }
    /* header .iconmenu .dropmenu:hover .dropitem {
        width: 10vw;
        height: 5vw;
        top: 18em;
        right: 0vw;

    } */
    /* header .iconmenu .dropmenu:hover .dropitem a {
        font-size: 2em;
        line-height: 3em;
        width: 7.5em;
        margin-right: 6em;
    } */
    .tiperumah .rumahs .overlay {
        zoom: 50%;
    }
    .tiperumah .rumahs .overlay .left .desc .nav,
    .tiperumah .rumahs .overlay .left .desc .back {
        zoom: 127%;
    }
    section#two .title {
        margin-top: 1.5em;
    }
    section#two .des {
        font-size: 3.5rem;
        line-height: normal;
        width: 85%;
        height: fit-content;
        margin-bottom: 2em;
    }
    .menufasilitas .fasilitas .fasil img:first-child {
        width: 90%;
        height: fit-content;
    }
    .menufasilitas .fasilitas .fasil img {
        width: 20rem;
    }
    .menufasilitas .fitur .item img {
        width: 18rem;
    }

    .contact .mapsos {
        width: 95%;
        align-items: center;
        height: fit-content;
    }
    .tiperumah .rumahs .rumah {
        width: 80%;
        height: 45.125rem;
        margin-bottom: 2em;
        background-position: center;
    }
    .menufasilitas .fasilitas {
        height: auto;
    }
    .menufasilitas {
        overflow: initial;
        height: fit-content;
    }
    .menufasilitas .fasilitas .fasil {
        height: auto;
        padding-bottom: 2em;
    }
    .outercontact {
        height: fit-content;
    }
}

@media only screen and (max-width: 410px) {
    .overlay {
        zoom: 51%;
    }
}

@media only screen and (max-width: 380px) {
    html {
        zoom: 15%;
    }
    .loader-wrapper .loader img {
        zoom: 385%;
    }
    .overlay {
        zoom: 65%;
    }
}

@media only screen and (max-width: 360px) {
    .overlay {
        zoom: 55%;
    }
    .sticky-contact {
        width: 45rem;
    }
}

@media only screen and (max-width: 308px) {
    html {
        zoom: 10%;
    }
    .sticky-contact {
        width: 50rem;
    }
    .loader-wrapper .loader img {
        zoom: 490%;
    }
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @media only screen and (max-width: 1880px) {
        .tiperumah .rumahs .overlay .left img {
            width: 92em;
            zoom: 90%;
            height: 85%;
            /* object-fit: cover; */
            /* object-position: center center; */
        }
    }
    @media only screen and (max-width: 780px) {
        .tiperumah .rumahs .overlay .left img {
            zoom: 100%;
            width: 100em;
        }
    }
}

@-moz-document url-prefix() {
    .tiperumah .rumahs {
        width: 100vw;
    }
    .tiperumah .rumahs .rumah {
        /* width: 35em; */
        height: 30em;
    }
    @media only screen and (max-width: 1880px) {
        .overlay .right {
            margin-left: -12em;
        }
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.8);
            transform-origin: center 0;
        }
        .banner,
        .greend-land,
        .menufasilitas,
        .tiperumah,
        .outercontact {
            width: 100vw;
            height: auto;
        }
        .contact .desc,
        .contact .mapsos,
        .outercontact .wadiv {
            -moz-transform: scale(0.8);
            transform-origin: 0 center;
        }
        .tiperumah .rumahs .rumah {
            /* width: 30em; */
            height: 25em;
        }
        .tag h2 {
            font-size: 2em;
            padding: 0;
            margin-bottom: 0.8em;
        }
        .tiperumah .rumahs .rumah .tag p {
            padding: 0;
            font-size: 0.8em;
        }
        .tiperumah .rumahs .rumah .tag .text p,
        .tiperumah .rumahs .rumah .tag .text p:first-child {
            padding: 0;
            font-size: 0.7em;
        }
        .tag .text {
            width: 100%;
            display: flex;
            justify-content: center;
        }
        .outercontact .wadiv {
            margin-top: -8em;
            margin-right: -24em;
        }
        .overlay .left {
            margin-left: -9em;
        }
    }
    @media only screen and (max-width: 1730px) {
        .menufasilitas .fitur,
        .menufasilitas .fasilitas {
            -moz-transform: scale(0.8);
        }
        .tiperumah .background img {
            width: 120em;
            height: auto;
        }
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.76);
            transform-origin: center 0;
        }
        .overlay .right {
            margin-left: -14em;
        }
    }
    @media only screen and (max-width: 1494px) {
        .overlay .right .spec tr:first-child th h5 {
            font-size: 2.1em;
        }
        .overlay .right .spec tr td {
            font-size: 1.5em;
        }
        .overlay .right {
            margin-left: -25em;
        }
        .overlay .left {
            margin-right: -10em;
            margin-left: 5em;
        }
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.6);
            transform-origin: 0 0;
        }
        .tiperumah .rumahs .rumah {
            /* width: 26em; */
            height: 22em;
        }
        .tag h2 {
            font-size: 1.6em;
        }
        .tag .text p,
        .tag .text p:first-child {
            font-size: 0.5em;
        }
        .tiperumah .rumahs .rumah .tag {
            height: 3em;
            align-items: center;
        }
        .menufasilitas .fitur,
        .menufasilitas .fasilitas {
            -moz-transform: scale(0.7);
        }
    }
    @media only screen and (max-width: 1360px) {
        .overlay .left img {
            -moz-transform: scale(0.9);
            transform-origin: center center;
        }
    }
    @media only screen and (max-width: 1320px) {
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.5);
            transform-origin: 0 0;
        }
        .overlay .right {
            margin-left: -28em;
        }
        .overlay .left {
            margin-right: -19em;
            margin-left: 6em;
        }
    }
    @media only screen and (max-width: 1285px) {
        .overlay .left {
            -moz-transform: scale(0.5);
            transform-origin: 0 0;
        }
        .overlay .right {
            margin-left: -17em;
        }
        .overlay .left {
            margin-right: -31em;
            margin-left: 8em;
        }
        .tiperumah .rumahs .rumah {
            /* width: 23em; */
            height: 19em;
        }
        .tiperumah .rumahs .rumah.tag h2 {
            font-size: 1.5em;
        }
        .tiperumah .rumahs .rumah .tag p {
            font-size: 0.6em;
        }
        .tiperumah .rumahs .rumah .tag .text p,
        .tiperumah .rumahs .rumah .tag .text p:first-child {
            padding: 0;
            font-size: 0.5em;
        }
        .tiperumah .rumahs .rumah .tag .text p:first-child {
            margin: 0;
            line-height: 0.1em;
            height: 1.2em;
        }
        .tiperumah .rumahs .rumah .tag {
            height: 2.7em;
        }
        section#two .des {
            width: 70%;
        }
    }
    @media only screen and (max-width: 1188px) {
        .overlay .left {
            margin-left: 14em;
        }
        header .iconmenu .dropmenu {
            display: flex;
            width: 12vw;
            height: 70px;
        }
        header .iconmenu .dropitem {
            display: none;
        }
        header .iconmenu .dropmenu .dropitem .bars {
            list-style: none;
            display: inline-block;
            position: relative;
        }
        header .iconmenu .dropmenu:hover .dropitem {
            display: flex;
            flex-flow: column;
            align-items: center;
            justify-content: space-evenly;
            width: 10vw;
            height: 5vw;
            z-index: 5;
            /* margin-top: 14vw; */
            position: absolute;
            top: 12.5em;
            right: 0vw;
            /* left: 0; */
        }
        header .iconmenu .dropmenu:hover .dropitem a {
            font-size: 1.4em;
            line-height: 3em;
            width: 7em;
            background-color: #03342b;
            margin-right: 6em;
        }
        header .iconmenu .dropmenu:hover .dropitem a:hover {
            background-color: #075f4f;
        }
        header .iconmenu .menu {
            display: none;
        }
        .menufasilitas .fitur,
        .menufasilitas .fasilitas {
            -moz-transform: scale(0.6);
            transform-origin: center 0;
            margin-bottom: -1.5em;
        }
        .menufasilitas {
            margin-bottom: -3em;
        }
        .greend-land {
            -moz-transform: scale(0.8);
        }
        .tiperumah .rumahs .rumah {
            /* width: 20em; */
            height: 16em;
        }
        .contact .desc,
        .contact .mapsos,
        .outercontact .wadiv {
            -moz-transform: scale(0.6);
            transform-origin: 25% 0;
        }
        /* .contact {
            margin-top: -3em;
        } */
        .outercontact .wadiv {
            margin-top: -24em;
            margin-right: -38em;
        }
        .botwheat {
            margin-top: -8em;
        }
    }
    @media only screen and (max-width: 1105px) {
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.48);
            transform-origin: 0 0;
            margin: 0;
            padding: 0;
        }
        .overlay .left {
            margin-right: -45em;
            margin-left: 12em;
        }
        .overlay .right {
            margin-left: -4em;
        }
    }
    @media only screen and (max-width: 1020px) {
        .menufasilitas .fitur,
        .menufasilitas .fasilitas {
            -moz-transform: scale(0.45);
            transform-origin: center 0;
        }
        .menufasilitas .fitur {
            margin-top: -8em;
        }
        .menufasilitas .fasilitas {
            margin-top: -1em;
        }
        .tiperumah .rumahs .rumah {
            /* width: 17em; */
            height: 14em;
        }
        .tiperumah .rumahs {
            height: 10em;
        }
        .tiperumah .rumahs .rumah .tag h2 {
            font-size: 1.2em;
            line-height: 1.5em;
        }
        .tiperumah .rumahs .rumah .tag p,
        .tiperumah .rumahs .rumah .tag .text p {
            font-size: 0.5em;
        }
        .tiperumah .rumahs .rumah .tag .text p:first-child {
            font-size: 0.4em;
        }
        .tiperumah .rumahs .rumah .tag {
            height: 2.23em;
        }
        .tiperumah .fade h1,
        .menufasilitas h2 {
            font-size: 3em;
            text-align: center;
            margin-bottom: 1em;
        }
        .menufasilitas {
            margin-top: -5em;
            height: 50em;
            margin-bottom: -10em;
        }
        .contact .desc,
        .contact .mapsos,
        .outercontact .wadiv {
            -moz-transform: scale(0.5);
            transform-origin: 35% 0;
        }
        /* .contact {
            margin-top: -3em;
        } */
        .outercontact .wadiv {
            margin-top: -29em;
            margin-right: -41em;
        }
        .contact .desc h5 {
            padding-top: 1em;
        }
        .contact .desc p {
            /* background-color: #53FF64; */
            width: 12000vw;
        }
    }
    @media only screen and (max-width: 972px) {
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.4);
            transform-origin: 0 0;
            margin: 0;
            padding: 0;
        }
        .overlay .left {
            margin-right: -48.6em;
            margin-left: 22em;
        }
        .overlay .right {
            margin-left: -7em;
            /* width: 100%; */
        }
        .overlay .right .spec {
            /* margin-left: -7em; */
            width: 70vw;
        }
    }
    @media only screen and (max-width: 850px) {
        /* header .iconmenu .dropmenu:hover .dropitem {
            width: 10vw;
            height: 5vw;
            top: 15.3em;
            right: 0vw;
        }
        header .iconmenu .dropmenu:hover .dropitem a {
            font-size: 1.7em;
            line-height: 3em;
            width: 7em;
            margin-right: 6em;
        } */
        .overlay .right .spec {
            /* margin-left: -7em; */
            width: 60vw;
        }
        .overlay .left {
            margin-left: 15em;
        }
        .overlay .left .desc {
            margin-left: 1.5em;
        }
        .menufasilitas .fasilitas {
            -moz-transform: scale(1);
            display: flex;
            flex-flow: column;
            align-items: center;
            justify-content: space-evenly;
            height: 40em;
            margin-bottom: 1em;
        }
        .menufasilitas .fitur .item {
            display: flex;
            flex-flow: column;
            align-items: center;
            justify-content: space-evenly;
        }
        .menufasilitas {
            height: 117em;
            margin-bottom: -15em;
        }
        .menufasilitas .fitur {
            display: flex;
            flex-flow: wrap;
            height: 80em;
            width: 60em;
            -moz-transform: scale(0.7);
            padding-top: 14em;
            transform-origin: center 0;
        }
        .tiperumah .fade h1,
        .menufasilitas h2 {
            font-size: 4em;
            text-align: center;
            margin-bottom: 1em;
        }
        .tiperumah .fade {
            width: 100vw;
        }
        .tiperumah .rumahs {
            display: flex;
            flex-flow: column;
            align-items: center;
            justify-content: space-evenly;
            height: 100em;
        }
        .tiperumah .background img {
            height: 150em;
            width: auto;
        }
        /* .tiperumah {
            height: 120em;
        } */
        .tiperumah .rumahs .rumah {
            /* width: 35em; */
            height: 30em;
        }
        .contact {
            display: flex;
            flex-flow: column;
            align-items: center;
            justify-content: space-none;
        }
        .contact .desc,
        .contact .mapsos {
            -moz-transform: scale(0.65);
            transform-origin: center 0;
            width: 100vw;
            margin-top: 0;
        }
        .contact .mapsos {
            margin-top: -12em;
        }
        .outercontact .wadiv {
            margin-top: -21em;
            margin-right: -25em;
        }
        .greenstuff {
            -moz-transform: scale(0.8);
            transform-origin: center 0;
        }
    }
    @media only screen and (max-width: 780px) {
        .overlay .left {
            margin-right: -40em;
        }
        .overlay .right {
            margin-left: 70em;
            margin-top: -48em;
        }
        .overlay .left {
            margin-left: 20em;
            z-index: 1000;
        }
        .tengah .right {
            margin-top: -46em;
        }
        .overlay .right .spec {
            /* margin-left: -7em; */
            width: 77vw;
        }
        .overlay .left .desc .back,
        .overlay .left .desc .nav {
            -moz-transform: scale(1.1);
            transform-origin: center 0;
        }
        header .iconmenu .dropmenu:hover .dropitem {
            width: 10vw;
            height: 5vw;
            top: 18em;
            right: 0vw;
        }
    }
    @media only screen and (max-width: 645px) {
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.35);
            transform-origin: center 0;
            margin: 0;
            padding: 0;
        }
        .overlay .left {
            margin-top: 2em;
        }
        .overlay .right {
            margin-top: -50em;
        }
        .tengah .right {
            margin-top: -47em;
        }
        .greenstuff {
            -moz-transform: scale(0.65);
        }
        .menufasilitas .fitur {
            -moz-transform: scale(0.6);
            transform-origin: center 0;
            margin-left: -1em;
        }
        .menufasilitas {
            margin-bottom: -22em;
        }
        .menufasilitas .fasilitas {
            -moz-transform: scale(0.8);
        }
    }
    @media only screen and (max-width: 580px) {
        .overlay .right .spec {
            width: 40em;
        }
    }
    @media only screen and (max-width: 570px) {
        header .iconmenu .dropmenu {
            margin-bottom: -0.5em;
            -moz-transform: scale(0.7);
            transform-origin: center center;
        }
        header .iconmenu .logo {
            width: 9em;
            height: auto;
            margin-left: 0em;
        }
        .greenstuff {
            -moz-transform: scale(0.6);
        }
        .menufasilitas .fitur {
            -moz-transform: scale(0.5);
            transform-origin: center 0;
            margin-left: -1em;
            margin-top: -20em;
        }
        .menufasilitas .fasilitas {
            -moz-transform: scale(0.6);
        }
        .menufasilitas {
            /* margin-top: -20em; */
            margin-bottom: -40em;
        }
        .tiperumah .rumahs {
            height: 80em;
        }
        .tiperumah .rumahs .rumah {
            /* width: 30em; */
            height: 25em;
        }
        .contact .desc,
        .contact .mapsos {
            -moz-transform: scale(0.57);
            transform-origin: center 0;
            width: 100vw;
            margin-top: 0;
        }
        .contact .mapsos {
            margin-top: -19em;
        }
        .botwheat {
            margin-top: -14em;
        }
        .outercontact .wadiv {
            margin-top: -25em;
        }
        .menu1wrap {
            height: 140em;
        }
        header .iconmenu .dropmenu:hover .dropitem {
            top: 14em;
        }
        header .iconmenu .dropmenu:hover .dropitem a {
            font-size: 1.8em;
        }
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.33);
            transform-origin: center 0;
            margin: 0;
            padding: 0;
        }
        .overlay .right {
            margin-top: -52em;
        }
        .tengah .right {
            margin-top: -50em;
        }
        /* .overlay .left {
            margin-top: 4em;
        } */
        /* .overlay .right .spec p {
            font-size: 3em;
        } */
        .contact .mapsos {
            align-items: center;
        }
    }
    @media only screen and (max-width: 530px) {
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.25);
        }
        .overlay .right {
            margin-top: -56em;
            /* margin-left: -5em; */
        }
        .tengah .right {
            margin-top: -54em;
        }
        .subsidi .right {
            margin-top: -58em;
        }
    }
    @media only screen and (max-width: 494px) {
        .tiperumah .rumahs .rumah {
            /* width: 23em; */
            height: 20em;
        }
        .tiperumah .rumahs {
            height: 80em;
        }
        .contact .mapsos {
            margin-top: -20em;
        }
        .greenstuff {
            -moz-transform: scale(0.5);
        }
        .greend-land p,
        .greend-land .title {
            font-size: 2em;
            margin-top: -2em;
        }
        .tiperumah .fade h1,
        .menufasilitas h2 {
            -moz-transform: scale(0.7);
        }
    }
    @media only screen and (max-width: 414px) {
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.2);
            margin: 0;
            padding: 0;
        }
        .overlay .right {
            margin-top: -60.5em;
        }
        .tengah .right {
            margin-top: -58em;
        }
        .subsidi .right {
            margin-top: -61.7em;
        }
        header .iconmenu .dropmenu {
            margin-bottom: -0.7em;
            -moz-transform: scale(0.6);
            transform-origin: center center;
        }
        header .iconmenu .logo {
            width: 7em;
            height: auto;
            margin-left: 0em;
        }
        .contact .desc,
        .contact .mapsos {
            -moz-transform: scale(0.45);
            transform-origin: center 0;
        }
        .contact .mapsos {
            margin-top: -35em;
        }
        .contact .desc p {
            font-size: 2.7em;
            margin-bottom: -10em;
        }
        .contact {
            margin-top: -20em;
        }
        .botwheat {
            margin-top: -24em;
        }
        .menufasilitas .fitur {
            margin-right: -2em;
        }
        header .iconmenu .dropmenu:hover .dropitem {
            top: 16em;
        }
        header .iconmenu .dropmenu:hover .dropitem a {
            font-size: 2em;
        }
        .tiperumah .background img {
            width: 240em;
            height: auto;
        }
        header .iconmenu .dropmenu .dropitem {
            /*top: 18rem;*/
        }
    }
    @media only screen and (max-width: 385px) {
        .overlay .left,
        .overlay .right {
            -moz-transform: scale(0.17);
            margin: 0;
            padding: 0;
        }
        .overlay .right {
            margin-top: -62.5em;
        }
        .tengah .right {
            margin-top: -59em;
        }
        .subsidi .right {
            margin-top: -63.7em;
        }
        header .iconmenu .logo {
            width: 6em;
            height: auto;
            /* margin-left: 0em; */
        }
        header .iconmenu .dropmenu {
            -moz-transform: scale(0.5);
            transform-origin: center center;
        }
        .greenstuff {
            -moz-transform: scale(0.4);
        }
        .greend-land p {
            margin-top: -3em;
            font-size: 2.3em;
            width: 24em
        }
        .menufasilitas .fitur {
            -moz-transform: scale(0.4);
            transform-origin: center 0;
        }
        .menufasilitas .fasilitas {
            -moz-transform: scale(0.46);
        }
        .menufasilitas {
            margin-bottom: -50em;
        }
        .menu1wrap {
            height: 120em;
        }
        .contact .desc,
        .contact .mapsos {
            -moz-transform: scale(0.4);
            transform-origin: center 0;
        }
        .contact .mapsos {
            margin-top: -40em;
        }
        .outercontact .wadiv {
            margin-top: -59em;
        }
        .tiperumah .fade h1 {
            font-size: 3em;
        }
        .tiperumah .rumahs .rumah {
            /* width: 20em; */
            height: 18em;
        }
        .tiperumah .rumahs {
            height: 70em;
        }
        .contact {
            margin-top: -30em;
        }
    }
}