* {
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "segoe ui", roboto, oxygen, ubuntu, cantarell, "fira sans", "droid sans", "helvetica neue", Arial, sans-serif;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 2;
}
body {
background-color: #1a1a1d;
    background-image: linear-gradient(To right, #000000
, #614b3e);   /* background-color: #FBFCE5;
    background-image: linear-gradient(to bottom right, #F5B915, #6A4E8A);*/
}
.skillblock, .spellblock, .itemblock {
    float: left;
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 5px;
}
    .itemblock .card-text div p
    {
        display:inline;
    }
    .myaccount.alert {
        display: none;
    }
.ui-tabs-vertical .ui-tabs-panel
{
}
.ui-tabs .col-md-9
{
}
.ui-tabs-vertical .ui-tabs-nav li a
{
	display:block;
	width: 100%;
	
}
.xptotal,.mwstotal
{
	float:right;
}
.ui-tabs .col-md-10
{
	padding-left:15px;
	padding-right:0px;
}
.ui-tabs-vertical .ui-tabs-nav { padding: .2em .2em .2em .2em; float: left; width: 12em; }
  .ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 1px !important; margin: 0 -1px .2em 0; }
    .ui-tabs-vertical .ui-tabs-nav li a {
        display: block;
        white-space: normal;
        float: none;
    }
  .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; }

.clearfix
{
	clear:both;
}

#tabs, #tabsspells {
    border: none;
}
.hiddenflow
{
    overflow:hidden!important;
}
.skillblock .card-header, .spellblock .card-header {
    border-bottom: none;
}
.totaalXPVerdiend, .totaalMWSVerdiend, .totaalEPVerdiend, .totaalHPVerdiend, .totaalsoulVerdiend {
    display: inline-block;
}
.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 15px;
    margin: 0 auto;
    background-color: #ffffff;
}
.form-signin .checkbox {
  font-weight: 400;
}
.form-signin .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.btn-secondary {
    background-color: #99c68E;
    border-color: #99c68E;
}
.navrow
{
    padding-right:0px;
}
footer {
    margin-top: 50px;
    padding-top: 20px;
    /*background-color: #8C2C00;*/
    color: #fff;
}
		.fullbackground {
    /*background: url(../Images/a-clear-sky-at-night-2885320.jpg) no-repeat center center fixed;*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height:100%;
}
.main
{
    clear:both;
}
    .main .container {
        min-height: 500px;
        /*background: #FFF8DC;*/
        background: #fff;
        padding-top: 20px;
        padding-bottom: 20px;
        border: 2px solid #614b3e;
        border-radius: .25rem;
        box-shadow: 0 0 10px #333;
    }
header {
    background: none; /*#8c001a*/
}
    header .container {
       /*#8c001a*/
    }
    .main footer .container {
        min-height: 0px;
    }
.navbar
{
    width:100%;
    padding-right:0px;
}
#navbarSupportedContent {

    background-image: linear-gradient(#8c7b73, #614b3e);
    border: 2px solid #614b3e;
    border-radius: .25rem;
    box-shadow: 0 0 10px #333;
    border-width: 2px;
    border-style: solid;
    border-radius: .25rem;
    padding-right: 10px;
}
.navbar-light .navbar-nav .show > .nav-link
{
    color:#d2c1b5;
}
.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show {
    color: #d28e5f;
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: #d28e5f;
}
.dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item.active {
    color: #d28e5f;
    background: #FFF;
}
.nav-item {
    background-image: linear-gradient(#8c7b73, #614b3e);
    color: #d2c1b5;
}
.navbar-light .navbar-nav .nav-link {
    color: #d2c1b5;
}
.dropdown-menu {
    background-image: linear-gradient(#8c7b73, #614b3e);
    color: #d2c1b5;
}

    .dropdown-menu .dropdown-item {
        /*background-color: #8c7b73;*/
        color:#d2c1b5;
    }
.form-group.has-error .help-block.nored {
    color: #212529;
}
.form-group.has-error .help-block {
    color: red;
}
.container .bg-light {
    background:none !important;
}

h1 {
    /*water*/
    /*color: #0e0fe1 !important;*/
    line-height: 1.5 !important;
}
h2 {
    /*fire*/
    /*color: #eb0404 !important;*/
    line-height: 1.5 !important;
}
h3 {
    /*air*/
    /*color: #86c4d4 !important;*/
    line-height: 1.5 !important;
}
h4 {
    /*nature*/
    /*color: #138f3a !important;*/
    line-height: 1.5 !important;
}
h5 {
    /*aarde*/
    /*color: #7d583e !important;*/
    line-height: 1.5 !important;
}
h6 {
    /*air*/
    /*color: #a349a3 !important;*/
    line-height: 1.5 !important;
}

.submitRow .form-group {
    display: inline-block;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }
option:checked:disabled {
    background-color: red!important;
}
option:disabled {
    background-color: #acacac;
}

input:checked + .slider {
    background-color: #d2c1b5;
}
input:disabled + .slider {
    background-color: #afafaf;
}

input:disabled:checked + .slider {
    background-color: #8c7b73;
}


input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}
.navbar-light .navbar-nav .dropdown-menu .nav-link:focus, .navbar-light .navbar-nav .dropdown-menu .nav-link:hover {
    background-color: #fff;
}
.btn-primary:hover {
    background-image: linear-gradient(#614b3e, #8c7b73);

    border-color: #614b3e;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    background-color: #99c68E;
    border-color: #99c68E;
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.btn-success {
    background-image: linear-gradient(#8c7b73, #614b3e);
    border-color: #614b3e;
}
.btn.fa.fa-info.btn-primary
{
    color: #fff;
}

.btn-success:hover {
    background-image: linear-gradient(#614b3e,#8c7b73);
    border-color: #614b3e;
}
    .page-item.active .page-link, .btn-primary {
        background-image: linear-gradient(#8c7b73, #614b3e);
        border-color: #614b3e;
    }
footer .btn-secondary {
    background-image: linear-gradient(#8c7b73, #614b3e);
    border-color: #614b3e;
}

    footer .btn-secondary:hover {
        background-image: linear-gradient(#614b3e,#8c7b73);
        border-color: #614b3e;
    }
.page-link {
    color: #1a1a1d;
}
    .page-link:hover {
        color: #1a1a1d;
    }
.btn-danger {
    background-color: #d28e5f;
    border-color: #d28e5f;
}

a {
    color: #1a1a1d;
}

    .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
        background-color: #614b3e;
        border-color: #614b3e;
    }

#sortable1 input, #sortable3 input, #sortable5 input {
    display: none;
}

#sortable2 input, #sortable4 input, #sortable6 input {
    display: inline-block;
}

#sortable1, #sortable2, #sortable3, #sortable4, #sortable6, #sortable5 {
    border: 1px solid #eee;
    min-height: 20px;
    list-style-type: none;
    margin: 0;
    padding: 5px 0 0 0;
}

    #sortable1 li, #sortable2 li, #sortable3 li, #sortable4 li, #sortable5 li, #sortable6 li {
        margin: 0 5px 5px 5px;
        padding: 5px;
        font-size: 1.2em;
    }
.bootstrap-select{

}
    .bootstrap-select .dropdown-menu .dropdown-item {
        background: #fff;
        color: #8c001A;
    }
    .bootstrap-select .dropdown-menu .selected {
        background-image: linear-gradient(#8c7b73, #614b3e);
        
        color: #fff;
    }
    .bootstrap-select .dropdown-menu .disabled {
        background: #cecece;
        color: #000;
    }

.bootstrap-select .dropdown-menu {
    background: #fff;
}
.list-group-item.active {
    color: #fff;
    background-image: linear-gradient(#8c7b73, #614b3e);

    border-color: #614b3e;
}

    .list-group-item.active a {
        color: #fff;
        /*background-image: linear-gradient(#8c7b73, #614b3e);*/
    }
a:hover {
    color: #1a1a1d;;
}
.before-table
{
    margin-bottom:20px;
}
#hiddenform
{
    display:none;
    margin-bottom:20px;
}
.profileimg
{

    margin-bottom: 20px;
}
    .profileimg a {
        vertical-align: top;
    }
#hiddenform .btn-success
{
    margin-top:20px;
}
.card-deck
{
    margin-bottom:20px;
}
.AantalSkillField
{
    display:inline;
    width:60px;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}
.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important;
  color: #ffffff;
}
.table thead th
{
    vertical-align:top;
}
.tablefilter
{
    display:none;
    width:100%;
}
.tablefilter.show
{
    display:block!important;
}
.showfilterrow
{
    
}
/* Medium devices (landscape tablets, 768px and up) */
@media (max-width: 768px) {
    .before-table
    {
        clear:both;

        margin-top:20px;
    }
}

@media print {
   header
   {
       display:none;
   }
   footer
   {
       display:none;
   }

}
.DoNotShow
{
    display:none!important;
}
.searchForm
{
    width:180px;
}
    .searchForm input 
    {
     width:100% !important;   
    }
.relativeContainer
{
    position:relative;
}
.floatingbadge
{
    position:absolute;
    top:3px;
    right:-8px;
}

#tabs.berichtenTabs
{
  	border:1px solid #c5c5c5;
  	padding:0px;
}

#tabs.berichtenTabs .ui-tabs-nav
{
  	border:none;
  	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
 	border-bottom: 1px solid #c5c5c5;
  	background:none;
  	padding:0px;
}
#tabs.berichtenTabs .ui-tabs-nav li
{
  	margin-top:0px;
  	border:none;
  	margin: 0;
    border-radius: 0px;
}
#tabs.berichtenTabs .ui-tabs-nav li.ui-tabs-active
{
  	padding:0px;
}

.messageHeader
{
    position:relative;
}
    .messageHeader .newMessage
    {
        position:absolute;
        top:5px;
        right:5px;
        color:#fff;
    }
#tabs.berichtenTabs button.fa {
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;

}

#tabs.berichtenTabs .unread{
    font-weight:bold;
}
.messageaccount .right{
    float:right;
    margin-left:10px;
}
@media (min-width: 768px) and (max-width: 1200px) 
{
    .Skilllist .col-md-2 {
    width: 100%;
    max-width: 100%;
    }
    .SpellList .col-md-2 {
    width: 100%;
    max-width: 100%;
    }
}

.DependingOnSettings
{
    display:none;
}
.rowinfoblock
{
    display:block;
}

.main .container{ background-color: #d2c1b5; }
#tabs{ background-color: #d2c1b5; }