/*---------Performance stats box page styling-----------*/

.colour-007297 {
    background-color: #007297;
}

.colour-78b6ca {
    background-color: #78b6ca; 
}

.colour-a1007d {
    background-color: #a1007d;
}

.colour-a1508f {
    background-color: #a1508f;
}

.colour-84344e {
    background-color: #84344e;
}

.colour-855d6a {
    background-color: #855d6a;
}

.colour-e87722 {
    background-color: #e87722; 
}

.colour-e8b187 {
    background-color: #e8b187; 
}

.colour-789904 {
    background-color: #789904; 
}

.colour-899950 {
    background-color: #899950; 
}

.performanceBox {
    padding: 15px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    color: #fff;
    text-align: center;
    margin-bottom: 25px;
    min-height: 242px;
    position: relative;
}

.headlineStat{
    font-size: 2rem;
    margin-top: 10px;
}


.colour-007297 h2,
.colour-007297 p,
.colour-a1007d h2,
.colour-a1007d p,
.colour-a1508f h2,
.colour-a1508f p,
.colour-84344e h2,
.colour-84344e p,
.colour-855d6a h2,
.colour-855d6a p{
    color: #fff;
}

.colour-78b6ca h2,
.colour-78b6ca p,
.colour-78b6ca .fa-solid,
.colour-78b6ca .fa-brands,
.colour-e87722 h2,
.colour-e87722 p,
.colour-e87722 .fa-solid,
.colour-e87722 .fa-brands,
.colour-e8b187 h2,
.colour-e8b187 p,
.colour-e8b187 .fa-solid,
.colour-e8b187 .fa-brands,
.colour-789904 h2,
.colour-789904 p,
.colour-789904 .fa-solid,
.colour-789904 .fa-brands,
.colour-899950 h2,
.colour-899950 p,
.colour-899950 .fa-solid,
.colour-899950 .fa-brands{
    color: #000;
}


.trendBackgroundCircle {
    border-radius: 50%;
    width: 50px;
    text-align: center;
    height: 50px;
    padding: 10px;
    position: absolute;
    right: 10px;
    bottom: 10px;
}

.Good {
    background-color: green;
}

.Bad {
    background-color: red;
}

.performanceBoxesContainer{
    margin-bottom: 25px;
}

/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------Small Tablet View (COL-MD)-------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) {
}


/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------- Tablet View (COL-LG)------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 992px) {

    .trendBackgroundCircle {
        right: -13px;
        bottom: -14px;
    }

}


/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------- Small Desktop View (COL-XL)-----------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1200px) {

}


/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------- Large Desktop View (COL-XXL)----------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1400px) {

}


/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------- Extra Large Desktop View (COL-XXXL)----------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1600px) {
    .headlineStat {
        font-size: 2.25rem;
    }
}


/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------- HD (COL-XXXXL)---------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1920px) {
}