/* Styles */
#search-wrap {
	transition: height .5s ease;
	overflow  : hidden;
	width: 100%;
	background: #4a4a4a;
}

#search-wrap:not(.active) {
	display: none;
}

.search-form {
	margin: 0 auto;
	padding: 20px 0 15px 0;
	display: table;
}

.search-wrap-off { display: none; }

.search-bar input {
	padding: 10px;
	margin: 0;
	height: 20px;
	width: 500px;
	border:1px solid #eaeaea;
	outline:none;
}

.search-bar input[name=q] {
	width: calc(100% - 170px);
	height: 26px;
	padding: 5px 10px 5px 10px;
	border: none;
	font-size: 16px;
	border-bottom: 2px solid #dae1e3;
}

.search-bar input[type=submit] {
	float: right;
	width: 130px;
	height: 36px;
	border-radius: 2px;
	background: #EE1C23;
	border: 1px solid #EE1C23;
	color: white;
	cursor: default;
	font-size: 14px;
	font-weight: bold;
	padding: 0 16px;
}

@media (max-width: 500px) {
	.search-bar input[type=submit] {width: 80px;}
	.search-bar input[name=q] {width: calc(100% - 120px);}
}

.servers-to-search-mobile select:hover,
.search-bar input[name=q]:hover { border-color: grey;}

.search-bar input[type=submit]:hover { border-color: #9e2126; background: #9e2126; cursor: pointer;}
.search-bar input:focus, .servers-to-search-mobile select:focus { border-color:#EE1C23 !important; }

.search-servers-title, .search-often-title {
	padding-top: 20px;
	padding-bottom: 5px;
	color: #d0cfcf;
	font-weight: bold;
	text-align: left;
	display: inline-block;
	width: 49%;
}

.search-servers, .search-often {
	display: inline-block;
	width: 49%;
	color: white;
	vertical-align: top;
}

.search-often a {
	/*text-transform: capitalize;*/
	margin-right: 10px;
	color: white;
	height: 10px;
	white-space: nowrap;
}

.search-often #queries a:nth-child(1) { font-size: 18px }
.search-often #queries a:nth-child(2) { font-size: 13px }
.search-often #queries a:nth-child(3) { font-size: 15px }
.search-often #queries a:nth-child(4) { font-size: 12px }
.search-often #queries a:nth-child(5) { font-size: 16px }
.search-often #queries a:nth-child(6) { font-size: 18px }
.search-often #queries a:nth-child(7) { font-size: 12px }
.search-often #queries a:nth-child(8) { font-size: 16px }

.search-often #queries {
	height: 76px;
	overflow: hidden;
}

.search-often #queries {
	display: block;
}

.input-container {
	display: inline-block;
	width: 48%;
	padding: 0.5%;
}

.input-container label {

}

.input-container input[type=radio] {
	width: 15px;
	height: 15px;
}

@media (max-width: 900px) {
	.search-wrap {
		padding: 20px 14px 20px 14px;
		
	}
	

	.input-container {
		display: inline-block;
		/*width: 30%;*/
		padding: 0.5%;
	}

	.search-often #queries {
		height: auto;
	}
}

@media (max-width: 750px) {
	.input-container {
		display: inline-block;
		width: 48%;
		padding: 0.5%;
	}
}

@media (max-width: 650px) {
	.input-container {
		width: 98%;
		padding: 1%;
	}
}

@media (max-width: 540px) {
	.search-form {
		padding-left:20px;
		padding-right:20px;
	}
}

@media (max-width: 450px) {
	.search-often-title {
		display: none;
	}
	.search-often,
	.search-servers {
		width: 100%;
	}
	
	.search-often {
		border-top: 1px solid white;
		margin-top: 10px;
		padding-top: 10px;
	}
	
	.input-container {
		width: 47%;
	}
}