header{
		position: fixed;
		width: 100%;
		left: 0; top: 0;
		z-index: 99;
		font-family: 'Manrope', sans-serif;
		font-weight: bold;
		padding: 2vw 0;
		transition:0.3s; -webkit-transition:0.3s;
	}
	header.fixed{
		background: #344e41;
		padding: 0.7vw 0;
	}
	header a.logo{
		float: left;
		color: #fff;
		font-size: 3.2vw;
		transition:0.3s; -webkit-transition:0.3s;
	}
	header.fixed a.logo{
		font-size: 3.2vw;
	}
	header a.logo img{
		float: left;
		width: 320px;
		height: auto;
	}
	.menucontrols{
		float: right;
	}
	.menucontrols a{
		float: left;
		width: 4vw; height: 4vw;
		color: #fff;
		font-size: 1.4vw;
	}
	a.hidemenu{
		position: fixed;
		right: 1vw; top: 1vw;
		width: 2vw; height: 2vw;
		color: #000;
		font-size: 2.2vw;
		transition:1.6s;
		-webkit-transition:1.6s;
		opacity: 0;
		visibility: hidden;
	}
	nav{
		position: fixed;
		right: -30vw; top: 0;
		background: #fff;
		z-index: 99;
		width: 25vw;
		height: 100%;
		padding: 5vw 5vw 5vw 5vw;
		overflow-y: auto;
		transition:0.6s;
		-webkit-transition:0.6s;
		opacity: 0;
		box-shadow: 0 0 40px rgba(0,0,0,0.25);
	}
	nav.active{
		right: 0;
	}
	
	nav ul li{
		font-size: 1.2vw;
		margin-bottom: 2vw;
	}
	nav ul li a{
		color: #000;
		border-bottom: 1px solid rgba(0,0,0,0);
		transition:0.6s; -webkit-transition:0.6s;
	}
	nav ul li a:hover, nav ul li.active a{
		color: #344e41;
		border-bottom: 1px solid #344e41;
	}
	.banner{
		padding: 20vw 0 14vw 0;
		background-size: cover !important;
		font-family: 'Manrope', sans-serif;
		position: relative;
		z-index: 1;
	}
	.banner:before{
		background: linear-gradient(to bottom, rgba(0,0,0,0.15), rgba(0,0,0,0.4));
	}
	.banner .text{
		float: left;
		width: 65%;
	}
	.banner .text h1{
		color: #fff;
		font-size: 5.1vw;
		line-height: 100%;
		margin-bottom: 3vw;
		text-shadow: #555;
	}
	.banner .text h3{
		color: #fff;
		font-size: 3vw;
		line-height: 120%;
		margin-bottom: 2vw;
		font-weight: medium;
		text-shadow: #555;
	}
	.banner .text h1 span, .banner .text h3 span{
		color: #000;
	}
	.banner .text a{
		float: left;
		padding: 1.3vw 3vw;
		background: #f2e8cf;
		color: #000;
		font-size: 1.2vw;
		font-weight: 600;
		border-radius: 9vw;
	}
	.banner .text a span{
		margin-left: 0.7vw;
	}
	.banner .text a:hover{
		background: #FAF9F6;
		color: #000;
	}
	.banner img{
		float: left;
		width: 100%;
		height: auto;
	}

	.brands{
		background: #fff;
		border-bottom: 1px solid #ddd;
		padding: 2vw 0;
	}
	.brands img{
		margin-left: auto;
		margin-right: auto;
		float: none;
		width: 19%;
		height: auto;
	}

	.services{
		padding: 6vw 0 6vw 0;
		font-family: 'Manrope', sans-serif;
	}
	
	.services h2{
		text-align: center;
		color: #000;
		font-size: 4.3vw;
		margin-bottom: 1.5vw;
	}
	.services h4{
		text-align: center;
		color: #000;
		font-size: 1.2vw;
		margin-bottom: 4vw;
		font-weight: 500;
		padding:0 15%;
		line-height: 140%;
	}
	.amenities {
		display: flex;
		justify-content: space-around;
		margin: 20px 0;
	}
	
	.amenity {
	flex: 1;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;

	}
	
	.amenity i {
	font-size: 3em;
    color: #333;
    margin-bottom: 10px;

	}

	.slideshow-container {
		max-width: 1000px;
		position: relative;
		margin: auto;
	}
	.mySlides {
		display: none;
	}
	.prev, .next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		margin-top: -22px;
		padding: 16px;
		color: white;
		font-weight: bold;
		font-size: 18px;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
	}
	.next {
		right: 0;
		border-radius: 3px 0 0 3px;
	}
	.prev:hover, .next:hover {
		background-color: rgba(0,0,0,0.8);
	}
	.numbertext {
		color: #555;
		font-size: 12px;
		padding: 8px 12px;
		position: absolute;
		top: 0;
	}
	.dot {
		cursor: pointer;
		height: 10px;
		width: 10px;
		margin: 0 2px;
		background-color: #bbb;
		border-radius: 50%;
		display: inline-block;
		transition: background-color 0.6s ease;
	}
	.active, .dot:hover {
		background-color: #FAF9F6;
	}
	.fade {
		animation-name: fade;
		animation-duration: 1.5s;
	}
	
	@keyframes fade {
		from {opacity: .4}
		to {opacity: 1}
	}
	
	
	  /* On smaller screens, decrease text size */
	@media only screen and (max-width: 300px) {
		.prev, .next,.text {font-size: 11px}
	}

	.map{
		float: left;
		width: 100%;
	}
	.map iframe{
		float: left;
		width: 100%;
		height: 400px;
	}


	footer{
		background: #f2e8cf;
		padding:5vw 0;
		font-family: 'Manrope', sans-serif;
		font-weight: 500;
	}
	footer .copyright{
		float: left;
		color:#000;
		font-size:1.3vw;
	}
	footer .copyright a{
		color: #000;
		border-bottom: 1px solid #000;
	}
	footer .copyright span.company{
		font-size: 1vw;
	}
	footer .copyright span.company a{
		border-bottom: none;
	}
	footer .social{
		float: right;
		color:#000;
		font-size:1.3vw;
	}
	footer .social a{
		float: left;
		color: #000;
		margin-left: 1vw;
	}
	footer .arrow{
		padding-left: 0.3rem;
	}