body { font-family: 'Open Sans', Arial, sans-serif; color: #eee; margin-top: 50px; overflow: hidden; } a { color: #eee; } a:hover, a:focus { color: #e9a049; text-decoration: none; outline: none; } select, .react-selectize.bootstrap3.root-node .react-selectize-control { margin: 5px 0 5px 0; border: 2px solid #444; background: #333; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; color: #999; outline: none; } select.input-sm { margin: 5px 0 5px 0; border: 2px solid #444; background: #333; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; color: #999; outline: none; } select[multiple] { height: 125px; margin: 5px 0 5px 0; color: #eee; border: 0px solid #444; background: #555; padding: 2px 2px; background-color: #555; border-radius: 3px; transition: background-color .3s; } select[multiple]:focus { outline: 0; outline: thin dotted \9; color: #555; background-color: #eee; transition: background-color .3s; } select[multiple]:focus::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.15); } select[multiple] option { padding: 6px 10px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } select.form-control, div.form-control .selectize-input { margin: 5px 0 5px 0; color: #eee; border: 0px solid #444; background: #555; padding: 6px 12px; background-color: #555; border-radius: 3px; transition: background-color .3s; } select.form-control { height: 32px !important; } .react-selectize.root-node .react-selectize-control, .selectize-control.form-control .selectize-input { color: #eee !important; border: 0px solid #444 !important; background: #555 !important; padding: 1px 2px; transition: background-color .3s; } .selectize-control.form-control .selectize-input { display: flex !important; align-items: center; flex-wrap: wrap; margin-bottom: 4px; padding-left: 5px; } .selectize-control.form-control.selectize-pms-ip .selectize-input { padding-left: 12px !important; border-top-left-radius: 3px; border-bottom-left-radius: 3px; min-height: 32px !important; height: 32px !important; } .input-group .selectize-control.form-control.selectize-pms-ip .selectize-input > div { max-width: 450px; overflow: hidden; text-overflow: ellipsis; } .wizard-input-section p.welcome-message { margin: 20px 0; } .wizard-input-section .selectize-control.form-control.selectize-pms-ip .selectize-input > div { max-width: 360px; overflow: hidden; text-overflow: ellipsis; } #selectize-pms-ip-container .selectize-dropdown.form-control.selectize-pms-ip { margin-left: 15px; } .wizard-input-section .selectize-control.form-control.selectize-pms-ip .selectize-dropdown .selectize-dropdown-content { max-height: 150px; } .wizard-input-section .selectize-dropdown.form-control.selectize-pms-ip { margin-top: 0 !important; } #condition-widget .fa-plus, #condition-widget .fa-minus { cursor: pointer; } .react-selectize.root-node .react-selectize-control .react-selectize-placeholder { color: #eee !important; } .react-selectize.root-node .react-selectize-control .react-selectize-toggle-button path { fill: #eee !important; } .react-selectize.root-node .simple-value, .selectize-control.multi .selectize-input > div { background: #444 !important; color: #eee !important; padding-bottom: 2px !important; transition: background-color .3s; } .react-selectize.root-node .simple-value span, .selectize-control.multi .selectize-input > div { padding-bottom: 2px !important; padding-left: 5px !important; } .react-selectize.root-node .react-selectize-control .react-selectize-search-field-and-selected-values .value-wrapper:not(:first-child):before { content: "or"; padding: 0 3px; text-transform: uppercase; font-size: 10px; } .react-selectize.root-node .react-selectize-control .react-selectize-search-field-and-selected-values .resizable-input { padding-top: 3px !important; padding-bottom: 3px !important; } select.form-control:focus, .react-selectize.root-node.open .react-selectize-control, .selectize-control.form-control .selectize-input.focus { outline: 0; outline: thin dotted \9; color: #555 !important; background-color: #eee !important; transition: background-color .3s; } .react-selectize.root-node.open .simple-value, .selectize-control.multi .selectize-input.focus > div, .selectize-control.multi .selectize-input > div.active { background: #efefef !important; color: #333333 !important; transition: background-color .3s; } .react-selectize.root-node.open .react-selectize-control .react-selectize-toggle-button path { fill: #999 !important; } .selectize-input > div .item-text { white-space: nowrap; } .selectize-input > div .item-value { opacity: 0.8; font-size: 12px; white-space: nowrap; } .selectize-input > div .item-text + .item-value { margin-left: 5px; } .selectize-input > div .item-value:before { content: '<'; opacity: 0.8; font-size: 12px; } .selectize-input > div .item-value:after { content: '>'; opacity: 0.8; font-size: 12px; } .selectize-dropdown .caption { font-size: 12px; display: block; color: #a0a0a0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .selectize-dropdown .select-all, .selectize-dropdown .remove-all { font-weight: bold; } .selectize-dropdown .border-all { pointer-events: none; display: block; height: 1px; margin: 9px -12px 9px -12px; padding: 0 !important; overflow: hidden; background-color: #e5e5e5; } .selectize-dropdown .border-all:last-child { display: none; } .selectize-dropdown .optgroup-header { font-weight: bold; } .selectize-dropdown [data-selectable].option-disabled { color: #aaa; cursor: default; } select.form-control option { color: #555; background-color: #eee; } img { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } object { pointer-events: none; } .navbar { background: #000; -webkit-box-shadow: 0 0 0 3px rgba(0,0,0,.2); -moz-box-shadow: 0 0 0 3px rgba(0,0,0,.2); box-shadow: 0 0 0 3px rgba(0,0,0,.2); } .navbar-brand { padding: 3px 3px; } .nav > li > a { color: #999; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .nav > li > a:hover, .nav > li > a:focus { text-decoration: none; background-color: #282828; color: #eee; } .nav > li.active > a, .nav > li.active > a:hover, .nav > li.active > a:focus { color: #f9be03; background-color: #282828; } .navbar-toggle { background-color: #282828; } .navbar-toggle:hover, .navbar-toggle:focus { background-color: #2f2f2f; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: #2f2f2f; border-color: unset; } .dropdown-menu { background-color: #282828; } .dropdown-menu .divider { background-color: #777; } .dropdown-menu > li > a { color: #999; } .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { color: #eee; background-color: #2f2f2f; } .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus { color: #eee; background-color: #2f2f2f; } .dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus { color: #999; } .icon-bar { background-color: #999; } .padded-header { margin: 25px 0 25px 0; } .padded-header h1,h2,h3,h4,h5,h6 { color: #eee; } .padded-header h3 { font-size: 16px; font-weight: bold; text-transform: uppercase; } .padded-header h3 small { font-size: 13px; text-transform: none; } .btn { outline:0px !important; } .btn:not(select) { -webkit-appearance:none; } .btn-dark { color: #d7d7d7; background-color: #3B3B3B; border-color: transparent; } .btn-dark:focus, .btn-dark.focus { color: #d7d7d7; background-color: #3B3B3B; } .btn-dark:hover { color: #eee; background-color: #333; border-color: #444; } .btn-dark:active, .btn-dark.active, .open > .dropdown-toggle.btn-dark { color: #eee; background-color: #333; border-color: #444; } .btn-dark:active:hover, .btn-dark.active:hover, .open > .dropdown-toggle.btn-dark:hover, .btn-dark:active:focus, .btn-dark.active:focus, .open > .dropdown-toggle.btn-dark:focus, .btn-dark:active.focus, .btn-dark.active.focus, .open > .dropdown-toggle.btn-dark.focus { color: #eee; background-color: #333; } .btn-dark:active, .btn-dark.active, .open > .dropdown-toggle.btn-dark { background-image: none; } .btn-dark.disabled, .btn-dark[disabled], fieldset[disabled] .btn-dark, .btn-dark.disabled:hover, .btn-dark[disabled]:hover, fieldset[disabled] .btn-dark:hover, .btn-dark.disabled:focus, .btn-dark[disabled]:focus, fieldset[disabled] .btn-dark:focus, .btn-dark.disabled.focus, .btn-dark[disabled].focus, fieldset[disabled] .btn-dark.focus, .btn-dark.disabled:active, .btn-dark[disabled]:active, fieldset[disabled] .btn-dark:active, .btn-dark.disabled.active, .btn-dark[disabled].active, fieldset[disabled] .btn-dark.active { background-color: #333; color: #aaa; } .btn-dark.inactive:hover { color: #d7d7d7; background-color: #3B3B3B; border-color: transparent; cursor: default; } .btn-dark .badge { color: #e5e5e5; background-color: #3B3B3B; } .btn-bright { color: #eee; background-color: #cc7b19; box-shadow: inset 0 1px 0 #e7993b; } .btn-bright:focus, .btn-bright.focus { color: #eee; background-color: #eb8600; } .btn-bright:hover { color: #eee; background-color: #e59029; box-shadow: inset 0 1px 0 #ebac60; } .btn-bright:active, .btn-bright.active, .open > .dropdown-toggle.btn-bright { color: #eee; background-color: #cc7b19; box-shadow: inset 0 1px 0 #e7993b; } .btn-bright:active:hover, .btn-bright.active:hover, .open > .dropdown-toggle.btn-bright:hover, .btn-bright:active:focus, .btn-bright.active:focus, .open > .dropdown-toggle.btn-bright:focus, .btn-bright:active.focus, .btn-bright.active.focus, .open > .dropdown-toggle.btn-bright.focus { color: #eee; background-color: #cc7b19; box-shadow: inset 0 1px 0 #e7993b; } .btn-bright:active, .btn-bright.active, .open > .dropdown-toggle.btn-bright { background-image: none; } .btn-bright.disabled, .btn-bright[disabled], fieldset[disabled] .btn-bright, .btn-bright.disabled:hover, .btn-bright[disabled]:hover, fieldset[disabled] .btn-bright:hover, .btn-bright.disabled:focus, .btn-bright[disabled]:focus, fieldset[disabled] .btn-bright:focus, .btn-bright.disabled.focus, .btn-bright[disabled].focus, fieldset[disabled] .btn-bright.focus, .btn-bright.disabled:active, .btn-bright[disabled]:active, fieldset[disabled] .btn-bright:active, .btn-bright.disabled.active, .btn-bright[disabled].active, fieldset[disabled] .btn-bright.active { background-color: #cc7b19; border-color: #b56d16; } .btn-bright .badge { color: #eee; background-color: #cc7b19; box-shadow: inset 0 1px 0 #e7993b; } .btn-danger.btn-edit { color: #d7d7d7; background-color: #3B3B3B; border-color: transparent; float: right; } .btn-danger.btn-edit:hover { color: #eee; background-color: #c9302c; border-color: #ac2925; } .btn-danger.btn-edit.active { color: #eee; background-color: #c9302c; border-color: #ac2925; } .btn-danger.btn-edit.active:hover { color: #eee; background-color: #ac2925; border-color: #761c19; } .btn-group select { margin-top: 0; height: 34px; } .btn-group label { margin-bottom: 0; } .input-group-addon-form { display: inline-block; line-height: 1.42857143; color: #e5e5e5; background-color: #3B3B3B; border: 1px solid transparent; border-top-right-radius: 3px !important; border-bottom-right-radius: 3px !important; height: 32px; width: 100%; margin-top: 5px; } .alert-edit { display: none; float: left; margin-bottom: 0; /*margin-right: 5px;*/ padding: 6px 15px; } .modal-header { padding: 15px 20px; background-color: #323232; border-radius: 3px 3px 0 0; border-bottom: 1px solid #1C1C1C; } .modal-body { position: relative; overflow-y: auto; max-height: 600px; padding: 15px; background-color: #222222; } .modal-body table { color: #eee; } .modal-body li { margin-top: 7px; margin-left: 4px; color: #aaa; } .modal-body li strong { color: #eee; } .modal-body i { color: #E5A00D; } .modal-body i.fa { color: #eee; } .modal-body td:hover a .fa, .modal-body a:focus i.fa { color: #f9aa03; } .modal-body strong, .modal-body strong i.fa { color: #E5A00D; } .modal-footer { padding: 15px 20px; margin-top: 0; background-color: #323232; border-radius: 0 0 3px 3px; border-top: 1px solid #1C1C1C; } textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { margin: 5px 0 5px 0; color: #eee; border: 0px solid #444; background: #555; height: 32px; padding: 6px 12px; background-color: #555; border-radius: 3px; transition: background-color .3s; } textarea.form-control { height: initial; margin: 5px 0 5px 0; color: #eee; border: 0px solid #444; background: #555; padding: 6px 12px; background-color: #555; border-radius: 3px; transition: background-color .3s; resize: none; } textarea.form-control:focus { outline: 0; color: #555; background-color: #eee; transition: background-color .3s; } .pagination > li > a, .pagination > li > span { position: relative; float: left; padding: 6px 12px; margin-left: -1px; line-height: 1.42857143; color: #eee; text-decoration: none; background-color: #262626; border: 1px solid #444444; } .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { background-color: #cc7b19; border: 1px solid #444444; } .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { z-index: 2; color: #eee; cursor: default; background-color: #cc7b19; border-color: #444444; } .pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus { color: #444444; cursor: not-allowed; background-color: #262626; border-color: #444444; } .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { color: #eee; background-color: #cc7b19; } .nav-pills > li > a { border-radius: 3px; padding: 5px 10px; margin: 0 0 20px 0; } .btn-form { padding: 4px 12px; margin: 5px 0 5px 0; font-size: 14px; font-weight: normal; height: 32px; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; background-color: #3B3B3B; color: #e5e5e5; border: 1px solid transparent; border-radius: 3px; outline:0px !important; -webkit-appearance:none; } .btn-form:hover { color: #eee; background-color: #333; } .btn-form:focus { color: #eee; } .form-control-feedback { color: #E5A00D; margin: 5px 40px 5px 0; } .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { background-color: #555; } .form-control[readonly]:focus { background-color: #eee; } .poster { position: relative; height: 225px; } .poster-face { background-position: center; background-size: cover; height: 225px; width: 150px; position: relative; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; } .cover-face { background-position: center; background-size: cover; height: 150px; width: 150px; position: absolute; bottom: 0; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .users-poster-face { float: left; background-size: cover; background-position: center; height: 40px; width: 40px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .libraries-poster-face { overflow: hidden; float: left; background-size: cover; background-position: center; height: 40px; width: 40px; /*-webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);*/ } a .poster-face:hover, a .cover-face:hover, a .users-poster-face:hover { -webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .users-name { position: relative; } #dashboard-checking-activity, #dashboard-no-activity, #dashboard-checking-recently-added, #dashboard-no-recently-added { margin-bottom: 20px; } .dashboard-activity-instance { float: left; position: relative; height: 290px; max-width: 500px; margin-left: 25px; margin-bottom: 25px; } .dashboard-activity-container { height: 240px; width: 100%; position: relative; margin-bottom: 5px; padding: 0px; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; overflow: hidden; } .dashboard-activity-background { background-color: #282828; background-position: center; background-size: cover; display: -webkit-flex; display: flex; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; height: 235px; width: 100%; padding: 5px; overflow: hidden; -webkit-transition: background 1s linear; transition: background 1s linear; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); } .dashboard-activity-poster-container { background-color: #282828; height: 225px; width: 150px; margin-right: 5px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -webkit-flex-shrink: 0; flex-shrink: 0; z-index: 1; } .dashboard-activity-poster { background-position: center; background-size: cover; height: 225px; width: 150px; -webkit-transition: background 1s linear; transition: background 1s linear; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 2; } .dashboard-activity-poster-blur { background-color: #282828; background-position: center; background-size: cover; height: 225px; width: 150px; opacity: 0.60; -webkit-filter: blur(3px); -moz-filter: blur(3px); filter: blur(3px); -webkit-transition: background .2s ease-in-out; transition: background .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 2; } .dashboard-activity-cover { background-position: center; background-size: cover; height: 150px; width: 150px; margin-top: 37.5px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -webkit-transition: background 1s linear; transition: background 1s linear; -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; z-index: 3; } .dashboard-activity-info-icon { width: 50px; height: 50px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; position: absolute; top: 10px; right: 10px; overflow: hidden; z-index: 2; } .dashboard-activity-info-platform { background-position: center; background-size: cover; width: 50px; height: 50px; opacity: 1; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .dashboard-activity-info-platform-no-terminate { background-position: center; background-size: cover; width: 50px; height: 50px; opacity: 1; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .dashboard-activity-terminate-session { width: 100%; height: 100%; font-size: 31px; color: #eee; text-align: center; opacity: 0; position: absolute; top: 0; left: 0; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .dashboard-activity-terminate-session:hover { color: #e9a049; } .dashboard-activity-info-container { display: -webkit-flex; display: flex; flex-direction: column; height: 225px; width: 385px; overflow: hidden; } .dashboard-activity-info-scroller { height: 225px; width: 100%; -webkit-flex-grow: 1; flex-grow: 1; z-index: 1; } .dashboard-activity-info-scroller.scrollbar-macosx > .scroll-element.scroll-y { left: 10px; } .dashboard-activity-info-scroller.scrollbar-macosx > .scroll-element .scroll-bar { background-color: #999; } .dashboard-activity-info { width: 100%; font-size: 12px; padding: 5px 5px 5px 15px; position: relative; } .dashboard-activity-info-list { margin-bottom: 20px; padding-right: 0; } .dashboard-activity-info-list:last-of-type { margin-bottom: 0; } .dashboard-activity-info-item { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: baseline; width: 100%; margin-bottom: 5px; } .dashboard-activity-info-item:last-of-type { margin-bottom: 0; } .dashboard-activity-info-item .sub-heading { height: 100%; width: 60px; color: #aaa; font-size: 10px; text-align: right; text-transform: uppercase; line-height: 14px; -webkit-flex-shrink: 0; flex-shrink: 0; } .dashboard-activity-info-item .sub-value { margin-left: 10px; text-align: left; line-height: 14px; -webkit-flex-grow: 1; flex-grow: 1; } .dashboard-activity-info-item .sub-value.platform-right { margin-right: 55px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .dashboard-activity-info-item .sub-value.time-right { margin-right: 60px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .dashboard-activity-info-item .sub-value .ip-container { display: inline-flex; } .dashboard-activity-info-item .sub-value .ip-address { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 125px; } .dashboard-activity-info-time { position: absolute; top: 200px; right: 10px; text-align: right; font-size: 10px; z-index: 2; } .dashboard-activity-progress { width: 100%; height: 5px; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; transform-origin: top; overflow: hidden; } .dashboard-activity-progress-bar { background-color: #111; height: 100%; width: 100%; position: relative; overflow: hidden; } .dashboard-activity-progress .buffer-bar { padding-right: 3px; font-size: x-small; text-align: right; line-height: 14px; color: rgba(255, 255, 255, 0); background-color: #444; position: absolute; height: 100%; max-width: 100%; overflow: hidden; } .dashboard-activity-progress .progress-bar { padding-right: 3px; font-size: x-small; text-align: right; line-height: 14px; color: rgba(255, 255, 255, 0); background-color: #faa732; background-image: -moz-linear-gradient(top, #fbb450, #f89406); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406)); background-image: -webkit-linear-gradient(top, #fbb450, #f89406); background-image: -o-linear-gradient(top, #fbb450, #f89406); background-image: linear-gradient(to bottom, #fbb450, #f89406); background-repeat: repeat-x; position: absolute; height: 100%; max-width: 100%; overflow: hidden; } .dashboard-activity-container:hover { height: 249px; } .dashboard-activity-container:hover .dashboard-activity-progress { height: 14px; } .dashboard-activity-container:hover .progress-bar { color: rgba(255, 255, 255, 1); background-image: -webkit-linear-gradient(left,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 50px); background-image: -moz-linear-gradient(left,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 50px); background-image: linear-gradient(to left,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 50px); } .dashboard-activity-container:hover .buffer-bar { color: rgba(255, 255, 255, 1); background-image: -webkit-linear-gradient(left,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 50px); background-image: -moz-linear-gradient(left,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 50px); background-image: linear-gradient(to left,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 50px); } a:hover .dashboard-activity-poster, a:hover .dashboard-activity-cover { -webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .dashboard-activity-container:hover .dashboard-activity-info-platform { opacity: 0; } .dashboard-activity-container:hover .dashboard-activity-terminate-session { background-color: rgba(0, 0, 0, 0.25); opacity: 1; cursor: pointer; } .dashboard-activity-metadata-wrapper { position: relative; width: 100%; height: 50px; font-size: 13px; padding: 0px 3px 0 3px; } .dashboard-activity-metadata-title-container { display: flex; flex-direction: row; font-size: 13px; font-weight: bold; line-height: 25px; color: #eee; } .dashboard-activity-metadata-play_state-icon { flex-basis: 25px; -webkit-flex-shrink: 0; flex-shrink: 0; } .dashboard-activity-metadata-title { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 350px; -webkit-flex-grow: 1; flex-grow: 1; } .dashboard-activity-metadata-subtitle-container { display: flex; flex-direction: row; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 13px; font-weight: bold; line-height: 25px; color: #999; } .dashboard-activity-metadata-media_type-icon { flex-basis: 25px; -webkit-flex-shrink: 0; flex-shrink: 0; } .dashboard-activity-metadata-subtitle { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; -webkit-flex-grow: 1; flex-grow: 1; } .dashboard-activity-metadata-user { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: right; max-width: 124px; flex-basis: 124px; -webkit-flex-shrink: 0; flex-shrink: 0; } .dashboard-activity-metadata-user-thumb { background-color: #282828; background-position: center; background-size: cover; margin-top: 5px; margin-left: 10px; height: 40px; width: 40px; position: relative; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; float: right; } a .dashboard-activity-metadata-user-thumb:hover { -webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .dashboard-activity-metadata-user a { color: #999; } .dashboard-activity-metadata-user a:hover { color: #e9a049; } .dashboard-activity-metadata-title a:hover { color: #e9a049; } .dashboard-stats-instance { float: left; position: relative; height: 160px; max-width: 500px; margin-left: 25px; margin-bottom: 25px; } .dashboard-stats-container { height: 160px; width: 100%; position: relative; padding: 0px; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; overflow: hidden; } .dashboard-stats-background { background-color: #282828; background-position: center; background-size: cover; display: -webkit-flex; display: flex; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; height: 160px; width: 100%; padding: 5px; overflow: hidden; -webkit-transition: background .2s ease-in-out; transition: background .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); } .dashboard-stats-background.flat { opacity: 1; } .dashboard-stats-poster-container { background-color: #282828; height: 150px; width: 100px; margin-right: 5px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -webkit-flex-shrink: 0; flex-shrink: 0; position: relative; overflow: hidden; z-index: 1; } .dashboard-stats-poster { background-color: #282828; background-position: center; background-size: cover; height: 150px; width: 100px; -webkit-transition: background .2s ease-in-out; transition: background .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 2; } .dashboard-stats-cover { background-position: center; background-size: cover; height: 100px; width: 100px; margin-top: 25px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -webkit-transition: background .2s ease-in-out; transition: background .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; z-index: 3; } .dashboard-stats-circle { background-position: center; background-size: cover; height: 100px; width: 100px; margin-top: 25px; margin-right: 5px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -webkit-flex-shrink: 0; flex-shrink: 0; -webkit-transition: background .2s ease-in-out; transition: background .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 350%; overflow: hidden; } .dashboard-stats-square { background-position: center; background-size: cover; height: 100px; width: 100px; margin-top: 25px; margin-right: 5px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -webkit-flex-shrink: 0; flex-shrink: 0; -webkit-transition: background .2s ease-in-out; transition: background .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; overflow: hidden; } .dashboard-stats-flat { background-position: center; background-size: cover; height: 100px; width: 100px; margin-top: 25px; margin-right: 5px; -webkit-flex-shrink: 0; flex-shrink: 0; -webkit-transition: background .2s ease-in-out; transition: background .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; overflow: hidden; } .dashboard-stats-info-container { display: -webkit-flex; display: flex; flex-direction: column; height: 150px; width: 385px; overflow: hidden; } .dashboard-stats-info-title { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: baseline; height: 30px; width: 100%; padding: 5px 5px 5px 10px; line-height: 20px; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,.1); -webkit-flex-grow: 1; flex-grow: 1; z-index: 1; } .dashboard-stats-info-title h4 { margin: 0; font-size: 15px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; -webkit-flex-grow: 1; flex-grow: 1; } .dashboard-stats-info-title .dashboard-stats-stats-units { color: #aaa; font-size: 12px; text-align: right; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .dashboard-stats-info-scroller { height: 120px; width: 100%; -webkit-flex-grow: 1; flex-grow: 1; z-index: 1; } .dashboard-stats-info-scroller.scrollbar-macosx > .scroll-element.scroll-y { left: 10px; } .dashboard-stats-info-scroller.scrollbar-macosx > .scroll-element .scroll-bar { background-color: #999; } .dashboard-stats-info { width: 100%; font-size: 12px; padding: 3px 0 0 15px; position: relative; } .dashboard-stats-info-list { margin-bottom: 20px; padding-right: 0; } .dashboard-stats-info-list:last-of-type { margin-bottom: 0; } .dashboard-stats-info-item { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: baseline; width: 100%; padding: 2.5px 5px; line-height: 14px; border-bottom: 1px solid rgba(255,255,255,0.05); cursor: default; } .dashboard-stats-info-item:last-of-type { margin-bottom: 0; } .dashboard-stats-info-item .sub-list { height: 100%; width: 15px; color: #aaa; font-size: 10px; text-align: left; text-transform: uppercase; -webkit-flex-shrink: 0; flex-shrink: 0; } .dashboard-stats-info-item .sub-value { height: 100%; font-size: 12px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -webkit-flex-grow: 1; flex-grow: 1; } .dashboard-stats-info-item .sub-count { height: 100%; margin-left: 5px; color: #f9be03; font-size: 12px; text-align: right; white-space: nowrap; overflow: hidden; -webkit-flex-shrink: 0; flex-shrink: 0; } .dashboard-stats-info-item .sub-divider { height: 100%; margin-left: 5px; color: #aaa; font-size: 12px; text-align: left; text-transform: uppercase; -webkit-flex-shrink: 0; flex-shrink: 0; } .dashboard-stats-info-item.expanded { padding: 5px 5px; line-height: 20px; } .dashboard-stats-info-item.expanded .sub-heading { font-size: 13px; } .dashboard-stats-info-item.expanded .sub-value { font-size: 16px; } .dashboard-stats-info-item.expanded .sub-count { font-size: 16px; } .dashboard-stats-info-item.expanded .sub-divider { font-size: 16px; } .dashboard-stats-info-item:hover { background-color: rgba(255,255,255,0.05); } a:hover .dashboard-stats-poster, a:hover .dashboard-stats-cover, a:hover .dashboard-stats-circle, a:hover .dashboard-stats-square { -webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .dashboard-recent-media-row { width: 100%; margin: 0 auto; text-align: center; position: relative; z-index: 0; overflow: hidden; } .dashboard-recent-media { width: 100%; margin: auto; list-style: none; } .dashboard-recent-media li { float: left; position: relative; left: 0px; margin-right: 25px; margin-bottom: 25px; } .dashboard-recent-media-poster { position: relative; float: left; } .dashboard-recent-media-cover { position: relative; margin-top: 75px; float: left; } a:hover .dashboard-recent-media-poster, a:hover .dashboard-recent-media-cover { webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .dashboard-recent-media-poster-face { background-position: center; background-size: cover; height: 225px; width: 150px; position: relative; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); z-index: -2; } .dashboard-recent-media-cover-face { background-position: center; background-size: cover; height: 150px; width: 150px; position: relative; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); z-index: -2; } .dashboard-recent-media-overlay { position: absolute; left: 0; right: 0; bottom: 0; text-align: left; background: -moz-linear-gradient(top, rgba(0,0,0,0) 30%, rgba(0,0,0,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1))); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); height: 100%; z-index: -1; } .dashboard-recent-media-overlay-text { color: #aaa; font-size: 12px; font-weight: bold; float: left; position: absolute; left: 8px; bottom: 5px; } .dashboard-recent-media-metacontainer { width: 150px; font-size: 13px; clear: both; } .dashboard-recent-media-metacontainer h3 { padding: 5px 3px 0 3px; color: #eee; text-overflow: ellipsis; overflow: hidden; position: relative; font-size: 13px; font-weight: bold; margin: 0; line-height: 16px; width: 150px; white-space: nowrap; text-align: left; clear: both; } .dashboard-recent-media-metacontainer h3.text-muted { color: #777; } .dashboard-recent-media-metacontainer h3.text-muted a { color: #777; } .dashboard-recent-media-metacontainer h3.text-muted a:hover { color: #e9a049; } .art-face { background-repeat: no-repeat; background-position: center center; background-attachment: scroll; background-size: cover; opacity: 0; position: fixed; top: 0; bottom: 0; width: 100%; } .art-music-face { background-repeat: no-repeat; background-position: center; background-size: cover; width: 250px; position: relative; top: 0; bottom: 0; } .summary-container { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; } .summary-container .table-card-header, .summary-container .table-card-back { background: rgba(40,40,40, 0.9); } .summary-navbar { background-color: rgba(255,255,255,.03); height: 50px; line-height: 50px; max-height: 50px; overflow: hidden; } .summary-navbar-list { padding: 0 25px; color: #999; white-space: nowrap; overflow: hidden; } .summary-navbar-list .breadcrumb { padding: 0; margin: 0; background: none; } .summary-navbar-list .breadcrumb > .breadcrumb-arrow { color: #444; padding: 0 15px; } .summary-navbar-list .breadcrumb > .active { color: #eee; } .summary-navbar-list .breadcrumb a { color: #999; } .summary-navbar-list .breadcrumb a:hover { color: #f9be03; } .summary-content-title-wrapper { height: 150px; padding-top: 50px; } .summary-content-title { overflow: hidden; position: relative; max-height: 100px; } .summary-content-title h1 { margin-top: 0; margin-bottom: 10px; color: #f9be03; font-size: 28px; line-height: 40px; float: left; clear: left; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 100%; } .summary-content-title h1 a { color: #f9be03; } .summary-content-title h1 a:hover { color: #eee; } .summary-content-title h2 { margin-top: 0; margin-bottom: 10px; color: #eee; font-size: 28px; line-height: 40px; float: left; clear: left; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 100%; } .summary-content-title h3 { margin-top: 0; margin-bottom: 10px; color: #999; font-size: 28px; line-height: 40px; position: absolute; bottom: 0; right: 0; } .summary-content-title h3 a:hover { text-decoration: underline; } .summary-content-title h3 a { color: #999; } .summary-content-wrapper { background: rgba(0,0,0,.4); background: -webkit-linear-gradient(top, rgba(0,0,0,.4), rgba(10,10,10,.4)); background: -o-linear-gradient(bottom, rgba(0,0,0,.4), rgba(10,10,10,.4)); background: -moz-linear-gradient(bottom, rgba(0,0,0,.4), rgba(10,10,10,.4)); background: linear-gradient(to bottom, rgba(0,0,0,.4), rgba(10,10,10,.4)); background-clip: content-box; min-height: calc(100% - 200px); position: inherit; width: 100%; } .summary-content-poster { float: left; width: 250px; margin: 0 40px 0 25px; height: 100px; overflow: visible; position: relative; } .summary-poster-face { background-position: center; background-size: cover; height: 375px; width: 250px; position: relative; webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; z-index: 1; } .summary-poster-face-episode { background-position: center; background-size: cover; height: 140px; width: 250px; position: relative; webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; z-index: 1; } .summary-poster-face-track { background-position: center; background-size: cover; height: 250px; width: 250px; position: relative; webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; z-index: 1; } .summary-poster-face-overlay { position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-image: -webkit-gradient(linear,left 0,left 100%,from(rgba(0,0,0,.7)),to(rgba(0,0,0,.9))); background-image: -webkit-linear-gradient(top,rgba(0,0,0,.7) 0,rgba(0,0,0,.9) 100%); background-image: -moz-linear-gradient(top,rgba(0,0,0,.7) 0,rgba(0,0,0,.9) 100%); background-image: linear-gradient(to bottom,rgba(0,0,0,.7) 0,rgba(0,0,0,.9) 100%); background-repeat: repeat-x; webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; opacity: 0; transition: opacity .2s; z-index: 2; } .summary-poster-face-overlay span { display: block; width: 100%; height: 100%; background-image: url(../images/plex-logo-light.svg); background-size: 100px; background-repeat: no-repeat; background-position: center; opacity: 0; transition: opacity .3s; } .summary-poster-face-overlay span:before { content: "View On"; color: #999; font-size: 13px; font-weight: bold; text-transform: uppercase; text-align: center; display: block; position: absolute; top: calc(50% - 34px); width: 100%; } a:hover .summary-poster-face .summary-poster-face-overlay, a:hover .summary-poster-face-episode .summary-poster-face-overlay, a:hover .summary-poster-face-track .summary-poster-face-overlay, a:hover .summary-poster-face .summary-poster-face-overlay span, a:hover .summary-poster-face-episode .summary-poster-face-overlay span, a:hover .summary-poster-face-track .summary-poster-face-overlay span { opacity: 1; } .summary-content-padding { float: left; width: 250px; height: 1px; margin: 0 40px 20px 25px; position: relative; } .summary-content { position: relative; color: #999; overflow: hidden; padding-right: 10px; margin-bottom: 20px; } .summary-content-details-wrapper { width: 100%; padding: 10px 0 15px 0; position: relative; float: left; } .summary-content-details-tag { float: left; line-height: 24px; } .summary-content-details-tag strong { color: #eee; margin-left: 2px; margin-right: 10px; } .summary-content-media-info-wrapper { width: 100%; position: absolute; bottom: 0; left: 0; text-align: center; } .summary-content-media-flag { width: auto; height: auto; max-width: 75pt; max-height: 15px; margin: 0 5px; } .summary-content-summary { overflow: hidden; color: #eee; float: left; position: relative; clear: both; height: auto; max-height: 160px; padding-bottom: 0px; } .summary-content-people-wrapper { margin-right: 20px; float: left; } .summary-content-people-wrapper hidden-phone hidden-tablet { overflow: hidden; height: auto; min-height: 0px; } .summary-content-actors { margin-top: 13px; font-size: 12px; line-height: 18px; color: #999; overflow: hidden; } .summary-content-actors ul { padding-left:20px; margin-bottom: 0; } .summary-content-actors li { list-style: none; list-style-image: none; display: block; font-size: 12px; line-height: 18px; color: #eee; } .summary-content-genres { margin-top: 13px; font-size: 12px; line-height: 18px; color: #999; overflow: hidden; } .summary-content-genres ul { padding-left:20px; margin-bottom: 0; } .summary-content-genres li { list-style: none; list-style-image: none; display: block; font-size: 12px; line-height: 18px; color: #eee; } .summary-content-writers { margin-top: 13px; font-size: 12px; line-height: 18px; color: #999; overflow: hidden; } .summary-content-writers ul { padding-left: 20px; margin-bottom: 0; } .summary-content-writers li { list-style: none; list-style-image: none; display: block; font-size: 12px; line-height: 18px; color: #eee; } .star-rating { display: inline-block; font-size: 15px; overflow: hidden; white-space: nowrap; margin-top: 3px; height: 21px; float: right; } .star-rating .star-icon { width: auto; margin-left: 2px; color: #f9be03; } .star-rating .star-icon-o { width: auto; margin-left: 2px; color: #999; } .critic-rating { display: inline-block; font-size: 14px; overflow: hidden; white-space: nowrap; margin-top: 2px; height: 20px; line-height: 20px; float: right; } .children-list, .search-results-list { position: relative; z-index: 0; } .item-children-wrapper { } .item-children-section-title { position: relative; padding: 10px; background-color: #2c2c2c; border-bottom: 1px solid #3d3d3d; border-top: 1px solid #282828; height: 50px; line-height: 22px; padding: 13px 20px; margin: 20px 0; } .item-children-section-title h4 { position: relative; margin: 0; line-height: 22px; color: #eee; font-size: 16px; text-align: center; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .item-children-instance { list-style: none; margin: 0; overflow: auto; } .item-children-instance.max-height { max-height: 700px; } .item-children-instance li { float: left; position: relative; left: 0px; margin-right: 25px; margin-bottom: 25px; } .item-children-instance li.item-children-list-item { width: 100%; height: 35px; margin-right: 0; margin-bottom: 0; } .item-children-poster { float: left; position: relative; left: 0px; } a:hover .item-children-poster { webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .item-children-poster-face { background-position: center; background-size: cover; position: relative; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); z-index: -2; } .item-children-poster-face.poster-item { width: 150px; height: 225px; } .item-children-poster-face.episode-item { width: 250px; height: 140px; } .item-children-poster-face.cover-item { width: 150px; height: 150px; } .item-children-card-overlay { position: absolute; left: 0; right: 0; bottom: 0; text-align: left; background: -moz-linear-gradient(top, rgba(0,0,0,0) 30%, rgba(0,0,0,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1))); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 30%,rgba(0,0,0,1) 100%); height: 100%; z-index: -1; } .item-children-overlay-text { color: #aaa; font-size: 12px; font-weight: bold; float: left; position: absolute; left: 8px; bottom: 5px; } .item-children-instance-text-wrapper { font-size: 13px; margin-bottom: 20px; clear: both; } .item-children-instance-text-wrapper.poster-item, .item-children-instance-text-wrapper.cover-item { width: 150px; } .item-children-instance-text-wrapper.episode-item { width: 250px; } .item-children-instance-text-wrapper h3 { width: 100%; padding: 5px 3px 0 3px; color: #eee; text-overflow: ellipsis; overflow: hidden; position: relative; font-size: 13px; font-weight: bold; margin: 0; line-height: 16px; white-space: nowrap; text-align: left; clear: both; } .item-children-instance-text-wrapper h3.text-muted { color: #777; } .item-children-instance-text-wrapper h3.text-muted a { color: #777; } .item-children-instance-text-wrapper h3.text-muted a:hover { color: #e9a049; } .item-children-list-item-odd { border-top: 0px solid #343434; border-bottom: 0px solid #343434; background-color: rgba(255,255,255,0.010); height: 100%; font-size: 13px; padding-top: 10px; } .item-children-list-item-even { border-top: 0px solid #343434; border-bottom: 0px solid #343434; background-color: rgba(255,255,255,0.035); height: 100%; font-size: 13px; padding-top: 10px; } .item-children-list-item-odd:hover, .item-children-list-item-even:hover { background-color: rgba(255,255,255,0.075); } .item-children-list-item-index { float: left; color: #777; text-align: right; display: inline-block; width: 35px; margin-right: 10px; } .item-children-list-item-title { display: inline-block; width: calc(100% - 125px); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .item-children-list-item-duration { float: right; color: #777; text-align: right; display: inline-block; width: 60px; margin-right: 20px; } .nav-list { float: left; list-style: none; padding: 0; } .nav-list.nav-pills > li > a { margin-bottom: 0; } #new_title h3 { color: #E5A00D; font-size: 14px; line-height: 1.42857143; font-weight: bold; margin: 0; } .settings-alert { float: left; padding: 0; margin: 5px 0; border: 0; position: relative; } .settings-alert ul { padding: 0; } .settings-alert ul li { list-style: none; padding: 5px 12px; margin: 0; border: 1px solid #ebccd1; border-radius: 4px; } .settings-alert ul li:before { content: "\f071"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 5px; } .settings-warning { color: #eb8600; } span.settings-warning { padding-left: 10px; } #menu_link_show_advanced_settings.active { color: #eee; background-color: #cc7b19; } .advanced-setting { display: none; } div.advanced-setting { border-left: 1px solid #cc7b19; padding-left: 10px; } li.advanced-setting { border-left: 1px solid #cc7b19; } .setting-message { color: #cc7b19; margin-left: 10px; } .user-info-wrapper { } .user-info-poster-face { float: left; margin: 15px 15px 15px 0; background-size: cover; background-position: center; height: 80px; width: 80px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .user-info-username { font-size: 24px; color: #eee; padding-top: 15px; padding-left: 105px; } .user-info-nav { margin-top: 15px; padding-left: 105px; } .nav-tabs > .active > a:hover, .nav-tabs > .active > a:focus { color: #e9a049; } .user-overview-stats-wrapper { } .user-overview-stats-wrapper ul { list-style: none; padding: 0; margin: 0px 0px 0px 0px; } .user-overview-stats-instance { float: left; width: 400px; height: 80px; margin-bottom: 25px; } .user-overview-stats-instance-device_icon { float: left; padding-right: 15px; } .user-overview-stats-instance-device_icon img{ } .user-overview-stats-instance li { float: left; list-style: none; width: 100%; height: 90px; } .user-overview-stats-instance-text { position: relative; top: 0px; left: 0px; } .user-overview-stats-instance p { color: #aaa; font-size: 12px; float: left; position: relative; top: 15px; left: 0px; } .user-overview-stats-instance h3 strong{ color: #eee; } .user-overview-stats-instance h3 { font-size: 30px; font-weight: bold; color: #f9be03; line-height: 22px; position: relative; top: 5px; margin: 0 5px 0 10px; float: left; } .user-overview-stats-instance h4 { color: #eee; margin-bottom: 25px; } .user-overview-stats-instance h1 { font-size: 54px; font-weight: normal; float: left; color: #333; color: rgba(255,255,255,0.05); text-shadow: none; position: relative; top: 3px; left: 3px; } .user-player ul { list-style: none; margin: 0; } .user-player-instance { float: left; width: 240px; height: 80px; margin-bottom: 25px; } .user-player-instance li { } .user-player-instance-box { float: left; border-radius: 3px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); background-size: contain; position: relative; height: 80px; width: 80px; } .user-player-instance-name { float: left; padding-top: 14px; color: #eee; text-overflow: ellipsis; overflow: hidden; position: relative; font-size: 14px; line-height: 16px; font-weight: normal; width: 140px; margin-left: 10px; margin-bottom: 10px; white-space: nowrap; } .user-player-instance-playcount h3 { font-size: 30px; font-weight: bold; color: #f9be03; line-height: 22px; position: relative; top: 5px; margin: 0 5px 0 10px; float: left; } .user-player-instance-playcount p { color: #aaa; font-size: 12px; float: left; position: relative; top: 15px; left: 0px; } .library-info-poster-face { float: left; margin: 15px 15px 15px 0; background-size: cover; background-position: center; height: 80px; width: 80px; /*-webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);*/ } .library-user-instance-box { float: left; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); background-size: contain; position: relative; height: 80px; width: 80px; } a .library-user-instance-box:hover { -webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .home-padded-header { margin: 25px 0; height: 34px; } .home-padded-header h3 { margin-top: 9px; width: 175px; } .home-padded-header .button-bar { float: left; } .home-platforms { } .home-platforms ul, .library-platforms ul { list-style: none; margin: 0; } .home-platforms-instance { position: relative; float: left; width: 340px; padding: 5px; margin-right: 20px; margin-bottom: 20px; -webkit-box-sizing: content-box; box-sizing: content-box; white-space: nowrap; } .home-platforms-instance-overlay { height: 130px; width: 100%; padding: 5px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); z-index: 0; } .home-platforms-instance-background { background-color: #282828; background-position: center; background-size: cover; height: 130px; width: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0.15; -webkit-filter: blur(3px); -moz-filter: blur(3px); filter: blur(3px); -webkit-transition: background 1s linear; transition: background 1s linear; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: -1; } .home-platforms-instance li { position: relative; } .home-platforms-instance-info { float: left; position: relative; padding-left: 80px; width: 100%; height: 120px; overflow: hidden; } .home-platforms-instance-name { color: #eee; text-overflow: ellipsis; overflow: hidden; position: relative; font-size: 14px; line-height: 16px; font-weight: bold; width: 100%; padding: 0 0 0 20px; } .home-platforms-instance-name h4 { margin: 10px 0 4px 0; } .home-platforms-instance-playcount { display: inline-block; position: relative; padding: 6px 0 0 20px; max-width: 100%; } .home-platforms-instance-playcount h4 { font-size: 14px; line-height: 16px; margin: 10px 0 10px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-platforms-instance-playcount h3 { font-size: 30px; font-weight: bold; color: #f9be03; line-height: 22px; position: relative; top: 5px; margin: 0 5px 0 0; float: left; } .home-platforms-instance-playcount p { color: #aaa; font-size: 12px; float: left; position: relative; top: 15px; left: 0px; margin-right: 5px; } .home-platforms-instance-last-user { float: left; position: relative; padding: 6px 0 0 20px; width: 100%; } .home-platforms-instance-last-user h4 { font-size: 14px; line-height: 16px; margin: 10px 0 10px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-platforms-instance-last-user h5 { font-size: 12px; position: relative; margin: 0 0 2px 0; float: left; } .home-platforms-instance-last-user p { color: #aaa; font-size: 12px; float: left; clear: left; position: relative; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-platforms-instance-poster { margin-left: 0px; position: absolute; overflow: hidden; } .home-platforms-instance-cover { margin-left: 0px; position: absolute; top: 20px; overflow: hidden; } .home-platforms-instance-poster .home-platforms-poster-face { background-position: center; background-size: cover; height: 120px; width: 80px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .home-platforms-instance-cover .home-platforms-cover-face { background-position: center; background-size: cover; height: 80px; width: 80px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .home-platforms-instance-poster .home-platforms-library-thumb { background-position: center; background-size: cover; height: 80px; width: 80px; margin-top: 20px; } .home-platforms-instance-box { background-position: center; background-size: cover; margin: 20px 0 0 0px; height: 80px; width: 80px; position: relative; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; } .home-platforms-instance-oval { background-position: center; background-size: cover; margin: 20px 0 0 0px; height: 80px; width: 80px; position: relative; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; } .home-platforms-instance-list { float: left; position: relative; width: 100%; padding: 0 10px 25px 10px; } .home-platforms-instance-list li { margin-top: 25px; position: relative; height: 60px; } .home-platforms-instance-list-number { background-color: #f9be03; float: left; position: absolute; top: -10px; left: 10px; height: 20px; width: 20px; display: block; text-align: center; padding-top: 1px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .home-platforms-instance-list-number h4 { color: #000; font-size: 15px; font-weight: bold; margin: 0; } .home-platforms-instance-list-info { float: left; position: relative; padding-left: 75px; width: 100%; height: 60px; } .home-platforms-instance-list-name { float: left; color: #eee; text-overflow: ellipsis; overflow: hidden; position: relative; font-size: 13px; line-height: 15px; font-weight: bold; width: 100%; padding: 2px 0 0 10px; } .home-platforms-instance-list-name h5 { margin: 5px 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-platforms-instance-list-playcount { float: left; position: relative; padding: 4px 0 0 10px; width: 100%; } .home-platforms-instance-list-playcount h3 { font-size: 20px; font-weight: bold; color: #f9be03; line-height: 22px; position: relative; margin: 0 5px 0 0; float: left; } .home-platforms-instance-list-playcount p { color: #aaa; font-size: 12px; float: left; position: relative; top: 5px; left: 0px; margin-right: 5px; } .home-platforms-instance-list-last-user { float: left; position: relative; padding: 0 0 0 10px; width: 100%; } .home-platforms-instance-list-last-user h5 { font-size: 12px; position: relative; margin: 0 0 2px 0; float: left; } .home-platforms-instance-list-last-user p { color: #aaa; font-size: 12px; float: left; clear: left; position: relative; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-platforms-instance-list-poster { position: absolute; left: 20px; overflow: hidden; } .home-platforms-instance-list-cover { position: absolute; top: 10px; left: 20px; overflow: hidden; } .home-platforms-instance-list-poster .home-platforms-list-poster-face { background-position: center; background-size: cover; height: 60px; width: 40px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .home-platforms-instance-list-cover .home-platforms-list-cover-face { background-position: center; background-size: cover; height: 40px; width: 40px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .home-platforms-instance-list-box { background-position: center; background-size: cover; margin: 10px 0 0 20px; height: 40px; width: 40px; position: relative; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; } .home-platforms-instance-list-oval { background-position: center; background-size: cover; margin: 10px 0 0 20px; height: 40px; width: 40px; position: relative; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; } .home-platforms-instance-list-chevron { position: absolute; top: 100px; right: 5px; cursor: pointer; } .home-platforms-instance-list-chevron i { color: #999; font-size: 16px; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .home-platforms-instance-list-chevron i:hover { color: #f9be03; } .home-platforms-instance-list-chevron.active i.fa-chevron-down{ color: #f9be03; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } a .home-platforms-instance-box:hover, a .home-platforms-instance-oval:hover, a .home-platforms-instance-list-box:hover, a .home-platforms-instance-list-oval:hover, a .home-platforms-poster-face:hover, a .home-platforms-cover-face:hover, a .home-platforms-list-poster-face:hover, a .home-platforms-list-cover-face:hover { -webkit-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049; } .home-platforms-instance .slider { background-color: #2d2d2d; width: calc(100% + 20px); display: none; position: absolute; top: 124px; left: -5px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.1); z-index: 1; clip: rect(1px, 350px, 1000px, -2px); } .history-table-title { text-overflow: ellipsis; overflow: hidden; max-width: 350px; } .graphs-instance { height: 330px; padding: 20px; background-color: #333; margin-bottom: 20px; border-radius: 8px; } .watch-chart { margin-top: 10px; height: 300px; width: 100%; } .graphs-load { color: #999999; text-align: center; line-height: 300px; } .card-back { padding: 16px; background-color: #282828; margin-left: auto; margin-right: auto; margin-top: 20px; margin-bottom: 20px; width: 80%; overflow: hidden; } .card-back-full { padding: 20px; background-color: #282828; margin-top: 20px; margin-bottom: 20px; overflow: hidden; } .table-card-back { padding: 16px 16px 16px 16px; background-color: #282828; margin-left: auto; margin-right: auto; margin-top: 20px; margin-bottom: 20px; width: 100%; max-width: 1750px; overflow: hidden; } .table-card-header { padding: 16px 16px 16px 16px; background-color: #2c2c2c; border-bottom: 1px solid #3d3d3d; border-top: 1px solid #282828; margin-left: auto; margin-right: auto; margin-top: 20px; margin-bottom: -20px; width: 100%; max-width: 1750px; overflow: hidden; } .table-card-back td { font-size: 12px; } .header-bar { float: left; } .header-bar span { font-size: 22px; font-weight: bold; line-height: 34px; } .button-bar { float: right; } .colvis-button-bar, .refresh-users-button, .refresh-libraries-button { /*float: right;*/ } .refresh-users-button, .refresh-libraries-button { /*margin-right: 5px;*/ } .nav-settings, .nav-settings ul { margin: 0px 0px 20px 0px; } .nav-settings > li { list-style: none; background-color: #282828; width: 100%; max-width: 340px; min-width: 200px; border-top: 1px solid #2d2d2d; } .nav-settings > li > a { border-bottom: 1px solid #232323; display: block; padding: 15px 15px 15px 15px; color: #999; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .nav-settings > li > a:hover, .nav-settings > li > a:focus { color: #eee; background-color: #2f2f2f; } .nav-settings > .active > a, .nav-settings > .active > a:hover, .nav-settings > .active > a:focus { color: #f9be03; background-color: #2f2f2f; } .stacked-configs, .stacked-configs ul { margin: 0px 0px 20px 0px; } .stacked-configs > li { margin: 0; list-style: none; background-color: #282828; width: 100%; min-width: 320px; max-width: 900px; } .stacked-configs > li > span { display: block; padding: 8px 20px 8px 15px; color: #eee; border-left: 2px solid #444; border-top: 1px solid #2d2d2d; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .stacked-configs > li > span:hover, .stacked-configs > li > span:focus { color: #eee; background-color: #2f2f2f; } .stacked-configs > li > span > a.toggle-right, .stacked-configs > li > span > span.toggle-right { float: right; color: #999; padding-left: 10px; } .stacked-configs > li > span > a.toggle-left, .stacked-configs > li > span > span.toggle-left { float: left; color: #444; padding-right: 8px; } .stacked-configs > li > span > a:hover { color: #eee; } .stacked-configs > li > span > a.active, .stacked-configs > li > span > span.active { color: #f9be03; } .stacked-configs > li.mobile-device > span > a.toggle-left, .stacked-configs > li.mobile-device > span > span.toggle-left { color: #999; } .accordion { width: 100%; max-width: 900px; margin: 0px 0px 20px 0px; background: #282828; list-style: none; } .accordion li { margin: 0; } .accordion li .link { cursor: pointer; display: block; padding: 8px 12px 8px 12px; color: #999; border-bottom: 1px solid #2d2d2d; position: relative; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .accordion li .link:hover, .accordion li .link:hover i.fa { background: #2f2f2f; } .accordion li .link i.fa { color: #999; } .accordion li .link span.toggle-left { padding-right: 5px; } .accordion li .link span.toggle-right { float: right; padding-left: 10px; } .accordion li:last-child .link { border-bottom: 0; } .accordion li .fa-chevron-down { color: #999; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .accordion li.open .link, .accordion li.open .link i.fa { color: #f9be03; } .accordion li.open .fa-chevron-down { color: #f9be03; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .submenu { display: none; background: #2d2d2d; list-style: none; margin: 0px; padding: 20px; } .submenu li { border-bottom: 1px solid #2f2f2f; } .submenu a { display: block; text-decoration: none; color: #d9d9d9; padding: 12px; -webkit-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; } .submenu a:hover { background: #f9be03; color: #eee; } .ajaxMsg { background-color: rgba(255,255,255,0.075); color: #999999; display: none; font-size: 14px; right: 10px; padding: 10px 10px; position: fixed; text-align: center; bottom: 10px; min-height: 32px; width: 400px; z-index: 9999; } .ajaxMsg .msg { line-height: normal; padding-left: 20px; } .ajaxMsg .loader { position: relative; top: 2px; } .ajaxMsg .success { text-align: left; } .ajaxMsg .error { background-color: rgba(255,0,0,0.5); font-size: 20px; text-align: left; } .ajaxMsg .ui-icon { display: inline-block; margin-left: -20px; top: 2px; position: relative; margin-right: 3px; } .dataTables_processing { background-color: grey; display: none; font-size: 14px; right: 10px; padding: 10px 10px; position: fixed; text-align: center; bottom: 10px; min-height: 32px; width: 250px; z-index: 9999; } .dataTables_paginate li { margin: 0; } div.dataTables_info { white-space: normal !important; } .tooltip.top .tooltip-arrow { border-top-color: #eee; } .tooltip.right .tooltip-arrow { border-right-color: #eee; } .tooltip.bottom .tooltip-arrow { border-bottom-color: #eee; } .tooltip.left .tooltip-arrow { border-left-color: #eee; } .tooltip-inner { max-width: 250px; color: #000; background: #eee; border: 0; font-weight: bold; border-radius: 2px; } .inactive-library-tooltip, .inactive-user-tooltip { display: inline-block; position: relative; width: 100%; height: 100%; } .inactive-library-tooltip i.fa, .inactive-user-tooltip i.fa { color: #E5A00D; position: absolute; right: 0; bottom: 0; text-shadow: 0 0 2px rgba(0,0,0,.5); } .history-thumbnail-popover { z-index: 2000; padding: 0; border: 0; } .history-thumbnail-popover.popover.left { margin-left: -15px; } .history-thumbnail-popover.popover.right { margin-left: 15px; } .history-thumbnail-popover .popover-content { color: #000; padding: 0; } .history-thumbnail { background-position: center; background-size: cover; width: 80px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); -moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1); } .channel-thumbnail-popover { z-index: 2000; padding: 0; border: 0; } .channel-thumbnail-popover.popover.left { margin-left: -15px; } .channel-thumbnail-popover.popover.right { margin-left: 15px; } .channel-thumbnail-popover .popover-content { color: #000; padding: 0; } .channel-thumbnail { background-color: #868b8b; background-position: center; background-size: contain; background-origin: content-box; background-repeat: no-repeat; height: 50px; width: 50px; padding: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .channel-thumbnail-popover .arrow:after { border-right-color: #868b8b !important; } .edit-user-toggles, .edit-library-toggles { padding-right: 10px; } .edit-user-toggles > input[type='checkbox'], .edit-library-toggles > input[type='checkbox'] { display: none; } .edit-user-toggles > input[type='checkbox'] + label, .edit-library-toggles > input[type='checkbox'] + label { color: #444; cursor: pointer; } .edit-user-toggles > input[type='checkbox']:checked + label, .edit-library-toggles > input[type='checkbox']:checked + label { color: #eee; cursor: pointer; } .edit-user-name > input[type='text'] { margin: 0; } .noTransition { -moz-transition: none !important; -webkit-transition: none !important; -o-transition: none !important; transition: none !important; } #users-to-delete > li, #users-to-purge > li, #libraries-to-delete > li, #libraries-to-purge > li { color: #e9a049; } #updatebar { background-color: #444; opacity: 0.95; color: #999999; font-size: 14px; right: 10px; padding: 10px 10px; position: fixed; text-align: center; bottom: 10px; min-height: 22px; width: 400px; z-index: 9999; display: block; } #updatebar .msg { line-height: normal; padding-left: 20px; } #updatebar .loader { position: relative; top: 2px; } #updatebar.success { padding: 15px 10px; text-align: left; } #updatebar.error { padding: 15px 10px; text-align: left; } #updatebar .ui-icon { display: inline-block; margin-left: -20px; top: 2px; position: relative; margin-right: 3px; } #updatebar a:hover { color: #e9a049; } .body-container { position: absolute; top: 50px; right: 0; bottom: 0; left: 0; overflow: auto; -webkit-overflow-scrolling: touch; } ::-webkit-scrollbar { width: 15px; } ::-webkit-scrollbar-track { background-color: rgba(0,0,0,.2); } ::-webkit-scrollbar-thumb { min-height: 50px; background-color: rgba(255,255,255,.15); border: 3px solid transparent; border-radius: 8px; background-clip: padding-box; } pre::-webkit-scrollbar-track { background-color: rgba(255,255,255,.2); } pre::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.15); } #currentActivity, #home-stats, #library-stats { margin-left: -25px; } #currentActivity > *, #home-stats > *, #library-stats > * { margin-left: 25px; } @media only screen and (min-width: 300px) and (max-width: 450px) { .home-platforms-instance { width: calc(100% - 20px); } .dashboard-activity-instance, .dashboard-stats-instance { width: 100%; } #currentActivity, #home-stats, #library-stats { margin-right: 25px; } } @media only screen and (min-width: 300px) and (max-width: 740px) { .header-bar { display: block; float: none !important; } .button-bar { float: left !important; clear: both; margin-top: 15px; } .button-bar > div, .button-bar > button, .button-bar > span { float: left !important; clear: both !important; margin-bottom: 10px; } .button-bar > div > button.btn { float: left !important; clear: both !important; } .home-padded-header .button-bar { margin-top: 10px; margin-bottom: 15px; } } @media only screen and (min-width: 740px) and (max-width: 1024px) { .button-bar { float: right !important; } .button-bar > div > button.btn { float: left !important; clear: both !important; } .home-padded-header .button-bar { float: left !important; } } #search_form { width: 270px; padding: 8px 15px; } #search_form span.input-textbox { overflow: hidden; width: 200px; height: 34px; display: inline-flex; float: right; } #search_form #query { width: 0; height: 34px; margin-top: 0; float: right; position: relative; right: -200px; border-radius: 3px 0 0 3px; } #search_form #query.active { width: 200px; right: 0px; } #search_form #search_button.btn-inactive { background-color: #000; border: 1px solid rgba(0,0,0,0); -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -ms-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s; } #update_search_form div.input-group { display: inline-table; vertical-align: middle; max-width: 250px; } #update_search_form #update_query { margin: 5px 0 0 0.5em; } .notification-params { width: 100%; margin-top: 10px; background-color: #282828; } .notification-params th { padding-left: 10px; height: 30px; } .notification-params td { height: 25px; } .notification-params td:first-child { padding-left: 10px; width: 250px; } .notification-params.time-options td:first-child { padding-left: 10px; width: 125px; } .notification-params.time-options td:nth-child(2) { padding-left: 10px; width: 275px; } .notification-params td:not(:first-child) { padding-right: 10px; } .notification-params tr:nth-child(odd) td { background-color: rgba(255,255,255,0.035); } .notification-params tr:nth-child(even) td { background-color: rgba(255,255,255,0.010); } .activity-queue { width: 100%; margin-top: 10px; background-color: #282828; } .activity-queue th { padding-left: 10px; height: 30px; } .activity-queue th:first-child { width: 268px; } .activity-queue th:nth-child(2) { width: 125px; } .activity-queue th:nth-child(3) { width: 175px; } .activity-queue td { height: 25px; padding: 5px 10px; } .activity-queue tr:nth-child(odd) td { background-color: rgba(255,255,255,0.035); } .activity-queue tr:nth-child(even) td { background-color: rgba(255,255,255,0.010); } .card-sortable { height: 36px; padding: 0 20px 0 0; line-height: 34px; cursor: move; cursor: -webkit-grab; cursor: grab; border-bottom: 1px solid #232323; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .card { position: relative; background-color: #282828; border-top: 1px solid #2d2d2d; } .card label { font-weight: normal; } .card-handle { display: inline-block; width: 30px; margin-right: 10px; color: #444; text-align: center; background-color: #2f2f2f; } .selectize-input input[type='text'] { height: 20px; } .selectize-input.disabled, .selectize-input.disabled * { cursor: not-allowed !important; } .small-muted { font-size: small; color: #777; } .config-info-table, .config-scheduler-table { width: 100% } .config-info-table td, .config-info-table th, .config-scheduler-table td, .config-scheduler-table th { padding-bottom: 5px; } .config-info-table td:first-child { width: 150px; } .config-scheduler-table td:first-child { width: 225px; } .config-scheduler-table th { color: #eee; } a.no-highlight { color: #777; } a.no-highlight:hover { color: #eee; } .top-line { border-top: 1px dotted #777; padding-top: 5px; } .help-bold { font-weight: bold; color: #eee; } .save-button { margin-top: 15px; } .nav-dashboard > li { float: left; } .btn-gray.disabled, .btn-gray.disabled:focus, .btn-gray.disabled:hover, .btn-gray.disabled:active { color: #323232; cursor: default; } .nav-header > li > a:focus, .nav-header > li > a:hover { background-color: transparent; } #recently-added-row-scroller, #recently-watched-row-scroller { position: relative; height: 265px; margin-bottom: 25px; } @media (min-width: 768px) { .login-container { max-width: 750px; } .modal.wide .modal-dialog { width: 750px; } } @media (min-width: 992px) { .login-container { max-width: 970px; } } @media (min-width: 1200px) { .login-container { max-width: 1170px; } } .login-body-container { margin: 50px 0; } .login-container { margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; } .login { margin: 0 auto; } .login-logo { margin: 0 auto 50px auto; text-align: center; } .login-container .login-method-header { text-align: center; font-weight: 600; text-transform: uppercase; } .login-container .form-group { margin-bottom: 20px; } .login-container .form-group label { font-weight: 400; color: #999; } .login-container .form-control { height: 38px; line-height: 1.5em; } .login-container .form-footer { margin-top: 40px; } .login-container .login-button { float: right; text-transform: uppercase; text-shadow: 0 -1px 1px rgba(0,0,0,.4),0 0 15px rgba(0,0,0,.2); } .login-container .remember-group { color: #999; display: inline-block; margin-top: 7.5px; } .login-container .remember-group .control-label { display: inline; margin-bottom: 0; font-weight: 400; cursor: pointer; } .login-divider { text-align: center; border-bottom: 1px solid #555; line-height: 0.1em; margin: 50px auto; max-width: 400px; text-transform: uppercase; } .login-divider span { background: #1f1f1f; padding: 0 15px; color: #999; } .login-button-plex { text-align: center; } .login-button-plex .remember-group { margin-top: 20px; } .login-button-plex button#sign-in-plex { float: none; } .login-alert { text-align: center; padding: 8px; display: none; } #admin-login-modal .form-group label { font-weight: 400; color: #999; } #admin-login-modal .remember-group { float: left; color: #999; } #admin-login-modal .remember-group .control-label { display: inline; margin-bottom: 0; font-weight: 400; cursor: pointer; } .datatable-wrap { min-width: 150px; max-width: 250px; } .inline-pre { font-family: monospace; margin: 0 2px; padding: 2px 5px; font-size: 13px; color: #eee; background-color: #555; border: 0px solid #444; border-radius: 3px; } .overlay-refresh-image { opacity: 0; color: #000; font-size: 16px; float: left; position: absolute; top: 0px; right: 10px; z-index: 1; transition: all .1s cubic-bezier(.4,0,1,1); -webkit-transition: all .1s cubic-bezier(.4,0,1,1); -moz-transition: all .1s cubic-bezier(.4,0,1,1); -o-transition: all .1s cubic-bezier(.4,0,1,1); text-shadow: -1px -1px 0 #eee, 1px -1px 0 #eee, -1px 1px 0 #eee, 1px 1px 0 #eee; } .overlay-refresh-image.left { left: 10px; } .overlay-refresh-image.info-art { color: #999; top: 15px; right: 25px; opacity: 1; text-shadow: none; cursor: pointer; } .overlay-refresh-image.info-art:hover { color: #eee; text-shadow: none; } a:hover .overlay-refresh-image { opacity: .25; top: 8px; } a:hover .overlay-refresh-image:hover { opacity: .9; } .smart-playlist-image { float: left; position: absolute; top: 5px; left: 5px; background-color: #8e6191; border-radius: 4px; color: #fff; font-size: 16px; z-index: 1; width: 32px; padding: 5px; text-align: center; } #ip_error, #isp_error { color: #aaa; display: none; text-align: center; padding-top: 10px; padding-bottom: 10px; } #plexpy-notifiers-table .friendly_name, #notifier-config-modal span.notifier_id, #plexpy-newsletters-table .friendly_name, #newsletter-config-modal span.newsletter_id, #plexpy-mobile-devices-table .friendly_name, #mobile-device-config-modal span.notifier_id { color: #777; } #notifier-config-modal .nav-tabs, #newsletter-config-modal .nav-tabs { margin-bottom: 10px; padding-left: 15px; border-bottom: 1px solid #444; } #notifier-config-modal .nav-tabs > li, #newsletter-config-modal .nav-tabs > li { margin: 0 0 -1px 0; } #notifier-config-modal .nav-tabs > li > a, #newsletter-config-modal .nav-tabs > li > a { padding: 5px 10px; color: #737373; } #notifier-config-modal .nav-tabs > li > a:hover, #newsletter-config-modal .nav-tabs > li > a:hover { border-color: #444; background: #222; } #notifier-config-modal .nav-tabs > li.active > a, #notifier-config-modal .nav-tabs > li.active > a:hover, #notifier-config-modal .nav-tabs > li.active > a:focus, #newsletter-config-modal .nav-tabs > li.active > a, #newsletter-config-modal .nav-tabs > li.active > a:hover, #newsletter-config-modal .nav-tabs > li.active > a:focus { color: #eee; background: #222; } #notifier-config-modal .nav-tabs > li.active > a, #notifier-config-modal .nav-tabs > li.active > a:hover, #notifier-config-modal .nav-tabs > li.active > a:focus, #newsletter-config-modal .nav-tabs > li.active > a, #newsletter-config-modal .nav-tabs > li.active > a:hover, #newsletter-config-modal .nav-tabs > li.active > a:focus { border: 1px solid #444; border-bottom-color: transparent; } #newsletter-config-modal #custom_cron { display: inline-block; width: initial; height: 32px; margin-right: 5px; margin-top: 4px; } #newsletter-config-modal #cron-widget { display: inline-block; margin-top: 1px; } #newsletter-config-modal #cron-widget select.cron-select { width: initial; display: inline; height: 32px; margin-top: 4px; } #newsletter-config-modal #cron-widget select.cron-select[name=cron-period] option[value=minute], #newsletter-config-modal #cron-widget select.cron-select[name=cron-period] option[value=hour] { display: none !important; } .git-group input.form-control { width: 50%; } .git-group select.form-control { width: 50%; height: 32px; } #changelog-modal .modal-body > h2 { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #444; font-size: 18px; } #changelog-modal .modal-body > ul { padding-left: 25px; margin-bottom: 30px; } #changelog-modal ul { padding-left: 20px; } .google-play-badge { display:inline-block; height:45px; margin-top: 10px; } .google-play-badge img { border: 1px solid #3B3B3B; border-radius: 6px; box-sizing: border-box; height: 45px; vertical-align: middle; } .svg-icon { background-size: calc(100% - 20px) calc(100% - 20px) !important; background-origin: content-box !important; background-repeat: no-repeat !important; background-position: center !important; } .platform-android { background-color: #3ddc84; background-image: url(../images/platforms/android.svg); } .platform-atv { background-color: #a2aaad; background-image: url(../images/platforms/atv.svg); } .platform-chrome { background-color: #db4437; background-image: url(../images/platforms/chrome.svg); } .platform-chromecast { background-color: #4285f4; background-image: url(../images/platforms/chromecast.svg); } .platform-default { background-color: #e5a00d; background-image: url(../images/platforms/default.svg); } .platform-dlna { background-color: #4ba32f; background-image: url(../images/platforms/dlna.svg); } .platform-firefox { background-color: #ff7139; background-image: url(../images/platforms/firefox.svg); } .platform-gtv { background-color: #008bcf; background-image: url(../images/platforms/gtv.svg); } .platform-ie { background-color: #18bcef; background-image: url(../images/platforms/ie.svg); } .platform-ios { background-color: #a2aaad; background-image: url(../images/platforms/ios.svg); } .platform-kodi { background-color: #30aada; background-image: url(../images/platforms/kodi.svg); } .platform-lg { background-color: #990033; background-image: url(../images/platforms/lg.svg); } .platform-linux { background-color: #0099cc; background-image: url(../images/platforms/linux.svg); } .platform-macos { background-color: #a2aaad; background-image: url(../images/platforms/macos.svg); } .platform-msedge { background-color: #0078d7; background-image: url(../images/platforms/msedge.svg); } .platform-opera { background-color: #fa1e4e; background-image: url(../images/platforms/opera.svg); } .platform-playstation { background-color: #003087; background-image: url(../images/platforms/playstation.svg); } .platform-plex { background-color: #e5a00d; background-image: url(../images/platforms/plex.svg); } .platform-plexamp { background-color: #e5a00d; background-image: url(../images/platforms/plexamp.svg); } .platform-roku { background-color: #673293; background-image: url(../images/platforms/roku.svg); } .platform-safari { background-color: #00d3f9; background-image: url(../images/platforms/safari.svg); } .platform-samsung { background-color: #034ea2; background-image: url(../images/platforms/samsung.svg); } .platform-synclounge { background-color: #151924; background-image: url(../images/platforms/synclounge.svg); } .platform-tivo { background-color: #00a7e1; background-image: url(../images/platforms/tivo.svg); } .platform-wiiu { background-color: #03a9f4; background-image: url(../images/platforms/wiiu.svg); } .platform-windows { background-color: #0078d7; background-image: url(../images/platforms/windows.svg); } .platform-wp { background-color: #68217a; background-image: url(../images/platforms/windows.svg); } .platform-xbmc { background-color: #3b4872; background-image: url(../images/platforms/kodi.svg); } .platform-xbox { background-color: #107c10; background-image: url(../images/platforms/xbox.svg); } .platform-android-rgba { background-color: rgba(61, 220, 132, 0.40); } .platform-atv-rgba { background-color: rgba(162, 170, 173, 0.40); } .platform-chrome-rgba { background-color: rgba(219, 68, 55, 0.40); } .platform-chromecast-rgba { background-color: rgba(66, 133, 244, 0.40); } .platform-default-rgba { background-color: rgba(229, 160, 13, 0.40); } .platform-dlna-rgba { background-color: rgba(75, 163, 47, 0.40); } .platform-firefox-rgba { background-color: rgba(255, 113, 57, 0.40); } .platform-gtv-rgba { background-color: rgba(0, 139, 207, 0.40); } .platform-ie-rgba { background-color: rgba(24, 188, 239, 0.40); } .platform-ios-rgba { background-color: rgba(162, 170, 173, 0.40); } .platform-kodi-rgba { background-color: rgba(48, 170, 218, 0.40); } .platform-lg-rgba { background-color: rgba(153, 0, 51, 0.40); } .platform-linux-rgba { background-color: rgba(0, 153, 204, 0.40); } .platform-macos-rgba { background-color: rgba(162, 170, 173, 0.40); } .platform-msedge-rgba { background-color: rgba(0, 120, 215, 0.40); } .platform-opera-rgba { background-color: rgba(250, 30, 78, 0.40); } .platform-playstation-rgba { background-color: rgba(0, 48, 135, 0.40); } .platform-plex-rgba { background-color: rgba(229, 160, 13, 0.40); } .platform-plexamp-rgba { background-color: rgba(229, 160, 13, 0.40); } .platform-roku-rgba { background-color: rgba(103, 50, 147, 0.40); } .platform-safari-rgba { background-color: rgba(0, 211, 249, 0.40); } .platform-samsung-rgba { background-color: rgba(3, 78, 162, 0.40); } .platform-synclounge-rgba { background-color: rgba(21, 25, 36, 0.40); } .platform-tivo-rgba { background-color: rgba(0, 167, 225, 0.40); } .platform-wiiu-rgba { background-color: rgba(3, 169, 244, 0.40); } .platform-windows-rgba { background-color: rgba(0, 120, 215, 0.40); } .platform-wp-rgba { background-color: rgba(104, 33, 122, 0.40); } .platform-xbmc-rgba { background-color: rgba(59, 72, 114, 0.40); } .platform-xbox-rgba { background-color: rgba(16, 124, 16, 0.40); } .library-movie { background-image: url(../images/libraries/movie.svg); } .library-show { background-image: url(../images/libraries/show.svg); } .library-artist { background-image: url(../images/libraries/artist.svg); } .library-photo { background-image: url(../images/libraries/photo.svg); } .library-video { background-image: url(../images/libraries/video.svg); } .library-live { background-image: url(../images/libraries/live.svg); } .stats-most_concurrent { background-image: url(../images/icons/most-concurrent-streams.svg); } .rating-image { width: 51px; height: 20px; margin-left: 10px; display: inline-block; background-origin: content-box !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: left !important; text-align: right; } .rating-imdb { width: 62px !important; background-image: url(../images/rating/imdb.svg); } .rating-themoviedb { width: 72px !important; background-image: url(../images/rating/themoviedb.svg); background-size: auto 16px !important; } .rating-rottentomatos-ripe { background-image: url(../images/rating/tomato-ripe.svg); } .rating-rottentomatos-rotten { background-image: url(../images/rating/tomato-rotten.svg); } .rating-rottentomatos-upright { background-image: url(../images/rating/popcorn-upright.svg); } .rating-rottentomatos-spilled { background-image: url(../images/rating/popcorn-spilled.svg); } .transparent { background-color: transparent !important; } .no-image { background-image: none !important; } #info-modal .stream-info-current { color: #aaa; text-align: center; padding-bottom: 10px; } #info-modal .stream-info-item { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: baseline; width: 100%; margin-bottom: 5px; } #info-modal .stream-info-item .sub-heading { height: 100%; width: 75px; color: #aaa; font-size: 10px; text-align: right; text-transform: uppercase; line-height: 14px; -webkit-flex-shrink: 0; flex-shrink: 0; } #info-modal .stream-info-item .sub-value { color: #eee; font-weight: bold; margin-left: 10px; text-align: left; line-height: 14px; -webkit-flex-grow: 1; flex-grow: 1; } .stream-info { width: 100%; margin-top: 10px; background-color: #282828; table-layout: fixed; } .stream-info .heading { color: #E5A00D; text-transform: uppercase; font-size: 15px; font-weight: bold !important; } .stream-info th:first-child { width: 125px; height: 30px; color: #eee; font-size: 12px; text-align: right; text-transform: uppercase; } .stream-info th:not(:first-child) { text-align: center; font-weight: normal; } .stream-info td { height: 25px; } .stream-info td:first-child { color: #aaa; font-size: 10px; text-align: right; text-transform: uppercase; } .stream-info td:not(:first-child) { text-align: center; } .stream-info tr:nth-child(odd) td { background-color: rgba(255,255,255,0.035); } .stream-info tr:nth-child(even) td { background-color: rgba(255,255,255,0.010); } .number-input { margin: 0 !important; width: 55px !important; height: 34px !important; -moz-appearance: textfield; } .number-input::-webkit-inner-spin-button, .number-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .newsletter-time_frame .input-group-addon { height: 32px; width: 52px; margin-top: 5px; line-height: 1.42857143; } .newsletter-time_frame input.form-control { width: calc(50% - 37px); } .newsletter-time_frame select.form-control { width: calc(50% - 15px); height: 32px; } .newsletter-loader-container { font-family: 'Open Sans', Arial, sans-serif; position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .newsletter-loader-message { color: #282A2D; text-align: center; position: absolute; left: 50%; top: 25%; transform: translate(-50%, -50%); } .newsletter-loader { border: 5px solid #ccc; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; border-top: 5px solid #282A2D; border-radius: 50%; width: 50px; height: 50px; position: relative; left: calc(50% - 25px); } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } a[data-tab-destination] { cursor: pointer; } .modal-config-section { margin-top: 10px !important; padding-top: 10px; border-top: 1px solid #444; } .newsletter-logo { margin: 0 auto 50px auto; text-align: center; } .pointer { cursor: pointer; } .iframe-container { width: 100%; height: calc(100vh - 200px); position: relative; } .iframe-overlay { width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: url(../images/discord-overlay.png) no-repeat; background-size: cover; border: 1px solid #36393e; } .iframe-button-container { margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .iframe-button { color: #eee; border-radius: 20px; text-align: center; cursor: pointer; font-size: 15px; height: 28px; line-height: 28px; min-width: 200px; transition: box-shadow 0.3s ease; padding: 0 15px; background: rgba(114, 137, 218, 0.4); text-transform: uppercase; text-decoration: none; display: block; } .iframe-button:hover, .iframe-button:focus { color: #eee; box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px 99999px inset, rgba(0, 0, 0, 0.2) 0px 1px 5px 0px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 3px 1px -2px; } .iframe-button:active { box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 0px 99999px inset, rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px; } .iframe { width: 100%; height: 100%; position: inherit; display: block; border: 0; } .fa-blank { visibility: hidden; } #browser-warning { height: 25px; width: 100%; background: #cc7b19; text-align: center; font-weight: bold; padding: 2px 10px; position: absolute; top: 0; z-index: 9999; } .help-block li { margin-top: 0; color: #737373; } #browse-path-list > li > span > i.fa { color: #999; } #tautulli-news .open .news-title, #tautulli-news .open .news-date, #tautulli-news .accordion li.open .link i.fa { color: #eee; } .news-title, .news-date { color: #999; padding-left: 5px; } .news-subtitle { display: block; color: #aaa; font-weight: bold; margin-bottom: 10px; } .news-body { display: block; color: #aaa; } .news-body p:last-of-type { margin-bottom: 0; } .news-body a { display: inline !important; background: none !important; padding: 0 !important; color: #eee; } .news-body a:hover { color: #f9be03; } a.donate-with-crypto, a.donate-with-crypto > span { background: none; border: none; border-radius: 0; box-sizing: border-box; clear: none; clip: auto; cursor: default; display: block; float: none; height: auto; margin: 0; max-height: none; min-height: none; padding: 0; opacity: 1; text-shadow: none; vertical-align: baseline; visibility: visible; width: auto; } a.donate-with-crypto { user-select: none; user-drag: none; -webkit-user-drag: none; text-decoration: none; background: #1652f0 linear-gradient(#1652f0, #0655ab); cursor: pointer; transition: background 0.2s ease-in-out, padding 0.2s; border-radius: 6px; display: inline-block; height: 40px; padding: 9px 15px 11px 15px; position: relative; min-width: 160px; } a.donate-with-crypto:hover { background: #1652f0; } a.donate-with-crypto > span { color: white; font: normal 500 14px/20px -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', 'San Francisco', 'Roboto', 'Segoe UI', 'Helvetica Neue', 'Lucida Grande', sans-serif; letter-spacing: 0; overflow: hidden; text-align: center; text-overflow: ellipsis; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.15); white-space: nowrap; } a.donate-with-crypto::after { border-radius: 6px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2); content: ''; display: block; width: 100%; height: 100%; position: absolute; opacity: 1; top: 0; left: 0; }