@charset "UTF-8";
/* Required for Angular UI Bootstrap */
.nav, .pagination, .carousel, .panel-title a {
  cursor: pointer;
}

/* Component SCSS */
.home.col-md-12,
.friends {
  padding: 20px 0 0 0;
}
.home.col-md-12 .title-container,
.friends .title-container {
  text-align: left;
  padding-left: 5.3rem;
  margin-top: 6.9rem;
  margin-bottom: 1rem;
}
.home.col-md-12 .title-container img.logo,
.friends .title-container img.logo {
  width: 46px;
  margin: auto;
}
.home.col-md-12 .title-container .title-view,
.friends .title-container .title-view {
  font-size: 2rem;
  margin-left: 1rem;
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
}
.home.col-md-12 .channels-categories,
.friends .channels-categories {
  margin-top: 2.8rem;
  padding-left: 4.6rem;
  position: relative;
}
.home.col-md-12 .channels-categories .chevron,
.friends .channels-categories .chevron {
  position: absolute;
  visibility: hidden;
  visibility: visible;
  height: 8px;
  width: 8px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.home.col-md-12 .channels-categories .chevron.next,
.friends .channels-categories .chevron.next {
  top: 50%;
  left: 86.7%;
  transform: translateY(-50%);
  background-image: url(../../assets/images/chevron-forward.png);
}
.home.col-md-12 .channels-categories .chevron.back,
.friends .channels-categories .chevron.back {
  top: 50%;
  left: 7%;
  transform: translateY(-50%);
  background-image: url(../../assets/images/chevron-back.png);
}
.home.col-md-12 .channels-categories .chevron.active,
.friends .channels-categories .chevron.active {
  visibility: visible;
}
.home.col-md-12 .channels-categories .category-buttons,
.friends .channels-categories .category-buttons {
  white-space: nowrap;
  width: 32rem;
  overflow: hidden;
}
.home.col-md-12 .channels-categories .category-buttons .buttons-slider,
.friends .channels-categories .category-buttons .buttons-slider {
  width: 100%;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease;
  transition-property: transform;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.home.col-md-12 .channels-categories .category-buttons .buttons-slider .category-button,
.friends .channels-categories .category-buttons .buttons-slider .category-button {
  background-color: #132835;
  width: 10.4rem;
  border-radius: 2rem;
  font-size: 1rem;
  height: 3.02rem;
  margin-right: 0.3rem;
  font-family: "montserrat-regular";
  border-width: 2px;
}
.home.col-md-12 .channels-categories .category-buttons .buttons-slider .category-button.focus-item-keyboard,
.friends .channels-categories .category-buttons .buttons-slider .category-button.focus-item-keyboard {
  border-width: 2px;
}
.home.col-md-12 .channels-categories .category-buttons .buttons-slider .category-button span,
.friends .channels-categories .category-buttons .buttons-slider .category-button span {
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: transparent;
  padding-bottom: 1px;
  -webkit-transition-property: border-color;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  transition-property: border-color;
  transition-duration: 0.5s;
  transition-timing-function: linear;
}
.home.col-md-12 .channels-categories .category-buttons .buttons-slider .category-button.active span,
.friends .channels-categories .category-buttons .buttons-slider .category-button.active span {
  border-bottom-color: #ffe346;
}
.home.col-md-12 .channels-counter,
.friends .channels-counter {
  text-align: left;
  padding-left: 5.5rem;
  font-size: 1.2rem;
  margin-top: 2rem;
  font-family: "Montserrat";
}
.home.col-md-12 .channels-counter .counter,
.friends .channels-counter .counter {
  font-weight: bold;
}
.home.col-md-12 .channels-container,
.friends .channels-container {
  height: 42rem;
  overflow: hidden;
  margin-top: 2.2rem;
  position: relative;
}
.home.col-md-12 .channels-container .channel-blocker,
.friends .channels-container .channel-blocker {
  position: absolute;
  background-color: transparent;
  z-index: 3;
  width: 100%;
  height: 11rem;
}
.home.col-md-12 .channels-container .channel-blocker.channel-up-blocker,
.friends .channels-container .channel-blocker.channel-up-blocker {
  top: 0;
}
.home.col-md-12 .channels-container .channel-blocker.channel-down-blocker,
.friends .channels-container .channel-blocker.channel-down-blocker {
  bottom: 0;
}
.home.col-md-12 .channels-container .channels-grid,
.friends .channels-container .channels-grid {
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease;
  transition-property: transform;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.home.col-md-12 .channels-container .channels-grid .channels-row.can-down, .home.col-md-12 .channels-container .channels-grid .channels-row.can-up,
.friends .channels-container .channels-grid .channels-row.can-down,
.friends .channels-container .channels-grid .channels-row.can-up {
  opacity: 0.5;
}
.home.col-md-12 .channels-container .channels-grid .channels-row.incomplete,
.friends .channels-container .channels-grid .channels-row.incomplete {
  text-align: left;
  padding-left: 5.75rem;
}
.home.col-md-12 .channels-container .channels-grid .channels-row .channel-item,
.friends .channels-container .channels-grid .channels-row .channel-item {
  background-size: 70%;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  width: 100px;
  height: 100px;
  border-width: 2px;
  margin: 0 5px 5px 0;
  background-color: transparent;
  display: inline-block;
}
.home.col-md-12 .channels-container .channels-grid .channels-row .channel-item.focus-item-keyboard,
.friends .channels-container .channels-grid .channels-row .channel-item.focus-item-keyboard {
  border-width: 2px;
}
.home.col-md-12 .channels-container .channels-grid .channels-row .channel-item.last-row,
.friends .channels-container .channels-grid .channels-row .channel-item.last-row {
  margin-right: 0;
}
.home.col-md-12 .channels-container .channels-grid .channels-row .channel-item span,
.friends .channels-container .channels-grid .channels-row .channel-item span {
  font-size: 15px;
  position: absolute;
  top: 106%;
  width: 100%;
  left: 0;
  color: white;
}
.home.col-md-12 .channels-container .channels-grid .channels-row .channel-item .channel-number,
.friends .channels-container .channels-grid .channels-row .channel-item .channel-number {
  visibility: hidden;
}
.home.col-md-12 .channels-container .channels-grid .channels-row .channel-item.focus-item-keyboard .channel-number,
.friends .channels-container .channels-grid .channels-row .channel-item.focus-item-keyboard .channel-number {
  visibility: visible;
  position: absolute;
  top: 4px;
  left: 0;
  background-color: #006790;
  border-radius: 0em 2em 2em 0em;
  text-align: center;
  padding-right: 1em;
  font-size: 14px;
  width: auto;
  font-weight: bold;
  padding: 2px 12px;
  font-family: "montserrat-bold";
  min-width: 36%;
  max-width: 50%;
}

.cont-btn-down {
  width: 100%;
  overflow: hidden;
}

@keyframes ldio-oln9lh4b05 {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
.ldio-oln9lh4b05 div {
  position: absolute;
  width: 60px;
  height: 60px;
  border: 10px solid #ffffff;
  border-top-color: transparent;
  border-radius: 50%;
}

.ldio-oln9lh4b05 div {
  animation: ldio-oln9lh4b05 1s linear infinite;
  top: 100px;
  left: 100px;
}

.loadingio-spinner-rolling-w40xmowdfxm {
  width: 200px;
  height: 200px;
  display: inline-block;
  overflow: hidden;
  background: transparent;
}

.ldio-oln9lh4b05 {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform-origin: 0 0; /* see note above */
}

.ldio-oln9lh4b05 div {
  box-sizing: content-box;
}

.auth {
  padding-top: 20px;
}
.auth .title-auth {
  margin-bottom: 15px;
}
.auth .txt-form-o {
  margin-bottom: 7px;
}
.auth .cont-form-auth .img-form {
  display: inline-block;
}
.auth .cont-form-auth .img-form.letter-form {
  width: 67px;
}
.auth .cont-form-auth .img-form.fb-form {
  width: 27px;
  height: 27px;
}
.auth .cont-form-auth .cont-btn-signin-fb {
  margin-bottom: 17px;
}
.auth .cont-form-auth .cont-inputs-auth .input-auth {
  display: block;
  margin: 0 auto 10px;
}
.auth .cont-form-auth .title-inputs-form {
  display: inline-block;
}
.auth .cont-form-auth .cont-btn {
  padding-top: 20px;
}
.auth .cont-form-auth .cont-btn .btn-app, .auth .cont-form-auth .cont-btn .btn-sreaction {
  width: 325px;
}
.auth .cont-form-auth .cont-btn .btn-transparent {
  background-color: transparent;
  border-color: #344656;
}
.auth .cont-form-auth .cont-btn .btn-transparent.focus-item-keyboard {
  border-color: white;
}
.auth .cont-form-auth .cont-btn-signup {
  height: 60px;
  margin-bottom: 105px;
}
.auth .line-separete {
  width: 80px;
  margin: auto;
  display: inline-block;
  border-top: 2px solid black;
}

.user .btn-app, .user .btn-sreaction {
  width: 322px;
  font-size: 15px;
  padding: 0 !important;
}
.user .cont-user {
  padding-top: 50px;
}
.user .cont-img-name-user {
  text-align: center;
  margin-bottom: 30px;
}
.user .cont-img-name-user #photo-user {
  width: 128px;
  height: 128px;
  margin: auto;
  background-size: cover;
  border-radius: 50%;
  background-repeat: no-repeat;
}
.user .cont-img-name-user .cont-name-user {
  margin-top: 20px;
}
.user .list-btns-user .keyboard-parent {
  margin-bottom: 10px;
}
.user .list-btns-user .keyboard-parent .btn-app, .user .list-btns-user .keyboard-parent .btn-sreaction {
  padding: 0 20px;
}

.cont-img-name-user, .cont-ico-user {
  text-align: center;
  margin-bottom: 30px;
}
.cont-img-name-user #photo-fb, .cont-ico-user #photo-fb {
  width: 80px;
  height: 80px;
  margin: auto;
}

.cont-ico-user {
  margin-bottom: 165px;
}
.cont-ico-user #ico-user {
  width: 40px;
  height: 40px;
  margin: auto;
}

.auth-fb .cont-ico-fb {
  margin-bottom: 60px;
}
.auth-fb .title-fb {
  font-size: 20px;
}
.auth-fb .cont-list-steps-fb {
  padding: 0 40px;
}
.auth-fb .cont-form-auth {
  margin-bottom: 50px;
}
.auth-fb .number-step-fb {
  font-weight: bold;
}
.auth-fb .explain-step-fb {
  font-weight: lighter;
}
.auth-fb .link-step-fb {
  font-size: 35px;
}
.auth-fb .link-step-fb.link-step-fb-1 {
  color: #FCF6A6;
}
.auth-fb .link-step-fb.link-step-fb-2 {
  color: #01E857;
}

.brand {
  position: fixed;
  z-index: 2;
}
.brand img {
  width: 100%;
  height: 100%;
}

.splash-app {
  position: fixed;
  width: 1280px;
  height: 720px;
  top: 0;
  left: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 10000000;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/download.jpg);
}

.btn-user-main {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/menu.png);
}

.btn-config {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/settings.png);
}

.btn-friends {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/add.png);
}

.btn-favorites {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/favorites.png);
}

.btn-promotions {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/promotions.png);
}

.btn-msg {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/message.png);
}

.btn-exclusive {
  background-image: url(../assets/images/icone-ppv.png);
}

.btn-guide {
  background-image: url(../assets/images/icone-guide.png);
  background-size: 100% !important;
}

.btn-emoticons {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/reactions.png);
}

.btn-sqjl {
  background-image: url(../assets/images/sqjl.png);
}

.options-emoticons .btn-m-user {
  background-color: transparent !important;
}

.bg-brand {
  background-image: url(../assets/images/brand.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.cont-ads {
  position: absolute;
  top: 560px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 5;
}
.cont-ads.top {
  top: 50px;
}
.cont-ads .row-img-ad {
  width: 100%;
  height: 100%;
}
.cont-ads .row-img-ad .parent-img-ad {
  width: 100%;
  height: 100%;
}
.cont-ads.adverti {
  width: 600px;
  height: 120px;
  overflow: hidden;
}
.cont-ads .img-ad {
  width: 100%;
  height: 100%;
}
.cont-ads .img-reaction {
  width: 100px;
  height: 100px;
  margin: auto;
}
.cont-ads .cont-notification {
  text-align: center;
  position: relative;
  width: 500px;
  height: 100px;
  margin: auto;
  border: 1px solid white;
}
.cont-ads .cont-notification .icon-notification, .cont-ads .cont-notification .cont-message-notification {
  display: inline-block;
  vertical-align: top;
}
.cont-ads .cont-notification .icon-notification {
  width: 70px;
  height: 70px;
  margin-top: 12px;
  float: left;
  margin-left: -70px;
}
.cont-ads .cont-notification .cont-message-notification {
  color: white;
  margin-top: 30px;
  background-color: black;
}
.cont-ads .cont-set-reaction {
  text-align: center;
  position: relative;
  width: 580px;
  height: 120px;
  margin: auto;
  border: 1px solid white;
  background-color: #173345;
}
.cont-ads .cont-set-reaction .icon-reaction {
  position: absolute;
  width: 85px;
  height: 85px;
  top: -50%;
  left: 0;
  right: 0;
  margin: auto;
}
.cont-ads .cont-set-reaction .keyboard-parent {
  display: inline-block;
  margin: auto;
}
.cont-ads .cont-set-reaction .keyboard-parent .btn-sreaction.item-keyboard-v2 {
  margin: 33px 10px 0;
}
.cont-ads #player {
  position: fixed;
  z-index: 20;
}

.name-send-reaction {
  margin-top: 10px;
  text-transform: uppercase;
  font-size: 16px;
  font-weight: bold;
  font-family: "advert-rough-four";
}

.block-click-player {
  position: fixed;
  z-index: 21;
  width: 1280px;
  height: 720px;
}

#cont-ui-player-m {
  position: relative;
  z-index: 21;
}

.img-picked {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: none;
}

.item-keyboard-v2.selected .img-picked {
  display: block;
}

.friends.col-md-12 .cont-friends .list-friends .friend.user-connect.selected .icon-active,
.friends.col-md-12 .cont-friends .list-friends .friend.user-disconnect.selected .icon-disconnect {
  display: none;
}

.keyboard-parent .friend .img-friend {
  background-image: url("../assets/images/bt-UserMenu-2.png");
  background-repeat: no-repeat;
  background-position: center;
  width: 60px;
  height: 60px;
  margin: auto;
  border-radius: 50%;
  margin-top: 6px;
  background-size: cover;
}

.friends.col-md-12 {
  padding-top: 10px;
}
.friends.col-md-12 .cont-friends .list-friends .friend {
  border-color: transparent;
  position: relative;
}
.friends.col-md-12 .cont-friends .list-friends .friend .name-friend {
  top: 72%;
  height: 21px;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  margin-top: 3px;
}
.friends.col-md-12 .cont-friends .list-friends .friend.focus-item-keyboard {
  border-color: white;
}
.friends.col-md-12 .cont-friends .list-friends .friend .icon-active {
  position: absolute;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  bottom: 40px;
  right: 17px;
  display: none;
}
.friends.col-md-12 .cont-friends .list-friends .friend .icon-active.icon-connect {
  background-color: green;
}
.friends.col-md-12 .cont-friends .list-friends .friend .icon-active.icon-disconnect {
  background-color: red;
}
.friends.col-md-12 .cont-friends .list-friends .friend.user-connect .icon-connect {
  display: block;
}
.friends.col-md-12 .cont-friends .list-friends .friend.user-disconnect .icon-disconnect {
  display: block;
}
.friends.col-md-12 .btn-send-friends {
  margin-top: 40px;
}
.friends.col-md-12 .cont-user-2 {
  display: none;
}
.friends.col-md-12 .cont-btns-request-friends {
  display: none;
  margin-top: 25px;
}
.friends.col-md-12 .cont-btns-request-friends .btn-signup {
  margin-bottom: 10px;
}
.friends.col-md-12.only-show-friends .cont-user {
  display: none;
}
.friends.col-md-12.only-show-friends .cont-user-2 {
  display: block;
  margin-top: 50px;
}
.friends.col-md-12.only-show-friends .btn-send-friends {
  display: none;
}
.friends.col-md-12.only-show-friends .cont-btns-request-friends {
  display: block;
}

.menu-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  min-height: 720px;
}
.menu-container .btn-m-user {
  margin: 5px 0 16px 10px;
  width: 72px;
  height: 72px;
}

.options-emoticons.options-messages,
.options-emoticons.options-favorites {
  text-align: right;
  padding-right: 20px;
}

.options-emoticons.options-messages {
  top: 443px;
}

.options-emoticons.options-favorites {
  top: 323px;
}

.btn-more-favorite {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/more-favorites.png);
}

.channel-switcher {
  position: absolute;
  top: 0.8em;
  left: 0;
  width: 12.7%;
  height: 126px;
  z-index: 30;
  border-radius: 0em 8em 8em 0em;
  background-color: #2c6390;
}
.channel-switcher .number {
  color: white;
  font-family: "montserrat-bold";
  font-size: 45px;
  position: relative;
  top: 21%;
}
.channel-switcher.item-keyboard-v2.focus-item-keyboard {
  border: none !important;
}

.channel-logo-container {
  position: absolute;
  top: 32.1em;
  left: 0;
  width: 0%;
  border-radius: 0em 8em 8em 0em;
}

.with-program {
  top: 29em !important;
}

.channel-info {
  position: absolute;
  top: 32.1em;
  left: 0;
  width: 9.7%;
  height: 126px;
  border-radius: 0em 8em 8em 0em;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease;
  -webkit-transition-delay: 0s;
  -webkit-transition-property: -webkit-transform;
  transition-duration: 0.5s;
  transition-timing-function: ease;
  transition-delay: 0s;
  transition-property: transform;
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
}
.channel-info.ng-hide {
  -webkit-transform: translateX(-500%);
  transform: translateX(-500%);
}

.elements-container {
  position: absolute;
  width: 87.3%;
  top: 85.4%;
  right: 19%;
}
.elements-container .programmation-container {
  width: 74%;
  display: inline-block;
  margin-left: 9%;
  vertical-align: middle;
}

.btn-channel {
  background-color: #22313f;
  color: white;
  border-radius: 30px;
  padding: 6px 6px;
  display: inline-block;
  font-size: 16px;
  border: 4px solid transparent;
  width: 21%;
  vertical-align: middle;
  position: absolute;
  right: 9.9%;
  top: 86.1%;
}
.btn-channel span.btn-guide {
  width: 30px;
  height: 30px;
  display: inline-block;
  vertical-align: middle;
}
.btn-channel .btn-guide-text {
  display: inline-block;
  vertical-align: middle;
  font-size: 16px;
  font-family: "montserrat-bold";
}

.login .img-form.letter-form {
  margin-top: 50px;
  margin-bottom: 15px;
}
.login .logo {
  margin-top: 50px;
}
.login .cont-inputs-auth {
  margin-top: 40px;
}
.login .btn-signup.btn-recovery {
  margin-top: 50px;
}
.login .btn-signup.btn-signup-not-account {
  margin-top: 15px;
}

.btn-signin-fb.btn-app, .btn-signin-fb.btn-sreaction {
  background-color: #3A589C;
  border-color: #3A589C;
}

.txt-condition-user {
  font-size: 14px;
  width: 380px;
  margin: auto;
  text-align: justify;
}

.cont-btn-back {
  height: 50px;
  width: 50px;
  color: white;
  /* margin-left: 10px; */
  display: inline-block;
  /* float: left; */
  position: absolute;
  left: 28px;
  z-index: 10;
  top: 14px;
}
.cont-btn-back .btn-back {
  padding: 7px 6px;
  font-size: 20px;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/left-icon.png);
  border: 4px solid #0f6494;
  width: 45px;
  height: 45px;
  background-size: cover;
}
.cont-btn-back .btn-back .icon-back {
  width: 17px;
  display: none;
}
.cont-btn-back .btn-close {
  padding: 7px 6px;
  font-size: 20px;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/close-icon.png);
  border: 4px solid #0f6494;
  width: 45px;
  height: 45px;
  background-size: cover;
}
.cont-btn-back .btn-close .icon-back {
  width: 17px;
  display: none;
}
.cont-btn-back .item-keyboard-v2 {
  border-radius: 50%;
}
#cont-btn-root-back {
  height: 50px;
  width: 50px;
  color: white;
}
#cont-btn-root-back .root-back {
  width: 60px;
  height: 60px;
  background: url(../assets/images/menu-back-icon.png) center center;
  background-size: contain;
  background-repeat: no-repeat;
}
#cont-btn-root-back .root-back .icon-back {
  width: 52px;
  height: 52px;
}
#cont-btn-root-back .item-keyboard-v2 {
  border-radius: 50%;
  transition: transform 0.2s;
}
#cont-btn-root-back .item-keyboard-v2.focus-item-keyboard {
  border: none !important;
  transform: scale(1.1);
  -webkit-transform: scale(20deg); /* Safari & Chrome */
  -moz-transform: scale(20deg); /* Firefox */
  -ms-transform: scale(20deg); /* Internet Explorer */
  -o-transform: scale(20deg); /* Opera */
}

#cont-btn-root-back {
  height: 50px;
  width: 50px;
  color: white;
}
#cont-btn-root-back .root-back {
  width: 60px;
  height: 60px;
  background: url(../assets/images/menu-back-icon.png) center center;
  background-size: contain;
  background-repeat: no-repeat;
}
#cont-btn-root-back .root-back .icon-back {
  width: 52px;
  height: 52px;
}
#cont-btn-root-back .item-keyboard-v2 {
  border-radius: 50%;
  transition: transform 0.2s;
}
#cont-btn-root-back .item-keyboard-v2.focus-item-keyboard {
  border: none !important;
  transform: scale(1.1);
  -webkit-transform: scale(20deg); /* Safari & Chrome */
  -moz-transform: scale(20deg); /* Firefox */
  -ms-transform: scale(20deg); /* Internet Explorer */
  -o-transform: scale(20deg); /* Opera */
}

.product {
  border-radius: 0.8rem;
  text-align: left;
  height: 14rem;
  overflow: hidden;
  margin-bottom: 0.8rem;
}
.product.item-keyboard-v2 {
  border: 4px solid #132835;
}
.product.item-keyboard-v2.focus-item-keyboard {
  background-color: #132835;
}
.product.no-border {
  border: 4px solid transparent;
  border-left: none;
}
.product.no-border .preview-product {
  margin: 1.5rem 1rem 1.5rem 0rem;
}
.product .preview-product {
  background-repeat: no-repeat;
  width: 10rem;
  height: 10rem;
  background-size: contain;
  background-position: center;
  position: relative;
  margin: 1.5rem 1rem 1.5rem 1.7rem;
  border-radius: 0.5rem;
  display: inline-block;
}
.product .cont-info-product {
  width: 22rem;
  display: inline-block;
  height: 100%;
  vertical-align: top;
  padding-left: 0.2rem;
  font-family: "Montserrat";
  position: relative;
}
.product .cont-info-product .title-item {
  font-size: 1.5rem;
  margin-top: 1.6rem;
  font-weight: 700;
  -webkit-line-clamp: 2;
  overflow: hidden;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  text-overflow: ellipsis;
}
.product .cont-info-product .description-item {
  font-size: 1.2rem;
  line-height: 1.1;
  font-weight: 400;
  -webkit-line-clamp: 2;
  overflow: hidden;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  text-overflow: ellipsis;
}
.product .cont-info-product .price-item {
  color: #ffe346;
  font-size: 1.7rem;
  position: absolute;
  bottom: 1.2rem;
}
.product .cont-info-product .price-item .price {
  color: #ffe346;
  font-size: 1.7rem;
}
.product .cont-info-product .price-item .sold {
  background-color: #4ccb23;
  color: white;
  font-size: 1rem;
  padding: 0.1em;
  font-weight: bold;
  word-spacing: 0.7em;
  letter-spacing: 0.1em;
  padding-left: 1em;
  padding-right: 1em;
  border-radius: 1rem;
  position: absolute;
  bottom: 0.1rem;
}
.product .cont-info-product .product-detail {
  color: white;
  font-size: 1rem;
  position: absolute;
  bottom: 1.4rem;
  right: 1rem;
}

.cont-notification {
  padding: 10px;
  background-color: #173345;
  color: white;
  position: fixed;
  margin: auto;
  top: 75px;
  text-align: center;
  left: -100%;
  width: 300px;
  height: 100px;
  font-size: 14px;
  border-radius: 0 50px 50px 0;
  z-index: 35;
  -webkit-transition: left 0.3s;
  -moz-transition: left 0.3s;
  -ms-transition: left 0.3s;
  -o-transition: left 0.3s;
  transition: left 0.3s;
}
.cont-notification .text-notification {
  width: 205px;
  text-align: left;
  max-height: 80px;
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
}
.cont-notification .img-notification {
  width: 45px;
  height: 45px;
  margin-right: 15px;
  position: relative;
  top: 18px;
  display: inline-block;
  vertical-align: top;
}

.direct-notification {
  text-align: center;
}

.open-notification.cont-notification {
  left: 0;
}

.ppvs.home.col-md-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}
.ppvs.home.col-md-12 img.logo {
  width: 60px;
  max-height: 60px;
  position: absolute;
  right: 6%;
  top: 3%;
  margin-top: 0;
}
.ppvs.home.col-md-12 .subtitle {
  text-align: left;
  margin-top: 10rem;
  font-weight: bold;
  font-size: 2.2rem;
}
.ppvs.home.col-md-12 .list-viewport {
  overflow: hidden;
  margin-top: 2.3rem;
}
.ppvs.home.col-md-12 .list-container {
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease;
  transition-property: transform;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.ppvs.home.col-md-12 .list-videos .el-grid {
  border-color: transparent;
  width: 390px;
  height: 120px;
  float: none;
  margin: 0;
  overflow: hidden;
}
.ppvs.home.col-md-12 .list-videos .el-grid.focus-item-keyboard {
  border-color: white;
}
.ppvs.home.col-md-12 .list-videos .el-grid .preview-video,
.ppvs.home.col-md-12 .list-videos .el-grid .cont-info-video {
  float: left;
}
.ppvs.home.col-md-12 .list-videos .el-grid .description-item-video {
  max-height: 45px;
  padding-top: 6px;
  position: absolute;
  top: 31%;
  line-height: 1.4em;
  font-size: 13px;
  overflow: hidden;
  height: 3.5em;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
.ppvs.home.col-md-12 .list-videos .el-grid .price-item-video {
  position: absolute;
  top: 75%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.ppvs.home.col-md-12 .list-videos .el-grid .price-item-video .sold {
  background-color: #4ccb23;
  color: white;
  font-size: 0.8em;
  padding: 0.3em;
  font-weight: bold;
  word-spacing: 0.7em;
  letter-spacing: 0.1em;
  padding-left: 0.6em;
  padding-right: 0.6em;
}
.ppvs.home.col-md-12 .list-videos .el-grid .price-item-video .price {
  background-color: #ffe346;
  color: #555555;
  font-size: 0.8em;
  padding: 0.3em;
  font-weight: bold;
  word-spacing: 0.7em;
}
.ppvs.home.col-md-12 .list-videos .el-grid .price-item-video .date-debut {
  font-family: "montserrat-bold";
  font-size: 0.85rem;
  margin-left: 1em;
  letter-spacing: 0.5px;
}
.ppvs.home.col-md-12 .list-videos .el-grid .price-item-video .live-now {
  font-family: "montserrat-bold";
  font-weight: bold;
  letter-spacing: 1px;
}
.ppvs.home.col-md-12 .list-videos .el-grid .preview-video {
  margin-top: 5px;
  margin-left: 10px;
  width: 150px;
  height: 100px;
  background-color: white;
  background-size: cover;
  background-position: center;
  position: relative;
}
.ppvs.home.col-md-12 .list-videos .el-grid .preview-video .icon-play-videos {
  margin: 20px auto 0;
  width: 50px;
  height: 50px;
}
.ppvs.home.col-md-12 .list-videos .el-grid .preview-video .date-item-video {
  position: absolute;
  right: 5px;
  bottom: 5px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  padding: 3px;
  border-radius: 3px;
  display: inline-block;
  height: 19px;
  vertical-align: bottom;
  line-height: 10px;
  font-size: 13px;
}
.ppvs.home.col-md-12 .list-videos .el-grid .cont-info-video {
  width: 57%;
  text-align: left;
  font-size: 13px;
  padding-left: 10px;
  height: 100%;
  position: relative;
}
.ppvs.home.col-md-12 .list-videos .el-grid .cont-info-video .title-item-video {
  font-family: "montserrat-bold";
  font-size: 14px;
  font-weight: bold;
  max-height: 60px;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.checkout.home.col-md-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}
.checkout.home.col-md-12 img.logo {
  width: 60px;
  max-height: 60px;
  position: absolute;
  right: 6%;
  top: 3%;
  margin-top: 0;
}
.checkout.home.col-md-12 .subtitle {
  text-align: left;
  margin-top: 8rem;
  font-weight: bold;
}
.checkout.home.col-md-12 .checkout-separator {
  margin-top: 2rem;
}
.checkout.home.col-md-12 .payment-options-title {
  margin-top: 3.5rem;
  text-align: left;
  font-weight: bold;
}
.checkout.home.col-md-12 .pix-container {
  width: 100%;
  margin-top: 2rem;
}
.checkout.home.col-md-12 .pix-container .pix-title {
  text-align: center;
  font-size: 1.7rem;
  font-weight: bold;
}
.checkout.home.col-md-12 .pix-container .pix-title img {
  vertical-align: middle;
  width: 7rem;
  margin-left: 1rem;
}
.checkout.home.col-md-12 .pix-container .pix-instructions {
  text-align: center;
  font-size: 1.5rem;
  font-weight: 400;
  width: 80%;
  margin: auto;
  margin-top: 2rem;
}
.checkout.home.col-md-12 .pix-container .pix-steps {
  text-align: left;
  font-size: 1.5rem;
  font-weight: 400;
  margin: auto;
  margin-top: 4rem;
  line-height: 1.5;
}
.checkout.home.col-md-12 .pix-container .qr-image {
  width: 18rem;
  height: 18rem;
  background-color: white;
  margin: auto;
  margin-top: 2rem;
  background-size: cover;
  background-position: center;
}
.checkout.home.col-md-12 .pix-container .time-remaining {
  text-align: center;
  font-size: 1.1rem;
  margin-top: 3.3rem;
}
.checkout.home.col-md-12 .payment-options-container {
  width: 100%;
  margin-top: 2rem;
}
.checkout.home.col-md-12 .payment-options-container .payment-option {
  border: 4px solid #132835;
  height: 10rem;
  border-radius: 1rem;
  margin-bottom: 1.5rem;
  text-align: left;
  font-size: 1.7rem;
  padding: 2.2rem 1.5rem;
}
.checkout.home.col-md-12 .payment-options-container .payment-option.focus-item-keyboard {
  border: 4px solid white;
  background-color: #132835;
}
.checkout.home.col-md-12 .payment-options-container .payment-option .payment-option-description {
  display: inline-block;
  text-align: left;
  width: 55%;
  line-height: 1.2;
}
.checkout.home.col-md-12 .payment-options-container .payment-option .payment-option-image {
  display: inline-block;
  width: 42%;
  float: right;
}
.checkout.home.col-md-12 .payment-options-container .payment-option .payment-option-image .payment-with-card {
  width: 100%;
  height: 100%;
  text-align: right;
  line-height: 2.4;
}
.checkout.home.col-md-12 .payment-options-container .payment-option .payment-option-image .payment-with-card img {
  width: 3rem;
}
.checkout.home.col-md-12 .payment-options-container .payment-option .payment-option-image .payment-with-pix {
  width: 100%;
  height: 100%;
  text-align: right;
  line-height: 2.4;
  font-size: 1.3rem;
  margin-top: 1rem;
}
.checkout.home.col-md-12 .payment-options-container .payment-option .payment-option-image .payment-with-pix img {
  width: 6.5rem;
}

.thanks-purchase.home.col-md-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}
.thanks-purchase.home.col-md-12 img.logo {
  width: 60px;
  max-height: 60px;
  position: absolute;
  right: 6%;
  top: 3%;
  margin-top: 0;
}
.thanks-purchase.home.col-md-12 .subtitle {
  text-align: left;
  margin-top: 8rem;
  font-weight: bold;
}
.thanks-purchase.home.col-md-12 .description {
  text-align: left;
  line-height: 1.2;
  margin-top: 2rem;
}
.thanks-purchase.home.col-md-12 .thanks-purchase-separator {
  margin-top: 2rem;
}

.select-plan.home.col-md-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}
.select-plan.home.col-md-12 img.logo {
  width: 60px;
  max-height: 60px;
  position: absolute;
  right: 6%;
  top: 3%;
  margin-top: 0;
}
.select-plan.home.col-md-12 .title {
  text-align: left;
  margin-top: 10rem;
  font-weight: bold;
  font-size: 2.1rem;
}
.select-plan.home.col-md-12 .subtitle {
  text-align: left;
  font-size: 1.75rem;
  margin-top: 1.5rem;
  line-height: 1.3;
  max-width: 90%;
  font-weight: 500;
}
.select-plan.home.col-md-12 .plan-options-container {
  width: 100%;
  margin-top: 2rem;
}
.select-plan.home.col-md-12 .plan-options-container .plan-option {
  border: 4px solid #132835;
  height: 7.5rem;
  border-radius: 1rem;
  margin-bottom: 1.5rem;
  text-align: left;
  font-size: 1.7rem;
  padding: 2.2rem 1.5rem;
}
.select-plan.home.col-md-12 .plan-options-container .plan-option.focus-item-keyboard {
  border: 4px solid white;
  background-color: #132835;
}
.select-plan.home.col-md-12 .plan-options-container .plan-option:hover {
  border: 4px solid white;
  background-color: #132835;
}
.select-plan.home.col-md-12 .plan-options-container .plan-option .plan-image {
  display: inline-block;
  text-align: left;
  width: 2.8rem;
  line-height: 1.2;
  vertical-align: top;
}
.select-plan.home.col-md-12 .plan-options-container .plan-option .plan-image img {
  width: 100%;
}
.select-plan.home.col-md-12 .plan-options-container .plan-option .plan-option-description {
  display: inline-block;
  text-align: left;
  width: 60%;
  line-height: 1.2;
  margin-left: 1rem;
  font-size: 1.7rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select-plan.home.col-md-12 .plan-options-container .plan-option .plan-price {
  color: rgb(255, 227, 70);
  display: block;
  text-align: right;
  line-height: 1.2;
  font-size: 1.7rem;
  font-weight: bold;
  float: right;
}

.videos.home.col-md-12 img.logo {
  width: 56px;
  height: 56px;
  margin-bottom: 10px;
}
.videos.home.col-md-12 .list-videos .el-grid {
  border-color: transparent;
  width: 390px;
  height: 120px;
  float: none;
  margin: 0;
  overflow: hidden;
}
.videos.home.col-md-12 .list-videos .el-grid.focus-item-keyboard {
  border-color: white;
}
.videos.home.col-md-12 .list-videos .el-grid .preview-video, .videos.home.col-md-12 .list-videos .el-grid .cont-info-video {
  float: left;
}
.videos.home.col-md-12 .list-videos .el-grid .description-item-video {
  max-height: 47px;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 13px;
  padding-top: 10px;
}
.videos.home.col-md-12 .list-videos .el-grid .preview-video {
  margin-top: 10px;
  margin-left: 10px;
  width: 150px;
  height: 100px;
  background-color: white;
  background-size: cover;
  background-position: center;
  position: relative;
}
.videos.home.col-md-12 .list-videos .el-grid .preview-video .icon-play-videos {
  margin: 20px auto 0;
  width: 50px;
  height: 50px;
}
.videos.home.col-md-12 .list-videos .el-grid .preview-video .date-item-video {
  position: absolute;
  right: 5px;
  bottom: 5px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  padding: 3px;
  border-radius: 3px;
  display: inline-block;
  height: 19px;
  vertical-align: bottom;
  line-height: 10px;
  font-size: 13px;
}
.videos.home.col-md-12 .list-videos .el-grid .cont-info-video {
  width: 200px;
  text-align: left;
  font-size: 13px;
  padding-left: 10px;
}
.videos.home.col-md-12 .list-videos .el-grid .cont-info-video .title-item-video {
  font-size: 14px;
  font-weight: bold;
  max-height: 60px;
  text-overflow: ellipsis;
  overflow: hidden;
}

.invitations.home.col-md-12 img.logo {
  margin-bottom: 10px;
}
.invitations.home.col-md-12 .list-invitations .el-grid {
  width: 390px;
  height: 80px;
  margin: 6px 0;
}
.invitations.home.col-md-12 .list-invitations .cont-text-invitation {
  position: relative;
  top: 15px;
  text-align: left;
}
.invitations.home.col-md-12 .list-invitations .cont-text-invitation, .invitations.home.col-md-12 .list-invitations .email-user-i {
  width: 140px;
  display: inline-block;
  text-overflow: ellipsis;
  overflow: hidden;
}
.invitations.home.col-md-12 .list-invitations .email-user-i {
  font-size: 13px;
}
.invitations.home.col-md-12 .list-invitations .photo-user-i {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-image: url("../assets/images/menu.png");
  background-size: contain;
}
.invitations.home.col-md-12 .list-invitations .btn-invitation {
  border-radius: 50%;
  width: 45px;
  height: 45px;
  background-size: cover;
  background-position: center;
}
.invitations.home.col-md-12 .list-invitations .btn-invitation.accepted-invitation {
  background-color: #01CC4C;
  border-color: #01CC4C;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/accept.png);
  margin-left: 20px;
}
.invitations.home.col-md-12 .list-invitations .btn-invitation.decline-invitation {
  background-color: #D60001;
  border-color: #D60001;
  margin-left: 20px;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/decline.png);
}
.invitations.home.col-md-12 .list-invitations .btn-invitation.decline-invitation.focus-item-keyboard, .invitations.home.col-md-12 .list-invitations .btn-invitation.accepted-invitation.focus-item-keyboard {
  border-color: white;
}
.invitations.home.col-md-12 .list-invitations .message-response-invit {
  display: none;
}
.invitations.home.col-md-12 .list-invitations .invitation-respon .btn-invitation {
  display: none !important;
}
.invitations.home.col-md-12 .list-invitations .invitation-respon .message-response-invit {
  display: inline-block;
}
.invitations.home.col-md-12 .list-invitations .name-user-i {
  max-height: 52px;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 17px;
}
.invitations.home.col-md-12 .list-invitations .btn-invitation, .invitations.home.col-md-12 .list-invitations .photo-user-i, .invitations.home.col-md-12 .list-invitations .name-user-i {
  display: inline-block;
  vertical-align: -webkit-baseline-middle;
  vertical-align: middle;
}

#player-el-view {
  width: 1280px;
  height: 720px;
  position: fixed;
  top: 0;
  left: 0;
}
#player-el-view video {
  position: relative;
  width: 100%;
  height: 101%;
}
#player-el-view a {
  opacity: 0;
}

.player-view .cont-btn-back, .player-modal .cont-btn-back {
  position: fixed;
}

#player {
  position: fixed;
}

.btns-player {
  position: fixed;
  width: 300px;
  z-index: 4;
  text-align: center;
  top: 640px;
  left: 510px;
}
.btns-player .keyboard-parent {
  display: inline-block;
}
.btns-player .item-keyboard-v2 {
  height: 30px;
  background-color: #0F495D;
  margin: 2px;
  display: inline-block;
}

.favorites.col-md-12 {
  padding-top: 70px;
}

.favorite-brand .icon-to-favorite {
  position: absolute;
  right: 5px;
  bottom: 5px;
  width: 16px;
  display: none;
}
.favorite-brand.selected.selectedInit .img-picked {
  display: none;
}
.favorite-brand.selected.selectedInit .icon-to-favorite {
  display: block;
}

.cont-brands,
.cont-friends {
  padding: 20px;
  overflow: hidden;
}
.cont-brands .list-brands,
.cont-brands .list-friends,
.cont-friends .list-brands,
.cont-friends .list-friends {
  margin: auto;
  width: 316px;
}
.cont-brands .list-brands .brands,
.cont-brands .list-brands .friend,
.cont-brands .list-friends .brands,
.cont-brands .list-friends .friend,
.cont-friends .list-brands .brands,
.cont-friends .list-brands .friend,
.cont-friends .list-friends .brands,
.cont-friends .list-friends .friend {
  background-size: 70%;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
}
.cont-brands .list-brands .brands span,
.cont-brands .list-brands .friend span,
.cont-brands .list-friends .brands span,
.cont-brands .list-friends .friend span,
.cont-friends .list-brands .brands span,
.cont-friends .list-brands .friend span,
.cont-friends .list-friends .brands span,
.cont-friends .list-friends .friend span {
  font-size: 15px;
  position: absolute;
  top: 106%;
  width: 100%;
  left: 0;
  color: white;
}
.cont-brands .list-brands .brands .channel-number,
.cont-brands .list-brands .friend .channel-number,
.cont-brands .list-friends .brands .channel-number,
.cont-brands .list-friends .friend .channel-number,
.cont-friends .list-brands .brands .channel-number,
.cont-friends .list-brands .friend .channel-number,
.cont-friends .list-friends .brands .channel-number,
.cont-friends .list-friends .friend .channel-number {
  visibility: hidden;
}
.cont-brands .list-brands .brands.focus-item-keyboard .channel-number,
.cont-brands .list-brands .friend.focus-item-keyboard .channel-number,
.cont-brands .list-friends .brands.focus-item-keyboard .channel-number,
.cont-brands .list-friends .friend.focus-item-keyboard .channel-number,
.cont-friends .list-brands .brands.focus-item-keyboard .channel-number,
.cont-friends .list-brands .friend.focus-item-keyboard .channel-number,
.cont-friends .list-friends .brands.focus-item-keyboard .channel-number,
.cont-friends .list-friends .friend.focus-item-keyboard .channel-number {
  visibility: visible;
  position: absolute;
  top: 4px;
  left: 0;
  background-color: #006790;
  border-radius: 0em 2em 2em 0em;
  text-align: center;
  padding-right: 1em;
  font-size: 14px;
  width: auto;
  font-weight: bold;
  padding: 2px 12px;
  font-family: "montserrat-bold";
  min-width: 36%;
  max-width: 50%;
}

.list-grid {
  overflow: hidden;
}
.list-grid .el-grid {
  width: 100px;
  height: 100px;
  float: left;
  border-width: 2px;
  margin: 0 5px 5px 0;
  background-color: transparent;
}
.list-grid .el-grid.focus-item-keyboard {
  border-width: 2px;
}
.list-grid .el-grid.last-row {
  margin-right: 0;
}
.list-grid .btn-arrow {
  border-radius: 50%;
  margin: auto;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 120%;
}
.list-grid .btn-arrow.btn-up {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/up-arrow.png);
  margin-bottom: 20px;
}
.list-grid .btn-arrow.btn-down {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/down-arrow.png);
  margin: 20px auto 0;
}

.home.videos.col-md-12.promotions {
  padding-left: 3rem;
  padding-right: 3rem;
}
.home.videos.col-md-12.promotions img.logo {
  width: 60px;
  max-height: 60px;
  position: absolute;
  right: 6%;
  top: 3%;
  margin-top: 0;
}
.home.videos.col-md-12.promotions .promotions-logo-container {
  text-align: left;
}
.home.videos.col-md-12.promotions .promotions-logo-container .promotions-logo {
  width: 4rem;
  margin-top: 8rem;
}
.home.videos.col-md-12.promotions .subtitle {
  text-align: left;
  margin-top: 1rem;
  font-weight: 700;
  font-size: 1.9rem;
  font-family: "Montserrat";
}
.home.videos.col-md-12.promotions .list-viewport {
  overflow: hidden;
  margin-top: 2.3rem;
}
.home.videos.col-md-12.promotions .list-container {
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease;
  transition-property: transform;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.home.videos.col-md-12.promotions .list-videos .el-grid .cont-info-video {
  width: 150px;
  margin-top: 25px;
}
.home.videos.col-md-12.promotions .list-videos .el-grid .preview-video {
  width: 85px;
  height: 85px;
}
.home.videos.col-md-12.promotions .cont-btns-promotions {
  display: inline-block;
  margin-top: 25px;
}
.home.videos.col-md-12.promotions .cont-btns-promotions .btn-promotions {
  display: inline-block;
  border-radius: 50%;
  height: 47px;
  width: 47px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.home.videos.col-md-12.promotions .cont-btns-promotions .btn-promotions.btn-msg {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/send-promo.png);
}
.home.videos.col-md-12.promotions .cont-btns-promotions .btn-promotions.btn-view {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/see-promo.png);
}

.flowplayer .fp-ui,
.flowplayer .fp-engine {
  z-index: 0 !important;
  width: 100%;
  height: 100%;
}

.fp-time {
  display: none !important;
}

.subtitles-button {
  color: #fff;
  position: absolute;
  left: 153.1%;
  top: 18.4%;
  background-color: #1f3343 !important;
  width: 14.7rem;
  border-radius: 5rem;
  height: 3.2rem !important;
  font-size: 1.3rem;
  line-height: 2.4rem;
}

.btns-premium {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 50;
  bottom: 10%;
}
.btns-premium .premium-button {
  color: white;
  background-color: #006790;
  height: 2.5em;
  border-radius: 2em;
  padding-left: 1em;
  padding-right: 1em;
  z-index: 50;
}

.player-modal .flowplayer .fp-waiting {
  margin-top: 29%;
}

.player-modal {
  background-size: cover;
}

.video-player-error {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: white;
  font-size: 25px;
  text-align: center;
  width: 100%;
  opacity: 0.75;
  z-index: 150;
}

#loading-video {
  color: red;
  font-size: 30px;
  position: fixed;
  top: 328px;
  text-align: center;
  width: 100%;
  display: block;
}
#loading-video img {
  width: 64px;
  height: 64px;
}

#player,
#block-click-player,
.player-modal {
  visibility: hidden;
}

.player-modal {
  background-color: black;
}
.player-modal .cont-info {
  color: white;
  font-size: 20px;
  position: absolute;
  z-index: 2;
  text-align: left;
  top: 205px;
  left: 87px;
}
.player-modal .cont-info .name-video-m {
  font-size: 30px;
  margin-bottom: 5px;
  text-transform: uppercase;
}
.player-modal .cont-info .date-video-m {
  margin-bottom: 16px;
}
.player-modal .cont-info * {
  font-family: "advert-rough-four";
}

.description-l {
  margin-top: 5px;
}

.cont-bar-progress {
  position: absolute;
  margin: auto;
  width: 1140px;
  text-align: center;
  left: 70px;
  top: 600px;
}
.cont-bar-progress .time-m,
.cont-bar-progress .bar-progress-1 {
  display: inline-block;
  vertical-align: top;
}
.cont-bar-progress .time-m {
  width: 70px;
}
.cont-bar-progress .time-m.time-m-full-time {
  text-align: left;
}
.cont-bar-progress .time-m.time-m-current-time {
  text-align: right;
}
.cont-bar-progress .bolita {
  position: absolute;
  height: 28.8px;
  width: 28.8px;
  background-color: #193345;
  z-index: 50;
  left: 90px;
  top: 0;
  border-radius: 50%;
  bottom: 0;
  margin: auto;
}
.cont-bar-progress .bar-progress-1 {
  width: 960px;
  height: 15px;
  border-radius: 20px;
  position: relative;
  background-color: grey;
  overflow: hidden;
  top: 6px;
}
.cont-bar-progress .bar-progress-1 .bar-progress-2 {
  background-color: #006691;
  position: absolute;
  left: 0;
  top: 0;
  height: 15px;
  width: 100%;
  transform: translateX(-100%);
}

.btns-player.btns-player-m {
  top: 630px;
}
.btns-player.btns-player-m .btn-player-m {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-size: contain;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
}
.btns-player.btns-player-m .btn-player-m.btn-previus-m {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/rewind.png);
  margin-right: 7px;
}
.btns-player.btns-player-m .btn-player-m.btn-previus-m.item-keyboard-v2.focus-item-keyboard {
  border-color: transparent !important;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/rewind-hover.png);
}
.btns-player.btns-player-m .btn-player-m.btn-play-m {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/play.png);
}
.btns-player.btns-player-m .btn-player-m.btn-play-m.item-keyboard-v2.focus-item-keyboard {
  border-color: transparent !important;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/play-hover.png);
}
.btns-player.btns-player-m .btn-player-m.btn-pause-m {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/pause.png);
}
.btns-player.btns-player-m .btn-player-m.btn-pause-m.item-keyboard-v2.focus-item-keyboard {
  border-color: transparent !important;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/pause-hover.png);
}
.btns-player.btns-player-m .btn-player-m.btn-stop-m {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/player-back.png);
  position: fixed;
  top: 150px;
  left: 30px;
}
.btns-player.btns-player-m .btn-player-m.btn-seek-m {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/forward.png);
  margin-left: 7px;
}
.btns-player.btns-player-m .btn-player-m.btn-seek-m.item-keyboard-v2.focus-item-keyboard {
  border-color: transparent !important;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/forward-hover.png);
}

#player .flowplayer .fp-engine {
  z-index: 0 !important;
}
#player a {
  visibility: hidden;
}

.player-modal.carousel-mode {
  width: 421px !important;
  max-width: 421px !important;
  height: 234px !important;
  z-index: 10;
  transform: translate(528px, 39px);
}
.player-modal.carousel-mode .block-click-player {
  width: 421px !important;
  max-width: 421px;
  height: 234px !important;
  max-height: 234px;
}
.player-modal.carousel-mode .video-js {
  width: 421px !important;
  max-width: 421px !important;
  height: 234px !important;
  max-height: 234px;
}
.player-modal.carousel-mode video {
  width: 421px !important;
  max-width: 421px !important;
  height: 234px;
  max-height: 234px;
}
.player-modal.program-mode {
  width: 421px !important;
  max-width: 421px !important;
  height: 239px !important;
  z-index: 10;
  transform: translate(44px, 40px);
}
.player-modal.program-mode .block-click-player {
  width: 421px !important;
  max-width: 421px;
  height: 239px !important;
  max-height: 234px;
}
.player-modal.program-mode .video-js {
  width: 421px !important;
  max-width: 421px !important;
  height: 239px !important;
  max-height: 234px;
}
.player-modal.program-mode video {
  width: 421px !important;
  max-width: 421px !important;
  height: 239px !important;
  max-height: 234px;
}

#playerWelcome {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  visibility: hidden;
  z-index: 1;
}

#playerWelcome.vjs-playing,
#playerWelcome.force-visible {
  visibility: visible !important;
}

.select-brand.partial {
  z-index: 0;
  width: 1280px;
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/backgroundSelBrand.jpg);
  height: 720px;
  background-size: contain;
  text-align: right;
}

.text-title-brand {
  color: white;
  text-align: center;
  margin-top: 517px;
  font-weight: bold;
  font-size: 28px;
}

.icon-bi {
  width: 100px;
  height: 100px;
  position: fixed;
  top: 20px;
  left: 20px;
  display: none;
}

.cont-brands-init {
  display: inline-block;
  margin-right: 470px;
  margin-top: 35px;
}
.cont-brands-init .info-brand-i {
  position: absolute;
  left: 100%;
  text-align: left;
  margin-top: 60px;
  margin-left: 20px;
  width: 190px;
  display: none;
}
.cont-brands-init .info-brand-i .name-brand {
  font-size: 20px;
  text-transform: uppercase;
}
.cont-brands-init .not-invitations.welcome-loading,
.cont-brands-init .not-invitations.empty-brands {
  position: relative;
  z-index: 2;
}
.cont-brands-init .brand-init-parent .brand-init {
  z-index: 2;
  display: inline-block;
  width: 332px;
  height: 60px;
  border-radius: 35px;
  border: 4px solid transparent;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-color: #006790;
  text-align: center;
  padding-top: 12px;
  font-size: 21px;
  font-weight: bold;
}
.cont-brands-init .brand-init-parent .brand-init * {
  font-family: "advert-rough-four";
}
.cont-brands-init .brand-init-parent .brand-init.focus-item-keyboard {
  border-color: white;
}
.cont-brands-init .brand-init-parent .brand-init.focus-item-keyboard .info-brand-i {
  display: block;
}

#last-video-zone {
  background-size: cover;
  position: fixed;
  z-index: 0;
  text-align: left;
  font-size: 0;
}

.txt-green {
  color: #32E188;
}

.cont-last-video .last-video {
  display: inline-block;
  vertical-align: top;
  background-size: cover;
  background-position: center;
}
.cont-last-video .info-last-video {
  display: inline-block;
  vertical-align: top;
  width: 370px;
  height: 170px;
  background-color: black;
  color: white;
  border-radius: 0 30px 30px 0;
  text-align: left;
  font-size: 13px;
  padding: 20px;
}
.cont-last-video .info-last-video * {
  font-family: "advert-rough-four";
}
.cont-last-video .info-last-video .txt-green, .cont-last-video .info-last-video .date-video-l, .cont-last-video .info-last-video .time-video-l {
  margin-right: 8px;
}
.cont-last-video .info-last-video .title-l {
  font-size: 18px;
  text-transform: uppercase;
}
.cont-last-video .info-last-video .info-l {
  margin-bottom: 10px;
}
.cont-last-video .info-last-video .views-l {
  margin-bottom: 15px;
}

.block-click-out {
  position: fixed;
  width: 1280px;
  height: 720px;
  z-index: 0;
  top: 0;
  left: 0;
}

.wrap-keyboard {
  display: inline-block;
  vertical-align: bottom;
  width: 1280px;
  /* margin-top: 35px; */
  height: 243px;
  padding: 7px 0px;
  background-color: #1D1E26;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;
}
.wrap-keyboard * {
  font-family: "HelveticaNeue bold";
  box-sizing: border-box;
}
.wrap-keyboard .key-board {
  position: relative;
}
.wrap-keyboard .key-board .keyboard-parent {
  width: 94px;
  height: 40px;
  text-align: center;
  float: left;
  background: none repeat scroll 0 0 #21202C;
  color: white;
  margin: 0 0 6px 6px;
  box-sizing: border-box;
  border-radius: 2px;
  padding-left: 0;
}
.wrap-keyboard .key-board .keyboard-parent p {
  font-size: 23px;
  margin: 0;
  height: 100%;
  box-sizing: border-box;
}
.wrap-keyboard .key-board .keyboard-parent .item-keyboard-v2 {
  height: 100%;
}
.wrap-keyboard .key-board .keyboard-parent .item-keyboard-v2.class-sym.class-sym-active {
  text-transform: uppercase;
}
.wrap-keyboard .key-board #keyboard-parent-46 {
  line-height: 35px;
}
.wrap-keyboard .key-board .btn-big .item-keyboard-v2 {
  height: 86px;
  background-color: #21202C;
  line-height: 86px;
}
.wrap-keyboard .key-board .btn-space {
  width: 1130px;
}
.wrap-keyboard .key-board .lg-space {
  width: 130px;
}
.wrap-keyboard .key-board .lg-space p {
  font-size: 18px;
}
.wrap-keyboard .key-board .lg-space.abc p {
  font-size: 29px;
  padding-top: 15px;
}
.wrap-keyboard .key-board .btn-back {
  width: 90px;
}
.wrap-keyboard .key-board .btn-mayus .item-keyboard-v2 {
  background-repeat: no-repeat;
  background-position: center;
}
.wrap-keyboard .key-board .btn-mayus .item-keyboard-v2.lowercaseBtn {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/shift2.png);
}
.wrap-keyboard .key-board .btn-mayus .item-keyboard-v2.uppercaseBtn {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/shift.png);
}
.wrap-keyboard .key-board .btn-back-all {
  width: 128px;
}
.wrap-keyboard .key-board .btn-back-all p {
  font-size: 18px;
}
.wrap-keyboard .key-board .btn-space {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/space.png);
  background-repeat: no-repeat;
  background-position: center;
}
.wrap-keyboard .key-board .backspace-icon {
  background: url(https://d228lrn091qgk9.cloudfront.net/assets/images/delete.png);
  background-repeat: no-repeat;
  background-position: center;
}
.wrap-keyboard .key-board .iblock {
  display: inline-block;
  height: 52px;
  font-size: 20px;
  width: 344px;
  cursor: pointer;
  margin-top: 1px;
  background-color: #21202C;
  text-align: center;
  color: white;
}
.wrap-keyboard .key-board .iblock .item-keyboard-v2, .wrap-keyboard .key-board .iblock .btn-submit, .wrap-keyboard .key-board .iblock .text-btn-submit {
  height: 52px;
  padding-top: 11px;
  display: block;
  color: white;
}
.wrap-keyboard .key-board .iblock .item-keyboard-v2.focus-item-keyboard, .wrap-keyboard .key-board .iblock .btn-submit.focus-item-keyboard, .wrap-keyboard .key-board .iblock .text-btn-submit.focus-item-keyboard {
  color: white;
}
.wrap-keyboard .key-board .iblock .item-keyboard-v2.email-correct, .wrap-keyboard .key-board .iblock .btn-submit.email-correct, .wrap-keyboard .key-board .iblock .text-btn-submit.email-correct {
  color: white;
}
.wrap-keyboard .key-board .iblock .item-keyboard-v2 .back-text-active, .wrap-keyboard .key-board .iblock .btn-submit .back-text-active, .wrap-keyboard .key-board .iblock .text-btn-submit .back-text-active {
  color: white;
}
.wrap-keyboard .key-board .iblock .text-btn-submit {
  color: grey !important;
}
.wrap-keyboard .key-board .iblock .item.focus-item-keyboard {
  border: 4px solid black;
}
.wrap-keyboard .key-board .iblock.cont-btn-submit {
  float: right;
  margin-top: 20px;
}
.wrap-keyboard.mayusClass .key-board .keyboard-key-parent .keyboard-key p {
  text-transform: uppercase;
}
.wrap-keyboard.mayusClass .key-board .keyboard-key-parent.lg-space p, .wrap-keyboard.mayusClass .key-board .keyboard-key-parent.mg-space p, .wrap-keyboard.mayusClass .key-board .keyboard-key-parent.lg-space-extra p {
  text-transform: lowercase;
}
.wrap-keyboard.mayusClass .key-board .keyboard-key-parent.lg-space.btn-big p {
  text-transform: uppercase;
}
.wrap-keyboard.mayusClass .key-board .keyboard-key-parent.lg-space-extra-2 p, .wrap-keyboard.mayusClass .key-board .keyboard-key-parent.btn-back p, .wrap-keyboard.mayusClass .key-board .keyboard-key-parent.btn-back-all p {
  text-transform: inherit;
}

div#keyboard-parent-34 {
  margin-right: 130px;
}

.btn-mayus .item-keyboard-v2 {
  background-repeat: no-repeat;
  background-position: center;
}
.btn-mayus .item-keyboard-v2.lowercaseBtn {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/shift2.png);
}
.btn-mayus .item-keyboard-v2.uppercaseBtn {
  background-image: url(https://d228lrn091qgk9.cloudfront.net/assets/images/shift.png);
}

.ppv-content {
  box-sizing: border-box;
  position: absolute;
}

.cont-preview {
  position: absolute;
  z-index: 10;
  width: 320px;
  display: inline-block;
  text-align: left;
  right: 130px;
  bottom: 150px;
}
.cont-preview .text-p .label-p-1 {
  font-weight: bold;
  font-family: "montserrat-bold";
}
.cont-preview .text-p .label-p-2 {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.cont-preview .img-preview {
  background: transparent none no-repeat scroll center;
  background-size: cover;
  width: 90%;
  height: 180px;
  margin-top: 10px;
}

.recovery-view .subtitle-email {
  padding: 0 15px;
}

.subtitles.home.col-md-12 .subtitle-title {
  margin-top: 9rem;
  text-align: left;
  margin-left: 8.3rem;
  font-size: 2.45rem;
  font-family: "Montserrat";
  font-weight: bold;
}
.subtitles.home.col-md-12 .subtitles-container {
  margin-top: 3.3rem;
  text-align: left;
}
.subtitles.home.col-md-12 .subtitles-container .subtitle-item {
  height: 5.5rem;
  border: 2px solid transparent;
  line-height: 5.1rem;
  margin-left: 3.3rem;
  margin-right: 3.3rem;
  padding-left: 4.7rem;
  position: relative;
  font-size: 1.67rem;
  box-sizing: border-box;
}
.subtitles.home.col-md-12 .subtitles-container .subtitle-item.active .yellow-check {
  display: block;
}
.subtitles.home.col-md-12 .subtitles-container .subtitle-item .yellow-check {
  position: absolute;
  left: 1.6rem;
  top: 1.9rem;
  width: 1.2rem;
  height: 1.2rem;
  background-image: url(../../assets/images/yellow-check.png);
  background-repeat: no-repeat;
  background-size: cover;
  display: none;
}
.subtitles.home.col-md-12 .subtitles-container .subtitle-item.focus-item-keyboard {
  border: 2px solid white !important;
}
.subtitles.home.col-md-12 .not-invitations {
  color: white;
  z-index: 1000;
  margin-left: 8.3rem;
  text-align: left;
  font-weight: lighter;
  font-size: 1.6rem;
  margin-top: 5.1rem;
  font-family: "Montserrat";
}

#content.container .row {
  margin-top: 0;
}

.tv-home {
  width: 1280px;
  float: right;
  height: 720px;
  background-color: #141414;
  position: relative;
}
.tv-home .logo-container {
  float: left;
  padding-left: 25px;
}
.tv-home .logo-container .logo {
  margin-top: 30px;
  width: 63px;
}
.tv-home .side-menu {
  float: left;
  width: 100px;
  height: 720px;
  position: relative;
}
.tv-home .side-menu .logo-box {
  margin-top: 33px;
}
.tv-home .side-menu .logo-box > img.logo {
  width: 62px;
  margin-top: 0;
  margin-bottom: 45px;
}
.tv-home .side-menu .options {
  position: absolute;
  bottom: 0px;
  width: 100%;
}
.tv-home .side-menu .option {
  height: 79px;
  font-size: 10px;
  padding-top: 10px;
  margin-bottom: 18px;
  border: 4px solid transparent;
}
.tv-home .side-menu .option.item-keyboard-v2.focus-item-keyboard {
  border: 4px solid transparent !important;
}
.tv-home .side-menu .option .icon {
  display: block;
  margin: auto;
  height: 40px;
}
.tv-home .side-menu .option .icon img {
  width: 29px;
}
.tv-home .side-menu .user-picture {
  margin-bottom: 70px;
}
.tv-home .main-container {
  float: right;
  width: 1180px;
}
.tv-home .main-container .tv-home-title {
  margin-left: 23px;
  font-size: 35px;
  margin-bottom: 7px;
  font-family: "montserrat-bold";
}
.tv-home .main-container .vertical-category-menu-container {
  width: 17%;
  padding-left: 5px;
}
.tv-home .main-container .video-items {
  width: 80.9%;
  margin-top: 20px;
  padding-left: 0;
}
.tv-home .channels-container {
  height: 610px;
  overflow-x: hidden;
  overflow-y: auto;
  margin-top: 35.2px;
  position: relative;
}
.tv-home .channels-container .channels-grid {
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease;
  transition-property: transform;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.tv-home .channels-container .channels-grid .channels-row.can-down, .tv-home .channels-container .channels-grid .channels-row.can-up {
  opacity: 0.5;
}
.tv-home .channels-container .channels-grid .channels-row.incomplete {
  text-align: left;
  padding-left: 5.75rem;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container {
  width: 293px;
  padding: 0px;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  height: 232px;
  border-width: 2px;
  background-color: transparent;
  display: inline-block;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container.last-row {
  margin-right: 0;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container span {
  font-size: 15px;
  position: absolute;
  top: 106%;
  width: 100%;
  left: 0;
  color: white;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container .channel-number {
  visibility: hidden;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container.focus-item-keyboard .channel-number {
  visibility: visible;
  position: absolute;
  top: 4px;
  left: 0;
  background-color: #006790;
  border-radius: 0em 2em 2em 0em;
  text-align: center;
  padding-right: 1em;
  font-size: 14px;
  width: auto;
  font-weight: bold;
  padding: 2px 12px;
  font-family: "montserrat-bold";
  min-width: 36%;
  max-width: 50%;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container .channel-item {
  width: 293px;
  height: 165px;
  box-sizing: border-box;
  border: 4px solid transparent;
  position: relative;
  z-index: 100;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container .channel-item.item-keyboard-v2.focus-item-keyboard {
  border: 4px solid white !important;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container .channel-item .channel-item-mask {
  width: 290px;
  height: 165px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container .channel-item .channel-bg {
  background-position: center;
  width: 285px;
  height: 157px;
  position: absolute;
  left: 0px;
  right: 0;
  bottom: 0;
  top: 0px;
}
.tv-home .channels-container .channels-grid .channels-row .channel-item-container .channel-item .channel-player-player-container {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.tv-home .channels-container .channels-grid .channels-row > .channel-item-container:nth-child(2) {
  margin: 0 15px;
}
.tv-home .channels-container .channels-grid .channels-row .video-js {
  width: 100%;
  height: 100%;
  margin: auto;
}
.tv-home .channels-container .channels-grid .channels-row .video-js video {
  object-fit: cover;
}
.tv-home .video-info .image-name-container {
  width: 65%;
  display: inline-block;
  vertical-align: middle;
}
.tv-home .video-info .channel-number {
  visibility: visible !important;
  width: 33%;
  display: inline-block;
  text-align: right;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
}

/* Customize scrollbar */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #202020;
  border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #b3b2b2;
  border-radius: 10px;
  width: 7px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #d9d9d9;
}

.home-screen-page {
  width: 1280px;
  height: 720px;
  float: right;
  background-color: #141414;
  position: relative;
  display: block;
  overflow: hidden;
}

.carousel-container {
  width: 100%;
  height: 315px;
  display: block;
}

.home-channels-container {
  width: 100%;
  height: 405px;
  display: block;
}
.home-channels-container .actions-container {
  height: 100%;
  width: 100px;
  float: left;
  position: relative;
}
.home-channels-container .categories-container {
  height: 100%;
  width: 201px;
  float: left;
  position: relative;
  overflow: hidden;
}
.home-channels-container .schedules-container {
  height: 100%;
  width: 1075px;
  float: left;
  position: relative;
  overflow: hidden;
}

#actions-component .side-menu {
  float: left;
  width: 100px;
  height: 720px;
  padding-left: 5px;
}
#actions-component .side-menu .logo-box {
  margin-top: 33px;
}
#actions-component .side-menu .logo-box > img.logo {
  width: 63px;
  margin-top: 0;
  margin-bottom: 51px;
}
#actions-component .side-menu .options {
  position: absolute;
  bottom: 0px;
  width: 100%;
}
#actions-component .side-menu .option {
  background-color: transparent;
  height: 66px;
  width: 100%;
  font-size: 10px;
  padding: 0;
  padding-top: 4px;
  margin-bottom: 18px;
  border: 4px solid transparent;
}
#actions-component .side-menu .option span {
  color: #E5E5E5;
}
#actions-component .side-menu .option .option-text {
  border: 4px solid transparent;
  padding: 4px 0px;
  border-radius: 30px;
  display: block;
  width: 78px;
  margin: auto;
  margin-top: -8px;
}
#actions-component .side-menu .option.guide {
  margin-bottom: 40px;
}
#actions-component .side-menu .option.channels {
  margin-bottom: 17px;
}
#actions-component .side-menu .option.item-keyboard-v2.focus-item-keyboard {
  border-color: transparent !important;
}
#actions-component .side-menu .option.item-keyboard-v2.focus-item-keyboard .option-text {
  border-color: #fff;
}
#actions-component .side-menu .option:hover {
  color: #ffe346;
  font-weight: bold;
  font-family: "montserrat-bold";
}
#actions-component .side-menu .option:hover .option-text {
  border-color: #fff;
}
#actions-component .side-menu .option.active {
  color: #fff;
}
#actions-component .side-menu .option.active span {
  font-family: "montserrat-bold";
  text-decoration: underline #FFE346;
  text-underline-offset: 3px;
}
#actions-component .side-menu .option .icon {
  display: block;
  margin: auto;
  height: 40px;
}
#actions-component .side-menu .option .icon img {
  width: 29px;
}
#actions-component .side-menu .user-picture {
  margin-bottom: 70px;
}

#categories-zone {
  display: block;
  text-align: left;
  font-family: Montserrat;
}
#categories-zone .title {
  font-size: 23px;
  font-weight: 600;
  line-height: 30.45px;
  padding-left: 46px;
  font-family: "montserrat-bold";
}
#categories-zone .container-list {
  width: 175px;
  height: 360px;
  overflow: hidden;
  position: relative;
  margin-top: 15px;
}
#categories-zone .container-list.categories-in-guide {
  margin-left: 23px !important;
}
#categories-zone .categories-menu {
  width: 100%;
  list-style: none;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(0);
  transition: transform 0.3s ease;
}
#categories-zone .category {
  height: 36px;
  line-height: 25px;
  padding-left: 10px;
  font-size: 15px;
}
#categories-zone .category.active > span {
  font-weight: 600 !important;
  text-decoration: underline #FFE346;
  font-family: "montserrat-bold";
}

#schedules-zone {
  width: 1075px;
  height: 405px; /* Alto fijo para el contenedor */
  overflow: hidden;
  padding: 10px;
  padding-left: 30px;
  padding-top: 18px;
  position: relative;
  display: block;
}
#schedules-zone .categories-container {
  width: 100%;
  height: auto;
  position: relative;
  -webkit-transition: none;
  transition: transform none;
}
#schedules-zone .category {
  margin-bottom: 20px;
  display: block;
}
#schedules-zone .category-name {
  display: block;
  font-weight: 500;
  text-align: left;
  margin-bottom: 5px;
  font-family: "Montserrat";
  font-size: 18px;
}
#schedules-zone .channel-row {
  width: 100%;
  margin-bottom: 10px;
  overflow: hidden;
}
#schedules-zone .channel-row .row-container {
  position: relative;
  white-space: nowrap;
  text-align: left;
  -webkit-transition: none;
  transition: transform none;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column {
  height: 140px;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column .text-container {
  height: 118px;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column .channel-number {
  display: none !important;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column.column-main .image-container {
  width: 200px;
  height: 120px;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column.column-main .text-container .text-middle {
  display: block;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column.column-main .channel-number-extended {
  display: block;
  text-align: right;
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: 12px;
  font-family: "Montserrat-bold";
}
#schedules-zone .channel-row .row-container.row-opened .channel-column.column-main.one_h_channel {
  width: 484px;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column.column-main.one_h_channel .text-container {
  width: 53%;
  top: 0;
  margin-left: 12px;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column.column-main.one_h_channel .text-container .text-top {
  margin-top: 5px;
  white-space: break-spaces;
  text-overflow: ellipsis;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
#schedules-zone .channel-row .row-container.row-opened .channel-column.item-keyboard-v2.focus-item-keyboard {
  border: 4px solid white !important;
}
#schedules-zone .channel-row .row-container .channel-number-extended {
  display: none;
}
#schedules-zone .channel-row .row-container .channel-column {
  height: 74px;
  min-width: 180px;
  margin-right: 9px;
  border-radius: 0.5rem;
  background-color: #000;
  display: inline-block;
  vertical-align: top;
  padding: 6px 9px;
  box-sizing: border-box;
  border: 4px solid transparent;
}
#schedules-zone .channel-row .row-container .channel-column.item-keyboard-v2.focus-item-keyboard {
  border: 4px solid white !important;
}
#schedules-zone .channel-row .row-container .channel-column .text-container {
  display: inline-block;
  width: 74%;
  text-align: left;
  height: 58px;
  vertical-align: top;
  position: relative;
  max-width: 78%;
  top: -4px;
}
#schedules-zone .channel-row .row-container .channel-column .text-container .text-top {
  position: absolute;
  left: 0;
  top: 0;
  font-family: "Montserrat-bold";
  font-weight: bold;
  font-size: 14px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 100%;
}
#schedules-zone .channel-row .row-container .channel-column .text-container .text-middle {
  position: absolute;
  left: 0;
  bottom: 27%;
  display: none;
}
#schedules-zone .channel-row .row-container .channel-column .text-container .text-middle .channel-img {
  width: 25px;
  height: 25px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}
#schedules-zone .channel-row .row-container .channel-column .text-container .text-middle .channel-name {
  display: inline-block;
  vertical-align: middle;
  font-size: 13px;
  font-weight: bold;
  font-family: "Montserrat-bold";
}
#schedules-zone .channel-row .row-container .channel-column .text-container .text-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  font-size: 12px;
}
#schedules-zone .channel-row .row-container .channel-column.column-main {
  background-color: #202020;
}
#schedules-zone .channel-row .row-container .channel-column.column-main .text-container {
  width: 72%;
}
#schedules-zone .channel-row .row-container .channel-column.column-main .image-container {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 53px;
  height: 53px;
  display: inline-block;
  border-radius: 5px;
  vertical-align: top;
}
#schedules-zone .channel-row .row-container .channel-column.column-main .channel-number {
  width: 30px;
  display: inline-block;
  text-align: center;
  font-size: 12px;
  margin: 19px 6px 0px 2px;
  vertical-align: top;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
}
#schedules-zone .channel-row .row-container .channel-column.one_h_channel {
  width: 360px;
}
#schedules-zone .clearfix::after {
  content: "";
  clear: both;
  display: table;
}

.carousel-channels-container {
  padding-top: 3.5rem;
  position: relative;
}
.carousel-channels-container .channels-container {
  white-space: nowrap;
  width: auto;
  margin-left: 32.7rem;
  -webkit-transition: -webkit-transform 1s linear;
  transition: transform 1s linear;
  display: block;
}
.carousel-channels-container .carousel-selector {
  background-color: transparent;
  border: 4px solid transparent;
  height: 242px;
  width: 628px;
  box-sizing: border-box;
  position: absolute;
  top: 35px;
  left: 325px;
  z-index: 15;
}

.channel-card {
  height: 242px;
  width: auto;
  display: inline-block;
  margin-right: 1rem;
  opacity: 0.6;
  border: 4px solid transparent;
}
.channel-card.active {
  opacity: 1;
}
.channel-card:not(.active):hover {
  opacity: 0.8;
}
.channel-card:not(.active).item-keyboard-v2 {
  border-color: transparent !important;
}
.channel-card:not(.active).item-keyboard-v2.focus-item-keyboard {
  border-color: transparent !important;
}

.button-arrow {
  position: absolute;
  height: 35px;
  width: 35px;
  left: 5%;
  top: 5%;
  border: none;
  background-color: transparent;
  background-size: contain;
  background-repeat: no-repeat;
  top: 50%;
  z-index: 2;
}
.button-arrow.button-arrow-left {
  left: 21%;
  background-image: url(../../../assets/images/arrow-left.png);
}
.button-arrow.button-arrow-right {
  left: 77%;
  background-image: url(../../../assets/images/arrow-right.png);
}

.bullets-container {
  position: absolute;
  left: 0;
  right: 0;
  top: 105%;
}
.bullets-container .bullet {
  width: 8px;
  height: 8px;
  background: #555555;
  display: inline-block;
  margin-left: 15px;
  border-radius: 50%;
}
.bullets-container .bullet.active {
  background: #fff;
}

.featured-channel-info {
  width: 193px;
  max-width: 198px;
  height: 100%;
  background: transparent;
  display: inline-block;
  vertical-align: middle;
  text-align: left;
}
.featured-channel-info .featured-channel-title {
  font-size: 3.4rem;
  width: 100%;
  height: 8.1rem;
  white-space: normal;
  text-align: left;
  margin: 3rem 1.6rem 1.1rem;
  line-height: 1.1;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  max-width: 162px;
  font-family: "montserrat-bold";
}
.featured-channel-info .featured-schedule {
  font-size: 1.5rem;
  color: #fff;
  width: 100%;
  margin: 0 1.6rem;
}
.featured-channel-info .featured-channel {
  margin: 1.7rem 1.6rem 0;
}
.featured-channel-info .featured-channel-icon {
  width: 30px;
  height: 30px;
  object-fit: contain;
}
.featured-channel-info .featured-channel-name {
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  margin-left: 0.6rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  width: 120px;
  vertical-align: middle;
  font-family: "montserrat-bold";
}

.featured-channel-image-container {
  width: 420px;
  height: 100%;
  display: inline-block;
  vertical-align: middle;
}

#add-reminder-zone {
  position: absolute;
  width: 1280px;
  height: 720px;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 40;
}
#add-reminder-zone #program {
  background: #1e3344;
  z-index: inherit;
  width: 425px;
  height: 720px;
  float: right;
  padding: 40px;
}
#add-reminder-zone #program .banner {
  margin-bottom: 26px;
  height: 197px;
  width: 348px;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#add-reminder-zone #program .info {
  text-align: left;
  font-family: Montserrat;
  margin-bottom: 27px;
}
#add-reminder-zone #program .info h1 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 20px;
  font-family: "montserrat-bold";
}
#add-reminder-zone #program .info p {
  font-size: 15px;
  margin-top: 11px;
  font-size: 16.8px;
}
#add-reminder-zone #program .info span {
  font-size: 17px;
  font-weight: bold;
  font-family: "montserrat-bold";
}
#add-reminder-zone #program .rounded-btn {
  width: 215px;
  background-color: #1e3344;
  border: solid #132835;
  margin: 5px 0px;
  border-radius: 30px;
  padding: 11px;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 22px;
  cursor: pointer;
  margin-left: -7px;
  border: 4px solid #132835;
}
#add-reminder-zone #program .rounded-btn.primary-btn {
  background-color: #006790;
  border: 4px solid transparent;
}
#add-reminder-zone #program .rounded-btn.focus-item-keyboard {
  border: 4px solid white;
}
#add-reminder-zone #program .rounded-btn img {
  margin-right: 5px;
  width: 7.8px;
  height: 9px;
  margin-top: -3px;
}

.scheduler {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  height: 2em;
  width: 2em;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.5);
  background-image: url(../assets/images/calendar-no-active.png);
  background-position: center;
  background-size: 50%;
  background-repeat: no-repeat;
}
.scheduler.active {
  background-color: #ffe346;
  background-image: url(../assets/images/calendar-active.png);
}

#channel-detail {
  padding-top: 3.5rem;
  position: relative;
  height: 315px;
  overflow: hidden;
}
#channel-detail .image-container {
  float: left;
  width: 37.5%;
  height: 238px;
  position: relative;
}
#channel-detail .image-container img {
  position: absolute;
  width: 418px;
  height: 238px;
  top: 5px;
  left: 46px;
}
#channel-detail .info-container {
  float: left;
  width: 56%;
  padding-left: 16px;
  position: relative;
}
#channel-detail .info-container > div {
  text-align: left;
}
#channel-detail .title {
  font-family: "montserrat-bold";
  font-size: 36px;
  font-weight: bold;
  margin-top: 14px;
  margin-bottom: 14px;
}
#channel-detail .time, #channel-detail .description {
  font-size: 13px;
  font-weight: 400;
  width: 85%;
}
#channel-detail .time {
  margin-bottom: 20px;
}
#channel-detail .description {
  height: 54px;
  overflow: hidden;
  line-height: 17px;
  text-overflow: ellipsis;
  display: -webkit-box;
  line-clamp: 3;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  margin-bottom: 6px;
}
#channel-detail .logo-name {
  position: absolute;
  left: 16px;
  bottom: -30%;
  height: 50px;
}
#channel-detail .logo-name .mini-logo {
  width: 40px;
  height: 40px;
  vertical-align: middle;
}
#channel-detail .logo-name .name {
  display: inline-block;
  vertical-align: middle;
  font-size: 15px;
  font-family: "montserrat-bold";
}

.guide-controls {
  width: 100%;
  height: 100%;
  height: 720px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 1s;
  -webkit-transition-timing-function: ease;
  transition-property: transform;
  transition-duration: 1s;
  transition-timing-function: ease;
}
.guide-controls.ng-hide {
  transform: translateY(100%);
  -webkit-transform: translateY(100%);
}
.guide-controls .channel-logo {
  position: absolute;
  left: 3.5%;
  width: 50px;
  bottom: 37%;
}
.guide-controls .title {
  position: absolute;
  top: 54.1%;
  left: 8.4%;
  font-size: 30px;
  font-weight: bold;
  font-family: "montserrat-bold";
}
.guide-controls .title span.title-brand {
  font-family: "montserrat";
}
.guide-controls .days {
  width: 97%;
  position: absolute;
  left: 3.5%;
  top: 65%;
  white-space: nowrap;
  text-align: left;
  overflow: hidden;
}
.guide-controls .days .day {
  text-transform: capitalize;
  background: #173345;
  height: 45px;
  width: 13.4%;
  border-radius: 3em;
  margin-right: 0.6%;
  font-size: 16px;
}
.guide-controls .days .day.active {
  background: #2A84BE;
}
.guide-controls .programs {
  width: 100%;
  position: absolute;
  top: 74.4%;
  text-align: left;
  left: 3.5%;
  white-space: nowrap;
  -webkit-transform: translateX(0%);
  -webkit-transition: -webkit-transform 1s ease;
  transform: translateX(0%);
  transition: transform 1s ease;
}
.guide-controls .programs .program-card {
  background-color: #262626;
  width: 33.4%;
  display: inline-block;
  margin-right: 1%;
  border-radius: 1em;
  height: 155px;
}
.guide-controls .programs .program-card.focus-item-keyboard .program-image-container .program-background-image {
  background-color: transparent;
}
.guide-controls .programs .program-card.focus-item-keyboard .program-info .program-title,
.guide-controls .programs .program-card.focus-item-keyboard .program-info .program-hour {
  color: white;
}
.guide-controls .programs .program-card .program-image-container {
  width: 45%;
  height: 100%;
  display: inline-block;
  overflow-x: hidden;
  overflow-y: hidden;
  overflow: hidden;
  position: relative;
}
.guide-controls .programs .program-card .program-image-container .program-background-image {
  position: absolute;
  left: 4%;
  top: 0;
  z-index: 4;
  background-color: #262626;
  height: 109px;
  width: 95%;
  margin-top: 9%;
  border-radius: 10px;
  background-size: cover;
  background-repeat: no-repeat;
}
.guide-controls .programs .program-card .program-image-container .program-image {
  height: 109px;
  width: 95%;
  background-color: #006790;
  position: relative;
  margin-top: 9%;
  border-radius: 10px;
  background-size: cover;
  background-repeat: no-repeat;
  left: 4%;
}
.guide-controls .programs .program-card .program-image-container .scheduler {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  height: 2em;
  width: 2em;
  border-radius: 50%;
  background-color: #262626;
  background-image: url(../assets/images/calendar-no-active.png);
  background-position: center;
  background-size: 50%;
  background-repeat: no-repeat;
  font-size: 24px;
}
.guide-controls .programs .program-card .program-image-container .scheduler.active {
  background-color: #ffe346;
  background-image: url(../assets/images/calendar-active.png);
}
.guide-controls .programs .program-card .program-info {
  width: 52%;
  height: 100%;
  display: inline-block;
  overflow-x: hidden;
  overflow-y: hidden;
  overflow: hidden;
  padding-left: 1%;
  padding-top: 5%;
  vertical-align: top;
  position: relative;
}
.guide-controls .programs .program-card .program-info .program-title {
  color: #D9D9D9;
  white-space: normal;
  font-size: 16px;
  vertical-align: top;
  width: 95%;
  font-family: "montserrat-bold";
  line-height: 19px;
}
.guide-controls .programs .program-card .program-info .program-hour {
  color: #D9D9D9;
  font-size: 16px;
  position: absolute;
  bottom: 16%;
}
.guide-controls .programs .program-card .program-info .program-hour.now {
  text-transform: uppercase;
}
.guide-controls .programs .program-card .program-info .program-hour:not(.now) {
  text-transform: lowercase;
}
.guide-controls .programs .program-card .program-info .live-indicator {
  display: inline-block;
  padding: 2px 0px 4px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: bold;
  position: absolute;
  width: 53px;
  font-family: "montserrat-bold";
  text-align: center;
  height: 22px;
  background: #FF3434;
  bottom: 35%;
}
.guide-controls .programs .program-card .program-info .progress-bar-component {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 22%;
}
.guide-controls .programs .program-card .program-info .progress-bar-component .time-star {
  color: red;
}

.channel-content .desc {
  text-align: left;
  position: absolute;
  top: 3%;
  left: 93%;
  min-width: 1000px;
}
.channel-content .desc .channel-name {
  display: inline-block; /* Para que esté en la misma línea */
  font-family: "montserrat-bold";
  font-size: 40px;
  font-weight: 700;
  color: white;
  margin-right: 15px; /* Espaciado entre el título y el número */
}
.channel-content .desc .number {
  display: inline-block; /* Para que esté en la misma línea */
  font-size: 28px;
  font-family: "Montserrat", sans-serif;
  color: white;
}

.logo-brand {
  width: 100px;
  height: 100px;
}
.logo-brand img {
  max-height: 60px;
  position: absolute;
  top: 17%;
  left: 76%;
  -webkit-transform: translateX(-76%);
  transform: translateX(-76%);
}
.logo-brand {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 2%;
  left: 30%;
}

.progress-container {
  display: inline-block;
  width: 100%;
  text-align: center;
  white-space: nowrap;
}

.time-start, .time-end {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  color: white;
}

.time-start {
  float: left;
}

.time-end {
  float: right;
}

.progress-bar {
  display: inline-block;
  width: 296px;
  width: calc(100% - 100px); /* Adjust this based on start and end time widths */
  height: 10px;
  background-color: #555;
  border-radius: 5px;
  margin: 0 10px;
  position: relative;
  vertical-align: middle;
  overflow: hidden;
  margin-top: 6px;
}

.progress-fill {
  height: 100%;
  background-color: #fff;
  border-radius: 5px;
  transition: width 0.5s ease;
}

.progress-container.guide-style {
  position: relative;
}
.progress-container.guide-style .time-start {
  position: absolute;
  left: 0;
  bottom: -18px;
  font-size: 12px;
}
.progress-container.guide-style .progress-bar {
  width: 100%;
  margin: 0;
}
.progress-container.guide-style .time-end {
  position: absolute;
  right: 0;
  bottom: -18px;
  font-size: 12px;
}

.current-program-container {
  position: relative;
}

.box {
  display: inline-block;
  height: 100%;
  vertical-align: middle; /* Alinea los cuadros al centro vertical */
}

.current-program {
  width: 48%;
  margin-right: 1%;
}
.current-program .program-info {
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 15px;
  color: white;
  text-align: center;
  padding: 19px;
  font-family: "Montserrat", sans-serif;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  top: 60%;
  font-size: 16px;
}
.current-program .program-title {
  display: inline-block;
  margin-right: 10px;
  font-weight: bold;
  float: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 84%;
  text-align: left;
}
.current-program .live-indicator {
  display: inline-block;
  background-color: #FF3434;
  padding: 2px 5px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: bold;
  position: absolute;
  right: 18px;
  width: 46px;
  font-family: "montserrat-bold";
}
.current-program .progress-bar-component {
  position: absolute;
  width: 48%;
  padding-top: 5px;
}

.next-program {
  width: 29%;
  margin-right: 21%;
}
.next-program .program-title {
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 15px;
  color: white;
  text-align: center;
  padding: 19px;
  font-family: "Montserrat", sans-serif;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  top: 60%;
  font-size: 16px;
}

.btn-programming {
  width: 21%;
  text-align: center;
}
.btn-programming button {
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 50px;
  border: 4px solid transparent;
  color: #fff;
  padding: 9.6px 0;
  text-align: center;
  font-family: "montserrat-bold", sans-serif;
  position: relative;
  top: 60%;
  font-size: 16px;
  width: 100%;
}

.poll {
  font-size: 0px;
  height: 160px;
  position: fixed;
  left: 50%;
  border-radius: 0.5rem 0.5rem 0em 0em;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 1s;
  transition-property: transform;
  transition-duration: 1s;
  -webkit-transform: translate(-50%, 200%);
  transform: translate(-50%, 200%);
  overflow: hidden;
  z-index: 100;
  bottom: 0;
  white-space: nowrap;
}
.poll.active {
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
}
.poll .image-option {
  width: 160px;
  height: 160px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: inline-block;
  vertical-align: top;
}
.poll .poll-content {
  font-size: 14pt;
  vertical-align: top;
  width: 726px;
  height: 160px;
  display: inline-block;
  bottom: 0;
  z-index: 100;
  background-color: #1f3343;
}
.poll .poll-content .poll_title {
  margin-top: 16px;
  font-size: 20px;
  margin-bottom: 16px;
}
.poll .poll-content .poll_options {
  margin-top: 21px;
  font-weight: bold;
  font-family: "montserrat-bold";
}
.poll .poll-content .poll_options .poll_option {
  width: 298px;
  height: 50px;
  border-radius: 3em;
  background-color: #006790;
  border: transparent solid 4px;
  margin-left: 10px;
  margin-right: 10px;
}
.poll .poll-content .poll_options .poll_option.focus-item-keyboard {
  border: white solid 4px;
}
.poll .poll-content .poll_options .soultv-logo-separator {
  width: 50px;
}
.poll .poll-content .poll_results {
  margin-top: 21px;
  margin-bottom: 14px;
}
.poll .poll-content .poll_results .soultv-logo-separator {
  vertical-align: middle;
  width: 50px;
  margin: 0px 8px;
}
.poll .poll-content .poll_results .poll_result {
  width: 312px;
  height: 40px;
  line-height: 40px;
  display: inline-block;
  vertical-align: middle;
  text-align: right;
  position: relative;
  font-size: 16px;
}
.poll .poll-content .poll_results .poll_result.poll_result_2 {
  text-align: left;
}
.poll .poll-content .poll_results .poll_result.poll_result_2 .result_container .result_title {
  width: 0;
}
.poll .poll-content .poll_results .poll_result.poll_result_2 .result_container .result_bar {
  left: 0;
}
.poll .poll-content .poll_results .poll_result .result_percent {
  margin-right: 7px;
  display: inline-block;
  margin: 0 7px;
}
.poll .poll-content .poll_results .poll_result .result_container {
  width: auto;
  height: 100%;
  right: 0;
  padding: 0 14px;
  display: inline-block;
  position: relative;
}
.poll .poll-content .poll_results .poll_result .result_container .result_title {
  font-size: 18px;
  position: relative;
  z-index: 1;
  right: 0;
  display: inline-block;
  white-space: nowrap;
  max-width: 222px;
  width: 222px;
  min-width: 222px;
  min-width: min-content;
}
.poll .poll-content .poll_results .poll_result .result_container .result_bar {
  background-color: #616773;
  width: 100%;
  min-width: 3px;
  max-width: 100%;
  height: 100%;
  position: absolute;
  right: 0;
  display: inline-block;
  -webkit-transition-property: width;
  -webkit-transition-duration: 1s;
  transition-property: width;
  transition-duration: 1s;
}
.poll .poll-content .poll_results .poll_result .result_container .result_bar.winning {
  background-color: #15cf74;
}
.poll .poll-content .poll_results .poll_result .result_container .result_bar.waiting {
  width: 0px !important;
}
.poll .poll-content .poll_footer {
  margin-top: 11px;
  font-size: 13px;
  letter-spacing: 1px;
}

.back-button {
  position: absolute;
  font-size: 15px;
  bottom: 18.3rem;
  left: 0;
  background-color: rgba(0, 0, 0, 0.65);
  height: 41px;
  width: 150px;
  border-left: none !important;
  border-radius: 0em 1.5em 1.5em 0em;
  border-color: transparent;
  border-width: 4px;
  padding-left: 10px;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 1s;
  transition-property: transform;
  transition-duration: 1s;
  -webkit-transform: translate(-100%, 0%);
  transform: translate(-100%, 0%);
  z-index: 100;
}
.back-button.active {
  -webkit-transform: translate(0%, 0%);
  transform: translate(0%, 0%);
}
.back-button.focus-item-keyboard {
  border-left: none !important;
}

.campaing-ad {
  position: relative;
  height: 205px;
  width: 400px;
  position: fixed;
  top: 66%;
  left: 65%;
  padding: 0;
  margin: 0;
  border: none !important;
  border-radius: 33px;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 1s;
  transition-property: transform, height, top, opacity;
  transition-duration: 1s;
  -webkit-transform: translate(0%, 200%);
  transform: translate(0%, 200%);
}
.campaing-ad.expanded {
  top: 47%;
  left: 65%;
  height: 370px;
}
.campaing-ad.expanded .close-ad-button {
  opacity: 1;
  visibility: visible;
}
.campaing-ad.expanded .campaing-ad-card {
  background-image: url(../assets/images/ads/base.png);
  border: 2px transparent transparent !important;
}
.campaing-ad.expanded .campaing-ad-card.focus-item-keyboard {
  background-image: url(../assets/images/ads/base.png);
  border: 2px white transparent !important;
}
.campaing-ad.expanded .campaing-ad-card {
  background-size: cover;
  background-size: 200%;
}
.campaing-ad.expanded .campaing-ad-card .card-header,
.campaing-ad.expanded .campaing-ad-card .card-info {
  opacity: 0;
}
.campaing-ad.expanded .campaing-ad-card .card-info-expanded {
  opacity: 1;
}
.campaing-ad.expanded .campaing-ad-card .card-qr {
  -webkit-transform: translate(0%, 0%);
  transform: translate(0%, 0%);
}
.campaing-ad.expanded .product-image {
  left: -23%;
  top: -26.3%;
  height: 300px;
  width: 300px;
}
.campaing-ad.expanded .countdown {
  visibility: hidden;
}
.campaing-ad.expanded #countdownCircleCanvas {
  visibility: hidden;
}
.campaing-ad.active {
  -webkit-transform: translate(0%, 0%);
  transform: translate(0%, 0%);
}
.campaing-ad .close-ad-button {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  border-radius: 50%;
  background-image: url(../assets/images/ads/bg-ad.png);
  background-size: cover;
  right: 0;
  top: -20%;
  width: 60px;
  height: 60px;
  border: none;
  text-decoration: none;
  outline: none;
  background-color: transparent;
  z-index: 200;
  font-size: 28px;
  font-family: "montserrat-bold";
  line-height: 54px;
  border: 2px transparent solid !important;
}
.campaing-ad .close-ad-button.focus-item-keyboard {
  border: 2px white solid !important;
}
.campaing-ad .card-header,
.campaing-ad .card-info,
.campaing-ad .card-info-expanded,
.campaing-ad .card-qr {
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-duration: 1s;
  transition-duration: 1s;
}
.campaing-ad .card-header,
.campaing-ad .card-info {
  opacity: 1;
}
.campaing-ad .card-info-expanded {
  opacity: 0;
}
.campaing-ad .card-header {
  max-width: 125px;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0;
  margin: 0;
  height: 43px;
}
.campaing-ad .card-header .product-brand {
  margin-top: 10px;
  width: 100%;
  height: 32px;
  width: 120px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.campaing-ad .card-info {
  margin-top: 4px;
}
.campaing-ad .card-info .price {
  font-size: 27px;
  width: 70%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  font-family: "montserrat-bold";
}
.campaing-ad .card-info .description {
  font-size: 14px;
  font-family: "montserrat-bold";
  max-width: 205px;
  height: 32px;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  white-space: normal;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.1;
  margin-top: 4px;
  margin-bottom: 4px;
  position: relative;
}
.campaing-ad .card-info .description span {
  font-size: 14px;
  font-family: "montserrat-bold";
  max-width: 205px;
  height: 38px;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  white-space: normal;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.1;
  margin-top: 2px;
  position: absolute;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
}
.campaing-ad .card-info .buy-button {
  background-color: #fffb38;
  color: #000;
  font-family: "montserrat-bold";
  border-radius: 20px;
  font-size: 18px;
  padding: 0;
  margin-top: 6px;
  width: 180px;
  border: 4px solid transparent;
  height: 40px;
  line-height: 30px;
}
.campaing-ad .card-info-expanded {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 20px;
  right: 0;
  margin: auto;
  padding: 0 2rem;
  font-family: "montserrat-bold";
  font-size: 20px;
  font-weight: bold;
}
.campaing-ad .card-info-expanded .description {
  font-family: "montserrat-bold";
  height: 45px;
  position: relative;
}
.campaing-ad .card-info-expanded .description span {
  font-family: "montserrat-bold";
  text-overflow: ellipsis;
  overflow-wrap: normal;
  white-space: normal;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.1;
  margin-top: 2px;
  position: absolute;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
}
.campaing-ad .card-info-expanded .price {
  font-size: 35px;
  font-family: "montserrat-bold";
  margin-top: 4px;
}
.campaing-ad .card-info-expanded .discount-container {
  display: block;
  width: 100%;
}
.campaing-ad .card-info-expanded .discount-container .price-discount,
.campaing-ad .card-info-expanded .discount-container .discount,
.campaing-ad .card-info-expanded .discount-container .rating-stars,
.campaing-ad .card-info-expanded .discount-container .rating-count {
  display: inline-block;
  vertical-align: middle;
}
.campaing-ad .card-info-expanded .discount-container .price-discount {
  text-decoration: line-through;
  padding-left: 5px;
}
.campaing-ad .card-info-expanded .discount-container .discount {
  color: #fffb38;
  background-color: rgba(255, 251, 56, 0.1);
  font-size: 17px;
  font-family: "montserrat-bold";
  padding: 1px 6px;
  margin-left: 8px;
}
.campaing-ad .card-info-expanded .discount-container .rating-stars {
  margin-left: 4px;
}
.campaing-ad .card-info-expanded .discount-container .rating-stars .star {
  width: 20px;
  height: 20px;
  display: inline-block;
  background-size: contain;
  background-position: center;
  margin-left: -3px;
  margin-right: 4px;
  vertical-align: middle;
}
.campaing-ad .card-info-expanded .discount-container .rating-stars .star.full-star {
  color: #fffb38;
  background-image: url(../assets/images/ads/star.png);
}
.campaing-ad .card-info-expanded .discount-container .rating-stars .star.half-star {
  color: #fffb38;
  background-image: url(../assets/images/ads/half-star.png);
}
.campaing-ad .card-info-expanded .discount-container .rating-stars .star.empty-star {
  color: #d8d8d8;
  background: transparent;
}
.campaing-ad .card-info-expanded .discount-container .rating-count {
  font-size: 16px;
  font-family: "montserrat-bold";
}
.campaing-ad .product-image {
  position: absolute;
  left: -10%;
  top: 3px;
  z-index: 200;
  height: 100%;
  -webkit-transition-property: top, left;
  -webkit-transition-duration: 1s;
  transition-property: top, left;
  transition-duration: 1s;
  object-fit: contain;
  max-width: 300px;
  height: 200px;
  width: 200px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.campaing-ad .card-qr {
  width: 140px;
  background-color: white;
  padding: 10px;
  position: absolute;
  top: 14px;
  right: 20px;
  border-radius: 20px;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 1s;
  transition-property: transform;
  transition-duration: 1s;
  -webkit-transform: translate(0%, 150%);
  transform: translate(0%, 150%);
}
.campaing-ad .card-qr img {
  width: 100%;
}
.campaing-ad .card-qr .product-qr-link {
  display: block;
}
.campaing-ad .card-qr .product-brand {
  display: block;
  margin-top: 1rem;
  width: 100%;
  height: 43px;
  width: 120px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.campaing-ad-card {
  height: 100%;
  width: 100%;
  position: relative;
  top: 0;
  left: 0;
  border-radius: 33px;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 1s;
  transition-property: transform;
  transition-duration: 1s;
  overflow: hidden;
  z-index: 100;
  white-space: nowrap;
  background-image: url(../assets/images/ads/base.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  padding: 0;
  margin: 0;
  border: none !important;
  text-align: left;
  padding-left: 45%;
  padding-top: 3.2%;
  opacity: 1;
}
.campaing-ad-card.focus-item-keyboard {
  background-image: url(../assets/images/ads/bg-ad-border.png);
}

#countdownCircleCanvas {
  position: absolute;
  top: 1%;
  right: 0%;
  width: 70px;
  height: 70px;
  z-index: 400;
}

.countdown {
  position: absolute;
  top: 1%;
  right: 0%;
  width: 70px;
  height: 70px;
  background-color: white;
  z-index: 200;
  border-radius: 50%;
  color: black;
  border: 9px solid yellow;
  display: block;
}
.countdown .time-seconds {
  font-size: 22px;
  color: black;
  font-weight: bold;
  vertical-align: middle;
  font-family: "montserrat-bold";
  line-height: 52px;
}

#categories-zone {
  text-align: left;
}
#categories-zone .title {
  font-size: 23px;
  font-weight: 600;
  line-height: 30.45px;
  padding-left: 46px;
}
#categories-zone .container-list {
  padding-left: 7px;
  overflow: hidden;
  position: relative;
}
#categories-zone ul.categories-menu {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(0);
  transition: transform 0.3s ease;
}
#categories-zone ul.categories-menu li.category {
  padding: 2px 0px 2px 20px;
  text-align: left;
  border: 4px solid transparent;
  border-radius: 30px;
  height: 47px;
}
#categories-zone ul.categories-menu li.category.active > span {
  font-weight: 600 !important;
  text-decoration: underline #FFE346;
  text-underline-offset: 5px;
  font-family: "montserrat-bold";
}
#categories-zone ul.categories-menu li.category.item-keyboard-v2.focus-item-keyboard {
  border: 4px solid white !important;
}
#categories-zone ul.categories-menu li > span {
  font-size: 15px;
  font-weight: 400;
  display: block;
  margin-top: 4px;
}

/* Add Component SCSS Above */
@font-face {
  font-family: "montserrat-bold";
  src: url("/assets/fonts/Montserrat-Bold.otf"), url("../assets/fonts/Montserrat-Bold.otf");
}
@font-face {
  font-family: "montserrat-light";
  src: url("/assets/fonts/Montserrat-Light.otf"), url("../assets/fonts/Montserrat-Light.otf");
}
@font-face {
  font-family: "montserrat-regular";
  src: url("/assets/fonts/Montserrat-Regular.otf"), url("../assets/fonts/Montserrat-Regular.otf");
}
@font-face {
  font-family: "advert-rough-four";
  src: url("/assets/fonts/AdvertRough-Four.otf"), url("../assets/fonts/AdvertRough-Four.otf");
}
@font-face {
  font-family: "HelveticaNeue bold";
  src: url("/assets/fonts/HelveticaNeue-Bold.ttf"), url("../assets/fonts/HelveticaNeue-Bold.ttf");
}
* {
  font-family: "montserrat-light";
}

#content.container {
  width: 1280px !important;
  padding-right: 0;
  padding-left: 0;
  margin-right: 0;
  margin-left: 0;
  background-size: cover;
  padding-bottom: 25px;
  height: 720px;
  background-color: #141414;
  text-align: center;
  display: block;
}
#content.container .row {
  margin-right: 0;
  margin-left: 0;
  position: relative;
}

.keyboardArea {
  width: 1280px !important;
  height: 284px;
  padding-top: 14px !important;
}

#content.container .row.cont-broadcast {
  position: absolute;
  display: block;
}

.item-keyboard-v2 {
  border: 4px solid transparent;
}
.item-keyboard-v2.focus-item-keyboard {
  border: 4px solid white;
}

.cont-broadcast-map {
  box-sizing: content-box;
  z-index: 0;
}

.broadcast-map {
  border: 0 solid transparent;
}
.broadcast-map.item-keyboard-v2 {
  border: 4px solid transparent;
}
.broadcast-map.item-keyboard-v2.focus-item-keyboard {
  border: 4px solid white;
}

.cont-menu-lateral {
  z-index: 10;
  display: block;
}

input {
  background-color: #0F495D;
  border-color: #0F495D;
  padding: 4px 12px;
  border-radius: 3px;
  color: white;
  height: 42px;
  width: 325px;
  font-size: 14px;
}
input.item-keyboard-v2 {
  border-color: #0F495D;
}
input.item-keyboard-v2.focus-item-keyboard {
  border-color: white;
}

.logo {
  width: 85px;
  margin-top: 50px;
  margin-bottom: 30px;
}

.partial {
  width: 430px;
  float: right;
  height: 720px;
  background-color: #173345;
  position: relative;
}

.btn-app, .btn-sreaction {
  margin: auto;
  border-radius: 40px;
  display: inline-block;
  width: 320px;
  height: 50px;
  color: white;
  background-color: #006790;
  border-color: #006790;
  padding: 0px 0;
  line-height: 42px;
  text-transform: uppercase;
  font-size: 14px;
}
.btn-app.focus-item-keyboard, .focus-item-keyboard.btn-sreaction {
  border-color: white;
}
.btn-app.btn-small, .btn-small.btn-sreaction {
  width: 260px;
}
.btn-app.btn-transp, .btn-transp.btn-sreaction {
  background-color: transparent;
}
.btn-app.btn-blue, .btn-blue.btn-sreaction {
  background-color: transparent;
}

.player-modal {
  background-color: #000;
  height: 720px;
  position: relative;
  z-index: 0;
}

.col-md-12 {
  padding: 0 0 0 0;
}

#outputView {
  position: absolute;
}
p {
  margin-bottom: 0;
}

html, body {
  height: 720px !important;
  background-repeat: no-repeat;
  overflow: hidden;
  color: inherit;
  display: block;
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}

body {
  font-size: 14pt;
}
body a:focus-visible, body p:focus-visible, body div:focus-visible, body li:focus-visible, body .btns-video:focus-visible, body .cont-btn-option-player:focus-visible, body *:focus-visible {
  outline: none;
}

ul, ol {
  margin: 0;
  padding: 0;
}

ul {
  list-style: none;
}

* {
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  box-shadow: none !important;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: white;
}

[ui-view] .inner-wrapper {
  height: 100%;
  padding: 20px;
  background-color: #FFF;
  text-align: center;
  border-radius: 5px;
}
[ui-view] {
  position: absolute;
  width: 500px;
  margin: 0 auto;
  top: 0;
  right: 0;
  height: 0;
  opacity: 1;
}

.btn-circle, .btn-m-user {
  width: 60px;
  height: 60px;
  border-radius: 50%;
}

.btn-m-user {
  display: inline-block;
  margin: 5px 0 12px 15px;
  cursor: pointer;
  background-color: transparent !important;
  color: white;
  border-style: solid;
  border-color: transparent;
  background-size: 120%;
  background-repeat: no-repeat;
  background-position: center;
}

.btn-user {
  position: absolute;
  top: 600px;
  left: 1148px;
}

.btn-login-index {
  position: absolute;
  top: 590px;
  left: 1180px;
}

#cover-live-tv {
  position: absolute;
  z-index: 1;
}

.menu-user {
  position: absolute;
  top: 7.24em;
  left: 1147px;
}
.menu-user .cont-btn-m-user {
  position: relative;
}
.menu-user .cont-btn-m-user .label-option-menu {
  position: absolute;
  right: 85px;
  display: none;
  top: 30px;
  width: 190px;
  text-align: right;
}
.menu-user .cont-btn-m-user.floating {
  position: absolute;
  top: 0;
  left: -100%;
}
.menu-user .item-keyboard-v2.focus-item-keyboard {
  border-color: white;
}
.menu-user .item-keyboard-v2.focus-item-keyboard .label-option-menu {
  display: block;
}

#block-hover-keyboard {
  position: absolute;
  z-index: 300;
  width: 100%;
  height: 100%;
  display: none;
}

.cont-option-user {
  z-index: 99;
  position: relative;
}

.item-keyboard-v2.btn-user-main.btn-m-user.focus-item-keyboard {
  border-color: white;
}

.block-hover {
  position: fixed;
  z-index: 2;
  width: 4096px;
  height: 2160px;
  left: 0;
  top: 0;
}

.options-emoticons {
  position: absolute;
  top: 498px;
  left: 558px;
  width: 600px;
}
.options-emoticons .cont-btn-m-user {
  display: inline-block;
}

.copyright {
  display: none !important;
}

.fp-tooltip {
  display: none !important;
}

.fp-controls {
  display: none !important;
}

.video-js .vjs-tech {
  position: inherit !important;
}

.vjs-big-play-button {
  display: none !important;
}

.vjs-error .vjs-error-display .vjs-modal-dialog-content {
  display: none !important;
}

.vjs-error-display.vjs-modal-dialog {
  display: none !important;
}

.vjs-text-track-cue {
  font: 26px sans-serif !important;
}

/*New home-screen and tv-home loaders*/
.loading-container {
  position: absolute;
  left: 540px;
  top: 260px;
}