/*
	STRUCTURE

	- Display
	- Typography Formatting
	- Block Quote
	- Pagination
	- Containers and Columns
		- Containers
		- Columns
		- Featured
		- Right Column Banner
	- Rounded Corners
	- Inline Search Box
	- Lists
		- Unordered List Items
		- List Style Type Green Tick
		- List charities
	- Flash Notifications
	- Notifications
	- Buttons
	- Help
	- Other
	- Languages
	
*/

/* ---------- Display ---------- */

.display_block {
	display: block;
}

.display_inline {
	display: inline;
}

.hide {
	position: absolute;
	top: -9999em;
	left: -9999em;
}

.clear_left {
	clear: left;
}

.clear_right {
	clear: right;
}

.clear_both {
	clear: both;
}

.float_left {
	float: left;
}

.float_right {
	float: right;
}

.no_float {
	float: none;
}

.no_padding {
	padding: 0;
}

.no_margin {
	margin: 0;
}

.no_background {
	background: none !important;
}

.no_border {
	border: none;
}

.fake_horizontal_spacing {
	width: 100%;
	height: 1em;
}

/* ---------- Image Formatting ---------- */

.img_center {
	display: block;
	margin: 0 auto 1em auto;
	text-align: center;
}

.img_left {
	float: left;
	margin: 0 1em 0 0;
}

.img_right {
	float: right;
	margin: 0 0 0 1em;
}

/* ---------- Typography Formatting ---------- */

.txt_left {
	text-align: left;
}

.txt_right {
	text-align: right;
}

.txt_center {
	text-align: center;
}

.large_text {
	font-size: 1.3em;
}

.strong, .bold {
	font-weight: bold;
}

.code {
  margin: 0 0 1em 0;
  padding: 0.5em;
	border: 1px solid #5dac00;
	background: #eaffd4;
	font-size: 0.875em;
  font-family: 'monaco', monospace;
  color: #5dac00;
}

.heading_with_64px_icon {
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 69px;
  background-repeat: no-repeat;
  background-position: left center;
}

/* ---------- Block Quote ---------- */

blockquote {
	background: url("/main_site/images/layout/blockquote_left.png") left top no-repeat;
}

blockquote p.blockquote {
	padding: 0.5em 60px;
	background: url("/main_site/images/layout/blockquote_right.png") right bottom no-repeat;
	text-align: center;
	color: #707070;
}

blockquote p.cite {
	padding-top: 1em;
	text-align: right;
}

blockquote p.cite cite {
	font-style: normal;
}

/* ---------- Pagination ---------- */

div.pagination ul {
	margin: 0;
	padding: 0 0 1em 0;
	list-style-type: none;
}

div.pagination ul li {
	display: block;
	float: left;
	margin: 0 0 0 0.5em;
	padding: 0.25em 0.5em;
	border: 1px solid #888888;
	background: #fefefe url("/main_site/images/buttons/button_1a_base.png") top center repeat-x;
	text-decoration: none;
	color: #888;
}

div.pagination ul li.currentpage {
	background: #888;
	color: #fff;
}

div.pagination ul li a {
	text-decoration: none;
	color: #333;
}

div.pagination ul li a:hover, div.pagination ul li a:focus, div.pagination ul li a:active {
	background: none;
	color: #000;
}

/* ---------- Containers and Columns ---------- */

	/* ---------- Containers ---------- */

	.container {
		position: relative;
		margin-bottom: 2em;
		padding: 1em 1em 0 1em;
		background-image: url('/main_site/images/layout/default_background.png'); /* Default */
		background-position: center top;
		background-repeat: repeat-x;
	}

	.container h1, .container h2, .container h3, .container h4 {
		color: #008ddb;
	}

	/* ---------- Columns ---------- */

	.column_left {
		float: left;
		width: 47%;
	}

	.column_right {
		float: right;
		width: 47%;
	}
	
	div.tri_column
  {
	  float: left;
	  width: 30%;
	  margin-right: 3%;
	}
	
	/* ---------- Featured ---------- */
	
	div.featured {
		background-color: #37ace1;
		background-image: url("/main_site/images/layout/featured_background.png");
		background-position: center top;
		background-repeat: repeat-x;
		color: #fff;
	}
	
	div.featured h1, div.featured h2, div.featured h3 {
		color: #fff;
	}
	
	div.featured a {
		color: #fff;
	}
	
	div.featured a:hover, div.featured a:active, div.featured a:focus {
		background: #000;
	}
	
	div.featured div.corner_left_top {
		background-image: url('/main_site/images/layout/featured_corner_left_top.png');
	}

	div.featured div.corner_right_top {
		background-image: url('/main_site/images/layout/featured_corner_right_top.png');
	}

	div.featured div.corner_left_bottom {
		background-image: url('/main_site/images/layout/featured_corner_left_bottom.png');
	}

	div.featured div.corner_right_bottom {
		background-image: url('/main_site/images/layout/featured_corner_right_bottom.png');
	}

/* ---------- Rounded Corners ---------- */

div.corner_left_top {
	position: absolute;
	left: 0;
	top: 0;
	width: 10px;
	height: 10px;
	background-image: url('/main_site/images/layout/default_corner_left_top.png'); /* Default */
	background-position: left top;
	background-repeat: no-repeat;
}

div.corner_right_top {
	position: absolute;
	right: 0;
	top: 0;
	width: 10px;
	height: 10px;
	background-image: url('/main_site/images/layout/default_corner_right_top.png'); /* Default */
	background-position: right top;
	background-repeat: no-repeat;
}

div.corner_left_bottom {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 10px;
	height: 10px;
	background-position: left bottom;
	background-repeat: no-repeat;
}

div.corner_right_bottom {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 10px;
	height: 10px;
	background-position: right bottom;
	background-repeat: no-repeat;
}

/* ---------- Inline Search Box ---------- */

form.inline_search {
	padding: 0;
	margin: 0;
	text-align: center;
}

form.inline_search fieldset {
	margin: 0 0 2em 0;
	padding: 0.75em 1em;
	border: 1px solid #dfdfdf;
	background: #fff url("/main_site/images/layout/inline_search_box_base.png") 10% center no-repeat;
}

form.inline_search fieldset h3 {
  color: #008DDB;
}

form.events fieldset h3 {
  color: #90B356;
}

/* ---------- Lists ---------- */

	/* ---------- Unordered List Items ---------- */

	ul.list_items_inline {
		margin: 0;
		padding: 0;
		list-style-type: none;
	}

	ul.list_items_inline li {
		display: inline;
	}
	
	/* ---------- List Style Type Green Tick ---------- */
	
	ul.list_style_type_green_tick,
	ul.list_style_type_green_tick_small {
		margin: 0 2% 0.5em 2%;
		padding: 0;
		list-style-type: none;
	}
	
	ul.list_style_type_green_tick li {
		margin-bottom: 0.5em;
		padding-left: 46px;
		background: url("/main_site/images/icons/green_tick.png") left center no-repeat;
	}
	
	ul.list_style_type_green_tick_small li {
		margin-bottom: 0.5em;
		padding-left: 46px;
		background: url("/main_site/images/icons/green_tick_small.png") left center no-repeat;
	}
	
	
	/* ---------- List Charities ---------- */
	
	ul.list_charities, ul.list_events_search_results, ul.list_heroes_search_result {
		margin: 0%;
		padding: 0;
		list-style-type: none;
	}
	
	ul.list_charities li, ul.list_events_search_results li, ul.list_heroes_search_result li {
		padding: 2em 1em;
		border-bottom: 1px solid #dfdfdf;
	}
	
	ul.list_charities li.last, ul.list_events_search_results li.last, ul.list_heroes_search_result li.last { /* Negate default padding and border for last list element */
		padding-top: none;
		border: none;
	}
	
	ul.list_charities li:hover, ul.list_events_search_results li:hover, ul.list_heroes_search_result li:hover {
		background: #f4f4f4;
	}
	
	ul.list_charities li div.left_column, ul.list_events_search_results div.left_column, ul.list_heroes_search_result div.left_column {
		float: left;
	}
	
	ul.list_charities li div.right_column, ul.list_events_search_results div.right_column {
		margin-left: 220px;	
	}
	
	ul.list_heroes_search_result div.right_column {
		margin-left: 100px;
	}

/* ---------- Notifications and Flash Notifications ---------- */

div#errorExplanation {
	margin: 0 auto 1em auto;
	padding: 0.5em;
	background: #ffe5e5;
	border: 1px solid #ff6161;
}

.flash_info,
.hero_page_url,
.box_info_image_left {
	width: 80%;
	margin: 0 auto 1em auto;
	padding: 0.5em;
	border: 1px solid #5dac00;
	background: #eaffd4;
	text-align: center;
	color: #5dac00;
}

.box_info_image_left {
  text-align: left;
}

.flash_notice {
	width: 80%;
	margin: 0 auto 1em auto;
	padding: 0.5em;
	border: 1px solid #e8e6bf;
	background: #fffffa;
	text-align: center;
	color: #aba000;
}

.flash_error {
	width: 80%;
	margin: 0 auto 1em auto;
	padding: 0.5em;
	border: 1px solid #ff6161;
	background: #ffe5e5;
	text-align: center;
	color: #ff6161;
}

.hero_page_url p {
  padding: 0;
}

.hero_page_url a {
  font-size: 1.5em;
  color: #5dac00;
}

.box_info_image_left a {
  color: #5dac00;
}

.hero_page_url a:hover,
.hero_page_url a:focus,
.hero_page_url a:active,
.box_info_image_left a:hover,
.box_info_image_left a:focus,
.box_info_image_left a:hover {
  background: #5dac00;
  color: #fff;
}

.box_info_image_left .left {
  float: left;
  width: 20%;
  text-align: center;
}

.box_info_image_left .left .image {
  width: 116px;
  height: 82px;
  margin: 0 auto;
  background: url("/images/share-116x82-green.jpg");
}

.box_info_image_left .right {
  float: right;
  width: 80%;
}

/* ---------- Buttons ---------- */

/* Silver gradient background with dark foreground text */
.button_1a, .button_1a:active {
	margin: 0 0 1em 0;
	padding: 0.5em 1em;
	border: 1px solid #888888;
	background: #fefefe url("/main_site/images/buttons/button_1a_base.png") top center repeat-x;
	text-decoration: none;
	color: #333 !important;
	white-space: nowrap;
}

.button_1a:hover, .button_1a:focus {
	background: #fefefe url("/main_site/images/buttons/button_1a_base.png") bottom center repeat-x !important;
	color: #333 !important;
}

.button_2a
{
  padding: 1em;
  *padding: 0 1em;
  background: #09a3db;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  font-size: 1.5em;
  text-decoration: none;
  color: #fff;
}

/* ---------- Help ---------- */

#step_by_step {
	width: 550px;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
}

#step_by_step li ul li { /* Prevent parent styling on children lists items */
	margin: 0;
	padding: 0;
	border: none;
	background: none;
}

#step_by_step li {
	margin-bottom: 7px;
	padding: 0 10px 63px 10px;
	border-top: 1px solid #d5d7d9;
	background: #f7f7f7 url("/events/templates/a/images/help/step_base.png") center bottom no-repeat;
}

#step_by_step li.last {
	padding-bottom: 119px;
	background: #f7f7f7 url("/events/templates/a/images/help/step_base_last.png") center bottom no-repeat;
}

#step_by_step li h2 {
	*margin-top: 5px; /* This is applied ONLY to IE6/7 */
	padding: 20px 0 20px 56px;
	font-size: 1.2em;
	color: #000;
}

#step_by_step li.step1 h2 {
	background: url("/events/templates/a/images/help/step1.png") left center no-repeat;
}

#step_by_step li.step2 h2 {
	background: url("/events/templates/a/images/help/step2.png") left center no-repeat;
}

#step_by_step li.step3 h2 {
	background: url("/events/templates/a/images/help/step3.png") left center no-repeat;
}

#step_by_step li.step4 h2 {
	background: url("/events/templates/a/images/help/step4.png") left center no-repeat;
}

#step_by_step li.step5 h2 {
	background: url("/events/templates/a/images/help/step5.png") left center no-repeat;
}

#step_by_step li.step6 h2 {
	background: url("/events/templates/a/images/help/step6.png") left center no-repeat;
}

#step_by_step #step3_individual_or_team { /* Step 3 custom styled bullets: step3_individual_or_team */
	width: 500px;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
}

#step_by_step #step3_individual_or_team li {
	padding-left: 140px;
}

#step_by_step #step3_individual_or_team li.opt1 {
	background: url("/images/help/common/hero_registration/stp3_individual_page.png") left top no-repeat;
}

#step_by_step #step3_individual_or_team li.opt2 {
	background: url("/images/help/common/hero_registration/stp3_create_team.png") left top no-repeat;
}

#step_by_step #step3_individual_or_team li.opt3 {
	background: url("/images/help/common/hero_registration/stp3_join_existing.png") left top no-repeat;
}

#step3_individual_or_team li.opt2a {
	background: url("/images/help/common/hero_registration/single_team_page.jpg") left top no-repeat;
}

#step3_individual_or_team li.opt2b {
	background: url("/images/help/common/hero_registration/team_with_many_pages.jpg") left top no-repeat;
}

ul.option_selection {
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}

ul.option_selection li {
	display: inline;
}

ul.faq {
	margin-bottom: 1em !important;
	list-style-type: none;
}

ul.faq li {
	padding: 5px 20px;
}

ul.faq li h3.question {
	padding: 5px 0 5px 40px;
	*padding-top: 10px; /* This is applied ONLY to IE6/7 */
	border: none;
	color: #00a6de !important; 
}

ul.faq li.odd h3 {
	background: url("/events/templates/a/images/help/q_odd.png") left center no-repeat;
}

ul.faq li.even h3 {
	background: url("/events/templates/a/images/help/q_even.png") left center no-repeat;
}

ul.faq div.answer {
	_height: 30px; /* IE6 doesn't recognise the min-height attribute. This is applied ONLY to IE6 */
	min-height: 30px;
	padding: 0 0 0 40px;
	*padding-bottom: 1em; /* IE6/7 requires additional padding to achieve the desired appereance. This is applied ONLY to IE6/7 */
}

ul.faq li.odd div.answer {
	background: url("/events/templates/a/images/help/a_odd.png") left top no-repeat;
}

ul.faq li.even {
	background: #f0f0f0;
}

ul.faq li.even div.answer {
	background: url("/events/templates/a/images/help/a_even.png") left top no-repeat;
}

/* ---------- Tables ---------- */

table.fees {
	width: 50%;
	margin: 0 auto 1em 2em;
}

table.fees.au {
	width: 90%;
    text-align: center;
}
table.fees.au th {
    font-weight: bold;
    text-align: center;
}

table.fees.au th:first-child {
    text-align: left;
    width:160px;
}

table.fees.au tr td:first-child {
    text-align: left;
}

table.fees.au td table {
    width: 100%;
    border-collapse:collapse;
    border-spacing: 0px;
}

table.fees.au td table tr td {
    width: 40px;
}

table.fees.au.short {
	width: 50%;
}


table.fees thead tr
{
  background: #fff;
}

table.fees tbody tr th
{
  background: #fff;
  text-align: left;
}

table.fees tr {
	background: #dfdfdf;
}

table.fees tr.head {
	background: none;
}

table.fees tr.even {
	background: #f4f4f4;
}

table.fees tr th {
	padding: 0.25em 0;
	font-weight: normal;
}

table.fees tr td {
	padding: 0.25em 0.5em;
}

table.registration_form {
  width: 70%;
  margin: 0 auto 2em auto;
  border-collapse: collapse;
}

table.registration_form caption {
  padding: 0.5em 1em;
  background: #f1f1f1;
  border: 1px solid #aaa;
  border-left: none;
  border-right: none;
  font-weight: bold;
  text-align: left;
  color: #333;
}

table.registration_form tr {
  border-top: 1px solid #aaa;
}

table.registration_form tr th {
  width: 35%;
  text-align: left;
  padding: 0.75em 1em;
  font-weight: normal;
}

table.registration_form tr td {
  width: 65%;
  padding: 0.75em 1em;
  color: #333;
}

/* ---------- Other ---------- */

.print_only {
  display: none;
}

div#registration_progress {
	margin: 0 10% 2em 10%;
}

div#registration_progress p#perecent_in_text {
	margin: 0;
	padding: 0;
	text-align: center;
}

div#registration_progress div#percent_total {
	background: #7fcbec;
}

div#registration_progress div#perecent_completed {
	height: 25px;
	background: #008ddb;
}

.tip_box {
  width: 50%;
  margin: 1em auto 2em auto;
  padding: 1em;
  background: #f1f1f1;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border: 1px solid #333;
  font-size: 1.2em;
  color: #333;
}

.tip_box ol {
  margin: 0;
  padding: 0 0 0 1.5em;
}

.tip_box a {
  color: #000;
  text-decoration: underline;
}

.tip_box a:hover,
.tip_box a:active,
.tip_box a:focus {
  background: #000;
  color: #f1f1f1;
}

.specify-extra {
  display: none;
}

.specify-extra.show {
  display: block;
}

/* ---------- Languages ---------- */

a.en_AU,
a.en_GB,
a.en_HK,
a.en_NZ,
a.zh_HK {
  padding: 5px 0;
  padding-left: 37px;
  background-position: left center !important;
  background-repeat: no-repeat !important;
}

a.en_AU:hover,
a.en_AU:active,
a.en_AU:focus,
a.en_GB:hover,
a.en_GB:active,
a.en_GB:focus,	  
a.en_HK:hover,
a.en_HK:active,
a.en_HK:focus,
a.en_NZ:hover,
a.en_NZ:active,
a.en_NZ:focus,
a.zh_HK:hover,
a.zh_HK:active,
a.zh_HK:focus {
  background-color: transparent !important;
}

a.en_AU {
  background-image: url("/images/flags/en_AU.png") !important;
}

a.en_GB,
a.en_HK {
  background-image: url("/images/flags/en_GB.png") !important;
}

a.en_NZ {
  background-image: url("/images/flags/en_NZ.png") !important;
}

a.zh_HK {
  background-image: url("/images/flags/zh_HK.png") !important;
}

/* Events calendar */

table.calendar {
  width: 100%;
  margin: 0;
  padding: 0;
  border-collapse: collapse;
}

  table.calendar thead tr.month_header th {
    padding-bottom: 1em;
  }
  
    table.calendar thead tr.month_header th.previous_month {
      text-align: left;
    }
    
    table.calendar thead tr.month_header th.next_month {
      text-align: right;
    }
  
    table.calendar thead tr.month_header th.month_name {
      font-size: 1.6em;
      color: #90b356;
    }

  table.calendar thead tr.day_names th {
    border: none;
  }

  table.calendar thead tr th {
    font-weight: normal;    
  }
  
  table.calendar tbody tr td {
    width: 10%;
    height: 170px;
    padding: 5px 5px 0 5px;
    border: 1px solid #dfdfdf;
    vertical-align: top;
  }
  
  table.calendar tbody tr td.today {
    background: #eff9e1 url("/images/events_calendar_today.png") center center no-repeat;
  }
  
  table.calendar tbody tr td span.day {
    display: block;
    text-align: right;
  }
  
    table.calendar tbody tr td.other_month span.day {
      color: #aaa;
    }
  
  table.calendar tbody tr td ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
  }
  
    table.calendar tbody tr td ul li a,
    table.calendar tbody tr td ul li span {
      display: block;
      margin-bottom: 5px;
      padding: 5px;
      text-decoration: none;
    }
    
    table.calendar tbody tr td ul li.inactive span {
      background: #efefef;
      border: 2px solid #efefef;
      color: #aaa;
    }

    table.calendar tbody tr td ul li.active a {
      background: #90b356;
      border: 2px solid #68823e;
      color: #fff;
      text-decoration: none;
    }
    
    table.calendar tbody tr td ul li.active a:hover,
    table.calendar tbody tr td ul li.active a:focus,
    table.calendar tbody tr td ul li.active a:active {
      background: #68823e;
    }


/* Use of Cookies */

table.cookies {
  width: 100%;
  margin: 0;
  padding: 0;
  border-collapse: collapse;
}

table.cookies th {
  text-align: left;
}

table.cookies .name {
  font-style: italic;
}

table.cookies .purpose ol {
  padding-left: 20px;
}

table.cookies .duration {
  text-align: center;
  font-style: italic;
}
