:root {
    --transcript-text-color:#6a7c92;
    --transcript-secondary-color: #EDEDED;
    --transcript-bg-color: #fff;
    --transcript-shadow-main: #EDEDED;
    --media-btn-color: #525C71;
    --rating-bg-color: #FAFAFA;
    --segment-highlighted-color: #fcf8e3;
    --media-ctrl-border-color: #EFEFEF;
    --modal-bg-color: #fff;
    --secondary-color: #221A64;
    --input-bg-color: #f8f9fa;
    --input-color: #525C71;
    --row-input-color: #525C71;
    --action-btn-bg-color: #efefef;
    --dropdown-bg-color: #fff;
    --item-row-bg-color: #fff;
    --item-row-bg-hover-color: #f6f9fa;
}
[data-theme="dark"] {
    --primary: #5EBE7B;
    --transcript-bg-color: #000 !important;
    --transcript-secondary-color: #3E3E3E;
    --font-color: #fff !important;
    --transcript-text-color:#fff;
    --transcript-shadow-main: #302ae6;
    --media-btn-color: #fff;
    --rating-bg-color: rgb(48, 48, 48);
    --segment-highlighted-color: #5E30C6;
    --media-ctrl-border-color: #6C6C6C;
    --modal-bg-color: #272727;
    --secondary-color: #5EBE7B;
    --input-bg-color: #3E3E3E;
    --input-color: #fff;
    --row-input-color: #3E3E3E;
    --action-btn-bg-color: #6d757c;
    --dropdown-bg-color: #868788;
    --item-row-bg-color: #3E3E3E;
    --item-row-bg-hover-color: #696969;
}

.liClassic, .liDemo, .liPremium{
    text-align: center;
}
.liDemo, .trDemo {
    display:none;
}

.editor-opt-list {
    float:left;
    width:auto;
    height:auto;
}
.editor-opt-list .editor-opt-selected {
    float:left;
    width:auto;
}
.editor-opt-list .editor-opts {
    float:left;
    width:100%;
    display:none;
    list-style-type: none;
    margin:28px 0 0 0;
    padding:0px;
    position: absolute;
    z-index:4000;
}
.editor-opt-list .editor-opts li {
    display: block;
    font-size:.8rem;
    border:1px solid #525C71;
    background-color: var(--transcript-bg-color);
    color: var(--transcript-text-color);
    width:100%;
    text-align: center;
}
.editor-opt-list:hover ul {
    display: block;
}

#mediaPlaybackContainer1 button {
    float:left;
    width:auto;
    background-color: pink;
}

#transcript-list {
    background-color: var(--transcript-bg-color);
}
#transcript-list b, #transcript-list #filesTbl tbody tr button {
    color: var(--transcript-text-color);
}
#transcript-list #filesTbl tbody tr {
    background-color: var(--item-row-bg-color);
    color: var(--transcript-text-color);
    border-color:none;
}
#transcript-list #filesTbl tbody tr:hover {
    background-color: var(--item-row-bg-hover-color) !important;
}
#transcript-list #search-container, #transcript-list #txtSearch {
    background-color: var(--input-bg-color) !important;
}
#transcript-list #filesTbl tbody tr input {
    color: var(--row-input-color) !important;
}
#transcript-list input {
    color: var(--input-color);
}
#transcript-list .file-action-btn, #transcript-list .btn-search-opt {
    background-color: var(--action-btn-bg-color) !important;
    color: var(--transcript-text-color) !important;
}
#transcript-list .file-actions-menu, #transcript-list .dropdown-menu {
    background-color: var(--action-btn-bg-color);
    color: var(--transcript-text-color) !important;
}
#transcript-list .file-actions-menu .dropdown-item, #transcript-list .dropdown-menu .dropdown-item {
    color: var(--transcript-text-color) !important;
}
#transcript-list .file-actions-menu .dropdown-item:hover, #transcript-list .dropdown-menu .dropdown-item:hover {
    color: var(--transcript-secondary-color) !important;
}
#transcript-list #filesTbl .btn-group button {
    background-color: var(--action-btn-bg-color);
    color: var(--transcript-text-color) !important;
}
#transcript-list #filesTbl .btn-group .btn-primary {
    color: #fff !important;
}
#transcript-list #filesTbl .btn-group .btn-default:hover {
    background-image: linear-gradient(to right, #B8376D 0%, #E95C68 100%);
    color: white !important;
}
.page-label {
    font-size:13px;
}

#lblCurrentSpeaker {
    color: var(--secondary-color) !important;
}

.theme-switch-wrapper {
    float: left;
    width: 160px;
    height:24px;
    margin-top:2px;
}
.theme-switch-wrapper span {
    margin-top:2px;
    margin-left: 22px;
    font-size: .8rem;
    float:left;
    /* text-align: center; */
}
.theme-switch {
    display: inline-block;
    height: 100%;
    position: relative;
    width: 150px;
  }
  
  .theme-switch input {
    display:none;
  }

  .theme-switch .slider {
      float:left;
      width:100%;
  }
  
  .theme-switch .slider:before {
    height: 15px;
    width: 15px;
    top: 4px;
    left: 4px;
    bottom: 4px;
  }
  .theme-switch input:checked + .slider:before {
    -webkit-transform: translateX(126px);
    -ms-transform: translateX(126px);
    transform: translateX(126px);
  }

body, html{
    height:100%;
    scroll-behavior: smooth;
    background-color: var(--transcript-bg-color) !important;
    /* font-family: 'Roboto', sans-serif !important; */
}

.page {
    margin-top:20px;
}

.uploadOpt {
    border:1px solid rgb(230, 230, 230);
    border-radius: 5px;
}

hr {
    border:1px solid #28a745;
    width:250px;
    margin-top:35px;
    margin-bottom:35px;
}

#tranTitle {
    color: var(--transcript-text-color);
}

.editor-content{
    margin: 9px 40px;
}

.segment, .segment .speaker-row, .segment .content{
    float:left;
    width:100%;
}
.segment {
    margin-bottom:17px;
    font-family: Roboto, Ubuntu !important;
    line-height: 1.5rem;
    font-size: 0.9rem;
    color:#4a4a4a;
    /* white-space: pre-wrap;
    overflow-wrap: break-word; */
}
/* .segment .speaker-row {
    margin-bottom:9px;
} */
.segment .speaker-lbl {
    color:#4a90e2;
}
.speaker-lbl:hover , .time-stamp:hover{
    color:#2a4479;
    cursor: pointer;
}
/* .segment .fa-caret-right, .segment .time-stamp {
    color:#888;
    margin-left:5px;
} */
.segment .content .ql-editor:hover {
    cursor: text;
}
.current-segment .content {
    background-color:#f8f8aa;
}

.modal-content {
    background-color: var(--modal-bg-color);
    color: var(--font-color);
}
.modal-content label, .modal-content p, .modal-body p, .wStep {
    color: var(--font-color);
}

.modalCustom {
    display:none;
    position: absolute;
    padding:21px;
    width:250px;
    height: auto;
    color: var(--font-color);
    background-color: var(--modal-bg-color);
    border:1px solid var(--media-ctrl-border-color);
    border-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(212, 212, 212, 0.2), 0 6px 20px 0 rgba(223, 223, 223, 0.19);
}
.modalCustom .form, .modalCustom .form .form-section {
    float:left;
    width:100%;
}
.modalCustom .form .form-section input {
    float:left;
}
.modalCustom .form .form-section label {
    float:left;
    margin-left:5px;
    font-size:.8rem;
}
.modalCustom .form .btn {
    float:right;
    /* color:#4a90e2; */
    outline:0;
}
.modalCustom .form .btn:focus {outline:0;}
/* .modalCustom .form .btn:hover {
    color:#2a4479;
} */

.file-actions {
    float:right;
}
.file-actions-menu{
    display: none;
    position: absolute;
    background-color:white;
    border:1px solid #e9ecef;
    border-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(212, 212, 212, 0.2), 0 6px 20px 0 rgba(223, 223, 223, 0.19);
    z-index:2000;
    margin-left:-50px;
}
.file-actions-menu .dropdown-item {
    line-height: 1.25rem;
    color:#4a4a4a;
}
.file-actions-menu .dropdown-item a {
    color: #4a4a4a;
}
.file-actions-menu .dropdown-item:hover {
    cursor: pointer;
}
.file-actions:hover .file-actions-menu {
    display: block;
}

.folder-list-modal .folder-list{
    float:left;
    width:100%;
    margin:0px;
    padding:0px;
    list-style-type: none;
}
.folder-list-modal .folder-list .folder-list-item {
    float:left;
    width:100%;
    border-bottom:1px solid #e9ecef;
    padding:5px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 20px;
    color: var(--transcript-text-color) !important;
}
.folder-list-modal .folder-list .folder-list-item:last-child{
    border-bottom:none;
}
.folder-list-modal .folder-list .child{
    padding-left:10px;
}
.folder-list-modal .footer {
    float:left;
    width:100%;
}
.folder-list-modal .footer .actions {
    float:right;
}

#folderBreadcrums {
    margin:0px;
    float:right;
    list-style-type: none;
    width: 100%;
}
#folderBreadcrums li {
    float:right;
    padding:8px;
}

.pod-sort{
    display:none;
}
.sort:hover{
    cursor: pointer;
}
.sort .active {
    display:block;
}
.sort span {
    float:left;
}
.sortOpts {
    margin-left:4px;
}
.sortOpts .fa-sort-up {
    margin-top:7px;
}

.deliveryOpt, #ptTblUploads, .ul-checkout-breadcrumb {
    font-size: 0.8em;
}
.deliveryOpt .deliveryRdOpt, .deliveryOpt .transcribeRdOpt, .verbatimOpt, .deliveryOpt .deliveryRushOpt {
    float:left;
}
.deliveryOpt .optText {
    float:left;
    padding:0 8px;
    margin-top:-4px;
    width: 90%;
}
.deliveryOpt label{
    font-weight: 500;
}
.deliveryOpt .optText span {
    margin-top:-8px;
    color:#828487;
    float:left;
}

.fa-trash:hover {
    color:red;
    cursor: pointer;
}
.dictionary-icon:hover, .editor-actions .tran-action:hover {
    color:#28a745;
    cursor: pointer;
}
.file-mins {
    margin-top:-3px;
    float:left;
}

.checkoutContainer {
    margin-top:70px;
}

.ul-checkout-breadcrumb {
    float:right;
    width:auto;
    margin:0px;
    padding:0px;
    list-style-type: none;
}
.ul-checkout-breadcrumb li {
    float:left;
    width:auto;
    margin:5px;
}

.my-card {
    font-size:0.9em;
    font-weight: 400;
    padding:10px;
    margin-bottom:8px;
    color:white;
    width:auto;
    float:left;
    background-color:#2f3a4d;
}

#registerForm form, #loginForm from {
    width:100%;
    float:left;
}

.price {
    color:red;
    font-weight: 600;
}
.total {
    color:red;
    font-size:1.8rem;
}


.my-files .file-list-container {
    margin:0px;
    padding:0px;
}
.my-files .file-list-container ul{
    margin:0px;
    padding:0px;
    float:left;
    width:100%;
    list-style-type: none;
}
.my-files .file-list-container ul li {
    float:left;
    width:100%;
    padding:13px;
    border-bottom: 1px solid #e9ecef;
}
.my-files .file-list-container ul li:last-child{
    border-bottom: none;
}
.my-files .file-list-container ul li .file {
    float:left;
}
.my-files .file-list-container ul li .price {
    float:right;
}

.paypal-btn {
    background-color:#ffc439;
    padding:5px;
    float:left;
    border-radius: 8px;
}
.paypal-btn img {
    float:left;
}

.disableDeliveryOpt {
    text-decoration: line-through;
    text-decoration-color: red;
}

textarea {	
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;	
    width: 100%;
    height: 20vh;
}

.loader {
    margin-right:8px;
}

.my-modal {
    width:80% !important;
    max-width: none !important;
}

.transcript-body {
    /* height:80%; */
    overflow-y: scroll;
    text-indent: 50px;
}

.file-action-btn {
    border:1px solid #e9ecef;
    border-radius: 5px;
}
.file-action-btn:focus {
    outline: none;
}

#txtSearch:focus {outline:none;}

#tbl-file-body {
    color:#4a4a4a;
    line-height: .875rem;
}

.paging {
    font-size:.789rem;
}
.paging a {
    margin-right:7px;
}
.paging .inactive {
    color:#bababa;
    cursor: default;
}

.editor-toolbar .editor-opt {
    background-color: var(--transcript-bg-color);
}
.folder-row:hover, .file-row:hover, .folder-list li, .gs-table-body-default tr:hover{
    background-color: var(--item-row-bg-hover-color);
    cursor: pointer;
}

.modal-body .footer {
    margin-top:5px;
}

.selected {
    background-color:#007bff;
    color:white;
}
.selected:hover {
    color:#333;
}

.dictionary-link:hover, .speakerCount-link:hover {
    cursor: pointer;
}


.folder-list li .fa-folder {
    margin-right:7px;
}

.nav-item {
    position: relative;
  display: inline-block;
}
.sub-menu1 {
    display:none;
    margin:0 0 0 -50px;
    padding:0px;
    list-style-type: none;
    position: absolute;
    background-color:white;
    border:1px solid #e7e7e7;
    border-radius: 3px;
    min-width:200px;
}
.sub-menu1 li {
    float:left;
    width:100% !important;
    border-bottom: 1px solid #e7e7e7;
    display:block;
}
.sub-menu1 li a {
    padding:5px 9px;
    width:100%;
    float:left;
    color:#3E3E3E;
}
.sub-menu1 li a:hover {
    background-image: linear-gradient(to right, #57B7A6 0%, #5EBE7B 100%);
    color:white !important;
}
.sub-menu1 li:last-child{
    border-bottom: none;
}
.menu-item:hover .sub-menu1 {
    display:block;
    left:0;
}

.authToggle {
    color:#007bff;
}
.authToggle:hover{
    cursor: pointer;
}

.media-ctrl, .media-control {
    float:left;
    width:100%;
    /* height:16.00rem; */
    border:1px solid #e9ecef;
    border-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(212, 212, 212, 0.2), 0 6px 20px 0 rgba(223, 223, 223, 0.19);
    padding:8px;
}
.media-ctrl .media-screen {
    width:100%;
    height: auto;
    border-radius: 5px;
    border:1px solid #ccc;
    position: relative;
}
.media-control .media-overlay {
    opacity:.98;
    float:left;
    width:100%;
    height:100%;
    background-color:white;
    position:absolute;
    border:1px solid #eee;
}
.media-ctrl .media-inputs {
    float:left;
    width:100%;
    height: 2.8rem;
    border-radius: 5px;
    border:1px solid #ccc;
    bottom:0px;
}
.media-screen-overlay .tab, .media-control .media-overlay .playback-rate {
    float:left;
    width:100%;
    height:auto;
    padding:5px;
}
.media-control .media-overlay .playback-rate {
    float:left;
    margin:9px 0 0 0;
    height:100%;
    text-align: center;
    line-height: 100px;
}
.media-control .media-overlay .playback-rate button {
    vertical-align: middle;
    display:inline-block;
    line-height: 1.5;
}
.media-control .audioControlContainer {
    height:100px;
}
.controls {
    width:600px;
    height:8.0971659919028340080971659919028%; /* of figure's height */
    position:relative;
    margin-top: 10px;
    background-color: var(--transcript-bg-color);
 }
 .controls[data-state=hidden] {
    display:none;
 }
 
 .controls[data-state=visible] {
    display:block;
 }
 .controls > * {
    float:left;
    height:100%;
    display:block;
 }
 .controls > *:first-child {
    margin-left:0;
 }
 .controls .progress-container {
    width:68.60%;
    margin-top:5px;
}
.controls .progress-container .duration-ctrls {
    float:left;
    width: 100%;
    color:#888;
    font-size:12px;
}
.controls .progress-container .duration-ctrls #current-duration {
    float:left;
}
.controls .progress-container .duration-ctrls #total-duration {
    float:right;
}
 .controls .progress {
    cursor:pointer;
    width:100%;
    height:.28rem;
    float:left;
    background-color:red !important;
 }
 .controls button {
    width:28px;
    border:none;
    cursor:pointer;
    background:transparent;
    background-size:contain;
    background-repeat:no-repeat;
    color:#888;
 }
 .controls button:focus {
     outline: none;
 }

 .controls .progress progress {
    display:block;
    width:100%;
    height:auto;
    /* margin-top:0.125rem; */
    border:none;
    color:#0095dd;
    background-color: #7E89A2 !important;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
    float:left;
 }
 .controls progress[data-state="fake"] {
    background:#4F5C79 !important;
    height:65%;
 }
 .controls progress span {
    width:0%;
    height:100%;
    display:inline-block;
    background-color:#5EBE7B;  
 }
 .controls progress::-moz-progress-bar {
    background-color:#5EBE7B;
 }
 
 .controls progress::-webkit-progress-value {
    background-color:#5EBE7B;
 }

 .subscription-options {
     float: right;
     width:auto;
     list-style-type: none;
     margin:0 0 0 15px;
     padding:0px;
 }
 .subscription-options li {
     float:left;
     width:auto;
     margin-left:5px;
     margin-right:5px;
 }
 .subscription-table .subscription-highlight {
    color:#007bff;
 }

 .text-disabled label, .text-disabled span {
    text-decoration: line-through;
 }

 .uploadAmountError{
     color:red;
     text-decoration: line-through;
 }

 .highlightWord {
     color:white;
     background-color: #28a745;
     padding:4px;
     border-radius: 4px;
 }

 .media-control {
    top: 80px !important;
    position: sticky !important;
    position: -webkit-sticky;
 }
 .sticky-offset-toolbar {
    top: 130px !important;
}

/* New Editor layout */
#editorLayout {
    margin-top:-20px;
    float:left;
    width:100%;
    height:100%;
    background-color:var(--transcript-bg-color) !important;
    color: var(--font-color);
    /* background-image: linear-gradient(to bottom, rgba(255,0,0,0), var(--transcript-bg-color)) !important; */
}
#editorLayout b, #editorLayout strong, #editorLayout u, #editorLayout s {
    color: var(--font-color);
}
#editorLayout #userActionsContainer {
    background-image: linear-gradient(to right, #57B7A6 0%, #5EBE7B 100%);
    color:white;
    padding:13px;
}
#editorLayout #userActionsContainer .actionsList {
    /* margin:auto 0; */
    float:left;
    list-style-type: none;
    margin:0px;
    width:auto;
}
#editorLayout #userActionsContainer .actionsList li {
    float:left;
    width:auto;
    padding-left:23px;
    font-size:18px;
}
#editorLayout #mediaContainer {
    background-color: var(--transcript-bg-color);
    color:#A2A2A2;
    min-height:120px;
    border-bottom: 1px solid var(--transcript-secondary-color);
    box-shadow: -6px 0 var(--transcript-bg-color), 6px 0 var(--transcript-bg-color), 0 7px 15px -2px var(--transcript-secondary-color);
}
#editorLayout .scroller, #editorLayout .scroller .ql-editor {
    color: var(--transcript-text-color);
}
#editorLayout .speaker-row {
    color:#C3C7CB;
    font-size:1rem;
    font-weight: 530;
}
#editorLayout .speaker-row .speaker-lbl {
    color:#5EBE7B;
}
#editorLayout .speaker-row .fa-caret-right {
    margin-top:4px;
}
#editorLayout .speaker-row .timestamp-text {
    color:#E95C68;
    margin:0 5px;
}
#editorLayout button, #editorLayout .controls button {
    width:42px;
    height:42px;
    height:auto;
    border:1px solid var(--transcript-bg-color);
}
/* #editorLayout .controls button:hover {
    border:1px solid #ccc;
} */
#editorLayout .editor-toolbar {
    width:auto;
    padding:4px 0px;
    float:left;
}
#editorLayout .controls button, #editorLayout .controls button svg, #editorLayout .editor-toolbar button {
    color: var(--media-btn-color);
    font-size:1.06rem;
}
#editorLayout .controls button svg, .editor-opt svg {
    width: 1em;
    height:1em;
    fill:var(--media-btn-color);
    color:var(--media-btn-color);
}
#editorLayout button:hover, .editor-opt:hover {
    border:1px solid #7E89A2 !important;
}
#editorLayout #ratingContainer {
    padding:23px 0;
    margin:30px;
    background-color: var(--rating-bg-color);
}
#editorLayout #ratingContainer #rating {
    width:200px;
    margin:auto;
    text-align: center;
}
.editor-toolbar .editor-opt {
    padding-right: .6rem;
    padding-left: .6rem;
    height:auto;
    width:42px;
    border:1px solid var(--transcript-bg-color);
    /* border-right:1px solid #e9ecef; */
    font-size:0.9rem;
    float:left;
}
.editor-toolbar .editor-opt:focus {
    outline:0;
}
.editor-toolbar .editor-opt:last-child, .no-border{
    border:none !important;
}
.editor-toolbar .editor-opt:hover {
    color:#28a745;
    cursor: pointer;
}


#editorLayout button:hover, .litest:hover, .actionsList li:hover {
    opacity:0.5;
    cursor: pointer;
 }
 #editorLayout .controls button:focus {
     border-color:#5EBE7B !important;
     color:#5EBE7B !important;
 }

 .litest {
    width:42px !important;
    height:auto !important;
    font-size:1.06rem;
    background-color: var(--transcript-bg-color);
    color: var(--transcript-text-color);
}

.ctrlDivider{
    width:56%;
    border-top:1px solid var(--media-ctrl-border-color) !important;
}

.ql-editor {
    padding: 0px 20px !important; /* padding: 12px 20px !important; */
    font-size:16px;
    color: var(--transcript-text-color);
    word-spacing: 0.13rem !important;
}
.ctrlsContainer {
    margin-left:-13px;
}

/* Styling for modals */
.modal .modal-header {
    background-color:#5EBE7B;
}
.modal .modal-header .modal-title, .modal .modal-header .close {
    color:#fff;
}
.modal .large-modal {
    max-width: 800px !important;
    width:800px;
}
.wStep .stepTitle {
    color:#8692AC;
    margin-left:auto;
    margin-right:auto;
    text-align: center;
}
.wStep img {
    display: block;
  max-width:150px;
  max-height:150px;
  width: auto;
  height: auto;
    margin:0 auto;
    text-align: center;
    image-rendering: -webkit-optimize-contrast;
}
.wStep p, .wStep b {
    /* color:#919BA0; */
    font-size:0.9rem;
    line-height:1.3rem;
    /* font-weight: 500; */
}
.wStep h6, .wStep p, .wStep b {
    text-align:center;
}
.wStep b {
    height:2rem;
}
.modal .wizard-btns {
    width:91px;
    margin:0 auto;
}
.modal .wizard-btns .wbtn {
    width:2.5rem;
    height:2.5rem;
    margin:0 0.1rem;
    border:none;
    image-rendering: -webkit-optimize-contrast;
}
.modal .wizard-btns .wbtn:focus {
    outline: none;
}
.modal .wizard-btns .wbtn:hover {
    cursor: pointer;
    opacity: 0.5;
}
.modal .wizard-btns .prev-btn[disabled] {
    background: url('./images/prev-step-inactive-btn@2x.png') top right no-repeat;
    background-size: contain;
}
.modal .wizard-btns .prev-btn {
    background: url('./images/prev-step-active-btn@2x.png') top right no-repeat;
    background-size: contain;
}
.modal .wizard-btns .next-btn[disabled] {
    background: url('./images/next-step-inactive-btn@2x.png') top right no-repeat;
    background-size: contain;
}
.modal .wizard-btns .next-btn {
    background: url('./images/next-step-active-btn@2x.png') top right no-repeat;
    background-size: contain;
}
.btn-secondary {
    background-color: transparent;
    border:1px solid #C6C6C6;
    color:#C6C6C6;
}
.btn-secondary:hover {
    border:1px solid #444;
    background-color: transparent;
    color:#444;
}

.modalCustom .btn {
    margin:4px 4px 0 0;
}

.modal-header {
    padding:0.5rem !important; 
}
.modal-header .modal-title {
    margin-left:10px;
}
.modal-header .close {
    padding:1rem 1.5rem !important;
}

.editor-actions li {
    float:left;
}
.editor-actions .tran-action, .fa-file-download1 {
    /* padding:0 3px; */
    font-size:1.06rem !important;
    width: 42px !important;
    height: 29px !important;
    padding: 0 .6rem !important;
}
.editor-actions .btn-download-tran ul {
    display:none;
}
.editor-actions .btn-download-tran ul li {
    float:left;
}
.editor-actions .btn-download-tran:hover ul {
    display:block;
    z-index: 1200;
}
.editor-actions .btn-download-tran .ulDownloadOpts {
    background: #28a745;
    float:left;
    /* width:100%; */
    list-style-type:none;
    position:absolute;
    left: -100px; 
    padding:0px;
    margin:0px;
    border:1px solid #e9ecef;
}
.editor-actions .btn-download-tran .ulDownloadOpts li{
    float:left;
    width:100%;
    text-align:left;
    background-color:#fff;
    padding:8px;
    border-bottom:1px solid #e9ecef;
}
.editor-actions .btn-download-tran .ulDownloadOpts li:last-child{
    border-bottom:none;
}
.editor-actions .btn-download-tran .ulDownloadOpts li:hover {
    position: relative;
    cursor: pointer;
}

.my-test .editor-toolbar {
    float:left;
    margin-bottom: 1.5rem!important;
}


.media-control, .editor-ctrl-section {
    border:1px solid #e9ecef;
    border-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(212, 212, 212, 0.2), 0 6px 20px 0 rgba(223, 223, 223, 0.19);
}
.media-control, .editor-ctrl-section {
    padding:7px;
    margin-bottom:5px;
}
.media-control video:focus {outline:0;}

.editor-ctrl-section {
    padding:13px;
}
.editor-ctrl-section p {
    font-size:0.8rem;
    color:#555;
    font-family: Roboto, Ubuntu !important;
}

.editor-toolbar .editor-group {
    float:left;
    margin-right:8px;
}

.ql-container {
    font-family: Roboto, Ubuntu !important;
    float:left;
    width:100%;
}
tt{
    font-family: Roboto, Ubuntu !important;
}

.opt-list {
    float:left;
    margin:0px;
    list-style-type:none;
    width:42px !important;
}
.opt-list li:hover ul {
    display:block;
}
.opt-list ul li {
    border:1px solid #525C71;
    background-color: var(--transcript-bg-color);
    color: var(--transcript-text-color);
    float:left;
    width:100%;
    z-index:4000;
}
.opt-list ul li .editor-opt {
    padding-right: .4rem;
    padding-left: .4rem;
}
.opt-list li{
    position: relative;
    padding:3px 0;
    margin:0px;
    text-align: center;
}
.opt-list ul {
    display:none;
    float:left;
    position: absolute;
    list-style-type: none;
    margin:2px 0 0 0;
    left:-51px;
    width:auto;
}

.ql-editor {
    line-height: 1.5rem;
    font-size: 0.9rem;
    color:var(--transcript-text-color);
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

.mediaInsert {
    /* height: 100%; */
    width: 100%;
    /* vertical-align: top;*/
    position: relative; 
}

.folder-list-item .selected {
    background-color:#007bff;
    color:white;
}

.invalid-feedback{
    display:none;
}

/* .speaker-lbl, .fa-caret-right, .time-stamp, .time-ended {
    float:left;
} */
.btn-edit-timestamp{
    float:right;
}
.fa-caret-right{
    margin-top:5px;
}
/* .time-stamp {
    margin-top:-1px;
} */

.time-stamp:hover~.btn-edit-timestamp1 {
    display:block;
}
.btn-edit-timestamp {
    display: none;
    margin-left:5px;
    color: var(--secondary-color);
}
.btn-edit-timestamp:hover {
    cursor: pointer;
}

.timestamp-input {
    border:1px solid #ccc;
    padding:3px;
    float:left;
    width:100%;
}
.timestamp-input input[type="number"] {
    float:left;
    width:3.5em;
    text-align: center;
    border:none;
    color:#4a4a4a;
}
.timestamp-input input[type="number"]:focus {
    outline: none;
}

.timestamp-input span {
    float:left;
    width:auto;
    height:30px;
    margin:3px;
}
.timestamp-input span::after {
    content: ":";
    color: #ccc;
}
.timestamp-input span:last-child::after {
    content: ""
}

.segment-options {
    float:left;
    margin:5px 8px 0 0;
}
.segment-options input[type="checkbox"] {
    float:left;
}

.segmentToMerge {
    background: #FF9DA5; color: #FFF;
}
.segmentToMerge .ql-editor {
    color:white !important;
}

.pay-hover {
    color:#007bff;
}
.pay-hover:hover {
    cursor: pointer;
}

.adminApprovalActions svg, .pEditorActions svg {
    color:#2D7913;
    fill:#2D7913;
}
.fa-times-circle {
    color:red;
}

.tranProcessing td {
    color:#ccc;
}
.tranProcessing .badge-secondary {
    background-color:#ccc;
}

#wpwrap{
    background-color:whitesmoke;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider {
    background-color: #2196F3;
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }

  .icon-col, .w-100, .uploaded-col {
      margin-top:3px;
  }

    #txtSearch:focus {
        outline: none;
    }

#shortcutModal {
    font-size: .8rem;
}
.cmdHint {
    padding:8px;
    background-color:#eee;
    color:#555;
    border:1px solid #c4c4c4;
    border-radius: 3px;
    font-weight: bold;
}
.cmdHint .pSvg {
    width:1.3rem;
    height:1.3rem;
    fill:#555;
    margin-top:-2px;
}
.cmdHint svg * {
    width:100%;
    height:100%;
}

#ratingsContainer {
    text-align:center;
    width:15%;
    margin:auto;
    display:none;
}
#ratingsContainer #defaultRatingText {
    font-size:0.9rem;
}
#ratingsContainer #divRatings {
    float: left;
    width:100%;
    font-size:2rem;
}

#ratingsContainer .fa-star {
    color:#c2d8e4;
}
#ratingsContainer .checked {
    color:#ffc800;
}
#ratingsContainer .fa-star:hover {
    cursor: pointer;
    color:#ffc800;
}

#highQyLnk:hover {
    cursor: help;
}

.active .fa-stopwatch, .active .fa-concierge-bell {
    color:#5EBE7B !important;
}

.uploadProgressBar {
    position: absolute;
    width: 50%;
    height: 100%;
    background-image: linear-gradient(to right, #B8376D 0%, #E95C68 100%);
    color: white;
}
 
#uploadModal .cancel:hover {
    cursor: pointer;
}

#walkthrough-body {
    color:#8D8D8D;
    width: auto;
    height: auto;
}
#walkthrough-body {
    font-size:15px;
}
#walkthroughContainer {
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 30px 40px;
    width: auto;
    height: auto;
    max-width: 650px;
}
#walkthroughContainer h6 {
    font-size:18px;
    margin-bottom: 8px;;
}
.walkthroughEle {
    border: 2px solid #2680EB !important;
    outline-style: solid;
    outline-color: #2196F3;
    background-color:var(--transcript-bg-color) !important;
    position: relative;
    z-index: 1051 !important;
    left: 0;
}
#walkthroughContainer .wFooter span {
    font-size: .8em;
    color: #2680EB;
}
#walkthroughContainer .wFooter span:hover {
    cursor: pointer;
}
.walkthrough-caret {
    /* margin-top:-46px; */
    /* margin-left: -20px;
    left:0px; */
    /* position: relative;
    float:left; */
}
.walkthroughInfo:hover {
    cursor: pointer;
}

@media only screen 
    and (min-device-width : 320px) 
    and (max-device-width : 480px) {

        .trans-table {
            font-size: .95rem;
            margin-left:-5px;
        }
        .trans-table .w-100 {
            max-width: 83px;
            word-wrap:break-word;
        }
        .trans-table .uploaded-col1 {
            width:85px;
        }
        .trans-table .download-col1 {
            margin:0px;
            padding:0px;
            max-width: 30px;
        }
        .page-content {
            padding-right:2px;
            padding-left:2px;
        }

        .sticky-offset-audio {
            position: sticky;
            position: -webkit-sticky;
            top: 78px !important;
            z-index:1000;
        }
        .sticky-offset-toolbar {
            top: 130px !important;
        }
        .controls button {
            width:9.0%;
        }
        .controls .progress-container {
            width:43.50%;
            margin-top:5px;
        }
        .controls .progress {
            cursor:pointer;
            width:100%;
        }

        .sub-menu1 {
            display:block;
            position: relative;
            width: 100%;
            float:left;
            margin:0px;
            left:-10px;
            right:0;
            border:none;
            background-color: black;
        }
        .sub-menu1 li {
            border:none;
        }
        .sub-menu1 li a {
            color:#808080;
        }

        .subscription-options li {
            float:left;
            width:auto;
            margin-left:0px;
            margin-right:0px;
        }

        /* New Editor layout */
        #editorLayout {
            margin-top:-25px;
            background-color:var(--transcript-bg-color);
        }
        #editorLayout button {
            height:50px;
        }
        /* #editorLayout #userActionsContainer {
            height:80px;
        } */
        #editorLayout #userActionsContainer .actionsList {
            padding-top:4px;
        }
        #editorLayout #userActionsContainer .actionsList li {
            font-size:28px;
        }

        .editor-content{
            margin: 9px;
        }
        .ctrlDivider{
            width:93%;
        }
        .controls {
            width:100%;
            margin-top:0px;
        }
        .media-ctrl2 {
            margin-bottom:4px;
        }

        .ctrlsContainer {
            margin-left:0px;
        }
        #editorLayout .controls button, 
        #editorLayout .controls button svg, 
        #editorLayout .editor-toolbar button,
        .opt-list li {
            font-size:1.30rem;
        }

        .opt-list {
            height:50px !important;
            margin-top:3px !important;
        }
        .fa-file-download1  {
            vertical-align: middle;
            font-size:1.30rem !important;
        }


        .modal .large-modal {
            max-width: auto !important;
            width:auto;
        }

        .wStep img {
            /* width:200px;
            height:200px; */
            text-align: center;
        }
        
        .checkoutDiv {
            margin-top:0px;
        }
        .checkoutContainer {
            margin-top:0px;
        }
        .media-control {
            width:100%;
        }

        #ratingsContainer {
            margin-top:0px;
        }

        .cmdHint {
            float:left;
            margin-top:5px;
        }

        .sort span {
            font-size:.7rem;
        }

        #ratingsContainer {
            text-align:center;
            width:100%;
            margin:auto;
            display:none;
        }
        /* #divRatings{
            font-size:42px;
        } */
        
        .editor-toolbar .editor-group {
            margin-right:0px;
        }

        .theme-switch-wrapper {
            margin-top: 15px;
        }
    }
@media only screen 
    and (min-device-width : 768px) 
    and (max-device-width : 1024px) {
        
}