Modern www.jw.org by unviray

/* ==UserStyle==
@name           www.jw.org - 17/03/2023, 10:14:11
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */
@-moz-document domain("www.jw.org") {
	.ms-ROMAN,
	.jwac.ms-ROMAN {
		font-family: Roboto, Arial, "Arial Unicode MS", sans-serif;
	}
	
	.wrapperShadow {
		box-shadow: none!important;
	}

	#regionHeader {
		position: sticky;
		top: 0px;
		z-index: 30;
	}
	#regionPrimaryNav {
		position: sticky;
		top: 48px;
		z-index: 20;
		backdrop-filter: blur(24px);
	}
	#primaryNavRegion {
		background-color: transparent;
	}

	.billboardButton,
	.medicalSidebarButton,
	.donateButton,
	.whatsNewButton,
	.conventionReleasesButton,
	.appsButton {
		padding: 8px 16px;
		border-radius: 8px;
		transition: all 300ms;
	}

	.primaryButton:hover {
		border-radius: 4px;
	}
	.primaryNavItem > a .iconLink-text {
		width: 0px;
		height: 0px;
		padding: 0px;
		margin: 0px;
		overflow-x: hidden;
	}
	.primaryNavItem > a {
		margin-top: 4px;
		margin-bottom: 4px;
		border-radius: 8px;
	}
	.primaryNavItem > a:hover,
	.primaryNavItem > a:focus {
		background-color: var(--ct-menu-highlight);
	}
	.primaryNavItem > a .iconLink-icon {
		margin-top: -4px;
		margin-bottom: -4px;
		padding-left: 8px;
		padding-right: 8px;
		margin-right: 0px;
	}
	.primaryNavItem > a .iconLink-icon {
		color: var(--du-color--textDefault, #292929);
	}
	.primaryNavItem > a:hover .iconLink-icon,
	.primaryNavItem > a:focus .iconLink-icon {
		color: var(--du-color--textDefault, #292929);
	}
	.synopsis .syn-img {
		border-radius: 8px;
		transition: all 300ms;
		overflow: hidden;
	}
	.synopsis .syn-img:hover {
		border-radius: 4px;
	}
	.cc-theme--light {
		--ct-primaryNav-bgColor: #E0E0E0E0;
		--ct-menu-highlight: #00000010;
		--ct-body-bgColor: white;
	}
	.cc-theme--dark {
		--ct-primaryNav-bgColor: #292929E0;
		--ct-menu-highlight: #ffffff20;
		--ct-body-bgColor: #121212;
	}
	@media (prefers-color-scheme: light) {
		:root {
			--ct-primaryNav-bgColor: #E0E0E0E0;
			--ct-menu-highlight: #00000010;
			--ct-body-bgColor: white;
		}
	}
	@media (prefers-color-scheme: dark) {
		:root {
			--ct-primaryNav-bgColor: #292929E0;
			--ct-menu-highlight: #ffffff20;
			--ct-body-bgColor: #121212;
		}
	}
}