*{
--check:url('data:image/svg+xml,');
--checkBlack:url('data:image/svg+xml,');
--fyveSign:url('data:image/svg+xml,');
--fyveSignBlack:url('data:image/svg+xml,');
--binahSign:url('data:image/svg+xml,');
--Recreation:url('/wp-content/uploads/icons/recreation-icon.svg');
--Shopping:url('/wp-content/uploads/icons/shopping-icon.svg');
--Medical:url('/wp-content/uploads/icons/medical-icon.svg');
--Education:url('/wp-content/uploads/icons/education-icon.svg');
--Transit:url('/wp-content/uploads/icons/transit-icon.svg');
--Airport:url('/wp-content/uploads/icons/airport-icon.svg');
--TrainStation:url('/wp-content/uploads/icons/train-station-icon.svg');
--City:url('/wp-content/uploads/icons/city-icon.svg');
--Logistics:url('/wp-content/uploads/icons/logistics-icon.svg');
}
.blindsScreenNext, .blindsScreenPrev {
background-color: #00000080;
}
.legendTitle img{
height:2.5vh;
}
label img{
height:1.5vh;
}
.mapLegend *{
user-select: none !important;
}
.mapLegend{
display: flex;
flex-direction: column;
}
.mapLegend > div{
pointer-events: all;
position: relative;
width: fit-content;
margin: 2vh 0 0 0;
}
.mapLegend > div:first-child{
margin: 0;
}
.labels label{
display: block;
color:#ffffff50;
min-width: 14vh;
cursor: pointer;
display: flex;
align-items: center;
height: 2.5vh;
margin-bottom: 1vh;
}
.labels{
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.mapLegend .name{
font-weight: bold;
text-transform: uppercase;
margin-bottom: 0.3em;
}
.checkBox{
display: inline-block;
width:2.5vh;
height:2.5vh;
border-radius: 50%;
background-color: black;
margin-right: 0.5em;
margin-top: -0.3em;
position: relative;
box-shadow: 0 0 0 2px #ffffff20;
}
label.active{
color:#ffffffd0;
}
label.active .checkBox::before{
content: "";
width: 50%;
height: 50%;
background-position: center;
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
background-image: var(--check);
display: block;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.mapPinInsideNumber{
display: none;
}
.mapPinInside{
background-position: center;
background-repeat: no-repeat;
background-size: 50%;
}
.fyve-trackrecord .mapPinInside, .fyve-pipeline .mapPinInside{
background-image: var(--fyveSign);
}
.fyve-currentprojects .mapPinInside{
background-image: var(--fyveSignBlack);
}
.binah-trackrecord .mapPinInside, .binah-pipeline .mapPinInside, .binah-currentprojects .mapPinInside{
background-image: var(--binahSign);
}
.mapPin.Transit {
background-image: var(--binahSign);
}
.fyve-trackrecord>div, [data-group='fyve-trackrecord']>div{
background-color: #845D44;
}
.fyve-pipeline>div, [data-group='fyve-pipeline']>div{
background-color: #B18468;
}
.fyve-currentprojects>div, [data-group='fyve-currentprojects']>div{
background-color: #EEDDBE;
}
.fyve-currentprojects>div>div{
color:#000 !important;
}
[data-group='fyve-currentprojects']>div::before{
background-image: var(--checkBlack) !important;
}
.binah-currentprojects>div, [data-group='binah-currentprojects']>div{
background-color: #B8A9A4;
}
.binah-trackrecord>div, [data-group='binah-trackrecord']>div{
background-color: #377D78;
}
.binah-pipeline>div, [data-group='binah-pipeline']>div{
background-color: #6B717A;
}
.Shopping .mapPinInside{
background-image: var(--Shopping);
}
.Recreation .mapPinInside{
background-image: var(--Recreation);
}
.Medical .mapPinInside{
background-image: var(--Medical);
}
.Education .mapPinInside{
background-image: var(--Education);
}
.Transit .mapPinInside{
background-image: var(--Transit);
}
.City .mapPinInside{
background-color: #0264A5;
background-image: var(--City);
}
.Airport .mapPinInside{
background-color: #0264A5;
background-image: var(--Airport);
}
.TrainStation .mapPinInside{
background-color: #0264A5;
background-image: var(--TrainStation);
}
.Logistics .mapPinInside{
background-color: #0264A5;
background-image: var(--Logistics);
}
.hidden{
visibility: hidden;
}
.mapPin{
cursor: default;
}
.mapPin .pinTooltip{
width: max-content;
background-image: none;
}
/*
.mapPin .pinTooltip::before{
content: "";
position: absolute;
left: 50%;
top: 100%;
width: 1px;
height: calc(1.5vh + 2px);
background-color: white;
} */
@keyframes bgCircleSize {
0% {
/* transform: scale(0.9);
opacity: 1; */
box-shadow:0 0 0 1px #ffffff;
}
25% {
/* transform: scale(0.9);
opacity: 1; */
}
100% {
/* transform: scale(2);
opacity: 0; */
box-shadow:0 0 0 10px #ffffff00;
}
}
.mapPin.important{
visibility: visible !important;
display: block !important;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-name: bgCircleSize;
animation-timing-function: ease-out;
}
.mapPin.important .mapPinInside{
background-color: #5941A9 !important;
background-image: var(--fyveSign);
}
/* Popup */
.mapPinContentContainer {
height: 100%;
display: flex;
flex-direction: row;
overflow-y: auto;
}
.mapPinContentImage {
width: 50%;
margin: 0 50px 0 0;
position: relative;
}
.mapPinContentText {
position: relative;
width: 50%;
}
.popupContent {
width: max(70vw, 900px);
max-width: 90vw;
min-height: 70vh;
}
.mapPinContentText .address{
font-size: 1.5em;
background-image: url(/wp-content/uploads/address-icon.svg);
background-position: left;
background-repeat: no-repeat;
background-size: 4vh;
padding-left: 6vh;
}
.mapPinContentText .company.binah, .mapPinContentText .company.fyve{
width:12vh;
height:3vh;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
margin: 3vh 0;
}
.mapPinContentText .company.binah{
background-image: url(/wp-content/uploads/logo-binah-colored.svg);
}
.mapPinContentText .company.fyve{
background-image: url(/wp-content/uploads/logo-fyve-colored.svg);
}
/* Popup */