/* Navigation */
@import url("block-navigation.css");
@import url("jumplinks.css");
/* Reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}
body {
 line-height:1;
 font-family:Verdana, sans-serif;
 background:#003441 url(/images/bg/jot-bg.png) 0 0 repeat-x;
 color:#000;
 text-align:center;
}
:focus {outline:0;}
a img {border:0;}
.ir {position:relative;}
.ir a, .ir span {position:absolute;top:0;left:0;width:100%;height:100%;display:block; background:top left no-repeat;}
.ir a span {cursor:pointer;}
input.text {color:#bbb;}
input.textfocus {color:#000 !important;}
a.skiplinks {display:inline;visibility:hidden;font-size:1px;}
div.fade-top {background:transparent url(/images/bg/jot-top-bg.png) 0 0 repeat-x;height:42px;position:absolute;top:0;left:0;width:100%;}
div.fade-bottom {background:fixed transparent url(/images/bg/jot-bottom-bg.png) left bottom repeat-x;height:45px;position:fixed;bottom:0;left:0;width:100%;z-index:-1;}
div.container {
  margin:0 auto 10px auto;padding:0;border:0;
  text-align:left;
  width:49.375em;
  z-index:2;
}
#logo {
width:205px;
height:128px;
text-align:center;
margin:2em auto 1em auto;
}


#logo p {
margin:0 auto;width:200px;
}
#logo a,  #logo a span {
 text-align:center;
 background:transparent url(/images/logo.png) 0 0 no-repeat;
}
div.content {
  margin:0;padding:0;border:0;
  float:left;
  width:100%;
  clear:both;
}
div.content div.maincontent {
  margin:0;padding:0;border:0;
  float:right;
  display:inline;
  width:49.375em;
  background:white url(/images/copy-bottom.png) 0 100% no-repeat;
}
div.fullcopy {
width:100%;
height:16em;
padding-top:1em;
background:url(/images/home-sub-head.png) 0 0 no-repeat;
}
div.content div.navigation {
  margin:0 auto;padding:0;border:0;
}
div.navigation {
background:url(/images/nav-outside.png) 50% 0 no-repeat;
width:50em;
height:2em;
}
div.content div.maincontent div.copy {
  margin:0;padding:0;border:0;
  float:left;
  width:35.75em;
}
div.content div.maincontent div.related {
  margin:0;padding:0;border:0;
  float:left;
  width:13em;
}
div.footer {
  margin:0;
  padding:1em 0 0 0;
  border:0;
  width:100%;
  clear:both;
  height:53px;
  position:relative;
}
div.footer p.owner {
  position:absolute;
  bottom:10px;
  right:10px;
  color:#fff;
}
div.footer p.owner a {
  color:#fff;
}
/* full width copy */
div.fullcopy h2 {
margin:0 0 0 1.6em;
padding:0;
line-height:1;
font-family:"Trebuchet MS", helvetica, sans-serif;
color:#003d4c;
font-size:1em;
font-weight:bold;
}
div.fullcopy p {
font-size:0.8em;
margin:0 1.6em 0.5em 2em;
width:40%;
line-height:1.6;
}
div.fullcopy form {
margin:0 1.6em;
width:40%;
}
div.fullcopy form p {
margin:0;
padding:0;
width:100%;
}
div.fullcopy form label {
  display:none;
}
#signupinput {
 margin-top:0.5em;
 float:left;
}
#signininput {
 margin-top:0.5em;
 float:right;
}
#predict {clear:both;line-height:1.4;}
/* Related */
div.related div {
margin:0 0 1em 0;
width:100%;
}
div.related #bookmarklet {
  width:150px;height:35px;
  text-align:right;
  font-family:"American Typewriter", "Courier New", courier, serif;
  color:#003d4c;
  text-transform:uppercase;
  border:3px double #003d4c;
  line-height:2em;
  background:#97d9e8;
  text-align:center;
}
div.related #bookmarklet a {
  color:#003d4c;
  width:100%;
  height:100%; 
  display:block;
  text-decoration:none;
}
div.related #bookmarklet:hover {
  background:#003d4c;
}
div.related #bookmarklet:hover a {
 color:white;

}
div.related blockquote {
font-family:georgia,serif;
font-style:italic;
margin:0 0 1em 0;
color:#003d4c;
}
div.related blockquote span {
font-style:normal;
color:black;
}
form#signupform input.text, form#signupform input.password {
  margin-bottom:5px;
  color:#BBB;
  font-size:14px;
  text-align:center;
  width:145px;
  margin-left:0;
}
form#signupform span#predictedurl {
  display:block;
  text-decoration:underline;
}
form#signupform span#predictedurl.available {
  display:block;
}
form#signupform span#predictedurl.unavailable {
  display:none;
}
form#signupform input#signupinput.unavailable {
  display:none;
}
form#signupform input#signupinput.available {
  display:inline;
}
div.related #signup form label {display:none;}
/* Copy Styles */
div.copy #flashcontent {
margin:0 0 1em 6em;
}
div.copy h1 {
  margin:7px 0 0 17px;
  font-family:verdana, sans-serif;
  font-size:14px;
  color:#00181e;
  height:25px;
}
div.copy h2 {
  margin:10px 0 0 30px;
  font-family:helvetica, arial, verdana, sans-serif;
  font-size:18px;
  font-weight:bold;
  color:#33909a;
  line-height:1;
}
div.copy table {
  margin:0 2em 1.2em 1.5em;
  color:#666;
  line-height:1.2em;
  font-family:verdana, sans-serif;
  font-size:18px;
}
th {
  text-align:left;
  font-weight:bold;
  border-bottom:1px solid #bbb;
}
tr:nth-child(odd) {
background:#eee;
}
tr:nth-child(odd) td:nth-child(3) {
  background:#ddd;
}
tr:nth-child(even) td:nth-child(3) {
  background:#eee;
}
tr:nth-child(1) {
background:#fff;
}
div.copy p {
  margin:0 2em 1.2em 1.5em;
  color:#666;
  line-height:1.2em;
  font-family:verdana, sans-serif;
  font-size:18px;
}
div.copy p a {
color:#003d4c;
}
div.copy p a:hover {
  color:#333;
}

ul#homelogos {
margin:0 0 1em 2em;
background:none;
overflow:hidden;
}
ul#homelogos li {
list-style:none;
float:left;
margin-right:1em;
}

/* Titles */
h2#about span {  background-image:url(/images/titles/about.png);}
h2#tickets span { background-image:url(/images/titles/tickets.png);}
h2#feeds span { background-image:url(/images/titles/feeds.png);}
h1#sign-in span { background-image:url(/images/titles/sign-in.png);}
h1#details span { background-image:url(/images/titles/details.png);}
h1#notes span { background-image:url(/images/titles/notes.png);}
h1#useragreement span { background-image:url(/images/titles/user-agreement.png);}
h1#settings span { background-image:url(/images/titles/copy-settings.png);}
h2#shares span { background-image:url(/images/titles/shares.png);}
h2#what-is-jot span { background-image:url(/images/titles/what-is-jot.png);z-index:5;width:200px;}
h2#why-use-jot span { background-image:url(/images/titles/why-use-jot.png);z-index:5;width:200px;}
h2#how-use-jot span { background-image:url(/images/titles/how-do-you-use.png);z-index:5;width:200px;}

div.copy h1#support span {
  background:url(/images/titles/support.png) 0 0 no-repeat;
}
div.copy h1#signedup span {
  background:url(/images/titles/signed-up.png) 0 0 no-repeat;
}
div.related #signup h2 span {
  background:url(/images/titles/sign-up.png) 0 0 no-repeat;
}
div.related #settings h2 span {
  background:url(/images/titles/settings.png) 0 0 no-repeat;
}
div.copy .fold {
width:100%;
height:41px;
margin-left:-13px;
padding:0 20px;
background:transparent url(/images/outside-fold.png) 0 0 no-repeat;
position:relative;
}
div.copy .fold span {
position:absolute;
width:400px;
height:100%;
top:0;
left:13px;
background:white 0 0 no-repeat;
}
body.ajax {background:white;text-align:left;}
body.ajax div.container {width:503px;}
body.ajax div.content div.maincontent {width:503px;}
#what-is-jot p img {z-index:2;margin-top:-3.5em;}

/* Navigation */

div.navigation ul {
  margin:5px 0 0 36px;padding:0;border:0;
  list-style:none;
  float:left;
  width:100%;
  font-family:"Gill sans", sans-serif;
  text-transform:uppercase;
  font-size:14px;
}
div.footer div.navigation ul {
position:absolute;bottom:0;margin-top:0;
}
div.navigation ul li {
  margin:0;padding:0;border:0;
  float:left;
  display:block;
  width:84px;
  height:21px;
}
div.navigation ul li a {
  margin:0;padding:0;border:0;
  display:block;
  height:100%;
  color:#fff;
  font-size:1em;
  text-decoration:none;
  font-weight:normal;
}

/* What is */
#what-use {
	width:753px;height:1165px;
	margin-top:-3.5em;
	}
#what-use span {
	background:url(/images/questions/what-is-jot.jpg) 50% 0 no-repeat;
}
#next {
	width:753px;height:35px;
	}
#next span {
	background:white url(/images/questions/what-would-you-like.png) 50% 0 no-repeat;
}
#what-copy ul, #how-copy ul, #why-copy ul {
	text-align:center;
	width:100%;
	margin:0 0 2em 11em;
	overflow:hidden;
}
#what-copy ul li,#how-copy ul li,#why-copy ul li {
	float:left;
	list-style:none;
	width:174px;
	height:107px;
	margin:0 2em;
}
li.how span {background:url(/images/questions/how.png) 0 0 no-repeat;}
li.why span {background:url(/images/questions/why.png) 0 0 no-repeat;}
li.what span {background:url(/images/questions/what.png) 0 0 no-repeat;}
#why-use {width:753px;height:2294px;}
p#why-use span{background:white url(/images/questions/why-use-jot.png) 50% 0 no-repeat;}
#how-use {width:742px;height:3320px;}
p#how-use span{background:white url(/images/questions/how-do-you-body.jpg) 50% 0 no-repeat;}
