/* @override http://mozilla.dev/style/ihc.css */

#unhealthy.diagnosis_capsule {display: none;}

#modern_browsers {
	text-align: center;
}
#modern_browsers ul {
	list-style: none;
	margin: 0;
}
#modern_browsers ul li {
	display:block;
	float:left;
	width:19%;
	padding: 0;
	background: none;
}
#modern_browsers ul li a {
	display: block;
	float: left;
	width: 100%;
	padding:0;
}

#modern_browsers a:hover {
	text-decoration: none;
}
#modern_browsers ul li .caption {
	display: block;
	margin-top: 5px;
}

#reasons {
	padding: 0 60px;
	margin-bottom: 2em;
}
#reasons p.callout {
	text-align:left;
}
#reasons .capsule.dogood,
#reasons .capsule.getsocial {
  padding-left:125px;
  position:relative;
}
#reasons .capsule.dogood img,
#reasons .capsule.getsocial img{
  position:absolute;
  top:0;left:15px;
}
#letter_to_it {
	padding: 60px;
	margin: 0 60px;
	border:15px solid #efefd4;
	background-color:#fefede;
	color:#56564b;
	font-family: Courier, "Courier New", monospace;	
}
#letter_to_it p {
	font-size: 15px;
	line-height: 23px;	
}
#letter_to_it #signature {
	background:url('/images/template/screen/ihc/yournamehere.png') 0 0 no-repeat;
	text-indent: -9999px;
	margin-top: 2em;
}

.keypoint {	
	margin: 2em 0 2em;
	position:relative;
	max-width: 1600px;
}

.keypoint,
.keypoint .inner,
.keypoint .foot {
	background:url('/images/template/screen/ihc/paintstrip.png') 0 0 no-repeat;
}

.keypoint .inner {
	background-position: top right;
	margin-left: 320px;
	padding: 14px 60px 1px 0px;
/*	border: 1px dashed green;*/
}
.keypoint .foot{
	height: 20px;
	background-position: bottom left;	
	clear:both;
}
.keypoint .foot .inner {
	height: 20px;
	background-position: bottom right;
	padding: 0;
	margin-left: 320px;
}
.keypoint .callout {
  font-family:Georgia, "Times New Roman", Times, serif;
  text-align: left;
  font-style:italic;
  margin-top:2em;
  text-shadow:0 1px 0 #FFFFFF;
  clear:none;
}
.keypoint img.seal {
	position: absolute;
	left: 60px; top:-14px;
}

#danger.keypoint .inner {
	margin-left:280px;
}
#why.keypoint .inner {
	margin-left: 290px;
}
#stuck.keypoint .inner {
	margin-left: 302px;
}
#poster.keypoint .inner {
	margin-left: 246px;
}

.nextsteps {
	background:url('/images/template/screen/ihc/sketchyline.png') 0 0 repeat-x;
	padding-top:2em;	
	clear: both;
}
.one-col {
	margin: 0 120px;
}
.two-col {
	float:left;
	margin-right:6%;
	width:47%;
}
.two-col.two-fifths {
  width:37%;  
}
.two-col.three-fifths {
  width:57%;
}

.cols .main{
  float:left;
  margin-right:425px;
}
.cols .sidebar{
  float:left;
  width: 365px;
  margin-left:-365px;
}
  
.capsule {
	padding: 0 15px;
	position: relative;
}
.capsule.nextsteps {
	padding-top: 1px;
	margin-top:-1px;
}

.capsule img {
	float: left;
	margin: 0 30px 1em 0;
}
img.center {
  float:none;
  display:block;
  margin:0 auto 1em;
}
.capsule h2 a {
	color: #B91E27;
}


#poster { margin-bottom: 2em;}
#poster .inner {padding-bottom:1em;}
#poster .foot .inner {padding-bottom:0;}
#poster_preview {
	width: 160px;
	height: 210px;
	left:60px;
	position:absolute;
	top:-6px;
  background: url('/images/template/screen/OneWebDayPosters/owd_p1.png') 50% 50% no-repeat;
	cursor:pointer;	
}
#poster.p2 #poster_preview {
	background-image: url('/images/template/screen/OneWebDayPosters/owd_p2.png');
}
#poster.p3 #poster_preview {
	background-image: url('/images/template/screen/OneWebDayPosters/owd_p3.png');
}
#poster.p4 #poster_preview {
	background-image: url('/images/template/screen/OneWebDayPosters/owd_p4.png');
	width: 220px;
	left: 15px;
}
#poster.p5 #poster_preview {
	background-image: url('/images/template/screen/OneWebDayPosters/owd_p5.png');
}

ul.thumbs {
	list-style: none;
	margin:0 auto;
	height:145px; max-width: 800px;
}
ul.thumbs li {
	float: left;
	margin: 0 15px 30px;
	padding: 0;
	width: 130px;
	background: none;
}
ul.thumbs a {
	display: block;
	background: #eee;
	height: 100px; width: 100px;
	border: 15px solid #eee;
	margin: 0 auto;
	background: #eee url('/images/template/screen/OneWebDayPosters/owd_p1.png') 50% 50% no-repeat;
	position:relative;
}
ul.thumbs li.active a{
	border-color:#E3E4E7;
	text-decoration:none;	
}
ul.thumbs li a:hover,
ul.thumbs li.active a:hover {
	border-color:#97C0D2;
	text-decoration:none;
}

#poster_preview .download,
ul.thumbs a .download {
	display: none;
}
#poster_preview:hover .download,
ul.thumbs a:hover .download {
	display: block;
	position:absolute;
	bottom:0;right:0;
	color: #fff;
/*	background-color:rgba(72,192,232,0.9);*/
	background-color:rgba(109,179,209,0.85);
	padding: 2px 3px;
	font-size: 10px;
	font-weight: bold;
	text-decoration:none !important;
	border:1px solid rgba(255,255,255,0.8);
}

ul.thumbs a img {display: none;}

ul.thumbs li#p1 a{ background-image: url('/images/template/screen/OneWebDayPosters/owd_p1.thumb.png');}
ul.thumbs li#p2 a{ background-image: url('/images/template/screen/OneWebDayPosters/owd_p2.thumb.png');}
ul.thumbs li#p3 a{ background-image: url('/images/template/screen/OneWebDayPosters/owd_p3.thumb.png');}
ul.thumbs li#p4 a{ background-image: url('/images/template/screen/OneWebDayPosters/owd_p4.thumb.png');}
ul.thumbs li#p5 a{ background-image: url('/images/template/screen/OneWebDayPosters/owd_p5.thumb.png');}


#poster_contest {position:relative;}
#poster_contest label {
	display:inline-block;
	width:80px;
	padding-right:15px;
	font-weight:bold;
}
#poster_contest label.inline {
	display: inline;
	font-weight:normal;
	font-style:italic;
}
#poster_contest input.check {margin-right:6px;}
#poster_contest .robot {display:none;}
#poster_contest .ajaxmsg {
	position: absolute;
	width: 90%;
	padding: 15px;
	background-color:#41C476;
	border:3px solid #03933E;
	color:#fff;
	z-index:100;
	font-weight: bold;
}
#poster_contest .ajaxmsg.error{
	background-color:#EDAC3A;
	border-color:#C38D2F;
}

ul.friendfeed {
	list-style: none;
	margin:0;
}
ul.friendfeed li {
	margin: 0 0 1.5em;
	padding:0 0 0.5em;
	background: none;
/*	background: transparent url(/images/template/screen/ihc/sketchyline.png) repeat-x scroll 0 100%;*/
	border-bottom: 1px solid #E2E3E6;
}
ul.friendfeed,
ul.friendfeed li,
ul.friendfeed p {
/*	font-size:10px;*/
}
.friendfeed .text_entry p.friendfeed_body {
	font-size: 16px;
	font-family: Georgia, "Times New Roman", Times, serif copy;
	font-style:italic;
}

ul.friendfeed .thumbnail {
	display: block;
	text-align: center;
	float: left;	
}
ul.friendfeed .thumbnail img {
	border: 15px solid #fff;
	padding: 1px;
	background: #E1E2E5;
}
ul.friendfeed .thumbnail a:hover img {
	border-color:#97C0D2;
}
ul.friendfeed .caption {}
ul.friendfeed .friendfeed_info {
	clear: both;
	font-size:10px;
}
.friendfeed_info.date {text-align: right;}
.moretagged {
  clear:both;
	text-align: right;
	font-weight: bold;
}


.capsule p {
	font-size: 13px;
	line-height: 17px;
}
p.callout {
	font-size: 17px;
	margin-bottom: 2em;
	padding: 0 15px;
	clear:both;
	text-align: center;
}

.two-col.key-point {
	padding: 35px 0 0;
	margin-top: -15px;
}
.two-col.key-point:after {margin: 0 0 -15px;}

.button a{
  display: inline-block;
  padding:0.5em 1em;
/*  font-size:2em;*/
  color:#1075B3 !important;
  text-shadow:0px 1px 0 #fff;
  font-weight:bold;
  text-align:center;
  border:1px solid #C9C8C9;
  border-color:#C9C8C9 #999999 #999999 #C9C8C9;
  border-color:#999999 #808080 #4d4d4d;  
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  background: #d3d3d3 url('/images/template/widgets/button-bg.png') 0 0 repeat-x;  
}
.button a:hover{

  background: #f2f2f2 url('/images/template/widgets/button-bg.png') 0 -132px repeat-x; 
  text-shadow:0px -1px 0 #fff;
  text-decoration:none;
  border-color:#4d4d4d #4d4d4d #4d4d4d;
}
.button {
  display:inline-block;
  border:4px solid #57A6C5;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  border-radius:10px;
  margin:0 0 1em -6px;
}
.button.donate {
  border-color:#FBC51B;
}
.button img{
  margin:0 0.75em 0 0  ;
}
/*-------------------------------------------
    Better Internet
-------------------------------------------*/
#top {}
#better {}
#better h1{
  margin-top:10px;
  margin-bottom:0;
}
#betterinternet .two-col {
  margin-right:0;
}
#betterinternet .two-col.two-fifths {
  width:43%;
}
#donate,
#donate .inner,
#donate .foot {
 background-image: url('/images/template/screen/BetterInternet/donate_bg.png');  
}
#donate {
  margin-top:0em;
  margin-bottom:2em;
  min-width:360px;
  max-width:610px;
  color:#EBF2FA;  
}
#donate.fixed {
  position:absolute;
  top:0; right: -16px;
  width:386px;  
}
#donate .inner {
  margin-left:80px;
  padding-left:5px;
  padding-right:35px;  
/*  padding-bottom:1em;*/
}
#donate .foot .inner {padding:0;}
#donate h2 {
  margin-left:87px;
}
#donate h2,
#donate h2 a {
  color:#fff;
  font-weight:normal;
  margin-bottom:0.5em;
}
#donate a{
  color:#fff;
  font-weight:bold;
}
#donate img {
  float: left;
  margin:-3em 30px 0 -55px;
}
#donate.promo {
  margin-left:-47px;
  padding:0;
  width:412px;
}
#donate.promo .inner {
  padding-left:92px;
}
#donate.promo h3 {
  margin-top:2em;
}
#donate.promo img {
  left:auto;
  margin:1em 0 0 -140px;
  position:absolute;
}
#donate.promo .button.donate {
  margin-left:-72px;
  width:245px;
}
#donate.promo .button.donate a {
  padding:0.5em 0;
  width:243px;
}
#keystoabetterinternet p.callout {
  margin-bottom:1em;
}
#keystoabetterinternet ul{
  margin:0; padding:0;
  list-style:none;
}
#keystoabetterinternet ul li{
  float:left;
  width:20%;
  margin:0 5% 1em 0;padding:0;
  background:none;
}


/*-------------------------------------------
    What is an Open Web?
-------------------------------------------*/
.whatopenweb{}

.whatopenweb.keypoint .inner {
  padding-top:2em;
  margin-left:60px;
}
.whatopenweb.keypoint .foot .inner {padding-top:0;}
.whatopenweb.keypoint img.seal {
  position: relative;
  left:0; top:0;
  float: left;
  margin: 0 2em 2em 0;
}

#whatopenweb_contest .panel{
  display:none;
}
#whatopenweb_contest #stepone.panel {
  display:block;
}

#whatopenweb_contest #tweet {
  padding: 1em 1em 0;
  background: #eee;
  border: 1px solid #fff  ;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  font-family:Georgia, "Times New Roman", Times, serif copy;
  font-style:italic;
  font-size:17px;
  -moz-box-shadow:0 1px 4px rgba(0,0,0,0.6);
  -webkit-box-shadow:0 1px 6px rgba(0,0,0,0.6);
  box-shadow:0 1px 6px rgba(0,0,0,0.6);
  text-shadow:0 1px 0 #FFFFFF;
}
#whatopenweb_contest #tweet:after{
  background:  url("/images/template/screen/openweb/tweet_balloon_pointer.png") top left repeat-x; 
  margin: 0; 
  content: " "; 
  display: block; 
  position: absolute; right:2em ;
  height: 24px; width:59px; 
  clear: both;
}
#whatopenweb_contest #tweet p.callout{
  font-size:17px;
  line-height:1.4;
  text-align:left;
  margin-bottom: 1em;
  padding:0;
}
#whatopenweb_contest #tweet span.quote{
 font-size:17px; 
}
#whatopenweb_contest .button.tweet {
  margin-top:1.4em;
  font-size:14px;
  float:right;
}

.whatopenweb #tshirt_contest{
  height:auto;
  margin-top: 2em;
  margin-bottom:2em;
  padding:0;
  text-align:center;
}
.whatopenweb #tshirt_contest h3 {margin:0;}
.whatopenweb #tshirt_contest h3 a{
  display:block;
  padding:4px 0 1em;
  margin:0;
  font-family:Georgia, "Times New Roman", Times, serif copy;
  font-size:17px;
  text-transform:none;
  background:#171314 url("/images/template/screen/promo/mozilla_tshirt_design_challenge/star.png") 50% 51px no-repeat;
  border-radius:6px 6px 0 0;
  -moz-border-radius:6px 6px 0 0;
  -webkit-border-radius:6px 6px 0 0;
}
.whatopenweb #tshirt_contest .figure{
  display:block;
  width:365px; height:119px;
  background:url("/images/template/screen/promo/mozilla_tshirt_design_challenge/tshirt_design_challenge_promo.png") left top no-repeat;
  border-radius:0 0 6px 6px;
  -moz-border-radius:0 0 6px 6px;
  -webkit-border-radius:0 0 6px 6px;
}
.whatopenweb #tshirt_contest .figure img{
  display:none;
}
.whatopenweb #tshirt_contest h3 a{
  color:#e5dbc1;
}
#whatopenweb_feed h2.callout {
  text-align:center;
}
#whatopenweb_feed ul.friendfeed li {
  display:inline-block;
  width: 21%;
  margin: 0 2% 1.5em;
  padding-top: 1em;
  float: left;
  position:relative;
  overflow:hidden;
  border-bottom:0;
}
#whatopenweb_feed ul.friendfeed li.text_entry .friendfeed_body{
  padding-top: 1em;
}
#whatopenweb_feed ul.friendfeed li span.thumbnail{
  float: none;
}
ul.friendfeed .thumbnail img {
  border:1px solid #ddd;
}
ul.friendfeed .caption{
 font-size:12px; 
}
#whatopenweb_feed ul.friendfeed li p.friendfeed_info{
  margin-top:1em;
  color:#aaa;
}
#whatopenweb_feed ul.friendfeed li p.friendfeed_info a{
  color:#aaa;
}
#whatopenweb_feed ul.friendfeed li p.friendfeed_info a:hover{
  color:#148CB5;
}



form.contest {
  position:relative;
}
form.contest label {
	display:inline-block;
	width:80px;
	padding-right:15px;
	font-weight:bold;
}
form.contest label.inline {
	display: inline;
	font-weight:normal;
	font-style:italic;
}
form.contest input.check {margin-right:6px;}
form.contest .robot {display:none;}
form.contest .ajaxmsg {
	position: absolute;
	width: 90%;
	padding: 15px;
	background-color:#41C476;
	border:3px solid #03933E;
	color:#fff;
	z-index:100;
	font-weight: bold;
}
form.contest .ajaxmsg.error{
	background-color:#EDAC3A;
	border-color:#C38D2F;
}
form.contest .ajaxmsg.error .red{
  color:#b00; 
}
form.contest  label.textarea {
  display: block;
  width: auto;
} 
form.contest textarea {
  width: 80%; height: 11em;
}
form.contest label.missing{
  color: #b00;
}
form.contest .charcount {
  display: block;
  width: 80%;
  text-align:right;
}
form.contest .charcount.warning {
  color:#b90;
}
form.contest .charcount.error {
  color:#b00; 
}
form.contest .charcount .count {
  font-weight:bold;
}
form.contest .note {
  font-size:10px;
  border:none;
  padding:0;
}

.promo {
  width:235px;
  margin:-1px 0 1em;
  padding:1px 15px 0 130px;
  position:relative;
  min-height:120px;
  background:url("/images/template/screen/ihc/sketchyline.png") repeat-x scroll 0 0 transparent;
}
.promo h3 {
  margin-top:1em;
}
.promo img {
  position:absolute;
  top:1em; left:0;
}
#openwebfund_promo {
  background: url(/images/template/screen/promo/openwebfund/openwebfund_promo_bg.png) 10px 0 no-repeat;
  width:155px
}
#openwebfund_promo p {
  margin-top: 1em;
}

/*-------------------------------------------
    Universal Subtitles
-------------------------------------------*/
#universal_subtitles{
	min-width: 857px;
}
#universal_subtitles .main {
	margin-right:315px ;
}
#universal_subtitles .sidebar{
	width: 285px;
	margin-left: -285px;
}
#universal_subtitles .marquee {
	float: left;
	width:80%;
	margin: 1em 0 0;
}
#universal_subtitles img.seal {	
	float: left;
	margin-top: 1em;
	margin-bottom: 0.5em;
	height:110px;
}
#universal_subtitles h1,
#universal_subtitles p.callout {
	clear: none;
	margin-left: 130px;
	margin-bottom: 1em;
	padding: 0;
	text-align: left;
}
#universal_subtitles h1 {
	margin-top: 0;
	margin-bottom: 0;
}
#universal_subtitles .keypoint {
	margin-top: 0;
	margin-right: -20px;
}
#universal_subtitles .keypoint .inner {
	padding: 34px 50px 1px 0px;
	margin-left:30px;
}
#universal_subtitles .keypoint .foot .inner {padding-top:0;}
#universal_subtitles .keypoint object,
#universal_subtitles .keypoint embed,
#universal_subtitles .keypoint video {
	padding:1px;
	background:#fff;
	margin: 0 auto 20px;
	display:block;
}
#universal_subtitles .keypoint object embed {	
	padding:0;
}

#universal_subtitles .keypoint .video_dl {	
	text-align: center;
}

#universal_subtitles .sidebar h2 {
	margin: 0 0 0.2em;
}
#universal_subtitles .sidebar ul {
	margin: 0;
}
#universal_subtitles .sidebar .signup_field {
	width: 220px;
	display:block;
	background: #eeeeee;
	padding: 1em 0px 1em 1em;
	margin-top: 0.25em;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}
#universal_subtitles .sidebar .signup_field input#email {
	width: 130px;
}
#universal_subtitles #globe {
	border: 1px solid #eee;
	margin-left: 10px;
	margin-top: 1.4em;
	width: 234px;
}
/*-------------------------------------------
    Debug
-------------------------------------------*/
/* 
  the following two rules make the 'sick' page display 
  under the /internethelath/sick/ directory for browsers
  other then ie6
*/
.faked #healthy.diagnosis_capsule {display: none;}
.faked #unhealthy.diagnosis_capsule {display: block;}
/*
  The following are used to label pages in development for reference in communication about the page design
*/
.wflable {
  display:none;  
  background:#191919;
  border:2px solid #A5151E;
  color:#fff;
  font-weight:bold;
  -moz-border-radius:1em;
  width:1.5em;
  text-align:center;
  position:absolute;
  opacity:0.1;
  z-index:100;
}
body:hover .wflable {opacity:0.8;}
.nextsteps{position:relative;}
#labelA{top:20px;left:20px;}
#labelB{top:20px;left:50%;}
#labelC{top:20px;left:-3em;}
#labelD{top:7em;left:-3em;}
#labelE{top:20px;left:-3em;}