@charset "utf-8";
/* print.css */

/* Chris Converse, lynda.com 1:52 approx */
body {
	font: 12pt Arial, Helvetica, sans-serif; color: #666666 ;
	line-height: 1.3 ;
	background: none ;
}

h1, h1, h6, p, li { color: inherit; } /* inherit body font color */

h1 { margin: 0px; }

a, a:visited { color: inherit; text-decoration: none; }

.page { width: 100%; margin: 0px; padding: 0px; }

nav { display: none; }

article { padding: 0px; }

footer { color: #000000; background: none; padding:0px; font-size: .7em; }

.print { display: inherit; }

article a:link:after, article a:visited:after {
	content: " ("attr(href)") ";
	font-style: italic;
}

a.cta:after {
	content: "Learn more at: datarecoverytime.com";
	display: block;
	font-style: italic;
	font-weight: normal;
	margin-top: 15px;
}

.promo-container { margin-top: 25px; padding: 0px; font-size: 11pt; }

a.cta {
	text-transform:none;
	background: none;
	color: inherit;
}

/* (I think I know what I mean??) 
If footer becomes too low on the page to allow .qr img to fit at the bottom, then use this tag to do a page break. */
/*
footer { page-break-before:always; }
*/

footer .qr { border-top: 1px solid #dddddd; margin-top: 20px; padding-top: 20px; }
footer .qr img { float: left; margin-right: 20px; }

header { 
	height: 66px;
	background: url(../images/print-banner.jpg) no-repeat 0px;
	background-size: cover;
	margin-bottom: 15px;
	position: relative;
}

header a.logo { 
	width: 360px
	height: 66px;
	top: 0px;
	background: url(../images/print-logo.png) no-repeat 0 0;
	background-size: 360px auto; /* width height */
}
 
 .promo.one { background-image: url(../images/print-promo-1.png); background-size: 55px 55px; }
 .promo.two { background-image: url(../images/print-promo-2.png); background-size: 55px 55px; }
 .promo.three { background-image: url(../images/print-promo-3.png); background-size: 55px 55px; }