@font-face {
  font-family: "Museo500";
  src: url("../fonts/museo500-regular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Museo700";
  src: url("../fonts/museo700-regular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "BankGothic";
  src: url("../fonts/bgothl.ttf") format("opentype");
  font-weight: normal;
  font-style: normal;
}

.wx-title .css-1jngo57{
    color: #fff;
}

body {
	margin: 0;
	padding: 0;
	color: #fff;
	background-image: linear-gradient(rgb(26,26,26), rgb(51,51,51));
}

* {
	box-sizing: border-box;
}

img {
	width: 100%;
}

.bootbox .bootbox-body {
	color: #000;
}

.modal {
  overflow-y: auto;
}

.modal-open {
    overflow: auto;
}

header {
	background: url('../images/background/bg.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	height: 80vh;
}

/* top-bar */
#icons-top {
	/*position: relative;
	display: flex;
	align-items: center;
	left: 197vh;
  top: -2vh;*/
}

#icons-top a {
	color: #000;
	font-size: 28px;
	z-index: 1030;
}

/* search-bar */
#search-bar {
	position: absolute;
	right: 10vh;
	top: 6vh;
	z-index: 1030;
}

#search-bar input {
	border-radius: 20px;
	border: 0;
	padding: 0 30px;
}

#search-bar button {
	border: 0;
	background: none;
	position: relative;
  left: -50px;
  top: -2px;
  color: grey;
  font-size: 20px;
  margin: 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

nav li {
	font-family: "Museo700";
}

.navbar {
	transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
}

.navbar-nav {
	align-items: flex-end!important;
}
.navbar-brand {
	width: 10%;
}

.navbar-nav li {
	margin: 0 10px;
}

.dropdown:hover>.dropdown-menu {
  display: block;
}

.dropdown-item:hover {
    color: white;
    background-color: #d1b561;
}

.dropdown>.dropdown-toggle:active {
  /*Without this, clicking will make it sticky*/
  pointer-events: none;
}

#slider {
	margin: 4vh 10vh 3vh 10vh;
  padding: 20vh 0 2vh 0;
}

.carousel-item {
  /*height: 400px;*/
  max-height: 450px;
}

.carousel-indicators li {
    width: 10px;
    height: 10px;
    border-radius: 100%;
}

.carousel-indicators {
    bottom: -50px;
}

#content {
	margin-top: 30vh;
}

.circle-icon {
  background-color: rgb(209,181,96);
  padding:15px;
  border-radius: 50%;
  align-content: center;
}

.content-icon {
	margin: 5vh;
}

.content-icon i {
	font-size: 35px;
}

.text-caption {
	font-family: "Museo700";
	font-size: 20px;
	color: #fff;
	padding: 15px;
}

.content-whatson {
	margin: 5vh;
}

.content-title {
	color: rgb(255,255,255);
	font-family: "BankGothic";
	font-size: 25px;
	text-align: center;
	letter-spacing: 2px;
}

hr {
	background-color: rgb(209,181,96);
	height: 2px;
}

.content-whatson .content-gallery {
	margin: 4vh 0;
}

.btn-brown {
	background-color: rgb(209,181,96);
	color: rgb(26,26,26);
	font-family: "Museo700";
}

.content-ig {
	margin: 5vh;
}

.footer-content {
	padding: 10vh 4vh 8vh 74vh;
	/*background-color: rgb(209,181,96);*/
	background: url(../images/background/footer.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	color: #000;
}

.footer-content p {
	font-family: "Museo500";
}

.footer-content h5 {
	font-family: "BankGothic";
	font-weight: bold;
}

.footer-caption {
	font-family: "Museo500";
}

.footer-brand {
	padding: 2vh;
	background-color: rgb(26,26,26);
	color: rgb(209,181,96);
}

.footer-brand h5 {
	font-family: "Museo700";
}

/* Back to top button */

.back-to-top {
  position: fixed;
  display: none;
  background-color: rgb(209,181,96);
  color: #fff;
  width: 44px;
  height: 44px;
  text-align: center;
  line-height: 1;
  font-size: 16px;
  border-radius: 50%;
  right: 15px;
  bottom: 15px;
  transition: background 0.5s;
  z-index: 11;
}

.back-to-top i {
  padding-top: 12px;
  color: #fff;
}

#about-us {
	margin: 7vh 0;
	padding: 0 10vh;
}

.jumbotron {
	background: url('../images/background/background.jpg') rgba(0,0,0,0.5);
	background-repeat: no-repeat;
	background-size: cover;
	height: 80vh;
}

.display-4 {
	font-family: "Museo500";
	font-weight: bold;
	padding-top: 30vh;
	color: #fff;
	font-size: 5rem;
	word-wrap: break-word;
}


.divider {
	width: 25%;
}

/*.card img {
	transform: scale(0.8);
}*/

/*.card img:hover {
	transform: scale(1);
}*/

.lease-icon {
	margin: 1.5vh;
}

.lease-icon i {
	font-size: 25px;
}

.text-brown {
	color: rgb(209,181,96);
}

#captcha_img {
	padding: 2vh 3vh;
}

#detail-whatson {
	margin: -58vh 0 0 0;
	background-image: linear-gradient(rgb(26,26,26), rgb(51,51,51));
	padding: 2vh;
	font-family: 'Museo500';
}

#detail-whatson .title {
	font-size: 35px;
  text-align: center;
  padding: 2vh;
}

#detail-whatson .img-banner {
	padding: 5vh 50vh;
}

#detail-whatson .description {
	padding: 2vh 20vh;
}

#facilities {
	margin: 7vh 0 0 0;
	padding: 10px;
}

#facilities img {
	height: 100px;
	width: 100px;
}

#facilities .figure-caption {
	font-size: 14px;
  color: #fff;
  font-family: 'Museo500';
  text-align: center;
}

#detail-facility {
	margin: 8vh 0 0 0;
	padding: 10px;
	font-family: 'Museo500';
}

#detail-facility .context {
  padding: 0 20vw;
  text-align: center;
}

@media (min-width: 481px) and (max-width: 980px) {
	.footer-content {
		padding: 2vh 2vh 2vh 10vh;
	}

	header {
		height: 18vh;
	}

	.navbar-brand {
		width: 10%;
	}

	#slider {
	  margin: 1vh;
		padding: 7vh 5vh 0 5vh;
	}

	#content {
		margin-top: 17vh;
	}

	#about-us {
		margin-top: 13vh;
		padding: 5vh;
	}

	.display-4 {
		padding-top: 16vh;
	}

	.jumbotron {
		height: 30vh;
	}

	.navbar-nav {
		align-items: flex-end!important;
	}
}

@media (min-width: 0) and (max-width: 480px) {

	.text-caption {
		font-size: 16px;
	}

	.footer-content {
		padding: 3vh;
		background: url(../images/background/footermobile.jpg);
		background-repeat: no-repeat;
		background-size: cover;
	}

	.footer-content h5 {
		font-size: 15px;
	}

	.footer-content .foot-icon, .footer-content p {
		font-size: 12px;
	}

	.footer-brand h5 {
		font-size: 12px;
	}

	.navbar-brand {
		width: 55%;
		transform: translateX(-25%);
		left: 55%;
		/*position: absolute;*/

	}

	.navbar-nav {
		align-items: flex-start!important;
	}

	#content {
		margin-top: 20vh;
	}

	#content i {
		font-size: 23px;
	}

	header {
		height: 27vh;
	}

	#slider {      
    margin: 0 3vh;
		padding: 12vh 0 0 0;
	}

	.carousel-indicators {
		bottom: 45px;
	}

	.carousel-item {
		height: 225px;
	}

	#about-us {
		margin-top: 60vh;
		padding: 2vh 5vh;
	}

	.display-4 {
		margin: 0;
		padding: 35vh 2vh;
		font-size: 35px;
	}

	.jumbotron {
		background: url('../images/background/background_mobile.jpg') rgba(0,0,0,0.5);
		background-repeat: no-repeat;
		background-size: cover;
	}

	/*search-bar*/

	#search-bar {
		position: inherit;
		right: 0;
		top: 0;
		margin-bottom: -5vh;
	}

	#search-bar input {
		padding: 0;
	}

	#search-bar button {
		left: 170px;
		top: -40px;
	}

	#icons-top {
		position: inherit;
		right: 0;
		top: 0;
	}

	/*detail-whatson page*/
	#detail-whatson {
		margin: -15vh 0 0 0;
	}

	#detail-whatson .img-banner {
		padding: 2vh 6vh;
	}

	#detail-whatson .description {
		padding: 2vh 4vh;
	}

	/*facilities*/
	#detail-facility .context {
	  padding: 0;
	}

}