a {
    color: #0F62FE;
}
body {
    background-color: #F6F6F6;
    color: #4A4A4A;
    font-family: 'Open Sans', sans-serif;
    padding-top: 7rem;
}

body, html {
    margin: 0;
    height: 100%;
}

div.darken {
    display: inline-block;
    padding: 0;
}

div.darken div.overlay-header div div div i.fa-square {
    color: #FFF !important;
}

div.darken .card-img-top {
    width: 100%;
    height: 160px;
    max-height: 180px;
    overflow: hidden;
    position: relative;
    object-fit: cover;
}

div.darken .card-img-top img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

div.darken img.card-img-top img {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.darken:hover {
    background: black;
}

div.darken:hover div.overlay-center,
div.darken:hover div.overlay-header {
    opacity: 1;
}

div.darken:hover img.card-img-top {
    opacity: 0.3;
}

div.darken:hover img.card-img-top.darken.placeholder-img {
    opacity: 0.3;
}

img.visibility-icon-md {
    height: 30px;
}

img.visibility-icon-sm {
    height: 22px;
}

input[type="checkbox"].input_class_checkbox  {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}

label {
    color: #4A4A4A;
    font-size: 14px;
    font-weight: 600;
    line-height: 32px;
}

label.show-error {
    font-size: 14px;
    line-height: 16px;
}

legend {
    border-bottom: 1px solid #9B9B9B;
    color: #4A4A4A;
    font-size: 22px;
    font-weight: 600;
    line-height: 37px;
    text-shadow: 0 0 8px 0 #FFFFFF, 0 0 55px 0 #FFFFFF;
}

select.is-invalid {
    background-image: none !important;
}

strong {
    font-weight: 600;
}

table .cropped-text {
    display: -webkit-box;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

textarea.description {
    line-height: 1.5;
}

textarea.notes {
    border: 0;
    resize: none;
}

th[type-sort="visibility"] {
    text-align: right;
}

ul.pagination li + li {
    margin-left: 10px;
}

.action-navbar-wrapper {
    background-color: #001D6C !important;
    color: #FFFFFF;
    line-height: 3rem !important;
    margin: 0 -30px 0 -30px;
    padding-left: 15px;
}
.action-navbar-wrapper ul {
    float: left;
}

.add-caption {
  height: 1rem;
}

#add-caption-button {
  cursor: pointer;
}

.add-caption-button {
  color: #549fd7;
  cursor: pointer;
  height: 38px;
}

.alert.alert-danger {
    background-color: #fff6f7;
    border: 2px solid #d4b4b7;
    color: #4A4A4A;
}
.alert.alert-danger i.fa {
    color: red;
}

.alert-action-button {
    margin-top: .5rem;
}

.alt-flatpickr-input {
    background-color: #fff !important;
    border-right: 0 !important;
    cursor: pointer;
}

.analytics-line-item {
  display: flex;
  flex-wrap: nowrap;
  background-color: #FFF;
  margin-bottom: 10px;
  min-height: 100px;
}

.analytics-line-item > div {
  background-color: #FFF;
  width: 300px;
  margin: 10px;
}

.analytics-title {
  color: #9B9B9B;
}

.app-badge {
    width: 160px;
}

.auth_buttons .login {
    padding: 15px 20px 15px 0;
    margin: 0;
    display: block;
    font-size: 16px;
    line-height: 22px;
    color: #4a4a4a;
    font-weight: 400;
    font-style: normal;
}
.auth_buttons .login:hover {
    color: #7CC1E6;
}
.auth_buttons .register {
    padding: 12px 20px;
    background-color: #f27c59;
    border-radius: 25px;
    color: #fff !important;
}
.background-main, .background-main > .row  {
    background-color: #F2F4F8;
}

.background-on-hover {
    cursor: pointer;
    display: inline-block;
    background-size: 0;
}

.background-on-hover:hover {
    background-size: 44px 44px;
}

.background-on-hover:hover img {
    opacity: 0!important;
}

.background-on-hover-list {
    cursor: pointer;
    display: inline-block;
    background-size: 0;
}

.background-on-hover-list img {
    width: 29px;
    height: 29px;
}

.background-on-hover-list:hover {
    background-size: 29px 29px;
}

.background-on-hover-list:hover img {
    visibility: hidden;
}

.bar {
    position: absolute;
    top: -10px;
    right: -35px;
    font-size: 55px;
    color: #FFF;
    text-shadow: 2px 2px 4px #000000;
    cursor: pointer;
}

.beta-feature {
    display: none;
}

.block-current-video {
    margin-bottom: 1rem;
}

.block-folder-path {
    background-color: #FFF;
    padding: 1rem;
    margin-bottom: 1rem;
}

.block-sort-by {
    margin-top: .5rem;
}

.brand-section {
    padding: 1.5rem 1rem;
    border-bottom: 3px solid rgba(0, 0, 0, .1);
    position: fixed;
    width: 80%;
    background: #FFF;
    z-index: 1032;
}

.btn {
    border-radius: 20px;
}

.btn.annotation-button {
    border-radius: 4px;
    padding: 0.75rem;
}

.btn.btn-danger {
    background-color: red;
    border-color: red;
    color: white;
}
.btn.btn-danger:hover,
.btn.btn-danger:active {
    filter: grayscale(30%);
}

.btn-delete {
    background-color: #E65536;
    border-color: #E65536;
    color: white;
}

.btn-delete:hover {
    background-color: red;
    border-color: red;
    color: #FFF;
}

.btn.btn-more {
    border-color: #AEAEAE !important;
    box-shadow: none !important;
}

.btn.btn-primary:hover,
.btn.btn-secondary:hover {
    background-color: #7CC1E6;
    border-color: #7CC1E6;
    color: #FFF;
}

.btn.btn-secondary {
    background-color: #FFF;
    border-color: #0F62FE;
    color: #0F62FE;
}

.btn.btn-secondary.btn-more:hover {
    border-color: #0F62FE;
}

/*.btn-checkbox {*/
/*    background-color: #F2F4F8;*/
/*    font-size: 12px;*/
/*    border-radius: 15px;*/
/*    padding: 4px 20px;*/
/*}*/
.btn-checkbox {
    background-color: #F2F4F8;
    font-size: 16px;
    font-weight: lighter;
    border-radius: 15px;
    padding: 4px 20px;
}

.btn-checkbox:hover {
    color: unset;
}

.btn-checkbox-check {
    background-color: #6A29C4;
    color: #FFFFFF;
    font-size: 16px;
    border-radius: 15px;
    padding: 4px 20px;
}

.btn-checkbox-check:hover {
    color: #f2f4f8;
}

.btn-details-active,
.btn-details-active:hover {
    background-color: #FFF;
    border-color: #AEAEAE;
    color: #0F62FE;
}

.btn-details-inactive,
.btn-details-inactive:hover {
    cursor: default;
    background-color: #E1E1E1;
    border-color: #AEAEAE;
    color: #FFF;
}

.btn-direct-copy {
    margin-right: 1rem;
}

.btn-disabled,
.btn-disabled:hover {
    background-color: #E1E1E1;
    border-color: #AEAEAE;
    color: #AEAEAE;
    pointer-events: none;
}

.btn-filter-dropdown{
    border:1px solid lightgrey;
    color:#4A4A4A !important;
    margin-bottom: 1px;
    text-align:left;
    background-color: #FFF;
}

.btn-icon {
    padding-left: 2rem;
    padding-right: 2rem;
}

.btn-icon > img, .btn-icon > i {
    margin-right: .25rem;
    margin-top: -2px;
    height: 1rem;
}

.btn-outline-primary {
    color: #0F62FE;
    border-color: #0F62FE;
}
.btn-outline-primary:hover {
    background-color: #0F62FE;
    border-color: #0F62FE;
}
.btn-outline-primary:hover svg {
    color: white;
}
.btn-orange {
    background-color: #f27d59;
    border-color: #f27d59;
    color: #ffffff;
}
.btn-primary {
    background-color: #0F62FE;
    border-color: #0F62FE;
}
.btn-reorder,
.btn-reorder-cancel {
    border: 1px solid #0F62FE;
    color: #0F62FE;
    width: 100%;
    max-width: 200px;
    line-height: 1.5;
    background-color: #fff;
}

.btn-reorder:hover {
    background-color: #0F62FE;
    border-color: #0F62FE;
    color: #ffffff;
}

.btn-switch {
    background-color: #FFFFFF;
    border: 1px solid #0F62FE;
    color: #0F62FE;
    font-size: 12px;
    border-radius: 15px;
    padding: 4px 20px;
}

.btn-view button {
    border: transparent;
    background: transparent;
}

.btn-view button:active {
    outline-width: 0;
}

.bulkIcons {
    margin-bottom: 1rem;
}

.button-checkbox button {
    padding: 1px 0 2px 3px;
}

.calendarBtn {
    cursor: pointer;
    background-color: #fff;
    border-left: 0;
}

.captions-divider {
  border-top: solid;
  color: #eaeaea;
}

.caption-icon {
  color: #549fd7;
}

.caption-spinner {
  height: 30px;
}

.caption-section-title {
  font-size: 14px;
}

body:not(.passport-authorize) .card {
    margin-bottom: 25px;
    max-height: 270px;
    border: 0;
    border-radius: 0;
    border: 1px solid #B7B7B7;
    transition: all 0.3s ease-out;
}
.card:hover {
    box-shadow: 0px 1px 3px #939393;
}
.card.no-hover:hover {
    box-shadow: none!important;
}
.card.awaiting-approval {
    border-radius: 14px;
    flex: 0 1 auto;
    margin-bottom: 1.5rem;
}
.card.awaiting-approval .card-body {
    padding: .5rem 1.5rem;
}
.card.awaiting-approval .card-title {
    margin-bottom: .1rem;
    text-align: center;
    line-height: 2rem;
    font-weight: 100;
}
.card.awaiting-approval .user-count {
    font-size: 2.25rem;
}
.card .card-text.with-owner-icon {
    margin-top: -1.25rem;
}
.card .card-title,
.card .card-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.card .card-text img.icon {
    width: 10px;
}
.card .plan-card-text {
    overflow: visible;
}
.card .card-title .card-title-text {
    font-weight: bold;
    overflow: hidden;
    padding-left: .5rem;
    text-overflow: ellipsis;
    padding-right: .5rem;
}
.card .card-title .user-circle {
    margin-top: 12px;
}
.card .card-title > img {
    display: block;
    position: relative;
    top: 2px;
}

.card-body-custom {
    flex: 1 1 auto;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
}

.card-drag-placeholder {
    background-color: #000;
    opacity: 0.3;
    margin: 0 15px 25px;
}

.card-grid-checkbox {
    position: absolute;
    top: 9px;
    left: 12px;
}

.card-grid-checkbox .icon-checkbox .fa-square.text-muted {
    color: #FFF !important;
}

.card-grid-ellips-menu {
    position: absolute;
    top: 3px;
    right: 12px;
}

.card-link,
.card-link:hover {
    color: #4A4A4A;
    text-decoration: none;
}

.card-part-bottom {
    align-items: flex-end;
    margin-top: -0.75rem;
    min-height: 36px;
}

.changeNoteForm {
    margin-bottom: 1rem;
}

.channel-dates {
    flex-direction: column;
}

.channel-details-page {
    padding-top: 70px;
}

.channel-details-page .search-bar-sticky {
    top: 70px;
}

.channel-icon-shared {
    color: silver;
}

.channel-item-overflow {
    overflow-x: hidden;
    overflow-y: auto;
    min-height: 1px;
}

.channel-list-scrollable {
    max-height: 360px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.channel-popover-count {
    margin-left: 30px;
}

.channels .card-body {
    padding: .75rem;
}

.channels .card-title {
    margin-bottom: 0;
}

.channel-visibility-sidebar {
    width: 25px;
    height: 25px;
}

.circle {
    background: #3DAA9D;
    border-radius: 1em;
    color: #fff;
    font-size: 21px;
    height: 2em;
    line-height: 2em;
    text-align: center;
    vertical-align: text-bottom;
    width: 2em;
    margin-top: -7px;
}

.class_checkbox:active,
.select-item:active,
.icon-checkbox > i,
.input-group-prepend > .colorpicker-input-addon {
    outline: none;
}

.input_class_checkbox {
    width: 56px;
}

.clear-all-filters {
    align-items: center;
    display: flex;
    margin-right: 10px;
    margin-top: 10px;
    padding: 10px;
}

.clear-btn {
    border: 0;
    background-color: #FFF;
    cursor: pointer;
    color: lightgrey;
    width: 25px;
    height: 25px;
}

.close-btn-search {
    max-height: 18px;
}

.close-btn-search {
    max-height: 18px;
}

.cloud-image {
    width: 220px;
}

.cloud-image-container {
    height: 140px;
}

#content-image {
    color: #1074cb;
}

.code-preview-block {
    height: 82%;
}

.color-picker .colorpicker-input-addon:before {
    border-radius: 50%;
    height: 24px;
    width: 24px;
}
.color-picker .colorpicker-input-addon i {
    border-radius: 50%;
    height: 24px;
    width: 24px;
}

.content.channel-details {
    min-height: calc(100vh - 150px);
    bottom: 0;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 30px;
    right: 15px;
    left: 40px;
}

.content-video-details {
    overflow: auto;
    background-color: #fff;
    isolation: isolate;
}

.content-video-details hr {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
}

.content-video-details-option.no-selected {
    display: none;
}

.count-box {
    width: 240px;
    background-color: #0F62FE;
    color: #FFF;
    display: none;
    border: none;
    border-radius: 10px;
    padding: 10px;
    font-weight: bold;
    font-size: 16px;
    z-index: 98;
    position: absolute;
    box-shadow: 3px 3px 5px #939393;
    left: 50px !important;
    visibility: visible;
}

.count-box .thumbnail-frame {
    display: inline-block;
    vertical-align: middle;
    width: 60px;
    height: 34px;
}

.cursor-pointer {
    cursor: pointer;
}

.custom-url,
#add-custom {
    font-weight: normal;
    text-decoration: none;
}

.customize-player {
    font-weight: lighter;
    text-align: left;
}

.cropped-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dark-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    z-index: 1030;
}

.darken:hover .dragbox-container .dragbox .drag-handle .img-responsive,
#table-items.table tr:hover .dragbox-container .dragbox .drag-handle .img-responsive {
    display: inherit;
}

.details .action-icon {
    cursor: pointer;
    background-size: 40px 40px;
    display: inline-block;
    background-repeat: no-repeat;
    width: 40px;
}

.disable-link {
    pointer-events: none;
}

.div-notes {
    border: 1px solid #C6C6C6;
    border-radius: 10px;
    padding-top: 1em;
    padding-bottom: 1em;
    padding: 0.5em;
}

.dragbox {
    height: 100% !important;
    width: 100%!important;
    position: absolute !important;
    border: 0 !important;
    left: 0px;
    top: 0px;
    touch-action: none;
    z-index: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dragbox-container {
    background-color: #C7D6D5;
    height: 100% !important;
    width: 27px;
    position: absolute !important;
    left: -27px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

.draggable-table-row td:first-child {
    position: relative;
}

.draggable-table-row td:first-child .dragbox-container {
    background-color: #C7D6D5;
    height: 100% !important;
    width: 27px;
    position: absolute !important;
    top: 0;
    left: 0;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    display: none;
    margin-left: -27px;
    z-index: 800;
}

.draggable-table-row td:first-child .dragbox-container .dragbox {
    height: 100% !important;
    width: 100%!important;
    position: absolute !important;
    border: 0 !important;
    left: 0px;
    top: 0px;
    touch-action: none;
    z-index: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.draggable-wrapper {
    display: none;
}

.drag-handle {
    cursor: grab;
}

.drag-handle-component {
    top: 20%;
}

.drag-handle-spacer {
    display: none;
    height: 1px!important;
    width: 11px;
}

.dropdown-menu > .dropdown-item {
    font-weight: lighter;
}

.dropdown-item > .upgrade-badge {
    margin-bottom: 0;
}

.dropdown-item-upgrade-title {
    color: #8a3ffc;
}

.dropdown-menu .dropdown-item.disabled {
    cursor: not-allowed;
    pointer-events: none;
    filter: opacity(.35);
}

.dropdown-menu img {
    width: 22px;
    height: 22px;
    margin-right: 10px;
}

.dropdown-menu.user {
    border: 1px solid #A4A4A4;
    border-radius: 3px;
    box-shadow: 0.1rem 0 0.2rem rgba(0, 0, 0, .15);
    font-size: 14px;
    padding-bottom: 0px;
    width: 300px;
    top: 50%;
}

.dropdown-menu.user a.screenpal-dropdown-link {
  display: inline;
  margin-left: 46px;
}

.dropdown-menu.user img.screenpal-dropdown-img {
  width: 174px;
  height: 28px;
  margin-top: 10px;
}

.dropdown-menu.user a.screenpal-dropdown-link {
  display: inline;
  margin-left: 46px;
}

.dropdown-menu.user img.screenpal-dropdown-img {
  width: 174px;
  height: 28px;
  margin-top: 10px;
}

.dropdown-main-section {
    padding: 1em 5px;
}

.dropdown-menu.user a {
    display: block;
    float: none;
}

.dropdown.ellipsis .dropdown-menu {
    text-transform: initial;
    line-height: 32px;
}

.edit-title-waiting {
    pointer-events: none;
    cursor: wait;
}

.ellipsis {
    cursor: pointer;
}

.ellipsisMenu {
    /*padding:10px;*/
    min-height: 27px;
    min-width: 26px;
}

.ellipsis-disabled {
    opacity:0.4;
    pointer-events: none;
}
.ellipsis .dropdown-menu img {
    width: 15px;
    height: 15px;
    margin-right: 7px;
    margin-top: 3px;
    vertical-align: text-top;
}

.embed-channel-image-shadow {
    box-shadow: 0 0 5px grey;
}

.embed-preview-code {
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.extra-bandwidth-section {
    max-height: 100%;
}

.fa-info-circle {
    color: #C1C7CD;
}

.fa-som-tooltip {
    font-size: 16px;
}

.filterDisplayed {
    background-color: #D6E6FF;
    border-radius: 25px;
    margin-right: 10px;
    margin-top: 10px;
    padding: 10px;
    display: flex;
    align-items: center;
}

.filterDisplayed a {
    padding-left: 20px;
}

.filterDisplayed b {
    line-height: 1.5;
    padding-left: 5px;
}

.filterDisplayed .removeFilter {
    margin-left: .75rem;
    cursor: pointer;
    margin-bottom: 4px;
}

.filterDisplayed .removeFilter .close-btn-search {
    height: 13px;
}

.filterDropdownBtn {
    border-radius: 6px;
    border: 1px solid #BEBEBE;
}

.filterDropdownBtn:after {
    float: right;
    margin-top: 10px;
}

.filtersDisplayed {
    display: flex;
    justify-content: start;
    flex-direction: row;
    flex-wrap: wrap;
}

.filterSearch.is-invalid > input {
    border-color: rgb(220, 53, 69);
}
.filterSearch .input-group-append {
    margin-left: -2px;
}

.filterSearch .input-group-append .input-group-text {
    border-color: #bebebe;
}
.filterSearch.is-invalid .input-group-append .input-group-text {
    border-color: rgb(220, 53, 69);
}
.filterSearch.is-invalid + .invalid-feedback {
    display: block!important;
}

.filterRow .input-group.filterSearch button.filterDropdownBtn,
.filterRow .input-group.filterSearch input.filterSearchText,
.filterRow .input-group.filterSearch span.filterSearchBtn {
    background-color: #ffffff;
    height: 38px;
}

.filterRow .input-group-append .btn,
.filterRow .input-group-prepend .btn.filterDropdownBtn {
    border-radius: 5px 0 0 5px;
    width: 90px;
}

.filter-menu-header {
    background-color: #F7F7F7;
    font-weight: bold;
}

.filters .filter-item,
.filters .filter-item:visited,
.filters .filter-item:active,
.filters .filter-menu-header {
    color: #0F62FE;
    text-decoration: none;
    cursor: pointer;
    font-size: 16px;
}

.filterOwners {
    padding: 4%;
    padding-bottom: 0;
}

.filterSearchBtn {
    background-color: #FFF;
    border-radius: 6px;
    padding: .350rem .5rem;
    border: 1px solid #BEBEBE;
}

.flex-grid {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 0;
    list-style: none;
}

.folder-icon {
    height: 1rem;
}

.folder-path-link {
    font-weight: lighter;
    color: #0F62FE;
    text-decoration: none;
    max-width: 10%;
    white-space: break-spaces;
}

.folder-path-link:hover {
    color: #0F62FE;
    text-decoration: none;
}

.folders .card {
    border-radius: .25rem;
}

.folders-drop-menu {
    position: absolute;
    top: .25rem;
    right: 2rem;
}

.folders-table-backgr {
    background-color: white;
}

.folders-table-backgr .icon-checkbox {
    position: absolute;
    padding-top: 5px;
}

.folder-title {
    color: #0F62FE;
    margin-left: 5px;
    width: 80%;
    font-weight: 700;
}

.form-check-label {
    line-height: inherit;
    padding-top: .25rem;
    padding-bottom: .25rem;
}
.form-check-label.disabled {
    color: #cbcbcb;
}
.form-check-input {
    margin-top: .25rem;
}

.form-control {
    border: 1px solid #BEBEBE;
    color: #4A4A4A;
    font-size: 16px;
    line-height: 37px;
}

.form-control.search-query:focus {
    box-shadow: 0 0 0 0 rgba(0,0,0,0);
}
.form-control.search-query:focus + .input-group-append>.input-group-text{
    border-color: #80bdff;
}

.form-group > label,
.col label {
    margin-top: .5rem;
    margin-bottom: 0;
}

.form-input {
    border: 1px solid #BEBEBE;
    color: #4A4A4A;
    font-size: 16px;
    line-height: 37px;
    border-radius: .25rem;
}

.frame {
    width: 95%;
    height: 95%;
}

.guides-link, .guides-link:hover {
    text-decoration: none;
    color: black;
}

.guides-text-blue {
    color: #1074cb;
}

.guides-text-green {
    color: #43aa9d;
}

.guides-text-yellow {
    color: #f7bb2d;
}

.guides-text-coral {
    color: #f07c5e;
}

.general-alert {
    left: 50%;
    position: fixed;
    top: 1%;
    transform: translateX(-50%);
    width: 80%;
    z-index: 2000 !important;
}

.git-branch-overlay {
    display: flex;
    align-items: center;
    padding: .25em .5em;
    color: #333333;
    font-size: .75em;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(175, 175, 175, 0.85);
    z-index: 10000;
}

.group-with-user-link {
    margin-right: 22.25rem !important;
}

.h-30 {
    max-height: 30%;
}

.has-search .form-control {
    padding-right: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 999;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    cursor: pointer;
    color: #aaa;
    right: 15px;
}

.header-content label {
    margin-bottom: 0;
}

.help-card {
    background-color: #023a77;
    color: white;
    border-radius: 20px;
}

.hidden-link {
    left: -9999px;
    position: fixed;
}

.holder {
    width: 100%;
    height: 100%;
    position: relative;
}

.icon-blue {
    color: #0F62FE;
}

.img-responsive {
    display: none;
}

.image-popover {
    min-width: 130px;
    max-width: 200px;
    color: #16181b !important;
    text-decoration: none;
}

.image-popover a {
    color: #16181b !important;
    text-decoration: none;
}

.image-popover .row:hover {
    background-color: #f8f9fa;
}

.info-table-row {
    align-items: center;
    font-weight: 400;
    padding-bottom: .5rem;
    padding-top: .5rem;
    background: #ffffff;
    border-bottom: 1px solid lightgray;
    border-top: 1px solid lightgray;
}
.info-table-row a:hover {
    text-decoration: none;
}

.inline-alert {
    color: #333333;
    border-radius: .25rem;
    display: inline-block;
    font-size: 75%;
    font-weight: 400;
    line-height: 1;
    padding: .5rem;
    text-align: center;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    vertical-align: baseline;
    white-space: nowrap;
}
.inline-alert.inline-alert-success {
    background-color: #f4fde8;
    border: 1px solid #81d14a;
}
.inline-alert.inline-alert-warning {
    background-color: #fdf8ee;
    border: 1px solid #f2bb4c;
}
.inline-alert i.fas {
    margin-right: .25rem;
}
.inline-alert.inline-alert-success i.fas {
    color: #81d14a;
}
.inline-alert.inline-alert-warning i.fas {
    color: #f2bb4c;
}

.inline-editable {
    cursor: pointer;
    border-bottom: 2px dashed #9b9b9b;
}
.inline-editable:hover {
    border-bottom: 2px dotted #3b3b3b;
}
.input-group-append .btn, .input-group-prepend .btn {
    border-radius: .25rem;
}

.input-group-text.search-append {
    background-color: #fff;
    padding: 0 .5rem 0 .5rem;
    border: 1px solid #BEBEBE;
    border-left: 0;
}

.label-large {
    font-size: 16px;
}

.launch-editor {
    background-image:url('../images/design_2018/launcher_icons/editor2.svg');
}

.launch-manager {

}

.legend-overview {
    margin: 0;
}

.launch-recorder {
    background-image:url('../images/design_2018/launcher_icons/recorder2.svg');
}

.lh-0 {
    line-height: 0;
}
.lh-15 {
    line-height: 1.5;
}

.list-view td .icon-checkbox {
    max-height: 20px;
}

.logo {
    width: 250px;
}

.main-content {
    background-color: #F2F4F8;
}

.menu-delete:hover{
    background-color:#F85359 !important;
    color:#FFF !important;
    border: 1px solid #F85359 !important;
}

.menu-delete:hover .deleteIcon{
    display:none;
}

.menu-delete-icon-hover{
    display:none;
}

.menu-delete:hover .menu-delete-icon-hover{
    display:inline-block;
}

.max-w-1 {
    max-width: 1px;
}

.modal-content {
    border: 0;
    min-height: 670px;
}

.modal-content .btn.copy img {
    height: 21px;
    margin-right: 4px;
}
.modal-content input::placeholder,
.modal-content textarea::placeholder {
    color: rgba(155, 155, 155, 0.67) !important;
}
.modal-content label {
    font-weight: 400;
}
.modal-content .modal-body .tab-content {
    padding: 1.5rem;
}
.modal-content .modal-body .tab-content .tab-pane.active {
    background: #f7f7f7!important;
}
.modal-content .modal-footer {
    padding: 1rem;
}
.modal-content .modal-footer .btn:last-child {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}
.modal-content .modal-footer .btn.btn-secondary {
    border: none;
}
.modal-content .modal-footer .modal-status {
    font-weight: 300;
}
.modal-content .modal-header {
    padding: 1rem;
}
.modal-content .modal-header .close {
    font-size: 3rem;
    font-weight: 300;
    line-height: 1.75rem;
    margin: 0;
    padding: 0;
}
.modal-content .modal-header .modal-title {
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0;
    color: #878D96;
}
.modal-content .input-group-prepend + input {
    border-left: 0;
}
.modal-content .nav.nav-tabs {
    border-bottom: 1px solid #0F62FE;
    margin-left: -1rem;
    margin-right: -1rem;
}
.modal-content .nav .nav-item {
    padding: 0;
}
.modal-content .nav .nav-item .nav-link {
    color: #4a4a4a;
    font-weight: 300;
    margin-left: 32px;
    border:none;
    padding: .5rem 0;
    text-align: left;
}
.modal-content .nav .nav-item .nav-link.active {
    border-bottom: 7px solid #0F62FE;
    color:#0F62FE;
    font-weight:900;
}
.modal-content .nav .nav-item .nav-link.active:hover {
    font-weight: 900;
}
.modal-content .nav .nav-item .nav-link:hover {
    font-weight: 300;
}
.modal-content .tab-content {
    margin: 0 -1rem -1rem -1rem;
    padding: 24px 1.5rem 24px 1.5rem;
    color: #4a4a4a;
    background-color: #f7f7f7;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 300;
    line-height: 27px;
}
.modal-content .tab-content p {
    margin-bottom: .5rem;
}
.modal-content .tab-content form label {
    margin-bottom: -.5rem;
    margin-top: .5rem;
}
.modal-content .tab-content form .errors label {
    line-height: 1.5rem;
    font-style: italic;
}
.modal-content .tab-content form .errors .error-list {
    line-height: 1.5rem;
}
.modal-content .tab-content .input-group-text {
    background: #ffffff;
    border-right: none;
}
.modal-content .text-sm {
    font-size: 85%;
}
.modal-dialog {
    max-width: 683px;
}
.modal-dialog .modal-content {
    min-height: auto;
}

.modal-new {
    color: #0F62FE;
    cursor: pointer;
}

.m-20 {
    margin: 2rem;
}

.container-fluid .sidebar .nav {
    display: block;
}

.navbar-collapse.collapse {
    position: fixed;
    left: 0;
    padding-left: 15px;
    padding-right: 15px;
    width: 80%;
}

.navbar-collapse.collapsing {
    left: -75%;
    transition: height 0s ease;
}

.navbar-collapse.show {
    left: 0;
    transition: left 300ms ease-in-out;
}

.navbar-light .navbar-nav > li.active{
    position: relative;
}


.navbar-light .navbar-nav > li.active:before{
    border-bottom: 10px solid white;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    content: "";
    height: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 38px;
    width: 0;
}

.navbar-light .navbar-toggler {
    border-color: transparent;
    font-size: 1.5em;
    padding: 0;
}

.navbar-right a {
    display: inline-block;
    float: left;
}

.navbar-right a:hover {
    text-decoration: none;
}

.navbar-separate {
    width: 2px;
    background-color: rgba(0, 0, 0, .1);
}

.navbar-white {
    background-color: #FFF !important;
    z-index: 800;
}

.nav-item-title {
  line-height: 28px !important;
}

.nav-item-help-link {
    color: #FFFFFF !important;
}

.nav-item-upgrade-link > span {
    color: #FFFFFF;
}

.nav-item-upgrade-link:hover {
    color: #FFFFFF;
}

.nav-link a > img,
.nav-link li.jstree-node a.jstree-anchor i.jstree-icon {
    width: 25px;
    height: 25px;
}

.nav-link-arrow-icon {
    position: absolute;
    font-weight: 900;
    font-size: 20px;
    left: 22px;
    color: #4A4A4A;
}

.nav-link-tree {
    padding: 0 .5rem .5rem 0;
}

.nav-pagination {
    flex-direction: column;
}

.no-decoration:hover {
    text-decoration: none;
}

.no-description {
    font-style: italic;
    color: #C6C6C6;
}

.no-max-height {
    max-height: unset!important;
}

.not-droppable, .not-droppable * {
    cursor: no-drop;
}

.not-droppable:hover, .not-droppable:hover * {
    background-color: initial!important;
    cursor: no-drop;
}

.noscroll {
    position: fixed;
    overflow-y: scroll;
    width: 100%;
}

.notes-error, .notes-deleted, .notes-added, .notes-copied {
    position: absolute;
    right: 30px;
}
.notification-row {
    border-bottom: 1px solid lightgray;
    border-top: 1px solid lightgray;
    background-color: white;
    margin: 0;
    padding: 10px 0 10px 0;
}

.number-items {
    color: #9c9c9c;
}

.overlay-button {
    border: 1px solid #FFF !important;
    border-radius: 18px;
    font-weight: bold;
    font-size: 14px;
    padding: 7px;
    height: 37px;
    display: inline-block;
    color: #FFF;
    vertical-align: middle;
    text-decoration: none;
}

.overlay-button:hover {
    background-color: #FFF;
    color: #000;
    text-decoration: none;
}

.overlay-center {
    width: 100%;
    height: 50px;
    opacity: 0;
    position: absolute;
    top: 39%;
    left: 50%;
    text-align: center;
    transform: translate(-50%, -50%);
    z-index: 0;
}

.overlay-center button,
button.ellipsisMenu {
    background: transparent;
    border: transparent;
}

.overlay-center button:active,
button.ellipsisMenu:active {
    outline-width: 0;
}

.overlay-header {
    width: 100%;
    height: 50px;
    opacity: 0;
    position: absolute;
    top: 12%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FFF;
    z-index: 1;
}

.overlay-header-checkbox {
    padding: 11px 12px;
}

.overflow-x-hidden {
    overflow-x: hidden;
}

.overflow-hidden {
    overflow: hidden;
}
.page-header h1 span {
    color:#C6C6C6;
    font-size:19px;
}

.page-header h1 {
    font-size: 1.5rem;
    font-weight: 300;
    margin-bottom: 0;
}

.page-header h1 span {
    color: #C6C6C6;
    font-size: 19px;
}

.page-header-hr {
    margin-top: .5rem;
    margin-bottom: 0;
}

.page-header .sidebar-add-btn {
    position: static;
}

.page-header-title {
    box-shadow: 0 .5rem 1rem -0.5rem rgba(0, 0, 0, .15);
    margin-bottom: .5rem;
}

.page-header-title hr {
    margin-top: .5rem;
    margin-bottom: .5rem;
}

.page-item {
    text-align: center;
    margin-bottom: .5rem;
}

.page-item.active .page-link {
    border: 1px solid transparent;
}

.page-loading {
    position: fixed;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    z-index: 2999;
    background: #fff url("../images/color_dot_animated.gif") center center no-repeat !important;
}
.page-loading.modal-loader {
    position: absolute;
    opacity: .7;
}

.page-subtitle {
    color: #CECECE;
    font-weight: 700;
}

.pagination .page-item .page-link {
    border-radius: 19px;
    font-weight: 300;
    height: 38px;
    min-width: 38px;
}

.pagination .page-item.active .page-link {
    color: white;
    background-color: #0F62FE/*--som-blue*/;
    font-weight: 600;
}

.pagination .page-item .page-link i {
    position: relative;
    top: 1px;
    color: #0F62FE;
}

.pagination .page-item .page-link i.fa-chevron-left {
    right: 2px;
}

.pagination .page-item .page-link i.fa-chevron-right {
    left: 2px;
}

::placeholder {
    color: rgba(0, 0, 0, .35)!important;
}

.popover :not(colorpicker-bs-popover) {
    z-index: 801;
}

.popover.screencast-popover,
.popover.channel-popover {
    min-width: 250px;
    max-width: 300px;
}
.popover.quiz-popover {
    min-width: 300px;
    max-width: 350px;
}

.popover-body {
    color: #4A4A4A;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 23px;
}

.popover hr {
    margin: 2px .75rem;
}

.popover-content {
    padding: 6px;
}

.popover {
    max-width:100%;
}

.popover-header {
    background-color: #ffffff;
    border-radius: 0;
    border-bottom: 0;
    color: #4A4A4A;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: .5px;
    line-height: 23px;
}

.popover .description {
    margin-top: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.popover .popover-link {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.popover strong {
    color: #000;
    font-weight: 400;
}

.preLoadHide {
    display: none !important;
}

.profile-title {
    color: #4A4A4A;
    font-size: 36px;
    line-height: 49px;
}

.profile-image-md {
    height: 44px;
    width: 44px;
    border-radius: 50%;
    overflow: hidden;
    object-fit: cover;
}

.profile-image-lg {
    height: 90px;
    width: 90px;
    border-radius: 50%;
    overflow: hidden;
    object-fit: cover;
}

.profile-image-list {
    height: 2em !important;
    width: 2em !important;
    border-radius: 1em;
    font-size: 18px;
    overflow: hidden;
    margin-right: unset !important;
}

.profile-image-sm {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    object-fit: cover;
}

.progress {
    background-color: rgba(232, 75, 55, 0.2);
    height: 8px;
}

.progress-bar {
    background-color: #E84B37;
}

.qr-code-dropdown {
    padding: 1rem;
    background-color: #f6f6f6;
}

.qr-modal-top {
    height: 220px;
}

.qr-modal-bottom {
    background-color: rgb(11,34,101);
    color: #fff;
    height: 220px;
    border-radius: 0 0 5px 5px;
}

.qr-code {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    border-radius: 20px;
    width: 240px;
    box-shadow: 0px 0px 10px grey;
}

.qr-bottom-text {
    position: absolute;
    left: 20%;
}

.reorder-text {
    margin-bottom: .5rem;
}

.replace-video-list {
    overflow-y: auto;
    height: 320px;
    padding-left: 4px;
}

.replace-video-list-selected {
    background-color: #f6faf1;
    border-left: 4px solid #a0d16a;
}

.replace-video-list-selected img {
    border: 2px solid #a0d16a;
}

.reset-views-button {
    height: 20px;
    position: relative;
    /* top: -3px; */
    border: none;
    font-size: 14px;
}

.removed-icon, .custom-removed-icon {
    width: 20px;
    height: 20px;
    background: url('../images/remove.svg') no-repeat;
}

.removed-icon:hover, .custom-removed-icon:hover {
    background: url('../images/remove_hover.svg') no-repeat;
}

.screencasts .card-title {
    margin-bottom: 0;
}

.screencast-popover a:hover,
.screencast-popover button:hover {
    text-decoration: none;
}

.screencast-popover button {
    color: #0F62FE;
}

.screencast-popover .popover-body .folder-title {
    display: inline-block;
    width: 180px;
    padding-top: 0;
}

.screencast-replace-block {
    padding-top: 15px;
}

.screencast-replace-confirmation {
    font-size: 18px;
    padding-top: 25px;
}

.screencast-replace-preview {
    max-width: 85px;
    max-height: 50px;
}

.screencast-replace-preview {
    max-width: 85px;
    max-height: 50px;
}

.screencast-replace-text-element {
    font-weight: bold;
}

.screencast-replace-th {
    max-width: 1%;
    white-space: nowrap;
}

.screencast-replace-th, .screencast-replace-tr {
    cursor: pointer;
}

.screencast-replace-warning {
    height: 50px;
}

.screencasts .card-body {
    padding: .75rem;
}

.content-column-container {
  text-align: center;
  margin-left: -15px;
  margin-right: -15px;
  padding-right: 0px;
}

.screencast-preview-container {
  margin-bottom: 5.5rem;
  padding-right: 0;
}

.screencast-sections {
    width: 100%;
    border-top: 1px solid rgb(237, 237, 237);
    padding: 0;
    margin-top: -6px;
}

.screencast-sections > div {
    border-bottom: 1px solid #EDEDED;
}

.screencast-sections-row {
    padding-right: 0;
}

.screencast-table-checkbox {
    text-align: left;
}

.screenpal-dropdown {
  padding: 0.5rem;
  background-color: #001D6C;
  color: #f6f6f6;
  display: flex;
  height: 94px;
}

.screenpal-dropdown-text {
  margin-top: 10px;
}

.screenpal-section {
  margin-left: 12px;
}

.screenpal-dropdown {
  padding: 0.5rem;
  background-color: #001D6C;
  color: #f6f6f6;
  display: flex;
  height: 94px;
}

.screenpal-dropdown-text {
  margin-top: 10px;
}

.screenpal-section {
  margin-left: 12px;
}

.scroll-show {
    visibility: visible !important;
}

.scroll-show::-webkit-scrollbar-thumb {
    background: #BBB;
}

.search-bar-buttons {
    margin-top: .5rem;
}

.search-bar-sticky {
    z-index: 797;
    position: fixed;
    width: 100%;
    background-color: #F6F6F6;
    top: 117px;
    right: 1em;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
    animation: smoothScroll 1s forwards;
}

.search-bar-sticky .filtersDisplayed,
.search-bar-sticky #filterResults {
    display: none;
}

.search-bar-sticky #filters {
    padding-left: 1rem !important;
}

.search-query {
    border-radius: 6px;
    color: #4A4A4A;
    border-right: 0;
}

/**********************************
FILTER & SEARCH CONTROLS
***********************************/
.search-input-channel-detail {
    display:inline-block;
    width:270px;
}
.search-query,
.form-control.search-query:focus {
    border-right:0;
}
/**********************************
EMPTY CHANNELS/GROUPS/DATA
***********************************/
.sectionNoDataAvailable{
    padding-top:30px;
    width:100%;
    text-align:center;
}
.sectionNoDataAvailableTitle{
    font-size:2.5rem;
}

.select-picker {
    margin: 10px 0;
}

.select-picker .if-selected {
    display: none;
}

.select-picker .selected .if-selected {
    display: inline;
}

.select-picker .selected .if-unselected {
    display: none;
}

.select-picker .select-item {
    float: left;
    cursor: pointer;
    background-color: #fdfdfd;
    border: 1px solid #ddd;
    border-radius: 3px;
    width: 47%;
    text-align: center;
    padding-bottom: 10px;
    line-height: 1.3em;
    font-weight: bold;
    font-size: 13px;
    position: relative;
}

.select-picker .select-item:nth-child(-n + 2) {
    margin-bottom: 1rem;
}

.select-picker .select-item-disabled {
    float: left;
    cursor: pointer;
    background-color: #ececec;
    border: 1px solid #ddd;
    border-radius: 3px;
    width: 22%;
    text-align: center;
    padding-bottom: 10px;
    line-height: 1.3em;
    font-weight: bold;
    font-size: 13px;
    position: relative;
}

.select-picker .select-item .icon img,
.select-picker .select-item-disabled .icon img{
    width: 37px;
    height: 37px;
    margin: 13px;
}

.select-picker .channel-layout-select .icon img{
    width: 150px;
    height: auto;
}

.select-picker .select-item .label,
.select-picker .select-item-disabled .label {
    color: #4A4A4A;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 20px;
    text-align: center;
}

.select-picker .select-item.selected {
    border: 2px solid #42BE65;
    background-color: #FAFCF7;
}

.select-picker .select-item.selected:after {
    content: "";
    height: 30px;
    width: 30px;
    background-size: 30px 30px;
    background-image: url('../images/design_2018/tabs_details/checkmark.svg');
    position: absolute;
    right: -1px;
    top: -1px;
}

.select-picker .select-item.selected .label {
    font-weight: 600;
    color: #4A4A4A;
}

.select-picker .select-thumbnail {
    float: left;
    background-color: #fdfdfd;
    border: 1px solid #aaaaaa;
    border-radius: 2px;
    height: 4rem;
    width: 32%;
    position: relative;
    border-style: dashed;
}

.select-picker .select-thumbnail.populated {
    cursor: pointer;
    border-style: solid;
}

.sidebar-action-link {
    cursor: pointer;
}

.sidebar-action-link .nav-link {
    width: 100%;
    text-align: left;
    font-weight: 300;
    line-height: 47px;
    border: none;
    background-color: #FFF;
    border-left: 5px solid transparent;
    border-top: 1px solid rgba(0, 0, 0, .1);
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    font-size: 20px;
}

.sidebar-action-link .nav-link.collapsed i {
    transform: rotate(90deg);
}

.sidebar-action-link .nav-link.current {
    border-left-color: #0F62FE;
    background-color: rgba(84, 159, 215, 0.06);
}

.sidebar-app-text {
    font-size: .9rem;
    font-weight: 300;
}

.sidebar-app-download {
    background-color: #F7F7F7;
}

.sidebar-close-button {
    border: none;
    background: transparent;
}

.sidebar-collapse {
    padding-top: 1.5rem;
}

.sidebar-content {
    padding-top: 85px;
    background-color: #FFF;
}

.sidebar-count {
    color: #9c9c9c;
}

.sidebar-logo {
    width: 170px;
}

.select-picker .select-thumbnail.populated .thumbnail-img {
    max-width: 100%;
    text-align: center;
}

.select-picker .select-thumbnail.populated:hover span {
    height: 20px;
    width: 20px;
    background-size: 20px 20px;
    background-image: url('../images/design_2018/share_remove.png');
    position: absolute;
    right: -6px;
    top: -10px;
    z-index: 1;
}

.select-picker .select-thumbnail.selected.populated {
    border: 2px solid #42BE65;
    background-color: #FAFCF7;
}

.select-picker .select-thumbnail.selected.populated:after {
    content: "";
    height: 30px;
    width: 30px;
    background-size: 30px 30px;
    background-image: url('../images/design_2018/tabs_details/checkmark.svg');
    position: absolute;
    right: -2px;
    top: -2px;
}

.sidebar {
    background-color: #F7F7F7;
    bottom: 0;
    box-shadow: 0.1rem 0 0.2rem rgba(0, 0, 0, .15);
    color: #4A4A4A;
    font-size: 18px;
    top: 120px;
    z-index: 1031;
    border-right: 2px solid transparent;
    transition: all .15s;
    overflow-y: auto;
}

.sidebar-collapse-icons {
    display: none;
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 1001;
}

.sidebar-videos,
.sidebar-screenshots,
.sidebar-quizzes,
.sidebar-trash,
.sidebar-users {
    padding-left: 2.9rem;
}

.sidebar ul li a {
    font-size: 16px;
    font-weight: 300;
    line-height: 47px;
}

.sidebar-title {
    font-size: 18px;
}

.sidebar ul li a:hover {
    text-decoration: none;
}

.sidebar ul li p,
.guides-card-wrapper .card h6 {
    color: rgba(155, 155, 155, 0.76);
    font-size: 14px;
    font-family: "Open Sans";
    opacity: 0.67;
}

.sidebar ul li.current {
    border-left: 5px solid #0F62FE;
    background-color: rgba(84, 159, 215, 0.06);
}

.sidebar ul li.current a {
    margin-left: -5px;
}

.sidebar ul li.nav-item:hover {
    background-color: rgba(84, 159, 215, 0.06);
}

.sidebar ul.sidebar-tree li.nav-item:hover {
    background-color: initial;
}

.sidebar-add-btn {
    position: absolute;
    right: 22px;
    top: 12px;
    z-index: 10;
    color: #0F62FE;
    font-size: 16px;
    border: transparent;
    background: transparent;
}

.sidebar-groups-add-btn {
    position: absolute;
    right: 22px;
    top: 12px;
    z-index: 10;
    color: #0F62FE;
    font-size: 16px;
    border: transparent;
    background: transparent;
    width: 1.25rem;
}

.sidebar-add-btn:hover, .sidebar-groups-add-btn:hover {
    color: #0069d9;
    cursor: pointer;
}

.sidebar-channels, .sidebar-folders, .sidebar-groups {
    width: 100%;
}

.sidebar-count {
    float: right;
}

.sidebar-icon {
    height: 32px;
    padding-bottom: 4px;
    padding-left: 4px;
}

.sidebar-settings .sidebar-content {
    padding-top: 1.5rem;
}

.side-section {
    background-color: #fff;
    border-right: 1px solid #EDEDED;
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.side-section.selected {
    border-bottom: 3px solid #063299;
    background-color: #1b67fa;
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.som-checkbox + label,
.form-check label {
    cursor: pointer;
}

.som-checkbox:after {
    color: #AAA !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    font-size: 1.33333em;
    line-height: .75em;
    vertical-align: 1em;
    content: "\f0c8";
    background-color: #F6F6F6;
    display: block;
    width: 16px;
    height: 15px;
}

.som-checkbox:checked:after {
    color: #42BE65 !important;
    outline: none;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.33333em;
    line-height: .75em;
    vertical-align: 1em;
    content: "\f14a";
    background-color: white;
    display: block;
    width: 16px;
    height: 15px;
}

.show>.btn-secondary.btn-more,
.btn.btn-secondary.btn-more:hover {
    background-color: #FFFFFF;
    box-shadow: none !important;
    color: #0F62FE;
    border-color: #0F62FE!important;
}

.som-nav-tabs {
    border-bottom: 1px #0F62FE solid;
}

.som-nav-tabs a.nav-link {
    color: #000;
    padding: .25rem 0;
    margin: 0 1rem;
}

.som-nav-tabs a.nav-link.active {
    border-bottom: 5px solid #0F62FE;
    color: #0F62FE;
}

.sortable .ui-sortable-handle {
    cursor: grab;
}

.sortable .ui-sortable-handle:active {
    cursor: grabbing;
}

.sort-list {
    cursor: pointer;
    white-space: nowrap;
}

.sort-list a,
.guides-card-wrapper .card a:hover {
    text-decoration: none;
}

.sort-list-active, .sort-list a {
    color: #212529;
}

.sort-list-active, .sort-list a.sort-list-active .fa {
    color: #4A4A4A;
}

.sort-list .sort-list-active {
    color: #4A4A4A;
}

.sort-list .sort-list-inactive {
    color: #9B9B9B;
}

.sort-list-active {
    color: #4A4A4A;
}

.sort-list-inactive, .sort-list a.sort-list-inactive .fa {
    color: #C6C6C6;
    opacity: 0.8;
}

.sort-list > a {
    color: #9B9B9B;
}
.sort-list.active > a {
    color: #4A4A4A;
}

.sort-list a::after {
    content: url("/images/design_2018/caret-none.svg");
}
.sort-list:hover a.desc::after {
    content: url("/images/design_2018/caret-down.svg");
}
.sort-list:hover a.asc::after {
    content: url("/images/design_2018/caret-up.svg");
}
.sort-list.active > a.asc::after {
    content: url("/images/design_2018/caret-up.svg");
}
.sort-list.active:hover > a.asc::after {
    content: url("/images/design_2018/caret-down.svg");
}
.sort-list.active > a.desc::after {
    content: url("/images/design_2018/caret-down.svg");
}
.sort-list.active:hover > a.desc::after {
    content: url("/images/design_2018/caret-up.svg");
}

.subheader-action-icon {
    cursor: pointer;
    width: 40px;
}

.table {
    font-size: 14px;
}

.table td {
    border: 0;
}

.table tbody tr {
    background-color:#fff;
}

.table th {
    border-top: 0;
}

.table thead th {
    border-bottom: 0;
    color: #9B9B9B;
}

.table tr {
    border-bottom: 1px solid lightgray;
}

.table tr.invited .user-circle {
    background-color: #0B2265;
    color: #FFFFFF;
}

.table-drag-placeholder {
    height: 70px;
    width: 100%;
    background-color: #000;
    opacity: 0.3;
}

.table-hover tbody tr:hover {
    background-color: #E5F4FF;
}

.table-replace {
    text-align: center;
}

.table-sticky-header th {
    background: white;
    position: sticky;
    top: 0;
}

.table-usage-history tbody {
    background-color: #fdfdfe;
}

.table-usage-history td,
.table-usage-history th {
    border-bottom: 1px solid #878787;
}

table.table-user-info td,
table.table-user-info th {
    align-items: center;
    font-weight: 400;
    padding: .5rem;
    vertical-align: middle;
}
table.table-user-info tr {
    border-bottom: 1px solid lightgray;
}
table.table-user-info tr:first-child {
    border-top: 1px solid lightgray;
}
table.table-user-info tr.pending td {
    color: gray;
    font-style: italic;
}
table.table-user-info tr.revoked,
table.table-user-info tr.removing {
    background-color: lightgray;
}
table.table-user-info tr.revoked td,
table.table-user-info tr.removing td {
    color: gray;
    font-style: italic;
    text-decoration: line-through;
}

.text-gray,
th.text-gray a {
    color: #9B9B9B !important;
}

.text-green {
    color: #3DAA9D !important;
}

.text-lighter {
    font-weight: 300;
}

.thumbnail-frame {
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: relative;
}

.thumbnail-frame img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.th-width-fit-content,
.td-width-fit-content {
    width: 1%;
    white-space: nowrap;
}

.th-width-fit-content-extended {
    width: 6%;
    white-space: nowrap;
}

.thumbnail-frame {
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: relative;
}

.thumbnail-frame img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

#thumbnail-spinner {
    width: 100px;
}

td.thumbnail img {
    max-width: 50px;
}
.text-open-sans-light {
    font-family: "Open Sans", sans-serif;
    font-weight: 300;
    font-size: 16px;
}
.text-orange {
    color: #f27c59!important;
}

.time-input-wrapper {
    width: 135px;
}

.title-dashed-underline {
    font-size: 20px;
    border-bottom: 1px dashed;
    border-color: #AEAEAE;
}

.tile-double-first {
    padding-right:0;
}

.tile-double-second {
    padding-left:0;
}

.tile-first {
    padding-right:0;
}

.tile-second {
    padding-left:0;
    height: 80px !important;
}

.tile-third {
    padding-left:0;
    height: 80px !important;
}

/*Tooltips styling*/
.tooltip-inner {
    background-color: #fff;
    border-radius: .25rem;
    box-shadow: 0 0 8px 6px rgba(0, 0, 0, .1);
    color: #000;
    max-width: 200px;
    padding: 10px;
    text-align: left;
}
.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before,
.tooltip.bs-tooltip-top .arrow::before {
    margin-left: -3px;
    content: "";
    border-width: 5px 5px 0;
    border-top-color: #fff;
}
.tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before,
.tooltip.bs-tooltip-right .arrow::before {
    margin-top: -3px;
    content: "";
    border-width: 5px 5px 5px 0;
    border-right-color: #fff;
}

.tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow::before,
.tooltip.bs-tooltip-bottom .arrow::before {
    margin-left: 0px;
    content: "";
    border-width: 0 5px 5px;
    border-bottom-color: #fff;
}

.tooltip.bs-tooltip-auto[x-placement^=left] .arrow::before,
.tooltip.bs-tooltip-left .arrow::before {
    right: 0;
    margin-top: -3px;
    content: "";
    border-width: 5px 0 5px 5px;
    border-left-color: #fff;
}

.tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before,
.tooltip.bs-tooltip-right .arrow::before {
    margin-top: -3px;
    content: "";
    border-width: 5px 5px 5px 0;
    border-right-color: #fff;
}

.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before,
.tooltip.bs-tooltip-top .arrow::before {
    margin-left: 0px;
    content: "";
    border-width: 5px 5px 0;
    border-top-color: #fff;
}

.tooltip-highlighted {
    color: #FFFFFF;
}

.tooltip-highlighted .tooltipster-box {
    background: #001D6C;
    border: 2px solid #001D6C;
    font-weight: lighter;
}

.tooltip-highlighted .tooltipster-arrow .tooltipster-arrow-background {
    border-top-color: #001D6C;
}

.tooltip-included-channels {
    color: #C6C6C6;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
}

.tooltip-inner {
    background-color: #fff;
    border-radius: .25rem;
    box-shadow: 0 0 8px 6px rgba(0, 0, 0, .1);
    color: #000;
    max-width: 200px;
    padding: 10px;
    text-align: left;
}

.tooltip-title {
    font-weight: bold;
    font-size: 16px;
    text-align: center;
}

.trash-table thead {
    text-align: left;
}

.trash-header-title {
    color:#878787;
    font-weight: 300;
}

.trial-badge{
    position: absolute;
    border-radius: 25px;
    background-color: #023A77;
    color: #FFF;
    right: 95px;
    top: 50px;
    display:block;
    visibility: hidden;
}

.trialbadge:hover{
    display:none;
}

.upgrade-badge {
    font-size: 0.8rem;
    display: block;
    margin-bottom: .5rem;
    text-align: center;
    padding: 3px 10px;
    background-color: #D12771;
    border-radius: 20px;
    color: #FFF;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}

.upgrade-badge:hover {
    color: #FFF;
    text-decoration: none;
}

.upload-field {
    background-color: #fff;
    border-style: dashed;
    border-color: #d4d4d4;
}

.upload-title-edit {
    font-size: 20px;
    border: none;
    border-bottom: 1px solid;
    border-color: #AEAEAE;
    width: 20rem;
    border-radius: 0;
}

.upload-title-edit:focus {
    border-color: none;
}

.upload-thumbnail {
    object-fit: cover;
    width: 100px;
    height: 70px;
}

.upload-thumbnail-background {
    background-image: url(../images/design_2018/external_upload/item-upload-mask.jpg);
    background-size: cover;
}

.upload-detail-thumbnail {
    height: 240px;
    background-image: url(../images/design_2018/external_upload/item-upload-mask.jpg);
    background-size: cover;
}

.upload-thumbnail-spiner {
    width: 55px;
    height: 55px;
}

.upload-detail-thumbnail-spiner {
    width: 120px;
    height: 120px;
}

.upload-item {
    background-color: #fff;
}

.upload-close {
    color: #9b9b9b;
}

.upload-success {
    color: #00c200;
}

.upload-progress-bar-default {
    background-color: #e0e0e0;
}

.upload-progress-bar-processing {
    background-color: #1074cb;
    width: 0%;
}

.upload-progress-bar-finished {
    background-color: #00c200;
    width: 100%;
}

.upload-save {
    position: absolute;
    bottom: 0;
}

.ui-autocomplete {
    width: 246px;
    max-height: 246px;
    overflow-y: auto;
    z-index: 999;
    list-style: none;
    padding-left: 0;
}

.ui-autocomplete .ui-menu-item .ui-menu-item-wrapper {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    word-break: break-all;
}

.ui-autocomplete .ui-menu-item .ui-state-active {
    background-color: rgba(84, 159, 215, 0.06);
    color: initial;
}

.ul-pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 0;
}

.user-circle {
    background: #C7D6D5;
    border-radius: 1em;
    color: #000000;
    font-size: 22px;
    height: 2em;
    line-height: 2em;
    text-align: center;
    vertical-align: text-bottom;
    min-width: 2em;
    max-width: 2em;
    width: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
}
.user-circle.no-initials {
    background-color: #0B2265;
    color: #FFFFFF;
}

.user-circle.large {
    font-size: 44px;
}
.user-circle.small {
    font-size: 15px;
}
.user-circle.small.bg-ligthgray {
    background: lightgray !important;
}
.video-detail-footer-space {
    height: 70px;
}
.video-deteil-footer {
    position: fixed;
    bottom: 0px;
    right: 0;
    background-color: #383838;
    width: -webkit-fill-available;
    width: -moz-available;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 2%;
}

.video-details-option-title {
    background-color: #E5F6FF;
}

.video-details-page {
    padding-top: 54px;
    overflow-x: hidden;
}

.video-details-page .action-navbar-wrapper,
.channel-details-page .action-navbar-wrapper {
    display: none;
}

.video-details-page .draggable {
    display: none;
}

.video-details-page .main-content {
    margin-bottom: 0 !important;
}

.video-details-page .navbar,
.channel-details-page .navbar {
    box-shadow: 0px 1px 3px rgba(0, 0, 0, .25);
}

.video-details-row {
    margin-right: -30px;
}

.visibility {
    padding-top: 15px;
    font-size: 14px;
    line-height: 1.3em;
}
.visibility-text {
    text-transform: capitalize;
}

.w-20 {
    width: 20%;
}
.w-30 {
    width: 30%;
}

.w-35 {
    width: 35%;
}

.white-link-wrapper {
    display: flex;
    justify-content: center;
}

.white-link-button {
    border-radius: 15px;
    background-color: white;
    display: flex;
    padding: 0.25rem;
    cursor: pointer;
}

.white-link-button > div > img {
    margin-top: -4px;
}

.white-link-wrapper {
    display: flex;
    justify-content: center;
}

/** Alpine.js helpers */
[x-cloak] { display: none !important; }
/** End of Alpine.js helpers */

#filters-dropdown .filter-input label .single-field {
    display: inline-block!important;
    margin-left: 1rem!important;
    width: auto!important;
}
#actionNavbar > ul > li > a {
  color: #FFFFFF;
  display: inline-block;
  font-size: 16px;
  padding: 0;
  position: relative;
}
#actionNavbar > ul > li > a > i {
    margin-right: 5px;
}
#actionNavbar > ul > li > a.current span {
    bottom: 0px;
    display: block;
    left: 50%;
    margin-top: -48px;
    position: relative;
    top: 4px;
}
#actionNavbar > ul > li div.badge {
    background-color: #fff;
    color: #f00;
    border-radius: 50%;
    font-weight: 600;
    line-height: 13px;
    min-height: 21px;
    min-width: 21px;
    padding: 4px;
}

#btn-save-order {
    margin-top: .5rem;
    width: 100%;
    max-width: 235px;
}

#channelModalForm #password {
    font-family: text-security-disc;
    -webkit-text-security: disc;
}

#channelsForm .table .icon-checkbox {
    display: flex;
    margin-top: .25rem;
}

#channelsForm .table tbody tr:hover th,
#table-items.table tbody tr:hover th {
    background-color: #E5F4FF;
}

#channelsForm .table th {
    background-color: transparent;
}

#channels-table th {
    vertical-align: middle;
}

#download-screencast {
    margin-bottom: .5rem;
}

#embed-code {
    height: 7.4em;
    font-size: 16px;
    font-weight: lighter;
    line-height: 1.5;
}

#groups-root_anchor > i {
    background-size: 80%;
    border-radius: 50%;
    padding: 15px;
}

#image-change-overlay {
    background-color: #0a0302;
    opacity: 0.8;
    position: relative;
    top: -24px;
    font-size: 11px;
    height: 24px;
    color: white;
}

#image-change-overlay-bubble {
    background-color: #0a0302;
    opacity: 0.8;
    position: absolute;
    bottom: 0;
    font-size: 11px;
    height: 24px;
    color: white;
    width: inherit;
    line-height: normal;
}

#items-per-page {
    width: 70px
}

#noteForm {
    margin-bottom: 1rem;
}

#note-time {
    width: 66px;
}

#profile-dropdown .dropdown-item img {
    margin-right: 14px;
}

#replace-modal .modal-content {
    min-height: auto !important;
}


#screencastFormReplace {
    width: 100%;
}

#search-bar {
    -webkit-transition: position 10s;
    -moz-transition: position 10s;
    -ms-transition: position 10s;
    -o-transition: position 10s;
    transition: position 10s;
}

#search-field {
    padding-right: 0;
}

#share_url {
    background-color: inherit;
    border-color: rgb(241 244 248);
}

#sidebar-bottom-banner {
    bottom: 0;
    border: 0;
    margin-top: 25px;
    min-height: 250px;
    max-height: 250px;
    position: relative;
}

#table-items tbody {
    font-weight: 300;
    color: #515151;
}

#table-items td, #table-items th {
    vertical-align: middle;
    padding-top: .5rem;
    padding-bottom: .5rem;
}

#table-items tbody th.screencast-title a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    max-width: 325px;
}

#table-items .selectAllCheckbox {
    width: 20px;
}

#table-items.table th a:hover,
#table-items.table td a:hover,
#channels-table.table th a:hover,
#channels-table.table td a:hover,
table.list-view td a:hover,
table.table td a:hover {
    text-decoration: none;
}

#table-items .thumbnail-frame {
    overflow: hidden;
    width: 50px;
    height: 30px;
}

#table-trash td {
    vertical-align: middle;
}

#table-trash .trash-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#top-banner {
    overflow: hidden;
}

#userErrorMessage {
    color: red;
}

.user-classification-card {
    border: 1px solid#CBCBCB;
    border-radius: 14px;
    cursor: pointer;
    flex: 0 0 25%;
}

.user-classification-card:hover {
    border: 1.5px solid #7CC1E6;
    box-shadow: 0px 0px 4px 4px rgba(124,193,230,1);
}

.user-classification-card.selected {
    border: 1.5px solid #7ED321;
    box-shadow: 0px 0px 4px 4px rgba(126,211,33,1);
}

#userDropdownMenuLink::after {
    display: none;
}
.revoke-icon {
    width: 44px;
    height: 44px;
    background: url("/images/design_2018/users/revoke-button.svg") no-repeat;
    display: inline-block;
    position: relative;
}
.revoke-icon:hover {
    background: url("/images/design_2018/users/revoke-hover.svg") no-repeat;
}

#videodetailplayer {
    border: none;
}

#visibility-note {
    font-weight: bold;
}

#visibility-note {
    font-weight: bold;
}

.white-space-nowrap {
    white-space: nowrap;
}

@media (min-width: 0em) {
    .card {
        flex: 0 0 100%;
    }
}

@media (max-width: 473px) {
    body {
        padding-top: 10rem;
    }
}

@media (max-width: 575px) {
    .ui-autocomplete {
        left: 10px !important;
    }
    #sharing {
        width: 100%;
        justify-content: space-around;
    }
    .customize-player {
        font-size: 20px;
    }
    #customize-link {
        font-weight: 600;
    }
}

@media (min-width: 1200px) {
    .custom-offset-xl-1 {
        margin-left: 5.5%;
    }
}

@media (max-width: 575px) and (max-height: 514px) {
    body {
        padding-top: unset;
    }

    .action-navbar-wrapper {
        margin: 0 -15px 0 -30px;
    }

    .brand-section {
        position: inherit;
        width: unset;
    }

    .fixed-top {
        position: relative;
    }

    .sidebar {
        top: 0;
    }

    .sidebar-content {
        padding-top: 0;
    }
}

@media (min-width: 576px) {
    th[type-sort="visibility"] {
        text-align: left;
        white-space: nowrap;
    }

    .alert-action-button {
        margin-top: 0;
    }

    .block-folder-path {
        border-bottom: 4px solid #F6F6F6;
    }

    .block-sort-by {
        margin-top: 0;
    }

    .search-bar-buttons {
        margin-top: 0;
    }

    .select-picker .select-item {
        width: 22%;
    }

    .select-picker .channel-layout-select {
        width: 48%;
    }

    .select-picker .select-thumbnail {
        height: 5rem;
    }

    .select-picker .select-item:nth-child(-n + 2) {
        margin-bottom: 0;
    }

    .video-details-page {
        background-color: #FFF;
    }

    #top-banner {
        height: 100px;
    }
}

@media (max-width: 260px) {
    #primary_nav > .navbar-right > a.ml-1,
    #primary_nav > .navbar-right > .navbar-separate {
        display: none;
    }
}

@media (min-width: 40em) {
    .card {
        flex: 0 0 48%;
    }
}

@media (min-width: 768px) {
    .channel-dates {
        flex-direction: row;
    }

    .channel-dates div:first-child::after {
        content: '|';
        display: inline-block;
        margin-right: .25rem;
    }

    .content-video-details form {
        max-width: 90%;
        margin: 0 auto;
        overflow: unset;
    }

    .content-video-details hr {
        margin-left: -15%;
        margin-right: -15%;
    }

    .filterRow .input-group-append .btn,
    .filterRow .input-group-prepend .btn.filterDropdownBtn {
        width: 125px;
    }

    .page-header-title {
        display: flex;
        justify-content: space-between;
    }

    .reorder-text {
        margin-bottom: 0;
    }

    .select-picker .select-thumbnail {
        height: 6rem;
    }

    #sortBy {
        max-width: 180px;
    }

    #top-banner {
        height: 50px;
    }
}

@media (min-width: 992px) {
    .sidebar-collapsed {
        width: 64px;
        transform: translateX(calc(-100% + 64px));
        text-align: right;
    }

    .sidebar-collapsed > ul > li > a {
        padding-right: 10px;
    }

    .sidebar-collapsed ~ .main-content .search-bar-sticky {
        width: calc(100% - 64px);
    }

    .sidebar-collapsed ~ .main-content .search-bar-sticky #filters {
        padding-left: 3rem !important;
    }

    .sidebar-collapsed ~ .sidebar-shadow {
        transform: translateX(calc(-100% + 64px));
    }

    .sidebar-collapsed .sidebar-count,
    .sidebar-collapsed .jstree-ocl,
    .sidebar-collapsed .jstree-anchor *:not(i),
    .sidebar-collapsed .sidebar-add-btn,
    .sidebar-collapsed .sidebar-groups-add-btn,
    .sidebar-collapsed .sidebar-subtitle,
    .sidebar-collapsed .sidebar-title {
        display: none;
    }

    .sidebar-collapsed .sidebar-videos,
    .sidebar-collapsed .sidebar-screenshots,
    .sidebar-collapsed .sidebar-trash,
    .sidebar-collapsed .sidebar-users,
    .sidebar-collapsed .jstree-node .jstree-anchor {
        padding-left: 0;
    }

    table .cropped-text {
        white-space: nowrap;
    }

    .trial-badge {
        visibility: visible;
    }

    .video-details-page .action-navbar-wrapper,
    .channel-details-page .action-navbar-wrapper {
        display: flex;
    }

    .block-folder-path {
        background-color: #F6F6F6;
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: .5rem;
    }

    .brand-section,
    .dark-overlay,
    .sidebar-action-link,
    .sidebar-app-download {
        display: none !important;
    }

    .bulkIcons {
        margin-bottom: 0;
    }

    .channel-details-page {
        padding-top: 7rem;
    }

    .video-details-page .navbar, .channel-details-page .navbar {
        box-shadow: none;
    }

    .channel-details-page .search-bar-sticky {
        top: 120px;
    }

    .content-video-details form {
        max-width: 100%;
        padding: 1.5rem 10% !important;
        overflow: auto;
    }

    .filterSearchText {
        max-width: 250px;
    }

    .general-alert {
        width: 50%;
    }

    .page-header h1 {
        font-size: 2.5rem;
    }

    .page-header-hr {
        margin-top: 2rem;
    }

    .page-header-title {
        box-shadow: none;
    }

    .search-bar-sticky {
        width: calc(75% + 21px);
        padding-left: 21px;
    }

    .search-bar-sticky #filters {
        padding-left: 3rem !important;
    }

    .sidebar {
        background-color: #FFF;
        top: 120px;
        z-index: 799;
        height: calc(100vh - 120px);
        visibility: hidden;
    }

    .sidebar:hover {
        border-right: 2px solid #001D6C;
    }

    .sidebar:hover + .sidebar-collapse-icons {
        display: block;
    }

    .sidebar:hover + .sidebar-shadow {
        box-shadow: none;
    }

    .sidebar::-webkit-scrollbar {
        width: 12px;
        height: 12px;
        background: #FFF;
    }

    .sidebar:hover::-webkit-scrollbar-thumb {
        background: #BBB;
    }

    .sidebar::-webkit-scrollbar-thumb:horizontal:hover,
    .sidebar::-webkit-scrollbar-thumb:vertical:hover {
        background: #999;
    }

    .sidebar::-webkit-scrollbar-thumb:horizontal:active,
    .sidebar::-webkit-scrollbar-thumb:vertical:active {
        background: #777;
    }

    .sidebar-collapse-icons:hover {
        display: block;
    }

    .sidebar-content {
        padding-top: 1.5rem;
        min-height: calc(100vh - 120px);
    }

    .sidebar-box {
        background: #FFF;
        min-height: 100%;
        box-shadow: 0.1rem 0 0.2rem rgba(0, 0, 0, .15);
    }

    .sidebar-content, .sidebar:hover, .sidebar:focus {
        visibility: visible;
    }

    .sidebar-shadow {
        width: 25%;
        height: 100vh;
        box-shadow: 0.1rem 0 0.2rem rgba(0, 0, 0, .15);
        position: fixed;
        left: 0;
        top: 0;
        z-index: 798;
        background-color: #FFF;
    }

    .video-details-page {
        padding-top: 7rem;
        background-color: #F6F6F6;
    }

    .video-details-page .draggable {
        display: block;
        margin-right: .5rem;
    }

    .video-details-page .page-header {
        padding: 0 3rem;
    }

    .video-deteil-footer .btn-primary {
        max-width: 300px;
    }

    .video-details-page .main-content {
        padding-left: 1rem !important;
    }

    .sidebar-videos,
    .sidebar-screenshots,
    .sidebar-trash {
        padding-right: 17px;
    }

    .sidebar-videos,
    .sidebar-screenshots,
    .sidebar-trash {
        padding-right: 17px;
    }

    #actionNavbar > ul > li > a.current span::after {
        border-left: 9px solid transparent;
        border-right: 9px solid transparent;
        border-bottom: 10px solid #FFF;
        content: "";
        height: 0;
        left: -50%;
        top: 1.1rem;
        width: 0;
    }

    #table-items thead th,
    #table-folders thead th,
    #channels-table thead th,
    #table-users thead th,
    #subgroups thead th {
        position: sticky;
        position: -webkit-sticky;
        top: 188px;
        z-index: 700;
        background-color: #FFF;
    }

    #table-users thead th,
    #subgroups thead th {
        top: 123px;
    }
    .main-content.top-banner-shift {
        margin-top: 2rem;
    }
    .search-bar-sticky.top-banner-shift {
        top: 155px;
    }
    .top-banner-shift {
        margin-top: 1rem;
    }
}

@media (min-width: 1200px) {
    .btn-direct-copy {
        margin-right: 0.5rem;
    }

    .card .card-text.with-owner-icon {
        width: 70%;
        margin-top: -1.25rem;
    }

    .card-part-bottom {
        margin-top: -0.25rem;
    }

    .channels .card .card-text.with-owner-icon {
        margin-top: -1.5rem;
    }

    .content-video-details form {
        padding: 1.5rem !important;
    }

    .content-video-details hr {
        margin-left: -1.5rem !important;
        margin-right: -1.5rem !important;
    }

    .nav-pagination {
        flex-direction: row;
    }

    .text-pagination {
        margin-bottom: 0;
    }

  .content-column-container {
    margin-top: 2.5rem !important;
    margin-left: 30px;
    margin-right: 0;
    padding-right: 15px;
}

    .screencast-sections {
        margin-top: 2.5rem;
        border-left: 1px solid #EDEDED;
    }

    .screencast-sections-row {
        padding-right: 30px !important;
    }

    .search-bar-sticky {
        width: calc(83.333333% + 21px);
        padding-left: 21px;
    }

    .sidebar {
        max-width: 18.444444%;
    }

    .sidebar-shadow {
        width: 17.444444%;
    }

    .video-deteil-footer {
        margin-left: 15px;
        width: 39.5%;
    }

    #btn-save-order {
        margin-top: 0;
    }

    #top-banner {
        border: 0;
    }
    .main-content.top-banner-shift {
        margin-top: 4rem;
    }
    .search-bar-sticky.top-banner-shift {
        top: 125px;
    }
    .top-banner-shift {
        margin-top: 3rem;
    }
}

@media (min-width: 1200px) and (max-width: 1446px) {
  .sidebar-content-breakpoints ul li {
    padding-left: 2rem !important;
  }
}

@media (min-width: 1300px) {
    .sidebar {
        max-width: 17.444444%;
    }
}

@media (min-width: 1500px) {
    .card .card-text {
        width: 100%;
    }

    .card .card-text.with-owner-icon {
        margin-top: -1.5rem;
    }
}

@media (min-width: 88.125rem) {
    #videodetailplayer {
        min-height: initial;
        margin-bottom: 0;
    }
}

@media (min-width: 100em) {
    .card {
        flex: 0 0 20%;
    }
}

.user-circle.search {
    font-size: 12px;
    line-height: 23px;
    height: 23px;
    border-radius: 50%;
    width: 23px;
    font-weight: bold;
    display: inline-block;
}
#filter-menu .filter-menu-header {
    background-color: #f7f7f7;
    padding: .75rem 1.5rem;
    font-weight: 700;
    color: #4e4e4e;
    border-bottom: 1px solid lightgray;
    cursor: pointer;
}

#filter-menu .filter-item {
    padding: .75rem 1.5rem;
}

#filter-menu .filter-item + .filter-item {
    border-top: 1px solid lightgray;
}

#filter-menu #search_results {
    max-height: 300px;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
}
#filter-menu #search_results::-webkit-scrollbar {
    width: 2px;
}
#filter-menu #search_results::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #f1f1f1;
    border-radius: 3px;
}
#filter-menu #search_results::-webkit-scrollbar-thumb {
    background: #a0a0a0;
    border-radius: 3px;
}

.content-video-details-option #channelsForm .table thead th {
    color: #4A4A4A;
}

.content-video-details-option #channelsForm .table tbody th {
    font-weight: 300;
    text-transform: none;
    font-size: 16px;
}

.note-block {
    font-weight: normal;
}

.note-text {
    word-break: break-word;
}

#channelModalForm hr {
    margin: 1.5rem 0 1rem 0;
    color: #979797;
}

#usersVideoForm small,
#profile-dropdown .dropdown-item,
#profile-dropdown .dropdown-item-text small {
    font-weight: 300;
}
.folder-user-initials .user-circle {
    position: relative;
    top: -4px;
    right: 3px;
}

#sortBy {
    border-radius: .25rem;
}

@keyframes smoothScroll {
    0% {
        transform: translateY(-60px);
    }
    100% {
        transform: translateY(0px);
    }
}

@media not all and (min-resolution:.001dpcm) {
    @media {
        thead {
            text-align: left;
        }
    }
}

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) {
    @media {
        thead {
            text-align: left;
        }
    }
}

@supports (-moz-appearance:none) {
}
@media screen and (max-width: 1400px){
    #roles-box {
        flex-direction: column;
    }
    .user-classification-card {
        display: flex;
        flex-direction: row;
        padding-bottom: 0.5rem !important;
        padding-top: 0.5rem !important;
        text-align: left !important;
    }
    .user-classification-card > div > h4 {
        padding-left: 0.5rem !important;
    }
}