/*
Theme Name: Mozilla Labs 2009
Theme URI: http://labs.mozilla.com
Description: Mozilla Labs Wordpress Theme
Version: 2.0 (December 2008)
Author: Mozilla Labs
Author URI: http://labs.mozilla.com/

(c) 2008 Mozilla Labs, All Rights Reserved.

*/

* { padding: 0; margin: 0; }


/*----------------------------------------------------------------------- 
   Standard styles
 ------------------------------------------------------------------------ */
 
body {
	color:			#666;
	background:		#fff url(/bg.jpg) top repeat-x;
	font-family: 	HelveticaNeue, "Helvetica Neue", Arial, Verdana, sans-serif;
	font-size: 		13px;
	line-height:	18px;
	border:			0; 	
}

img { border: none;	}

img.left { float: left; margin: 0px 12px 0px 0px; }

img.tn { float: left; margin: 0px 10px 0px 0px; }

a:link { color: #FF6600; text-decoration: none; font-weight: bold; }
a:visited { color: #FF6600; text-decoration: none; font-weight: bold; }
a:hover { color: #cc3300; text-decoration: underline; font-weight: bold; }
a:active { color: #FF6600; text-decoration: none; font-weight: bold; outline: none; }
a:focus { outline: none; }

h1 { 
	font-family: 	HelveticaNeue, "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
	font-weight: 	bold;
	font-size: 		36px;
	line-height: 	36px; 
	margin-bottom: 	5px;
}

h1 a { color: #006699; }

h2 { 
	color: 			#023647;
	font-family: 	HelveticaNeue, "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
	font-weight: 	normal;
	font-size: 		24px;
	line-height: 	24px; 
	margin-bottom:	3px;
	text-shadow:	0 0 0 #fff;
}

h3 { 
	color: 			#023647;
	font-family: 	HelveticaNeue, "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
	font-weight: 	normal;
	font-size: 		18px;
	line-height: 	18px; 
	margin-bottom:	3px;
	text-shadow:	0 0 0 #fff;
}

h3.title { background: url(gfx/icon_labs.png) 0 50% no-repeat; padding-left: 23px; margin-bottom: 10px; margin-left: 10px; }

h4 {
	color: 			#09C;
	font-family: 	Arial, Verdana, sans-serif;
	font-weight: 	bold;
	font-size: 		11px;
	line-height: 	11px;
	text-transform:	uppercase; 
	text-shadow:	0 0 0 #fff;
}

h5 { 
	color: 			#666;
	font-family: 	Arial, Verdana, sans-serif;
	font-weight: 	normal;
	font-size: 		11px;
	line-height: 	11px;
	margin-bottom:	3px;
	text-shadow:	0 0 0 #fff;
}

p { margin-bottom:	14px; }

ol, ul { padding: 0 20px 10px 20px; }

blockquote {
	border-left: 3px solid #cecebd;
	padding-left: 15px;
}

blockquote p { font-size: 12px !important ;}

input { font: 11px arial; }


/*----------------------------------------------------------------------- 
   Layout
 ------------------------------------------------------------------------ */
 
#core {
	width:			940px;					
	margin:			0 auto 0 auto;
}

#masthead {
	height: 		177px;
}

.logo { padding: 2px 0 0 10px; }

/*----------------------------------------------------------------------- 
   Navigation
 ------------------------------------------------------------------------ */
 
ul#nav {
width: 			940px;
height: 		35px;
background:		url(gfx/bg_nav.jpg) top no-repeat;
list-style: 	none;
padding: 		11px 0 0px 0;
margin-bottom:  10px;
}
 
ul#nav li {
width: 			170px;
float: 			left;
text-align: 	left;
font: 			11px Arial;
font-weight: 	bold;
text-transform: uppercase;
margin-right: 	10px;
padding-left:	10px;
}

ul#nav li.last {
width: 			170px;
float: 			left;
text-align: 	left;
font: 			11px Arial;
font-weight: 	bold;
text-transform: uppercase;
margin-right: 	0px;
padding-left:	10px;
margin-top:		-9px;
}

ul#nav li a { display: block; color: #FFF; text-shadow: 0 0 0 #000; background: url(gfx/icon_arrow_nav.jpg) 0 50% no-repeat; padding-left: 18px; }
ul#nav li a:hover { display: block; color: #F60; text-decoration: none; text-shadow: 0 0 0 #000; }
 
ul#nav input.text { width: 100px; font: 11px arial; margin-right: 2px; }

ul#nav table { padding: 0; margin: 0; border: 0; }


/*----------------------------------------------------------------------- 
   Projects - Homepage
 ------------------------------------------------------------------------ */
 
#projects-homepage {
height: 		243px;
background:		url(/bg_projects_homepage.gif) no-repeat;
margin-bottom:  30px;
} 

#projects-featured {
float: 			left;
margin-left:	4px;
padding:		15px;
}

#projects-more {
float: 			left;
width: 			271px;
height:			241px;
border-left:	1px solid #e8e7e7;
}
 
ul#projects {
list-style: 	none;
padding: 		0;
margin:			0;
}

ul#projects a {
font-weight:    normal;
color:          #006699;
}
 
ul#projects li {
height:			70px;
font: 			11px Arial;
padding:		5px 10px 4px 10px;
border-bottom:  1px solid #e8e7e7;
}

ul#projects h3 { color: #006699; padding-top: 10px; }

ul#projects img.left { margin-right: 10px; }


/*----------------------------------------------------------------------- 
   Blog - Homepage
 ------------------------------------------------------------------------ */
 
#blog-homepage { 
width: 			940px;
background:		url(gfx/bg_blog_homepage_rules.gif) repeat-y;
margin-bottom:  30px; 
}

.blog-home-one {
float: 			left;
width:			75px;
padding:		0 10px 0 0;
margin-right:	10px;
}

.blog-home-two {
float: 			left;
width:			160px;
padding:		0 10px 0px 10px;
margin-right:	10px;
}

.blog-home-three {
float: 			left;
width:			275px;
}

.blog-home-two p { font-size: 12px; }

#blog-homepage h3 { line-height: 24px; }

#blog-homepage h3 a { color: #006699; font-weight: bold; text-shadow: 0 0 0 #fff; }

/* Promo box */

#promo-home {
font:			11px arial;
line-height: 	16px;
background:		url(gfx/bg_promo.gif) repeat-y;
}

#promo-home h4 { font-size: 13px; padding: 0 15px 6px 15px; }

#promo-home p { padding: 0 15px 10px 15px; margin: 0; }

#promo-home-footer { 
width:			275px;
height: 		12px;
background: 	url(gfx/footer_promo.gif) no-repeat;
margin-top:		-8px;
}
 
 
/*----------------------------------------------------------------------- 
   Projects page
 ------------------------------------------------------------------------ */

#content {
width:			940px;
background:  	url(/bg_content.gif) no-repeat;
clear:			both;
margin:			0 0 30px 0;
}

#page-title {
float: 			left;
width: 			180px;
margin-right: 	10px;
} 
 
#page-description {
float: 			left;
width:			560px;
margin-right: 	10px;
} 

#page-breadcrumb {
float: 			left;
width: 			750px;
margin-right: 	10px;
}

#page-breadcrumb a { font-weight: normal; color: #000; }

#page-description p { font-size: 14px; line-height: 18px; padding: 0px 10px 0 10px; margin-bottom: 10px; }

#page-tools { 
float: 			left;
width:			180px;
}
 
#page-tools p { line-height: 18px; padding: 0px 10px 0 10px; margin-bottom: 10px; }

#page-tools select { width: 150px; }

.rss { background: url(gfx/icon_rss.gif) 0 50% no-repeat; padding-left: 15px; }

#supercol-left {
float:			left;
width:			760px;
}

#supercol-right {
float:			left;
width:			180px;
}

.col-span-two {
float:			left;
width:			180px;
}

.col-span-two p { padding: 0 20px 10px 20px; }

.col-span-six {
float:			left;
width:			660px;
padding:		0 10px 0 10px;
margin:			0 10px 0 10px;
}

.col-span-post {
float:			left;
width:			460px;
padding:		0 10px 0 10px;
margin:			0 10px 0 10px;
}

.col-span-comments {
float:			left;
width:			460px;
padding:		0 10px 0 10px;
margin:			0 10px 0 10px;
}

.col-span-projects {
float:			left;
width:			480px;
padding:		0 10px 0 10px;
margin:			0 10px 0 10px;
}

img.project { float:left; margin: 5px; padding: 5px; }
img.project-page { float:left; margin: 10px; padding: 10px; }

.projects-rule { border-top: 1px solid #e8e7e7; padding-left: 2px; clear: both; }

.projects h1 { color: #1c4a5a; margin-bottom: 6px; }
.projects h2.latest { padding-top: 20px; margin-bottom: 20px; }
.projects h3 { padding-top: 15px; margin-bottom: 6px; }
.projects h4 { color: #f60; padding-top: 25px; }
.projects a { color: #1C4A5A }
.getitnow { margin-left: 10px; }

.action-items {
margin:			10px; 
background: 	#fff url(gfx/bg_action_items.gif) repeat-y;
}

.action-items h4 { color: #023547; font-size: 12px; padding: 10px; border-bottom: 1px solid #b3c2c7; background: url(gfx/header_action_items.gif) no-repeat; }

.action-items ul {
list-style: 	none;
margin:			0px 8px 0px 8px;
}

.action-items li {
list-style-image: url(gfx/icon_action_items_arrow.gif);
padding:		0px;
margin:			8px 0 0 0;  
}

.action-items-footer { height: 5px; background: url(gfx/footer_action_items.gif) no-repeat; }

#sidebar {
margin:			10px; 
background: 	#e8e7e7 url(gfx/header_sidebar.gif) no-repeat;
}

#sidebar h4 { color: #023547; font-size: 12px; padding: 10px; border-bottom: 1px solid white; }

#sidebar ul {
list-style: 	none;
margin:			0px 8px 0px 8px;
}

#sidebar li {
list-style-image: url(gfx/icon_sidebar_arrow.gif);
padding:		0px;
margin:			8px 0 0 0;  
}

#sidebar-footer { height: 5px; background: url(gfx/footer_sidebar.gif) no-repeat; }

#sidebar select { width: 140px; margin: 10px 10px 5px 10px; }


/*----------------------------------------------------------------------- 
   Blog specific
 ------------------------------------------------------------------------ */

#blog h2 { margin-bottom: 18px; }
#blog h2 a { color: #006699; font-weight: bold; }
#blog h2.date { color: #AAA; }
#blog h3 { margin-bottom: 10px; }
#blog .col-span-two { text-align: right; }

.entry ul, #blog ol, .projects ol, .projects ul { margin: 10px 0 0 0; }
.entry li, .projects li { margin-bottom: 10px; }

.entry { margin: 20px 0 10px 0; }

a.author { background: url(gfx/icon_author.gif) 0 50% no-repeat; padding-left: 15px; }
a.category { background: url(gfx/icon_category.gif) 0 50% no-repeat; padding-left: 15px; }
a.comment{ background: url(gfx/icon_comment.gif) 0 50% no-repeat; padding-left: 15px; }

h3.comments { padding: 0px 0px 10px 200px; border-bottom: 3px solid #e8e7e7; }

.comment-form input { width: 300px; }
.comment-form textarea { width: 400px; height: 130px; margin-bottom: 20px; }
.comment-form input.btn { width: 100px; }


/*----------------------------------------------------------------------- 
   About
 ------------------------------------------------------------------------ */

#about #supercol-left { padding-top: 20px; }
#about h2 { margin-bottom: 10px; }

 
/*----------------------------------------------------------------------- 
   Footer
 ------------------------------------------------------------------------ */

#footer {
color:			#90a5a9;
width:			100%;
font-size:		11px; 
line-height:	16px;
background: 	#023647 url(gfx/bg_footer.gif) top repeat-x;
text-shadow:	0 0 0 #333;
} 

#footer p { margin-bottom: 10px; }

#breadcrumbs {
width: 			920px;
height:			36px;
font: 			11px Arial;	 
margin: 		0 auto 0 auto;
}

#breadcrumbs p {  padding: 12px 0 12px 0px; }

.breadcrumbs-next {
background: 	url(gfx/breadcrumbs_divider.gif) no-repeat;
padding: 		12px 0 12px 25px;
margin-left:	10px;
height:			30px;
}

#copyright {
width: 			920px;
font: 			11px Arial;
padding:		0px 10px 6px 10px;	 
margin: 		0 auto 0 auto;
}

#copyright a { font-weight: normal; }

.footer-rule { border-top: 1px solid #1c4a5a; margin-bottom: 15px; }

#footer a { color: #fff; text-shadow: 0 0 0 #333; }

a.logo-footer { background: url(gfx/icon_logo_footer.gif) 0 50% no-repeat; padding: 12px 0 12px 20px; height: 30px;}

#footer-content { width: 940px; margin: 0 auto 10px auto; }

#footer-content a { font-weight: normal; }

#footer-content h4 { color: #39c; font-size: 12px; letter-spacing: 1px; margin-bottom: 10px; }

#footer-content ul {
list-style: 	none;
margin: 0; 
padding: 0;
}

#footer-content li {
margin-bottom: 	8px; 
}

#footer-content ul.blog li {
padding-bottom:	8px;
margin-bottom: 	8px;
border-bottom:  1px dotted #1c4a5a; 
}

.footer-col {
float:			left;
width:			160px;
padding: 		0 10px 0 10px;
margin-right:	10px;
}

.footer-col-last {
float:			left;
width:			160px;
padding: 		0 10px 0 10px;
}

.dotted-rule {
width:			160px; 
border-bottom:  1px dotted #1c4a5a; 
}


.xs { font-size: 10px; }
.s { font-size: 11px; }
.m { font-size: 12px; }
.l { font-size: 13px; }
.xl { font-size: 14px; }

/*----------------------------------------------------------------------- 
   Navigation
 ------------------------------------------------------------------------ */
 
 .navigation {
     margin-top: 25px;
     margin-left: 65px;
 }

/* Concept Series */
.col-span-four {
float:			left;
width:			360px;
}

.col-span-five {
float:			left;
width:			450px;
margin-top: 20px;
}

.col-span-ten {
float:			left;
width:			900px;
padding:		0 10px 0 10px;
margin:			0 10px 0 10px;
}

.video{
background-color: #EEE;
padding: 50px;
padding-left: 75px;
}

.movie {
  padding-bottom:30px;
}