#spotlight-content {
    position: absolute;
    z-index: 2;
    background-position: 0 0;
    background-size: cover;
    border-radius: 100%;
    opacity: 1;
    transition: all 2s;
    transition-timing-function: ease-in;
    overflow: hidden;
}

.progress-meter .background {
    fill: #333333;
}

.progress-meter .foreground {
    fill: #11a6d8;
}

.title {
	font-family: 'Open Sans', sans-serif;
    font-size: 30px;
    text-shadow: 1.5px 1.5px #333333;
}

.imageOverlay {
    opacity: 1;
	transition: 0.2s all;
}

.node .expandGrandchildren {
    fill: #999;
}

.node:hover .expandGrandchildren {
    transform: scale(1.2);
    transition: 0.2s all;
}

text {
    transition: 0.2s all;
}

text.title {
	fill: #000;
	font-weight: bold;
	text-transform: uppercase;
	text-shadow: none;
}

#node-1 text.title {
    font-size: 90px;
    font-weight: 900;
}

.node:hover .imageOverlay {
	transition: none;
    fill: #f8b4b6;
}

.links line {
    stroke-opacity: 5;
}

.mediaButton {
    transform: scale(1);
    transition: all 0.25s ease;
    cursor: pointer;
    background: #fff;
    color: #bdd5de;
    width: 60px;
    height: 59px;
    overflow: hidden;
    border-radius: 100%;
    font-size: 60px;
}

.mediaButton:hover,
.mediaButton:active {
    transform: scale(1.15) translate(0, 20px);
    color: #3f5966;
}
.mediaButtonIcon.fas.fa-external-link-square-alt {
    --transform: translateY(-4px);
}
.mediaButtonIcon.fab.fa-stack-exchange {
    --transform: translate(-3px, -27px);
}

.mediaButtonLoading {
    color: transparent;
    background-image: url(https://beta.tapestry-tool.com/wp-content/uploads/2018/11/loading-eclipse.svg);
    background-color: #666;
    border-radius: 100%;
    margin: 2% 2% 2% 3%;
    width: 94%;
    height: 94%;
    background-size: 98%;
    box-shadow: 0 0 0 2px #666 inset;
}

span {
    background-color: white;
    border-radius: 100%;
}

.lightbox {
    background-color: rgba(0, 0, 0, 0.8);
    overflow: scroll;
    position: fixed;
    display: none;
    opacity: 0;
    z-index: 1;
    bottom: 0;
    right: 0;
    left: 0;
    top: 0;
    transition: all 2s !important;
}

.lightbox-container {
    position: relative;
    max-width: 960px;
    margin: 7% auto;
    display: block;
    height: auto;
    z-index: 10;
}

@media screen and (max-width: 768px) {
    .lightbox-container {
        margin-top: 10%;
    }
}

@media screen and (max-width: 414px) {
    .lightbox-container {
        -webkit-backface-visibility: hidden;
        margin-top: 13%;
    }
}

.lightbox-content {
    -webkit-backface-visibility: hidden;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.7);
}

.lightbox-close {
    text-transform: uppercase;
    background: transparent;
    position: absolute;
    font-weight: 300;
    font-size: 12px;
    display: block;
    border: none;
    color: white;
    top: -22px;
    right: 3%;
}

.video-container {
    padding-bottom: 56.25%;
    position: relative;
    overflow: hidden;
    height: 0;
    -webkit-backface-visibility: hidden;
}

.video-container video,
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    -webkit-backface-visibility: hidden;
}

.video-player {
    width: 960px;
    height: 540px;
    frameborder: 0;
    -webkit-backface-visibility: hidden;
}

@supports (-webkit-appearance:none) {
	.fas.mediaButtonIcon {
		display: grid;
	}
}


