.Clear { clear: both; }
body {	margin: 0px;	padding: 0px;	background-color: #000000;	background-position: center top;	background-repeat: repeat-x;	background-image: url(../Images/Background-Concrete.jpg); }
div { font-family: 'Open Sans',arial, helvetica, san-serif; font-size: 16px; line-height: 22px; color: #333333; }
a { color: #3366cc; text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; max-height: 100%; }
.CF { zoom: 1; }
.CF:before, .CF:after { content: ""; display: table; }
.CF:after { clear: both; }
.Video {	position: relative;	padding-bottom: 56.25%; 	height: 0px; 	background-color: #000000; }
.Video iframe {	position: absolute;	top: 0px;	left: 0px;	width: 100%;	height: 100%; }
#Container { display: block; margin: 0px auto; width: 100%; min-width: 270px; max-width: 640px; }
#Content { padding: 15px; background-color: #FFFFFF; margin: 0px auto; }
#Promo { display: block; margin: 0px auto 30px auto; width: 100%; text-align: center; position: relative; }
#Promo div:nth-child(1) { position: absolute; top: -30px; left: 0px; width: 100%; z-index: 101; }
#Promo div:nth-child(2) { position: static; width: 100%; z-index: 100; }
#Promos { display: block; margin: 0px auto; width: 100%; height: auto; }
.PromoBlock { display: block; margin: 0px auto; width: auto; height: auto; font-size: 14px; line-height: 20px; }
.PromoBlock b { color: #000000; font-size: 18px; line-height: 20px; }
.PromoBlock a { color: #333333; text-decoration: none; }
.PromoBlock a:hover { text-decoration: underline; }
.FullStory a { color: #ff3300; font-size: 14px; line-height: 20px; }
.FullStory a:hover { color: #ff3300; }
#Headline { display: block; margin: 0px auto 30px auto; width: 100%; }
#Headline h1 { letter-spacing: -1px; font-family: 'Roboto', arial, helvetica, san-serif; font-size: 30px; line-height: 34px; color: #000000; font-weight: 900; margin: 0px 0px ; }
.Article { display: block; margin: 0px auto 30px auto; width: 100%; color: #666666; clear: both; }
.Article h2 {	letter-spacing: -1px; font-family: 'Roboto', arial, helvetica, san-serif; font-size: 24px; line-height: 28px; color: #000000; font-weight: 900; }
#HealthRanger { display: block; float: left; width: 85px; min-height: 85px; height: auto; margin: 0px 15px 10px 0px; }
#ProductBlock { display: block; float: none; margin: 0px auto 30px auto; width: 100%; }
.Product, .SingleProduct { display: block; width: 90%; max-width: 392px; margin: 0px auto 20px auto; padding: 10px; text-align: center; background-color: #EEEEEE; border: 1px solid #CCCCCC; }
.MR40 { margin: 0px auto 20px auto; }
.Product h2, .SingleProduct h2 {	font-size: 17px; line-height: 21px; color: #000000; font-weight: 800; }
.Sale { color: #ff0000; }
#Disclaimer { display: block; width: 85%; font-size: 12px; line-height: 14px; color: #999999; text-align: center; padding: 0px 0px 15px 0px; margin: 0px auto; }
.Callout { display: block; width: 75%; float: none; margin: 30px auto; padding: 28px 0px 28px 0px; font-size: 20px; line-height: 24px; color: #cc3300; text-align: center; border-top: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC; }
.Callout img { max-width: 75px; }
#Media { display: block; margin: 0px auto 30px auto; width: 100%; height: auto; cursor: pointer; text-align: center; }
.Video { position: relative; padding-bottom: 56.25%; height: 0px; } /* 16:9 */	
.Video iframe { position: absolute; top: 0px;	left: 0px; width: 100%; height: 100%; }
.Breadcrumb { display: block; width: 100%; margin: 0px auto 15px auto; font-size: 12px; color: #666666; }
.Breadcrumb a { color: #ff3300; text-decoration: underline; }

@media (min-width: 641px) {
body { margin: 0px; }
#Container { width: 1000px; max-width: 1000px; margin: 0px auto; padding: 40px; }
#Content { padding: 40px; width: 920px; margin: 0px auto; }
#Headline h1 { letter-spacing: -2px; font-size: 40px; line-height: 44px; }
.Product { display: inline-block; float: left; width: 418px; max-width: 418px; min-height: 440px; margin: 0px 0px 40px 0px; }
.SingleProduct { display: block; width: 418px; max-width: 418px; min-height: 440px; margin: 0px auto 40px auto; clear: both; }
.MR40 { margin: 0px 40px 40px 0px; }
#Promo { width: 920px; height: auto; margin: 0px auto; }
#HealthRanger { width: 150px; min-height: 150px; }
.Callout { width: 300px; float: right; margin: 0px 0px 30px 30px; padding: 28px 0px 0px 30px; font-size: 26px; line-height: 30px; border-left: 1px solid #CCCCCC; border-top: 0px none; border-bottom: 0px none; }
.Callout img { max-width: 100px; }
#Promo div:nth-child(1) { position: absolute; top: -100px; left: 0px; width: 100%; z-index: 101; }
.PromoBlock { display: inline-block; float: left; margin: 0px; width: 290px; }
.PromoBlock b { font-size: 24px; line-height: 26px; }
#Promos .PromoBlock:nth-child(2) { margin: 0px 12px 0px 12px; padding: 0px 12px; border-left: solid 1px #CCCCCC; border-right: solid 1px #CCCCCC; }
}