body {
  color: grey; }
  body .page {
    background: whitesmoke;
    color: grey; }
    body .page .main {
      background: whitesmoke !important; }

header, .header {
  background: rgba(255, 255, 255, 0.95); }
  header .spanBar, .header .spanBar {
    background-color: darkgray; }
  header .user-nav nav, .header .user-nav nav {
    background: rgba(255, 255, 255, 0.95); }
    header .user-nav nav ul li, .header .user-nav nav ul li {
      background: rgba(255, 255, 255, 0.95); }
      header .user-nav nav ul li a, .header .user-nav nav ul li a {
        color: grey; }
      header .user-nav nav ul li:hover, .header .user-nav nav ul li:hover {
        background: rgba(25, 175, 140, 0.75); }
        header .user-nav nav ul li:hover a, .header .user-nav nav ul li:hover a {
          color: white !important; }
  header .side-nav .nav-hider .burger, .header .side-nav .nav-hider .burger {
    border-right: none; }
    header .side-nav .nav-hider .burger:hover, .header .side-nav .nav-hider .burger:hover {
      background-color: transparent; }
      header .side-nav .nav-hider .burger:hover .spanBar, .header .side-nav .nav-hider .burger:hover .spanBar {
        background-color: #19af8c; }
  header .side-nav nav, .header .side-nav nav {
    background: rgba(255, 255, 255, 0.95); }
    header .side-nav nav ul li, .header .side-nav nav ul li {
      background: rgba(255, 255, 255, 0.95); }
      header .side-nav nav ul li a, .header .side-nav nav ul li a {
        color: grey; }
      header .side-nav nav ul li:hover, .header .side-nav nav ul li:hover {
        background: rgba(25, 175, 140, 0.75);
        color: white; }
      header .side-nav nav ul li #TL2ulmenu, .header .side-nav nav ul li #TL2ulmenu {
        background: white; }
        header .side-nav nav ul li #TL2ulmenu a, .header .side-nav nav ul li #TL2ulmenu a {
          color: grey; }
          header .side-nav nav ul li #TL2ulmenu a:hover, .header .side-nav nav ul li #TL2ulmenu a:hover {
            color: white;
            /*background-color: rgba(25, 175, 140, 0.75);*/ }
        header .side-nav nav ul li #TL2ulmenu li a, .header .side-nav nav ul li #TL2ulmenu li a {
          color: grey; }
          header .side-nav nav ul li #TL2ulmenu li a:hover, .header .side-nav nav ul li #TL2ulmenu li a:hover {
            color: white; }
        header .side-nav nav ul li #TL2ulmenu li:hover, .header .side-nav nav ul li #TL2ulmenu li:hover {
          /*background: rgba(25, 175, 140, 0.75);*/ }
    header .side-nav nav ul #nav-archive #TL2archiveMenu, .header .side-nav nav ul #nav-archive #TL2archiveMenu {
      background: white; }
      header .side-nav nav ul #nav-archive #TL2archiveMenu li, .header .side-nav nav ul #nav-archive #TL2archiveMenu li {
        background: white; }
        header .side-nav nav ul #nav-archive #TL2archiveMenu li a, .header .side-nav nav ul #nav-archive #TL2archiveMenu li a {
          color: grey; }
        header .side-nav nav ul #nav-archive #TL2archiveMenu li:hover, .header .side-nav nav ul #nav-archive #TL2archiveMenu li:hover {
          /*background: rgba(25, 175, 140, 0.75);*/ }
          header .side-nav nav ul #nav-archive #TL2archiveMenu li:hover a, .header .side-nav nav ul #nav-archive #TL2archiveMenu li:hover a {
            color: white; }
    header .side-nav nav.highlight, .header .side-nav nav.highlight {
      box-shadow: 5px 5px 15px -10px; }

#nav-timeline #TL2ulmenu li a {
  background: white; }
    #nav-timeline #TL2ulmenu li a:hover {
        /*background: rgba(25, 175, 140, 0.75);*/
        background: rgb(25, 175, 140);
    }

#nav-timeline #TL2ulmenu #TL2archiveMenu li a {
  background-color: white; }
  #nav-timeline #TL2ulmenu #TL2archiveMenu li a:hover {
    /*background: rgba(25, 175, 140, 0.75);*/
    color: white; }

.main.compare #main-image2 {
  display: block; }

.main.overlay #main-image1 .xBar {
  border: 5px solid rgba(25, 175, 140, 0.75);
  background: rgba(255, 255, 255, 0.95); }

.main-image {
  background-color: whitesmoke; }

.timeline-control-bar {
  background: rgba(255, 255, 255, 0.95); }
  .timeline-control-bar .controls.pane-controls panes i {
    color: grey;
    background: none;
    font-size: 28px; }
    .timeline-control-bar .controls.pane-controls panes i:hover {
      color: #19af8c;
      background: none; }
  .timeline-control-bar .controls.reset-theme .reset a#reset-button {
    color: gray;
    border: 1px solid gray; }
    .timeline-control-bar .controls.reset-theme .reset a#reset-button:hover {
      color: white;
      background: rgba(25, 175, 140, 0.75); }
  .timeline-control-bar .controls .image-controls {
    background-color: rgba(255, 255, 255, 0.95); }
    .timeline-control-bar .controls .image-controls.highlight {
      background-color: white; }
    .timeline-control-bar .controls .image-controls:hover {
      color: #19af8c; }
    .timeline-control-bar .controls .image-controls.hidden .date .pad5 {
      color: grey; }
    .timeline-control-bar .controls .image-controls .calendar {
      color: gray; }
      .timeline-control-bar .controls .image-controls .calendar ul li:hover {
        color: #19af8c; }
      .timeline-control-bar .controls .image-controls .calendar .panelTL2leftcontrols #MainContent_DDLtime {
        background: white;
        color: black; }
      .timeline-control-bar .controls .image-controls .calendar .panelTL2leftcontrols .panelTL2leftcontrolsTIME #MainContent_UpdatePanelTimeClockDDM button i,
      .timeline-control-bar .controls .image-controls .calendar .panelTL2leftcontrols .panelTL2leftcontrolsTIMELarger button i {
        color: grey; }
      .timeline-control-bar .controls .image-controls .calendar .panelTL2leftcontrols .panelTL2leftcontrolsTIME #MainContent_UpdatePanelTimeClockDDM button:hover i,
      .timeline-control-bar .controls .image-controls .calendar .panelTL2leftcontrols .panelTL2leftcontrolsTIMELarger button:hover i {
        color: #19af8c; }
      .timeline-control-bar .controls .image-controls .calendar .panelTL2righttcontrols #MainContent_DDLtime2 {
        background: white;
        color: black; }
      .timeline-control-bar .controls .image-controls .calendar .panelTL2righttcontrols .panelTL2rightcontrolsTIME #MainContent_UpdatePanelTimeClockDDM2 button i,
      .timeline-control-bar .controls .image-controls .calendar .panelTL2righttcontrols .panelTL2rightcontrolsTIMELarger button i {
        color: grey; }
      .timeline-control-bar .controls .image-controls .calendar .panelTL2righttcontrols .panelTL2rightcontrolsTIME #MainContent_UpdatePanelTimeClockDDM2 button:hover i,
      .timeline-control-bar .controls .image-controls .calendar .panelTL2righttcontrols .panelTL2rightcontrolsTIMELarger button:hover i {
        color: #19af8c; }
  .timeline-control-bar .center-controls .zoom-control .spanBar {
    background-color: grey;
    transition: all 250ms; }
  .timeline-control-bar .center-controls .zoom-control:hover .spanBar {
    background-color: #19af8c;
    box-shadow: none; }

footer {
  background-color: rgba(255, 255, 255, 0.95);
  padding: 0 10px; }

#day-theme {
  display: none; }

#night-theme {
  display: block; }

* .highlight {
  background-color: white; }

/*Video Clips Page*/
.video-clip-card {
  background: white;
  box-shadow: 0 0 15px lightgrey;
  border: none; }

/*Video Clips Viewer Page*/
.video-clip-viewer-container {
  background: white;
  box-shadow: 0 0 15px lightgrey;
  border: none; }

/*default page*/
.vivo-home-card {
  width: 400px;
  margin: 15px;
  text-align: left;
  box-shadow: 0 0 15px lightgrey;
  background: white;
  border: none; }

/* Video Clips Page */

.video-clips-panel{
  background: white;
}

.video-clips-panel-sidebar,
#MainContent_NewVideoClipsSideBar {
  background: whitesmoke;
  border: none;
}
.video-clips-panel-sidebar a,
#MainContent_NewVideoClipsSideBar a{
  color: gray;
}

.video-clips-panel-sidebar,
#MainContent_NewVideoClipsSideBar h3 {
  color: gray;
}

.video-clips-panel-sidebar a:hover,
#MainContent_NewVideoClipsSideBar a:hover{
  background-color: lightgray;
}
.video-clips-panel-container{
  background: white;

}

.video-clip-card .video-clip-description {
  background: white;
  color: gray;
}

.view-all-link-card{
  background: white;
}

.video-clips-panel h1,
.video-clips-panel h2,
.video-clips-panel h3,
.video-clips-panel h4,
.video-clips-panel h5,
.video-clips-panel h6{
  color: gray;
}

.page .main{
  background: white !important;
}

#MainContent_NewVideoClipsViewerSideBar a{
   color: gray
 }