/* Primary Styles for mobile
   Author: Brendan Adkins
*/

	body {
		background-image: url(/mobile-roi/bg-main-mobile.jpg);
		background-repeat: repeat-x;
		margin: 0;
		font-family: verdana, helvetica, arial, sans-serif;
		font-family: "Trebuchet MS";
	}
	
	br {
		display: none;
	}
	
	#global-head #nav {
		display: none;
	}
	
	#logo {
		margin-left: 20px;
	}
	
	#splash div.call-to-action {
		display: none;
	}
	
	#splash h1 {
		color: white;
		margin: 0 10px;
		text-align: left;
		font-family: "Trebuchet MS", Trebuchet, Helvetica, Arial, sans-serif;
		margin-top: 0;
		letter-spacing: -2px;
		font-size: 40px;
		text-shadow: black 2px 1px 0px;
		height: 65px;
		margin-left: 20px;
	}
	
	#page-content {
		min-height: 300px;
		padding-bottom: 25px;
	}
	
	#page-content p {
		font-family: "Trebuchet MS", Trebuchet, Helvetica, Arial, sans-serif;
		font-size: 13px;
		line-height: 21px;
		margin-top: 0;
		margin-bottom: 9px;
	}
	
	p.error {
		color: red;
		font-weight: bold;
	}
	
	#page-content p.nocode {
		margin-top: 30px;
	}
	
	form input.text, form input.submit {
	
		display: block;
		width: 95%;
		height: auto;
		margin: 8px auto;		
	}
	
	footer {
		margin: 10px 10px 0;
	}
	
	footer a {
		display: block;
		margin: 0 auto;
		padding-bottom: 60px;
		background-color: black;
		width: 226px;
	}	
	
	footer a img {
	    -moz-border-radius-topleft:11px; -moz-border-radius-topright:11px;
	    -webkit-border-top-left-radius:11px; -webkit-border-top-right-radius:11px;
	    border-top-left-radius:11px; border-top-right-radius:11px;
	}


	#sticky-footer-container {
	  position: relative;
	  padding-top: 50px;
	  background: url(/images/bg-footer.png) repeat-x bottom left; }
	
	#global-footer {
	  padding: 0;
	  margin: 0 auto;
	  position: relative; }
	  #global-footer .contact {
	    margin: 0 10px; }
	    #global-footer .contact p {
	      margin: 0 0 8px 0;
	      font-size: 13px;
	      line-height: 21px; }
	  #global-footer div.copyright {
	    position: absolute;
	    width: 244px;
	    height: 45px;
	    background: black;
	    bottom: 0;
	    right: 60px;
	    color: white;
	    padding: 12px 0 0 17px; }
	    #global-footer div.copyright p {
	      margin: 0;
	      padding: 0;
	      line-height: 15px; }
	    #global-footer div.copyright span.company-name {
	      font-size: 15px; }
	    #global-footer div.copyright span.copyright {
	      font-size: 11px; }

#bottom-nav {
  height: 38px;
  margin: 0 0px 0 10px; }
  #bottom-nav ul {
    list-style: none;
    margin: 0;
    padding: 6px 0 0 0; }
  #bottom-nav li {
    float: left;
    margin-right: 20px; }
    #bottom-nav li a {
      text-decoration: none;
      color: black;
      font-size: 13px; }
      #bottom-nav li a:hover {
        text-decoration: underline; }

#where {
	margin-bottom: 10px;
}

@media
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {

	body {
	}
}

div.col1 {
	padding: 10px 10px 0;
}
.fancy_button {
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 15px/100% Arial, Helvetica, sans-serif;
	padding: .5em 3em .55em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	font-weight:bold;
	margin-bottom:2em;
}
.fancy_button:hover {
	text-decoration: none;
}
.fancy_button:active {
	position: relative;
	top: 1px;
}

.blue_fancy_button {
	color: #d9eef7 !important;
	border: solid 1px #0076a3;
	background: #0095cd;
	background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
	background: -moz-linear-gradient(top,  #00adee,  #0078a5);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
}
.blue_fancy_button:hover {
	background: #007ead !important;
	background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e));
	background: -moz-linear-gradient(top,  #0095cc,  #00678e);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e');
}
.blue_fancy_button:active {
	color: #80bed6 !important;
	background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
	background: -moz-linear-gradient(top,  #0078a5,  #00adee);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee');
}

.lostrevenue {
  color: red;
  font-weight: bolder;
}

#page-content #breakdown-banner {
	margin: 5px auto;
}

#breakdown-banner h2 {
	margin: 0;
	padding: 0;
	text-align: center;
	font-style: italic;
	font-size: 25px;
}

#page-content hhowmuch-header {
	margin-top: 10px;
}

#personalized-form p input.fancy_button {
	margin-bottom: 0;
}

#personalized-form input {
	display: block;
	margin: 10px auto;
	width: 270px;
}

#personalized-form input.text {
	font-size: 25px;
	border-radius: 4px;	
}

#personalized-form input.submit {
	font-size: 20px;
}

#personalized-bullets {
	float: left;
	width: 220px;
	margin-top: 5px;
}

#page-content p.standout {
	font-size: 250%;
	text-align: center;
	margin-top: 15px;
	text-shadow: #999 1px 1px 3px;
	line-height: normal;
}

#page-content p.standout-hammer {
	font-size: 150%;
	text-align: center;
	margin-bottom: 30px;
	line-height: normal;
}

#request-report-form {

	margin: 40px 0 0;	
}

#request-report-form input, #request-report-form label {
	display: block;
	margin: 10px auto;
	width: 270px;
}

#request-report-form input.text {
	font-size: 25px;
	border-radius: 4px;	
}

#request-report-form input.submit {
	font-size: 20px;
}

#request-report-form label {
	font-size: 19px;
}

#snappy_loading, #snappy_image, .screen_container {
	display: none;
}
	  
#page-content #footnotes {
	font-size: 12px;
	margin-top: 20px;
}



/* CSS MQ */

@media only screen and (min-width: 768px) {

	body {
		background-image: url(/images/bg-main.jpg);
		background-repeat: repeat-x;
	}
	
	br {
		display: inline;
	}
	
	header, #main {
		background-color: transparent;
		padding: 0;
	}
	
	#global-head, #splash div.call-to-action, #sticky-footer-container {
		display: block;
	}
	
	body form input.text, body form input.submit {
	
		display: inline;
		width: auto;
		margin: 0;
		height: auto;
	}

	footer {
	
		display: none;
	}
	
	root {
	  display: block; }
	
	html {
	  height: 100%; }
	
	body {
	  height: 100%;
	  margin: 0;
	  padding: 0;
	  background: #f7f7f7 url(../images/bg-main.jpg) repeat-x top center;
	  font-family: verdana, helvetica, arial, sans-serif;
	  font-family: "Trebuchet MS"; }
	  body.homepage {
	    background: white url(../images/bg-w2w-home.png) repeat-x top center; }
	
	a, a:visited {
	  color: #3d89bf; }
	
	a:hover {
	  color: #55a2d8; }
	
	h1, h2, h3, h4 {
	  letter-spacing: -1px;
	  font-weight: bold;
	  margin-top: 10px;
	  margin-bottom: 5px; }
	
	h1 {
	  margin-bottom: 0; }
	
	a img {
	  border: none; }
	
	br.clear {
	  clear: both;
	  display: block; }
	
	.arrow-button {
	  float: left;
	  height: 33px;
	  text-decoration: none;
	  color: black;
	  font-size: 15px;
	  line-height: 33px;
	  text-transform: uppercase;
	  background: url(../images/btn-left.png) repeat-x center left; }
	  .arrow-button span {
	    background: url(../images/btn-right.png) no-repeat center right;
	    padding: 9px 40px 9px 18px; }
	
	#global-head {
	  overflow: auto;
	  margin: 0;
	  padding: 0;
	  height: 50px;
	  overflow: visible;
	  position: relative;
	  z-index: 200; }
	
	#container {
	  min-height: 100%;
	  width: 1034px;
	  padding: 0;
	  margin: 0 auto; }
	
	#logo {
	  position: absolute;
	  left: 60px; }
	
	#nav ul {
	  float: right;
	  list-style: none;
	  margin: 8px 0 0 0;
	  padding: 0 60px 0 0; }
	  #nav ul li {
	    float: left;
	    font-size: 15px;
	    line-height: 15px; }
	#nav a {
	  display: block;
	  color: black;
	  text-decoration: none;
	  padding: 6px 12px;
	  text-transform: uppercase; }
	  #nav a:hover {
	    background: black;
	    color: white; }
	#nav li.current a {
	  background: black;
	  color: white; }
	
	/* styles for splash area */
	#splash {
	  position: relative;
	  z-index: 100;
	  height: 200px;
	  padding-top: 30px;
	  color: white;
	  margin: 0; }
	
	.homepage #splash {
	  height: 364px;
	  padding: 30px 60px 0 60px;
	  background: url(../images/bg-splash-home.jpg) no-repeat top center;
	  color: black; }
	
	.subpage #splash {
	  padding: 30px 60px 0 60px;
	  background: url(../images/bg-splash-sub.jpg) no-repeat top center; }
	#splash p {
	  margin-top: -5px;
	  margin-left: 35px;
	  font-style: italic;
	  color: #cccccc;
	  text-shadow: black 0px 1px 1px; }
	
	#splash-content {
	  position: absolute;
	  bottom: 9px;
	  right: 120px;
	  width: 580px; }
	  #splash-content.no-image {
	    position: absolute;
	    bottom: 0px;
	    width: 580px;
	    left: 35px;
	  }
	    
	#splash-content.no-image h1 {
		text-align: left;
	}
	
	#splash-content-right {
	  position: absolute;
	  top: 100px;
	  right: 100px; }
	
	.homepage #splash-content {
	  bottom: auto;
	  right: auto;
	  top: 90px;
	  left: 100px;
	  width: 400px; }
	
	#splash .call-to-action {
	  position: absolute;
	  right: 60px;
	  top: 30px; }
	  #splash .call-to-action h3, #splash .call-to-action p {
	    margin: 0;
	    text-align: right; }
	  #splash .call-to-action .line1 {
	      font-size:17px; text-align:right; color:#000;
	      font-family:Helvetica,Arial,sans-serif;
	      letter-spacing:1px;
	      /*text-shadow: -1px 0 4px #fff, 0 -1px 4px #fff, 0 1px 4px #fff, 1px 0 4px #fff;*/
	      margin-bottom:2px;
	  }
	  #splash .call-to-action .line2 {
	      font-size:12px; text-align:right; color:#555;
	      font-family:Lucida Sans Unicode,Lucida Grande,Helvetica,sans-serif;
	      text-shadow: 1px 1px 5px #fff;
	  }
	  #splash .call-to-action .line1-white {
	      font-size:17px; text-align:right; color:#fff;
	      font-family:Helvetica,Arial,sans-serif;
	      letter-spacing:1px;
	      text-shadow: -1px 0 4px #555, 0 -1px 4px #555, 0 1px 4px #555, 1px 0 4px #555;
	      margin-bottom:5px;
	  }
	  #splash .call-to-action .line2-white {
	      font-size:13px; text-align:right; color:#ddd;
	      font-family:Lucida Sans Unicode,Lucida Grande,Helvetica,sans-serif;
	      text-shadow: 1px 1px 5px #000;
	  }
	#splash .hero {
	  float: left; }
	
	.homepage #splash img.hero {
	  position: absolute;
	  right: 38px;
	  bottom: 0; }
	
	.hanging {
	  position: relative;
	  top: 50px;
	  left: -7px; }
	
	.subpage #splash .hero.hanging {
	  position: relative;
	  top: 50px;
	  left: -7px; }
	
	.homepage #sub-splash {
	  width: 960px;
	  height: 47px;
	  margin: 0 auto;
	  padding: 1px 0;
	  background: url(../images/bg-splash-bottom-home.png) repeat-x top left; }
	  .homepage #sub-splash p {
	    color: #d7d7d7;
	    text-align: right;
	    font-size: 12px;
	    line-height: 12px;
	    font-style: italic;
	    margin: 16px 50px 0 0; }
	.homepage #splash-content ul {
	  margin: 0;
	  padding: 0;
	  list-style: none; }
	.homepage #splash-content li {
	  font-size: 17px;
	  margin-top: 30px;
	  padding-left: 19px;
	  background: url(../images/bullet-home-splash.png) no-repeat 0px 5px; }
	.homepage #home_bullet_points {
	  margin-top: 20px; }
	.homepage .learn_more, .homepage .learn_more:hover {
	  border: 0;
	  margin-top: 20px;
	  cursor: pointer; }
	  
	#page-content p.standout {
		font-size: 250%;
		text-align: center;
		margin-top: 15px;
		text-shadow: #999 1px 1px 3px;
	}
	
	#page-content p.standout-hammer {
		font-size: 150%;
		text-align: center;
		margin-bottom: 30px;
	}

	#page-content #breakdown-banner {
		position: absolute;
		top: -37px;
		z-index: 2000;
		left: 38px;
		width: 960px;
		/* background: url(breakdown-bg.png) repeat-x transparent; */
		height: 60px;
	}
	
	#page-content #breakdown-banner h2 {
		margin: 5px 0 0;
		width: 660px;
		font-size: 48px;
		font-style: italic;
		-moz-text-shadow: white 0 0 4px;
		-webkit-text-shadow: white 0 0  4px;
		text-shadow: white 0 0 4px;
		text-align: right;
	}

	#personalized-form {
		float: left;
		position: relative;
		width: 230px;
		margin-left: 5px;
		top: -25px;
		border-radius: 12px;
		background-color: #91b0bc;
		padding: 15px 15px 5px 15px;
	}
	
	#personalized-form input.text {
		height: 1em;
	}

	#personalized-form input.text {
		display: block;
		margin: 10px auto;
		width: 225px;
		font-size: inherit;
		border-radius: 0;	
	}
	
	#personalized-form input.fancy_button {
		width: 225px;
	}
	
	#page-content {
	  background: url(bg-content-sub-bright.jpg) no-repeat center top
	  overflow: visible;
	  padding: 50px 60px;
	  padding-bottom: 150px;
	  margin: 0;
	  position: relative;
	   }
	  #page-content p {
	    font-size: 13px;
	    line-height: 21px;
	    margin-top: 0;
	    margin-bottom: 9px; }
	  #page-content h2 {
	    margin-bottom: 9px;
	    font-size: 23px; }
	  #page-content h3 {
	    font-size: 18px;
	    margin-top: 10px;
	    margin-bottom: 9px; }
	
	#page-content li { font-size:13px; margin-bottom:5px; }
	#page-content ul { margin-top:5px;
		padding-left: 25px; }
	
	.homepage #page-content {
	  background: white;
	  width: 900px;
	  margin: 0 auto;
	  padding: 50px 30px;
	  padding-bottom: 150px; }
	
	.subpage #page-content {
	  background: url(bg-content-sub-bright.jpg) top center no-repeat; }
	  
	#snappy_loading {
		position:absolute;
		z-index:0;
		left:130px;
		top:300px;
	}

	#snappy_image {
		z-index:1;
	}

	#snappy_loading, #snappy_image, .screen_container {
		display: block;
	}

	#page_content #snappy_loading, #page_content #snappy_image, #page_content .screen_container {
		display: block;
	}

	
	.screen_container {
	  background-image: url('iphone4_blank.png');
	  background-repeat: no-repeat;
	  position: relative;
	  width: 380px;
	  height: 744px;
	  float: right;
	}
	  /* Glossy layer over screenshot */
	  .screen_container::after {
	    content: '';
	    background-image: url('iphone_gloss.png');
	    background-repeat: no-repeat;
	    background-position: top right;
	    position: absolute;
	    top: 0;
	    right: 0px;
	    width: 380px;
	    height: 641px;
	  }
	  .screen {
	    position: absolute;
	    top: 213px;
	    left: 32px;
	  }

	
	.two-col {
	  overflow: auto; }
	  .two-col img {
	    width: 100%;
	    border: 1px solid #797d82; }
	  .two-col .col1 {
	    float: left;
	    width: 400px; }
	  .two-col .col2 {
	    float: left;
	    width: 400px;
	    margin-left: 60px; }
	    
	 div.col1 {
		margin-bottom: 100px;
	 }
	
	.inset-region {
	  background: white;
	  border: 1px solid #797d82;
	  padding: 0 0 10px 0;
	  overflow: auto;
	  position: relative;
	  margin-top: 90px; }
	  .inset-region h2 {
	    margin: 0 20px;
	    float: left;
	    background: #1a1a1a;
	    color: white;
	    font-size: 24px;
	    padding: 6px 40px 8px 40px; }
	  .inset-region .inset-image {
	    float: left;
	    margin: 20px 30px 20px 20px; }
	  .inset-region .inset-content {
	    width: 420px;
	    float: left;
	    margin-left: 20px; }
	  .inset-region .arrow-button {
	    position: absolute;
	    bottom: 15px;
	    right: 15px; }
	
	.lead_form_container {
	  margin-bottom: 10px;
	  text-align: center;
	  width: 350px;
	  margin-top: 20px;
	  margin-left: 70px; }
	  .lead_form_container.no_image {
	    margin-top: 0px;
	    margin-left: 50px; }
	  .lead_form_container .title {
	    padding-bottom: 5px;
	    font-size: 20px;
	    font-weight: bold;
	    font-style: italic;
	    color: #18374d;
	    text-shadow: white 1px 0px 1px;
	    font-family: "Trebuchet MS";
	    letter-spacing: 0px; }
	  .lead_form_container .light {
	    color: white;
	    text-shadow: black 1px 0px 1px;
	    text-align: left;
	    font-style: normal; }
	
	.lead_form {
	  background-color: #efefef;
	  color: black;
	  border: 3px solid #dddddd;
	  text-align: center;
	  padding-top: 10px;
	  padding-bottom: 10px; }
	  .lead_form .label {
	    color: #333333;
	    font-weight: bold;
	    text-transform: uppercase;
	    font-size: 12px;
	    text-align: right;
	    float: left;
	    width: 110px; }
	  .lead_form .field {
	    clear: right; }
	
	.large p {
	  font-size: 20px !important; }
	  
	#page-content #footnotes {
		font-size: 12px;
		position: absolute;
		bottom: 140px;
		left: 60px;
	}
	
	#sticky-footer-container {
	  position: relative;
	  padding-top: 25px;
	  margin-top: -150px;
	  background: url(../images/bg-footer.png) repeat-x bottom left;
	  height: 125px; }
	
	#global-footer {
	  width: 1034px;
	  padding: 0;
	  margin: 0 auto;
	  position: relative; }
	  #global-footer .contact {
	    margin: 0 60px; }
	    #global-footer .contact p {
	      margin: 0 0 8px 0;
	      font-size: 13px;
	      line-height: 21px; }
	  #global-footer div.copyright {
	    position: absolute;
	    width: 244px;
	    height: 45px;
	    background: black;
	    bottom: 0;
	    right: 60px;
	    color: white;
	    padding: 12px 0 0 17px; }
	    #global-footer div.copyright p {
	      margin: 0;
	      padding: 0;
	      line-height: 15px; }
	    #global-footer div.copyright span.company-name {
	      font-size: 15px; }
	    #global-footer div.copyright span.copyright {
	      font-size: 11px; }
	
	#bottom-nav {
	  height: 38px;
	  margin: 0 60px 0 60px; }
	  #bottom-nav ul {
	    list-style: none;
	    margin: 0;
	    padding: 6px 0 0 0; }
	  #bottom-nav li {
	    float: left;
	    margin-right: 20px; }
	    #bottom-nav li a {
	      text-decoration: none;
	      color: black;
	      font-size: 13px; }
	      #bottom-nav li a:hover {
	        text-decoration: underline; }
	
	/*Opera Fix */
	body:before {
	  content: "";
	  height: 100%;
	  float: left;
	  width: 0;
	  margin-top: -32767px; }
}/*/mediaquery*/

/* Argh */

#ie #splash {
	height: 230px;
}

#ie #splash-content.no-image {
	bottom: 0px;
}

#ie #sticky-footer-container .contact, #ie #main {
	text-align: left;
}

#ie #request-report-form {
	text-align: center;
}

#request-report-label {
	display: none;
	font-weight: bold;
	width: 300px;
	text-align: left;
	font-size: 18px !important;
}

#request-report-label span {
	color: #aaa;
}

#personalized-form label {
	display: none;
	font-weight: bold;
}

#ie #personalized-bullets {
	z-index: 10000;
	position: relative;
	list-style-type: disc;
	padding-left: 20px;
	font-size: 12px;
}

#ie #page-content #breakdown-banner {
	z-index: 10000;
	left: 0;
	top: 10px;
}

#ie #page-content #breakdown-banner h2 {
	text-align: left;
	width: 400px;
	font-size: 30px;
}

#ie #personalized-form {
	background-color: #91b0bc;
}

#ie #personalized-form-submit {
	background-color: transparent;
	width: 225px;
	margin-top: 10px;
}