﻿/**
* General stuff
* @version $Id: gca.css 7121 2024-06-05 08:45:58Z caughtatwork $
*/

* {
	box-sizing: border-box;
}

body {
	color: #000; background: #fff;
	padding: 0px;
	margin: 0px;
	margin-left: 0px;
	padding: 0;
	height: 100%;
	width: 100%;
}

body, td, th, input {
	/*font-family: verdana, sans-serif;*/
	font-family: 'Open Sans', sans-serif;
	voice-family: "\"}\"";
	voice-family: inherit;
}

img {
	border: 0px;
	text-align: center;
}

[onClick] {
	cursor:pointer;
}

#header_halloween {background: url("/pics/header_back_halloween.png") bottom right repeat-x;
	position: relative;
	height: 62px;
	padding: 0px;
	margin: 0px;
}

#header_anzac {background: url("/pics/header_back_anzac.png") bottom right repeat-x;
	position: relative;
	height: 62px;
	padding: 0px;
	margin: 0px;
}

#header_poppy {background: url("/pics/header_back_poppy.png") bottom right no-repeat;
	background-position: 115% 100%;
	position: relative;
	height: 62px;
	padding: 0px;
	margin: 0px;
}

#header_xmas {background: url("/pics/header_back_xmas.png") bottom right repeat-x;
	position: relative;
	height: 62px;
	padding: 0px;
	margin: 0px;
}

#header_nyd {background: url("/pics/header_back_nyd.png") bottom right repeat-x;
	position: relative;
	height: 62px;
	padding: 0px;
	margin: 0px;
}

#header_maythefourth {background: url("/pics/header_back_maythefourth.png") bottom right repeat-x;
	position: relative;
	height: 62px;
	padding: 0px;
	margin: 0px;
}

#header_10anniversary {background: url("/pics/header_back_10anniversary.png") bottom right repeat-x;
	position: relative;
	height: 62px;
	padding: 0px;
	margin: 0px;
}

#header_sitename {
	margin: 0px 0px 0px 0px;
	font-size: 200%;
	color: #FFFFFF;
	height: 62px;
	line-height: 80px;
	float: left;
}

#headline {
	padding: 5px;
	border-bottom: 1px dashed #000000;
	border-top: 1px dashed #000000;
	order-left: 1px dashed #000000;
	border-right: 1px dashed #000000;
	background-color: #FFFFDD;
	font-size: 75%;
	text-align: center;
}	

.campaign {
	padding: 5px;
	border-bottom: 1px dashed #000000;
	border-top: 1px dashed #000000;
	border-left: 1px dashed #000000;
	border-right: 1px dashed #000000;
	background-color: #FFFFDD;
	font-size: 80%;
	text-align: center;
}	

.monospace {
	font-family: monospace;
	font-size: 120%;
}

a:hover { 
	text-decoration: underline; 
}

a.nodecoration {
	text-decoration: none!important;
}

a.nocolour:link, a.nocolour:visited, a.nocolour:active, a.nocolour:hover {
	color: #000000;
}

a.whitelink:link, a.whitelink:visited, a.whitelink:active, a.whitelink:hover {
	color: #FFFFFF;
}

.logo {
	float: left;
	padding: 5px 0px 0px 2px;
	border: 0px;
}

dummy {
}

#header {
	position: absolute;
	z-index: 200;
}

#region {
	position: absolute;
	z-index: 5;
}


#gca_footer, #garminDisplay {
	clear:both;
	margin-left: 1px;
	margin-right: 1px;
	font-size:80%;
}

#content {
	width: 98%;
	margin: auto;
	font-size:80%;
}

table.body {
	width: 100%;
}

h1 { font-size: 180%; font-weight: normal; margin-top: 5px; margin-bottom: 5px; border-bottom: 1px solid #ccc; font-variant: small-caps;}
h2 { font-size: 160%; font-weight: normal; margin-top: 5px; margin-bottom: 5px; border-bottom: 1px solid #ccc; font-variant: small-caps;}
h3 { font-size: 100%; font-variant: small-caps;}
h4 { font-size: 60%; font-variant: small-caps;}
h5 { font-size: 60%; font-variant: small-caps;}
h6 { font-size: 60%; border: 0; font-variant: small-caps; }

a 			{ text-decoration: none; }
a:link		{ color: #039; }
a:active	{ color: #00f; }

.bold {
	font-weight: bold;
}
.italics {
	font-style: italic;
}
.right {
	text-align: right;
}
.left {
	text-align: left;
}
.center {
	text-align: center;
}
.centerelement {
    margin: 0 auto; /* or margin: 0 auto 0 auto */
}

/* Must have a height, such as the icon_'size' class */
.middle {
  display: flex;
  justify-content: center;
  align-items: center;
}
.smallcaps {
	font-variant: small-caps;
}
.min50 {
	min-width: 50px;
	padding: 1px;
}
.nowrap {
	white-space: nowrap;
}
.nooverflow {
	overflow: hidden;
}

/* cache links.	primary/secondary, draft, bulk, new, recommended, unavailable, archived */

a.p { }
a.draft		{ color: gray; font-weight: bold; font-family: monospace;}
a.quickpublish { color: green; font-style: italic; font-weight: bold; font-family: monospace; font-size:120%}
a.new			{ font-weight: bold; }
a.recommended	{ color: orange; font-weight: bold; }
a.unavailable	{ color: blue; text-decoration: line-through; }
a.archived	 { color: red;	text-decoration: line-through; }
a.future		 { color: green; font-weight: bold;}
a.hiderschoice { color: maroon; font-weight: bold;}
a.missing		{ color: blue; text-decoration: line-through;}

/* Icon sizing */
/*=============*/

.icon_congratulations_ribbon_container {
  width: 100px;
  height: 100px;
  position: relative;
}
.icon_congratulations_ribbon {
	display: inline-block;
	position: relative; 
	height: 100px; 
	width: 100%; 
}
.icon_congratulations_ribbon_overlay {
	position: absolute;
	top: 20px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	text-align: center;
}

.icon_hover_dark {
	background-color: #EAEAEA;
}

.icon_percent {
	position: absolute; 
	height: 100%; 
	width: 100%; 
	left: 0; 
	top: 0;
}

.icon_std {
	width: 16px;
	height: 16px;
	padding: 1px;
}

.icon_xsmall {
	width: 1px;
	height: 1px;
	padding: 1px;
}

.icon_vsmall {
	width: 10px;
	height: 10px;
	padding: 1px;
}

.icon_msmall {
	width: 15px;
	height: 15px;
	padding: 1px;
}

.icon_small {
	width: 20px;
	height: 20px;
	padding: 1px;
}

.icon_smedium {
	width: 40px;
	height: 40px;
	padding: 1px;
}

.icon_medium {
	width: 50px;
	height: 50px;
	padding: 1px;
}

.icon_xmedium {
	width: 65px;
	height: 65px;
	padding: 1px;
}

.icon_mediumlarge {
	width: 75px;
	height: 75px;
	padding: 1px;
}

.icon_large {
	width: 100px;
	height: 100px;
	padding: 1px;
}

.icon_xlarge {
	width: 200px;
	height: 200px;
	padding: 1px;
}

.icon_xxlarge {
	width: 300px;
	height: 300px;
	padding: 1px;
}

.icon_overlay {
	position: relative;
}

.icon_overlay_base{
	position: absolute;
	top: -2px;
	left: -5px;
}

.icon_overlay_hat,
.icon_overlay_facade {
	position: absolute;
	top: 0px;
	left: 0px;
}

.icon_flag {
	width: 100px;
	height: 50px;
	padding: 1px;
}

.icon_flag_small {
	width: 50px;
	height: 25px;
	padding: 1px;
}

.icon_flag_smedium {
	width: 80px;
	height: 40px;
	padding: 1px;
}

.icon_flag_medium {
	width: 100px;
	height: 50px;
	padding: 1px;
}

.icon_flag_xmedium {
	width: 130px;
	height: 65px;
	padding: 1px;
}

.icon_mascot_small {
	width: 30px;
	height: 20px;
	padding: 1px;
}
.icon_mascot_smedium {
	width: 60px;
	height: 40px;
	padding: 1px;
}
.icon_mascot_medium {
	width: 75px;
	height: 50px;
	padding: 1px;
}
.icon_mascot_xmedium {
	width: 95px;
	height: 65px;
	padding: 1px;
}
.icon_mascot_mediumlarge {
	width: 150px;
	height: 100px;
	padding: 1px;
}
.icon_mascot_large {
	width: 225px;
	height: 150px;
	padding: 1px;
}
.icon_mascot_xlarge {
	width: 300px;
	height: 200px;
	padding: 1px;
}

.icon_mascot_xxlarge {
	width: 450px;
	height: 300px;
	padding: 1px;
}

.gmapmarker_std {
	width: 27px;
	height: 34px;
}

.gmapmarker_small {
	width: 20px;
	height: 25px;
}

.gmapmarker_medium {
	width: 40px;
	height: 50px;
} 

.gmapmarker_large {
	width: 80px;
	height: 100px;
} 

.static_map {
	max-width: 99%;
	height: auto;
	width: auto\9; /* ie8 */
}


/* Collector Card sizing and positioning */
/*=============*/
.icon_card_overlay {
	position: relative;
}

.icon_card_small {
	width: 50px;
	height: 70px;
}

.icon_card_small_icon {
	position: absolute;
	top: 7%;
	left: 0%;
	width: 100%;
	display: inline;
	text-align: center;
}

.icon_card_small_title {
	position: absolute;
	top: 37%;
	left: 15%;
	width: 70%;
	height: 15%;
	overflow: hidden;
	font-weight: bold;
	font-size: 40%;
	display: inline-grid;
	align-items: center;
	text-align: center;
	color: #FFFFFF;
 }

.icon_card_small_data {
	position: absolute;
	top: 57%;
	left: 15%;
	width: 70%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 3px;
	color: #FFFFFF;
}

.icon_card_smedium {
	width: 120px;
	height: 170px;
}

.icon_card_smedium_icon {
	position: absolute;
	top: 10%;
	left: 0%;
	width: 100%;
	display: inline;
	text-align: center;
}

.icon_card_smedium_title {
	position: absolute;
	top: 37%;
	left: 15%;
	width: 70%;
	height: 15%;
	overflow: hidden;
	font-weight: bold;
	font-size: 70%;
	display: inline-grid;
	align-items: center;
	text-align: center;
	color: #FFFFFF;
 }

.icon_card_smedium_data {
	position: absolute;
	top: 57%;
	left: 15%;
	width: 70%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 40%;
	color: #FFFFFF;
}

.icon_card_xmedium {
	width: 200px;
	height: 280px;
}

.icon_card_xmedium_icon {
	position: absolute;
	top: 10%;
	left: 0%;
	width: 100%;
	display: inline;
	text-align: center;
}

.icon_card_xmedium_title {
	position: absolute;
	top: 37%;
	left: 15%;
	width: 70%;
	height: 15%;
	overflow: hidden;
	font-weight: bold;
	font-size: 120%;
	display: inline-grid;
	align-items: center;
	text-align: center;
	color: #FFFFFF;
 }

.icon_card_xmedium_data {
	position: absolute;
	top: 56%;
	left: 15%;
	width: 70%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 75%;
	color: #FFFFFF;
}

.card_zoom_overlay {
	position: absolute;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 250px;
	height: 330px;
	background-color: #c0c0c0ee;
	z-index: 9999;
	border: 5px solid #000000;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 15px 15px 15px 15px;
}

.icon_card_dragonlords_smedium {
	width: 120px;
	height: 170px;
}

.icon_card_dragonlords_smedium_footer {
	position: absolute;
	top: 82%;
	left: 12%;
	width: 75%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 110%;
	color: #FFFFFF;
	font-weight: bold;
}

.icon_card_dragonlords_xmedium {
	width: 200px;
	height: 280px;
}

.icon_card_dragonlords_xmedium_icon {
	position: absolute;
	top: 62%;
	left: 0%;
	width: 100%;
	display: inline;
	text-align: center;
	color: #FFFFFF;
	font-size: 75%;
}

.icon_card_dragonlords_xmedium_title {
	position: absolute;
	top: 3%;
	left: 15%;
	width: 70%;
	height: 15%;
	overflow: hidden;
	font-weight: bold;
	font-size: 110%;
	display: inline-grid;
	align-items: center;
	text-align: center;
	color: #FFFFFF;
 }

.icon_card_dragonlords_xmedium_data {
	position: absolute;
	top: 15%;
	left: 12%;
	width: 75%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 75%;
	color: #FFFFFF;
}

.icon_card_dragonlords_xmedium_reward {
	position: absolute;
	top: 55%;
	left: 15%;
	width: 70%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 75%;
	color: #FFD200;
}

.icon_card_icem_smedium {
	width: 100px;
	height: 50px;
}
.icon_card_icem_smedium_footer {
	position: absolute;
	top: 35%;
	left: 12%;
	width: 75%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 100%;
	color: #FFFFFF;
	font-weight: bold;
}

.dragonlords_bard_background {
  background: url("/pics/icon_mascot_bard.png") bottom right no-repeat;
  background-size: auto 250px;
  border: 1px solid grey;
  padding: 1px 1px 1px 1px;
}

.dragonlords_rogue_background {
  background: url("/pics/icon_mascot_rogue.png") bottom right no-repeat;
  background-size: auto 225px;
  border: 1px solid grey;
  padding: 1px 1px 1px 1px;
}

.dragonlords_paladin_background {
  background: url("/pics/icon_mascot_paladin.png") bottom right no-repeat;
  background-size: auto 250px;
  border: 1px solid grey;
  padding: 1px 1px 1px 1px;
}

.dragonlords_ranger_background {
  background: url("/pics/icon_mascot_ranger.png") bottom right no-repeat;
  background-size: auto 250px;
  border: 1px solid grey;
  padding: 1px 1px 1px 1px;
}

.dragonlords_mage_background {
  background: url("/pics/icon_mascot_mage.png") bottom right no-repeat;
  background-size: auto 250px;
  border: 1px solid grey;
  padding: 1px 1px 1px 1px;
}

.dragonlords_dice_background {
  background: url("/pics/dragonlords_dice.png");
  height: 75px;
}

.icon_card_icem_xmedium {
	width: 300px;
	height: 150px;
}

.icon_card_icem_xmedium_title {
	transform: rotate(-90deg);
	position: absolute;
	top: 42%;
	left: -26%;
	width: 68%;
	height: 15%;
	overflow: hidden;
	font-weight: bold;
	font-size: 110%;
	display: inline-grid;
	align-items: center;
	text-align: center;
	color: #FFFFFF;
 }

.icon_card_icem_xmedium_data {
	position: absolute;
	top: 10%;
	left: 15%;
	width: 70%;
	height: 80%;
	overflow: hidden;
	text-align: center;
	font-size: 95%;
	color: #FFFFFF;
}

.icon_card_icem_xmedium_reward {
	transform: rotate(90deg);
	position: absolute;
	top: 27%;
	left: 45%;
	width: 75%;
	height: 45%;
	overflow: hidden;
	font-weight: bold;
	text-align: center;
	font-size: 80%;
	color: #FFD200;
}

.icon_card_icem_xmedium_footer {
	position: absolute;
	top: 43%;
	left: 12%;
	width: 75%;
	height: 40%;
	overflow: hidden;
	text-align: center;
	font-size: 150%;
	color: #FFFFFF;
	font-weight: bold;
}

/* Shop Ad sizing */
/*=============*/
.shopadvertisementheader {
	width: 150px;
	height: 50px;
} 

/* Responsive Image */
.responsive_img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}


/* Footer */
#footer {
	border-top: 1px solid #808080;
	border-bottom: 2px solid #808080;
	clear:both;
	margin-top: 25px;
	margin-left: -1px;
	margin-right: -1px;
	padding: 5px 0px 0px 0px;
	text-align:center;
	background: #f0edeb;
	margin-bottom: 20px;
}

.footer_navigation_data_container{
	width: 100%;
	text-align:left;
}

div.footer_navigation_box {
	width: 100%;
	background-color: #f0edeb;
	display: inline-block;
	vertical-align: top;
}

div.footer_navigation_box_heading {
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	overflow:hidden;
	white-space: nowrap;
	font-weight:bold;
	width: 100%;
	position: relative;
}

div.footer_navigation_box_parent:before	{
	content: '▼';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	text-decoration: none!important;
	color: #000000;
	position: absolute;
	bottom: 0;
	right: 5px;
}

div.footer_navigation_box_parent_open:before	{
	content: '▲';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	text-decoration: none!important;
	color: #000000;
	position: absolute;
	bottom: 0;
	right: 5px;
}

div.footer_navigation_box_heading_content {
	text-align: center;
	margin: 0 0 0 0;
}

div.footer_navigation_box_content {
	background-color: #f0edeb;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	overflow:hidden;
	width: 100%;
	text-align: left;	
}

div.footer_navigation_box_subcontent_heading {
	padding: 0.5em 0.5em 0.5em 0.5em;
	color: #000000;
}

div.footer_navigation_box_subcontent_content {
	background-color: #576583;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	overflow:hidden;
	text-align: left; 
	border: 2px solid #576583;
	border-radius: 5px 5px 5px 5px;
}

div.footer_navigation {
	width: 12%;
	display: inline-block;
	vertical-align: top;
}

ul.footer_navigation {
	list-style: bullet;
	padding-left: 16px;
	color: #FFFFFF;
}

li.footer_navigation {
	padding: 0 0 10px 0;
}

.pagecenter_narrow	{
	width: 50%;
	margin: 0 auto;
}

.pagecenter_medium	{
	width: 75%;
	margin: 0 auto;
}

.pagecenter_wide	{
	width: 90%;
	margin: 0 auto;
}

/* Relative sizing: NOTE relative to the container not necessarily the text size */
.smaller1 { font-size: 90%;	}
.smaller2 { font-size: 80%;	}
.smaller3 { font-size: 70%;	}
.smaller4 { font-size: 60%;	}
.smaller5 { font-size: 50%;	}
.smaller6 { font-size: 40%;	}
.larger1	{ font-size: 110%; }
.larger2	{ font-size: 120%; }
.larger3	{ font-size: 130%; }
.larger4	{ font-size: 140%; }
.larger5	{ font-size: 150%; }
.larger6	{ font-size: 160%; }

/* Relative to View Width */
.smaller_vw5 { font-size: 5vw; }
.smaller_vw4 { font-size: 4vw; }
.smaller_vw3 { font-size: 3vw; }
.smaller_vw2 { font-size: 2vw; }
.smaller_vw1 { font-size: 1vw; }
.smaller_vwd75 { font-size: 0.75vw; }
.smaller_vwd5 { font-size: 0.5vw; }
.smaller_vwd4 { font-size: 0.4vw; }
.smaller_vwd3 { font-size: 0.3vw; }
.smaller_vwd2 { font-size: 0.2vw; }
.smaller_vwd1 { font-size: 0.1vw; }



td.gallery	{
	border-top: 1px solid #000000;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #000000;
}
			
.error	   { color: #ff0000; }
.success   { color: #228c22; }
.red       { color: red; }
.green     { color: green; }
.lime      { color: lime; }
.darkgreen { color: #006400; }
.orange    { color: orange; }
.gold      { color: #FFD200; }

.qanda_answer_correct {
	border: 2px solid #00FF00;
	border-radius: 3px 3px 3px 3px;
	text-decoration: none!important;
	color: #000000;
	overflow:hidden;
}

.qanda_answer_incorrect {
	border: 2px solid #FF0000;
	border-radius: 3px 3px 3px 3px;
	text-decoration: none!important;
	color: #000000;
	overflow:hidden;
}

.qanda_answer_neutral {
	border: 2px solid #e0e0e0;
	border-radius: 3px 3px 3px 3px;
	text-decoration: none!important;
	color: #000000;
	overflow:hidden;
}

.qanda_headline {
	background-color: #EAEAEA;
	padding: 0.5em 0.5em 0.5em 0.5em;
	font-weight:bold;
}

.qanda {
	padding: 0.5em 0.5em 0.5em 0.5em;	
}

.hoverdark:hover {
 	background-color: #D0D0D0;
}

.hoverlight:hover {
 	background-color: #D0D0D0;
}

.hoverdark {
 	background-color: #EAEAEA;
}

td.border		 {
	color: #333;
	padding: 2px;
/*	background-color: #F3F4F8;*/
	background-color: #E2E0FF;
	border-bottom: 1px solid #CCCCCC;
	border-top: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
}

table.stdtable { 
	width: 100%;
	margin: 0px;
	padding: 0px;
	border-collapse: collapse;
	border-spacing: 0px;
	border: 0px;
}

table.stdtable td { 
	padding: 2px;
}


.album {
	display: inline-block;
	width: 175px;
	margin-bottom: 1em;
	*display: inline;
	*margin-right: 1em;
	*zoom: 1;
	vertical-align: top;
}

.gallery {
	display: inline-block;
	width: 175px;
	margin-bottom: 1em;
	*display: inline;
	*margin-right: 1em;
	*zoom: 1;
	vertical-align: top;
}

.shadow {
		-moz-box-shadow: 3px 3px 4px #000;
		-webkit-box-shadow: 3px 3px 4px #000;
		box-shadow: 3px 3px 4px #000;
		/* For IE 8 */
		-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#000000)";
		/* For IE 5.5 - 7 */
		filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')
}


table.prox { 
			width: 100%;
			background-color: #FFFFDD
}

.notification {
			overflow: auto;
			border: 1px solid;
			margin: 5px 5px 5px 5px;
			padding: 2px 2px 2px 2px;
			color: #9F6000;
			background-color: #FEEFB3;
			min-height:50px;
			border-radius: 5px 5px 5px 5px;
}

.outlinebox {
			margin: 5px 0px 5px 0px;
			padding: 5px 5px 5px 5px;
			border: 1px solid #c0c0c0;
			border-radius: 5px 5px 5px 5px;
	 }

.msgbox {
			width: 100%;
			padding: 5px;
			border: 1px dashed #000000;
			background-color: #FFFFDD;
			border-radius: 5px 5px 5px 5px;
}

.infobox {
			width: 100%;
			padding: 2px;
			border-bottom: 1px solid #000000;
			border-top: 1px solid #000000;
			border-left: 1px solid #000000;
			border-right: 1px solid #000000;
			background: url(/pics/log_bg_yellow_medium.png) repeat-x;
			background-color: #FFFFDD;
			border-radius: 5px 5px 5px 5px;
}

.matebox {
			overflow: hidden;
			float: left;
			width: 50%;
			height: 160px;
			padding: 2px;
			background: url(/pics/log_bg_grey_horizontal_600.png) repeat-y;
			color: #333;
			border: 2px solid #CCCCCC;
			border-radius: 5px 5px 5px 5px;
}

.genealogybox {
			text-align: center;
			padding: 5px;
			margin: 2px;
			background-color: #CCCCCC;
			color: #333;
			border-bottom: 2px solid #000000;
			border-top: 2px solid #AAAAAA;
			border-left: 2px solid #000000;
			border-right: 2px solid #AAAAAA;
			border-radius: 5px 5px 5px 5px;
}

.pagerbox {
			text-align: center;
			padding: 5px 5px 5px 5px;
			background-color: #CCCCCC;
			color: #333;
			border-bottom: 1px solid #000000;
			border-top: 1px solid #AAAAAA;
			border-left: 1px solid #000000;
			border-right: 1px solid #AAAAAA;
			border-radius: 5px 5px 5px 5px;
}

.importbox {
			overflow:hidden;
			border: 1px solid;
			margin: 5px 5px 5px 5px;
			padding: 2px 2px 2px 2px;
			height:150px;
			border-radius: 5px 5px 5px 5px;
}

.headermessage {
			width: 99%;	
			padding: 2px;
			border-bottom: 1px dashed #000000;
			border-top: 1px dashed #000000;
			border-left: 1px dashed #000000;
			border-right: 1px dashed #000000;
			background-color: #FFFFDD;
			border-radius: 5px 5px 5px 5px;
}

.headermessagefail	 {
			width: 99%;	
			padding: 2px;
			border-bottom: 1px dashed #000000;
			border-top: 1px dashed #000000;
			border-left: 1px dashed #000000;
			border-right: 1px dashed #000000;
			background-color: #ff4242;
			border-radius: 5px 5px 5px 5px;
}

.recommended { color: orange; font-weight: bold; }
.message1 { color: blue; font-weight: bold; }
.message2 { color: green; font-weight: bold; }
.message3 { color: red; font-weight: bold; }
.message4 { color: orange; font-weight: bold; }
.message5 { color: maroon; font-weight: bold; }
.message6 { color: brown; font-weight: bold; }
.message7 { color: yellow; font-weight: bold; }
.message8 { color: silver; font-weight: bold; }
.message9 { color: grey; font-weight: bold; }

.bglightgreen	{background-color: lightgreen;}
.bggold		{background-color: #FFD700;}
.bgsilver		{background-color: #C0C0C0;}
.bgbronze		{background-color: #CD7F32; color: #FFFFFF; }
.bgneutral	{background-color: ;}
.bgblack		{background-color: #000000; color: #FFFFFF; }
.bggrey		{background-color: #A0A0A0; color: #FFFFFF; }
.bgdeeppurple	{background-color: #7D12CF; color: #FFFFFF; }
.bgpumpkin	{background-color: #FF9900; color: #FFFFFF; }
.bgflourogreen	{background-color: #28cf12; color: #FFFFFF; }
.bgroyalblue	{background-color: #115ccf; color: #FFFFFF; }

.bgpalegreen	{background-color: #C0FFC0;}
.bgpaleorange	{background-color: #FFCD94;}
.bgpalered		{background-color: #FFAAAA;}

.bg_dz_blue		{background-color: lightblue;}
.bg_dz_gold		{background-color: gold;}
.bg_dz_green	{background-color: lightgreen;}
.bg_dz_orange	{background-color: orange;}

.fill_dz_blue	{fill: lightblue;}
.fill_dz_gold	{fill: gold;}
.fill_dz_green	{fill: lightgreen;}
.fill_dz_orange	{fill: orange;}


.dark	{ background-color: #EAEAEA; }
.darker	{ background-color: #C0C0C0; }
.light { background-color: #FFFFFF; }
.uline { border-bottom: 1px solid #CCCCCC; }

.imgborder1 {
	border: 1px solid #000000;
}

div.dark {
	float: left;
	width: 100%;
	background-color: #EAEAEA;
	padding: 2px;
}

div.light {
	float: left;
	width: 100%;
	background-color: #FFFFFF;
	padding: 2px;
}

div.padtb_short {
	padding: 1px 0px 1px 0px;
}
div.padtb_medium {
	padding: 5px 0px 5px 0px;
}
div.padtb_tall {
	padding: 10px 0px 10px 0px;
}
div.padtb_vtall {
	padding: 20px 0px 20px 0px;
}

.pager {
	text-align: left;
	width: 98%;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 2px;
	}

.wordwrap {
	overflow-wrap: break-word;
	word-wrap: break-word;
}

.flex {
	display: flex;
}

div.nofloat {
	float: none;
}

div.floaterright {
	float: right;
}

div.floater {
	float: left;
}

div.floater1 {
	float: left;
	width: 1%;
}

div.floater2 {
	float: left;
	width: 2%;
}

div.floater3 {
	float: left;
	width: 3%;
}

div.floater5 {
	float: left;
	width: 5%;
}

div.floater6 {
	float: left;
	width: 6%;
}

div.floater7 {
	float: left;
	width: 7%;
}

div.floater8 {
	float: left;
	width: 8%;
}

div.floater9 {
	float: left;
	width: 9%;
}

div.floater10 {
	float: left;
	width: 10%;
}

div.floater10right {
	float: right;
	width: 10%;
}

div.floater12 {
	float: left;
	width: 12%;
}

div.floater15 {
	float: left;
	width: 15%;
}

div.floater20 {
	float: left;
	width: 20%;
}

div.floater20right {
	float: right;
	width: 20%;
}

div.floater25 {
	float: left;
	width: 25%;
}

div.floater25ra {
	float: left;
	width: 25%;
	text-align: right;
}

div.floater30 {
	float: left;
	width: 30%;
}

div.floater30ra {
	float: left;
	width: 30%;
	text-align: right;
}

div.floater33 {
	float: left;
	width: 33%;
}

div.floater35 {
	float: left;
	width: 35%;
}

div.floater40 {
	float: left;
	width: 40%;
}

div.floater45 {
	float: left;
	width: 45%;
}

div.floater55 {
	float: left;
	width: 55%;
}

div.floater50 {
	float: left;
	width: 50%;
}

div.floater60 {
	float: left;
	width: 60%;
}

div.floater65 {
	float: left;
	width: 65%;
}

div.floater70 {
	float: left;
	width: 70%;
}

div.floater75 {
	float: left;
	width: 75%;
}

div.floater80 {
	float: left;
	width: 80%;
}

div.floater90 {
	float: left;
	width: 90%;
}

div.floater95 {
	float: left;
	width: 95%;
}

div.floater100 {
	float: left;
	width: 100%;
}

div.floatpad2 {
	float: left;
	width: 2%;
	padding: 2px;
}

div.floatpad3 {
	float: left;
	width: 3%;
	padding: 2px;
}

div.floatpad5 {
	float: left;
	width: 5%;
	padding: 2px;
}

div.floatpad5right {
	float: right;
	width: 5%;
	padding: 2px;
}

div.floatpad8 {
	float: left;
	width: 8%;
	padding: 2px;
}

div.floatpad15 {
	float: left;
	width: 15%;
	padding: 2px;
}

div.floatpad10 {
	float: left;
	width: 10%;
	padding: 2px;
}

div.floatpad20 {
	float: left;
	width: 20%;
	padding: 2px;
}

div.floatpad25right {
	float: left;
	width: 20%;
	padding: 2px;
	text-align: right;
}

div.floatpad25 {
	float: left;
	width: 25%;
	padding: 2px;
}

div.floatpad30 {
	float: left;
	width: 30%;
	padding: 2px;
}

div.floatpad33 {
	float: left;
	width: 33%;
	padding: 2px;
}

div.floatpad40 {
	float: left;
	width: 40%;
	padding: 2px;
}

div.floatpad45right {
	float: left;
	width: 45%;
	padding: 2px;
	text-align: right;
}

div.floatpad50 {
	float: left;
	width: 50%;
	padding: 2px;
}

div.floatpad55 {
	float: left;
	width: 55%;
	padding: 2px;
}

div.floatpad55right {
	float: left;
	width: 55%;
	padding: 2px;
	text-align: right;
}

div.floatpad60 {
	float: left;
	width: 60%;
	padding: 2px;
}

div.floatpad65 {
	float: left;
	width: 65%;
	padding: 2px;
}

div.floatpad70 {
	float: left;
	width: 70%;
	padding: 2px;
}

div.floatpad75 {
	float: left;
	width: 75%;
	padding: 2px;
}

div.floatpad80 {
	float: left;
	width: 80%;
	padding: 2px;
}

div.floatpad90 {
	float: left;
	width: 90%;
	padding: 2px;
}

div.floatpad95 {
	float: left;
	width: 95%;
	padding: 2px;
}

div.floatpad100 {
	float: left;
	width: 100%;
	padding: 2px;
}

#clockdiv {
			width: 525px;
			height: 525px;
			text-align: center;
			vertical-align : middle;
			display : table-cell;
			border-bottom: 1px solid #000000;
			border-top: 1px solid #000000;
			border-left: 1px solid #000000;
			border-right: 1px solid #000000;
			background-color: #FFFFFF;
			}

.jumpbox {
	margin:0;
	padding:0;
}

.ticker{
	overflow: auto;
	padding: 2px;
	margin: 2px;
	background-color: #f0edeb;
	border: 2px solid #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.alpha(opacity=80);
	-moz-opacity: 0.8;
}

.rsstitle{ /*shared class for all title elements in an RSS feed*/
	font-weight: bold;
}

.rssdate{ /*shared class for all date elements in an RSS feed*/
	color: gray;
	font-size: 85%;
}

.rssdescription{ /*shared class for all description elements in an RSS feed*/
}

#loadmoreswrapper{
}

#idTabs {
	float: left;
	text-align: left;
	width: 100%;
}
.idTabs {
	float: left;
	text-align: left;
	width: 100%;
}
.idTabs li {
	float: left;
	list-style: none;
	min-width: 8vw;
}
.idTabs li a {
	height: 40px;
	line-height: 30px;
	display: block;
	margin: 1px 1px 0px 1px;
	padding: 5px 5px 5px 5px;
	color: #000000;
	text-decoration: none;
	border: 1px solid #C0C0C0;
	border-radius: 5px 5px 0px 0px;
}
.idTabsCard li a {
	height: auto;
	line-height: 20px;
	text-align: center;
}
.idTabs li a:hover {
	background: #EEEEEE;
	color: #000000;
}
.idTabs li a.selected {
	background: #B0B0B0;
	color: #FFFFFF;
}
.idTabs span.loadmoreajaxloader {
	float: left;
}
.idTabdivs {
	float:left;
	width: 100%;
	height: 100%;
	display:block;
	margin: -1px 0px 0px 0px;
	padding: 5px;
	border-top: 1px solid #C0C0C0;
}

.datepicker {
	width: 75px;
}

.ui-widget {
	font-size: 0.8em !important;
}

.nodisplay {
	display: none;
}

.inlineblock {
	display: inline-block;
}



/**
* Game Stuff
* .img are sprites: define size (width and height) and position from LEFT then TOP (all numerics are NEGATIVE) 
*/

.dragonzone_list {
	padding: 0px 5px 0px 0px;
}

.dragonzone_cache_block {
	background-color: white;
	width: 100%;
	border: 1px black solid;
}
.dragonzone_zone_block {
	background-color: white;
	width: 100%;
	text-align: center;
	border: 1px black solid;
}
.dragonzone_neutral {
	background-color: lightgrey;
	border: 1px black solid;
	padding: 5px 5px 5px 5px;
}
.dragonzone_gold {
	background-color: gold;
	width: 50%;
	height: 50px;
	text-align: right;
	border: 1px black solid;
	padding: 5px 5px 5px 5px;
}
.dragonzone_green	{
	background-color: lightgreen;
	width: 50%;
	height: 50px;
	text-align: right;
	border: 1px black solid;
	padding: 5px 5px 5px 5px;
}
.dragonzone_blue	 {
	background-color: lightblue;
	width: 50%;
	height: 50px;
	text-align: right;
	border: 1px black solid;
	padding: 5px 5px 5px 5px;
}
.dragonzone_orange {
	background-color: orange;
	width: 50%;
	height: 50px;
	text-align: right;
	border: 1px black solid;
	padding: 5px 5px 5px 5px;
}
.dragonzone_gold_row {
	background-color: gold;
	text-align: right;
	border: 1px black solid;
	padding: 0px 5px 0px 5px;
}
.dragonzone_green_row	{
	background-color: lightgreen;
	text-align: right;
	border: 1px black solid;
	padding: 0px 5px 0px 5px;
}
.dragonzone_blue_row	 {
	background-color: lightblue;
	text-align: right;
	border: 1px black solid;
	padding: 0px 5px 0px 5px;
}
.dragonzone_orange_row {
	background-color: orange;
	text-align: right;
	border: 1px black solid;
	padding: 0px 5px 0px 5px;
}
.dragonzone_row {
	display: inline-block;
	padding: 5px 0px 5px 0px;
}
.dragonzone_control {
	font-weight: bold;
	border: 2px black solid;
	-moz-box-shadow: 2px 2px 3px #000;
	-webkit-box-shadow: 2px 2px 3px #000;
	box-shadow: 2px 2px 3px #000;
}
.dragonzone_watermark {
	background: url("/pics/dragonzone_watermark.png") fixed center no-repeat;
}

.dragonzone_dragonlords {
	background: url("/pics/dragonlords_background.jpg") fixed center no-repeat;
	background-size: cover;
}

.dragonzone_my_ladder {
	background-color: #c0c0c0;
	width: 100%;
}

.dragonzone_trophy_highlight {
	border: 2px solid #000000;
	-moz-box-shadow: 2px 2px 3px #000;
	-webkit-box-shadow: 2px 2px 3px #000;
	box-shadow: 2px 2px 3px #000;
}

.dragonzone_xmasinjuly_closed_green {
	margin: 5px;
	min-width: 200px;
	width: 200px;
	height: 200px;
	background: #225500 url("/pics/dragonzone_xmasinjuly_gift_closed.png") top center no-repeat;
	color: white;
}

.dragonzone_xmasinjuly_closed_red {
	margin: 5px;
	width: 200px;
	height: 200px;
	background:	#AA0000 url("/pics/dragonzone_xmasinjuly_gift_closed.png") top center no-repeat;
	color: white;
}

.dragonzone_xmasinjuly_open_green {
	margin: 5px;
	width: 200px;
	height: 200px;
	padding: 80px 0px 0px 0px;
	text-align:center;
	background: #225500 url("/pics/dragonzone_xmasinjuly_gift_open.png") top center no-repeat;
	color: white;
}

.dragonzone_xmasinjuly_open_red {
	margin: 5px;
	width: 200px;
	height: 200px;
	padding: 80px 0px 0px 0px;
	text-align:center;
	background: #AA0000 url("/pics/dragonzone_xmasinjuly_gift_open.png") top center no-repeat;
	color: white;
}

/**
* Journey or Destination Styles
*/
.dragonzone_journeyordestination_table {
	border: 1px #FFFFFF solid;
}

.dragonzone_journeyordestination {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	min-width: 30px;
	width: 30px;
	height: 30px;
	text-decoration: none;
	color: #FFFFFF;
}

.dragonzone_journeyordestination a {
	display: block;
	text-decoration:none;
}

.dragonzone_journeyordestination_grass {
	background-color: #5AA02C;
}

.dragonzone_journeyordestination_path {
	background-color: #C0C0C0;
	color: #000000;
}	

.dragonzone_journeyordestination_dirt	{
	background-color: #654321;
	color: #FFFFFF;
}

/**
* Battleships Styles
*/
.dragonzone_battleships_table {
	border: 1px #FFFFFF solid;
}

.dragonzone_battleships {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	min-width: 30px;
	width: 30px;
	height: 30px;
	text-decoration: none;
	color: #FFFFFF;
}

.dragonzone_battleships a {
	display: block;
	text-decoration:none;
}

.dragonzone_battleships_water	{
	background-color: #006994;
	color: #FFFFFF;
}	

.dragonzone_battleships_water_miss	{
	background-color: #00FFFF	;
	color: #000000;
}	

.dragonzone_battleships_carrier	{
	background-color: #CCCCCC;
	color: #000000;
}	

.dragonzone_battleships_battleship	{
	background-color: #33CC33;
	color: #FFFFFF;
}	

.dragonzone_battleships_cruiser	{
	background-color: #FF8000;
	color: #FFFFFF;
}	

.dragonzone_battleships_submarine	{
	background-color: #FF00FF;
	color: #FFFFFF;
}	

.dragonzone_battleships_destroyer	{
	background-color: #EEEE00;
	color: #000000;
}	

.dragonzone_battleships_patrol	{
	background-color: #993399;
	color: #FFFFFF;
}	

.dragonzone_battleships_mine	{
	background-color: #FF0000;
	color: #FFFFFF;
}

/**
* Crytsal Caverns Styles
*/

.dragonzone_crystalcaverns_outline {
	border-collapse: separate;
	border: 3px #552F12 solid;
	border-radius: 5px;
}

.dragonzone_crystalcaverns {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	min-width: 40px;
	width: 40px;
	height: 40px;
	text-decoration: none;
	color: #FFFFFF;
	border-radius: 5px;
}

.dragonzone_crystalcaverns a:hover {
    display: block;
    text-decoration: none;
    background-color: #552F12 ;
	border: 2px #552F12 solid;
	border-radius: 5px;
}

.dragonzone_crystalcaverns_cavernwrapper {
	display: table-cell;
	vertical-align: middle;
}
.dragonzone_crystalcaverns_1 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern1") no-repeat;
}
.dragonzone_crystalcaverns_2 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern2") no-repeat;
}
.dragonzone_crystalcaverns_3 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern3") no-repeat;
}
.dragonzone_crystalcaverns_4 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern4") no-repeat;
}
.dragonzone_crystalcaverns_5 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern5") no-repeat;
}
.dragonzone_crystalcaverns_6 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern6") no-repeat;
}
.dragonzone_crystalcaverns_7 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern7") no-repeat;
}
.dragonzone_crystalcaverns_8 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern8") no-repeat;
}
.dragonzone_crystalcaverns_9 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern9") no-repeat;
}
.dragonzone_crystalcaverns_10 {
	width: 100%;
	width: 100vw;
	background: url("/pics/cavern.svg#cavern10") no-repeat;
}

.dragonzone_crystalcaverns_entrance {
	background: url("/pics/cavern.svg#cavernentrance") no-repeat;
	height: 600px
}
.dragonzone_crystalcaverns_exit {
	background: url("/pics/cavern.svg#cavernexit") no-repeat;
	height: 600px
}

.dragonzone_crystalcaverns_dirt	{
	background-color: #DEAA87;
	color: #000000;
}	
.dragonzone_crystalcaverns_clear {
	color: #000000;
}	
.dragonzone_crystalcaverns_explored_dirt {
	background-color: #70543E;
	color: #FFFFFF;
}	
.dragonzone_crystalcaverns_explored {
	background-color: #FFD700;
	color: #000000;
}	


/**
* AJAX containers for cacher Page
*/
a:hover.cacher_ajax_container {
	text-decoration: none!important;
}

div.cacher_ajax_container {
	border: 2px solid #c0c0c0;
	border-radius: 5px 5px 5px 5px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	margin: 0 0 0 0;
	overflow:hidden;
	white-space: nowrap;
}

div.cacher_ajax_container_open {
	border: 2px solid #c0c0c0;
	border-bottom: none;
	border-radius: 5px 5px 0 0;
	padding: 0.5em 0.5em 1em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	overflow:hidden;
	white-space: nowrap;
}

div.cacher_ajax_dropdown {
	border: 2px solid #c0c0c0;
	border-top: none;
	border-radius: 0 0 5px 5px;
	padding: 0.5em 0.5em 1em 0.5em;
	background: #ffffff;
	margin: 0 0 0.5em 0;
	overflow:hidden;
	white-space: nowrap;
}

div.cacher_ajax_container:before {
	content: '▼';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
}

div.cacher_ajax_container_open:before {
	content: '▲';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
}

/**
* AJAX containers for Cache Page
*/
div.cache_ajax_container >* {
}

a:hover.cache_ajax_container {
	text-decoration: none!important;
}

div.cache_ajax_container {
	border: 2px solid #c0c0c0;
	border-radius: 5px 5px 5px 5px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	margin: 0 0 0 0;
	overflow:hidden;
	white-space: nowrap;
	width: 100%;
}

div.cache_ajax_container_open {
	border: 2px solid #c0c0c0;
	border-bottom: none;
	border-radius: 5px 5px 0 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	overflow:hidden;
	white-space: nowrap;
	width: 100%;
}

div.cache_ajax_dropdown {
	border: 2px solid #c0c0c0;
	border-top: none;
	border-radius: 0 0 5px 5px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	background: #ffffff;
	margin: 0 0 0 0;
	overflow:hidden;
	white-space: nowrap;
	width: 100%;
}

div.cache_ajax_container:before {
	content: '▼';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
}

div.cache_ajax_container_open:before {
	content: '▲';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
}

div.cache_cacher_found_container,
div.cache_print_logs_container {
	border: 2px solid #c0c0c0;
	border-radius: 5px 5px 5px 5px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	background-color: #f0edeb;
	margin: 0 0 0 0;
	overflow:hidden;
	width: 100%;
}

div.cache_sidenav_heading {
	border: 2px solid #e0e0e0;
	border-radius: 3px 3px 3px 3px;
	padding: 0.25em 0.25em 0.25em 0.25em;
	text-decoration: none!important;
	color: #000000;
	background-color: #e0e0e0;
	white-space: nowrap;
	margin: 0 0 0.25em 0;
	overflow:hidden;
	white-space: nowrap;
	font-weight:bold;
}

div.cache_sidenav_item {
	border: 2px solid #f0edeb;
	border-radius: 3px 3px 3px 3px;
	padding: 0.25em 0.25em 0.25em 0.25em;
	text-decoration: none!important;
	background-color: #f0edeb;
	white-space: nowrap;
	margin: 0.25em 0 0 0;
	overflow:hidden;
	white-space: nowrap;
	font-weight:normal;
}

.fulltextarea {
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
}

.cacheslist {
	padding: 1px 1px 1px 1px;
}

.background1 {
	background-color: white;
}

.border1 {
	border: 1px solid #c0c0c0;
	border-radius: 5px 5px 5px 5px;
}

/**
* Containers for Distributors
*/
div.distributor_box >* {
}

div.distributor_box {
	width: 170px;
	background-color: #f0edeb;
	display: inline-block;
	vertical-align: top;
	border: 2px solid #c0c0c0;
	border-radius: 5px 5px 5px 5px;
}

div.distributor_box_heading {
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	font-weight:bold;
	width: 100%;
	height:180px;
	position: relative;
	text-align: center;
}

div.distributor_box_heading_tall {
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	font-weight:bold;
	width: 100%;
	height:220px;
	position: relative;
	text-align: center;
}

div.distributor_box_toggle:before	{
	content: '▼';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	text-decoration: none!important;
	color: #000000;
	position: absolute;
	bottom: 0;
	right: 5px;
}

div.distributor_box_toggle_open:before	{
	content: '▲';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	text-decoration: none!important;
	color: #000000;
	position: absolute;
	bottom: 0;
	right: 5px;
}

div.distributor_box_heading_content {
	text-align: center;
	margin: 0px 0px 0px 5px;
}

div.distributor_box_heading_button {
	text-align: center;
}

div.distributor_box_heading_help {
	float: left;
	position: absolute;
	top: 1px;
	left: 1px;
}

div.distributor_box_radio {
	float: left;
	margin: 0 0 0.5em 0;
	padding: 0 0.5em 0.5em 0.5em;
	font-size: 70%;
	text-align: center;
	font-weight: normal;
	bottom: 5px;
	position: absolute;
}

div.distributor_box_content {
	background: #ffffff;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	overflow:hidden;
	width: 100%;
	font-size: 80%;
	height: 275px;
	text-align: left;	
}

div.distributor_box_content_open {
	background: #ffffff;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	overflow:hidden;
	width: 100%;
	font-size: 80%;
	height: 275px;
	text-align: left;	
}

a.find_a_geocache_find_btn {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 2px solid #808080;
	cursor: pointer;
	margin: 0.25em 1em 0.25em 1em;
	padding: 0.25em 0.25em 0.25em 0.25em;
	text-align: center;
	text-decoration: none!important;
	white-space: nowrap;
	transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	border-radius: 5px;
	color: #ffffff;
	background-color: #c0c0c0;
	display: block;
	font-weight: bold;
}

input.find_a_geocache_search_btn {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 2px solid #808080;
	cursor: pointer;
	margin: 0.25em 1em 0.25em 1em;
	padding: 0.25em 0.25em 0.25em 0.25em;
	text-align: center;
	text-decoration: none!important;
	white-space: nowrap;
	transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	border-radius: 5px;
	color: #ffffff;
	background-color: #c0c0c0;
	display: block;
	width: 85%;
	font-weight: bold;
}

a.find_a_geocache_find_btn:hover, input.find_a_geocache_search_btn:hover {
	background-color: #ffffff;
	color: #808080;
}


div.distributor_box_criteria {
	float: left;
	text-align:center;
	margin-left:0;
	margin-right:0;
	width: 100%;
}

input.find_a_geocache_search_criteria {
	margin: 0.25em 0 0 0;
	padding: 0.25em 1em 0.25em 0;
	width: 85%;
}

ul.distributor_box_list {
	list-style: none;
	padding-left: 0px;
}


li.distributor_box_list {
	font-size: 110%;
	padding: 0 0 2px 0;
}


/**
* Standard Toggle Containers
*/

.standard_toggle_left:before	{
	content: '▼';
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	color: #000000;
	bottom: 0;
	left: 0px;
}

.standard_toggle_left_open:before	{
	content: '▲';
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	color: #000000;
	bottom: 0;
	left: 0px;
}


.standard_toggle_right:before	{
	content: '▼';
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	color: #000000;
	bottom: 0;
	right: 5px;
}

.standard_toggle_right_open:before	{
	content: '▲';
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	color: #000000;
	bottom: 0;
	right: 5px;
}


/**
* Containers for Front Page Accordion
*/
div.accordion_box >* {
}

div.accordion_box {
	width: 100%;
	background-color: #f0edeb;
	display: inline-block;
	vertical-align: top;
	border: 2px solid #c0c0c0;
	border-radius: 5px 5px 5px 5px;
}

div.accordion_box_heading {
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	overflow:hidden;
	white-space: nowrap;
	font-weight:bold;
	width: 100%;
	position: relative;
	text-align: center;
}

div.accordion_box_heading_open {
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-decoration: none!important;
	color: #000000;
	background-color: #f0edeb;
	overflow:hidden;
	white-space: nowrap;
	font-weight:bold;
	width: 100%;
	position: relative;
	text-align: center;
}

div.accordion_box_heading:before	{
	content: '▼';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	text-decoration: none!important;
	color: #000000;
	position: absolute;
	bottom: 0;
	right: 5px;
}

div.accordion_box_heading_open:before	{
	content: '▲';
	display: inline-block;
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	text-decoration: none!important;
	color: #000000;
	position: absolute;
	bottom: 0;
	right: 5px;
}

div.accordion_box_heading_content {
	text-align: center;
	margin: 0 0 0 0;
}

div.accordion_box_content {
	background-color: #f0edeb;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	overflow:hidden;
	width: 100%;
	text-align: left;	
}

div.accordion_box_subcontent_heading {
	padding: 0.5em 0.5em 0.5em 0.5em;
	color: #000000;
}

div.accordion_box_subcontent_content {
	background-color: #ffffff;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	overflow:hidden;
	text-align: left; 
	border: 2px solid #ffffff;
	border-radius: 5px 5px 5px 5px;
}

/**
* Slideout Menu
*/

.slide_menu_nav {
	display: inline-block;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 100;
	white-space: nowrap;
}

.slide_menu_btn {
	display: inline-block;
	position: absolute;
	right: 10px;
	top: 2px;
	z-index: 1000;
	cursor: pointer;
}

.slide_menu_btn div {
	position: absolute;
	left: 100%;
	top: 64%;
	padding-right: 8px;
	margin-top: -0.50em;
	line-height: 1.2;
	font-size: 18px;
	font-weight: 200;
	vertical-align: middle;
	z-index: 99;
}

.slide_menu_btn span {
	display: block;
	width: 30px;
	height: 4px;
	margin: 5px 0;
	background: #ffffff;
	z-index: 99;
}

.slide_menu_btn p {
	color: #ffffff;
	font-size: 65%;
	z-index: 99;
	margin: 0;
}

.slide_menu_responsive_menu{
	background: #576583;
	position: relative;
	top: 0;
	right: 0;
	bottom: 0;
	width: 0;
	color: #000000;
	z-index: 0;
	transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	overflow:hidden;
	min-height: 100vh;
	display: none;
}

.slide_menu_expand {
	width: 300px;
	display: block;
}

.slide_menu_wrapper {
	padding: 50px 0 20px 0;
}

a.slide_menu_item,
a.slide_menu_item_sub1,
a.slide_menu_item_sub2	{
	text-decoration: none!important;
}

.slide_menu_item	{
	border-bottom: 1px #ffffff solid;
	color: #ffffff;
	margin: 0 1em 0 1em;
	padding: 0.25em 0.5em 0.25em 0.5em;
	text-align: right;
}

.slide_menu_item_sub1	{
	border-bottom: 3px #ffffff double;
	color: #ffffff;
	margin: 0 1em 0 3em;
	padding: 0.25em 0.5em 0.25em 0.5em;
	text-align: right;
}

.slide_menu_item_sub2	{
	border-bottom: 3px #ffffff double;
	color: #ffffff;
	margin: 0 1em 0 5em;
	padding: 0.25em 0.5em 0.25em 0.5em;
	text-align: right;
}

.slide_menu_parent:before	{
	content: '▼';
	display: inline-block;
	-moz-transform: scaleX(1.0);
	-ms-transform: scaleX(1.0);
	-o-transform: scaleX(1.0);
	-webkit-transform: scaleX(1.0);
	transform: scaleX(1.0);
}

.slide_menu_parent_open:before	{
	content: '▲';
	display: inline-block;
	-moz-transform: scaleX(1.0);
	-ms-transform: scaleX(1.0);
	-o-transform: scaleX(1.0);
	-webkit-transform: scaleX(1.0);
	transform: scaleX(1.0);
}


/**
* Subnavigation Menu
*/
.subnavigation_container {
	float:right;
	border-bottom: 1px solid #c0c0c0;
	width: 100%;
}

.subnavigation_subcontainer {
	float:right;
	font-size: 100%;
}

.subnavigation_box >* {
}

.subnavigation_box {
	display: inline-block;
	position: relative;
	vertical-align:bottom;
}

.subnavigation_box_heading {
	border: 2px solid #c0c0c0;
	border-bottom: 0;
	border-radius: 5px 5px 0 0;
	margin: 0 0 0 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	background-color: #f0edeb;
	overflow:hidden;
	white-space: nowrap;
	text-align: center;
}

.subnavigation_box_content {
	border: 2px solid #c0c0c0;
	border-top: 1px solid #c0c0c0;
	border-radius: 0 0 5px 5px;
	margin: 0 0 0 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	background-color: #f0edeb;
	overflow:hidden;
	white-space: nowrap;
	position:absolute;
	z-index: 99;
}

.subnavigation_box_content_data {
	padding: 0.5em 0 0.5em 0;
	min-width: 100px;
	text-align: left;
}

/**
* Front Page Layouts
*/
.frontpage_map_container >* {
}

.frontpage_map_container {
	display: table;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	min-width: 800px;
}

.frontpage_map {
	border: 2px solid #c0c0c0;
	display: table-cell;
	width: 70%;
	margin: 0 0 0 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-align: center;
	background-color:#ffffff;
}

.frontpage_map_information {
	border: 2px solid #c0c0c0;
	display: table-cell;
	white-space:normal;
	width: 30%;
	color: #000000;
	margin: 0 0 0 0;
	padding: 0.5em 0.5em 0.5em 0.5em;
	vertical-align: top;
	background-color: #f0edeb;
	height: 100%;
}

.frontpage_map_information_content {
	padding: 0.5em 0 0.5em 0;
}

#latlon_map {
	display: inline-block;
}

.frontpage_data_container_heading >* {
}

.frontpage_data_container_heading {
	display: table;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.frontpage_data_container{
	display: table;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	text-align:left;
}

.frontpage_cachelist {
	display: inline-block;
	width: 20%;
	text-align:center;
	border: 1px solid #c0c0c0;
	border-radius: 5px 5px 5px 5px;
	
}

.apimenu_nav {
	width: 20%;
	padding: 5px 5px 5px 5px;
	background: #F0F0F0;
	border: solid #ccc 1px;
	float: left;
}

.apimenu_main {
	font-weight: bold;
	width: 100%;
}

.apimenu_module {
	margin: 0 0 0 0;
	width: 100%;
}

.apimenu_method {
	margin: 0 0 0 10px;
	width: 100%;
}

.api_body {
	width: 79%;
	padding: 5px 5px 5px 5px;
	border: solid #ccc 1px;
	float: left;
}

.api_body_spacing {
	width: 1%;
	float: left;
}

/*Quizzes Accordion styles */
.quiz {
	margin-left: 10%;
	margin-right: 10%;
	width: 80%;
	display: block;
	padding: 5px 5px 5px 5px;
	border: 2px solid #000000;
}
.quiz_photo {
}
.quiz_question {
	padding: 5px 5px 5px 5px;
	border: 1px solid #000000;
}
.quiz_answer {
	margin-left: 10%;
	margin-right: 10%;
	padding: 5px 5px 5px 5px;
	background: #EAEAEA;
	border: 1px solid #000000;
}
.quiz_answer:hover {
 	background-color: #D0D0D0;
}
.quiz_img_center {
	text-align: center;
}
.quiz_img {
	text-align: center;
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}
.quiz_correct {
	padding: 5px 5px 5px 5px;
	overflow: hidden;
	background: #339933;
	border: 1px solid #000000;
	color: #FFFFFF;
}
.quiz_incorrect {
	padding: 5px 5px 5px 5px;
	overflow: hidden;
	background: #FF4040;
	border: 1px solid #000000;
	color: #FFFFFF;
}

span.quiz_parent:before	{
	content: '▼';
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
	text-decoration: none!important;
	color: #000000;
	bottom: 0;
	left: 0px;
}

span.quiz_parent_open:before	{
	content: '▲';
	-moz-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-o-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	text-decoration: none!important;
	transform: scaleX(1.5);
	color: #000000;
	bottom: 0;
	left: 0px;
}

.overflowscroll {
	white-space: nowrap;
	overflow:auto;
	overflow-y:hidden;
	-webkit-overflow-scrolling: touch;
}

/*
Skill Styles
*/
.skill_level_container {
	width: 24%;
	display: inline-block;
	vertical-align: top;
}

.skill_flex {
	display: flex;
}

.skill_level_1 {
	width: 100%;
	text-align: center;
	padding: 5px;
	margin: 10px 0 0 0;
	border: 1px solid #000000;
	border-radius: 5px 5px 5px 5px;
}

.skill_level_2 {
	float: left;
	width: 23%;
	text-align: center;
	padding: 5px 0px 5px 0px;
	margin: 10px 1% 0 1%;
	border: 1px solid #000000;
	border-radius: 5px 5px 5px 5px;
}

.skill_level_3 {
	float: left;
	width: 23%;
	text-align: center;
	padding: 5px 0px 5px 0px;
	margin: 10px 1% 0 1%;
	border: 1px solid #000000;
	border-radius: 5px 5px 5px 5px;
}

.skill_level_4 {
	margin: 0 auto;
	width: 96%;
	text-align: center;
	padding: 5px 0px 5px 0px;
	margin: 5px 2% 5px 2%;
	border: 1px solid #000000;
	border-radius: 5px 5px 5px 5px;
}

.skill_activated {
	background-color: lightgreen;
}

.skill_locked {
	background-color: #c0c0c0;
}

.skill_unlocked {
	border: 2px solid #000000;
	border-radius: 5px 5px 5px 5px;
}

/* Instructible */
.instructible_container_landscape {
	width: 50%;
	float: left;
}

.instructible_ratio_landscape {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
}

.instructible_iframe_landscape {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.instructible_container_portrait {
	width: 365px;
	height: 650px;
}

.instructible_iframe_portrait {
	width: 365px;
	height: 650px;
}

.instructible_ratio_portrait {
}

.instructible_container_square {
	width: 560px;
	height: 560px;
}

.instructible_iframe_square {
	width: 560px;
	height: 560px;
}

.instructible_ratio_square {
}

/* Mascot Slideshow */
#mascotslideshow { 
  position: relative; 
  width: 100%; 
  height: 600px; 
  box-shadow: 0 0 20px rgba(0,0,0,0.4); 
}

#mascotslideshow > div { 
  position: absolute; 
  top: 5px; 
  left: 5px; 
  right: 5px; 
  bottom: 5px; 
}

#mascotprev,#mascotnext {
 width:100px;
 height:40px;
}