/*┏━━━━━━━━━━━━━━━❘ × ⋆⋅☆⋅⋆ × ❘━━━━━━━━━━━━━━━┓
/*                                   Toolbar
/*┗━━━━━━━━━━━━━━❘ × SECTION × ❘━━━━━━━━━━━━━┛*/

.toolbar {
	/* Display and Visibility */
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	overflow: clip;
	object-fit: fit-content;
	/* Box Model (from outside in) */
	padding-bottom: 10px;
	/* Background */
	background: var(--color-black);
	color: var(--color-white);
	}

/* Media Query for mobile responsiveness */
@media only screen and (max-width : 800px) { 
	.toolbar { font-size: 0.7em; }
	}
	
.toolbar-label { text-align: center; }

.toggleSwitch span span { display: none; }  

.toggleSwitch {
	display: inline-block;
	height: auto;
	position: relative;
	cursor: pointer;
	width: 7em;
	background-color: #fafafa;
	border: 1px solid #ccc;
	border-radius:5px;
	user-select: none;
	}

.toggleSwitch label,
.toggleSwitch > span {
	vertical-align: middle;
    }
	
.toggleSwitch label {
	position: relative;
	z-index: 3;
	display: block;
	width: 100%;
    }

.toggleSwitch > span span {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
	display: block;
	width: 50%;
	font-size: 0.8em;
	width: auto;
	left: 0;
	top: -1px;
	opacity: 1;
	text-align: center;
	}

.toggleSwitch a {
	position: absolute;
	right: 50%;
	z-index: 4;
	display: block;
	top: 3px;
	bottom: 3px;
	padding: 0;
	left: 3px;
	width: 50%;
	background-color: #666;
	border-radius: 4px;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }
	
.toggleSwitch > span span:first-of-type {
	color: #FFF;
	opacity: 1;
	left: 0;
	width: 50%;
    }

.toggleSwitch > span span:last-of-type {
	left:auto;
	right:0;
	color: #999;
	width: 50%;
    }
	
.toggleSwitch > span:before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: -2px;
	background-color: #fafafa;
	border: 1px solid #ccc; 
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
    }
	
.toggleSwitch input:checked ~ a { left: calc(50% - 3px); }
  
.toggleSwitch input:checked ~ span span:first-of-type {
	left:0;
	color:#999;
    }

.toggleSwitch input:checked ~ span span:last-of-type {
	opacity: 1;
	color:#FFF;
    }

/* Switch to plain fonts
/*꒷꒦˘꒷꒦꒷˘꒦꒷꒦˘꒦˘꒷꒦꒷❘ × SUBSECTION × ❘˘꒷꒦˘꒷꒦꒷˘꒦꒷꒦˘꒦˘꒷꒦꒷ */
.plain-text * { font-family: tahoma, verdana, arial, sans-serif; }
 
/* Book-like text alignment 
/*꒷꒦˘꒷꒦꒷˘꒦꒷꒦˘꒦˘꒷꒦꒷❘ × SUBSECTION × ❘˘꒷꒦˘꒷꒦꒷˘꒦꒷꒦˘꒦˘꒷꒦꒷ */
.justify-text main:not(h1, h2, h3, h4, h5, h6) {
	text-indent: 1.5rem; 
	text-align: justify; 
	}