/*
	ross, 12/02/2018, remove font size override from PackingBoxText
	ross, 13/02/2018, force article banner images to width 100%
*/

#article {
	margin: 16px 0px 16px 0px;
	padding: 8px 8px 32px 8px;
	line-height: 150%;
	color: black;
	text-align: justify;
	border-bottom: solid 1px #425c53;
}

H1 {
	color: #425c53;
	font-size: 16pt;
	font-weight: bold;
	text-transform: capitalize;
	margin: 4px 0px 16px 0px;
	padding: 0px 0px 2px 0px;
	border-bottom: solid 1px #425c53;
	text-decoration: none;
}

.quotebox {
	border: 1px dotted green;
	background-color: white;
	padding: 4px;
	float: right;
	width: 250px;
	margin-bottom: 5px;
	margin-left: 10px;
}

.quoteboxleft {
	border: 1px dotted green;
	background-color: white;
	padding: 4px;
	float: left;
	width: 250px;
	margin-right: 5px;
	margin-bottom: 5px;
}

.quoteboxtitle {
	background-color: #425c53;
	font-size: 9pt;
	font-weight: bold;
	padding: 4px;
	color: white;
}

.bnimage {
	position: relative;
	margin: 10px 10px 20px 10px;
	width: 170px;
	height: 180px;
	float: left;
}

/*.bnimage {position:relative;  margin:20px 10px 20px 10px; width:170px; height:128px; float:left;}*/

.bntext {
	position: absolute;
	top: 0;
	left: 0;
	width: 160px;
	height: 35px;
	background-color: #fff;
}

.bntext, .bntext hover {
	filter: alpha(opacity=70);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
	-moz-opacity: 0.70;
	opacity: 0.7;
}

.bnwords a {
	position: absolute;
	top: 0;
	left: 0;
	width: 144px;
	height: 35px;
	background-color: #425c53 !important;
	color: white !important;
	text-decoration: none;
	padding: 5px 8px 0px 8px;
}

.bnwords a:hover {
	background-color: #ffffff !important;
	color: #425c53 !important;
	text-decoration: none;
	padding-top: 5px;
}

/* packing ones below for laying out images and text for how to articles */

.PackingBox {
	float: left;
	margin: 0px 10px 10px 0px;
	width: 192px;
}

.PackingBoxRight {
	float: right;
	margin: 0px 0px 10px 10px;
	width: 192px;
}

.PackingBoxImg {
	padding: 0px;
	margin: 0px;
	border: 1px solid gray;
}

.PackingBoxText {
	background-color: #d7e5db;
	color: black;
	/*font-size:9pt;*/
	width: 100%;
	height: 48px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: left;
}

.Inner {
	padding: 2px;
}

.ClearIt {
	clear: both;
}

.FloatLeft {
	float: left;
}

.FloatRight {
	float: right;
}

.ImgFloatLeft {
	float: left;
	margin: 10px 10px 10px 0px
}

.ImgFloatRight {
	float: right;
	margin: 10px 0px 10px 10px
}

.clearright {
	clear: right;
}


#middleColumn h1 + img {
	width: 100% !important;
}


@media screen {
	.PackingSurround {
		width: 100%;
	}
	.PackingBoxImgMedium {
		display: none;
	}
	.PackingBoxImgSmall {
		padding: 0px;
		margin: 0px;
		border: 1px solid gray;
		position: relative;
		top: 0px;
		left: 0px;
	}
	.PackingBoxText {
		background-color: #d7e5db;
		color: black;
		/*font-size:9pt;*/
		width: 100%;
		height: 55px;
		padding-top: 5px;
		padding-bottom: 5px;
		text-align: left;
		z-index: 10;
	}
	.PackingBoxMagnify {
		position: absolute;
		top: 0px;
		left: 0px;
		border: 1px solid #425c53;
		float: left;
		padding: 0px;
		margin: 0px;
		z-index: 5;
	}
	.PageBreak {
		display: none;
	}
	.ContactDetails {
		display: none;
	}
}

/*ending media screen*/

@media print {
	.PackingSurround {
		width: 100%;
	}
	.PackingBox {
		float: left;
		margin: 0px 10px 10px 10px;
		width: 302px;
	}
	/*.PackingBoxImgSmall {
	display:none;
}
*/
	.PackingBoxImgMedium {
		padding: 0px;
		margin: 0px;
		border: 1px solid gray;
		position: relative;
		top: 0px;
		left: 0px;
	}
	.PackingBoxText {
		background-color: #fff;
		color: black;
		/*font-size:12pt;*/
		width: 100%;
		height: 55px;
		padding-top: 5px;
		padding-bottom: 5px;
		text-align: left;
		z-index: 10;
	}
	.Inner {
		padding: 2px;
	}
	.PackingBoxMagnify {
		display: none;
	}
	.PageBreak {
		display: block;
		page-break-before: always;
	}
	.ContactDetails {
		font-size: 14pt;
		font-weight: bold;
	}
	h4 {
		font-weight: bold;
		font-size: 12pt;
		text-decoration: none;
	}
}

/*ending media print*/