.view.stats {
    overflow-y: scroll;
}


.view.stats > .section {
    xheight:100%;
 
    background-color: rgba(0, 0, 0, 0.1);

    border-bottom: 3px solid rgb(99, 99, 99);

    xfont-size:0.9em;
    xoverflow-y: scroll;
}

.view.stats > .section > .title {
    xborder:1px solid grey;
    padding:10px 5px 5px 10px;
    font-size:1.2em;
    font-family: consolas, monospace;
}

.view.stats > .buildings > .list {


    xheight:100%;
    xdisplay:flex;
    xflex-direction: column;
    padding-top: 10px;
    padding-bottom:100px;
 
}

.view.stats > .buildings > .list > .item {
    xborder:1px solid grey;
    position:relative;
    border-radius:5px;
    xpadding: 15px 5px 20px 10px;
    width:95%;
    margin:0px auto 10px auto;
    xbackground-color:rgba(0, 0, 0, 0.3);
    background-color: #121633;
}

.view.stats > .buildings > .list > .item > .image-cont {
    xborder:5px solid red;
    position:absolute;
    xwidth:50px;
    height:100%;
    aspect-ratio: 1/1;
    zz-index:-9;
    right:0;
    display:flex;
    justify-content: end;
    align-items: center;
}

.view.stats > .buildings > .list > .item > .image-cont > .image {
    xborder-left:3px solid rgba(0, 0, 0, 0.5);
    border-radius:0px 5px 5px 0px;
    width:50%;
    height:100%;
    background-position:center;
    background-size:cover;
    xz-index:1;
    opacity:0.5;
    xfilter: brightness(0.5);
    xbox-shadow: inset 5px 0px 5px 0px #121633;
    box-shadow: inset 0px 0px 0px 5px #121633, inset 0px 0px 5px 5px rgba(0, 0, 0, 0);
}

.view.stats > .buildings > .list > .item > .info-cont {
    xborder:1px solid red;
    xz-index:2;
    xcolor:red;
    padding: 15px 5px 20px 10px;
}

.view.stats > .buildings > .list > .item > .info-cont > .row {
    font-family: consolas, monospace;
    display:flex;

}

.view.stats > .buildings > .list > .item > .info-cont > .row.title {
    xbackground-color:green;
    font-size:1.1em;
    margin-bottom:5px;

}

.view.stats > .buildings > .list > .item > .info-cont > .row.identation {
    padding-left: 20px;
    color:grey;
}

.view.stats > .buildings > .list > .item > .info-cont > .row.identation > .label {
    display:inline-block;
    xwidth:150px;
    text-align: right;
    xcolor:red;
    xfont-size:1.5em;
    margin-right:5px;
}

.view.stats > .buildings > .list > .item > .info-cont > .row.identation  > .fa-solid {
   font-size: 0.9em;
   margin-right: 5px;
}

.view.stats > .buildings > .list > .item > .info-cont > .row.identation > .percent {
    
    color:rgb(0, 179, 255);
    margin-right: 10px;
}


.view.stats > .buildings > .list > .item > .info-cont > .row > .amount {
  
  display: inline-block;
  min-width:30px;
  text-align:right;
  margin-right: 5px;
}


.view.stats > .buildings > .list > .item > .info-cont > .row > .name {
    color:rgb(166, 236, 255);
}



.view.stats > .section.tapping  {
    xcolor:rgb(166, 236, 255);
}

.view.stats > .section.tapping > .info {
    padding: 10px;
    color:grey;

    border-radius:5px;
    padding: 15px 5px 20px 15px;
    width:95%;
    margin:0px auto 10px auto;
    background-color:rgba(0, 0, 0, 0.3);
    xfont-size: 0.9em;
    
}

.view.stats > .section.tapping > .info > .row {

    xcolor:rgb(166, 236, 255);
    font-family: consolas, monospace;

}


