@media screen and (min-width: 768px){

	.estate .wrapper .side.visible span.hor-line{display: none;}
}

@media screen and (max-width: 767px) {
	.mobile-visible{display: block;}
	.mobile-invisible{display: none;}

    /* menu */
    .menu h1 a img{width: 120px;}
	.menu .nav {margin: 30px 0 0 0;}
    .menu .nav li {margin: 0 0 5px 0; width: 100%;}
    .menu .nav a {font-size: 2rem; font-weight: 400;}
    .menu .lang {float: none; position: absolute; bottom: 80px;}
    .menu ul.lang li {margin: 5px 0; width: 100%;}
    .menu ul.lang li a{font-size: 1.4rem; font-weight: 400;}

	a.tree{top: 0; left: 0; margin: 3% 2%;}

    /* home */
    .home .wrapper h1{margin-left: -60px;}
    .home .wrapper h1 img{width: 120px; max-width: 120px; height: 117px;}
    .home .wrapper .gallery .message {top: 55%;}
    .home .wrapper .gallery h2 {font-size: 10rem;}
    .home .wrapper .gallery p.subtitle {font-size: 1.8rem; max-width: 90%;}
    .home .wrapper .gallery .slick-dots {bottom: 80px; right: 0; padding: 0;}
    .home .wrapper .gallery .slick-dots li::before {font-size: 1.4rem;}

    .home footer{display: none;}

    /* estate */
	.estate .wrapper{display: flex; flex-direction: column}    
	
	.room.piggies .home-link, .room.central-building .home-link, .room.swallows .home-link, .room.yard .home-link, .room.gardens .home-link, .room.crickets .home-link, .room.pool .home-link{top: 0; left: 0; margin: 3% 2%;}
	
	.estate .wrapper .page-gallery{order: 1; height: calc(100vh - 80px); }
	.estate .wrapper .page-gallery .slick-dots{display: none!important;}
	.estate .wrapper .side{order: 2; position: static; width: 100%; height: auto; padding: 20px 10px;}
	.estate .wrapper .side a.home-link{display: none;}
	.estate .wrapper .side .content{position: static; transform: none;}
	.estate .wrapper .side .content h1{font-size: 6rem;}
	.estate .wrapper .side.visible a#slide{display: none;}
	.estate .wrapper .side.visible span.hor-line{display: block; position: absolute; width: 100%; height: 30px; left: 0; top: auto; bottom: 80px; background: url(../img/misc/slide-hor.png) no-repeat top center; z-index: 1001;}
	.estate .wrapper .side .content p{font-size: 1.4rem;}

	.estate footer{position: static; order: 3; background: #F2E900;}
	.estate footer .copyright{margin: 0; color: #59582B;}
	.estate footer .credits{float: left; text-align: left; color: #59582B;}
	.estate footer a, .estate footer a:hover, .estate footer a:active{color: #59582B;}

	/* rooms */
	.room .container .room-content{width: 100%;}
	.room .container .room-content h2{width: auto; font-size: 6rem;}
	.room .container .amenities{width: 100%; padding: 0;}
	.room .container .amenities ul li{width: calc(50% - 25px);}

	.mouse-wrapper a.scroll{bottom: 60px;}

	.central{padding: 0 10px;}
	.central h1{font-size: 6rem;}
	.central p{font-size: 1.8rem!important;}
	
	.room #room-carousel .carousel-inner{height: 100vh;}
	.room #room-carousel .carousel-inner .item{height: 100vh;}
	.room #room-carousel .carousel-indicators{bottom: 20px!important;}
	.room #room-carousel ul.thumbnails-carousel{display: none;}
	.room #room-carousel .carousel-indicators li{width: 25px;}
	.room #room-carousel .carousel-indicators li.active{width: 25px;}
	.room #room-carousel .carousel-indicators{display: none;}

	.room .wrapper#main{margin: 0 0 20px 0;}
	.room .internal-nav{margin: 20px 0 0 0;}
	.room .internal-nav .prev-next{padding: 20px 10px;}
	.room .internal-nav .prev-next h3{font-size: 1.4rem; padding: 0 0 110px 0;}
	.room .internal-nav .prev-next .prev .divider, .room .internal-nav .prev-next .next .divider{height: 145px; top: -5px}
	

	.room footer{position: static; order: 3; background: #fff;}
	.room footer .copyright{margin: 0; color: #59582B;}
	.room footer .credits{float: left; text-align: left; color: #59582B;}
	.room footer a, .room footer a:hover, .room footer a:active{color: #59582B;}

	/* accommodation */
	/* =map */
	#canvas-mask{display: none;}
	#draggable{display: none;}

	#canvas-mask-mobile {
		display: block;
		position: absolute;
		left: 50%;
		top: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);

		height: 100vh;
		width: 100%;
		border-radius: 0;
		overflow: hidden;
	}

	#canvas-mask-mobile .handle {
		width: 800px;
		height: 1000px;
		border-radius: 0;
	}

	#canvas-mask-mobile .handle .page {
		float: left;
		position: relative;
		width: 50%;
		height: 50%;
	}

	#canvas-mask-mobile .handle .page .map-container {
		position: absolute;
		top: 0;
		left: 0;
		margin: 0;
		cursor: move;
		cursor: grab;
		cursor: -moz-grab;
		cursor: -webkit-grab;
	}
	#draggable-mobile{
		display: block;
	 	width:800px;
	 	height: 1000px;
	 	max-width: 800px;
	}

	.accommodation .wrapper{display: block;}
	.accommodation #canvas-mask-mobile{order: 1; position: relative; top: 0; left: 0; -webkit-transform: none; transform: none; height: calc(100vh - 80px); display: block;}
	.accommodation .alert{width: 290px; margin-left:-145px; font-size: 1.3rem!important;}
	.accommodation .wrapper .side{margin: 0 0 20px 0;}
	.accommodation .wrapper .side.visible span.hor-line{display: block; position: absolute; width: 100%; height: 30px; left: 0; top: auto; bottom: 80px; background: url(../img/misc/slide-hor.png) no-repeat top center; z-index: 1001;}

	.accommodation footer{position: static; order: 3; background: #fff;}
	.accommodation footer .copyright{margin: 0; color: #59582B;}
	.accommodation footer .credits{float: left; text-align: left; color: #59582B;}
	.accommodation footer a, .accommodation footer a:hover, .accommodation footer a:active{color: #59582B;}

	/* contact */
	.estate .wrapper .google-map{order: 1; height: calc(100vh - 80px);}

}
/* 767px;
 */

 @media screen and (min-width: 767px) and (max-width: 1023px){
 	.menu .nav{margin: 40px 0 0 0;}
 	.menu .nav li{width: 100%; margin: 0 0 10px 0;}
 	.menu .lang{margin: 40px 0 0 0;}

	.room .container .room-content{width: 100%;}
	.room .container .amenities{width: 100%;}
	.room .internal-nav .prev-next{padding: 55px 20px;}
 	.room .internal-nav .prev-next h3{font-size: 3.2rem;}
 	.room .internal-nav .prev-next .prev, .room .internal-nav .prev-next .next{padding: 20px 0;}
 	.room .internal-nav .prev-next .prev .divider, .room .internal-nav .prev-next .next .divider{height: 180px;}

 	.alert{right: 20px; margin-left: 0; font-size: 1.4rem!important; width: 240px; left: auto}
 }

  @media screen and (width: 1024px){
  	.menu .nav{margin: 100px 0 0 0;}
  	.menu .nav a{font-size: 2.3rem;}
  	.menu .lang{margin: 0; position: absolute; bottom: 50px}
  	
  	.alert{right: 50px; margin-left: 0; font-size: 1.4rem!important;}

	.estate.page-estate .wrapper .side .content h1{margin: -10px 0 10px 0; font-size: 6rem;}
  	.estate.page-estate .wrapper .side .content p{margin: 0 0 1rem 0;}

  	.room .internal-nav .prev-next h3{font-size: 4.2rem;}
  }

/* short screens */
@media screen and (max-height: 760px) and (min-width: 1024px){
	.estate .wrapper .side .content{
		transform: none;
		top: 100px
	}
}

/* landscape iphone */
@media screen and (min-width:320px) and (max-width:767px) and (orientation:landscape) {
	.menu{padding: 20px;}
	.menu .nav{margin: -20px 0 0 0;}
	.menu .nav li{width: auto; margin: 0 10px 10px 10px;}
	.menu ul.lang{ width: calc(100% - 40px);}
	.menu ul.lang li{margin: 0 10px; width: auto;}

}

/* short smartphones */
@media screen and (max-height: 600px){
	.menu .nav{margin: 20px 0 0 0;}
	.menu .lang{bottom: 60px;}

	.mouse-wrapper a.scroll{bottom: 40px;}

	.estate .wrapper .side .content h1{font-size: 5.4rem;}
}