@charset "UTF-8";
:root {
--bs-blue : #0d6efd;
--bs-indigo : #6610f2;
--bs-purple : #6f42c1;
--bs-pink : #d63384;
--bs-red : #dc3545;
--bs-orange : #fd7e14;
--bs-yellow : #ffc107;
--bs-green : #198754;
--bs-teal : #20c997;
--bs-cyan : #0dcaf0;
--bs-black : #000;
--bs-white : #fff;
--bs-gray : #6c757d;
--bs-gray-dark : #343a40;
--bs-gray-100 : #f8f9fa;
--bs-gray-200 : #e9ecef;
--bs-gray-300 : #dee2e6;
--bs-gray-400 : #ced4da;
--bs-gray-500 : #adb5bd;
--bs-gray-600 : #6c757d;
--bs-gray-700 : #495057;
--bs-gray-800 : #343a40;
--bs-gray-900 : #212529;
--bs-primary : #0d6efd;
--bs-secondary : #6c757d;
--bs-success : #198754;
--bs-info : #0dcaf0;
--bs-warning : #ffc107;
--bs-danger : #dc3545;
--bs-light : #f8f9fa;
--bs-dark : #212529;
--bs-primary-rgb : 13,110,253;
--bs-secondary-rgb : 108,117,125;
--bs-success-rgb : 25,135,84;
--bs-info-rgb : 13,202,240;
--bs-warning-rgb : 255,193,7;
--bs-danger-rgb : 220,53,69;
--bs-light-rgb : 248,249,250;
--bs-dark-rgb : 33,37,41;
--bs-white-rgb : 255,255,255;
--bs-black-rgb : 0,0,0;
--bs-body-color-rgb : 33,37,41;
--bs-body-bg-rgb : 255,255,255;
--bs-font-sans-serif : system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
--bs-font-monospace : SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
--bs-gradient : linear-gradient(180deg, rgb(255, 255, 255, 0.15), rgb(255, 255, 255, 0));
--bs-body-font-family : var(--bs-font-sans-serif);
--bs-body-font-size : 1rem;
--bs-body-font-weight : 400;
--bs-body-line-height : 1.5;
--bs-body-color : #212529;
--bs-body-bg : #fff;
--bs-border-width : 1px;
--bs-border-style : solid;
--bs-border-color : #dee2e6;
--bs-border-color-translucent : rgb(0, 0, 0, 0.175);
--bs-border-radius : 0.375rem;
--bs-border-radius-sm : 0.25rem;
--bs-border-radius-lg : 0.5rem;
--bs-border-radius-xl : 1rem;
--bs-border-radius-2xl : 2rem;
--bs-border-radius-pill : 50rem;
--bs-link-color : #0d6efd;
--bs-link-hover-color : #0a58ca;
--bs-code-color : #d63384;
--bs-highlight-bg : #fff3cd;
--gbr-dark-blue : #282761;
--gbr-middle-gray : #939393;
--gbr-red : #e31f26;
--gbr-dark-red : #aa1b1f;
--gbr-light-red : #F7ADAD;
--gbr-green : #198754;
--gbr-light-green: #A1FB8E;
--gbr-cor-dark-blue : #002F6C;
--gbr-cor-light-blue : #41B6E6;
--gbr-cor-middle-gray : #808080;
--gbr-cor-red : #C10016;
--gbr-light-blue : #41B6E6;
--gbr-white : #ffffff;
--gbr-black : #000000;
--gbr-dark-gray : #212121;
--gbr-site-background : #ebebeb;
--gbr-light-gray : #f0f0f0;
/*--gbr-font-family : "Montserrat","Patrick Hand";*/
--gbr-font-family : "Open Sans",sans-serif; 

}
*, *::before, *::after {
box-sizing : border-box;
}
@media (prefers-reduced-motion: no-preference) {
:root {
scroll-behavior : smooth;
}
}

h1 {font-family: var(--gbr-font-family);color: var(--gbr-dark-gray);font-size: 28px;}
h2 {font-family: var(--gbr-font-family);color: var(--gbr-dark-gray);font-size: 24px;}
h3 {font-family: var(--gbr-font-family);color: var(--gbr-dark-gray);font-size: 20px;}
h4 {font-family: var(--gbr-font-family);color: var(--gbr-dark-gray);font-size: 16px;}
h5 {font-family: var(--gbr-font-family);color: var(--gbr-dark-gray);font-size: 12px;}
h6 {font-family: var(--gbr-font-family);color: var(--gbr-dark-gray);font-size: 8px;}
p {font-family: var(--gbr-font-family);color: var(--gbr-dark-gray);font-size: 20px;}

body {
  font-family: var(--gbr-font-family); 
  background: var(--gbr-white);
  color: var(--gbr-dark-gray);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased !important;
  border: 0;
  margin: 0;
  padding: 0;
}


.dark-red-text {
color : var(--gbr-dark-red);
}
.uk-dark-blue {
background-color : #282761;
}
.uk-dark-gray {
background-color : #212121;
}
.navbar-brand {
color : var(--gbr-white);
font-size : 24px;
font-weight: 700;
margin-left : 10px;
font-weight : bold;
font-style : italic;
}
.navbar-brand-cont {
color : var(--gbr-white);
font-size : 24px;
margin-left : 40px;
font-weight : bold;
font-style : italic;
}
.navbar-brand-cont-sm {
color : var(--gbr-white);
font-size : 8px;
margin-left : 40px;
font-weight : bold;
font-style : italic;
}
.navbar-container {
margin-left : 40px;
display : flex;
flex-direction : column;
}
.navbar-container .navbar-brand-cont {
margin : 0;
}
.navbar-container .navbar-brand-cont-sm {
margin : 0;
}
.navbar-container-mobile {
  margin-left : 10px;
  display : flex;
  flex-direction : column;
  }
  
.nav-link {
color : var(--gbr-white);
font-size : 16px;
font-style : italic;
text-decoration : none;
}
.nav-logo img {
height : 50px;
}
.navbar-side {
position : fixed;
border-top : 1px solid var(--gbr-light-blue);
border-right : 2px solid var(--gbr-light-blue);
left : 0;
width : 45px;
height : 100%;
background-color : #282761;
color : var(--gbr-white);
}
.navbar-side ul {
list-style-type : none;
padding : 0;
}
.navbar-side ul li {
color : var(--gbr-white);
text-decoration : none;
display : block;
padding : 10px;
}
.navbar-side ul li a:hover {
background-color : #212121;
}

.navbar-side-label {
    text-align: center;
    font-size: 9px;
    color: #ffffff;
    line-height: 1;
    margin-top: 2px;
    text-decoration: none;
}

.results-banner-label {
    text-align: center;
    font-size: 12px;
    color: #ffffff;
    line-height: 1;
    margin-top: 2px;
    text-decoration: none;
}

.floating-navbar {
  position: fixed;
  bottom: 0%;
  left: 0%;
  background-color: var(--gbr-dark-blue);
  padding: 0px;
  border-radius: 0px;
  z-index: 1000;
}

.event-title-horizontal-row {
  display: flex;
  gap: 25px; /* Space between items */
  align-items: center; /* Align items vertically in the center */
  overflow-x: auto;
  white-space: nowrap;
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox */
}

.event-title-horizontal-row::-webkit-scrollbar {
  display: none;  /* Safari and Chrome */
}

.svg-sq-20px {
  width: 20px;
  height: 20px;
  filter: invert(1);
}

.svg-sq-30px {
  width: 30px;
  height: 30px;
  filter: invert(1);
}

.svg-sq-30px-dark-blue {
  width: 30px;
  height: 30px;
  fill: var(--gbr-dark-blue); /* Use CSS variable for fill color */
}

.svg-sq-30px-gold {
  width: 30px;
  height: 30px;
  fill: var(--gbr-red); /* Use CSS variable for fill color */
}

.svg-sq-30px-no-fill {
  width: 30px;
  height: 30px;
}

.svg-sq-50px {
  width: 50px;
  height: 50px;
  filter: invert(1);
}

.svg-sq-75px {
  width: 75px;
  height: 75px;
  filter: invert(1);
}

.floating-navbar-svg {
  width: 30px;
  height: 30px;
  filter: invert(1);
}

.navbar-side-svg {
  filter: invert(1);    
  width: 100%;
  display: block;
  margin: 0 auto;
}

  
.navbar-side-lined-item {
border-bottom : 1px solid var(--gbr-light-blue);
padding-bottom : 5px;
margin-bottom : 10px;
}


.cookie-container {
position : fixed;
bottom : -100%;
left : 0;
right : 0;
background-color : #212121;
color : var(--gbr-white);
padding : 0 32px;
box-shadow : 0 -2px 16px rgb(33, 33, 33, 0.397);
transition : 400ms;
}
.cookie-container.active {
bottom : 0;
}
.cookie-container a {
color : var(--gbr-white);
}
.cookie-btn {
background : #e31f26;
border : 0;
color : var(--gbr-white);
padding : 12px 48px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
}
.event-title-icons-content {
display : flex;
justify-content : center;
align-items : center;
text-align : center;
}
.rigevvent-title-icon-container {
display : inline-block;
font-size : 48px;
width : 50px;
height : 50px;
color : var(--gbr-white);
background-color : #aa1b1f;
text-align : center;
line-height : 50px;
margin : 5px;
text-align : center;
text-decoration : none;
outline : 1px solid var(--gbr-light-blue);
}

.event-title-icon-container {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 48px;
  width: 50px;
  height: 50px;
  color: var(--gbr-white);
  background-color: #aa1b1f;
  text-align: center;
  text-decoration: none;
  outline: 1px solid var(--gbr-light-blue);
  position: relative; /* Ensure relative positioning */
}

.event-title-icon-container i {
  vertical-align: middle;
  font-size: inherit; /* Ensure icon size matches container font size */
}

.bf-hud-img-circle {
  border-radius: 50%;
  width: 40px; /* Adjust the size as needed */
  height: 40px; /* Adjust the size as needed */
  object-fit: cover;
}
.bf-hud-card-pb-2-custom {
  padding-bottom: 0px;
}

.bf-hud-card {
  margin-bottom: 2px;
  padding-bottom: 0px;
  white-space: nowrap; 
  overflow: hidden; 
  text-overflow: ellipsis;
  font-weight : normal;
}
.bf-hud-card-title {
  border-bottom: 2px solid var(--gbr-dark-gray);
  margin-bottom: 2px;
  white-space: nowrap; 
  overflow: hidden; 
  text-overflow: ellipsis;
  font-weight : bold;
  font-style: italic;
}
.bf-hud-card-section-title {
  padding-bottom: 0px;
  margin-bottom: 0px;
  white-space: nowrap; 
  overflow: hidden; 
  text-overflow: ellipsis;
}
.bf-hud-table {
  border-bottom: 1px solid var(--gbr-light-gray);
  margin-bottom: 10px;
}

.bf-hud-table-no-spacing {
  border-bottom: 1px solid var(--gbr-light-gray);
  margin-bottom: 10px;
  margin-top:1px;
}

.bf-hud-table-no-spacing tr, .bf-hud-table-no-spacing td {
  padding: 0 !important;
  margin: 0 !important;
  border-spacing: 0 !important;
}

.bf-hud-table-stats-row {
  font-family: var(--gbr-font-family);
  color: var(--gbr-dark-gray);
  margin: 0px;
  padding: 0px;
  font-size: 14px;
  white-space: nowrap; 
  overflow: hidden; 
  text-overflow: ellipsis;
  font-weight : normal;
  border: none !important;
}

.bf-hud-table-stats-row-wrap {
  font-family: var(--gbr-font-family);
  color: var(--gbr-dark-gray);
  margin: 0px;
  padding: 0px;
  font-size: 10px;
  font-weight : normal;
  border-bottom: 1px solid var(--gbr-light-gray);
}

.bf-hud-table-events {
  border-bottom: 1px solid var(--gbr-light-gray);
  margin-bottom: 10px;
  margin-top:1px;
}

.bf-hud-table-events tr, .bf-hud-table-events td {
  padding: 10px !important;
  margin: 10px !important;
  border-spacing: 10px !important;
}

.bf-hud-table-events-stats-row-wrap {
  font-family: var(--gbr-font-family);
  color: var(--gbr-dark-gray);
  margin: 0px;
  padding: 0px;
  font-size: 14px;
  font-weight : normal;
  border-bottom: 1px solid var(--gbr-light-gray);
  vertical-align: middle !important;
}



@media (max-width: 576px) {
.event-title-icon-container {
width : 40px;
height : 40px;
font-size : 36px;
}

}
.analysistab {
overflow : hidden;
border : var(--gbr-dark-gray) solid 1px;
background-color : #f0f0f0;
}
.analysistab button {
background-color : inherit;
float : left;
border : none;
outline : none;
cursor : pointer;
padding : 14px 16px;
transition : 0.3s;
color : var(--gbr-black);
}
.analysistab button:hover {
background-color : #939393;
}
.analysistab button.active {
background-color : #e31f26;
color : var(--gbr-white);
}
.analysistabcontent {
display : none;
padding : 6px 12px;
border : var(--gbr-middle-gray) solid 1px;
border-top : none;
}

.gtable-container-stats {
  padding : 0;
  margin : 0;
  width : 100%;
  }
.gtable-stats {
  width : 100%;
  border : var(--gbr-dark-blue) solid 3px;
  border-collapse : collapse;
  }
.gtable-stats thead {
  background-color : #282761;
  font-size : 14px;
  height : 14px;
  color : var(--gbr-white);
  vertical-align : middle;
  text-align : center;
  }
.gtable-stats tbody tr td {
  font-size : 14px;
  height: 14px;
  letter-spacing : 0.35px;
  font-weight : normal;
  color : var(--gbr-dark-blue);
  padding : 8px;
  text-align : center;
  vertical-align : middle;
  border-right : 2px solid;
  }
.gtable-stats tbody tr:nth-child(odd) {
  background-color : #ffffff;
  }

.origtable-container-stats {
  padding : 0 10%;
  margin : 10px auto 0;
  }
        
.table-container-stats {
padding : 0;
margin : 0;
}
.table-stats {
width : 100%;
border : var(--gbr-dark-blue) solid 3px;
border-collapse : collapse;
}
.table-stats thead {
background-color : #282761;
font-size : 14px;
color : var(--gbr-white);
vertical-align : middle;
text-align : center;
}
.table-stats tbody tr td {
font-size : 20px;
letter-spacing : 0.35px;
font-weight : normal;
color : var(--gbr-dark-blue);
padding : 8px;
text-align : center;
vertical-align : middle;
border-right : 2px solid;
}
.table-stats tbody tr:hover td {
background-color : #939393;
}
.table-stats-sm-font {
font-size : 16px !important ;
}
.table-stats-msm-font {
font-size : 10px !important ;
}
.table-stats-vsm-font {
font-size : 8px !important ;
}
.table-stats-vsm-tournament-font {
font-size : 12px !important ;
}
.table-stats tbody tr:nth-child(odd) {
background-color : #ffffff;
}
.table-stats-actions {
color : var(--gbr-dark-blue);
font-size : 22px;
}

.searchtable-stats {
  max-height:400px;  
  overflow-y: scroll; /*:auto*/
  width : 100%;
  border : var(--gbr-dark-blue) solid 3px;
  border-collapse : collapse;
  }

.searchtable-stats thead tr:nth-child(1) th{
  background-color : var(--gbr-dark-blue);
  font-size : 14px;
  color : var(--gbr-white);
  vertical-align : middle;
  text-align : center;
  position: sticky;
  top: 0;
  z-index: 10;
}

.searchtable-stats tbody tr td {
  font-size : 20px;
  letter-spacing : 0.35px;
  font-weight : normal;
  color : var(--gbr-dark-blue);
  padding : 8px;
  text-align : center;
  vertical-align : middle;
  border-right : 2px solid;
  }
.searchtable-stats tbody tr:hover td {
  background-color : #939393;
  }
.searchtable-stats-sm-font {
  font-size : 16px !important ;
  }
.searchtable-stats-msm-font {
  font-size : 10px !important ;
  }
.searchtable-stats-vsm-font {
  font-size : 8px !important ;
  }
.searchtable-stats-vsm-tournament-font {
  font-size : 12px !important ;
  }
.searchtable-stats tbody tr:nth-child(odd) {
  background-color : #ffffff;
  }
.searchtable-stats-actions {
  color : var(--gbr-dark-blue);
  font-size : 22px;
  }
  





.site-background-color {
background-color : #ebebeb;
}
.footer-background-color {
background-color : #000000;
}
.footer-text {
color : var(--gbr-white);
text-align : center;
white-space : nowrap;
display : inline-block;
width : 100%;
}
.first-info {
background-color : #aa1b1f;
}
.first-info-text {
font-style : italic;
color : var(--gbr-white);
font-size : 28px;
font-weight : bold;
margin-left : 10%;
}
.first-info-text-no-margin {
font-style : italic;
color : var(--gbr-white);
font-size : 24px;
}
.first-info-text-small {
font-style : italic;
color : var(--gbr-white);
font-size : 12px;
font-weight : normal;
}
    
.first-info-subtitle {
  font-style : italic;
  color : var(--gbr-white);
  font-size : 16px;
  font-weight : bold;
  }
  
  .first-info-container {
    display: flex;
    justify-content: space-between;
  }
  
.first-info-col2-col1 {
  color : var(--gbr-white);
  font-size : 14px;
  font-weight : normal;
  }

.first-info-col2 {
  margin-left: auto; /* Pushes the element to the right */
  margin-right: 40%; /* Adds a margin of 60% of the width */
  color : var(--gbr-white);
  font-size : 12px;
  font-weight : bold;
}
.info-container {
    border: 1px solid white; /* White border */
    border-radius: 10px; /* Rounded edges */
    padding: 10px; /* Optional: Add some padding inside the container */
  }
  

  .home-tourney-card {
    height: 500px;
    overflow-y: auto; /* Show vertical scrollbar when needed */
    position: relative;
}


  .home-scrollable-card {
    height: 500px;
    overflow: hidden; /* Hide the scrollbar */
    position: relative;
}

.home-scrollable-card-body {
    height: calc(100% - 50px); /* Adjust based on the header height */
    overflow-y: auto; /* Enable scrolling */
    padding-right: 17px; /* Adjust for scrollbar width */
    box-sizing: content-box; /* Ensure padding does not affect width */
    scroll-behavior: smooth; /* Enable smooth scrolling */
}
.home-scrollable-card-body::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.home-scrollable-card-body {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

.athlete-img-circle {
  filter: brightness(0) invert(1); /* Change image color to white */
  min-width: 100px;
  min-height: 100px;
  max-width: 150px;
  max-height: 150px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.athlete-image-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%; /* Adjust as needed */
  border: 1px solid var(--gbr-white); /* White border */
  border-radius: 10px; /* Rounded edges */
}
.athlete-image-container-no-border {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%; /* Adjust as needed */
}

.main-content {
  margin: 0px 0px 0px 0px; /* Default margin for small screens */
}
@media (min-width: 768px) {
  .main-content {
    margin: 0px 0px 0px 45px; /* Margin for medium and larger screens */
  }
}

.main-nav-content {
margin-left : 45px;
padding : 0;
}
.card-text-home-h {
font-size : 28px;
font-weight: normal;
color : var(--gbr-white);
}
.uk-btn-red {
background : #e31f26;
border : var(--gbr-red) solid 2px;
color : var(--gbr-white);
padding : 12px 48px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
}
.uk-btn-red:hover {
background-color : #212121;
color : var(--gbr-white);
}
.uk-btn-dark-blue {
background : #282761;
width : 15%;
border : 0;
color : var(--gbr-white);
padding : 12px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
}
.uk-btn-dark-blue:hover {
background-color : #212121;
color : var(--gbr-white);
}
.uk-btn-white {
background : #ffffff;
border : 0;
color : var(--gbr-black);
padding : 12px 48px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
}
.uk-btn-white:hover {
background-color : #212121;
color : var(--gbr-white);
}
.uk-btn-light-blue {
background : #41B6E6;
border : 0;
color : var(--gbr-black);
padding : 12px 48px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
}
.uk-btn-light-blue:hover {
background-color : #282761;
color : var(--gbr-white);
}
.uk-btn-middle-gray {
background : #939393;
border : 0;
color : var(--gbr-black);
padding : 12px 48px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
}
.uk-btn-middle-gray:hover {
background-color : #212121;
color : var(--gbr-white);
}
.btn-check {
display : none;
}
.uk-search-radio-btn {
background : #282761;
border : var(--gbr-white) solid 2px;
color : var(--gbr-white);
padding : 12px 48px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
display : inline-block;
text-align : center;
width : 100%;
}
.uk-search-radio-btn:hover {
background-color : #41B6E6;
color : var(--gbr-white);
}
.btn-check:checked + .uk-search-radio-btn {
background-color : #41B6E6;
color : var(--gbr-white);
}
.uk-sssearch-btn-light-blue {
background : #282761;
border : var(--gbr-white) solid 2px;
color : var(--gbr-white);
padding : 12px 48px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
cursor : pointer;
}
input[type="radio"]:checked + .uk-sssearch-btn-light-blue {
background-color : #41B6E6;
color : var(--gbr-black);
}
.uk-sssearch-btn-light-blue:hover {
background-color : #e31f26;
border : var(--gbr-white) solid 2px;
color : var(--gbr-white);
}
.addr1-border-color {
border-color : #939393;
border-width : 3px;
}
.addr2-border-color {
border-color : #41B6E6;
border-width : 3px;
}
.dark-blue-box {
background-color : #282761;
padding : 20px;
border-radius : 5px;
}
.tourney-search-box {
background-color : #212121;
padding : 20px;
border-radius : 5px;
}
.tourney-search-box-top-half {
background-color : #ffffff;
padding : 20px;
border-top-left-radius : 5px;
border-top-right-radius : 5px;
}
.tourney-search-box-bottom-half {
background-color : #f0f0f0;
padding : 20px;
border-bottom-left-radius : 5px;
border-bottom-right-radius : 5px;
}
.tourney-search-dropdown {
font-size : 22px;
background : #ffffff;
color : var(--gbr-dark-blue);
border : var(--gbr-dark-blue) solid 2px;
border-radius : 8px;
padding : 0;
margin-bottom : 16px;
width : 100%;
}
.tourney-search-dropdown:hover {
background-color : #282761;
color : var(--gbr-white);
}
.tourney-search-input {
background : #f0f0f0;
border : var(--gbr-dark-gray) solid 2px;
color : var(--gbr-dark-gray);
padding : 12px 12px;
font-size : 18px;
margin-bottom : 16px;
border-radius : 8px;
width : 100%;
cursor : pointer;
}
.tourney-search-input:hover {
background-color : #ffffff;
color : var(--gbr-dark-gray);
}
.event-difficulty-temp-gauge {
width : 100%;
height : 20px;
background : linear-gradient(to right, var(--gbr-green), var(--gbr-red));
position : relative;
border-radius : 5px;
overflow : hidden;
}

.event-difficulty-temp-gauge::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--value, 0%);
  width: 5px;
  background: var(--gbr-dark-gray);
}

.wrkevent-difficulty-temp-gauge::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 25%; /* Position at 25% of the width */
  width: 5px;
  background: var(--gbr-dark-gray);
}

  
/* Bracket CSS */
.bb-round-1 {width:100%;margin:0; padding:  0 0 0 0;}
.bb-round-2 {width:100%;margin:0; padding:  0 0 0 0;}
.bb-round-3 {width:100%;margin:0; padding:  0 0 0 0;}
.bb-round-4 {width:100%;margin:0; padding:  0 0 0 0;}
.bb-round-5 {width:100%;margin:0; padding:  0 0 0 0;}
/*bb-matchup controls the space from top of brack (first padding number) and space between brackets (third padding number) */
.bb-matchup-1 {margin: 0 0 0px 0;width: 100%;padding: 0px 0px 150px 0px;height:0px;}
.bb-matchup-2 {margin: 0 0 0px 0;width: 100%;padding: 35px 0px 265px 0px;height:0px;}
.bb-matchup-3 {margin: 0 0 0px 0;width: 100%;padding: 105px 0px 495px 0px;height:0px;}
.bb-matchup-4 {margin: 0 0 0px 0;width: 100%;padding: 250px 0px 950px 0px;height:0px;}
.bb-matchup-5 {margin: 0 0 0px 0;width: 100%;padding: 545px 0px 2000px 0px;height:0px;}
/*warning 2000 could be off */

/*margins in these two control the height of the bracket */
.bb-round-1 .bb-score-comment-top {position: relative; margin-top: 2px; margin-bottom: 0px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-1 .bb-score-comment-top::after {content: ''; position: absolute;top: -10px;bottom: -10px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-1 .bb-score-comment-top h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}
.bb-round-1 .bb-score-comment-mid {position: relative; margin-top: -5px; margin-bottom: -5px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-1 .bb-score-comment-mid::after {content: ''; position: absolute;top: -0px;bottom: -0px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-1 .bb-score-comment-mid h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;display: flex; justify-content: flex-end; width: 100%;}
.bb-round-1 .bb-score-comment-bot {position: relative; margin-top: 0px; margin-bottom: 2px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-1 .bb-score-comment-bot::after {content: ''; position: absolute;top: -10px;bottom: -10px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-1 .bb-score-comment-bot h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}


.bb-round-2 .bb-score-comment {position: relative; margin-top: 45px; margin-bottom: 45px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-2 .bb-score-comment::after {content: ''; position: absolute;top: -45px;bottom: -45px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-2 .bb-score-comment h6 {margin-right: 5px;}

.bb-round-2 .bb-score-comment-top {position: relative; margin-top: 40px; margin-bottom: 0px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-2 .bb-score-comment-top::after {content: ''; position: absolute;top: -40px;bottom: -10px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-2 .bb-score-comment-top h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}
.bb-round-2 .bb-score-comment-mid {position: relative; margin-top: -5px; margin-bottom: -5px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-2 .bb-score-comment-mid::after {content: ''; position: absolute;top: -0px;bottom: -0px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-2 .bb-score-comment-mid h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;display: flex; justify-content: flex-end; width: 100%;}
.bb-round-2 .bb-score-comment-bot {position: relative; margin-top: 0px; margin-bottom: 40px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-2 .bb-score-comment-bot::after {content: ''; position: absolute;top: -10px;bottom: -40px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-2 .bb-score-comment-bot h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}


.bb-round-3 .bb-score-comment {position: relative; margin-top: 120px; margin-bottom: 120px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-3 .bb-score-comment::after {content: ''; position: absolute;top: -120px;bottom: -120px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-3 .bb-score-comment h6 {margin-right: 5px;}

.bb-round-3 .bb-score-comment-top {position: relative; margin-top: 115px; margin-bottom: 0px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-3 .bb-score-comment-top::after {content: ''; position: absolute;top: -115px;bottom: -10px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-3 .bb-score-comment-top h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}
.bb-round-3 .bb-score-comment-mid {position: relative; margin-top: -5px; margin-bottom: -5px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-3 .bb-score-comment-mid::after {content: ''; position: absolute;top: -0px;bottom: -0px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-3 .bb-score-comment-mid h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;display: flex; justify-content: flex-end; width: 100%;}
.bb-round-3 .bb-score-comment-bot {position: relative; margin-top: 0px; margin-bottom: 115px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-3 .bb-score-comment-bot::after {content: ''; position: absolute;top: -10px;bottom: -115px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-3 .bb-score-comment-bot h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}


.bb-round-4 .bb-score-comment {position: relative; margin-top: 270px; margin-bottom: 270px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-4 .bb-score-comment::after {content: ''; position: absolute;top: -270px;bottom: -270px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-4 .bb-score-comment h6 {margin-right: 5px;}

.bb-round-4 .bb-score-comment-top {position: relative; margin-top: 265px; margin-bottom: 0px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-4 .bb-score-comment-top::after {content: ''; position: absolute;top: -265px;bottom: -10px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-4 .bb-score-comment-top h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}
.bb-round-4 .bb-score-comment-mid {position: relative; margin-top: -5px; margin-bottom: -5px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-4 .bb-score-comment-mid::after {content: ''; position: absolute;top: -0px;bottom: -0px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-4 .bb-score-comment-mid h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;display: flex; justify-content: flex-end; width: 100%;}
.bb-round-4 .bb-score-comment-bot {position: relative; margin-top: 0px; margin-bottom: 265px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-4 .bb-score-comment-bot::after {content: ''; position: absolute;top: -10px;bottom: -265px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-4 .bb-score-comment-bot h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}



.bb-round-5 .bb-score-comment {position: relative; margin-top: 570px; margin-bottom: 570px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-5 .bb-score-comment::after {content: ''; position: absolute;top: -570px;bottom: -570px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-5 .bb-score-comment h6 {margin-right: 5px;}

.bb-round-5 .bb-score-comment-top {position: relative; margin-top: 565px; margin-bottom: 0px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-5 .bb-score-comment-top::after {content: ''; position: absolute;top: -565px;bottom: -10px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-5 .bb-score-comment-top h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}
.bb-round-5 .bb-score-comment-mid {position: relative; margin-top: -5px; margin-bottom: -5px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-5 .bb-score-comment-mid::after {content: ''; position: absolute;top: -0px;bottom: -0px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-5 .bb-score-comment-mid h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;display: flex; justify-content: flex-end; width: 100%;}
.bb-round-5 .bb-score-comment-bot {position: relative; margin-top: 0px; margin-bottom: 565px; display: flex; justify-content: flex-end; width: 100%; box-sizing: border-box;}
.bb-round-5 .bb-score-comment-bot::after {content: ''; position: absolute;top: -10px;bottom: -565px;right: 0;width: 3px;background-color: var(--gbr-light-blue);}
.bb-round-5 .bb-score-comment-bot h6 {margin-right: 5px;font-size:8px;height: 8px; min-height: 8px; max-height: 8px;}


/*warning - all 4 must match */

/*bracket text */
.bb-score-row-top {display: flex;justify-content: space-between; margin-left: 0px;margin-right: 0px;position: relative;border-bottom: 3px solid var(--gbr-light-blue);}
.bb-score-row-top h6 {font-size: 16px;color: var(--gbr-dark-gray);margin: 0 5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;text-decoration : none;height: 16px; min-height: 16px; max-height: 16px;}
.bb-score-row-top a {font-size: 16px;color: var(--gbr-dark-gray);margin: 0 5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;text-decoration : none;height: 16px; min-height: 16px; max-height: 16px;}
.bb-score-row-top-second {font-size: 12px;color: var(--gbr-dark-gray);
        text-align: left;margin-left: 10px;  margin-top: 0;margin-bottom: 0;
        padding:0px;  border-right: 3px solid var(--gbr-light-blue); 
        white-space: nowrap; text-overflow: ellipsis;
        height: 12px; min-height: 12px; max-height: 12px;     
      }

.bb-score-row-bottom {display: flex;justify-content: space-between; margin-left: 0px;margin-right: 0px;position: relative;border-bottom: 3px solid var(--gbr-light-blue);border-right: 3px solid var(--gbr-light-blue);}
.bb-score-row-bottom h6 {font-size: 16px;color: var(--gbr-dark-gray);margin: 0 5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;text-decoration : none;height: 16px; min-height: 16px; max-height: 16px;}
.bb-score-row-bottom a {font-size: 16px;color: var(--gbr-dark-gray);margin: 0 5px; white-space: nowrap; text-overflow: ellipsis;text-decoration : none;height: 16px; min-height: 16px; max-height: 16px;}
.bb-score-row-bottom-second {font-size: 12px;color: var(--gbr-dark-gray);text-align: left;margin-left: 10px;  margin-top: 0;margin-bottom: 0;padding:0px; white-space: nowrap; text-overflow: ellipsis;height: 12px; min-height: 12px; max-height: 12px;}

li {list-style-type: none;margin: 0;padding: 0;}
/* End of bracket CSS */