/* Global Styles */
body { 
    background-color:#fff;
    font-family: 'Roboto';
    font-size:12px;
    font-weight:300;
    color:#ffffff;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;       
}
a { color:#FFF; text-decoration:none; }

/* Page - Content */
#page-wrap { z-index:0; width:100%;  }
#page-content { margin:0 16px 0 16px; padding:10px 0 0px 0; }

/* Table */
.table-container { margin:0 0 10px 0; padding:0 0 0 0; width:100%; clear:both; background:#2c2c2b; min-width:880px; }
.table-container-small { margin:0 0 10px 0; padding:0 0 0 0; width:100%; clear:both; background:#263137;  }

.play-list-footer { position:relative; float:left; width:100%; height:22px; background-color:#f0ad4e;color:#000; }
.play-list-footer p { font-size:10px; padding:7px 10px 0 10px; }
.play-list-footer .left { position:relative; float:left; }
.play-list-footer .right { position:relative; float:right; }

/*WellPlastic*/
#header-title { top:64px; }
#logged-in { display:none; }
.header-menu { display:none; }
/* Large section header*/
#section .header { padding:0 0 0 0; margin:0 0 0 0; height:60px; width:100%; min-width:880px; font-weight: normal; float: left; background-color:#f0ad4e; }
#section .header img { float:left; }
#section .header p { color: #fff; text-decoration: none; display: block; padding: 11px 0 0 20px; font-size:18px; line-height:20px; }

/* Program Header */
#section .header-program { padding:0 0 0 0; margin:0 0 0 0; height:32px; width:100%; min-width:180px; font-weight: normal; float: left; background-color:#f0ad4e; }
#section .header-program p { color: #000; text-decoration: none; display: block; padding: 11px 0 0 11px; font-size:14px; line-height:14px; }

/* Small section header*/
#simplesection .header { position:relative; float:left; height:34px; width:100%; padding:0 0 0 0; margin:0 0 0 0; background-color:#f0ad4e; }
#simplesection .header h1 { color:#000; font-size:16px; padding:0 0 0 0; margin:8px 0 0 20px; }
#section-container { margin:0 0 10px 0; padding:0 0 0 0; width:100%; clear:both; background:#263137; }
.section-container { margin:0 0 10px 0; padding:0 0 0 0; width:100%; clear:both; background:#263137; }

/*Info Bar*/
#infobar {width:100%; background-color:#ffffff; padding:5px 0 5px 0; margin:0 0 10px 0;}
#infobar h1 {font-size:18px; color:#004b8d;}
/*Datatables Toolbar*/
.toolbar {position:relative;top:20px;}
/* Program Select Box in edit section */
#program-select {border:0; background-color:#231f20; padding:5px 5px 5px 5px; color:#fff; font-size:12px;}

/* Soon to be deprecated */
.breadcrumbs {width:100%; background-color:#ffffff; padding:0px 0 10px 5px; margin:0;color:#000000;font-weight:bolder;font-size:1.05em;}
/* Soon to be deprecated */

input {font-family:Roboto;}
input[type=search] {-webkit-appearance: textfield;}
select {font-family:Roboto;}

input:focus { outline-color: #f0ad4e !important;}

#notifier { display: none; }

label sup {color:#f0ad4e;vertical-align: super;}

.schedule-header-program { padding:0 0 0 0; margin:0 0 0 0; height:32px; width:100%; min-width:180px; font-weight: normal; float: left; background-color:#f0ad4e; }
.schedule-header-program p { color: #000; text-decoration: none; display: block; padding: 11px 0 0 11px; font-size:14px; line-height:14px; }

input:invalid {border:1px solid #f0ad4e !important; }
input:valid {border:0; }
input:out-of-range {border:1px solid #f0ad4e !important;}
input:in-range {border:0; }
input:required {border:1px solid #f0ad4e;}
input:required:invalid {border:1px solid #f0ad4e !important; }
input:required:valid {border:0; }
select:required {border:1px solid #f0ad4e;}
select:required:invalid {border:1px solid #f0ad4e !important; }
textarea:required:invalid {border:1px solid #f0ad4e !important; }

/* Datatables column headers */
.daysofweek {width:190px !important;min-width:190px !important;}
.releaseyear {width:36px !important;min-width:36px;}
.musickey {width:20px !important;min-width:20px;}
.bpm {width:20px !important;min-width:20px;}
.duration {width:32px !important;min-width:32px;}
.playbackfrequency {width:24px !important;min-width:24px;}
.preemption {width:34px !important;min-width:34px;}
.explicitcolumn {width:24px !important;;min-width:24px !important;}
.timeshare {width:26px !important;min-width:26px;}
.trackcount {width:26px !important;min-width:26px;}
.lastmodified {width:84px !important;min-width:84px;}
.lastmodified-small {width:64px !important;min-width:64px;}
.lastschedule {width:84px !important;min-width:84px;}
.col-checkbox { width:16px !important; min-width:16px !important;position:relative;left:-2px;}
.col-explicit { width:18px !important; min-width:18px !important;max-width:18px !important;}
.col-owner { width:18px !important; min-width:18px;position:relative;left:-2px;}
.col-locked { width:18px !important;min-width:18px;}
.col-button { width:18px !important;min-width:18px;}
.col-number { width:18px !important;min-width:18px;}
.col-date-full {width:124px !important;min-width:124px;}
.col-owner-menu { width:24px !important; min-width:24px;position:relative;left:-2px;padding-right:1px;}
.col-duration-menu {width:32px !important;min-width:32px;padding-right:1px;}


.durationicon {
    /*width:100%;*/
    height:100%;
    min-width:12px;
    min-height:12px;
    background-image:url(/images/duration.svg);
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position-x: center;
    background-position-y: center;
}

.timeshareicon {
    min-width:12px;
    min-height:12px;
    background-image:url(/images/duration.svg);
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position-x: center;
    background-position-y: center;
    width: 12px;
    float: left;
    margin-right: 4px;
}

.musickeyicon {
    height:100%;
    min-width:12px;
    min-height:12px;
    background-image:url(/images/musickey.svg);
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position-x: center;
    background-position-y: center;
}

.bpmicon {
    height:100%;
    min-width:12px;
    min-height:12px;
    background-image:url(/images/bpm.svg);
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position-x: center;
    background-position-y: center;
}

.playbackfrequencyicon {
    height:100%;
    min-width:12px;
    min-height:12px;
    background-image:url(/images/playbackfrequency.svg);
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position-x: center;
    background-position-y: center;
}

.preemptionicon {
    float:left;
    height:100%;
    min-width:12px;
    min-height:12px;
    background-image:url(/images/preemption.svg);
    background-repeat: no-repeat;
    background-size: 50% 100%;
    background-position-x: left;
    background-position-y: center;
}

.explicit {
    height:100%;
    min-width:18px;
    min-height:18px;
    background-image:url(/images/status/explicit.svg);
    background-repeat: no-repeat;
    background-size: 18px 18px;
    background-position-x: center;
    background-position-y: center;
}

.notexplicit {
    height:100%;
    min-width:18px;
    min-height:18px;
    background-image:url(/images/status/general.svg);
    background-repeat: no-repeat;
    background-size: 18px 18px;
    background-position-x: center;
    background-position-y: center;
}

.explicit-new {
    height:100%;
    min-width:18px;
    min-height:18px;
    background-image:url(/images/status/explicit_new.svg);
    background-repeat: no-repeat;
    background-size: 18px 18px;
    background-position-x: center;
    background-position-y: center;
}

.notexplicit-new {
    height:100%;
    min-width:18px;
    min-height:18px;
    background-image:url(/images/status/general_new.svg);
    background-repeat: no-repeat;
    background-size: 18px 18px;
    background-position-x: center;
    background-position-y: center;
}
/* End column headers */

/* Sort Icons */
.sort-up {
    height:100%;
    min-width:12px;
    min-height:12px;
    background-image:url(/images/sort-amount-up-alt-solid.svg);
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position-x: center;
    background-position-y: center;
}
.sort-down {
    height:100%;
    min-width:12px;
    min-height:12px;
    background-image:url(/images/sort-amount-down-alt-solid.svg);
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position-x: center;
    background-position-y: center;
}
/* End Sort Icons*/


/* Generic Material Like Button */
.button { float:left;
          text-align:center;
          background-color:#fc9b14;
          font-size:12px;
          color:#000;
          padding:8px 14px 8px 14px;
          margin-left:16px;
          cursor: hand;
          cursor: pointer;
          border-radius: 2px;
          box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}
.button:hover {
    background-color:#ed8a00;
    color:#000;
    opacity: 0.85;
    border-radius: 2px;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
    transition: transform .3s cubic-bezier(0,0,.2,1),width .3s cubic-bezier(0,0,.2,1),height .3s cubic-bezier(0,0,.2,1),opacity .6s cubic-bezier(0,0,.2,1),-webkit-transform .3s cubic-bezier(0,0,.2,1), background-color .3s ease;
}
.button-disabled { float:left;
                   text-align:center;
                   background-color:#ccc !important;
                   font-size:12px;
                   color:#fff;
                   padding:8px 14px 8px 14px;
                   margin-left:16px;
                   cursor: hand;
                   cursor: pointer;
                   border-radius: 2px;
                   box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);

}
.button-disabled:hover {}
/* End button */

/* search button*/

.search-button {background-color:#0B0600 !important; color:#fff !important;display:inline-block;float:none !important;}
.search-button:hover {background-color:#fc9b14 !important; color:#000 !important;opacity:1 !important}

/* end search button*/

/* Playback bar for programs,collections  & styles */
.playbackbar {
    float:right;
    margin-top:3px;
    margin-right:11px;
}

.rbutton {
     border-radius: 50%;
     box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
     background-repeat: no-repeat;
     width: 26px;
     height: 26px;
     padding: 0;
     background-color:transparent;
}

.rbutton:hover {
    background-color:#ed8a00;
    color:#000;
    opacity: 0.85;
    border-radius: 50%;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
    transition: transform .3s cubic-bezier(0,0,.2,1),width .3s cubic-bezier(0,0,.2,1),height .3s cubic-bezier(0,0,.2,1),opacity .6s cubic-bezier(0,0,.2,1),-webkit-transform .3s cubic-bezier(0,0,.2,1), background-color .3s ease;
}

.playerskip {
    background-image: url(/images/btn_skip.svg);
    background-position: center;
    background-size: 22px 22px;
}

.playerplay {
    background-image: url(/images/btn_play.svg);
    background-position: center;
    background-size: 22px 22px;
}

.playerback {
    background-image: url(/images/back-icon.svg);
    background-position: center;
    background-size: 22px 22px;
}

.playerpause {
    background-image: url(/images/btn_pause.svg);
    background-position: center;
    background-size: 22px 22px;
}

.playertracklabel { float:left;
                    text-align:center;
                    background-color:transparent;
                    color:#000;
                    margin-left:16px;
                    height:26px;
                    border-radius: 2px;
                    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);

}

.playertracknumber {
    width: 32px !important;
    border: 0 !important;
    height: 26px !important;
    background-color: #231f20 !important;
    padding: 0px 0px 0px 2px !important;
    color: #fff !important;
    font-size: 12px !important;
    display: inline !important;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}

/* end playbackbar */

/* datatables cells */
.dataTable tr.odd {border-bottom: 1px dotted rgba(0,0,0,0.3);}
.dataTable tr.even {border-bottom: 1px dotted rgba(0,0,0,0.3);}
.dataTable td { vertical-align:middle;color:#000;}
.dataTable { background:transparent !important;}
.dataTables_wrapper {
    background: #fff;
    background:-webkit-linear-gradient(top, rgba(240,240,240,1),rgba(255,255,255,1));
    background: -moz-linear-gradient(top, rgba(240,240,240,1),rgba(255,255,255,1));
    background: -ms-linear-gradient(top, rgba(240,240,240,1),rgba(255,255,255,1));
    background: -o-linear-gradient(top, rgba(240,240,240,1),rgba(255,255,255,1));
}
.dataTables_scroll { }
.dataTables_scrollHead { background-color:#252122;}
.dataTables_scrollHeadInner { background-color:#252122;}
/*.dataTables_scrollBody { transition: height 0.25s ease; }*/
.dataTables_paginate { background-color:#fff !important;text-align:right !important;}
.dataTables_paginate .first { display:none;}
.dataTables_paginate .last { display:none;}
.dataTables_paginate .next { display:none;}
.dataTables_paginate .previous { display:none;}
.paging_full_numbers a { box-shadow:none !important;}
/* end datatables cells*/

/* Default form controls */

input {
    border-radius: 2px;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
    outline:0;
}

input[type=checkbox] {
    border-radius: 2px;
    box-shadow: none;
    width:14px;
    height:14px;
}

select {
    border-radius: 2px;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
    height: 21px;
    font-size:12px;
    font-family:Roboto;
    padding:0px 5px 0px 5px!important;
    outline:0 !important;
    border:0;
    background-color:#231f20;
    color:#fff;
    font-weight:300;
}

textarea {
    border-radius: 2px;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}

/* Navigation icon */
.menuicon {
    float:right;
    margin-top: 3px;
}

/* Old Search Button (to be deprecated */

#search-btn {background-color:#0B0600; color:#fff;}
#search-btn:hover {background-color:#fc9b14; color:#000;}

/* autocomplete styling*/
.ui-autocomplete { 
    background-color: #fff !important;
     color: #000 !important;
     border-radius: 2px !important;
     border: 0 !important;
     max-height: 300px !important;
     overflow-y: auto !important;
     overflow-x: hidden !important;
     box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2); 
     padding: 5px 0px 5px 0px !important;
}

.ui-autocomplete li { 
    padding: 5px 15px 5px 15px !important;
    margin: 0px !important;
    list-style-type: none !important;
    text-align: left !important;
    color: #000 !important;
    font-size: 12px !important;
    font-family: Roboto !important;
    font-weight:300 !important;
    width: auto !important;
}

.ui-autocomplete li a {
    color: #000 !important;
    font-size: 12px !important;
    font-family: Roboto !important;
    font-weight:300 !important;
    padding:0 !important;
    margin:0 !important;
    line-height:normal !important;
}

.ui-autocomplete li:hover { background-color: #fc9b14 !important; }
.ui-autocomplete li a:hover { background-color: #fc9b14 !important; }
.ui-state-hover { background: #fc9b14 !important; border:0 !important; }
.ui-state-active { background: #fc9b14 !important; border:0 !important; }
.ui-state-focus { background: #fc9b14 !important; border:0 !important; }


/* TinyMCE tooltip hide*/
.mce-tooltip-arrow { display: none !important;}
.mce-tooltip-inner { display: none !important;}
.mce-panel { border:0 !important;border-width: 0 !important;}
.mce-top-part::before { box-shadow: none !important; -webkit-box-shadow: none !important; }
.mce-tinymce { font-family: Roboto !important; box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px 0px rgba(0,0,0,.2) !important; -webkit-box-shadow: box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px 0px rgba(0,0,0,.2) !important; }
.mce-container, .mce-container *, .mce-widget, .mce-widge { font-family:Roboto !important;}
.mce-ico { font-family:tinymce !important; color:#000 !important;font-size:12px !important;}
.mce-ico:hover { /*color:#fff !important;*/}
.mce-content-body { font-family:Roboto !important;}
.mce-toolbar { background-color: #f0ad4e !important;}
.mce-btn {background-color: #f0ad4e !important; border:0 !important;  }
.mce-btn:hover {-webkit-transition: background-color 0.25s ease !important; -o-transition: background-color 0.25s ease !important; -moz-transition: background-color 0.25s ease !important; -ms-transition: background-color 0.25s ease !important; transition: background-color 0.25s ease !important; background-color: #fc9b14 !important; }
.mce-btn button { color:#000 !important;}
.mce-btn button:hover { /*color:#fff !important;*/}
.mce-txt { font-family:Roboto !important;font-weight:300 !important;font-size:12px !important;text-transform:uppercase;}