

@font-face { 
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(../assets/google/gms.ttf); /* For IE6-8 */
  src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(../assets/google/gms.ttf) format('truetype');
} 

/* fallback */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 100;
  src: url(../assets/google/gms.woff2) format('woff2');
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}



.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
 
  /* Support for IE. */

  font-feature-settings: 'liga';
}
.bdh-sc-comp
{ border:1px dashed transparent;

  box-sizing:border-box;
  position:relative;
}

.bdh-sc-options
{ position:absolute;
  right:0px;
  top:0px;
  min-height:25px;
  min-width:50px;
  border:0px solid red;
  opacity:1;
}

.bdh-sc-options>.buttons
{ position:relative;
  display:none;
  border:0px solid green;
  padding:2px 5px;
  background:transparent;
  color:orange;
  text-decoration:none;
  font-size:20px;
  border:0px solid red;

  overflow:hidden;

}


.ddl-message
{ display:block;
  border:1px solid red;
  padding 5px;
  display:flex;
  flex-direction:column;
  background: #333;
  color:#fff;
 
}




.ddl-error
{ border:1px solid red;
  
}
.ddl-warn
{ border:1px solid orange;
  
}
.ddl-notice
{ border:1px solid yellow;
  
}

.ddl-message.title
{ font-weight:bold; 
   color:white
}

.ddl-message.ddl-warn.title
{ font-weight:bold; 
   color:orange
}

.ddl-message.ddl-error.title
{ font-weight:bold; 
   color:red
}


textarea.bdh-code,
textarea.log-ta
{ width:100%;
  background:#000;
  color:#aaa;
  font-family:courier;
  min-height:250px;


}

.ddl-warning.content
{ 
}
.ddl-warning.data
{ font-family:
}
.bdh-sc-options a
{ 
  color:orange;

}
.bdh-sc-options:hover 
{ opacity:0.8;
}

.bdh-sc-options:hover .buttons
{ 

  display:inline-block;
}

.bdh-sc-comp:hover>.bdh-sc-options
{  display:block;
}
.bdh-sc-comp:hover>.bdh-sc-options a
{  color:orange;
  text-shadow: 1px 1px 2px black;
}


.bdh-sc-comp:hover>.bdh-sc-options a:hover
{  color:blue;
}

.bdh-sc-comp:hover>.bdh-sc-options a.active
{  color:red;
}



.bdh-sc-admin-edit
{ position:relative;


  z-index:100;
}

.bdh-input-wrap
{ margin:2px 5px 3px 0;

}

.bdh-input-wrap .bdh-input-label
{ padding:5px 0;
  text-align:left;
}

.bdh-input-wrap>.bdh-i-wrap
{ text-align:right;
}

.bdh-input-wrap>.bdh-i-wrap input[type="text"],
.bdh-input-wrap>.bdh-i-wrap textarea,
.bdh-input-wrap>.bdh-i-wrap select
{ flex:1;
}

.bdh-input-wrap>.bdh-i-wrap input[type="checkbox"]
{ float:right;
}



body *.dom-pos-top
{ bottom:0px; top:auto;
}

body *.dom-pos-bottom
{ bottom:0px; top:auto;
}

body *.dom-pos-left
{ left:0px; right:auto;
}
body *.dom-pos-right
{ right:0px; left:auto;
}

.dom-abs
{ position:absolute;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  display:block;
  overflow:auto;
}

.dom-rel
{ position:relative;

}

.dom-image-grayscale
{ -webkit-filter: grayscale(1);
    filter: grayscale(1);
}

.dom-image-grayscale.fhover:hover
{ -webkit-filter: grayscale(0);
    filter: grayscale(0);
  -webkit-transition: 0.2s -webkit-filter linear;
-moz-transition: 0.2 -moz-filter linear;
-moz-transition: 0.2 filter linear;
-ms-transition: 0.2 -ms-filter linear;
-o-transition: 0.2 -o-filter linear;
transition: 0.2 filter linear, 0.2 -webkit-filter linear;
}


.dom-image-desaturate
{-webkit-filter: saturate(0);
    filter: saturate(0);
}
.dom-image-bg
{ background-position:center;
  background-repeat:no-repeat;
  background-size:contain;

}
.dom-image-bgf
{ background-position:center;
  background-repeat:no-repeat;
  background-size:cover;

}

.dom-flex-grid
{ overflow: auto;
  width: calc(100% + 8px);
  margin-bottom: 72px;

  display: flex;
  flex-wrap: wrap;
  padding: 0px;
  margin: 0px;
  position: relative;
  left: -4px;
}
.dom-flex-grid>.fg-item
{    position: relative;
  flex-basis: calc(16.66666% - 8px);
  margin: 4px;
  border: 0px solid;
  box-sizing: border-box;

  max-height: 25vw;
}


.sc-undefined{
  text-align:center;  
}
.sc-undefined h3{
  font-family:arial;
  font-size:26px;
  border:2px solid red;
}


.dom-bg-checkerboard
{ background: 
  repeating-conic-gradient(#252525 0% 25%, transparent 0% 50%) 
  50% / 20px 20px
}

.selected  .dom-bg-checkerboard
{ background: 
  repeating-conic-gradient(#003b5b 0% 25%, transparent 0% 50%) 
  50% / 20px 20px
}

.domx-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  place-items: start;
}
.domx-grid > * {

}
.domx-grid > [style^='--aspect-ratio']::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 0;
  padding-bottom: calc(100% / (var(--aspect-ratio)));
}


.dom-pad
{ padding:5px;
}

.dom-pad-l
{ padding:0 0 0 5px;
}

.dom-pad-r
{ padding:0 5px 0 0;
}

.dom-grid
{ display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}


.dom-grid-2-1
{ display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}


.dom-grid-4-2
{ display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}

.dom-grid-4-2-1
{ display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}

.dom-grid-6-3-2-1
{ display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}

.dom-grid-8-4-2
{ display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}

.dom-grid-8-4-2-1
{ display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}


@media (max-width: 1200px){

  .dom-grid-6-3-2-1
  { display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }
  .dom-grid-8-4-2-1
  { display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }


  .dom-grid-2-1
  { display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }
}


@media (max-width: 1024px){
  .dom-grid-4-2-1
  { display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }
  .dom-grid-6-3-2-1
  { display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }

  .dom-grid-8-4-2
  { display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }

  .dom-grid-8-4-2-1
  { display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }

  .dom-grid-4-2
{ display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}
  

}


@media (max-width: 840px){
  .dom-grid-4-2-1
  { display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }
  .dom-grid-6-3-2-1
  { display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }

  .dom-grid-8-4-2
  { display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }

  .dom-grid-8-4-2-1
  { display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(50px, auto);
  }

}



.dom-aspect-1
{ --aspect-ratio: 1;

}
.dom-grid-6
{ 
  grid-template-columns: repeat(6, 1fr);

}
.dom-grid>div.grid-item
{ border:1px solid #666;
  border-radius:3px;
  background:#333;


}
.dom-prevent-select {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

.dom-fixed
{ display:fixed;
  overflow:hidden;
}
.dom-flex
{ display:flex;
  flex-direction: row;
  align-items: stretch;

}
.dom-flex1
{ flex:1;

}
.dom-flex-col
{ display:flex;
  flex-direction : column;
  align-items: stretch
}

.flex-1
{ flex:1;
}

.flex-0
{ flex:0.001;
}

.flex-span
{ flex:1;
  display:none;
}


@media (max-width: 1024px){
  .flex-span{
    display:block;
  }
}



.flex-center
{ display:flex;
  align-items: center;
  justify-content: center;
}


.flex-gap
{ gap:25px;
}



.flex-center-v
{ display:flex;
  align-items: center;
}

.flex-center-h
{ display:flex;
  justify-content: center;
}

.dom-flex.flex-r
{  

}

@media (max-width: 1024px){
  .dom-flex.flex-r
  {   display: block;

  }
}
.dom-flex.dom-flex-wrap
{ flex-wrap: wrap;
  align-items: flex-start;

}

.dom-flex.dom-flex-wrap>*
{ flex-basis:17%;
  box-sizing:border-box;

}
.sc-data
{ display:none;
}


.w600
{ width:600px;
}

.bdh-debug-icon
{  padding-right:15px;
}

body .debug-only
{ visibility:hidden;
}

body.bdh-debug .debug-only
{visibility:visible;
}



.d-50
{ width:50%;
}

@media (max-width: 1024px){
  .d-50
  {   width: 100%;

  }
}

.bdh-debug-icon:after
{ content:'*';
  position:absolute;
  right:0px;
  top:0px;
  font-family:'courier';
  color:red;
  font-weight:bold;
  font-size:18px;

}

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.bdh-loading .rotate-on-load {
  -webkit-animation: rotating 2s linear infinite;
  -moz-animation: rotating 2s linear infinite;
  -ms-animation: rotating 2s linear infinite;
  -o-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
  color:orange;
}

.rotate {
  -webkit-animation: rotating 2s linear infinite;
  -moz-animation: rotating 2s linear infinite;
  -ms-animation: rotating 2s linear infinite;
  -o-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
  color:orange;
}
/*.dom-flex::after {
content: "";
flex: auto;
}*/

.dom-flex-wrap
{ flex-wrap: wrap;

}



.hide-element
{ display:none !important;
}

.bdh-i-wrap input[type=text],
.bdh-i-wrap input[type=password]
{ font-family: inherit;
  font-size: 1em;
  border: 1px solid black;
  border-top: 0;
  border-left: 0px;
  border-right: 0;
  border-bottom: 2px solid #666;
  background: rgba(177,188,176,0.2);
  border-radius: 3px 3px 0 0px;
  padding: 5px 5px;
  line-height: 25px;
  min-height: 15px;
  height: 24px;
}

.bd-construction
{ border:1px solid orange;
  text-align:center;
  padding:10px;
  box-sizing:border-box;
  width:auto;
}


.bd-shortcode
{ 

}
.bdh-debug .bd-shortcode,
.bdh-debug .bd-active-component
{ box-shadow: 0px 0px 1px 1px rgba(255, 162, 31,0.4);


}
.bdh-debug .bd-shortcode:hover,
.bdh-debug .bd-active-component
{ box-shadow: 0px 0px 1px 1px rgba(255, 162, 31,0.8);


}




.bdh-debug-border
{ border:0px solid transparent;
}
.bdh-debug  .bdh-debug-border
{ border:1px solid red;

}

.bdh-debug  .bdh-debug-border .bdh-debug-border
{ border:1px solid blue;
}

.bdh-debug  .bdh-debug-border .bdh-debug-border .bdh-debug-border
{ border:1px solid green;
}

.bdh-debug  .bdh-debug-border .bdh-debug-border .bdh-debug-border .bdh-debug-border 
{ border:1px solid cyan;
}

.bdh-debug  .bdh-debug-border .bdh-debug-border .bdh-debug-border .bdh-debug-border  .bdh-debug-border 
{ border:1px solid magenta;
}


.bdh-debug  .bdh-debug-border .bdh-debug-border .bdh-debug-border .bdh-debug-border  .bdh-debug-border  .bdh-debug-border 
{ border:1px solid yellow;
}


.bdh-debug  .bdh-debug-border .bdh-debug-border .bdh-debug-border .bdh-debug-border  .bdh-debug-border  .bdh-debug-border  .bdh-debug-border 
{ border:1px solid purple;
}




.bdh-debug .bd-shortcode.bd-construction,
.bdh-debug .bd-construction.bd-active-component
{ border:1px dashed orange;
  text-align:left;

}


.bdh-debug .bd-shortcode:before
{ content: "Shortcode";
  position:absolute;
  right:-1px;
  bottom:-1px;
  opacity:0.5;
  font-size:10px;
  padding:2px;
  line-height:12px;
  border:1px solid gray;

}


.bdh-debug .bd-shortcode:hover *[data-view-id]
{ 
  /*box-shadow: 0px 0px 0px 1px rgba(255, 0 , 255,0.4);*/
  box-shadow: 0px 0px 1px 1px rgba(0, 172, 250,0.0);



}
.bdh-debug .bd-shortcode:hover *[data-view-id]:hover
{ box-shadow: 0px 0px 1px 1px #37acfa;
  background-color: rgba(0, 172, 250,0.1);

}

.bdh-debug .bd-shortcode:hover *[data-row-id]
{ 
  /*box-shadow: 0px 0px 0px 1px rgba(255, 0 , 255,0.4);*/
  box-shadow: 0px 0px 1px 1px rgba(0, 172, 250,0.0);



}
.bdh-debug .bd-shortcode:hover *[data-row-id]:hover
{   box-shadow: 0px 0px 1px 1px rgba(0, 172, 250,0.4);
  background-color: rgba(0, 172, 250,0.1);

}

html>body *.bdh-debug-show
{ display:none ;
}

html>body.bdh-debug *.bdh-debug-show
{ display:inherit;
}


html>body *.bdh-debug-hide
{ display:none;
}

html>body.bdh-debug *.bdh-debug-hide
{ display:inherit;
}


.pre-e
{ background:rgba(0,0,0,0.3);
  border-radius:4px;
  min-height:20px;
  flex:auto;
  margin:0 5px 5px 0;
}



#wpadminbar #wp-admin-bar-helper-cheetah .ab-item
{ padding:0;

}


html #wpadminbar *.material-icons,
#wpadminbar span.material-icons
{ margin-top:5px;
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 20px;
  line-height: 18px;
  overflow:hidden;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  transform:color 0.2s, opacity 0.3s;

}


button.bdh-button.bdh-warn,
button.bdh-button.bdh-icon.bdh-warn
{ color:#fcba03;
}
button.bdh-button.bdh-danger,
button.bdh-button.bdh-icon.bdh-danger
{ color:#aa0000;
}

button.bdh-button.bdh-system,
button.bdh-button.bdh-icon.bdh-system
{ color:#3678d6;
}





button.bdh-button.active
{ font-weight:bold;
  opacity:1;
  background:#fff;
}


button.bdh-button.bdh-icon
{ border:0px solid transparent;
  background:transparent;
  margin:0 5px 0 0;
  padding:0;


}

button.bdh-button.right,
button.bdh-button.bdh-icon.right
{  float:right;

}

button.bdh-button.bdh-icon.right
{ margin-bottom:0px;

}
button.bdh-button.left
button.bdh-button.bdh-icon.left
{ float:left;
}


button.bdh-button.left,
button.bdh-button.bdh-icon.left,
{ margin-bottom:0px;

}



.bdh-button.bdh-icon>span.material-icons,
button.bdh-button.bdh-icon>span.material-icons,
button.bdh-button>span.material-icons
{ font-size:20px;
  opacity:0.6;
  transition: all 0.2s;
  margin:0;
}


.bdh-button.bdh-icon:hover>span.material-icons,
button.bdh-button.bdh-icon:hover>span.material-icons,
button.bdh-button:hover,
button.bdh-button:hover>span.material-icons
{
  opacity:1;


}


.pad-tl-5,
button.bdh-button.bdh-icon.pad-tl-5
{ padding:5px 0 0 5px;
}


button.bdh-button
{ display:flex;
  position:relative;
  float:left;
  width:auto;
  line-height:20px;
  outline: none;
  background:#aaa;
  padding:2px 5px;
  color:#333;
  transition:all 0.2s;
}

button.bdh-button>span.material-icons
{ margin-right:5px;
}

.wp-admin button.bdh-button
{  background:#333;
  color:#ddd;

}
.wp-admin button.bdh-button.bdh-icon
{  background:transparent;
  color:#ddd;
}


.bdh-button:hover,
.bdh-button:focus,
a.bdh-button:hover,
a.bdh-button:focus,
button.bdh-button:hover,
button.bdh-button:focus
{ outline-style: none;
  box-shadow: none;
  color:#000;


}

.wp-admin .bdh-button:hover,
.wp-admin .bdh-button:focus,
.wp-admin a.bdh-button:hover,
.wp-admin a.bdh-button:focus,
.wp-admin button.bdh-button:hover,
.wp-admin button.bdh-button:focus
{ background:#5555;
  color:#fff;

}

.wp-admin .bdh-button.bdh-icon:hover,
.wp-admin .bdh-button.bdh-icon:focus,
.wp-admin a.bdh-button.bdh-icon:hover,
.wp-admin a.bdh-button.bdh-icon:focus,
.wp-admin button.bdh-button.bdh-icon.bdh-icon::hover,
.wp-admin button.bdh-button.bdh-icon:focus
{ background:transparent;
  color:#fff;

}


.wp-admin button.bdh-button,
.dark-mode button.bdh-button
{ color:#fff;
}


.dark-mode button.bdh-button.bdh-icon.active,
.bdh-button.bdh-icon.active>span.material-icons
{ color:#fff;
  opacity:1;
}


.bdh-render-json
{ display:none;
}

.json-formatter-row {
  font-family: monospace;
}
.json-formatter-row,
.json-formatter-row a,
.json-formatter-row a:hover {
  color: black;
  text-decoration: none;
}
.json-formatter-row .json-formatter-row {
  margin-left: 1rem;
}
.json-formatter-row .json-formatter-children.json-formatter-empty {
  opacity: 0.5;
  margin-left: 1rem;
}
.json-formatter-row .json-formatter-children.json-formatter-empty:after {
  display: none;
}
.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-object:after {
  content: "No properties";
}
.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-array:after {
  content: "[]";
}
.json-formatter-row .json-formatter-string,
.json-formatter-row .json-formatter-stringifiable {
  color: green;
  white-space: pre;
  word-wrap: break-word;
}
.json-formatter-row .json-formatter-number {
  color: blue;
}
.json-formatter-row .json-formatter-boolean {
  color: red;
}
.json-formatter-row .json-formatter-null {
  color: #855A00;
}
.json-formatter-row .json-formatter-undefined {
  color: #ca0b69;
}
.json-formatter-row .json-formatter-function {
  color: #FF20ED;
}
.json-formatter-row .json-formatter-date {
  background-color: rgba(0, 0, 0, 0.05);
}
.json-formatter-row .json-formatter-url {
  text-decoration: underline;
  color: blue;
  cursor: pointer;
}
.json-formatter-row .json-formatter-bracket {
  color: blue;
}
.json-formatter-row .json-formatter-key {
  color: #00008B;
  padding-right: 0.2rem;
}
.json-formatter-row .json-formatter-toggler-link {
  cursor: pointer;
}
.json-formatter-row .json-formatter-toggler {
  line-height: 1.2rem;
  font-size: 0.7rem;
  vertical-align: middle;
  opacity: 0.6;
  cursor: pointer;
  padding-right: 0.2rem;
}
.json-formatter-row .json-formatter-toggler:after {
  display: inline-block;
  transition: transform 100ms ease-in;
  content: "►";
}
.json-formatter-row > a > .json-formatter-preview-text {
  opacity: 0;
  transition: opacity 0.15s ease-in;
  font-style: italic;
}
.json-formatter-row:hover > a > .json-formatter-preview-text {
  opacity: 0.6;
}
.json-formatter-row.json-formatter-open > .json-formatter-toggler-link .json-formatter-toggler:after {
  transform: rotate(90deg);
}
.json-formatter-row.json-formatter-open > .json-formatter-children:after {
  display: inline-block;
}
.json-formatter-row.json-formatter-open > a > .json-formatter-preview-text {
  display: none;
}
.json-formatter-row.json-formatter-open.json-formatter-empty:after {
  display: block;
}
.json-formatter-dark.json-formatter-row {
  font-family: monospace;
}
.json-formatter-dark.json-formatter-row,
.json-formatter-dark.json-formatter-row a,
.json-formatter-dark.json-formatter-row a:hover {
  color: white;
  text-decoration: none;
}
.json-formatter-dark.json-formatter-row .json-formatter-row {
  margin-left: 1rem;
}
.json-formatter-dark.json-formatter-row .json-formatter-children.json-formatter-empty {
  opacity: 0.5;
  margin-left: 1rem;
}
.json-formatter-dark.json-formatter-row .json-formatter-children.json-formatter-empty:after {
  display: none;
}
.json-formatter-dark.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-object:after {
  content: "No properties";
}
.json-formatter-dark.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-array:after {
  content: "[]";
}
.json-formatter-dark.json-formatter-row .json-formatter-string,
.json-formatter-dark.json-formatter-row .json-formatter-stringifiable {
  color: #31F031;
  white-space: pre;
  word-wrap: break-word;
}
.json-formatter-dark.json-formatter-row .json-formatter-number {
  color: #66C2FF;
}
.json-formatter-dark.json-formatter-row .json-formatter-boolean {
  color: #EC4242;
}
.json-formatter-dark.json-formatter-row .json-formatter-null {
  color: #EEC97D;
}
.json-formatter-dark.json-formatter-row .json-formatter-undefined {
  color: #ef8fbe;
}
.json-formatter-dark.json-formatter-row .json-formatter-function {
  color: #FD48CB;
}
.json-formatter-dark.json-formatter-row .json-formatter-date {
  background-color: rgba(255, 255, 255, 0.05);
}
.json-formatter-dark.json-formatter-row .json-formatter-url {
  text-decoration: underline;
  color: #027BFF;
  cursor: pointer;
}
.json-formatter-dark.json-formatter-row .json-formatter-bracket {
  color: #9494FF;
}
.json-formatter-dark.json-formatter-row .json-formatter-key {
  color: #23A0DB;
  padding-right: 0.2rem;
}
.json-formatter-dark.json-formatter-row .json-formatter-toggler-link {
  cursor: pointer;
}
.json-formatter-dark.json-formatter-row .json-formatter-toggler {
  line-height: 1.2rem;
  font-size: 0.7rem;
  vertical-align: middle;
  opacity: 0.6;
  cursor: pointer;
  padding-right: 0.2rem;
}
.json-formatter-dark.json-formatter-row .json-formatter-toggler:after {
  display: inline-block;
  transition: transform 100ms ease-in;
  content: "►";
}
.json-formatter-dark.json-formatter-row > a > .json-formatter-preview-text {
  opacity: 0;
  transition: opacity 0.15s ease-in;
  font-style: italic;
}
.json-formatter-dark.json-formatter-row:hover > a > .json-formatter-preview-text {
  opacity: 0.6;
}
.json-formatter-dark.json-formatter-row.json-formatter-open > .json-formatter-toggler-link .json-formatter-toggler:after {
  transform: rotate(90deg);
}
.json-formatter-dark.json-formatter-row.json-formatter-open > .json-formatter-children:after {
  display: inline-block;
}
.json-formatter-dark.json-formatter-row.json-formatter-open > a > .json-formatter-preview-text {
  display: none;
}
.json-formatter-dark.json-formatter-row.json-formatter-open.json-formatter-empty:after {
  display: block;
}
