:root {
  --blue: #009faf;
  --darkblue: #00707a;
  --pink: #ef5570;
  --grey: #353535;
  --lightgrey: #3f3e3e;
  --beige: #e2e1df;
  --lightbeige: #f7f4f0;
  --standard-padding: 0.88rem;
  --neg-standard-padding: -0.88rem;
  --small-padding: 0.44rem;
  --logobg: #efe9e1;
}
/* Breakpoints
320px - 480px: Mobile devices.
481px - 768px: iPads, Tablets.
769px - 1024px: Small screens, laptops.
1025px - 1200px: Desktops, large screens.
1201px and more  Extra large screens, TV.
*/

* {
	border:0;
	padding:0;
	margin:0;
	min-height: 0;
	min-width: 0;
}

/* Fonts */
@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:300;font-display:swap;src:local(''),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-300.woff2) format('woff2'),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-300.woff) format('woff')}@font-face{font-family:'Roboto Condensed';font-style:italic;font-weight:300;font-display:swap;src:local(''),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-300italic.woff2) format('woff2'),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-300italic.woff) format('woff')}@font-face{font-family:'Roboto Condensed';font-style:normal;font-weight:700;font-display:swap;src:local(''),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-700.woff2) format('woff2'),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-700.woff) format('woff')}@font-face{font-family:'Roboto Condensed';font-style:italic;font-weight:700;font-display:swap;src:local(''),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-700italic.woff2) format('woff2'),url(/dottv/cdn2/fonts/roboto-condensed-v19-latin-700italic.woff) format('woff')}

body {
	background:#fff;
	font-family: 'Roboto Condensed', Calibri, 'Arial Narrow',Arial,sans-serif;
	font-size:18px;
	min-height:100vh;
	margin:0;
	color:var(--grey);
	display: flex;
  flex-direction: column;
}
p {
	margin: 1.8rem 0;
	line-height:1.8rem;
	font-size:1.2rem;
	}
h1 {
	font-size:1.56rem;
	font-weight:bold;
	color:var(--grey);
	margin: var(--standard-padding) 0;
}
	#pagewrap h1 {
		font-size:1.88rem;
	}
.h1wrap {
	background:var(--lightbeige);
	margin: 0 0  1rem 0 ;
}
	.h1wrap h1 {
		margin: 0;
		padding: 1rem 0;
	}
	@media all and (min-width:1024px) {
		.h1wrap {
			background:var(--lightbeige);
		}
	}

input, select, textarea, button {
	font-family: 'Roboto Condensed', Calibri, 'Arial Narrow',Arial,sans-serif;
	font-size:1.2rem;
	padding: var(--small-padding);
	background:#fff;
	padding: 0.88rem;
	color:var(--grey);
	border-radius:0;
}

#pagewrap {
	flex:1 0 auto;
	position:relative;
	top:60px;
	transition:margin-top 0.2s;
	padding-bottom: 60px;
}
	@media all and (min-width:769px) and (max-width:1023px) {
	}
	@media all and (min-width:1024px) {  
		#pagewrap {
			margin-top: 4rem;
		}
		.header-sml #pagewrap {
			margin-top:0;
			transition:margin-top 0.2s;
		}
	}
#pagewrap img {
    max-width: 100%;
    height: auto;
}
.constrain {
	width:100%;
	padding: 0 15px;
	box-sizing:border-box;
	max-width:1830px;
	margin: 0 auto;
	display:block;
	position:relative;
}
	@media all and (min-width:1750px) {
		.constrain {
			width:82%;
		}
	}
	@media all and (max-width: 350px) {
		#pagewrap .constrain {
			padding: 0;
		}
	}

a {
	color:var(--darkblue);
	text-decoration:underline;
	transition:color 0.2s;
}
	@media all and (min-width:769px) {
		a:hover {
			color:var(--blue);
			transition:color 0.2s;
		}
	}

.hide-m { }
	@media all and (max-width:1023px) {
		.hide-m {
			display:none;
		}
	}
.hide-d { }
	@media all and (min-width:1024px) {
		.hide-d {
			display:none;
		}
	}

.left {
	float:left;
}
.right {
	float:right;
}
.txt-left {
	text-align:left;
}
.txt-right {
	text-align:right;
}
.txt-center {
	text-align:center;
}


.button, .submit, #text-page .submit {
	background:var(--darkblue);
	border-radius:50px;
	color:#fff;
	text-decoration:none;
	transition: background 0.2s;
	padding: 0.5rem 1rem;
	font-size:1rem;
	display:inline-block;
	cursor:pointer;
}
	.button-secondary {
		background:var(--beige);
		color:var(--grey);
	}
@media all and (min-width:1000px) { 
	.button:hover, #show-nav a.button:hover, .submit:hover {
		background:var(--blue);
		color:#fff;
		transition: background 0.3s;
	}
	.button-secondary:hover {
	}
}
#available-pages-wrap .button {
	background:var(--blue);
}


/* Stop scrolling when nav or search is open -- This is possessed on phone wtf
.search-open, .sidenav-open {
	overflow:hidden;
	position:fixed;
} */


/* Header */
header {
	background: var(--grey);
	padding: 7.5px 0;
	height:45px;
	position:fixed;
	left:0;
	right:0;
	top:0;
	z-index:101;
	transition: height 0.2s, padding 0.2s;
}
	@media all and (min-width:1024px) {
		header {
			padding: 15px 0;
		}
		.header-sml header {
			height:auto;
			padding-top: 7.5px;
			padding-bottom: 7.5px;
			transition: height 0.2s, padding 0.2s;
		}
	}
	header .constrain {
		display:flex;
		align-content:space-around;
		align-items: center;
	}
	#header-logo {
		order:2;
		min-width:200px;
		text-align:center;
		flex-grow:2;
	}
		#header-logo a {
			display:block;
		}
	@media all and (min-width:769px) {
		#header-logo {
			order:1;
			text-align:left;
			flex-grow:1;
			max-width:200px;
		}
	}
@media all and (min-width:1024px) {
		.header-sml #header-logo {
			margin-top: -2px;
		}
		.header-sml #header-logo img {
			width: auto;
			height: 35px;
			transition: width 0.2s, height 0.2s;
		}
	}

	@media all and (min-width:1024px) and (max-width:1300px) {
		#header-logo {
			max-width: 130px;
			min-width:120px;
		}
	}
#header-search {
	flex-grow:1;
	text-align:left;
	order:1;
	white-space:nowrap;
	max-width:2rem;
}
	#header-search-form {
		background:var(--grey);
		padding: var(--standard-padding);
		margin-top:var(--standard-padding);
		width:auto;
		position:fixed;
		left:-1000px;
		top: 45px;
		bottom:0;
		right:auto;
		transform: translateX(-100%);
		transition: transform ease-out 0.3s;
	}
		@media all and (min-width:769px) {
			#header-search {
				text-align:center;
			}
			#header-search-form {
				margin-top: 0;
			}
		}
	.search-open #header-search-form {
		transition: transform ease-out 0.3s;
		transform: translateX(0);
		left:0;
		right:0;
	}
		.search-open #header-search-showhide {
			padding-top: var(--standard-padding);
		}
		#header-search-showhide span {
			opacity:0;
			transition: opacity 0.2s;
		}
		.search-open #header-search-showhide {
			background:none;
		}
		.search-open #header-search-showhide span {
			opacity:1;
			transition: opacity 0.2s;
		}
	#header-search-showhide {
		display:block;
		background: transparent url('/dottv/cdn2/images/icon-search.svg') no-repeat -8px center;
		width:20px;
		height:15px;
		padding: 10px 15px 10px 0;
	}
@media all and (min-width:769px) {
	#header-search {
		order:2;
		flex-grow:2;
		max-width:none;
	}

	#header-search-showhide {
		display:none;
	}
	#header-search-form {
		transform:translateX(0);
		position:relative;
		left:auto;
		top: auto;
		bottom: auto;
		right: auto;
		padding:0;
		background:none;
	}
	#header-search input.search-input:focus {
		width:100%;
		}
}
@media all and (min-width:1024px) and (max-width:1300px) {
	.header-sml  #header-nav {
		max-width:50px;
	}
	.header-sml #header-nav .hide-m {
		display:none;
	}
	.header-sml #header-nav .hide-m.hamburger-menu {
		display:block;
	}
}

#header-nav {
	flex-grow:1;
	max-width:2rem;
	text-align:right;
	order:3;
}
	@media all and (min-width:769px) {
		#header-nav {
			order:3;
			max-width:none;
			flex-grow:2;
		}
	}
#header-nav ul {
	margin: 0;
	padding: 0;
	height:22px;
	position:relative;
}
/* Hamburger */
.hamburger {
	width:22px;
	display:block;
	cursor: pointer;
}
.hamburger span {
	display: block;
	width: 22px;
	height: 3px;
	margin-bottom: 3px;
	position: relative;
	background: #ccc;
	border-radius: 4px;
	transform-origin: 4px 0px;
	transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
    background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
    opacity 0.55s ease;
}
	.header-sml .hamburger-menu .hamburger span,  .header-sml .hamburger-menu .hamburger span:nth-last-child(3) , .header-sml .hamburger-menu .hamburger span:nth-last-child(2), #header-side-showhide .hamburger span{
		transform: none;
		opacity:1;
		background:#fff;
	}
	.hamburger span, .hamburger-menu-m .hamburger span, .sidenav-open #header-side-showhide .hamburger span {
		  transform: rotate(45deg) translate(-5px, -9px);
	}
	.hamburger span:nth-last-child(3), .hamburger-menu-m .hamburger span:nth-last-child(3), .sidenav-open #header-side-showhide .hamburger span:nth-last-child(3) {
		opacity: 0;
		transform: rotate(0deg) scale(0.2, 0.2);
	}
	.hamburger span:nth-last-child(2), .hamburger-menu-m .hamburger span:nth-last-child(2), .sidenav-open #header-side-showhide .hamburger span:nth-last-child(2) {
		  transform: rotate(-45deg) translate(-3px, 5px);
	}

	.show-nav-show.hamburger {
		background:none;
		border-radius: 6px;
		transition: opacity 0.4s;
		margin: 5px 0 0 0;
		position:absolute;
		right:0;
		top:0;
	}
		@media all and (min-width: 1024px) {
			.show-nav-show.hamburger {
				background:#4a4a4a;
				padding:6px 6px 4px 6px;
				margin: 6px 0 0 0;
			}
		}
	.header-sml  .hamburger-menu .show-nav-show.hamburger {
		transition: opacity 0.4s;
		background:#009faf;
	}


/* Search */
	#header-search input.search-input {
		background:var(--lightgrey);
		border-radius:50px;
		padding: 0.5rem var(--standard-padding);
		border:0;
		outline:none;
		color:#fff;
		width:80%;
		position:relative;
		z-index:103;
		transition:width 0.2s, padding 0.2s linear;
	}
		#header-search input.search-input:focus {
			background:#4a4a4a;
			outline:none;
			width:90%;
			transition:width 0.2s
		}
	#header-search input.search-submit {
		background: transparent url('/dottv/cdn2/images/icon-search.svg') no-repeat 0 -4px;
		width:35px;
		height:35px;
		position: relative;
		z-index:104;
		margin: 0 0 0 -35px;
		text-indent: 40px;
		font-size:1px;
	}
	@media all and (min-width:1024px) { 
		.header-sml #header-search input.search-input {
			font-size:0.88rem;
			padding-top: 0.5rem;
			padding-bottom: 0.5rem;
			transition: padding 0.2s linear;
		}
	}

/* Top nav desktop */
	#header-nav ul {
		list-style-type:none;
		display:inline-flex;
	}
	#header-nav ul li.hamburger-menu {
		position:relative;
		width:50px;
	}
	#header-nav a {
		text-decoration:none;
		color:#c8c8c8;
		padding: 0 4px;
		display:block;
		line-height:40px;
		margin: 0 4px;
		font-size:1rem;
		transition: background 0.1s, padding 0.2s, margin  0.2s, font-size 0.2s, line-height 0.2s, opacity 0.4s;
		white-space: nowrap;
		opacity: 1;
	}

	.header-sml #header-nav a {
		font-size:1rem;
		opacity:0;
		transition: background 0.1s, padding 0.2s, margin  0.2s, font-size 0.2s, line-height 0.2s, opacity 0.4s;
	}
	@media all and (min-width:1024px)  { 
		#header-nav ul {
			height:40px;
		}
		#header-nav a:hover {
			background:var(--pink);
			transition: background 0.2s;
			color:#fff;
		}
		.header-sml #header-nav {
			padding-top: 0;
		}
	}


/* Side nav mob */
#side-nav {
		background:var(--grey);
		border-left: 2px solid var(--grey);
		padding: 1rem;
		width:auto;
		position:fixed;
		z-index:140;
		left:0px;
		top: 45px;
		margin-top:var(--standard-padding);
		bottom:0;
		right:0;
		transform: translateX(200%);
		transition: transform ease-out 0.3s;
		overflow:auto;
		-webkit-overflow-scrolling: touch;
	}
	.sidenav-open #side-nav {
		transform: translateX(0);
	}
	@media all and (min-width: 769px) {
		#side-nav {
			left: 20%;
		}
	}
#side-nav>ul.nav-shows li a {
	color:#fff;
}
ul.nav-shows  {
	list-style-type:none;
	margin: -1rem -1rem 0 -1rem;
}
	ul.nav-shows li {
		border-bottom:1px solid var(--grey);
	}
	ul.nav-mid li, ul.nav-foot li {
		border-bottom:1px solid var(--lightgrey);
	}
	ul.nav-shows li a {
		display:block;
		text-decoration:none;
		color:#c2c2c2;
		padding: 1rem;
	}
	ul.nav-shows li ul {
		display:none;
		list-style-type:none;
		margin-top:-0.5rem;
		font-size:0.88rem;
	}
	ul.nav-shows li ul li {
		border:0;
	}
	ul.nav-shows ul li  a{
		padding: 0.5rem 0.5rem 0.5rem 2rem;	
	}
.opencloseicon {
	font-family: arial, sans-serif;
    font-weight: 700;
    display: inline-block;
    float: right;
    font-size: 20px;
    color: #fff;
}
ul.nav-mid {
	margin-top:0;
}
.nav-foot {
	display:grid;
	grid-template-columns: 1fr 1fr ;
	list-style-type:none;
	margin: 0.5rem  -1rem 0 -1rem;
}
	.nav-foot li {
		border-bottom: 1px solid var(--lightgrey);
	}
	.nav-foot a {
		display:block;
		text-decoration:none;
		color:#b1b0b0;
		font-size:14px;
		padding: 0.5rem 0.5rem 1rem 1rem;
	}
/* TBD? 
li.nav-ombre-1 a {
	background: #00a4b5;
}
li.nav-ombre-2 a {
	background: #0b8e9b;
}
li.nav-ombre-3 a {
	background: #10838f;
}
li.nav-ombre-4 a {
	background: #1a6d75;
}
li.nav-ombre-5 a {
	background: #25575c;
} */
li.nav-ombre-6 a {
	background: #2d4648;
	background:var(--lightgrey);
}
.nav-social {
	display:flex;
    flex-direction: row;
    justify-content: space-around;
	margin: 2rem auto;
	max-width:300px;
	opacity:0.4;
}





/* Breadcrumbs */
.bc {
	padding: var(--standard-padding) 0 var(--standard-padding) 0;
	background:var(--beige);
}
	.bc.alt-bc {
		background:#e6e0d9;
	}
	.bc.alt-bc ul.breadcrumbs {
		display:inline;
	}
	.bc p, .bc li {
		color:var(--grey);
	}
ul.breadcrumbs {
	list-style-type:none;
	text-align:left;
	margin: 0 0 0 0;
	font-size:0.88rem;
	line-height:1.5rem;
}

	ul.breadcrumbs li {
		display:inline;
		color:#7c7976;
	}
	ul.breadcrumbs li:after {
		content: "\00a0 \00a0 \003E \00a0 \00a0";
	}
	ul.breadcrumbs li:last-child:after {
	}
	ul.breadcrumbs li a {
		color:var(--grey);
		text-decoration:none;
	}
	.bc p {
		font-size:0.88rem;
		margin:0;
		padding:0;
		line-height:1.2rem;
		display:inline;
	}

	@media all and (min-width: 1024px) {
		.bc {
			padding: var(--small-padding) 0 var(--small-padding) 0;
			line-height:35px ;
			position:relative;
			z-index:2;
			background:var(--logobg);
		}
			#sidebar {
				z-index:3;
				margin-top:-35px;
			}
		ul.breadcrumbs li a:hover {
			color:var(--darkblue);
		}
		ul.breadcrumbs, .bc p {
			display:inline;
		}
	}




/* Desktop show nav */
#show-nav div, #show-nav>ul, #show-nav ul>li {
	position:static;
}
.dropdown-left {
	width:45%;
}
.dropdown-right {
	width:45%;
	margin-left:5%;
}
#show-nav .txt-right {
	display:block;
}
#show-nav ul .pure-menu-children {
	background:#3f3e3e;
	padding:0 0 25px 0;
	height:auto;
	position:absolute;
	left:0;
	right:0;
	max-width:100%;
	white-space: normal;
	margin: 0 auto;
	max-height:0;
	transition:max-height 0.3s, background 0.9s;
	padding: 0;
	overflow:hidden;
}
	#show-nav-left .pure-menu-children .constrain {
		display:flex;
		align-content: space-between;
	}
	
	#show-nav-right ul li.sfhover .pure-menu-children {
		border-top: 2px solid var(--darkblue);
	}
#show-nav-right ul ul {
	column-count: 4;
	margin-left:-20px;
}

#show-nav ul li:hover .pure-menu-children, 
#show-nav ul li.sfhover .pure-menu-children {
	transition:max-height 0.9s, background 0.9s;
	max-height: 400px;
	padding: 25px 0;
	background:#4a4a4a;
}

.show-nav-sub .h2 {
	display:block;
	text-transform:uppercase;
	color:#a5a5a5;
	font-weight:bold;
	font-size:16px;
	margin: 0px 0 5px 0;
}

#show-nav-right .show-nav-sub a {
		line-height:200%;
}
#show-nav-right .show-nav-sub .show-status-2 a {
	opacity: 0.6;
}

/* Episode list in drop downs*/
#show-nav .show-nav-eplist {
	list-style-type:none;
	margin:0 0 15px 0;
	padding:0;
}
#show-nav .show-nav-eplist li a {
	display:block;
	padding: 5px 0;
	line-height:100%;
	color:#fff;
}
	@media all and (min-width:1000px) { 
		#show-nav .show-nav-eplist li a:hover {
			color:#009faf;
		}
	}

.show-nav-latest-posts {
	columns: 5;
	display:block;
	column-gap: 10px;
	padding: 0 0 20px 0;
}
#show-nav .nav-note {
	font-style:italic;
	color:#c8c8c8;
	font-size:12px;
	padding: 0 25px;
	line-height:300%;
	list-style-type:none;
}

#show-nav, .header-sml #show-nav.showme {
	background: #3f3e3e;
	position: fixed;
	top:75px;
	left:0;
	right:0;
	z-index:99;
	opacity:1;
	transition: top 0.3s, opacity 0.2s;
	font-size:1rem;
	line-height:1rem;
}
#show-nav ul {
	list-style-type:none;
	margin:0;
	padding:0;
	white-space:nowrap;
}
	#show-nav ul ul {
		white-space:normal;
	}
	#show-nav ul li {
		display:inline-block;
	}
	#show-nav-right  ul ul  li, #show-nav-left ul ul li {
		display:block;
	}
	.header-sml #show-nav {
		top:-40px;
		opacity:0;
		transition: top 0.3s, opacity 1s;
	}
	#show-nav > .constrain {
		display:flex;
		flex-wrap: nowrap;
		justify-content: space-around;
	}

	#show-nav-left {
		position:relative;
		z-index:80;
		margin-left: -20px;
		flex-grow:4;
		overflow:hidden;
	}
	#show-nav-right {
		text-align:right;
		z-index:81;
		flex: 0 0 510px;
		overflow:hidden;
		box-shadow: -5px 0px 5px -3px rgba(63,62,62,1);
	}
		#show-nav-right > ul {
			background:var(--darkblue);
			display:inline-block;
			width:auto;
	}
		#show-nav-right .show-nav-sub {
			background:#009faf;
			text-align:left;
		}
		#show-nav ul ul a {
			line-height:200%;
		}

	#show-nav li {
	}
	#show-nav ul>li>a, #show-nav ul>li>span.a-nolink, #show-nav-right a {
		text-decoration:none;
		padding: 0 19px;
		line-height:300%;
		color:#eee;
		display:block;
		cursor:pointer;
		transition:background 0.2s;
	}
		@media all and (min-width:769px) {
			#show-nav-right a:hover, #show-nav span.a-nolink:hover, #show-nav-right ul>li.sfhover>a {
				background:#009faf;
				transition:background 0.2s;
				color:#fff;
			}
			#show-nav-left a:hover, #show-nav-left ul>li.sfhover>a {
				background:#4a4a4a;
				color:#fff;
				transition:background 0.2s;
			}
		}
#show-nav #topnavscroller-right, #show-nav #topnavscroller-left {
	position:absolute;
	margin-left:-32px;
	width:30px;
	line-height:300%;
}
#show-nav #topnavscroller-left {
	background:#3f3e3e;
	box-shadow: 5px 0px 5px -3px rgba(63,62,62,1);
}





/* Square post thumbnail */
.square-box{
    position: relative;
	flex:0 0 95%;
    overflow: hidden;
	display:block;
	max-width:150px;
	margin: 0 7.5px 15px 7.5px;
}
.square-box:before{
    content: "";
    display: block;
    padding-top: 100%;
}
.square-content{
    position:  absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.square-content div {
   display: table;
   width: 100%;
   height: 100%;
}
.square-box a {
		border:2px solid #009faf;
		display:block;
		box-sizing: border-box;
		overflow:hidden;
		width:100%;
		height:100%;
	}
	.square-box img {
			width:100%;
			height:auto;
	}
	@media all and (min-width: 769px) {
		.square-box a {
			opacity:0.4;
			transition: opacity 0.4s, border-color 0.4s;
		}
		.square-box a:hover {
			opacity:1;
			border-color: #ef5570;
			transition: opacity 0.4s, border-color 0.4s;
		}
	}
	@media all and (max-width:535px) {
		.square-box{
			box-sizing:border-box;
			flex: 0 1 30%;
			margin: 0 7.5px 7.5px 7.5px;
		}
		#sidebar .square-box {
			margin: 7.5px 7.5px 0 7.5px;
		}
		#sidebar .other-outfits-from-this-ep-wrap, .aso {
			margin: 0 -7.5px;
		}
	}




/* Character links */
.characters-wrap {
	display:block;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
	
.character-link {
	width:50px;
	height:66px;
	font-size:11px;
	line-height:15px;
	display:block;
	vertical-align:top;
	margin: 2px 3px 2px 3px;
	text-align:center;
	overflow:hidden;
}
	
	#show-nav .characters-wrap {
		flex-wrap: nowrap;
	}
	#show-nav .character-link {
		flex: 0 0 50px;
	}
	.character-link a {
		display:block;
		color:#fff;
		text-decoration:none;
		//background:#353535 url('/dottv/assets/images/sprite-20180618.png') no-repeat -354px 7px;
		background:#353535;
	}
	.character-link.current a {
		background-color:#009faf;
	}
		@media all and (min-width: 1024px) {
			.characters-wrap {
				text-align:left;
				justify-content:flex-start;
			}
			#sidebar .characters-wrap {
				justify-content: center;
				padding: 0 15px;
			}
			.character-link a:hover, #show-nav .character-link a:hover {
				background-color:#009faf;
				transition: background-color linear 0.2s;
			}
		}

.character-link .charbgpic {
		display:block;
		height:50px;
		width:50px;
		overflow:hidden;
}
	.character-link .charbgpic img {
		max-width:100%;
		height:auto;
	}

/* Archived characters */
.archivedchar {
	display:block;
}
#showmorechars {
	display:none;
}
@media all and (min-width:769px) { 
	#showmorechars {
		display:block;
	}
	.archivedchar {
		display:none;
	}
	.morechars {
			border-right:10px solid #c8c8c8;
			border-bottom:10px solid #c8c8c8;
			width:12px;
			height:12px;
			transform: rotate(-45deg);
			display:block;
			margin:15px 0 0 12px;
			opacity:0.6;
	}
}



/* Products */
.products-wrap {
	display:flex;
	align-items:flex-start;
	align-content:center;
	justify-content: center;
	flex-wrap:wrap;
	margin: 0 -15px;
}
.product-item {
	width:150px;
	text-align:center;
	margin: 10px 10px;
	position:relative;
	}
	#promo-products-carousel-wrap .product-item {
		width: auto;
		max-width:150px;
	}
	.product-item a {
		display:block;
		text-decoration:none;
		color:#353535;
		transition:color 0.2s;
	}
	.product-item-image {
		width:150px;
		height:220px;
		overflow:hidden;
		border:1px solid #ccc;
		text-align:center;
		vertical-align:middle;
		display: block;
		max-width:150px;
		max-height:220px;
		background:#fff;
		border: 1px solid #009faf;
		transition:border 0.2s;

		display: flex;
		align-items: center;
		justify-content: center;
	}
.product-Shopbop .product-item-image {
	width:123px;
	margin: 0 auto;
}

		#pagewrap .product-item-image img {
			object-fit: cover;
			height:220px;
			width:auto;
			object-position: 50% 50%;
			max-width: none;
		}
		#pagewrap .product-horiz .product-item-image img {
			width:150px;
			height:auto;
			position:relative;
		}




	.product-item a:hover .product-item-image {
		border:1px solid #00a0b0;
	}
	.product img {
		margin: 5px 0;
	}
	.product-price {
		display:block;
	}

	.product strong {
		display:block;
		padding: 4px 0 0 0;
		color:#EFC464;
	}
	.product-store{
		font-weight:bold;
	}
	@media all and (min-width:1000px) { 
		.products-wrap {
			margin: 0;
		}
		.product-item {
			margin : 10px 15px;
		}
			.break .product-item {
				margin: 6px 4px 10px 4px;
				flex: 0 0 150px;
			}
		.product-item a:hover .product-item-image  {
			border: 1px solid #f05470;
			transition:border 0.2s;
		}
		.product-item a:hover {
			color:#f05470;
			transition:color 0.2s;
		}
	}

	.exact-match, .similar-match, .altered, .samebrand, .stylesaver {
		z-index:6;
	}
	.exact-match, .similar-match {
		position:absolute;
		left: -3px;
		top:-3px;
		width:40px;
		height:auto;
	}
	.similar-match {
		top:5px;
	}
	.altered {
		position:absolute;
		left:-3px;
		top:38px;
	}
	.samebrand, .stylesaver {
		position:absolute;
		right:-3px;
		top:-3px;
	}
	.stylesaver {
		right:-5px;
		top: -5px;
	}




/* Slider */
.slick-list,.slick-slider,.slick-track{position:relative;display:block}.slick-loading .slick-slide,.slick-loading .slick-track{visibility:hidden}.slick-slider{box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{top:0;left:0;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}
/* End Slider */

/* Slideshow pages */
.scrollpages  ul li {
	display:inline-block;
	margin:5px 4px 0 4px;
}
	.scrollpages ul li button {
		display:block;
		width:15px;
		height:15px;
		border-radius:100px;
		background:var(--lightgrey);
		overflow:hidden;
		text-indent:100px;
		cursor:pointer;
		border:0;
		padding:0;
		outline:0;
	}		
	.scrollpages ul li.slick-active button {
		background:#f05470;
	}
	@media all and (max-width:1023px) {
		.scrollpages ul li button {
			width:14px;
			height:14px;
		}
		.scrollpages ul li {
			display:inline-block;
			margin:5px 3px 0 3px;
		}

	}
/* This fixes mobile for some reason */
.slick-list{
  overflow: hidden;
}
.slick-list:after{
  clear: both;
  content: "";
  display: block;
}
.slick-slide {
	outline:none;
}

/* Affiliate notice */
	#home-aff {
		width:100%;
		max-width:288px;
		flex: 0 0 288px;
	}
		#home-aff span:before, #av-aff span:before {
			content:"WornOnTV receives commission for purchases or clicks made through links on this website, which helps keep the website going.";
		}
		#home-aff span {
			color:var(--beige);
			font-size:1rem;
			opacity:0.7;
			line-height:1.2rem;
			width:100%;
			display:block;
			background: transparent url('/dottv/cdn2/images/faded-hearts.png') no-repeat right center;
			padding:1rem 0;
		}
		#av-aff span {
			display:block;
			font-size:1rem;
			line-height:1.2rem;
			padding: 0.5rem;
			background: transparent url('/dottv/cdn2/images/faded-hearts.png') no-repeat right center;
		}
	.av-aff-wrap {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	#av-aff {
		background:var(--logobg);
		width:288px;
		padding: 5px 20px 5px 15px;
		position:relative;
		order: 2;
		min-width:288px;
	}
	@media all and (min-width: 1024px) {
		#home-aff span, #av-aff span {
			font-size:0.88rem;
			line-height:0.88rem;
		}
	}

/* Home page slideshow */
#homepage { }
	
#home-slideshow  .constrain {
		position:relative;
		padding:0;
	}
#home-slideshow p {
	margin: 1rem 0;
}
#available-pages-wrap {
	background:#5a5958;
	position:relative;
	left:0;
	right:0;
	padding:5px 0;
}
	#available-pages-wrap .constrain {
		display:flex;
		justify-content:space-between;
		align-items:center;
	}
	#available-pages-wrap .txt-right .button {
		margin:1rem 0;
	}

	#available-pages {
			background:#5a5958;
			padding: 5px ;
			flex: 1 1 auto;
	}
	#available-pages-wrap p.txt-right {
		margin:0;
	}
	@media all and (max-width: 695px)  {
		.av-aff-wrap {
			display:block;
		}
			#av-aff {
				float:none;
				margin: 0 auto;
			}
		#available-pages-wrap .constrain {
			flex-wrap: wrap;
		}
		#home-aff, #available-pages{
			width:100%;
			flex-basis:100%;
			text-align:center;
		}
		#home-aff { order: 2;  margin: 0 auto;}
		#available-pages { order:1; }
		#available-pages-wrap .constrain .txt-right { order: 3; }
	}
	@media all and (max-width:529px) {
		#available-pages-wrap .constrain .txt-right {
			flex: 0 0  100%;
			text-align:right;
		}
	}
	@media all and (min-width:528px) and (max-width:695px) {
		#home-aff {
			flex: 0 0 288px;
			margin: 0;
			text-align:left;
		}
		#available-pages-wrap .constrain .txt-right {
			flex: 1 1 40%;
			text-align:right;
		}
	}
#homepage #homepage-fin .box {
	margin-top:0;
	padding-top:15px;
}
		@media all and (max-width:568px){
			#homepage #homepage-fin .box {
				padding-top:5px;
			}
			#homepage {
				margin-top:0;
			}
		}
	#homepage-fin h3 {
		margin-right:0;
		margin-top:0;
	}

ul#homeslideshow li {
	float:left;
	list-style-type:none;
}

#available-go-left, #available-go-right {
		position:absolute;
		left:-40px;
		top:50%;
		margin-top:-50px;
		width:30px;
		height:40px;
		z-index:3;
		cursor:pointer;
		display:none;
		opacity:0.5;
	}
	#available-go-left span, #available-go-right span {
		border-right:16px solid #353535;
		border-bottom:16px solid #353535;
		width:20px;
		height:20px;
	    transform: rotate(135deg);
		display:block;
	}
		#available-go-right span {
			transform: rotate(-45deg);
		}

	@media all and (max-width:1400px) {
		#available-go-left, #available-go-right {
				display:none !important;
		}
	}
	#available-go-right {
		left:auto;
		right:-40px;
	}
	#available-go-left a, #available-go-right a {
		display:block;
		text-decoration:none;
		width:40px;
		height:40px;
	}

.imglink {
	overflow:hidden;
	display:block;
	aspect-ratio:648/505;
}
	@media all and (min-width:649px) { 
		.imglink {
			border:1px solid var(--grey);
			box-sizing:border-box;
		}
	}

.slick-slide {
	outline:none;
}
.home-featured-post {
	position:relative;
	overflow:hidden;
	margin: var(--standard-padding);
}
.home-featured-post p {
	line-height:1.2em;
	padding: 0 var(--standard-padding);
}
	@media all and (min-width:649px) {
		.home-featured-post p {
			padding: 0;
		}
	}
.scroller-title p{
	font-weight:bold;
	text-transform:uppercase;
	opacity:0.7;
}

#available2 {
	overflow:hidden;
	white-space:nowrap;
	min-height:370px;
	padding-bottom: var(--standard-padding);
}
	#available2 ul li {
		display:inline-block;
		width:34%;
		vertical-align:top;
		white-space:normal;
	}
#available2 img {
	width:auto;
	box-sizing: border-box;
}
	@media all and (max-width:1023px) {
		#available2 ul li { 
			width:50%;
		}
		#available-go-left, #available-go-right {
			display:none;
		}
	}

	@media all and (max-width:620px) {
		#homepage #available-pages + .txt-right, #homepage #available-pages-wrap  .txt-right, #cat-slideshow #available-pages + .txt-right, .latest-addition .txt-right  {
			text-align:center;
		}
		.home-featured-post {
			margin:0;
		}
	}

	@media all and (max-width:568px) {
		#available2 ul li { 
			width:100%;
		}
		#available-now-ribbon {
			display:none;
		}
		.home-section .home-featured-post {
			margin-bottom:0;
	
		}

	}
	@media all and (min-width:768px) and (max-width:1023px) {
		#available-now-ribbon {
			left:-40px;
			top:-25px;
		}	

	}





.close {
	background:#838382;
	border-radius:100%;
	display:block;
	position:absolute;
	right:5px;
	top: 5px;
	cursor:pointer;
	color:#fff;
	height:20px;
	width:20px;
	text-align:center;
	font-weight:bold;
}
.close span:before, .close span:after {
  position: absolute;
  left:9px;
	top:5px;
  content: ' ';
  height: 10px;
  width: 2px;
  background-color: #fff;
}
.close span:before {
  transform: rotate(45deg);
}
.close span:after {
  transform: rotate(-45deg);
}

#text-page strong {
	color:#575757;
}

/* General Flexy stuff */
.flexy {
	display:flex;
	justify-content:space-between;
	flex-wrap: wrap;
}
	.flexy>div {
	//	flex: 0 0 100%;
	}
	.flex-sidebar-col>div:nth-child(2) {
			flex: 0 0 33%;
			margin: 0 0 0 3rem;
	}

@media all and (max-width:700px) {
	.flex-sidebar-col {
		display:block;
	}
	.flex-sidebar-col>div:nth-child(2) {
		flex: 0 0 100%;
		margin: 0 ;
	}
}


@media all and (min-width:1024px) {
	.flexy {
		display:flex;
		justify-content:space-between;
		height:100%;
		align-items:stretch;
		gap:2rem;
		flex-wrap:nowrap;
	}
		.flex-three-col>div {
			flex: 0 0 33%;
		}
		.flex-sidebar-col>div:nth-child(1) {
			flex-grow:1;
		}
}



#category-head-wrap {
	position:relative;
}
/* Characters scrolly */
@media all  and (max-width:700px) {
	.chlist {
		position:relative;
	}
	.characters-wrap {
		flex-wrap: wrap;
		justify-content: center;
		overflow-x: scroll;
		position:relative;
		margin-left:-3px;
		padding-bottom:4px;
		::-webkit-scrollbar { display: none; }
	}
	.characters-highnum {
		flex-wrap:nowrap;
		justify-content: flex-start;
	}
		.character-link {
			flex: 0 0 50px;
		}
	.chlist::-webkit-scrollbar {
			-webkit-appearance: none;
			width: 3px;
			height:3px;
	}
}

.chlist::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: #353535;
        -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}
@media all and (max-width:700px) {
#category-head {
	position:relative;
}
	.morechars-scroll-right, .morechars-scroll-left {
		position:absolute;
		right:-15px;
		top:20px;
		width:10px;
		height:10px;
		padding:3px;
		opacity:0.3;
	}
	.arrowright {
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 5px 0 5px 8.7px;
		border-color: transparent transparent transparent #353535;
		display:inline-block;
	}
	.morechars-scroll-left {
		right:auto;
		left:-15px;
	}

	.arrowleft {
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 5px 8.7px 5px 0;
		border-color: transparent #353535 transparent transparent;
		display:inline-block;
	}

}


.showlogo-wrap {
    border-radius: 100px;
    background: #efe9e1;
    padding: 25px;
	display:inline-block;
	max-width:175px;
}




/* Home page stuff */
.home h3 {
	text-transform:uppercase;
	margin: 1.5rem 0;
}
.latest-outfits {
	display:flex;
	flex-wrap: wrap;
	gap: 15px;
	justify-content: space-around;
}
	.latest-outfits .square-box {
		margin:0;
	}
#currentshows {
		background: var(--logobg);
}
	#currentshows .flexy {
		flex-wrap: wrap;
	}
	.home-daily-shows {
		flex: 0 0 100%;
		text-align:center;
	}
		.home-daily-shows ul {
			list-style-type:none;
		}
	.home-current-shows {
		flex: 0 0 100%;
		text-align:center;
		margin: 0 -7.5px;
	}
	a.logo-listing {
		display:inline-block;
		margin: 0 7.5px 15px 7.5px;
		box-sizing: border-box;
		width:28%;
		max-width:175px;
	}


.boxy-list .hr {
	margin: 7px 0 10px 0;
	background:#cac4bd;
	color:#cac4bd;
	display:block;
	height:1px;
	}

	ul.boxy-list {
		list-style-type:none;
		margin: 0 15% 30px 15%;
	}
	ul.boxy-list li {
		display:block;
		font-size:16px;
	}
	ul.boxy-list li a {
		display:block;
		text-decoration:none;
		padding: 3px 0;
		margin: 0 0 3px 0;
		text-align:center;
		transition: background linear 0.1s;
	}
	@media all and (min-width:1024px) {
		#currentshows .flexy {
			flex-wrap: nowrap;
		}

		.home-daily-shows {
			flex:0 0 30%;
		}
		.home-current-shows {
			flex:1 1 70%;
			text-align:left;
		}


		a.logo-listing {
			opacity:0.6;
			border:0;
			transition: opacity linear 0.3s;
		}
		a.logo-listing:hover {
			opacity:1;
			transition: opacity linear 0.3s;
		}
		a.logo-listing img {
			transform: none;
			transition: transform linear 0.1s;
			position:relative;
			z-index:2;
		}

		a.logo-listing:hover img {
			transform: scale(1.2);
			transition: transform linear 0.1s;
			box-shadow: 0px 0px 20px 0px rgba(51,51,51,0.1);
			z-index:3;
		}

	}
/*
	@media all and (min-width:840px) and (max-width:999px) {
		.latest-outfits {
			overflow:hidden;
			height:660px;
		}
	}
*/

.fade-in {
	animation: fadeIn ease 2s;
}
@keyframes fadeIn {
	0% {opacity:0;}
	100% {opacity:1;}
}

/* available-items  etc page */
.available-wrap .flexy {
	flex-wrap: wrap;
	justify-content: space-between;
}
.available-wrap .flexy div {
	flex: 0 0 100%;
	border-bottom:7.5px solid #ebeaea;
	margin: 0 -15px 15px -15px;
	padding: 0 15px;
	background:none;
}
	.available-wrap .flexy div p {
			margin: 1rem 0;
	}
	.available-wrap .flexy div p.postedon {
		font-size:0.88rem;
	}
.ss_alpha {
	display:flex;
	flex-direction:column;
	height:100%;
}
	.ss_alpha li {
		flex: 1 1 15px;
	}
	@media all and (min-width:1000px) {
		.available-wrap .flexy div {
			flex: 0 0 30%;
		}
	}
	@media all and (min-width:600px) and (max-width:999px) {
		.available-wrap .flexy div {
			flex: 0 0 48%;
		}
	}
	@media all and (min-width:600px) {
		.available-wrap .flexy div {
			border:1px solid var(--grey);
			background:var(--lightbeige);
			margin: 0 0 15px 0;
			padding:0;
		}
		.available-wrap .flexy div p {
			padding: 0 15px;
		}
	}


/* Slide in boxes */
.come-in {
	transform: translateY(50px);
	transition: opacity 1s ease forwards;
	opacity:0;
	animation: come-in 0.5s ease forwards;
	animation-delay: 0ms;
	-webkit-animation-delay: 0ms;
}
.come-in:nth-child(odd) {
  animation-duration: 0.8s; /* So they look staggered */
}
.opac0 {
	opacity:0;
}
.already-visible {
	transform: translateY(0);
	opacity:1;
	animation: none;
}
	@keyframes come-in {
	  to { 
		transform: translateY(0); 
		opacity:1;
		transition: opacity 0.5s ease forwards;
		}
	}