@charset "utf-8";
#layout {
}
#bar {
  width: 320px;
}
#barCtrl {
  left: 25px;
  top: 27px
}
#barBox {
	top: 0;
	left: 0;
	width: 256px;
	margin: 30px auto;
	padding: 25px;
	line-height: 28px;
}
#amenities {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  padding: 57px 0 0 88px;
  z-index: 99;
}

.amenitiesBox {
  width: 270px;
  background: rgb( 141, 198, 69 );
  background: rgba( 141, 198, 69, 0.9 );
  border: none;
  outline-width: 0px !important;     
}

.amenitiesButton {
  font-family: Dosis, sans-serif; font-weight: 200;
  font-size: 40px;
  text-align: center;
  width: 270px;
  height: 72px;
  background: rgb( 141, 198, 69 );
  background: rgba( 141, 198, 69, 0 );
  border: none;
  outline-width: 0px !important;
  cursor: default !important;    
}

.amenitiesText {
  width: 270px;
  display: none;
  font-size: 20px;
}

/* fake ipad */
@media screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
  .tabButton.amenities {
    width: 325px
  }
}
/* ipad */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	.amenitiesBox {
  width: 325px;
  background: rgb( 141, 198, 69 );
  background: rgba( 141, 198, 69, 0.8 );
  border: none;
  outline-width: 0px !important;     
}
	.amenitiesButton {
  font-family: Dosis, sans-serif; font-weight: 200;
  font-size: 40px;
  text-align: center;
  width: 325px;
  height: 72px;
  background: rgb( 141, 198, 69 );
  background: rgba( 141, 198, 69, 0 );
  border: none;
  outline-width: 0px !important;    
}
#barBox {
	top: 0;
	left: 0;
	width: 270px;
	margin: 30px auto;
	padding: 25px;
	line-height: 34px;
	font-size: 20px;
}

}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
		.amenitiesBox {
  width: 325px;
  background: rgb( 141, 198, 69 );
  background: rgba( 141, 198, 69, 0.9 );
  border: none;
  outline-width: 0px !important;     
}
	.amenitiesButton {
  font-family: Dosis, sans-serif; font-weight: 200;
  font-size: 40px;
  text-align: center;
  width: 325px;
  height: 72px;
  background: rgb( 141, 198, 69 );
  background: rgba( 141, 198, 69, 0 );
  border: none;
  outline-width: 0px !important;    
}
#barBox {
	top: 0;
	left: 0;
	width: 270px;
	padding: 25px;
	line-height: 34px;
	  font-size: 20px;
}

}

/* fake iphone */
@media screen
and (max-width : 736px) {
  #layout {
    overflow: hidden;
  }
  #bar {
    display: none;
  }

  #citeCtrl {
    display: block;
  }

  #menu {
    width: 0;
  }

  #info {
    display: ;
  }

  #amenities {
    bottom: 0;
    padding: 75% 0 0 10%;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .amenitiesBox {
    width: 355px;
  }

  .amenitiesButton {
    text-align: left;
    width: 355px;
    padding-left: 15px;
  }

  .amenitiesText {
    width: 315px;
    margin: 0 20px;
    display: block;
  }
}  
/* iphone */
@media only screen 
and (max-device-width : 736px) 
and (orientation : portrait) {
  #amenities {
    padding: 110% 0 0 6%;
  }
}

@media only screen 
and (max-device-width : 736px) 
and (orientation : landscape) {
  #amenities {
    padding: 45% 0 0 25%;
  }
  #info {
    display: none;
  }
}
