.fixed-size-container {
    max-width: 1400px;
    margin: 40px auto 0 auto;
    background-color: #FFF;
    padding: 30px 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;

    img {
        width: auto;
        max-width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        border: none;
        line-height: normal;
        vertical-align: middle;
    }
}

.truncate {
  width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fixed-size {
    width: 180px;
    height: 280px;
    background-color: papayawhip;
    color: #000;
    text-align: center;
    font-weight: bold;
    font-size: 1vw;
    margin-bottom: 20px;
}

.results {
    border: 4px solid red;
}

.badge1 {
    position: relative;
}

.badge1[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    top: -10px;
    right: -10px;
    font-size: 14px;
    background: Blue;
    color: white;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 18px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
}

.benchwrap {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
}

.bench {
    border-radius: 10px;
    padding: 6px;
    justify-self: center;

}
.bench a{color:DarkBlue}

.papaya {
    background-color: Papayawhip;
}

.AUS
 {
    background-color: LightYellow;
}

.THA
{
    background-color: LightPink;
}

.USA
 {
    background-color: Thistle;
}

.MYS
 {
    background-color: LightSalmon;
}

.SIN
  {
    background-color: Cyan;
}

.RAS
 {
    background-color: PaleGreen;
}

.ROW
 {
    background-color: Aquamarine;
}

.NZL
 {
    background-color: SkyBlue;
}

.NIG,.NGA
 {
    background-color: Bisque;
}

.RAF,
.EAF
 {
    background-color: MistyRose;
}

.win {
    background-color: Lime;
}

.win1 {
    border-style: solid;
    border-width: 5px;
    border-color: Green;
}

.loss {
    background-color: White;
}

.tie {
    background-color: Gainsboro;
}

#mugshot {
    max-width: 180px;
    height: auto;
    position: relative;
}

/*  #Mobile (Portrait) hide column
================================================== */

/* Note: Design for a width of 320px */

@media all and (max-width: 500px) {
    td.col_h {
        display: none;
        width: 0;
        height: 0;
        opacity: 0;
        visibility: collapse;
    }
}

.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    top: 100%;
    left: 50%;
    margin-left: -60px;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}
