/* RESPONSIVE GRID (MODIFIED) */
/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
	height: 100%;
	overflow: hidden;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 0.1% 0 1% 0.5%;
	height: 100%;
	overflow: auto;
}

.col:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}
                                               
					
/*  GRID OF THREE  */
.span_3_of_3 {
	width: 32%;
}
.span_2_of_3 {
	width: 34.5%;
}
.span_1_of_3 {
	width: 32.5%;
}

/* CSS */
	
	.right_wrapper, .left_wrapper  {
		width: 100%;
		max-height: 100%;
		clear: both;
	}
	
	.right_container, .left_container {
		width: 100%;
		max-height: 100%;
		overflow: auto;
		clear: both;
	}


	.pkmnclicks_container {
		clear: both;
		display: inline-block;
	}

	html, body {
		margin: 0;
		height: 100%;
		width: 100%;
	}
	* {
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;		
	}
	
	body {
		font-size: 16px;
		font-family:'proxima-nova','Helvetica Neue','Free Sans',Calibri,'Droid Sans',Helvetica,Arial,sans-serif;
	}

	.header a:link {
		color:#fff;
	}
	
	.header a:visited {
		color:#fff;
	}
	
	.header a:hover {
		color:#c0c0c0;
	}
	
	.header a:active {
		color:#fff;
	}

	.header {
		width: 100%;
		color: #fff;
		background: #333333;
		font-size:8pt;
		clear:both;
		max-height: 32px;
	}

	#game {
		position: absolute;
		top: 32px;
		left: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		padding: 0;
	}

	.status {
		position: fixed;
		bottom: 5px;
		right: 35%;
		left: 35%;
		color: #000;
		font-size: 8pt;
		text-align: center;
		min-height: 12px;
		max-height: 5%;
		overflow: auto;
	}

	#status {
		display: none;
	}
	
	.container, .container_nohide {
		clear: both;
		text-align: left;
		background: #fff;
		margin: 5px;
		padding: 10px;
		border: 1px solid #c0c0c0;
		overflow: auto;
	}

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

	#achievements, #stats, #bought_upgrades {
		display: none;
	}

	#boxlist, #inventorylist {
		overflow: auto;
		margin-left: -10px;
		margin-right: -10px;
		margin-bottom: 10px;
		padding: 10px;
		max-height: 150px;
	}
	
	#achievementslist, #upgrades_list{
		margin: 0 auto;
	}	
	
	.achievement, .upgrade {
		margin-bottom: -4px;
		width: 64px;
		height: 64px;
		display: inline-block;
		cursor: pointer;
	}

	.achieve0, .achieve1, .achieve2, .achieve3, .achieve4, .achieve5 {
		background-image: url('images/icons.png');
		width: 64px;
		height: 64px;
		display: inline-block;
	}
	
	.achieve0 {background-position: 0px 128px;}
	.achieve0:hover {background-position: 0px 64px;}
	.achieve1 {background-position: -64px 128px;}
	.achieve1:hover {background-position: -64px 64px;}
	.achieve2 {background-position: -128px 128px;}
	.achieve2:hover {background-position: -128px 64px;}
	.achieve3 {background-position: -192px 128px;}
	.achieve3:hover {background-position: -192px 64px;}
	.achieve4 {background-position: -256px 128px;}
	.achieve4:hover {background-position: -256px 64px;}
	.achieve5 {background-position: -320px 128px;}
	.achieve5:hover {background-position: -320px 64px;}
	
	#achievedesc i, #upgrade_desc i  {
		font-weight: bold;
		font-style: normal;
	}
	
	#item {
		width: 96px;
		height: 96px;
		position: absolute;
		display: none;
		background: center no-repeat;
		clear:both;
		cursor: pointer;	
	}

	.clicks_container {
		font-weight: bold;
		font-size: 18pt;
		color: #c0c0c0;
		clear: both;
	}

	#clicks {
		font-size:28pt;
		color: #000;
	}

	#pkmn {
		background-repeat: no-repeat;	
		background-position: 0px 0px;
		margin: 0 auto;	
	}	
	
	#Spheal, #Sealeo, #Walrein, #shinySpheal, #shinySealeo, #shinyWalrein {
		background-repeat: no-repeat;	
		background-position: 0px 0px;
		margin: 0 auto;
		cursor: pointer;		
	}

	.pokemon_hitbox {margin: 5px;}
	
	#Spheal{background-image:url('images/spheal.png');width:160px;height:136px;}
	#shinySpheal{background-image:url('images/shinyspheal.png');width:160px;height:136px;}

	#Sealeo{background-image:url('images/sealeo.png');width:270px;height:188px;}
	#shinySealeo{background-image:url('images/shinysealeo.png');width:270px;height:188px;}

	#Walrein{background-image:url('images/walrein.png');width:288px;height:276px;}
	#shinyWalrein{background-image:url('images/shinywalrein.png');width:288px;height:276px;}

	#Spheal:hover,#shinySpheal:hover{background-position: 0px -136px;}
	#Sealeo:hover,#shinySealeo:hover{background-position: 0px -188px;}
	#Walrein:hover,#shinyWalrein:hover{background-position: 0px -276px;}
	
	#Spheal:active,#shinySpheal:active{background-position: 0px -272px;}
	#Sealeo:active,#shinySealeo:active{background-position: 0px -376px;}
	#Walrein:active,#shinyWalrein:active{background-position: 0px -552px;}

	.Sphealicon, .Sealeoicon, .Walreinicon, .inventory_item {
		cursor: pointer;
		display:inline-block;
		min-width: 32px;
		min-height: 32px;
		width: 32px;
		height: 32px;	
		margin: 2px;
		background-position: 0px;		
	}
	
	.Sphealicon:hover, .Sealeoicon:hover, .Walreinicon:hover, .inventory_item:hover {
		background-position: 0 2px;		
	}
		
	.Sphealicon {
		background-image: url('images/boxicons/spheal.png');
	}

	.Sealeoicon {
		background-image: url('images/boxicons/sealeo.png');
	}

	.Walreinicon {
		background-image: url('images/boxicons/walrein.png');
	}

	.autoclicker {
		padding: 5px;
		cursor: pointer;
		clear: both;
		border: 1px solid #c0c0c0;	
		background: #fff;
		margin: 5px;
	}

	.autoclicker:hover {
		background: #DBDBDB;
	}
	
	.autoclicker img {
		height: 48px;
		width: 48px;
		margin-right: 5px;
		margin-top: 5px;
		margin-bottom: 5px;
		clear: both;
		display: inline-block;
		opacity: 0.8;
		vertical-align: top;
	}

	.autoclicker a {
	}

	.autoclicker a:hover {
		text-decoration: underline;
	}

	.autoclicker a:active {
		font-weight: bold;
		text-decoration: underline;
	}

	.autoclicker:hover img {
		opacity: 1;
	}
	
	#autoclicker_info {
		display: inline-block;
	}

	.autoclicker:hover #autoclicker_options {
		display: block;
	}
	
	#autoclicker_options {
		display: none;
	}

	.wildpkmn{
		width: 100px;
		height: 38px;
		position: absolute;
		clear:both;
		display: none;
		cursor: pointer;
	}
	
	#wildspheal {
		background: url('images/wildspheal.gif') center no-repeat;
	}
	
	#wildshinyspheal {
		background: url('images/wildshinyspheal.gif') center no-repeat;
	}
	
	.swimcont{
		width: 128px;
		height: 128px;
		position: absolute;
		display: none;
		clear: both;
		cursor: pointer;
	}

	#counter {
		color: #000;
		margin-top: 40px;
		width: 100%;
		text-align: center;
		background: #fff;
		padding: 2px;
		border: 1px solid #c0c0c0;
	}