/* 
	Document:				4.tickets.css
	Modified date: 			7 July 2009
	Created by:				Gemma Leigh, Poke
							www.pokelondon.com
	Deployment version:		Manchester City/css/4.tickets.css
	Notes:					Seat selection and ticket allocation
	-----------------------------------------------------------------
	Contents of this file:
	-----------------------------------------------------------------
	Whos' coming - allocate tickets
	Seat selection
	
	Tickets - Home
	Tickets - Away
	
*/

/* = Who's coming
-----------------------------------------------------------------------------*/

/* =Seat selection
-----------------------------------------------------------------------------*/
#seating-map{
	position: relative;
	float: left;
	width: 695px;
}

#seating-map h3.dblue-40{
	color: #101a24;
	font-size: 40px;
	line-height: 1em !important;
	font-weight: bold;
	position: absolute;
	left: 15px;
	top: -16px;
	z-index: 10000000;
	width: 150px;
}

#seating-aside{
	width: 265px;
	float: left;
	background: #5cbfeb;
	min-height: 520px;
	height: auto !important;
	height: 520px;
}

#seating-aside .game-info{
	width: 100%;
	overflow: hidden;
	background: #101a24;
	min-height: 90px;
	height: auto !important;
	height: 90px;
}

#seating-aside .game-date{
	width: 160px;
	float: left;
}

#seating-aside .game-date h4{ 
	color: #FFF;
	margin: 15px 0 0 15px;
}

#seating-aside .game-date p{
	font-size: 1.1em;
	color: #FFF;
	margin-left: 15px;
}

#seating-aside .game-info img{
	float: right;
	margin: 15px 10px 0px 0;
}

#seating-aside .ticket-options p{
	padding: 15px 0 15px 10px;
}
#seating-aside .ticket-options p.feedback{
	padding: 0 0 10px 0;
}

#seating-aside .tickets-flash,
#seating-aside .tickets-html{
	float: left;
	overflow: hidden;
	width: 245px;
	margin-left: 10px;
	display: inline; /* for ie6 */
	border-top: 1px solid #4f7284;
	padding: 10px 0 15px 0;
}

#seating-aside .tickets-flash p,
#seating-aside .tickets-html p{
	padding: 5px 0 10px 0px;
}

#seating-aside .tickets-html select{
	width: 245px;
	margin-bottom: 5px;
}

#seating-aside .tickets-html .btn{
	clear: both;
	margin-top: 10px;
}

#seating-aside a.highlight *  { 
	background-image: url(images/button-yellow-corners-6ac6ee.png); 
}

#seating-aside a.highlight.arw span em[class]{ 
	background: url(images/button-yellow-arrow-right.gif) center right no-repeat; 
	position: absolute; 
	right: -3px; 
	top:3px; 
	height: 9px; 
	width: 8px; 
	padding: 0 6px 0 0;
}

#seating-aside .ticket-options{
	background: #5cbfeb;
}

/* =Tickets - Home
-----------------------------------------------------------------------------*/
#tickets #content-main-feature .cmf-copy p.title {
	font-weight: bold;
}
#tickets #content-main-feature .cmf-copy p.info,
#tickets #content-main-feature .cmf-copy p.away-info{
	color: #6ac6ee;
	margin-bottom: 10px;
}
#tickets #content-main-feature .cmf-copy p.away-info{
	margin-bottom: 0px;
}

#tickets #content-main-feature .cmf-copy a.btn{
	margin-top: 0px;
}
#tickets #content-main-feature #competition-logo{
	position: absolute;
	right: 15px;
	bottom: 15px;
}

#tickets .content-main-links{
	width: 770px;
	margin-left: 15px;
}


/* Ticketing - Buy Game tickets */
#tickets .tickets-header{
	float: left;
	width: 100%;
	background: #37708c;
	clear: both;
	margin-bottom: 15px;
}

#tickets .col-fixtures,
#tickets .col-points,
#tickets .col-avail{
	float: left;
	width: auto;
}
#tickets .col h4{
	font-size: 18px;
	padding-top: 20px;
	margin-bottom: 6px;
}

#tickets .tickets-fixtures{
	background: #223344;
	width: 770px;
	margin-left: 15px;
}
#tickets .tickets-fixtures .col{
	background: #223344;
}

#tickets .tickets-fixtures .col-fixtures,
#tickets .tickets-fixtures .col-points,
#tickets .tickets-fixtures .col-avail{
	min-height: 90px;
	height: auto !important;
	height: 90px;
}
#tickets .col-fixtures{
	width: 330px;
}
#tickets .tickets-header .col-fixtures{
	margin-left: 15px;
}
#tickets .col-points{
	width: 80px;
}
#tickets .tickets-drawer .col-fixtures{
	display: inline; /* for IE */
	margin-left: 90px;
	width: 320px;
}
#tickets .col-avail{
	width: 360px;
}

/* Seasoncard */
#tickets .row-seasoncard .seasoncard-date{
   	float: left;
   	width: auto;
	margin-left: 10px; 
}
#tickets .row-seasoncard .seasoncard-date h4{
    font-weight: normal;
    margin: 0;
    padding: 0;
}
#tickets .row-seasoncard .seasoncard-date h4.seasoncard-year{
    font-weight: bold;
    margin-top: 20px;
}
#tickets .row-seasoncard .seasoncard-date p{
    font-size: 1.1em;
}
#tickets .row-seasoncard .col-points .points{
    width: 52px;
	background: url(images/bg-tickets-points.gif) 0 0 no-repeat;
	margin: 15px 0 0 0;
}
#tickets .row-seasoncard .col-points .points p{
    margin: 0;
    padding: 6px 0 8px 4px;
}

/* Seasoncard drawer */
#tickets .seasoncard-drawer{
	width: 770px;
	float: left;
	clear: both;
	border-top: 3px solid #6ac6ee;
	margin: 0 0 15px 15px;
	display: inline; /* for IE */
	background: #223344;
	padding: 5px 0 5px 0;
}
#tickets .seasoncard-drawer-open{
    margin-top: 10px;
}
#tickets .seasoncard-drawer .seasoncard-info{
    width: 100%;
    float: left;
    clear: both;
    margin-bottom: 15px;
}
#tickets .seasoncard-info h4{
    width: 300px;
    float: left;
    display: inline; /* for ie6 */
    margin-left: 90px;
    color: #6ac6ee;
    font-size: 1.3em;
    font-weight: bold;
}
#tickets .seasoncard-info .seasoncard-dates{
    width: 355px;
    float: right;
}
#tickets .seasoncard-info .seasoncard-dates p{
    margin-bottom: 5px;
}
#tickets .seasoncard-info .seasoncard-dates .btn{
    margin-top: 10px;
}

/* Fixture*/
#tickets .tickets-fixtures .col-fixtures img{
	float: left;
	margin: 15px 0 0 15px;
}
#tickets .tickets-fixtures .col-fixtures .game-date{
	float: left;
	margin-left: 15px;
}
#tickets .tickets-fixtures .col-fixtures .game-date h4{
	margin-bottom: 2px;
}
#tickets .tickets-fixtures .col-fixtures .game-date p{
	font-size: 1.1em;
	margin-bottom: 0;
}

/* Points */
#tickets .col-points .points{
	background: url(images/bg-tickets-points.gif) top left no-repeat;
	margin: 15px 0 0 0;
}
#tickets .col-points .points p{
	font-size: 14px;
	font-weight: bold;
	padding: 6px 0 8px 7px;
}


/* Availibility*/
#tickets .tickets-fixtures .col-avail .status,
#tickets .tickets-drawer .col-avail .status{
	width: 50%;
	float: left;
	margin-top: 20px;
}

#tickets .tickets-fixtures .col-avail .status h6{
	color: #FFF;
}
#tickets .tickets-fixtures .col-avail .buy,
#tickets .tickets-drawer .col-avail .buy{
	width: 50%;
	float: right;
	margin-top: 20px;
}
#tickets .col-avail .buy img{
	float: left;
	margin: 0 0 5px 0;
}
#tickets .col-avail .buy a{
	clear: both;
}
#tickets .col-avail .buy a.btn{
	clear: none; /* for IE7 */
}

#tickets .tickets-fixtures .col-avail .buy h5{
	color: #6ac6ee;
	margin-right: 35px;
	line-height: 16px;
}
#tickets .tickets-fixtures .col-avail .buy p.feedback{
	font-size: 11px;
	float: left;
	padding: 0;
	margin: 0 0 5px 0;
	clear: both;
	color: #6ac6ee;
	font-weight: bold;
}





/* Away tickets have no drawer*/
#tickets .away{
	float: left;
	clear: both;
	width: 770px;
	margin-bottom: 15px;
}


/* Tickets drawer */
#tickets .tickets-drawer{
	width: 770px;
	float: left;
	clear: both;
	border-top: 3px solid #6ac6ee;
	margin: 0 0 15px 15px;
	display: inline; /* for IE */
	background: #223344;
	padding: 5px 0 5px 0;
}
#tickets .tickets-drawer a.handle{
	margin-left: 410px;
}
#tickets .tickets-drawer .col-avail .status{
	margin-top: 0;
}
#tickets .tickets-drawer h5.drawer-title{
	color: #6ac6ee;
	margin: 2px 0 5px 0;
}
#tickets .tickets-drawer ul{
	margin-bottom: 10px;
}
#tickets .tickets-drawer p{
	margin-bottom: 5px;
}


/* Help and support */
#help-details { 
	width: 274px; 
	float: left; 
	border-right: 1px solid #223344;
	min-height: 275px;
	height: auto !important;
	height: 275px;
}
#help-details .help-and-support{ 
	border-top: 1px solid #223344;
	clear: both; 
	width: 260px;
}
#opening-hours h4,
#help-details h4{ 
	padding: 12px 0 7px 15px; 
	color: #FFF;
	margin-bottom: 0;
	}
#help-details ul{ padding: 0 0 10px 15px; }
#help-details .btn{ margin: 0 0 15px 15px;}

#help-details ul.bullet-icon{ padding: 2px 0 0 15px;}
#help-details ul.bullet-icon .phone{ background: url(images/icon-phone.gif) center left no-repeat;}
#help-details ul.bullet-icon .phone h3{ 
	font-size: 24px; 
	line-height: 22px; 
	padding-top: 6px;
}
#help-details ul.bullet-icon .phone p {
	color: #FFF;
	font-size: 11px; 
}

#help-details ul.bullet-icon .mouse{ background: url(images/icon-mouse.gif) center left no-repeat;}
#help-details ul.bullet-icon .mouse h4{ 
	font-size: 18px;
	font-weight: bold;
	padding: 10px 0 10px 0;
}

#opening-hours{ 
	float: right;
	width: 525px; 
}
#opening-hours table{
	display: inline; /* for IE*/
	margin: 0px 0 15px 15px;
	width: 495px;
}
#opening-hours table td{
	padding:5px 0 5px 5px;
}
#opening-hours table th{
	color: #6ac6ee;
	padding:5px 0 5px 5px;
}
#opening-hours table tr.top-row td{
	border-top: 3px solid #3a7895;
}

/* =Tickets - Card upsell
-----------------------------------------------------------------------------*/
/* Header spacing */
.card-selection h3.white-40{
	margin-top: 12px;
	margin-bottom:8px !important;
}
.card-selection .content-row-info h5,
.card-selection .content-row-info ul li{
	color: #333;
}

/* Card info boxes */
.card-selection .card-aside{
	width: 160px;
	float: left;
	padding-top: 100px;
}
.card-selection .card-aside h5{
	margin-bottom: 5px;
}
.card-selection .card-aside p{
	margin-right: 20px;
}

.card-selection .card-info{
	width: 380px;
	float: left;
	background: #e8f2f6;
	margin-right: 0px;
}

/* Text styles within card information boxes */
.card-selection .card-info ul.bullet,
.card-selection .card-info h4,
.card-selection .card-info p{
	width: 350px;
	float: left;
	clear: both;
	margin-left: 15px;
}

/* Bulleted list */
.card-selection .card-info ul.bullet{
	margin-top: 15px;
}
.card-selection .card-info ul.bullet li{ 
	color: #333;
	background: url(images/li-bullet.gif) center left no-repeat; 
}
/* Paragraph*/
.card-selection .card-info p{
	margin-top: 20px;
}
/* Large headings */
.card-selection .card-info h4{
	margin-top: 15px;
	margin-left: 15px;
}
.card-selection .card-info h4.cost,
.card-selection .card-info h4.sale-date{
	font-weight: bold;
}

.card-selection .card-info-first{
	margin-right: 10px;
}

.card-selection .card-info .card-info-header{
	float: left;
	width: 100%;
	background: #fff;
	min-height: 78px;
	height: auto !important;
	height: 78px;
}
.card-selection .card-info .icon-accesscard{
	background:#FFF url(images/card-info-icon-accesscard.gif) top right no-repeat;
}
.card-selection .card-info .icon-citycard{
	background:#FFF url(images/card-info-icon-citycard.gif) top right no-repeat;
}
.card-selection .card-info .card-info-header h3{
	margin: 20px 0 0 15px;
}

.card-selection .card-info .card-info-divider{
	width: 100%;
	float: left;
	background: url(images/card-info-divider.gif) top left no-repeat;
	padding: 19px 0 10px 0;
	margin-top: 20px;
}
.card-selection .card-info .card-info-divider h4{
	margin-top: 0;
}
.card-selection .card-info .card-info-divider .btn{
	float: right;
	margin:0 15px 0 15px;
}
.card-selection .card-info .back .btn{ float: left;}

.card-selection .card-info .card-info-divider .btn[class] * { background-image: url(images/button-corners-fff.png); background-repeat: no-repeat; }

.card-selection .card-info .card-info-bott{
	float: left;
	width: 100%;
	clear: both;
	background: url(images/card-info-bott.gif) bottom left no-repeat;
	height: 5px;
	font-size: 0px;
}


/* Not enough points */
.card-selection .content-row-info{
	float: right; 
	width: 770px;
	background: #FFF;
}
.card-selection .content-row-info h4,
.card-selection .content-row-info h5,
.card-selection .content-row-info ul,
.card-selection .content-row-info p{
	margin-left: 20px;
}
.card-selection .content-row-info p{
	margin-bottom: 5px;
}
.card-selection .content-row-info h4{
	margin-top: 20px;
	margin-bottom: 10px;
}
.card-selection .content-row-info h5,
.card-selection .content-row-info ul{
	margin-bottom: 5px;
}
.card-selection .button-divider{
	margin-top: 20px;
	background: url(images/button-divider-770.gif) top left no-repeat;
	padding-top: 20px;
}
.card-selection .button-wrapper .btn[class] *,
.card-selection .button-divider .btn[class] * { background-image: url(images/button-corners-fff.png); background-repeat: no-repeat; }

.card-selection .button-wrapper .btn,
.card-selection .button-divider .btn{
	margin-left: 20px;
}

.card-selection .content-row-info .fr-content-bottom{
	clear: both;
	height: 10px;
	background: url(images/fr-content-bottom-770-white.gif) bottom left no-repeat;
}
.card-selection .button-wrapper{
	width: 100%;
	float: left;
	overflow: hidden;
	margin-top: 0px;
	background: none !important;
	padding: 20px 0 20px 0 !important;
}

/* =Seasoncard pages
-----------------------------------------------------------------------------*/
#seasoncard.home h3{
    margin-top: 15px;
    color: #FFF;
}
#seasoncard.home h3.white-24{
    margin-top: 0;
    margin-bottom: 35px !important;
}
#seasoncard .content-main-gutter{
    clear: both;
}

#seasoncard .info{
    width: 310px;
    float: left;
}
#seasoncard .info h3{
    color: #FFF;
    margin-bottom: 15px;
}
#seasoncard .info h3.white-24{
    margin-bottom: 0;
}
#seasoncard .info a.btn{
    margin-bottom: 15px;
}
#seasoncard p{
    clear: both;
    color: #FFF;
    margin-bottom: 15px;
    margin-right: 10px;
}
#seasoncard .info p.note{
    font-size: 12px;
    margin-bottom: 10px;
    color: #6ac6ee;
}

#seasoncard .stadium{
    width: 460px;
    float: right;
    text-align: right;
    margin-top: 15px;
}

#seasoncard table{
    clear: both;
    font-size: 1.3em;
    margin-top: 15px;
    margin-bottom: 15px;
}
#seasoncard table th{
    font-size: 12px;
    font-weight: bold;
    width: 72px;
    padding: 3px 0px 3px 5px;
    border-bottom: 1px solid #4d9ec3;
}
#seasoncard table td{
    width:62px;
    padding: 3px 10px 3px 5px;
    border-bottom: 1px solid #4d9ec3;
    overflow: hidden;
}
#seasoncard table td.age{
    padding-left: 0;
}
#seasoncard table tr.last td{
    border-bottom: none;
}

/* Seasoncard pricing tables */

/* Family Stand */
/* Level 1 */
#seasoncard table th.level1{
    background: #E5B239 url(images/seasoncard-td-yellow-top.gif) 0 0 no-repeat;
}
#seasoncard table td.level1{
    background: #E5B239;
}
#seasoncard table tr.last td.level1{
     background: #E5B239 url(images/seasoncard-td-yellow-bott.gif) bottom left no-repeat;
}
/* Level 2 */
#seasoncard table th.level2{
    background: #0e2b7c url(images/seasoncard-td-blue-top.gif) 0 0 no-repeat;
}
#seasoncard table tr.last td.level2{
     background: #0e2b7c url(images/seasoncard-td-blue-bott.gif) bottom left no-repeat;
}
#seasoncard table .level2{
    background: #0e2b7c;
}


/* Colin Bell Stand */
#seasoncard table#seasoncard-colin-bell th{
    padding-left: 5px;
    padding-right: 0;
}
#seasoncard table#seasoncard-colin-bell td{
    width: 57px;
    padding: 3px 15px 3px 5px;
    border-bottom: 1px solid #4d9ec3;
    overflow: hidden;
}
#seasoncard table#seasoncard-colin-bell .age{
    width: 70px;
    padding: 3px 10px 3px 0;
}
#seasoncard table#seasoncard-colin-bell tr.last td{
    border-bottom: none;
}

#seasoncard table#seasoncard-colin-bell .seats-mid{
    background: #E5B239;
}
#seasoncard table#seasoncard-colin-bell .seats-outer{
    background: #A1003D;
}
#seasoncard table#seasoncard-colin-bell .seats-outermost{
    background: #4F0F78;
}

/* Top curved corners */
#seasoncard table#seasoncard-colin-bell th{
    padding-top: 5px;
}
#seasoncard table#seasoncard-colin-bell th.seats-mid{
    background: #E5B239 url(images/seasoncard-td-yellow-top.gif) 0 0 no-repeat;
}
#seasoncard table#seasoncard-colin-bell th.seats-outer{
    background: #A1003D url(images/seasoncard-td-pink-top.gif) 0 0 no-repeat;
}
#seasoncard table#seasoncard-colin-bell th.seats-outermost{
    background: #4F0F78 url(images/seasoncard-td-purple-top.gif) 0 0 no-repeat;
}
/* Bottom curved corners */
#seasoncard table#seasoncard-colin-bell tr.last td.seats-mid{
    background: #E5B239 url(images/seasoncard-td-yellow-bott.gif) bottom left no-repeat;
}
#seasoncard table#seasoncard-colin-bell tr.last td.seats-outer{
    background: #A1003D url(images/seasoncard-td-pink-bott.gif) bottom left no-repeat;
}
#seasoncard table#seasoncard-colin-bell tr.last td.seats-outermost{
    background: #4F0F78 url(images/seasoncard-td-purple-bott.gif) bottom left no-repeat;
}