/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Sep 3, 2020, 3:51:50 PM
    Author     : Craig Buxton
*/

.thumbnail_column {
    margin: 0!important;
    max-width: fit-content;
}
.playlist_thumbnail {
    margin: 0!important;
}
.playlist_title,
.playlist_description,
.playlist_tablet_text,
.playlist_phone_text {
    max-width: 100%;
}
.playlist_title div,
.playlist_description div,
.playlist_tablet_text div,
.playlist_phone_text div {
    margin: 0 10px !important;
}
.playlist_row:hover {
    border-color: #25205c!important;
    background-color: #eeeeee;
    cursor: pointer;
}
@media screen and (min-width: 981px) {
    #player_section {
        padding-top: 150px;
        margin-top: -150px;
    }
}
@media screen and (max-width: 980px) {
    #player_section,
    #player_section div:last-of-type{
        padding-bottom: 0!important;
    }
    .playlist_title h5 {
        padding-bottom: 5px;
    }
    .playlist_row {
        display: flex;
    }
    .playlist_thumbnail {
        width: 177.78px!important;
    }
}
@media screen and (max-width: 767px) {
    .playlist_title h5 {
        font-size: 1em!important;
        margin-bottom: 0;
    }
    .playlist_phone_text {
        line-height: 1.2em;
    }
    .playlist_thumbnail {
        width: 133.33px!important;
    }
}
.video_tutorial_link {
    font-size:
    large;
    float:
    right;
}
.play_button {
    width:20px;
    height:20px;
    position: relative;
    top: 3px;
}
/* start hidden, then display after AJAX call gets videos */
.player_row{
    display: none;
}
/* start hidden, then display after AJAX call gets videos */
.playlist_row {
    display: none!important;
}

/* checkbox/field legend */
.brand_portal_title,
.product_portal_title {
    display: flex;
    justify-content: space-between;
}
#checkbox-legend {
    position: relative;
    line-height: 27px;
    font-size: small;
    font-weight: 400;
    color: rgb(10,10,10);
}
#checkbox-legend #is-show-on-web,
#checkbox-legend #not-show-on-web,
#checkbox-legend #is-inactive {
    display: flex;
}
#checkbox-legend #is-show-on-web div:last-of-type,
#checkbox-legend #not-show-on-web div:last-of-type,
#checkbox-legend #is-inactive div:last-of-type {
    margin-left: 30px;
}
#checkbox-legend #is-show-on-web div:last-of-type::before,
#checkbox-legend #not-show-on-web div:last-of-type::before,
#checkbox-legend #is-inactive div:last-of-type::before {
    content: " ";
    position: absolute;
    height: 20px;
    width: 20px;
    border: 1px solid black;
    margin-top: 2px;
    border-radius: 50%;
}
#product_edit_form #checkbox-legend #is-show-on-web div:last-of-type::before,
#product_edit_form #checkbox-legend #not-show-on-web div:last-of-type::before,
#product_edit_form #checkbox-legend #is-inactive div:last-of-type::before {
    left: 32px ! important;
}
#brand_edit_form #checkbox-legend #is-show-on-web div:last-of-type::before,
#brand_edit_form #checkbox-legend #not-show-on-web div:last-of-type::before,
#brand_edit_form #checkbox-legend #is-inactive div:last-of-type::before,
#item_list_form #checkbox-legend #is-show-on-web div:last-of-type::before,
#item_list_form #checkbox-legend #not-show-on-web div:last-of-type::before,
#item_list_form #checkbox-legend #is-inactive div:last-of-type::before {
    left: 35px ! important;
}
#checkbox-legend #is-show-on-web div:last-of-type::before {
    background-color: white;
}
#checkbox-legend #not-show-on-web div:last-of-type::before {
    background-color: #ccc;
}
#checkbox-legend #is-inactive div:last-of-type::before {
    background-color: rgba(248, 112, 96, 0.5) ! important;
}