@charset "utf-8";

/*
 * PREO3 preo.add.css
 * 2019.12.09-
 */

body,
html {
  background-color: #FFF;
}

#opening {
  background-color: #FFF;
}

#template-container {
  background: #FFF;
}

header {
  background-color: #428bca;
}

.fullscreen header {
  background-color: rgba(128,128,128,0.7) !important;
}

.fullscreen.portrait .slide-main header,
.fullscreen.portrait .video-main header {
  background-color: #428bca !important;
}

#course-title {
  color: #FFF;
}

#control-container {
  background-color: #CCC;
}

.ex.fullscreen #control-container,
.mobile.fullscreen.landscape #control-area.double #control-area-content,
.mobile.fullscreen.landscape #control-container,
.mobile.fullscreen.portrait .slide-full #control-container,
.mobile.fullscreen.portrait .slide-full .double #control-area-content,
.mobile.fullscreen.portrait .video-full #control-container,
.mobile.fullscreen.portrait .video-full .double #control-area-content {
  background-color: rgba(128,128,128,0.7) !important;
}

.ex.fullscreen #cue-mark-inner div,
.mobile.fullscreen.landscape #cue-mark-inner div,
.mobile.fullscreen.portrait .slide-full #cue-mark-inner div,
.mobile.fullscreen.portrait .video-full #cue-mark-inner div {
  border-right: solid 1px #FFF;
}

.fullscreen #page-number-area,
.fullscreen #time-view {
  color: #EEE;
}

.fullscreen.portrait .slide-main #page-number-area,
.fullscreen.portrait .slide-main #time-view,
.fullscreen.portrait .video-main #page-number-area,
.fullscreen.portrait .video-main #time-view {
  color: inherit;
}

#slide-content {
  background-color: #CCC;
  border: solid 1px #CCC;
}

.fullscreen .slide-full #slide-content {
  border: solid 2px rgba(0,0,0,1);
  background-color: #000;
}

#media-content {
  background-color: #BBB;
  border: solid 1px #BBB;
}

.fullscreen .video-full #media-content {
  border: solid 2px rgba(0,0,0,1);
  background-color: #000;
}

#navi {
  background-color: #CCC;
  border: solid 1px #CCC;
}

.product-logo {
  background-position: 3px -222px;
}

.mobile .product-logo {
  background-position: 3px -222px;
}

.product-logo-container {
  background-color: rgba(0,0,0,0) !important;
  background: inherit;
}

.mobile .product-logo-container {
  height: 36px;
}