/*
from Dave's style.css
*/

@charset "UTF-8";
/* CSS Document */


/* ---- reset ------*/
* {margin:0;padding:0;}
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input {margin:0;padding:0;}
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th {font-size:1em;font-weight:normal;font-style:normal;}
ul,ol {list-style:none;}
fieldset,img {border:none;}
caption,th {text-align:left;}
table {border-collapse:collapse;border-spacing:0;}
td {vertical-align:top;}
.clear {clear:both;}

html {
height: 101%;
margin-bottom: 1px;
}

a, a:hover, a:active, a:focus {
outline: none;
}

/* ------------------ body --------------------- */

body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 7pt;
text-align:center;
background: #474747;
margin: 0px;
padding: 0px;
}

@media only screen and (max-width: 736.99px)  {
.notonsmallscreens {
	display: none;
}
}
@media only screen and (min-width: 740px) {
.notonlargescreen {
	display: none;
}
}

input {
font-size: 10pt;
padding: 2px;
max-width: 240px;
}


main {
position:relative;
margin: 0 auto;
top:10px;
width: 100%;
max-width:660px;
text-align:left;
}



/* ------------------ text ------------------- */

div.text p, div.text ul li, div.text ol li {
font-size: 1.5em;
line-height: 1.4em;
color: #cccccc;
text-shadow: 0 1px #000;
margin-top: 1em;
margin-bottom: 1em;
}

div.text ul li ul li {
	font-size: 1em;
}

div.text ul li, div.text ol li {
margin-left: 2em;
}

div.text ul li ul li, div.text ul li ul li ul li {
margin-left: 0em;
}

div.text ul ul {
	margin-left: 4em;
}
div.text ul ul ul {
	margin-left: 2.5em;
}


div.text ul {
list-style-type: disc;
list-style-position: outside;
}

div.text ol {
list-style-type: decimal;
list-style-position: outside;
}

div.text ul.sfs li {
	margin-bottom: .2em;
	margin-top: .2em;
}

p.header {
margin-bottom: 0px;
padding-bottom: 0px;
font-weight: bold;
}



p a {
color:#cccccc;
}


/* ------------------ header ------------------- */

#header {
	border: none;
width: 100%;
height: 124px;
display: block;
margin: 0px;
overflow: auto;
}

#companylogo {
width: 298px;
height: 84px;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
margin-bottom: 20px;
background-image: url(/rsrcs/companylogo-1753541289.png);
background-size: 298px 84px;
	display: block;
overflow: auto;
}

#header:hover #companylogo,
#header:active #companylogo {
background-image: url(/rsrcs/companylogohover-1753541289.png);
}

/* ------- navigation -------- */



nav {
width: 100%;
background-color: rgba(35,35,35,0.5);
line-height: 0px;
margin-bottom: 15px;
}

nav div {
width: 100%;
max-width: 660px;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
margin-bottom: 0px;
}

nav div ul {
list-style: none;
display: inline-block;
text-align: justify;
width: 100%;
margin: 0px;
padding: 0px;
}

nav div ul:after {
display: inline-block;
width: 100%;
content: '';
vertical-align: top;
height: 0px;
}


nav div ul li {
font-size: 1.6em;
text-shadow: 0 -1px #000;
display: inline-block;
list-style-type: none;
margin-top: 10px;
margin-bottom: 10px;
}


nav div ul li a {
text-decoration: none;
color:#c3c44b;
display: block;
padding-top: 10px;
padding-bottom: 10px;
}

nav div ul li a:hover, nav div ul li a.current {
color:#f3f44b;
}

nav div ul li {
	display: inline-block;
}
nav div ul li.smallnavonly {
	display: none;
}

@media only screen and (max-width: 660px)  {
	nav div ul li:first-child {
		margin-left: 20px;
	}
	nav div ul li:last-child {
		margin-right: 20px;
	}
	nav div ul li.smallnavonly {
		display: inline-block;
	}
	nav div ul li.largenavonly {
		display: none;
	}
}
/* ------------------ content ------------------- */

#content {
padding-bottom: 10px;
}

/* ------- headline -------- */

.headline {
position: relative;
left: 49px;
top:25px;
width: 88%;	
max-width: 660px;
height: 50px;
text-align: center;
background: -moz-linear-gradient(top,  rgba(109,109,109,0.4) 0%, rgba(109,109,109,0.4) 1%, rgba(50,50,50,0.42) 17%, rgba(35,35,35,0.5) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(109,109,109,0.4)), color-stop(1%,rgba(109,109,109,0.4)), color-stop(17%,rgba(50,50,50,0.42)), color-stop(100%,rgba(35,35,35,0.5))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(109,109,109,0.4) 0%,rgba(109,109,109,0.4) 1%,rgba(50,50,50,0.42) 17%,rgba(35,35,35,0.5) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(109,109,109,0.4) 0%,rgba(109,109,109,0.4) 1%,rgba(50,50,50,0.42) 17%,rgba(35,35,35,0.5) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(109,109,109,0.4) 0%,rgba(109,109,109,0.4) 1%,rgba(50,50,50,0.42) 17%,rgba(35,35,35,0.5) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(109,109,109,0.4) 0%,rgba(109,109,109,0.4) 1%,rgba(50,50,50,0.42) 17%,rgba(35,35,35,0.5) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666d6d6d', endColorstr='#80232323',GradientType=0 ); /* IE6-9 */

-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: 1px 2px 2px 1px #262626;
-webkit-box-shadow: 1px 2px 2px 1px #262626;
box-shadow:         1px 2px 2px 1px #262626;
border: 1px solid #262626;
}


/* ------- Main Content -------- */

main {
margin: 0px;
max-width: 660px;
margin-left: auto;
margin-right: auto;
}

div.text p {
margin-bottom: 1.2em;
padding: 0px;
}

div.text p.sectionheader {
font-weight: bold;
margin-bottom: 0px;
}

div.text p.header {
margin-bottom: 0px;
}

@media only screen and (max-width: 680px)  {
	main {
		padding-left: 20px;
		padding-right: 20px;
		width: calc(100% - 40px);
	}
}

/* ------------------ footer ------------------- */

footer {
	margin: 35px auto 0px auto;
	width: 94%;
	padding-bottom: env(safe-area-inset-bottom);
}
footer p {
	font-size: 1.2em;
	line-height: 2em;
	color: #cccccc;
	text-shadow: 0 -1px #000;
	text-align: center;
}
footer p a {
	font-size: 1.2em;
	display: inline-block;
	margin-left: 5px;
	margin-right: 5px;
}

@media only screen and (max-width: 360px) {
	footer p a {
		margin-left: 2px;
		margin-right: 2px;
	}
}

/* ------- post -------- */

h1 {
	font-size: 2em;
	font-weight: bold;
	color: #cccccc;
	margin-bottom: .4em;
	margin-top: 0px;
}

h2 {
	font-size: 1.5em;
	font-weight: bold;
	color: #cccccc;
}

h1 a {
	text-decoration: none;
	color: #cccccc;
}

h1 a:hover {
	text-decoration: underline;
}

/* ------- post -------- */


article:nth-child(1) {
margin-top: 0px;
}

article {
margin-top: 40px;
}

article p {
margin-bottom: 1em;
}

article p.entrydate {
color: #6e6e6e;
margin-top: -.75em;
}

article span.strong {
font-weight: bold;
}

article blockquote {
margin-left: 2em;
font-style:italic;
}

p.pp_description, p.currentTextHolder {
text-shadow: none;
color: #000000;
}

p.currentTextHolder {
position: relative;
top: -3px;
}

div.nav-previous, div.nav-next {
color: #cccccc;
font-size: 1.3em;
}


div.hidden {
display: none;
}

hr {
margin-top: 2em;
margin-bottom: 2em;
margin-left: 20%;
margin-right: 20%;
}

a {
color: #cccccc;
}

a:active, a:hover {
color: #dddddd;
}

div.underscreenshots {
margin-bottom: 0em;
}




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

	main {
		-moz-box-shadow:    none;
		-webkit-box-shadow: none;
		box-shadow:         none;
	}
	div.text img.screenshot { width: 100%; }
	#content {
	padding-bottom: 0px;
	}

}

img, video {
	max-width:100%;
	height:auto;
}
h1.productname {
	text-align: center;
	margin: 0px;
	padding: 0px;
}

h1.productname span {
	font-size: 43pt;
	color: #eeeeee;
	text-shadow: none;
	background: -webkit-linear-gradient(#FFFFFF 40%, #A9DEF7 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-weight: normal;
	text-decoration: none;
}

@media only screen and (max-width: 700px)  {
	h1.productname span {
		font-size: 35pt;
	}
}

h1.producttagline {
	line-height: 1.2em;
	font-size: 2.5em;
	white-space:nowrap;
	font-weight: 200;
	color: #54c4f2;
	text-shadow: 0 1px 1px #000;
	text-align: center;
	margin: 0px;
	padding: 0px;
}

p.versiondesctext {
	text-align: center;
	line-height: 1.2em;
	padding: 0px;
	margin-top: 10px;
	margin-bottom: 8px;
	font-size: 10pt;
}

a.appstorebutton {
	width: 216px;
	height: 64px;
	background-image: url(/rsrcs/appstoredownload-1753541289.svg);
	background-size: 216px 64px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
	display: block;
}

div.appstorebuttondisabled {
	width: 216px;
	height: 64px;
	background-image: url(/rsrcs/appstoredownloaddisabled-1753541289.svg);
	background-size: 216px 64px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
	display: block;
}

#producticoncontainer {
	padding: 0px;
	position: absolute;
	width: 45%;
	height: 220px;
}

div.productquotes p span {
font-style: italic;
}

@media only screen and (min-width: 737px) {
	div.producticon {
		position: absolute;
		height: 240px;
		width: 240px;
		background-size: 240px 240px;
		position: relative;
		margin-left: auto;
		margin-right: auto;
	}
	
	div.productdescriptioncontainer {
		margin-left: 300px;
		min-height: 230px;
	}
}


p.downloadbutton, p.showvideobutton {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px !important;
    padding-bottom: 0px;
    width: 200px;
    position: relative;
    top: 3px;
}

p.adapterdownloadbutton {
    text-align: center;
    margin-bottom: 2em !important;
    margin-top: 2em !important;
    font-size: 2em;
}

p.adapterdownloadbutton a {
    font-size: 2em;
}

p.downloadbutton {
	margin-top: 10px;
}

p.downloadbutton a, p.showvideobutton a {
	position: relative;
	top: -4px;
	text-align: center;
	background: rgb(159,159,159); /* Old browsers */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	margin: 0px 0px;
	display: block;
	text-decoration: none;
	height: 40px;
	width: 200px;
	border-top: 1px solid #fff;
}

p.downloadbutton a span, p.showvideobutton a span {
	font-size: 1.6em;
	line-height: 2em;
	font-weight: bold;
	
	color:#dddddd;

	text-decoration: none;
	vertical-align: middle;
	text-align: center;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	-webkit-user-select:none;
	-moz-user-select:none;
	display: block;
	position: relative;
	top: -2px;
}

p.downloadbutton a:hover span, p.showvideobutton a:hover span {
	opacity: .70;
}

p.showvideobutton {
	margin-bottom: 10px !important;
}

ul.nospaceabove {
	margin-top: 0px;
	padding-top: 0px;
}

.feature .text p.nospacebelow {
	margin-bottom: 0px;
	padding-bottom: 0px;
}


/* CloudPull-specific */

#cpss {
	display: inline-block;
	text-align: justify;
	width: 100%;
}

#cpss:after {
	display: inline-block;
	width: 100%;
	content: '';
	vertical-align: top;
	height: 0px;
}


#cpss div {
	width: 184px;
	display: inline-block;
}

#cpss div a {
	height: 115px;
	width: 184px;
	display: inline-block;
	background-size: 100%;
}

#cpss div:first-child {
	margin-left: 0px;
}

#cpss div:last-child {
	margin-right: 0px;
}

#cpss div span {
	display: block;
	width: 100%;
	text-align: center;
	font-size: 1.6em;
	color: #cccccc;
	margin-top: .6em;
	margin-bottom: 2em;
}

#cpss1 {
	background: url(/cloudpull/thumbnails-1753541289.jpeg) 0 0;
}
#cpss2 {
	background: url(/cloudpull/thumbnails-1753541289.jpeg) 0 -115px;
}
#cpss3 {
	background: url(/cloudpull/thumbnails-1753541289.jpeg) 0 -230px;
}
#cpss4 {
	background: url(/cloudpull/thumbnails-1753541289.jpeg) 0 -345px;
}
#cpss5 {
	background: url(/cloudpull/thumbnails-1753541289.jpeg) 0 -460px;
}
#cpss6 {
	background: url(/cloudpull/thumbnails-1753541289.jpeg) 0 -575px;
}

div.cpproducticon {
	background-image: url(/cloudpull/cpicon-1753541289.png);
	top: 2px;
}

/*  Marcato-specific */

/* screenshots */

#marcatossheader {
	margin-bottom: 1em;
}

#marcatoss {
	display: inline-block;
	text-align: justify;
	vertical-align: top;
	width: 100%;
}

#marcatoss:after {
	display: inline-block;
	width: 100%;
	content: '';
	vertical-align: top;
	height: 0px;
}

#marcatoss div {
	vertical-align: top;
	display: inline-block;
	width: 150px;
	margin-left: 5px;
	margin-right: 5px;
}

#marcatoss div:first-child {
	margin-left: 0px;
}

#marcatoss div:last-child {
	margin-right: 0px;
}

#marcatoss div a {
	display: inline-block;
	width: 150px;
	height: 267px;
	background-size: 100%;
}

#marcatoss div span {
	display: inline-block;
	width: 100%;
	text-align: center;
	font-size: 1.6em;
	color: #cccccc;
	margin-top: .6em;
	margin-bottom: 2em;
}

#marcatoss1 {
	background: url(/marcato/thumbnails-1753541289.jpeg) 0 0;
}
#marcatoss2 {
	background: url(/marcato/thumbnails-1753541289.jpeg) 0 -267px;
}
#marcatoss3 {
	background: url(/marcato/thumbnails-1753541289.jpeg) 0 -534px;
}
#marcatoss4 {
	background: url(/marcato/thumbnails-1753541289.jpeg) 0 -801px;
}

div.marcatoproducticon {
	background-image: url(/marcato/marcatoicon-1753541289.png);
	top: 35px;
}

/*  Feed Hawk-specific */

/* screenshots */

#feedhawkssheader {
	margin-bottom: 1em;
}

#feedhawkss {
	display: block;
	text-align: justify;
	vertical-align: top;
	width: 100%;
}

#feedhawkss:after {
	display: inline-block;
	width: 100%;
	content: '';
	vertical-align: top;
	height: 0px;
}

#feedhawkss div {
	vertical-align: top;
	width: 320px;
	height: 568px;
	margin-left: 5px;
	margin-right: 5px;
	background-size: 100% 200%;
	display: inline-block;
}

#feedhawkss div:first-child {
	margin-left: 0px;
}

#feedhawkss div:last-child {
	margin-right: 0px;
}

#feedhawkss1 {
	background: url(/feed-hawk/screenshots/combined-1753541289.jpeg) 0 0;
}
#feedhawkss2 {
	background: url(/feed-hawk/screenshots/combined-1753541289.jpeg) 0 -568px;
}

div.feedhawkproducticon {
	background-image: url(/feed-hawk/feedhawkicon-1753541289.png);
	top: 19px;
}

/*  Unread-specific   */

div.unreadproducticon {
	background-image: url(/unread/rsrcs/unreadicon-1753541289.svg);
	top: 18px;
}

div.unreadscreenshotanddescription {
	display: grid;
	grid-template-columns: 300px 300px;
	grid-gap: 60px;
	margin-top: 5em;
	margin-bottom: 5em;
	grid-template-areas: "column-1 column-2";
}
div.unreadscreenshotanddescription div.ss {
	grid-area: column-2;
}
div.unreadscreenshotanddescription div.desc {
	margin-top: auto;
	margin-bottom: auto;
	font-size: 1.3em;
	grid-area: column-1;
}

div.unreadscreenshotanddescription:nth-child(odd) {
	grid-template-areas: "column-2 column-1";
}

div.unreadscreenshotanddescription:nth-child(even) div.ss video {
	display: block;
	margin-left: auto;
	margin-right: 0px;
}

div.ss p.icongrid {
	display: none;
}

@media only screen and (max-width: 700px)  {
	div.unreadscreenshotanddescription {
		display: block;
		margin-top: 3em;
		margin-bottom: 3em;
	}
	div.unreadscreenshotanddescription div.desc {
		font-size: 1em;
	}
	div.unreadscreenshotanddescription div.ss img, div.unreadscreenshotanddescription div.ss video, div.unreadscreenshotanddescription:nth-child(even) div.ss video {
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
div.ss p.icongrid {
	display: block;
}

div.desc p.icongrid {
	display: none;
}

}

@media only screen and (max-width: 700px)  {
	#feedhawkss div {
		display: block;
		margin-left: 0px;
		margin-right: 0px;
	}
	#feedhawkss div:first-child {
		margin-bottom: 20px;
	}
	#unreadss div {
		display: block;
		margin-top: 20px;
		margin-left: 0px;
		margin-right: 0px;
	}
}

@media only screen and (max-width: 350px)  {
	#feedhawkss div {
		width: 240px;
		height: 426px;
		background-size: 240px 852px;
	}
	#feedhawkss2 {
		background: url(/feed-hawk/screenshots/combined-1753541289.jpeg) 0 -426px;
	}
}

p.comingsoon {
	font-size: 5em;
	font-weight: 400;
	color: #54c4f2;
	text-shadow: 0 1px 1px #000;
	text-align: center;
	padding-bottom: 0px;
	margin-bottom: 25px !important;
	margin-top: 10px;
}

div.screencastactive {
	height: auto;
    padding: 8px;    
	margin-bottom: 1em;
}

div.screencastinactive {
	height: 0px;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
}

div.screencast {
	margin-left: auto;
	margin-right: auto;
	max-width: 375px;
}

div.screencast video {
	visibility: hidden;
}

div.screencast video.active {
	visibility: initial;
}

/*  Home Page  */


div.prefeedhawk a.productheadercontainer {
	background-size: 240px 240px;
	background-position: center;
	background-repeat: no-repeat;
}

div.prefeedhawk a.productheadercontainer {
	width: 40%;
}

div.prefeedhawk a.productheadercontainer div.productdescriptioncontainer h1.productname span {
	font-size: 43pt;
}

div.prefeedhawk a.productheadercontainer div.productdescriptioncontainer h1.producttagline {
	font-size: 15pt;
}

div.reviewerguide h2 {
	margin-top: 1.5em;
}

h3 {
	margin-top: 2em;
	font-size: 1.8em;
	color: #cccccc;
	text-shadow: 0 1px #000;
}

p.unreadtopscreenshot {
	text-align: center;
}

p.unreadtopscreenshot img {
	width: 3.2in;
	height: auto;
}


@media only screen and (max-width: 700px)  {
	main {
		margin-top: 7px;
	}
}