@import url("//fonts.googleapis.com/css?family=Lato:400,300,200,400italic,500,500italic");
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  color: #fff;
  font-family: Lato, sans-serif;
  font-weight: 300;
}
.z {
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
}
.cover {
  position: fixed;
  min-width: 100vw;
  min-height: 100vh;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.left-bg {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 500px;
  min-height: 100vh;
  background-color: #020616;
  background: #001b38;
  background: -moz-linear-gradient(left, rgba(0,27,56,0.85) 0%, rgba(0,27,56,0.85) 5%, rgba(0,27,56,0) 100%);
  background: -webkit-linear-gradient(left, rgba(0,27,56,0.85) 0%, rgba(0,27,56,0.85) 5%, rgba(0,27,56,0) 100%);
  background: linear-gradient(to right, rgba(0,27,56,0.85) 0%, rgba(0,27,56,0.85) 5%, rgba(0,27,56,0) 100%);
}
.meetings {
  position: absolute;
  left: -25px;
  top: 36px;
}
.meetings.in .meeting {
  opacity: 0.75;
  transform: translateX(25px);
}
.meetings .meeting:hover {
  opacity: 0.85;
  transform: translateX(32px);
  cursor: pointer;
}
.meetings.in .meeting.current {
  transform: translateX(100px);
}
.meetings .meeting.current:hover {
  opacity: 0.9;
  transform: translateX(112px);
  cursor: pointer;
}
.meeting {
  background-color: #001b38;
  background-color: #001b38;
  width: 500px;
  height: 120px;
  margin-bottom: 20px;
  padding: 15px 25px 15px 50px;
  opacity: 0;
  transition: all 300ms ease-in-out;
}
.meeting h2 {
  font-weight: 300;
  font-size: 28.8px;
  margin-bottom: 4px;
  width: 420px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.meeting h3 {
  font-weight: 200;
  font-size: 22.4px;
  margin-bottom: 1px;
  letter-spacing: 0.5px;
  opacity: 0.85;
}
.meeting h4 {
  font-weight: 200;
  font-size: 16px;
  letter-spacing: 0.5px;
  opacity: 0.85;
}
.meeting.current {
  background-color: #13365b;
  height: 165px;
  width: 600px;
  padding: 20px 25px 20px 50px;
  margin-left: -75px;
}
.meeting.current h2 {
  font-size: 36px;
  margin-bottom: 10px;
  transition: all 300ms ease-in-out;
}
.meeting.current h2.available {
  color: #9ce051;
  font-weight: 400;
}
.meeting.current h3 {
  font-size: 28px;
  margin-bottom: 8px;
  transition: all 300ms ease-in-out;
}
.meeting.current h4 {
  font-size: 20px;
  transition: all 300ms ease-in-out;
}
.meeting.passed {
  opacity: 0.5 !important;
}
.meeting.passed h2,
.meeting.passed h3,
.meeting.passed h4 {
  color: #555 !important;
}
.meeting:nth-of-type(1) {
  transition-delay: 100ms;
}
.meeting:nth-of-type(2) {
  transition-delay: 150ms;
}
.meeting:nth-of-type(3) {
  transition-delay: 220ms;
}
.meeting:nth-of-type(4) {
  transition-delay: 280ms;
}
.meeting:nth-of-type(5),
.meeting:nth-of-type(6),
.meeting:nth-of-type(7),
.meeting:nth-of-type(8),
.meeting:nth-of-type(9) {
  transition-delay: 320ms;
}
.top.right {
  position: fixed;
  top: 36px;
  right: 36px;
  text-align: right;
}
.top.right h1 {
  font-size: 40px;
  font-weight: 500;
}
.top.right h2 {
  font-size: 32px;
}
.top.right h2.available {
  color: #9ce051;
}
.top.right h2.occupied {
  color: #e05151;
}
.bottom.right {
  position: fixed;
  bottom: 36px;
  right: 36px;
  text-align: right;
}
.bottom.right h1 {
  font-weight: 200;
  font-size: 24px;
}
.bottom.right h2 {
  font-weight: 300;
  font-size: 100px;
}

.top.right {
  text-align: center;
}

.conference-logo {
  display: block;
  width: 350px;
  height: auto;
  margin: 0 auto 2px auto;
}
