Stylish extension style: KissAnime DeepDark (fixed)

KissAnime DeepDark (fixed).css

/* Theme made by Sudipto <https://github.com/dipu-bd> */
/*GNU General Public License v3.0*/
/*Main color variables*/

:root {
	/*User colors*/
	--main-color: #00ADEE;
	--main-background: #111111;
	--second-background: #181818;
	--hover-background: #232323;
	--main-text: #EFF0F1;
	--dimer-text: #CCCCCC;
	/*DeepDark colors*/
	/*
		--main-color: #00adee;
		--main-background: #111111;
		--second-background: #181818;
		--hover-background: #232323;
		--main-text: #eff0f1;
		--dimer-text: #CCCCCC;
		*/
	/*KDE colors*/
	/*
		--main-color: #3DAEE9;
		--main-background: #232629;
		--second-background: #2a2e32;
		--hover-background: #31363b;
		--main-text: #eff0f1;
		--dimer-text: #bdc3c7;
		*/
	/*Vertex Dark colors*/
	/*
		--main-color: #4080fb;
		--main-background: #2B2B2C;
		--second-background: #353638;
		--hover-background: #515254;
		--main-text: #F3F3F5;
		--dimer-text: #AEAFB0;
		*/
	/*Arc Dark colors*/
	/*
		--main-color: #5294E2;
		--main-background: #343944;
		--second-background: #383C4A;
		--hover-background: #414A59;
		--main-text: #C1C8D1;
		--dimer-text: #B3BAC5;
		*/
	/*Firefox Dark colors*/
	/*
		--main-color: #5675B9;
		--main-background: #272B35;
		--second-background: #181D20;
		--hover-background: #353A44;
		--main-text: #E3EEF9;
		--dimer-text: #989798;
		*/
	/*Firefox57 Dark colors*/
	/*
		--main-color: #4080FB;
		--main-background: #0C0C0D;
		--second-background: #252526;
		--hover-background: #323234;
		--main-text: #F9F9FA;
		--dimer-text: #D0D0D0;
		*/
	/*Discord colors*/
	/*
		--main-color: #7289DA;
		--main-background: #1E2124;
		--second-background: #2F3136;
		--hover-background: #484B51;
		--main-text: #FFFFFF;
		--dimer-text: #ADA8AA;
		*/
	/*YouTube dark colors*/
	/*
		--main-color: #E52117;
		--main-background: #111111;
		--second-background: #232323;
		--hover-background: #343434;
		--main-text: #E1E1E1;
		--dimer-text: #7F7F7F;
		*/
	/*Mint-Y-Dark colors*/
	/*
		--main-color: #9AB87C;
		--main-background: #2F2F2F;
		--second-background: #383838;
		--hover-background: #404040;
		--main-text: #FFFFFF;
		--dimer-text: #D5DADA;
		*/
	/*9anime colors*/
	/*
		--main-color: #723f8c;
		--main-background: #0B0A0D;
		--second-background: #17151C;
		--hover-background: #1E1C25;
		--main-text: #B4B4B4;
		--dimer-text: #747474;
		*/
	/*Black and white*/
	/*
		--main-color: #ffffff;
		--main-background: #000000;
		--second-background: #0a0a0a;
		--hover-background: #0f0f0f;
		--main-text: #b4b4b4;
		--dimer-text: #828282;
		*/
	/*Yellow (colors from petrocompletions)*/
	/*
		--main-color: #FFC700;
		--main-background: #141414;
		--second-background: #202222;
		--hover-background: #353838;
		--main-text: #EFF0F1;
		--dimer-text: #9F9999;
		*/
	/*Yellow 2*/
	/*
		--main-color: #ffc700;
		--main-background: #0a0800;
		--second-background: #0c0a04;
		--hover-background: #0f0d05;
		--main-text: #fffdf5;
		--dimer-text: #fff8e1;
		*/
	/*Ubuntu grey colors*/
	/*
		--main-color: #EF7847;
		--main-background: #312D2A;
		--second-background: #3D3C38;
		--hover-background: #59564D;
		--main-text: #F2F1EF;
		--dimer-text: #E6E5E3;
		*/
	/*Ubuntu purple colors*/
	/*
		--main-color: #EF7847;
		--main-background: #2C071A;
		--second-background: #430B28;
		--hover-background: #520D30;
		--main-text: #F2F1EF;
		--dimer-text: #E6E5E3;
		*/
	/*Orange*/
	/*
		--main-color: #ff6905;
		--main-background: #0a0400;
		--second-background: #0e0702;
		--hover-background: #110903;
		--main-text: #fff9f5;
		--dimer-text: #ffede1;
		*/
	/*Jisho 夜明け colors https://userstyles.org/styles/115621/jisho*/
	/*
		--main-color: #EF7D6C;
		--main-background: #332222;
		--second-background: #2A1B1B;
		--hover-background: #863B2F;
		--main-text: #EFB26C;
		--dimer-text: #986E3F;
		*/
}

/*Changed text highlight*/

::selection {
	background: var(--main-color) !important;
	color: var(--main-text) !important;
}

::-moz-selection {
	background: var(--main-color) !important;
	color: var(--main-text) !important;
}

/*Outline for links*/

a {
	outline-color: var(--main-color) !important;
}

html,
body {
	background: var(--main-background) !important;
	color: var(--main-text) !important;
}

/*Hiding crap*/

/*Ads*/

#divFloatLeft,
#tab-trending>div:nth-child(1),
#divAds2,
#divAds1,
#divAds,
#divFloatRight,
#adsIfrme6,
div.divCloseBut,
#adsIfrme0,
#adsIfrme1,
#adsIfrme2,
#adsIfrme3,
#adsIfrme4,
#adsIfrme5,
#adsIfrme6,
#adsIfrme7,
#adsIfrme8,
#adsIfrme10,
#videoAd,
.videoAdClose,
[id*="BB_S"],
div[class^="#ads-"],
div[class*=" #ads-"],
[class^="#ads-"],
[class*=" #ads-"] {
	display: none !important;
}

body>div:not(#containerRoot) {
	display: none !important;
}

/*Change logo section*/

#head h1 a.logo {
	padding-bottom: 10px !important;
	width: 600px !important;
	margin-top: 0px !important;
	margin-left: 20px !important;
	z-index: 9999 !important;
}

#headnav {
	background: transparent !important;
	margin: 0px !important;
}

#head h1 {
	/*background: url("https://raw.githubusercontent.com/RaitaroH/KissAnime-DeepDark/master/Images/logo.png") !important;*/
	width: 80% !important;
	margin: -100px 10px 0px 0px !important;
}

/*Login*/

#topHolderBox {
	color: var(--main-text) !important;
	background: var(--second-background) !important;
}

#topHolderBox>img:nth-child(1) {
	display: none;
}

#topHolderBox>a {
	color: var(--main-color) !important;
	opacity: .9;
}

#topHolderBox>a:hover {
	opacity: 1 !important;
}

#head>h3:nth-child(1)>div:nth-child(1) {
	margin: -40px 46px 0px 0px !important;
}

/* Serch section */

#search input.button,
#formSearch>div:nth-child(4)>a:nth-child(1)>img:nth-child(1) {
	display: none;
}

#search {
	position: relative !important;
	top: 10px !important;
	right: 60px !important;
	visibility: visible !important;
	z-index: 999 !important;
}

#search a[href="http://kissanime.ru/AdvanceSearch"] {
	position: relative !important;
	top: -30px !important;
	right: -156px !important;
	visibility: visible !important;
	z-index: 999 !important;
	margin-right: 25px !important;
}

#keyword {
	width: calc(100% - 8px) !important;
	margin-left: -8px !important;
	margin-top: -11px !important;
	padding: 8px !important;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	outline: none !important;
}

#result_box a span,
#formSearch>div:nth-child(4)>a:nth-child(1):hover {
	color: var(--main-color) !important;
}

#formSearch>div:nth-child(4)>a:nth-child(1) {
	color: var(--dimer-text) !important;
}

input.text,
.txtSignUp {
	margin: 0px !important;
	color: var(--dimer-text) !important;
	background: var(--second-background) !important;
	box-shadow: 0px 0px 10px var(--main-background) !important;
	transition: none !important;
	border-color: var(--hover-background) !important;
}

input.text:focus,
input.text:active,
input.text:hover,
.txtSignUp:hover,
.txtSignUp:active,
.txtSignUp:focus {
	border: 1px solid var(--main-color) !important;
}

#result_box {
	margin-top: 14px !important;
	opacity: 1;
	width: 88.7% !important;
	background-color: var(--second-background) !important;
	margin-left: -56px !important;
	border-radius: 0px !important;
	box-shadow: var(--shadow) !important;
	/*left: 290px !important;*/
	top: 30px !important;
}

#result_box a {
	position: static !important;
	color: var(--main-text) !important;
}

#result_box a:hover {
	background-color: var(--hover-background) !important;
}

/*Navbar*/

#navbar {
	background: transparent !important;
}

#navcontainer li a#currentTab {
	background: var(--main-color) !important;
}

#navcontainer a:link,
#navcontainer a:visited {
	background: var(--second-background) !important;
}

#navcontainer a:link,
#navcontainer a:visited,
#navsubbar p a {
	color: var(--main-text) !important;
}

#navcontainer li a#currentTab:hover,
#navcontainer a:link:hover,
#navcontainer a:visited:hover,
#navsubbar {
	background: var(--hover-background) !important;
}

#navsubbar p a:hover {
	color: var(--main-color) !important;
}

#navsubbar {
	margin-bottom: 15px !important;
}

.bigBarContainer {
	margin-bottom: 0px !important;
}

/*Big recommended anime*/

.banner,
.barContent,
.bigBarContainer {
	background: var(--second-background) !important;
}

.bigChar,
.dotUnder {
	color: var(--main-color) !important;
	opacity: .9;
}

.bigChar:hover,
.dotUnder:hover {
	opacity: 1 !important;
}

.info,
p {
	color: var(--main-text) !important;
}

#divReload,
#divShowGenre>div:nth-child(2) {
	filter: grayscale(100%);
}

.details a img,
div.items img,
.bigBarContainer {
	border-color: var(--hover-background) !important;
}

.details a img:hover,
div.items img:hover {
	border-color: var(--main-color) !important;
}

/*Latest update, anouncements etc*/

.barTitle,
.rightBox {
	background: var(--second-background) !important;
}

.barTitle,
div.navi,
.barContent a {
	color: var(--main-text) !important;
}

a:visited {
	color: var(--dimer-text) !important;
	opacity: .8;
}

a:visited:hover {
	color: var(--main-color) !important;
	opacity: 1 !important;
}

.arrow-general {
	display: none !important;
}

div.items a {
	color: var(--main-color) !important;
	opacity: .9;
}

div.items a:hover,
.barContent a:hover {
	color: var(--main-color) !important;
	opacity: 1 !important;
}

.textDark,
.barContent .textDark {
	color: var(--dimer-text) !important;
}

.rightBox,
.barTitle {
	border-color: var(--hover-background) !important;
}

/*Next and prev buttons*/

a.next,
#btnNext {
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid var(--main-text);
	background: transparent !important;
}

a.prev,
#btnPrevious {
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-right: 10px solid var(--main-text);
	background: transparent !important;
}

a.next:hover,
#btnNext:hover {
	border-left: 10px solid var(--main-color);
}

a.prev:hover,
#btnPrevious:hover {
	border-right: 10px solid var(--main-color);
}

a.next:before,
#btnNext:before,
a.prev:before,
#btnPrevious:before {
	content: none;
}

/*New and hot and stuff*/

#tabmenucontainer a:link {
	background: var(--second-background) !important;
}

#tabmenucontainer li a.tabactive {
	background: var(--main-color) !important;
}

#tabmenucontainer li a.tabactive:hover,
#tabmenucontainer a:link:hover {
	background: var(--hover-background) !important;
}

#subcontent div a img:hover {
	border-color: var(--main-color) !important;
}

#subcontent span.title,
#tab-trending>div>p>a,
#tab-trending>div>a,
#tab-newest>div>p>a,
#tab-mostview>div>p>a,
#tab-trending>div:nth-child(13)>a:nth-child(1):hover {
	color: var(--main-color) !important;
	opacity: .9;
}

#subcontent span.title:hover,
#tab-trending>div>p>a:hover,
#tab-trending>div>a:hover,
#tab-newest>div>p>a:hover,
#tab-mostview>div>p>a:hover {
	opacity: 1 !important;
}

#tab-trending>div:nth-child(13)>a:nth-child(1) {
	color: var(--main-text) !important;
}

#subcontent div div,
#subcontent {
	background: var(--main-background) !important;
}

#subcontent div div.blue {
	background: var(--second-background) !important;
}

#subcontent div div {
	background-color: transparent !important;
}

/*Are you human*/

#formVerify>div>p>span {
	color: var(--main-color) !important;
}

.imgCapSelect {
	border-color: var(--main-color) !important;
}

/*Video*/

/*.barContent > div:nth-child(1) > div:nth-child(11), .barContent > div:nth-child(1) > .clear, */

.barContent>div:nth-child(1)>.clear2,
#divBookmark>img:nth-child(1) {
	display: none !important;
}

.barContent>div:nth-child(1)>div:nth-child(11) {
	margin-left: -25px !important;
}

.specialButton {
	background: var(--main-color) !important;
	border-color: var(--main-color) !important;
	color: var(--main-text) !important;
	text-shadow: none !important;
}

#containerRoot>div:nth-child(18) {
	height: 50px !important;
}

#containerRoot>div:nth-child(21)>a:nth-child(1) {
	color: var(--main-color) !important;
	opacity: .9;
}

#containerRoot>div:nth-child(21)>a:nth-child(1):hover {
	opacity: 1 !important;
}

select {
	background: var(--main-background) !important;
	border-color: var(--hover-background) !important;
	color: var(--main-text) !important;
}

/*This div thing sometiems appears for some people*/

div [style*="border-color: #4e4e4e !important; position: relative; margin: 0 0 20px 0;"] {
	display: none !important;
}

/*Trying to have the control showing*/

div [style="font-size: 15px; width: 854px; display: inline-block;"] {
	display: inline-block !important;
	opacity: 1 !important;
	visibility: visible !important;
}

#footer {
	background: transparent !important;
}

/*Video player*/

.vjs-default-skin .vjs-play-progress,
.vjs-default-skin .vjs-volume-level {
	background: var(--main-color) !important;
	opacity: 0.8 !important;
}

.vjs-default-skin .vjs-play-progress:hover,
.vjs-default-skin .vjs-volume-level:hover {
	background: var(--main-color) !important;
	opacity: 1 !important;
}

/*Transparency*/

.vjs-default-skin .vjs-control-bar,
.vjs-default-skin .vjs-slider {
	background: rgba(34, 34, 34, .4) !important;
}

.vjs-default-skin .vjs-slider:hover {
	background: rgba(34, 34, 34, .7) !important;
}

/*Aspect ratio change
	.video-js .vjs-tech
	{
		object-fit: fill;
	}
	*/

.vjs-default-skin .vjs-big-play-button {
	background: var(--main-background) !important;
}

.vjs-default-skin .vjs-big-play-button:hover {
	background: var(--main-color) !important;
}

/*Search results*/

.listing tr:hover td {
	color: var(--main-color) !important;
	background-color: var(--hover-background) !important;
}

.listing tr.odd {
	background-color: var(--main-background) !important;
}

.tooltip {
	background: var(--main-background) !important;
	color: var(--main-text) !important;
	border: 1px solid var(--hover-background) !important;
}

.listing tr td>a {
	color: var(--main-color) !important;
}

.listing tr td>a:visited {
	color: var(--dimer-text) !important;
}

.listing tr:hover td>a,
.listing tr td>a:visited:hover {
	color: var(--main-color) !important;
	filter: brightness(110%);
}

.listing th,
div.pagination ul.pager li.current,
div.pagination ul.pager li {
	border-color: var(--hover-background) !important;
}

.alphabet,
div.pagination ul.pager li.current,
div.pagination ul.pager li {
	background: var(--second-background) !important;
	color: var(--main-text) !important;
}

div.pagination ul.pager li a:hover,
div.pagination ul.pager li a:active {
	background: var(--hover-background) !important;
	border-color: var(--hover-background) !important;
}

#btnSubmit,
#btnReset {
	filter: grayscale(100%);
}

/*Bookmark*/

#spanBookmark>img:nth-child(1) {
	display: none;
}

/*Comments*/

div.bigBarContainer:nth-child(7)>div:nth-child(2)>div:nth-child(2)>div:nth-child(1) {
	color: var(--main-color) !important;
}

.dark .comment-policy {
	background: var(--main-background) !important;
	border-color: var(--hover-background) !important;
}

/*User logged in*/

#topHolderBox>span:nth-child(2) {
	color: var(--dimer-text) !important;
}

.boxDropDown,
#menu_box a,
#menu_box {
	z-index: 99999 !important;
	color: var(--main-text) !important;
	background: var(--main-background) !important;
	border-color: var(--hover-background) !important;
	font-weight: normal !important;
}

.aButton {
	background: var(--main-background) !important;
	border-color: var(--hover-background) !important;
	filter: grayscale(0%) !important;
}

#menu_box a:hover,
#topHolderBox>a:hover,
.aButton:hover {
	background: var(--hover-background) !important;
}

#aDropDown>span:nth-child(1)>small:nth-child(2) {
	color: var(--main-color) !important;
}

#nextEpisodeCountDown {
	color: var(--main-color) !important;
}

div.bigBarContainer:nth-child(4)>div:nth-child(2)>div:nth-child(2)>div:nth-child(7)>div:nth-child(2) {
	color: var(--main-text) !important;
}

Applies to:

• kissanime.ru
• kissmanga.com

Stylish extension link:

• https://chrome.google.com/webstore/detail/stylish-custom-themes-for/fjnbnpbmkenffdnngjfgmeleoegfcffe