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

  This CSS file is to be included on pages that can easily be made 
  responsive.  It uses media queries for scaling to smaller broswer
  screen widths.

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

@media only screen and (max-width: 920px)
{
	#banner-left #banner-site-name
	{
		width: 430px;
		height: auto;
	}
	
	div#nav-top #user-greeting .picture
	{
		display: none;
	}
}

@media only screen and (max-width: 884px)
{
	#nav-top #menu-link-STORE
	{
		display: none;	
	}	
}

@media only screen and (max-width: 805px)
{
	div#banner-left
	{
		margin-left: 25px;
	}
	
	#fatness
	{
		padding: 0px;
	}
}

/* advertisements on side disappear */
@media only screen and (max-width: 769px)
{
	#sidebar-right
	{
		display: none;
	}

	/* if remove, check book-info on iPod for unwanted ads */
	#content
	{
		width: auto;
	}
	
}

@media only screen and (max-width: 686px)
{
	#nav-top #menu-link-COMMUNITY
	{
		display: none;	
	}
}

@media only screen and (max-width: 658px)
{
	#banner-calvin
	{
		display: none;
	}
}

@media only screen and (max-width: 580px)
{
	/* Make the nav bar shorter */
	#fatness #banner-nav,
	#banner-nav > #banner-nav-right
	{
		height:	112px;
	}
	
	#banner-nav > #banner-nav-right
	{
		background-size: auto 94px;	
	}
	
	div#banner
	{
		padding: 20px 0px 0px 0px;
		height: 58px;
	}
	#banner-left
	{
		height: auto;
	}
	
	#banner-left #banner-site-name
	{
		width: 330px;
	}
	
	div#banner-tagline
	{
		font-size: 0.85rem;
	}
	
	/* Hide the searchbox and display Community */
	#nav-top .searchbox-wrapper
	{
		display: none;
	}
	#nav-top #menu-link-COMMUNITY
	{
		display: inline;	
	}
}

@media only screen and (max-width: 514px)
{
	#nav-top #menu-link-COMMUNITY
	{
		display: none;	
	}
}

@media only screen and (max-width: 404px)
{
	#banner
	{
		height: 58px;
	}
	#banner-left
	{
		height: auto;
	}
	
	#banner-left #banner-site-name
	{
		width: 260px;
	}
	
	#banner-tagline
	{
		margin-top: -3px;
	}
	
	#nav-top div#user-greeting
	{
		display: none;
	}
}

@media only screen and (max-width: 350px)
{
	#banner-left #banner-site-name
	{
		width: 222px;
	}
	
	#banner-tagline
	{
		margin-top: 0px;
	}
}

@media only screen and (max-width: 305px)
{
	#nav-top #menu-link-BROWSE
	{
		display: none;
	}
	
	#nav-top div#user-greeting
	{
		display: inline-block;
	}
	
	/* Meditate "with a daily devotion" gets pushed below the black bar, so we'll hide it */
	.landingpage-meditate .landingpage-quip
	{
		display: none;
	}
}