/* 
========================================================================
Filename:		ljf.css
Date Created:	2009-08-04
Description:	CSS stylesheet for London Jazz Festival microsite
Site:			http://www.serious.org.uk/
Author:			Derek S. Henderson
========================================================================
*/

@media all {
	
	/* general layout */
	body {
		background:#fff;
	}
	#page-wrapper {
		background: #E6E7E7 url('/i/ljf/bg_subs.gif') top center no-repeat;
	}
	#page-wrapper:after {
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}

	/* banner styles */
	#banner h1 {
		background: transparent url('/i/ljf/h1-ljf.png') top left no-repeat;
		text-indent: -999em;
		float: left;
		width: 546px;
		height: 205px;
		margin-right: 93px;
		overflow: hidden;
	}
	#banner {
		float: none;
	}
	#banner ul {
		width: 400px;
		margin-top: 0;
		position: absolute;
		top: 80px;
		left: 620px;
	}
	#banner li {
		list-style-image: none;
		float: left;
		width: 190px;
		margin: 0 9px 7px 0;
	}
	#banner li a {
		background: #E6E7E7;
		padding: 0 4px;
	}
	#banner li.current a {
		background: #297B6E;
		color: #fff;
	}
	/*
	#banner form {
		float: none;
		width: 504px;
		height: 35px;
		padding-left: 130px;
		background: #d4d3cb url('/i/ljf/logo-serious-small.gif') 14px 8px no-repeat;
		position: absolute;
		top: 0;
		right: 0;
	}
	*/
	#banner form {
		float: none;
		width: 584px;
		height: 40px;
		padding-left: 10px;
		background-color: #CFD1D1;
		background-image: none;
		position: absolute;
		top: 0;
		right: 0px;
	}
	#banner fieldset {
		line-height: 35px;
		padding-left: 0;
		position: relative;
		top: -2px;
	}
	#banner label {
		color: #000;
		font-weight: bold;
		width: auto;
		overflow: auto;
	}
	#banner input#search-input {
		width: 201px;
		height: 18px;
		background: transparent url('/i/ljf/bg-text-input.gif') center left no-repeat;
	}
	#banner input#submit {
		background-image: url('/i/ljf/btn-submit-arrow.gif');
	}
	#banner p {
		float: left;
		background: none;
		padding-left: 0;
		margin-right: 20px;
		margin-top: 10px;
	}
	#banner p a {
		color: #000;
		background-position: center left;
		padding: 0 0 0 20px;
	}
	.crumbtrail {
		background:	transparent url('/i/ljf/bg-crumbtrail.png') bottom right no-repeat;
		width:	950px;
		height:	46px;
		margin:	30px 0px 0;
		padding: 25px 0 0 30px;
	}
	.crumbtrail p {
		float: left;
		background: none;
		padding-left: 0;
		margin-right: 20px;
	}
	.crumbtrail p a {
		color: #000;
		background-position: center left;
		padding: 0 0 0 20px;
	}
	.crumbtrail li {
		font-size: 1.5em;
		width: auto;
	}
	.crumbtrail li a {
		background: none;
	}
	.crumbtrail p.last-updated {
		color: #fff;
		line-height: 40px;
		margin: 0 0 0 15px;
		padding: 0;
	}
	.crumbtrail p.rss {
		float: right;
		font-size: 1.8em;
		line-height: 40px;
		margin: 0 20px 0 0;
		padding: 0;
	}
	.crumbtrail p.rss a img {
		vertical-align: text-bottom;
	}
	.crumbtrail p a {
		background: none;
		color: #fff;
	}
	
	/* footer styles */
	#footer li ul {
		padding-right: 70px;
	}
	.sponsors {
		float: left;
		margin: 0px 0 30px 0;
		padding: 0px 30px;
		/*display: none;*/
	}
	
	/* content styles */
	h2 {
		font-family: "Arial Black", Arial, sans-serif;
		font-weight: normal;
	}
	h2 img {
		vertical-align: text-bottom;
	}
	.column-full {
		background: #fff;
		margin: 0 0 30px -30px;
		width: 920px;
		padding: 15px 30px;
	}
	.column-wide {
		background: #fff;
		margin: 0 0 30px -30px;
		padding-left: 30px;
		min-height: 500px;
	}
	.column-full h2 {
		font-size: 1.8em;
		text-transform: uppercase;
	}
	.column-full .column-wide {
		margin: 0 -30px 30px 0;
		padding: 0 30px 0 15px;
	}
	.column-full .column-wide h2 {
		font-size: 1.5em;
		text-transform: none;
	}
	.column-full ul.sitemap {
		list-style-type: disc;
		color: #333;
		margin: 0 0 15px 20px;
		padding: 0;
	}
	.column-full ul.sitemap ul {
		list-style-type: disc;
		color: #333;
		margin: 15px 0 15px 30px;
		padding: 0;
	}
	.column-full ul.sitemap li {
		margin-bottom: 10px;
	}
	
	.column-full ul.sitemap a {
		font-size:1.4em;
		color: #0075cf;
	}
	.no-events {
		height: 400px;
		padding-top: 20px;
	}
	.column-narrow {
		padding-left: 15px;
		padding-top: 5px;
	}
	.column-narrow .module {
		width: 225px;
	}
	.column-narrow .module h2 {
		font-size: 2.2em;
		font-family: "Arial Black", Arial, sans-serif;
	}
	.column-inner-narrow div h2 {
		text-transform: uppercase;
		letter-spacing: -2px;
	}
	.column-inner-narrow div.sponsorlist ul li {
		margin-bottom: 20px;
	}
	.column-alignment-wrapper {
		margin-bottom: 0;
	}
	.column-nav {
		background: #fff;
		margin: 0 0 30px -30px;
		padding-left: 30px;
	}
	#home .column-wide {
		margin-top: 43px;
		padding-top: 80px;
		position: relative;
	}
	#home .column-narrow {
		padding-top: 143px;
	}
	
	/* module styles */
	.column-narrow .module-top-wrapper,
	.column-wide .module-top-wrapper,
	.column-narrow .module-bottom-wrapper,
	.column-wide .module-bottom-wrapper {
		background: none;
	}
	.module {
		position: relative;
		border: none;
		z-index: 10;
	}
	
	/* page nav styles */
	.module-top-wrapper {
		padding: 0;
	}
	.page-nav .module-bottom-wrapper {
		background: #fff url('/i/ljf/bg-nav.gif') bottom left no-repeat;
	}
	.page-nav .module {
		width: 208px;
		border: 1px solid #ccc;
		border-bottom: none;
		margin-bottom: 15px;
	}
	.page-nav li {
		background: none;
	}
	
	/* event search styles */
	.event-search fieldset {
		background: none;
		border-bottom: 1px dotted #999;
	}
	fieldset.narrow {
		border-bottom: none;
		margin: 0;
		padding: 0;
	}
	.or {
		background-image: url('/i/ljf/bg-or.gif');
		color: #333;
	}
	
	/* events links styles */
	.events-links li {
		padding: 15px 15px 15px 0;
		margin-right: 0;
		background: none;
		border-bottom: 1px dotted #999;
	}
	.events-links li.last {
		border-bottom: none;
	}
	.events-links li a {
		color: #333;
		background: none;
		padding: 0 4px 0 0;
	}
	.events-links li a.see-all {
		display: inline;
		background: #E6E7E7;
	}
	.events-links li a span {
		color: #000;
		font-size: 1.15em;
		margin: 4px 0;
	}
	.events-links li a span span {
		display: inline;
		background: #fff;
		font-size: 1em;
		margin: 0;
		padding: 0 2px;
	}
	.events-links li a:hover span span {
		text-decoration: underline;
	}
	.column-inner-narrow .events-links li a span span {
		background: #E6E7E7;
	}
	
	/* hero styles */
	.hero {
		margin-top: 0px;
	}
	#home .hero {
		margin-bottom: -100px;
		height: 320px;
	}
	.hero h2 {
		font-family: Arial, sans-serif;
		line-height: 23px;
		width: 600px;
	}
	 .home h2 {
		margin-top: 10px;
	}
	.hero div {
		background: transparent url('/i/ljf/bg-hero.png') top left;
		position: relative;
		/*top: -68px;*/
		top: -25px;
		margin: 0 -30px;
		height: 75px;
		z-index: 5;
	}
	.column-wide .hero div {
		background: #297B6E;
		position: static;
		height: 45px;
		margin: 0;
	}
	.hero div p.details, 
	.hero div ul {
		margin-top: 10px;
		margin-left: 30px;
	}
	.hero div .image-toggle li {
		list-style-image: none;
		float: left;
		margin-right: 5px;
		width: 23px;
		height: 23px;
		line-height: 23px;
		font-weight: bold;
		text-align: center;
		border: 1px solid #fff;
		background: #fff;
	}
	.hero div .image-toggle li.current {
		background: #297B6E;
	}
	.hero div .image-toggle li a {
		color: #297B6E;
		display: block;
	}
	.hero div .image-toggle li.current a {
		color: #fff;
	}
	.hero .home {
		width: 160px;
	}
	.image-wrapper {
		position: relative;
		display: block;
	}
	.blog-post .image-wrapper {
		margin-bottom: 15px;
	}
	.home .hero .image-wrapper {
		width: 920px;
		margin-bottom: 0px;
	}
	.image-wrapper .image-caption {
		position: absolute;
		bottom: 0px;
		right: 0;
		padding: 5px;
		background: transparent url('/i/bg-image-caption.png') repeat;
		font-size: 1.3em;
		font-weight: normal;
		color: #fff;
	}
	#home .hero .image-wrapper .image-caption {
		bottom: 65px;
	}
	
	/* featured event styles */
	.featured-event a {
		background: #297B6E;
		line-height: 1.5;
	}
	.featured-event a span {
		display: inline;
		background: #fff;
		color: #297B6E;
	}
	.featured-event a:hover span {
		text-decoration: underline;
	}
	
	/* featured links styles */
	.featured-links {
		float: left;
		width: 920px;
		margin: 15px 0;
	}
	.featured-links li {
		font-size: 2.2em;
		font-family: "Arial Black", Arial, sans-serif;
		position: relative;
	}
	.featured-links img {
		width: 300px;
		height: 157px;
	}
	.featured-links a {
		width: 200px;
		height: 135px;
		padding: 11px 100px 11px 0;
		background: none;
		color: #000;
		position: absolute;
		top: 0;
		left: 0;
	}
	.featured-links a.image {
		width: 300px;
		height: 157px;
		padding: 0;
		margin: 0;
		background: none;
		color: #000;
		position: relative;
	}
	.featured-links a span {
		font-size: 1em;
		font-weight: normal;
		display: inline;
		text-transform: uppercase;
		background: #E6E7E7;
		font-family: "Arial Black", Arial, sans-serif;
	}
	
	/* recommendations styles */
	.column-inner-wide .recommendations h2 {
		background: none;
		font-size: 1.6em;
		text-transform: uppercase;
	}
	
	/* partners styles */
	.partners {
		padding-top: 15px;
	}
	.partners h2 {
		text-transform: uppercase;
	}
	.partners .listings h3 {
		background: transparent url('/i/ljf/bg-h3-partner_listings.gif') top left no-repeat;
		width: 421px;
		height: 40px;
		line-height: 40px;
		margin-bottom: 10px;
		padding-left: 15px;
		text-transform: uppercase;
	}
	.partners .full {
		float: left;
		width: 530px;
	}
	.partners .listings div {
		padding: 0;
		height: auto;
		width: 421px;
	}
	.partners .listings div ul {
		clear: both;
		margin: 0;
	}
	.partners .listings div ul li {
		margin-left: 15px;
	}
	.partners .listings div.image_div {
		padding: 15px;
		margin-right: 15px;
		width: 190px;
	}
	
	/* special offers styles */
	.special-offers {
		padding-top: 15px;
	}
	.special-offers h2 {
		text-transform: uppercase;
	}
	.special-offers .listings h3 {
		background: transparent url('/i/ljf/bg-h3-listings.gif') top left no-repeat;
		width: 530px;
		height: 40px;
		line-height: 40px;
		margin-bottom: 10px;
		padding-left: 15px;
		text-transform: uppercase;
	}
	.special-offers .full {
		float: left;
		width: 530px;
	}
	.special-offers .listings div {
		padding: 0px 0px 0px 10px;
		height: auto;
		width: 520px;
	}
	.special-offers .listings div ul {
		clear: both;
		margin: 0;
	}
	.special-offers .listings div ul li {
		margin-left: 15px;
	}
	.special-offers .full_spo {
		float: left; 
		width: 530px;
		margin: 0px;
		padding: 0px;
	}
	.special-offers .listings div.list_image {
		margin: 0px;
		padding: 0px;
		width: 100px;
		height: 100px;
	}
	
	/* venues styles */
	.venues {
		padding-top: 15px;
	}
	.venues h2 {
		text-transform: uppercase;
	}
	.venues .listings h3 {
		background: transparent url('/i/ljf/new-venue-background.jpg') top left no-repeat ;
		width: 921px;
		height: 40px;
		line-height: 40px;
		margin-bottom: 10px;
		padding-left: 15px;
		text-transform: uppercase;
	}
	.venues .address {
		float: left;
		clear: both;
		margin: 10px 0;
	}
	.venues .full {
		float: left;
		width: 530px;
	}
	.venues .listings div {
		padding: 0 0 5px;
		height: auto;
	}
	.venues .listings div ul {
		margin-left: 15px;
	}
	
	/* image gallery styles */
	.gallery p {
		width: 620px;
	}
	.gallery p a {
		background: transparent url('/i/li-arrow-grey.gif') center left no-repeat;
		padding-left: 20px;
		color: #333;
	}
	.gallery li {
		float: left;
		width: 150px;
		height: 170px;
		margin-right: 30px;
	}
	.gallery li img {
		width: 150px;
	}
	.gallery li p {
		width: 150px;
	}
	.gallery ul .last {
		clear: right;
	}
	.gallery ul div {
		height: 100px;
		overflow: hidden;
	}
	
	/* audio player styles */
	.player {
		font-weight: normal;
		font-size: 2.2em;
		font-family: "Arial Black", Arial, sans-serif;
	}
	
	/* pagination styles */
	.pagination {
		width: 630px;
	}
	.column-full .pagination {
		width: 910px;
	}
	.pagination h2 {
		font-size: 1.5em;
		font-family: Arial, sans-serif;
		text-transform: none;
	}
	.pagination .prev-page {
		left: 15px;
	}
	.pagination .next-page {
		right: 15px;
	}
	
	/* subscribe styles */
	.subscribe {
		margin-right: 15px;
	}
	
	/* spot styles */
	.spot {
		background: none;
		position: relative;
		margin-top: 15px;
		margin-left: 7px;
	}
	.spot img {
		height: 225px;
	}
	
	.spot div {
		position: absolute;
		left: 0;
		bottom: 20px;
	}
	.spot div span {
		float: left;
		background-color: #E6E7E7;
		padding: 0 2px 0 10px;
		margin-bottom: 15px;
		line-height: 1;
		font-family: "Arial Black", Arial, sans-serif;
		font-size: 2.2em;
		text-transform: uppercase;
		color: #000;
	}
	.spot div a {
		clear: left;
		display: inline-block;
		background: #E6E7E7;
		float: none;
		width: auto;
		height: auto;
		padding: 0 2px 0 10px;
		color: #000;
		font-size: 1.5em;
		font-weight: bold;
	}
	
	/* ljf network styles */
	.serious-network {
		border-color: #8b8a86;
		padding: 8px 0;
	}
	.serious-network h2 {
		background-image: url('/i/ljf/logo-ljf.gif');
		width: 102px;
		height: 44px;
	}
	.serious-network li {
		padding-top: 5px;
	}
	
	/* events listings styles */
	.listings h2 {
		background-image: url('/i/ljf/bg-h2-listings.gif');
	}
	
	/* tell-a-friend styles */
	.confirmation {
		background-image: url('/i/ljf/bg-confirmation.gif');
		margin-top: 15px;
	}
	.tell-a-friend #send-mssg {
		float: none;
	}
	
	/* blog styles */
	.blog-post {
		width: 665px;
	}
	.blog-post div {
		width: 650px;
	}
	.blog-post ul {
		list-style-type: disc;
		font-size: 1.3em;
		color: #333;
		margin: 0 0 15px 15px;
		padding: 0;
	}
	/* blog links styles */
	.blog-links {
		padding-top: 15px;
	}
	.blog-links li {
		background: none;
		border-top: 1px dotted #999;
		padding: 15px 35px 15px 15px;
		font-weight: bold;
	}
	.blog-links li a {
		display: inline;
		padding: 0 4px 0 0;
		background: #fff;
	}
	
	/* search results styles */
	.search-results-nav {
		float: left;
		width: 950px;
		height: 52px;
		margin: 0 -15px;
		background: none;
		border-bottom: 1px solid #ccc;
	}
	.search-results-nav li {
		float: left;
		width: 230px;
		height: 22px;
		margin-right: 1px;
		padding: 15px;
		background: #f1f0ec;
		border: none;
		font-size: 1.8em;
		font-weight: bold;
		color: #333;
	}
	.search-results-nav li.current {
		background: #fff;
		border: 1px solid #ccc;
		border-bottom: none;
	}
	.search-results-nav li a {
		color: #333;
	}
	.search-results-wrapper {
		float: left;
		width: 950px;
		margin: 0 -15px;
		background: none;
		border-bottom: 1px solid #ccc;
	}
	.search-results-wrapper .listings {
		border: 1px solid #ccc;
		border-top: none;
		float: left;
		width: 918px;
		padding: 15px 15px 0 15px;
	}
	.search-results-wrapper .listings li {
		margin: 0 -15px 15px;
		padding: 0 15px 15px;
		width: 888px;
	}
	.search-results-wrapper .listings div li {
		margin: 0;
		padding: 0;
		width: auto;
	}
	.search-results-wrapper .pagination {
		border: 1px solid #ccc;
		border-top: none;
		border-bottom: none;
		width: 918px;
		padding: 15px;
		margin-bottom: 0;
	}
	.search-results-wrapper .pagination .prev-page {
		left: 15px;
	}
	.search-results-wrapper .pagination .next-page {
		right: 15px;
	}
	.search-results-wrapper .listings h2, .search h2 {
		text-indent: -999em;
		width: 0;
		height: 0;
		margin: 0;
		float: none;
	}
	.search-results-wrapper .listings h3 {
		background: none;
		padding: 0;
	}
	.search-results-wrapper .events h3 {
		margin-bottom: 15px;
	}
	.search-results-wrapper .listings h4 {
		font-size: 1.8em;
		margin-bottom: 0;
		color: #000;
	}
	/* search-results search styles */
	.search-results-wrapper form {
		width: 918px;
	}
	.search-results-wrapper form #venue_id {
		width: 190px;
	}
	.event-search form #venue_id {
		width: 175px;
	}
	.events-filter {
		background: #E6E7E7;
	}
	.search fieldset {
		margin-right: 15px;
		width: auto;
	}
	.search fieldset.keywords {
		background: #E6E7E7;
	}
	.search .submit-events {
		right: 0px;
		padding-right: 0px;
	}
	.search #event-type {
		width: 155px;
	}
	ul.events-links {
		margin-top: 45px;
	}
	.column-wide .hero h2.detail {
		width: 600px;
		margin-top: 0;
	}
	.column-narrow .event-search form span {
		display: block;
		clear: both;
	}
	
	label.narrow {
		float: left;
		display: inline;
		width: 80px;
		font-weight: normal;
		padding: 2px 0px 5px 0px;
	}
	.column-narrow .event-search form input.narrow,
	.column-narrow .event-search form select.narrow,
	.column-narrow .event-search form #search_q,
	.column-narrow .event-search form #venue_id {
		float: left;
		width: 138px;
		height: 18px;
		font-size: 1.2em;
	}
	.column-narrow .event-search form select.narrow,
	.column-narrow .event-search form #venue_id {
		width: 145px;
		height: 23px;
	}
	.events-filter h3 {
		font-weight: bold;
		font-size: 1.2em;
		color: #333;
		margin: 5px 15px 10px 15px;
	}
	.events-filter h3 a {
		background: transparent url(/i/arrow-black-down.png) center right no-repeat;
		padding-right: 14px;
		color: #333;
	}
	.active h3 a {
		background-image: url(/i/arrow-black-up.png);
	}
	.events-filter fieldset {
		padding-top: 0;
	}
	#banner li.download_link a {
		background-color: #EECC50;
	}
	.intro ul {
		list-style-type: disc;
		font-size: 1.3em;
		color: #333;
		margin: 0 0 15px 15px;
		padding: 0;
	}
}

@media print {
	
	body {
		background: #fff;
		font-family: Times New Roman, serif;
	}
	#languages-toolbar {
		display: none;
	}
	#main-navigation {
		display: none;
	}
	#header {
		background: none;
		height: 103px;
	}
	h1 {
		top: 0;
		left: 0;
	}
	#content {
		background: #fff;
		color: #333;
	}
	#content h2, #content h3 {
		color: #333;
	}
	#content p.intro {
		color: #000;
	}
	#content p.skip {
		display: none;
	}
	#content p.top {
		display: none;
	}
	#content a, 
	#footer a {
		color: #c33;
		border-bottom: 1px solid #c33;
	}
	#footer {
		background: #fff;
		color: #333;
	}
	
}