/* Nav Divider */
.vr {
	margin-left: 20px;
	margin-right: 20px;
}

b, h1, h2, h3, h4, h5 {
	color: white;
}

h2 {
	padding-top: 5px;
}

sub {
	margin-top: 0px;
	top: -10px;
	margin-bottom: 10px;
}

.accordion-header>a {
	text-decoration: none;
}

.accordion {
	--bs-accordion-color: rgb(201 209 217);
	--bs-accordion-btn-color: rgb(201 209 217);
	--bs-accordion-bg: #141719;
	--bs-accordion-btn-bg: #141719;
	--bs-accordion-border-color: black;
	--bs-accordion-active-bg: background-color: #141719;;
	--bs-accordion-active-color: white;
	margin-bottom: 16px;
}


.navbar-dark {
	backdrop-filter: blur(5px);
}

.opacity-90 {
	background-color: #191D21;
	/*  opacity: 0.5;
	backdrop-filter: blur(5px);*/
}

.table-dark {
	--bs-table-bg: #141719;
	color: rgb(201 209 217);
	opacity: 0.9;
}

.nav-item.active a {
	color: white;
}

.dropdown-item.active, .dropdown-item:focus {
	background-color: #23282D;
	border-radius: 4px;
}

.table-active {
	--bs-table-accent-bg: #22272B;
}

h1,h2,h3 {
	color: white;
}


.table-responsive {
	border-radius: 5px;
}


.scrolling-wrapper {
	overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
}

#changelog {
	height: 300px;
	padding-left: 10px;
	
	border-style: solid;
	border-color: grey;
	border-width: 1px;
	border-radius: 5px;
	margin: 5px;
	padding-bottom: 5px;
	
	box-shadow: 1px 1px 3px grey;
}

.hspacer {
	padding-left: 30px;
}

#changelog>p {
	height:288px;
    overflow: auto;
}


.category {
	border-radius: 1px;
	padding: 2px;
	text-align: center;
	max-width: 8em;
}
.damage {
	background-color: rgb(153, 20, 28);
}
.utility {
	background-color: rgb(112,22 ,181 );
}
.buff {
	background-color: rgb(131, 124 ,1 );
}
.healing {
	background-color: rgb(0, 103, 28);
}
.debuff {
	background-color: rgb(156, 63, 10);
}
.summonC {
	background-color: rgb(80, 80, 80);
}

.detailsdisplay > td {
	padding-bottom: 20px;
	padding-left: 20px;
}

.summon {
	border: 1px solid white;
	margin: 10px 0px;
	padding: 20px;
}

/* für die zwei Columns*/
.c_races {
	width: 300%;
}

#nav_spacer {
	height: 60px;
}

@media (max-width: 767px) /* @grid-float-breakpoint -1 */
{
    .fixed-top
    {
    position: relative;
    top: auto;
    }
	#nav_spacer {
	height: 0px;
	}
	#c_races {
	width: 100%;
	}
}


.Arrow {
	font-size: 120%;
}


#mechanusIcon {
	margin-top: -5px;
}


.custom_img-fluid {
	max-width: 4em;
	height: auto;
}

.cust_grid > .col {
	border-style: solid;
	border-color: grey;
	border-width: 1px;
	border-radius: 5px;
	margin: 5px;
	padding-bottom: 5px;
	
	box-shadow: 1px 1px 3px grey;
}

.cust_reminder > .col {
	border-style: solid;
	border-color: grey;
	border-width: 1px;
	border-radius: 5px;
	margin: 5px;
	padding-bottom: 0px;
	margin-bottom: 30px;
	
	box-shadow: 1px 1px 3px grey;
}

.cust_reminder > .col > p, .cust_reminder > .col > ul > li {
	font-size: 13px;
	margin-bottom: 3px;
}



.customlink {
	color: rgb(149,196,249);
	text-decoration: none;
}
.customlink:hover {
	text-decoration: none;
	color: rgb(74,156,249);
}

.customtooltip {
	color: rgb(149,249,249);
	text-decoration: none;
}

.custom-tooltip.tooltip > .tooltip-inner {
    text-align: left;
    max-width: 500px;
    font-size: 1rem;
	
}

.customtooltip:hover {
	text-decoration: none;
	color: rgb(74,156,249);
}

label {
	margin-right: 20px;
}

button.btn-info>a {
	text-decoration: none;
	color: white;
}

#buttons>button.btn-info {
	margin: 10px;
}

body {
	color: rgb(201 209 217);
	background-color: #010409;
}


hr {
	border-color: white;	
}




/* ------------------*/
/* DataTables stuff  */
/* ------------------*/

.pagedisplay .pagination>li>a,
.pagedisplay .pagination>li>span {
  border: 1px solid black;
}
.pagination>li>a {
	background: #141719;
	color: rgb(201 209 217);
  	border: 1px solid black;
  
	user-select: none;
  	-webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */
}

.pagination>li.active>a.page-link {
  background: #22272B;
  border: 1px solid black;
  color: #fff;
}

.pagination>li.disabled>a.page-link {
  background: rgb(70,70,70);
  border: 1px solid black;
  color: rgb(30,30,30);
}

.padding {
	padding-top: 5px;
}

.small h6 {
	font-size: 14px;
}

.pagination>li>a:hover {
	background: black;
  	color: #fff;
}

#DataTable_wrapper {
	padding-top: 4px;
}

.form-control, .form-control:focus, .form-select, .form-select:focus {
	background-color: #141719;
	border-color: black;
	color: rgb(201 209 217);
}

/* ------------------*/
/* END DataTables stuff  */
/* ------------------*/


/* Show/Hide Stuff */

.shown {
	color: white;
}


.showdetails:hover {
	cursor: pointer;
}

.showdetails {
	user-select: none;
	-webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */
}

.nodisplay {
	display: none;
}

.custombutton {
    width: 20px !important;
	height: 20px !important;
	font-size: 10px;
	line-height: 10px;
	text-indent: -3px;
}


/* Monster page */
.toright {
	margin-right: -20px;
	margin-top: 6px;
}

.maintable {
	padding-top: 10px;
}

.monsterpadding {
	padding-top: 10px;
}