@charset "UTF-8";
/* CSS Document */

/*img[usemap] {
	border: none;
	height: auto;
	max-width: 100%;
	width: auto;
}*/

.logo-hapsengland{
	background-image: url(../templates/images/logo-hapsengland.png);
	height:31px; 
	width:150px;
	}

.map{
	margin:0 auto;
	}

.full-height{
	height:100%;
	}
	
.image-scale{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	}
		

.backtopage{
	margin-top:50px;
	}
	
ul{
	list-style:none;
	padding:0;
	margin:0;
	}
	
ol{
	padding:0;
	margin:0 0 0 20px;
	}

.liststyle{
	list-style:circle; 
	margin-left:20px;
	}
	
.back-button{
	padding:18px 0 0 0;
	margin-right:10px;
	float:left;
	width:25px;
	}
	
.logo{
	padding:18px 0 0 0;
	}
	
.margin-bottom-none{
	margin-bottom:0;
	}
	
.prev-slide{
	background:url(../images/global/ui_prev_green.png) left top no-repeat;
	padding:0 0 0 30px;
	}

.next-slide{
	background:url(../images/global/ui_next_green.png) left top no-repeat;
	padding:0 0 0 30px;
	}
	
.download{
	background:url(../images/global/ui_down_green.png) left top no-repeat;
	padding:0 0 0 30px;
	}
	
.align-middle-wrap{
	display:table;
	}
	
.align-middle{
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	}
	
.background-off{
	background:none;
	}



/* navigation bar */

#menu{
	margin: 20px 0 0 0;
	padding: 0;
	list-style: none;
	float: right;
	font-family: 'century_gothicregular';
	}
	
/*#menu li {
	position: relative;
	float: left;
}

#menu li a{
	display: block;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	text-decoration: none;
	height: 40px;
	padding: 0 12px;
	color: #FFF;
	font-size: 12px;
	font-weight: normal;
}

#menu li.active a:hover{
	cursor:pointer;
	background-color: none;
	color: #44ac8f;
	border-bottom:4px solid #44ac8f;
	outline: none;
}*/

#menu li.active a{
	background-color: none;
	color: #44ac8f;
	border-bottom:4px solid #44ac8f;
}

#menu li ul li a{
	color: #fff;
}

#menu li.active ul li a{
	cursor:pointer;
	background-color: none;
	color: #fff;
	border-bottom:none;
	outline: none;
}

#menu li.active ul li a:hover{
	cursor:pointer;
	background-color: none;
	color: #fff;
	border-bottom:none;
	outline: none;
}

/* SLIDE 00 - Home */
    
	
/* SLIDE 01 - Intro */

.image-development{
	background:url(../images/global/background.jpg) center center no-repeat fixed; 
	-webkit-background-size: cover;  
	-moz-background-size: cover; 
	-o-background-size: cover; 
	background-size: cover;
}


/* SLIDE 02 - Uniqueness */
.section2-bg{
	background:url(../images/global/background-white.jpg) center center repeat fixed; 
	width:100%;
	height:100%;
	-webkit-background-size: cover;  
	-moz-background-size: cover; 
	-o-background-size: cover; 
	background-size: cover;
	}
	

/* SLIDE 03 - Floor Plan */
.section3-bg{
	background:url(../images/global/background.jpg) center center no-repeat fixed;
	width:100%;
	height:100%;
	-webkit-background-size: cover;  
	-moz-background-size: cover; 
	-o-background-size: cover; 
	background-size: cover;
}

.section3-prev-slide{
	background:url(../images/global/ui_prev_green.png) left top no-repeat;
	margin:10px auto; 
	padding:3px 0 3px 35px;
	cursor:pointer;
	}

.section3-next-slide{
	background:url(../images/global/ui_next_green.png) left top no-repeat;
	margin:10px auto; 
	padding:3px 0 3px 35px;
	cursor:pointer;
	}

.plus-sign{
	background:url(../images/global/ui_plus.png) left top no-repeat;
	padding:0 0 0 30px;
	}

/* floor plan zoom */

.middle-block {
	text-align: center;
	}
	 
.middle-block:before {
	content: '';
	display: inline-block;
	height: 100%; 
	vertical-align: middle;
	margin-right: -0.25em; /* Adjusts for spacing */
		
	/* For visualization 
	background: #808080; width: 5px;
	*/
	}
	

/* floor plan zoom */

.image-link {
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
	cursor: zoom-in;
	}
	
/* This block of CSS adds opacity transition to background */
.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
  opacity: 0;
  /*-webkit-backface-visibility: hidden;
   ideally, transition speed should match zoom duration */
  -webkit-transition: all 0.3s ease-out; 
  -moz-transition: all 0.3s ease-out; 
  -o-transition: all 0.3s ease-out; 
  transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
    opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
    opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container, 
.mfp-with-zoom.mfp-removing.mfp-bg {
  opacity: 0;
}

/* padding-bottom and top for image */
.mfp-no-margins img.mfp-img {
	padding: 0;
	}

/* position of shadow behind the image */
.mfp-no-margins .mfp-figure:after {
	top: 0;
	bottom: 0;
	}

/* padding for main container */
.mfp-no-margins .mfp-container {
	padding: 0;
	}
	
/* aligns caption to center */
.mfp-title {
	text-align: center;
	padding: 6px 0;
	}
	

	
/* SLIDE 04 - Location */
.bg-white{
	background-color:#ffffff;
	}

/* SLIDE 05 - Gallery */

.section5-fh{
	height:100%;
	}

.prevButton {
	position: absolute;
	top: 50%;
	left: 50px;
	width: 27px;
	height: 62px;
	background-image: url(../images/global/prev.png);
	z-index: 999;
}
			
.nextButton {
	position: absolute;
	top: 50%;
	right: 50px;
	width: 27px;
	height: 62px;
	background-image: url(../images/global/next.png);
	z-index: 999;
}


@media (max-width : 480px){
.prevButton {
	left: 20px;
	}
				
.nextButton {
	right: 20px;
	
	}
}

		

/* SLIDE 06 - CONTACT */

.address-title{
 	width:80px;
	margin:0;
	float:left;
 	}

.address-divider{
 	width:15px;
	float:left;
	margin:0;
	color:#999999;
 	}
	
.address-content{
	float:left;
 	min-width:165px;
	margin:0;
	}

.address-content a{
 	color:#46ae90;
	}

.address-container{
	width:100%;
	margin-bottom:20px;
	display:inline-table;
	}
	
.address-row{
	display:block;
	}
	
.address-col{
	display:inline-block;
	text-align:left;
	vertical-align:top;
	}	
	
.address-col strong{
	color:#333333;
	text-transform:capitalize;
	}

.address-h1 {
	color: #44ac8f;
	font-size: 15px;
	font-weight: bold;
	display: block;
}


.icon-google-maps{
	background:url(../templates/images/icon-google-maps.png) left top no-repeat;
	width:40px;
	height:40px;
	float:left;
	margin-right:8px;
	}
	
.icon-waze{
	background:url(../templates/images/icon-waze.png) left top no-repeat;
	width:40px;
	height:40px;
	float:left;
	}



@media (min-width: 1024px) {
.full-height-s{
	height:100%; 
}
}


@media (min-width: 769px) {
.section-fh{
	height:100%; 
}
}

