#read-more {
	max-height: 110px; /* Adjust the desired height */
	overflow: hidden;
}

.mrgin {
	margin-top: 20px;
}

.error {
	display: none;
	color: red;
}

.errormsg {
	color: red;
}

.divDisplay {
	display: none;
	color: red;
}

.tab {
	overflow: hidden;
	/* background-color: #f1f1f1; */
	background-color: #ccc;
	border: solid gray;
}

.tab button {
	background-color: inherit;
	float: left;
	border: none;
	/* outline: 0.1px dashed gray; */
	cursor: pointer;
	padding: 10px;
	transition: 0.3s;
	font-size: 17px;
}

.tab button:hover {
	background-color: #ddd;
}

.tab button.active {
	/* background-color: #ccc; */
	background-color: #979797;
	color: white;
}

.tabcontent {
	display: none;
	padding: 6px 12px;
	border: 1px solid #ccc;
	border-top: none;
}

table, table td {
	border: 1px solid #cccccc;
}

td, th {
	text-align: center;
	vertical-align: middle;
}

.field-name-field-quick-links {
	border-right: 1px dashed #3699da;
	border-bottom: 1px dashed #3699da;
	border-left: 1px dashed #3699da;
	border-top: 1px dashed #3699da;
}

.demo {
	border: 2px solid #3699da;
}

.demo1 {
	border-right: 2px solid #3699da;
	border-bottom: 2px solid #3699da;
	border-top: 2px solid #3699da;
}

.dottedline {
	border-top: 2px dashed #3699da;
	margin-top: 30px;
}

.read-more-button {
	animation: blink 1s infinite alternate;
	color: yellow;
}

.read-more-button:hover {
	color: yellow;
}

@
keyframes blink { 0% {
	opacity: 2;
}

100%
{
opacity
:
 
0
.5
;

  
}
}
.show-hide {
	color: yellow;
}

.col-divided {
	position: relative;
	height: 50px;
	border: 1px solid #000; /* Just for visualization */
}

.col-divided::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	width: 1px;
	border-left: 2px dotted #ece9e9; /* Set the border to dotted */
	height: 100%;
}

.field field-name-field-quick-link-copy field-type-text-long field-label-hidden dottedline
	{
	margin-bottom: 20px;
}

.upperdiv {
	margin-bottom: 10px;
}

@media ( max-width : 425px) {
	/* Styles for h5 */
	.uptobutton {
		font-size: 17px;
		/* Adjust the font size as needed */
	}
}


/* KPI Card CSS Start */
.kpi-container{
  background: white;
  padding: 0px;
  border-radius: 5px;
  max-width: 1400px;
  margin: 40px auto;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 25px;
  padding-top: 5px;
}

/* CARD */

.kpi-card{
position:relative;
padding:18px;
border-radius:5px;
background:linear-gradient(145deg,#ffffff,#f0f6ff);
box-shadow:0 4px 10px rgba(0,0,0,0.08);
transition:all .3s ease;
height:150px;
border:1px dashed #2967df;
}

.kpi-card:hover{
transform:translateY(-10px) scale(1.03);
box-shadow:0 10px 25px rgba(0,0,0,0.2);
} 

/* TITLE */

.kpi-title{
font-weight:600;
font-size:16px;
color:#0d6efd;
margin-bottom:8px;
}

/* VALUE */

.kpi-value{
font-size:34px;
font-weight:700;
color:#333;
}

/* LINK */

.kpi-link{
color:#28a745;
font-size:14px;
}

/* RIGHT SIDE PILLS */

.zp-box{
position:absolute;
right:12px;
top:65%;
transform:translateY(-50%);
}

.zp-pill{
background:#0d6efd;
color:white;
padding:5px 12px;
border-radius:20px;
font-size:12px;
margin-bottom:3px;
text-align:center;
}

.zp-pill:hover{
	background:blue;
}
.zp-pill a{
color:white;
}
/* NEW BADGE */

.new-badge{
background:red;
color:white;
font-size:10px;
padding:3px 6px;
border-radius:4px;
margin-left:5px;
}

/* PERIOD SELECT */

.period{
text-align:right;
margin-bottom:5px;
}


/*screen lock*/

#lockOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.85);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    color: white;
    font-size: 20px;
}

.hidden {
    display: none;
}

.lockBox {
    text-align: center;
}

/* Loader animation */
.loader {
    border: 6px solid #f3f3f3;
    border-top: 6px solid #00ffcc;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    margin: 0 auto 15px;
}

@keyframes spin {
    100% { transform: rotate(360deg); }
}