/*
 * Base structure
 */

#maincontainer {
    display: flex;
    position: relative;
}

#mainmenu {
    width: 10em;
    color: #9d9d9d;
    border-color: #080808;
    background-color: #222;
    flex-grow: 0;
    flex-shrink: 0;
    min-height: 100vh;
    position: fixed;
    padding: 10px;
    z-index: 1000;
}

@media (min-width: 767px) {
    .navbar {
        display: none;
    }
    .menuhidden {
      display: none;
    }
}

@media (max-width: 768px) {
    #mainmenu {
        display: none;
    }
}

#mainmenu hr {
    border-top: 1px solid #9d9d9d;
    margin: 10px 0 10px 0;
}

#mainmenu li {
    padding: 2px 4px 2px 4px;
    width: 100%;
}

#mainmenu li.active {
    background-color: #666;
}

#mainmenu li a {
    display: inline-block;
    width: 100%;
    color: #9d9d9d;
    text-decoration: none;
}

#mainmenu li.active a {
    color: white;
}

.menu-title a {
    font-size: 20px;
    color: #9d9d9d;
    text-decoration: none;
    padding: 0 4px 0 4px;
}

.menu-subtitle a {
    color: #9d9d9d;
    text-decoration: none;
    padding: 0 4px 0 4px;
}

.menu-nav {
    list-style: none;
    padding-left: 0;
}

#content {
    flex-grow: 1;
    margin-left: 10em;
    margin-right: 0;
}

.navbar {
    position: sticky;
	top: 0px;
    z-index: 10;
}

.vertical-alignment-helper {
    display:table;
    height: 100%;
    width: 100%;
    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}
.vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events:none;
}
.modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
}
.modal.modal-wide .modal-dialog {
	width: 70%;
}
.modal-wide .modal-body {
  overflow-y: auto;
}
.nav li a {
    outline: none;
}
.show-cursor {
    cursor: pointer;
}
.currency-div {
    float: left;
    margin-top: 0px;
 }
.w10 {
    float: left;
    width: 10px;
    height: 20px;
	margin-left: 10px;
	border-left-style: dotted;
	border-width: 1px;
	border-left-color: #202020;
}
.equipped {
    background-color: #f8f8e0;
}
.inactive {
    background-color: #f0f0f0;
}
.delete-link {
	color: #a06060;
}
.editable {
    cursor: pointer;
    font-weight: bold;
    color: #6080e0;
	border: 0;
}
.table-fixed {
    table-layout: fixed;
}
.table-borderless th,
.table-borderless tr,
.table-borderless td {
    border: 0 !important;
}
.btn-no-padding {
	padding: 0;
	border: 0;
	margin-top: -4px;
	height: 18px;
}
.no-wrap {
	white-space: nowrap;
}
.pos-abs {
	position: absolute;
	margin: 0;
}
#loadingpane {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: white;
	z-index: 10000;
	text-align: center;
}
#loadingtext {
	position: relative;
	top: 40%;
	font-size: 2em;
}
.row-no-padding [class*="col-"] {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* dragging tables */
body.dragging, body.dragging * {
  cursor: move !important;
}

.dragged {
  position: absolute;
  opacity: 0.5;
  z-index: 2000;
}

tr.placeholder {
  position: relative;
}
tr.placeholder:before {
  position: absolute;
}
#tuningLayerDialog #modal-layer-table tbody td{
    vertical-align: middle;
}
#tuningLayerDialog #modal-layer-table tbody td span{
    padding-left: 4px;
}
.tuningLayerOrder {
	cursor: grab !important;
}
.tuningHidden {
	background-color: #00a0f0;
}

.logEntryHeader {
	font-family: monospace;
	font-size: 0.9em;
}
.logEntry {
	font-family: monospace;
	font-size: 0.9em;
}
.logEntry:nth-child(even) {
	background-color: #f0f0f0;
}
.logTimestamp {
	white-space: nowrap;
	vertical-align: top;
}
.logType {
	vertical-align: top;
}
.logVersion {
	vertical-align: top;
}
.logSession {
	vertical-align: top;
}
.logText {
	white-space: wrap;
	word-wrap: break-word;
}
.logTextSingleLine {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.logError {
	color: red;
}
.logWarning {
	color: darkorange;
}
.logVerbose {
  color: #777;
}
.logClient {
	color: #077;
}
.fixed-error-text {
	color:#077
}
.unfixed-error-text {
	color: #C00;
}
.regressed-error-fix {
	background-color: rgb(245, 247, 137);
}
.selected-cell {
	background: #d9edf7;
}
.bigtext {
	font-size: 2em;
}
.biggishtext {
	font-size: 1.5em;
}
.smalltext {
	font-size: 0.75em;
}
.important {
	color: green;
}
.note {
	font-size: 0.75em;
	color: grey;
}
a.disabled {
   pointer-events: none;
   cursor: default;
   color: gray;
}
.error-background {
	background-color: #f88
}
.profile-table {
    margin-bottom: 4px;
}
.profile-item {
    padding: 8px;
    border: solid #f0f0f0;
}
.profile-item > span:first-of-type {
    margin-right: 4px;
    padding: 4px;
}
.profile-item > span:first-of-type:after {
    content: ":";
}
.profile-separator {
    padding: 4px;
}
.profile-accordeon-title {
    font-weight: bold;
    padding-right: 10px;
}
.red-text {
    color: #ff0000
}
.red-bg {
    background-color: #fff0f0;
}
.gold-bg {
    background-color: #fffff0;
}
.green-bg {
    background-color: #f0fff0;
}
.blue-bg {
    background-color: #f0f0ff;
}
.brown-bg {
    background-color: #ecdacc;
}
.white-bg {
    background-color: #ffffff;
}
#auditDiv {
    overflow: scroll;
}
#auditHeader {
	font-size: 0.85em;
    border-bottom: solid gray 1px;
}
#auditHeader th {
    margin: 8px;
    padding: 8px;
}
#auditTable {
    margin: 0px;
	font-size: 0.85em;
}
#auditTable th {
    padding: 0px;
    height: 1px;
}
.auditPinned {
    font-weight: bold;
}
.auditPinned .auditChanges {
    font-weight: normal;
}
.auditChanges {
	font-size: 0.85em;
}
.auditTrackedItem {
	background-color: lightyellow;
	text-align: right;
}
.auditTrackedItem td:first-child {
	text-align: left;
}
.home-stream td {
    padding-left: 0;
}
.home-stream td .buildNumber {
    color: gray;
    font-size: 0.7em;
}
.home-stream img {
    width: 34px;
    height: 34px;
}
.navbarMaintenance {
    background-image: none;
    background-color: darkred;
}
.bold {
    font-weight: bold;
}
#dashboardStatusPane {
    padding-top: 10px;
    padding-bottom: 10px;
    margin: auto;
    text-align: center;
    font-weight: bold;
    font-size: 1.5em;
}
.houseAdSegmentDisabled {
	color: #aaa;
}
.invalidInput {
	border-color: red !important;
}
.invalid-datetime {
	border: 1px solid red;
}
.accordeon-btn {
    margin-top: -6px;
}
.s3HiddenTreeItem {
	display: none
}
.s3-fileupload-invalid {
	background-color: red;
}
.s3-fileupload-done {
	background-color: rgb(106, 255, 47);
}
.msg-sort-header {
	cursor: pointer;
}
.promocodes-code-row {
	cursor: pointer;
}
.promocodes-code-expired {
	background-color: rgb(245, 247, 137);
}
.promocodes-code-row:hover {
	background-color: lightseagreen;
}
#replacableDashboardBlock{
    display: table;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #f4fff4;
    border: 1px dotted #ccc;
}

.event-edit-form > div {
    max-width: 55em;
    display: flex;
    align-items: center;
}

/* spacing utilities */
.m0 { margin: 0 }
.m1 { margin: .25rem }
.ml1 { margin-left: .25rem }
.mr1 { margin-right: .25rem }
.mt1 { margin-top: .25rem }
.mb1 { margin-bottom: .25rem }
.m2 { margin: .5rem }
.ml2 { margin-left: .5rem }
.mr2 { margin-right: .5rem }
.mt2 { margin-top: .5rem }
.mb2 { margin-bottom: .5rem }

/* padding utilities */
.p0 { padding: 0 }
.p1 { padding: .25rem }
.pl1 { padding-left: .25rem }
.pr1 { padding-right: .25rem }
.pt1 { padding-top: .25rem }
.pb1 { padding-bottom: .25rem }
.p2 { padding: .5rem }
.pl2 { padding-left: .5rem }
.pr2 { padding-right: .5rem }
.pt2 { padding-top: .5rem }
.pb2 { padding-bottom: .5rem }

/* buttons */
.btn-default { background-color: #ddd8; background-image: none; }
.btn-primary { background-image: none; }
.btn-secondary { background-image: none; }
.btn-warning { background-image: none; }
.btn-success { background-image: none; }
.btn-danger { background-image: none; }
.btn-info { background-image: none; }

/* bootstrap select */
.bootstrap-select>.dropdown-toggle {
  background-color: inherit;
}