body,
table,
.Head,
.SubHead,
.SubSubHead,
.Normal,
.NormalBold,
.NormalRed,
.NormalTextBox,
.NormalDisabled,
.container,
.grid th,
.grid td,
.gridcat th,
.gridcat td {
  color: black !important;
  font-size: 1rem !important;
  font-family: Arial, Helvetica, sans-serif !important;
}

.grid th,
.gridcat th {
  background-color: #ffe9c0;
  font-size: 1.1rem !important;
}

.grid td,
.gridcat td {
  background-color: #fbeed9;
  font-size: 1rem !important;
}

.grid,
.grid th {
  border: 1px solid black !important;
}

.grid caption {
  color: #777777;
}

.cc-cap-test {
  width:70%;
  text-align: center;
  margin:0 auto;
}

.cc-cap-test p {
  font-size: 2rem!important;
  line-height: 2.4rem!important;
}			  
a,
a:link,
a:visited {
  color: #0033cc;
  text-decoration: underline;
}

.Link {
  text-decoration: underline !important;
}

.pager table {
  margin-left: auto;
  margin-right: auto;
  height: 30px;
  display: table;
  width: auto;
}

.pager > td,
.pager > td > table > tbody > tr > td {
  background-color: transparent !important;
}

[type="submit"] {
  width: 6rem !important;
}

.DNNContainer_Title_h2 h1 {
  display: none !important;
}

.fileUpload {
  overflow: hidden;
  text-overflow: ellipsis;
}

/*Error Message*/

.fileVal,
.error {
  color: red;
  display: block;
  text-align: center;
}
/*Button Color*/
.drkred {
  color: darkred !important;
  font-size: 1.2rem !important;
}

.drkblue {
  color: darkblue !important;
  font-size: 1.2rem !important;
}

.fas.fa-edit,
.fa.fa-save {
  color: #008000 !important;
  font-size: 1.5rem !important;
}

.fas.fa-toggle-off,
.fas.fa-toggle-on,
.fa.fa-times::before {
  color: #ff0000 !important;
  font-size: 1.5rem !important;
}

.grn {
  color: #008000 !important;
  font-size: 1.5rem !important;
}

.fa:hover {
  color: grey;
}

/*Hover over pager*/
.pager > td > table > tbody > tr > td > a:hover {
  color: #000000;
  font-weight: bold;
}

/* Day Of Color Themes */
/* Default Blue */
.calendar-brand {
  background-color: #d8dff0;
  color: #0033cc;
}
summary.calendar-brand + div li {
  color: #2d4074;
}

/*Homepage */
#HompageCalDiv {
  /*max-height: 305px;*/
}

.meeting-list-container {
  container-type: inline-size;
  container-name: meetingListItem;
}

.meeting-list-item {
  list-style: none;
  padding: 0.8rem;
  display: grid;
  grid-template-columns: minmax(9rem, 20rem) 1fr;
  gap: 1.2rem;
  border-bottom: 1px solid gray;
}

.meeting-list-item-date {
  display: grid;
  grid-template-columns: repeat(2, minmax(7rem, 9rem));
  gap: 1rem;
}

@container meetingListItem (max-width: 34rem) {
  .meeting-list-item {
    grid-template-columns: 9rem 1fr;
  }

  .meeting-list-item-date {
    grid-template-columns: 9rem;
    grid-template-rows: 1.1rem;
    gap: 0.5rem;
  }

  .meeting-list-item-category {
    line-height: 1.5;
    text-wrap: balance;
  }
}

.calendar-no-mark summary {
  list-style: none;
  font-family: "Noto Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: bold;
}

.calendar-no-mark summary::before {
  content: "\f078";
  font-family: FontAwesome;
  font-weight: bold;
  margin-right: 0.5rem;
}

.calendar-no-mark[open] summary::before {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: bold;
  margin-right: 0.5rem;
}

.calendar-no-mark a {
  text-decoration: none;
}

.calendar-no-mark summary,
.calendar-no-mark li,
.calendar-no-mark a {
  font-size: 1.3rem;
}

#HompageCalDiv .homepageTableDate,
#HompageCalDiv .homepageTableDetail {
  height: 60px;
  border: 1px solid black;
  vertical-align: middle;
  font-size: 0.928em;
  line-height: 1.21em;
  background-color: white;
}

#HompageCalDiv .homepageTableDate {
  width: 20%;
  text-align: center;
  font-weight: bold;
}

#HompageCalDiv .homepageTableDetail {
  width: 80%;
  text-align: left;
  padding: 0.5em 0.532em !important;
}

#HompageCalDiv .homepageCalendar {
  width: 100%;
  columns: 2;
  border: 1px solid black;
  border-spacing: unset;
  empty-cells: show;
}

#HompageCalDiv .homepageheaderCell {
  border: 1px solid black;
  text-align: center;
  font-size: 0.98em;
  background-color: #4472a6 !important;
  margin-top: 40px !important;
  padding: 3px 5px;
}

#HompageCalDiv a.hompagelink,
#HompageCalDiv a.hompagelink:hover {
  text-decoration: none;
  color: white !important;
}

/* Promo Image CSS*/
.MeetingPromoContainer {
  margin-top: 35px;
  /* margin-bottom: -35px; */
}

/* .MeetingPromoDiv .MeetingPromoImage {
  border: 1px solid rgb(204, 204, 204);
  border-image: none;
  width: 260px;
  height: 110px;
} */

.MeetingPromoDiv {
  margin-top: 0;
  margin-bottom: 6px;
}
/*Headers for Listview Archive*/
.ArchiveHeader {
  color: #000099;
  font-size: 32px;
}

/*For Archived Video View*/
header .TDSBLogoForArchivedView img {
  width: 100%;
  max-width: 300px;
  height: auto;
  padding-bottom: 0.68em;
  margin-top: -25px;
}

header .TitleTextForArchivedView {
  width: 100%;
  height: auto;
  border-top: 1px solid #cbcdcc;
  padding: 0.3em 0 0.48em 0;
  color: #006611;
  text-align: center;
  font-size: 240%;
}

header .mainTitleForArchiveView {
  color: #006611;
  font-size: 1.2em;
  text-align: center;
}

header .MeetingCategoryForArchivedView {
  margin-top: 0.5px;
}

header .DateForArchivedView {
  font-size: 65%;
  color: black;
  margin-top: -5px;
  margin-bottom: 0;
}

header .MeetingTitleForArchivedView {
  font-size: 80%;
  color: black;
  margin-top: -9px;
}

.ArchiveVideoView .TDSBtopBannerBoxLeft img,
.TitleBar,
.LoginLink,
#Header {
  display: none !important;
}

#Body #DNN6 .TDSBtopBannerBoxLeft {
  display: none !important;
}

#Content,
.Content,
#Header,
#Nav,
#ContentBG,
#DNN6,
.Home {
  background-color: #ffffff !important;
}

body > .container {
  padding: 10px 15px 0 15px;
}

.arc-video-box {
  justify-content: center;
}

.video-containerForArchiveView {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.video-containerForArchiveView iframe,
.video-containerForArchiveView object,
.video-containerForArchiveView embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#marginVideoForVideoOnly {
  margin-left: 12%;
}

#marginVideoForVideoAndChat {
  margin-left: -7.2%;
}

#ArchiveViewRightChat {
  padding-left: 0;
  margin-left: -3px;
}

.scribbleBox {
  margin-right: 2%;
}

#VideoDataForBoth,
#VideoDataForVideoOnly {
  height: 100%;
  margin: 0 auto;
}

.btnLableBarForArchiveView {
  width: 100%;
  height: 40px;
  margin: 10px 0 0 0;
}

.btnLableLeftForArchiveView {
  margin: 0 35px 0 0;
  font-weight: bold;
}

.btnLableLeftForArchiveView,
.btnLableRightForArchiveView {
  float: left;
}

.btnLableRightForArchiveView {
  margin: 0 0 10px -20px;
}

.divToClearButton {
  clear: both;
  margin-bottom: -25px;
}

.AlertNoItemsForArchivedView {
  width: 100%;
  height: auto;
  padding: 0.3em 0 0.48em 0;
  color: orangered;
  font-size: 300%;
  text-align: center;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .video-containerForArchiveView {
    height: 90% !important;
    width: auto !important;
  }
}

.contentBox {
  margin: 0 17% 0 17%;
  max-width: 800px;
}

@media (min-width: 30.063em) {
  /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
}

@media (min-width: 34.063em) {
  /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
}

@media (min-width: 62em) {
  /* big landscape tablets, laptops, and desktops */
}

@media (min-width: 80.063em) {
  /* hi-res laptops and desktops */
}

@media (max-width: 1199px) {
  .contentBox {
    margin: 0 11% 0 11%;
  }
}

@media (max-width: 991px) {
  .contentBox {
    margin: 0 2% 0 2%;
  }
}
/*For Archived Video View*/