/* Main H1's and H2's */

/* Main H1's */
/*  Usage:
		<h1 class="aa_h1">
		    <span class="aa_h1Left">&nbsp;</span>
		    <!-- Image or Text -->
		    <span class="aa_h1Right">&nbsp;</span>
		</h1>

/* Chevron H2's */
/*	Usage:
		<h2 class="aa_chevronH2">
			<span class="aa_chevLeft">&nbsp;</span>
			<!-- Image or Text -->
			<span class="aa_chevOrange">&nbsp;</span>
			<span class="aa_chevRight">&nbsp;</span>
		</h2>
 */
h2.aa_chevronH2, h1.aa_h1 {
	color:#fff;
	position:relative;
	display:block;
    text-transform:uppercase;
    background-color:#000;
    padding:0 6px 0 6px;
    margin:0 3px 0 3px;
    height:25px;
    line-height:25px;
    font-size:1.3em;
	}

h4.aa_chevronH4 {
	color:#fff;
	position:relative;
	display:block;
    text-transform:uppercase;
    background-color:#000;
    padding:0 6px 0 6px;
    margin:0 3px 0 3px;
    height:15px;
    line-height:15px;
    font-size:0.9em;
	}

h1 {
	margin:0 !important;
	}

h1.aa_h1 {
	margin:3px !important;
	font-size:1.5em;
	}

h1.aa_h1 .aa_h1Color1 {
	color:#cc6633;
	}

h2.aa_chevronH2 .aa_h2Color1, h4.aa_chevronH4 .aa_h2Color1 {
	color:#cc6633;
	}

h2.aa_chevronH2 .aa_h2Color2, h4.aa_chevronH4 .aa_h2Color2 {
	color:#d0452f;
	}

.aa_chevLeft, .aa_h1Left {
	width:3px;
	height:25px;
	margin:0;
	display:block;
	position:absolute;
	left:-3px;
	background:url(images/elements/title_chevron_left.png) no-repeat top left !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/elements/title_chevron_left.png',sizingMethod='image');
	*/
	top:0;
	}

h4.aa_chevronH4 .aa_chevRight, h4.aa_chevronH4 .aa_chevLeft {
	background: none !important;
}

.aa_chevRight, .aa_h1Right {
	width:3px;
	height:25px;
	margin:0;
	display:block;
	position:absolute;
	right:-3px;
	background:url(images/elements/title_chevron_right.png) no-repeat top left !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/athletics_australia/freestyler/modules/custom/images/elements/title_chevron_right.png',sizingMethod='image');
	*/
	top:0;
	}

/* Individual Chevron Colours */
h2.aa_chevronH2 .aa_chevOrange {
	position:absolute;
	right:2px;
	top:5px;
	width:17px;
	height:15px;
	background:url(images/elements/title_chevron_orange.gif) no-repeat top left;
	}

h2.aa_chevronH2 .aa_chevYellow {
	position:absolute;
	right:2px;
	top:5px;
	width:17px;
	height:15px;
	background:url(images/elements/title_chevron_yellow.gif) no-repeat top left;
	}

h4.aa_chevronH4 .aa_chevYellow {
	position:absolute;
	right:2px;
	top:4px;
	width:10px;
	height:10px;
	background:url(images/elements/title_chevron_yellow_sm.gif) no-repeat top left;
	}

h2.aa_chevronH2 img, h1.aa_h1 img {
	padding-top:6px;
	display:block;
	}

/******************************************************
 * Athletics Boxes - Themeable reusable rounded boxes *
 ******************************************************/

/*	1) Embedding Rules:
		a) DO NOT embed an aa_box01 box inside an aa_box01 box
		b) DO NOT embed any other box inside an aa_box01 box
		b) DO NOT embed an aa_box03 box inside any other box
	2) Be careful of 1 pixel borders/gaps on the bottom or right sides of boxes
	   under IE. These arise due to Internet Explorers rounding errors (to the
	   nearest pixel) with respect to bottom and right absolutely positioned
	   elements). To fix, increase/decrease the computed size of the box by 1pixel...
	3) Remember you may need to use an fs_clear if you have any floated content
	   inside the box
 */

/* Common boxing styles */
/* Do not touch... */
/* 4px based images only! */
.aa_b01tl, .aa_b02tl, .aa_b03tl, .aa_b04tl, .aa_b05tl, .aa_b06tl {
	overflow:hidden;
	position:absolute;
	display:block;
	width:4px;
	height:4px;
	top:0;
	left:0;
	}

.aa_b01tr, .aa_b02tr, .aa_b03tr, .aa_b04tr, .aa_b05tr, .aa_b06tr {
	overflow:hidden;
	position:absolute;
	display:block;
	width:4px;
	height:4px;
	top:0;
	right:0;
	}

.aa_b01bl, .aa_b02bl, .aa_b04bl, .aa_b05bl, .aa_b06bl{
	overflow:hidden;
	position:absolute;
	display:block;
	width:4px;
	height:4px;
	bottom:0;
	left:0;
	}

.aa_b01br, .aa_b02br, .aa_b04br, .aa_b05br, .aa_b06br{
	overflow:hidden;
	position:absolute;
	display:block;
	width:4px;
	height:4px;
	bottom:0;
	right:0;
	}

/**********
 * Box 01 *
 **********/

/* A four rounded cornered box using inversed white pngs - boxes using this
 * style will be able to use any background colour (gradients or fills allowed also)
 */

/* Example:
	<div class="aa_box01">
	    <div class="aa_b01tl"></div><div class="aa_b01tr"></div>
		<!-- Insert content here -->
		<!-- Remember to use fs_clear if you are floating any content -->
		<!-- e.g <div class="fs_clear"></div> -->
		<div class="aa_b01bl"></div><div class="aa_b01br"></div>
	</div>
*/

.aa_box01 {
	position:relative;
	height:1%;
	padding:3px;
	display:block;
	}

.aa_b01tl{
	background-image:url(images/boxing/4px_topleft.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_topleft.png',sizingMethod='image');
	*/
	}

.aa_b01tr{
	background-image:url(images/boxing/4px_topright.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_topright.png',sizingMethod='image');
	*/
	}

.aa_b01bl{
	background-image:url(images/boxing/4px_botleft.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_botleft.png',sizingMethod='image');
	*/
	}

.aa_b01br{
	background-image:url(images/boxing/4px_botright.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_botright.png',sizingMethod='image');
	*/
	}

/**********
 * Box 02 *
 **********/
/* Inversed corners (as per box01) but this time with a 'pinkish' 1px border
 * Must be a 'white' coloured box if using this box...
 */

/* Example:
	<div class="aa_box02">
	    <div class="aa_b02tl"></div><div class="aa_b02tr"></div>
		<!-- Insert content here -->
		<!-- Remember to use fs_clear if you are floating any content -->
		<div class="aa_b02bl"></div><div class="aa_b02br"></div>
	</div>
*/

.aa_box02 {
	position:relative;
	border:1px solid #f6e3dc;
	height:1%;
	padding:3px;
	display:block;
	background-color:#fffffd;
	}

.aa_b02tl{
	background-image:url(images/boxing/4px_line01_topleft.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_line01_topleft.png',sizingMethod='image');
	*/
	top:-1px;
	left:-1px;
	}

.aa_b02tr{
	background-image:url(images/boxing/4px_line01_topright.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_line01_topright.png',sizingMethod='image');
	*/
	top:-1px;
	right:-1px;
	}

.aa_b02bl{
	background-image:url(images/boxing/4px_line01_botleft.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_line01_botleft.png',sizingMethod='image');
	*/
	bottom:-1px;
	left:-1px;
	}

.aa_b02br{
	background-image:url(images/boxing/4px_line01_botright.png) !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/4px_line01_botright.png',sizingMethod='image');
	*/
	bottom:-1px;
	right:-1px;
	}

/**********
 * Box 03 *
 **********/

/* A drop shadowed pink outline box using sliding windows - requires additional
 * containers in source code:
 */

/* Example:

	This boxing uses a different display method, please be careful...

	<div class="aa_box03">
	    <div class="aa_b03tl"></div><div class="aa_b03tr"></div>
			<div class="aa_b03l"><div class="aa_b03r">
			<!-- Insert content here -->
			<!-- Remember to use fs_clear if you are floating any content -->
			</div></div>
		<div class="aa_b03bl"></div><div class="aa_b03br"></div>
	</div>
*/


.aa_box03 {
	position:relative;
	height:1%;
 	margin-bottom:2px;
	display:block;
	max-width:1100px;
 	overflow:visible;
 	background-color:#fff;
	}

.aa_box03 .aa_b03tr,
.aa_box03 .aa_b03tl,
.aa_box03 .aa_b03br,
.aa_box03 .aa_b03bl {
	font-size:1px;
	}

.aa_b03bl {
  	overflow:visible;
  	position:relative;
	height:7px;
	width:auto;
	margin-right:5px !important;
	margin-left:1px;
 	margin-right:6px;
	background:url(images/boxing/dropshadow01_botleft.png) no-repeat top left !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/dropshadow01_botleft.png',sizingMethod='crop');
	*/
	}

.aa_b03br {
	position:absolute;
	width:5px;
	height:7px;
	bottom:0px !important;
	right:0 !important;
	right:1px;
	background:url(images/boxing/dropshadow01_botright.png) no-repeat bottom right !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/dropshadow01_botright.png',sizingMethod='crop');
	*/
	}

.aa_b03r {
	/*TODO: Make a transparent gif for this bg... */
	/* No transparency here I am afraid... */
	background:url(images/boxing/dropshadow01_right.png) repeat-y top right !important;
	background:url(images/boxing/dropshadow01_right.gif) repeat-y top right;
	position:relative;
	display:block;
	height:1%;
	padding-left:5px;
	padding-right:5px;
	}

.aa_b03l {
	/* TODO: Make a transparent gif for this bg... */
	/* No transparency here I am afraid... */
	background:url(images/boxing/dropshadow01_left.png) repeat-y top left !important;
	background:url(images/boxing/dropshadow01_left.gif) repeat-y top left;
	position:relative;
	display:block;
	height:1%;
	width:auto;
	margin:0;
	}

.aa_b03tl {
  	overflow:visible;
  	position:relative;
	height:5px;
	width:auto;
	margin-right:5px !important;
	margin-right:6px;
	margin-left:1px;
	background:url(images/boxing/dropshadow01_topleft.png) no-repeat top left !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/dropshadow01_topleft.png',sizingMethod='crop');
	*/
	}

.aa_b03tr {
	position:absolute;
	width:5px;
	height:5px;
	top:0 !important;
	right:1px;
	background:url(images/boxing/dropshadow01_topright.png) no-repeat top right !important;
	/*
	background-image:none;
	filter:none !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/freestyler/modules/custom/images/boxing/dropshadow01_topright.png',sizingMethod='crop');
	*/
	}


/**********
 * Box 04 *
 **********/
/* grey outline and grey fill */

/* Example:
	<div class="aa_box04">
	    <div class="aa_b04tl"></div><div class="aa_b04tr"></div>
		<!-- Insert content here -->
		<!-- Remember to use fs_clear if you are floating any content -->
		<div class="aa_b04bl"></div><div class="aa_b04br"></div>
	</div>
*/

.aa_box04 {
	position:relative;
	height:1%;
	padding:3px;
	display:block;
	background-color:#e4e4e4;
	border:1px solid #cbcdc8;
	}

.aa_b04tl{
	background-image:url(images/boxing/4px_topleft_grey.png) !important;
	top:-1px;
	left:-1px;
	}

.aa_b04tr{
	background-image:url(images/boxing/4px_topright_grey.png) !important;
	top:-1px;
	right:-1px;
	}

.aa_b04bl{
	background-image:url(images/boxing/4px_botleft_grey.png) !important;
	bottom:-1px;
	left:-1px;
	}

.aa_b04br{
	background-image:url(images/boxing/4px_botright_grey.png) !important;
	bottom:-1px;
	right:-1px;
	}

/**********
 * Box 05 *
 **********/
/* grey outline and white fill */

/* Example:
	<div class="aa_box05">
	    <div class="aa_b05tl"></div><div class="aa_b05tr"></div>
		<!-- Insert content here -->
		<!-- Remember to use fs_clear if you are floating any content -->
		<div class="aa_b05bl"></div><div class="aa_b05br"></div>
	</div>
*/

.aa_box05 {
	position:relative;
	height:1%;
	padding:3px;
	display:block;
	border:1px solid #cbcdc8;
	}

.aa_b05tl{
	background-image:url(images/boxing/4px_line02_topleft.png);
	top:-1px;
	left:-1px;
	}

.aa_b05tr{
	background-image:url(images/boxing/4px_line02_topright.png);
	top:-1px;
	right:-1px;
	}

.aa_b05bl{
	background-image:url(images/boxing/4px_line02_botleft.png);
	bottom:-1px;
	left:-1px;
	}

.aa_b05br{
	background-image:url(images/boxing/4px_line02_botright.png);
	bottom:-1px;
	right:-1px;
	}
