/*

Title: 		IM Site
Media:		iPhone/Android/Mobile between 320px and 480px wide
Updated: 	Feb 8, 2010


/* ----------------------------
		=Structure
------------------------------ */

body {
	width: 100%; 
	-webkit-text-size-adjust: none;
	}

img {
	max-width: 90%;}

.iphone-top {
	display:  block;
	}

#wrap { 
	width: auto; 
	margin: 0 5px; 
	text-align: left;
	position:relative;
	}
	
#wrap #logo-login {
	height: auto;
	display: block;
	position: relative;
	}
	
#logo {
	position:  relative;
	}
	
#txt-login {
	display: none;
	right: auto;
	left: 64px;
	top: 50px;
	}
	
#section {
  background: #c7e8f9;
	}

#wrap .col, .col, .twocol, .threecol, .left {
	width: 100%;
	float: none;
	margin: 0 0 30px 0;
	position: relative;
	clear: both;
	}

.highlight .col, .highlight.full .col.left, .highlight.full .col.right {
	width: 100%;
	}
	
.home .coda-slider, #nav-s a, div.prod, .lnav {
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
}

.product.index .lnav {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
	}


/* Type */

#wrap blockquote {
  color: #333;
  line-height: 1.5em; /* 22px */
  margin-bottom: 12px;}

#wrap cite {
	font-size: .875em;
	}
	
h2.pagetitle {
  font-size: 1em;
  line-height: 1.5em;
  margin-bottom: 30px;
  color: #000;
}

h1 {
  font-size: 1.25em; 
}


.col p, 
.twocol p, 
.threecol p, 
.col li, 
blockquote, 
input#site-search, 
input#your-email, 
input#your-email-blog, 
#content td, 
#content th, 
.title-left p, 
.threecol.even p, 
.threecol.even.nointro p, 
.threecol.even li, 
.highlight h2, 
.highlight h3, 
.msg-channels h3, 
#wrap .client-list h2 {
  font-size: .875em; /* 14px */
  line-height: 1.5em;
	}

/* Nav */

#logo-login {
  height: 120px;
}


#nav-s {
  border-top: none;
  padding: 18px 0;
  margin-bottom: 18px;
  position: relative;
}

#nav-s li {
	float: none;
	font-size: .815em;
	}

#nav-s li#home {
	display:  none;
	}

#wrap #nav-s a {
  display: inline;
  }

#wrap #nav-s a span {
  display: none;
  }

#wrap #nav-s a:hover span {
  background-position: 0 0;
}

#wrap #nav-s a.here span {
  background-position: 0 0;
}

.search {
  position: relative;
  top: 0;
  right: auto;
}

input#site-search, input#your-email, input#your-email-blog {
  width: 90%;
	}
	
.highlight #your-email {
	width: 84%;}
	
/* Footer */

#footer p {
  font-size: 1em; /* 16px */
  margin-bottom: 12px;
}

#footer ul, #footer p {
  float: none;
}


#footer li {
  float: none;
  margin: 0 0 12px;
  font-size: .875em; 
}

#footer a {
  display: inline;
  height: auto;
  width: auto;
}

#footer a span {
  display: none;
}


/* Homepage */
.home .coda-slider { 
  background: #c7e8f9;
  height: auto;
}

.coda-slider {
	margin-bottom: 60px;
	}

.coda-slider-no-js .coda-slider { height: auto; overflow: auto !important; }
.coda-slider .panel-wrapper { height: auto; }
.coda-slider { height: auto !important;}

.coda-slider, .coda-slider .panel, #coda-slider-1, .panel, .panel-wrapper { width: 100%; } 

#wrap .panel-container {
	width: 100% !important;}

#wrap .coda-slider { float: none; overflow: auto; position: relative }
#wrap .coda-slider .panel { display: block; float: none }

.coda-slider .panel-wrapper { height: auto; width: auto; background: none; }

.panel-wrapper.one {
  background-image: none;
}

.panel-wrapper.two, .panel-wrapper.three, .panel-wrapper.four {
	display: none;
	}

.home .panel-wrapper {
  padding: 24px;
  width: auto;
}


/* Coda content styles */

.coda-nav ul {
  display: none; 
}


h2.title {
  font-size: 1em; 
  padding: 0;
  margin: 0;
  color: #222;
}

.home .coda-slider p {
  font-family: Georgia, Times, "Times New Roman", serif;
  color: #222;
  font-size: .9375em;
  line-height: 1.5em; 
  width: 100%;
  margin: 0;
  padding-top: 0;
}
  
 .coda-slider-wrapper { clear: both; overflow: auto; }

.clients .panel {
	margin-bottom: 60px;}

.clients .coda-slider img {
	float: none;
	margin: 0 auto 6px;
	}

/* Why styles */

.highlight.full h3 {
	font-size: 1em; /* 16px */
	}


/* Blog */

.blog h3.lt {
	font-size: .875em;
	line-height: 1em;
  padding-top: 16px;
  margin-bottom: 18px;
}

.blog .post {
	margin-bottom: 32px;}

#wrap .blog .post h3 {
	font-size: 1em;
	line-height: 1.375em;
	margin-bottom: 6px;}
	
#wrap .blog .post p {
	font-size: 1em;
	color: #444;
	line-height: 1.375em;
	}

#wrap .blog .post p.by {
	font-size: .875em;}
	
#wrap .prod-ups h2, #wrap h2.newsletter {
	font-size: 1em;
	}
	
.prod-ups li {
  margin-bottom: 32px;
}
	
#wrap .rss {
font-size: .815em;
	}
	
/* misc */

#wrap .highlight h2, .col.client-list h2 {
	margin-bottom: 12px;
	}
	
.title-left {
	margin-top: 32px;}

/* Prod */

div.prod, .lnav {
  height: auto;
  padding: 40px 24px 0;
  margin-bottom: 40px;
  background: #c7e8f9;
}

#product-index .lnav {
	margin-bottom: 0;
	padding: 0;
	}
	
.lnav a {
  border-bottom: 1px solid #80d2fa;
}

.lnav li:last-child a {
	border-bottom: none;
	margin-bottom: 0;
	}

.prod h2 {
  margin: 0 0 12px 0;
}

#product-index h2.lt {
	display:  none;
	}

.lnav {
  position: relative;
  margin: 0 0 42px;
	padding-top: 0;
}

.lnav li a {
	padding: 8px 0;
	font-size: .875em;}

#wrap .lnav a.here {
  padding-left: 0;
  background: none;
}

.threecol.even h4, .threecol.even.nointro h2  {
  font-size: 1em;
  float: none;
	}
	
.threecol.even img {
	float: none;
	margin-left: 0;
	}
	
.title-left {
  background: none;
}

.title-left h2 {
  float: none;
  width: auto;
  margin-bottom: 8px;
  font-size: 18px;
  color: #658708;
}

.title-left img {
  float: none;
  clear: both;
}

.title-left p {
  width: auto;
  float: none;
}

.threecol.btnright img.start {
  position:  relative;
  top: 0;
  right: auto;
}


/* Clients */

.clients .coda-nav ul {
	display: none;
	}

.clients .iphone-h {
  height: auto;
}

.case-studies li {
	padding-left: 35px;
	background: url(/img/ico/ico-pdf.gif) 0 6px no-repeat;
	}

.client-list {
	padding-bottom: 0;}