/*================================================
    // MOBILE
    /================================================*/
    /*:root{
        --safe-area-inset-top:44px;
        --safe-area-inset-bottom:34px;
    }*/



    .width-constraint-medium{
        width: 100%;
    }
    

    .episode-list-item.extended{
        grid-template-columns:28px 1fr 13px 70px; 
    }

    .episode-item-title .ellipsis{max-width: 200px!important;}

    .activity-task-list{display: block;}

    /* Feature Items */
    .discover-featured .discover-swipe-container{
        display: grid;
        grid-template-columns: 
            90vw 90vw 90vw 90vw 90vw
            90vw 90vw 90vw 90vw 90vw;
        gap: 2.5vw;
    }
    .discover-swipe-section-featured{
        padding:var(--padding);
    }
    .skeleton-screen .feature-swipe-container.bg{
        background:none!important
    }

    .feature-item .star-rating{
        display:none
    }

    .feature-item{
        margin:0 var(--margin-small);
        border-radius:var(--radius);
        box-shadow: var(--elevation);
        background-position: bottom center!important;
        background-size: auto calc(100% - 90vw)!important;
        background-repeat: no-repeat!important;
        width: 90vw;
    }

    #latest-activity .feature-item{
        width: 90vw;
        margin: 0 auto;
    }

    .discover-featured .feature-item{
        margin:0;
    }

    .feature-item-inner{
        grid-template-columns:1fr;
        padding:0;
        gap:0;
    }

    .feature-item-icon img,
    .feature-item-icon{
        border-radius:var(--radius) var(--radius) 0 0;
        box-shadow: none!important;
    }

    .feature-item-icon img.media{
        width:101%;
    }

    .feature-item-text{
        padding:var(--padding-small);
    }

    .feature-item-text h2{
        font-size:120%;
        margin-bottom:8px
    }

    .feature-item p{
        overflow-wrap: break-word;
        hyphens: manual;
        min-height: 0;
    }


    @media screen and (max-height:740px){
        .feature-item p{display:none}

        .feature-item-text-inner .position-absolute{
            position: static;
        }
        .feature-item-text-inner{
            display: grid;
            grid-template-columns: 1fr 0 auto;
            gap: 8px;
            align-items: center;
        }
    }

    
    /* Content Items */
    .discover-sections .content-item{
        width: 85vw;
    }
    #library-items{
        grid-template-columns:1fr;
    }



    .library-filter-container{
        padding: 0;
    }

    .unflex-on-mobile{
        display: grid;
        grid-template-columns: 1fr;
    }

    .award-section-items {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
    }


    .activity-view-controller .appear-from-right{transform: translate3d(25%,0,0);}
    .activity-view-controller .appear-from-bottom{transform: translate3d(0%,25%,0);}



    .pathway-segment .pathway-activity,
    .pathway-segment .pathway-activity *{
        transition: none!important
    }

    .activity-progress{
        box-shadow: none!important;
    }

    .pathway-activity-container .activity-title-mobile span{
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical; 
        overflow:hidden;
    }

    @media screen and (max-width:400px){
        .pathway-activity-container .activity-title-mobile span{
            font-size: 13px;
            word-wrap: initial;
        }
    }


    @media screen and (max-width:370px){
        .pathway-activity-container .activity-title-mobile span{
            font-size: 12px;
        }

        .grid-list-item .font-overline{font-size: 11px;}
    }

    .overflow.with-scrollbar::-webkit-scrollbar {
		display:none
	}

    /* Library Manager */
    .library-categories{margin:2.5vw 2.5vw -2.5vw;grid-template-columns: repeat(auto-fit,minmax(15%,1fr));}

    .library-categories div {
        padding: 7.5px 15px;
    }

    .library-categories i {
        margin:0 auto;
        font-size: 17px;
    }


    /* Article Page */
    .article-page{margin-left:0; margin-right: 0; padding-left:5vw; padding-right: 5vw; margin-top: 41vh; width: auto;}


    .article-heading{padding:2vw 2vw 1vw}
    .article-section{padding:0 2vw}

    .article-page h2 {
        margin: 5vw 0 0;
        padding: 5vw 0 1vw;
    }

    .article-feature-image{
        height:41vh;
        top: 48px;
        margin-top: env(safe-area-inset-top);
    }
    .article-feature-image img{
        height: 100%;
        width: auto;
    }


    /* Content Views */
    
    .content-view-details{
        display: block;
    }

    #pathway-awards{padding-left:5vw!important}

    .stream-heading{
        display: block;
        text-align: center;
        max-width: 420px;
        margin: 0 auto;
    }
    .stream-details h1{
        margin:0 0 5px;
        font-size: 160%;
    }

    .stream-heading .stream-thumbnail{
        margin:0 auto 16px;
        max-width: 180px;
    }
    
    .stream-buttons{
        margin: var(--margin-medium) 0 0;
        display: grid;
        column-gap: 16px;
        grid-template-columns: repeat(auto-fit,calc(50% - 8px));
        justify-content: center;
        max-width: none!important;
    }

    
    .stream-buttons .floating-action-btn{
        margin:0!important;
        width: 100%!important;
    }

   

    .gradient-banner{
        height: 30vh;
        position: absolute;
        width: 100%;
    }

    .episode-details{display: none;}
    .stream-player-options{display:none}

    .bg-transparent-on-mobile{background:none!important}
    .bg-grey-on-mobile{background:#f9f9f9}
    .bg-white-on-mobile{background:#fff}
    .toolbar-border-on-mobile{border-bottom: 1px solid rgba(0,0,0,0.1);}

    #stream-player.video #stream-player-toolbar{background:rgba(0,0,0,0.3); -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px)}

    #stream-player-vodcast{display:flex; align-items: center; position: relative;}
    #stream-player-vodcast video{width: 100vw!important; height: auto!important;}

    #media-player .compact-grid,
    #stream-player .compact-grid{position: absolute; left: 0; right: 0; bottom: 0; padding-top:15px; z-index: 3;}

    .stream-thumbnail{width:50vw; max-width:180px; margin-top: 5px;}

    #stream-player-youtube-frame{position:absolute; height:100vh; width:100vw}
    

    .stream-player-buttons{padding:0}

    .player-gap-height{height: 120px;}

    #stream-player.compact,
    #stream-player.compact .compact-grid,
    #stream-player.compact .stream-player-controls,
    #stream-player.compact #stream-player-activity-view{
        height: 65px;
        padding-bottom: env(safe-area-inset-bottom);
        display: none;
    }

    #stream-player.compact .stream-player-buttons.top{
        position: absolute;
        bottom:env(safe-area-inset-bottom);
        left:0;
        right:0;
        padding:15px 0;
    }
   

    #stream-player.compact .stream-player-track-container{
        padding: 0;
        position: absolute;
        left: 0;
        right: 0;
        top:14px
    }


    #stream-player.compact .icon-loading{
        margin-top: -2px;
        margin-left: -1px;
        width: 39px;
        height: 39px;
    }

    #stream-player.compact .stream-player-track-position,
    #stream-player.compact .stream-player-track{border-radius: 0;}

    #stream-player.compact .stream-player-track-container input
    {display:none}

    

    #stream-player.compact.raised,
    #stream-player.compact.raised .compact-grid,
    #stream-player.compact.raised .stream-player-controls,
    #stream-player.compact.raised #stream-player-activity-view{
        padding-bottom: 0
    }


    #stream-player.compact.raised #stream-player-activity-view,
    #stream-player.compact.raised{
        box-shadow: none;
    }

    #stream-player.compact.raised .stream-player-buttons.top{
        bottom:0
    }

    #stream-player.landscape #stream-player-toolbar,
    #stream-player.landscape .stream-player-buttons.bottom,
    #media-player.landscape #media-player-toolbar,
    #media-player.landscape .stream-player-buttons.bottom
    {display: none!important}

    #media-player.landscape #media-player-video,
    #stream-player.landscape #stream-player-video{width:100vw; height: auto; position: absolute; left: 50%; top: 50%; transform: translate3d(-50%,-50%,0)}

    #media-player.landscape.video .compact-grid,
    #stream-player.landscape.video .compact-grid{
        margin:0 5vw 2.5vw;
        border-radius: var(--radius);
        background: rgba(255,255,255,0.1);
        padding-top:10px!important;
    }

    #stream-player.landscape.video .stream-player-track-container{padding:7.5px 10vw}
    #stream-player.landscape.video .stream-player-track-container input{top:2.5px}

    #media-player.landscape.video .device-bottom-inset,
    #stream-player.landscape.video .device-bottom-inset{padding-bottom: 0; height: auto;}

    .media-player-buttons{padding:0 0 5px}

    .media-player-track-container input{display: none;}

    #stream-player.compact,
    #stream-player.compact .compact-grid,
    #stream-player.compact .stream-player-controls,
    #stream-player.compact #stream-player-activity-view{
        padding-bottom: env(safe-area-inset-bottom)
    }


    /*================================================
    // MOBILE
    /================================================*/

    .show-on-tablet{display: none!important;}
    .show-on-mobile{display:block!important}

    .on-mobile-center-self{left:50%; top: 50%; transform: translate(-50%,-50%); position: absolute; width: 100%}

    .on-moblie-text-align-center{text-align: center}
    
	.channel-comment-options li{opacity: 1}


    /* Timeline */
    .timeline-dot{padding: 15px 0 7px}
    #timeline-week-menu{display: none}
    #timeline-container{padding: 0}

    .timeline-point .timeline-point-object{float: none!important; width: 100%!important; margin: 0!important}
    .timeline-point-object .content{text-align: center}

    .timeline-label{
        text-align: center!important;
        float: none!important;
        left: 0!important;
        width: auto;
        position: relative;
        padding: 7.5px 0 15px;
        width: 100%;
        margin: 0!important
    }

    .timeline-label h3,
    .timeline-label .timeline-point-date{position: relative; z-index: 1;}

    .timeline-label:after{
        content: ' ';
        width:2px;
        height: 100%;
        position: absolute;
        background:#f9f9f9;
        top:0;
        left:50%;
        transform: translateX(-50%);
        z-index: 0;
    
    }


    .pac-container{width: calc(100% - (10vw))!important; left: calc(5vw )!important; }


   


    .timeline-point-object .content{margin: 0 2.5vw 5vw}
    #feed-next-up .content{margin: 0 2.5vw;}

    .timeline-icon{margin: 15px auto -7px}

    .mobile-x1 .media-slide{
        width: 100%;
        height: auto;
    }

    .mobile-x1 .media-slide img,
    .mobile-x1 .media-slide video{position: static; width: 100%; height: auto; transform: none; display:block;}



    .large-padding{padding:15vw 7.5vw}
    
    
    .onboarding-banner{height:40vh}
    
    @media screen and (max-height:600px){
        .onboarding-banner{height:33vh}
    }
    

    

    .snackbar-icon{
        width: 48px;
        height: 48px;
        margin: 15px auto 15px;
    }

    #snackbar-dialog .container{padding: 15px}

    

    #snackbar-dialog .flat-button{margin: 0 7.5px;}



    .pathway-type-route .pathway-segment{min-height: 100px;}
    .pathway-type-route .activity-progress{margin:8px auto 4px}


    @media screen and (orientation:landscape) {
        
        .article-feature-image{
            height: 90vh;
        }

        .article-feature-image img{
            height: auto;
            width: 100%;
        }

        .article-page{
            margin-top: 60vh;
        }
    }
    

    #media-player-youtube-frame,
    #stream-player-youtube-frame{position:absolute; height:calc(100vh - ((48px + var(--safe-area-inset-top)) * 2)); width:100vw; padding:calc(48px + var(--safe-area-inset-top)) 0;}


    

    .activity-view-controller > .activity-view.inapp-clip{
        max-height: 75vh;
        max-width: none;
    }

    .activity-view-controller > .activity-view.inapp-clip .fragment-toolbar:before{
        display: none!important;
    }


    .in-app-web-view-container{
        position:relative; 
        height:calc(75vh - 48px); 
        margin-top:48px
    }

    .in-app-web-view-container iframe{
        border-radius: 0;
    }