html, body {height: 100%; padding: 0; margin: 0; font-family: 'proxima_nova_rgregular'; color: #000}
.clear {clear: both;}
a:link, a:visited, a:active {transition: all .3s; text-decoration: none;}
a:hover {text-decoration: none; zoom: 1; filter: alpha(opacity=50); opacity: 0.5;}
b {font-family: 'proxima_novabold';}

#wrap {min-height: 100%; padding-bottom: 400px;}

#header {background-color: #f0eadc; height: 148px; border-bottom: 5px solid #73600c; position: fixed; z-index: 11; width: 100%;}
#header-inner {padding: 13px 10% 13px 10%;}
#logo {text-align: center; margin-bottom: 5px;}
#company-title {color: #725f0c; font-size: 20px; font-family: 'proxima_novabold'; text-align: center; letter-spacing: 1px; margin-bottom: 15px;}



/* .hover-news:hover { color:red; } */




.section {padding-top: 35px; padding-bottom: 35px; padding-left: 10%; padding-right: 10%; background: #e0e3df;}
.section-title {margin-bottom: 15px; color: #735800; font-size: 30px; font-family: 'proxima_novaextrabold';}
.section-title-2 { color: #735800; font-size: 25px; font-family: 'proxima_novabold'; padding-left: 10%; padding-right: 10%; padding-top: 4%;}

.nav-container {text-align: center; width: 100%;}
.nav-container ul {list-style: none; display: flex; flex-wrap: nowrap; padding: 0; margin-bottom: 0; height: 100%;}
.nav-item:first-child {margin-left: 0;}
.nav-item {white-space: nowrap; float: left; font-size: 13px; font-family: 'proxima_novasemibold'; margin-left: auto;}
.nav-item a {color: #73600c; text-decoration: none;}


/* coba2 (line 21-26 )*/
.nav-container2 {text-align: center; width: 100%;}
.nav-container2 ul {list-style: none; /* flex-wrap: nowrap;*/ padding: 0; margin-bottom: 0; height: 100%;}
.nav-item2:first-child {margin-left: 0;}
.nav-item2 {white-space: nowrap; float: left; font-size: 13px; font-family: 'proxima_novasemibold'; margin-left: auto;}
.nav-item2 a {color: white; text-decoration: none; }

.extra-nav-container {position: absolute; top: 35px; right: 10%; font-size: 12px; width: 160px;}
.extra-nav-container ul {list-style: none; padding: 0; display: flex; flex-wrap: nowrap;}
.extra-nav-container li.nav-item-book {margin-left: 0;}
.extra-nav-container li {float: left; margin-left: auto; padding: 3% 7%; white-space: nowrap;}
.extra-nav-container li.nav-item-login {
    background-color: transparent; border: 1px solid #d9a300; font-family: 'proxima_novabold'; color: #75620c; position: relative; transition: all .3s; text-decoration: none;
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px;
}
.extra-nav-container li.nav-item-login:hover {opacity: 1; background-color: #d9a300;}
.extra-nav-container li a {color: #73600c; text-decoration: none;}
.extra-nav-container li.nav-item-login a {position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.lang-container {position: absolute; top: 35px; left: 10%; font-size: 12px;}
.lang-container img {vertical-align: baseline; margin-right: 5px;}
.selected-lang {cursor: pointer;  position: relative; color: #75620c; background: url('../images/icon-arrow-down.png') no-repeat center right; padding-right: 20px; z-index: 1;}
.lang-choices {background: #73600c; color: #FFF; padding: 10px 25px 5px 15px; position: absolute; top: 20px; left: 0; display: none; z-index: 1;}
.lang-choice-item {cursor: pointer; white-space: nowrap; margin-bottom: 5px;}
.lang-short {display: none;}

.lang-container-2{position: absolute; top: 35px; left: 10%; font-size: 12px;}

.selected-lang-2 {cursor: pointer;  position: relative; color: #75620c; background: url('../images/icon-arrow-down.png') no-repeat center right; padding-right: 20px; z-index: 1;}
.lang-choices-2{background: #73600c; color: #FFF; padding: 10px 25px 5px 15px; position: absolute; top: 20px; left: 0; display: none; z-index: 1;}
.lang-choice-item-2 {cursor: pointer; white-space: nowrap; margin-bottom: 5px;}
/* menu untuk 2 baris */
.menuflexbox_1{display: flex;flex-wrap: nowrap; text-align:center;}
.menuflexbox_2{display: flex;flex-wrap: nowrap; text-align:center;}
#content {padding-top: 148px;}

#footer {min-height: 400px; margin-top: -400px; background-color: #f7f5f3; color: #73540a; font-size: 15px;}
#footer-inner {padding: 80px 10%;}
.footer-col {float: left;}
.footer-logo {float: left; margin-right: 20px;}
/* .footer-logo-2 {float: left; margin-right: 20px;} */
.footer-contact-container {overflow: hidden;}
.footer-google-map-container {float: left;}
.footer-google-map-container-mobile {display: none; margin-top: 40px;}
.footer-google-map {padding: 8px 15px 8px 60px; display: inline-block; background-color: #d9a300; font-family: 'proxima_novasemibold'; color: #FFF; font-size: 12px; position: relative;}
.footer-google-map img {position: absolute; top: -10px; left: 0;}
.footer-col ul {list-style: none; padding: 0;}
.footer-col li {line-height: 1.7em;}
.footer-col a {color: #73540a;}
#footer-col-1 {width: 35%; padding-right: 2%;}
#footer-col-2 {width: 15%; padding-right: 2%;}
#footer-col-3 {width: 15%; padding-right: 2%;}
#footer-col-4 {width: 15%; padding-right: 2%;}
#footer-col-5 {width: 20%; text-align: right;}
.social-media-container {margin-bottom: 100px;}
.social-media-container img {margin-right: 15px;}
.copyright {float: right;}

.swal2-popup {
	font-size: 1.6rem !important;
}

/* site css untuk toogle menu */
@import "https://fonts.googleapis.com/css?family=Lato:300,700";
@import "https://use.fontawesome.com/releases/v5.7.2/css/all.css";

* { box-sizing: border-box; }

body {
	font-family: "Lato", sans-serif;
	background-color: #c7b7a7;
	background-image: url("http://oi64.tinypic.com/i3zbs7.jpg");
	margin: 0;
}
/* scrollable menu */
/* .scrollable-menu {
    height: auto;
    max-height: 350px;
    overflow-x: hidden;
} */

@media all and (max-width:1100px) {
    .footer-inner{
        padding: 80px 5%;
    }
}


@media all and (max-width:1000px) {
    #header-inner { 
        padding-left:2%;
        padding-right:2%;
    }

    .social-media-container img {margin-right: 10px;}
    #footer-col-1 {width: 40%;}
    #footer-col-5 {width: 15%;}
}

@media all and (max-width:900px) {
    #header-inner { 
        padding-left:10%;
        padding-right:10%;
    }
    
    .nav-container{
        display:none;
    }

    .nav-container2{
        display:inline-block!important;
        text-align:center;
    }
    #header{
        height:160px;
    }
    #content{
        padding-top:160px;
    }
    .nav-item a {color: #73600c; text-decoration: none; margin:25px;}
}

@media all and (max-width:800px) {
    #header-inner { 
        padding-left:2%;
        padding-right:2%;
       
    }

    .lang-container{
        left:2%;
    }

    .extra-nav-container{
        right:2%;
    }

    #header{
        height:160px;
    }
    #content{
        padding-top:160px;
    }

    #footer-col-5 {width: 100%;}
    #footer-col-1 {width: 45%;}
    #footer-col-2 {width: 20%;}
    #footer-col-3 {width: 20%;}
    .social-media-container {margin-bottom: 10px;}
}

@media all and (max-width:750px) {
    #footer-col-1 {width: 60%;}
    #footer-col-2 {width: 40%;}
    #footer-col-3 {width: calc(60% - 66px); margin-left: 66px;}
    #footer-col-4 {width: 40%;}

}
@media all and (max-width:700px) {
    .nav-item { 
        font-size : 11px;
    }

    #header{
        height:120px;
    }

    #content{
        padding-top:120px;
    }
    .dropdown-content{
        margin-top: 36px!important;
    }

    .nav-container2{
        display:none !important;
    }

    .dropdown{
        display: inline-block !important;
    }

    .lang-container{
        /* margin-left:80%; */
        /* //margin-top:20px; */
        margin-top: -17px!important;
        margin-right:25px;
        left:unset; right:0;
    }
	
	.lang-choices {right: 0; left: unset;}
	.lang-short {display: inline-block;}
	.lang-full {display: none;}

    /* .lang-choices{
        display:none!important;
    }

    .lang-choices-2{
        display:inline-block!important;
    } */

    .extra-nav-container{
        display:none;
    }

    .section {padding-left: 5%; padding-right: 5%;}

    .footer-logo {display: none;}
    #footer-col-1 {margin-bottom: 30px;}
    #footer-col-3 {margin-left: 0; width: 40%;}
    #footer-col-2, #footer-col-4{display:none;}
    #footer-col-5 {text-align: left;}
    .copyright {width: 100%; text-align: left;}
    .footer-google-map-container {display: none;}
    .footer-google-map-container-mobile {display: block;}
}

@media all and (max-width:550px) {


    .footer-logo{
        display:none;
    }

    #footer-inner{
        padding: 25px 10%;
    }

    #footer-col-1 {margin-left:0 !important;}
    #footer-col-2 {margin-left:0 !important;}
    #footer-col-3{margin-left:0!important;}

    .pull-left{
        margin-top: -35px!important;
        margin-bottom: 5px!important;
    }

    .footer-col {font-size: 13px;}

}

@media all and (max-width:500px) {
    .footer-col {width: 100% !important;}
    #footer-col-3 {margin-bottom: 30px;}
    .copyright {margin-bottom: 20px;}
}

@media all and (max-width:400px) {
    .pull-left {
        margin-top: -75px!important;
        margin-bottom: 6px!important;
        margin-left: 135px;
        width: 100%;
    }
}

@media all and (max-width:380px) {
    .dropdown{
        display: inline-block !important;
    }

    .lang-container{
        /* margin-left:80%; */
        /* //margin-top:20px; */
        margin-top: -17px!important;
        left:unset;
        right:0;
        
    }

    #footer-col-2{
        display:none;
    }

    #footer-col-4{
        display:none;
    }

    .pull-left{
        margin-top: -35px!important;
        margin-bottom: 5px!important;
    }


    .pull-left {
        margin-top: -75px!important;
        margin-bottom: 6px!important;
        margin-left: 135px;
        width: 100%;
    }



}