html,
body {
    height: 100%;
    width: 100%
}
#main-wrapper {
    height: 100%;
    background: #04061f;
    padding-left: 60px
}
#main-wrapper #site-nav-area,
#main-wrapper #main-wrapper #center-area {
    float: left
}
#main-wrapper #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #0e1133;
    position: absolute;
    z-index: 1
}
#main-wrapper #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid #04061f;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid #04061f;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper #site-nav-area .site-nav-item,
#main-wrapper #site-nav-area .site-nav-item a {
    fill: #efefef;
    color: #efefef
}
#main-wrapper #site-nav-area .site-nav-item:hover,
#main-wrapper #site-nav-area .site-nav-item a:hover {
    background: #111
}
#main-wrapper #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #0e1133;
    color: #efefef;
    border-left: 1px solid #04061f;
    z-index: 20 !important
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #efefef;
    border-bottom: 1px solid #04061f;
    display: table
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #efefef;
    border-left: 1px solid #04061f
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #efefef
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #333;
    cursor: pointer
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: #555
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: #0e0e0e
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: #e6e6e6
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: #ffd500
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: #ffa203
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: red
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: #ff14d0
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: #0af
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #04061f;
    content: "";
    background: #0fa
}
#main-wrapper #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #efefef
}
#main-wrapper #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper #center-area #chat-area,
#main-wrapper #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper #center-area #stream-area,
#main-wrapper #center-area #chat-area,
#main-wrapper #center-area #stream-nav-area {
    float: left
}
#main-wrapper #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item,
#main-wrapper #center-area #stream-nav-area .stream-nav-item a {
    color: #efefef;
    fill: #efefef
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #111
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.toggleFullscreen {
    padding: 0
}
#main-wrapper.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper button,
#main-wrapper input,
#main-wrapper optgroup,
#main-wrapper select,
#main-wrapper textarea {
    background: #555;
    border: 1px solid #999
}
#main-wrapper.white {
    height: 100%;
    background: gray;
    padding-left: 60px
}
#main-wrapper.white #site-nav-area,
#main-wrapper.white #main-wrapper #center-area {
    float: left
}
#main-wrapper.white #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #8c8c8c;
    position: absolute;
    z-index: 1
}
#main-wrapper.white #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper.white #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper.white #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper.white #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid gray;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper.white #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper.white #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid gray;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper.white #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper.white #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper.white #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper.white #site-nav-area .site-nav-item,
#main-wrapper.white #site-nav-area .site-nav-item a {
    fill: #fff;
    color: #fff
}
#main-wrapper.white #site-nav-area .site-nav-item:hover,
#main-wrapper.white #site-nav-area .site-nav-item a:hover {
    background: #666
}
#main-wrapper.white #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #8c8c8c;
    color: #fff;
    border-left: 1px solid gray;
    z-index: 20 !important
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #fff;
    border-bottom: 1px solid gray;
    display: table
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #fff;
    border-left: 1px solid gray
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper.white #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #fff
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #999;
    cursor: pointer
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: #a6a6a6
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: #0e0e0e
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: #e6e6e6
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: #ffd500
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: #ffa203
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: red
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: #ff14d0
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: #0af
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid gray;
    content: "";
    background: #0fa
}
#main-wrapper.white #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #fff
}
#main-wrapper.white #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper.white #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper.white #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper.white #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper.white #center-area #chat-area,
#main-wrapper.white #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper.white #center-area #stream-area,
#main-wrapper.white #center-area #chat-area,
#main-wrapper.white #center-area #stream-nav-area {
    float: left
}
#main-wrapper.white #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper.white #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper.white #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper.white #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper.white #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper.white #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper.white #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper.white #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item,
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item a {
    color: #fff;
    fill: #fff
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #666
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper.white #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper.white #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper.white #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper.white #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper.white #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.white.toggleFullscreen {
    padding: 0
}
#main-wrapper.white.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.white.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper.white button,
#main-wrapper.white input,
#main-wrapper.white optgroup,
#main-wrapper.white select,
#main-wrapper.white textarea {
    background: #a6a6a6;
    border: 1px solid #bfbfbf
}
#main-wrapper.yellow {
    height: 100%;
    background: #332b00;
    padding-left: 60px
}
#main-wrapper.yellow #site-nav-area,
#main-wrapper.yellow #main-wrapper #center-area {
    float: left
}
#main-wrapper.yellow #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #4d4000;
    position: absolute;
    z-index: 1
}
#main-wrapper.yellow #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper.yellow #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper.yellow #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper.yellow #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid #332b00;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper.yellow #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper.yellow #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid #332b00;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper.yellow #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper.yellow #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper.yellow #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper.yellow #site-nav-area .site-nav-item,
#main-wrapper.yellow #site-nav-area .site-nav-item a {
    fill: #fd3;
    color: #fd3
}
#main-wrapper.yellow #site-nav-area .site-nav-item:hover,
#main-wrapper.yellow #site-nav-area .site-nav-item a:hover {
    background: #000
}
#main-wrapper.yellow #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #4d4000;
    color: #fd3;
    border-left: 1px solid #332b00;
    z-index: 20 !important
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #fd3;
    border-bottom: 1px solid #332b00;
    display: table
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #fd3;
    border-left: 1px solid #332b00
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper.yellow #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #fd3
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #650;
    cursor: pointer
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: #806a00
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: #0e0e0e
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: #e6e6e6
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: #ffd500
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: #ffa203
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: red
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: #ff14d0
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: #0af
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #332b00;
    content: "";
    background: #0fa
}
#main-wrapper.yellow #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #fd3
}
#main-wrapper.yellow #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper.yellow #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper.yellow #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper.yellow #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper.yellow #center-area #chat-area,
#main-wrapper.yellow #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper.yellow #center-area #stream-area,
#main-wrapper.yellow #center-area #chat-area,
#main-wrapper.yellow #center-area #stream-nav-area {
    float: left
}
#main-wrapper.yellow #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper.yellow #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper.yellow #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper.yellow #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper.yellow #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper.yellow #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper.yellow #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper.yellow #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item,
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item a {
    color: #fd3;
    fill: #fd3
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #000
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper.yellow #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper.yellow #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper.yellow #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper.yellow #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper.yellow #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.yellow.toggleFullscreen {
    padding: 0
}
#main-wrapper.yellow.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.yellow.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper.yellow button,
#main-wrapper.yellow input,
#main-wrapper.yellow optgroup,
#main-wrapper.yellow select,
#main-wrapper.yellow textarea {
    background: #806a00;
    border: 1px solid #b39500
}
#main-wrapper.orange {
    height: 100%;
    background: #362200;
    padding-left: 60px
}
#main-wrapper.orange #site-nav-area,
#main-wrapper.orange #main-wrapper #center-area {
    float: left
}
#main-wrapper.orange #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #503200;
    position: absolute;
    z-index: 1
}
#main-wrapper.orange #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper.orange #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper.orange #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper.orange #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid #362200;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper.orange #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper.orange #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid #362200;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper.orange #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper.orange #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper.orange #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper.orange #site-nav-area .site-nav-item,
#main-wrapper.orange #site-nav-area .site-nav-item a {
    fill: #FFB536;
    color: #FFB536
}
#main-wrapper.orange #site-nav-area .site-nav-item:hover,
#main-wrapper.orange #site-nav-area .site-nav-item a:hover {
    background: #030200
}
#main-wrapper.orange #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #503200;
    color: #FFB536;
    border-left: 1px solid #362200;
    z-index: 20 !important
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #FFB536;
    border-bottom: 1px solid #362200;
    display: table
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #FFB536;
    border-left: 1px solid #362200
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper.orange #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #FFB536
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #694200;
    cursor: pointer
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: #835200
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: #0e0e0e
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: #e6e6e6
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: #ffd500
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: #ffa203
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: red
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: #ff14d0
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: #0af
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #362200;
    content: "";
    background: #0fa
}
#main-wrapper.orange #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #FFB536
}
#main-wrapper.orange #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper.orange #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper.orange #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper.orange #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper.orange #center-area #chat-area,
#main-wrapper.orange #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper.orange #center-area #stream-area,
#main-wrapper.orange #center-area #chat-area,
#main-wrapper.orange #center-area #stream-nav-area {
    float: left
}
#main-wrapper.orange #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper.orange #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper.orange #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper.orange #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper.orange #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper.orange #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper.orange #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper.orange #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item,
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item a {
    color: #FFB536;
    fill: #FFB536
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #030200
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper.orange #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper.orange #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper.orange #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper.orange #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper.orange #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.orange.toggleFullscreen {
    padding: 0
}
#main-wrapper.orange.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.orange.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper.orange button,
#main-wrapper.orange input,
#main-wrapper.orange optgroup,
#main-wrapper.orange select,
#main-wrapper.orange textarea {
    background: #835200;
    border: 1px solid #b67300
}
#main-wrapper.red {
    height: 100%;
    background: #300;
    padding-left: 60px
}
#main-wrapper.red #site-nav-area,
#main-wrapper.red #main-wrapper #center-area {
    float: left
}
#main-wrapper.red #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #4d0000;
    position: absolute;
    z-index: 1
}
#main-wrapper.red #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper.red #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper.red #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper.red #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid #300;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper.red #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper.red #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid #300;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper.red #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper.red #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper.red #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper.red #site-nav-area .site-nav-item,
#main-wrapper.red #site-nav-area .site-nav-item a {
    fill: #f33;
    color: #f33
}
#main-wrapper.red #site-nav-area .site-nav-item:hover,
#main-wrapper.red #site-nav-area .site-nav-item a:hover {
    background: #000
}
#main-wrapper.red #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #4d0000;
    color: #f33;
    border-left: 1px solid #300;
    z-index: 20 !important
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #f33;
    border-bottom: 1px solid #300;
    display: table
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #f33;
    border-left: 1px solid #300
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper.red #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #f33
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #600;
    cursor: pointer
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: maroon
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: #0e0e0e
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: #e6e6e6
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: #ffd500
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: #ffa203
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: red
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: #ff14d0
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: #0af
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #300;
    content: "";
    background: #0fa
}
#main-wrapper.red #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #f33
}
#main-wrapper.red #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper.red #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper.red #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper.red #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper.red #center-area #chat-area,
#main-wrapper.red #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper.red #center-area #stream-area,
#main-wrapper.red #center-area #chat-area,
#main-wrapper.red #center-area #stream-nav-area {
    float: left
}
#main-wrapper.red #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper.red #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper.red #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper.red #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper.red #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper.red #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper.red #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper.red #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item,
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item a {
    color: #f33;
    fill: #f33
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #000
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper.red #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper.red #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper.red #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper.red #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper.red #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.red.toggleFullscreen {
    padding: 0
}
#main-wrapper.red.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.red.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper.red button,
#main-wrapper.red input,
#main-wrapper.red optgroup,
#main-wrapper.red select,
#main-wrapper.red textarea {
    background: maroon;
    border: 1px solid #b30000
}
#main-wrapper.pink {
    height: 100%;
    background: #470039;
    padding-left: 60px
}
#main-wrapper.pink #site-nav-area,
#main-wrapper.pink #main-wrapper #center-area {
    float: left
}
#main-wrapper.pink #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #61004d;
    position: absolute;
    z-index: 1
}
#main-wrapper.pink #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper.pink #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper.pink #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper.pink #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid #470039;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper.pink #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper.pink #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid #470039;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper.pink #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper.pink #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper.pink #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper.pink #site-nav-area .site-nav-item,
#main-wrapper.pink #site-nav-area .site-nav-item a {
    fill: #FF47DA;
    color: #FF47DA
}
#main-wrapper.pink #site-nav-area .site-nav-item:hover,
#main-wrapper.pink #site-nav-area .site-nav-item a:hover {
    background: #140010
}
#main-wrapper.pink #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #61004d;
    color: #FF47DA;
    border-left: 1px solid #470039;
    z-index: 20 !important
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #FF47DA;
    border-bottom: 1px solid #470039;
    display: table
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #FF47DA;
    border-left: 1px solid #470039
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper.pink #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #FF47DA
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #7a0061;
    cursor: pointer
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: #940076
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: #0e0e0e
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: #e6e6e6
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: #ffd500
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: #ffa203
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: red
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: #ff14d0
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: #0af
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #470039;
    content: "";
    background: #0fa
}
#main-wrapper.pink #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #FF47DA
}
#main-wrapper.pink #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper.pink #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper.pink #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper.pink #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper.pink #center-area #chat-area,
#main-wrapper.pink #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper.pink #center-area #stream-area,
#main-wrapper.pink #center-area #chat-area,
#main-wrapper.pink #center-area #stream-nav-area {
    float: left
}
#main-wrapper.pink #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper.pink #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper.pink #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper.pink #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper.pink #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper.pink #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper.pink #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper.pink #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item,
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item a {
    color: #FF47DA;
    fill: #FF47DA
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #140010
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper.pink #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper.pink #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper.pink #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper.pink #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper.pink #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.pink.toggleFullscreen {
    padding: 0
}
#main-wrapper.pink.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.pink.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper.pink button,
#main-wrapper.pink input,
#main-wrapper.pink optgroup,
#main-wrapper.pink select,
#main-wrapper.pink textarea {
    background: #940076;
    border: 1px solid #c7009f
}
#main-wrapper.blue {
    height: 100%;
    background: #023;
    padding-left: 60px
}
#main-wrapper.blue #site-nav-area,
#main-wrapper.blue #main-wrapper #center-area {
    float: left
}
#main-wrapper.blue #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #00334d;
    position: absolute;
    z-index: 1
}
#main-wrapper.blue #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper.blue #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper.blue #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper.blue #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid #023;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper.blue #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper.blue #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid #023;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper.blue #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper.blue #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper.blue #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper.blue #site-nav-area .site-nav-item,
#main-wrapper.blue #site-nav-area .site-nav-item a {
    fill: #3bf;
    color: #3bf
}
#main-wrapper.blue #site-nav-area .site-nav-item:hover,
#main-wrapper.blue #site-nav-area .site-nav-item a:hover {
    background: #000
}
#main-wrapper.blue #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #00334d;
    color: #3bf;
    border-left: 1px solid #023;
    z-index: 20 !important
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #3bf;
    border-bottom: 1px solid #023;
    display: table
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #3bf;
    border-left: 1px solid #023
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper.blue #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #3bf
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #046;
    cursor: pointer
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: #005580
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: #0e0e0e
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: #e6e6e6
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: #ffd500
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: #ffa203
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: red
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: #ff14d0
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: #0af
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #023;
    content: "";
    background: #0fa
}
#main-wrapper.blue #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #3bf
}
#main-wrapper.blue #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper.blue #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper.blue #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper.blue #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper.blue #center-area #chat-area,
#main-wrapper.blue #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper.blue #center-area #stream-area,
#main-wrapper.blue #center-area #chat-area,
#main-wrapper.blue #center-area #stream-nav-area {
    float: left
}
#main-wrapper.blue #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper.blue #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper.blue #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper.blue #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper.blue #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper.blue #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper.blue #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper.blue #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item,
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item a {
    color: #3bf;
    fill: #3bf
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #000
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper.blue #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper.blue #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper.blue #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper.blue #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper.blue #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.blue.toggleFullscreen {
    padding: 0
}
#main-wrapper.blue.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.blue.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper.blue button,
#main-wrapper.blue input,
#main-wrapper.blue optgroup,
#main-wrapper.blue select,
#main-wrapper.blue textarea {
    background: #005580;
    border: 1px solid #0077b3
}
#main-wrapper.green {
    height: 100%;
    background: #032;
    padding-left: 60px
}
#main-wrapper.green #site-nav-area,
#main-wrapper.green #main-wrapper #center-area {
    float: left
}
#main-wrapper.green #site-nav-area {
    width: 60px;
    height: 100%;
    margin-left: -60px;
    background: #004d33;
    position: absolute;
    z-index: 1
}
#main-wrapper.green #site-nav-area .nav-group {
    width: inherit
}
#main-wrapper.green #site-nav-area .nav-area {
    width: inherit;
    overflow: hidden
}
#main-wrapper.green #site-nav-area .nav-area.pull-up {
    position: absolute;
    top: 0
}
#main-wrapper.green #site-nav-area .nav-area.pull-up .nav-group {
    border-bottom: 1px solid #032;
    padding-bottom: 5px;
    margin-bottom: 5px
}
#main-wrapper.green #site-nav-area .nav-area.pull-down {
    position: absolute;
    bottom: 0
}
#main-wrapper.green #site-nav-area .nav-area.pull-down .nav-group {
    border-top: 1px solid #032;
    padding-top: 5px;
    margin-top: 5px
}
#main-wrapper.green #site-nav-area .site-nav-item {
    font-size: 1.1em;
    line-height: 40px;
    width: inherit;
    height: 40px;
    cursor: pointer
}
#main-wrapper.green #site-nav-area .site-nav-item a {
    width: inherit;
    height: inherit;
    float: left
}
#main-wrapper.green #site-nav-area .site-nav-item svg {
    width: inherit;
    height: inherit;
    padding: 7.5px;
    pointer-events: none
}
#main-wrapper.green #site-nav-area .site-nav-item,
#main-wrapper.green #site-nav-area .site-nav-item a {
    fill: #3fb;
    color: #3fb
}
#main-wrapper.green #site-nav-area .site-nav-item:hover,
#main-wrapper.green #site-nav-area .site-nav-item a:hover {
    background: #000
}
#main-wrapper.green #site-nav-area .site-nav-box {
    display: none;
    position: absolute;
    left: 100%;
    background: #004d33;
    color: #3fb;
    border-left: 1px solid #032;
    z-index: 20 !important
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-header {
    width: 100%;
    height: 30px;
    fill: #3fb;
    border-bottom: 1px solid #032;
    display: table
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-title {
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 5px
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close {
    height: inherit;
    width: 30px;
    float: right;
    cursor: pointer;
    fill: #3fb;
    border-left: 1px solid #032
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close svg {
    height: inherit;
    width: inherit;
    padding: 6px
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-header .site-nav-box-close:hover {
    fill: #dc301f
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-body {
    width: 100%;
    padding: 5px
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper {
    padding-top: 10px
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea {
    min-width: 300px
}
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper textarea,
#main-wrapper.green #site-nav-area .site-nav-box .site-nav-box-body .input-field-wrapper input[type="text"] {
    width: 100%
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body {
    max-height: 300px;
    min-width: 311px;
    overflow-y: scroll;
    overflow-x: hidden
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body h4 {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #3fb
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list {
    list-style: none;
    margin: 0;
    padding: 0
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li {
    padding: 5px;
    border-bottom: 1px solid #064;
    cursor: pointer
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-channels-box .site-nav-box-body .channel-list li:hover {
    background: #008055
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body {
    min-height: 400px;
    min-width: 500px;
    overflow-x: hidden
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-strawpoll-box .site-nav-box-body iframe {
    width: 100%;
    min-height: 400px;
    border: 0
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container {
    width: 200px
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="default"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: #0e0e0e
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="white"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: #e6e6e6
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="yellow"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: #ffd500
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="orange"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: #ffa203
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="red"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: red
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="pink"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: #ff14d0
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="blue"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: #0af
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option[data-color-type="green"] {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #032;
    content: "";
    background: #0fa
}
#main-wrapper.green #site-nav-area .site-nav-box#site-nav-color-picker-box .color-picker-container .color-picker-option:hover {
    border-color: #3fb
}
#main-wrapper.green #center-area {
    width: 100%;
    height: 100%;
    padding: 20px;
    padding-top: 120px;
    overflow: hidden
}
#main-wrapper.green #center-area #header-area {
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center
}
#main-wrapper.green #center-area #header-area .banner {
    display: inline-block;
    vertical-align: middle;
    height: 80%
}
#main-wrapper.green #center-area #header-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}
#main-wrapper.green #center-area #chat-area,
#main-wrapper.green #center-area #stream-area {
    padding-bottom: 40px
}
#main-wrapper.green #center-area #stream-area,
#main-wrapper.green #center-area #chat-area,
#main-wrapper.green #center-area #stream-nav-area {
    float: left
}
#main-wrapper.green #center-area #chat-area {
    width: 25%;
    height: 100%
}
#main-wrapper.green #center-area #chat-area #chat {
    width: 100%;
    height: 100%;
}
#main-wrapper.green #center-area #stream-area {
    width: 75%;
    height: 100%
}
#main-wrapper.green #center-area #stream-area #stream {
    width: 100%;
    height: 100%;
    background: #151515
}
#main-wrapper.green #center-area #stream-nav-area {
    width: 100%;
    height: 40px;
    margin-top: -40px;
    display: table
}
#main-wrapper.green #center-area #stream-nav-area .nav-area {
    height: inherit
}
#main-wrapper.green #center-area #stream-nav-area .nav-area.pull-left {
    float: left
}
#main-wrapper.green #center-area #stream-nav-area .nav-area.pull-right {
    float: right
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item {
    height: inherit;
    font-size: 1.1em;
    line-height: 40px;
    padding: 0 7.5px;
    cursor: pointer;
    float: left
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item a {
    height: inherit
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item svg,
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item span {
    float: left;
    pointer-events: none
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item,
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item a {
    color: #3fb;
    fill: #3fb
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item:hover,
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item a:hover {
    background: #000
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh {
    padding: 0
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item#toggleAutoRefresh .auto-refresh {
    padding: 5px
}
#main-wrapper.green #center-area #stream-nav-area .stream-nav-item .add-space:before {
    padding-right: 5px
}
#main-wrapper.green #center-area.toggleChat #chat-area {
    width: 0;
    visibility: hidden
}
#main-wrapper.green #center-area.toggleChat #stream-area {
    width: 100%
}
#main-wrapper.green #center-area.toggleHeader {
    padding-top: 20px
}
#main-wrapper.green #center-area.toggleHeader #header-area {
    height: 0;
    visibility: hidden
}
#main-wrapper.green.toggleFullscreen {
    padding: 0
}
#main-wrapper.green.toggleFullscreen #center-area {
    padding: 0
}
#main-wrapper.green.toggleFullscreen #toggleChatVersion {
    display: none
}
#main-wrapper.green button,
#main-wrapper.green input,
#main-wrapper.green optgroup,
#main-wrapper.green select,
#main-wrapper.green textarea {
    background: #008055;
    border: 1px solid #00b377
}