body.light-mode {
	background-color: white;
	color: black;
}
body.light-mode #optionsbar .option {
	border: 1px solid black;
}
body.light-mode #screen {
	background-color: #ACACAC;
	border: 1px solid black;
}
body.light-mode #screen #grid {
	background-color: rgba(0,0,0,0);
}
body.light-mode #layersContainer {
	border-right: 1px solid black;
}
body.light-mode .selected-layer {
	box-shadow: 0px 0px 1px 2px #9C27B0;
	background-color: #69d9dc;
}
body.light-mode #layers canvas {
	border: 1px solid black;
}
body.light-mode #statusbar {
	background-color: #8c8c8c59;
}
body.light-mode .status-color {
	border: 1px solid black;
}
body.light-mode .slider-span {
	color: black;
}
body.light-mode .slider {
	--SliderColor: black;
	background-image: linear-gradient(to right, rgba(0,0,0,0), black);
}
body.light-mode .slider::-webkit-slider-thumb {
	border: 1px solid black;
}
body.light-mode .slider::-moz-range-thumb {
	border: 1px solid black;
}
body.light-mode .color-button {
	border: 1px solid black;
}
body.light-mode .foreground-overlay::after {
	color: #770419;
}
body.light-mode .previewItem canvas {
	background-color: rgba(0, 0, 0, 0) !important;
	border: 1px inset black;
}
body.light-mode .selected-color {
	box-shadow: 0px 4px 0px -2px #FFFFFF,
				0px -4px 0px -2px #FFFFFF,
				4px 0px 0px -2px #FFFFFF,
				-4px 0px 0px -2px #FFFFFF,
				0px 0px 0px 2px rgb(1, 80, 94),
				0px 0px 0px 2px rgba(255,0,0,0);
	color: white;
}
body.light-mode .sel-color-1, body.light-mode .sel-color-2 {
	text-shadow: 0px 0px 4px black;
}
body.light-mode #tools {
	border-bottom: 1px solid black;
}
body.light-mode .selected-tool {
	box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.85);
}
body.light-mode .tool-button {
	border: 1px solid black;
}
body.light-mode #dragOverPopup {
	background-color: rgba(0, 0, 0, 0.25);
}
body.light-mode #dragOverPopup div {
	border: 4px dashed black;
}
body.light-mode #dragOverPopup h1 {
	color: #901e02;
}
body.light-mode #modalPopup {
	background-color: rgba(0, 0, 0, 0.5);
}
body.light-mode .imagePopup {
	border: 2px solid black;
	background-color: white;
}
body.light-mode .newImageSpritesheetSection {
	border-bottom: 1px solid black;
}
body.light-mode #loadImageViewer > canvas, body.light-mode #workspacePreview > canvas {
	background-color: rgba(0 , 0, 0, 0) !important;
}
body.light-mode .error {
	color: red;
	font-weight: bold;
}
body.light-mode #loadingDiv {
	background-color: rgba(33, 22, 226, 1);
	color: white;
}
body.light-mode .clickOptionContainer > div {
	border: 1px solid black;
}
body.light-mode .selected-clickOption {
	border: 1px solid rgb(0, 114, 114);
	background-color: rgba(33, 22, 226, 0.25);
}
body.light-mode #selectorAngle {
	color: white;
	text-shadow: 0px 0px 14px black, 1px 1px 4px red, 0 0 6px blue, 0 0 2px blue;
}
body.light-mode .colorPicker {
	border: 1px solid black;
}
body.light-mode .colorPicker div {
	background-color: red;
}
body.light-mode #animatorPopup {
	border: 1px solid black;
	background-color: white;
}
body.light-mode #animatorControls {
	background-color: #8fbea0;
}
body.light-mode #animatorFrames canvas {
	border: 1px solid black;
}
body.light-mode #animatorPickFrame {
	border: 1px solid black;
	background-color: white;
}
body.light-mode #animatorSelectFrame canvas {
	border: 1px solid black;
}
body.light-mode #helpPopup {
	background-color: white;
}
body.light-mode .helpNavigation {
	border-bottom: 1px solid black;
}
body.light-mode .helpNavButton {
	border: 1px solid black;
}
body.light-mode .helpNavButton:hover {
	background-color: rgba(225,225,225,0.9);
}
body.light-mode #shapeSquare div {
	background-color: black;
}