.uxas-playlist-song-footer .read_more:hover,
.playlist-managament-information button[type="submit"]:hover,
.uxas-playlist-tag-a:hover,
#form_playlist .btn.edit_view_song:hover,
.form-polls-body button[name="polls_cancel"]:hover,
.form-polls-body button:hover {
    background: #ffda03;
    border-color: #ffda03;
}

.uxas-playlist-like-span.active, .be-tag-block .be-tags a, .be-tag-block .be-tags,
.view_song,
.uxas_block_categories .active > a,
.playlist-managament-information .help-block a {
    color: #2fb5d2;
}

.uxas_title_block:hover,
.read_more:hover,
.list_category_item .sub_category li a:hover,
.uxas_block_categories .active > a:hover,
.playlist-managament-information .help-block a:hover,
#form_playlist a.uxas_button_backtolist:hover {
    color: #ffda03;
}

.uxas-playlist-slider.carousel .slick-dots .slick-active button {
    border-color: #2fb5d2;
}

.playlist-managament-information button[type="submit"],
.uxas-playlist-slider.carousel .slick-dots .slick-active button,
.playlist_view_all, .view_all_link,
.playlist_view_all_button a,
.form-polls-body button,
.add_new_song_playlist a,
#form_playlist button[type="submit"],
#form_playlist .btn.edit_view_song,
.uxas_playlist_loading .squaresWaveG {
    background: #2fb5d2;
}

.playlist_view_all:hover, .view_all_link:hover,
.playlist_view_all_button a:hover,
.add_new_song_playlist a:hover,
#form_playlist button[type='submit']:hover {
    background: #ffda03;
}

.uxas_playlist_ltr_mode a:hover,
.uxas-playlist-wrapper-detail a:hover,
.uxas-playlist-like-span:hover,
.playlist-main-page a:hover,
.uxas_button_backtolist:hover {
    color: #ffda03;
}

.form-polls-body button {
    border: 1px solid #2fb5d2;
}

.playlist_view_all, .view_all_link {
    background-color: #2fb5d2;
}

.playlist_view_all:hover, .view_all_link:hover {
    background-color: #ffda03;
}

@keyframes bounce_squaresWaveG {
    0% {
        background-color: #2fb5d2;
    }

    100% {
        background-color: rgb(255, 255, 255);
    }
}

@-o-keyframes bounce_squaresWaveG {
    0% {
        background-color: #2fb5d2;
    }

    100% {
        background-color: rgb(255, 255, 255);
    }
}

@-ms-keyframes bounce_squaresWaveG {
    0% {
        background-color: #2fb5d2;
    }

    100% {
        background-color: rgb(255, 255, 255);
    }
}

@-webkit-keyframes bounce_squaresWaveG {
    0% {
        background-color: #2fb5d2;
    }

    100% {
        background-color: rgb(255, 255, 255);
    }
}

@-moz-keyframes bounce_squaresWaveG {
    0% {
        background-color: #2fb5d2;
    }

    100% {
        background-color: rgb(255, 255, 255);
    }
}

.playlist-button-icon:not(.up) {
    background-image: url('../../chevron-up.svg');
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    width: 0.6em;
    height: 0.5em;
    position: absolute;
    right: 1em;
    top: 1.1em;
    cursor: pointer;
}

.playlist-button-icon {
    background-image: url('../../chevron-down.svg');
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    width: 0.6em;
    height: 0.5em;
    position: absolute;
    right: 1em;
    top: 1.1em;
    cursor: pointer;
}

.plus {
    background-image: url('../../plus.svg');
    background-size: cover;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    position: absolute;
    cursor: pointer;
}

.menu {
    background-image: url('../../menu.svg');
    background-size: cover;
    background-repeat: no-repeat;
    width: 14px;
    height: 14px;
    position: absolute;
    cursor: pointer;
}

.playlist-wrapper {
    position: relative;
    height: 38px;
    background: white;
    margin-bottom: 1em;
}

.playlist-select {
    height: 355px;
    margin-top: -1em;
    background: #F0EAE0;
    margin-bottom: 1em;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1em;
}

button.btn.btn-playlist {
    background: white;
    text-transform: uppercase;
    width: 100%;
    text-align: left;
    display: flex;
    justify-content: space-between;
}

button.btn.btn-playlist span {
    font-weight: 700;
    color: #DC1F1A;
    margin-right: 2em;
}

button.btn.btn-playlist:focus {
    outline: none;
}

.button-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.button-icon {
    width: 28px;
    height: 28px;
    background: white;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.button-icon:hover {
    transform: scale(1.1);
}

.button-wrap button:focus {
    outline: none;
}

.button-wrap button {
    text-transform: uppercase;
    font-family: Open-sans, sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: .9em;
}

.playlist-input-wrapper {
    width: 100%;
    padding: 1em 3em;
    z-index: 99;
}

.playlist-input-wrapper textarea {
    width: 100%;
    height: 200px;
}

.modal-dialog-centered {
    justify-content: center;
}

.tox.tox-tinymce {
    border: 1px solid #BDBDBD;
    border-radius: 0;
}

.tox .tox-menubar,
.tox:not(.tox-tinymce-inline) .tox-editor-header,
.tox .tox-toolbar-overlord .tox-toolbar__primary,
.tox .tox-menubar + .tox-toolbar-overlord,
.tox .tox-edit-area__iframe,
.tox .tox-statusbar {
    background: #F5F1EB !important;
}

.tox .tox-statusbar__branding svg {
    display: none;
}

.playlistModal .modal-header {
    display: flex;
    justify-content: space-between;
    padding-bottom: 0;
    margin: -1em 0 1em 0;
    border: none;
}

.playlistModal .modal-content {
    width: 500px;
    height: 500px;
}

.playlistModal .modal-body {
    overflow-y: scroll;
    height: 400px;
    cursor: pointer;
}

.playlistModal .modal-body li {
    list-style: none;
    padding: 0 0.6em;
}

.playlistModal .modal-body li:hover, .playlistModal .modal-body li:hover p, .playlistModal .modal-body li:hover span {
    color: black !important;
}

.playlistModal .modal-body li:hover {
    font-weight: 600 !important;
}

.playlistModal .modal-body li span {
    position: absolute;
    left: 4em;
}

.playlistModal .modal-body .control-label {
    display: flex;
    padding-bottom: 1em;
}

.playlistModal .modal-body .form-control {
    background: white;
}

.playlistModal .modal-body .form-control:focus {
    outline: none;
}

.playlistModal .modal-body .tree {
    position: sticky;
    top: -1em;
    z-index: 2;
}

#character_count {
    font-family: Open-sans, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    color: black;
    padding: 0 3.7em;
}

.tox.tox-tinymce {
    height: 200px !important;
}

.playlist-title {
    font-size: .875rem;
    color: #232323;
    font-weight: 700;
    margin-left: .7em;
    display: block;
}

.playlist-price-cart {
    margin-left: 0.3em;
    font-size: 16px;
    color: #232323;
    font-weight: 700;
}

.remove-playlist-from-cart {
    color: #232323;
    margin-left: 0.5em;
    display: flex;;
}

.row-summary {
    display: flex;
    justify-content: space-evenly;
    padding-top: 1em;
}

.row-summary .product-price {
    display: flex;
    justify-content: flex-end;
}

.row-summary .playlist-title {
    padding: 0 0 0 5px;
}

.row-summary .playlist-text {
    padding-left: 0;
}

@media only screen and (max-width: 600px) {
    .playlist-input-wrapper {
        padding: 1em 0;
    }

    .tox.tox-tinymce {
        height: 300px !important;
    }

    .playlist-select {
        height: 455px;
    }

    .tox.tox-tinymce {
        height: 300px;
    }

    #character_count {
        padding: 0;
    }

    .button-wrap button {
        font-size: .7em;
    }

    button.btn.btn-playlist {
        font-size: .8em;
        line-height: 2;
    }
}

.playlistModal .modal-content {
    background-color: #F0EAE0 !important;
}

.playlistModal .modal-title {
    width: 95%;
    font-family: Oranienbaum, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 1.6rem;
    color: black;
}

.playlistModal .modal-header .close {
    position: absolute;
    right: 0.3em;
    top: 0.2em;
    font-size: 2.7rem !important;
    font-weight: 100;
    color: #DC1F1A;
    text-shadow: none;
    opacity: 1;
}

.playlistModal .modal-body .form-control {
    text-transform: uppercase;
    font-size: .9em;
    border: none;
    width: 100%;
    text-align: left;
    display: flex;
    justify-content: space-between;
    color: black;
    align-items: center;
    padding: 0 1.6rem;
    margin-top: -1em;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background: white url("data:image/svg+xml,%3Csvg width='10' height='8' viewBox='0 0 14 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.92727 12L-0.000938416 0L13.8555 0L6.92727 12Z' fill='%23F89500'/%3E%3C/svg%3E%0A") no-repeat 98% 50%;
}

.playlistModal .modal-body li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 34px;
}

.btn.playlist {
    width: 100%;
}

.selected_song {
    /* remove standard background appearance */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* create custom radiobutton appearance */
    display: inline-block;
    width: 14px;
    height: 14px;
    padding: 2px;
    /* background-color only for content */
    background-clip: content-box;
    border: 2px solid #03993F;
    background-color: #e7e6e7;
    border-radius: 50%;
}

/* appearance for checked radiobutton */
.selected_song:checked {
    background-color: #03993F;
    padding: 0.1em;
}

/* optional styles, I'm using this for centering radiobuttons */
.flex {
    display: flex;
    align-items: center;
}

.justify-content-around {
    justify-content: space-around;
}

.justify-content-between {
    justify-content: space-between;
}

/*---------------------------Checkout playlist style start---------------------------*/

.checkout_playlist {
    display: none;
}

button.play-button {
    background: #03993F;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    cursor: pointer;
    position: absolute;
    right: 1.58em;
}

button.pause-button {
    background: #DC1F1A;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
}

button.pause-button::before,
button.pause-button::after {
    content: "";
    width: 0.1em;
    height: 8px;
    background-color: white;
    position: absolute;
    top: 6px;
}

button.pause-button::before {
    left: 7px;
}

button.pause-button::after {
    left: 11px;
}

.playlist-price-wrapper {
    display: flex;
    justify-content: center;
    padding: 0.2em 0;
}

.playlist-price-wrapper input {
    float: left;
    width: 1.5em;
    height: 1.5em;
    margin-right: 1em;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    cursor: pointer;
    background: white;
}

.playlist-price-wrapper input:checked, .playlist-checked {
    background: white url("data:image/svg+xml,%3Csvg width='17' height='13' viewBox='0 0 17 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 5.5L7 10.5L15.5 2' stroke='%2303993F' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E%0A") no-repeat center !important;
    margin-right: 7px;
}

.confirm-songs {
    height: 24px;
    font-size: small;
    display: flex;
    justify-content: center;
    align-items: center;
}

.confirm-songs:hover {
    opacity: .8;
}

.loading {
    position: relative;
    opacity: .8;
    pointer-events: none;
}

.loading:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 70%;
    width: 15px;
    height: 15px;
    margin-top: -8px;
    margin-left: -5px;
    border-radius: 50%;
    border: 2px solid #fff;
    border-top-color: #000;
    animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/*---------------------------Checkout playlist style end---------------------------*/