* {
    box-sizing: border-box;
  }

html, body {
    min-height: 100%;    
    background-color: #f6fbff;
    display: flex;
    width: 100%;
    height:100%;
    flex-wrap: wrap;
    overflow:hidden;
    top: 0px!important; /* For google translate bar */
}
/* Modal nested */

.send-back {
    z-index:-1!important;
}


.page-content:not(.role-admin) .admin-only {
    display: none;
}
#data-table td {
    vertical-align: middle;
}
/* Modal nested */

.summernote {
    min-height:10rem;
}

.table-responsive {
    margin-top:50px;
}

thead {
    position: absolute;
    width: 100%;
    display: table;
    margin-top: -50px;
}

#page-sidebar {
    margin:0;
    flex-direction: column;
    max-width:14rem;
    background: #ffffff;
    color: #020202;
    overflow: hidden;
    text-align:center;
    min-height:100%;
    box-shadow: -1px 0px 3px 2px #fdd8d8;
}

.nav-link {
    color:#4b7ca7;
}
.hidden {
    display: none;
}


.page {
    display: flex;
    flex: 1;
    flex-direction: column;
    text-align:center;
    overflow-x:auto; /* Bootstrap table fix */
    position: relative;
}


.page-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    flex: 1 0 0px;
    min-height: 0;
    padding-top: 60px;
}
.page-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 60px;
    position: absolute;
    color: #603a33;
    width: 100%;
    background: #ffffff;
}

.sidebar-tab {
    align-items: center;
    text-align: left;
    justify-content: space-between;
     cursor: pointer;
     min-height:7vh;
}

.page.shifted {
    margin-right: -14rem;
}

.sidebar-tab img {
    width: 1.3em;
}

.cp {
    cursor:pointer;
}
.app-gradient, .btn-primary {
    background-image: linear-gradient(to right, #9e795a, #6c3826);
}
.app-gradient.sidebar-tab {
    color: white;
}
.btn-primary {
    color: #fff;
   
    border-color: #997254;
}
.sidebar-tab:not(.app-gradient):hover {
    background: #dcc1ab;
    font-size:107%;
    font-weight: bold;
    opacity: .85;
}

footer.footer {
    display: flex;
    align-self: center;
}

.sidebar-holder {
    height: 0px;
    flex: 1 1 auto;
    overflow: hidden auto;
}
.id-photo {
    width: 3rem;
    height: 3rem;
    display: flex;
    border-radius: 50%;
    cursor:pointer;
    padding: .15rem;
    border: 1px solid #ccc;
    opacity: 0.95;
}
.id-photo:hover {
    opacity: 1;
}
.id-photo img {
    width:100%;
    border-radius:50%;
}
 .content-map {
        flex-grow: 1;
        min-height: 400px;
    }
@media (max-width: 768px) { 
    .content-map {
        flex-grow: 1;
        min-height: 800px;
    }
 }
.sorter {
    display: inline-block;
    margin-left: .25rem;
}
/* Login css */
.login-card {
    max-width: 400px;
    width: 80%;
    min-width: 350px;
    justify-content: center;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.page_login {
    background: url('../images/login_bg.png');
    background-size: cover;
}
.page_login footer {
    color: white!important;
}

.input-group-text {
    background: #997254;
    color: white;
}
.htxt {
    direction:rtl;
}

/* Admin */



.page_machines .file-list div {
    cursor: pointer;
    padding: 5px;
    border: 1px solid #9b7557;
    margin: 5px;
    background: #ece5e2;
}
.file-list div:hover {
    background:#9b7557;
    color:white;
}