

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@100;200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800&display=swap');



* {box-sizing:border-box;}



:root {


	/* Font Numbers */
	--minfontsize:.625rem;	--minfontsize:10px;
	--maxfontsize:6rem;		--maxfontsize:96px;
	--maxfontsize:10rem;	--maxfontsize:160px;
	/* font-size:clamp( var(--minfontsize) , 1vmin , var(--maxfontsize) ); */
	font-size:clamp( var(--minfontsize) , 1vmax , var(--maxfontsize) );

	/* App Width */
	/* --appwidth:50rem; */
	/* --appwidth:75rem; */
	--appwidth:80rem;
	/* --appwidth:100rem; */
	/* --appwidth:120rem; */
	/* Overlay Size */
	--overlaywidth:80rem;
	--overlaywidth:60rem;
	/* --overlaywidth:40rem; */

	/* Viewport Height (for Overlay) */
	--vph:100vh;
	--vph:100lvh;
	--vph:100svh;
	--vph:100dvh;

	/* Navbar Background Transition */
	--dtnavbarback:1.25s;
	--dtnavbarback:.5s; 

	/* Gap/Edge Sizes */
	--rowgap:3rem;
	--cellgap:.25rem;
	--edgewidth:3.5rem;
	--mediacorner:.375em;
	--mediacorner:.5em;
	--mediacorner:.75em;
	--mediacorner:1.5em;
	--overlaydisplaycorner:2.5rem;


	/* Billboard Content Level */
	--billboardcontentlevel:40%;
	--billboardcontentlevel:60%;
	/* --billboardcontentlevel:35%; */
	/* --billboardcontentlevel:0%; */
	/* Billboard Aspect Ratio */
	--billboardrowaspectratio:50%;
	--billboardrowaspectratio:40%;
	--billboardrowaspectratio:max( 10vh , 40% , 37.5vh );
	--billboardposteraspectratio:57.14285714%;
	--billboardposteraspectratio:max( 10vh , 57.14285714% , 50vh );


	/* Slider Row Items per Page */
	/* --slideritemsperpage:6; */
	/* Slider Row Shift Button */
	--shiftbtnwidth:var(--edgewidth);
	/* --shiftbtnwidth:calc( var(--edgewidth) - var(--cellgap) ); */
	/* Slider Row Page Width */
	--sliderpagewidth:calc( 100vw - 2*var(--shiftbtnwidth) );

	/* Slider Row Thumbnail Aspect Ratio */
	--thumbnailaspectratio:33.3%;			/* 3:1 */
	--thumbnailaspectratio:40%;				/* 5:2 */
	--thumbnailaspectratio:56.25%;			/* 16:9 */
	--thumbnailaspectratio:60%;				/* 5:3 */
	/* --thumbnailaspectratio:75%; */		/* 4:3 */
	/* --thumbnailaspectratio:100%; */		/* 1:1 */

	/* Slider Row Smooth Slide Time */
	--dtsmoothslide:.5s;
	/* --dtsmoothslide:.375s; */
	/* --dtsmoothslide:.25s; */


	/* Overlay Close Button */
	--overlayclosebtnsize:2.375rem;

	/* Overlay Poster Aspect Ratio */
	--overlayposteraspectratio:56.25%;
	/* --overlayposteraspectratio:53%;
	--overlayposteraspectratio:75%; */


	/* Box Shadows */
	--boxshadow:0 0 1rem 0 #0002;
	--boxshadow:0 0 .25rem 0 #0003;


	/* White Glass */
	--whitesheet1:#ffffffbf;		/* billboard poster vignette actionbox playbtn */
	--whitesheet:#ffffffb3;		/* billboard poster vignette actionbox morebtn */
	--whiteglass:#ffffff80;		/* billboard poster vignette actionbox playbtn */

	/* Off White */
	--navbaroffwhite:#e5e5e5;		/* navbar text */
	--ratingboxoffwhite:#dcdcdc;	/* ratingbox edge color */

	/* Grey Glass */
	--greysheet:#6d6d6eb3;			/* billboard poster vignette actionbox morebtn */
	--greyglass:#6d6d6e66;			/* billboard poster vignette actionbox morebtn */

	/* Light Black Glass */
	--ltblack:#222;				/* mediaitem medialink mediabadge */
	--ltrblackglass:#3339;			/* billboard poster ratingbox bg color */

	/* Teal Link Color */
	--seemoreteal:#54b9c5;			/* slider row see more button */

	/* Star Color */
	--starcolor:grey;
	--starcolor:#8888;
	--starcoloron:orange;
}



/***/



body {



	/* Background Color */
	--backcolor:var(--blkfull);
	/* Foreground Color */
	--forecolor:white;
	--forecolor1:#BBB;
	--shiftercolor:var(--blk3);
	--shiftercolorhover:var(--blk5);


	/* Search Theme Color */
	--searchthemecolor:var(--backcolor);


	/* Billboard Text Shadow */
	--billboardtextshadow:0 0 .25rem var(--drkblackglass);


	/* Media Link Badge */
	--medialinkbadgebackcolor:var(--drkblackglasss);
	--medialinkbadgebackcolor:var(--drkblackglass);



	/* Light Grey Color */
	--dotlistongrey:#aaa;		/* sliderow dotlist */

	/* Dark Grey Color */
	--dotlistoffgrey:#4d4d4d;		/* sliderow dotlist */

	/* Overlay Background */
	--overlaybackcolor:var(--drkblackglass);
	--overlaybackcolor:var(--drkblacksheet);
	/* --overlaybackcolor:white; */

	/* Overlay Display Background */
	--overlaydisplaybackcolor:#181818;
	--overlaydisplaybackcolor1:#333;
	/* Overlay Display Foreground */
	--overlaydisplayforecolor:#FDFDFD;
	--overlaydisplayforecolor1:#CCC;

	/* Black Color */
	--blkfull:#141414;
	/* Black Glass */
	--blk5:#141414b3;				/* shift btn (hover) */
	--blk4:#14141494;				/* billboard bottom-edge gradient */
	--blk3:#14141480;				/* shift btn (default) */
	--blk2:#14141459;				/* billboard bottom-edge gradient */
	--blk1:#14141426;				/* billboard bottom-edge gradient */
	--blk0:#14141400;				/* billboard bottom-edge gradient */

	/* Dark Black Glass */
	--drkblacksheet:#000000b3;		/* navbar bg gradient */
	--drkblackglass:#0009;			/* billboard left-edge gradient */
	--drkblackglasss:#0005;

	/* Navbar Colors */
	/* Navbar Gradient */
	--navbargradient:linear-gradient( 180deg , var(--drkblacksheet) 10% , transparent );
	/* --navbargradient:linear-gradient( 180deg , black 10% , white ); */

	/* Billboard Gradients */
	--billboardleftedgegradient:linear-gradient( 75deg , var(--drkblackglass) , transparent 85% );
	/* --billboardleftedgegradient:linear-gradient( 75deg , black , white 85% ); */
	--billboardbottomedgegradient:linear-gradient( 180deg , var(--blk0) , var(--blk1) , var(--blk2) , var(--blk4) , var(--blkfull) , var(--blkfull) );
}

body.lite {



	/* Background Color */
	--backcolor:var(--whtfull);
	/* Foreground Color */
	--forecolor:black;
	--forecolor1:#777;
	--forecolor1:#555;
	--shiftercolor:var(--wht3);
	--shiftercolorhover:var(--wht5);


	/* Billboard Text Shadow */
	--billboardtextshadow:none;


	/* Media Link Badge */
	--medialinkbadgebackcolor:var(--brtwhiteglasss);
	--medialinkbadgebackcolor:var(--brtwhiteglass);



	/* Light Grey Color */
	--dotlistongrey:#505050;		/* sliderow dotlist */
	--dotlistongrey:#808080;		/* sliderow dotlist */

	/* Dark Grey Color */
	--dotlistoffgrey:#b2b2b2;		/* sliderow dotlist */
	--dotlistoffgrey:#d0d0d0;		/* sliderow dotlist */

	/* Overlay Display Background */
	--overlaydisplaybackcolor:#e4e4e4;
	--overlaydisplaybackcolor1:#cdcdcd;
	/* Overlay Display Foreground */
	--overlaydisplayforecolor:#030303;
	--overlaydisplayforecolor1:#343434;

	/* White Color */
	--whtfull:#ECECEC;
	/* White Glass */
	--wht5:#ECECECb3;				/* shift btn (hover) */
	--wht4:#ECECEC94;				/* billboard bottom-edge gradient */
	--wht3:#ECECEC80;				/* shift btn (default) */
	--wht2:#ECECEC59;				/* billboard bottom-edge gradient */
	--wht1:#ECECEC26;				/* billboard bottom-edge gradient */
	--wht0:#ECECEC00;				/* billboard bottom-edge gradient */

	/* Bright White Glass */
	--brtwhitesheet:#ffffffb3;		/* navbar bg gradient */
	--brtwhiteglass:#fff9;			/* billboard left-edge gradient */
	--brtwhiteglass:#fffB;			/* billboard left-edge gradient */
	--brtwhiteglasss:#fff5;

	/* Navbar Colors */
	/* Navbar Gradient */
	--navbargradient:linear-gradient( 180deg , var(--brtwhitesheet) 10% , transparent );
	/* --navbargradient:linear-gradient( 180deg , black 10% , white ); */

	/* Billboard Gradients */
	--billboardleftedgegradient:linear-gradient( 75deg , var(--brtwhiteglass) , transparent 85% );
	/* --billboardleftedgegradient:linear-gradient( 75deg , black , white 85% ); */
	--billboardbottomedgegradient:linear-gradient( 180deg , var(--wht0) , var(--wht1) , var(--wht2) , var(--wht4) , var(--whtfull) , var(--whtfull) );
}





/* Box */
html,
body {scrollbar-width:none;}
body {background-color:var(--backcolor); font-family:Montserrat,Nunito,sans-serif; transition:.5s; margin:0;}
.freeze {overflow:hidden;}
/* div#container {background-color:dodgerblue; background:#1fc8db linear-gradient(141deg,#9fb8ad 0%,#1fc8db 51%,#2cb5e8 75%);} */
/* div#container {display:grid; place-items:center;} */
div#container {color:var(--forecolor);}
div#container {min-height:100vh;}
/* div#container > * > div.grid {max-width:var(--appwidth); margin:0 auto;} */




/* Navbar */
/* div#container nav.navbar {display:none;} */
div#container nav.navbar {position:fixed; /* position:sticky; */ inset:0; bottom:auto; width:100%; z-index:50;/* z-index:81; */}
div#container nav.navbar {background:var(--navbargradient); color:var(--navbaroffwhite); transition:var(--dtnavbarback);}
div#container nav.navbar div.grid {display:flex; align-items:center; justify-content:space-between; gap:.75rem; gap:1.5rem; padding:1rem var(--edgewidth);}
div#container nav.navbar div.grid {max-width:var(--appwidth); margin:0 auto;}
div#container nav.navbar div.grid a.homelink {color:inherit; text-decoration:none;}
div#container nav.navbar div.grid a.homelink img.logo {background-color:red; height:2.75rem; width:8rem; border:0 none;}
div#container nav.navbar div.grid a.homelink img.logo {height:2.75rem; height:4rem; width:auto; border-radius:50%; border-radius:.125em; /* margin-right:2rem; */}
div#container nav.navbar div.grid a.homelink img.logo {display:block; object-fit:contain;}
div#container nav.navbar div.grid a.homelink img.logo/* [src='xyz'],
div#container nav.navbar div.grid a.homelink img.logo[src=''] */ {background-color:transparent; color:red; font-size:1.5rem; font-weight:700; letter-spacing:-1px; text-transform:uppercase;}
div#container nav.navbar div.grid ul.navlist {display:flex; flex-direction:row;}
div#container nav.navbar div.grid ul.navlist {list-style:none; padding:0; margin:0;}
div#container nav.navbar div.grid ul.navlist.x {display:none;}
div#container nav.navbar div.grid ul.navlist li.navitem {color:var(--forecolor); margin-left:1.25rem;}
div#container nav.navbar div.grid ul.navlist li.navitem.home {display:none;}
div#container nav.navbar div.grid ul.navlist li.navitem.home {color:var(--forecolor1);}
div#container nav.navbar div.grid ul.navlist li.navitem.mylist {display:none;}
div#container nav.navbar div.grid ul.navlist li.navitem.search {display:none;}
div#container nav.navbar div.grid ul.navlist li.navitem a.navlink {display:flex; flex-direction:row; align-items:center; gap:.5em;}
div#container nav.navbar div.grid ul.navlist li.navitem a.navlink {color:inherit; font-size:1.25rem; /* font-weight:bold; */ text-decoration:none;}
/* div#container nav.navbar div.grid ul.navlist li.navitem a.navlink:hover {} */
div#container nav.navbar div.grid ul.navlist li.navitem a.navlink svg.icon {font-size:1.25em;}
/* div#container nav.navbar div.grid ul.navlist li.navitem a.navlink span.caption {} */

/* Navbar (scroll) */
div#container nav.navbar.scr {background-color:var(--backcolor);}

/* Navbar (simple) */
/* div#container nav.navbar.simple {} */
div#container nav.navbar.simple div.grid {justify-content:center;}
div#container nav.navbar.simple div.grid ul.navlist {display:none;}

/* Navbar (list-enabled) */
/* div#container nav.navbar.mylist {} */
/* div#container nav.navbar.mylist div.grid {} */
/* div#container nav.navbar.mylist div.grid ul.navlist {} */
div#container nav.navbar.mylist div.grid ul.navlist li.navitem.mylist {display:block;}
/* Navbar (search-enabled) */
/* div#container nav.navbar.search {} */
/* div#container nav.navbar.search div.grid {} */
/* div#container nav.navbar.search div.grid ul.navlist {} */
div#container nav.navbar.search div.grid ul.navlist li.navitem.search {display:block;}




/* Developer Dock */
div#container div.devdock {position:fixed; top:0; left:0; z-index:90; margin:1rem; margin:1.25rem;}
div#container div.devdock {background-color:lime; color:black; padding:.375em .75em; border-radius:.5rem;}
div#container div.devdock {opacity:0; visibility:hidden; transition:.375s;}
div#container.debug div.devdock {opacity:1; visibility:visible;}

/* Developer Dock Styles */
div#container div.devdock {left:50%; transform:translateX(-50%);}
/* div#container nav.navbar.simple+
div#container div.devdock {left:0; transform:none;} */
div#container nav.navbar.simple+div.devdock {left:0; transform:none;}


/* Developer Dock: Panel */
div#container div.devdock div.panel {display:flex; flex-direction:row; justify-content:flex-end; align-items:center; gap:0 .5rem;}
/* div#container div.devdock div.panel {display:grid; grid-template-columns:repeat(2,1fr);} */

/* Developer Dock Panel: Switch */
div#container div.devdock div.panel div.btn {cursor:pointer; padding:.25em 0;}
div#container div.devdock div.panel div.btn svg.icon {display:block; font-size:2rem; transition:.5s;}

/* Developer Dock Panel: Exit Button */
/* div#container div.devdock div.panel div.exitbtn {display:none;} */
div#container div.devdock div.panel div.exitbtn {background-color:#0004; display:grid; place-items:center; padding:.125em .5em; border-radius:10em;}
div#container div.devdock div.panel div.exitbtn {position:absolute; width:100%; top:100%; right:0; left:0; margin-top:.5em;}
div#container div.devdock div.panel div.exitbtn {background-color:#212328; color:#f5f5f5; padding:.5em 2em;}
/* div#container div.devdock div.panel div.exitbtn span.caption {} */
div#container div.devdock div.panel div.exitbtn span.caption::after {content:'Exit'; margin:0 .5em;}

/* Developer Dock Panel: Open Button */
/* div#container div.devdock div.panel div.openbtn {display:none;} */

/* Developer Dock Panel: Clear Button */
/* div#container div.devdock div.panel div.clearbtn {display:none;} */

/* Developer Dock Panel: Theme Toggler (dark) */
/* div#container div.devdock div.panel div.togglebtn {display:none;} */
/* div#container div.devdock div.panel div.togglebtn svg.icon {} */
div#container div.devdock div.panel div.togglebtn svg.icon.on {display:none;}
div#container div.devdock div.panel div.togglebtn svg.icon.off {display:block;}
/* Developer Dock Panel: Theme Toggler (lite) */
/* .lite div#container div.devdock div.panel div.togglebtn {} */
/* .lite div#container div.devdock div.panel div.togglebtn svg.icon {} */
.lite div#container div.devdock div.panel div.togglebtn svg.icon.on {display:block;}
.lite div#container div.devdock div.panel div.togglebtn svg.icon.off {display:none;}




/* Media Library */
div#container div.library {position:relative; /* min-height:100vh; */ /* max-width:var(--appwidth); */ margin:0 auto;}




/* Footer */
div#container footer.footer {color:grey; padding:var(--rowgap) var(--edgewidth); margin-top:calc(2*var(--rowgap)); margin-top:var(--rowgap);}
div#container footer.footer {display:flex; flex-direction:column; /* gap:3em; */}
div#container footer.footer/* .xyz */ {position:relative; /* min-height:20rem; */}

/* Footer: Links */
/* div#container footer.footer div.links {} */
div#container footer.footer div.links ul.linklist {list-style:none; padding:0; margin:0;}
/* div#container footer.footer div.links ul.linklist li.linkitem {} */
div#container footer.footer div.links ul.linklist li.linkitem a.link {color:inherit; text-decoration:none;}
div#container footer.footer div.links ul.linklist li.linkitem a.link svg.icon {display:block;}
/* div#container footer.footer div.links ul.linklist li.linkitem a.link svg.icon {} */
/* div#container footer.footer div.links ul.linklist li.linkitem a.link span.caption {} */

/* Footer: Legal Links */
div#container footer.footer div.legallinks {text-align:center; margin-top:2em;}
/* div#container footer.footer div.legallinks span.caption {} */
/* div#container footer.footer div.legallinks span.entityname {} */
div#container footer.footer div.legallinks span.entityname::after {content:'.';}
div#container footer.footer div.legallinks span.entityname:empty::after {content:'';}

/* Footer: Social Links */
div#container footer.footer div.brandlinks {display:flex; flex-direction:row; justify-content:center;}
div#container footer.footer div.brandlinks {color:var(--forecolor); font-size:2em;}
div#container footer.footer div.brandlinks ul.linklist {display:flex; flex-direction:row; align-items:center; /* gap:1em; */}
div#container footer.footer div.brandlinks ul.linklist li.linkitem {padding:0 .375em;}

/* Footer: Member Links */
div#container footer.footer div.memberlinks {display:flex; flex-direction:row; gap:.5rem;}
div#container footer.footer div.memberlinks {display:grid; grid-template-columns:repeat( var(--colcount) , 1fr ); grid-gap:1rem; --colcount:4;}
div#container footer.footer div.memberlinks {display:none;}
div#container footer.footer div.memberlinks ul.linklist {display:flex; flex-direction:column; /* align-items:center; */}
div#container footer.footer div.memberlinks ul.linklist li.linkitem {margin-top:1em;}






/* Large Smartphone */
@media screen and (max-width:64rem) {


	/* Navbar */
	/* div#container nav.navbar {} */


	/* Footer */
	/* div#container footer.footer {} */
	/* Footer: Links */
	/* div#container footer.footer div.links {} */
}


/* Medium Smartphone */
@media screen and (max-width:52rem) {


	/* Navbar */
	/* div#container nav.navbar {} */


	/* Footer */
	/* div#container footer.footer {} */
	/* Footer: Links */
	/* div#container footer.footer div.links {} */
}


/* Small Smartphone */
@media screen and (max-width:36rem) {


	/* Navbar */
	/* div#container nav.navbar {} */


	/* Footer */
	/* div#container footer.footer {} */
	/* Footer: Links */
	/* div#container footer.footer div.links {} */
	/* div#container footer.footer div.memberlinks {--colcount:2;} */
}


/* Small Smartphone */
@media screen and (max-width:24rem) {


	/* Navbar */
	/* div#container nav.navbar {justify-content:flex-start;} */


	/* Footer */
	/* div#container footer.footer {} */
	/* Footer: Links */
	/* div#container footer.footer div.links {} */
	div#container footer.footer div.memberlinks {--colcount:2;}
}
