/* Main Styles */
#twitch-module.twitch-rail *, #twitch-module.twitch-rail *:before, #twitch-module.twitch-rail *:after {box-sizing: border-box!important;}
#twitch-module.twitch-rail {max-width:1200px;padding: 5px 0;margin:16px auto;background:#000;position:relative;overflow:hidden;}
#twitch-rail-feature-wrapper {max-width:1200px;margin: 0 auto;}
    #twitch-module.twitch-rail.light-theme {background:#fff}
#twitch-module.twitch-rail > *  { box-sizing: border-box!important;-moz-box-sizing: border-box!important;box-sizing: border-box!important;}
#twitch-module.twitch-rail:before {content:"";height:5px;width:100%;position:absolute;top:0px;left:0;background:#FFF;}
    #twitch-module.twitch-rail.light-theme:before {background:#000}
#twitch-module.twitch-rail:after {content:"";height:5px;width:100%;position:absolute;bottom:0px;left:0;background:#FFF;}
    #twitch-module.twitch-rail.light-theme:after {background:#000}

#twitch-module.twitch-rail .twitch-module-header {display:flex;color:#FFF!important;min-height:54px;margin:0 0 0 60px;padding:0 0 0;line-height: 1;}
    #twitch-module.twitch-rail.light-theme .twitch-module-header, #twitch-module.twitch-rail.light-theme .twitch-module-header span, #twitch-module.twitch-rail.light-theme .offline-slide {color:#000!important}
#twitch-module.twitch-rail .twitch-module-header span {display:inline-block;padding: 0 0 3px;width:100%;font-family:"Arial Black", "arial";text-transform:uppercase;font-size:13px;line-height:1;}
#twitch-module.twitch-rail .twitch-module-header a.find-out-more {position:absolute;right:9px;top:14px;display:inline-block;background:#7f1618;height:36px;line-height:36px;padding:0 26px;font-family:"Arial Black", "arial";color:#FFF!important;text-decoration:none;}
#twitch-module.twitch-rail .twitch-module-header a.find-out-more:hover {text-decoration:underline}
#twitch-module.twitch-rail .twitch-module-header .twitch-module-header-left {margin:9px 0;width:100%;}
#twitch-module.twitch-rail .twitch-module-header.cta-active .twitch-module-header-left {margin-right: 150px;}
#twitch-module.twitch-rail .twitch-module-header .twitch-module-header-left a {color:#7f1618!important}
#twitch-module.twitch-rail .twitch-module-header .twitch-module-header-left .twitch-logo {width:40px;height:auto;position:absolute;left:10px;top:12px;}
#twitch-module.twitch-rail .twitch-module-header .twitch-module-header-left .twitch-logo img {width: 40px;height:40px;}

#twitch-module.twitch-rail #stream-container {display:block;width:100%;}
#twitch-module.twitch-rail #stream-container ul {margin:0;padding:0;}
#twitch-module.twitch-rail .offline-slide {display:none;text-align:center;text-transform:uppercase;color:#fff;font-size:13px;padding-bottom:11px;width:100%;}
#twitch-module.twitch-rail .offline-slide.show {display:block;}
#twitch-module.twitch-rail .stream {width:245px;height:100%;display:block;margin:0;padding:0;position: relative;border-right: 1px solid #000;border-left: 1px solid #000;}
#twitch-module.twitch-rail.light-theme .stream {border-color: #efeff1;}
#twitch-module.twitch-rail .stream .twitch-image {height:auto;}
#twitch-module.twitch-rail.twitch-rail--detailed .stream .twitch-image-overlay {display:none;}
#twitch-module.twitch-rail.twitch-rail--compact .stream .twitch-image-overlay {position: absolute;height: 100%;width: 100%;left: 0;top: 0;display: flex;justify-content: center; align-items: center;
    background: -moz-linear-gradient(top, rgba(27,27,27,0) 50%, rgba(27,27,27,1) 100%);
    background: -webkit-linear-gradient(top, rgba(27,27,27,0) 50%,rgba(27,27,27,1) 100%);
    background: linear-gradient(to bottom, rgba(27,27,27,0) 50%,rgba(27,27,27,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001b1b1b', endColorstr='#1b1b1b',GradientType=0 );
    }

#twitch-module.twitch-rail .stream a {text-decoration:none;}
#twitch-module.twitch-rail .stream .twitch-image img {width:100%;height:auto;box-shadow:none;border:none;vertical-align: top;}
#twitch-module.twitch-rail .stream .twitch-info {color:#FFF!important;background:rgba(40,40,40,.85);position: absolute;bottom:0;width:100%;}
#twitch-module.twitch-rail.twitch-rail--detailed .stream .twitch-meta {font-family: "Helvetica Neue", Helvetica, Arial, 'sans-serif';width:100%;height: 42px;padding: 0 0 0 4px;text-align: left;background:#0e0e10;}
#twitch-module.twitch-rail.twitch-rail--compact .stream .twitch-meta {font-family: "Helvetica Neue", Helvetica, Arial, 'sans-serif';width:100%;position: absolute;bottom: 5px;right:5px;height: 42px;padding: 0 0 0 4px;text-align: right;background:none!important;}
#twitch-module.twitch-rail.light-theme .stream .twitch-meta {background: #f7f7f8}
#twitch-module.twitch-rail .stream .twitch-title {font-size: 14px;line-height: 18px; padding: 4px 0 0;color: #dedee3;display:block;overflow: hidden;font-weight: 600;text-overflow: ellipsis;white-space: nowrap;}
#twitch-module.twitch-rail.twitch-rail--compact .stream .twitch-title {color: #fff!important;}
#twitch-module.twitch-rail.light-theme .stream .twitch-title {color: #1f1f23}
#twitch-module.twitch-rail .stream .twitch-game {font-size: 12px;line-height: 18px;color: #adadb8;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
#twitch-module.twitch-rail.twitch-rail--compact .stream .twitch-game {color: #fff!important;}
#twitch-module.twitch-rail.light-theme .stream .twitch-game {color: #53535f}
#twitch-module.twitch-rail .stream .twitch-detailed {display:none;}
#twitch-module.twitch-rail.twitch-rail--detailed .stream .twitch-detailed {display:inline-block;}

#twitch-module.twitch-rail .slick-arrow {position: absolute; z-index:101;top: 50%;width: 55px; height: 55px; margin: -27px 0 0; padding: 0; display: block; cursor: pointer; opacity: 0; -webkit-transition: all .3s ease;background-color:#0e0e10;border:none;transform: none;}
#twitch-module.twitch-rail.light-theme .slick-arrow {background-color:#f7f7f8}
#twitch-module.twitch-rail .slick-arrow img {display:inline-block;width: 55px; height: 55px;font-size:0;}
#twitch-module.twitch-rail .flex-direction-nav li a { text-indent: -9999px;background-size: 50% 50%;background-position: 50% 50%;background-repeat: no-repeat;}
#twitch-module.twitch-rail .slick-arrow.slick-next {right: 0;}
#twitch-module.twitch-rail .slick-arrow.slick-prev {left: 0;}
#twitch-module.twitch-rail #stream-container:hover .slick-next {opacity: 0.8; right: 5px;}
#twitch-module.twitch-rail #stream-container:hover .slick-prev {opacity: 0.8; left: 5px;}
#twitch-module.twitch-rail #stream-container:hover .slick-next, #twitch-module.twitch-rail #stream-container:hover .slick-prev {opacity: 1;}
#twitch-module.twitch-rail #stream-container .flex-nav-next:hover, #stream-container .flex-nav-prev:hover {background-color:#7f1618!important;}

/* Indicator */
#twitch-module.twitch-rail .stream .twitch-viewers {font-family: "Helvetica Neue", Helvetica, Arial, 'sans-serif';background: rgba(17,17,17,0.8);position: absolute; top:10px;left: 10px;height: 24px;border-radius: 100px;padding: 0 10px 0 25px;font-size: 12px;line-height: 24px;font-weight:700;color:#fff;}
#twitch-module.twitch-rail.light-theme .stream .twitch-viewers {background: rgba(234, 234, 235,.8);color: #000}
#twitch-module.twitch-rail .stream .online-indicator--offline {background: #D64541;}
#twitch-module.twitch-rail .stream .online-indicator {height: 10px;width: 10px;position: absolute;top: 8px;left: 8px;border-radius: 50%;box-shadow: 1px 1px 1px #000;}
#twitch-module.twitch-rail .stream .online-indicator--online {border-color: #2ecc71;background: #2ecc71;}
#twitch-module.twitch-rail .stream .online-indicator--online:before {content: "";display: block;position: absolute;border-radius: 100%;height: 10px;width: 10px;left: 1px;top: 0px;border: 1px solid #2ecc71;animation: online 2s infinite;}

/* Embed */
#twitch-rail-feature-wrapper {transition: all .3s ease; opacity:0;}
#twitch-rail-feature-wrapper.active {opacity:1}
.twitch-rail-feature {height: 600px;background: #0e0e10; transform: translateY(200px); transition: all .3s ease; }
#twitch-rail-feature-wrapper.active .twitch-rail-feature {transform: translateY(0px);}

.twitch-rail-embed-wrapper {display: none;position: fixed;z-index: 99999; top:0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.5);justify-content: center;align-items: center;}
.twitch-rail-embed-wrapper.with-chat .twitch-rail-twitch-embed {width:calc(50% + 340px);}
.twitch-rail-embed-wrapper .twitch-rail-twitch-embed {width: 50%;height: 0;padding-bottom: 28.2%;position: relative;}
.twitch-rail-embed-wrapper .twitch-rail-twitch-embed iframe {position: absolute;top:0;right:0;bottom: 0;left: 0;height: 100%;width: 100%;}
.twitch-rail-embed-wrapper.open {display: flex;}

/* Loader */
#twitch-module.twitch-rail .loader-wrapper {display:none;height: 100px;align-items:center;}
#twitch-module.twitch-rail.loading .loader-wrapper {display:flex}
#twitch-module.twitch-rail .loader,#twitch-module.twitch-rail .loader:before,#twitch-module.twitch-rail .loader:after {background:#723f9e;;-webkit-animation: load1 1s infinite ease-in-out;animation: load1 1s infinite ease-in-out;width: 1em;height: 4em;}
#twitch-module.twitch-rail .loader {color: #ffffff;text-indent: -9999em;margin: 0 auto;position: relative;font-size: 8px;-webkit-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);-webkit-animation-delay: -0.16s;animation-delay: -0.16s;
}
#twitch-module.twitch-rail .loader:before,#twitch-module.twitch-rail .loader:after {position: absolute;top: 0;content: '';}
#twitch-module.twitch-rail .loader:before {left: -1.5em;-webkit-animation-delay: -0.32s;animation-delay: -0.32s;}
#twitch-module.twitch-rail .loader:after {left: 1.5em;}

@media screen and (max-width:696px) {
    .twitch-rail-embed-wrapper .twitch-rail-twitch-embed {height: auto;padding-bottom: 0;width: 75%;height: 75%;}
    .twitch-rail-embed-wrapper.with-chat .twitch-rail-twitch-embed {width: 75%;}
    .twitch-rail-embed-wrapper .twitch-rail-twitch-embed iframe {position: relative;}
}

@media screen and (max-width: 650px) {
#twitch-module.twitch-rail .widget-title {display:none;}
}

@media screen and (max-width: 560px) {
#twitch-module.twitch-rail .twitch-module-header-title {display: none;}
#twitch-module.twitch-rail .twitch-module-header-subtitle {display: none;}
}


/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

/* Keyframes */
@-webkit-keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
@keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}

@-webkit-keyframes online { 0% { transform:scale(1); opacity: 1; } 100% { transform:scale(3); opacity: 0; }}