:root {
  --layout-fs: 0;
  --layout-xs: 360px;
  --layout-sm: 576px;
  --layout-ld: 640px;
  --layout-md: 768px;
  --layout-lg: 992px;
  --layout-xl: 1200px;
  --layout-xxl: 1400px;
  --layout-xxxl: 2000px;
  --control-height-normal: 36px;
  --control-height-mini: 20px;
  --control-height-small: 26px;
  --control-height-medium: 30px;
  --control-height-large: 40px;
  --control-height-largest: 54px;
}
:root {
  --default-background: #fff;
  --default-color: #191919;
  --default-color-hover: #000000;
  --default-background-disabled: #f7f8fa;
  --default-color-disabled: #c9ccd6;
  --body-background: var(--default-background);
  --body-color: var(--default-color);
  --body-color-secondary: #a2a5b1;
  --border-color: #e8e8e8;
  --link-color: #5a87cb;
  --link-color-hover: #0056B3FF;
  --selected-color: #1FB1F8FF;
  --selected-row-background: #f5f8fe;
  --selected-item-background: #d4e2ff;
}
.dark-side {
  --default-background: #1e1f22;
  --default-color: #dbdfe7;
  --default-color-hover: #dbdfe7;
  --default-background-disabled: #343637;
  --default-color-disabled: #54565a;
  --body-background: var(--default-background);
  --body-color: var(--default-color);
  --body-color-secondary: #c0c0c0;
  --border-color: #4a4d51;
  --link-color: #4493f8;
  --link-color-hover: #2771d1;
  --selected-row-background: #26282e;
  --selected-item-background: #2e436e;
}
body {
  background-color: var(--body-background);
  color: var(--body-color);
}

#page-content {
    height: calc(100dvh - 52px);
    width: calc(100% - 2px);
    display: flex;
    flex-direction: column;
    z-index: 1;
    padding: .5rem;
}

/* Header */
.app-header {
    padding: 10px 80px 20px;
    text-align: left !important;
	width: 100%;
	
}
.app-header h1 {
    margin: 0;
    font-size: 48px;
    font-weight: 300;
    line-height: 1;
	width: 100%;
    text-align: left !important;
}

.custom-tile-grid {
	margin-left: 80px;
	margin-right: 80px;
}


.breadcrumbs {
	margin-left: 80px !important;
	margin-right: 80px !important;
	margin-bottom: 10px !important;
	padding: 0px;
}

.slide-stage {
	height: calc(100dvh - 125px) !important;
	width: 100%;
	margin: 0px;
	padding: 0px;
	display: flex;
	align-items: center;
    justify-content: center;
}

.slide-viewer{
	height: 100% !important;
	width: 100% !important;
	padding: 0px;
}


.slide-container {
	height: 100% !important;
	width: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #111;
	margin: 0px !important;
	padding: 0px !important;
	overflow: hidden;
}

.slide {
	width: 100%;
	height: 100%;
	margin: auto;
	padding: 0px;
	display: none;
    
}

.slide img,
.slide video {
    width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.slide.active {
	display: flex;
	align-items: center;
    justify-content: center;
}