.vpl-admin{
	/*margin:0;
	padding:0;*/
	/*background: #fff;*/
	/*margin-bottom: 20px;*/
    overflow: hidden;
    font-family: Arial, "Helvetica Neue",sans-serif;
}
.vpl-bg{
    background: #fff;
    padding-left: 20px;
}
.vpl-admin-inner{
	margin-left: 20px;
}
.vpl-admin .form-table button{
    padding: 5px;
}
.vpl-admin .form-table th{
	width: 300px;
	font-weight: normal;
}
/*
.vpl-admin .form-table td{
    margin-bottom: 9px;
    padding: 15px 10px;
    vertical-align: middle;
}
.vpl-admin .form-table td p{
    margin-top: 4px;
    margin-bottom: 0;
}*/
.vpl-admin .form-table td input[type=text],
.vpl-admin .form-table td input[type=password],
.vpl-admin .form-table td input[type=number],
.vpl-admin .form-table textarea,
.vpl-admin .form-table select{
	width: 300px;
}


.playlist-items-type-info,
.controls-type-info,
.playlist-position-info,
.navigation-type-info{
	display: none;
}
.vpl-admin .info{
	font-size: 13px;
}
.vpl-admin .info-light{
	font-size: 13px;
	color: #acacaa;
}
.vpl-admin .info-highlight{
	font-size: 13px;
	color: #d9534f;
}
.vpl-admin .info-highlight2{
	font-size: 13px;
	font-weight: bold;
}
.vpl-admin .option-closed{
	height: 40px;
	overflow: hidden;
}
.vpl-admin .option-tab{
	overflow: hidden;
    background: #fff;
}
.vpl-admin .option-tab-divider{
	height: 20px;
	background: #f1f1f1;
}
.vpl-admin .option-toggle{
	height: 40px;
	background: #0073aa;
	cursor: pointer;
}/*
.vpl-admin .option-toggle input[type="checkbox"]{
    position: absolute;
    left: 15px;
    top: 16px;
}
.vpl-admin .option-toggle-wrap{
    position: absolute;
    right: 0;
    top: 0;
    left: 40px;
}*/

.option-content-box{
    border: 1px solid #ccd0d4;
    padding: 10px;
}





.vpl-admin .option-title{
	line-height: 40px;
    font-size: 15px;
    color: #fff;
    margin-left: 15px;
    font-weight: bold;
}
.vpl-admin .option-content:not(.vpl-edit-playlist){
	margin-left: 25px;
    margin-bottom: 25px;
    margin-right: 25px;
}

/* pagination */

.vpl-stat-pagination-wrap,
.vpl-pagination-wrap {
    position: relative;
    display: flex;
    justify-content: flex-end;
}
.vpl-pagination-container {
    position: relative;
    display: inline-flex;
    justify-content: space-between;
    box-sizing: border-box;
    margin-left: 15px;
}
.vpl-pagination-page {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: center;
    margin-left: 5px;
    cursor: pointer;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 3px;
    padding: 8px 12px;
    color: #333;
    transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}
.vpl-pagination-currentpage{
    cursor: default!important;
}
.vpl-pagination-dots{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: center;
    margin-left: 5px;
    box-sizing: border-box;
}
.vpl-pagination-total{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: center;
    margin-left: 5px;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 3px;
    padding: 8px 12px;
    color: #333;
    white-space: nowrap;
}
.vpl-pagination-page:hover,
.vpl-pagination-currentpage {
    background:#0073aa;
    color: #fff!important;
}
.vpl-pagination-hidden{
    display: none;
}
.vpl-pagination-page{
   
}
#vpl-stat-pag-per-page-num{
    margin: 0 5px;
    width: 70px;
}

.vpl-filter-shown{
    display: table-row;
}
.vpl-filter-hidden{
    display: none;
}


.vpl-table tbody tr:not(.vpl-stat-graph-holder-row):not(.vpl-item-disabled):hover {
    background: #f2f5f6;
}


.vpl-table td {
    vertical-align: middle;
}
.vpl-table .vpl-media-all,
.vpl-table .vpl-player-all,
.vpl-table .vpl-playlist-all{
    margin: 0; 
    vertical-align: middle; 
}
.vpl-table .ui-sortable-helper {
    display: table;
}
.list-actions{
    margin-bottom: 5px;
    display: flex;
    flex-direction:row;
   /* justify-content:space-between;*/
}
.list-actions button{
    cursor: pointer;
}
.list-actions-wrap{
    display: flex;
    flex-direction:row;
    margin: 5px 0; 
}
.list-actions-left > *{
    margin-right: 3px;
}
.list-actions-right > *{
    margin-left: 3px;
}
.list-actions-inner{
    display: flex;
    flex-direction: row;
}
.list-actions-inner > *{
    margin-right: 3px;
}

#playlist-selector-wrap{
    margin: 10px 0 10px 20px;
    display: none;
}
#playlist-selector-wrap select, #playlist-selector-wrap button{
    vertical-align: middle;
}
#playlist-selector-wrap button{
    cursor: pointer;
}


.msort{
	cursor: move;
}
.ui-sortable-helper{/*tr width shrinks while dragging*/
    display: table;
}
#preset-preview{
	display: block;
}
.title-editable{
	border:0!important;
    background: #fff!important;
    width:300px;
    box-shadow:none!important;
    padding:0!important;
    margin:0!important;
}


.multi_path_section,
.subtitle_section,
.cue_point_section{
	background: #f1f1f1;
    float: left;
    clear: both;
    padding: 10px;
    margin-left: -10px;
    margin-bottom: 10px;
}
.multi_path_field_remove{
	display: none;
	margin-top: 10px;
}
.subtitle_field_remove,
.cue_point_remove{
	margin-top: 15px;
}
#multi_path_field_add,
#subtitle_field_add,
#cue_point_field_add{
	float: left;
	clear: both;
}

.vpl-actions{
	display: inline-block;
    margin: 1em 0;
}



.vpl-pgn{
	display: inline-block;
	float: right;
}
.vpl-pgn li{
    display: inline;
}
.vpl-pgn-btn{
    color: #333;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    margin-right: 1px;
    margin-bottom: 1px;
}
.vpl-pgn-current,
.vpl-pgn-btn:hover{
    color: #fff!important;
    background: #0073aa!important;
}

.vpl-notice-error{
	display: inline-block;
	margin-top: 5px;
	background: #ca4a1f;
    padding: 5px;
    color: #fff;
}


/* tabs */
.vpl-tab-header{
    overflow: hidden;
    background-color: #f1f1f1;
}
.vpl-tab-header li{
	background-color: #f1f1f1;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 10px 13px;
    transition: 0.3s;
    margin: 0;
}
.vpl-tab-header li:hover,
.vpl-tab-active{
    background-color: #ddd!important;
}
.vpl-tab-content{
	display: none;
    padding-left: 10px;
}

/* break point */
#vpl-br-table-wrap,
#vpl-caption-br-table-wrap{
	margin: 10px 0;
}
.vpl-br-table,
.vpl-caption-br-table{
	background: #f1f1f1;
    padding: 5px;
    margin-bottom: 10px;
}
.vpl-br-table thead th,
.vpl-br-table tbody td,
.vpl-caption-br-table thead th,
.vpl-caption-br-table tbody td{
    padding: 0;
}
.vpl-br-table input,
.vpl-br-table th,
.vpl-caption-br-table input,
.vpl-caption-br-table th{
    width: auto!important;
}
.vpl-br-table th,
.vpl-caption-br-table th{
    font-weight: 600!important;
}


.vpl-value-table-wrap{
    margin: 10px 0;
}
.vpl-value-table-wrap-orig{
    display: none;
}
.vpl-value-table-wrap-disabled{
    opacity: 0.5;
}
.vpl-value-table-wrap table{
    background: #f1f1f1;
    padding: 5px;
    margin-bottom: 10px;
}
.vpl-value-table-wrap thead th,
.vpl-value-table-wrap tbody td{
    padding: 0;
}
.vpl-value-table-wrap input,
.vpl-value-table-wrap th{
    width: auto!important;
}
.vpl-value-table-wrap th{
    font-weight: 600!important;
}











/* playlist select */

#pl-select-wrap{
	max-width: 500px;
}
#pl-select-wrap li{
	border:1px solid #ddd;
	cursor: pointer;
	line-height: 30px;
    height: 30px;
}
#pl-select-wrap li span{
	margin-left: 10px;
}
.pl-list-selected{
	background-color: #ddd;
}


/* visibility */
.ev-unit-wrap{
	max-width: 900px;
	margin-bottom: 10px;
}
.ev-unit-list{
	columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
    margin-bottom: 20px;
}
.ev-unit-wrap.option-tab{
    background: #f1f1f1!important;
}
.ev-unit-wrap .option-toggle{
	background: #9E9E9E;
    position: relative;
}
.ev-unit-wrap .option-toggle svg{
	position: absolute;
    height: 20px;
    color: #fff;
    right: 15px;
    top: 10px;
}
.ev-unit-wrap .container {
    display: block;
    padding: 5px;
}


/* adverts */

.vpl-ri{
    display:  inline-block;
    float:  right;
    margin-bottom: 0;
}
.aprf{
    border:1px solid rgba(255,0,0,0.5)!important;
}

.ad-info{
    margin-bottom: 25px;
    font-style: italic;
}

#preroll-source-add,
#midroll-source-add{
    margin-bottom: 20px;
}


.vpl-ad-source,
.vpl-annotation-source{
    background: #f1f1f1!important;
    max-width: 1000px;
    margin-bottom: 10px;
    position: relative;
}
.vpl-ad-source .option-toggle,
.vpl-annotation-source .option-toggle{
    background: #9E9E9E;
}
.vpl-ad-source .option-toggle svg,
.vpl-annotation-source .option-toggle svg{
    position: absolute;
    height: 20px;
    color: #fff;
    right: 15px;
    top: 10px;
}

.vpl-em{
    color:red;
}

.vpl-img-preview{
    display: block;
    max-width: 300px;
    height: auto;
    margin-bottom: 10px;
}


#vpl-file-input {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.vpl-table-api th,
.vpl-table-api td{
    vertical-align: middle;
}

#vpl-import-playlist-form{
    float: right;
    margin-left: 5px;
}

@keyframes vplblink {
    /**
     * At the start of the animation the dot
     * has an opacity of .2
     */
    0% {
      opacity: .2;
    }
    /**
     * At 20% the dot is fully visible and
     * then fades out slowly
     */
    20% {
      opacity: 1;
    }
    /**
     * Until it reaches an opacity of .2 and
     * the animation can start again
     */
    100% {
      opacity: .2;
    }
}

#vpl-import-playlist-loader{
    display: none;
}

#vpl-import-playlist-loader span {
    /**
     * Use the blink animation, which is defined above
     */
    animation-name: vplblink;
    /**
     * The animation should take 1.4 seconds
     */
    animation-duration: 1.4s;
    /**
     * It will repeat itself forever
     */
    animation-iteration-count: infinite;
    /**
     * This makes sure that the starting style (opacity: .2)
     * of the animation is applied before the animation starts.
     * Otherwise we would see a short flash or would have
     * to set the default styling of the dots to the same
     * as the animation. Same applies for the ending styles.
     */
    animation-fill-mode: both;
}

#vpl-import-playlist-loader span:nth-child(2) {
    /**
     * Starts the animation of the third dot
     * with a delay of .2s, otherwise all dots
     * would animate at the same time
     */
    animation-delay: .2s;
}

#vpl-import-playlist-loader span:nth-child(3) {
    /**
     * Starts the animation of the third dot
     * with a delay of .4s, otherwise all dots
     * would animate at the same time
     */
    animation-delay: .4s;
}





/*tags*/
#vpl-tag-wrap,
#vpl-category-wrap{
    margin-bottom: 2px;
    max-width: 300px;
    overflow: hidden;
}
.vpl-tag-item,
.vpl-category-item{
    color: #fff;
    background: #0085ba;
    float: left;
    font-size: 13px;
    padding: 4px;
    margin: 2px;
    border-radius: 3px;
    cursor: pointer;
}
.vpl-category-item{
    background: #ca4a1f;
}
.vpl-tag-item:after,
.vpl-category-item:after{
    display: inline-block;
    content: "\00d7"; /* This will render the 'X' */
}


/* sample import */
#vpl-sample-import{
    display: block;
    margin: 10px 0;
}
.vpl-demo-sc{
    display: none;
}

.vpl_quality_radio{
    padding: 5px 0;
}

.vpl-media-thumb-img{
    max-width: 100px;
}

.vpl-shortcode-title{
    font-size: 16px;
}




.apt-btn{
    border: 1px solid #333;
    margin-left: 10px;
    padding: 5px 10px;
    background: #f6f7f7;
    color: #50575e;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border-radius: 3px;
}
#vpl-apt-license{
    padding: 20px;
    background: #e8e8e8;
    opacity: 0;
}
#vpl-apt-license-act{
    display: flex;
    flex-direction: row;
}
.apt-btn:hover{
    background: #2271b1;
    color: #fff;
}
#vpl-apt-license-panel{
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}
#vpl-apt-license-details{
    display: inline-block;
    padding: 10px 20px;
    background: #b8d4eb;
    margin-top: 20px;
}
#vpl-apt-license-msg{
    padding: 10px 20px;
    margin-top: 10px;
    color: #fff;
    display: none;
}
.apt-license-valid{
    background: #4caf50;
}
.apt-license-error{
    background: #f44336;
}
.apt-addon-field-wrap{
    background: #ffd7d7;
}
.apt-addon-field-wrap-reg{
    background: #eef9e9;
}


#vpl-loader {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    overflow-x: auto;
    overflow-y: scroll;
    z-index: 1000;
    background: #000;
    background: rgba(0,0,0,0.7);
    width: 100%;
    height: 100%;
    display: none;
}
.vpl-loader-anim{
    position: absolute;
    width: 60px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.vpl-loader-anim span{
    display:block;
    bottom:0;
    width: 9px;
    height: 5px;
    background:#e9eded;
    position:absolute;
    animation: vpl_preloader 1.5s  infinite ease-in-out;
}
.vpl-loader-anim span:nth-child(2){
    left:11px;
    animation-delay: .2s;
}
.vpl-loader-anim span:nth-child(3){
    left:22px;
    animation-delay: .4s;
}
.vpl-loader-anim span:nth-child(4){
    left:33px;
    animation-delay: .6s;
}
.vpl-loader-anim span:nth-child(5){
    left:44px;
    animation-delay: .8s;
}
@keyframes vpl_preloader {
    0% {height:5px;transform:translateY(0px);}
    25% {height:30px;transform:translateY(15px);}
    50% {height:5px;transform:translateY(0px);}
    100% {height:5px;transform:translateY(0px);}
}

.vpl-skin-chooser{
    display: inline-block;
    margin: 8px;
}




body.vpl-modal-open {
    overflow: hidden!important;
}
.vpl-modal {
    display: none; 
    position: fixed; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    z-index: 99999!important;
}
.vpl-modal-bg {
    position: absolute;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    max-height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,0.6);
    padding: 100px 0; 
}
.vpl-modal-inner {
    position: absolute;
    box-sizing: border-box;
    left: 50%;
    width: 100%;
    max-width: 1600px;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
}
.vpl-modal-content {
    background-color: #fefefe;
    padding: 20px;
    border: 1px solid #888;
    position: relative;
}
.vpl-modal-actions{
    display: flex; 
    justify-content: flex-end;
    margin-bottom: 0;
    margin-top: 10px;
}
.vpl-modal-actions button{
    margin-left: 5px!important;
}


.multi_path_section_orig,
.subtitle_section_orig,
.cue_point_section_orig{
    display: none;
}

.vpl-admin .multi_path,
.vpl-admin .subtitle_src,
.vpl-admin .cue_start_time,
.vpl-admin .cue_code_type{
    margin-bottom: 4px;
}

.vpl-edit-media-modal-confirm{
    margin-right: 10px!important;
    cursor: pointer;
}
.vpl-edit-media-modal-cancel{
    margin-right: 10px;
    cursor: pointer;
}



/* statistics */

.vpl-media-thumb-img{
    max-width: 80px;
}

.media-item-container-hidden{
     display: none;
}

.vpl-stat-hidden{
    display: none;
}

.vpl-stats-header{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 20px;
    align-items: center;
}
.vpl-stats-heatmap-header{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 20px;
    align-items: center;
    background-color: #ddd;
    margin-bottom: 5px;
}
.vpl-stats-user-selector{
    display: flex;
    flex-direction: column;
    margin-top: 20px;
}
.vpl-stats-selector{
    display: flex;
    flex-direction: column;
}


.vpl-stat-export{
    align-self: flex-end;
    margin-right: 10px;
}

table.stat-table{
    border: 0;
    box-shadow: none;
}
.stat-table thead{
    background: #0073aa!important;
 }
.stat-table thead a{
    color: #fff!important;
 }

.vpl-stat-sort:hover{
    text-decoration: underline;
}

.action-title{
    font-weight: 600;
    margin-bottom: 5px;
}
.action:not(:last-child){
    margin-bottom: 10px;
}

input.hsrc {
    margin-top: -1px;
    vertical-align: middle;
}


.vpl-stat-icon{
    height: 20px;
    width: auto;
    float: left;
    margin-right: 8px;
}
.vpl-stat-icon2{
    height: 20px;
    cursor: pointer;
    width: auto;
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -10px;
}
.vpl-stat-icon2 img{
    display: block;
    height: 100%;
    width:auto;
}
.vpl-stats-total{
    background: #fff;
    margin-bottom: 10px;
    padding: 10px;
}
.vpl-stats-total-inner{
    display: flex;
    justify-content: space-between;
}
.vpl-stats-total-inner div{
    text-align: center;
    flex: 1;
}
.vpl-stats-total p{
    padding: 0;
    margin: 0;
}
.vpl-stats-total-value{
    font-size: 40px;
}
.vpl-stat-no-data{
    text-align: center;
}
#vpl-stat-list th{
    color: #fff;
}
.vpl-stat-no-data p{
    padding: 30px;
}

.vpl-stat-info{
    margin-left: 5px;
    font-size: 10px;
    font-style: italic;
}

.vpl-modal .inline-stat-table thead{
    background: #0073aa!important;
}
.vpl-modal .inline-stat-table thead th{
    color: #fff!important;
}
.inline-stat-table{
    border: none!important;
    box-shadow: none!important;
}
.inline-stat-table-hidden{
    display: none;
}








/* stat canvas */
.vpl-graph-canvas-wrap{
    position: relative;
}
.vpl-graph-canvas{
    background-color: #ccc;
}


.stat-details-media-wrap{
    position: relative;
    min-height: 700px;
    width: 100%;
    background-color: #111;
}
.stat-details-heatmap{
    position: relative;
    height: 50px;
    width: 100%;
    background-color: #ccc;
}
.stat-details-video{
    position:absolute;
    visibility: visible;
    top:0;
    left:0;
    max-width:none!important;
    width: 100%;
    height: 100%; 
}
.stat-details-audio{
    position:absolute;
    visibility: visible;
    bottom:0;
    left:0;
    max-width:none!important;
    width: 100%;
}
.stat-details-iframe{
    position:absolute!important;
    top:0!important;
    left:0!important;
    width:100%!important;
    height:100%!important;
    max-width: none!important;
    max-height: none!important;
}
.stat-details-heatmap-cursor{
    position: absolute;
    width: 1px;
    height: 100%;
    top:0;
    left:0;
    background-color: red;
    pointer-events: none;
}

.vpl-icon-field{
    vertical-align: top;
}
.vpl-icon-preview {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
    width: 40px;
    height: 30px;
    color: #607d8b;
}
.vpl-icon-preview svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    fill:currentColor;
    height:100%;
}
.vpl-icon-preview img{
    height:100%;
    display: block;
}


.vpl-media-item-container-orig{
    display: none!important;
}

.ap-addon-link{
    padding: 10px 0;
    display: block;
}
.item-content-list .container{
    display: inline-block;
    padding: 5px 5px 5px 0;
}

#path_preview,
#multi_path_preview,
.vpl-path-preview{
    max-width: 300px;
}

.vpl-editor-ta{
    width: 100%!important;
}


#vpl-pi-table-wrap{
    display: none;
    overflow: auto;
}
#vpl-pi-table-wrap td{
    vertical-align: top!important;
}
#vpl-media-tabs .vpl-tab-content{
    overflow-x: auto;
}

.vpl-pi-icon-preview{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;

    width: 40px;
    height: 30px;
    background-color: #eceef1;

    color: #607d8b;
}
.vpl-pi-icon-preview svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    fill:currentColor;
    height:100%;
}
.vpl-pi-icon-field{
    display: flex;
    justify-content: center;
    flex-direction: row;
    align-items: center;
}
.vpl-pi-icon-sort{
    cursor: move;
}

.vpl-pi-icon{
    width: 150px!important;
    vertical-align: bottom!important;
}
.vpl-pi-target{
    width: 100px!important;
    vertical-align: bottom!important;
}

#vpl-pl-elem-table{
    table-layout:fixed;
}



#vpl-sticky-action{
    width: 100%;
    margin-top: 20px;
    overflow: hidden;
}
#vpl-sticky-action-inner{
    float: right;
    margin-right: 30px;
}
.vpl-sticky{
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 15px;
    background: rgba(255, 255, 255, 0.87);
    width: 100%;
    border-top: 1px solid #e0e0e0;
    z-index: 9999;
}
#vpl-save-holder{
    height: 60px;
    padding: 0;
    margin: 0;
}

.apwporg .ap-pro-feature{
    opacity: 0.7;
    position: relative;
}
.apwporg .ap-pro-feature th::before,
.apwporg .ap-pro-feature th::before{
    content: "PRO";
    position: absolute;
    top: 0;
    left: 0;
    background-color: #e6e6e6;
    color: #ff0707;
    font-weight: bold;
    padding: 3px;
    line-height: 1;
    font-size: 10px;
    border-radius: 2px;
    z-index: 3;
}
.vpl-pro-modal-actions{
    display: flex;
    justify-content: center;
    gap: 10px;
}
#vpl-pro-modal .vpl-modal-inner{
    max-width: 900px;
}
#vpl-pro-modal-limit .vpl-modal-inner{
    max-width: 700px;
}
#vpl-pro-modal ul{
    margin-left: 10px;
}
.vpl-pro-modal-btn{
    border: 0;
    padding: 10px 30px;
    border-color: transparent;
    cursor: pointer;
    text-decoration: none;
    background: #ccc;
    cursor: pointer;
    color: #fff;
}
.vpl-pro-modal-btn:hover{
    opacity: 0.8;
}
.vpl-pro-modal-buy{
    background-color: rgb(130, 180, 64);
}