/* CSS Document */

* {
	margin:0; padding:0;
	font-size:100%;
}

body{
	background:#FFFFFF url(images/tail-top.jpg) top center repeat-x;
	text-align:center;
	padding-bottom:43px;
}

div#top_content_wrap {
	background: #fff;
}
div#top_content { 
	
	padding-top: 55px; 
}
	div#top_content div#app_screenshot {
		float: left;
		width: 305px;
		height: 428px;
		background: url('nexus7a.png') no-repeat left top;
}
				div#top_content div#app_screenshot div.price_badgefree{
			width: 115px;
			height: 115px;
			background: url('ifiles/price_badgefree.png') no-repeat 50% top;
			float: right;
			margin-top: -40px;
			padding-right: 40px;
		}

		

		div#top_content div#app_screenshot div.price_badge_tom{
			width: 115px;
			height: 115px;
			
			float: right;
			margin-top: -46px;
			padding-right: 40px;
		}

		div#top_content div#app_screenshot .screencast {
			float: left;
			margin-top: -32px;

			padding-top: 0px;
			padding-left: 24px;
		}

div#top_content8 { 
	
	padding-top: 55px; 
}
	div#top_content8 div#app_screenshot {
		float: left;
		width: 552px;
		height: 362px;
		background: url('surface.png') no-repeat left top;
}
				div#top_content8 div#app_screenshot div.price_badgefree{
			width: 115px;
			height: 115px;
			background: url('ifiles/price_badgefree.png') no-repeat 50% top;
			float: right;
			margin-top: -40px;
			padding-right: 40px;
		}

		

		div#top_content8 div#app_screenshot div.price_badge_tom{
			width: 115px;
			height: 115px;
			
			float: right;
			margin-top: -46px;
			padding-right: 40px;
		}

		div#top_content8 div#app_screenshot .screencast {
			float: left;
			margin-top: -30px;

			padding-top: 0px;
			padding-left: 94px;
		}

div#top_content8p { 
	
	padding-top: 55px; 
}
	div#top_content8p div#app_screenshot {
		float: left;
		width: 219px;
		height: 413px;
		background: url('phone8.png') no-repeat left top;
}
				div#top_content8p div#app_screenshot div.price_badgefree{
			width: 115px;
			height: 115px;
			background: url('ifiles/price_badgefree.png') no-repeat 50% top;
			float: right;
			margin-top: -40px;
			padding-right: 40px;
		}

		

		div#top_content8p div#app_screenshot div.price_badge_tom{
			width: 115px;
			height: 115px;
			
			float: right;
			margin-top: -46px;
			padding-right: 40px;
		}

		div#top_content8p div#app_screenshot .screencast {
			float: left;
			margin-top: -17px;

			padding-top: 0px;
			padding-left: 19px;
		}













img {vertical-align:top;}
a img { border:0;}

ul { list-style:none;}

.left { float:left;}
.right {float:right;}
.clear  { clear:both;}


html, input, textarea
	{
		font-family: Trebuchet MS,Arial, Helvetica, sans-serif;
		font-size:0.813em;
		color:#000000;
	}

input, select { vertical-align:middle; font-weight:normal;}

a {color:#4fa0ee; outline:none;}
a:hover{text-decoration:none;}
p {padding-top:18px;}
strong {color:#cc0000;}

/* ============================= main layout ====================== */

.header-bg {background:url(images/header-bg.jpg) no-repeat center top;}

li a {color:#4fa0ee; text-decoration:none;}
li a:hover {text-decoration:underline;}

h2 {font-size:1.461em; font-weight:normal; margin-bottom:30px;color:#5d5d5d}
h3 {font-size:1.3em; font-weight:normal; margin-bottom:30px;color:#5d5d5d}
h4 {font-size:1.3em; font-weight:normal; margin-bottom:3px;color:#5d5d5d}
h7 {font-size:1.1em; font-weight:normal; margin-bottom:3px;color:#5d5d5d}
h8 {font-size:0.5em; font-weight:bold; margin-bottom:0px;color:#5d5d5d}
h9 {font-size:0.5em; font-weight:bold; margin-bottom:0px;color:#5d5d5d}

.jantext {color:#5d5d5d; font-size:0.6em;font-weight:bold; margin-bottom:0px}


.imgindent {margin:0 20px 0 0; float:left;}

td {
padding: 5px;
}


/* ============================= header ====================== */

.menu {float:right; padding-top:26px;}
.menu li {float:left; padding:0 0 0 4px; background:none; line-height:1.385em; font-weight:normal;}
.menu li a {display:block; color:#fafbf3; text-decoration:none;}
.menu li a span {display:block;}
.menu li a span span {padding:5px 19px 5px 19px;}
.menu li a:hover, .menu .active a {background:url(images/button-tail-bg.gif) top repeat-x; text-decoration:none;}
.menu li a:hover span, .menu .active a span {background:url(images/button-right-bg.gif) right top no-repeat;}
.menu li a:hover span span, .menu .active a span span {background:url(images/button-left-bg.gif) left top no-repeat;}

.logo {float:left; margin-top:14px;}

/* ============================= content ====================== */

.box {background:#fff url(images/box-corner-right-top.gif) right top no-repeat;}
.box .corner-left-top {background:url(images/box-corner-left-top.gif) left top no-repeat;}
.box .indent {padding:8px 8px 8px 8px;}

.box2 {background:#e2f1ce url(images/box2-corner-right-bottom.gif) right bottom no-repeat;}
.box2 .corner-left-bottom {background:url(images/box2-corner-left-bottom.gif) left bottom no-repeat;}
.box2 .corner-right-top {background:url(images/box2-corner-right-top.gif) right top no-repeat;}
.box2 .corner-left-top {background:url(images/box2-corner-left-top.gif) left top no-repeat; width:100%;}
.box2 .indent {padding:34px 15px 36px 25px;}
.box2 a {color:#4fa0ee;}

.col-pad {padding-right:50px;}
.col-pad2 {padding-right:74px;}
.col-pad3 {padding-right:68px;}
.col-pad4 {padding-right:35px;}
.margin0 {margin-bottom:0;}
.margin1 {margin-top:20px;}
.text2 {color:#8c8c8c; font-size:0.846em;}
.text3 {color:#ff6a00;}
.text4 {line-height:1.846em;}
.text5 a, .text5 strong {color:#000000;}
.price {font-size:2em;}
.rating {color:#8c8c8c; font-weight:bold; padding:10px 0 10px 0;}
.rating img {vertical-align:middle; margin-left:1px;}
.button {margin:10px 12px 0 0;}
.zoom {zoom:1; overflow:hidden;}
.phone {display:inline-block; width:97px;}

.download-list li{background:none; padding:0 0 23px 0; line-height:1.385em; font-weight:normal;}
.download-list .download {display:block; float:right; width:158px; text-align:right;}
.download-list .size {display:block; float:right; width:186px; text-align:center; font-size:0.923em;}
.download-list .size span {font-size:1.5em;}

.banners {padding:33px 0 0 0;}
.banner {margin-right:19px;}
.taright {text-align:right;}

.block {padding:60px 20px 21px 24px;}

/* ============================= footer ====================== */

#footer {background:url(images/footer-tail-bg.gif) top repeat-x; color:#5d5d5d; font-size:0.923em;}
#footer .right-bg {background:url(images/footer-right-bg.gif) right top no-repeat;}
#footer .left-bg {background:url(images/footer-left-bg.gif) left top no-repeat; width:100%;}
#footer .indent {padding:22px 0 10px 12px;}
#footer .indentr {padding:220px 0 10px 12px;}
#footer p {background:url(images/footer-logo.gif) no-repeat 0 0; padding:6px 0 6px 40px;}
#footer a {color:#4fa0ee;}

/* ============================= iphone ====================== */

#iphone  {background:url(images/iphonebg22.png) left top no-repeat;color:#5d5d5d; font-size:0.923em;}
#iphone  .right-bg {background:url(images/footer-right-bg.gif) right top no-repeat;}
#iphone  .left-bg {background:url(images/footer-left-bg.gif) left top no-repeat; width:100%;}
#iphone  .indent {padding:22px 0 10px 12px;}
#iphone  .indentr {padding:220px 0 10px 12px;}
#iphone  p {background:url(images/footer-logo.gif) no-repeat 0 0; padding:6px 0 6px 40px;}

/* ============================= iphone ====================== */

#iphones  {background:url(images/iphonebg22s.png) left top no-repeat;color:#5d5d5d; font-size:0.923em;}
#iphones  .right-bg {background:url(images/footer-right-bg.gif) right top no-repeat;}
#iphones  .left-bg {background:url(images/footer-left-bg.gif) left top no-repeat; width:100%;}
#iphones  .indent {padding:22px 0 10px 12px;}
#iphones  .indentr {padding:220px 0 10px 12px;}
#iphones  p {background:url(images/footer-logo.gif) no-repeat 0 0; padding:6px 0 6px 40px;}




/* ============================= janhead ====================== */
#janhead { color:#5d5d5d; font-size:0.923em;}

#janhead .indent {padding:22px 0 10px 12px;}
#janhead .indentr {padding:220px 0 10px 12px;}
#janhead a {color:#006cd9;}

.janbox { 
  background: #DBDBE3; 
}
.janboxtop { 
 height: 10px;
  background: url('images/ne.gif') no-repeat top right; 
}
.janboxtop div {
 height: 10px; 
  background: url('images/nw.gif') no-repeat top left; 
}
.janboxbottom { 
 height: 10px;
  background: url('images/se.gif') no-repeat bottom right; 
}
.janboxbottom div { 
  height: 10px; 
  background: url('images/sw.gif') no-repeat bottom left; 
}
.janboxcontent {
  padding: 0px 10px 0px 10px;
}

a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:#cccc;
   
    text-decoration:none}

a.info:hover{z-index:25; }

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: left}




/* ============================= forms ============================= */

#SearchForm {padding:15px 23px 0 0;}
#SearchForm .rowi {height:35px;}
#SearchForm .input {background:url(images/input-bg.gif) no-repeat 0 0; width:248px; padding:4px 0 5px 9px;}

#ContactForm .rowi {height:35px;}
#ContactForm .taright {padding:10px 0 0 0;}
#ContactForm .taright input {margin-left:10px; padding-bottom:1px;}
.input {width:445px; border:none; background:url(images/input-bg.jpg) no-repeat 0 0; padding:0 0 0 5px; font-size:1em; padding:4px 0 5px 9px;}
textarea {width:445px; height:95px; border:none; background:url(images/textarea-bg.jpg) no-repeat 0 0; padding:0 0 0 9px; overflow:auto; font-size:1em;}