[dark] ted com by void

/* ==UserStyle==
@name           [dark?] ted
@namespace      github.com/openstyles/stylus
@version        1.1.0
@description    Trying to make sense of TED's styling (crappy)
@author         Me
==/UserStyle== */

@-moz-document domain("ted.com") {
x	html.js body.home-body *,
x	#__next *,
	.js * {
		background: none;
		color:  inherit;
		border-color:  currentColor \ 50%;
	}

	html > body,
	.js > body {
		background: #222;
		color:  #ccc;
	}

	button,
	a:link {
		color:  #eee;
	}
	a:visited {
		color:  #999;
	}
	a:hover,
	a:focus {
		color:  #fff;
	}

	.Main-nav__icon {
		fill: currentColor;
	}


	.bg\:white,
	.bg-white,
x	.bg\:gray-ll {
		background: #222;
	}

	.css-1d6s504,
	.bg\:gray-50,
	.bg-gray-50 {
		background: #333;
	}

	.bg-gray-300,
	.bg\:gray-ll,
	.bg\:gray,
	.bg-gray {
		background: #444;
	}

	.bg\:red,
	.bg-red-700,
	.bg-red {
		background: #932;
	}

	.hover\:bg-gray-300:hover {
		background: #fff3;
	}

	.text-gray-500,
	.tippy-box[data-theme],
	.text-black,
	.c\:black,
	.c-black {
		color:  #ccc;
	}

	.text-gray-900,
	.text-gray {
		color:  #999;
	}

	.text-blue-500 {
		color:  #39c;
	}


	.group:hover .group-hover\:text-gray-700,
	.hover\:text-gray-700:hover {
		color:  #ccc;
	}


	/* Talks in Wide video mode */
	#maincontent > div > div > div.flex[style="flex:1"] > div.flex,
	#maincontent > div > div > div.flex[style="flex:1"] {
		display:  block;
	}
	#maincontent > div > div > div.flex[style="flex:1"] > .lg\:w-11\/12 {
		max-width: none;
		width:  60%;
		float:  left;
	}
	#maincontent > div > div > div.flex[style="flex:1"] > .css-1haqbq1 {
		max-width: none;
		width:  38%;
		float:  right;
	}

}