.angular-leaflet-map svg{
    width: initial;
    height: initial;
}

/*----------for Disadled*****************s*/

#coverStation {
    position: absolute;
    height: 100%;
    width: 97%;
    z-index: 4; /* make sure logout_box has a z-index of 2 */
    background-color: #000000;
    opacity: 0.6;
}




/******************FOR LOUDING***********************/
/*
    * Variables
    */
:root {
    --card-padding: 0px;
    --card-height: 100%;
    --card-skeleton: linear-gradient(lightgrey var(--card-height), transparent 0);
    --avatar-size: 32px;
    --avatar-position: var(--card-padding) var(--card-padding);
    --avatar-skeleton: radial-gradient(circle 16px at center, #ffffff 99%, rgba(0, 0, 0, 0) 0%);
    --title-height: 32px;
    --title-width: 200px;
    --title-position: var(--card-padding) 180px;
    --title-skeleton: linear-gradient(white var(--title-height), transparent 0);
    --desc-line-height: 16px;
    --desc-line-skeleton: linear-gradient(white var(--desc-line-height), transparent 0);
    --desc-line-1-width: 230px;
    --desc-line-1-position: var(--card-padding) 242px;
    --desc-line-2-width: 180px;
    --desc-line-2-position: var(--card-padding) 265px;
    --footer-height: 0px;
    --footer-position: 0 calc(var(--card-height) - var(--footer-height));
    --footer-skeleton: linear-gradient(white var(--footer-height), transparent 0);
    --blur-width: 200px;
    --blur-size: var(--blur-width) calc(var(--card-height) - var(--footer-height));
}

/*
 * Card Skeleton for Loading
 */
.cardStation {
    width: 100%;
    height: 585px;
}
.cardStation:empty::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 6px;
    /* box-shadow: 0 10px 45px rgba(0, 0, 0, 0.1); */
    background-image: -webkit-linear-gradient(left, rgba(211, 211, 211, 0) 0, rgba(211, 211, 211, 0.8) 50%, rgba(211, 211, 211, 0) 100%), var(--title-skeleton), var(--desc-line-skeleton), var(--desc-line-skeleton), var(--avatar-skeleton), var(--footer-skeleton), var(--card-skeleton);
    background-image: linear-gradient(90deg, rgba(211, 211, 211, 0) 0, rgba(211, 211, 211, 0.8) 50%, rgba(211, 211, 211, 0) 100%);
    background-size: var(--blur-size), var(--title-width) var(--title-height), var(--desc-line-1-width) var(--desc-line-height), var(--desc-line-2-width) var(--desc-line-height), var(--avatar-size) var(--avatar-size), 100% var(--footer-height), 100% 100%;
    /* background-position: -45% 0, var(--title-position), var(--desc-line-1-position), var(--desc-line-2-position), var(--avatar-position), var(--footer-position), 0 0; */
    background-repeat: no-repeat;
    -webkit-animation: loadingMap 1.0s infinite;
    animation: loadingMap 1.0s infinite;
}

@-webkit-keyframes loadingMap {
    to {
        background-position: 350% 0, var(--title-position), var(--desc-line-1-position), var(--desc-line-2-position), var(--avatar-position), var(--footer-position), 0 0;
    }
}

@keyframes loadingMap {
    to {
        background-position: 350% 0, var(--title-position), var(--desc-line-1-position), var(--desc-line-2-position), var(--avatar-position), var(--footer-position), 0 0;
    }
}