body {
  margin: 0px;
  font-family: Arial;
}

main#main {
  margin: 0px auto;
  width: 100%;
}

section.top {
  background: url(../imgs/top_header.png) no-repeat center;
  height: 468px;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
section.middle {
  background-color: #181B22 !important;
  height: 180px;
  /* 76px */
  font-family: 'Raleway', sans-serif;
  position: relative;
}

section.middle div.center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
}

section.middle div.inscreen {
  background-color: inherit;
  border-radius: 4px;
  margin: 0px auto;
  width: 1000px;
}

section.middle div.inscreen div.date,
section.middle div.inscreen nav.carousel,
section.middle div.inscreen div.clock {
  /* display: inline-block; */
  vertical-align: top;
}

section.middle div.inscreen div.date {
  background-color: inherit;
  height: 100px;
  /*margin-right: 4px;*/
  position: relative;
  width: 200px;
}

div.date span.title-program {
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-size: 20px;
  font-weight: 600;
  left: 20px;
  position: absolute;
  top: 28px;
}

div.date span.today {
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-size: 18px;
  left: 20px;
  position: absolute;
  top: 52px;
}

section.middle div.inscreen nav.carousel {
  margin: 41px auto 0px auto;
  width: 918px;
  overflow: hidden;
  padding: 0px;
  position: relative;
}

div.clock {
  background: url(../imgs/programs_right_bg.png) no-repeat center;
  height: 100px;
  /*margin-left: 2px;*/
  position: relative;
  width: 120px;
}

div.clock a.link,
div.clock a.visited {
  color: #2a2d31;
  display: block;
  font-family: 'Raleway', sans-serif;
  font-size: 12px;
  font-weight: 700;
  margin-top: 60px;
  text-align: center;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
section.bottom {
  background: url(../imgs/bottom_block.png) no-repeat center;
  height: 384px;
}

ul#programs {
  list-style: none;
  margin: 0px;
  margin-top: 30px;
  padding: 0px;
  /* width: ???; in app.js line 125 */
  position: relative;
}

ul#programs li {
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 400;
  margin: 0px;
  padding: 4px;
  text-align: center;
  width: 48px;
}

ul#programs li.am {
  background-color: inherit;
  border-right: 1px solid #bac6d1;
  color: #fff;
}

ul#programs li.pm {
  background-color: inherit;
  border-right: 1px solid #FE9400;
  color: #FE9400;
}

ul#programs li span {
  color: #999;
}

ul#programs li.active {
  /*background-color: #1efba1;*/
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
nav.controls {
  position: relative;
  z-index: 9;
}

nav.controls button {
  border: none;
  border-radius: 25px;
  background-color: #fff;
  cursor: pointer;
  height: 26px;
  position: absolute;
  top: -62px;
  text-indent: -9999px;
  width: 26px;
}

nav.controls button.prev {
  background: url(../imgs/programs_btn_prev.png) no-repeat center;
  left: 212px;
}

nav.controls button.next {
  background: url(../imgs/programs_btn_next.png) no-repeat center;
  left: 840px;
}

nav.controls span.current {
  /* background: url(../imgs/programs_active.png) no-repeat center; */
  cursor: pointer;
  height: 36px;
  left: 472px;
  position: absolute;
  top: -33px;
  width: 49px;
  border: 1px solid #FE9400;
}

nav.controls a.inscreen {
  background: url(../imgs/programs_btn_inscreen_disabled.png) no-repeat center;
  height: 19px;
  left: 465px;
  position: absolute;
  top: -92px;
  width: 149px;
}

nav.controls a.inscreen.active {
  background: url(../imgs/programs_btn_inscreen.png) no-repeat center;
}

nav.controls span.title {
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-size: 14px;
  font-weight: 500;
  left: 340px;
  position: absolute;
  text-align: center;
  text-transform: uppercase;
  top: -72px;
  width: 420px;
}

nav.controls span.title small {
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 20px;
  color: #fff;
}

nav.controls span.title small em {
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-style: normal;
  font-size: 14px;
  font-weight: 500;
}

section.streaming {
  /*background: url(../imgs/programas_bar_streaming_void.png) no-repeat center;*/
  background-color: #005aff;
  bottom: 0px;
  height: 30px;
  left: 0px;
  position: fixed;
  width: 100%;
}

section.streaming div.content {
  margin: 0px auto;
  position: relative;
  width: 1000px;
}

span.live {
  background: url(../imgs/ico_live.png) no-repeat center left;
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 15px;
  left: 0px;
  position: absolute;
  padding-left: 36px;
  top: 5px;
}

span.live.no-streaming {
  background: url(../imgs/no_straming.png) no-repeat center left;
  height: 29px;
  text-indent: -9999px;
  top: 2px;
  width: 167px;
}

span.current_title {
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 12px;
  left: 226px;
  position: absolute;
  top: 8px;
}

span.current_title strong {
  font-weight: 700;
}

span.switch {
  cursor: pointer;
  height: 22px;
  left: 184px;
  position: absolute;
  top: 4px;
  width: 31px;
}

span.switch.on {
  background: url(../imgs/switch_streaming_on.png) no-repeat center;
}

span.switch.off {
  background: url(../imgs/switch_streaming_off.png) no-repeat center;
  -webkit-transform: rotate(-180deg);
}

span.see-all {
  background: url(../imgs/ico_seeall.png) no-repeat center left;
  color: #fff;
  cursor: pointer;
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 12px;
  left: 560px;
  position: absolute;
  padding: 2px 0px 2px 24px;
  top: 5px;
}

span.separator {
  background: url(../imgs/line_separator.png) no-repeat center;
  height: 50px;
  position: absolute;
  top: 0px;
  width: 1px;
}

span.separator.s1 {
  left: 650px;
}

span.separator.s2 {
  left: 766px;
}

span.only-audio {
  background: url(../imgs/ico_audio.png) no-repeat center left;
  color: #fff;
  cursor: pointer;
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 12px;
  left: 664px;
  position: absolute;
  padding: 2px 0px 2px 28px;
  top: 5px;
  width: 100px;
}

span.only-audio.active {
  background: url(../imgs/ico_audio_active.png) no-repeat center left;
}

span.follow-us {
  color: #fff;
  cursor: pointer;
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 15px;
  left: 780px;
  position: absolute;
  top: 5px;
}

ul.social {
  left: 860px;
  padding: 0px;
  position: absolute;
  margin: 0px;
  top: 5px;
}

ul.social li {
  cursor: pointer;
  display: inline-block;
  height: 24px;
  vertical-align: top;
  width: 24px;
}

ul.social li.facebook {
  background: url(../imgs/ico_fb.png) no-repeat center;
}

ul.social li.twitter {
  background: url(../imgs/ico_tw.png) no-repeat center;
}

ul.social li.youtube {
  background: url(../imgs/ico_yt.png) no-repeat center;
}

ul.social li.instagram {
  background: url(../imgs/ico_itg.png) no-repeat center;
}

ul.social li.linkedin {
  background: url(../imgs/ico_lin.png) no-repeat center;
}

.title-channel {
  /* background: #424C5D;
	color: #fff;
	padding: 1.1rem; */
}

.now {
  background-color: #FE9400;
  color: #fff;
  padding: 0.12rem;
  left: 390px;
  position: absolute;
  top: -72px;
}