input,
.btn-link,
textarea
	{
		border: 1px solid #777;
		color: white;
		font-family: "Verdana";
		background-color: #000;
		border-radius: 2px;
		outline:none;
		padding: 2px 4px;
	}

.btn-link,
input[type="submit"],
input[type="button"]
	{ 
		padding: 4px 10px;
	}
textarea 
	{ 
		border-radius: 3px; 
		padding: 4px 6px;
	}


input:hover,
.btn-link:hover,
textarea:hover
  	{
		border: 1px solid #888;
		background-color: #000;
  	}
input:focus,
input:active,
.btn-link:focus,
.btn-link:active,
.textarea:focus,
.textarea:active
  	{
		border: 1px solid #c9c9c9;
		background-color: #000;
  	}
input[disabled],
input[disabled]:hover,
textarea[disabled],
textarea[disabled]:hover,
select[disabled],
select[disabled]:hover
  	{
		border: 1px solid #555 !important;
		opacity: 0.8 !important;
		box-shadow: none !important;
		background-color: #000 !important;
		cursor: default !important;
  	}
input[disabled] + label,
input[disabled]:hover + label,
textarea[disabled] + label,
textarea[disabled]:hover + label
  	{
		opacity: 0.8;
	}
	  
input.inp-num.invalid
	{
		border-color:rgb(224, 62, 62);
	}
  

.btn-link:link,
.btn-link:visited,
.btn-link:hover,
.btn-link:active
	{
		color: white;
		display: inline-block;
		margin-right: 10px;
		text-decoration: none;
	}
.btn-link.disabled
	{
		color: #777;
	}

input:hover,
input:active,
textarea:hover,
textarea:active,
.btn-link:hover,
.btn-link:active,
select:hover,
select:active,
.form-control:hover,
.form-control:active,
.form-control.is-valid:hover,
.form-control.is-valid:focus,
.form-control.is-invalid:hover,
.form-control.is-invalid:focus,
.glow
	{
	  	box-shadow: #444 0px 0px 8px 2px;
	}
  

input.btn-submit
	{
		padding: 2px 15px;
	}

input[type="submit"],
input[type="button"]
	{
		cursor: pointer;
		padding: 2px 10px;
	}

input.inp-num
	{
		width: 80px;
	}
input.inp-upgrade
	{
		width: 400px;
    }
    
input.inp-num + label,
.link-max
	{
		color: #222;
		font-size: 12px;
		margin-left: 5px;
		cursor: pointer;
		text-decoration: underline;
		display: inline-block;
		margin-bottom: 0px;
	}

input.inp-num:hover + label, input.inp-num:hover + label,
.link-max:hover, .link-max:active 
	{
		color: #333;
    }
input.inp-num:disabled + label,
input:disabled + label.link-max
	{
		cursor: default;
	}
input.inp-num:disabled:hover + label,
input:disabled + label.link-max:hover
	{
		color: #222;
	}
    
input[type='submit']:disabled,
input[type='button']:disabled
	{
		cursor: default;
	}

input[type="checkbox"].chk-item
	{
		position: relative;
		top: 2px;
		width: 14px;
		height: 14px;
		left: 28px;
		cursor: pointer;
		padding: 0px;
		margin: 0px;
	}

input[type="checkbox"].chk-item + label
	{
		display: block;
		border-radius: 2px;
		cursor: pointer;
		margin-top: -5px;
		background-color: #111;
		border: 1px solid #333;
		color: white;
		font-size: 13px;
		display: inline-block;
		padding: 3px 5px 3px 30px;
		/* width: 400px; */
		text-align: left;
	}
input[type="checkbox"].chk-item:checked + label
	{
		background-color: #222;
	}

input[type="checkbox"].chk-single
	{
		transform: scale(1.2);
	}

.sel-int
	{
		width: 50px;
	}
.sel-items
	{
		width: 200px;
	}


select
	{
		border: 1px solid #777;
		/* font-weight: normal;
		font-size: 10pt; */
		color: white;
		font-family: "Verdana";
		background-color: #000;
		border-radius: 2px;
		outline:none;
		padding: 2px 4px;
		cursor: pointer;
	}
select:hover
	{
		border: 1px solid #888;
	}
select:active
	{
		border: 1px solid #c9c9c9;
	}

.nores { resize: none; }

textarea.alliance_description
	{
		min-height: 150px;
		max-height: 200px;
	}
textarea.alliance_profile
	{
		min-height: 200px;
		max-height: 800px;
	}



.opt-status,
.opt-kick
	{
		background-color: #111;
		border: 1px solid #333;
		height: 25px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 0px;
		border-collapse: separate;
		border-radius: 3px;
		float: right;
	}
.opt-toggle
	{
		background-color: #111;
		border: 1px solid #333;
		height: 25px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 0px;
		border-collapse: separate;
		border-radius: 3px;
		width: 100px;
	}

.opt-status { width: 180px; }
.opt-kick { width: 108px; }

.opt-status input[type="radio"],
.opt-kick input[type="radio"],
.opt-toggle input[type="radio"]
	{
		display: none;
	}

	

.opt-status input[type="radio"] + label,
.opt-kick input[type="radio"] + label,
.opt-toggle input[type="radio"] + label
	{
		height: 100%;
		text-align: center;
		margin: 0px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: transparent;
		border-style: solid;
		border-width: 1px;
		border-color: #222;
		cursor: pointer;
	}
.opt-status input[type="radio"]:hover + label,
.opt-kick input[type="radio"]:hover + label,
.opt-toggle input[type="radio"]:hover + label
	{
		box-shadow: #444 0px 0px 8px 2px;
	}

.opt-status input[type="radio"].selectable + label,
.opt-kick input[type="radio"].selectable + label,
.opt-toggle input[type="radio"].selectable + label
	{ 
		color: #fff; 
	}
.opt-status input[type="radio"].none + label,
.opt-kick input[type="radio"].none + label,
.opt-toggle input[type="radio"].none + label 
	{ 
		color: #555; 
	}

.opt-status input[type="radio"].selectable + label { width: 40%; }
.opt-status input[type="radio"].none + label { width: 20%; }

.opt-kick input[type="radio"].selectable + label { width: 67%; }
.opt-kick input[type="radio"].none + label { width: 33%; }

.opt-toggle input[type="radio"].selectable + label { width: 50%; }

.opt-status input[type="radio"].success:checked + label,
.opt-kick input[type="radio"].success:checked + label,
.opt-toggle input[type="radio"].success:checked + label
	{
		background-color: rgb(0, 58, 13);
		border-color: rgb(93, 221, 99);
		border-radius: 3px 0px 0px 3px;
	}
.opt-status input[type="radio"].none:checked + label,
.opt-kick input[type="radio"].none:checked + label,
.opt-toggle input[type="radio"].none:checked + label
	{
		background-color: #222;
		border-color: #333;
		border-radius: 0px;
		color: #555;
	}
.opt-status input[type="radio"].danger:checked + label,
.opt-kick input[type="radio"].danger:checked + label,
.opt-toggle input[type="radio"].danger:checked + label
	{
		background-color: rgb(61, 1, 1);
		border-color:  rgb(250, 89, 89);
		border-radius: 0px 3px 3px 0px;
	}
.opt-status input[type="radio"].warning:checked + label,
.opt-kick input[type="radio"].warning:checked + label,
.opt-toggle input[type="radio"].warning:checked + label
{
	background-color: rgb(122, 84, 0);
	border-color: rgb(255, 200, 47);
	border-radius: 0px 3px 3px 0px;
}

.opt-toggle input[type="radio"].danger + label,
.opt-toggle input[type="radio"].danger:checked + label
	{
		border-radius: 2px 0px 0px 2px;
	}
.opt-toggle input[type="radio"].success + label,
.opt-toggle input[type="radio"].success:checked + label
	{
		border-radius: 0px 2px 2px 0px;
	}


input[type="radio"]:disabled + label,
input[type="radio"]:disabled:hover + label
	{
		box-shadow: none;
		cursor: default;
	}

.opt-status input[type="radio"]:disabled + label,
.opt-kick input[type="radio"]:disabled + label,
.opt-toggle input[type="radio"]:disabled + label,
.opt-status input[type="radio"]:disabled:hover + label,
.opt-kick input[type="radio"]:disabled:hover + label,
.opt-toggle input[type="radio"]:disabled:hover + label
	{
		box-shadow: none;
		cursor: default;
	}

/* input.member-check+ label:first-child 
	{
		border-right: 1px solid #333;
	}
input.member-check+ label:last-child 
	{
		border-left: 1px solid #333;
	} */

.characters-left
	{
		float: right;
		color: #777;
		font-style: italic;
		font-size: 10px;
		margin-top: -2px;
	}

.form-control,
.form-control:focus,
.form-control.is-valid,
.form-control.is-valid:focus,
.form-control.is-invalid,
.form-control.is-invalid:focus
	{
		background-color: black !important;
		padding: 2px 4px !important;
		height: 24px;
		color: white;
		outline: none;
		display: inline-block;
	}
.form-control,
.form-control.is-valid,
.form-control.is-invalid
	{
		border: 1px solid #777;
		outline: none;
	}
.form-control:hover,
.form-control.is-valid:hover,
.form-control.is-invalid:hover
	{
		border: 1px solid #888;
	}
.form-control:focus,
.form-control.is-valid:focus,
.form-control.is-invalid:focus,
.form-control:active,
.form-control.is-valid:active,
.form-control.is-invalid:active
	{
		border: 1px solid #c9c9c9;
	}

.valid-feedback,
.invalid-feedback
	{
		margin: 1px 0px -3px 5px;
		display: inline-block;
	}
.validator-notice
	{
		margin: 2px 0px -2px 0px;
		display: inline;
		font-size: 10px;
	}
.validator-notice p
	{
		font-size: inherit;
		margin-bottom: -2px;
	}
.form-control + label	
	{
		display: block;
	}

.is-valid,
.valid-feedback,
.is-invalid,
.invalid-feedback
	{
		display: inline !important;
	}

input.alliance_name
	{
		width: 250px;
	}
input.alliance_tag
	{
		width: 100px;
	}
input.username
	{
		width: 160px;
	}
input.email
	{
		width: 250px;
	}
input.password
	{
		width: 250px;
	}
select
	{
		width: 180px;
		max-width: 250px;
	}
select.select_race
	{
		width: 180px;
		max-width: 180px;
	}

.required
	{
		position: relative;
	}
.required::before
	{
		content: '*';
		position: absolute;
		top: 0px;
		right: -10px;
		font-size: inherit;
		color: red;
	}

textarea
	{
		width: 100%;
	}

textarea.message
	{
		height: 100px;
	}

pre
	{
		overflow: initial;
		word-wrap: break-word;
		word-break: break-all;
	}

select.auto
	{
		width: auto;
	}

.custom-control-input+label::before,
.custom-control-label+label::after,
.custom-control-label:checked+label::before,
.custom-control-label:checked+label::after
	{
		transform: scale(1.5);
	}

.gold_calculator
	{

	}
.gold_calculator .res_spending
	{
		font-size: 13px;
	}
.gold_calculator .res_left,
.gold_calculator .res_bank
	{
		font-size: 14px;
	}
.gold_calculator img
	{
		width: 40px;
	}
.gold_calculator .box
	{
		display: flex;
	}
.gold_calculator .box .left
	{
		/* flex: calc(100% - 70px); */
		width: calc(100% - 40px);
	}
.gold_calculator .box .right
	{
		/* flex: 1; */
		width: 40px;
	}

input[type="checkbox"].toggle_bank
	{
		display: none;
	}
input[type="checkbox"].toggle_bank + label
	{
		color: #dc3545;
		font-size: 16px;
		margin: 0px;
		text-align: center;
		font-weight: bold;
		cursor: pointer;
	}
input[type="checkbox"].toggle_bank:checked + label
	{
		color: #28a745;
	}













.opt-check input[type="checkbox"],
.opt-check input[type="radio"]
{
	display: none;
}


.opt-check input + label,
.opt-check.grouped input + label
{
	height: 100%;
	text-align: center;
	margin: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: black;
	border-style: solid;
	border-width: 1px;
	border-color: #222;
	cursor: pointer;
	padding: 0px 10px;
}

.opt-check input:hover + label,
.opt-check.grouped input:hover + label
{
	box-shadow: #444 0px 0px 8px 2px;
}


.opt-check input.selectable + label,
.opt-check.grouped input.selectable + label
{
	color: #fff;
}

.opt-check input.none + label,
.opt-check.grouped input.none + label
{
	color: #555;
}

.opt-check input.none:checked + label,
.opt-check.grouped input.none:checked + label
{
	background-color: #222;
	border-color: #333;
	border-radius: 0px;
	color: #555;
}
.opt-check input.success:checked + label,
.opt-check.grouped input.success:checked + label
{
	background-color: rgb(0, 58, 13);
	border-color: rgb(93, 221, 99);
	border-radius: 3px 0px 0px 3px;
}

.opt-check input.danger:checked + label,
.opt-check.grouped input.danger:checked + label
{
	background-color: rgb(61, 1, 1);
	border-color:  rgb(250, 89, 89);
	border-radius: 0px 3px 3px 0px;
}

.opt-check input.primary:checked + label,
.opt-check.grouped input.primary:checked + label
{
	background-color: var(--col-primary-bg);
	border-color:  var(--col-primary-l);
	border-radius: 0px 3px 3px 0px;
}

.opt-check input.warning:checked + label,
.opt-check.grouped input.warning:checked + label
{
	background-color: rgb(122, 84, 0);
	border-color: rgb(255, 200, 47);
	border-radius: 3px 0px 0px 3px;
}
.opt-check input.standard:checked + label,
.opt-check.grouped input.standard:checked + label
{
	background-color: rgb(59, 59, 59);
	border-color: rgb(226, 226, 226);
	border-radius: 3px 0px 0px 3px;
}

.opt-check input:disabled + label,
.opt-check.grouped input:disabled + label
{
	box-shadow: none;
	cursor: default;
}


.opt-check, .opt-check.grouped
{
	background-color: transparent;
	border: 0px solid #333;
	height: 25px;
	display: flex;
	flex-direction: row;
	justify-content: left;
	align-items: center;
	padding: 0px;
	border-collapse: separate;
	border-radius: 3px;
	width: auto;
}

.opt-check input[type="checkbox"],
.opt-check.grouped input[type="checkbox"]
{
	display: none !important;
	position: relative !important;
	top: 0px;
	left: 0px !important;
}
.opt-check.show input[type="checkbox"],
.opt-check.grouped.show input[type="checkbox"]
{
	display: initial !important;
	position: relative !important;
	top: 0px;
	left: 20px !important;
}
.opt-check input[type="checkbox"] + label,
.opt-check.grouped input[type="checkbox"] + label
{
	/* box-shadow: none; */
	cursor: pointer;
	padding: 12px 10px 12px 10px;
	margin-right: 0px;
	border-radius: 2px;
	/* width: 300px; */
	/* height: 50px; */
}
.opt-check.show input[type="checkbox"] + label,
.opt-check.grouped.show input[type="checkbox"] + label
{
	cursor: pointer;
	padding: 12px 10px 12px 25px;
	margin-right: -13px;
	border-radius: 2px;
}
.opt-check.show input[type="checkbox"] + label
{
	margin-right: -2px !important;
}
.opt-check input[type="checkbox"] + label
{
	margin-right: 10px !important;
}
.opt-check.grouped input[type="checkbox"] + label
{
	margin-right: 0px !important;
}
.opt-check.grouped.show input[type="checkbox"] + label
{
	margin-right: -13px !important;
}
.opt-check input[type="checkbox"] + label,
.opt-check input[type="checkbox"]:checked
{
	border-radius: 2px !important;
}

.opt-check.grouped input + label,
.opt-check.grouped input:checked + label
{
	border-radius: 0px !important;
}
.opt-check.grouped input.opsta + label,
.opt-check.grouped input.opsta:checked + label
{
	border-radius: 2px 0px 0px 2px !important;
}
.opt-check.grouped input.opend + label,
.opt-check.grouped input.opend:checked + label
{
	border-radius: 0px 2px 2px 0px !important;
}
.opt-check.grouped input.opsin + label,
.opt-check.grouped input.opsin:checked + label
{
	border-radius: 2px !important;
}


.opt-check.opt-expand input + label {
	padding: 20px 30px !important;
	font-size: 20px !important;
}