/* --- HOMEPAGE --- */

.home-updates,
.home-shop,
.home-articles,
.home-follow,
.home-share,
.home-mission		{	border-radius:		12px;
				background-color:	white;
				box-sizing:		border-box;
				padding:		20px;
				transition: 		width, .5s;		}
				
h2			{	font-weight:		bold;			}

/* Updates */

.home-updates		{	width:			626px;
				width:			calc(100% - 296px);
				height:			1418px;
				border:			3px solid hsl(40, 85%, 75%);
				float:			left;
				margin:			0 16px 16px 0;
				text-align:		center;			}

.home-updates h2	{	display:		block;
				margin:			2px auto 40px;
				padding:		6px 10px;
				white-space:		nowrap;
				border-radius:		8px;
				text-align:		center;
				background-color:	hsl(42, 95%, 70%);
				font-size:		14pt;
				width:			100%;
				box-sizing:		border-box;		}

.update			{	display:		block;
				max-width:		530px;
				margin:			20px auto 50px; /* <-- Adjust to fit content */
				text-align:		left;
				transition:		1s;
				font-size:		13pt;
				clear:			both;			}
				
.home-updates p		{	margin:			0px auto;
				text-align:		left;
				line-height:		1.4;			}

.home-updates h3	{	font-weight:		bold;
				line-height:		1.4;
				margin:			0 0 10px;
				overflow:		hidden;			}
				
.home-updates h3 a	{	display:		block;			}

.image-holder		{	display:		block;
				float:			left;
				width:			162px;
				max-height:		162px;
				margin:			6px 20px 20px 0px;	}

.home-updates img	{	max-width:		160px;
				max-height:		160px;
				margin:			0 0 0 auto;
				display:		block;
				border:			1px solid black;	}

/* Shop */

.home-shop		{	width:			280px;
				height:			510px;
				border:			3px solid hsl(355, 45%, 52%);
				text-align:		center;
				float:			right;
				margin:			0 0 16px;
				white-space:		nowrap;		}
				
.home-shop h2		{	margin:			0 auto 50px;
				padding:		3px 1px;		}

.home-shop h2 a		{	text-align:		center;
				display:		inline-block;
				padding:		6px 10px;
				background-color:	hsl(355, 60%, 52%);
				color:			white !important;
				font-size:		14pt;
				width:			100%;
				box-sizing:		border-box;
				max-width:		300px;
				border-radius:		8px;			}

.home-shop img		{	margin:			5px auto;
				max-height:		150px;
				max-width:		150px;			}

img.ncp-shop		{	width:			155px;
				height:			35px;			}

.randomizer		{	height:			300px;
				margin:			0 auto 20px;		}

.home-shop a		{	font-weight:		bold;
				font-size:		13pt;			}

.home-shop p		{	margin:			10px auto 30px;		}

/* Articles */

.home-articles		{	width:			280px;
				height:			510px;
				border:			3px solid hsl(213, 50%, 40%);
				text-align:		center;
				float:			left;
				margin:			0 0 16px;		}

.home-articles h2	{	margin:			0 auto;
				padding:		3px 1px;		}

.home-articles h2 a	{	text-align:		center;
				background-color:	hsl(213, 60%, 38%);
				color:			white !important;
				font-size:		14pt;
				width:			100%;
				box-sizing:		border-box;
				max-width:		300px;
				border-radius:		8px;			}

.home-articles ul	{	padding-left:		0;
				margin:			0px auto;		}

.home-articles li 	{	display:		block;
				margin:			0 auto;
				padding:		3px 1px 2px;		}

.home-articles li a	{	background-color:	hsl(205, 80%, 82%);
				font-size:		12pt;
				font-weight:		bold;
				text-align:		left;
				width:			92%;
				box-sizing:		border-box;
				max-width:		240px;
				border-radius:		15px;			}

.home-articles li a,
.home-articles h2 a	{	display:		block;
				margin:			2px auto;
				padding:		6px 10px;
				white-space:		nowrap;
				color:			black;			}

/* Follow */

.home-follow		{	width:			280px;
				height:			175px;
				border:			3px solid hsl(310, 45%, 40%);
				text-align:		center;
				float:			right;
				margin:			0 0 16px;
				white-space:		nowrap;
				transition:		1s;			}

.home-follow h2		{	display:		block;
				margin:			2px auto 10px;
				padding:		6px 10px;
				white-space:		nowrap;
				border-radius:		8px;
				text-align:		center;
				background-color:	hsl(310, 45%, 42%);
				color:			white !important;
				font-size:		14pt;
				width:			100%;
				box-sizing:		border-box;
				max-width:		300px;			}

.home-follow img	{	vertical-align:		middle;
				margin:			10px 5px 13px;		}

.home-follow a		{	font-weight:		bold;			}


/* Share */

.home-share		{	width:			280px;
				height:			175px;
				border:			3px solid hsl(28, 80%, 55%);
				text-align:		center;
				float:			left;
				margin:			0 0 16px;
				transition:		1.5s;			}

.home-share h2		{	display:		block;
				margin:			2px auto 25px;
				padding:		6px 10px;
				white-space:		nowrap;
				border-radius:		8px;
				text-align:		center;
				background-color:	hsl(28, 90%, 55%);
				color:			white !important;
				font-size:		14pt;
				width:			100%;
				box-sizing:		border-box;
				max-width:		300px;			}

.share-buttons-home a	{	margin:			0px 10px;		}

.share-buttons-home img	{	width:			50px;
				height:			50px;			}

/* Mission */

.home-mission		{	border:			3px solid hsl(155, 35%, 34%);
				text-align:		center;
				margin:			0;
				clear:			both;			}

.home-mission h1	{	font-size:		15pt;
				margin:			5px auto;		}

.home-mission a		{	font-size:		13pt;
				font-weight:		bold;			}

/* Footer */

footer .share-buttons	{	display:		none;			}

/* Responsive */

/* tablet */

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

{

.home-updates		{	width:			100%;
				height:			auto;
				margin:			0 0 16px;		}

.update			{	max-width:		600px;
				margin:			20px auto 50px;		}

.home-shop,
.home-articles,
.home-follow,
.home-share		{	margin:			0 0 16px;		
				width:			49%;
				width:			calc(50% - 8px);	}

.home-shop p		{	margin:			10px auto 30px;		}

}

/* phone */

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

{

.home-updates,
.home-shop,
.home-articles,
.home-follow,
.home-share		{	width:			100%;
				margin:			0 0 16px;		}

}

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

{

.home-updates h2	{	margin:			2px auto 40px;		}

.image-holder		{	float:			none;
				margin:			5px auto 20px;
				height:			auto;			}

.home-updates img	{	margin:			0 auto !important;	}

.home-updates p		{	margin:			10px auto;		}

.home-shop p		{	margin:			10px auto 20px;		}

}

/* mission statement */

br.br2, br.br3, br.br4, br.br5, br.br6	{ display: none;   }
br.br1					{ display: inline; }

@media only screen and (max-width: 850px) { br.br1 { display:none; } br.br2 { display:inline; } }
@media only screen and (max-width: 590px) { br.br2 { display:none; } br.br3 { display:inline; } }
@media only screen and (max-width: 480px) { br.br3 { display:none; } br.br4 { display:inline; } }
@media only screen and (max-width: 410px) { br.br4 { display:none; } br.br5 { display:inline; } }
@media only screen and (max-width: 350px) { br.br5 { display:none; } br.br6 { display:inline; } .home-mission h1 { font-size: 14pt; } }