/***** COLORS *****

19618f dk blue
418dbf lt blue
d1d1d1 border grey
fafafa background lt grey
85d223 green
fc6500 orange

/*******************/


/* #Media Queries
================================================== */

/* Smaller than 1024 (ipad Air) */
@media only screen and (max-width: 1024px) {
	#header_1 /* make header a bit taller to fit the horizontal menu UNDER the logo */
	{		
	/*height: 150px;	*/
	}
	
	#wide_shadow
	{
	bottom: -36px;	/* for wide shadow */
	}
	
	/*** MENU SWITCH ***/
		#nav_container
		{
		display: none;	
		}
		
		#mobile_nav_bar, 
		#nav-menu-mobile,
		#nav_container_mobile_wrapper
		{	
		display: block;
		}
		
		#header_1 
		{		
		height: 100px;
		}
		
		#header_2_container
		{
		height: 20px;
		display: none;	
		}
		
		#logo
		{		
		top: 13px;
		}
		
		#container_1
		{
		margin-top: 44px !important;	/* make room for drop down nav */
		}
	/*******************/
	
	#header_links
	{
	display: none;
	}
	
	#vcard
	{
	top: 38px;	
	}
	
	/*** responsive promo boxes ***/
	.responsive_promo_box .content
	{						
	/*max-width: 470px;	*/
	/*margin: 0 0 0 -400px;*/
	}
	
	.responsive_promo_box
	{	
	/*min-height: 200px;	*/
	}
	

	/*****************/
}

/* Tablet Portrait size to standard 1000 (devices and browsers) */
/*@media only screen and (min-width: 768px) and (max-width: 999px) {*/
@media only screen and (max-width: 999px) {
	
	
	#social_buttons_2
	{
	/*right: 230px;*/
	}



	#social_buttons_2
	{
	/*right: 60px;
	display: block;	*/
	}	
	
			#social_buttons_2 #facebook_link
			{
			/*position: absolute;
			left: 2px;
			top: 0px*/
			}
			
			#social_buttons_2 #twitter_link
			{
			/*position: absolute;
			top: 50px;*/
			}
	
	
	#wide_shadow
	{
	display: none;	
	}
	
	#anything-slider 
	{	
	position: relative;
	/*border-top: 2px solid #8FA4CF;	*/
	}
	
	#container_1, .home #container_1 
	{	
	/*background:transparent url('images/tiling_bg_2_internal.jpg') left top repeat-x;*/
	}
	
	#content_container_2 /* to place a padding on left and right of containers when on mobile (single column) */
	{	
	padding-left: 20px;
	padding-right: 20px;
	}
	
	.home #content_container
	{
	/*margin-top: 110px;*/
	}
	
	#main_content_padding
	{
	padding-left: 50px;	
	padding-right: 50px;	
	}					
	
	/*** responsive promo boxes ***/
	.responsive_promo_box, .responsive_promo_box  .content /* reduce overall height of box and content */
	{	
	/*min-height: 300px;	*/
	}
	
	.responsive_promo_box .content /* content  */
	{						
	/*max-width: 400px;*/
	}
	
	.responsive_promo_box.image_left .content /* content when image is on left */
	{
	/*margin: 0 -700px 0 0;*/
	margin: 0 0 0 -80px; /* use this setting to move content left or right */
	max-width: 500px;
	}
	
	.responsive_promo_box.image_right .content /* content when image is on right */
	{		
	margin: 0 0 0 -400px; /* use this setting to move content left or right */	 
	max-width: 500px;
	}
	
	.responsive_promo_box.image_left .responsive_image /* image on left */
	{				
	left: -220px;	/* move it over so its centered better */
	}
	
	.responsive_promo_box_wrapper.one .responsive_promo_box.image_right .responsive_image /* image on right */
	{				
	right: -100px;	 /*move it over so its centered better */
	}
	
	.responsive_promo_box_wrapper.three	.responsive_promo_box.image_right .responsive_image /* image on right */
	{				
	right: -240px;	 /*move it over so its centered better */
	}
	/*************/


	#social_buttons_2 #linked_in_link, #social_buttons_2 #facebook_link, #social_buttons_2 #twitter_link, #social_buttons_2 #youtube_link, #social_buttons_2 #instagram_link
	{	
	margin-right: 5px;
	}
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {

.entry-content img, .wp-caption.alignright, .wp-caption.alignleft  /* center all floated images in content areas */
{
float: none !important;
display: block;
margin: 0 auto;
margin-bottom: 25px;
}

#header_1_container
{			
margin-bottom: 0px;
}	

	#vcard
	{
	display: none;
	}

	#logo
	{
	left: 0px;
	margin: 0 auto;
	/*top: 12px;*/
	position: relative;	
	border: 0px solid black;
	}
	
		#logo, #logo img
		{
		/*width: 270px;
		height: 88px;	*/
		}
	
	
	#anything-slider-wrapper
	{
	width: 100%;
	}
	
	#anything-slider
	{	
	margin-top: 0px;		
	}	
	
	#horizontal_boxes_wrapper
	{
	margin-left: 20px;
	margin-right: 20px;	
	}

	.horizontal_boxes div.eight.columns
	{
	margin-left: 0px;
	margin-right: 0px;
	}

	#anything-slider img#slider_image_5 /* change slider image to a different size image for mobile */
	{
	/*content:url("http://sunnyviewpools.ca/wp-content/themes/responsive_1/images/banner_images_1200_5.jpg");	*/
	}	
	
	#anything-slider img#slider_image_1 /* change slider image to a different size image for mobile */
	{
	/*content:url("http://sunnyviewpools.ca/wp-content/themes/responsive_1/images/banner_images_1200_1.jpg");	*/
	}	
	
	#anything-slider img#slider_image_4 /* change slider image to a different size image for mobile */
	{
	/*content:url("http://sunnyviewpools.ca/wp-content/themes/responsive_1/images/banner_images_1200_4.jpg");	*/
	}	
	

	#home_page_content_container
	{
	margin-top: 0px;			
	
	border-top: 1px solid #ccc;
	
	}

		#home_page_content
		{
		Max-width: 1200px;
		/*margin-bottom: 35px;*/				
		font-size: 18px;
		line-height: 26px;
		margin: 0 auto;				
		}
		
			#home_page_content_padding
			{
			padding: 10px 10px 10px 10px;	
			}
		
	#banner_box
	{
	display: none;
	}
	
	#container_3 
	{
   /*margin-top: 0px;*/
	}
	
	#search
	{
	display: none;	
	}
	
	#email_button, #phone_button
	{
	/*display: block;	*/
	}
	
	#quote
	{
	display: none;	
	}
	
	#container_1, .home #container_1 
	{	
	/*background:transparent url('images/tiling_bg_2_internal.jpg') left top repeat-x;*/
	}
	
	#content_container_2 /* to place a padding on left and right of containers when on mobile (single column) */
	{	
	padding-left: 20px;
	padding-right: 20px;
	}

	.home #content_container
	{
	/*margin-top: 110px;*/
	}
	
	/*** responsive promo boxes - turn to all vertical for mobile ***/
	.responsive_promo_box .responsive_image, .responsive_promo_box.image_left .responsive_image
	{
	display: block;
	height: auto;	
	position: relative;
	top: 0px;
	left: 0;
	margin: 0;
	/*min-width: 440px;*/
	}
	
	.responsive_promo_box .content, .responsive_promo_box.image_left .content, .responsive_promo_box.image_right .content
	{							
	max-width: none;		
	left: 0px;	
	margin: 0;
	min-height: auto;
	padding-top: 30px;
	padding-bottom: 35px;
	}
	
	.responsive_promo_box .content h2
	{
	font-size: 32px;
	line-height: 40px;
	}
	/****************************/
	
	#main_content_padding
	{
	padding-left: 20px;
	/*padding-top: 28px;*/
	padding-right: 20px;
	/*padding-bottom: 30px;*/
	}					

	
	#arrow_skinny_1, #arrow_skinny_2	
	{
	display: none;
	}
	
	#content_container
	{	

	}	

	#content_container_2
	{	
	max-width: 650px;	
	/*padding-left: 20px;
	padding-right: 20px;*/
	}	
	
	#footer
	{
	/*display: none;*/
	}
	
	#footer_logo
	{
	position: relative;	
	right: 0px;
	top: 0px;	
	margin: 0 auto;
	margin-bottom: 10px;
	}
	
	#credit_cards
	{
	position: relative;	
	right: 0px;
	top: 0px;	
	margin: 0 auto;
	margin-bottom: 10px;
	}

	#social_buttons_2
	{	
	position: relative;
	top: 0px;			
	right: 0px;	
	border: 0px solid black;				
	}
	
				
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

	#vcard
	{
	/*display: none;	*/
	}

}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {

#header_1 /* make header smaller as logo is also getting smaller */
{		
/*height: 61px;*/
}

	.horizontal_boxes h2
	{	
	/*text-align: center;*/
	display: block;
	border: 0px solid #000;
	}

	.horizontal_box_image /* to unset the float: right applied to some images */
	{
	float: none;	
	display: block;
	margin: 0 auto !important;
	margin-bottom: 20px !important;
	}
	
	#social_buttons_2
	{	
	/*display: none;*/
	}	
	
	#footer_logo
	{
	right: 2px;
	/*display: none;*/
	}

}