/* Custom CSS added by Romel Gudes */
#sidebar-holder, #sidebar-holder .promobox { max-width: 100%; }

/* Large desktop */
@media (min-width: 1200px) { }
 
/* 980px by 1280px */
@media (min-width: 980px) and (max-width: 1024px) { 
	#menu-wrap { margin-left: -2px; }
}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { 
	#menu-wrap { margin-left: -160px; }

	.slideshow { height: 195px; }
	.slideshow img { width: auto !important; height: auto !important; }
	a#promo1Img, a#promo2Img, a#promo2Img { background-size: cover; }
	#image-holder #promo1 .caption, #image-holder #promo2 .caption, #image-holder #promo3 .caption { max-width: 100%; }
}
 
/* Landscape phone to portrait tablet */
@media (min-width: 481px) and (max-width: 767px) { 
	#menu-wrap { margin-left: 0; margin-top: 0; margin-bottom: 20px; position: absolute; left: 0; width: 100%; z-index: 999; }
	#menu-wrap ul li, li a { width: 98.15%; }
	.slideshow { height: 170px; }
	.slideshow img { width: auto !important; height: auto !important; }
	a#promo1Img, a#promo2Img, a#promo2Img { background-size: cover; }
	#image-holder #promo1 .caption, #image-holder #promo2 .caption, #image-holder #promo3 .caption { max-width: 100%; }
	#sidebar-holder #promo1 .caption, #sidebar-holder #promo2 .caption, #sidebar-holder #promo3 .caption { width: 100%; }
	#intro .text-image { float: none; width: 100%; height: auto; }

	/* gallery */
	#left-col #gallery { text-align: center; position: relative; left: 20px; }
	body#galleryPage #left-col #gallery a { margin: 0 20px 20px 0; float: left; width: 40%; }
	body#galleryPage #left-col #gallery a img { margin: 5px; width: 92%; height: auto; }
	#lightbox-container-image-box { width: 88% !important; height: 88% !important; }
	#lightbox-container-image-data-box { width: 85% !important; }

	#footer-content { text-align: center; }
}
 
/* Landscape phones and down */
@media (max-width: 480px) { 
	#masthead { text-align: center;	 }
	#masthead .phone { float: none; text-align: center; }
	#masthead .email { float: none; }
	#menu-wrap { margin-left: 0; margin-top: 0; margin-bottom: 20px; }
	#menu-wrap ul li, li a { width: 97%; }
	.slideshow { height: 88px; }
	.slideshow img { width: auto !important; height: auto !important; }
	a#promo1Img, a#promo2Img, a#promo2Img { background-size: cover; }
	#image-holder #promo1 .caption, #image-holder #promo2 .caption, #image-holder #promo3 .caption { max-width: 100%; }
	#intro div.right { float: none; text-align: center; margin: 10px; }
	#intro .text-image { float: none; width: 100%; height: auto; }

	/* gallery */
	#left-col #gallery { text-align: center; position: relative; left: 20px; }
	body#galleryPage #left-col #gallery a { margin: 0 20px 20px 0; float: left; width: 40%; }
	body#galleryPage #left-col #gallery a img { margin: 5px; width: 92%; height: auto; }
	#lightbox-container-image-box { width: 88% !important; height: 88% !important; }
	#lightbox-container-image-data-box { width: 85% !important; }

	#footer-content { text-align: center; }
}