/***
	O2 blueroom v4
	EVENTS
	www.aislondon.com (2008)

	-[Inherits]------------------------
	Base.css > Generic.css
	-----------------------------------

	-[Contents]------------------------
	1. Overrides
		1.1 Classes
	2. EVENT SPECIFIC
	3. MAIN EVENT IMAGE
		3.1 List
		3.2 Tabbed buttons
	4. MEDIA PANEL
		4.1 Dates avaliable
		4.2 Ticket info
		4.3 Bookmarks
	5. PURCHASE PANEL
		5.1 Instructions
			5.1.1 Bullet points
		5.2 Small print
	6. PERKS BRANDING
		6.1	Different headers
		6.2 Different neon text
		6.3 Perks download button
		6.4 Backgrounds for the div#perks ul li's
		6.5 Perks footer
			6.5.1	Different footer images
	-----------------------------------
 
***/


/**
	1. Overrides
*/

.outer-content em {
	font-style: normal;
	font-weight: normal;
	text-transform: uppercase;
}

.outer-content h1, .outer-content p#tagline {
	width: 465px;		
}
 
.outer-content h3,
.outer-content h4 {
	font-size: 1.4em;
	font-weight: bold;
}

.outer-content h5,
.outer-content h6 {
	color: #155aa0;
	font-size: 1.2em;
	font-weight: normal;
}

.outer-content p {
	font-size: 1.2em;
	margin: 0 0 1em 0;
}

.outer-content strong {
	font-weight: bold;
	font-style: normal;
}

/**
	1.1 Classes
*/

.top-section {
	min-height: 5.6em; _height: 5.6em;
}

/**
	2. Event specific
*/

/*
.outer-content {
	margin-bottom: 0; over-rides standard .outer-content behaviour for event pages
}
*/

/**
	3. Main event image
*/

/**
	3.1 List
*/

div#event-headlines {
	float: left;
	margin: 0 12px 0 0;
	width: 439px;
}

div#event-image {
	background: #e5e5e5;
	overflow: hidden;
}

div#event-image ul {
	background: #e6e6e6 url(../../../Generic/Images/Panels/Event/bg-event-image-ul.jpg) no-repeat top left;
	display: block;
	list-style-type: none;
	min-height: 3.1em; _height: 3.1em;
	overflow: hidden;
	padding: 0.2em 0 0 20px;
}

div#event-image ul li {
	display: block;
	float: left;
	margin: 0 8px 0 0;
	overflow: hidden; /*Clears div#button*/
}

*+html div#event-image ul li {
	overflow: visible; /*IE7 chops off bit */
}

div#event-image ul li.last {
	margin: 0;
}

div#event-image ul li a {
	height: 1.5em;
}

/**
	3.2 Tabbed buttons
*/

div#event-image .button {
	float: left;
}

div#event-image .button span {
    border-top: 0.1em solid #c4c4c4; border-right: 0.1em solid #c4c4c4; border-bottom: 0; border-left: 0.1em solid #c4c4c4;     
	/* CSS 3*/ border-top-left-radius: 0.5em; border-top-right-radius: 0.5em; border-bottom-left-radius: 0; border-bottom-right-radius: 0; 
    /* Webkit */ -webkit-border-radius: 0.5em; -webkit-border-top-right-radius: 0.5em; -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0;
	/* Moz */ -moz-border-radius-topleft: 0.5em; -moz-border-radius-topright: 0.5em; -moz-border-radius-bottomleft: 0em; -moz-border-radius-bottomright: 0em;    
	display: block;    
    text-align:center; 
}

div#event-image .button span.primary {
    color: #fff;
}
  
div#event-image .button span span {
    border-top: 0.1em solid #fff; border-right: 0.1em solid #fff; border-bottom: 0; border-left: 0.1em solid #fff; 
    /* CSS 3*/ border-top-left-radius: 0.4em; border-top-right-radius: 0.4em; border-bottom-left-radius: 0; border-bottom-right-radius: 0; 
    /* Webkit */ -webkit-border-radius: 0.4em; -webkit-border-top-right-radius: 0.4em; -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0;
    /* Moz */ -moz-border-radius-topleft: 0.4em; -moz-border-radius-topright: 0.4em; -moz-border-radius-bottomleft: 0em; -moz-border-radius-bottomright: 0em;    
	display: block;    
}

div#event-image .button span span span {
    background: #d4d3d3 url(../../../Generic/Images/Buttons/Submit/buttongrad3.gif) repeat-x 0 -1px;
    border-top: 0.1em solid #63d5f5; border-right: 0.1em solid #63d5f5; border-bottom: 0; border-left: 0.1em solid #63d5f5;
	/* CSS 3*/ border-top-left-radius: 0.3em; border-top-right-radius: 0.3em; border-bottom-left-radius: 0; border-bottom-right-radius: 0; 
    /* Webkit */ -webkit-border-radius: 0.3em; -webkit-border-top-right-radius: 0.3em; -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0;
	/* Moz */ -moz-border-radius-topleft: 0.3em; -moz-border-radius-topright: 0.3em; -moz-border-radius-bottomleft: 0em; -moz-border-radius-bottomright: 0em;    
	display: block;
    padding: 0;
    position: inherit;
}

div#event-image .button span.primary {
	border:0.1em solid #065ba6; 
}

div#event-image .button span.primary span {
    border: 0.1em solid #61d8ff;
}

div#event-image .button span.primary span span {
    border: 0.1em solid transparent;
    background-image: url(../../../Generic/Images/Buttons/Submit/buttongradblue.gif);
    background-color: #0274be;
}

div#event-image .button input,
div#event-image .button a {
    background-color: transparent;
    /* CSS 3 */ border-radius: 0.5em;
    /* Webkit */ -webkit-border-radius: 0.5em;
    /* Moz */ -moz-border-radius: 0.5em;
    color: #155aa0;
    cursor:pointer;
    display: block; 
    font-size: 1em;
    padding: 0.4em 1em; 
    text-decoration: none;
    white-space: nowrap; 
}

div#event-image .button input:active,
div#event-image .button a:active {
    padding: 0.4em 1em; 	
}

div#event-image .button span.primary input,
div#event-image .button span.primary a {
    color: #fff;
}
* html div#event-image .button input,
* html div#event-image .button a {
    width: 1%;
    overflow: visible;
}
*+html div#event-image .button input,
*+html div#event-image .button a {
    width: 1%;
    overflow: visible;
}
div#download .button span, 
div#follow-on-actions .button span {
    border: 0.1em solid #c4c4c4;  
	/* CSS 3*/ border-radius: 0.5em;
    /* Webkit */ -webkit-border-radius: 0.5em;
	/* Moz */ -moz-border-radius: 0.5em;
	display: block;    
    text-align:center; 
}

div#download .button span span, 
div#follow-on-actions .button span span {
    border: 0.1em solid #fff;
    /* CSS 3*/ border-radius: 0.4em;
    /* Webkit */ -webkit-border-radius: 0.4em;
    /* Moz */ -moz-border-radius: 0.4em;
	display: block;    
}

div#download .button span span span, 
div#follow-on-actions .button span span span {
    background: #d4d3d3 url(../../../Generic/Images/Buttons/Submit/buttongrad3.gif) repeat-x 0 -1px;
    border: 0.1em solid #63d5f5;
	/* CSS 3*/ border-radius: 0.3em;
    /* Webkit */ -webkit-border-radius: 0.3em;
	/* Moz */ -moz-border-radius: 0.3em;
	display: block;
    padding: 0;
    position: inherit;
}


/**
	4. MEDIA PANEL
*/

div#media {
	float: left;
	/* margin: 0 12px 6px 0;  shouldn't be here with together with padding MT */
	overflow: hidden; _zoom: 1;
	width: 447px; /*459-12*/
	padding: 6px;
}

div#media p {
	margin-right: 6px;
}

/**
	4.1 Dates available
*/

div#dates-available {
	background: url(../../../Generic/Images/bg-line.gif) repeat-x bottom;
	margin: 6px 0;
	padding: 0 0 6px;
	overflow: hidden;
}

div#dates-available h3 {
	float: left;
	font-size: 1.2em;
	margin: 0 4px 0 6px;
}

div#dates-available p {
	float: left;
	margin: 0 0 0 6px;
}


/**
	4.2 Ticket info
*/

div#ticket-info {
	float: right;
	width: 453px;
}

/**
	MB: il have to sort this markup now, its all gone pete tong since amends
*/

div#ticket-info h2 {
	margin: 18px 0 12px 6px;
	padding: 0;
	font-size: 1.4em;
	font-weight: bold;
}

div#ticket-info h3 {
	padding: 0;
}

div#ticket-info p {
	margin: 0 6px 0.8em;
}

/**
	4.3 Bookmarks
*/

#event-bookmark {
	float: right;	
	height: 18px;
	list-style-type: none;
	margin: 0;
	overflow: hidden;
}

#event-bookmark li {
    float: left;                
}

#event-bookmark li a {
	display: block;
	margin: 1px 4px 0 2px;	
	width: 16px;
}

#event-bookmark li a span {
	display: block;
	text-indent: -99999px;
}

#event-bookmark li #bm-facebook {
	background: url(../../../Generic/Images/Icons/facebook.gif) no-repeat center left;
	width: 14px;
}

#event-bookmark li #bm-delicious {
	width: 14px;
	background: url(../../../Generic/Images/Icons/delicious.gif) no-repeat center left;
}
#event-bookmark li #bm-myspace {
	background: url(../../../Generic/Images/Icons/myspace.gif) no-repeat center left;
}
#event-bookmark li #bm-digg {
	background: url(../../../Generic/Images/Icons/digg.gif) no-repeat center left;
}
#event-bookmark li a.rss-feed-link{
    padding: 0px;
    display: block;
    height: 16px;
    background: url(../../../Generic/Images/Icons/rss-orange-16.jpg) 0 0px no-repeat;
}

#event-bookmark li a.send-to-friend{
    background: url(../../../Generic/Images/Icons/sendFriendIcon.gif) 0 0px no-repeat;
    height: 16px;
}

/**
	5. Purchase / sold out panel
*/

#ticket-info #purchase {
	margin: 0 0 1em 0;
}

#ticket-info #sold-out {
	margin: 6px 0 1em 0;
}

#ticket-info #purchase {
	padding: 24px;
	width: 399px;
}

#ticket-info #sold-out {
	background-image: url(../../../Generic/Images/Icons/grey-priority.jpg);
	background-position: 17px 26px;
	background-repeat: no-repeat;
	margin-bottom: 2.2em;
	padding: 24px 24px 24px 85px;
	width: 339px;	
}

#ticket-info #sold-out h3 {
	margin: 0 0 0.6em 0;
}

#ticket-info #purchase p,
#ticket-info #sold-out p {
	font-size: 1.2em;
	margin: 0;
}

#ticket-info #sold-out p.last {
	padding: 0;
}

#ticket-info #purchase ul,
#ticket-info #sold-out ul {
	margin: 0;
}

#ticket-info #small-print {
	margin-bottom: 0.8em;
}

/**
	5.1 Buy tickets online section
	
	MB: This is gonna like the panel section but without the white,
	likely to shift after 2nd client meeting today
*/

div#buy-tickets-online {
	background-image: url(../Images/ico-mouse-grey.jpg);
	background-position: 28px 4px;
	background-repeat: no-repeat;
	margin: 0 0 3.5em 0;
	padding: 0 0 0 85px;	
}

div#buy-tickets-online p {
	margin: 0;
	padding: 0;	
}


/**
	5.1 Instructions
*/

div#purchase ul {
	overflow: hidden;
	list-style-type: none;
}

div#purchase ul li {
	display: block;
	float: left;
	font-size: 1em;
	list-style-type: none;
	min-height: 5.3em;
	padding: 0 0 0 63px;
	width: 315px;
}

div#purchase ul li#online {
	background-image: url(../Images/ico-mouse.jpg);
	background-position: 10px 5px;
	background-repeat: no-repeat;

}

div#purchase ul li#offline {
	background-image: url(../Images/ico-phone.jpg);
	background-position: 10px 5px;
	background-repeat: no-repeat;
	_height: 55px;
}

div#purchase ul li#online p {
	padding: 0 0 0.6em 0;
}

/**
	5.1.1 Bullet points
*/

div#purchase ul li#online h3 {
	margin-left: 0;
}

div#purchase ul li#online ol {
	margin: 0;
	overflow: hidden;
	padding: 0 0 0.6em 0;
	width: 330px;
}

div#purchase ul li#online ol li {
	
	display: block;
	font-size: 1.2em;
	min-height: 0; /* over-riding limit set for online/offine purchasing */
	padding: 0 0 6px 12px;
	_width: 300px;
}

/**
	5.2 Small print
*/

div#small-print p {
	font-size: 1.1em;
}

div#small-print p#asterisks {
	margin: 0.6em 0 0;
	overflow: hidden; _zoom: 1;
}

div#small-print p#asterisks span#rates {
	float: left;
	margin: 0 0 0 6px;
}

div#small-print p#asterisks span#terms {
	float: right;
	margin: 0 6px 0 0;	
}

/**
	6. Perks branding
*/

div#perks {
	clear: both; /*MB: Clears the two floated elements above, ensures perks has full width*/
	padding: 0 6px;
}

div#perks ul {
	margin-left: 0;
}

div#perks-branding {
	/* CSS 3*/ border-radius: 0.5em;
    /* Webkit */ -webkit-border-radius: 0.5em;
	/* Moz */ -moz-border-radius: 0.5em;
	height: 112px;
	margin: 6px 0 0.6em 0;
	position: relative;
}



/**
	6.1 Different headers
*/

div.diva-header {
	background: #FFF url(../Images/bg-diva.jpg) no-repeat top center;
}

div.rock-header {
	background: #FFF url(../Images/bg-rock.jpg) no-repeat top center;
}

div.eighties-header {
	background: #FFF url(../Images/bg-eighties.jpg) no-repeat top center;
}

div.fanzone-header {
	background: #FFF url(../Images/bg-fanzone.jpg) no-repeat top center;
}

div.family-header {
	background: #FFF url(../Images/bg-family.jpg) no-repeat top center;
}

div.pop-header {
	background: #FFF url(../Images/bg-pop.jpg) no-repeat top center;
}

div.sofa-header {
	background: #FFF url(../Images/bg-sofa.jpg) no-repeat top center;
}

div.legends-header {
	background: #FFF url(../Images/bg-legends.jpg) no-repeat top center;
}

div.comedy-header {
	background: #FFF url(../Images/bg-comedy.jpg) no-repeat top center;
}

div.urban-header {
	background: #FFF url(../Images/bg-urban.jpg) no-repeat top center;
}


div#perks-branding h2 {
	color: #FFF;
	font-size: 1.6em;
	font-weight: normal;
	margin: 0;
	position: absolute; bottom: 12px; left: 12px;
}

/**
	6.2 Different neon text
*/

div#perks-branding h2 span {
	display: block;
	text-indent: -9999px;
}

div.diva-header h2 span {
	background: url(../Images/diva.png) no-repeat top center;
	height: 97px;
	position: absolute; left: 120px; bottom: -14px;
	width: 182px;	
}

div.rock-header h2 span {
	background: url(../Images/rock.png) no-repeat top center;
	height: 112px;
	position: absolute; left: 110px; bottom: -14px;
	width: 214px;	
}

div.eighties-header h2 span {
	background: url(../Images/eighties.png) no-repeat top center;
	height: 122px;
	position: absolute; left: 130px; bottom: -20px;
	width: 172px;	
}

div.fanzone-header h2 span {
	background: url(../Images/fanzone.png) no-repeat top center;
	height: 100px;
	position: absolute; left: 139px; bottom: -14px;
	width: 218px;	
}

div.family-header h2 span {
	background: url(../Images/family.png) no-repeat top center;
	height: 127px;
	position: absolute; left: 133px; bottom: -24px;
	width: 186px;	
}

div.pop-header h2 span {
	background: url(../Images/pop.png) no-repeat top center;
	height: 108px;
	position: absolute; left: 142px; bottom: -15px;
	width: 192px;	
}

div.sofa-header h2 span {
	background: url(../Images/sofa.png) no-repeat top center;
	height: 123px;
	position: absolute; left: 100px; bottom: -20px;
	width: 215px;	
}

div.legends-header h2 span {
	background: url(../Images/legends.png) no-repeat top center;
	height: 117px;
	position: absolute; left: 110px; bottom: -18px;
	width: 210px;	
}

div.comedy-header h2 span {
	background: url(../Images/comedy.png) no-repeat top center;
	height: 88px;
	position: absolute; left: 83px; bottom: -12px;
	width: 216px;	
}

div.urban-header h2 span {
	background: url(../Images/urban.png) no-repeat top center;
	height: 88px;
	position: absolute; left: 83px; bottom: -12px;
	width: 216px;	
}

/**
	6.3 Download button
*/

div#perks-branding div#download {
	min-height: 24px; _height: 24px;
	overflow: hidden; _zoom: 1;
	position: absolute; bottom: 6px; right: 16px;
}

div#perks-branding div#download p {
	float: left;
	font-size: 1.1em;
	margin: 0;
	padding: 0;
}

div#perks-branding div#download p a {
	background: url(../../../Generic/Images/Buttons/btn-pdf.gif) no-repeat top right;
	color: #FFF;
	display: block; _width: 14em;
	min-height: 2.4em; _height: 24px;
	padding: 0 60px 0 0;
}

div#perks-branding div#download p a:hover {
	background: url(../../../Generic/Images/Buttons/btn-pdf-over.gif) no-repeat top right;
}

div#perks-branding div#download p a span {
	display: block;
	padding: 5px 0 0;
}


/**
	6.4 Backgrounds for the div#perks ul li's
*/

div#perks ul li {
	float: left;
	font-size: 1em;
	list-style-type: none;
	margin: 0 6px 0.3em 0;
	min-height: 90px; _height: 90px;
	padding: 0 0 0 103px;
	width: 350px;
	/* CSS 3*/ border-radius: 0.5em;
    /* Webkit */ -webkit-border-radius: 0.5em;
	/* Moz */ -moz-border-radius: 0.5em;	
}

div#perks ul li#perks-concept,
div#perks ul li#perks-lounge,
div#perks ul li#perks-blueroom-bar,
div#perks ul li#perks-chill {
	margin-right: 0;
}


div#perks ul li div {
	background: url(../Images/bg-perk.png) repeat-x bottom;
	min-height: 90px; _height: 90px;
	padding: 10px;
}

div#perks ul li div h3 {
	font-weight: normal;
	margin: 0 0 0.2em 0;	
}

div#perks ul li div p {
	font-size: 1.1em;
}

div#perks ul li div p.small-print {
	font-size: 1em;
	padding: 0;
}

div#perks ul li#perks-priority {
	background: url(../Images/ico-priority.jpg) no-repeat top left;
}

div#perks ul li#perks-fast-track {
	background: url(../Images/ico-fast-track.jpg) no-repeat top left;
}

div#perks ul li#perks-concept {
	background: url(../Images/ico-concept.jpg) no-repeat top left;
}

div#perks ul li#perks-blueroom-bar {
	background: url(../Images/ico-bar.jpg) no-repeat top left;
}

div#perks ul li#perks-angels {
	background: url(../Images/ico-angels.jpg) no-repeat top left;
}

div#perks ul li#perks-create {
	background: url(../Images/ico-create.jpg) no-repeat top left;
}

div#perks ul li#perks-lounge {
	background: url(../Images/ico-bar.jpg) no-repeat top left;
}

div#perks ul li#perks-chill {
	background: url(../Images/ico-chill.jpg) no-repeat top left;
}

div#perks ul li#perks-comedy {
	background: url(../Images/ico-comedy.jpg) no-repeat top left;
}

div#perks ul li#perks-urban {
	background: url(../Images/ico-urban.jpg) no-repeat top left;
}

/**
	6.5 footer
*/

div.perks-footer {
	z-index: 10;
}

/**
	6.5.1 Different footer images
	***This section has been removed after 2nd client review***

div.perks-footer.diva-footer {
	background: url(../Images/diva-footer.png) repeat-x bottom;
	height: 80px;
	position: absolute; bottom: 28px; right: 250px;	
	width: 93px;
}

div.perks-footer.rock-footer {
	background: url(../Images/rock-footer.png) repeat-x bottom;
	height: 114px;
	position: absolute; bottom: 28px; right: 260px;	
	width: 131px;	
}

div.perks-footer.sofa-footer {
	background: url(../Images/sofa-footer.png) repeat-x bottom;
	height: 149px;
	position: absolute; bottom: 9px; right: 243px;	
	width: 177px;	
}

div.perks-footer.eighties-footer {
	background: url(../Images/eighties-footer.png) repeat-x bottom;
	height: 97px;
	position: absolute; bottom: 28px; right: 250px;	
	width: 127px;	
}

div.perks-footer.pop-footer {
	background: url(../Images/pop-footer.png) repeat-x bottom;
	height: 73px;
	position: absolute; bottom: 23px; right: 255px;		
	width: 121px;	
}

*/

div#perks ul {
	display: block;
	margin: 0;
	padding: 0 0 0.3em 0; /*Now perks footers have been taken out */
	overflow: hidden; _zoom: 1;
}