﻿HealthDisplay {
    position: absolute;
    display: flex;
    flex-direction: column;
    height: 170px;
    color: white;
    bottom: 1%;
    left: 3%;
    text-align: left;
    font-family: Roboto;
    font-weight: bold;

    .healthWrapper {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        
        .healthTitle {
            font-size: 20px;
            color: #eaeaea;
            font-weight: bolder;
            opacity: 0.6;
            text-shadow: 0px 1px 3px rgba(56, 55, 55, 0.5);
        }
        
        .healthLabel {
            font-size: 55px;
            text-shadow: 0px 1px 3px rgba(0,0,0,0.5);
        }
        
        .status {
            font-size: 14px;
            color: #8c8c8c;
            font-weight: bolder;
            opacity: 0.6;
            text-shadow: 0px 2px 3px rgba(56, 55, 55, 0.8);
        }
    }

    &.hideHealthDisplay {
        display: none;
    }
}
