<style type="text/css">
	.tennis_bracket {
		padding: 1em 0 0 0;
	}

	.tennis_bracket .sponsor
	{
		position: absolute; 		
		background-image: url('<?php echo asset('images/logos/USBank_200x50px.png'); ?>');
		background-repeat: no-repeat;
	}

	.tennis_bracket .sponsor.us_bank
	{
		width: 200px;
		height: 50px;		
		top: 875px;
		left: 50px; 
		background-image: url('<?php echo asset('images/logos/USBank_200x50px.png'); ?>');		
	}

	.tennis_bracket .sponsor.les_schwab
	{
		width: 200px;
		height: 50px;
		position: absolute;
		top: 875px; 
		right: 50px; 
		background-image: url('<?php echo asset('images/logos/LesSchwab_200x50px.png'); ?>');
		background-repeat: no-repeat;
	}

	.tennis_bracket .sponsor.osaa
	{
		width: 250px;
		height: 130px; 		
		top: 830px; 
		left: 390px; 
		background-image: url('<?php echo asset('images/logos/OSAAStateChampionship_250x130px.png'); ?>');		
	}

	.tennis_bracket .watermark {
		position: absolute;		
		color: #7d7b7d;		
	}

	.tennis_bracket .watermark.subdivision {		
		left: 500px;
		top: 472px;		
		font-size: 30pt;
		width: 200px;
		text-align: center;
	}

	.tennis_bracket .watermark.consolation {		
		left: 0px;
		top: 1145px;		
		width: 350px;
		font-size: 30pt;
		line-height: 30pt;
		text-align: center;
	}

	.tennis_bracket .part {
		width: 1020px;
	}

	.tennis_bracket .part.top {
		height: 830px;
	}

	.tennis_bracket .part.bottom {
		margin: 55px 0 -20px 0;
	}

	.tennis_bracket .part .round {
		width: 200px;
		float: left;
	}

	/* Special Round Modifications */
	.tennis_bracket .part .round.zero {
		margin-left: 100px;
	}

	.tennis_bracket .part .round.four {
		margin-top: 65px;
	}
	.tennis_bracket .part .round.seven {
		margin-left: 400px;
	}	

	.tennis_bracket .part .round .info {
		position: relative;
		top: -10px;
		width: 200px;
	}

	.tennis_bracket .part .round .info .title {
		font-size: 10pt;
		text-align: center;
		color: #900;
		font-weight: bold;		
	}

	.tennis_bracket .part .round .info .date {
		font-size: 9pt;
		text-align: center;
		color: #151515;
	}

	.tennis_bracket .part .round .match {
		width: 200px;
	}

	<?php
		$match_style = array('zero' => (object)array('margin' => '6px 0 18px 0', 'height' => '42px'),
							 'one' => (object)array('margin' => '27px 0 60px 0', 'height' => '86px'),
							 'two' => (object)array('margin' => '71px 0 147px 0', 'height' => '171px'),
							 'three' => (object)array('margin' => '157px 0 0 0', 'height' => '343px'),
							 'four' => (object)array('margin' => '-10px 0 0 0', 'height' => '42px'),
							 'five' => (object)array('margin' => '10px 0 0 0', 'height' => '42px'),
							 'six' => (object)array('margin' => '32px 0 53px 0', 'height' => '77px'),
							 'seven' => (object)array('margin' => '71px 0 0 0', 'height' => '155px'));
	?>	
	

	<?php foreach ($match_style as $round => $styles): ?>
		.tennis_bracket .part .round.<?php echo $round; ?> .match {
			margin: <?php echo $styles->margin; ?>;
		}

		.tennis_bracket .part .round.<?php echo $round; ?> .match .inner {
			height: <?php echo $styles->height; ?>;
			line-height: <?php echo $styles->height; ?>;
		}	

	<?php endforeach; ?>		
	
	.tennis_bracket .part .round.four .match {				
		border-right: 1px dashed gray;
	}



	.tennis_bracket .part .round .match .participant {
		height: 12px;
		line-height: 12px;
		font-size: 8pt;
		white-space: nowrap;
		padding: 0 0 0 2px;				
	}
	.tennis_bracket .part .round.consolation .match .participant {
		height: 12px;
		line-height: 12px;
		font-size: 8pt;
		white-space: nowrap;
		text-align: right;
		padding: 0 2px 0 0;
	}

	.tennis_bracket .part .round .match .participant {
		overflow: hidden;
		text-overflow: ellipsis;
	}

	/* Add padding to inset S round, 3rd place match */
	.tennis_bracket .part .round.four .match .participant:first-of-type {
		padding-top: 10px;
	}
	.tennis_bracket .part .round.four .match .participant:last-of-type {
		padding-bottom: 10px;
	}


	.tennis_bracket .part .round .match .inner {
		font-size: 8pt;
		border-top: 1px solid #000000;
		border-bottom: 1px solid #000000;
		border-right: 1px solid #000000;

		border-bottom-right-radius: 3px;
		-moz-border-bottom-right-radius: 3px;
		-webkit-border-bottom-right-radius: 2px;
		border-top-right-radius: 3px;
		-moz-border-top-right-radius: 3px;
		-webkit-border-top-right-radius: 2px;
		-webkit-box-shadow: 0 1px 0px #CCC;
		-moz-box-shadow: 0 1px 0px #eee;
	}
	.tennis_bracket .part .round.consolation .match .inner {		
		border-right: none;
		border-left: 1px solid #000000;

		border-bottom-right-radius: 0;
		-moz-border-bottom-right-radius: 0;
		-webkit-border-bottom-right-radius: 0;
		border-top-right-radius: 0;
		-moz-border-top-right-radius: 0;
		-webkit-border-top-right-radius: 0;

		border-bottom-left-radius: 3px;
		-moz-border-bottom-left-radius: 3px;
		-webkit-border-bottom-left-radius: 2px;
		border-top-left-radius: 3px;
		-moz-border-top-left-radius: 3px;
		-webkit-border-top-left-radius: 2px;
		-webkit-box-shadow: 0 1px 0px #CCC;
		-moz-box-shadow: 0 1px 0px #eee;
	}

		

	.tennis_bracket .part .round .match .inner .number {
		float: right;
		width: 30px;
		text-align: center;
	}
	.tennis_bracket .part .round.consolation .match .inner .number {
		float: left;
	}

	.tennis_bracket .part .round .match .inner .results {
		width: 170px;
		text-align: center;
	}

	
	/* Special Tennis Results */
	.tennis_bracket .part .round.zero .match .inner .results {
		line-height: 2em;
	}

	.tennis_bracket .part .round.one .match .inner .results {
		line-height: 5.5em;
		margin-top: -1.5em;
	}

	.tennis_bracket .part .round.two .match .inner .results {
		line-height: 13em;
		margin-top: -5em;
	}

	.tennis_bracket .part .round.three .match .inner .results {
		line-height: 29em;
		margin-top: -13em;
	}

	.tennis_bracket .part .round.six .match .inner .results {
		line-height: 5em;
		margin-top: -1.25em;
	}

	.tennis_bracket .part .round.seven .match .inner .results {
		line-height: 12.5em;
		margin-top: -5.25em;
	}

	
	.finalist_result {
		position: absolute;
		text-align: center;		
		width: 100%;
	}

	.finalist_note {
		position: absolute;
		text-align: center;
		font-weight: bold;
		width: 100%;
	}

	.finalist_note.final_top {
		margin-top: -191px;
	}
	.finalist_note.final_bottom {
		margin-top: 192px;
	}
	.finalist_note.special_top {
		margin-top: -40px;
	}
	.finalist_note.special_bottom {
		margin-top: 40px;
	}
	.finalist_note.consolation_top {
		margin-top: -98px;
	}
	.finalist_note.consolation_bottom {
		margin-top: 98px;
	}




</style>


<div class="tennis_bracket">

	<!-- Sponsors -->
	<div class="sponsor us_bank"></div>
	<div class="sponsor les_schwab"></div>
	<div class="sponsor osaa"></div>

	<!-- Subdivision Reminder -->
	<div class="watermark subdivision">
		<?php if (Helpers::strEqual($information['subdivision'], 'S')): ?>
			Singles
		<?php else: ?>
			Doubles
		<?php endif; ?>		
	</div>

	<!-- Consolation Bracket Watermark -->
	<div class="watermark consolation">
		<?php if (Helpers::strEqual($information['subdivision'], 'S')): ?>
			Singles
		<?php else: ?>
			Doubles
		<?php endif; ?><br />
		Consolation
	</div>

	<!-- Top Part -->
	<div class="part top">
		
		<?php
			$round_date_format = 'M j';
			$rounds = array((object)array('class'       => 'round zero',
				                          'index'       => 0,
				                          'title'       => 'Round 1',
				                          'first_match' => 0,
				                          'last_match'  => 7),							
							(object)array('class'       => 'round one',
								          'index'       => 1,
								          'title'       => 'Quarterfinals',
								          'first_match' => 8,
								          'last_match'  => 11),
							(object)array('class'       => 'round two',
								          'index'       => 2,
								          'title'       => 'Semifinals',
								          'first_match' => 12,
								          'last_match'  => 13),
							(object)array('class'       => 'round three',
								          'index'       => 3,
								          'title'       => 'Final',
								          'first_match' => 14,
								          'last_match'  => 14),
							(object)array('class'       => 'round four consolation',
								          'index'       => 4,
								          'title'       => '3rd Place',
								          'first_match' => 15,
								          'last_match'  => 15));

		?>

		<?php foreach ($rounds as $round): ?>			
			<div class="<?php echo $round->class; ?>">

				<?php if (!is_null($round->title)): ?>
					<div class="info" data-round="<?php echo $information['bracket']->rounds[$round->index]->round->id; ?>">
						<div class="title"><?php echo $round->title; ?></div>	
						<div class="date"><?php echo date($round_date_format, strtotime($information['bracket']->rounds[$round->index]->event->start_at)); ?></div>	
					</div>
				<?php endif; ?>

				<?php for ($i = $round->first_match; $i <= $round->last_match; $i++): ?>

					<?php
						$match = $information['bracket']->matches[$i];				
						BracketsController::getMatchMarkup($match);
					?>				

				<?php endfor; ?>
			</div>
		<?php endforeach; ?> 		
		
		<br class="clear" />

	</div>	

	<div class="part bottom">	

		<?php			
			$rounds = array((object)array('class'       => 'round seven consolation',
										  'index'       => 7,
										  'title'       => 'Consolation Final',
										  'first_match' => 22,
										  'last_match'  => 22),
							(object)array('class'       => 'round six consolation',
										  'index'       => 6,
										  'title'       => 'Consolation Semifinals',
										  'first_match' => 20,
										  'last_match'  => 21),
							(object)array('class'       => 'round five consolation',
										  'index'       => 5,
										  'title'       => 'Consolation Quarterfinals',
										  'first_match' => 16,
										  'last_match'  => 19));
		?>

		<?php foreach ($rounds as $round): ?>			
			<div class="<?php echo $round->class; ?>">

				<?php if (!is_null($round->title)): ?>
					<div class="info" data-round="<?php echo $information['bracket']->rounds[$round->index]->round->id; ?>">
						<div class="title"><?php echo $round->title; ?></div>	
						<div class="date"><?php echo date($round_date_format, strtotime($information['bracket']->rounds[$round->index]->event->start_at)); ?></div>	
					</div>
				<?php endif; ?>

				<?php for ($i = $round->first_match; $i <= $round->last_match; $i++): ?>

					<?php
						$match = $information['bracket']->matches[$i];				
						BracketsController::getMatchMarkup($match);
					?>				

				<?php endfor; ?>
			</div>
		<?php endforeach; ?> 					

		<br class="clear" />

	</div>

</div>