/* Webkit-based browsers */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-thumb {
    background-color: #4a4a4a;
    border: 2px solid #ffffff;
    border-radius: 10px;
    box-shadow: 0px 3px 2px -3px #555, inset 0 0 4px #000, inset 0 0 3px 3px #000000b3;
}

.dark-mode ::-webkit-scrollbar-thumb {
    background-color: #999;
    box-shadow: 0px 3px 2px -3px #999, inset 0 0 4px #000, inset 0 0 3px 3px #FFF;
}

::-webkit-scrollbar-thumb:active {
    background-color: #2c2c2c;
}

::-webkit-scrollbar-track {
    background-color: transparent;
    border: 1px solid #ffffff;
    box-shadow: 0px 3px 2px -3px #555, inset 0 0 4px #000, inset 0 0 3px 3px #000000b3;
}

::-webkit-scrollbar-track:active {
    background-color: transparent;
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #4a4a4a transparent;
}

.dark-mode * {
    scrollbar-color: #999 transparent;
}

/* Internet Explorer and Edge */
* {
    -ms-overflow-style: none; /* Disable scrollbar styling */
}

body::-webkit-scrollbar {
    display: none; /* Hide the default scrollbar */
}

.scrollbar-style.secondary {
    scrollbar-color: #555 transparent;
}

.scrollbar-style.secondary::-webkit-scrollbar-thumb:active {
    background-color: #444;
}

/* Extra Theme mostly unused classes */
.outterShadow {
	-webkit-box-shadow: 4px 4px 3px -3px black;
	   -moz-box-shadow: 4px 4px 3px -3px black;
	        box-shadow: 4px 4px 3px -3px black;
}

.inneroutterGlow {
	-webkit-box-shadow: inset 0 0 6px #999,8px 8px 6px -6px black;
	   -moz-box-shadow: inset 0 0 6px #999,8px 8px 6px -6px black;
			box-shadow: inset 0 0 6px #999,8px 8px 6px -6px black;
}

.innerGlow {
	-webkit-box-shadow: inset 0 0 6px #FFF;
	   -moz-box-shadow: inset 0 0 6px #FFF;
			box-shadow: inset 0 0 6px #FFF;
}

.outterBox {
	-webkit-box-shadow: 0 8px 6px -6px black;
	   -moz-box-shadow: 0 8px 6px -6px black;
	        box-shadow: 0 8px 6px -6px black;
}

.innerBox {
	-moz-box-shadow:   inset 0 0 3px #000;
   -webkit-box-shadow: inset 0 0 3px #000;
   box-shadow:         inset 0 0 3px #000;
}

.outterSettings {
	-webkit-box-shadow: -5px 6px 5px -5px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow: -5px 6px 5px -5px rgba(0, 0, 0, 0.5);
			box-shadow: -5px 6px 5px -5px rgba(0, 0, 0, 0.5);
}

.inneroutter {
	-webkit-box-shadow: inset 0 0 3px #000,2px -4px 6px -6px black;
	   -moz-box-shadow: inset 0 0 3px #000,2px -4px 6px -6px black;
			box-shadow: inset 0 0 3px #000,2px -4px 6px -6px black;
}

.innerOutterShadows {
	border-style: 		none;
	-webkit-box-shadow: -1px 0 4px -1px #999, inset 0 0 4px #000;
	   -moz-box-shadow: -1px 0 4px -1px #999, inset 0 0 4px #000;
			box-shadow: -1px 0 4px -1px #999, inset 0 0 4px #000;
}

.innerOutterShadowsButton {
	-webkit-box-shadow: 0px 3px 2px -3px #999, inset 0 0 4px #000, inset 0 0 3px 3px #000000b3;
	   -moz-box-shadow: 0px 3px 2px -3px #999, inset 0 0 4px #000, inset 0 0 3px 3px #000000b3;
			box-shadow: 0px 3px 2px -3px #999, inset 0 0 4px #000, inset 0 0 3px 3px #000000b3;
}

.innerOutterShadowsUser {
	border-style: 		none;
	-webkit-box-shadow: 0px 3px 2px -3px #999, inset 0 -4px #000, inset 0 0 3px 4px #000000b3;
	   -moz-box-shadow: 0px 3px 2px -3px #999, inset 0 -4px #000, inset 0 0 3px 4px #000000b3;
			box-shadow: 0px 3px 2px -3px #999, inset 0 -4px #000, inset 0 0 3px 4px #000000b3;
}

/* Dark Mode */
.dark-mode .outterShadow {
	-webkit-box-shadow: 4px 4px 3px -3px white;
	   -moz-box-shadow: 4px 4px 3px -3px white;
	        box-shadow: 4px 4px 3px -3px white;
}

.dark-mode .inneroutterGlow {
	-webkit-box-shadow: inset 0 0 6px #999,8px 8px 6px -6px white;
	   -moz-box-shadow: inset 0 0 6px #999,8px 8px 6px -6px white;
			box-shadow: inset 0 0 6px #999,8px 8px 6px -6px white;
}

.dark-mode .innerGlow {
	-webkit-box-shadow: inset 0 0 6px #FFF;
	   -moz-box-shadow: inset 0 0 6px #FFF;
			box-shadow: inset 0 0 6px #FFF;
}

.dark-mode .outterBox {
	-webkit-box-shadow: 0 8px 6px -6px white;
	   -moz-box-shadow: 0 8px 6px -6px white;
	        box-shadow: 0 8px 6px -6px white;
}

.dark-mode .innerBox {
	-moz-box-shadow:   inset 0 0 3px #fff;
   -webkit-box-shadow: inset 0 0 3px #fff;
   box-shadow:         inset 0 0 3px #fff;
}

.dark-mode .outterSettings {
	-webkit-box-shadow: -5px 6px 5px -5px rgba(255, 255, 255, 0.5);
	   -moz-box-shadow: -5px 6px 5px -5px rgba(255, 255, 255, 0.5);
			box-shadow: -5px 6px 5px -5px rgba(255, 255, 255, 0.5);
}

.dark-mode .inneroutter {
	-webkit-box-shadow: inset 0 0 3px #fff,2px -4px 6px -6px white;
	   -moz-box-shadow: inset 0 0 3px #fff,2px -4px 6px -6px white;
			box-shadow: inset 0 0 3px #fff,2px -4px 6px -6px white;
}

.dark-mode .innerOutterShadows {
	border-style: 		none;
	-webkit-box-shadow: -1px 0 4px -1px #999, inset 0 0 4px #fff;
	   -moz-box-shadow: -1px 0 4px -1px #999, inset 0 0 4px #fff;
			box-shadow: -1px 0 4px -1px #999, inset 0 0 4px #fff;
}

.dark-mode .innerOutterShadowsButton {
	-webkit-box-shadow: 0px 3px 2px -3px #999, inset 0 0 4px #fff, inset 0 0 3px 3px #ffffffb3;
	   -moz-box-shadow: 0px 3px 2px -3px #999, inset 0 0 4px #fff, inset 0 0 3px 3px #ffffffb3;
			box-shadow: 0px 3px 2px -3px #999, inset 0 0 4px #fff, inset 0 0 3px 3px #ffffffb3;
}

.dark-mode .innerOutterShadowsUser {
	border-style: 		none;
	-webkit-box-shadow: 0px 3px 2px -3px #999, inset 0 -4px #fff, inset 0 0 3px 4px #ffffffb3;
	   -moz-box-shadow: 0px 3px 2px -3px #999, inset 0 -4px #fff, inset 0 0 3px 4px #ffffffb3;
			box-shadow: 0px 3px 2px -3px #999, inset 0 -4px #fff, inset 0 0 3px 4px #ffffffb3;
}

.biblesOutline {
	-webkit-box-shadow: 8px 8px 6px -6px black;
	   -moz-box-shadow: 8px 8px 6px -6px black;
			box-shadow: 8px 8px 6px -6px black;
}

.dark-mode .biblesOutline {
	-webkit-box-shadow: 8px 8px 6px -6px white;
	   -moz-box-shadow: 8px 8px 6px -6px white;
			box-shadow: 8px 8px 6px -6px white;
}



.round {
	-webkit-border-radius:	10px;
	   -moz-border-radius:	10px;
	        border-radius:	10px;
}

.round3 {
	-webkit-border-top-left-radius:		10px;
	-webkit-border-top-right-radius:	0;
	-webkit-border-bottom-right-radius:	10px;
	-webkit-border-bottom-left-radius:	10px;
	   -moz-border-radius-topleft:		10px;
	   -moz-border-radius-topright:		0;
	   -moz-border-radius-bottomright:	10px;
	   -moz-border-radius-bottomleft:	10px;
	        border-top-left-radius:		10px;
	        border-top-right-radius:	0;
	        border-bottom-right-radius:	10px;
	        border-bottom-left-radius:	10px;
}

.topround {
	-webkit-border-top-left-radius:		10px;
	-webkit-border-top-right-radius:	10px;
	   -moz-border-radius-topleft:		10px;
	   -moz-border-radius-topright:		10px;
	        border-top-left-radius:		10px;
	        border-top-right-radius:	10px;
}

.topleft {
	-webkit-border-top-left-radius:	10px;
	   -moz-border-radius-topleft:	10px;
	        border-top-left-radius:	10px;
}

.bottomleft {
	-webkit-border-bottom-left-radius:	10px;
	   -moz-border-radius-bottomleft:	10px;
	        border-bottom-left-radius:	10px;
}

.bottomright {
	-webkit-border-bottom-right-radius:	10px;
	   -moz-border-radius-bottomright:	10px;
	        border-bottom-right-radius:	10px;
}

.topright {
	-webkit-border-top-right-radius:	10px;
	   -moz-border-radius-topright:		10px;
	        border-top-right-radius:	10px;
}

.bottomround {
	-webkit-border-bottom-left-radius:	10px;
	-webkit-border-bottom-right-radius:	10px;
	   -moz-border-radius-bottomleft:	10px;
	   -moz-border-radius-bottomright:	10px;
	        border-bottom-left-radius:	10px;
	        border-bottom-right-radius:	10px;
}

.leftround {
	-webkit-border-bottom-left-radius:	10px;
	   -moz-border-radius-bottomleft:	10px;
	        border-bottom-left-radius:	10px;
	-webkit-border-top-left-radius:		10px;
	   -moz-border-radius-topleft:		10px;
	        border-top-left-radius:		10px;
}

.rightround {
	-webkit-border-bottom-right-radius:	10px;
	   -moz-border-radius-bottomright:	10px;
	        border-bottom-right-radius:	10px;
	-webkit-border-top-right-radius:	10px;
	   -moz-border-radius-topright:		10px;
	        border-top-right-radius:	10px;
}

.pad {
    padding: 5px 15px;
}