*{
    -webkit-tap-highlight-color: transparent;
	/*box-sizing:border-box;*/
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

body
{
	background-color:#ccc;
    -webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */

	/* Rules below not implemented in browsers yet */
	-o-user-select: none;
	user-select: none;
	/*min-width:1400px;
	min-height:604px;*/
	touch-action: manipulation;
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom:  0px;
}

h1,h2,h3
{
	font-family: 'Caveat Brush', cursive;
	color:#fff;
	font-size:32px;
	text-align:left;
	display:inline-block;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	line-height: 1.5;
	margin-left: 1%;
}

h2,h3
{
	margin: 0px;
	font-family: 'Caveat Brush', cursive;
	float:right;
	margin-right:2%;
}

.plain_text
{
	font-family: times;
	font-size:24px;
	line-height: 1.1;
	color:#eee;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}
.red_text
{
	color:#f77;
}

.hidden
{
	display:none !important;
}

button:focus
{
	outline: none;
}

.main_window
{
	margin:auto;
	width:100%;
	height:100%;
	/*border:2px solid #555;
	border-radius:5px;
	box-shadow: 5px 5px 20px rgba(0,0,0,0.2);*/
	background-color:#888;
	position:relative;
	left:0px;
	overflow: hidden;
	-ms-transform-origin: top center; /* IE 9 */
    -webkit-transform-origin: top center; /* Chrome, Safari, Opera */
    transform-origin: top center;
}

.page_container
{
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	display:none;
	overflow-x:hidden;
	overflow-y: auto;
}

.page_container.active
{
	display:block;
}

.scrollable
{
	overflow-x:hidden;
	overflow-y: auto;
}

.home_devider
{
	width:96%;
	position:relative;
	margin-left:2%;
	clear:both;
	font-family: 'Caveat Brush', cursive;
	font-size:24px;
	color:#ccc;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}

.home_section
{
	float:none;
	width:98%;
	margin-left:1%;
	margin-top:10px;
	vertical-align:middle;
}

.home_section.home_buttons_container
{
	clear: both;
	float: none;
	width: 100%;
	margin-left:  0px;
	text-align: center;
}

.paper_bg
{
	background-image: url('../images/old-953394_640.jpg');
	background-position: center center;
	background-size: cover;
	position:fixed;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	opacity:0.3;
	z-index:0;
}

.big_text_header
{
	font-size: 48px;
    margin-top: -20px;
    display: inline-block;
}

.big_text
{
	font-family: 'Caveat Brush', cursive;
	color:#fff;
	font-size:32px;
	text-align:center;
	position: absolute;
	top:140px;
	left:40px;
	right:40px;
	display:block;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	line-height: 1.5;
}

.last_save
{
	position: absolute;
    bottom: 4px;
    right: 20px;
    font-family: arial;
    font-size: 14px;
    color: #ccc;
}

.menu_button_bar
{
	position: relative;
	z-index:  1;
}

.start_campaign,
.menu_button
{
	float:none;
	display: inline-block;
	margin-right:10px;
	margin-bottom:10px;
	width:184px;
	height:105px;
	background-color:rgba(0,0,0,0.2);
	text-align:center;
	border:2px solid #000;
	font-family: times;
	font-size:30px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	cursor:pointer;
	border-radius:0px;
	color:#fff;
	text-shadow:none;
	box-shadow: none;
	position: relative;
	vertical-align:middle;
}



.menu_button span,
.shop_buy_button span
{
	display:block;
	font-size:20px;
	margin-top:-5px;
	opacity:0.8;
}

.menu_button.third
{
	width: 30%;
	margin-left: 1%;
	margin-right: 1%;
	margin-bottom: 10px;
}

@media only screen and (max-width:1000px) {

	.menu_button.third
	{
		width: 47%;
		margin-left: 1%;
		margin-right: 1%;
		margin-bottom: 10px;
	}
}

@media only screen and (max-width:400px) {

	.menu_button.third
	{
		width: 97%;
		margin-left: 1%;
		margin-right: 1%;
		margin-bottom: 10px;
	}
}

.upgrades_description
{
	box-sizing: border-box;
	font-family: times;
	font-size:20px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	width: 100%;
	padding-bottom: 25px;
	padding-left: 10px;
	padding-right: 10px;
}

.menu_button.third.hero_unavailable
{
	cursor: default;
	opacity: 0.5;
}

.menu_button.third span
{
	position: absolute;
	bottom:10px;
	left:15px;
	right: 15px;
	text-align: left;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}

.menu_button.third span.max_level
{
	position: absolute;
	top: 10px;
	right: 10px;
	left: auto;
	bottom: auto;
	margin: 0px;
	font-size: 24px;
}

.menu_button.third span.max_level.needed_hero
{
	color: rgba(255,0,0,1);
}

.single_area.menu_button.third span.unknown_area_recipe_count
{
	position: absolute;
	top: 10px;
	left: 15px;
	right: auto;
	bottom: auto;
	margin: 0px;
	font-size: 3vw;
	padding-top: 10px;
	padding-left: 15px;
	background-image: url(../images/scroll-unfurled.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.random_battles_buttons,
.difficulty_button_container
{
	text-align: center;
}

.menu_button.slim
{
	width:180px;
	height: auto;
	min-height:40px;
	padding-top:10px;
	background-color:rgba(0,0,0,0.2);
	text-align:center;
	border:2px solid #000;
	font-family: times;
	font-size:30px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	cursor:pointer;
	border-radius:0px;
	color:#fff;
	text-shadow:none;
	box-shadow: none;
}

@media only screen and (max-width:800px) {
	div.select_filters,
	.menu_button.slim
	{
		position: relative;
		top: 0px;
		right: 0px;
		display: inline-block;
		width: 48%;
		margin: 0px;
		margin-right: 1%;
		box-sizing: border-box;
		height: auto;
		padding-bottom:10px;
		vertical-align: middle;
	}
}

/*.areas_container .bg
{
	background-position: top center;
}*/

.areas_container
{
	text-align: center;
}

.single_area.menu_button.third
{
	overflow: visible;
	background-image: url(../images/old-953394_640.jpg);
	background-position: center;
	background-size: cover;
	border-radius: 5px;
    background-color: rgba(200,200,200,1);
    overflow: hidden;
    box-shadow: 5px 5px 10px rgb(0 0 0 / 50%);
    height: 200px;
    max-width: 400px;
}

.single_area.menu_button.third .bg
{
	top: 5px;
	right: 5px;
	bottom: 5px;
	left: 5px;
	opacity: 0.8;
}

.single_area.menu_button.third span
{
	font-size: 3.2vw;
	overflow: visible;
	left: 15px;
	right: 15px;
	opacity: 1;
}

@media only screen and (max-width:800px) {
	.single_area.menu_button.third
	{
		height:  150px;
	}
	.single_area.menu_button.third span
	{
		font-size: 4vw;
	}
}

.menu_button.third span.area_level,
.menu_button.third span.max_level
{
	position: absolute;
	top: 10px;
	right: 15px;
	left: 15px;
	bottom: auto;
	font-size: 3vw;
	text-align: right;
}

.menu_button.third span.maxed_level
{
	top: 10px;
	color: rgba(150,255,150,0.9);
	font-size: 4vw;
}

@media only screen and (min-width:1000px) {
	.single_area.menu_button.third span.unknown_area_recipe_count,
	.menu_button.third span.area_level,
	.menu_button.third span.max_level,
	.menu_button.third span.maxed_level,
	.single_area.menu_button.third span
	{
		font-size: 30px;
	}
}

@media only screen and (max-width:600px) {
	.single_area.menu_button.third span.unknown_area_recipe_count,
	.menu_button.third span.area_level,
	.menu_button.third span.max_level,
	.menu_button.third span.maxed_level,
	.single_area.menu_button.third span
	{
		font-size: 20px;
	}
}

.current_area_difficulty
{
	display: inline-block;
	width:180px;
	height:40px;
	padding-top:0px;
	text-align:center;
	font-family: times;
	font-size:36px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	border-radius:0px;
	color:#fff;
	text-shadow:none;
	box-shadow: none;
	vertical-align: middle;
}

@media only screen and (max-width:800px) {
	.difficulty_button_container .menu_button.slim,
	.current_area_difficulty
	{
		max-width: 29%;
		margin-left: 1%;
		margin-right: 1%;
	}
}

.menu_button.wide
{
	width:220px;
}

.menu_button.wider
{
	width:280px;
}

div.menu_button.wider
{
	width:276px;
}

div.menu_button.widest
{
	width:326px;
}

.menu_button.danger
{
	background-color:rgba(150,100,100,0.5);
}

.menu_button.click_me
{
	background-color:rgba(100,150,100,0.5);
}

.menu_button.cool
{
	background-color:rgba(100,100,150,0.5);
}

.menu_button.gold
{
	background-color:rgba(150,150,100,0.5);
}

.menu_button:hover
{
	box-shadow:inset 5px 10px 10px rgba(0,0,0,0.2);
	color:#aaa;
}

.breaker
{
	clear:both;
}

.detail_overlay
{
	position:absolute;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	left:0px;
	background-color:rgba(0,0,0,0.8);
	z-index:10000000000;
}

.zoom
{
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
	transform-origin:center center;
	transform:scale(1.2);
	z-index:100;
}

.unzoom
{
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
	transform-origin:center center;
	transform:scale(0.8);
	z-index:100;
}



.hidden
{
	display:none;
}

#content_home h2
{
	margin-top: 14px;
	font-size: 20px;
}

#content_card_filters .clear_filters_button,
#content_card_filters .reset_filters_button,
#content_card_filters .back_button
{
	position:absolute;
	right:20px;
	top:10px;
	width:180px;
	height:40px;
	padding-top:10px;
	background-color:rgba(0,0,0,0.2);
	text-align:center;
	border:2px solid #000;
	font-size:30px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	cursor:pointer;
}


#content_card_filters .clear_filters_button:hover,
#content_card_filters .reset_filters_button:hover,
#content_card_filters .back_button:hover
{
	color:rgba(255,255,255,1);
	border:2px solid #ccc;
}

#content_card_filters .reset_filters_button
{
	right:220px;
}

#content_card_filters .clear_filters_button
{
	right:420px;
}

@media only screen and (max-width:999px) {
	#content_card_filters .home_section
	{
		text-align: center;
	}
	#content_card_filters .clear_filters_button, 
	#content_card_filters .reset_filters_button, 
	#content_card_filters .back_button
	{
		position: relative;
		top: 0px;
		right: 0px;
		display: inline-block;
		width: 30%;
		margin: 0px;
		margin-right: 1%;
		box-sizing: border-box;
		height: auto;
		padding-bottom:10px;
	}

}

@media only screen and (max-width:400px) {
	#content_card_filters .clear_filters_button, 
	#content_card_filters .reset_filters_button, 
	#content_card_filters .back_button
	{
		font-size: 7vw;
	}
}



.filters_container
{
	text-align:center;
	position:absolute;
	top:70px;
	left:2%;
	right:2%;
	bottom: 20px;
	font-family: 'Caveat Brush', cursive;
	font-size:24px;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	color:#fff;
	overflow: auto;
}

.filters_container .left_filters
{
	position: absolute;
	left:20px;
	top:0px;
	width:400px;
}

.filters_container .right_filters
{
	position: absolute;
	left:420px;
	top:0px;
	width:400px;
}

.filters_container input.name_filter,
.filters_container input.ability_filter
{
	margin:auto;
	margin-top:5px;
	font-family: 'Caveat Brush', cursive;
	color:#000;
	background-color:rgba(255,255,255,0.7);
	padding:5px;
	font-size: 24px;
	width:400px;
}

.filters_container input.narrow_filter
{
	margin-top:5px;
	font-family: 'Caveat Brush', cursive;
	color:#000;
	background-color:rgba(255,255,255,0.7);
	padding:5px;
	font-size: 24px;
	width:150px;
	margin-left:5px;
	margin-right:5px;
	display:inline-block;
}

.filters_container .types6,
.filters_container .types3,
.filters_container .types5,
.filters_container .types,
.filters_container .types2,
.filters_container .types4
{
	position:absolute;
	top: 200px;
	width:200px;
	text-align:left;
	line-height:1.5;
}

.filters_container .types3,
.filters_container .types
{
	left:150px;
}

.filters_container .types4,
.filters_container .types2
{
	left:350px;
}

.filters_container .types6,
.filters_container .types5
{
	left:550px;
}

.filters_container .types6,
.filters_container .types3,
.filters_container .types4
{
	top: 360px;	
}

.filters_container i
{
	font-style: italic;
	color:#999;
}

@media only screen and (max-width:1999px) {
	.filters_container .right_filters,
	.filters_container .left_filters
	{
		padding-top: 20px;
		position: relative;
		top: 0px;
		left: 0px;
		top: 0px;
		right: 0px;
		width: 100%;
		display: inline-block;
	}

	.filters_container .types6,
	.filters_container .types3,
	.filters_container .types5,
	.filters_container .types,
	.filters_container .types2,
	.filters_container .types4
	{
		position: relative;
		top: 0px;
		left: 0px;
		display: inline-block;
		width: auto;
		height: auto;
		vertical-align: top;
		padding: 5px;
	}

	.filters_container input.name_filter, .filters_container input.ability_filter
	{
		max-width: 80%;
	}
	.filters_container input.narrow_filter
	{
		max-width: 40%;
	}
}

.filter_checkbox
{
	cursor:pointer;
}

/*.reset_button
{
	position:absolute;
	left:200px;
	top:200px;
	right:200px;
	bottom:200px;
	width:auto;
	height:auto;
	box-sizing: border-box;
	padding-top:80px;
	text-align:center;
}*/

.start_campaign
{
	position: absolute;
	left:10px;
	bottom:10px;
	width:155px;
	height:110px;
	border-color:#fff;
}

.deck_button
{
	height: 300px;
	border-radius:5px;
	margin-bottom:10px;
	margin-right: 0px;
    margin-left: 10px;
}

@media only screen and (max-width:600px) {
	.deck_button
	{
		display: inline-block;
		height: 150px;
		width: 45%;
		margin-left: 1%;
		margin-right: 1%;
	}

	.menu_button.deck_button span
	{
		font-size: 5vw;
	}
}

@media only screen and (max-width:300px) {
	.deck_button
	{
		height: 150px;
		width: 100%;
		margin-left: 0px;
		margin-right: 0px;
	}
}

.deck_button.active
{
	border-color:#fff;
}

.test_deck
{
	height:300px;
	position: relative;
	width:184px;
	border-radius:5px;
	margin:0px;
	margin-bottom: 10px;
	margin-left:10px;
}

.testable_decks
{
	max-height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
    width: 990px;
    margin: 0px;
    padding-left: 10px;
}

.single_reward .background,
.single_quest .background,
.random_battle_button .background,
.deck_button .background,
.test_deck .background
{
	position:absolute;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	opacity: 0.5;
	background-image: url('../images/old-953394_640.jpg');
	background-position: center center;
	background-size: cover;
	z-index:0;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
}

.random_battle_button .background
{
	opacity: 0.3;
}


.deck_button.active .background,
.deck_button:hover .background,
.random_battle_button:hover .background,
.test_deck:hover .background
{
	opacity: 0.8;
}

.random_battle_button span,
.menu_button span,
.test_deck span
{
	position: relative;
    color: #fff;
    font-size: 30px;
    text-shadow: 1px 1px 0px rgba(0,0,0,1), 1px -1px 0px rgba(0,0,0,1), -1px 1px 0px rgba(0,0,0,1), -1px -1px 0px rgba(0,0,0,1), 1px 1px 3px rgba(0,0,0,1);
    overflow: hidden;
    text-align: center;
    display: block;
}

.random_battle_button span
{
	font-size:45px;
}

.random_battle_button span.highest_wave_counter
{
	margin-top:20px;
	font-size: 24px;
}


.menu_button.deck_button.active span
{
	opacity: 1;
}

.random_battle_button
{
	position: relative;
	width: 313px;
    height: 500px;
}

.portrait .random_battle_button
{
	width: 100%;
	height: auto;
	padding-top: 20px;
	padding-bottom: 20px;
	min-height: 250px;
}

.random_battle_0 .background
{
	background-image:url('../images/cards/barbarian-4616094_640.jpg');
}

.random_battle_1 .background
{
	background-image:url('../images/cards/amazone-5178696_640.jpg');
}

.random_battle_2 .background
{
	background-image:url('../images/cards/dream_TradingCard91m.jpg');
}



.bg
{
	background-position: center center;
	background-size: cover;
	opacity: 0.8;
	position: absolute;
	top:0px;
	right:0px;
	bottom:0px;
	left:0px;
	z-index:0;
}

.bg.potion_content
{
	left: 15%;
    top: 37%;
    bottom: 11%;
    right: 15%;
    border-radius: 14%;
}

.bg.potion_overlay
{
	background-size: 120% 120%;
	background-repeat: no-repeat;
	opacity: 1;
}

.potion_button
{
	width: 120px;
	height: 150px;
	display: inline-block;
	position: relative;
	margin-left: -5px;
	margin-right: -5px;
}

.potion_button.hero_unavailable
{
	opacity: 0.5;
}

.potion_button .max_level
{
	font-size: 30px;
	color: #fff;
	position: absolute;
	top: 50%;
	left: 0px;
	right: 0px;
	font-weight: bold;
    font-family: sans-serif;
	text-align: center;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}

@media only screen and (max-width:600px) {
	.potion_button
	{
		width: 80px;
		height: 100px;
	}
	.potion_button .max_level
	{
		top: 50%;
		font-size: 20px;
	}
}

.page_container
{
	background-color: rgba(0,0,0,0.5);
}

/*.merchant_button,
.arena_button,
.quests_button,
.options_button,
.deck_edit_button,
.random_battles_button,
.town_button,
.campaigns_button
{
	height:250px;
	width: 232px;
    margin-right: 11px;
    border-radius:8px;
    overflow: hidden;
    background-color:rgba(0,0,0,0.8);
}*/

/*.quests_button,
.random_battles_button,
.campaigns_button
{
	width: 313px;
    margin-right: 11px;
}*/

/*.options_button,
.deck_edit_button,
.merchant_button,
.quests_button
{
	width:232px;
}

.options_button,
.quests_button,
{
	margin:0px;
}

.town_button,
.merchant_button,
.options_button,
.deck_edit_button
{
	margin-top:10px;
}*/

.arena_button .bg
{
	background-image:url('../images/cards/fantasy-3389041_1280.jpg');
	background-position:top;
	opacity:0.7;
}

.quests_button .bg
{
	background-image:url('../images/cards/dream_TradingCard-2024-11-30T171529.098.jpg');
	background-position:center;
	opacity:0.5;
}

.town_button .bg
{
	background-image:url('../images/cards/dream_TradingCard97.jpg');
	background-position:center;
	opacity:0.5;
}

.upgrades_button .bg
{
	background-image:url('../images/cards/dream_TradingCard-2023-03-17T062225.jpg');
	background-position:center;
	opacity:0.5;
}


.campaigns_button .bg
{
	background-image:url('../images/cards/fantasy-4103064_640.jpg');
	background-position:top;
	opacity:0.7;
}

.random_battles_button .bg
{
	background-image:url('../images/cards/barbarian-4616094_640.jpg');
	background-position:top;
	opacity:0.7;
}

.summon_mob_button .bg
{
	background-image:url('../images/cards/dream_TradingCard49.jpg');
	background-position:top;
	opacity:0.7;
}

.waves_button .bg
{
	background-image:url('../images/cards/dream_TradingCard-2024-11-24T070421.937.jpg');
	background-position:top;
	opacity:0.7;
}

.merchant_button .bg
{
	background-image:url('../images/cards/mystical-5398548_640.jpg');
	background-position:center;
}

.deck_edit_button .bg
{
	background-image:url('../images/cards/dream_TradingCard54.jpg');
	background-position:center;
	opacity: 0.5;
}

.craft_menu_button .bg
{
	background-image:url('../images/cards/dream_TradingCard-2024-11-30T170836.397.jpg');
	background-position:center;
	opacity: 0.5;
}


.quests_button span.quest_button_complete_count,
.town_button span.scrap_count
{
	bottom:auto;
	right:15px;
	top:10px;
	margin:0px;
	left:auto;
	font-family: times;
	font-size:40px;
}

.options_button .bg
{
	background-image:url('../images/cards/dream_TradingCard-2024-12-25T113733.307.jpg');
	background-position:center;
	opacity: 0.8;
}

.account_load_container,
.account_name_container
{
	position: absolute;
	left:0px;
	right:0px;
	top:250px;
	text-align: center;
	color:#fff;
	font-size: 30px;
	font-family: 'Caveat Brush', cursive;
	clear:both;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}

.load_account_name,
.load_account_password,
.new_account_password,
.new_account_name,
.raid_code
{
	margin-top:5px;
	width:280px;
	height:48px;
	background-color:rgba(0,0,0,0.2);
	text-align:center;
	border:2px solid #000;
	font-size:30px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	font-family: times;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}

.load_account_button,
.new_account_password_button,
.new_account_name_button
{
	display: inline-block;
	width:180px;
	height:40px;
	padding-top:10px;
	margin-left:20px;
	background-color:rgba(0,0,0,0.2);
	text-align:center;
	border:2px solid #000;
	font-size:30px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	font-family: times;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	cursor: pointer;
}

.backup_enabled
{
	font-family: times;
	font-size: 24px;
}

.external_links
{
	position: absolute;
	bottom:20px;
	left:20px;
}

.external_links,
.external_links a
{
	font-family: arial;
	font-size: 24px;
	font-weight: bold;
	color:#fff;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	text-decoration: none;
}

.owned_decks
{
	position: absolute;
    /*max-height: 380px;*/
    overflow-x: hidden;
    overflow-y: auto;
    /* margin-left: 10px; */
    top: 50px;
    margin: 0px;
    left: 10px;
    right: 10px;
    width: auto;
    bottom: 10px;
}

@media only screen and (max-width:600px) {
	.owned_decks
	{
		text-align: center;
	}
}

.daily_reward_content
{
	text-align: center;
	position: absolute;
	top: 70px;
	bottom: 70px;
	left: 0px;
	right:  0px;
	width: auto;
	margin: 0px;
}

#content_daily_reward .single_reward
{
	display: inline-block;
	margin:3px;
	width: 100px;
    height: 200px;
	border:2px solid rgba(255,255,255,255.3);
	border-radius:3px;
	position: relative;
	box-sizing: border-box;
	padding:5px;

	font-family: arial;
	font-size: 24px;
	font-weight: bold;
	color:#fff;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	text-decoration: none;
	text-align: left;
}

.landscape #content_daily_reward .single_reward
{
	width: 15%;
	height: 25%;
	margin-left: 0.5%;
	margin-right: 0.5%;
}

.portrait #content_daily_reward .single_reward
{
	width: 30%;
	height: 12%;
	margin-left: 1%;
	margin-right: 1%;
}

#content_daily_reward .single_reward.claimed
{
	opacity:0.7;
	border:2px solid rgba(0,0,0,0.3);
}

#content_daily_reward .single_reward .daily_reward_amount
{
	position: absolute;
    left: 0px;
    right: 8px;
    font-size: 35px;
    text-align: right;
    bottom: 8px;
    opacity: 0.5;
}

.claim_daily_reward_button
{
	/*position: absolute;
	bottom:50px;
	left:390px;*/
	display: inline-block;
	width:180px;
	height:40px;
	padding-top:10px;
	margin-top:20px;
	background-color:rgba(0,0,0,0.2);
	text-align:center;
	border:2px solid #000;
	font-size:30px;
	font-weight:bold;
	color:rgba(255,255,255,0.8);
	font-family: times;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	cursor: pointer;
}

.manual_disable
{
	opacity:0.3 !important;
}

#content_card_backs .not_in_collection
{
	opacity: 0.2;
}

#content_card_backs .tinkering_list
{
	text-align: center;
}

.card_back_container
{
	position: relative;
	float:none;
	display: inline-block;
	width:30%;
	height:20%;
	margin-left: 0.5%;
    margin-right: 0.5%;
}

.landscape .card_back_container
{
	width:15%;
	height:50%;
}

.pickable_card_back
{
	box-sizing:border-box;
	float:none;
	width:100%;
	height:100%;
	border:2px solid #000;
	border-radius:5px;
	background-size: cover;
	background-position: center;
	cursor: pointer;
	position: relative;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	display: inline-block;
}

#content_card_backs .not_in_collection .pickable_card_back
{
	border-color:#ccc;
	cursor: default;
	box-shadow: none;
}

.card_back_active
{
	position: absolute;
	font-family: 'Caveat Brush', cursive;
    font-size: 5vw;
    width: 100%;
    height: auto;
    top: 30%;
    text-shadow: 1px 1px 0px rgba(0,0,0,1), 1px -1px 0px rgba(0,0,0,1), -1px 1px 0px rgba(0,0,0,1), -1px -1px 0px rgba(0,0,0,1), 1px 1px 3px rgba(0,0,0,1);
    color: #5f5;
    opacity: 0.8;
    transform-origin: center center;
    transform: rotate(-15deg);
    text-align: center;
}

.game_messages
{
	position: absolute;
	top:0px;
	left:0px;
	right:0px;
	height:0px;
	z-index:100000;
	overflow: visible;
	text-align: center;
}

.game_messages .message_container
{
	box-sizing: border-box;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	transform-origin:center top;
	margin:auto;
	width:90%;
	max-width: 700px;
	overflow:hidden;
	padding:5px;
	max-height:100px;
	display: inline-block;
}

.game_messages .message
{
	box-sizing:border-box;
	position: relative;
	margin:auto;
	width: 90%;
	max-width:600px;
	height:auto;
	background-color:rgba(255,255,255,0.5);
	border-radius:10px;
	padding:5px;
	font-weight:bold;
	box-shadow:3px 3px 5px rgba(0,0,0,0.5);
}

.game_messages .message_container.not_shown
{
	/*transform:scale(1,0);*/
	/*height:0px;
	padding-top:0px;
	padding-bottom:0px;*/
	max-height:0px;
	padding:0px;
}

.game_messages .message_title
{
	color:#fff;
	font-family: times;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
	font-size:16px;
	font-weight:bold;
}

.loading_backup_message
{
	position: fixed;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	background-color: rgba(0,0,0,0.7);
	display:none;
	z-index:1000000;
}

.loading_backup_text
{
	position: fixed;
	top:150px;
	left:0px;
	right:0px;
	font-size:40px;
	color:#fff;
	font-weight: bold;
	font-family: arial;
	text-align:center;
}

.saving_message
{
	position: absolute;
	left:0px;
	bottom:0px;
	padding:10px;
	background-color:rgba(0,0,0,0.5);
	font-size:16px;
	color:#fff;
	font-weight: bold;
	font-family: arial;
	text-shadow: 1px 1px 0px rgba(0,0,0,1), 1px -1px 0px rgba(0,0,0,1), -1px 1px 0px rgba(0,0,0,1), -1px -1px 0px rgba(0,0,0,1), 1px 1px 3px rgba(0,0,0,1);
	display: none;
}

@media only screen and (max-width:624px) {
  /*body {
    background-color: #000;
    padding:0px;
	margin:0px;
	min-width:100vw;
	min-height:auto;
	height:100vh;
	overflow:hidden;
  }*/
  /*.main_window
  {
  	box-shadow: none;
  	max-width:100%;
	border:none;
	border-radius:0px;
	width:100%;
	height:100vh;
	overflow:auto;
	margin:0px;
  }*/

	.page_container
	{
		overflow:auto;
	}

	/*.merchant_button,
	.arena_button,
	.quests_button,
	.options_button,
	.deck_edit_button,
	.random_battles_button,
	.town_button,
	.campaigns_button
	{
		font-size:0px;
		box-sizing:border-box;
		display:inline-block;
		float:none;
		height:250px;
		width: 23%;
		min-width:210px;
		margin-left: 0.5%;
    	margin-right: 0.5%;
		margin-bottom:5px;
		margin-top:0px;
   	 	border-radius:8px;
    		overflow: hidden;
    		background-color:rgba(0,0,0,0.8);
	}*/

	/*.random_battle_button
	{
		width: 31%;
		min-width:230px;
		margin-left: 0.5%;
    	margin-right: 0.5%;
		margin-bottom:5px;
		margin-top:10px;
		float:none;
		vertical-align: top;
	}

	.random_battles_buttons,
	.home_buttons_container
	{
		text-align:center;
		padding-bottom:20px;
		width:100%;
		margin:0px;
	}

	.last_save
	{
		position: fixed;
		right:30px;
	}

	#content_rewards .rewards_button
	{
		width:48%;
		float:none;
		display: inline-block;
		margin:0.5%;
	}*/
}

@media only screen and (max-width:600px) {

	/*.random_battle_button
	{
		width: 90%;
		height:320px;
		min-width:0px;
		margin-left: 0%;
    	margin-right: 0%;
		margin-bottom:5px;
		margin-top:10px;
		float:none;
		vertical-align: top;
	}*/
}

.single_upgrade_container
{
	color: #fff;
	font-size: 24px;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}

.all_save_icons
{
	position: fixed;
	bottom: 0px;
	right: 0px;
	z-index: 1000;
	text-align: right;
}

.saving_icon
{
	display: inline-block;
	width: 3px;
	height: 10px;
	border-radius: 3px;
	margin-right: 2px;
	background-color: rgba(255,255,255,0.5);
}

.saving_icon.save_good
{
	background-color: rgba(0,255,0,0.5);
}

.saving_icon.save_danger
{
	background-color: rgba(250,150,0,0.5);
}

.saving_icon.save_bad
{
	background-color: rgba(255,0,0,0.5);
}

.importexport_input
{
	width:80%;
	height:50px;
	margin-bottom:10px;
	text-align: center;
}

.stats_container
{
	padding-top:30px;
	font-family: 'Caveat Brush', cursive;
	color:#fff;
	font-size:24px;
	line-height: 1.5;
	text-shadow:1px 1px 0px rgba(0,0,0,1),1px -1px 0px rgba(0,0,0,1),-1px 1px 0px rgba(0,0,0,1),-1px -1px 0px rgba(0,0,0,1),1px 1px 3px rgba(0,0,0,1);
}

.stats_title
{
	padding-top:20px;
	clear:both;
	width:100%;
	text-align: center;
}

.left_stats
{
	clear:both;
	float:left;
	width:48%;
	text-align: right;
}

.right_stats
{
	float:right;
	width:48%;
	text-align: left;
}