.modal .playlist {
  display: flex;
  flex-direction: column;
}

.modal .video-sharing-container {
  margin-bottom: 25px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
}

.modal .video-sharing {
  cursor: pointer;
  display: inline-flex;
  text-decoration: none !important;
  outline: none !important;
  color: #000;
  flex-direction: column;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 13px;
  margin-right: 13px;
}

.modal .video-sharing img {
  width: 60px;
  height: 60px;
  margin-bottom: 5px;
}

.modal + .modal-backdrop {
  z-index: 16000 !important;
}

.modal.custom-domain .modal-header {
  display: flex;
  justify-content: center;
  width: 100%;
}

.modal.custom-domain .modal-body {
  display: flex;
  align-items: center;
  width: 100%;
  flex-direction: column;
}

.modal.custom-domain .modal-body p {
  align-self: flex-start;
}

.modal.custom-domain .modal-body img {
  width: 140px;
  margin-bottom: 45px;
}
.mainVideo {
    display:flex;
    width:100%;
    height: 100%;
    justify-content: center;
    align-content: center;
}

.minivideo {
    border: solid rgb(32, 32, 32) 1px;
    width:250px;
    display:inline-block;
    margin:0px;
    max-width: 50vw;
    background-color: black;
    display: flex;
    align-items: stretch;
    flex-direction:column;
    height: 100%;
    min-height: 100%;
}

.minivideoContainer {
    max-height: 250px;
    display: flex;
    align-items: stretch;
    flex-direction:row;
}

.minivideoText {
    display: flex;
    height: 100%;
    min-height: 3em;
    max-height: 3em;
    color: white;
}

.allVideoContainer {
    display: flex;
    flex-flow: column;
    height: calc(100vh - 50px);
    max-height: calc(120vw - 50px);
    background-color: black;
}

.calendarContainer {
    display: flex;
    align-content: center;
    max-width:100%;
    flex-direction: column;
    max-height: 70vh;
    overflow: auto;
    width: 100%;
    border: solid #666 1px;
}

.calendarInfoDiv {
    display: flex;
    flex-direction: row;
}

.calendarInfoDiv {
    overflow: hidden;
}

.calendarDetailsContainer {
    margin: 5px;
}


.entryWrapper {
    overflow-y: visible;
    height: 4em;
    width: 100%;
}

.entryWrapper:last-child, .entryWrapper:hover, .entryWrapper.lastCard {
    overflow-y: visible;
    height: 10em;
}

.calendarCard {
    right:0%;
    min-width: 10em;
    height: 3em;
    border-radius: 0.2em;
    border: solid #666 1px;
    background-color: rgb(255, 255, 255);
    padding: 0.25em;
  
    display: flex;
    flex-direction: column;
    align-items: normal;
}

.dayBreak {
    margin-top: 0;
    margin-bottom: 0;
}

.timeBreak {
    margin-top: 0;
    margin-bottom: 0;
}

.calendarThumbnail {
    width: 10em;
    object-fit: contain;
    object-position: top;
}

.calendarIntroduction {
    height: auto;
    width: auto;
    color:white;
    text-align: center;
}

.calendar-entry {
    display: flex;
    color: red;
}/* Override `.vjs-menu li { text-transform: lowercase; }`, from video-js.css */
#peertube-plugin-chapters-menu li {
	text-transform: none;
}

#peertube-plugin-chapters-menu {
	width: max-content;
	max-width: 18em;
	max-height: 20em;
}

#peertube-plugin-chapters-menu li:not(:first-child) {
	padding-left: 1em;
	padding-right: 1em;
	text-align: left;
}
#json-categories-as-text {
  border: 1px solid #c6c6c6;
  color: var(--textareaForegroundColor);
  padding: 5px 15px;
  background-color: var(--markdownTextareaBackgroundColor);
  font-family: monospace;
  font-size: 13px;
  border-bottom: 0;
  border-radius: 3px 3px unset unset;
  width: 100%;
}

#json-categories-as-text.error {
  border-color: red;
  color: red;
  border-bottom: 1px solid;
}

#categories-table th {
  border-color: currentcolor;
  border-bottom: none;
  border: var(--submenuBackgroundColor);
  border-bottom: 1px solid var(--submenuBackgroundColor);
  padding: 5px;
  font-weight: 600;
  color: var(--mainForegroundColor);
}

#categories-table tr {
  outline: 0;
  background-color: var(--mainBackgroundColor);
}

#categories-table tbody tr:nth-child(odd) {
  background-color: var(--submenuBackgroundColor);
}

#categories-table td {
  padding: 5px;
}

#categories-table .category__deleted {
  text-decoration: line-through;
  color: red;
}

#categories-table .category__added {
  color: green;
}