:root {
	--default-theme-display-width:400px;
	--default-left-button-width:25px;
	--default-directory-font-size:14pt;
	--default-file-font-size:18px;
	--default-createTheme-field-background:#FFFFD8;
	--default-createTheme-fieldWidth:95%;
	--default-border:solid 1pt black;
}
.abbreviatedPluginName {
	font-weight:bold;
	font-style:italic;
	color:#000090;
}
.welcomeToCTH {
	font-size:16pt;
	text-align:center;
}
/*
 ***************************************
 *                                     *
 * Child Themes Helper main page       *
 *                                     *
 ***************************************
*/
#pas_cth_content {
	width:100%;
	overflow-y:scroll;
}
#screenShotOptions {
	width:100%;
	height:100%;
	overflow-y:scroll;
}
#themeGrid {
	overflow:scroll;
}
.pas-grid-container {
  display: inline-grid;
  background-color:inherit;
  color:black;
  padding: 10px;
  width:100%;
}
.pas-grid-item-child, .pas-grid-item-parent {
  background-color: rgba(255, 255, 255, 1);
/*  border: 1px solid rgba(0, 0, 0, 0.1); */
  color:black;
  padding: 20px;
  text-align: left;
  margin-bottom:50px;
}
.pas-grid-item-child {
	border-left:var(--default-border);
	border-top:var(--default-border);
	border-bottom:var(--default-border);
	border-right:dashed 1pt rgba(200,200,200,0.5);
}
.pas-grid-item-parent {
	border-top:var(--default-border);
	border-right:var(--default-border);
	border-bottom:var(--default-border);
	border-left:dashed 1pt rgba(200,200,200,0.5);
}
.pas-grid-left-column {
  background-color:white;
  color:black;
  text-align: left;
}
/*
 * "child" and "parent" prompt on the left top of the screen when using a single column due to width restraints
 */
.childPrompt, .parentPrompt {
	background-color:black;
	color:white;
	text-align:center;
	font-size:var(--default-font-size);
	font-weight:bold;
	font-family:monospace;
	height:125px;
	writing-mode:vertical-lr;
	text-orientation:upright;
	cursor:pointer;
}
.childPrompt {
	border-bottom:solid 1pt white;
}
.parentPrompt {
	border-top:solid 1pt white;
}
.themeName {
	color:#990000;
	border-top:solid 1pt #990000;
	border-bottom:solid 1pt #990000;
	text-align:center;
	margin-top:0px;
}
.pasChildTheme_HDR {
	font-variant:small-caps;
	text-align:center;
	width:100%;
	color:#990000;
	margin-top:-10px;
}
.actionReminder {
	position:relative;
	font-weight:normal;
	text-align:center;
	width:100%;
	color:#FF0000;
	margin-bottom:0px;
}
.innerCellLeft, .innerCellRight {
	text-align:left;
}
#pas_cth_actionBox, .errorMessageBox, #invalidFileTypeMessage {
	position:fixed;
	background-color:rgba(255,255,240,1);
	border:solid 1pt black;
	color:black;
	display:inline;
	visibility:visible;
	overflow:hidden;
}
#popupErrorMessage {
	position:fixed;
	left:50%;
	top:50%;
	background-color:rgba(255,255,240,1);
	border:solid 1pt black;
	color:black;
	display:inline;
	visibility:visible;
	overflow:hidden;
	width:240px;
	height:80px;
	margin-left:-120px;
	margin-top:-40px;
	border:solid 1pt red;
	border-radius:15px;
	box-shadow:10px 10px 10px rgba(100, 0, 0, .5);
	padding:10px 10px 10px 10px;
	font-size:12pt;
	font-weight:bold;
}
#popupErrorMessage P {
	margin:0px;
	padding:0px 10px 0px 0px;
	color:red;
	font-size:12pt;
	font-weight:bold;
	position:absolute;
	bottom:0px;
	right:0px;
	cursor:pointer;
}
#screenshotBox {
	position:fixed;
	left:50%;
	top:50%;
	width:450px;
	height:350px;
	margin-left:-225px;
	margin-top:-175px;
	text-align:center;
	background-color:white;
	border:solid 1pt black;
	border-radius:15px;
	box-shadow:0px 0px 50px rgba(0, 0, 0, 1);
}
#screenshotBox img {
	width:421px;
	height:315px;
	position:absolute;
	top:17px;
	left:13px;
}
#screenshotBox P {
	font-size:12pt;
	font-weight:bold;
	color:red;
	position:absolute;
	bottom:0px;
	right:0px;
	padding:0px 15px 0px 0px;
	margin:0px;
	cursor:pointer;
}
/*
 * #hoverPrompt, #innerLine, .redHighlight, .actionPrompt are all used with
 * @media (min-width:830px) ONLY. #hoverPrompt is display:none for all other
 * media rules.
 */
#hoverPrompt {
	visibility:visible;
	background-color:rgba(250, 250, 250, .5);
	color:black;
	text-align:center;
	position:fixed;
	border:solid 1pt black;
	border-radius:10px;
	box-shadow:4px 4px 8px #909090;
}
#innerLine {
	width:100%;
	text-align:left;
	margin:5px 0px 0px 2px;
	border-top:solid 1pt #909090;
	background-color:white;
}
.redHighlight {
	color:red;
	font-weight:bold;
	font-size:12pt;
}
.actionPrompt {
	font-weight:bold;
	font-style:italic;
}
.fileHighlight {
	font-family:monospace;
	font-weight:normal;
	text-align:left;
	margin:0px 0px 0px 0px;
	line-height:13px;
}
p.file {
	line-height:15px;
	margin:5px;
	cursor:pointer;
}
p.pas_cth_directory {
	line-height:15px;
	margin:10px 0px 5px 0px;
}
#dismissBox {
	border:solid 1px black;
	font-variant:small-caps;
	color:black;
	background-color:white;
	text-align:center;
}
.tipBox {
	width:50px;
	height:50px;
	text-align:center;
	line-height:50px;
	font-family:monospace;
	font-size:18pt;
	border:solid 1pt black;
	border-radius:10px;
	background-color:white;
	color:black;
	box-shadow:3px 3px 6px #909090;
	position:absolute;
}
/*
 * Full width display, full size, only uses about 825px.
 */
.createChildThemeBox {
	color:black;
	display:inline-block;
	width:100%;
	margin-top:20px;
}
.createChildThemeBoxForm {
	background-color:white;
	margin:0px;
	padding:10px;
	border:solid 1pt black;
	width:100%;
	font-family:arial;
	font-size:14pt;
}
.createChildThemeBoxForm_HDR {
	width:100%;
	text-align:center;
	font-weight:bold;
	font-variant:small-caps;
	color:black;
	font-size:12pt;
}
.createChildThemeBox input[type=text] {
	background-color:var(--default-createTheme-field-background);
	color:black;
	margin-bottom:8px;
	box-shadow:2px 4px 4px darkgray;
}
.createChildThemeBox textarea {
	border-radius:25px;
	background-color:var(--default-createTheme-field-background);
	color:black;
	font-size:12pt;
	margin-bottom:8px;
	width:var(--default-createTheme-fieldWidth);
	height:70px;
	padding:15px 20px 15px 20px;
	box-shadow:2px 4px 4px darkgray;
	resize:none;
}
.createChildThemeBox select {
	background-color:var(--default-createTheme-field-background);
	color:black;
	font-size:12pt;
	margin-bottom:8px;
	width:var(--default-createTheme-fieldWidth);
	box-shadow:2px 4px 4px darkgray;
	border-radius:25px;
}
.createChildThemeBox label {
	font-family:courier-new;
	font-size:12pt;
	font-weight:bold;
	font-style:italic;
	color:black;
}
.pas_cth_errorCondition {
	background-color:#FFFF90;
}
@media (min-width:830px) {
	.pasChildTheme_HDR {
		font-size:24pt;
		font-weight:bold;
	}
	.themeName {
		font-size:14pt;
	}
	.actionReminder {
		top:-35px;
		font-size:10pt;
	}
	.pas-grid-container {
		grid-template-columns: 0px var(--default-theme-display-width) var(--default-theme-display-width);
	}
	.childPrompt, .parentPrompt {
		display:none;
	}
	.pas-grid-item-parent {
		display:inline;
	}
	#pas_cth_actionBox, .errorMessageBox, #invalidFileTypeMessage {
		box-shadow:10px 20px 50px #C09090;
		border-radius:25px;
		font-size:10pt;
		top:50%;
		left:50%;
		width:450px;
		height:200px;
		margin-left:-225px;
		margin-top:-100px;
		padding:10px 25px 15px 25px;
	}
	.pas_cth_directory {
		font-style:italic;
		font-size:var(--default-directory-font-size);
		color:#990000;
		white-space:nowrap;
	}
	.file {
		width:100%;
		font-size:var(--default-file-font-size);
		overflow:visible;
	}
	#hoverPrompt {
		width:350px;
		height:100px;
		font-size:12pt;
	}
	#innerLine {
		margin:5px 0px 0px 2px;
		border-top:solid 1pt #909090;
	}
	.redHighlight {
		font-weight:bold;
		font-size:12pt;
	}
	.fileHighlight {
		font-size:12pt;
		font-weight:bold;
	}
	#dismissBox {
		border-radius:10px;
		box-shadow:3px 3px 6px darkgray;
		font-family:courier-new;
		font-size:12pt;
		width:75px;
		padding:5px;
		position:absolute;
		bottom:10px;
		right:20px;
	}
	.warningHeading, #errorMessageHeader {
		font-size:18pt;
		font-weight:bold;
		font-variant:small-caps;
		color:#500000;
		text-align:center;
		width:100%;
		line-height:25px;
		display:inline-block;
		margin:10px 0px 0px 0px;
	}
	.fileHighlight {
		font-size:12pt;
		font-variant:small-caps;
		margin:0px 0px 0px 0px;
	}
	.emphasize {
		font-weight:bold;
		text-decoration:underline double;
		margin:10px 0px 30px 0px;
		width:100%;
		text-align:center;
	}
	.buttonRow {
		width:100%;
		text-align:center;
	}
	.blueButton {
		font-family:courier-new;
		font-size:12pt;
		background-color:blue;
		color:white;
		width:150px;
		border-radius:15px;
		box-shadow:3px 3px 3px #8080FF;
	}
	.wideBlueButton {
		font-family:courier-new;
		font-size:12pt;
		background-color:blue;
		color:white;
		width:250px;
		border-radius:15px;
		box-shadow:3px 3px 3px #8080FF;
	}
	.createChildThemeBox {
		width:500px;
		font-size:14pt;
	}
	.createChildThemeBox input[type=text] {
		border-radius:15px;
		font-size:14pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox textarea {
		border-radius:15px;
		font-size:14pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox select {
		border-radius:15px;
		font-size:14pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox label {
		font-size:12pt;
	}

}
@media (min-width:240px) and (max-width:500px) {
	.createChildThemeBox {
		width:100%;
	}
}
/*
 * Reduce the font sizes and box sizes for a smaller device view.
 */
@media (min-width:350px) and (max-width:829px) {
	.pasChildTheme_HDR {
		font-size:18pt;
		font-weight:bold;
	}
	.pas-grid-container {
		grid-template-columns: 25px 400px 0px;
	}
	.themeName {
		font-size:12pt;
	}
	.actionReminder {
		top:-35px;
		font-size:10pt;
	}
	.childPrompt, .parentPrompt {
		display:inline;
	}
	.pas-grid-item-parent {
		display:none;
	}
	#pas_cth_actionBox, .errorMessageBox, #invalidFileTypeMessage {
		box-shadow:5px 8px 16px #C09090;
		border-radius:15px;
		font-size:8pt;
		top:50%;
		left:50%;
		width:300px;
		height:200px;
		margin-left:-150px;
		margin-top:-100px;
		padding:4px 4px 4px 4px;
	}
	.pas_cth_directory {
		font-style:italic;
		font-size:12pt;
		color:#990000;
		white-space:nowrap;
	}
	.file {
		width:100%;
		font-size:10pt;
		overflow:visible;
	}
	#hoverPrompt {
		display:none;
	}
	.warningHeading, #errorMessageHeader {
		font-size:14pt;
		font-weight:bold;
		font-variant:small-caps;
		color:#500000;
		text-align:center;
		width:100%;
		line-height:20px;
		display:inline-block;
		margin:10px 0px 0px 0px;
	}
	.fileHighlight {
		font-size:10pt;
		margin:0px 0px 0px 0px;
	}
	.emphasize {
		font-weight:bold;
		text-decoration:underline double;
		margin:10px 0px 20px 0px;
		width:100%;
		text-align:center;
	}
	.buttonRow {
		width:100%;
		text-align:center;
	}
	.blueButton {
		font-family:courier-new;
		font-size:10pt;
		background-color:blue;
		color:white;
		width:100px;
		border-radius:10px;
		box-shadow:3px 3px 3px #8080FF;
	}
	.wideBlueButton {
		font-family:courier-new;
		font-size:10pt;
		background-color:blue;
		color:white;
		width:150px;
		border-radius:10px;
		box-shadow:3px 3px 3px #8080FF;
	}
	.createChildThemeBox {
		font-size:12pt;
	}
	.createChildThemeBox input[type=text] {
		border-radius:15px;
		font-size:12pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox textarea {
		border-radius:15px;
		font-size:12pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox select {
		border-radius:15px;
		font-size:12pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox label {
		font-size:10pt;
	}
}
@media (min-width:239px) and (max-width:349px) {
	.pasChildTheme_HDR {
		font-size:10pt;
		font-weight:bold;
	}
	.pas-grid-container {
		grid-template-columns: 25px 215px 0px;
	}
	.themeName {
		font-size:10pt;
	}
	.actionReminder {
		top:-15px;
		font-size:8pt;
	}
	.childPrompt, .parentPrompt {
		display:inline;
	}
	.pas-grid-item-parent {
		display:none;
	}
	#pas_cth_actionBox, .errorMessageBox, #invalidFileTypeMessage {
		box-shadow:5px 8px 16px #C09090;
		border-radius:8px;
		font-size:6pt;
		top:50%;
		left:50%;
		width:200px;
		height:240px;
		margin-left:-100px;
		margin-top:-120px;
		padding:4px 4px 4px 4px;
	}
	.pas_cth_directory {
		font-style:italic;
		font-size:10pt;
		color:#990000;
		white-space:nowrap;
	}
	.file {
		width:100%;
		font-size:8pt;
		overflow:visible;
	}
	#hoverPrompt {
		display:none;
	}
	.warningHeading, #errorMessageHeader {
		font-size:12pt;
		font-weight:bold;
		font-variant:small-caps;
		color:#500000;
		text-align:center;
		width:100%;
		line-height:15px;
		display:inline-block;
		margin:8px 0px 0px 0px;
	}
	.fileHighlight {
		font-size:8pt;
		margin:0px 0px 0px 0px;
	}
	.emphasize {
		font-weight:bold;
		text-decoration:underline double;
		margin:7px 0px 14px 0px;
		width:100%;
		text-align:center;
	}
	.buttonRow {
		width:100%;
		text-align:center;
	}
	.blueButton {
		font-family:courier-new;
		font-size:8pt;
		background-color:blue;
		color:white;
		width:80px;
		border-radius:10px;
		box-shadow:3px 3px 3px #8080FF;
	}
	.wideBlueButton {
		font-family:courier-new;
		font-size:8pt;
		background-color:blue;
		color:white;
		width:120px;
		border-radius:10px;
		box-shadow:3px 3px 3px #8080FF;
	}
	.createChildThemeBox {
		font-size:10pt;
	}
	.createChildThemeBox input[type=text] {
		border-radius:10px;
		font-size:10pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox textarea {
		border-radius:10px;
		font-size:10pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox select {
		border-radius:10px;
		font-size:10pt;
		width:var(--default-createTheme-fieldWidth);
	}
	.createChildThemeBox label {
		font-size:8pt;
	}
}
/*
 * The minimum sized device on the market, is the Apple Watch at 240px x 240px.
 * This plugin will show as blank for anything smaller than 240px in the horizontal or vertical direction.
 */
@media (max-width:239px) and (max-height:239px) {
	.pas-grid-container {
		display:none;
	}
	.createChildThemeBox {
		display:none;
	}
}
/*
 ***************************************
 *                                     *
 *  File Listing styles main page      *
 *                                     *
 ***************************************
*/
.clt, .clt ul, .clt li {
     position: relative;
}
.clt ul {
    list-style: none;
    padding-left: 32px;
}
.clt li::before, .clt li::after {
    content: "";
    position: absolute;
    left: -12px;
}
.clt li::before {
    border-top: 1px solid #000;
    top: 9px;
    width: 8px;
    height: 0;
}
.clt li::after {
    border-left: 1px solid #000;
    height: 100%;
    width: 0px;
    top: 2px;
}
.clt ul > li:last-child::after {
    height: 8px;
}
/*
 ***************************************
 *                                     *
 *  Generate Screen Shot Options page  *
 *                                     *
 ***************************************
*/
.generateScreenShot_general {
	font-size:12pt;
	font-weight:normal;
	font-variant:normal;
	color:black;
	background-color:white;
	text-align:justify;
	width:100%;
	margin:0px;
	display:inline-block;
	line-height:20px;
}
.generateScreenShot_header {
	font-size:18pt;
	font-weight:bold;
	font-variant:small-caps;
	color:black;
	text-align:center;
	width:100%;
	margin:0px;
	display:inline-block;
	line-height:25px;
}
.pctOptionHeading {
	grid-column:1;
	margin:0px 0px 2px 0px;
	line-height:unset;
	font-weight:bold;
	font-size:14pt;
	font-family:courier-new;
	width:200px;
	display:inline-block;
	vertical-align:top;
	overflow:hidden;
}
span.pctOptionValue {
	padding:0 0 0 0px;
	margin:0px;
	grid-column:2;
}
.pctOptionValue input[type=text] {
	grid-column:2;
	background-color:white;
	color:black;
	font-weight:normal;
	font-family:courier-new;
	font-size:14pt;
	width:440px;
	padding:0px;
	margin:0px;
	line-height:1.5;
}
.pct {
	margin-top:10px;
	margin-bottom:10px;
	padding:0px;
	display:grid;
	grid-template-columns:auto auto;
	width:640px;
}
#notice {
	font-family:courier-new;
	font-size:12pt;
	font-weight:bold;
	color:red;
	background-color:white;
	width:500px;
	padding:10px;
}
p.mID {
	font-family:courier-new;
	font-size:8pt;
	font-weight:normal;
	position:absolute;
	right:20px;
	bottom:0px;
}
/*
 ***************************************
 *                                     *
 *  Font List Screen shot options page *
 *                                     *
 ***************************************
 */
#imageDropDown {
	width:470px;
	height:50px;
	overflow-x:hidden;
	overflow-y:hidden;
	display:inline;
	visibility:visible;
}
#listDropDown {
	width:470px;
	height:300px;
	overflow-x:hidden;
	overflow-y:scroll;
	border:solid 1px black;
	display:none;
	margin:0px;
	padding:0px;
}
.imageSelectRow {
	display:grid ! important;
	grid-template-columns:auto auto auto;
	width:470px;
	border:solid 1pt black;
	grid-gap:0px;
	margin:0px;
	padding:0px;
}
.isRowCol1 {
	grid-column:1;
	width:140px;
	line-height:50px;
	background-color:white;
	text-align:center;
	font-size:8pt;
	height:50px;
	overflow:hidden;
	margin:0px 0px 0px 0px;
	padding:0px;
}
.isRowCol2 {
	grid-column:2;
	width:300px;
	margin:0px 0px 0px 0px;
	padding:0px;
}
.isRowCol3 {
	grid-column:3;
	width:30px;
	margin:0px 0px 0px 0px;
	padding:0px;
	background-color:white;
}
/*
 ***************************************
 *                                     *
 *  File Edit styles                   *
 *                                     *
 ***************************************
 */
#editFile {
	background-color:rgb(255, 255, 255);
	color:black;
	font-weight:normal;
	font-family:monospace;
	white-space:pre;
	display: none;
	grid-template-columns:25% 25% 25% 25%;
	grid-template-rows:25px 25px 30px auto;
	grid-column-gap:10px;
	overflow:hidden;
	border:var(--default-border);
	position:fixed;
	box-shadow:15px 15px 15px darkgray;
	border-radius:15px;
	padding:10px;
}
#shield {
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	visibility:visible;
	display:none;
	background-color:rgba(255, 255, 255, .8);
	color:black;
	z-index:1000000;
}
#ef_readonly_msg	{ grid-column:1 / span 4;	grid-row:1; }

#ef_filename		{ grid-column:1 / span 4;	grid-row:2; }

#ef_closeButton		{ grid-column:1;			grid-row:3; }
#ef_saveButton		{ grid-column:2;			grid-row:3; }
#ef_debug_button	{ grid-column:3;			grid-row:3; }
#ef_hexdump_button	{ grid-column:4;			grid-row:3; }

#editBox			{ grid-column:1 / span 4;	grid-row:4; }

#editFile p {
	margin:0px;
	padding:0px;
}
#ef_saveButton,
#ef_closeButton,
#sp_saveButton,
#sp_closeButton,
#ef_debug_button,
#ef_modify,
#ef_hexdump_button {
	background-color:blue;
	color:white;
	width:100%;
}
#ef_saveButton:disabled {
	display:none;
}
#ef_filename {
	background-color:white;
	color:black;
	font-size:14pt;
	font-weight:bold;
}
#ef_readonly_msg {
	display:none;
	color:red;
	background-color:rgb(255, 255, 120);
	font-size:12pt;
	font-weight:bold;
	width:100%;
}
#editBox {
	background-color:white;
	color:black;
	font-size:12pt;
	font-weight:normal;
	font-family:monospace;
	overflow-x:scroll;
	overflow-y:scroll;
	white-space:pre;
	margin-top:10px;
}
#savePrompt {
	width:100%;
	text-align:center;
	position:fixed;
	left:50%;
	top:50%;
	width:300px;
	height:100px;
	margin-left:-150px;
	margin-top:-50px;
	background-color:white;
	color:black;
	border:solid 1pt black;
	border-radius:20px;
	box-shadow:20px 20px 20px darkgray;
	padding:15px;
	display:none;
	font-size:12pt;
	font-weight:bold;
	z-index:1000005;
}
#sp_saveButton, #sp_closeButton {
	background-color:blue;
	color:white;
	font-size:12pt;
	display:inline;
	width:100px;
	height:30px;
	text-align:center;
	border-radius:10px;
}
@media (min-height:700px) and (min-width:1100px) {
	#editFile {
		width:900px;
		height:700px;
		margin-left:-450px;
		margin-top:-350px;
		font-size:12pt;
		left:50%;
		top:50%;
	}
	#ef_saveButton, #ef_closeButton, #sp_saveButton, #sp_closeButton, #ef_debug_button, #ef_modify, #ef_hexdump_button {
		font-size:12pt;
	}
}
@media (max-height:699px), (max-width:1099px) {
	#editFile {
		width:98%;
		height:90%;
		margin-left:-49%;
		margin-top:-5%;
		font-size:10pt;
		left:50%;
		top:10%;
	}
	#ef_saveButton, #ef_closeButton, #sp_saveButton, #sp_closeButton, #ef_debug_button, #ef_modify, #ef_hexdump_button {
		font-size:10pt;
	}
}
/* css trick to remember, might want to use this in the future to provide line numbers while editing.

pre
{
    counter-reset: thecodenumbering;
}

code
{
    counter-increment: thecodenumbering;
}
code:before
{
    padding-right:5px;
    content: counter(thecodenumbering);
}

*/