body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  padding: 0;
  margin: 0;
}

/* PN CSS */

@media only screen and (max-width: 424px) {

   footer .hstack.gap-3 {

     flex-direction: column !important;

 }

   footer .hstack.gap-3 div:nth-of-type(2) {

     margin: unset !important;

 }

}

/* END OF CSS */

iframe {
  max-width: 100%;
}

.badge {
  --bs-badge-padding-x: 0.45em;
  --bs-badge-padding-y: 0.15em;
}

.btn.py-1 {
  padding-top: 0.05rem!important;
  padding-bottom: 0.05rem!important;
}

.btn-link {
  text-decoration: none!important;
}

.card-header input {
  padding: 0.1em 0.3em;
  min-height: auto;
}

.form-check-input:checked {
  background-color: #daaa44;
  border-color: #daaa44;
}

.btn-primary, .btn-primary:focus {
  background-color: #daaa44;
  border-color: #daaa44;
}

.btn-primary:hover {
  background-color: #A17C2B;
  border-color: #A17C2B;
}


.btn-link {
  --bs-btn-color: #000;
  --bs-btn-hover-color: #A17C2B;
  --bs-btn-active-color: #A17C2B;
}

.btn-primary:disabled {
  background-color: #A17C2B;
  border-color: #A17C2B;
}

.modal.show {
  display: block!important;
}

input:focus,
button:focus,
select:focus {
  border-color: #daaa44!important;
  box-shadow: 0 0 0 0.2rem rgba(218, 170, 68, 0.4)!important;
}

input[type=checkbox]:focus:not(:checked) {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28218, 170, 68, 1%29'/%3e%3c/svg%3e")!important;
}

.accordion-button:not(.collapsed) {
  color: color: var(--bs-accordion-btn-color);
  background-color: #EAEAEA;
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23daaa44'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.callout-info {
  --bd-callout-bg: rgba(var(--bs-info-rgb), .075);
  --bd-callout-border: rgba(var(--bs-info-rgb), .5);
}

.callout {
  padding: 1.25rem;
  margin-top: 0.25rem;
  margin-bottom: 1.25rem;
  background-color: var(--bd-callout-bg, var(--bs-gray-100));
  border-left: 0.25rem solid var(--bd-callout-border, var(--bs-gray-300));
}

.callout-warning {
  --bd-callout-bg: rgba(var(--bs-warning-rgb), .075);
  --bd-callout-border: rgba(var(--bs-warning-rgb), .5);
}

.callout-error {
  --bd-callout-bg: rgba(var(--bs-danger-rgb), .075);
  --bd-callout-border: rgba(var(--bs-danger-rgb), .5);
}

.offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl {
  --bs-offcanvas-height: 60vh;
}

#chartdiv, #previewframe {
  width: 100%;
  height: 100%;
  background: #222;
  margin: auto;
  border-radius: 0.5em;
  overflow: hidden;
}

.light-theme #chartdiv, .light-theme #previewframe {
  background: #fff;
  border: 1px solid #999;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

li {
  margin: 0;
  padding: 0;
}

.logo {
  margin-bottom: 10px;
}

.hidden {
  display: none;
}

.itemlist {
  height: 546px;
  overflow: auto;
}

.itemlist.placelist {
  height: 250px;
}

#searchitems .itemlist.placelist {
  height: 546px;
}

.itemcontrols {
  margin: 0;
  clear: both;
}

.itemlist .group {
  font-weight: 500;
/*  font-style: italic;*/
  border-bottom: 1px solid #eee;
  padding: 0.1em 0.2em;
  overflow: auto;
  position: relative;
}

.itemlist .group input[type=text] {
  padding-left: 2em;
}


.itemlist input[type=color] {
  width: 1rem;
  height: 1rem;
  padding: 0;
}

.group .color {
  position: absolute;
  top: 0.6em;
  left: 0.5em;
  z-index: 10;
}

#selplaces.itemlist .group {
  border-bottom: none;
/*  padding: 0;*/
  margin-top: 1em;
  overflow: hidden;
}

#selplaces.itemlist li:first-child .group {
  margin-top: 0;
}

#selplaces.itemlist li {
  border-left: 4px solid transparent;
}

.itemlist .group:first-child {
  margin-top: 0;
}

#selplaces.itemlist li.selected {
  border-left: 4px solid #daaa44;
/*  background: #FFF9EB;*/
}

.itemlist .itemcontrols {
  display: none;
  position: absolute;
  top: 0.2em;
  right: 0.2em;
}

.itemlist .item {
  padding: 0.2em;
  overflow: auto;
  position: relative;
}

.itemlist .item:hover {
  background: #eee;
  cursor: pointer;
}

.itemlist .item.home {
  background: #aaba42;
}

.itemlist .item.selected {
  background: #daaa44;
}

#width {
  min-width: 4.5em;
}

.only-timeline {
  display: none;
}

.timeline-mode .only-timeline {
  display: block;
}


.itemlist .item:hover .itemcontrols, .itemlist .item.active .itemcontrols,
.itemlist .group:hover .itemcontrols, .itemlist .group.active .itemcontrols {
  display: block;
}

.itemlist .disabled {
  pointer-events: initial;
  cursor: default;
}

#resizable {
  position: relative;
  overflow: auto;
/*  max-width: 90vw;*/
  max-height: 90vh;
  height: 695px;
  margin: auto;
  padding: 0!important;
}

#resizer {
  position: absolute;
  bottom: 5px;
  right: 5px;
  z-index: 1000;
  cursor: nwse-resize;
  user-drag: none; 
  user-select: none;
  -moz-user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  width: 16px;
  height: 16px;
  background-image: url(resize-white.svg);
  background-repeat: no-repeat;
  background-position: center;
  border: none;
}

.light-theme #resizer {
  background-image: url(resize-black.svg);
}


#logo {
  font-size: 3em;
  font-weight: 400;
  color: #fff;
  position: relative;
  /*top: 0.5em;
  left: 0.5em;*/
  white-space: nowrap;
  display: inline-block;
}

#logo a {
  color: #fff;
  text-decoration: none;
}

#logo span {
  transition: all 300ms ease-out;
}

#logo .semi {
  opacity: 0.6;
}

#logo .pin {
  width: 0.4em;
  height: 1.44em;
  margin: 0 0.1em;
  background-image: url(pin.svg);
  background-repeat: no-repeat;
  background-size: 0.35em;
  background-position: right bottom;
  display: inline-block;
  text-indent: -9999px;
}

#logo:hover span {
  opacity: 0.6;
}

#logo:hover span.semi {
  opacity: 1;
}

#logo:hover .pin {
  height: 0.95em;
  opacity: 1;
}

@media only screen and (max-width: 800px) {
  #logo {
    transform: scale(0.7);
  }
}

body.content {
  background-color: #292929;
  color: #fff;
}


.question {
  padding-left: 3rem;
  position: relative;
  margin-top: 1.5em;
}

.question .q {
  font-size: 1.5em;
}

.question .q i {
  position: absolute;
  left: 0;
}

input[type=range]::-webkit-slider-thumb {
  background: #daaa44;
}

input[type=range]:focus::-webkit-slider-thumb {
  background: #daaa44;
  border-color: #daaa44!important;
  box-shadow: 0 0 0 0.2rem rgba(218, 170, 68, 0.4)!important;
}

input[type=range]::-moz-range-thumb {
  background: #daaa44;
}

input[type=range]:focus::-moz-range-thumb {
  background: #daaa44;
  border-color: #daaa44!important;
  box-shadow: 0 0 0 0.2rem rgba(218, 170, 68, 0.4)!important;
}

input[type=range]::-ms-thumb {
  background: #daaa44;
}

input[type=range]:focus::-ms-thumb {
  background: #daaa44;
  border-color: #daaa44!important;
  box-shadow: 0 0 0 0.2rem rgba(218, 170, 68, 0.4)!important;
}


.btn-idle .working, .btn-working .idle {
  display: none;
}

#introchart {
  margin-top: 2em;
  width: 100%;
  height: 300px;
  background: linear-gradient(90deg, rgba(40,40,40,1) 0%, rgba(20,20,20,1) 100%);
}