#divLoading {
    display: flex;
    justify-content: center;
    align-items: center;
}



#borderdiv {
    border: 5px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    /*background-color:white;*/
    flex-wrap: wrap;
}

#div1 {
    display: none;
}

.AdminOverViewKachelnflex {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-grow: 1;
    padding: 5px;
    background: #ccc;
    border: 1px solid #bbb;
    font-size: 24pt;
    color: #666;
    max-width: 355px;
    width: 30%;
    margin-bottom: 20px;
    margin-right: 0px;
}

/*.flex1 {
    flex-grow: 1;
    width: 30%;
}*/



.span {
    
    width: 15%;
    color: black;
}

.flex1 {
    flex-grow: 1;
    width: 24%;
    margin-right: 20px;
    margin-bottom: 2px;
    margin-left:auto;
    margin-right:auto;
}

.flex2 {
    padding-left: 14px;
}



    .flex2 p {
        font-size: 10pt;
        line-height: 8pt;
        color: #000;
        margin: 0px 0 -0.3vw;
    }

.flex2 {
    flex-grow: 1;
    width: 70%;
}
/*.AdminOverViewKachelnflex > DIV {
  margin:2px;
  padding:8px;
  background:#ccc;
  border:1px solid #bbb;
  font-size:24pt;
  color:#666;
  width: 13%;



}*/

.col > table > thead > tr > th {
    width: 13%;
}


.main-dunkel {
    background-color: #6b7b82;
    color: #f0e8e1;
}

.main-dunkel-jumbo {
    background-color: #5c6a70;
    color: #f0e8e1;
}

    .main-dunkel-jumbo > h2 > small {
        color: #e5d8cc;
    }


.navbar-nav > li:hover {
    background-color: #5c6a70;
    color: #f0e8e1;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #f0e8e1;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #5c6a70;
    color: #f0e8e1;
}

.main-hell {
    background-color: #b5b2b4;
}

.offcolor-dunkel {
    background-color: #b66e65;
    color: #f0e8e1;
}

.offcolor-hell {
    background-color: #ddc0be;
}

.main-color {
    color: #f0e8e1;
}

.modal-content {
    background-color: #b5b2b4;
}

.modal-header {
    border-bottom: 1px solid #6b7b82;
}

.modal-footer {
    border-top: 1px solid #6b7b82;
}

    .modal-footer .btn + .btn {
        color: #6b7b82;
    }

/* Removing navigation bar margin */
.navbar {
    margin-bottom: 0;
}

/* Properties for a larger button */
.btn-xl {
    padding: 18px 28px;
    height: 30vh;
    /*width: 33vw;*/
    width: 100%;
    font-size: 22px;
    background-color: #6b7b82;
    color: #f0e8e1;
    line-height: normal;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

    .btn-xl:hover {
        background-color: #5c6a70;
        color: #f0e8e1;
    }

.btn-xlm {
    padding: 18px 28px;
    height: 10vh;
    width: 100%;
    font-size: 22px;
    background-color: #6b7b82;
    color: #f0e8e1;
    line-height: normal;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.btn {
    background-color: #6b7b82;
    color: #f0e8e1;
}

    .btn:hover {
        background-color: #5c6a70;
        color: #f0e8e1;
    }

th {
    background-color: #6b7b82;
    color: #f0e8e1;
}

    th > a > span {
        color: #f0e8e1;
    }

        th > a > span:hover {
            color: #ddc0be;
        }

td > span:hover {
    color: #b66e65;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #cdcbcd;
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    border-top: 1px solid #5c6a70;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .active > a {
    color: #5c6a70 !important;
    text-shadow: 0 1px 0 #6b7b82 !important;
}

    .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
        color: #5c6a70;
    }

.navbar-default .navbar-nav > li > a {
    color: #f0e8e1;
    text-shadow: 0 1px 0 #000;
}

    .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
        color: #f0e8e1;
    }

.dropdown-menu > li > a {
    color: #f0e8e1;
}

.navbar-brand, .navbar-nav > li > a {
    color: #f0e8e1 !important;
    text-shadow: 0 1px 0 black !important;
}

.tablehoverable {
    background-color: #6b7b82;
    color: #f0e8e1;
}

    .tablehoverable:hover {
        background-color: #5c6a70;
        color: #f0e8e1;
    }

.tablehoverablepro {
    background-color: #6b7b82;
    color: #f0e8e1;
}

    .tablehoverablepro:hover {
        background-color: #5c6a70;
        color: #f0e8e1;
    }

.not-clickable {
    pointer-events: none;
    cursor: default;
}

.btn-xlm:hover {
    background-color: #5c6a70;
    color: #f0e8e1;
}

#statusConsole {
    padding-top: 2vh;
}

.modal-body {
    padding: 15px;
}

#tablescroll1 {
    overflow: hidden;
    width: 100%;
    height: 80vh;
}

#tablescroll2 {
    width: 110%;
    height: 79vh;
    overflow-y: scroll;
}

.tablCell {
    text-align: justify;
    white-space: pre;
    width: 100%;
}

mark {
    background-color: midnightblue;
    color: white;
}

.progress-bar-def {
    background-image: linear-gradient(to bottom, #bfbfbf 0%, #a6a6a6 100%);
    background-repeat: repeat-x;
}

.progress span {
    text-align: center;
    width: 100%;
}

.navbar-default .navbar-toggle {
    border-color: #5c6a70;
}

.navbar-default {
    border-color: transparent;
}

#bookingsCont {
    padding-top: 50px;
}

#overviewCont {
    padding-top: 50px;
}

#projectsCont {
    padding-top: 50px;
}

#helperCont {
    padding-top: 50px;
}

.btn-pin {
    width: 48px;
    height: 48px;
    text-align: center;
    font-size: 30px;
    margin: 5px 5px 5px 5px;
    line-height: 48px;
    background-color: #6b7b82;
    color: #f0e8e1;
    float: left;
    border-radius: 1em;
}

.pin-left {
    margin-left: 15px;
}

.btn-pin:hover {
    background-color: #5c6a70;
    color: #f0e8e1;
}

.pin-input {
    margin-left: 15px;
    margin-bottom: 10px;
    width: 164px;
}

.btn-del {
    background-color: #5c6a70;
}

    .btn-del:hover {
        background-color: #b66e65;
        color: #f0e8e1;
    }

.btn-pindel {
    font-size: 20px;
    background-color: #5c6a70;
}

    .btn-pindel:hover {
        background-color: #b66e65;
        color: #f0e8e1;
    }

img {
    max-height: 100px;
    max-width: 100px;
    width: 100%;
    float: left;
}

.f {
    float: left;
    width: 50%;
    height: 25%;
    margin-right: 0px;
}

.AdminName {
    height:50%;
}

@media only screen and (max-width: 1090px) {
    .AdminName {
    height:35%;
}
  .f {
    width:100%;
    height:16.25%;
  }
  .f p {
      margin-top:0px;
  }
  
}


    .AdminOverViewKachelnflex {
      font-size: 2vw;
      min-height:200px;
      min-width:225px;
}

@media only screen and (min-width: 1600px) {
    .AdminOverViewKachelnflex {
        font-size: 1.6vw;
    }
}

@media only screen and (max-width: 1000px) {
    .AdminOverViewKachelnflex {
        font-size: 2.2vw;
    }
}

@media only screen and (max-width: 800px) {
    .AdminOverViewKachelnflex {
        font-size: 3vw;
    }
}