:root {
    /* Should make it easier to change colors in the future */
    --text: #252525;
    --background: #efefef;
    --button-hover: black;
    --button-selected: #232e51;
    --fieldset-color: #2a2a2a;

    --column-1: #2a2a2a;
}

/* header */
a img {
	border: 0;
}
.header {
	margin: 0 0 30px 0;

	background: #e5ecfb;
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#e8eefc),
		to(#d7deea)
	);
	background: -moz-linear-gradient(top, #e8eefc, #d7deea);
	background: linear-gradient(top, #e8eefc, #d7deea);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8EEFC', endColorstr='#D7DEEA');

	border-bottom: 1px solid #aaa;
	box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.6),
		0px 2px 2px rgba(0, 0, 0, 0.15);
	min-height: 50px;
}
.header-inner {
	max-width: 605px;
	margin: 0 auto;
}
.nav,
.nav li,
.nav-play,
.nav-play li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
}
.nav {
	padding: 15px 6px 15px 6px;
}
.header .nav {
	padding: 15px 0 15px 155px;
}
.header .nav-play {
	padding: 15px 0 15px 10px;
}
.nav .button {
	position: relative;
	padding: 5px 10px;
	margin: 0 -1px 0 0;
	border-radius: 0;
}
.nav .button img {
	position: absolute;
	top: -8px;
	left: -150px;
}
.nav .button.cur,
.nav .button.cur:hover {
	color: #777777;
	background: #f8f8f8;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.nav .button.cur:hover {
	border: solid 1px #888888;
}
.nav .button:hover {
	z-index: 10;
}
.nav .button.nav-first {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.nav .button.nav-last {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
.button {
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
	border-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2),
		inset 0 -1px 2px rgba(255, 255, 255, 1);
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2),
		inset 0 -1px 2px rgba(255, 255, 255, 1);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2),
		inset 0 -1px 2px rgba(255, 255, 255, 1);
	white-space: nowrap;

	/* default colors */
	color: #222222;
	border: solid 1px #aaaaaa;
	background: #e3e3e3;
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#f6f6f6),
		to(#e3e3e3)
	);
	background: -moz-linear-gradient(top, #f6f6f6, #e3e3e3);
	background: linear-gradient(top, #f6f6f6, #e3e3e3);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#e3e3e3');
}
.button:hover {
	background: #cfcfcf;
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#f2f2f2),
		to(#cfcfcf)
	);
	background: -moz-linear-gradient(top, #f2f2f2, #cfcfcf);
	background: linear-gradient(top, #f2f2f2, #cfcfcf);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f2f2', endColorstr='#cfcfcf');
	border-color: #606060;
}
.button:active {
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#cfcfcf),
		to(#f2f2f2)
	);
	background: -moz-linear-gradient(top, #cfcfcf, #f2f2f2);
	background: linear-gradient(top, #cfcfcf, #f2f2f2);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cfcfcf', endColorstr='#f2f2f2');
}

.greenbutton {
	background: hsl(100, 30%, 93%);
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(hsl(100, 30%, 97%)),
		to(hsl(100, 30%, 84%))
	);
	background: -moz-linear-gradient(
		top,
		hsl(100, 30%, 97%),
		hsl(100, 30%, 84%)
	);
	background: linear-gradient(top, hsl(100, 30%, 97%), hsl(100, 30%, 84%));
	border-color: hsl(100, 30%, 70%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#e3e3e3');
}
.greenbutton:hover {
	background: hsl(100, 30%, 87%);
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(hsl(100, 30%, 94%)),
		to(hsl(100, 30%, 77%))
	);
	background: -moz-linear-gradient(
		top,
		hsl(100, 30%, 94%),
		hsl(100, 30%, 77%)
	);
	background: linear-gradient(top, hsl(100, 30%, 94%), hsl(100, 30%, 77%));
	border-color: hsl(100, 30%, 41%);
}
.greenbutton:active {
	background: hsl(100, 30%, 77%);
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(hsl(100, 30%, 77%)),
		to(hsl(100, 30%, 83%))
	);
	background: -moz-linear-gradient(
		top,
		hsl(100, 30%, 77%),
		hsl(100, 30%, 83%)
	);
	background: linear-gradient(top, hsl(100, 30%, 77%), hsl(100, 30%, 83%));
	border-color: hsl(100, 30%, 41%);
}

/* general page styling */
html,
body {
	font: 10pt Verdana, sans-serif;
	background-color: white;
	color: black;
	margin: 0;
	padding: 0;
	min-width: 100em;
	height: 100%;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
    -webkit-animation: fadein 3s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 3s; /* Firefox < 16 */
        -ms-animation: fadein 3s; /* Internet Explorer */
         -o-animation: fadein 3s; /* Opera < 12.1 */
            animation: fadein 3s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.wrapper {
	padding: 0 1em;
	max-width: 130000px;
	margin: 0 auto;
}
.credits {
	clear: both;
	padding: 20px;
	max-width: 1285px;
	margin: 50px auto;
}
div.wrapper > div > span {
	padding-right: 5px;
}
fieldset {
	background-color: #f1f4f9;
	border: 1px solid #aaaaaa;
	border-radius: 10px;
	backdrop-filter: blur(2px);
}
legend {
	font-weight: bold;
	text-align: center;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	max-height: 1em;
	margin-bottom: 1em;
}
th,
td {
	padding: 0;
}
th {
	font-size: 0.8em;
}
.title-text {
	font-weight: bold;
	font-size: 1.5em;
	margin: 0.5em 1em 0.5em 0;
	position: relative;
	top: -5px;
}
.main-title-text {
	top: -10px;
}
.big-text {
	font-weight: bold;
	font-size: 1.1em;
	margin: 0.5em 0;
	position: relative;
}
.big-text #mainResult:hover {
	/* indicates the presence of click-to-copy function */
	cursor: pointer;
	opacity: 0.7;
}
#tooltipText {
	position: absolute;
	left: 42%;
	top: -170%;
	font-size: 0.8em;
	visibility: hidden;
	border-radius: 5px;
	background-color: rgba(0, 0, 0, 0.7);
	color: white;
	text-align: center;
	padding: 5px;
	font-weight: normal;
}
#tooltipText::after {
	position: absolute;
	left: 45%;
	top: 100%;
	content: "";
	border: 6px solid transparent;
	border-top-color: rgba(0, 0, 0, 0.7);
}
.small-text {
	font-size: 0.8em;
}
.panel {
	display: inline-block; /* required for honkaculate to work */
	vertical-align: top;
}
.field-info,.badge-info, .poke-import {
	text-align: center;
	width: 20.5em;
}
.holder-0 {
	position: absolute;
	top: 151px;
}
#holder-2 tr {
	white-space: nowrap;
}

/* general button styling */
.btn {
	text-align: center;
	border: solid 1px #aaaaaa;
	padding: 4px 4px;
	position: relative;
	cursor: pointer;
	color: #555555;
	background: #e9e9e9;
	margin: -1px -3px 0;
	display: inline-block;
	width: 5em;
	border-radius: 8px;
}
.btn-wide {
	width: 7em;
}
.btn-xwide {
	width: 8em;
}
.btn-xxwide {
	width: 9em;
}
.btn-xxxwide {
	width: 14em;
}
.btn-small {
	width: 4em;
}
.btn-xsmall {
	width: 2em;
}
.btn-xxsmall {
	width: 1em;
}
.btn-left {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.btn-right {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.btn-top {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.btn-bottom {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.btn-mid {
	border-radius: 0;
}
.visually-hidden:focus + .btn, /* Add visual indication when focusing on visually hidden elements */
.btn:hover {
	z-index: 10;
	border-color: #777777;
	background: #e3e3e3;
}
.visually-hidden:checked + .btn {
	font-weight: bold;
	color: #c9c9c9;
	background: #252525;
}
.visually-hidden[type="radio"]:checked + .btn {
	cursor: default;
}

.switch-risk + .btn {
	background: #ff8383;
}
.switch-risk:hover + .btn {
	background: #c83d3d;
}
.visually-hidden:checked.switch-risk + .btn {
	background: #c83d3d;
}

/* Hide element visually, but not from screen readers. See http://adrianroselli.com/2017/05/under-engineered-custom-radio-buttons-and-checkboxen.html */
.visually-hidden {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute;
	top: auto;
	white-space: nowrap; /* https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe */
}

.visually-hidden:disabled + .btn {
	color: #999999;
}

.game.visually-hidden:disabled + .btn {
	background-color: #d3d3d3;
}

.btn-group {
	display: inline-block;
	width: 100%;
}
.left {
	float: left;
}
.right {
	float: right;
}
.locked-move:checked + .btn {
	background: #ffff99;
}

#gameSettings{
	position: absolute;
	top: 20px;
	left: 20px;
}

.genSelection,
.notationSelection,
.modeSelection,
.gamemodeSelection,
.gameSelection {
	display: inline-block;
	position: relative;
	top: 0px;
}

/* header */
.move-result-group {
	display: flex;
	min-width: 30em;
	justify-content: center;
}
.move-result-subgroup {
	width: 40%;
	padding-bottom: 20px;
	display: flex;
	flex-direction: column;
}
.move-result-group .btn {
	margin: 0 1em;
}
.main-result-group {
	margin: 0em 0 1em;
	text-align: center;
}
.result-move-header {
	font-size: 0.8em;
	font-weight: bold;
	margin: 0 2em;
}

/* pokemon info */
.poke-info label {
	display: inline-block;
	width: 5em;
}
.top label,
.info-selectors label {
	display: inline-block;
	width: 5em;
}
.poke-info input:not([type]),
.poke-info input[type="text"],
.poke-info span {
	display: inline-block;
	width: 2.5em;
}
.poke-info input[type="number"] {
	display: inline-block;
	width: 3em;
}
.info-group {
	margin: 1em 0;
}
.set-selector {
	width: 60%;
	height: 2em;
}
.info-selectors select {
	width: 12em;
}
select.toxic-counter {
	width: 5.5em;
}
.move-selector,
.move-bp,
.move-type,
.move-cat,
.move-hits {
	font-size: 0.9em;
}
.move-selector {
	width: 9.5em;
}
.move-type {
	width: 5.5em;
}
.move-cat {
	width: 6em;
}
.move-hits {
	width: 4.5em;
}
.poke-info .crit-btn {
	font-size: 0.8em;
	width: 2.5em;
	height: 1em;
	padding: 3px 3px;
	margin: 0px 1px;
}
.crit-btn {
	font-size: 0.8em;
	width: 2.5em;
	height: 1em;
	padding: 3px 3px;
	margin: 0px 1px;
}
.poke-info .z-btn {
	font-size: 0.8em;
	width: 1.5em;
	height: 1em;
	padding: 3px 3px;
	margin-right: 1px;
}
.poke-info .max-btn {
	font-size: 0.8em;
	width: 2.5em;
	height: 1em;
	padding: 3px 3px;
}
.poke-info .stellar-btn {
	font-size: 0.8em;
	width: 3.5em;
	height: 1em;
	padding: 3px 3px;
}

/* field info */
.field-info .btn {
	font-size: 0.8em;
}
table.field {
	width: 100%;
}

[hidden], .hide {
	display: none;
}

/* select2 overrides */
.select2-container .select2-choice > .select2-chosen {
	width: 9em;
}

.small-select.select2-container .select2-choice {
	font-size: 0.9em;
	height: 18px;
	line-height: 18px;
}
.small-select.select2-container .select2-choice .select2-arrow b {
	background-position: 0 -4px;
}
.small-select.select2-dropdown-open .select2-choice .select2-arrow b {
	background-position: -18px -4px;
}

/* Bootstrap */
.panel-group > .panel {
	clear: left;
}

/* ColVis */
.clear {
	clear: right;
}

.import-team-text {
	min-width: 20em;
	min-height: 10em;
	resize: vertical;
}

.import-name-text {
	min-width: 26.3em;
	min-height: 1em;
	overflow: auto;
	display: inline;
}

.hpbar {
	height: 4px;
	border-style: none;
	border-top-width: 2px;
	border-right-width: 1px;
	border-bottom-width: 2px;
	border-left-width: 0.5px;
	border-radius: 3px;
	margin-top: 15px;
}

.hpbar.hp-green {
	border-top-color: #00dd60;
	background-color: green;
	border-bottom-color: #007734;
	border-right-color: #007734;
}

.hpbar.hp-yellow {
	border-top-color: #f8e379;
	background-color: #f5d538;
	border-bottom-color: #be9f0a;
	border-right-color: #be9f0a;
}

.hpbar.hp-red {
	border-top-color: #f37f67;
	background-color: #ee4928;
	border-bottom-color: #a3260d;
	border-right-color: #a3260d;
}

.pool {
	padding: 15px 0;
}
.ability-pool,
.move-pool {
	padding-bottom: 5px;
}
.extraSetAbilities,
.extraSetItems,
.extraSetMoves {
	width: 100%;
}

.trainer-poke-list,
.trainer-poke-list-opposing {
	display: flex;
	flex-wrap: wrap;
}

.trainer-poke,
.trainer-poke-switch {
	height: 100%;
	width: auto;
	cursor: pointer;
	box-sizing: border-box;
	transition-property: outline-color;
    transition-duration: 0.4s;
}

.trainer-poke-switch:hover {
	outline: 2px solid;
	outline-color: #1abc9c;
}

.switch-risk-mon {
	outline: 2px solid;
	outline-color: #ff0000;
}

.trainer-poke-switch-explain {
	vertical-align: middle !important;
}

.trainer-poke-switch-xp {
	vertical-align: middle !important;
	text-align: left;
}

.dead {
	background-color: red;
}

.next {
	background-color: green;
}

.risky-ai-move {
	font-style: italic;
}

.stat-changer {
	width: 22px;
	margin-right: 2px;
}

/*
    F = Faster 
    T = Speed tie
    S = slower
*/
.mon-speed-F {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	border: solid;
	border-color: #7ee1ff;
	border-radius: 20%;
}

.mon-speed-T {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	border: solid;
	border-color: #894197;
	border-radius: 20%;
}

.mon-speed-S {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	border: solid;
	border-color: #1c1414;
	border-radius: 20%;
}

.mon-speed-none {
	border: none !important;
}

.mon-dmg-none {
	background: var(--fieldset-color) !important;
}

.mon-dmg-W {
	/* Is considerable a wall*/
	background: linear-gradient(to right, #0f0bf3 50%, var(--fieldset-color) 0%);
}

.mon-dmg-WMO {
	/* Is considerable a wall that may OHKO*/
	background: linear-gradient(to right, #1295ec 50%, var(--fieldset-color) 0%);
}

.mon-dmg-4 {
	/*Gets OHKO*/
	background: linear-gradient(to right, var(--fieldset-color) 50%, #dd0b0b 0%);
}
.mon-dmg-3 {
	/*maybe gets OHKO*/
	background: linear-gradient(to right, var(--fieldset-color) 50%, #ff7f16 0%);
}
.mon-dmg-1 {
	/*inflicts OHKO*/
	background: linear-gradient(to right, #20d408 50%, var(--fieldset-color) 0%);
}
.mon-dmg-2 {
	/*may inflicts OHKO*/
	background: linear-gradient(to right, #daff08 50%, var(--fieldset-color) 0%);
}
.mon-dmg-14 {
	/*both sides Gets OHKO*/
	background: linear-gradient(to right, #20d408 50%, #dd0b0b 0%);
}
.mon-dmg-23 {
	/*both sides might inflict OHKO*/
	background: linear-gradient(to right, #daff08 50%, #ff7f16 0%);
}
.mon-dmg-13 {
	/*inflict OHKO but may Gets OHKO*/
	background: linear-gradient(to right, #20d408 50%, #ff7f16 0%);
}
.mon-dmg-24 {
	/*may inflict OHKO but Gets OHKO*/
	background: linear-gradient(to right, #daff08 50%, #dd0b0b 0%);
}

.trainer-poke.left-side {
	width: 3em;
	object-fit: none;
}

.box-poke,
.trainer-poke-list-opposing {
	min-height: 30px;
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 2em;
}

.deadzone:hover {
	background: #722323;
}

.over {
	background: #373232;
}

.info-paragraph > b {
	color: rgb(15, 14, 14);
}

.info-paragraph > b:hover {
	background: var(--fieldset-color);
	color: unset;
}

.genSelection {
	display: none;
}

.ivs.calc-trigger,
.base.calc-trigger {
	/* display: none !important; */
}

#p1,.playerSettings {
	background: repeating-linear-gradient(
		135deg,
		#bfbfbf7c,
		#bfbfbf7c 50px,
		#1616167c 50px,
		#1616167c 51px
	);
	width: 18em;
	/* background-color: #72041a7c; */
}
#p2,.opposingSettings{
	background: repeating-linear-gradient(
		135deg,
		#bfbfbf7c,
		#bfbfbf7c 50px,
		#1616167c 50px,
		#1616167c 51px
	);
	width: 18em;
	/* background-color: #1b41897c; */
}
#p3,.fieldSettings {
	background: repeating-linear-gradient(
		135deg,
		#bfbfbf7c,
		#bfbfbf7c 50px,
		#1616167c 50px,
		#1616167c 51px
	);
	/* background-color: #9779257c; */
}

#p4 {
	background: repeating-linear-gradient(
        135deg, 
        #eaeaeae0, 
        #eaeaeae0 5px, 
        #d3d3d3e0 5px, 
        #d3d3d3e0 10px
    );
	resize:both;
	overflow:auto;
	width:17em;
	display:flex;
    flex-direction:column;
}
#p5 {
	background: repeating-linear-gradient(
        135deg, 
        #eaeaeae0, 
        #eaeaeae0 5px, 
        #d3d3d3e0 5px, 
        #d3d3d3e0 10px
    );
	width: 12em;
}
.five-panels {
	display: flex;
	flex-flow: nowrap;
}
.info-selectors {
	display: flex;
	flex-direction: column;
}
.i-f-stats > div > .selector-label {
	float: left;
	text-align: left;
}

.i-f-o-stats > div > .selector-label {
	float: right;
	text-align: right;
}

.i-f-stats .selector-select {
	float: right;
}

.i-f-o-stats .selector-select {
	float: left;
	direction: ltr;
}
.top {
	display: flex;
	flex-direction: column;
	min-height:5em;
}
.on-legend {
	margin: 1em;
}
button.on-legend {
	min-width: 4.5em;
}
button {
	color: var(--text);
	background-color: var(--background);
}
label.opposing,
label.player {
	width: unset;
	max-height: 2em;
	max-width: 13em;
}

#p2mon,
#p1mon {
	height: 100px;
	width: 80px;
	object-fit: none;
	flex-basis: fill-available;
}

.display-sprites {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.exbg {
	position: fixed;
	height: 100%;
	object-fit: contain;
	z-index: -1;
}

.visually-hidden:checked + .btn > img {
	filter: grayscale(0%);
}
.btn > img {
	filter: grayscale(100%);
}

#p1b,
#p2b {
	display: flex;
	flex-direction: column;
}

#p1b span,
#p2b span {
	width: 100%;
}

#bg-image-a {
	object-fit: cover;
	min-width: 100%;
	min-height: 100%;
}

#resultGroupL > div,
#resultGroupR > div {
	display: flex;
	flex-direction: row;
}
#resultGroupL > div {
	justify-content: right;
}
#resultGroupR > div {
	justify-content: left;
}
.display-damage-text {
	display: inline-grid;
	align-content: center;
}
#resultGroupL .display-damage-text {
	justify-items: right;
}

.move-result-subgroup .btn.btn-xxxwide {
	height: 2em;
	align-content: center;
	transition-property: color;
    transition-duration: 0.4s;
}
.trainer-poke-switch-explain {
	margin-left: 1em;
}

.totalMod {
	/* display: inline-block;
    width: 2.5em;
    font-weight: bold;
    font-size: large;
    font-family: 'Courier New', Courier, monospace; */
}
.speed-img {
	width: 1.5em;
}

.gameIconText {
  font-size: 40px;
  margin: 20px;
}

.gameIconDiv {
	display: flex;
	min-width: 30em;
	justify-content: center;

}

.gameIconImg {
	height:6em;
}
.move-result-group {
	display: flex;
	min-width: 30em;
	justify-content: center;
  }

  #settingsGearIcon {
	cursor:pointer;
	width: 4em;
	height: 4em;
	display: block;
	fill: currentcolor;
	position:fixed;
	top:80%;
	left:0%;
  }

  .settingsPage {
	backdrop-filter: blur(3px);
	background-color: var(--background);
	position:absolute;
	margin:auto;
  }
  .settingsOverlay{
	backdrop-filter: blur(3px);
	height:100%;
	width:100%;
	margin:auto;
	position: fixed;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index:100;
  }

  
.highest-roll{
	color:lime !important;
}
.can-ohko{
	color: orange !important;
}
.ohko{
	color: red !important;
	text-transform: uppercase;
}

.loadingScreen {
	width: 100%;
	height: 100%;
	position: absolute;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 8em;
	z-index: 3;
	flex-direction: column;
  }
  .settingsPanels{
	display:flex;
  }
  .settingsPage fieldset{
	width:100%;
}

div:has(> #box-poke-list){
    flex-grow:1;
}
#p4 > div {
	margin: 5px 0;
}
#builtin-calculator {
	position: fixed;
	bottom: 0px;
	right: 10%;
	background-color: #2e2e2ee6;
	border-radius: 10px 10px 0 0;
	padding: 0.5em;
}
.critPanel{ 
	border: red 10px dashed;
}

