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

@media only screen and (max-width: 1200px) { 
	/* HOME.INC.PHP */
		#home-banner-container-1 {	height: 600px; }
		#home-banner-container-2 {	height: 600px; }
		#home-banner-container-text {			width: 80vw;			left: 10%	}
		#home-banner-header { font-size: 3.0em }
		
		#guestbook-banner-container-1	{ height: 600px; }
		#wedding-banner-container-1 { height: 600px; }
		#accommodation-detail-1 #accommodation-banner-container { height:  600px; }
		
		
		h1 { 	font-size: 3.4rem; 	}
		h2 {	font-size: 2.8rem; 	}
		h3 {	font-size: 2.1rem; 	}
		h4 {	font-size: 1.5rem; 	}
				
		.page-body-width-22vw { 	margin: auto 16vw; 		}
		.page-body-width-20vw { 	margin: auto 12vw; 		}
		.page-body-width-15vw { 	margin: auto 12vw; 		}
		.page-body-width-10vw { 	margin: auto 8vw; 		}
		
		.margin-top-40px  { padding-top: 30px; }
		.margin-top-60px  { padding-top: 40px; }
		.margin-top-100px  { padding-top: 60px; }
		.margin-top-120px  { padding-top: 80px; }
		.margin-top-150px  { padding-top: 120px; }

		.margin-bottom-30px  { padding-bottom: 20px; }
		.margin-bottom-40px  { padding-bottom: 30px; }
		.margin-bottom-60px  { padding-bottom: 40px; }
		.margin-bottom-100px  { padding-bottom: 60px; }
		.margin-bottom-120px  { padding-bottom: 80px; }
		.margin-bottom-150px  { padding-bottom: 120px; }

		
		
}

@media only screen and (max-width: 1000px) { 
		.menu-desktop { display: none; }
		.menu-mobile { display: block; }	
}


@media only screen and (max-width: 900px) { 

	/* HOME.INC.PHP */
		#home-banner-container-1 {	height: 500px; }
		#home-banner-container-2 {	height: 500px; }
		#home-banner-container-text {			width: 70vw;			left: 15%	}		
		
		#guestbook-banner-container-1	{ height: 500px; }
		#guestbook-banner-container-1 #guestbook-banner-container-text { left:5%; width: 90vw; top: 35%; }
		#wedding-banner-container-1 { height: 500px; }
		#wedding-banner-container-1 #wedding-banner-container-text { left:5%; width: 90vw; top: 35%; }
		#accommodation-detail-1 #accommodation-banner-container { height:  500px; }
		
		h1 { 	font-size: 3.0rem; 	}
		h2 {	font-size: 2.6rem; 	}
		h3 {	font-size: 1.9rem; 	}
		h4 {	font-size: 1.3rem; 	}
		
		.page-body-width-22vw { 	margin: auto 12vw; 		}
		.page-body-width-20vw { 	margin: auto 10vw; 		}
		.page-body-width-15vw { 	margin: auto 10vw; 		}
		.page-body-width-10vw { 	margin: auto 5vw; 		}
		
		.margin-top-40px  { padding-top: 20px; }
		.margin-top-60px  { padding-top: 40px; }
		.margin-top-100px  { padding-top: 50px; }
		.margin-top-120px  { padding-top: 60px; }
		.margin-top-150px  { padding-bottom: 80px; }
		
		.margin-bottom-40px  { padding-bottom: 20px; }
		.margin-bottom-100px  { padding-bottom: 50px; }
		.margin-bottom-120px  { padding-bottom: 60px; }
		.margin-bottom-150px  { padding-bottom: 80px; }
	
}




@media only screen and (max-width: 640px) { 
	
	/* HOME.INC.PHP */
		#home-banner-container-1 {	height: 300px; }
		#home-banner-container-2 {	height: 300px; }
		#home-banner-container-text {			width: 90vw;			left:5% 	}
		
		#guestbook-banner-container-1	{ height: 300px; }
		#guestbook-banner-container-1 #guestbook-banner-container-text { left:5%; width: 90vw; top: 35%; }
		
		#wedding-banner-container-1 { height: 300px; }
		#wedding-banner-container-1 #wedding-banner-container-text { left:5%; width: 90vw; top: 35%; }
		#accommodation-detail-1 #accommodation-banner-container { height:  300px; }
		#contact-detail .contact-address { margin-top: 40px; }
		#reservation-availability-calendar { margin-top: 40px; }
		
		img.home-image-accommodation { padding-left: 0px; padding-right: 0px;  }
		picture.home-image-accommodation { padding-left: 0px; padding-right: 0px;  }
		
		h1 { 	font-size: 2.4rem; 	}
		h2 {	font-size: 2.0rem; 	}
		h3 {	font-size: 1.7rem; 	}
		h4 {	font-size: 1.2rem; 	}

		.page-body-width-22vw { 	margin: auto 5vw; 		}
		.page-body-width-15vw { 	margin: auto 5vw; 		}
		.page-body-width-10vw { 	margin: auto 5vw; 		}

		.accommodation-section-1 { 	padding-bottom: 40px; }	/* padding between left/right when vertical */
		.home-image-accommodation-text { margin: auto 0%; }
		.mobile-bottom-margin { padding-bottom: 60px; }
		
		#logo-footer { padding-bottom: 50px; width: 80%;  display: block;  margin-left: auto;  margin-right: auto;  }	
		.footer-text.col-1 { padding-bottom: 30px; }
		.footer-text.col-2 { padding-bottom: 50px; }

		.no-mobile { display: none; }
		
	/* GALLERY STYLING ONLY APPLES TO MOBILE < 640 ALL OTHER SPACING BY JS IN GALLERY.INC.PHP */
		#gallery-container { margin-left: 5vw; margin-right: 5vw; padding-left: 0px; padding-right: 0px;  }
		#gallery-container .galleryRowFirst { padding-top: 2.5vw; }
		#gallery-container .galleryRowlast { padding-bottom: 2.5vw; }
		#gallery-container .galleryCol1, 
		#gallery-container .galleryCol2,
		#gallery-container .galleryCol3 { padding-left: 0px; padding-right: 0px; margin-left: 0px; margin-right: 0px; padding-top: 2.5vw; padding-bottom: 2.5vw;}
		

}