
 .content-column .row > * {
/*padding: calc(var(--bs-gutter-x)* 0.1); */
 }
 
 .line-container {
      position: relative;
   /*  height: 100px; */
   min-height: 100px;
      background-color: #f8f9fa;
   padding:10px 0 10px 0;
   margin:0;
       z-index: 1;
    }
	
	a.butt_rem_lvl1 {
	padding: 4px 12px 4px 12px;
border:	3px solid #007abd;
border-radius: 20px;
background-color: #fff;
text-decoration: none;
}


a.butt_rem_lvl1:hover {
background-color: #007abd;	
border:	3px solid #007abd;
color: #fff;
}

a.butt_rem {
padding: 4px 12px 4px 12px;
border:	3px solid #fff;
border-radius: 20px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem:hover {
background-color: #fff;	
border:	3px solid #fff;
background-color: transparent;
color: #fff;
}

.txt_al_cent {
text-align: center;	
padding: 0px;
}
	
	.my-5tp {
	
	}
	
	.brd-lft{
		border-left: 4px solid #6c757d;
		}
		
		
    .line-container::before {
	   
      content: "";
      position: absolute;
      top: 50%;
      left: 0;
      width: 100%;
      height: 4px;
      background-color: #6c757d;
      transform: translateY(-50%);
	  z-index: 0;
    }

    .inner-box {
      position: absolute;
      top: 50%;
      right:0;
      transform: translate(0, -30px);
      background-color: white;
		padding: 1rem 2rem;
		width:90%;
      border: 1px solid #6c757d;
      border-radius: 0.5rem;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
	    z-index: 1;
    }
	


.n_pd_lft_rght {
	padding-left: 0px;
	padding-right: 0px;
}


	
	.hold_box
	{
	  position: relative;
	 background-color: white;
     padding: 1rem 2rem;
      border: 1px solid #6c757d;
      border-radius: 0.5rem;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
	  z-index: 2;
    }
	
	
	
	.hold_box_7
	{
	  position: relative;
	 background-color: white;
     padding: 1rem 0rem;
      border: 1px solid #6c757d;
      border-radius: 0.5rem;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
	  z-index: 2;
    }
	
	
	.pad_7_dsc {
	padding: 0.4rem 0.4rem;
	}
	
	
	
	/* 50% height on left hand column */
	
	
	.fif_line {
  position: relative;
}

.fif_line:after {
  content: '';
  position: absolute;
  left: 0px;
  top: 0;
  height: 50%;
  border-left: 4px solid #0000CC;
}

/* Main Vertical line */

.hun_line {
  position: relative;
  border-left: 4px solid #0000CC;
}
	
	
.hun_line:last-child
{
  position: relative;
  border-left: none;
}	


.hun_line:last-child::after 
{
  content: '';
  position: absolute;
  left: 0px;
  top: 0;
  height: 50%;
  border-left: 4px solid #0000CC;
      z-index: 1;
}	
		
	
.center-line .bt_bott_line
{
  border-bottom: 4px solid #000;
}



	
.row_line .bt_line
{
  border-top: 4px solid #ff0000;
}	

/*.row_line div:nth-last-child()*/

/*
.row_line .bt_line:last-child {
   border-color: #00b40d;
}	
*/


.row_line .bt_line:last-child {
  position: relative;
  border-bottom: none;
}

.row_line .bt_line:last-child:after {
 content: '';
  position: absolute;
  left: 0px;
  top: 0;

  width: 4px;               /* the exact width you want */
  height: 4px;              /* thickness of the bottom border */
  background-color: #00b40d;   /* the border color */
  margin: 0 auto;           /* centers the line horizontally */  
  top: 0;
  left: 0;
}	
	
	

.nested .nstbx:last-child {
padding-left:0;
}



/* Center Line */


.hun_cent_line {
	position: relative;
    /* padding-top: 12px; */
	 float:left;
}


.hun_cent_line::after {
  content: "";
  position: absolute;
  top: 0;            /* matches the padding-top */
  left: 50%;
  width: 4px;
  background-color: black; /* or any color you like */
  transform: translateX(-50%);
  }



.pd_tp_bx {
	padding-top: 4px;
}




.center-line {
  position: relative;
     padding-top: 12px;
}


.center-line::after {
  content: "";
  position: absolute;
  top: 0;            /* matches the padding-top */
  bottom: 12px;
  left: 50%;
  width: 4px;

height: 100%;
  background-color: black; /* or any color you like */
  transform: translateX(-50%);
  }





.hb-bott {
  position: relative;
}


/*.hb-bott:nth-child(0)::after { */
.hb-bott::after {
 content: "";
  position: absolute;
  bottom: 0;
  left:0;              /* Start at the middle */
  width: 100%;           /* Cover the right half */
  height: 4px;             /* Thickness of the border */
  background-color: black; /* Adjust the color as needed */
}


.hb-bott:first-child::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: calc(50% - 2px);              /* Start at the middle */
  width: calc(50% + 2px);           /* Cover the right half */
  height: 4px;             /* Thickness of the border */
  background-color: black; /* Adjust the color as needed */
}


.hb-bott:last-child::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: calc(50% - 2px);              /* Start at the middle */
  width: calc(50% + 2px);           /* Cover the right half */
  height: 4px;             /* Thickness of the border */
  background-color: black; /* Adjust the color as needed */
}


.row {
	margin-left: 0;
	margin-right: 0;
}

.pd_r_0 {
	padding-right: 0px;
}

/* Thumb Sizes */
	
	
.algn_px {
text-align:center;
}

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
   
}
	
.tb_sz_lv1 {width: 100%; border: 1px solid #fff;}
.tb_sz_lv2 {width: 100%; border: 1px solid #fff;}
.tb_sz_lv3 {width: 100%; border: 1px solid #fff;}


.rem_mg_tp_7 {
margin-top: 12px;	
}



/* EXTRA SMALL sm */
@media (max-width: 576px) {

	.cent_align { text-align: center; background: none;	}
	.tb_sz_one { width:100px; }	
	.tb_sz { width:180px;	}	
	
	/* 3 instances */
	.tb_sz_three { width:72px; }
	.nm_ttl_three {font-size: 0.9rem !important; text-align: center;  padding: 0 !important;    margin: 0 !important;}
	.nm_dsc_three {font-size: 0.7rem !important; text-align: center;     padding: 0 !important;  margin: 0 !important;}
	
	/* 4 instances */
	.tb_sz_four { width:72px; }
	.nm_ttl_four {font-size: 0.9rem !important; text-align: center;  padding: 0 !important;    margin: 0 !important;}
	.nm_dsc_four {font-size: 0.7rem !important; text-align: center;     padding: 0 !important;  margin: 0 !important;}
	
	
	/* 7 instances */
	.tb_sz_sev { width:46px; }
	.nm_ttl_sev {font-size: 0.6rem !important; text-align: center;  padding: 0 !important;    margin: 0 !important;}
	.nm_dsc_sev {font-size: 0.4rem !important; text-align: center;     padding: 0 !important;  margin: 0 !important;}
	


a.butt_rem_7 {
padding: 2px 3px 2px 4px;
border:	1px solid #fff;
font-size: 12px;
border-radius: 10px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem_7:hover {
background-color: #fff;	
border:	3px solid #fff;
background-color: transparent;
color: #fff;
}



a.butt_rem_3 {
padding: 2px 3px 2px 4px;
border:	1px solid #fff;
font-size: 12px;
border-radius: 10px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem_3:hover {
background-color: #fff;	
border:	3px solid #fff;
background-color: transparent;
color: #fff;
}








.rc1 {
 padding: 10px 4px;
}

.rc3 {
 padding: 10px 4px;
}



a.butt_rem_3 {
margin-top: 6px;
padding: 4px 12px;
border:	1px solid #fff;
font-size: 14px;
border-radius: 14px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem_4 {
margin-top: 6px;
padding: 4px 12px;
border:	1px solid #fff;
font-size: 14px;
border-radius: 14px;
background-color: #fff;
text-decoration: none;
}

	
}

/* SMALL sm */
@media (min-width: 576px) {
		.cent_align { text-align: center; background: none;	}
	.tb_sz_one {width:108px;}	
	.tb_sz {width:80px;}
	
	/* 3 instances */
	.tb_sz_three {width:104px;}
	.nm_ttl_three {font-size: 1.2rem !important; text-align: center; }
	.nm_dsc_three {font-size: 0.8rem !important; text-align: center; }
	
	
	/* 4 instances */
	.tb_sz_four {width:72px;}
	.nm_ttl_four {font-size: 1.2rem !important; text-align: center; }
	.nm_dsc_four {font-size: 0.8rem !important; text-align: center; }


/* 7 instances */
	.tb_sz_sev { width:38px; }
	.nm_ttl_sev {font-size: 0.65rem !important; text-align: center;  padding: 0 !important;    margin: 0 !important;}
	.nm_dsc_sev {font-size: 0.5rem !important; text-align: center;     padding: 0 !important;  margin: 0 !important;}
	



a.butt_rem_7 {
padding: 2px 3px 2px 4px;
border:	1px solid #fff;
font-size: 12px;
border-radius: 10px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem_7:hover {
background-color: #fff;	
border:	3px solid #fff;
background-color: transparent;
color: #fff;
}



a.butt_rem_3 {
padding: 3px 6px;
border:	1px solid #fff;
font-size: 14px;
border-radius: 12px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem_3:hover {
background-color: #fff;	
border:	3px solid #fff;
background-color: transparent;
color: #fff;
}


a.butt_rem_4 {
padding: 3px 6px;
border:	1px solid #fff;
font-size: 14px;
border-radius: 12px;
background-color: #fff;
text-decoration: none;
}





.rc1 {
	padding: 12px 8px;
}

.rc3 {
 padding: 10px 4px;
}

.rc4 {
 padding: 10px 4px;
}


}	
/* MEDIUM md */
@media (min-width: 768px) {
		.cent_align { text-align: center; background: none;	}

.tb_sz_one {width:110px;}

.tb_sz {width: 96px;}

/* 3 instances */
.tb_sz_three {width:90px;}
	.nm_ttl_three {font-size: 1.2rem !important; text-align: center; }
	.nm_dsc_three {font-size: 0.8rem !important; text-align: center; }

/* 4 instances */
	.tb_sz_four {width:80px;}
	.nm_ttl_four {font-size: 1.2rem !important; text-align: center; }
	.nm_dsc_four {font-size: 0.8rem !important; text-align: center; }

/* 7 instances */
	.tb_sz_sev { width:46px; }
	.nm_ttl_sev {font-size: 0.9rem !important; text-align: center;  padding: 0 !important;    margin: 0 !important;}
	.nm_dsc_sev {font-size: 0.62rem !important; text-align: center;     padding: 0 !important;  margin: 0 !important;}


a.butt_rem_7 {
padding: 4px 8px 4px 8px;
border:	1px solid #fff;
font-size: 14px;
border-radius: 16px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem_7:hover {
background-color: #fff;	
border:	3px solid #fff;
background-color: transparent;
color: #fff;
}



a.butt_rem_3 {
padding: 4px 10px;
border:	1px solid #fff;
font-size: 13px;
border-radius: 13px;
background-color: #fff;
text-decoration: none;
}

a.butt_rem_3:hover {
background-color: #fff;	
border:	3px solid #fff;
background-color: transparent;
color: #fff;
}


.rc1 {
	padding: 10px 4px;
}
	
.rc3 {
 padding: 10px 4px;
}

.rc4 {
 padding: 10px 4px;
}


a.butt_rem_4 {
padding: 4px 8px;
border:	1px solid #fff;
font-size: 14px;
border-radius: 15px;
background-color: #fff;
text-decoration: none;
}



}	

@media (min-width: 992px) {
	.cent_align { text-align: center; background: none;	}
.tb_sz_one { width: 90px; margin: 0;}
.sngl_bk {padding: 12px 15px; }
.tb_sz { width: 100%; margin: 0;}

/* 3 instances */
.tb_sz_three { width:90px;}
	.nm_ttl_three {font-size: 1.2rem !important; text-align: center; }
	.nm_dsc_three {font-size: 0.8rem !important; text-align: center; }

/* 4 instances */
.tb_sz_four { width:110px;}
	.nm_ttl_four {font-size: 1.2rem !important; text-align: center; }
	.nm_dsc_four {font-size: 0.8rem !important; text-align: center; }


/* 7 instances */
	.tb_sz_sev { width:68px; }
	.nm_ttl_sev {font-size: 0.82rem !important; text-align: center;  padding: 0 !important;    margin: 0 !important;}
	.nm_dsc_sev {font-size: 0.69rem !important; text-align: center;     padding: 0 !important;  margin: 0 !important;}



}	
	
	
.col_bck {
color: #ffffff;
background-color: #893c00;
}	

.fs-7 {
    font-size: 0.75rem !important;
}

.fs-8 {
    font-size: 0.50rem !important;
}



/*Column Backgrounds */

.row .col-md-4 .col-md-10 .line-container .hold_box:nth-child(2) {
  background-color: red;
}


.col_back_grn .col_bck
{
background-color: green;
}

.col_back_red .col_bck
{
background-color: red;
}

/* TIER LEVELS BACKGROUND COLOUR */


.t0back {
background-color: #fff;	
color; #fff;
border: 4px solid #007abd;	
}

.tsidback {
background-color: #fff;	
color; #fff;
border: 2px solid #007abd;	
}


.t1back {
background-color: #007abd;
}

.t1back img, .t2back img, .t3back img {
	border: 1px solid #fff;
}


.t1back p, .t2back p, .t3back p{
color: #fff;
}

.t2back {
background-color: #b21e92;	
}

.t2back a {
color: #b21e92;
}


.t3back {
background-color: #3E8356;	
color: #fff;
}


.t3back a {
color: #3E8356;	
}





/* style for columns of 7 */


.c-5 {
flex: 0 0 calc(100% / 5);
max-width: calc(100% / 5);
}

.c-7 {
flex: 0 0 calc(100% / 7);
max-width: calc(100% / 7);
}

/* Debug Code */

  .debug-box {
      background-color: #f0f0f0;
      border: 1px dashed #999;
      text-align: center;
      padding: 20px;
      font-weight: bold;
    }
    #breakpoint-indicator {
      position: fixed;
      bottom: 10px;
      right: 10px;
      background: #212529;
      color: #fff;
      padding: 10px 15px;
      border-radius: 5px;
      font-family: monospace;
      z-index: 9999;
    }