/* reset styles */
html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    width: 100%;
    height: 100%;
    padding: 0;
}
body {
    margin: 0;
    width: 100%;
    height: 100%;
    padding: 0;
}
main {
    display: block;
}
img {
    border-style: none;
}
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.5;
    margin: 0;
}
button,
input {
    overflow: visible;
}
button,
select {
    text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}
legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}
progress {
    vertical-align: baseline;
}
textarea {
    overflow: auto;
}
[type="checkbox"],
[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}
[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}
::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}
details {
    display: block;
}
summary {
    display: list-item;
}
template {
    display: none;
}
/* reset styles */

* {
    --colorRed: #e31e24;
    --expandIcon: url('data:image/svg+xml,<svg enable-background="new 0 0 800 800" version="1.1" viewBox="0 0 800 800" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><path fill="white" d="m609.4 357.1h-5.2c-11.5 0-22.3 2.7-32 7.5-12-23.1-36.1-39-63.9-39h-5.2c-11.1 0-21.6 2.5-31 7-11.6-24.2-36.3-40.9-64.9-40.9h-5.2c-8.4 0-16.5 1.5-24 4.1v-110.2c0-39.6-32.3-71.9-71.9-71.9h-5.2c-39.6 0-71.9 32.3-71.9 71.9v436.7c0 96 78.1 174 174 174h104.2c96 0 174-78.1 174-174v-193.3c0.1-39.7-32.2-71.9-71.8-71.9zm23.9 265.1c0 69.5-56.6 126.1-126.1 126.1h-104.2c-69.5 0-126.1-56.6-126.1-126.1v-436.6c0-13.2 10.8-24 24-24h5.2c13.2 0 24 10.8 24 24v130.2 0.9 113.3c0 13.2 10.7 24 24 24s24-10.7 24-24v-66.4c0-13.2 10.8-24 24-24h5.2c13.2 0 24 10.7 24 23.9v99.6c0 13.2 10.7 24 24 24s24-10.7 24-24v-65.6c0-13.2 10.8-24 24-24h5.2c12.5 0 22.9 9.7 23.9 22v101.2c0 13.2 10.7 24 24 24s24-10.7 24-24v-54.2h0.1v-13.5c0-13.2 10.8-24 24-24h5.2c13.2 0 24 10.8 24 24v193.2zm-329.8-570.5c75.4 0 136.8 61.4 136.8 136.8 0 26.9-7.8 52-21.3 73.2 16.5 2.8 31.7 9.2 44.8 18.4 15.5-27 24.3-58.3 24.3-91.6 0-101.9-82.9-184.8-184.8-184.8s-184.6 82.9-184.6 184.8c0 61.9 30.6 116.8 77.5 150.3v-65.5c-18.5-23.3-29.5-52.8-29.5-84.8 0-75.5 61.4-136.8 136.8-136.8z"/></svg>');
    --collapseIcon: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.31341 7.81901L3.36716 6.76526L9.02091 12.419L3.36716 18.0728L2.31341 17.019L6.91341 12.419L2.31341 7.81901ZM14.9134 12.419L20.5672 6.76526L21.6209 7.81901L17.0209 12.419L21.6209 17.019L20.5672 18.0728L14.9134 12.419Z" fill="%23ffffff"/></svg>');
}
.blur {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.ggskin,
.tippy-content {
    font-family: "Roboto", Helvetica, sans-serif;
    font-size: 1rem;
    font-weight: 300;
}

.buttonPrimary,
.showHideHotspots {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: rgba(255, 255, 255, 0.2) !important;
    border: none !important;
    transition: all 0.3s ease-in-out !important;
    border-radius: 50% !important;
    cursor: pointer !important;
}
.buttonPrimary img {
    pointer-events: none !important;
}
body:not(.mobile) .buttonPrimary:hover {
    background-color: var(--colorRed) !important;
}
body:not(.mobile) .buttonPrimary:hover img {
    filter: invert(100%);
}
.zoomOut {
    border-radius: 0 0 50% 50% !important;
}
.zoomIn {
    border-radius: 50% 50% 0 0 !important;
}
.topGradient {
    opacity: 0.7 !important;
    background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
}
.showHideHotspots {
    border-radius: 25px !important;
}
.switcher {
    border-radius: 50% !important;
    background-color: var(--colorRed) !important;
    border: none !important;
    pointer-events: none !important;
    transition-timing-function: cubic-bezier(0.93, 0.07, 0.12, 0.92) !important;
}
.topButtonsContainer {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}
.topButtonsContainer > div {
    position: relative !important;
    left: 0 !important;
    margin-right: 10px !important;
}
.delay {
    transition-delay: 0.5s !important;
}

/* Loader */
.loaderBlur {
    background-color: rgba(0, 0, 0, 0.1) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    width: max(30%, 400px) !important;
    /* min-width: 400px !important; */
    border: none !important;
    pointer-events: none !important;
    display: flex !important;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.loaderBlur > div {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
}
.loaderLogo {
    max-width: 90% !important;
    margin: 0 auto 30px auto !important;
}
.loaderLogo > img {
    margin: 0 !important;
}
.loaderButton {
    color: black !important;
    /* background-color: white !important; */
    background-color: black !important;
    /* border:solid 2px white !important; */
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
    color: white !important;
    border-radius: 50px !important;
    padding: 15px 25px !important;
    margin: 0 auto !important;
    transition: all 0.3s ease !important;
    margin-top: 50px !important;
    cursor: pointer !important;
}
.loaderButton > div {
    background: none !important;
    pointer-events: none !important;
}
.loaderButton > div {
    border: none !important;
}
.loaderButton:hover {
    background-color: var(--colorRed) !important;
    border-color: var(--colorRed) !important;
    color: white !important;
    box-shadow: none;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.5);
}
@media screen and (max-width: 500px) {
    .loaderBlur {
        width: 100% !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
}
@media screen and (max-height: 400px) {
    .loaderBlur {
        width: 100% !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
    .loaderText {
        /* display: none !important; */
    }
}
/* Loader */

/* Tooltips */
.tippy-content {
    padding: 20px !important;
    text-align: center;
}
/* Tooltips */

/* Hotspot */
.htAni {
    transition: opacity 0.5s ease !important;
}
.hsOpenCircle {
    background-image: var(--expandIcon) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 24px !important;
}
.hsOpenCircleExpanded {
    background-image: var(--expandIcon) !important;
    /* transform: scale(100%) !important; */
}

.nodeCircle,
.rotateToHs,
.hsOpenCircle,
.nodeCircleInterest,
.hotspotCircle {
    transition: all 0.3s ease !important;
}
.nodeCircle,
.nodeCircleInterest {
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
}
.edgeHs .rotateToHs {
    transform: scale(100%) !important;
}
.edgeHs .nodeCircle,
.edgeHs .nodeCircleInterest,
.edgeHs .hotspotCircle,
.edgeHs .hsOpenCircle {
    scale: 0 !important;
}

.animatedHSback {
    width: 100px;
    height: 100px;
    border-radius: 50px;
    pointer-events: none;
    background-color: #ffffff;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-name: bgCircleSize;
    transform-origin: center center;
    animation-timing-function: ease-out;
}
@keyframes bgCircleSize {
    0% {
        transform: scale(0.9);
        opacity: 1;
    }
    25% {
        transform: scale(0.9);
        opacity: 1;
    }
    100% {
        transform: scale(2);
        opacity: 0;
    }
}
.edgeHs .animatedHSback {
    opacity: 0 !important;
    animation: none !important;
    transition: all 1s ease !important;
}
.hiddenHotspot {
    opacity: 0 !important;
}
/* Hotspot */

/* Info  */
.infoContainer {
    max-width: 100% !important;
}
.infoText {
    white-space: normal;
}
.infoText p {
    margin: 1rem 0;
}
.htDescription {
    white-space: normal;
}
.htDescription img {
    width: auto;
    height: auto;
    max-width: 100%;
    /* max-height: 250px; */
    margin: 1rem auto;
    display: block;
}
.htDescription li {
    list-style: square;
}
a {
    color: var(--colorRed);
}
a:link {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
h2 {
    margin: 0;
}
.logo {
    width: 100%;
}
.logo img {
    max-width: 100%;
    height: 3rem;
    width: auto;
    object-fit: contain;
}
/* Info  */

i.new {
    display: block;
    width: 50px;
    height: 50px;
    background: #5fa55a;
    border-radius: 50%;
    position: relative;
    float: right;
}
i.new::before {
    content: "New";
    position: absolute;
    color: white;
    font-style: normal;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.infoText a[href=""] {
    display: none;
}
