Skip to content
Snippets Groups Projects
App.css 78.2 KiB
Newer Older
  background-size: 20px 20px;
  content: "";
  background-repeat: no-repeat;
  width: 20px; 
  height: 20px;
  padding-right: 30px;
  align-self: center;
}
.problem-error{
  display: inline-flex;
  margin-top: 10px;
  margin-bottom: 10px;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  background-color: var(--offblack);
  border-radius: 10px;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  color: var(--ourbeige);
  padding-left: 30px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}
@media only screen and (max-width: 1023px) {
  .timeline-item-content {
      max-width: 100%;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  }
}

@media only screen and (max-width: 767px) {
  .timeline-item-content,
  .timeline-item:nth-child(odd) .timeline-item-content {
      padding: 15px 10px;
      text-align: center;
      align-items: center;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  }
  
  .timeline-item-content .tag {
      width: calc(100% - 10px);
      text-align: center;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  }
  
  .timeline-item-content time {
      margin-top: 20px;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  }
  
  .timeline-item-content a {
      text-decoration: underline;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  }
  
  .timeline-item-content a::after {
      display: none;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  }
.imageCredit { margin-top: 10px; font-size: 0.85rem }
.imageText { margin-bottom: 10px; font-size: 1rem }
.events{ padding: 10px }
.event { margin-bottom: 20px }

Liliana Sanfilippo's avatar
Liliana Sanfilippo committed


.card-col{
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  flex-basis: 50%;
  flex-grow: 1;
  align-items: flex-end;
}

.img-text{
  margin-bottom:10px;
    font-size:  1rem;
}
.img-credit{
  margin-top: 10px; 
    font-size: 0.85rem;
}
.event{
  position: relative;
  display: flex;
  margin-top: 20px;
}
.img-timeline{
  overflow: hidden;
   object-fit: cover; 
    width: 100%;  
    max-height: 400px; 
}


/*PDF*/
.container_document{
  max-width: 40%;
}
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
.download-butt{
  color: var(--ourbeige) !important;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  display: inline-block;
  height: 50px !important;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
}
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
.download-butt{ /* @media unnötig */
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  background: var(--ourgradient); 
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  padding: 0.5vh !important;
  border-radius: 5px;
  margin: auto !important;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  text-align: center;
  min-width: 5vw !important;
  width: 30vw !important; 
  max-width: 200px !important;
  min-height: 2vh !important;
} 
.download-col{
  display: flex;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  margin-top: 20px !important;
  align-items: center !important;
}
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
.small-i{ /* @media unnötig */
  width: 100%;
  max-width: 1100px !important;
}
.one-pdf-line{ /* @media fertig */
  height: 1450px !important;
}
.two-pdf-line{ /* @media fertig */
  max-height: 650px !important;
  height: 35vh !important;
  max-width: 50%;
/* SHAPES */
.circle {
  display: flex;
  width: 10vw;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  color: var(--ourbeige);
  height: 10vw;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  background-color: var(--text-primary) !important;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  box-shadow: 3px 3px 10px var(--offblack) !important;
  border-radius: 50%;
  margin: 1vw;
} 
.shape-text {
  margin: auto;
  text-align: center;
}


/*collapsible*/ 

.collapse-card {
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  margin-bottom: 20px;
  border-radius: 4px;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  margin-top: 20px;
  color: #333;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  padding: 5px;
  box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
  width: 100%;
  
}


/*boxes*/
.hint-container {
  position:relative;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  transition:background var(--vp-ct)border-color var(--vp-ct),color var(--vp-ct)
}
@media print {
  .hint-container {
    page-break-inside:avoid
  }
}
.hint-container .hint-container-title {
  position:relative;
  font-weight:600;
  line-height:1.25
}
.hint-container.info,
.hint-container.note,
.hint-container.tip,
.hint-container.warning,
.hint-container.danger {
  margin:1rem 0;
  padding:.25rem 1rem;
  border-inline-start-width:.3rem;
  border-inline-start-style:solid;
  border-radius:.5rem;
  color:inherit
}
@media (max-width: 419px) {
  .hint-container.info,
  .hint-container.note,
  .hint-container.tip,
  .hint-container.warning,
  .hint-container.danger {
    margin-inline:-.75rem
  }
}
.hint-container.info .hint-container-title,
.hint-container.note .hint-container-title,
.hint-container.tip .hint-container-title,
.hint-container.warning .hint-container-title,
.hint-container.danger .hint-container-title {
  padding-inline-start:1.75rem
}
@media print {
  .hint-container.info .hint-container-title,
  .hint-container.note .hint-container-title,
  .hint-container.tip .hint-container-title,
  .hint-container.warning .hint-container-title,
  .hint-container.danger .hint-container-title {
    padding-inline-start:0
  }
}
.hint-container.info .hint-container-title:before,
.hint-container.note .hint-container-title:before,
.hint-container.tip .hint-container-title:before,
.hint-container.warning .hint-container-title:before,
.hint-container.danger .hint-container-title:before {
  content:" ";
  position:absolute;
  top:calc(50% - .6125em);
  left:0;
  width:1.25em;
  height:1.25em;
  background-position:left;
  background-repeat:no-repeat
}
@media print {
  .hint-container.info .hint-container-title:before,
  .hint-container.note .hint-container-title:before,
  .hint-container.tip .hint-container-title:before,
  .hint-container.warning .hint-container-title:before,
  .hint-container.danger .hint-container-title:before {
    display:none
  }
}
html[dir=rtl] .hint-container.info .hint-container-title:before,
html[dir=rtl] .hint-container.note .hint-container-title:before,
html[dir=rtl] .hint-container.tip .hint-container-title:before,
html[dir=rtl] .hint-container.warning .hint-container-title:before,
html[dir=rtl] .hint-container.danger .hint-container-title:before {
  right:0;
  left:unset
}
.hint-container.info p,
.hint-container.note p,
.hint-container.tip p,
.hint-container.warning p,
.hint-container.danger p {
  line-height:1.5
}
.hint-container.info a,
.hint-container.note a,
.hint-container.tip a,
.hint-container.warning a,
.hint-container.danger a {
  color:var(--vp-tc)
}
.hint-container.info {
  border-color:var(--info-border-color);
  background:var(--info-bg-color)
}
.hint-container.info>.hint-container-title {
  color:var(--info-title-color)
}
.hint-container.info>.hint-container-title:before {
  background-image:url("https://static.igem.wiki/teams/5247/design/icons/info-filled-small.png")
}
.hint-container.info code {
  background:var(--info-code-bg-color)
}
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
.hint-container.danger {
  border-color:var(--danger-border-color);
  background:var(--danger-bg-color)
}
.hint-container.danger>.hint-container-title {
  color:var(--danger-title-color)
}
.hint-container.danger>.hint-container-title:before {
  background-image:url("")
}
.hint-container.danger code {
  background:var(--danger-code-bg-color)
}
.hint-container.tip {
  border-color:var(--tip-border-color);
  background:var(--tip-bg-color) !important; 
}
.hint-container.tip>.hint-container-title {
  color:var(--tip-title-color)
}
.hint-container.tip>.hint-container-title:before {
  background-image:url("")
}
.hint-container.tip code {
  background:var(--tip-code-bg-color)
}
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
.hint-container.warning {
  border-color:var(--warning-border-color);
  background:var(--warning-bg-color) !important;
}
.hint-container.warning>.hint-container-title {
  color:var(--warning-title-color);
}
.hint-container.warning>.hint-container-title:before {
  background-image:url("")
}
.hint-container.warning code {
  background:var(--warning-code-bg-color)
}

.hint-container.note {
  border-color:var(--note-border-color);
  background:var(--note-bg-color) !important;
}
.hint-container.note>.hint-container-title {
  color:var(--note-title-color);
}
.hint-container.note>.hint-container-title:before {
  background-image:url("")
}
.hint-container.note code {
  background:var(--note-code-bg-color)
}

/*POPUP*/
.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  left: 10%;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* The actual popup */
.popup .popuptext {
  visibility: hidden;
  min-width: 50vw;
  min-height: 20vw;
  background-color: #555;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  color: var(--ourbeige);
  text-align: center;
  border-radius: 6px;
  z-index: 1;
  position: absolute;
  top:0;
  bottom: 0;
  left: 0;
  right: 0;
}

/* Toggle this class - hide and show the popup */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}
.tl-butt img:hover{
  cursor: pointer;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  box-shadow: 3px 3px 10px var(--offblack);
}
/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

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

.tabcontent {
  display: none;
  padding: 6px 12px;
}


/*GALLERY*/
.gall {
  --s: 150px; /* control the size */
  --g: 10px;  /* control the gap */
  display: grid;
  margin: calc(var(--s) + var(--g));
}

.gall > img {
  grid-area: 1/1;
  width: var(--s);
  aspect-ratio: 1.15;
  object-fit: cover;
  clip-path: polygon(25% 0%, 75% 0%, 100% 50%,75% 100%,25% 100%,0 50%);
  transform: translate(var(--_x,0),var(--_y,0)) scale(var(--_t,1));
  cursor: pointer;
  filter: grayscale(80%);
  transition: .2s linear;
}
.gall > img:hover {
  filter: grayscale(0);
  z-index: 1;
  --_t: 1.2;
}

.gall > img:nth-child(1) {--_y: calc(-100% - var(--g))}
.gall > img:nth-child(7) {--_y: calc( 100% + var(--g))}
.gall > img:nth-child(3), .gall > img:nth-child(5) {--_x: calc(-75% - .87*var(--g))}
.gall > img:nth-child(4), .gall > img:nth-child(6) {--_x: calc( 75% + .87*var(--g))}
.gall > img:nth-child(3),.gall > img:nth-child(4) {--_y: calc(-50% - .5*var(--g))}
.gall > img:nth-child(5), .gall > img:nth-child(6) {--_y: calc( 50% + .5*var(--g))}



.wrapper{
	width: 500px;
	height: 100%;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
	background: var(--ourbeige);
	margin: 15px auto 0;
}
.wrapper .tabs_wrap{
	padding: 20px;
	border-bottom: 1px solid #ebedec;
}
.wrapper .tabs_wrap ul{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}
.wrapper .tabs_wrap ul li{
  list-style-type: none;
	width: 135px;
    text-align: center;
    background: #e9ecf1;
    border-right: 1px solid #c1c4c9;
    padding: 13px 15px;
	cursor: pointer;
	-webkit-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.wrapper .tabs_wrap ul li:first-child{
	border-top-left-radius: 25px;
	border-bottom-left-radius: 25px;
}

.wrapper .tabs_wrap ul li:last-child{
	border-right: 0px;
	border-top-right-radius: 25px;
	border-bottom-right-radius: 25px;
}

.wrapper .tabs_wrap ul li:hover,
.wrapper .tabs_wrap ul li.active{
	background: #7fc469;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
	color: var(--ourbeige);
}


.gall-a {
  --s: 200px; /* control the size */
  --g: 8px;   /* control the gap */
  
  display: grid;
  grid: auto-flow var(--s)/repeat(2,var(--s));
  gap: var(--g);
}
.gall-a > span {
  width: 100%; 
  aspect-ratio: 1;
  z-index: 0;
  position: relative;
  transition: .25s,z-index 0s .25s;
  background-color: lightgray;
}
.gall-b:hover{
  background-color: var(--ourbeige);
}
.bg-act{
  background-color: var(--background)!important;
}
.gall-a > span > div > img{
  width: 8rem; 
  position: absolute; 
  cursor: pointer;
}

.gall-a > span:nth-child(1) > div > img{
  bottom: 0.5rem;
  right: 1rem; 
}
.gall-a > span:nth-child(2) > div > img{
  bottom: 0.5rem;
  left  : 1rem;
}
.gall-a > span:nth-child(3) >  div > img{
  top: 0.5rem;
  right: 1rem;
}
.gall-a > span:nth-child(4) > div > img{
  top: 0.5rem;
  left: 1rem;
}

.gall-a > span:nth-child(1){
  clip-path: circle(var(--_c,70% at 70% 70%));
  place-self: start;
}
.gall-a > span:nth-child(2){
  clip-path: circle(var(--_c,70% at 30% 70%));
  place-self: start end;
}
.gall-a > span:nth-child(3){
  clip-path: circle(var(--_c,70% at 70% 30%));
  place-self: end start;
}
.gall-a > span:nth-child(4){
  clip-path: circle(var(--_c,70% at 30% 30%));
  place-self: end;
}

.buffer{
  height: 5vw;
}

.explore{
  position: absolute;
  right: -4vw;
  bottom: 8vw;
  z-index: 1;
  transform: rotate(-35deg);
  font-size: xx-large;
}

.team-container {
  grid-template-columns: 100px 50px 100px;
  grid-template-rows: 80px auto 80px; 
  column-gap: 10px;
  row-gap: 15px;
}

/* TEAM */
.lnp{
  background-image: url("https://static.igem.wiki/teams/5247/scientific-figures/lnp.png");
  height: 12rem;
  width: 12rem;
  background-size: 11.8rem;
  background-repeat: no-repeat;
  background-position: center;
  align-items: center;
}
.lnp > img{
  display: block;
  margin-left: auto;
  margin-right: auto;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  width: 8rem !important;
  max-width: 66% !important;
  transition: all 1s ease;
  border: 5px solid var(--text-primary);
}
.lnp:hover > img{
  display: block;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
  margin-left: none;
  margin-right: none;
  width: 25rem !important;
  max-width: 100% !important;
}

Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
#rnabindingtext:hover, #pegrnatext:hover, #nikasetext:hover, #linkertext:hover,
#PEtext:hover, #stemlooptext:hover, #ribotext:hover
{
  fill: var(--text-primary) !important;
  stroke: var(--text-primary) !important;
  font-size: 17px !important;
}





/* datawrapper */
			.chart.vis-d3-maps-choropleth {
				overflow: hidden;
				position: relative
			}
			
			.chart.vis-d3-maps-choropleth .label-buffer.svelte-u5v6p6,
			.chart.vis-d3-maps-choropleth .label.svelte-u5v6p6 {
				text-anchor: end
			}
			
			.chart.vis-d3-maps-choropleth .rtl .label-buffer.svelte-u5v6p6,
			.chart.vis-d3-maps-choropleth .rtl .label.svelte-u5v6p6 {
				text-anchor: start
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container svg {
				overflow: visible
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container path.view {
				fill: none
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container circle.view {
				stroke: none
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container .graticule {
				fill: none
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container div.label {
				position: absolute;
				text-align: center
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container div.label.outline {
				opacity: .5
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container div.label:not(.outline) span {
				text-shadow: none
			}
			
			.chart.vis-d3-maps-choropleth .legend-container {
				display: flex;
				justify-content: start;
				z-index: 1
			}
			
			.chart.vis-d3-maps-choropleth .legend-container.align-center {
				justify-content: center
			}
			
			.chart.vis-d3-maps-choropleth .legend-container[data-position*=inside] {
				justify-content: start
			}
			
			.chart.vis-d3-maps-choropleth .legend-container.align-center .legend-title {
				text-align: center
			}
			
			.chart.vis-d3-maps-choropleth .legend-container.align-center .category-legend.horizontal {
				display: grid;
				justify-items: center
			}
			
			.chart.vis-d3-maps-choropleth .legend-container.align-center .size-legend[data-title-position=above],
			.chart.vis-d3-maps-choropleth .legend-container.align-center .size-legend[data-title-position=below] {
				align-items: center
			}
			
			.chart.vis-d3-maps-choropleth .legend-combined {
				gap: 10px
			}
			
			@media (max-width:449px) {
				.chart.vis-d3-maps-choropleth .legend-container {
					display: block
				}
			}
			
			.chart.vis-d3-maps-choropleth .map-key.mobile {
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
				background: var(--offblack)0;
				position: static!important
			}
			
			.chart.vis-d3-maps-choropleth .map-key.mobile .legend-categories {
				display: inline-block!important
			}
			
			.chart.vis-d3-maps-choropleth .map-key.mobile .category-legend.horizontal {
				height: auto!important;
				width: auto!important
			}
			
			.chart.vis-d3-maps-choropleth .map-key.mobile .title br {
				display: none
			}
			
			.chart.vis-d3-maps-choropleth .map-key.map-key-mb,
			.chart.vis-d3-maps-choropleth .map-key.map-key-mt,
			.chart.vis-d3-maps-choropleth .map-key.mobile {
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
				background: var(--offblack)0;
				padding: 0;
				position: static!important
			}
			
			.chart.vis-d3-maps-choropleth .map-key.map-key-mb .legend-categories,
			.chart.vis-d3-maps-choropleth .map-key.map-key-mt .legend-categories,
			.chart.vis-d3-maps-choropleth .map-key.mobile .legend-categories {
				display: inline-block!important
			}
			
			.chart.vis-d3-maps-choropleth .map-key.map-key-mb .category-legend.horizontal,
			.chart.vis-d3-maps-choropleth .map-key.map-key-mt .category-legend.horizontal,
			.chart.vis-d3-maps-choropleth .map-key.mobile .category-legend.horizontal {
				height: auto!important;
				width: auto!important
			}
			
			.chart.vis-d3-maps-choropleth .map-key svg {
				display: block
			}
			
			.chart.vis-d3-maps-choropleth .category-legend {
				border-radius: 4px
			}
			
			.chart.vis-d3-maps-choropleth .color-legend {
				border-radius: 0
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip {
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
				background: var(--ourbeige);
				border: 1px solid #f5f5f5;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
				box-shadow: 3px 3px 3px var(--offblack)0001a;
				font-size: 11px;
				max-width: 200px;
				padding: 10px;
				position: absolute;
				visibility: hidden;
				z-index: 100
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip h2 {
				font-size: 13px;
				margin-top: 0
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip table {
				border-spacing: 0;
				color: inherit;
				font-size: inherit;
				font-style: inherit;
				font-variant: inherit;
				font-weight: inherit;
				line-height: inherit;
				text-align: inherit;
				white-space: inherit
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip td,
			.chart.vis-d3-maps-choropleth .dw-tooltip th {
				padding: 0 5px 3px 0;
				text-align: left
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip ol,
			.chart.vis-d3-maps-choropleth .dw-tooltip ul {
				padding-left: 15px
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip ol li,
			.chart.vis-d3-maps-choropleth .dw-tooltip ul li {
				margin-bottom: 2px
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip hr {
				border: 0;
				border-top: 1px solid #777
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip big {
				font-size: 120%
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip small {
				font-size: 95%
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning {
				background-color: #f2dede;
				border: 1px solid #eed3d7;
				border-radius: 4px;
				color: #b94a48;
				font-family: roboto;
				font-weight: 700;
				padding: 8px 35px 8px 14px;
				position: relative;
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
				text-shadow: 0 1px 0 var(--cebitecgray)
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table {
Liliana Sanfilippo's avatar
Liliana Sanfilippo committed
				background: var(--ourbeige);
				border-radius: 1px;
				display: block;
				font-weight: 400;
				margin-top: 10px;
				padding: 1px 4px
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table td {
				padding: 0;
				vertical-align: top
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table td.arrow {
				padding-right: 2px
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
				color: #a7a7a7;
				float: right;
				font-size: 17px;
				height: 17px;
				line-height: 17px;
				transform: translate(7px, -5px);
				width: 17px
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip {
				left: 0;
				padding-right: 20px;
				pointer-events: none;
				top: 0
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip.sticky {
				pointer-events: all
			}
			
			.chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
				color: #d8d8d8;
				cursor: pointer;
				font-size: 14px;
				height: 14px;
				line-height: 14px;
				position: absolute;
				right: 2px;
				text-align: center;
				top: 2px;
				transform: none;
				width: 14px
			}
			
			@media (max-device-width:600px) {
				.chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
					font-size: 17px;
					height: 17px;
					line-height: 17px;
					padding: 4px;
					width: 17px
				}
			}
			
			.chart.vis-d3-maps-choropleth rect.background {
				fill: none;
				pointer-events: all
			}
			
			.chart.vis-d3-maps-choropleth svg.svg-main {
				display: block
			}
			
			.chart.vis-d3-maps-choropleth .label {
				pointer-events: none
			}
			
			.chart.vis-d3-maps-choropleth .map-outer {
				position: relative
			}
			
			.chart.vis-d3-maps-choropleth .annotations,
			.chart.vis-d3-maps-choropleth .map-outer canvas {
				left: 0;
				pointer-events: none;
				position: absolute;
				top: 0
			}
			
			.chart.vis-d3-maps-choropleth .annotations {
				height: 99%;
				width: 100%
			}
			
			.chart.vis-d3-maps-choropleth .d3-maps-zoomed-in .annotations {
				overflow: hidden
			}
			
			.chart.vis-d3-maps-choropleth .editing-annotations .zoom-buttons,
			.chart.vis-d3-maps-choropleth .editing-annotations svg {
				pointer-events: none
			}
			
			.chart.vis-d3-maps-choropleth .legend-container {
				min-height: 10px
			}
			
			.chart.vis-d3-maps-choropleth .inset-map-container {
				opacity: 1;
				pointer-events: none;
				position: absolute;
				transition: opacity .1s ease-in-out
			}
			
			.chart.vis-d3-maps-choropleth .dw-chart-body-content.inset-map-zoom-only:not(.inset-map-show) .inset-map-container {
				opacity: 0
			}
			
			.chart.vis-d3-maps-choropleth path.region {
				fill: #bebcba
			}
			
			.chart.vis-d3-maps-choropleth .lbl-hidden {
				pointer-events: none;
				visibility: hidden
			}
			
			.chart.vis-d3-maps-choropleth path.borders {
				fill: none;
				stroke-linejoin: round;
				stroke-linecap: round;
				pointer-events: none
			}
			
			.static .zoom-buttons {
				display: none
			}
			
			.d3-maps-zoomed-in .annotations {
				overflow: hidden
			}
      body.in-editor,
      .web-component-body.in-editor {
        padding-bottom: 10px
      }
      
      .dw-chart.vis-height-fit {
        overflow: hidden
      }
      
      .chart.dir-rtl .dw-chart-body.svelte-9ysojt {
        direction: rtl
      }
      
      .chart.is-dark-mode .hide-in-dark {
        display: none
      }
      
      .chart:not(.is-dark-mode) .hide-in-light {
        display: none
      }
      
      .chart .sr-only {
        position: absolute;
        left: -9999px;
        height: 1px
      }
      
      .chart.js.svelte-9ysojt .noscript {
        display: none
      }
      
      .chart .hidden,
      .chart .hide {
        display: none
      }
      
      a img {
        border: 0px
      }
      
      b,
      strong {
        font-weight: bold
      }
      
      svg rect {
        shape-rendering: crispEdges
      }
      
      .error {
        background-color: #fbeff2;
        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) inset;
        margin: 2em
      }
      
      .error p {
        color: #b63057;
        font-size: 14px;
        padding: 1.25em 1.5em;
        line-height: 1.5;
        border-color: #cf4870;
        border-style: solid;
        border-width: 0 0 0 4px;
        border-radius: 4px
      }
      
      .dw-chart-body-content.svelte-9ysojt {
        position: relative;
        z-index: 0