input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input::-webkit-calendar-picker-indicator {
  display: none;
}

.header_banner {
	background: #000 url('/paladins/assets/img/img_header.png') no-repeat center center;
}

.filter ul,
#cardFilter,
#search{
	font-family: Bulletproof, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
	#cardFilter select{
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	}

.filter ul:last-child {
	position: static;
	top: auto;
	right: auto;
}
	.filter ul li,
	#search{
		font-variant: normal;
	}
	#search{
		font-size: 14px;
	}

.queue ul li {
    padding: 15px 0.93em;
}
.queue ul li.paladinsMode {
    background: #111;
    border: 1px solid #111;
}

#godList{
	min-height: 600px;
}
	#godList li{
		padding: 12.7px;
		font-size: 14px;
	}
		#godList li img,
		#godList li span {
			width: 90px;
			max-width: 90px;
		}

.filter.roles{
	display: inline-block;
	position: absolute;
	right: 35px;
}

#queue #godList li div:first-child {
    max-width: 90px;
}

#cards{
	color: #999;
	margin-bottom: 10px;
}
	#cards .card{
		display: inline-block;
		box-sizing: border-box;
		border-bottom: 1px solid #000;
		width: 300px;
		padding: 10px;
	}
		#cards .card .cardPopularity{
			color: #ccc;
		}
		#cards .card canvas{
			background: #fff;
		}

.popularityBar{
    box-sizing: border-box;
    border: 1px solid #fff;
	height: 20px;
	font-size: 0;
}
	.popularityBar div{
		box-sizing: border-box;
		display: inline-block;
		height: 100%;
	}
	.popularityBar div:not(:first-child){
		border-left: 1px solid #fff;
	}
	.points1{
		background: #47FF4F;
	}
	.points2{
		background: #47B1FF;
	}
	.points3{
		background: #D946FF;
	}
	.popularityBar,
	.points4{
		background: #FFE026;
	}
	
#cardFilter{
	position: relative;
	text-align: right;
	font-size: 14px;
    margin: 10px 25px;
    color: #999;
}

	#cardFilter ul li div{
		position: relative;
		display: inline-block;
		margin: 5px 0;
	}
		#cardFilter ul li div#cardSearch{
			position: absolute;
			margin: 0;
		}
		#cardFilter ul li div#cardSearch div{
			margin: 0;
		}
	
	#cardFilter select,
	#cardFilter input{
		vertical-align: middle;
		height: 38px;
		box-sizing: border-box;
		background: #1b1b1b;
		border: 1px solid #111;
		color: #fff;
		letter-spacing: 2px;
		padding: 10px;
	}
	#cardFilter input{
		margin-left: 10px;
	}
	#cardFilter span{
		padding: 0 10px;
	}
	
		#cardFilter input[type=number]{
			width: 50px;
			text-align: right;
		}
	
		#cardFilter input[type=submit]{
			background: #444;
			border: none;
			border-top: 1px solid #fff;
			margin-top: 5px;
			color: #fff;
			-webkit-transition:	background 100ms linear;
			   -moz-transition:	background 100ms linear;
					transition:	background 100ms linear;
		}
		#cardFilter input[type=submit]:hover{
			background: #438cbf;
		}
	
	#cardFilter select{
		-webkit-appearance:none;
		   -moz-appearance:none;
				appearance:none;
	}
	
	#cardFilter ul li{
		position: relative;
	}
	
	#cardFilter ul li .button{
		box-sizing: border-box;
		position: absolute;
		right: -38px;
		top: 8px;
		width: 32px;
		height: 32px;
		padding: 7px;
		font-size: 0;
		opacity: 0.6;
		background: transparent url('../img/icon_plus.png') no-repeat center center;
		background-size: 18px 18px;
		-webkit-transition:	background-color 100ms linear;
		   -moz-transition:	background-color 100ms linear;
				transition:	background-color 100ms linear;
	}
	
	#cardFilter ul li .button:hover{
		background-color: #438cbf;
		opacity: 1;
		cursor:pointer;
		cursor:hand;
	}
	
	#cardFilter ul li:not(:first-child) .button{
		background: transparent url('../img/icon_cross.png') no-repeat center center;
		background-size: 18px 18px;
		-webkit-transition:	background-color 100ms linear;
		   -moz-transition:	background-color 100ms linear;
				transition:	background-color 100ms linear;
	}
	
	#cardFilter ul li:not(:first-child) .button:hover{
		background-color: #cc0000;
	}
	
	#cardFilter .filterError{
		background-color: rgb(85, 27, 27);
	}

#cardFilter datalist{
	color: #ccc;
	font-size: 12px;
	background-color: #262626;
	border: 1px solid #ccc;
}
	#cardFilter datalist option{
		padding: 10px;
		-webkit-transition:	background 100ms linear;
		   -moz-transition:	background 100ms linear;
				transition:	background 100ms linear;
	}
	#cardFilter datalist option:hover{
		color: #fff;
		background: #438cbf;
	}

@media (max-width: 1000px){
	.filter.roles{
		position: static;
	}
	.filter ul {
		display: inline-block;
	}
}
