/* DESKTOP */
/* settings and overrides above 980px */

@media only screen and (min-width: 980px)
{
	/* global styles */

	html
	{
		font-size: 16px;
	}

	.mobile_show
	{
		display: none;
	}


	/* widget styles */

	#widget
	{
		width: 50%;
		padding: 2.5rem;
	}
}



/* TABLET */
/* settings and overrides above 640 and under 980px */

@media only screen and (min-width: 640px) and (max-width: 979px)
{
	/* global styles */

	html
	{
		font-size: 16px;
	}


	/* page styles */

	.wide, .compact
	{
		padding: 0 5rem;
	}


	/* widget styles */

	#widget
	{
		width: 100%;
		padding: 2.5rem;
	}


	/* utility styles */

	.tablet_hide
	{
		display: none;
	}
}



/* SMARTPHONE */
/* settings and overrides under 640px */

@media only screen and (max-width: 639px)
{
	/* global styles */

	html
	{
		font-size: 18px;
	}


	/* header and footer styles */

	#header
	{
		display: none;
	}

	#header-mobile
	{
		display: flex;
		width: 100%;
	}

	#header-mobile
	{
		padding: 1.25rem 1.25rem 5rem 1.25rem;
	}

	#footer
	{
		padding: 5rem 1.25rem 1.25rem 1.25rem;
	}

	brand img
	{
		content: url('../img/ui/lodgelodge-logo-stacked.svg');
		height: 2.5rem;
		margin: 0;
	}
	
	weather
	{
		text-align: center;
	}


	/* page styles */

	.wide, .compact
	{
		padding: 0 1.25rem;
	}

	.large p
	{
		font-family: 'gt-america-mono-light';
		font-size: 1rem;
	}

	.offset
	{
		margin-top: 7.5rem;
		margin-bottom: 7.5rem;
	}

	.carousel img, .single
	{
		width: 100%;
	}

	.scroller, .scroller img
	{
		height: 12.5rem;
	}


	/* widget styles */

	#widget
	{
		width: 100%;
		padding: 1.25rem;
		margin-top: 0;
		border: 0;
		border-radius: 0;
	}

	#widget header
	{
		height: 2.5rem;
	}

	dot
	{
		font-size: 0.5625rem;
		padding: 0.3125rem;
	}


	/* utility styles */

	.mobile_hide
	{
		display: none;
	}

	.mobile_show
	{
		display: block;
	}
}