/*@font-face {*/
/*    font-family: 'America';*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    src: local('America Regular'),*/
/*    local('America-Regular'),*/
/*    url(/fonts/GT-America-Standard-Regular.woff2) format('woff2'),*/
/*    url(/fonts/GT-America-Standard-Regular.woff) format('woff');*/
/*}*/

/*@font-face {*/
/*    font-family: 'America';*/
/*    font-style: normal;*/
/*    font-weight: 700;*/
/*    src: local('America Bold'),*/
/*    local('America-Bold'),*/
/*    url(/fonts/GT-America-Standard-Bold.woff2) format('woff2'),*/
/*    url(/fonts/GT-America-Standard-Bold.woff) format('woff');*/
/*}*/

/*@font-face {*/
/*    font-family: 'America';*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    src: local('America Medium'),*/
/*    local('America-Medium'),*/
/*    url(/fonts/GT-America-Standard-Medium.woff2) format('woff2'),*/
/*url(/fonts/GT-America-Standard-Medium.woff) format('woff');*/
/*}*/

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(/fonts/material/new-071620-MaterialIcons-Regular.woff2) format('woff2');
    font-display: swap;
}

/*@font-face {*/
/*    font-family: 'Graphik';*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    src: local('Graphik Regular'),*/
/*    local('Graphik-Regular'),*/
/*    url(/fonts/graphik/Graphik-Regular.woff) format('woff');*/
/*}*/

/*@font-face {*/
/*    font-family: 'Graphik';*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    src: local('Graphik Medium'),*/
/*    local('Graphik-Medium'),*/
/*    url(/fonts/graphik/Graphik-Medium.woff) format('woff');*/
/*}*/

/*@font-face {*/
/*    font-family: 'Graphik';*/
/*    font-style: normal;*/
/*    font-weight: 700;*/
/*    src: local('Graphik Semibold'),*/
/*    local('Graphik-Semibold'),*/
/*    url(/fonts/graphik/Graphik-Semibold.woff) format('woff');*/
/*}*/

/*.transition{*/
    /*-moz-transition: all 181ms linear;*/
    /*-o-transition: all 181ms linear;*/
    /*-webkit-transition: all 181ms linear;*/
    /*transition: all 181ms linear;*/
/*}*/
b, strong{
    font-weight: 700;
}

.transition {
    -moz-transition: all 250ms linear 0s;
    -o-transition: all 250ms linear 0s;
    -webkit-transition: all 250ms linear 0s;
    transition: all 250ms linear 0s;
}
input,
body{
    /*-webkit-font-smoothing: antialiased;*/
    /*position: relative;*/
    /*font-family: 'MaisonNeue', sans-serif;*/
    /*font-family: 'Muli', sans-serif;*/
    font-family: 'Libre Franklin', sans-serif;
    margin: 0px;
    height: auto;
    overflow-y: auto;
    /*background-color: #f1f1f1;*/
    background-color: #fff;
    -webkit-overflow-scrolling: touch;
    /*overscroll-behavior: contain;*/
}
    body[app-mode="moment"],
    body.player-expanded{
        position: fixed;
        left: 0px;
        top: 0px;
        bottom: 0px;
        right: 0px;
        overflow: hidden;
        /*position: relative;*/
        /*height: 100vh;*/
    }
        body.player-expanded .app-view > *{
            visibility: hidden;
        }
        .invisible{
            visibility: hidden !important;
        }
/*safari specific CSS styling:*/
/*reference: https://solvit.io/bcf61b6*/
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
{ @media {
    /*body{*/
    /*    font-family: Din;*/
    /*}*/

}}


body[data-device="desktop"] input,
body[data-device="desktop"]{
    /*font-family:  Graphik, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;*/
    font-family:  'IBM Plex Sans', Graphik, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
}

.user-options-container .username,
/*body[data-device="desktop"],*/
#modal-signin-btn,
.app-context,
.person-name,
.category-name,
.clip-container .speaker-name,
.tag-name,
.nav-str,
.clip-title,
.clip-container .episode-title,
.player .episode-title,
.tag,
.is-loading-container,
body:not([data-device="desktop"]) .moment-content,
.loading-error,
.pod-btn,
.badge.new-feat-badge,
.user-menu-slideout-opt,
.feed-title{
    -webkit-user-select: none;
    user-select: none;
}

/*note: 5.22.20 MM asked for the item titles to be selectable on desktop so that it'd be easier to share*/
body[data-device="desktop"] .moment-content,
body[data-device="desktop"] .app-player-container .clip-title{
    -webkit-user-select: text;
    user-select: text;
}
/*added 3.12.20 by KL because we started to self-host material icons' web font*/
.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;  /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;

    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;

    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;

    /* Support for IE. */
    font-feature-settings: 'liga';
}
/*added 3.12.20 by KL because we started to self-host material icons' web font*/

h1,
h2,
h3,
h4{
    margin: 0px;
}
body[data-device="desktop"] div#enable-notifs-btn:hover,
body[data-device="desktop"] .app-navigation .nav-option:hover .nav-option-inner,
body[data-device="desktop"] .app-header > .app-header-icon-wrapper .app-header-img:not(.light):hover,
body[data-device="desktop"] .user-options-container > .dropdown-trigger:not(.light):hover,
.hover-bg-color-0:hover,
.bg-color-0{
    background-color: #dfe3f3 !important;
}
.hover-bg-color-0_5:hover,
.bg-color-0_5{
    background-color: #adb8f3 !important;
}

/*START color #1.5*/
.active-bg-color-1_5:active,
.hover-bg-color-1_5:hover,
.bg-color-1{
    background: #8799f2 !important;
}

.hover-color-1_5:hover {
    color: #8799f2 !important;
}

.border-color-1_5,
.border-color-1_5.focus-color-1_5:focus{
    border-color: #8799f2 !important;
}
.hover-bg-color-1_5:hover,
.bg-color-1_5{
    background: #8799f2 !important;
}
body[data-device="desktop"] .transcript-segment-action.play-btn:hover,
body[data-device="mobile"] .transcript-segment-action.play-btn:active,
.text-hover-color-1_5:hover,
.text-color-1_5:not(:hover):not(:active),
.active-color-1_5:active{
    color: #8799f2 !important;
}
.hover-bg-color-1_5:hover {
    color: #ffffff;
}
/*START color #1.5*/

/*wrapping the :hover state in a media query rule because the :hover state is stays on an elem after a
user interacts with it 9.23.19 KL*/
@media only screen and (min-width: 600px) and (min-height: 500px) {
    .active-color-1:hover,
    .hover-color-1:hover {
        color: #93a3ef !important;
    }
}


/*background*/

/*START of color1*/
    .border-color-1,
    .hover-border-color-1:hover,
    .border-color-1.focus-color-1:focus{
        border-color: #93a3ef !important;
    }
.hover-bg-color-1:hover,
.bg-color-1{
    background: #93a3ef !important;
}
    .text-hover-color-1:hover,
    .text-color-1:not(:hover):not(:active),
    .active-color-1:active{
        color: #93a3ef !important;
    }
        .hover-bg-color-1:hover {
            color: #ffffff;
        }
/*wrapping the :hover state in a media query rule because the :hover state is stays on an elem after a
user interacts with it 9.23.19 KL*/
    @media only screen and (min-width: 600px) and (min-height: 500px) {
        .active-color-1:hover,
        .hover-color-1:hover {
            color: #93a3ef !important;
        }
    }

/*END of color1*/

/*START  of color2*/
.active-bg-color-2:active,
.hover-bg-color-2:hover,
.bg-color-2{
    background-color: #556cd6 !important;
}
    /*.item-container.current,*/
    /*.item-container.current .card,*/
    .hover-border-color-2:not(.no-hover):hover,
    .active-border-color-2:active,
    .focus-border-color-2:focus{
        border-color: #556cd6 !important;
    }
    .active-box-shadow-color-2:active,
    .focus-box-shadow-color-2:focus{
        box-shadow: 0 1px 0 0 #556cd6 !important;
    }
    .transcript-segment-action.play-btn,
    .text-hover-color-2:hover,
    .text-color-2:not(:hover):not(:active),
    .active-color-2:active{
        color: #556cd6 !important;
    }
    .hover-bg-color-2:hover {
        color: #ffffff !important;
    }
    /*wrapping the :hover state in a media query rule because the :hover state is stays on an elem after a
    user interacts with it 9.23.19 KL*/
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .active-color-2:hover,
            .hover-color-2:hover {
                color: #556cd6 !important;
            }
        }
    .border-color-2{
        border-color: #556cd6 !important;
    }

/*END  of color2*/

/*.bg-color-2:hover,*/
.active-bg-color-3:active,
body[data-device="desktop"] .hover-bg-color-3:hover,
.bg-color-3{
    background: #4a56ca !important;
}
    body[data-device="desktop"] div#enable-notifs-btn:hover,
    body[data-device="desktop"] .app-navigation .nav-option:hover .nav-option-inner,
    .text-color-3,
    .text-hover-color-3:hover,
    .active-color-3:active{
        color: #4a56ca !important;
    }
    .border-color-3,
    .hover-border-color-3:hover{
        border-color: #4a56ca !important;
    }
/*body[data-device="desktop"] .tag-feed-item.list-nav-item.active,*/
body[data-device="mobile"] .active-bg-color-4:active,
body[data-device="desktop"] .hover-bg-color-4:hover,
.bg-color-4{
    background: #2e3aab !important;
}

/*END of POD COLOR PALETTE*/

/*START OF MATERIALIZE COLOR SUPPLEMENT*/

.teal-border.accent-4:hover{
    border-color: #00bfa5 !important;
}
.blue-border.darken-3:hover{
    border-color: #0277bd !important;
}
.purple-border.lighten-2:hover{
    border-color: #ba68c8 !important;
}
.light-blue-border.accent-2:hover{
    border-color: #40c4ff !important;
}
.green-border.darken-3:hover{
    border-color: #2e7d32 !important;
}
.deep-orange-border:hover{
    border-color: #ff5722 !important;
}
.teal-border.accent-3:hover{
    border-color: #1de9b6 !important;
}
/*government*/
.blue-grey-border.darken-1:hover{
    border-color: #546e7a !important;
}
/*diet*/
.amber-border.darken-2:hover{
    border-color: #ffa000 !important;
}

/*END OF MATERIALIZE COLOR SUPPLEMENT*/

.app-footer{
    position: fixed;
    bottom: 0px;
    width: 100vw;
    z-index: 9;
}
nav .brand-logo{
    font-size: 20px;
}
nav .brand-logo > img{
    vertical-align: middle;
    margin: 0px 10px;
    position: relative;
    top: -2px;
}

.main-app-container{
    display: flex;
    flex-direction: column;
    /*height: 100%;*/
    /*width: 100%;*/
    position: fixed;
    top:0px;
    left:0px;
    bottom:0px;
    right:0px;
    height: 100%;
    overflow-y: auto;
}
    /*note: desktop only*/
    @media only screen and (min-width: 600px) and (min-height: 500px){
        .main-app-container{
            padding-left: 260px;
        }
        body{
            display: flex;
            align-items: stretch;
        }
    }
    body[data-device="mobile"] > .app-header,
    body[data-device="desktop"] .app-view > .app-header{
        display: none !important;
    }
    /*NOTE: we only want to display the app header auto appended at the top of the page on a FRESH app load (for branding purposes)*/
    /*as soon as the user navigates, it should go away.*/
    /*@media only screen and (max-width: 600px) and (orientation: portrait){*/
    @media only screen and (orientation: portrait){
    /*(orientation: landscape) and (max-width: 820px) {*/
        body[data-device="mobile"][prev-app-mode=""][data-scroll-direction=""] > .app-header {
            display: block !important;
        }
    }
    /*hiding scrollbars*/
    .main-app-container::-webkit-scrollbar,
    .app-view::-webkit-scrollbar,
    .list-item-inner-container.horizontal::-webkit-scrollbar,
    body[data-discovery-redesign="true"] #category-list::-webkit-scrollbar,
    .list-item-container.horizontal::-webkit-scrollbar {
        width: 0 !important;
    }
    .list-item-inner-container.horizontal::-webkit-scrollbar,
    .list-item-container.horizontal::-webkit-scrollbar,
    body[data-discovery-redesign="true"] #category-list::-webkit-scrollbar,
    body[data-device="mobile"] .list-item-container.horizontal::-webkit-scrollbar{
        height: 0px !important;
    }
    .app-view{
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        position: relative;
    }
        body[app-mode="simple"] .app-view {
            padding: 0px 25px;
        }
        /*body[data-device="desktop"] .app-view{*/
        /*    width: calc(100vw - 260px);*/
        /*    width: -webkit-calc(100vw - 260px);*/
        /*    width: -moz-calc(100vw - 260px);*/
        /*}*/
    /*!*body.mobile-ios .app-view{*!episode-minified-app-header*/
        /*height: 100%;*/
        /*max-height: 100%;*/
        /*overflow-y: auto;*/
    /*}*/
    /*not in use*/
        /*.app-view.fadeIn{*/
            /*animation: fadeIn 300ms linear 0s;*/
            /*animation-fill-mode: forwards;*/
        /*}*/
        /*    body:not(.mobile-ios).player-visible .app-view,*/
        /*    body[app-mode="home"] .app-view,*/
        /*    body[app-mode="search"] .app-view,*/
        /*    body.mobile-ios .app-view{*/
            .app-view{
                padding-bottom: 56px;
            }

                body[data-discovery-redesign="true"][data-device="mobile"][app-mode="home"] .app-view,
                body[data-discovery-redesign="true"][data-device="mobile"][app-mode="search"] .app-view{
                    background-color: #f2f2f2;
                }

            /*body:not(.mobile-ios).player-visible .app-view:not(.flex-row){*/
            /*    padding-bottom: 80px;*/
            /*}*/
            body.player-minimized .app-view,
            body.player-visible .app-view,
            body.mobile-ios.player-visible .app-view{
                padding-bottom: 126px;
            }
            body.mobile-ios.mobile-safari.player-visible .app-view{
                padding-bottom: 181px;
            }
            body[data-active-search="true"][data-device="desktop"] .app-view,
            body[data-active-search="true"][data-device="desktop"] .app-footer,
            body[data-active-search="true"][data-device="desktop"] > .app-header > .app-header-icon-wrapper {
                display: none;
            }
                body[data-active-search="true"][data-device="desktop"] .app-header {
                    background-color: #FFFFFF !important;
                }
        .app-context-container {
            text-align: center;
        }
        .app-context{
            margin: 0px;
            padding: 14px 20px;
            /*background-color: rgba(0,0,0,0.3);*/
            color: #fff;
            /*border-bottom: 1px solid rgba(255,255,255,0.1);*/
        }
            @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
                .app-context{
                    font-size: 0.8em;
                }
            }
    /*body[app-mode="home"] .app-context,*/
        /*body[app-mode="item"][prev-app-mode=""] .app-context,*/
        /*body[app-mode="item"][prev-app-mode="episode"] .app-context,*/
        /*body[app-mode="list"] .app-context,*/
        /*body[app-mode="feed"] .app-context,*/
        /*body[app-mode="episode"] .app-context{*/
        .app-player-container.minimized .app-context,
        .app-player-container.expanded[data-list-type="related"] .app-context,
        .app-player-container.expanded[data-list-type="invalid"] .app-context,
        .app-player-container.expanded[data-list-type="episode"] .app-context{
            display: none;
        }
        .app-context #context-name{
            text-transform: capitalize;
        }
        .container {
            background: #FFFFFF;
        }
        .app-view > .container,
        .app-view > .list-container{
        }
        /*note: desktop only*/
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .app-view > .container,
            .app-view > .list-container{
                max-height: 100%;
            }

            .app-footer{
                position: fixed;
                width: auto;
                order: 1;
                top: 66px;
            }
                body.player-visible:not(.player-expanded) .app-footer{
                    bottom: 100px;
                }
                .app-footer > .app-navigation{
                    width: 260px;
                }
                .app-context-container{
                    /*border-left: 1px solid #556cd6;*/
                    border-left: 1px solid rgba(0,0,0,0.2);
                }
            .app-view{
                order: 2;
                /*position: fixed;*/
                position: absolute;
                top: 66px;
                left: 260px;
                right: 0px;
                /*bottom: 0px;*/
                overflow-y: scroll;
                min-height: calc(100vh - 66px);
                min-height: -moz-calc(100vh - 66px);
                min-height: -webkit-calc(100vh - 66px);
                /*background-color: #f9f9f9;*/
            }

                body[app-mode="feed"] .app-view,
                body[app-mode="episode"] .app-view {
                    background-color: rgb(252, 252, 252);
                }
                body[data-device="desktop"] .app-view.flex-row {
                    flex-direction: row;
                    align-items: stretch;
                }
                body:not(.mobile-ios).player-visible .app-view:not(.flex-row),
                body:not(.mobile-ios).player-visible .app-view.flex-row > .secondary-leftnav,
                body:not(.mobile-ios).player-visible .app-view.flex-row > .clip-list-container{
                    padding-bottom: 100px;
                }
            .container{
                width: 100%;
                max-width: none;
                /*padding: 10px 15px;*/
            }
            body[app-mode="feed"] .container{
                /*background-color: #ffffff;*/
            }
        }
    /*mobile landscape only*/

    @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
        .show-on-medium-and-up{
            display: none !important;
        }
        .hide-on-med-and-up{
            display: block !important;
        }
    }
@media only screen and (max-width: 600px),
(orientation: landscape) and (max-width: 820px) {
        .container{
            padding: 0px;
            width: 100%;
            flex-grow: 1;
        }
            /*body[data-device="desktop"] .moment-container .play-icon:hover,*/
            /*body[data-device="mobile"] .moment-container .play-icon:active,*/
            /*.moment-container.full .moment-content-container:active,*/
            /*.moment-container:not(.full):active .moment-content-container{*/
            /*    background-color: #d4eae4;*/
            /*}*/
            /*    body[data-device="desktop"] .moment-container.full .moment-content-container:hover:after,*/
            /*    body[data-device="mobile"] .moment-container.full .moment-content-container:active:after{*/
            /*        border-top-color: #d4eae4;*/
            /*    }*/
    .player-expanded .app-footer{
        position: static;
    }
}

.list-header,
#episode-summary-list-header~.episode-summary,
#episode-transcript-list-header~.episode-transcript {
    padding: 10px;
    /*text-transform: capitalize;*/
}
    #non-dialogue-clips-header{
        margin-top: 20px;
    }
.list-item-container.horizontal{
    white-space: nowrap;
    padding: 0px 5px;
    background-color: #FFFFFF;
}
    .moment-card-footer {
        display: flex;
        align-items: stretch;
        /*justify-content: flex-start;*/
        justify-content: space-between;
        background-color: #21ce99;
        color: #FFF;
        /*padding: 0px 5px 0px 15px;*/
        padding: 0px 15px;
    }
    /*.moment-container.full .moment-card-footer{*/
    /*    !*padding-right: 2px;*!*/
    /*}*/
    body[data-device="desktop"] .moment-card-footer {
        width: 100%;
    }

.moment-container {
    display: inline-block;
    margin-right: 5vw;
}
.clip-container.carousel-card,
.moment-container {
    width: 80vw;
    white-space: normal;
    vertical-align: top;
    position: relative;
}
    /*added 6.9.20 by KL for moment card landing page*/
    .moment-container.full {
        /*visibility: hidden;*/
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 55px;
        left: 0px;
        right: 0px;
        bottom: 0px;
        z-index: 10;
        background-color: #FFFFFF;
        width: 100vw;
        margin: 0px;
        padding: 15px;
        justify-content: center;
        align-items: center;
    }
        body[data-device="mobile"] .moment-container.full {
            /*visibility: hidden;*/
        }
        body[data-device="desktop"] .moment-container.full {
            top: 66px;
            left: 260px;
            width: auto;
            padding: 50px;
            z-index: 9;
        }
            body[data-device="desktop"].player-minimized .moment-container.full {
                bottom: 100px;
            }
            body[data-device="desktop"] .moment-container.full .moment-content-container {
                max-width: 540px;
            }
        .moment-content-outer-container {
            flex-direction: column;
            display: flex;
            justify-content: center;
            position: relative;
            margin-bottom: 10px;
        }
            .moment-container.full .moment-content-outer-container:hover {
                cursor: pointer;
            }
            body[data-device="desktop"] .moment-content-outer-container {
                align-items: center;
                /*flex-grow: 1;*/
            }

@media only screen and (min-width: 600px) and (min-height: 500px) {
    .moment-item-container{
        /*border-bottom: 1px solid rgb(236, 239, 241);*/
        background-color: transparent;
        box-shadow: none;
    }
    .list-item-container.horizontal.moment-item-container::-webkit-scrollbar {
        width: 4px !important;
    }
        .moment-container{
            min-width: 400px;
            width: 400px;
        }
        .clip-container.carousel-card,
        .moment-container{
            margin-bottom: 0px;
        }
            /*.moment-container:not(.full):hover{*/
            /*    cursor: pointer;*/
            /*}*/
}
    .moment-container:first-child{
        margin-left: 12px;
    }
        body[data-device="desktop"] .moment-container:first-child{
            margin-left: 0px;
        }
        .moment-content i{
            font-size: inherit;
        }
    .opening-quote{
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    .mi-format-quote:before{
        content: "format_quote";
    }
    /*.moment-container:active{*/
        /*background-color: #d4eae4;*/
    /*}*/
    .moment-container *{
        -webkit-tap-highlight-color: transparent;
    }
    .moment-content-outer-container{
        background-color: #e7f8f3;
        border-radius: 3px;
        border: 1px solid #21ce99;
    }
    .moment-content-container{
        position: relative;
        display: inline-block;
        width: 100%;
        padding: 15px;
        color: #333333;
    }
        body[data-device="desktop"] a.moment-content-container:hover {
            cursor: default;
        }
        /*.moment-container.full .moment-content-container:after{*/
        /*    content: '';*/
        /*    position: absolute;*/
        /*    bottom: 0;*/
        /*    left: 50%;*/
        /*    width: 0;*/
        /*    height: 0;*/
        /*    border: 14px solid transparent;*/
        /*    border-top-color: #e7f8f3;*/
        /*    border-bottom: 0;*/
        /*    margin-left: -14px;*/
        /*    margin-bottom: -14px;*/
        /*}*/
            .moment-container.full.active .moment-content-container:after{
                border-top-color: #e8fff7;
            }
        .moment-container.full .moment-content-outer-container:before{
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            width: 0;
            height: 0;
            border: 14px solid transparent;
            border-top-color: #21ce99;
            border-bottom: 0;
            margin-left: -14px;
            margin-bottom: -14px;
        }
        .moment-content-container > .moment-content{
            font-family: Georgia, serif;
        }
        body[data-device="desktop"] .moment-content-container{
            padding: 15px 3px 15px 15px;
            user-drag: none;
            -webkit-user-drag: none;
        }
        .moment-content-container.highlighted{
            /*background-color: #cae8e0;*/
            /*animation-delay: 0ms;*/
            /*animation-duration: 250ms;*/
            /*animation-name: highlight;*/
        }
            .moment-content-container.highlighted .moment-content{
                font-size: 1.35em;
                font-weight: 600;
            }
@keyframes highlight {
    0% {
        background-color: #e7f8f3;
    }

    50% {
        background-color: #cae8e0;
    }

    100% {
        background-color: #e7f8f3;
    }
}
    .moment-container.active .moment-content{
        color: #000;
    }
        /*.moment-container.active .is-playing-indicator-outer{*/
        .moment-container .is-playing-indicator-outer{
            display: flex;
            align-items: center;
            height: auto;
            bottom: 0px;
            top: auto;
            right: auto;
        }
            body[data-device="desktop"] .moment-container .is-playable-indicator:hover{
                cursor: pointer;
            }
            .moment-container.full[data-moment-id="000000"] .moment-card-footer > * {
                position: relative;
                top: -1000px;
            }
        .moment-container:not(.active) .is-playing-indicator-inner{
            visibility: hidden;
        }
        .moment-container .is-playing-indicator-inner{
            /*position: absolute;*/
            top: auto;
            bottom:-1px;
            left: 0px;
        }
            .moment-container .is-playing-indicator-inner .bar{
                /*background: #21ce99;*/
                background: #d4eae4;
            }
    .moment-content {
        /*font-weight: 500;*/
        position: relative;
        z-index: 1;
        font-size: 1.4em;
        line-height: 1.4em;
        height: 4.2em;
        max-height: 4.2em;
        overflow-y: auto;
        margin-bottom: 5px;
    }
        .moment-container .moment-content-container{
            padding-right: 3px;
        }
            body[app-mode="home"] .moment-content-container {
                border: none;
                color: #FFFFFF;
            }
            .moment-sub-content {
                display: flex;
                align-items: flex-start;
            }
                img.episode-thumbnail {
                    width: 36px;
                    height: auto;
                    border-radius: 4px;
                    margin-right: 8px;
                }
                .moment-sub-content .episode_title {
                    line-height: 1.3em;
                }
        .moment-container:not(.full) .moment-content-details {
            display: flex;
            flex-direction: column;
        }
        .moment-container.full .moment-content-details {
            text-align: center;
            margin-top: 13px;
        }
            body[data-device="desktop"] .moment-container.full .moment-content-details{
                margin-top: 18px;
                width: 540px;
                position:relative;
            }
                body[data-device="desktop"] .moment-container.full .moment-content-details .ep-img-url{
                    height: 76px;
                    width: 76px;
                    margin-top: 15px;
                    border-radius: 6px;
                }
            .moment-speaker {
                margin-bottom: 30px;
                display: inline-block;
                color: inherit;
            }
                body[data-device="desktop"] .moment-speaker:hover .moment-speaker-font-icon,
                body[data-device="mobile"] .moment-speaker:active .moment-speaker-font-icon,
                body[data-device="desktop"] .moment-speaker:hover .moment-speaker-icon-inner,
                body[data-device="mobile"] .moment-speaker:active .moment-speaker-icon-inner{
                    opacity: 0.8;
                }
                body[data-device="desktop"] .moment-speaker:hover .speaker-name,
                body[data-device="mobile"] .moment-speaker:active .speaker-name{
                    text-decoration: underline;
                }
                .moment-speaker-icon{
                    margin-bottom: 10px;
                }
                    .moment-speaker-icon-inner{
                        display: inline-block;
                        background-size: cover;
                        background-position: center;
                        background-repeat: no-repeat;
                    }
                    i.moment-speaker-font-icon.material-icons,
                    .moment-speaker-icon-inner {
                        /*border: 12px solid #ffffff;*/
                        border-radius: 50%;
                    }
                    i.moment-speaker-font-icon.material-icons{
                        width: 76px;
                        height: 76px;
                    }
                    .moment-speaker-icon-inner {
                        width: 100px;
                        height: 100px;
                    }
                    i.moment-speaker-font-icon.material-icons {
                        text-align: center;
                        color: #FFFFFF;
                        padding: 20px 0px;
                        border-radius: 50%;
                        font-size: 2.3em;
                    }
                .speaker-name{
                    font-weight: 600;
                    /*padding: 5px;*/
                    /*border-radius: 5px;*/
                }
                    .clip-container[data-audio-type="moment"] .speaker-name{
                        font-family: Georgia, serif;
                        /*text-transform: uppercase;*/
                        /*font-weight: 400;*/
                    }
                        body[data-device="desktop"] .clip-container[data-audio-type="moment"] .speaker-name{
                            font-size: 1.1rem;
                        }
        .moment-container.full .moment-action-container {
            position: fixed;
            bottom: 0px;
            right: 0px;
        }
            body[data-device="desktop"] .moment-container.full .moment-action-container {
                position: absolute;
                top: -30px;
                right:0px;
                bottom: auto;
            }
            .moment-action {
                padding: 5px;
                margin: 0px;
                /*color: rgba(0,0,0,0.7);*/
                display: flex;
                align-items: center;
            }
                .moment-container:not(.full) .moment-action{
                    /*margin-right: 6px;*/
                    /*margin-top: -5px;*/
                    padding-right: 0px;
                }
                body[data-device="desktop"] .moment-action:hover{
                    cursor:pointer;
                }
            .moment-container.full .share-btn {
                padding: 10px 0px 10px 10px;
                /*margin: 5px;*/
            }
                body[data-device="desktop"] .moment-container.full .share-btn {
                    padding-top: 0px;
                    padding-bottom: 0px;
                    margin: 0px;
                }
        .moment-container .moment-content{
            padding-right: 3px;
        }
        span.last-word-wrapper{
            display: inline;
            white-space: nowrap;
        }
        .moment-container .moment-content::-webkit-scrollbar{
            width: 4px;
        }
            .moment-container:hover .moment-content::-webkit-scrollbar{
            }
        .moment-container .moment-content::-webkit-scrollbar-thumb{
            background-color: transparent;
            border-radius: 2px;
        }
            .moment-container.full .moment-content::-webkit-scrollbar-thumb,
            body:not([app-mode="home"])[data-device="desktop"] .moment-content-container:hover .moment-content::-webkit-scrollbar-thumb,
            body:not([app-mode="home"])[data-device="mobile"] .moment-container .moment-content::-webkit-scrollbar-thumb{
                /*transition: 2000ms background-color;*/
                /*-moz-transition: 2000ms background-color;*/
                /*-o-transition: 2000ms background-color;*/
                /*-webkit-transition: 2000ms background-color;*/
                background-color:rgba(33, 206, 153 , .4);
            }
    .moment-container:not(.full) .clip-title{
        /*visibility: hidden;*/
        font-size: 0.9em;
        line-height: 1.3;
    }
        .moment-container.full .moment-content-details{
            font-size: 1.1em;
            line-height: 1.3;
        }
        .moment-container.active .clip-title{
            /*visibility: visible;*/
        }
        .moment-container .clip-title > span{
            /*font-weight: 500;*/
        }
        .moment-container .is-playable-indicator{
            display: block;
            /*position: absolute;*/
            /*bottom: 0px;*/
            /*right: 0px;*/
            z-index: 1;
            position: relative;
            left: -11px;
        }
            body[data-device="desktop"] .moment-container .is-playable-indicator{
                left: -13px;
            }
        .is-playable-indicator{
            display: none;
        }
            .is-playable-indicator > i{
                /*color: rgba(0,0,0,0.15);*/
                /*color: rgb(33,206,153);*/
                color: inherit;
            }

        .moment-container.full .is-playable-indicator {
            /*display: inline-block;*/
            display: flex;
            align-items: center;
        }
            .moment-container .is-playable-indicator .material-icons{
                height: 31px;
                width: 31px;
            }
                .moment-container.full .is-playable-indicator .material-icons{
                    height: 32px;
                    width: 32px;
                }
                    body[data-device="desktop"] .moment-container .is-playable-indicator .material-icons{
                        height: 33px;
                        width: 33px;
                    }
                        body[data-device="desktop"] .moment-container.full .is-playable-indicator .material-icons{
                            height: 34px;
                            width: 34px;
                        }
    /*@media only screen and (min-width: 600px) and (min-height: 500px) {*/
    /*    .moment-container:first-child{*/
    /*        margin-left: 0px;*/
    /*    }*/
        .moment-content-container.highlighted .is-playable-indicator,
        body[data-device="desktop"] .moment-container.active .is-playable-indicator,
        body[data-device="desktop"] .moment-content-container:hover~.is-playable-indicator,
        body[data-device="desktop"] .is-playable-indicator:hover{
            /*position: absolute;*/
            /*top: 0px;*/
            /*bottom: 0px;*/
            /*left: 0px;*/
            /*right: 0px;*/
            /*left: 50%;*/
            /*right: auto;*/
            /*margin-left: -25px;*/
            display: flex !important;
            justify-content: flex-end;
            align-items: flex-end;
        }

        .moment-container .moment-content{
            padding-right: 15px;
            font-size: 1.3em;
        }
            .moment-container.full .moment-content.short-title{
                font-size: 7.2vw;
            }
            .moment-card-content-clone,
            .moment-container.full .moment-content{
                font-size: 6vw;
            }
            .moment-container.full .moment-content.long-title{
                font-size: 5.1vw;
            }
            .moment-container.full .moment-content.extra-long-title{
                font-size: 4.9vw;
            }
                body[data-device="desktop"] .moment-container.full .moment-content.short-title{
                    font-size: 2.2vw;
                }
                body[data-device="desktop"] .moment-card-content-clone,
                body[data-device="desktop"] .moment-container.full .moment-content{
                    font-size: 1.4vw;
                }
                body[data-device="desktop"] .moment-container.full .moment-content.long-title{
                    font-size: 1.2vw;
                }
                body[data-device="desktop"] .moment-container.full .moment-content.extra-long-title{
                    font-size: 1vw;
                }
            .moment-container.full .moment-content{
                line-height: 1.4;
            }
            .moment-container.full .moment-content {
                /*max-height: calc(100vh - 450px);*/
                /*max-height: -moz-calc(100vh - 450px);*/
                /*max-height: -webkit-calc(100vh - 450px);*/
                max-height: calc(100vh - 500px);
                max-height: -moz-calc(100vh - 500px);
                max-height: -webkit-calc(100vh - 500px);
                height: auto;
                overflow-y: auto;
                overflow-x: hidden;
            }
            /*body[data-device="desktop"] .moment-container.full .moment-content{*/
            /*    font-size: 1.4rem;*/
            /*}*/
            body[app-mode="home"] .moment-content {
                margin-bottom: 24px;
            }
        .moment-container:not(.full).active .moment-content-container{
            background-color: #e8fff7;
        }
            .moment-container .moment-countdown{
                margin-right: 10px;
                line-height: 1;
                text-align: right;
                font-family: "Roboto Mono", "Lucida Console", Monaco, monospace;
            }
            /*.moment-container .is-playable-indicator > i,*/
            /*.moment-container .moment-countdown{*/
            .moment-container .is-playable-indicator > i{
                /*margin: 10px;*/
                /*margin: 5px;*/
            }
                .moment-container:not(.full) .is-playable-indicator > i{
                /*.moment-container:not(.full) .is-playable-indicator > i,*/
                /*.moment-container:not(.full) .moment-countdown{*/
                    margin: 5px;
                }
                    .moment-container:not(.full) .moment-countdown{
                        margin-right: 7px;
                    }
            .moment-container .is-playable-indicator > i{
                border-radius: 50%;
                /*border: 1px solid rgb(33,206,153);*/
                border: 1px solid #FFFFFF;
                /*font-size: 24px;*/
                padding: 1px;
                font-size: 2em;
                /*padding: 8px;*/
            }
                .moment-container .moment-action > i{
                    opacity: 1.0;
                }
                body[data-device="desktop"] .moment-container .moment-action:hover > i,
                body[data-device="mobile"] .moment-container .moment-action:active > i{
                    /*border-color: #12ab7c;*/
                    /*color: #12ab7c;*/
                    opacity: 0.75;
                }
                /*body[data-device="desktop"] .moment-container .is-playable-indicator:hover > i,*/
                /*body[data-device="mobile"] .moment-container .is-playable-indicator:active > i{*/
                /*    !*border-color: #12ab7c;*!*/
                /*    !*color: #12ab7c;*!*/
                /*    opacity: 0.75;*/
                /*}*/
                .moment-container.active .is-playable-indicator > i.play-icon,
                .moment-container .is-playable-indicator > .moment-countdown,
                .moment-container .is-playable-indicator > i.pause-icon{
                    display: none;
                }
                .moment-container.active .is-playable-indicator > .moment-countdown,
                .moment-container.active .is-playable-indicator > i.pause-icon{
                    display: block;
                }
    /*}*/
    .clip-container .clip-duration{
        font-weight: 600;
    }
    .clip-container .clip-duration,
    .clip-container {
        color: #455a64;
        -webkit-tap-highlight-color: transparent;
    }
        .clip-container:not(.current) .row > * {
            background-image: none !important;
        }
        .clip-container.highlighted.current {
            position: relative;
        }
            .clip-container:not(.highlighted) .is-highlighted-indicator-container{
                display: none;
            }
            .is-highlighted-indicator-container {
                position: absolute;
                top: 0px;
                left: 0px;
                right: 0px;
                bottom: 0px;
                display: flex;
                justify-content: center;
                align-items: center;
            }
                .is-highlighted-indicator{
                    color: #FFFFFF;
                    height: 58px;
                    width: 58px;
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    opacity: 0.85;
                }
                    body[data-device="mobile"] .is-highlighted-indicator:active{
                        opacity: 1.0;
                    }
                    .is-highlighted-indicator i.material-icons {
                        font-size: 3.1rem;
                    }

/*body[app-mode="home"] .item-container {*/
        /*    margin: 0px 20px 20px;*/
        /*    border: 1px solid #eaeaea;*/
        /*    border-radius: 19px;*/
        /*    box-shadow: none;*/
        /*    overflow: hidden;*/
        /*}*/
        .clickable-actions-container {
            position: relative;
        }
            .clickable-actions-container img.pod-show-img{
                position: absolute;
                right: 15px;
                bottom: 20px;
            }
            img.pod-show-img {
                height: 65px;
                width: 65px;
                border: 1px solid #e0e0e0;
                border-radius: 3px;
                overflow: hidden;
            }
            .clip-action-container > img.pod-show-img {
                position: static;
            }
        body[data-device="desktop"] .clip-container,
        body[data-device="desktop"] .clip-container .card{
            transition: 0s background-color, border-color;
            -moz-transition: 0s background-color, border-color;
            -o-transition: 0s background-color, border-color;
            -webkit-transition: 0s background-color, border-color;
        }
            body[app-mode="home"][data-device="desktop"] .card {
                flex-direction: column;
            }
        .list-item-container.horizontal > .carousel-card .card{
            flex-grow: 1;
            padding-top: 14px;
            padding-bottom: 14px;
        }
        .moment-item-container.fadeIn,
        .list-header.fadeIn,
        .clip-container.fadeIn{
            animation-delay: 0ms;
            animation-duration: 250ms;
            animation-name: fadeIn;
            animation-fill-mode: forwards;
        }
        /*body:not([prev-app-mode=""]) .item-container{*/
        /*    display: none;*/
        /*}*/
        /*    body:not([prev-app-mode=""]) .item-container.fadeIn{*/
        /*        display: block;*/
        /*    }*/
        @keyframes fadeIn {
            0% {
                opacity: 0;
            }

            100% {
                opacity: 1;
            }
        }
        body[data-device="desktop"] .clip-container .clickable-actions-container{
            display: flex;
            justify-content: flex-end;
        }
    #episode-minified-app-header{
        padding: 10px 8px;
    }
        #episode-minified-app-header .podcast-title{
            display: none;
        }
        #episode-minified-app-header .episode-info-container {
            display: flex;
            flex-grow: 1;
            align-items: center;
        }
            body[data-device="desktop"] #episode-minified-app-header .episode-info-container{
                padding: 0px 11px;
            }

        .transcripts-link-container {
            padding: 0px 25px 25px;
            display: block;
            width: 100%;
        }
            body[data-device="desktop"] .transcripts-link-container{
                padding-top: 25px;
            }
            .transcript-link-header {
                font-weight: 600;
                margin: 1rem 0px;
                font-size: 1.2rem;
            }
            a.clip-transcript-link {
                display: inline-block;
                padding: 5px 0px;
            }
                a.episode-transcript-link:hover,
                a.clip-transcript-link:hover {
                    cursor: pointer;
                    text-decoration: underline;
                }
        #clip-transcripts-list-header{
            margin-top: 15px;
        }
        .list-item-container.horizontal{
            padding: 12px 0px;
            background-color: transparent;
            overflow-x: auto;
        }
            .list-item-container.horizontal:not(.moment-item-container){
                display: flex;
                align-items: stretch !important;
                padding-left: 12px;
            }
                #tag-feed-item-container{
                    display: block;
                    padding-left: 0px;
                }
    @media only screen and (min-width: 600px) and (min-height: 500px) {
        .clip-container .clip-duration,
        .clip-container {
            color: #3b4347;
        }
        .feed-info-header ~ .clip-container{
            padding: 0px;
            width: 100%;
            /*-webkit-box-shadow: 0 0.0625rem 0.1875rem 0 rgba(152, 163, 179, 0.2), -0.0625rem -0.0625rem 0 0 rgba(152, 163, 179, 0.03);*/
        }
            .clip-container.carousel-card{
                max-width: 400px;
                margin-right: 36px;
            }
            .feed-info-header ~ .clip-container .row,
            .feed-info-header ~ .non-dialogue-item-container .carousel-card .row{
                padding: 0px 25px;
                min-width: 0px;
            }

            .feed-info-header ~ .non-dialogue-item-container .carousel-card .row,
            .feed-info-header ~ .clip-container[data-audio-type="moment"] .row{
                padding-right: 5px;
            }
        .feed-info-header ~ .clip-container,
        .transcripts-link-container{
            max-width: 840px;
            margin: 20px auto 0px;
        }
        .feed-info-header ~ .non-dialogue-item-container .carousel-card,
        .feed-info-header ~ .clip-container,
        .transcripts-link-container{
            background-color: #ffffff;
            box-shadow: 0 0.0625rem 0.1875rem 0 rgba(152, 163, 179, 0.2), -0.0625rem -0.0625rem 0 0 rgba(152, 163, 179, 0.03);
            -webkit-box-shadow: 0 0.0625rem 0.1875rem 0 rgba(152, 163, 179, 0.2), -0.0625rem -0.0625rem 0 0 rgba(152, 163, 179, 0.03);
            -moz-box-shadow: 0 0.0625rem 0.1875rem 0 rgba(152, 163, 179, 0.2), -0.0625rem -0.0625rem 0 0 rgba(152, 163, 179, 0.03);
            -o-box-shadow: 0 0.0625rem 0.1875rem 0 rgba(152, 163, 179, 0.2), -0.0625rem -0.0625rem 0 0 rgba(152, 163, 179, 0.03);
        }
        .clip-container .row,
        .clip-container .card{
            margin-top: 0px;
            margin-bottom: 0px;
        }
            .clip-container .card{
                background-color: transparent;
            }
        .clip-container:not(.carousel-card):last-child{
            margin-bottom: 20px;
        }
        .clip-container .card,
        .clip-container .clickable-actions-container {
            width: 100%;
        }
        .clip-container .card{
            box-shadow: none;
            align-items: stretch;
            padding-top: 25px;
        }
            .clip-container:not([clip-type="dialogue"]) .card{
                padding-top: 15px;
            }
        .clip-container .clickable-actions-container{
            padding-bottom: 25px;
            padding-top: 0px;
        }
            .clip-container:not([clip-type="dialogue"]) .clickable-actions-container{
                padding-bottom: 15px;
            }
        body[app-mode="home"] .clip-container .card,
        body[app-mode="feed"] .clip-container .card{
            align-items: stretch;
            border-radius: 0px;
        }
            .clip-container .card .card-stacked{
                padding-left: 0px;
                padding-right: 0px;
            }
            .clip-container[data-audio-type="moment"] .card .card-stacked{
                flex-direction: row;
            }
        /*#episode-minified-app-header,*/
        .list-header, #episode-summary-list-header~.episode-summary,
        #episode-transcript-list-header~.episode-transcript,
        .list-header,
        .app-view > .episode-summary,
        .list-item-container.horizontal:not(.moment-item-container),
        .list-item-container.horizontal.moment-item-container{
            padding-left: 80px;
            padding-right: 80px;
            align-items: start;
        }
            #tag-feed-item-container,
            #people-feed-item-container{
                padding-left:0px;
                padding-right: 0px;
            }
        .list-item-container.horizontal.moment-item-container{
            padding-bottom: 0px;
        }
            #episode-minified-app-header .podcast-title{
                display: block;
            }

            #episode-info-header ~ #moments-list-header,
            .feed-info-header.show ~ #moments-list-header,
            .feed-info-header.person ~ #moments-list-header{
                margin-top: 15px;
            }
        .clip-container .card:hover{
            /*background-color: #f5f5f5 !important;*/
        }
            .clip-container .is-playable-indicator > i {
                font-size: 2em;
                color: inherit;
            }
            body[app-mode="episode"] .clip-container .is-playable-indicator > i {
                color: #2196f3;
            }
        .clip-container:not(.active) .is-playable-indicator > i.pause-icon,
        .clip-container.active .is-playable-indicator > i.play-icon{
            display: none;
        }
        .clip-container.active .is-playable-indicator > i.pause-icon{
            display: block;
        }
        .feed-info-header ~ .clip-container:last-of-type {
            margin-bottom: 15px;
        }
    }

    .clip-container:hover{
        cursor: pointer;
    }
        body[data-device="desktop"] .clip-container{
            border: 1px solid transparent;
            border-radius: 2px;
        }
            body[data-device="desktop"] .clip-container[data-audio-type="moment"]:not(.current){
                background-image: none !important;
            }
            body[app-mode="home"][data-device="desktop"] .clip-container {
                width: 340px;
            }
        .clip-container.carousel-card {
            display: flex;
            align-items: stretch;
            flex-direction: row;
            justify-content: start;
            text-align: left;
            overflow: hidden;
            border-radius: 45px !important;
            min-width: 200px;
            border: 1px solid #e0e0e0;
            margin-right: 20px;
        }
            .clip-container.carousel-card .row {
                margin: 0px;
                display: flex;
                flex-direction: column;
                align-items: stretch;
                flex-grow: 1;
            }
            .clip-container .ep-publish-date{
                font-size: 0.8rem;
                display: flex;
                align-items: center;
                white-space: nowrap;
                justify-content: flex-end;
                margin-top: 8px;
                /*flex-grow: 1;*/
            }
                body[data-device="desktop"] .clip-container .ep-publish-date{
                    font-size: 0.9rem;
                    flex-grow: 0;
                    width: 120px;
                    justify-content: flex-start;
                    margin-top: 0px;
                    align-self: flex-end;
                }
                .ep-publish-date i.material-icons {
                    /*font-size: 1.4rem;*/
                    /*display: none;*/
                    font-size: 1.0rem;
                    margin-right: 4px;
                }
                    .body[data-device="desktop"] .ep-publish-date i.material-icons{
                        /*display: block;*/
                    }

        .clip-container .clip-action-container{
            /*border-top: 1px solid #cccccc;*/
            /*padding-top: 31px;*/
            padding-top: 20px;
            display: flex;
            align-self: flex-end;
            position: relative;
            align-items: center;
            /*margin-top: 10px;*/
            justify-content: space-between;
            margin-right: 120px;
        }
            body[app-mode="home"] .clip-container .clip-action-container,
            .feed-info-header[data-feed-type="category"]~.clip-container .clip-action-container,
            .feed-info-header[data-feed-type="topic"]~.clip-container .clip-action-container{
                margin-right: 30px;
            }
                .feed-info-header[data-feed-type="category"]~.clip-container .clip-action-container{
                    margin-right: 5px;
                }
                [data-audio-type="moment"].clip-container .clip-action-container {
                    justify-content: flex-end;
                    padding-top: 0px;
                    margin-top: 0px;
                    height: 0px;
                    /*margin-top: -12px;*/
                }
            body[data-device="desktop"] .clip-container .clip-action-container{
                padding-top: 15px;
                margin-right: 0px;
            }
            .clip-container .card-footer .clip-action-container{
                display: none;
            }
            body[app-mode="episode"] .clip-container .clip-action-container {
                /*align-self: flex-start;*/
                padding: 0px;
            }
            body[app-mode="episode"][data-device="mobile"] .clip-container .clip-action-container {
                padding-top: 20px;
                margin-right: 0px;
                margin-left: 60px;
            }
            .card-image .clip-action-container{
                width: 100%;
            }
            .fav-btn.favorited,
            .clip-container .clip-action-container .clip-fav-btn.favorited{
                /*color: #f88080 !important;*/
                color: #f25a5a !important;
            }
                .player .fav-btn.clip-bookmark.favorited,
                .clip-container .clip-action-container .clip-fav-btn.clip-bookmark.favorited{
                    color: #2196f3 !important;
                }
                /*.item-container .item-action-btn,*/
                /*.item-container .item-action-container .item-fav-btn:not(.favorited) > i.material-icons{*/
                    /*color: rgba(0,0,0,0.4);*/
                /*}*/
                .clip-container .clip-action-container .clip-action-btn > i.material-icons,
                .clip-container .clip-action-container .clip-action-btn > i.fa{
                    font-size: 1.5rem;
                }
                        .clip-container .clip-action-container .clip-action-btn > i.fa {
                            line-height: 19px;
                        }
                    #addit-audio-item-options-modal .drawer-option#share-modal-trigger > i.material-icons,
                    #share-moment-list-item > i.material-icons,
                    .share-btn:not(.do-not-flip) > i.material-icons,
                    .clip-container .clip-action-container .clip-share-btn > i.material-icons{
                        -moz-transform: scale(-1, 1);
                        -webkit-transform: scale(-1, 1);
                        -o-transform: scale(-1, 1);
                        -ms-transform: scale(-1, 1);
                        transform: scale(-1, 1);
                    }
                    .clip-container .clip-action-container .clip-share-btn > i.material-icons{
                        margin-right: 3px;
                    }
            .fav-btn,
            .clip-fav-btn{
                align-items: center;
            }
            .app-player-container.expanded .player-controls .fav-btn,
            .clip-container .clip-action-container .clip-fav-btn{
                display: flex;
            }
            .clip-container .clip-action-container .clip-fav-btn{
                width: auto;
                min-width: 22px;
            }
                .clip-container .clip-action-container .clip-fav-btn:not(.clip-bookmark),
                body[app-mode="episode"] .clip-container .clip-action-container .clip-fav-btn{
                    margin-left: 0px;
                }
                .num-favorites{
                    margin-left: 2px;
                    line-height: 100%;
                    min-width: 20px;
                }
                    .num-favorites[data-count="0"]{
                        visibility: hidden;
                        /*display: none;*/
                    }
                .player .fav-btn {
                    position: relative;
                }
                    .player .secondary-player-controls .fav-btn{
                        display: flex;
                    }
                    .player .num-favorites{
                        position: absolute;
                        left: 40px;
                        color: #FFFFFF;
                        font-weight: 500;
                    }
                        .player .minimized-action .num-favorites{
                            min-width: 20px;
                        }
                        .player .secondary-player-controls .num-favorites{
                            left: 30px;
                        }

            .clip-container .clip-action-btn {
                color: rgba(101, 119, 134, 0.7);
            }
            .moment-container .moment-action{
                color: inherit;
            }
            .clip-container .clip-action-container .pod-show-img+.clip-fav-btn,
            .clip-container .clip-action-btn {
                margin-left: 14px;
            }
                .clip-container[data-audio-type="moment"] .clip-action-btn{
                    margin-left: 0px;
                    position: relative;
                    top: 4px;
                }
                .clip-container:not(.current) .card-image > .play-pause-indicator{
                    display: none;
                }
                    .card-image > .play-pause-indicator {
                        position: absolute;
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                        justify-content: center;
                        top: 0px;
                        left: 0px;
                        right: 0px;
                        /* bottom: 0px; */
                        height: 95px;
                    }
                        .play-pause-indicator i.material-icons{
                            /*color: rgb(255,255,255,0.7);*/
                            color: #3e84f185;
                            font-size: 3rem;
                        }
            .clip-container .clip-action-btn{
                align-self: flex-end;
                display: flex;
                justify-content: center;
                align-items: center;
            }
                .clip-container .clip-action-btn{
                    width: 22px;
                    height: 22px;
                }
                    .clip-container .clip-share-btn.clip-action-btn {
                        width: auto;
                        height: auto;
                        color: #FFFFFF;
                        padding: 6px 8px;
                        border-radius: 18px;
                    }
                    .clip-action-btn.person-img-wrapper {
                        height: 70px;
                        width: 70px;
                    }

                        .clip-action-btn .person-img {
                            height: 100%;
                            width: 100%;
                            background-position: center center;
                            background-size: cover;
                            border-radius: 50%;
                            border: 1px solid #e0e0e0;
                        }
                .clip-container:not([data-audio-type="moment"]) .clip-action-btn:last-of-type{
                    margin-left: 30px;
                }
                body[data-device="desktop"] .clip-container .clip-action-btn.clip-tweet-btn:hover,
                body[data-device="mobile"] .clip-container .clip-action-btn.clip-tweet-btn:active{
                    color: rgb(29, 161, 242) !important;
                }
        /*.card-footer{*/
            /*display: flex;*/
            /*justify-content: flex-end;*/
            /*padding-top: 15px;*/
        /*}*/
        .tags-container{
            /*order: 0;*/
            display: flex;
            flex-wrap: wrap;
            flex-grow: 1;
            margin-bottom: -6px;
            align-items: flex-end;
            height: auto;
            /*max-height: 75px;*/
        }
            body:not([data-device="desktop"]) .ep-publish-date ~ .tags-container {
                order: 2;
                width: 100%;
            }
            body[app-mode="episode"] .tags-container{
                margin-left: 60px;
            }
            body[data-device="desktop"][app-mode="episode"] .tags-container{
                margin-left: 65px;
            }
            .clip-container:not([clip-type="dialogue"]) .clip-action-container > *:not(.show-in-moment),
            .clip-container:not([clip-type="dialogue"])[data-audio-type="moment"] .clip-action-container > *:not(.show-in-moment),
            .clip-container:not([clip-type="dialogue"])[data-audio-type="moment"] .clip-duration,
            .clip-container:not([clip-type="dialogue"])[data-audio-type="moment"] .tags-container {
                display: none;
            }
            .tags-container.populated{
                margin-top: 15px;
            }
            /*.tags-container.expanded{*/
                /*max-height: 200px*/
            /*}*/
            .tags-container:not(.expanded) .tag:not(.always-show){
                display: none;
            }
            .tag {
                font-weight: 500;
                max-width: 250px;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                padding: 2px 5px 3px;
                border-radius: 6px;
                margin-right: 6px;
                margin-bottom: 6px;
                text-transform: lowercase;
                font-size: 0.8em;
            }

                .tag:first-child {
                    margin-top: 16px;
                }
                    body[data-device="desktop"] .tag:first-child {
                        margin-top: 15px;
                    }
                .setting-action-btn > i,
                .full-tags-expand-btn{
                    font-family: sans-serif;
                }
                .full-tags-expand-btn{
                    display: inline-block;
                    border-radius: 50%;
                    font-weight: bold;
                    line-height: 24px;
                    width: 24px;
                    height: 24px;
                    margin-bottom: 6px;
                    text-align: center;
                }
                    .full-tags-expand-btn,
                    .tag {
                        border-width: 1px;
                        border-style: solid;
                    }
                        body[data-device="mobile"] .full-tags-expand-btn{
                            line-height: 23px;
                        }
@media only screen and (max-width: 600px),
    (orientation: landscape) and (max-width: 820px) {
        /*.item-container:focus {*/
            /*background-color: red;*/
        /*}*/

    .clip-container .card:active,
    .clip-container .card:active~.clickable-actions-container{
        background-color: #efefef !important;
    }
        .full-tags-expand-btn:active,
        .tag:active {
            cursor: pointer;
            color: #FFFFFF;
        }
    .app-player-container.minimized .player .episode-title{
        display: none;
    }

    .app-player-container.minimized .player .clip-info-slide .play-pause-btn,
    body[app-mode="episode"] .player-thumbnail-wrapper-inner{
        display: none;
        /*margin: 10px 5px;*/
    }
    .app-player-container.minimized .player .player-controls-outer .play-pause-btn{
        z-index: 2;
        position: static;
        background-color: transparent !important;
    }
}
.clip-container .card-content{
    padding: 4px 0px;
}
    .clip-container .card-content a{

        color: inherit
    }
    .clip-container .card-content > a{
        width: 100%;
    }
@media only screen and (min-width: 600px) and (min-height: 500px) {
    .tag {
        padding-bottom: 2px;
    }
    body[app-mode="home"] .clip-container .card-stacked .card-content,
    body[app-mode="feed"] .clip-container .card-stacked .card-content{
        padding: 0px;
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        flex-grow: 0;
    }
    body[app-mode="feed"] .clip-container[data-audio-type="moment"] .card-stacked .card-content,
    body[app-mode="home"] .clip-container .card-content .clip-info-container,
    body[app-mode="feed"] .clip-container .card-content .clip-info-container{
        flex-grow: 1;
    }

    .clip-header-container{
        display: flex;
        flex-grow: 1;
    }
    .card-footer{
        display: flex;
        justify-content: flex-end;
    }
        body[app-mode="episode"] .card-footer{
            display: block;
        }
        .full-tags-expand-btn,
        .tag{
            margin-right: 8px;
            margin-bottom: 8px;
        }

    /*body[data-device="desktop"] .tags-container{*/
    /*    margin-left: 120px;*/
    /*}*/
        .tag{
            font-weight: 500;
            font-size: 0.7em;
        }

        .full-tags-expand-btn{
            line-height: 20px;
            width: 21px;
            height: 21px;
        }

    .app-player-container.minimized .player .num-favorites{
        position: static;
    }
}
    body[app-mode="episode"] .clip-container:not(.pod-loading) .card-content{
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }
        body[app-mode="episode"] .non-dialogue-item-container .carousel-card .card-content {
            align-items: start;
        }
.clip-container .progress{
    margin: 0px;
}
.clip-container .card-content .clip-title{
    line-height: 1.5em;
    font-size: 20px;
    /*font-weight: 500;*/
    font-weight: 600;
    margin: 0px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
    .clip-container[data-audio-type="moment"] .card-content .clip-title{
        -webkit-line-clamp: 3;
        max-height: 4.5em;
    }
        body[data-device="desktop"] .clip-container[data-audio-type="moment"] .card-content .clip-title{
            margin-bottom: 15px;
            font-size: 1.35em;
        }
        .clip-container.carousel-card .card-content .clip-title{
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            max-height: 2.8em;
        }

.clip-container .episode-title {
    font-size: 14px;
}
    .moment-container:not(.full) .episode-title,
    .clip-container .episode-title,
    .search-container .result .result-secondary-str{
        color: rgba(69, 90, 100, 0.65);
    }
.clip-container .episode-title b{
    color: rgba(69, 90, 100, 1.0);
}
    .clip-container .episode-title .guest-names:not([data-num="1"]){
        white-space: normal;
    }
.clip-container .pod-title{
    color: #9a9a9a;
    font-size: 12px;
}
    .clip-container .card-stacked{
         padding: 0px;
     }

.clip-container .clip-duration{
    display: inline-block;
}
    .clip-container.carousel-card .clip-duration{
        font-size: 0.8em;
        font-weight: normal;
    }
    body[app-mode="episode"] .clip-container:not(.carousel-card) .clip-duration{
        margin-top: 6px;
    }
    .clip-container .last-word-wrapper{
        display: inline;
        position: relative;
    }
        .clip-container .episode-page-shortcut{
            /*display: none;*/
            /*position: absolute;*/
            /*top: -2px;*/
            /*right: -17px;*/
            position: absolute;
            visibility: hidden;
            right: -78px;
            font-size: 0.8rem;
            border-bottom: 1px dotted rgba(17, 51, 83, 0.6);
            line-height: 1.2em;
            bottom: 2px;
            -moz-transition: 0s visibility;
            -o-transition: 0s visibility;
            -webkit-transition: 0s visibility;
            transition: 0s visibility;

        }
    @media only screen and (min-width: 600px) and (min-height: 500px) {
        .clip-container .card-content .clip-title{
            font-size: 1.5em;
            line-height: 1.4em;
            font-weight: 500;
            padding-right: 30px;
            /*color: rgb(5, 15, 25);*/
            order: 0;
        }
            body[app-mode="home"] .clip-container .card-content .clip-title,
            body[app-mode="feed"] .clip-container .card-content .clip-title{
                margin-bottom: 12px;
            }
                .clip-container.pod-loading .card-content .clip-title{
                    margin-top: 0px;
                    width: 100%;
                }
            body[app-mode="episode"] .clip-container .card-content .clip-title{
                font-weight: normal;
                display: flex;
                align-items: center;
            }
            body[app-mode="episode"] .clip-container.carousel-card .card-content .clip-title{
                font-size: 0.9em;
                align-items: flex-start;
            }

        body[data-device="desktop"] .search-container .result[result-type = "moments"] .episode-title,
        .search-container .result[result-type="clips"] .episode-title,
        .moment-container:not(.full) .episode-title,
        .search-container .result[result-type="episodes"] .pod-title,
        .transcript-segment-timestamp,
        .clip-container .card .episode-title{
            /*episode title needs it's own rule because we override the opacity/color of the text when item duration and the BOLDED guest name is present*/
            color: rgba(17, 51, 83, 0.6) !important;
        }
        .result.tag:not(:hover):not(:active),
        .clip-container .tag:not(:hover):not(:active),
        .clip-container .full-tags-expand-btn:not(:hover):not(:active){
            color: rgb(17, 51, 83) !important;
        }

        .clip-container .tag:not(:hover):not(:active),
        .clip-container .full-tags-expand-btn:not(:hover):not(:active){
            opacity: 0.6;
        }
        .clip-container .full-tags-expand-btn,
        .result.tag,
        .clip-container .tag{
            border-color: rgb(17, 51, 83) !important;
        }
            .result.tag:hover,
            .active.result.tag:not(:hover),
            .clip-container .full-tags-expand-btn:hover,
            .clip-container .tag:hover{
                background-color: transparent !important;
                border-color: #4a56ca !important;
                color: #4a56ca !important;
            }
        .transcript-segment-timestamp,
        .clip-container .card .episode-title {
            color: rgba(17, 51, 83, 0.6);
        }
        .clip-container .card .episode-title{
            display: inline-block;
            font-size: 1.1rem;
            margin-right: 64px;
            padding-right: 20px;
            line-height: 1.3;
        }
            .clip-container.pod-loading .card-content .episode-title{
                width: 75%;
                margin-top: 5px;
            }
            .pod-show-img-wrapper {
                position: relative;
                display: block;
                align-self: start;
            }
                .clip-container img.pod-show-img {
                    height: 90px;
                    width: 90px;
                    border-radius: 10px;
                    border: 1px solid #e0e0e0;
                }
                .pod-show-img-wrapper .play-btn-wrapper {
                    position: absolute;
                    left: 50%;
                    top: 50%;
                    transform: translate(-50%, -50%);
                    /*opacity: 0.9;*/
                }
                    .pod-show-img-wrapper .play-btn-wrapper:hover {
                        /*cursor: pointer;*/
                        /*opacity: 1.0;*/
                    }
                    .clip-container:not(:hover) .play-btn-wrapper{
                        display: none;

                    }

            .clip-container:hover .episode-page-shortcut{
                visibility: visible;
                margin-left: 10px;
            }
                .clip-container .episode-page-shortcut:hover{
                    color: rgba(17, 51, 83, 1.0);
                }
                .episode-page-shortcut i.material-icons {
                    font-size: 14px;
                }
            /*.item-container .episode-title:hover{*/
                /*text-decoration: underline;*/
            /*}*/
        .clip-container .clip-action-container{
            padding: 10px;
            align-items: center;
            order: 1;
            justify-content: flex-start;
        }
        body[app-mode="home"] .clip-container .clip-action-container,
        body[app-mode="feed"] .clip-container .clip-action-container {
            margin-top: 20px;
            padding: 0px;
            align-self: flex-end;
        }
            body[app-mode="feed"] .clip-container[data-audio-type="moment"] .clip-action-container{
                margin-top: 0px;
            }
            body[app-mode="home"] .clip-container .card-footer .clip-action-container,
            body[app-mode="feed"] .clip-container .card-footer .clip-action-container {
                display: flex;
            }
            body[app-mode="home"] .clip-container .card-image .clip-action-container,
            body[app-mode="feed"] .clip-container .card-image .clip-action-container {
                display: none;
            }
        .clip-container .clip-action-btn,
        .clip-container .clip-action-container .clip-fav-btn{
            margin-right: 0px;

        }
        .clip-container .clip-action-btn{
            margin-left: 36px;
            align-self: auto;
        }
            .clip-container .clip-action-btn:last-of-type {
                margin-left: 52px;
            }
            body[app-mode="home"] .clip-container .clip-action-btn:last-child,
            body[app-mode="feed"] .clip-container .clip-action-btn:last-child{
                margin-right: 0px;
            }
            .clip-container .clip-action-container .clip-fav-btn:hover:not(.favorited) > i.material-icons,
            .clip-container .clip-action-btn:hover{
                cursor: pointer;
            }
        .clip-container .clip-duration {
            font-size: 14px;
            position: static;
            order: 2;
        }
            .carousel-card .clip-duration{
                font-size: 0.8em;
                font-weight: normal;
            }
        body[app-mode="home"] .clip-container .clip-duration,
        body[app-mode="feed"] .clip-container .clip-duration{
            margin-top: 0px;
            font-size: 15px;
        }
    }
    .moment-container .moment-duration {
    /*.item-container .item-duration {*/
        color: #888888;
    }
.clip-container .expand-btn{
    position: absolute;
    top: 8px;
    right: 8px;
    color: #9a9a9a;
}
.clip-container .expand-btn:hover {
    cursor: pointer;
    color: #636363;
}
.clip-container .card.horizontal .card-image{
    max-width: 180px;
    padding: 0px;
    -webkit-tap-highlight-color: transparent;
}
    body[app-mode="home"] .clip-container .card.horizontal .card-image,
    body[app-mode="feed"] .clip-container .card.horizontal .card-image {
        order: 2;
        min-width: 95px;
        width: 95px;
        display: flex;
        /*justify-content: space-between;*/
        justify-content: flex-start;
        flex-direction: column;
    }
    body[app-mode="home"][data-device="desktop"] .clip-container .card.horizontal .card-image {
        order: 0;
    }
    body[app-mode="home"][data-device="desktop"] .clip-container .card.horizontal .card-stacked {
        order: 1;
        margin-left: 0px;
    }
    body[data-device="desktop"] .feed-info-header[data-feed-type="show"]~.clip-container .card.horizontal .card-image,
    body[data-device="desktop"] .feed-info-header[data-feed-type="person"]~.clip-container .card.horizontal .card-image {
        display: none;
    }

    .clip-container .card.horizontal .card-image img{
        margin-bottom: 0px;
        height: auto;
    }
    .feed-list-item-img.person-img {
        width: 95px;
        height: 95px;
        background-size: cover;
        background-position: center center;
        border-radius: 50%;
        border: 1px solid #f1f1f1;
    }
    body[data-device="desktop"] .clip-container:not(.current):hover,
    body[data-device="desktop"] .clip-container:not(.current):hover .card,
    body[data-device="desktop"] .clip-container:hover .episode-page-shortcut{
        transition-delay: 75ms;
        /*transition-delay: 2s;*/
    }
@media only screen and (min-width: 600px) and (min-height: 500px) {

    .clip-container{
        border-bottom: 1px solid rgb(236, 239, 241);
    }
        .clip-container:not(.current):not(.no-hover):not([data-audio-type="moment"]) .row:hover .card,
        .clip-container:not(.current):not(.no-hover) .row:hover{
            /*background-color: #f9f9f9 !important;*/
            /*background-color: #fafafa !important;*/
            /*background-color: #fcfcfc !important;*/
            background-color: #f8f8f8 !important;
        }
        .clip-container.current,
        .clip-container.current .card {
            background-color: #f0f0f0 !important;
        }
            .clip-container[data-audio-type="moment"].current .card {
                background-color: transparent !important;
            }
        .clip-container .card.horizontal .card-image {
            margin-right: 20px;
        }
            body[app-mode="episode"] .clip-container:not(.pod-loading) .card.horizontal .card-image{
                width: 45px;
                min-width: 45px;
            }
            body[app-mode="home"] .clip-container .card.horizontal .card-image,
            body[app-mode="feed"] .clip-container .card.horizontal .card-image {
                width: 100px;
                height: 100px;
                min-width: 100px;
                order: 0;
            }
                body[app-mode="feed"] .clip-container .card.horizontal .card-image img {
                    /*border-radius: 50%;*/
                }
            .feed-list-item-img.person-img {
                height: 100%;
                width: 100%;
                border-radius: 50%;
            }
        body[app-mode="episode"] .clip-sequence-indicator{
            line-height: 44px;
        }
}

/*mobile specific styling*/
@media only screen and (max-width: 600px) and (orientation: portrait),
only screen and (orientation: landscape) and (max-width: 820px),
only screen and (orientation: landscape) and (max-height: 500px){

    .feed-info-header.show .pod-thumbnail-container,
    .feed-info-header.person .pod-thumbnail-container{
        position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        bottom: 0px;
    }
        .feed-info-header.show .pod-thumbnail-container #person-image-avatar,
        .feed-info-header.person .pod-thumbnail-container #person-image-avatar{
            height: 100%;
            width: 100%;
        }
    .clip-container .row{
        margin-bottom: 0px;
        border-bottom: 1px solid rgba(0,0,0,0.1);
    }
        .clip-container.carousel-card .row {
            padding-left: 0px;
            border-bottom: none;
        }
        *:not(.clip-container)+.clip-container .row,
        #clip-list-title+.clip-container .row {
            border-top: 1px solid rgba(0,0,0,0.1);
        }
        .clip-container.rnd .row {
            border: 1px solid rgba(0,0,0,0.1);
            background-color: #FFFFFF;
            margin: 10px 20px;
        }
        .clip-container.rnd.promo-card .card,
        .clip-container.rnd .row{
            border-radius: 20px;
        }
        .clip-container.rnd .card{
            border-radius: 20px 20px 0px 0px;
            padding-right: 20px;
        }
        body:not([data-device="desktop"]) .clip-container.rnd.current .clickable-actions-container {
            border-radius: 0px 0px 20px 20px;
        }

        /*body[app-mode="home"] .item-container .row{*/
        /*    border-bottom: none;*/
        /*}*/
        .clip-container .card,
        .clip-container .clickable-actions-container{
            /*padding: 0px 15px;*/
            padding: 0px 10px 0px 15px;
        }
            .clip-container.carousel-card .card{
                padding: 0px 10px 0px 20px;
            }
        body[app-mode="home"] .clip-container .card,
        body[app-mode="home"] .clip-container .clickable-actions-container{
            padding-left: 20px;
        }
        .clip-container .card{
            padding-top: 23px;
            margin-bottom: 0px;
            margin-top: 0px;
            box-shadow: none;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            border-radius: 0px;
        }
            .clip-container:not([clip-type="dialogue"]) .card{
                padding-top: 12px;
            }
                .clip-container[data-audio-type="moment"] .card{
                    /*padding: 18px 10px 0px 15px;*/
                    padding-top: 18px;
                }
        .clip-container .clickable-actions-container{
            padding-bottom: 23px;
        }
            .clip-container:not([clip-type="dialogue"]) .clickable-actions-container{
                padding-bottom: 12px;
            }
            .clip-container[data-audio-type="moment"] .clickable-actions-container{
                /*padding: 18px 10px 0px 15px;*/
                padding-bottom: 17px;
                padding-right: 4px;
            }
        /*body[app-mode="episode"] .item-container .card{*/
            /*border-bottom: none;*/
        /*}*/
    .clip-container .card.horizontal .card-image{
        border-radius: 0px;
        position: relative;
    }
        .clip-container .card.horizontal .card-image .clip-action-container{
            position: absolute;
            right: 0px;
            bottom: 0px;
        }
        body[app-mode="episode"] .clip-container:not(.pod-loading) .card.horizontal .card-image{
            width: 45px;
            min-width: 45px;
            order: 0;
        }
        body[app-mode="episode"] .clip-container:not(.pod-loading) .card-stacked{
            padding-left: 15px;
        }
            body[app-mode="episode"] .clip-container.carousel-card .card-stacked{
                padding-left: 0px;
            }
    .clip-container .card .card-content{
        padding: 0px;
    }
        body[app-mode="home"] .clip-container .card .card-content,
        body[app-mode="feed"] .clip-container .card .card-content {
            padding-left: 0px;
            margin-right: 0px;
        }
            .clip-container .card .clip-header-container{
                display: flex;
                margin-bottom: 10px;
                flex-grow: 1;

            }
            body[app-mode="episode"] .clip-container:not(.pod-loading) .card .clip-header-container {
                align-items: center;
            }
            .clip-container .card .card-title{
                font-size: 1.4em;
                line-height: 1.1em;
                position: relative;
                max-height: 5.5em;
                top: -2px;
            }
                .clip-container.carousel-card .card .card-title{
                    font-size: 0.9em;
                    font-weight: 500;
                }
                body[app-mode="home"] .clip-container .card .card-title,
                body[app-mode="feed"] .clip-container .card .card-title{
                    font-size: 1.3em;
                    line-height: 1.3em;
                    max-height: 6.5em;
                }
                body[app-mode="home"] .clip-container[data-audio-type="moment"] .card .card-title,
                body[app-mode="feed"] .clip-container[data-audio-type="moment"] .card .card-title{
                    font-size: 1.2em;
                    font-weight: 500;
                }
            .clip-container .card .card-title,
            .clip-container .card .episode-title{
                padding-right: 15px;
            }
                body[app-mode="episode"] .clip-container:not(.pod-loading) .card .card-title{
                    line-height: 1.4em;
                    max-height: 6.0em;
                    order: 0;
                    align-items: center;
                    margin-bottom: 6px;
                }
                body[app-mode="home"] .clip-container .card .card-title,
                body[app-mode="feed"] .clip-container .card .card-title{
                    top: 0px;
                    padding-right: 10px;
                    margin-bottom: 15px;
                }
            .clip-container .episode-title {
                font-size: 0.9em;
                line-height: 1.25em;
                max-height: 3.75em;
                text-overflow: ellipsis;
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
            }
                body[app-mode="home"] .clip-container .episode-title {
                    line-height: 1.4em;
                    max-height: 4.2em;
                }
                body[app-mode="home"] .clip-container,
                body[app-mode="feed"] .clip-container{
                    font-size: 1.1em;
                }
                .clip-container:last-child:not(.carousel-card){
                    margin-bottom: 11px;
                }
            .clip-container .card .episode-title {
                margin-bottom: 0px;
                font-weight: 600;
            }
                body[app-mode="feed"] .clip-container .card .episode-title {

                }
            .clip-container .pod-title{
                font-size: 12px;
                margin-bottom: 0px;
                margin-top: 6px;
                line-height: 1.2em;
            }
}


.promo-card.clip-container:not([clip-type="dialogue"]) .card {
    padding: 25px;
    text-align: center;
    color: inherit;
}
    .promo-card.clip-container:not([clip-type="dialogue"]):not(.view-more-link) .card {
        background-color: #419ab1;
        color: #FFFFFF;
    }
    .promo-card.clip-container:not([clip-type="dialogue"]):not(.view-more-link) .card:active{
        background-color: #358499 !important;
    }
    .promo-card a {
        font-size: 1.1em;
        color: inherit;
    }
        .badge-container{
            display: inline-block;
            position: relative;
        }
    .promo-card-title {
        font-weight: 600;
        font-size: 1.4rem;
        margin-bottom: 10px;
    }
    .promo-card-content {
        font-size: 1.1rem;
    }
.app-player-container{
    order: 2;
    height: 70px;
    position:relative;
    z-index: 2;
    flex-shrink: 200;
}
    .app-player-container.playing-moment{
        display: none !important;
    }
    body[app-mode="signin"] .app-player-container,
    .app-player-container.pending{
        display: none;
    }
.player.mobile-player{
    position: absolute;
    top: 0px;
    left: 0px;
    height: 95px;
    width: 100%;
}
.player{
    padding: 0px;
    display: flex;
    flex-direction: row;
    height: 100%;
}
    body[app-mode="clip"]:not([prev-app-mode=""]) .app-player-container.expanded .transcript-container~.player {
        height: 100vh;
    }
.player > *{
}

.player-thumbnail-wrapper{
}
.player-thumbnail-wrapper .player-thumbnail-wrapper-inner img{
    width: 60px;
    /*width: 90px;*/
    height: auto;
}
    body[app-mode="episode"] .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img{
        visibility: hidden;
    }
    .clip-sequence-indicator{
        text-align: center;
        font-size: 20px;
        /*background-color: #e6f9f3;*/
        /*color: #21ce99;*/
        height: 45px;
        line-height: 42px;
        border-radius: 50%;
        border-width: 1px;
        border-style: solid;
    }
        .clip-container.current .clip-sequence-indicator{
            color: #0160ab;
        }
        /*.item-container:nth-child(odd) .item-sequence-indicator{*/
            /*background-color: #e3f2fd;*/
            /*color: #2196f3;*/
        /*}*/
        /*.item-container:nth-child(even) .item-sequence-indicator {*/
            /*background-color: #e6f9f3;*/
            /*color: #21ce99;*/
        /*}*/
/*.item-sequence-indicator:nth-child(odd){*/
/*background-color: red;*/
/*}*/
.player-info{
    padding: 7px 10px;
    color: #fff;
    height: 100%;
    max-height: 100%;
    flex-grow: 1;
}
    .app-player-container.expanded .player-info{
        padding: 0px;
        position: relative;
    }
    .app-player-container.minimized .player-info{
        padding: 0px;
    }
.player .clip-sequence {
    text-align: center;
    display: none;
}

.expanded .player-controls-outer{
    z-index: 1;
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
    .expanded.app-player-container[data-list-type="invalid"]  .player-controls-outer{
        display: none;
    }
    body[data-device="desktop"] .expanded .player-controls-outer{
        padding-bottom: 10px;
    }
    @media only screen and (min-width: 600px) and (min-height: 700px) {
        /*desktop specific*/
        body[data-device="desktop"] .expanded .player-controls-outer{
            padding-bottom: 20px;
        }
    }
    body.mobile-ios .expanded .player-controls-outer{
        min-height: 170px;
    }
        @media only screen and (orientation: portrait) {
            body.mobile-ios .expanded[data-list-type="episode"] .player-controls-outer {
                min-height: 200px;
            }

        }
        @media only screen and (min-height: 600px) {
            .expanded .player-controls-outer {
                flex-grow: 1;
            }
                .expanded[data-speaker-image="true"] .player-controls-outer {
                    flex-grow: 0;
                }
            [data-device="desktop"] .expanded .player-controls-outer {
                min-height: 236px;
            }
                body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-controls-outer {
                    min-height: 157px;
                }
            .app-player-container.expanded .player-info {
                padding-bottom: 10px;
                background-color: transparent !important;

            }
            body.mobile-ios .expanded .player-controls-outer{
                min-height: 200px;
            }
        }

        @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
            .expanded .player-controls-outer {
                flex-grow: 1;
            }
                body.mobile-ios .expanded .player-controls-outer{
                    /*added by KL on 11.4.19 because expanded player was too scrunched at the bottom on */
                    /*ios mobile landscape only*/
                    min-height: 28vh;
                }
        }
body[data-device="mobile"] .app-player-container.expanded .player-info,
body[data-device="desktop"] .app-player-container .player-info{
    background-image: none !important;
}
    .player-controls{
        position: static;
        margin-top: 0px;
        margin-bottom: 10px;
    }
        .expanded .player-controls{
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            flex-grow: 1;
        }
            .expanded[data-speaker-image="true"] .player-controls{
                margin-top: 7px;
            }
            body[data-device="desktop"] .expanded .player-controls{
                flex-grow: 0;
            }
            .app-player-container.expanded[data-list-type="episode"] .player-controls{
                justify-content: space-between;

            }
            .app-player-container.expanded[data-speaker-image="true"] .player-controls{
                margin-bottom: 5px;
            }
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-controls{
                    margin-top: 0px;
                    /*margin-bottom: 10px;*/
                    align-items: center;
                }
        .player.mobile-player .player-controls-inner {
            margin: 0 auto;
        }
    .secondary-player-controls {
        display: none;
        margin: 5px 60px 10px;
        border-radius: 5px;
        background-color: rgba(255,255,255,0.1);
    }
        body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .secondary-player-controls {
            border-radius: 11px;
        }
    .expanded .secondary-player-controls{
        display: block;
    }
    @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
        .expanded .secondary-player-controls{
            display: none;
        }
    }
    .secondary-player-controls-inner {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 6px 8px;
        }
            .drawer-option {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                padding: 18px 24px;
                font-size: 1.3em;
            }
                .drawer-option i.material-icons {
                    margin-right: 14px;
                    font-size: 1.5em;
                }
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .secondary-player-controls {
                margin-left: 120px;
                margin-right: 120px;
                margin-bottom: 0px;
            }
                .secondary-player-controls-inner {
                    padding-bottom: 0px;
                    padding-top: 0px;
                }
            body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .secondary-player-controls-inner{
                padding-bottom: 10px;
                padding-top: 10px;
            }
        }
.player .secondary-control-btn,
.player .control-btn{
    width: auto;
    height: auto;
    border-radius: 50%;
}
    .player .secondary-control-btn{
        padding: 9px 9px 5px;
        margin: -4px;
    }
        .player #player-btn{
            padding: 5px;
        }
        /*.seek-btn:active{*/
            /**/
        /*}*/
        /*.seek-btn:active,*/
        .app-player-container.expanded .player .control-btn.play-pause-btn:active,
        .player .secondary-control-btn:active,
        .player .control-btn:not(.play-pause-btn):not(#playback-speed):active{
            background-color: rgba(255,255,255,0.3) !important;
        }
.player .control-btn i.material-icons.play-icon,
.player .control-btn i.material-icons.pause-icon{
    font-size: 28px;
}
.player.paused .pause-icon{
    display: none;
}
.player.paused .play-icon{
    display: inline-block;
}
.player.playing .play-icon{
    display: none;
}
.player.playing .pause-icon{
    display: inline-block;
}
.player .play-pause-btn{
    height: 100%;
    line-height: 46px;
}
.seekBtn > sub{
    position: absolute;
    bottom: 4px;
    width: 100%;
    left: 0px;
    text-align: center;
}
.seek-container {
    display: flex;
}

.clip-title{
    order: 1;
    flex-grow: 1;
}
    .moment-container.full .clip-title {
        flex-grow: unset;
        margin-bottom: 8px;
    }
        .moment-container .clip-title,
        .moment-container .episode-title{
            display: block;
            color: inherit;
            font-size: 1.1rem;
            line-height: 1.3;
        }
            .moment-container .clip-title{
                font-weight: 500;
            }
            .moment-container .episode-title{
                display: inline-block;
            }
                .moment-container:not(.full) .episode-title {
                    font-size: 0.9rem;
                    margin-top: 5px;
                }
            body[data-device="desktop"] .moment-container .episode-title:hover,
            body[data-device="mobile"] .moment-container .episode-title:active,
            body[data-device="desktop"] .moment-container .clip-title:hover,
            body[data-device="mobile"] .moment-container .clip-title:active{
                text-decoration: underline;
            }
                .moment-container .episode-title:hover{
                    cursor: pointer;
                }
            /*.moment-container .item-title:hover,*/
            /*.moment-container .episode-title:hover{*/
            /*    text-decoration: none;*/
            /*}*/
    .moment-container.full .episode-title{
        font-style: italic;
        color: #9F9F9F;
        font-size: 0.9rem;
        max-height: 4.1rem;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }
        body[data-device="mobile"] .moment-container.full .episode-title {
            /*max-width: calc(100vw - 108px);*/
            /*max-width: -moz-calc(100vw - 108px);*/
            /*max-width: -webkit-calc(100vw - 108px);*/
            max-width: 100%;
            margin: 0 auto;
        }
.pod-title{
    order: 2;
}
.player .pod-title{
    text-align: right;
    font-size: 13px;
}

.seek-container .progress {
    border-radius: 0px;
    margin: 0px;
    height: 4px;
}
    .moment-container .seek-container .progress{
        height: 4px;
        background: #bceade !important;
    }
.player.mobile-player .player-controls-inner {
    margin: 0 auto;
}
.player .control-btn{
    padding: 0px 9px;
    margin: 0px -4px;
    border-radius: 100%;
    width: auto;
    height: auto;
}
    .player .control-btn:not(.secondary-btn):not(.play-pause-btn){
        line-height: 40px;
    }
        body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .control-btn:not(.secondary-btn):not(.play-pause-btn){
            line-height: 32px;
        }
.player .control-btn{
    color: #FFF;
}
.player .control-btn i.material-icons {
    font-size: 24px;
}
.player.paused .pause-icon{
    display: none;
}
.player.paused .play-icon{
    display: inline-block;
}
.player.playing .play-icon{
    display: none;
}
.player.playing .pause-icon{
    display: inline-block;
}
.player .play-pause-btn{
    height: 100%;
    line-height: 46px;
}
.seekBtn > sub{
    position: absolute;
    bottom: 4px;
    width: 100%;
    left: 0px;
    text-align: center;
}
.clip-title{
    order: 1;
    flex-grow: 1;
}
.player .pod-title{
    text-align: right;
    font-size: 13px;
}
.seek-container {
    position: absolute;
    top: -4px;
    left: 0px;
    right: 0px;
    /*width: 100vw;*/
}
    .moment-container .seek-container{
        top: auto;
        bottom:0px;
        overflow: hidden;
        visibility: hidden;
        transition: visibility;
        display: none;
    }
    .moment-container.active .seek-container{
        display: block;
        transition-delay: 500ms;
    }
.seek-container .progress .determinate,
.seek-container .progress .indeterminate{
    /*background-color: #03ab79;*/
    border-radius: 0px;
}
    .moment-container .seek-container .progress .determinate,
    .moment-container .seek-container .progress .indeterminate{
        background-color: #21ce99;
    }
@media only screen and (max-width: 600px),
(orientation: landscape) and (max-width: 820px) {


    .up-on-scroll,
    .down-on-scroll{
        animation-duration: 250ms;
        animation-delay: 0ms;
        animation-fill-mode: forwards;
    }

    /*slide down animation*/
    body[data-scroll-direction="down"]:not(.player-expanded):not([app-mode="episode"]) .up-on-scroll{
    /*body[data-scroll-direction="down"] .up-on-scroll{*/
        /*-webkit-animation-name: menuSlideUp;*/
        /*-moz-animation-name: menuSlideUp;*/
        /*-o-animation-name: menuSlideUp;*/
        /*animation-name: menuSlideUp;*/
    }
    body[data-scroll-direction="up"]:not(.player-expanded):not([app-mode="home"]):not([app-mode="search"]) .down-on-scroll{
        -webkit-animation-name: playerSlideUp;
        -moz-animation-name: playerSlideUp;
        -o-animation-name: playerSlideUp;
        animation-name: playerSlideUp;

    }
    /*slide up animation*/
    body[data-scroll-direction="up"]:not(.player-expanded):not([app-mode="episode"]) .up-on-scroll{
    /*body[data-scroll-direction="up"] .up-on-scroll{*/
        /*-webkit-animation-name: menuSlideDown;*/
        /*-moz-animation-name: menuSlideDown;*/
        /*-o-animation-name: menuSlideDown;*/
        /*animation-name: menuSlideDown;*/
    }
    body[data-scroll-direction="down"]:not(.player-expanded):not([app-mode="home"]):not([app-mode="search"]) .down-on-scroll{
        -webkit-animation-name: playerSlideDown;
        -moz-animation-name: playerSlideDown;
        -o-animation-name: playerSlideDown;
        animation-name: playerSlideDown;
    }
    body[data-scroll-direction="down"]:not(.player-expanded):not([app-mode="home"]):not([app-mode="search"]).player-visible.mobile-ios.mobile-safari .down-on-scroll,
    body[data-scroll-direction="up"]:not(.player-expanded):not([app-mode="home"]):not([app-mode="search"]).player-visible.mobile-ios.mobile-safari .down-on-scroll{
        animation-name: none !important;
        /*note: if the player is visible then don't display the animation on ios mobile safari because the user would need to double tap */
        /*to interact with the bottom ~100px of the viewport when the bottom nav bar is hidden*/
    }
        body[data-scroll-direction="down"] .app-player-container.dont-animate{
            /*bottom: -56px;*/
        }
    .app-player-container.expanded .seek-container{
        top: auto;
        bottom: 0px;
    }
        .expanded .player-info-inner .episode-title:active {
            color: rgba(255, 255, 255, 0.5);
        }
        .app-player-container[data-is-loading="true"] .seek-container .determinate,
        /*.app-player-container[data-is-loading="false"] .seek-container .indeterminate,*/
        /*.app-player-container.expanded[data-is-loading="false"] .seek-container{*/
        .app-player-container[data-is-loading="false"] .seek-container{
            display: none;
        }
    body[app-mode="episode"] .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img {
        width: 45px;
    }
}

/*Note: the % below for the menuSlideDown/Up animations is in reference to the elem itself.  Needed this to adequately scroll the header of a given page out of view
For example.  The episode header of a /e page is taller than the general feed header in /trending  9.20.19 KL*/
@keyframes menuSlideDown {
    0% {
        transform: translateY(-100%);
    }
    100% {
        transform: translateY(0);

    }
}

@keyframes menuSlideUp {
    0% {

        transform: translateY(0);
    }
    100% {
        transform: translateY(-100%);

    }
}

@keyframes playerSlideDown {
    0% {
        transform: translateY(0);
    }
    100% {
        /*need to stick to the height of the player. can't do % here*/
        transform: translateY(56px);
        display: none;
    }
}

@keyframes playerSlideUp {
    0% {
        /*need to stick to the height of the player. can't do % here*/
        transform: translateY(56px);
    }
    100% {
        transform: translateY(0);
    }
}

    .app-player-container.expanded {
        /*needs to be ABSOLUTELY POSITIONED otherwise we cannot scroll to reload a item view page*/
        position: fixed;
        height: auto;
        width:100vw;
        max-height: 100vh;
        top: 0px;
        bottom: 0px;
        display: flex !important;
        flex-direction: column;
        /*position: static;*/
        /*background-color: #556cd6 !important;*/
    }
        .app-player-container.expanded[data-transcript-shown="true"]{
            overflow-y: auto;
        }
            body[app-mode="clip"][prev-app-mode=""]:not([data-device="desktop"]) .app-player-container.expanded[data-transcript-shown="true"] .player{
                min-height: calc(100% - 54px);
                min-height: -moz-calc(100% - 54px);
                min-height: -webkit-calc(100% - 54px);
            }
            body[app-mode="clip"][prev-app-mode=""][data-device="desktop"] .app-player-container.expanded[data-transcript-shown="true"] .player{
                min-height: 100%;
            }

            /*.app-player-container.minimized.user-triggered,*/
            .app-player-container.expanded.user-triggered{
                animation-duration: 250ms;
                animation-delay: 0ms;
            }
        .app-player-container.expanded.user-triggered{
            animation-name: slideUp;
        }
        .app-player-container.minimized.user-triggered{
            transition: height 250ms linear 0s;
        }

        @keyframes slideUp {
            0% {
                /*opacity: 0;*/
                transform: translateY(100vh);
            }
            100% {
                /*opacity: 1;*/
                transform: translateY(0);

            }
        }

        /*initial item view  page load*/
        .app-player-container.expanded:not([data-list-type="episode"]):not([data-list-type="related"]) .app-header{
            display: none;
        }
    .transcript-container{
        /*padding-top: 20px;*/
        padding-bottom: 20px;
        font-size: 1.3rem;
    }
        #episode-transcript-list-header~.episode-transcript{
            display: flex;
        }
        .app-player-container.expanded .player-thumbnail-wrapper-inner .transcript-container {
            position: absolute;
            /*bottom: 90px;*/
            bottom: 132px;
            left: 0px;
            padding-bottom: 10px;
            right: 12px;
            overflow: hidden;
            text-overflow: ellipsis;
            box-sizing: border-box;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            -o-box-sizing: border-box;
            font-family: "Roboto Mono", "Lucida Console", Monaco, monospace;
            font-size: 1.2em;
        }
        .app-player-container.expanded .player-thumbnail-wrapper-inner .transcript-container span.transcript-word.visible {
            background-color: rgba(85, 108, 214, 0.7);
            margin: 0px;
            padding: 1px 5px 2px;
        }
        .app-player-container.expanded .player-thumbnail-wrapper-inner .transcript-container span.transcript-word.active {
            background-color: rgba(85, 108, 214, 1.0);
            border-radius: 0px;
        }
            @media only screen and (min-width: 600px) and (min-height: 500px) {
                .transcript-inner-container {
                    max-width: 80%;
                }
            }
            .transcript-clip-list-container{
                margin-left: 16px;
                padding-left: 16px;
                min-width: 180px;
                border-left: 1px solid #e0e0e0;
            }
                .transcript-shortcuts > p{
                    margin-top: 0px;
                    font-weight: 600;
                    margin-bottom: 16px;
                }
                .transcript-clip-list{
                    margin-top: 0px;
                }
                    .transcript-clip {
                        padding: 8px 8px 8px 0px;
                    }
                        .transcript-clip:hover{
                            cursor: pointer;
                        }
                        .transcript-clip > p {
                            margin: 0px;
                        }
                        .transcript-clip > .transcript-clip-title {
                            font-size: 1rem;
                            line-height: 1.3rem;
                            margin-bottom: 8px;
                        }
                        .transcript-clip-time {
                            font-size: 0.8rem;
                        }
    .view-action-container {
        padding: 20px 80px 20px;
        display: flex;
    }

        .pod-btn.view-episode-page-btn {
            display: flex;
            align-items: center;
            padding: 10px;
            font-size: 1.1rem;
            font-weight: 600;
        }

        i.material-icons.mi-headset {
            margin-right: 10px;
            color: #FFFFFF;
            padding: 8px;
            border-radius: 50%;
            font-size: 1rem;
            font-weight: normal;
        }
        .app-player-container .transcript-container{
            color: #FFFFFF;
            padding-left: 12px;
            padding-right: 12px;
        }
            .app-player-container:not(.expanded) .transcript-container{
                display: none;
            }
            .app-player-container > .transcript-container {
                order: 3;
                font-family: "Roboto Mono", "Lucida Console", Monaco, monospace;
                margin: 0 auto;
                font-size: 1.15rem;
            }
        .transcript-segment[data-speaker-id="2"]{
            color: #4a56ca;
        }
        .transcript-segment[data-speaker-id="3"]{
            color: #03a9f4;
        }
        .transcript-segment[data-speaker-id="4"]{
            color: #455a64;
        }
        .transcript-segment[data-speaker-id="5"]{
            color: #333333;
        }
            .transcript-segment-header .section-title{
                font-size: 1.4rem;
                margin-right: 10px;
            }
            .transcript-segment-actions {
                margin-left: 10px;
            }
                .transcript-segment-action:hover{
                    cursor: pointer;
                }
        .transcript-container .divider {
            background-color: transparent;
            margin-top: 1em;
        }
        .transcript-segment-header{
            font-size: 0.9rem;
            margin-bottom: 15px;
            display: flex;
            align-items: center;
        }
        .transcript-segment{
            font-size: 1.0rem;
            margin-bottom: 1.0rem;
        }
            .transcript-word.active{
                color: white !important;
                background-color: #556cd6;
                border-radius: 2px;
                padding: 0px 2px;
                margin: 0px -2px;
            }
        .transcript-header{
            font-size: 1.5rem;
            font-weight: 500;
            margin-bottom: 15px;
        }
@media only screen and (min-width: 600px) and (min-height: 500px) {
    .app-player-container{
        position: fixed;
        top: auto;
        bottom: 0px;
        left: 0px;
        right: 0px;
        width: 100vw;
        z-index: 1000;
        height: 100px;
        /*height: 79px;*/
    }
        .app-player-container.expanded {
            width: auto;
            position: fixed;
            left: 260px;
        }
        .app-player-container.expanded,
        body[app-mode="clip"][prev-app-mode=""] .app-player-container.expanded{
            top: 66px;
        }
        .app-player-container.minimized .player-info{
            max-width: 100%;
        }
        .app-player-container.expanded .player-info {
            padding-bottom: 0px;
        }

    .seek-container {
        display: none !important;
        top: -9px;
    }
        .expanded .seek-container{
            bottom: 0px;
            top: auto;
        }
        .app-player-container[data-is-loading="false"] .seek-container .indeterminate{
            display: none;
        }
}

    .player {
        padding: 0px;
    }

    .app-player-container.expanded .player {
        /*flex-direction: column;*/
        flex-grow: 1;
        /*height: calc(100vh - 48px);*/
        /*height: -webkit-calc(100vh - 48px);*/
        /*height: -moz-calc(100vh - 48px);*/
        font-size: 3.8vw;
    }

    body[prev-app-mode=""] .expanded.app-player-container .player{
        /*font-size: 3.42vw;*/
        font-size: 3.6vw;
        /*80% of "default view"*/
        position: relative;
        /*added on 1.16.20 by KL for the continue-playing prompt*/
    }
        @media only screen and (min-width: 400px) and (max-height: 610px) and (orientation: portrait) {
            /*styling added for pixel 2 devices*/
            body[prev-app-mode=""] .expanded.app-player-container .player {
                font-size: 2.8vw;
            }
            .app-player-container.expanded .player{
                font-size: 3.3vw;
            }
        }
    @media only screen and (min-width: 500px) and (orientation: landscape) {
        .app-player-container.expanded .player {
            font-size: 1.2vw;
        }
            body[prev-app-mode=""] .expanded.app-player-container .player{
                font-size: 1.1vw;
                /*80% of "default view"*/
            }
    }
        /*@media only screen and (min-width: 1024px) and (orientation: landscape) {*/
        /*KL 11.20.19 removed the restriction on landscape orientation only because if the user moved the player screen to the just half of an external display, the following rule wouldn't apply */

        @media only screen and (min-width: 1024px){
            body[prev-app-mode=""] .expanded.app-player-container .player,
            .app-player-container.expanded .player {
                font-size: 0.9vw;
            }
        }

        @media only screen and (min-width: 1024px) and (max-height: 1280px){
            body[prev-app-mode=""] .expanded.app-player-container .player,
            .app-player-container.expanded .player {
                font-size: 1.6vh;
                /*KL switched to viewport height for desktop, up to a certain height to account for desktops with a min-height of 776 px.  (example MA's mac with a display setting of 1440x900 which is 1 setting value less than default)*/
            }
        }

    /*body[app-mode="item"][prev-app-mode="feed"] .app-player-container.expanded .player,*/
    /*body[app-mode="item"][prev-app-mode=""] .app-player-container.expanded .player,*/
    body[app-mode="clip"][prev-app-mode="episode"] .app-player-container.expanded .player{
        height: 100%;
    }

    .player-info-inner,
    .player-info {
        height: auto;
    }

    .expanded .player-info-inner,
    .expanded .player-info {
        height: 100%;
    }

    /*body:not([prev-app-mode=""])[app-mode="item"] .expanded .player-info-inner,*/
    body:not([prev-app-mode=""])[app-mode="clip"].expanded .player-info {
        height: 100vh;
    }
    .expanded .player .clip-title-outer {
        flex-direction: column;
        /*flex-grow: 1;*/
        text-align: center;
        padding-top: 12px;
        padding-bottom: 12px;
        z-index: 1;
        /*not setting height in this container div because KL noticed a FOUC issue on 9.16.19 */
    }
        .expanded[data-speaker-image="true"] .player .clip-title-outer {
            font-size: 0.85em;
            display: -webkit-inline-box;
            max-width: calc(100vw - 48px);
            max-width: -webkit-calc(100vw - 48px);
            max-width: -moz-calc(100vw - 48px);
            max-width: -o-calc(100vw - 48px);
            margin: 0px auto;
        }
            body[data-device="desktop"] .expanded[data-speaker-image="true"] .player .clip-title-outer {
                font-size: 0.75em;
                margin-top: 10px;
                /*margin: 0px;*/
                /*display: block;*/
                /*max-width: none;*/
                /*position: absolute;*/
                /*top: 50%;*/
                /*left: 50%;*/
                /*transform: translate(-50%, -50%);*/
                /*width: 100%;*/
                /*text-align: left;*/
            }
            /*@media only screen and (min-height: 680px) {*/
            /*    .expanded[data-speaker-image="true"] .player .item-title-outer {*/
            /*        font-size: 0.85em;*/
            /*    }*/
            /*}*/
        /*note: setting the rule below as of 10.27.19 because we did changed how we dynamically set the size of a item title based on the string length.   We moved to
        string WIDTH, but the trouble with that is that we could not calculate this when rendering the page server-side.   So, the solution is to hide the unstyled item title container
        (AKA the elem affected by the rule below.   body[prev-app-mode=""][app-mode="item"] is specific to when we have a fresh load of a /c/ page.*/
        body[prev-app-mode=""][app-mode="clip"] .app-player-container.expanded .clip-info-slide > .carousel-slide > .clip-title-outer{
            display: none;
        }
        body:not([prev-app-mode=""]) .app-player-container.expanded[data-list-type="episode"] .player .clip-title-outer{
            padding-top: 25px;
        }
        @media only screen and (min-height: 680px) {
            body:not([prev-app-mode=""]) .app-player-container.expanded[data-list-type="episode"] .player .clip-title-outer {
                padding-top: 35px;
            }
        }
    .app-player-container.minimized .clip-title-outer {
        order: 1;
        padding: 7px 10px;
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        /*height: 100%;*/
    }
        body[app-mode="episode"] .app-player-container.minimized .clip-title-outer{
            /*padding-left: 8px;*/
        }
    .expanded .player .clip-title-outer .episode-title {
        /*display: none;*/
        padding: 0px 10px;
        margin: 5px 0px;
        text-decoration: underline;
        text-decoration-style: dotted;
    }

    body[app-mode="clip"] .expanded .player .clip-title-outer .episode-title {
        display: none;
        text-decoration: none;
    }

    .player .expand-btn {
        padding: 4px;
        position: absolute;
        bottom: 4px;
        right: 4px;
        z-index: 1;
    }
        .minimized .player .expand-btn{
            display: none;
            position: static;
        }
        .minimized-action:not(.expand-btn){
            display: none;
        }
            .app-player-container[data-list-type="episode-transcript"] .minimized-action.share-btn {
                margin-right: 8px;
            }
            div#playback-speed {
                text-align: center;
                margin-right: 15px;
            }
                .secondary-player-controls #playback-speed{
                    line-height: normal;
                    padding-top: 0px;
                    padding-bottom: 0px;
                }
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .secondary-player-controls-inner div#playback-speed {
                        display: flex;
                        align-items: center;
                    }
                .playback-speed-value {
                    /*border: 1px solid #FFFFFF;*/
                    border: 1px solid rgba(255, 255, 255, 0.75);
                    padding: 3px 4px 1px;
                    border-radius: 4px;
                    color: #FFFFFF;
                    margin: 7px 0px;
                    font-weight: 500;
                }
                    body[data-device="desktop"] .playback-speed-value {
                        padding-bottom: 3px;
                    }
                    .secondary-player-controls .playback-speed-value {
                        margin: 4px 0px;
                    }
                div.playback-speed-update-btn {
                    display: inline-block;
                    visibility: visible;
                    border: 1px solid #FFFFFF;
                    /* padding: 2px 9px; */
                    border-radius: 50%;
                    text-align: center;
                    width: 20px;
                    opacity: 0;
                }
                    div.playback-speed-update-btn:hover{
                        cursor: pointer;
                        opacity: 0.75;
                    }
                    body[data-device="desktop"] .expanded[data-speaker-image="true"] #increase-spd{
                        order: 3;
                    }
                    body[data-device="desktop"] .expanded[data-speaker-image="true"] .playback-speed-value{
                        order: 2;
                        margin: 0px 6px;
                    }
                    body[data-device="desktop"] .expanded[data-speaker-image="true"] #decrease-spd{
                        order: 1;
                    }
    /*div.playback-speed-update-btn.transition {*/
                    /*    -moz-transition: all 150ms linear 0s;*/
                    /*    -o-transition: all 150ms linear 0s;*/
                    /*    -webkit-transition: all 150ms linear 0s;*/
                    /*    transition: all 150ms linear 0s;*/
                    /*}*/
                #playback-speed:hover div.playback-speed-update-btn {
                    visibility: visible;
                    opacity: 1.0;
                }

                    .playback-speed-update-btn > i {
                        font-style: normal;
                        line-height: 18px;
                        position: relative;
                        top: 1px;
                    }
                        body[data-device="desktop"] .playback-speed-update-btn > i {
                            position: relative;
                            top: -1px;
                            left: 0px;
                        }
            .minimized .player .expand-btn:active,
            .minimized .player .expand-btn:active i{
                transition-delay: 0.2s;
            }
            /*.minimized .player .expand-btn:active{*/
            /*    background-color: white;*/
            /*}*/
            /*.minimized .player .expand-btn:active i{*/
            /*    color: #556cd6;*/
            /*}*/

            .player-scrubber{
                display: flex;
                order: 1;
                align-items: center;
                padding: 0px 10px;
            }
                .expanded .player .carousel-slide .player-scrubber,
                .minimized .player .player-thumbnail-wrapper-inner-inner .player-scrubber,
                .minimized .player .player-scrubber{
                    display: none;
                }
                    body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-scrubber {
                        /*border-radius: 0px 0px 11px 11px;*/
                    }
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner > .episode-info-container {
                        /*border-radius: 11px 11px 0px 0px;*/
                        border-radius: 0px 0px 11px 11px;
                    }
                    body[data-device="desktop"] .expanded.app-player-container[data-speaker-image="true"][data-list-type="invalid"] .player-controls-outer,
                    .app-player-container[data-list-type="invalid"] .player-scrubber,
                    .app-player-container[data-list-type="invalid"] .episode-info-container{
                        display: none !important;
                    }
                    .app-player-container.expanded [data-clip-id="000000"][data-list-id="unavailable"] .guest-speaker-image{
                        background-position: center 40%;
                        background-size: 256px auto;
                    }
                    /*    display: flex;*/
                    /*    z-index: 2;*/
                    /*    position: absolute;*/
                    /*    bottom: 0px;*/
                    /*    left: 0px;*/
                    /*    right: 0px;*/
                    /*    max-width: 100%;*/
                    /*    box-sizing: border-box;*/
                    /*    border-radius: 0px 0px 4px 4px;*/
                    /*    padding: 6px 10px;*/
                    /*}*/
                .player-scrubber .scrubber-input-container{
                    box-sizing: border-box;
                    -webkit-box-sizing: border-box;
                    padding: 0px;
                    margin: 0px 13px;
                    flex-grow: 1;
                }
                .player-scrubber .custom-scrubber{
                    width: 480px;
                    margin: 0px 10px;
                    padding: 15px 0px;
                }
                    .custom-scrubber-inner {
                        display: flex;
                        align-items: center;
                        height: 4px;
                        background-color: rgba(255,255,255,0.75);
                        border-radius: 2px;
                    }
                        .scrubber-position {
                            background-color: #2e3aab;
                            height: 20px;
                            width: 20px;
                            border-radius: 50%;
                            position: relative;
                            left: -1px;
                        }
                .player-scrubber input.scrubber-input {
                    margin: 0px;
                    padding: 13px 0px;
                    border: none;
                    /*background-color: rgba(255,255,255,0.75);*/
                    /*background-color: #93a3ef;*/
                    background-color: transparent;
                    -webkit-tap-highlight-color: transparent;
                }
                    .player-scrubber input[type='range']::-webkit-slider-runnable-track {
                        -webkit-appearance: none;
                        background-color: #93a3ef;
                        /*background-color: transparent;*/
                    }

                    .player-scrubber input[type='range']::-webkit-slider-thumb {
                        position: relative;
                        -webkit-appearance: none;
                        box-sizing: content-box;
                        height: 12px;
                        width: 12px;
                        border-radius: 50%;
                        background-color: #fff;
                        cursor: pointer;
                        margin-top: -5px;
                        box-shadow: none;
                    }
                    /*.player-scrubber input[type='range']::-webkit-slider-thumb,*/
                    .player-scrubber input[type='range']+.thumb{
                        background-color: white;
                    }

                    .player-scrubber input[type="range"]::before {
                        position: absolute;
                        content: "";
                        top: 13px;
                        left: 0px;
                        /*right: 13px;*/
                        width: var(--seek-before-width);
                        height: 3px;
                        max-width:calc(100% - 13px);
                        background-color: #ffffff;
                        cursor: pointer;
                    }

                        .player-scrubber input[type=range]:focus {
                            outline: none;
                            border: none;
                        }
                    .player-scrubber span.thumb{
                        display: none !important;
                    }
                .player-scrubber .scrubber-time{
                    line-height: 1em;
                    min-width: 34px;
                    font-size: 0.9em;
                }
    .player-center-btn-outer {
        padding: 6px;
        margin: 9px -6px 9px;
        border-radius: 24px;
    }
        .app-player-container.minimized .player-center-btn-outer{
            display:none;
        }
        .player-center-btn{
            color: #FFFFFF;
        }
        body[data-device="desktop"] .player-center-btn:hover,
        body[data-device="mobile"] .player-center-btn:active{
            /*background-color: rgba(255,255,255,0.3);*/
            opacity: 0.8;
        }
        body[data-device="desktop"] .player-center-btn:hover{
            cursor: pointer;
        }
    .player-center-btn,
    .audio-duration-highlight {
        display: flex;
        align-items: center;
        font-size: 1.25rem;
        padding: 4px 12px 6px;
        border-radius: 18px;
    }
        .audio-duration-highlight{
            margin-bottom: 15px;
        }
        .player-center-btn  i.material-icons,
        .audio-duration-highlight > i.material-icons{
            margin-right: 8px;
        }
        .audio-duration-highlight.hidden,
        .app-player-container:not(.expanded) .audio-duration-highlight{
            display: none;
        }
    .topic-container-outer {
        display: flex;
        flex-direction: column;
        justify-content: center;
        flex-grow: 10;
    }
        .topic-container{
            /*text-align: left;*/
            /*width: 80vw;*/
            /*margin-top: 20px;*/
            display: flex;
        }
        .app-player-container:not(.expanded) .topic-container{
            display: none;
        }
            a.top-clip-topic {
                padding: 4px 6px;
                color: rgba(255,255,255,0.9);
                /*border: 1px solid rgba(255,255,255,0.8);*/
                margin-right: 6px;
                border-radius: 4px;
                font-size: 0.9rem;
                display: flex;
                align-items: center;
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
                max-width: 30vw;
            }
                body[data-device="desktop"] a.top-clip-topic:hover,
                body[data-device="mobile"] a.top-clip-topic:active {
                    cursor: pointer;
                    /*background-color: #FFFFFF !important;*/
                    /*color: #556cd6;*/
                }
                .top-clip-topic i.material-icons {
                    font-size: 1.0rem;
                    margin-right: 4px;
                }
                .top-clip-topic-str {
                    text-overflow: ellipsis;
                    overflow: hidden;
                    white-space: nowrap;
                }
                    body[data-device="desktop"] .top-clip-topic-str {
                        position: relative;
                        top: -1px;
                    }
    .alignment-helper,
    .app-player-container .clip-title-outer .player-thumbnail{
        display: none;
    }
    .app-player-container .player .expand-btn {
        border-radius: 50%;
    }
        .app-player-container[data-list-type="episode-transcript"] .player .fav-btn.minimized-action,
        .app-player-container[data-list-type="episode-transcript"] .expand-btn.minimized-action {
            display:  none;
        }
    .app-player-container.expanded .player .expand-btn {
        position: fixed;
        top: 9px;
        bottom: auto;
        right: 7px;
        height: 32px;
    }
        .app-player-container.expanded[data-list-type="episode"] .player .expand-btn {
            top: 2px;
            right: 2px;
        }
    @media only screen and (min-width: 600px) and (min-height: 500px) {
        /*desktop styling*/
        /*.app-player-container.expanded .player {*/
        /*    max-width: 600px;*/
        /*    margin: 0 auto;*/
        /*}*/
        .app-player-container.minimized .alignment-helper{
            display: block;
            height: 1px;
            min-width: 100px;
            width: 25vw;
            max-width: 260px;
        }
        .app-player-container.minimized .clip-title-outer {
            order: 0;
            flex-grow: 0;
            text-align: center;
            min-width: 380px;
            width: 35vw;
            max-width: 500px;
            flex-direction: row;
            justify-content: flex-start;
        }
            .app-player-container.minimized .clip-title-outer .clip-title-wrapper{
                display: flex;
                flex-direction: column;
                justify-content: space-around;
                min-width: 200px;
                /*padding-left: 7px;*/
                margin-left:  15px;
                /*border-right: 1px solid #FFFFFF;*/
                /*max-width: calc(100% - 71px);*/
            }
            .app-player-container.minimized .clip-title-outer .player-thumbnail{
                display: inline-block;
                width: 70px;
                height: 70px;
            }
                .app-player-container.minimized .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img{
                    display: none;
                }

        .app-player-container.expanded .player .clip-sequence{
            font-size: 1.0em;
        }
        .app-player-container.expanded .player-scrubber .scrubber-time {
            font-size: 1.5em;
        }
            body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-scrubber .scrubber-time {
                font-size: 14px;
            }
        .app-player-container.expanded .player .clip-title-outer{
            padding-top: 14px;
        }
            /*.player .expand-btn:hover{*/
                /*background-color: white;*/
            /*}*/

            .minimized .player .player-scrubber,
            .player-scrubber {
                display: flex;
                flex-grow: 5;
                padding: 0px 10px 0px;
                width: 100%;
                max-width: 500px;
            }
                .expanded .player-controls .player-scrubber {
                    margin: 10px auto;
                    max-width: 820px;
                    width: 80vw;
                }
                    .minimized .player .player-scrubber{
                        margin-top: 5px;
                    }
                        body[data-device="desktop"] .minimized[data-speaker-image="true"] .player .player-scrubber{
                            background-color: transparent !important;
                        }
        .player .expand-btn{
            position: static;
            order: 2;
            margin-right: 8px;
        }
            .minimized .player .expand-btn{
                margin-left: 24px;
            }
            .player .expand-btn:hover{
                cursor: pointer;
            }
            .app-player-container.expanded[data-list-type="episode"] .player .expand-btn,
            .app-player-container.expanded .player .expand-btn{
                top: 74px;
                right: 8px;
                margin-right: 0px;
            }
    }

    body[app-mode="clip"][prev-app-mode=""] .expanded .player .expand-btn {
        display: none;
    }

    .player .expand-btn:not(:hover) i{
        color: #fff;
    }
    .expanded.player .expand-btn:not(:hover) i{
        color: rgba(255,255,255,0.8);
    }

    /*.app-player-container.minimized .player-controls-outer,*/
    .app-player-container.minimized .clip-sequence {
        display: none;
    }
    .app-player-container.minimized .player-controls-outer{
        display: flex;
        position: relative;
        padding: 0px 3px;
        width: auto;
        align-items: center;
    }

    .player-thumbnail-wrapper {
        order: 0;
        z-index: 1;
        width: auto;
    }
        .app-player-container:not([data-list-type="episode"]) .swiper-wrapper~.episode-info-container,
        .app-player-container.minimized .player-thumbnail-wrapper .episode-info-container{
            display: none;
        }
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .minimized-action {
                padding: 8px;
                margin-left: 8px;
            }
            .minimized-action:hover {
                opacity: 0.75;
                cursor: pointer;
            }
            .minimized .player .minimized-action,
            .minimized .player .expand-btn{
                display: block;
            }
                .fav-btn,
                .minimized .player .minimized-action.fav-btn{
                    display: flex;
                }
            .player-thumbnail-wrapper{
                display: flex;
                align-items: center;
            }
            .minimized .player-thumbnail-wrapper{
                width: 320px;
            }
            .app-player-container.expanded .horizontal-container {
                margin-bottom: 45px;
            }
        }
    .player-thumbnail-wrapper-inner {
        position: relative;
        margin: 5px;
        margin-right: 0px;
    }
        body[app-mode="episode"] .player-thumbnail-wrapper-inner{
            /*display: none;*/
            margin: 10px 5px;
        }
        body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner{
            margin: 0px;
        }
body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner,
body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .player-scrubber{
    max-width: 480px;
}
body[data-device="desktop"] .expanded[data-speaker-image="true"] .player .clip-title-wrapper{
/*body[data-device="desktop"] .expanded .player .item-title-wrapper{*/
    max-width: 520px;
}

.app-player-container.expanded .player-thumbnail-wrapper {
        height: auto;
        width: 100vw;
        flex-grow: 4;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
        .horizontal-container {
            display: flex;
            align-items: center;
            flex-grow: 1;
            justify-content: space-around;
        }
        .app-player-container.expanded .horizontal-container {
            justify-content: space-between;
            width: 100vw;
            flex-grow: 1;
            position: relative;
            margin-bottom: 20px;
            flex-direction: column;
            align-items: center;
            justify-content: flex-end;
        }
        @media only screen and (min-height: 600px) {
            .app-player-container.expanded .horizontal-container {
                margin-bottom: 20px;
            }
        }
        /*desktop only*/
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .app-player-container.expanded .horizontal-container {
                margin-bottom: 15px;
                width: 100%;
            }
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .horizontal-container {
                    margin-bottom: 0px;
                }
        }
           .app-player-container.expanded .player-thumbnail-wrapper-inner {
                height: auto;
                display: flex;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                /*flex-direction: column;*/
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                justify-content: center;
                width: 100%;
                margin-left: 0px;
                margin-right: 0px;
            }
                .carousel-slide{
                    display: flex;
                    flex-grow: 1;
                }
                .expanded .carousel-slide{
                    flex-direction: column;
                    /*justify-content: space-between;*/
                }
                .clip-info-slide .carousel-slide:not(.current){
                }
                    /*.item-info-slide .carousel-slide.prev{*/
                        /*transform: translateX(-100vw);*/
                    /*}*/
                    /*.item-info-slide .carousel-slide.next{*/
                        /*transform: translateX(100vw);*/
                    /*}*/
            /*safari specific*/
            /*@media screen and (min-color-index: 0) and (-webkit-min-device-pixel-ratio: 0) { @media {*/
                /*!* Define class here *!*/
                .expanded.app-player-container .swiper-container{
                    width: 100vw;
                }
                .expanded.app-player-container .swiper-container,
                .expanded.app-player-container .carousel-slide:not(.swiper-slide){
                    display: flex;
                    align-items: stretch;
                    flex-direction: column;
                }
                /*.expanded.app-player-container .carousel-slide:not(.swiper-slide){*/
                    /*-webkit-box-sizing: content-box;*/
                    /*box-sizing: content-box;*/
                /*}*/
            /*}}*/

    /*.app-player-container.expanded .player-thumbnail-wrapper .player-thumbnail-wrapper-inner,*/
    /*.app-player-container.expanded .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img{*/
    /*}*/
    .app-player-container.expanded .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img {
        height: 8em;
        width: auto;
        margin: 0 auto;
    }
        .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img {
            height: 95px;
        }
        .expanded[data-speaker-image="true"] .player-thumbnail-wrapper .player-thumbnail-wrapper-inner .player-thumbnail-wrapper-inner-inner > img {

            display: none;
            /*position: absolute;*/
            /*left: 0px;*/
            /*bottom: 0px;*/
        }
    .app-player-container.expanded .guest-speaker-image{
        position: absolute;
        /*top: 0px;*/
        /*left: 0px;*/
        /*right: 0px;*/
        top: 63px;
        left: 24px;
        right: 24px;
        bottom: 0px;
        background-size: cover;
        background-position: center top;
        /*background-position: center;*/
        background-repeat: no-repeat;
        border-radius: 12px;
    }
        body[data-device="desktop"] .app-player-container.expanded .guest-speaker-image{
            position: static;
            flex-grow: 1;
            order: 1;
            top: 0px;
            left: 0px;
            right: 0px;
            background-position-y: center;
            border-radius: 11px 11px 0px 0px;
        }
            body[data-device="desktop"] .player-thumbnail-wrapper-inner-inner > .episode-info-container{
                top: 10px;
                bottom:auto;
                left: 10px;
                right: auto;
                border-radius: 4px;
                border: 1px solid rgba(0,0,0,0.4);
            }
    .player .clip-title {
        line-height: 1.3em;
        font-size: 1.2em;
        height: auto;
        max-height: 2.6em;
        margin-bottom: 2px;
        margin-left: 0px;
        display: -webkit-box;
        padding: 0px;
        text-align: left;
        -webkit-box-align: start;
        /*-webkit-align-items: start;*/
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        align-items: start;
        font-weight: 600;
    }
        [data-speaker-image="true"]:not(.expanded) .player .clip-title{
            background-color: transparent !important;
        }
        .minimized .player .clip-title{
            flex-grow: 0;
        }
        .expanded-player-clip-title-font-size-clone,
        .expanded.app-player-container .player .clip-title{
            font-size: 2.5em;
        }
        .expanded.app-player-container .player .clip-title{
            line-height: 1.3;
            height: auto;
            max-height: 3.9em;
            margin-bottom: 0px;
            padding: 0px 5vw;
            text-align: left;
            display: -webkit-box !important;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
            display: -moz-box;
            /*NOTE:   if we DONT have the rule below, then short item titles (e.g. "Wrapping Up") will NOT be centered, they will be left aligned. */
            box-align: center;
            -webkit-box-align: center;
            text-overflow: ellipsis;
            visibility: visible;
        }
            .expanded.app-player-container .player .clip-title.short-title{
                font-size: 3em;
                line-height: 1.2;
                height: 2.6em;
                max-height: 2.6em;
                -webkit-line-clamp: 2;
            }
                .app-player-container.expanded[data-speaker-image="true"] .player .clip-title{
                    background-color: black;
                    /*box-shadow: 11px 0 0 black, -11px 0 0 black;*/
                    /*-webkit-box-shadow: 11px 0 0 black, -11px 0 0 black;*/
                    /*-moz-box-shadow: 11px 0 0 black, -11px 0 0 black;*/
                    filter: url('#goo');
                    display: inline !important;
                    box-decoration-break: clone;
                    -webkit-box-decoration-break: clone;
                    line-height: 1.4em !important;
                    padding: 0.4rem 0.7rem;
                    white-space: break-spaces;
                }
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .clip-title{
                    padding-top: 0.3rem;
                    padding-bottom: 0.3rem;
                    /*filter: none;*/
                    /*text-align: left;*/
                    /*-webkit-box-align: start;*/
                    /*box-shadow: 0px 0 0 rgba(0,0,0,0.4), -10px 0 0 rgba(0,0,0,0.4);*/
                    /*background-color: rgba(0,0,0,0.4);*/
                    /*display: inline !important;*/
                    /*line-height: 1.6em !important;*/
                    /*line-height: 6.9vh !important;*/
                }
            /*@media only screen and (max-height: 610px) {*/
            @media only screen and (orientation: portrait) and (max-height: 640px) {
                body[prev-app-mode=""] .expanded.app-player-container .player .clip-title:not(.long-title):not(.short-title) {
                    /*on load of a /c/ page, need to make the line smaller*/
                    visibility: visible;
                    -webkit-line-clamp: 3;
                    font-size: 2.3em;
                    /*KL added the line above because the addition of the action bar in the expanded player view caused the UI to be more cramped on a fresh load of a /c/ page*/
                }
                body[prev-app-mode=""] .expanded.app-player-container .player .clip-title.short-title {
                    /*font-size: 10vw;*/
                    -webkit-line-clamp: 2;
                }
                body[prev-app-mode=""] .expanded.app-player-container .player .clip-title.long-title {
                    -webkit-line-clamp: 3;
                    max-height: 3.9em;
                }
            }

        body[app-mode="episode"] .player .clip-title{
            font-weight: 400;
        }
        /*NOTE: 10.25.19 KL visibility property NEEDED in the rule above otherwise the vertical ellipsis won't show on load of a /c/ page*/
        /*https://stackoverflow.com/questions/38989475/css-multi-line-line-clamp-ellipsis-doesnt-work*/
        .expanded .player .clip-title.long-title {
            font-size: 2.0em;
            -webkit-line-clamp: 4;
            line-height: 1.3;
            max-height: 5.2em;
            height: auto;
            visibility: visible;
        }
            /*ADDED by KL 082620 for mobile screens with a lower   pixel density.  for example: pixel 3*/
            @media only screen and (max-width: 400px) and (min-height: 600px) and (orientation: portrait) and (-webkit-max-device-pixel-ratio: 2.8){
                .expanded .player .clip-title.long-title {
                    font-size: 1.9em;
                }
            }
    /*@media (-webkit-max-device-pixel-ratio: 3){*/
            /*    .expanded .player .item-title{*/
            /*        color: green !important;*/
            /*    }*/
            /*}*/
            @media only screen and (min-width: 600px) and (max-height: 640px) {
                /*desktop specific, short screens (< 640px)*/
                body[data-device="desktop"] .app-player-container.expanded .player .clip-title {
                    -webkit-line-clamp: 2;
                    max-height: 2.6em;
                }
            }
            body[data-device="desktop"] .app-player-container.expanded .player .clip-title.long-title {
                -webkit-line-clamp: 3;
                max-height: 3.9em;
            }
        /*KL added the max-width 400px rule below because the font-size of the expanded player is relative to the user's screen WIDTH, not just height*/
        @media only screen and (max-width: 400px) and (min-height: 600px) and (orientation: portrait) {
            .expanded .player .clip-title-wrapper {
                min-height: 132px;
            }
                /*body:not([prev-app-mode=""]) .expanded .player .item-title-wrapper{*/
                /*    min-height: 136px;*/
                /*}*/
                body:not([prev-app-mode=""]) .expanded .player .clip-title-wrapper{
                    min-height: 160px;
                }

        }

        @media only screen and (max-width: 400px) and (min-height: 600px) and (orientation: portrait) and (-webkit-max-device-pixel-ratio: 2.8){
            body[prev-app-mode=""] .expanded .player .clip-title-wrapper{
                min-height: 112px;
            }
            body:not([prev-app-mode=""]) .expanded .player .clip-title-wrapper{
                min-height: 140px;
            }
        }


        body[data-device="desktop"] .expanded[data-speaker-image="true"] .player .clip-title-wrapper,
        body[data-device="desktop"] .expanded .player .clip-title-wrapper {
            min-height: 94px;
        }
        @media only screen and (min-width: 600px) and (min-height: 700px) {/*desktop specific*/
            body[data-device="desktop"] .expanded .player .clip-title-wrapper {
                min-height: 141px;
            }
        }


        @media only screen and (min-height: 680px) and (orientation: portrait) {

            body:not([prev-app-mode=""]) .expanded .player .clip-title-wrapper,
            .expanded .player .clip-title-wrapper {
                /*min-height: 172px;*/
                /*min-height: 164px;*/
                min-height: 156px;
            }

            .expanded .player .clip-title {
                font-size: 2.3em;
            }
            body:not([prev-app-mode=""]) .expanded .player .clip-title.long-title,
            .expanded .player .clip-title.long-title {
                -webkit-line-clamp: 4;
                line-height: 1.35;
                max-height: 5.4em;
                height: auto;
            }
            /*allowing 3 lines for short titles on a taller*/
            .expanded.app-player-container .player .clip-title.short-title {
                height: auto;
                max-height: 3.6em;
                -webkit-line-clamp: 3;
            }
        }

        /*body[prev-app-mode=""][app-mode="item"] .expanded .player .swiper-slide .episode-info-container,*/
        /*body[prev-app-mode=""][app-mode="item"] .expanded .player .carousel-slide:not(.swiper-slide) .item-title-outer,*/
        /*body[prev-app-mode=""][app-mode="item"] .expanded .player .carousel-slide:not(.swiper-slide) .horizontal-container,*/
        /*body[prev-app-mode="episode"][app-mode="item"] .expanded .player .swiper-slide .episode-info-container,*/
        /*body[prev-app-mode="episode"][app-mode="item"] .expanded .player .carousel-slide:not(.swiper-slide) .item-title-outer,*/
        /*body[prev-app-mode="episode"][app-mode="item"] .expanded .player .carousel-slide:not(.swiper-slide) .horizontal-container {*/
            /*display: none;*/
        /*}*/
        .app-player-container.expanded .player-controls-inner,
        .app-player-container.expanded .player .episode-title,
        .app-player-container.expanded .player .clip-title,
        .app-player-container.expanded .player .pod-title {
            text-align: center;
        }
            .app-player-container.expanded .player .pod-title {
                display: block;
            }
                .app-player-container.expanded .player-controls-inner{
                    display: flex;
                    align-items: center;
                    /*justify-content: space-between;*/
                    justify-content: space-evenly;
                    order: 2;
                }
            @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
                .app-player-container.expanded .player-controls-inner {
                    justify-content: space-around;
                }
            }

    .expanded .player .clip-sequence {
        margin-top: 0px;
        font-size: 0.9em;
        border-radius: 16px;
        background-color: transparent;
        color: #FFFFFF;
        padding: 10px 13px 5px;
        /*border: 1px solid #FFF;*/
        opacity: 0.9;
        margin-bottom: 0px;
        /*min-width: 114px;*/
        text-align: center;
    }
        .expanded .player .clip-sequence:hover {
            opacity: 1.0;
        }
    .app-player-container.expanded[data-speaker-image="true"] .player .clip-sequence{
        padding: 0px;
        margin: 0px 10px;
    }
        body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .clip-sequence{
            order: 2;
            margin: 5px 0px 0px;
        }
    .app-player-container.expanded[data-list-type="episode"] .player .clip-sequence{
        display: inline-block;
        align-self: center;
    }

    .player .pod-title {
        font-size: 11px;
    }
        .player-secondary-controls{
            display: none;
        }
            .player-thumbnail-wrapper-inner-inner{
                position: relative;
                width: auto;
            }
                .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner,
                .app-player-container.expanded[data-speaker-image="true"] .horizontal-container,
                .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner{
                    position: static;
                }
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner,
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner{
                        flex-direction: column;
                        flex-grow: 1;
                    }
                    body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner {
                        display: flex;
                        width: 100%;
                        position: relative;
                    }
                    body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner,
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .horizontal-container{
                    /*body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner{*/
                        position: static;
                    }
            .player-thumbnail-wrapper-inner-inner > .episode-info-container{
                position: absolute;
                bottom: 0px;
                /*left: 0px;*/
                /*right: 0px;*/
                display: flex;
                left: 24px;
                right: 24px;
                align-items: stretch;
                overflow: hidden;
                border-bottom-left-radius: 12px;
                border-bottom-right-radius: 12px;
            }
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner > .episode-info-container{
                    position: static;
                    font-size: 12px;
                    /*border-radius: 0px;*/
                    order: 1;
                }
                .episode-info-inner-container {
                    flex-grow: 1;
                    padding: 10px 14px;
                    background-color: rgba(0, 0, 0, 0.4);
                    /*background-color: black;*/
                    /*background-color: rgba(2, 14, 134, 0.4);;*/
                    font-size: 0.9em;
                }
                    body[data-device="desktop"] .episode-info-inner-container {
                        padding: 8px 12px;
                    }
                    .app-player-container.expanded[data-speaker-image="true"] .episode-info-action-container {
                        margin-top: 7px;
                    }
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"]:not([data-list-type="episode"]) .episode-info-inner-container {
                        display:flex;
                        align-items: center;
                        margin-top: 0px;
                        padding-left: 14px;
                        padding-right: 14px;
                    }
            .app-player-container.expanded .player-secondary-controls{
                position: absolute;
                display: block;
                /*top: -36px;*/
                bottom: 0px;
                /*right: 8px;*/
                /*top: 0px;*/
                right: -26px;
                text-align: center;
            }
            .player .people-btn.secondary-control-btn{
                display: flex;
                flex-direction: column;
                padding: 5px;
            }
                .player .people-btn.secondary-control-btn > i.material-icons{
                    font-size: 18px;
                    opacity: 0.7;
                }
                    .player .people-btn.secondary-control-btn:hover > i.material-icons{
                        opacity: 1;
                    }
    .player .play-pause-btn {
        height: auto;
        /*line-height: 90px;*/
        line-height: 66px;
        width: 100%;
        position: absolute;
        left: 0px;
        top: 0px;
        right: 0px;
        bottom: 0px;
        height: auto;
        padding: 5px;
        border-radius: 0px;
        background-color: rgba(0, 0, 0, 0.2) !important;
    }
        body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .play-pause-btn{
            line-height: 56px;
        }
            @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
                .app-player-container.expanded .player .play-pause-btn{
                    line-height: 1;
                }
            }
            .app-player-container.minimized .control-btn:not(.play-pause-btn){
                display: none;
            }
            .app-player-container.minimized .player-controls-inner{
                position: relative;
            }
        body[app-mode="episode"] .player .play-pause-btn {
            background: none !important;
        }

    .app-player-container.expanded .player .control-btn.play-pause-btn {
        background-color: transparent !important;
        width: auto;
        position: static;
        border-radius: 50%;
        -webkit-transition: background-color .15s;
        transition: background-color .15s;
        /*margin: 0px 10px;*/
        /*max-width: 98px;*/
        /*flex-grow: 2;*/
    }
    .expanded .player-thumbnail-wrapper .play-pause-btn {
        display: none;
    }


    .player-info-inner {
        display: flex;
        height: 100%;
        align-items:center;
    }
        /*desktop*/
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .player-info-inner{
                justify-content: space-between;
                min-height: 70px;
            }
                .app-player-container.minimized .clip-info-slide > .carousel-slide{
                    align-items: center;
                    justify-content: space-between;
                }
                .player .clip-title{
                    font-weight: 500;
                    text-align: left;
                    height: auto;
                }

                .minimized.app-player-container .player .clip-title{
                    font-size: 1.1em;
                }
                body[prev-app-mode=""] .expanded.app-player-container .player .clip-title,
                .expanded.app-player-container .player .clip-title{
                    text-align:center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    font-weight: 500;
                }
                    .expanded.app-player-container .player .clip-title{
                        padding-left: 0px;
                        padding-right: 0px;
                    }
                .expanded-player-clip-title-font-size-clone,
                body[prev-app-mode=""] .expanded.app-player-container .player .clip-title,
                .expanded.app-player-container .player .clip-title{
                    font-size: 3em;
                }
            .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img,
            .app-player-container.minimized .player .play-pause-btn {
                height: 40px;
            }
                .app-player-container.expanded .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img {
                    /*height: 20vh;*/
                    height: 100px;
                }
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img {
                        height: 90px;
                    }
                    .app-player-container.expanded .topic-container-outer ~ .player-thumbnail-wrapper .player-thumbnail,
                    .app-player-container.expanded .player-center-btn-outer ~ .player-thumbnail-wrapper .player-thumbnail,
                    .app-player-container.expanded .audio-duration-highlight ~ .player-thumbnail-wrapper .player-thumbnail {
                        height: 15vh;
                    }
            .app-player-container.minimized .player .play-pause-btn {
                line-height: 40px;
                background: none !important;
                position: static;
            }
            .app-player-container .control-btn,
            .app-player-container .seek-btn,
            .app-player-container .minimized-action{
                opacity: 0.9;
            }
                .app-player-container .seek-btn:hover,
                .app-player-container .control-btn:hover,
                .app-player-container .minimized-action:hover{
                    opacity: 1.0;
                }

        }

    @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape){
        body[prev-app-mode=""] .expanded.app-player-container .player .clip-title, .expanded.app-player-container .player .clip-title{
            font-size: 2.3em;
        }
        body[prev-app-mode=""] .expanded.app-player-container .player .clip-title,
        .expanded.app-player-container .player .clip-title,
        body[prev-app-mode=""] .expanded.app-player-container .player .clip-title,
        .expanded.app-player-container .player .clip-title.short-title,
        body[prev-app-mode=""] .expanded.app-player-container .player .clip-title,
        .expanded.app-player-container .player .clip-title.long-title{
            line-height: 1.2;
            height: 1.2em;
            max-height: 1.2em;
            -webkit-line-clamp: 1;
        }
        .app-player-container.expanded .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img{
            height: 7.6em;
        }
        .expanded .player .clip-sequence {
            margin-bottom: 0px;
            min-width: 86px;
        }
        .expanded.app-player-container .player .clip-title{
            height: auto;
            max-height: 2.4em;
        }
    }
    .expanded .player-info-inner {
        flex-direction: column;
    }
        .clip-info-slide{
            display: flex;
            flex-grow: 3;
            align-items: stretch;
            max-width: 100vw;
            overflow: hidden;
            position: relative;
        }
            body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .clip-info-slide{
                overflow: visible;
            }
            .app-player-container.minimized[data-list-type="episode"] .clip-info-slide{
                height: 100%;
            }
            .app-player-container.minimized:not([data-list-type="episode-transcript"]) .clip-info-slide:active,
            .app-player-container.minimized:not([data-list-type="episode-transcript"]) .clip-info-slide:active ~ .player-controls-outer{
                background: #687cd7 !important;
                /*note: 11.11.19 KL tried bg-color-1 FIRST before this custom color.   did not work.  Seemed too light.   Rather than update bg-color-1, took the less risky option and set a custom color here*/
            }
            .app-player-container.minimized .clip-info-slide{
                height: 100%;
            }
            .app-player-container.expanded .clip-info-slide {
                /*justify-content: center;*/
                justify-content: space-between;
            }
                /*body[data-device="desktop"] .expanded .item-info-slide {*/
                /*    flex-grow: 0;*/
                /*}*/
    .player-controls,
    .clip-title,
    .pod-title {
        order: 0;
    }
        .app-player-container.minimized .player-controls{
            margin: 0px;
        }

    .player .control-btn {
        padding: 2px;
        margin: 0px;
    }
        .app-player-container.minimized .player-thumbnail-wrapper .seek-btn,
        .player-thumbnail-wrapper .minor-btn {
            display: none;
        }

.player-controls-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}
    .expanded[data-speaker-image="true"] .player-controls-container {
        position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        bottom: 0px;
        z-index: 0;
        margin-bottom: 10px;
    }
        body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-controls-container {
            margin-bottom: 0px;
            position: relative;
            margin-top: 10px;
        }
    /*body:not([data-device="desktop"]) .expanded .player .player-controls-container {*/
    .app-player-container.expanded .player .player-controls-container {
        flex-grow: 1;
    }

.app-player-container.expanded .player .control-btn{
    /*flex: 1;*/
}
.btn-flat.transparent.control-btn.secondary-btn {
    padding: 6px 13px;
}
    .secondary-player-controls .btn-flat.transparent.control-btn.secondary-btn {
        padding: 6px;
    }
        .secondary-player-controls .secondary-btn.desktop-only{
            display: none;
        }
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .secondary-player-controls .secondary-btn.desktop-only{
                display: block;
            }
            .secondary-player-controls .secondary-btn.mobile-only{
                display: none;
            }
        }
    .secondary-player-controls .btn-flat.transparent.control-btn.secondary-btn > i{
            line-height: 1em;
        }
.btn-flat.transparent.control-btn.custom-bg-btn {
    background-color: #FFF !important;
    padding: 13px;
}

.player .control-btn i.material-icons {
    font-size: 36px;
}
.feed-info-header:not([data-feed-type="episode"]):not([data-feed-type="show"]) .episode-title,
.feed-info-header:not([data-feed-type="episode"]):not([data-feed-type="person"]) .episode-title,
.moment-countdown,
.nav-str,
.playback-speed-update-btn,
.player-center-btn,
.top-clip-topic,
.audio-duration-highlight,
i.material-icons {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
}
.expanded .player .control-btn i.material-icons {
    /*font-size: 3.5em;*/
    /*line-height: 1em;*/
}
.expanded .player .control-btn.secondary-btn i.material-icons {
    font-size: 1.8em;
}
    body[prev-app-mode=""] .expanded .player .control-btn.secondary-btn i.material-icons {
        font-size: 1.5em;
    }
.expanded .player .control-btn.custom-bg-btn i.material-icons {
    /*font-size: 2.1em;*/
    font-size: 2.1em;
    color: #556cd6;
}
.expanded .player .minor-btn i.material-icons {
    font-size: 2.9em;
    padding: 6px;
    color: rgba(255,255,255, 0.7);
}
    body[data-device="desktop"] .expanded[data-speaker-image="true"] .player .minor-btn i.material-icons {
        font-size: 2.3em;
    }
.expanded .player .secondary-player-controls .secondary-btn.share-btn{
    display: flex;
    align-items: center;
    border: 1px solid #ffffff;
    border-radius: 25px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 10px;
}
    [data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner > .share-btn{
        display: none;
    }
        .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner > .share-btn{
            display: block;
            position: absolute;
            /*right: 0px;*/
            right: 25px;
            bottom: 96px;
            padding: 6px;
            border-radius: 50%;
            margin: 3px;
            /*background-color: rgba(0,0,0,0.75);*/
            background-color: #FFFFFF;
            color:  rgb(85 108 214) !important;
            border: 1px solid rgba(85, 108, 214, 0.25) !important;
        }
            .app-player-container.expanded [data-clip-id="000000"][data-list-id="unavailable"] .player-thumbnail-wrapper-inner-inner > .share-btn{
                display: none;
            }
            body[data-device="mobile"] .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner > .share-btn:active,
            body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner > .share-btn:hover{
                background-color: #efefef;
                cursor: pointer;
            }
            body[data-device="desktop"] .expanded[data-speaker-image="true"] .player-thumbnail-wrapper-inner-inner > .share-btn{
                bottom: auto;
                right: 10px;
                top: 10px;
            }
.player .control-btn i.material-icons.play-icon,
.player .control-btn i.material-icons.pause-icon {
    font-size: 46px;
}
/*body[app-mode="episode"] .player .control-btn i.material-icons.play-icon,*/
/*body[app-mode="episode"] .player .control-btn i.material-icons.pause-icon {*/
/*font-size: 40px;*/
/*line-height: 45px;*/
/*}*/

.expanded .player .control-btn i.material-icons.play-icon,
.expanded .player .control-btn i.material-icons.pause-icon {
    font-size: 5em;
}
    body[data-device="desktop"] .expanded[data-speaker-image="true"] .player .control-btn i.material-icons.play-icon,
    body[data-device="desktop"] .expanded[data-speaker-image="true"] .player .control-btn i.material-icons.pause-icon {
        font-size: 4em;
    }

@media only screen and (min-width: 600px) and (min-height: 500px) {
    .app-player-container.minimized .player-controls-container{
        flex-direction: column;
        align-items: center;
        flex-grow: 1;
        max-width: 500px;
        position: relative;
        left: 2vw;
    }
        .app-player-container.minimized .player-thumbnail-wrapper-inner{
            margin: 0px 10px;
        }
            .app-player-container.minimized .player-thumbnail-wrapper .seek-btn,
            .app-player-container.minimized .player-thumbnail-wrapper .minor-btn {
                display: flex;
                align-items: center;
                justify-content: center;
                height: 40px;
                width: 40px;
                margin: 0px 5px;
            }
            .app-player-container.minimized:not([data-list-type="episode-transcript"]) .clip-info-slide:active,
            .app-player-container.minimized:not([data-list-type="episode-transcript"]) .clip-info-slide:active ~ .player-controls-outer{
                background: transparent !important;
            }
            .app-player-container.minimized .seek-btn > i.material-icons{
                font-size: 2.4em;
            }
            .app-player-container.minimized .minor-btn > i.material-icons{
                font-size: 1.8em;
            }
            .app-player-container.minimized .player-thumbnail-wrapper .seek-btn > img{
                display: none;
            }
        .app-player-container.minimized .player-controls{
            display: none;
        }
            .app-player-container.expanded .player-controls-inner {
                width: 500px;
                align-self: center;
                justify-content: space-between;
            }
        .expanded .player .minor-btn i.material-icons{
            color: #FFFFFF;
        }
            .expanded .player-info-inner{
                margin: 0 auto;
            }
            /*.expanded .player-controls-outer,*/
            /*.expanded .player-controls .player-scrubber,*/
            /*.expanded .item-info-slide {*/
            .expanded .player-controls-outer,
            .expanded .player-controls .player-scrubber,
            .expanded .player-info-inner,
            .expanded.app-player-container > .transcript-container,
            .expanded .clip-info-slide{
                max-width: 720px;
            }
                .app-player-container.expanded .player-thumbnail-wrapper{
                    max-width: 100%;
                }
                    body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-thumbnail-wrapper{
                        max-width: 100%;
                    }
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .player-scrubber {
                    padding: 4px 10px;
                    display: flex;
                    box-sizing: border-box;
                    flex-grow: 0;
                }
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .player-controls-container > .player-scrubber {
                    display: none;
                }
                /*body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player .player-thumbnail-wrapper-inner-inner .player-scrubber {*/
                /*    background-color: rgba(255,255,255,0.1);*/
                /*}*/
        }

    @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
        .expanded .player .control-btn i.material-icons.play-icon,
        .expanded .player .control-btn i.material-icons.pause-icon {
            font-size: 3.1em;
        }
    }

        .player-info-inner .episode-title {
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            /*display: block;*/
            max-width: calc(100vw - 85px);
            font-size: 0.8em;
            line-height: 1.3em;
            max-height: 2.6em;
            text-align: left;
            /*height: 2.6em;*/
            padding-right: 16px;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            display: -webkit-box;
            /*overflow: hidden;*/
            color: rgba(255, 255, 255, 0.75);
        }
            body[app-mode="episode"] .player-info-inner .episode-title {
                display: none;
            }
            /*@media only screen and (max-height: 740px) {*/
            /*    body[data-device="desktop"] .app-player-container.expanded .player-info-inner .episode-title {*/
            /*        -webkit-line-clamp: 1;*/
            /*        height: calc(1.7rem + 4px) !important;*/
            /*        height: -webkit-calc(1.7rem + 4px) !important;*/
            /*        height: -moz-calc(1.7rem + 4px) !important;*/
            /*        height: -o-calc(1.7rem + 4px) !important;*/
            /*        max-height: none !important;*/
            /*        !*display: block;*!*/
            /*    }*/
            /*}*/
    .expanded .player-info-inner .episode-title {
        color: #FFFFFF;
        opacity: 0.9;
        padding: 0px;
        font-size: 1.1em;
        line-height: 1.7em;
        max-height: 2.8em;
        height: auto;
        white-space: normal;
        overflow: hidden;
        text-overflow: ellipsis;
        margin: 0px 3vw 10px;
        max-width: none;
    }
        .expanded .player-info-inner .episode-title:hover{
            opacity: 1.0;
        }
        /*.app-player-container.expanded:not([data-list-type="episode"]) .player-info-inner .episode-title {*/
        /*    !*font-size: 1.2em;*!*/
        /*}*/
        .app-player-container.expanded .episode-info-inner-container .episode-title {
            text-align: left;
            margin: 0px;
        }
        .app-player-container.expanded .player-info-inner .episode-title {
            height: 3.4em;
            max-height: 3.4em;
        }
        /*note: rule below makes sure that the episode title is going to ellipsis (if the content > 2 lines worth) */
        /*https://stackoverflow.com/questions/38989475/css-multi-line-line-clamp-ellipsis-doesnt-work*/
        .app-player-container.expanded .player-info-inner .swiper-container .episode-title {
            visibility: visible;
        }
            .app-player-container.expanded .player-info-inner .swiper-container .episode-title-inner {
                border-bottom: 1px dotted #FFFFFF;
                padding-bottom: 1px;
            }

            /*.app-player-container.expanded[data-speaker-image="true"] .player-info-inner .episode-title {*/
            .app-player-container.expanded[data-speaker-image="true"] .player-info-inner .episode-info-container .episode-title{
                height: 3em;
                max-height: 3em;
                /*margin-bottom: 7px;*/

            }
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-info-inner .episode-info-container .episode-title{
                    font-size: 1.4em;
                }
/*not([data-speaker-image="true"])*/
                body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"]:not([data-list-type="episode"]) .player-info-inner .episode-info-container .episode-title{
                    height: calc(3.6em + 2px);
                    max-height: calc(3.6em + 2px);
                }
            .expanded[data-speaker-image="true"] .player-info-inner .episode-title-inner {
                line-height: 1.5em;
            }
                body[data-device="desktop"] .expanded[data-speaker-image="true"]:not([data-list-type="episode"]) .player-info-inner .episode-title-inner {
                    line-height: 1.8em;
                }
        .app-player-container.expanded[data-list-type="episode"]:not([data-speaker-image="true"]) .swiper-slide .episode-info-container,
        .app-player-container.expanded[data-speaker-image="true"] .swiper-wrapper+.episode-info-container,
        .app-player-container.expanded[data-speaker-image="true"] .horizontal-container+.episode-info-container{
            display:  none;
        }
        @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
            .app-player-container.expanded .horizontal-container{
                margin-bottom: 10px;
            }
            .app-player-container.expanded .player-info-inner .episode-title {
                margin-bottom: 5px;
                font-size: 1.6em;
                height: auto;
                padding-bottom: 4px;
            }
                body[prev-app-mode=""] .app-player-container.expanded .player-info-inner .episode-title {
                    font-size: 1.8em;
                    height: 2.9em;
                    max-height: 2.9em;
                }
            .app-player-container.expanded,
            .player-scrubber .scrubber-time,
            .expanded .player .clip-sequence{
                font-size: 1.3em;
            }
                body[prev-app-mode=""] .app-player-container.expanded,
                body[prev-app-mode=""] .player-scrubber .scrubber-time,
                body[prev-app-mode=""] .expanded .player .clip-sequence{
                    font-size: 1.45em;
                }
        }
    .seek-btn {
        display: none;
        z-index: 2;
        padding: 8px 16px;
        border-radius: 50%;
        -webkit-tap-highlight-color: transparent;
    }
        .seek-btn:hover {
            cursor: pointer;
        }
        body:not([data-device="desktop"]) .expanded[data-speaker-image="true"] .list-navigation-container .seek-btn,
        .expanded[data-speaker-image="true"] .list-navigation-container .seek-btn > i.material-icons,
        .expanded .track-navigation-container .seek-btn{
            display: block;
        }
            .expanded .seek-btn > i.material-icons{
                display: none;
            }
            .expanded[data-speaker-image="true"] .list-navigation-container .seek-btn > i.material-icons{
                font-size: 20px;
            }
        .list-navigation-container {
            display: none;
        }
        .expanded .list-navigation-container {
            display: flex;
            justify-content: center;
        }
            .list-navigation-container .seek-btn {
                padding: 0px;
                border: 1px solid rgba(255,255,255,0.3);
                z-index: auto;
            }
                .app-player-container:not([data-list-type="episode"]) .list-navigation-container .seek-btn:first-of-type {
                    margin-right: 24px;
                }
                body[data-device="desktop"] .list-navigation-container .seek-btn:hover,
                body[data-device="mobile"] .list-navigation-container .seek-btn:active {
                    background-color: rgba(255,255,255,0.2);
                    border-color: #FFF;
                    cursor: pointer;
                }
        body[prev-app-mode=""] .track-navigation-container,
        .track-navigation-container {
            position: absolute;
            top: auto;
            bottom: calc(4em + 60px);
            bottom: -webkit-calc(4em + 60px);
            bottom: -moz-calc(4em + 60px);
            left: 0px;
            right: 0px;
            display: flex;
            justify-content: space-between;
            padding: 0px 5px;
        }
            body[prev-app-mode=""]:not([data-device="desktop"]) [data-speaker-image="true"] .track-navigation-container,
            body:not([data-device="desktop"]) [data-speaker-image="true"] .track-navigation-container{
                display: none;
            }
            .app-player-container[data-list-type="feed"] .track-navigation-container{
                /*bottom: calc(10vh + 70px);*/
                /*bottom: -webkit-calc(10vh + 70px);*/
                /*bottom: -moz-calc(10vh + 70px);*/
                bottom: calc(4em + 70px);
                bottom: -webkit-calc(4em + 70px);
                bottom: -moz-calc(4em + 70px);
            }
            /*tall mobile screens*/
            /*@media only screen and (min-height: 600px) {*/
            /*    .app-player-container[data-list-type="feed"] .track-navigation-container,*/
            /*    .track-navigation-container {*/
            /*        bottom: calc(3.8em + 84px);*/
            /*        bottom: -webkit-calc(3.8em + 84px);*/
            /*        bottom: -moz-calc(3.8em + 84px);*/
            /*    }*/
            /*}*/
            /*desktop screens*/

            body[data-device="desktop"] .app-player-container.expanded .player-info-inner .episode-title {
                font-size: 1.5em;
                /*KL added the 2 rules below on 5.8.20 because the underline under the episode title was not visible*/
                max-height: calc(3.0em + 8px);
                max-height: -webkit-calc(3.0em + 8px);
                max-height: -moz-calc(3.0em + 8px);
                max-height: -o-calc(3.0em + 8px);
                height: calc(3.0em + 8px);
                height: -webkit-calc(3.0em + 8px);
                height: -moz-calc(3.0em + 8px);
                height: -o-calc(3.0em + 8px);
            }
            @media only screen and (min-width: 600px) and (min-height: 500px) {

                /*.app-player-container[data-list-type="feed"] .track-navigation-container,*/
                /*.track-navigation-container {*/
                /*    bottom: calc(10vh + 70px);*/
                /*    bottom: -webkit-calc(10vh + 70px);*/
                /*    bottom: -moz-calc(10vh + 70px);*/
                /*}*/
                /*.app-player-container[data-list-type="episode"] .track-navigation-container{*/
                /*    bottom: calc(10vh + 65px);*/
                /*    bottom: -webkit-calc(10vh + 65px);*/
                /*    bottom: -moz-calc(10vh + 65px);*/
                /*}*/
                /*the CSS below is needed BEFORE the share button/audio duration badge in the expanded item view*/

                .app-player-container[data-list-type="feed"] .track-navigation-container,
                .track-navigation-container {
                    bottom: calc(6vh + 70px);
                    bottom: -webkit-calc(6vh + 70px);
                    bottom: -moz-calc(6vh + 70px);
                }
                    body[data-device="desktop"] .app-player-container[data-list-type="feed"] .track-navigation-container,
                    body[data-device="desktop"] .track-navigation-container {
                        bottom: calc(7.5vh + 85px);
                        bottom: -webkit-calc(7.5vh + 85px);
                        bottom: -moz-calc(7.5vh + 85px);
                    }
                .app-player-container[data-list-type="episode"] .track-navigation-container{
                    bottom: calc(6vh + 65px);
                    bottom: -webkit-calc(6vh + 65px);
                    bottom: -moz-calc(6vh + 65px);
                }
                    body[data-device="desktop"] .app-player-container[data-list-type="episode"] .track-navigation-container{
                        bottom: calc(7.5vh + 80px);
                        bottom: -webkit-calc(7.5vh + 80px);
                        bottom: -moz-calc(7.5vh + 80px);
                    }


            }

        body[data-device="desktop"] .app-player-container[data-speaker-image="true"] .track-navigation-container {
            bottom: auto;
            top: calc(50% + 4px);
            left: -54px;
            right: -54px;
        }

        @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
            .track-navigation-container,
            body[prev-app-mode=""] .track-navigation-container,
            .app-player-container[data-list-type="feed"] .track-navigation-container{
                bottom: calc(3.8em + 14px);
                bottom: -webkit-calc(3.8em + 14px);
                bottom: -moz-calc(3.8em + 14px);
            }
        }
            /*iphone 8 specific styling*/
            @media only screen and (max-height: 580px) and (max-width: 400px) and (orientation: portrait) {
                .app-player-container.expanded .player-thumbnail-wrapper .player-thumbnail-wrapper-inner img {
                    height: 6em;
                }
                body[prev-app-mode=""] .track-navigation-container,
                .track-navigation-container{
                    bottom: calc(3em + 54px);
                    bottom: -webkit-calc(3em + 54px);
                    bottom: -moz-calc(3em + 54px);
                }

            }
        .app-player-container.is-last-clip:not(.minimized) #seek-fwd-btn,
        .app-player-container.is-first-clip:not(.minimized) #seek-bck-btn {
            position: relative;
            left: 300vw;
        }
        .app-player-container.is-last-clip.minimized #seek-fwd-btn,
        .app-player-container.is-first-clip.minimized #seek-bck-btn {
            opacity: 0.25;
        }
            .app-player-container.is-last-clip.minimized #seek-fwd-btn,
            .app-player-container.is-first-clip.minimized #seek-bck-btn{
                cursor: default;
            }
            .app-player-container.is-last-clip.minimized #seek-fwd-btn:active,
            .app-player-container.is-first-clip.minimized #seek-bck-btn:active{
                background-color: transparent !important;
            }

    .expanded .seek-btn img {
        display: block;
        /*height: 70px;*/
        height: 30px;
        width: auto;
        opacity: 1.0;
    }
        .seek-btn:active img{
            opacity: 0.5;
        }

    .seek-container > .row {
        margin-bottom: 0px;
    }

    .seek-container > .timer,
    .seek-container > .duration {
        padding: 0px 4px;
        color: #FFF;
    }

    #clips-list {
        z-index: 3;
        position: fixed;
        top: 100vh;
        bottom: 0px;
        margin: 0px;
        overflow-y: auto;
        background-color: #ffffff;
    }

    #clips-list.expanded {
        top: 50vh;
    }

    /*IMPORTED CSS FOR IS_PLAYING INDICATOR*/
    .is-playing-indicator-outer {
        /*display: none;*/
        /*background-color: rgba(0, 0, 0, .2);*/
        /*display: none;*/
        background-color: transparent;
        /*flex-grow: 1;*/
        /*position: absolute;*/
        /*top: 0px;*/
        /*left: 0px;*/
        /*right: 0px;*/
        /*height: 120px;*/
    }
        .clip-container .is-playing-indicator-outer {
            display: none;
            position: absolute;
            top: 0px;
            left: 0px;
            right: 0px;
        }
        .card-action-container {
            display: flex;
            justify-content: flex-end;
        }
            body[data-device="desktop"] .card-image .card-action-container {
                display: none;
            }
            .card-options-btn {
                z-index: 1;
                padding: 3px;
                margin-right: -3px;
                margin-bottom: -3px;
            }
                .card-options-btn i.material-icons{
                    font-size: 1.2rem;
                }
        .flex-spacer{
            flex-grow: 1;
        }
        body[app-mode="episode"] .clip-container .is-playing-indicator-outer{
            height: 45px;
            border-radius: 50%;
            overflow: hidden;
        }

    .current .is-playing-indicator-outer {
        display: block;
    }
        body:not([data-device="desktop"]) .clip-container.current,
        body:not([data-device="desktop"]) .clip-container.rnd.current .clickable-actions-container,
        body:not([data-device="desktop"]) .clip-container.current .card{
            background-color: #f5f5f5;

        }
        .clip-container.current .clip-title{
            color: #000000;
        }
            /*body[is-admin=true] .item-container[latest-audio-state="loadstart"] .card{*/
                /*background-color: #feffda !important;*/
            /*}*/
            /*body[is-admin=true] .item-container[latest-audio-state="canplay"] .card{*/
                /*background-color: #f9e3bb !important;*/
            /*}*/
            /*body[is-admin=true] .item-container[latest-audio-state="canplaythrough"] .card{*/
                /*background-color: #dcf3dc !important;*/
            /*}*/
            /*.item-container[latest-audio-state="loadstart"] .card{*/
                /*background-color: #feffda !important;*/
            /*}*/
            /*.item-container[latest-audio-state="canplay"] .card{*/
                /*background-color: #f9e3bb !important;*/
            /*}*/
            /*.item-container[latest-audio-state="canplaythrough"] .card{*/
                /*background-color: #dcf3dc !important;*/
            /*}*/
    .is-playing-indicator-inner {
        position: relative;
        /*float: right;*/
        height: 14px;
        /*width: 100%;*/
        width: 14px;
        /*top: 77px;*/
        /*top: 95px;*/
        top: 87px;
        left: 0px;
    }
    @media only screen and (min-width: 600px) and (min-height: 500px) {
        /*.expanded .player-info-inner .episode-title:hover {*/
        /*    text-decoration: underline;*/
        /*}*/
        .app-player-container.expanded .player-info-inner .swiper-container .episode-title-inner {
            padding-bottom: 3px;
        }
            body[data-device="desktop"] .app-player-container.expanded[data-speaker-image="true"] .player-info-inner .swiper-container .episode-title-inner {
                padding-bottom: 0px;
            }
        .is-playing-indicator-inner{
            top: 83px;
            left: 0px;
            height: 18px;
        }
            .moment-content-container .is-playing-indicator-inner{
                height: 20px;
                width: 18px;
            }
            .app-player-container.minimized .player-info-inner .episode-title {
                -webkit-line-clamp: 1;
                max-height: 1.3em;
                display: block;
                font-size: 0.8em;
            }
            body[app-mode="episode"] .app-player-container.minimized .player-info-inner .episode-title {
                display: none;
            }
            .app-player-container.minimized .player-info-inner .episode-title:hover {
                cursor: pointer;
                text-decoration: underline;
            }
        /*.seek-btn:hover img{*/
        /*    opacity: 0.5;*/
        /*}*/
    }
        body[app-mode="episode"] .clip-container .is-playing-indicator-inner {
            top: 35px;
            left: 16px;
            height: 11px;
            /*9.17.19 KL the border rule below is needed to achieve the rounded edges on the episode item page*/
            border: 1px solid transparent;
        }
    .bar {
        /*background: rgba(255,255,255,0.85);*/
        /*background: #e0e0e0;*/
        /*background: #80d8ff;*/
        bottom: 1px;
        height: 1px;
        position: absolute;
        width: 12.5%;
        animation: sound 0ms -800ms linear infinite alternate;
        animation-fill-mode: both;
    }
    .current:not(.active) .bar{
        animation-play-state: paused;
    }
    .active .is-playing-indicator-outer{

    }
        body[app-mode="episode"] .clip-container .is-playing-indicator-inner .bar{
            /*background: #2196f3;*/
            width: 10%;
        }

    @keyframes sound {
        0% {
            opacity: .35;
            height: 3px;
        }
        100% {
            opacity: 1;
            height: 100%;
        }
    }

    .bar:nth-child(1) {
        left: 0px;
        animation-duration: 474ms;
    }

    .bar:nth-child(2) {
        left: 12.5%;
        animation-duration: 433ms;
    }

    .bar:nth-child(3) {
        left: 25%;
        animation-duration: 380ms;
    }

    .bar:nth-child(4) {
        left: 37.5%;
        animation-duration: 458ms;
    }

    .bar:nth-child(5) {
        left: 50%;
        animation-duration: 410ms;
    }

    .bar:nth-child(6) {
        left: 62.5%;
        animation-duration: 428ms;
    }

    .bar:nth-child(7) {
        left: 75%;
        animation-duration: 396ms;
    }

    .bar:nth-child(8) {
        left: 87.5%;
        animation-duration: 481ms;
    }
    .feed-info-header {
        text-align: center;
        /*border-bottom: 1px solid #ccc;*/
        padding: 16px 5px;
        color: #fff;
        position: relative;
        z-index: 2;
        min-height: 200px;
        background-size: cover;
        background-position: center top;
        display: flex;
        /*background-color: #26a57c;*/
        align-items:center;
        justify-content: center;
    }
        #feed-info-header[data-feed-id="invalid-show"],
        #episode-info-header{
            flex-direction: column;
        }
        .feed-info-header[data-feed-type="category"],
        .feed-info-header[data-feed-type="topic"]{
            justify-content: space-between;
        }

        body[app-mode="feed"] .feed-info-header:not(.person):not(.show){
            min-height: 0px;
        }
        div#feed-info-header.locked {
            top: 0px;
            left: 0px;
            right: 0px;
        }
            div#feed-info-header.locked:not([data-feed-id="invalid-show"]) {
                position: fixed;
            }
            div#feed-info-header.locked+div:not(.error-message){
                margin-top: 76px;
            }
            #feed-info-header[data-feed-id="moments"]{
                background-color: #419ab1 !important;
            }
                body[data-device="desktop"] div#feed-info-header.locked[data-feed-type="category"]+div.error-message,
                body[data-device="desktop"] div#feed-info-header.locked[data-feed-type="topic"]+div.error-message,
                body[data-device="desktop"] div#feed-info-header.locked[data-feed-type="person"]+div.error-message,
                body[data-device="desktop"] div#feed-info-header.locked+div:not(.error-message){
                    margin-top: 99px;
                }
            body[data-device="desktop"] div#feed-info-header.locked:not([data-feed-id="invalid-show"]) {
                top: 66px;
                left: 260px;
            }
                body[data-device="desktop"] .clip-list-container div#feed-info-header.locked {
                    left: 502px;
                }
        .feed-info-header.show,
        .feed-info-header.person{
            display: flex;
        }
            .feed-info-header.show .pod-thumbnail-container #person-image-avatar,
            .feed-info-header.person .pod-thumbnail-container #person-image-avatar {
                background-size: cover;
                background-position: center;
            }
        .feed-info-header-overlay{
            position: absolute;
            top: 0px;
            left: 0px;
            right: 0px;
            bottom: 0px;
            background-color: rgba(0,0,0,0.3);
        }
        .pod-thumbnail-container{

        }
            .pod-thumbnail-container-inner{
                display: flex;
                align-items: center;
                justify-content: stretch;
                padding: 8px 0px;
            }
                /*body[data-device="desktop"] .feed-info-header .pod-thumbnail-container-inner > *,*/
                /*body[data-device="mobile"] .feed-info-header .pod-thumbnail-container-inner > * {*/
                .feed-info-header:not([data-feed-id="invalid-show"]) .pod-thumbnail-container > img,
                .feed-info-header:not([data-feed-id="invalid-show"]) .pod-thumbnail-container .pod-thumbnail-container-inner > * {
                    border-radius: 10px;
                    height: 120px;
                    width: 120px;
                }
                .pod-thumbnail-container-inner .speaker-image-thumbnail{
                    background-size: cover;
                    background-position: center;
                    background-repeat: no-repeat;
                    margin-left: 15px;
                }
        .feed-title-wrapper{
            display: flex;
            align-items: center;
        }
            /*.feed-info-header[data-feed-type="topic"] .feed-title-wrapper{*/
            /*    flex-grow: 1;*/
            /*}*/
            .feed-title-inner-wrapper {
                text-align: left;
            }
        .feed-info-header[data-feed-type="topic"] .pod-thumbnail-container {
            display: flex;
            align-items: center;
            justify-content: center;
        }
        #episode-info-header{
            /*background-color: #22cd9a;*/
        }
            @media only screen and (min-width: 600px) and (min-height: 500px) {
                #feed-info-header[data-feed-id="invalid-show"],
                #episode-info-header{
                    padding: 15px 80px;
                    display: flex;
                    align-items: center;
                    flex-direction: row;
                    justify-content: flex-start;
                    min-height: 160px;
                }
            }
    body[app-mode = "clip"] .feed-info-header{
        z-index:0;
    }
        .feed-info-header:not([data-feed-id="invalid-show"]) .pod-thumbnail-container img{
            height: 130px;
        }
        .feed-info-header[data-feed-id="invalid-show"] .pod-thumbnail-container img,
        #episode-info-header[data-episode-id="unavailable"] .pod-thumbnail-container img{
            height: auto;
            width: 80px;
            margin-bottom: 10px;
        }
        .feed-info-header .pod-thumbnail-container #feed-list-icon{
            /*font-size: 50px;*/
            font-size: 2.5em;
            margin-right: 10px;
        }
            .feed-info-header[data-feed-type="topic"] .pod-thumbnail-container #feed-list-icon {
                font-size: 2.4rem;
                margin-right: 5px;
            }
        .feed-info-header .episode-title{
            font-size: 1.5em;
            line-height: 1.2em;
            margin-top: 12px;
            font-weight: 500;
            -webkit-line-clamp: 5;
            max-height: 6.0em;
            text-overflow: ellipsis;
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
        }
            #episode-info-header > .pod-title,
            #episode-info-header > .episode-clip-count,
            #episode-info-header > .episode-summary{
                display: none;
            }
            @media only screen and (min-width: 600px) and (min-height: 500px) {
                #episode-info-header .episode-info-container{
                /*.feed-info-header .pod-thumbnail-container img{*/
                    height: 100%;
                }
                /*#episode-info-header .pod-thumbnail-container img{*/
                /*    height: 120px;*/
                /*    border-radius: 0px;*/
                /*}*/
                .feed-info-header .pod-thumbnail-container img{
                    border-radius: 4px;
                }
                #episode-info-header .episode-info-container{
                    padding-left: 30px;
                    text-align: left;
                    align-self: flex-start;
                }
                    #episode-info-header[data-episode-id="unavailable"] .episode-info-container{
                        align-self: center;
                        font-size: 1.3rem;
                    }
                #episode-info-header .episode-info-container .episode-title{
                    margin-top: 0px;
                }
            }
            body[data-device="desktop"] #episode-info-header .episode-info-container .episode-title{
                -webkit-line-clamp: 2;
                max-height: 2.4em;
                text-overflow: ellipsis;
                overflow: hidden;
                display: -webkit-box;
                -webkit-box-orient: vertical;
            }
            /*@media only screen and (max-width: 740px){*/
            /*    body[data-device="desktop"] #episode-info-header .episode-info-container .episode-title{*/
            /*        -webkit-line-clamp: 2;*/
            /*        max-height: 2.4em;*/
            /*    }*/
            /*}*/

            body[app-mode="feed"] .feed-info-header .episode-title{
                font-size: 1.5em;
                /*align-self: flex-end;*/
                /*flex-grow: 1;*/
                align-self: center;
                flex-grow: 0;
                margin-top: 0px;
            }

                body[app-mode="feed"] .feed-info-header[data-feed-type="topic"] .episode-title {
                    flex-grow: 0;
                    margin-top: 0px;
                    align-self: center;
                    text-align: left;
                    /*margin-left: 10px;*/
                }
                    /*body[app-mode="feed"][data-device="mobile"] .feed-info-header[data-feed-type="topic"] .episode-title {*/
                    /*    */
                    /*}*/
                .feed-collapsed-info-header .feed-title > span,
                body[app-mode="feed"] .feed-info-header .episode-title > span{
                   text-transform: none;
                }
            .feed-info-header.show .episode-title,
            .feed-info-header.show .publisher-site,
            .feed-info-header.person .episode-title{
                z-index: 1;
                position: relative;
            }
            /*.feed-info-header .info-modal-trigger,*/
            /*.feed-info-header .share-btn{*/
            .feed-info-header .feed-actions{
                z-index: 1;
                position: absolute;
                right: 4px;
                top: 8px;
                text-align: right;
            }
                .feed-actions:empty{
                    width:44px;
                }
                .feed-info-header.show .share-btn,
                .feed-info-header.person .share-btn{
                    z-index: 1;
                }
                body:not([data-device="desktop"]) .feed-info-header[data-feed-type="category"] .feed-nav-btn,
                body:not([data-device="desktop"]) .feed-info-header[data-feed-type="topic"] .feed-nav-btn,
                .feed-info-header[data-feed-type="category"] .feed-actions,
                .feed-info-header[data-feed-type="topic"] .feed-actions {
                    position: static;
                }
                .feed-info-header[data-feed-type="category"] .feed-actions,
                .feed-info-header[data-feed-type="topic"] .feed-actions {
                    order: 9;
                }
                body:not([data-device="desktop"]) .feed-info-header#episode-info-header .share-btn{
                    top: 50px;
                }
                    .episode-participants,
                    .feed-info-header .dot-separator,
                    .feed-info-header .episode-clip-count,
                    .feed-info-header .ep-pub-date{
                    /*body[data-device="desktop"] .feed-info-header a.publisher-site{*/
                        font-size: 0.85em;
                    }

                    .feed-collapsed-info-header a.publisher-site{
                        font-size: 0.8em;
                    }

                    .feed-info-header a.publisher-site{
                        font-size: 1.1rem;
                    }
                        body[data-device="desktop"] .feed-info-header a.publisher-site{
                            margin: 0px 0px 0px 12px;
                            font-size: 0.9rem;
                        }
                            body[data-device="desktop"] .feed-info-header.show a.publisher-site {
                                margin-top: 8px;
                            }

                    .feed-info-modal .dot-separator,
                    .feed-info-modal .ep-pub-date,
                    .episode-participants,
                    .feed-info-header .dot-separator,
                    .episode-clip-count,
                    .feed-info-header .ep-pub-date{
                        display: inline-block;
                    }
                        #episode-info-header[data-episode-id="unavailable"] .dot-separator{
                            display: none;
                        }
                    .pod-title{
                        font-size: 1.2em;
                        margin-top: 4px;
                        line-height: 1.4em;
                    }
                        a.inner-pod-show-link {
                            color: inherit;
                            border-bottom: 1px dotted #FFFFFF;
                        }
                    a.publisher-site {
                        color: #FFFFFF;
                        /*margin-left: 10px;*/
                        /*border-bottom: 1px dotted #FFFFFF;*/
                        /*padding: 0px 1px;*/
                        padding: 8px 14px;
                        display: inline-block;
                        margin: 8px 0px 2px;
                        border: 0px;
                    }
                        a.publisher-site.holo-btn {
                            padding: 4px 10px;
                        }
                        body[data-device="mobile"] #episode-info-header .holo-btn:active,
                        body[data-device="desktop"] #episode-info-header  .holo-btn:hover{
                            color: #03a9f4;
                        }
            @media only screen and (min-width: 600px) and (min-height: 500px) {
                .feed-info-header .info-modal-trigger {
                    display: none;
                }
                body[app-mode="feed"] .feed-info-header .episode-title {
                    flex-grow: initial;
                    align-self: center;
                }
                body[app-mode="feed"] .feed-info-header.show .episode-title,
                body[app-mode="feed"] .feed-info-header.person .episode-title {
                    align-self: normal;
                    flex-grow: initial;
                }
                .feed-info-header .share-btn {
                    top: 10px;
                }
                .feed-info-header .share-btn:hover{
                    cursor: pointer;
                }
                .episode-participants,
                .pod-title{
                    font-size: 1em;
                    line-height: 1.5em;
                }
                .episode-participants,
                .episode-clip-count{
                    display: block;
                }
                .feed-info-modal .dot-separator,
                .feed-info-header .dot-separator{
                    display: none;
                }
            }
                .feed-info-modal .dot-separator{
                    margin: 0px 5px;
                }
                .info-modal-trigger i{
                    color: #fff;
                }

                    body[data-device="desktop"] .feed-collapsed-info-header .share-btn:hover i,
                    body[data-device="desktop"] .feed-info-header .share-btn:hover i,
                    .feed-info-header .share-btn:active i,
                    .info-modal-trigger:hover i,
                    .info-modal-trigger:active i{
                        cursor: pointer;
                    }

    @media only screen and (min-width: 600px) and (min-height: 500px) {
        .feed-info-header{
            height: 320px;
        }
        #feed-info-header[data-feed-id="invalid-show"],
        #episode-info-header{
            height: auto;
            min-height: 160px;
        }
            #episode-info-header[data-episode-id="unavailable"],
            #feed-info-header[data-feed-id="invalid-show"]{
                justify-content: center;
                flex-direction: column;
            }
            body[app-mode="feed"] .feed-info-header{
                display: flex;
                align-items: center;
                justify-content: center;
                height: 80px;
                min-height: 80px !important;
            }
                body[app-mode="feed"] .feed-info-header.show,
                body[app-mode="feed"] .feed-info-header.person{
                    height: auto;
                    padding: 15px 80px;
                }
                /*body[app-mode="feed"] .feed-info-header[data-feed-type="topic"]{*/
                /*    flex-direction: column;*/
                /*}*/
            .feed-info-header.show,
            .feed-info-header.person {
                background-color: #1E88E5;
                background-size: 120px;
                background-repeat: no-repeat;
                background-position: center 16px;
            }
            .feed-info-header.show .pod-thumbnail-container #person-image-avatar,
            .feed-info-header.person .pod-thumbnail-container #person-image-avatar{
                    height: 120px;
                    width: 120px;
                    border-radius: 50%;
                    margin-right: 25px;
                }
                .feed-info-header .pod-thumbnail-container #feed-list-icon{
                    /*font-size: 190px;*/
                    font-size: 3em;
                    /*width: 58px;*/
                    /*text-align: right;*/
                }
                .feed-info-header:not([data-feed-type="topic"]) .pod-thumbnail-container #feed-list-icon{
                }
        body[app-mode="feed"] .feed-info-header .episode-title{
            font-size: 2rem;
            margin-top: 0px;
            /*margin-left: 10px;*/
            /*font-weight: 300;*/
        }
            body[app-mode="feed"] .feed-info-header:not([data-feed-type="topic"]) .episode-title{
                margin-left: 10px;
            }
            body[app-mode="feed"] .feed-info-header.show .episode-title,
            body[app-mode="feed"] .feed-info-header.person .episode-title{
                font-size: 2em;
                align-self: inherit;
            }
            body[app-mode="feed"] .feed-info-header.show .feed-info-header-overlay.
            body[app-mode="feed"] .feed-info-header.person .feed-info-header-overlay{
                display: none;
            }
    }

        .feed-info-modal{
            position: fixed;
            top: 5vh;
            left: 5vw;
            right: 5vw;
            bottom: 5vh;
            height: auto;
            max-height: none;
            width: auto;
        }
            .feed-info-modal .info-header{
                text-align: center;
                padding-bottom: 24px;
                border-bottom: 1px solid #ccc;
                position: relative;
            }
                .feed-info-modal .info-header .share-btn{
                    position:absolute;
                    top: 0px;
                    right: 0px;
                    padding: 0px 0px 6px 6px;
                }
                    .feed-info-modal .info-header .share-btn > i{
                        color: #666666;
                    }
                        .feed-info-modal .info-header .share-btn:hover > i,
                        .feed-info-modal .info-header .share-btn:active > i{
                            color: #cccccc;
                        }
            .feed-info-modal .info-header > img{
                width: auto;
                height: 18vh;
            }
            .feed-info-modal .ep-pub-date{
                margin-top: 5px;
            }
            .feed-info-modal .episode-summary{
                padding-top: 24px;
            }
                .feed-info-modal .episode-summary .center{
                    margin-top: 40px;
                }

    .feed-collapsed-info-header{
        position: fixed;
        padding: 10px 5px;
        flex-grow: 1;
        top: 0px;
        left: 0px;
        right: 0px;
        z-index: 2;
        color: #FFF;
    }
        body[prev-app-mode=""] .feed-collapsed-info-header{
            /*commented on 11.30.20 after making the feed headers no collapse anymore*/
            /*top: 54px;*/
        }
        body[data-scroll-direction="down"] .feed-collapsed-info-header,
        body[data-scroll-direction="up"] .feed-collapsed-info-header{
            top: 0px;
        }
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            body[prev-app-mode=""] .feed-collapsed-info-header,
            body[data-scroll-direction="down"] .feed-collapsed-info-header,
            body[data-scroll-direction="up"] .feed-collapsed-info-header,
            .feed-collapsed-info-header {
                top: 66px;
            }

            .feed-collapsed-info-header {
                position: fixed;
                left: 260px;
                right: 0px;
            }
            .clip-list-container .feed-collapsed-info-header {
                left: 502px;
            }
        }
    .feed-collapsed-info-header {
        padding: 0px;
        justify-content: space-between;
    }
        .app-header.user-menu-open ~ .feed-collapsed-info-header{
            display: none;
        }
        .feed-collapsed-info-header{
            display: flex;
            align-items: center;
        }
        body[data-device="desktop"] .feed-collapsed-info-header{
            padding: 0px;
            justify-content: space-between;
        }
    body[app-mode="clip"] .feed-collapsed-info-header{
        display: none !important;
    }
        .feed-collapsed-info-header .collapsed-header-actions {
            display: flex;
        }
        .feed-info-header .share-btn,
        .feed-info-header .header-btn,
        .feed-collapsed-info-header .header-btn{
            border-radius: 50%;
        }
        .feed-collapsed-info-header .header-btn{
            order: 0;
        }
            /*body:not([data-device="desktop"]) .feed-collapsed-info-header .header-btn{*/
            /*    position: absolute;*/
            /*    left: 0px;*/
            /*    top: 0px;*/
            /*}*/
                .app-player-container .player .expand-btn:active,
                .feed-info-header .share-btn:active,
                .feed-collapsed-info-header .header-btn:active,
                .feed-info-header .header-btn:active{
                    background-color: rgba(255, 255, 255, 0.3);
                }
                .feed-collapsed-info-header .header-btn{
                    padding: 10px;
                    margin: 4px;
                    z-index: 1;
                }
                    /*.feed-collapsed-info-header .feed-nav-btn{*/
                    /*    margin-right: 54px;*/
                    /*}*/
        .feed-info-header .header-btn{
            padding: 10px;
        }
            .share-btn.header-btn {
                display: inline-block;
            }
                .share-btn.header-btn[data-feed-id="favorites"] {
                    position: relative;
                    top: -1000px;
                }
            .header-btn.follow-btn {
                border: 1px solid rgba(255,255,255,0.5);
                border-radius: 22px;
                padding: 5px 16px;
                font-size: 0.9rem;
                /*margin-top: 12px;*/
                margin-left: 8px;
                /*margin-bottom: 2px;*/
                display: inline-block;
                /*text-transform: uppercase;*/
                font-weight: 500;
                line-height: 1.1;
            }
                .header-btn.follow-btn.emphasized {
                    padding: 6px 13px;
                    font-size: 0.8rem;
                    /*border: none;*/
                    font-weight: 600;
                    background-color: rgba(0,0,0,0.2);
                    text-transform: uppercase;
                }
                    body[data-device="desktop"] .header-btn.follow-btn.emphasized {
                        /*padding: 7px 16px;*/
                        /*font-size: 1.0rem;*/
                        margin-left: 16px;
                        font-size: 0.7rem;
                        margin-bottom: 1px;
                    }
                body[data-device="mobile"] .header-btn.follow-btn.emphasized:active,
                body[data-device="desktop"] .header-btn.follow-btn.emphasized:hover{
                    background-color: rgba(0,0,0,0.3);
                }
                /*body[data-device="desktop"] .feed-info-header .header-btn.follow-btn{*/
                /*    margin-top: 10px;*/
                /*}*/
                    .feed-collapsed-info-header .header-btn.follow-btn {
                        margin-top: 0px;
                        border-radius: 22px;
                    }
                    .feed-collapsed-info-header .follow-btn.icon-btn {
                        padding: 10px 14px;
                        border: none;
                        margin: 5px -5px 5px 5px;
                        position: relative;
                    }
            .follow-btn > svg {
                height: 22px;
                width:  auto;
            }
            .follow-btn > .follow-btn-status-icon{
                border-radius: 50%;
                padding: 1px;
                font-size: 0.6rem;
                position: absolute;
                top: 8px;
                right: 12px;
            }
        .feed-info-header .feed-nav-btn{
            position: absolute;
            left: 4px;
            top: 8px;
            z-index: 1;
        }
            .clip-list-container .feed-nav-btn {
                display: none;
            }

    body[prev-app-mode=""] .feed-info-header[data-feed-type="category"] .feed-nav-btn,
    body[prev-app-mode=""] .feed-info-header[data-feed-type="topic"] .feed-nav-btn,
    /*body[data-device="desktop"] .feed-collapsed-info-header .feed-nav-btn{*/
    body[prev-app-mode=""]:not([data-device="desktop"]) .feed-collapsed-info-header .feed-nav-btn,
    /*body[data-device="desktop"] .feed-collapsed-info-header .feed-nav-btn{*/
    body[prev-app-mode=""]:not([data-device="desktop"]) .feed-collapsed-info-header .feed-nav-btn{
        position: relative;
        top: -1000px;
    }
    body[prev-app-mode=""]:not([data-device="desktop"]) .feed-collapsed-info-header[data-feed-type="topic"]{
        padding-left: 13px;
    }
    body[prev-app-mode=""]:not([data-device="desktop"]) .feed-collapsed-info-header[data-feed-type="topic"] .feed-nav-btn,
    body[prev-app-mode=""] #episode-minified-app-header .feed-nav-btn,
    body[prev-app-mode=""] .feed-info-header[data-feed-id="invalid-show"] .feed-nav-btn,
    body[prev-app-mode=""] .feed-info-header:not([data-feed-type="category"]):not([data-feed-type="topic"]) .feed-nav-btn{
        display: none;
    }
        .feed-collapsed-info-header .episode-info-container img{
            width: auto;
            height: 45px;
        }
            #episode-minified-app-header .episode-info-container img{
                margin-left: 5px;
            }
        body[data-device="desktop"] .feed-collapsed-info-header a.publisher-site,
        .feed-collapsed-info-header .episode-info-outer,
        .feed-collapsed-info-header > .feed-title{
            margin-left: 12px;
        }
            .feed-collapsed-info-header > .feed-title{
                font-size: 1.4em;
                line-height: 1.2em;
                max-height: 2.4em;
            }
            .feed-collapsed-info-header .episode-title{
                font-size: 1.3em;
                line-height: 1.3em;
                max-height: 3.9em;
            }
        .feed-collapsed-info-header > .feed-title{
            /*flex-grow: 1;*/
            /*font-weight: 500;*/
            margin-left: 0px;
            position: relative;
            text-indent: 2px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
            .feed-collapsed-info-header[data-feed-type="show"] .feed-title.center-align,
            .feed-collapsed-info-header[data-feed-type="person"] .feed-title.center-align {
                display: flex;
                align-items: center;
            }
                div#locked-header-person-img {
                    display: inline-block;
                    background-size: cover;
                    background-position: center;
                    height: 40px;
                    width: 40px;
                    border-radius: 50%;
                    margin-right: 6px;
                }
            .feed-collapsed-info-header[data-feed-type="category"] .feed-title.center-align {
                display: flex;
                align-items: center;
            }
            .feed-collapsed-info-header[data-feed-type="topic"] .feed-title{
                flex-grow: 1;
                text-align: left;
                display: flex;
                align-items: center;
                font-size: 1.3rem;
            }
                body[data-device="desktop"] .feed-collapsed-info-header[data-feed-type="topic"] .feed-title{
                    justify-content: center;
                }
            .feed-collapsed-info-header[data-feed-type="topic"] .feed-collapsed-info-header #feed-list-icon{
                position: absolute;
                left: -32px;
            }
                .feed-collapsed-info-header #feed-list-icon{
                    margin-right: 4px;
                }
                .feed-collapsed-info-header[data-feed-type="topic"] #feed-list-icon {
                    position: static;
                    margin-right: 4px;
                }

        .feed-collapsed-info-header .episode-title{
            text-overflow: ellipsis;
            width: 100%;
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
        }
            span.feed-title-inner {
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
            }
                body[data-device="desktop"] .feed-collapsed-info-header[data-feed-type="topic"] span.feed-title-inner {
                    position: relative;
                    display: inline-block;
                    overflow: visible;
                    line-height: 28px;
                }
                    body[data-device="desktop"] .feed-collapsed-info-header[data-feed-type="topic"] span.feed-title-inner .follow-btn{
                        position: absolute;
                        top: 1px;
                        left: calc(100% + 4px);
                        left: -webkit-calc(100% + 4px);
                        left: -moz-calc(100% + 4px);
                        font-size: 0.8rem;
                        padding-right: 10px;
                        /*padding-left: 10px;*/
                    }
                        body[data-device="desktop"] .feed-collapsed-info-header[data-feed-type="topic"] span.feed-title-inner .follow-btn{
                            padding: 6px 10px;
                            top: 0px;
                        }
            body[data-device="desktop"] .feed-collapsed-info-header .share-btn {
                display: block;
                padding: 10px;
                margin-right: 4px;
            }
            /*body[data-device="desktop"] .feed-info-header .share-btn{*/
            body[data-device="desktop"] .feed-info-header .feed-actions{
                display: flex;
                flex-direction: row-reverse;
                position: absolute;
                top: 4px;
                right: 4px;
                left: auto;
                border-radius: 50%;
                align-items: center;
            }
/*home page styling*/
.main-app-container{

}
.app-header{
    /*font-family: 'America';*/
    position: relative;
    min-height: 54px;
    /*padding: 13px 20px;*/
    padding: 13px 24px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
    .topic-list-leftnav,
    .clip-list-container {
        max-height: calc(100vh - 66px);
        max-height: -webkit-calc(100vh - 66px);
        max-height: -moz-calc(100vh - 66px);
        overflow-y: scroll;
    }
    .clip-list-container {
        flex-grow: 1;
    }
    .app-view > .app-header:not(.user-menu-open) {
        z-index: 3;
    }
    body[app-mode="moment"] .app-view > .app-header:not(.user-menu-open){
        z-index: 11;
    }

    body[data-device="mobile"][app-mode="search"]:not([prev-app-mode=""]) .app-view .app-header,
    body[data-device="mobile"][data-active-search="true"] .app-view .app-header{
    /*body.player-expanded .app-header.main{*/
        display: none;
    }
    body[app-mode="clip"] .app-player-container .app-header {
        justify-content: space-between;
    }
        .app-header-action {
            padding: 10px;
            margin: -10px;
            border-radius: 50%;
        }
            .app-header-action i.material-icons {
                color: #FFFFFF;
            }
        .app-header-action.hidden {
            position: relative;
            top: -1000px;
        }
    /*body[data-device="desktop"] > .app-header{*/
    /*    width: 100vw;*/
    /*    text-align: left;*/
    /*    justify-content: flex-start;*/
    /*}*/

    body[data-device="desktop"] .app-header.main {
        position: fixed;
        top: 0px;
        left: 0px;
        right: 0px;
        z-index: 10;
        height: 66px;
        /*border-bottom: 1px solid;*/
        justify-content: flex-start;
        display: block;
        background-color: #FFFFFF;
        padding: 0px;
        min-width: 950px;
    }
        body[data-device="desktop"] .app-header.main,
        body[data-device="desktop"] .app-navigation > .sidenav{
            border-color: rgba(74, 86, 202, 0.35);
        }
        body[data-device="desktop"][data-active-search="true"] .app-header {
            justify-content: center;
            border-bottom-color: transparent;
        }
        body[data-device="desktop"] .app-header:not(.main) {
            display: none;
        }
    .app-header > .app-header-icon-wrapper{
        position: relative;
        display: inline-block;
        font-size: 1.4em;
        font-weight: 500;
        line-height: 1.2em;
    }
        .app-header > .app-header-icon-wrapper,
        .app-header .chat-support-btn{
            color: #fff;
        }
        .people-btn:hover,
        .player .episode-info-container .episode-title:hover,
        .clip-sequence:hover,
        .app-header > .app-header-icon-wrapper:hover{
            cursor: pointer;
        }
    body[data-device="desktop"] > .app-header > .app-header-icon-wrapper{
        width: 260px;
        height: 100%;
        display: flex;
        justify-content: flex-start;
        align-content: center;
        padding: 10px 6px;
    }
        body[data-device="desktop"] .app-navigation > .sidenav,
        body[data-device="desktop"] > .app-header > .app-header-icon-wrapper {
            /*border-right: 1px solid rgba(74, 86, 202, 0.2);*/
            border-right: 1px solid #e0e0e0;
        }
            body[data-device="desktop"] > .app-header.prominent-search > .app-header-icon-wrapper{
                border-right-width: 0px;
            }
        .app-header > .app-header-icon-wrapper .dev-badge{
            position: absolute;
            left: auto;
            font-weight: normal;
            top: -7px;
            right: -25px;
            padding-bottom: 3px;
        }
            body[data-device="desktop"] .app-header > .app-header-icon-wrapper .dev-badge {
                position: relative;
                height: 21px;
                top: 0px;
                left: -22px;
            }
        .app-header > .app-header-icon-wrapper > .app-header-img{
            margin: 0 auto;
            height: 28px;
        }
            body[data-device="desktop"] .app-header > .app-header-icon-wrapper > .app-header-img {
                margin:  0px;
                opacity: 1.0;
                padding: 10px 14px;
                height: 48px;
                border-radius: 24px;
                width: 145px;
            }
                body[data-device="desktop"] .app-header > .app-header-icon-wrapper > .app-header-img:hover{
                    opacity: 1.0;
                    cursor: pointer;
                }
        .app-header .chat-support-btn{
            position: absolute;
            right: 5px;
            top: 5px;
            padding: 10px;
            border-radius: 50%;
        }
        .app-header .email-collection-modal-trigger{
            color: #FFF;
            position: absolute;
            padding: 10px;
            top: 5px;
            left: 5px;
        }
            #email-collection-modal{
                width: 90%;
            }
            #email-collection-modal,
            #goog-form-iframe{
                height: 100vh;
                max-height: 460px;
            }
            #goog-form-iframe{
                width: 100%;
            }
            /*body[data-device="desktop"] #goog-form-iframe{*/
            /*    max-height: 500px;*/
            /*}*/
    .app-header > #exit-search-btn{
        display: none;
        color: #5f6368;
    }
        .app-header > #exit-search-btn:hover{
            cursor: pointer;
            color: #333333;
            background-color: rgba(0, 0, 0, 0.04);
        }
            .app-header > #exit-search-btn:active{
                background-color: rgba(0, 0, 0, 0.12);
            }
        body[data-active-search="true"] .app-header > #exit-search-btn{
            display: block;
            position: fixed;
            top: 8px;
            left: 8px;
            border-radius: 50%;
            padding: 6px;
        }
    @media only screen and (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
        .app-header,
        .app-header.main{
            padding-top: 10px;
            padding-bottom: 10px;
            height: auto;
            min-height: 46px;
        }
            .app-header > .app-header-icon-wrapper > .app-header-img {
                height: 22px;
            }
        .app-header .chat-support-btn{
            top: 1px;
        }
    }
    .signout-btn:not(.nav-str){
        align-self: flex-end;
        padding: 15px 20px;
        /*opacity: 0.7;*/
        /*z-index: 10;*/
    }
        .signout-btn:active{
            /*opacity: 1.0;*/
        }
        body[app-mode="episode"]:not([data-device="desktop"]):not([prev-app-mode=""]) .app-header{
            display: none;
        }
#category-list{
    padding: 20px 20px 0px;
}
    body[data-device="mobile"][app-mode="home"] #category-list,
    body[data-device="mobile"][app-mode="search"] #category-list{
        padding-top: 10px;
    }
        body[data-device="mobile"] #category-list.pod-carousel{
            /*display: -webkit-inline-box;*/
            overflow-x: auto;
            white-space: nowrap;
            padding-bottom: 8px;
        }
            #category-title.intra-feed+div#category-list {
                padding-bottom: 10px;
            }
    .category {
        color: #FFF;
        padding: 12px 20px;
        font-size: 1.3em;
        border-radius: 4px;
        margin: 5px;
        display: inline-block;
        width: calc(50% - 5px);
    }
        /*body[data-device="desktop"] .category{*/
        /*    color: rgba(0, 0, 0, 0.75);*/
        /*    border: solid 2px #e0e0e0;*/
        /*    !*margin: -1px;*!*/
        /*}*/
        /*    body[data-device="desktop"] .category[data-id="trending"]:hover{*/
        /*        border-color: #ffa726;*/
        /*    }*/
        /*    body[data-device="desktop"] .category[data-id="popular"]:hover{*/
        /*        border-color: #ef5350;*/
        /*    }*/
        /*    body[data-device="desktop"] .category[data-id="latest"]:hover{*/
        /*        border-color: #40c4ff;*/
        /*    }*/
        /*    body[data-device="desktop"] .category[data-id="coronavirus"]:hover{*/
        /*        border-color: #1b5e20;*/
        /*    }*/
    .category:nth-child(odd){
        margin-left: 0px;
    }
    .category:nth-child(even){
        margin-right: 0px;
    }
        .category.rnd-card {
            border-radius: 20px;
            padding: 20px;
            width: 140px;
            height: 143px;
            display: inline-flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            margin-right: 15px;
            margin-left: 0px;
        }
            .category.rnd-card {

            }
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            .feed-collapsed-info-header .header-btn,
            .feed-info-header .header-btn:not(.follow-btn){
                border-radius: 50%;
                top: 4px;
                left: 4px;
            }
            /*.app-player-container.expanded .player .expand-btn:hover,*/
            .feed-collapsed-info-header .header-btn:hover,
            .feed-info-header .header-btn:hover{
                cursor: pointer;
                background-color: rgba(255, 255, 255, 0.3);
            }
            /*body.player-expanded .app-header{*/
            /*    display: block !important;*/
            /*}*/
            #category-list{
                padding-left: 35px;
                padding-top: 25px;
                display: flex;
            }
            .category:nth-child(even),
            .category:nth-child(odd){
                margin: 0px 30px 20px 0px;
            }
            .category:first-child{
                margin-left: 0px;
            }
            .category:last-child{
                margin-right: 0px;
            }
                .app-view .signout-btn{
                    display: none;
                }
        }
    .category:hover{
            cursor: pointer;
        }
        .green.accent-3:not(.feed-info-header):not(.feed-collapsed-info-header):active {
            background-color: #00c853 !important;
        }
        .orange.lighten-1:not(.feed-info-header):not(.feed-collapsed-info-header):active {
            background-color: #ff9800 !important;
        }
        .cyan.accent-3:not(.feed-info-header):not(.feed-collapsed-info-header):active {
            background-color: #00bcd4 !important;
        }
        .red.lighten-1:not(.feed-info-header):not(.feed-collapsed-info-header):active {
            background-color: #f44336 !important;
        }

        .teal.accent-4:not(.feed-info-header):not(.feed-collapsed-info-header):active{
            background-color: #00796b !important;
        }
        .green.darken-3:not(.feed-info-header):not(.feed-collapsed-info-header):active{
            background-color: #1b5e20 !important;
        }
        .purple.lighten-2:not(.feed-info-header):not(.feed-collapsed-info-header):active{
            background-color: #ab47bc !important;
        }
        .light-blue.accent-2:not(.feed-info-header):not(.feed-collapsed-info-header):active{
            background-color: #0091ea !important;
        }
        .teal.accent-3:not(.feed-info-header):not(.feed-collapsed-info-header):active{
            background-color: #00bfa5 !important;
        }
        .amber.darken-2:not(.feed-info-header):not(.feed-collapsed-info-header):active{
            background-color: #ff8f00 !important;
        }
        .blue-grey.darken-1:not(.feed-info-header):not(.feed-collapsed-info-header):active{
            background-color: #455a64 !important;
        }
        .deep-orange:not(.feed-info-header):not(.feed-collapsed-info-header):active {
            background-color: #f4511e !important;
        }
        .category-icon-container{
            margin-bottom: 10px;
        }
            .rnd-card .category-icon-container {
                margin-bottom: 14px;
            }
            body[data-device="desktop"] .category-icon-container{
                margin-bottom: 0px;
            }
            .category-icon-container > i{
                font-size: 40px;
            }
                .category.rnd-card .category-icon-container > i {
                    background-color: #FFFFFF;
                    border-radius: 50%;
                    padding: 8px;
                    font-size: 26px;
                    height: 42px;
                    width: 42px;
                }
        .feed-collapsed-info-header > .feed-title,
        .feed-info-header .episode-title,
        .category-name{
            font-weight: 600;
        }
        .category-name{
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
.topic-list-leftnav {
    display: flex;
    flex-direction: column;
    min-width: 242px;
    min-height: calc(100vh - 66px);
    min-height: -webkit-calc(100vh - 66px);
    min-height: -moz-calc(100vh - 66px);
    min-height: -o-calc(100vh - 66px);
    /*border: 1px solid #e0e0e0;*/
    /*border-width: 0px 1px 0px 0px;*/
}
.topic-list-leftnav #tag-feed-item-container{
    flex-direction: column;
    padding-top: 22px;
    padding-right: 22px;
}
.search-container #tag-feed-item-container{
    padding: 12px;
}
    body[data-discovery-redesign="true"] .search-container #tag-feed-item-container{
        padding: 20px 20px 0px;
    }
    body[data-device="desktop"] .topics-container div#tag-feed-item-container{
        margin-left: -35px;
    }
    body[data-device="desktop"] .app-view > #tag-feed-item-container{
        padding-top: 35px;
    }
    body[data-discovery-redesign="true"] .search-container #tag-feed-item-inner-container,
    .list-item-inner-container{
        /*display: flex;*/
        white-space: nowrap;
    }
        .topic-list-leftnav div#tag-feed-item-inner-container{
            flex-direction: column;
            display: flex;
        }
        body[data-device="desktop"] .topics-container div#tag-feed-item-inner-container{
            white-space: normal;
        }
        .topic-list-leftnav div#tag-feed-item-inner-container,
        .search-container #tag-feed-item-inner-container{
            white-space: normal;
        }
    .tag-feed-item{
        display: inline-block;
        width: 100px;
        height: 100px;
        border-radius: 50%;
        color: #FFFFFF;
        margin-right: 12px;
        overflow: hidden;
        flex-direction: column;
    }
        a.tag-feed-item.pill.rnd {
            border-radius: 20px;
            margin-right: 15px;
            padding: 0px;
            border: 0px;
            width: 96px;
        }
            .category.rnd-card:last-of-type,
            a.tag-feed-item.pill.rnd:last-of-type {
                margin-right: 20px;
            }
            a.tag-feed-item.pill.rnd .tag-feed-item-inner {
                padding: 30px 20px;
                color: #FFF;
            }
        body[data-device="desktop"] .topic-list-leftnav .tag-feed-item:first-child {
            margin: 0px;
        }
        body[data-device="desktop"] .topic-list-leftnav .tag-feed-item.list-nav-item:first-child,
        a.tag-feed-item.list-nav-item {
            height: auto;
            width: auto;
            margin: 0px 24px 18px 12px;
        }
        a.tag-feed-item.list-nav-item{
            border-radius: 23px;
            padding: 12px 12px 12px 14px;
            opacity: 0.7;

        }
            .tag-feed-item.list-nav-item:hover,
            .tag-feed-item.list-nav-item.active{
                opacity: 1.0;
            }
        .tag-feed-item.card {
            border-radius: 10px;
            display: block;
            width: auto;
            margin: 15px 0px;
            height: auto;
            box-shadow: none;
            -moz-box-shadow: none;
            -webkit-box-shadow: none;
        }
            body[data-device="desktop"] .tag-feed-item.card {
                height: 180px;
                width: 270px;
                display: inline-block;
                margin: 0px 0px 35px 35px;
            }
            .tag-feed-item.image-card{
                background-size: cover;
                background-position: center center;
                background-repeat: no-repeat;
            }
                .tag-feed-item.list-nav-item .tag-feed-item-inner {
                    /*padding: 20px 30px;*/
                    padding: 0px;
                }

                .tag-feed-item.card .tag-feed-item-inner > div {
                    display: flex;
                    align-items: center;
                    font-size: 1.2rem;
                }
                .tag-feed-item.list-nav-item .tag-feed-item-inner > div {
                    display: flex;
                    align-items: center;
                }
                    body[data-device="desktop"] .tag-feed-item.card .tag-feed-item-inner > div {
                        flex-direction: column;
                        font-size: 1.45rem;
                    }
                        .tag-feed-item.card .tag-feed-item-inner {
                            padding: 25px 20px;
                        }
                        .tag-feed-item.image-card .tag-feed-item-inner {
                            padding-top: 35px;
                            padding-bottom: 35px;
                        }
                            .tag-feed-item.card .tag-feed-item-inner > div > i.material-icons {
                                margin-right: 20px;
                                font-size: 2rem;
                                width: 28px;
                            }
                                .tag-feed-item.list-nav-item i.material-icons {
                                    margin-right: 12px;
                                }
                                body[data-device="desktop"] .tag-feed-item.card .tag-feed-item-inner > div > i.material-icons {
                                    font-size: 3rem;
                                    margin-right: 0px;
                                    margin-bottom: 20px;
                                    width: 44px;
                                }
                                .tag-feed-item.list-nav-item .tag-name,
                                .tag-feed-item.card .tag-feed-item-inner > div > .tag-name {
                                    margin-top: 0px;
                                }

                                .tag-feed-item.list-nav-item .tag-name {
                                    font-size: 1.1rem;
                                    font-weight: 600;

                                }

        body[app-mode="search"] .list-title,
        body[app-mode="home"] .list-title,
        .person-feed-item:first-child,
        .tag-feed-item:not(.card):first-child{
            margin-left: 20px;
        }
            .search-container .tag-feed-item.pill:first-child{
                margin-left: 0px;
            }
            body[data-device="mobile"][data-discovery-redesign="true"] .list-title {
                text-transform: uppercase;
                font-size: 1.1rem;
            }
            .list-header,
            .list-title{
                /*font-size: 1.5em;*/
                font-size: 1.6em;
                font-weight: 600;
                color: rgba(0, 0, 0, 0.75);
            }
                .list-title.intra-feed{
                    font-size: 1.5em;
                }
                #clip-list-title.list-title{
                    margin-top: 20px;
                    margin-bottom: 20px;
                }
                    .clip-container-wrapper {
                        display: flex;
                        padding: 0px 35px;
                        flex-wrap: wrap;
                    }
                body[data-device="desktop"] .list-header#clips-header{
                    margin-top: 15px;
                }
                body[app-mode="home"]:not([data-device="desktop"]) .app-view > #category-title:not(.intra-feed){
                    display: none;
                }
                body[data-device="desktop"] .search-container~.list-title{
                    margin-top: 15px;
                    margin-bottom: 23px;
                }
                    body[data-device="mobile"][app-mode="search"]:not([data-discovery-redesign="true"]) #category-title,
                    body[data-device="desktop"] #category-title{
                        display: none;
                    }

            @media only screen and (min-width: 600px) and (min-height: 500px) {
                body[app-mode="search"] .list-title,
                body[app-mode="home"] .list-title,
                body[data-device="desktop"] .person-feed-item:first-child,
                body[data-device="desktop"] .tag-feed-item:first-child{
                    margin-left: 35px;
                }

                /*body[app-mode="home"] .list-title{*/
                /*    !*margin-top: 25px;*!*/
                /*}*/

                .feed-collapsed-info-header > .feed-title,
                .list-header,
                .list-title,
                body[app-mode="home"] .list-title{
                    font-weight: 600;
                }
                .feed-info-header .episode-title,
                .category-name{
                    font-weight: 500;
                }
            }
    .person-feed-item {
        display: inline-block;
        height: 120px;
        width: 120px;
        background-size: cover;
        background-position: center center;
        border-radius: 5px;
        position: relative;
        overflow: hidden;
        margin-right: 12px;
        vertical-align: top;
    }
        .person-feed-item.rnd-card {
            border-radius: 20px;
            padding: 12px;
            height: 143px;
            width: 124px;
            margin-right: 15px
        }
            .person-feed-item.rnd-card:last-of-type {
                margin-right: 20px;
            }
            .search-container .person-feed-item.rnd-card {
                border: 1px solid #e0e0e0;
            }
        @media only screen and (min-width: 600px) and (min-height: 500px) {
            /*.tag-feed-item,*/
            .person-feed-item,
            .category {
                width: 200px;
            }
            .category {
                height: 106px;
            }
                /*[app-mode="home"] .category {*/
                /*    height: 200px;*/
                /*}*/
            .person-feed-item{
                height: 200px;
            }
            .list-item,
            .person-feed-item,
            .category {
                box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
            }
                .tag-feed-item:hover,
                .person-feed-item:hover,
                .category:hover {
                    cursor: pointer;
                }
                .tag-feed-item:not(.pill):not(.list-nav-item):hover,
                .person-feed-item:hover,
                .category:hover {
                    box-shadow: 0px 0px 6px rgba(0,0,0,0.6);
                }
                /*commented on 11.20.19 by KL after discussion w/ MA because we are adding a border to the item on hover*/
                .list-item.person:hover .list-item-overlay,
                .person-feed-item:hover .image-overlay-bg{
                    background-image: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,0.15));
                }
            .category{
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
                min-width: 200px;
            }
            .person-feed-item,
            .tag-feed-item,
            .category{
                /*margin: 0px 5px;*/
                margin-right: 20px;
            }
            .tag-feed-item{
                height: 120px;
                width: 120px;
                /*border-radius: 4px;*/
            }
                .tag-feed-item i.material-icons{
                    /*font-size: 40px;*/
                }
            /*.tag-name,*/
            .category-name{
                font-size: 18px;
            }

        }
        .person-feed-item-inner{
            display: flex;
            justify-content: flex-end;
            align-items: flex-end;
            z-index:1;
            position:relative;
            flex-direction: column;
            padding: 4px 5px;
        }
        .image-overlay-bg{
            /*background-color: rgba(0,0,0,0.3);*/
            background-image: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,0.5));
            position: absolute;
            top: 0px;
            left:0px;
            right:0px;
            bottom:0px;
        }
            .person-feed-item:active .image-overlay-bg{
                background: none;
            }
        .person-feed-item-inner,
        body:not(.mobile-ios) .tag-feed-item:not(.pill) .tag-feed-item-inner {
            height: 100%;
        }
            .tag-feed-item.image-card .tag-feed-item-inner {
                background-color: rgba(0,0,0,0.3);
            }
        .tag-name{
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-top: 4px;
        }
        .person-name,
        .tag-feed-item:not(.pill):not(.list-nav-item) .tag-name {
            font-weight: 600;
        }

            .person-name{
                width: 100%;
                color: #fff;
                font-size: 1.05em;
                line-height: 1.2em;
                text-align: center;
                text-overflow: ellipsis;
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                white-space:normal;
            }
        .app-navigation{
            order: 2;
            /*border-top: 2x solid #1976d2;*/
        }
            .mobile-ios.mobile-safari .app-footer > .app-navigation.hide-on-med-and-up{
                /*position: fixed;*/
                /*bottom:0px;*/
                /*left: 0px;*/
                /*right: 0px;*/
            }
            .mobile-ios.mobile-safari .app-footer:not(.full-browser-viewport) > .app-navigation.hide-on-med-and-up,
            .mobile-ios.mobile-safari .full-browser-viewport > .app-navigation.hide-on-med-and-up{
                animation-duration: 250ms;
                animation-delay: 0ms;
                animation-fill-mode: both;
            }
            .mobile-ios.mobile-safari .app-footer.full-browser-viewport{
                /*transform: translateY(0) !important;*/
            }
            .mobile-ios.mobile-safari:not([data-scroll-direction="down"])[app-mode="episodes"] .full-browser-viewport > .app-navigation.hide-on-med-and-up,
            .mobile-ios.mobile-safari:not([data-scroll-direction="down"])[app-mode="people"] .full-browser-viewport > .app-navigation.hide-on-med-and-up,
            .mobile-ios.mobile-safari[data-scroll-direction="down"].player-visible .full-browser-viewport > .app-navigation.hide-on-med-and-up,
            .mobile-ios.mobile-safari[data-scroll-direction="up"] .full-browser-viewport > .app-navigation.hide-on-med-and-up{
                animation-name:iosSlideBottomMenuUp;
            }

            .mobile-ios.mobile-safari .app-footer.full-browser-viewport > .app-navigation.hide-on-med-and-up > nav{
                /*animation-name:iosSlideBottomMenuDown;*/
                /*NOTE: cancelling the bg color*/
                background: none !important;
                /*NOTE: setting the bottom of this "padded" bottom nav with a similar bottom bg color as the mobile Safari browser nav bar*/
                background-image: linear-gradient(to bottom, #4a56ca, #4a56ca 56px, #f9f9f6 57px, #f9f9f6 100%) !important;
            }
            .mobile-ios.mobile-safari .app-footer:not(.full-browser-viewport) ul{
                height: 100%;
                align-items: flex-end;
            }

            @keyframes iosSlideBottomMenuUp {
                0% {
                    height: 56px;
                }
                100% {
                    /*height: 111px;*/
                    height: 111px;
                }
            }

                @media only screen and (min-height: 680px) {
                    @keyframes iosSlideBottomMenuUp {
                        0% {
                            height: 56px;
                        }
                        100% {
                            height: 130px;
                        }
                    }
                }

            @keyframes iosSlideBottomMenuDown {
                0% {
                    height: 111px;
                }
                100% {
                    height: 56px;
                }
            }

            @media only screen and (min-height: 680px) {
                @keyframes iosSlideBottomMenuDown {
                    0% {
                        height: 130px;
                    }
                    100% {
                        height: 56px;
                    }
                }
            }
            .full-browser-viewport > .app-navigation.hide-on-med-and-up > nav{
                height: 100%;
            }
            body.player-expanded > .app-footer > .app-navigation.hide-on-large-only{
                display: none;
            }
            @media only screen and (min-width: 600px) and (min-height: 500px) {
                .app-navigation > .sidenav{
                    position: static;
                    width: 260px;
                    padding: 20px 0px;
                    height: 100%;
                    top: 54px;
                    box-shadow:  none;
                    /*border-right: 1px solid*/
                }
                    .app-player-container:not(.pending):not(.expanded) ~ .app-view {
                        margin-bottom: 79px;
                    }
                    /*.app-player-container:not(.pending):not(.expanded) ~ .app-navigation > .sidenav {*/
                    /*    height: auto;*/
                    /*    bottom: 100px;*/
                    /*}*/
                #nav-icon-container{
                    padding: 10px 20px 0px;
                }
                .person-name,
                .tag-feed-item:not(.pill):not(.list-nav-item) .tag-name,
                .tag-name {
                    font-weight: normal;
                }
            }
                .app-navigation .sidenav #logo{
                    width: 60%;
                    height: auto;
                    opacity: 0.85;
                }
                    .app-navigation .sidenav #logo:hover{
                        opacity: 1.0;
                        cursor: pointer;
                    }
    /*body[data-is-authorized="false"] .app-navigation,*/
    /*    body[app-mode="signin"] .app-navigation {*/
    /*        display: none;*/
    /*    }*/
        body[app-mode="moment"] .mobile.app-navigation{
            display: none;
        }
        .app-player-container.minimized ~ .app-navigation{
            z-index: 2;
        }
            body[data-os="iOS"] .app-player-container.minimized ~ .app-navigation > nav{
                padding-bottom: env(safe-area-inset-bottom, 44px);
            }
            .app-navigation > nav {
                /*background-color: #26a57c;*/
                bottom: 0px;
                text-align: center;
            }
            .app-navigation.hide-on-med-and-up > nav {
                height: 56px;
                line-height: 1;
            }
            body[data-os="iOS"]  .app-navigation.hide-on-med-and-up > nav{
                height: auto;
            }
            .app-navigation .nav-option-container{
                    display: block;
                }
                    .app-navigation .nav-option-container ul{
                        display: flex;
                    }
                        .app-navigation li.nav-option{
                            padding: 9px 0px;
                            float: none;
                            text-align: center;
                            flex: 1;
                            color: inherit;
                            border-radius: 42px/100px;
                        }
                            body[data-device="desktop"] .app-navigation li.nav-option{
                                flex: none;
                            }
                            .app-navigation li.nav-option:not(.user-options-container){
                                opacity: 0.6;
                            }
                                body[data-device="desktop"] .app-navigation li.nav-option:not(.user-options-container){
                                    opacity: 1.0;
                                }
                            body[data-device="mobile"] .app-navigation li.nav-option{
                                margin: 0px 2px;
                            }
                            /*body[data-is-authorized="false"] .app-navigation li.nav-option[data-view="favorites"]{*/
                            /*    display: none;*/
                            /*}*/
                            body[data-device="desktop"] .app-navigation .nav-option.user-options-container{
                                display: flex;
                                width: 100%;
                                justify-content: space-between;
                            }
                                .user-options-container .username {
                                    color: inherit;
                                    -webkit-user-select: none;
                                    user-select: none;
                                    padding: 0px;
                                    height: auto;
                                    line-height: 30px;
                                    text-overflow: ellipsis;
                                    overflow: hidden;
                                    white-space: nowrap;
                                    display: flex;
                                    align-items: center;
                                }
                                    body[data-is-authorized="false"] .user-options-container .username{
                                        /*border-radius: 50%;*/
                                        /*border: 1px solid rgba(0,0,0,0.87);*/
                                        padding: 8px;
                                    }
                                        body[data-is-authorized="false"] .user-options-container #username-inner,
                                        body[data-is-authorized="false"] .user-options-container #username-caret{
                                            display: none;
                                        }
                                        body[data-is-authorized="false"] .user-options-container:hover .username{
                                            border-color: inherit;
                                        }

                                    .mi-person:before{
                                        content: "person";
                                    }
                                    .mi-close:before{
                                        content: "close";
                                    }
                                    .mi-more_vert:before{
                                        content: "more_vert";
                                    }
                                    .mi-speed:before{
                                        content: "speed";
                                    }
                                #header-signin-btn {
                                    display: flex;
                                    align-items: center;
                                    /*border: 1px solid;*/
                                    padding: 6px 10px;
                                    /*border-radius: 3px;*/
                                    margin-left: 10px;
                                    margin-right: 5px;
                                }
                                    body[app-mode="signin"] #header-signin-btn,
                                    body[data-is-authorized="true"] #header-signin-btn {
                                        display: none;
                                    }
                                    #header-signin-btn .btn-icon {
                                        margin-right: 6px;
                                        max-width: 28px;
                                        width: 28px;
                                        border-radius: 50%;
                                        color: #FFFFFF;
                                        padding: 5px;
                                    }
                                        #header-signin-btn .btn-icon i.material-icons {
                                            font-size: 1.2rem;
                                        }
                                    #header-signin-btn .btn-str {
                                        /*text-transform: uppercase;*/
                                    }
                                    #header-signin-btn:hover{
                                        cursor: pointer;
                                    }
                            body[data-device="desktop"] .app-navigation li.nav-option[data-view="signin"] {
                                border-radius: 34px;
                                border: 1px solid rgba(0,0,0,0.87);
                                margin: auto 20px 0px;
                                justify-content: center;
                            }
                                body:not([data-is-authorized="false"]) .app-navigation li.nav-option[data-view="signin"] {
                                    display: none;
                                }
                            body[app-mode="signin"] .search-inner-container,
                            body[app-mode="signin"] .app-navigation .nav-option.user-options-container,
                            body[app-mode="signin"] .chat-support-btn{
                                display: none;
                            }
                            @media only screen and (min-width: 600px) and (min-height: 500px) {
                                .app-navigation li.nav-option{
                                    display: flex;
                                    flex-direction: row;
                                    justify-content: start;
                                    align-items: center;
                                    max-width: 100%;
                                    margin: 8px 6px;
                                    padding: 0px;

                                }
                                    .app-navigation li.nav-option .nav-option-inner{
                                        position: relative;
                                        display: flex;
                                        align-items: center;
                                        border-radius: 27px;
                                        padding: 12px 30px 12px 14px;
                                    }
                                        body[data-device="desktop"] .user-options-container > .dropdown-trigger,
                                        body[data-device="desktop"] .app-header > .app-header-icon-wrapper .app-header-img,
                                        .app-navigation li.nav-option .nav-option-inner{
                                            transition: all 0.1s linear;
                                            -webkit-transition: all 0.1s linear;
                                            -moz-transition: all 0.1s linear;
                                            -o-transition: all 0.1s linear;
                                        }
                                            body[data-device="desktop"] .user-options-container > .dropdown-trigger.light:hover,
                                            body[data-device="desktop"] .app-header > .app-header-icon-wrapper .app-header-img.light:hover{
                                                background-color: rgba(255,255,255,0.2) !important;
                                            }

                                    .app-navigation li.nav-option:hover {
                                        cursor: pointer;
                                        /*opacity: 1.0;*/
                                    }
                                        div#enable-notifs-btn {
                                            margin-right: 10px;
                                            position: relative;
                                            padding: 8px;
                                            border-radius: 50%;
                                        }
                                            div#enable-notifs-btn:hover{
                                                cursor: pointer;
                                            }
                                            .app-header-btn sup {
                                                color: #FFFFFF;
                                                font-weight: bold;
                                                background-color: red;
                                                display: flex;
                                                justify-content: center;
                                                align-items: center;
                                                border-radius: 50%;
                                                position: absolute;
                                                top: -3px;
                                                right: -3px;
                                                width: 20px;
                                                height: 20px;
                                                font-size: 1.0rem;
                                            }
                                .app-navigation .chat-support-btn{
                                        padding: 10px;
                                        color: #FFF;
                                        border-radius: 50%;
                                        background: rgba(0,0,0,0.87);
                                        position: absolute;
                                        bottom: 108px;
                                        left: 50%;
                                        opacity: 0.8;
                                        margin-left: -24px;
                                        width: 48px;
                                    }
                                        .app-navigation .chat-support-btn:hover{
                                            cursor: pointer;
                                            opacity: 1.0;
                                        }
                                        .app-navigation .chat-support-btn i{
                                            font-size: 28px;
                                        }
                                    .app-navigation .email-collection-modal-trigger.modal-trigger {
                                        /*border: 1px solid rgba(0,0,0,0.87);*/
                                        border: 1px solid #0b6300de;
                                        color: #0b6300de;
                                        padding: 9px 20px;
                                        position: absolute;
                                        border-radius: 32px;
                                        left: 50%;
                                        margin-left: -73px;
                                        bottom: 174px;
                                        display: flex;
                                        align-items: center;
                                    }
                                        .app-navigation .email-collection-modal-trigger.modal-trigger:hover {
                                            background-color: #0b6300de;
                                            color: #FFFFFF;
                                            cursor: pointer;
                                        }
                                        .email-collection-modal-trigger > i.material-icons {
                                            margin-right: 5px;
                                        }
                                    .app-navigation li.nav-option.active {
                                        /*border-color: #FFF;*/
                                    }
                                .user-options-container{
                                    position: absolute;
                                    bottom: 50px;
                                    display: flex;
                                    align-items: center;
                                    padding: 10px 0px;
                                    /*color: #fff;*/
                                }
                                body[data-is-authorized="true"] .user-options-container > .username > .material-icons#username-na-icon,
                                body[data-is-authorized="false"] .user-options-container > .material-icons:not(#username-na-icon){
                                        display: none;
                                    }
                                        .mi-arrow_drop_down:before{
                                            content: "arrow_drop_down";
                                        }
                                        .user-options-container:hover{
                                            /*cursor: pointer;*/
                                        }
                                    .user-options-container > #username-dropdown{
                                        /*left: -18px !important;*/
                                        background-color: #FFFFFF;
                                        box-shadow: none;
                                        border: 1px solid #e0e0e0;
                                    }
                                        .addit-audio-item-options-dropdown > li,
                                        .user-options-container > #username-dropdown > li{
                                            padding: 5px 20px;
                                        }
                                            .user-options-container > #username-dropdown > li:hover{
                                                background-color: transparent;
                                            }
                                            .user-options-container > #username-dropdown .signout-btn{
                                                padding: 0px;

                                            }
                                                .addit-audio-item-options-dropdown > li > a,
                                                .user-options-container > #username-dropdown > li > a{
                                                    color: inherit;
                                                }
                                                .user-options-container > #username-dropdown .signout-btn,
                                                .user-options-container > #username-dropdown .signout-btn > i.material-icons{
                                                    color: inherit;
                                                }
                                                .user-options-container > .dropdown-trigger,
                                                .user-options-container > #username-dropdown .signout-btn{
                                                    background-color: transparent !important;
                                                }
                                                .user-options-container > .dropdown-trigger{
                                                    padding: 8px 10px 8px 20px;
                                                    border-radius: 25px;
                                                }
                                                    .app-header.prominent-search .user-options-container > .dropdown-trigger{
                                                        color: #FFFFFF;
                                                    }
                                            .user-options-container > #username-dropdown .signout-btn > i{
                                                margin-right: 20px;
                                            }
                                body[data-device="desktop"][data-active-search="true"] .app-header .user-options-container,
                                body[data-device="desktop"] #username-container,
                                body[data-device="desktop"] #username-container+.divider-container{
                                    display: none;
                                }
                                .app-header .user-options-container {
                                    position: absolute;
                                    bottom: 0px;
                                    right: 0px;
                                    top: 0px;
                                    padding: 10px 15px;
                                }
                                    /*.app-header .user-options-container .username {*/
                                    /*    color: rgba(0,0,0,0.87);*/
                                    /*}*/
                                    /*.app-header .user-options-container .username:hover+i.material-icons {*/
                                    /*    color: inherit;*/
                                    /*}*/
                            }

                            .app-navigation li.nav-option:not(.user-options-container):active,
                            .app-navigation li.nav-option.active{
                                background-color: transparent;
                                font-weight: bold;
                            }
                                body[data-device="desktop"] .app-navigation li.nav-option.active,
                                .app-navigation li.nav-option.active {
                                    opacity: 1.0;
                                }
                                body[data-device="desktop"] .app-navigation li.nav-option:not(.user-options-container):active,
                                body[data-device="desktop"] .app-navigation li.nav-option.active {
                                    color: #4a56ca;
                                    font-weight: 600;
                                }
                    .app-navigation .nav-icon i,
                    .app-navigation .nav-str{
                        height: auto;
                        line-height: 1em;
                    }
                        body[data-device="desktop"] .app-navigation .nav-icon i{
                            width: 24px;
                        }
                    .app-navigation .nav-str{
                        margin-top: 2px;
                        font-size: 0.9em;
                    }

    body[data-device="mobile"]:not([app-mode="search"]):not([app-mode="home"]) .app-view > #tag-feed-item-container{
        margin-bottom: 20px;
    }

    /*body[data-device="desktop"] .search-container #tag-feed-item-container{*/
    /*    display: none;*/
    /*}*/
#embed-modal,
#share-modal,
#follow-topic-modal,
#user-welcome-modal{
    /*margin-top: -127px;*/
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
    -ms-transform: translate(-50%, -50%) !important;
    -webkit-transform: translate(-50%, -50%) !important;
}
.pod-modal{
    box-shadow: none;
}
    .pod-modal .modal-header{
        padding: 10px 16px;
        color: #ffffff;
        /*background-color: #22cd9a;*/
    }
        #follow-topic-modal .modal-header {
            font-size: 1.4rem;
            padding: 14px 16px;
        }
            #follow-topic-modal .modal-header b{
                font-weight: 600;
            }
    .pod-modal .modal-content{
        padding: 0px;
    }
        #follow-topic-modal .modal-content {
            padding: 20px;
        }
        #user-welcome-modal .pod-modal-title{
            margin-right: 18px;
            margin-top: 0px;
        }
        #user-welcome-modal .modal-content {
            padding: 20px;
        }
            #user-welcome-modal .modal-content .welcome-modal-form-option {
                margin-bottom: 15px;
            }
            #follow-topic-modal .modal-content p{
                margin-top: 0px;
                margin-bottom: 20px;
                font-size: 1.1rem;
            }
                #follow-topic-modal .modal-graphic{
                    height: 100px;
                    width: 100px;
                    margin: 0 auto 20px;
                    border-radius: 50%;
                    background: #ccd0f9;
                    padding: 18px;
                    text-align: center;
                    overflow: hidden;
                    display: block;
                }
        .participant-result{
            padding: 18px 16px;
            border-bottom: 1px solid #ccc;
        }
            .participant-result:hover,
            .participant-result:active{
                background-color: #efefef;
            }
            #user-welcome-modal [type="checkbox"]+span:not(.lever):after,
            #user-welcome-modal [type="checkbox"]+span:not(.lever):before,
            #user-welcome-modal [type="checkbox"].filled-in:checked+span:not(.lever):after,
            #user-welcome-modal [type="checkbox"].filled-in:checked+span:not(.lever):before{
                top: 2px;
            }
        .pod-modal [type="checkbox"].filled-in:checked+span:not(.lever):after{
            /*aka bg color 2*/
            background-color: #556cd6;
            border-color: #556cd6;
        }
        .pod-modal [type="checkbox"]+span:not(.lever){
            height: auto;
            line-height: 1.5;

        }
            .pod-modal [type="checkbox"]+span:not(.lever),
            .pod-modal label,
            .pod-modal [type="checkbox"]{
                -webkit-tap-highlight-color: transparent;
            }
    #user-welcome-modal .modal-footer{
        padding: 0px 20px 18px;
        height: auto;
    }
        .pod-modal .pod-modal-footer-btn{
            margin: 0px;
            padding: 10px 14px;
            display: inline-block;
        }
            body[data-device="desktop"] .pod-modal .pod-modal-footer-btn.disabled:hover,
            body[data-device="mobile"] .pod-modal .pod-modal-footer-btn.disabled:active,
            .pod-modal .pod-modal-footer-btn.disabled{
                background-color: #DFDFDF !important;
                color: #9f9f9f !important;
            }
                .pod-modal .pod-modal-footer-btn.disabled:hover{
                    cursor: default;
                }
        .pod-btn.bg-color-2{
            color: #FFFFFF;
        }
@media only screen and (min-width: 600px) and (min-height: 500px) {
    .app-navigation .nav-str{
        font-size: 1.1em;
        margin-top: 0px;

    }
        .app-navigation li.nav-option:not([data-view="signin"]) .nav-str{
            margin-left: 20px;
            font-weight: 600;
        }
        .app-navigation .signout-btn .nav-str{
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }
    .pod-modal{
        max-width: 600px;
    }
        .participant-result:hover{
            cursor: pointer;
        }
}

.list-container{
    padding: 20px;
    /*overflow-y: auto;*/
}
    #category-list .list-container{
        padding: 0px;
    }
    .list-container-title{
        margin-top: 0px;
        margin-bottom: 20px;
    }
    .list-item{
        position: relative;
        height: 60vw;
        width: 100%;
        background-size: cover;
        background-position: center top;
        background-color: rgba(255,255,255,0.2);
        margin-bottom: 20px;
        border-radius: 4px;
        overflow: hidden;
        display: flex;
    }
        .list-item-name{
            z-index: 1;
            color: #FFF;
            font-size: 1.3em;
            line-height: 1.1em;
            position: relative;
            align-self: flex-end;
            text-align: center;
            width: 100%;
            padding: 10px;
        }
        .list-item-overlay{
            transition: opacity;
            position: absolute;
            top: 0px;
            bottom: 0px;
            left: 0px;
            right: 0px;
            /*background-color: rgba(0,0,0,0.4);*/
            background-image: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,0.4));
        }

            .list-item:active .list-item-overlay{
                opacity: 0;
                transition-delay: 0.3s;
            }



@media only screen and (min-width: 600px) and (min-height: 500px) {
    .list-container{
        padding: 25px 35px;
    }
        .list-item-container:not(.horizontal){
            display: flex;
            flex-wrap: wrap;
        }
            .list-item{
                width: 15vw;
                height: 15vw;
                min-width: 15vw;
                margin-right: 30px;
                margin-bottom: 30px;
            }
            .list-item:hover{
                cursor: pointer;
                box-shadow:  0px 4px 12px rgba(17, 51, 83, 0.3);
            }
            .list-item.episode:hover{
                box-shadow: none;
                /*border: 2px solid #4a56ca;*/
                border: 3px solid #8799f2;
                box-sizing: content-box;
                -webkit-box-sizing: content-box;
                margin: -3px 27px -3px -3px;
            }
            .list-item-overlay{
                background-image: linear-gradient(180deg, rgba(0,0,0,0) 51%, rgba(0,0,0,1.0));
            }
                .list-item.episode .list-item-name{
                    font-size: 1.2em;
                }
                .show .list-item-overlay,
                .person .list-item-overlay{
                    background-image: linear-gradient(180deg, rgba(0,0,0,0) 80%, rgba(0,0,0,1.0));
                }
}
.loading-error,
.is-loading-container,
.prompt-container{
    padding: 10px;
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 56px;
    top: 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
    .app-header ~ .loading-error,
    .app-header ~ .is-loading-container,
    .app-header ~ .prompt-container{
        top: 56px;
    }
    .prompt-container .prompt-content{
        text-align: center;
        flex-grow: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .loading-error-content{
        color: grey;
        text-align: center;
        font-size: 1.6em;
    }
        .error-icon-container > i.material-icons{
            font-size: 4em;
            margin-bottom: 15px;
        }
        .loading-error-message span {
            text-decoration: underline;
            color: #556cd6;
        }
            .loading-error-message span:hover{
                cursor: pointer;
            }
                .loading-error-message span:hover,
                .loading-error-message span:active{
                    color: #4a56ca;
                }
    .btn-container{
        display: flex;
        padding: 20px 0px;
        justify-content: center;
        align-items: center;
    }

    #signin-btn {
        text-transform: capitalize;
        padding: 15px 12px;
        /*color: #ffffff;*/
        border-radius: 3px;
        font-size: 1.3rem;
        width: 80vw;
        display: flex;
        align-items: center;
        justify-content: center;
    }
        #signin-btn > svg.btn-icon{
            width: 20px;
            height: 20px;
            margin-right: 5px;
        }
    @media only screen and (min-width: 600px) and (min-height: 500px) {
        .is-loading-container,
        .prompt-container {
            top: 0px;
            left: 260px;
        }
        .prompt-container .prompt-content {
            flex-grow: 0;
        }
            #signin-btn{
                width: 400px;
                /*box-shadow: 0px 1px 5px rgba(0,0,0,0.25);*/
                /*font-size: 1.2em;*/
            }
                #signin-btn:hover{
                    /*box-shadow: 0px 3px 5px rgba(0,0,0,0.25);*/
                    cursor: pointer;
                }
    }
    /*body[app-mode="signin"] .is-loading-container,*/
    /*body[data-is-authorized="true"] .is-loading-container{*/
        /*display: none;*/
    /*}*/
        .is-loading-container{
            top: 0px;
            bottom: 56px;
        }
            .is-loading-container > h5{
                color: #455a64;
            }
            .is-loading-container .progress{
                width: 80vw;
            }
            .dev-badge{
                background-color: #e64444;
                color: white;
                padding: 3px 4px 2px;
                border-radius: 10px;
                text-align: center;
                font-weight: bold;
                transform: rotate(28deg);
                display: inline-block;
                line-height: 1em;
                position: relative;
                top: -23px;
                left: -10px;
                text-transform: uppercase;
            }
            .badge.new-feat-badge {
                position: absolute;
                top: -6px;
                right: -15px;
                color: #FFFFFF;
                background-color: #e64444;
                font-size: 0.8rem;
                font-weight: 600;
                display: inline;
                text-transform: uppercase;
                padding: 5px 8px;
                border-radius: 18px;
                line-height: 1em;
            }
                .promo-card .badge.new-feat-badge {
                    top: -14px;
                    right: -32px;
                }
    .error-message{
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px;
        font-size: 1.6em;
        flex-direction: column;
        color: grey;
        margin-top: 80px;
    }
        .error-message > i.material-icons{
            font-size: 3em;
            margin-bottom: 20px;
        }
    .share-modal{
        width: 620px;
        max-height: 610px;
        height: auto;
        margin: 0 auto;
        /*top: calc(50% - 205px) !important;*/
    }
        .share-url-container{
            display: flex;
        }
            #share-modal .modal-close {
                position: absolute;
                top: 7px;
                right: 0px;
                color: rgba(0,0,0,0.8);
            }
                #share-modal .modal-close:hover{
                    color: rgb(0,0,0);
                }
            .share-url-container > input{
                flex-grow: 1;

            }
                .share-url-container #share-url:focus{
                    box-shadow: none;
                }
        .share-modal .modal-title {
            font-size: .7em;
            margin-bottom: 20px;
            font-weight: 600;
        }
        .share-modal .item-title{
            line-height: 1.4em;
            font-size: 0.9em;
        }
        .share-action-container{
            display: flex;
            margin: 30px 0px 20px;
        }
            .share-action[data-type="copy"]{
                margin-left: 10px;
            }
            .share-action{
                text-align: center;
                margin-right: 10px;
                padding: 10px;
                opacity: 0.8;
            }
                .share-action:hover{
                    cursor: pointer;
                    opacity: 1.0;
                }
                .share-action-title{
                    font-size: 0.8em;
                    margin: 5px 0px 0px;
                    white-space: nowrap;
                }
                    #copy-target{
                        text-transform: capitalize;
                    }
                .share-action-container .share-action > i{
                    padding: 15px;
                    border-radius: 50%;
                    color: #fff;
                    font-size: 1.6em;
                    width: 54px;
                    height: 54px;
                    display: inline-block;
                }
                    .share-action[data-type="gmail"] > i{
                        background-color: #f98585;
                        /*border: 1px solid rgba(0,0,0,0.15);*/
                        padding: 13px;
                    }
                    .share-action[data-type="email"] > i{
                        background-color: #1a35f9;
                    }
                    .share-action[data-type="twitter"] > i{
                        background-color: rgb(29, 161, 242);
                    }
                    .share-action[data-type="facebook"] > i{
                        background-color: #4867aa;
                    }
                    .share-action[data-type="whatsapp"] > i{
                        background-color: #1ebea5;
                    }
                    .share-action[data-type="reddit"] > i{
                        background-color: #ff4500;
                    }
                        .share-action[data-type="reddit"] > i > svg{
                            fill: #FFFFFF;
                        }
                    .share-action[data-type="embed"] i.material-icons {
                        background-color: #1b1b1b;
                    }
/*note: recommended hover pseudo selectors for hover only devices (aka non-touch)*/
@media(hover: hover) and (pointer: fine) {
    /*.moment-content-container:hover{*/
    /*    background-color: #e8fff7;*/
    /*}*/
        .moment-container.full .moment-content-container:hover:after,
        .moment-content-container:hover:after{
            border-top-color: #e8fff7;
        }
        .moment-container .clip-title:hover{
            text-decoration: underline;
        }
    .clip-container:hover .is-playable-indicator{
        display: block;
        position: absolute;
        right: auto;
        left: -67px;
        top: 50%;
        margin-top:  -27px;
        padding: 10px;
        border-radius: 50%;
        color: rgba(21, 101, 192, 0.7);
        border: 2px solid rgba(21, 101, 192, 0.7);
    }
        .clip-container .is-playable-indicator:hover{
            cursor: pointer;
            color: #1f87e5;
            border-color: #1f87e5;
        }
        .full-tags-expand-btn:hover,
        .tag:hover {
            cursor: pointer;
            color: #FFFFFF;
        }
}



/*START skeleton screen CSS*/
.clip-container.pod-loading{
    position: relative;
    overflow: hidden;
}

.clip-container.pod-loading ~ .list-header,
.clip-container.pod-loading ~ .list-item-container,
.clip-container.pod-loading ~ .clip-container:not(.pod-loading),
.clip-container.pod-loading ~ .feed-info-header{
    display: none;
}
.pod-loading .clip-title,
.pod-loading .episode-title,
.pod-loading .card-image {
    background-color: #E2E2E2;
    overflow: hidden;
}
.pod-loading.card-image {
    border-radius: 0;
}

.pod-loading .clip-title::after,
.pod-loading .episode-title::after,
.pod-loading .card-image::after {
    /*.pod-loading::after{*/
    display: block;
    content: '';
    position: relative;
    /*transform: translateX(-80vw);*/
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent, transparent);
    animation: ui-loading 1s infinite 0s;
}

.mobile-ios .pod-loading .clip-title::after,
.mobile-ios .pod-loading .episode-title::after,
.mobile-ios .pod-loading .card-image::after {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .05), transparent, transparent);
}

@keyframes ui-loading {
    100% {
        transform: translateX(90vw);
    }
}

.pod-loading .clip-title,
.pod-loading .clip-title::after,
.pod-loading .episode-title::after,
.pod-loading .episode-title{
    height: 1.2em;
}

.clip-container.pod-loading .card-image{
    margin-left: 15px !important;
}

body[app-mode="episode"] .clip-container.pod-loading .card-image{
    margin-left: 0px !important;
    margin-right: 15px !important;
}

.pod-loading .card-image::after,
.pod-loading .card-image{
    height: 90px;
    min-width: 90px;
}
.pod-loading .episode-title{
    display: block;
    width: 100%;
}
.pod-loading .card-content .card-title{
    margin-bottom: 11px;
}

/*body[is-admin=true] .admin-debug-info{*/
    /*display: block;*/
/*}*/
.admin-debug-info{
    display: none;
    position: fixed;
    top: 0px;
    left: auto;
    right: 40px;
    padding: 5px 8px;
    color: #fff;
    z-index: 5;
}
/*END skeleton screen CSS*/

/*materialize overrides*/
.sidenav.sidenav-fixed{
    transform: none;
}
    body[data-device="desktop"] .sidenav.sidenav-fixed{
        display: flex;
        flex-direction: column;
    }
    .nav-option.waves-effect{
        -webkit-transition: all 100ms ease-out;
        transition: all 100ms ease-out;
    }
    .nav-option.waves-effect .waves-ripple{
        -webkit-transition: all 100ms ease-out;
        transition: all 100ms ease-out;
    }
/*materialize overrides*/
#sign-out-modal{
    top: 50% !important;
    max-width: 360px;
    margin-top: -45px;
}
    #sign-out-modal .modal-content{
        text-align: center;
        padding: 30px 24px;
    }
        .signout-content{
            font-size: 1.4rem;
        }

.continue-playing-prompt {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0,0,0,0.65);
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 999;
}
    .continue-playing-actions-container {
        padding: 14px 10px;
        position: relative;
    }
        .continue-playing-action {
            color: #FFF;
            border: 1px solid #FFFFFF;
            border-radius: 3px;
            padding: 13px 4px;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 1.1em;
        }
            .continue-playing-action:active {
                background-color: #FFF;
                color: #000000;
            }
            @media only screen and (min-width: 600px) and (min-height: 500px) {
                .continue-playing-action {
                    margin: 0 auto;
                    max-width: 600px;
                }
                /*only want the :hover pseudo class on desktop*/
                .continue-playing-action:hover {
                    cursor: pointer;
                    background-color: #FFF;
                    color: #000000;
                }
            }
            .continue-playing-action > i{
                margin-right: 8px
            }
    .close-prompt-container {
        color: #ffffff;
        /* display: flex; */
        position: absolute;
        /* justify-content: flex-end; */
        top: 6px;
        right: 6px;
    }
        #close-prompt {
            color: #FFFFFF;
            display: flex;
            justify-content: flex-end;
            padding: 5px 0px;
        }
            #close-prompt:active{
                opacity: 0.75;
            }
            @media only screen and (min-width: 600px) and (min-height: 500px) {
                /*only want the :hover pseudo class on desktop and up*/
                #close-prompt:hover{
                    cursor: pointer;
                    opacity: 0.75;
                }
            }
    .beta-access-prompt {
        align-self: flex-end;
        justify-self: flex-end;
        color: #FFF;
        top: 5vh;
        position: fixed;
        padding: 15px 10px;
        text-align: center;
        bottom: 0px;
        top: auto;
        font-size: 1.1rem;
        width: 100vw;
    }
    #playback-speed-modal{
        -webkit-tap-highlight-color: transparent;
    }
        #playback-speed-modal .modal-header{
            text-align: center;
        }
        #playback-speed-modal .modal-content{
            height: calc(100% - 110px);
            display: flex;
            justify-content: center;
            align-items: center;
        }
            .setting-container {
                padding: 16px 16px;
                display: flex;
                justify-content: center;
            }
                .setting-title{
                    display: none;
                    flex-grow: 1;
                }
                .setting-action {

                }
                div#playback-spd {
                    text-align: center;
                }
                .setting-value-container {
                    /*border: 1px solid #cccccc;*/
                    border-radius: 10px;
                    padding: 8px 18px;
                    margin: 15px 0px;
                }
                .setting-title,
                .setting-value-container{
                    font-size: 3.6em;
                }
                    .setting-value-container span.current-playback-spd-value {
                        margin-right: 3px;
                    }
                        .secondary-player-controls span.current-playback-spd-value,
                        .minimized-action span.current-playback-spd-value {
                            min-width: 32px;
                            display: inline-block;
                            text-transform: none;
                        }
                    .setting-action-btn {
                        border: 2px solid #cccccc;
                        border-radius: 50%;
                        display: inline-block;
                        line-height: 62px;
                        text-align: center;
                        font-size: 4em;
                        width: 66px;
                    }
                        .setting-action:hover{
                            cursor: pointer;
                        }
                        .setting-action-btn:active{
                            opacity: 0.6;
                        }
                        .setting-action-btn > i {
                            font-style: normal;
                            font-weight: 300;
                            position: relative;
                            top: -4px;
                            line-height: 62px;
                        }

                            @media only screen and (min-width: 600px) and (min-height: 500px) {
                                .setting-action-btn:hover{
                                    opacity: 0.6;
                                }
                                #increase-spd.setting-action-btn > i {
                                    top: 0px;
                                }
                            }
     /*KL trying to make all*/
    .modal .modal-close {
        font-weight: 500;
    }
        .pod-modal-close-btn {
            position: absolute;
            top: 12px;
            right: 12px;
            padding: 4px;
        }
            .modal-header.bg-color-3 .pod-modal-close-btn {
                color: #FFFFFF;
            }
            body[data-device="desktop"] .pod-modal-close-btn:hover {
                cursor: pointer;
            }
            body[data-device="mobile"] .pod-modal-close-btn:active,
            body[data-device="desktop"] .pod-modal-close-btn:hover {
                opacity: 0.75;
            }
    /*discovery page styling*/
    .search-container{
        /*padding: 15px 0px;*/
        padding: 10px 0px;
    }
        .search-container.light {
            padding-top: 20px;
        }
        /*body[data-device="mobile"]:not([data-active-search="true"]):not([prev-app-mode=""]) .search-container{*/
        /*    padding-top: 22px;*/
        /*}*/
        .app-header .search-container {
            display: none;
        }
    /*body[data-device="desktop"] .search-container{*/
    /*    margin-left: 122px;*/
    /*}*/
        body[data-device="desktop"] .app-header .search-container{
            display: block;
            position: absolute;
            top: 0px;
            left: 259px;
            padding: 8px 0px;
            -moz-transition: left 200ms linear;
            -o-transition: left 200ms linear;
            -webkit-transition: left 200ms linear;
            transition: left 200ms linear;
        }

            body[data-device="desktop"][data-active-search="true"] .search-container {
                left: calc(25vw - 17.5px);
                /*margin-left: 0px;*/
            }
            body[data-device="desktop"] .app-header .help-container{
                display: none;
            }
            #user-menu-btn{
                position: absolute;
                top: 5px;
                padding: 10px;
                right: 5px;
                border-radius: 50%;
            }
                #user-menu-btn > i.material-icons.mi-menu{
                    color: #ffffff;
                }
                    #user-menu-btn > i.material-icons.mi-menu:before {
                        content: "menu";
                    }
                body[app-mode="clip"] .app-header > #user-menu-btn{
                    display: none;
                }
            ul#user-menu-slide-out{
                padding: 10px 0px;
                bottom: 0px;
                height: auto;
                display: flex;
                flex-direction: column;
            }
                body[data-OS="AndroidOS"] li#beta-access-link {
                    display: none;
                }
                #user-menu-slide-out > li > a.user-menu-slideout-opt {
                    color: #FFFFFF !important;
                    font-size: 1.3rem;
                    text-align: left;
                    padding: 20px 25px;
                    line-height: 1;
                    height: auto;
                }
                    #user-menu-slide-out > li > a#username:hover{
                        background-color: transparent;
                    }
                    #user-menu-slide-out > li > a#username {
                        font-size: 1.1rem;
                    }
                    #username-container{
                        margin-top: auto;
                    }
                    body[data-is-authorized="false"] #username-container,
                    body[data-is-authorized="false"] #username-container+li.divider-container,
                    body[data-device="desktop"] #signin-nav-option,
                    body[data-device="desktop"] #signin-nav-option+li.divider-container,
                    body[data-is-authorized="true"] #signin-nav-option,
                    body[data-is-authorized="true"] #signin-nav-option+li.divider-container,
                    body[data-is-authorized="false"] #signout-nav-option{
                        display: none;
                    }
    /*body[data-device="mobile"]:not([app-mode="active-search"]) .search-container{*/
    /*    margin-top: 10px;*/
    /*}*/
    body[data-device="mobile"][data-active-search="true"] .search-container{
        border-bottom: 1px solid #cccccc;
    }
        body[data-device="mobile"][data-active-search="true"][data-discovery-redesign="true"] .search-container {
            background-color: #FFFFFF;
            border-bottom-color: #f2f2f2;
        }
        body[data-discovery-redesign="true"][data-active-search="true"][data-discovery-redesign="true"] .search-container {
            padding-top: 21px;
            padding-bottom: 2px;
        }
        body[data-device="mobile"][data-active-search="true"] .search-container~*,
        body[data-device="mobile"][data-active-search="true"] .app-footer .app-navigation.mobile{
            display: none !important;
        }
        .search-container > row{
            margin-bottom: 0px;
        }
            .search-container .input-field {
                padding-left: 0px;
                padding-right: 0px;
            }
                .search-container span.algolia-autocomplete {
                    width: 100vw;
                }
                    .search-inner-container {
                        display: flex;
                        align-items: center;
                        padding: 0px 10px 0px 5px;
                        margin: 0px 15px;
                    }
                        body[data-device="mobile"][data-active-search="true"] .search-inner-container {
                            margin-left: 0px;
                        }
                        body[data-device="mobile"][data-active-search="true"][data-discovery-redesign="true"] .search-inner-container {
                            border: 0px;
                        }
                        body[data-discovery-redesign="true"][data-active-search="true"] .search-inner-container {
                            margin-left: 26px;
                            padding-left: 0px;
                        }
                        body[data-active-search="false"] .search-inner-container{
                            border-radius: 21px;
                        }
                        body[data-active-search="false"] .search-inner-container,
                        body[data-device="desktop"] .search-inner-container{
                            background-color: rgba(0, 0, 0, 0.04);
                            align-items: center;
                        }
                            .search-container.light .search-inner-container{
                                background-color: #FFFFFF;
                                border:1px solid #e0e0e0;
                                margin-left: 20px;
                                margin-right: 20px;
                            }
                        body[data-device="desktop"] .search-inner-container {
                            border-radius: 10px;
                            background-color: #f1f3f4;
                            /*width: 70vw;*/
                            width: 50vw;
                            min-width: 400px;
                            padding-right: 49px;/*don't want the dropdown to overhang.  This needs to be the distance from the left side of the search container to where the cursor begins*/
                            margin-left: 35px;
                            margin-right: 35px;
                            border: 1px solid transparent;
                            padding-top: 5px;
                            padding-bottom: 5px;
                        }
                            body[data-device="desktop"] .search-container[input-focus-state="focus"] .search-inner-container {
                                background-color: white;
                                border-color: #e0e0e0;
                            }
                            body[data-device="desktop"][data-active-search="true"] .search-container.results-available .search-inner-container {
                                border-radius: 10px 10px 0px 0px;
                            }
                            body[data-device="desktop"] .search-container .aa-dropdown-menu{
                                border-radius: 0px 0px 10px 10px;
                            }
                        .search-inner-container #search-input{
                            flex-grow: 1;
                            border: 0px;
                            box-shadow: none;
                            margin-bottom: 0px;
                            font-size: 1.3em;
                        }
                            body[data-device="desktop"] .search-inner-container #search-input{
                                height: 38px;
                            }
                                body[data-device="desktop"] .search-inner-container #search-input,
                                body[data-device="desktop"] .search-container .result {
                                    font-size: 1.1em;
                                }
                            .search-inner-container #search-input::placeholder{
                                color: #bababa;
                            }
                                body[data-device="desktop"] .search-inner-container #search-input::placeholder{
                                    color: #9aa0a6;
                                }
                        .search-inner-container .search-icon{
                            padding: 5px;
                            border-radius: 50%;
                        }
                            body[data-device="mobile"][data-active-search="true"] .search-inner-container .search-icon {
                                /*position: relative;*/
                                /*left: -2px;*/
                                /*margin-right: 3px;*/
                            }
                            /*body[data-device="desktop"][data-active-search="false"] .search-inner-container .search-icon{*/
                            /*    color: #FFFFFF;*/
                            /*}*/
                            body[data-device="mobile"][data-active-search="true"] .search-inner-container .search-icon:active,
                            body[data-device="mobile"][data-active-search="true"] .search-inner-container .search-icon:hover{
                                cursor: pointer;
                                background-color: rgba(0,0,0,0.1);
                            }
                        .search-inner-container .search-icon:first-of-type{
                            margin-right: 8px;
                            padding-right: 5px;
                        }
                            body[data-device="desktop"] .search-inner-container .search-icon:first-of-type{
                                width: 34px;
                            }
                        .search-inner-container .search-icon:last-of-type{
                            margin-left: 5px;
                            padding-left: 5px;
                        }
                        .search-inner-container .clear-input-btn{
                            z-index: 1;
                        }
                        .search-container[query-length="0"] .clear-input-btn,
                        body[data-device="desktop"] .search-container .clear-input-btn{
                            display: none;
                        }
                        .search-container .aa-dropdown-menu{
                            background-color: #ffffff;
                            top: calc(100% + 1px) !important;
                        }
                            body[data-device="mobile"] .search-container .aa-dropdown-menu{
                                width: 100vw;
                                /*top: 73px !important;*/
                                /*top: 63px !important;*/
                            }
                            body[data-device="desktop"] .search-container .aa-dropdown-menu{
                                text-align: left;
                                min-width: 400px;
                                border: 1px solid #e0e0e0;
                                border-top-width: 0px;
                                left: -1px !important;
                                right: -1px !important;
                                max-height: 88vh;
                                overflow-y: auto;
                            }
                                /*as of 082820 the moments results increase is specific to admins only*/
                                body[is-admin="true"] .aa-dataset-moments .aa-suggestions,
                                body[data-device="desktop"] .aa-dataset-clips .aa-suggestions{
                                    overflow-y: scroll;
                                    max-height: 284px;
                                }
                                    /*body[data-device="desktop"] .search-container .aa-dropdown-menu::-webkit-scrollbar {*/
                                    /*    width: 4px;*/
                                    /*    display: none;*/
                                    /*}*/
                                    body[is-admin="true"] .aa-dataset-moments .aa-suggestions::-webkit-scrollbar,
                                    body[data-device="desktop"] .aa-dataset-clips .aa-suggestions::-webkit-scrollbar {
                                        -webkit-appearance: none;
                                        width: 4px;
                                    }
                                    body[is-admin="true"] .aa-dataset-moments .aa-suggestions::-webkit-scrollbar-thumb,
                                    body[data-device="desktop"] .search-container .aa-dropdown-menu::-webkit-scrollbar-thumb,
                                    body[data-device="desktop"] .aa-dataset-clips .aa-suggestions::-webkit-scrollbar-thumb{
                                        width: 4px !important;
                                        border-radius: 2px;
                                        background-color: #9f9f9f;
                                    }
                                body[data-device="desktop"][data-active-search="false"] .search-container .aa-dropdown-menu{
                                    display: none !important;
                                }
                            .search-container .aa-dropdown-menu > .aa-dataset-topics > .aa-suggestions{
                                padding: 8px;
                            }
                                body[data-device="desktop"] .search-container .aa-dropdown-menu > .aa-dataset-topics{
                                    /*padding: 14px;*/
                                    margin-top: 8px;
                                }
                                body[data-device="mobile"] .aa-dataset-topics {
                                    max-height: 6em;
                                    overflow: hidden;
                                    overflow-x: auto;
                                    white-space: nowrap;
                                }
                                /*.search-container .aa-dropdown-menu > .aa-dataset-topics > .aa-suggestions:first-of-type{*/
                                /*    padding-bottom: 0px;*/
                                /*    margin-bottom: -5px;*/
                                /*}*/
                                .search-container .aa-dropdown-menu > .aa-dataset-topics > .aa-suggestions .aa-suggestion{
                                    display: inline-block;
                                    vertical-align: top;
                                    margin-right: 8px;
                                    margin-bottom: 0px;
                                }
                                body[data-device="desktop"] .search-container .aa-dropdown-menu > .aa-dataset-topics > .aa-suggestions .aa-suggestion{
                                    margin-bottom: 8px;
                                }
                                .search-container .result.tag{
                                    border: 1px solid transparent;
                                    padding: 5px 8px;
                                    border-radius: 6px;
                                    margin: 0px;
                                }
                                    body[data-device="desktop"] .search-container .result.tag{
                                        font-size: 13px;
                                    }
                                        .search-container .result.tag i.material-icons {
                                            font-size: 1.3em;
                                            margin-right: 4px;
                                            vertical-align: middle;
                                        }
                                    /*body[data-device="mobile"] .search-container .result[result-type="topics"]:active{*/
                                    /*    background-color: #CCCCCC;*/
                                    /*}*/
                        .search-container .result-header,
                        .search-container .result{
                            padding: 14px;
                        }
                        .search-container .result-header{
                            text-transform: uppercase;
                            border-bottom: 1px solid #e0e0e0;
                            padding: 8px;
                            display: flex;
                            justify-content: space-between;
                        }
                            .view-all-clips{
                                text-transform: none;
                                text-decoration: underline;
                            }
                                .view-all-clips:hover{
                                    cursor: pointer;
                                }
                        .search-container .result{
                            font-size: 1.1em;
                            padding: 10px;
                        }
                            body[data-device="desktop"] .search-container .result-header,
                            body[data-device="desktop"] .search-container .result:not(.tag){
                                padding: 14px;
                            }
                            body[data-device="mobile"] .search-container .result:not(.tag):active,
                            body:not([data-device="mobile"]) .search-container .result:not(.tag).active,
                            body:not([data-device="mobile"]) .search-container .result:not(.tag):hover{
                                cursor: pointer;
                                background-color: rgba(0,0,0,0.05);
                            }
                            body[data-device="desktop"] .search-container .result[result-type = "moments"] .episode-title,
                            .search-container .result[result-type = "clips"] .episode-title,
                            .search-container .result[result-type = "episodes"] .pod-title{
                                font-size: 0.8em;
                            }
                                body[data-device="desktop"] .search-container .result[result-type = "moments"] .episode-title,
                                body[data-device="desktop"] .search-container .result[result-type = "clips"] .episode-title{
                                    text-overflow: ellipsis;
                                    overflow: hidden;
                                    white-space: nowrap;
                                }
                            .search-container .result .result-secondary-str{
                                white-space: nowrap;
                                text-align: right;
                                line-height: 1.4em;
                                font-size: 0.9em;
                            }
                            body[data-device="desktop"] .search-container .result .result-secondary-str{
                                /*font-size: 1.1em;*/
                                line-height: 1.8em;
                            }
                        .search-container .result em{
                            font-style: normal;
                            font-weight: bold;
                        }
                            .search-container .result:not([result-type="topics"]){
                                display: flex;
                            }
                            .search-container .result[result-type="people"]{
                                align-items: center;
                            }
                                .search-container .result[result-type="people"] .result-thumbnail,
                                .search-container .result-thumbnail > img{
                                    width: 42px;
                                    height: 42px;
                                }
                                .search-container .result[result-type="people"] .result-thumbnail{
                                    background-size: cover;
                                    background-position: center top;
                                    color: white;
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    border-radius: 50%
                                }
                                .search-container .result-content{
                                    display: flex;
                                    flex-grow: 1;
                                }
                                    .search-container .result-content > .result-str,
                                    .search-container .result-thumbnail{
                                        margin-right: 10px;
                                    }
                                    .search-container .result-content > .result-str{
                                        color: #000;
                                        flex-grow: 1;
                                        margin-right: 8px;
                                    }
                                        body[data-device="desktop"] .search-container .result-content,
                                        body[data-device="desktop"] .search-container .result-content > .result-str{
                                            min-width: 0;
                                        }
                                        body[data-device="mobile"] .search-container .result-content > .result-str{
                                            line-height: 1.3em;
                                            max-height: 2.6em;
                                            text-overflow: ellipsis;
                                            overflow: hidden;
                                            display: -webkit-box;
                                            -webkit-line-clamp: 2;
                                            -webkit-box-orient: vertical;
                                        }
                    .spinner-container{
                        position: fixed;
                        top: 0px;
                        left: 0px;
                        right: 0px;
                        bottom: 0px;
                        background-color: rgba(0,0,0,0.5);
                        z-index: 10;
                        display: flex;
                        flex-direction: column;
                        justify-content: center;
                        align-items: center;
                    }
                        .embed-preview-container .spinner-container{
                            position: absolute;
                        }
                /*.search-container label[for="search-input"]{*/
                /*    display: flex;*/
                /*    align-items: center;*/
                /*    left: 0px;*/
                /*    font-size: 1.2em;*/
                /*}*/
                /*    label[for="search-input"] > i.material-icons{*/
                /*        margin-right: 6px;*/
                /*    }*/
        .search-container .result.tag,
        .tag-feed-item.pill{
            padding: 6px 10px;
        }
        #header-signin-btn,
        .pod-btn,
        /*body[data-device="desktop"] .tag-feed-item.list-nav-item,*/
        .tag-feed-item.pill {
            width: auto;
            height: auto;
            line-height: 1.0em;
            /*border-radius: 18px;*/
            border-radius: 6px;
            border: 1px solid #e0e0e0;
            color: #4a4a4a;
        }
            body[data-device="desktop"] .pod-btn:not(.holo-btn),
            body[data-device="desktop"] #header-signin-btn,
            /*body[data-device="desktop"] .tag-feed-item.list-nav-item,*/
            body[data-device="desktop"] .tag-feed-item.pill {
                background-color: #FFFFFF;
            }
                /*body[data-device="desktop"] .tag-feed-item.pill {*/
                /*    border-width: 2px;*/
                /*}*/
            body[data-device="desktop"] .pod-btn:hover{
                cursor: pointer;
            }
            .search-container .tag-feed-item.pill{
                margin-bottom: 12px;
            }
            body[data-device="mobile"] .pod-btn:not(.holo-btn):active,
            body[data-device="desktop"] .pod-btn:not(.holo-btn):hover,
            body[data-device="mobile"] #header-signin-btn:active,
            body[data-device="desktop"] #header-signin-btn:not(.light):hover,
            body[data-device="mobile"] .tag-feed-item.pill:active{
            /*body[data-device="desktop"] .tag-feed-item.pill:hover{*/
                background-color: rgba(0,0,0,0.07);
            }
                body[data-device="desktop"] #header-signin-btn.light:hover{
                    background-color: #e9e9e9;
                }

            body[data-device="mobile"] .holo-btn:active,
            body[data-device="desktop"] .holo-btn:hover{
                background-color: #ffffff;
            }

            .pod-btn > .btn-str{
                font-weight: 500;
            }

            /*.tag-feed-item.list-nav-item[data-tag-id="startups"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="startups"] i.material-icons{
                color: #1565c0 !important;
                border-color: #1565c0 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="education"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="education"] i.material-icons{
                /*color: #ff5722 !important;*/
                /*border-color: #ff5722 !important;*/
                color: #1de9b6 !important;
                border-color: #1de9b6 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="sleep"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="sleep"] i.material-icons{
                color: #ba68c8 !important;
                border-color: #ba68c8 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="meditation"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="meditation"] i.material-icons{
                color: #40c4ff !important;
                border-color: #40c4ff !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="investing"].active i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="investing"] i.material-icons{
                /*color: #ffa000 !important;*/
                /*border-color: #ffa000 !important;*/
                color: #2e7d32 !important;
                border-color: #2e7d32 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="social-media"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="social-media"] i.material-icons{
                color: #00bfa5 !important;
                border-color: #00bfa5 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="exercise"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="exercise"] i.material-icons{
                /*color: #1de9b6 !important;*/
                /*border-color: #1de9b6 !important;*/
                color: #ff5722 !important;
                border-color: #ff5722 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="exercise"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="crypto"] i.material-icons{
                /*color: #1de9b6 !important;*/
                /*border-color: #1de9b6 !important;*/
                color: #0d47a1 !important;
                border-color: #0d47a1 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="government"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="government"] i.material-icons{
                color: #546e7a !important;
                border-color: #546e7a !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="diet"] i.material-icons,*/
            body[data-discovery-redesign="true"] .tag-feed-item.pill[data-tag-id="diet"] i.material-icons{
                color: #ffa000 !important;
                border-color: #ffa000 !important;
                /*color: #2e7d32 !important;*/
                /*border-color: #2e7d32 !important;*/
            }
            .tag-feed-item.pill:not(:active):not(:hover) {
                color: rgba(0, 0, 0, 0.75);
            }


            /*.tag-feed-item.list-nav-item[data-tag-id="startups"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="startups"] i.material-icons{
                color: #00bfa5 !important;
                border-color: #00bfa5 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="education"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="education"] i.material-icons{
                color: #1565c0 !important;
                border-color: #1565c0 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="sleep"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="sleep"] i.material-icons{
                color: #ba68c8 !important;
                border-color: #ba68c8 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="meditation"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="meditation"] i.material-icons{
                color: #40c4ff !important;
                border-color: #40c4ff !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="investing"].active i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="investing"] i.material-icons{
                color: #2e7d32 !important;
                border-color: #2e7d32 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="social-media"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="social-media"] i.material-icons{
                color: #ff5722 !important;
                border-color: #ff5722 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="exercise"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="exercise"] i.material-icons{
                color: #1de9b6 !important;
                border-color: #1de9b6 !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="government"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="government"] i.material-icons{
                color: #546e7a !important;
                border-color: #546e7a !important;
            }
            /*.tag-feed-item.list-nav-item[data-tag-id="diet"] i.material-icons,*/
            .tag-feed-item.pill[data-tag-id="diet"] i.material-icons{
                color: #ffa000 !important;
                border-color: #ffa000 !important;
            }

            .pill .tag-feed-item-inner div{
                display: flex;
                align-items: center;
            }
                .pill.rnd .tag-feed-item-inner div{
                    flex-direction: column;
                    font-weight: 600;
                }
                .search-container .result.tag,
                .pill .tag-name {
                    /*font-size: 0.9em;*/
                    font-size: 1em;
                    line-height: 1.3em;
                }
                .pill .tag-name{
                    margin-top: 0px;
                    font-weight: 700;
                }
                    body[data-device="desktop"] #header-signin-btn .btn-str,
                    body[data-device="desktop"] .pill .tag-name{
                        font-weight: 600;
                    }

                .pill .tag-feed-item-inner i.material-icons{
                    font-size: 1.3em;
                }
                    .rnd.pill .tag-feed-item-inner div > .material-icons {
                        margin-bottom: 10px;
                        margin-right: 0px;
                        background-color: #FFFFFF;
                        border-radius: 50%;
                        padding: 4px;
                        font-size: 1.3em;
                        width: 26px;
                    }
                    .share-btn > i.material-icons,
                    #username-caret{
                        width: 24px;
                        height: 24px;
                    }
                    .clip-action-btn > i.material-icons{
                        height: 22px;
                        width: 22px;
                    }
                    .moment-container:not(.full) .moment-content > i.material-icons,
                    .moment-container:not(.full) .moment-content > .last-word-wrapper i.material-icons,
                    .tag-feed-item-inner > i.material-icons{
                        width: 19px;
                        height: 19px;
                    }
                .pill .tag-name.center-align {
                    display: inline-block;
                }
                .pill i.material-icons {
                    margin-right: 4px;
                }

            div#signin-modal {
                margin-top: -106px;
                background-color: #FFFFFF;
            }
                body[data-device="desktop"] #signin-modal{
                    max-width: 540px;
                }
            div#signin-modal-close-btn {
                position: absolute;
                padding: 8px;
                top: 0px;
                right: 0px;
            }
                div#signin-modal-close-btn:focus{
                    outline: 0px;
                    border: 0px;
                }
                div#notif-permission-request-close-btn i.material-icons,
                #signin-modal-close-btn i.material-icons {
                    font-size: 1.2rem;
                    opacity: 0.4;
                }
                    body[data-device="desktop"] div#notif-permission-request-close-btn:hover i.material-icons,
                    body[data-device="desktop"] div#signin-modal-close-btn:hover i.material-icons,
                    div#signin-modal-close-btn:active i.material-icons{
                        opacity: 0.8;
                    }
            div#modal-signin-btn {
                /* display: inline-block; */
                padding: 8px 16px 8px 10px;
                border-radius: 4px;
                margin: 0 auto;
                font-size: 1.1rem;
                display: flex;
                align-items: center;
            }
                #modal-signin-btn.follow-topic-signin-btn {
                    color: #FFFFFF;
                    padding: 16px;
                    justify-content: center;
                }
                    body[data-device="desktop"] #modal-signin-btn.follow-topic-signin-btn {
                        max-width: 250px;
                    }
                div#modal-signin-btn .btn-icon{
                    /*background-image:url('/web-assets/assets/goog-logo.png');*/
                    background-position: center;
                    background-repeat: no-repeat;
                    border-radius: 50%;
                    margin: 7px 9px 7px 7px;
                }
                    div#modal-signin-btn img{
                        margin-right: 4px;
                        border-radius: 50%;
                    }
            #notif-permission-request-modal .modal-content,
            #signin-modal .modal-content {
                padding: 30px 16px 42px;
                display: flex;
                flex-direction: column;
                justify-content: center;
            }
            #notif-permission-request-modal .modal-content p,
            #signin-modal .modal-content p {
                font-size: 1.2rem;
                text-align: center;
                margin-bottom:24px;
            }
        .term-view-content-container {
            padding-top: 35px;
        }
            .term-view-content-container > .list-title {
                margin-bottom: 35px;
            }
            .term-view-content-container h3 {
                font-size: 1.4rem;
            }
            .term-view-content-container h4 {
                font-size: 1.2rem;
                margin-top: 1.5rem;
            }
    li.topic-list-item {
        font-size: 1.25rem;
        padding: 11px 0px;
    }

    .pod-banner {
        padding: 20px 12px;
        position: fixed;
        z-index: 10;
        bottom: 8px;
        left: 8px;
        right: 8px;
        font-size: 1.1rem;
        background-color: #FFFFFF;
        border: 1px solid #e0e0e0;
        border-radius: 3px;
        box-shadow: 0px 0px 3px rgba(0,0,0,0.25);
        -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.25);
        -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.25);
    }
        body[data-device="desktop"] .pod-banner{
            box-shadow: 0px 0px 5px rgba(102, 123, 218, 0.3);
            -webkit-box-shadow: 0px 0px 5px rgba(102, 123, 218, 0.3);
            -moz-box-shadow: 0px 0px 5px rgba(102, 123, 218, 0.3);
        }
        div#notification-permission-request {
            background-color: #212121;
            color: #ffffff;
            border-width: 0px;
            max-width: 260px;
            padding: 16px 20px 20px;
        }
            body[data-device="desktop"] div#notification-permission-request {
                bottom: 0px;
                left: 0px;
                right: auto;
            }
                body[data-device="desktop"].player-visible.player-minimized div#notification-permission-request {
                    bottom: 100px;
                }
    #user-cookie-policy-agreement.pod-banner {
        display: flex;
        align-items: center;
        padding-left: 20px;
        padding-right: 20px;
    }
        div#notification-permission-request .pod-banner-dismiss-btn{
            display: none;
        }
        .pod-banner-icon {
            margin-right: 4px;
        }
        .banner-content{
            font-weight: 400;
        }
        #android-native-app-install-banner .banner-content,
        #iOS-native-app-install-banner .banner-content{
            display: flex;
            align-items: center;
            font-weight: 600;
        }
            .pod-banner#notification-permission-request .ad-title {
                font-size: 1.3rem;
                font-weight: bold;
                margin-bottom: 14px;
            }
            .pod-banner#notification-permission-request .ad-content {
                margin-bottom: 20px;
                font-size: 1rem;
            }
        .banner-action {
            background-color: #00c853;
            font-weight: 600;
            /*text-transform: uppercase;*/
            text-align: center;
            padding: 12px;
            line-height: 1;
            border-radius: 3px;
            margin-left: 10px;
            color: #FFFFFF;
        }
            .banner-action.full{
                margin: 15px 5px 0px;
            }
            body[data-device="desktop"] .banner-action:hover,
            body[data-device="mobile"] .banner-action:active{
                background-color: #01a946;
                cursor: pointer;
            }
            body[data-device="desktop"] .banner-action{
                margin-left: 20px;
            }
            div#new-native-app-install-ad {
                margin-left: 0px;
                border-radius: 20px;
            }
        #modal-signin-btn.follow-topic-signin-btn,
        div#install-native-app-header-btn,
        div#beta-signup-btn {
            background-color: #FF385C;
        }
            body[data-device="desktop"] #modal-signin-btn.follow-topic-signin-btn:hover,
            div#install-native-app-header-btn:active,
            body[data-device="mobile"] #modal-signin-btn.follow-topic-signin-btn:active,
            div#beta-signup-btn:active {
                /*background-color: #FF385C;*/
                background-color: #f1274c;
            }
        div#install-native-app-header-btn{
            border: 0px;
            border-radius: 4px;
            color: #FFFFFF;
            margin: 0px;
            text-transform: uppercase;
            font-weight: 600;
            font-size: 0.8rem;
            line-height: 1.0rem;
        }
            div#install-native-app-header-btn.generic-native-app-install-btn {
                position: absolute;
                left: 10px;
                top: 10px;
            }
                body[app-mode="clip"] div#install-native-app-header-btn.generic-native-app-install-btn {
                    display: none;
                }
            body[data-device="desktop"] #modal-signin-btn.follow-topic-signin-btn:hover{
                cursor: pointer;
            }
        .pod-banner-dismiss-btn {
            position: absolute;
            top: 0px;
            right: 0px;
            padding: 4px;
            color: #333;
        }
        body[data-device="desktop"] .pod-banner-dismiss-btn {
            position: static;
            order: 3;
            justify-self: flex-end;
            margin-left: auto;
        }
            body[data-device="desktop"] .pod-banner-dismiss-btn:hover{
                cursor: pointer;
            }
            body[data-device="desktop"] .pod-banner-dismiss-btn:hover,
            .pod-banner-dismiss-btn:active {
                opacity: 0.5;
            }
            .pod-banner-dismiss-btn > i {
                font-size: 1.4rem;
            }
        div#new-native-app-install {
            display: flex;
            flex-direction: column;
            border-radius: 10px;
            padding: 14px 12px;
        }
            #new-native-app-install .pod-banner-dismiss-btn {
                order: 3;
                position: static;
                text-align: center;
                color: #A5A5A5;
            }
            #new-native-app-install .banner-content {
                order: 1;
                text-align: center;
                font-weight: 500;
            }
                #new-native-app-install .banner-content img#logo {
                    width: 64px;
                    display: block;
                    margin: 0 auto 16px;
                }
                #new-native-app-install .ad-title {
                    font-weight: 600;
                    font-size: 1.35rem;
                    margin-bottom: 0.3rem;
                }
                #new-native-app-install .ad-content {
                    text-align: left;
                    margin: 10px 40px 0px;
                }
            #new-native-app-install .banner-action {
                order: 2;
                background-color: #1565c0;
                border-radius: 24px;
                font-weight: 400;
                padding: 14px 12px;
                display: inline-block;
                margin: 20px auto 10px;
                width: 190px;
            }
    .beta-form-container {
        margin-top: 45px;
        display: flex;
        align-items: flex-start;
    }
        .beta-form-container .input-field {
            flex-grow: 1;
            margin: 0px;
        }

    .icon-btn {
        border-radius: 50%;
        overflow: hidden;
        padding: 6px;
    }
        .icon-btn i.material-icons{
            font-size: 3.1rem;
            color: #ffffff;
        }
            .clip-container[data-audio-type="moment"] .icon-btn i.material-icons{
                font-size: 2.6rem;
            }
            body[data-device="desktop"] .icon-btn:hover i.material-icons,
            body[data-device="mobile"] .icon-btn:active i.material-icons{

            }
            body[app-mode="episode"] .icon-btn i.material-icons{
                font-size: 2.4rem;
            }
                .icon-btn.play-pause-btn .pause-icon,
                .clip-container.active .icon-btn.play-pause-btn .play-icon{
                    display: none;
                }
                .clip-container.active .icon-btn.play-pause-btn .pause-icon{
                    display: block;
                }
    .icon-btn.play-pause-btn{
        width: 58px;
        height: 58px;
        opacity: 0.85;
    }
        .clip-container[data-audio-type="moment"] .icon-btn.play-pause-btn{
            width: 50px;
            height: 50px;
            opacity: 0.7;
        }

        .clip-container[data-audio-type="moment"] .icon-btn.play-pause-btn:hover,
        .icon-btn.play-pause-btn:hover{
            opacity: 1.0;
        }
        .clip-container[data-audio-type="moment"] .icon-btn.play-pause-btn {
            display: none;
            position: absolute;
            top: 47.5px;
            left: 50%;
            margin-left: -25px;
            margin-top: -25px;
        }
            body[data-device="desktop"] .clip-container[data-audio-type="moment"] .icon-btn.play-pause-btn{
                top: 50%;
            }
            body[data-device="desktop"] .clip-container[data-audio-type="moment"]:hover .icon-btn.play-pause-btn,
            .clip-container[data-audio-type="moment"].current .icon-btn.play-pause-btn {
                display: block;
            }
        body[data-device="desktop"][app-mode="episode"] .icon-btn.play-pause-btn{
            width: 48px;
            height: 48px;
        }
        body[data-device="mobile"] .icon-btn.play-pause-btn:active,
        body[data-device="desktop"] .icon-btn.play-pause-btn:hover{
            background-color: #6671de !important;
        }

/*material-icons add-ons*/
.mi-self_improvement:before{
    content: "self_improvement"
}
.mi-fastfood:before{
    content: "fastfood"
}
.mi-coronavirus:before{
    content: "coronavirus"
}

body[data-device="mobile"] .card-content {
    max-width: calc(100vw - 120px);
    max-width: -webkit-calc(100vw - 120px);
    max-width: -moz-calc(100vw - 120px);
    max-width: -o-calc(100vw - 120px);
}
    body[data-device="mobile"] .clip-container.rnd .card-content {
        max-width: calc(100vw - 177px);
        max-width: -webkit-calc(100vw - 177px);
        max-width: -moz-calc(100vw - 177px);
        max-width: -o-calc(100vw - 177px);
    }


.clip-suggestion{
    position: absolute;
    top: 63px;
    left: 24px;
    right: 24px;
    bottom: 0px;
    background-color: rgba(0,0,0,0.7);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
    body[data-device="desktop"] .clip-suggestion {
        top: 0px;
        left: 0px;
        right: 0px;
        font-size: 1.2em;
    }
        .suggestion-header-inner {
            font-weight: 600;
        }
    .suggestion-content-wrapper {
        margin: 10px 5px 15px;
        text-align: center;
    }
        .suggestion-content-title {
            font-size: 1.1em;
            margin-bottom: 1em;
        }
        .suggestion-content-list-title {
            font-size: 0.9em;
        }
    .clip-suggestion-wrapper{
        width: 40px;
        height: 40px;
        position: relative;
        /*background: transparent;*/
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        background: black;
        border-radius: 50%;
        opacity: 0.8;
    }
        body[data-device="desktop"] .clip-suggestion-wrapper {
            height: 50px;
            width: 50px;
            border-radius: 50%;
        }
        body[data-device="mobile"] .clip-suggestion-wrapper:active,
        body[data-device="desktop"] .clip-suggestion-wrapper:hover{
            opacity: 1.0;
        }
        body[data-device="desktop"] .clip-suggestion-wrapper:hover{
            cursor: pointer;
        }
        .pie{
            width: 50%;
            height: 100%;
            position: absolute;
            background: transparent;
            border: 3px solid #FFFFFF;
            left: 0px;
            bottom: 0px;
        }
        @keyframes rota {
            0%   { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        @keyframes fill {
            0%        { opacity: 0; }
            50%, 100% { opacity: 1; }
        }

        @keyframes mask {
            0%        { opacity: 1; }
            50%, 100% { opacity: 0; }
        }
        .wrapper:hover .filler,
        .wrapper:hover .spinner,
        .wrapper:hover .mask {
            /*animation-play-state: paused;*/
        }
        .spinner{
            border-radius: 25px 0px 0px 25px;
            z-index: 200;
            border-right: none;
            transform-origin: 100% 50% 0;
            animation: rota 5s linear 0s;
            animation-fill-mode: forwards;
        }
            body[data-device="desktop"] .spinner {
                border-radius: 30px 0px 0px 30px;
            }
        .filler {
            border-radius: 0 25px 25px 0;
            z-index: 100;
            border-left: none;
            animation: fill 5s steps(1, end) 0s;
            animation-fill-mode: forwards;
            left: 50%;
            opacity: 0;
        }
            body[data-device="desktop"] .filler {
                border-radius: 0px 30px 30px 0px;
            }
        .mask {
            width: 50%;
            height: 100%;
            position: absolute;
            z-index: 300;
            opacity: 1;
            background: inherit;
            animation: mask 5s steps(1, end) 0s;
            animation-fill-mode: forwards;
            border-radius: 20px 0px 0px 20px;
        }
            body[data-device="desktop"] .mask{
                border-radius: 25px 0px 0px 25px;
            }
        .clip-suggestion-wrapper > i.material-icons{
            margin: 8px;
            z-index: 400;
            position: absolute;
        }
            body[data-device="desktop"] .clip-suggestion-wrapper > i.material-icons {
                font-size: 1.9rem;
                margin: 11px;
                /*margin: 13px;*/
            }
    .install-app-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: 25px 20px 0px;
        border: 1px solid rgba(0,0,0,0.1);
        border-radius: 10px;
        padding: 30px 20px;
    }
        /*.install-app-btn:active {*/
        /*    background-color: #EFEFEF;*/
        /*}*/
        img#install-app-logo {
            height: 64px;
            margin-bottom: 25px;
        }
        div#install-app-title {
            font-weight: 600;
            font-size: 1.5rem;
        }
        div#install-app-desc {
            margin-top: 25px;
            /*text-align: center;*/
            font-size: 1.2rem;
           font-weight: 500;
        }
        div#install-app-btn {
            padding: 14px 24px;
            color: #FFFFFF;
            margin-top: 35px;
            font-size: 1.2rem;
            border-radius: 27px;
            text-transform: uppercase;
            font-weight: 600;
        }
            div#install-app-btn:active {
                background-color: #1158a8 !important;
            }

    div#notif-permission-request-modal {
        width: 540px;
    }

        #notif-permission-request-modal .modal-content {
            text-align: center;
            align-items: center;
        }

        div#notif-permission-request-close-btn {
            position: absolute;
            top: 6px;
            right: 6px;
        }

        div#accept-notif-permission-btn {
            display: inline-block;
            padding: 12px 16px;
            color: #ffffff;
            text-transform: uppercase;
        }
            body[data-device="desktop"] div#accept-notif-permission-btn:hover {
                cursor: pointer;
                background-color: #388e3c;
            }
#embed-modal{
    max-width: 960px;
    min-width: 800px;
}
    #embed-modal .modal-content {
        display: flex;
        padding: 0px;
    }
        #embed-modal .embed-preview-container{
            position: relative;
        }
        iframe#embed-preview-iframe {
            border: 0px;
            height: 50vw;
            width: 50vw;
            border-right: 1px solid #e0e0e0;
            max-height: 540px;
            max-width: 540px;
            min-height: 400px;
            min-width: 400px;
        }

        .embed-info-container {
            display: flex;
            flex-direction: column;
            flex-grow:1;
        }

            .embed-info-container > * {
                padding: 14px;
            }

            .embed-src-container {
                font-family: 'Courier New';
                white-space: normal;
                /*flex-grow: 1;*/
                word-break: break-all;
                padding-top:20px;
                padding-bottom: 20px;
            }
                .embed-src-container textarea{
                    resize: none;
                    border-color: #cccccc;
                    border-radius: 4px;
                    padding: 3px 5px;
                    height: 240px;
                    line-height: 1.75rem;
                    font-size: 1.1rem;
                }

            .embed-info-title {
                border-bottom: 1px solid #E0E0E0;
                font-size: 1.7rem;
                font-weight: 500;
            }

            .embed-action-container {
                justify-content: flex-start;
                display: flex;
                /*border-top: 1px solid #e0e0e0;*/
                padding-top: 0px;
            }

            div#copy-embed-src {
                /*padding: 10px 14px;*/
                padding: 12px 18px;
                text-transform: uppercase;
                font-size: 1.1rem;
            }
                div#copy-embed-src:hover {
                    cursor: pointer;
                }
            #embed-modal .modal-close {
                position: absolute;
                top: 0px;
                right: 0px;
                padding: 2px 10px;
            }
    .player-overlay{
        position: fixed;
        top: 57px;
        left: 0px;
        right: 0px;
        bottom: 0px;
        z-index: 9;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center top;
        display: flex;
        flex-direction: column;
    }
        .player-overlay-inner{
            flex-grow: 1;
            display: flex;
            flex-direction: column;
            background-color: rgba(0,0,0,0.6);
            justify-content: center;
            align-items: center;
        }
            .player-overlay[data-ui-version="2"] .player-overlay-inner{
                justify-content: flex-start;
                background: black;
            }
            .player-overlay-content{
                color: #FFFFFF;
                padding: 0px 5vw;
                text-align: center;
            }
                .player-overlay[data-ui-version="2"] .player-overlay-content{
                    margin-top: 15vh;
                }
                .speaker-img-wrapper {
                    margin-bottom: 2.5vh;
                }
                    .speaker-image-highlight {
                        border-radius: 50%;
                        height: 150px;
                        width: 150px;
                        background-size: cover;
                        background-position: center;
                        background-repeat: no-repeat;
                        display: inline-block;
                    }
                .player-title{
                    margin: 2.9vh 0px;
                    font-size: 1.75rem;
                    font-weight: 500;
                    line-height: 1.3;
                    max-height: 9.1rem;
                    -webkit-line-clamp: 4;
                }
                    .player-title,
                    .player-overlay-show-title{
                        text-overflow: ellipsis;
                        overflow: hidden;
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                    }
                    .player-overlay[data-ui-version="2"] .player-title {
                        margin: 2.4vh 0px 2.5vh;
                    }
                .show-info {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }
                    #player-overlay-show-img{
                        height: 50px;
                        border-radius: 3px;
                        margin-right: 2.5vw;
                    }
                    .preview-audio-duration{
                        text-transform: uppercase;
                        font-size: 1.0rem;
                    }
                    .player-overlay-show-title {
                        font-size: 1.2rem;
                        max-height: 3.6rem;
                        text-align: left;
                        -webkit-line-clamp: 2;
                    }
                    .player-overlay-content .play-btn{
                        color: #FFFFFF;
                        border: 1px solid #FFFFFF;
                        border-radius: 32px;
                        display: inline-block;
                        height: auto;
                        padding: 10px 10px;
                        margin-top: 5vw;
                    }
                        .player-overlay[data-ui-version="2"] .player-overlay-content .play-btn{
                            margin-top: 0px;
                        }
                    .player-overlay-content i.material-icons.play-icon.mi-play_arrow {
                        font-size: 2.75rem;
                    }

    .app-view > .episode-summary.hidden > section {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
        .app-view > .episode-summary .episode-summary-actions {
            padding-top: 10px;
        }
            .app-view > .episode-summary:not(.hidden) .episode-summary-actions {
                display: none;
            }
    @media only screen and (min-width: 600px) and (min-height: 500px) {
        .app-view > .episode-summary.hidden > section {
            -webkit-line-clamp: 4;
        }
    }